/* GigNepalTheme — pages.css: page-specific styles (home, listings, details, profile, module pages). */

/* ===================================================================== */
/* HOME                                                                   */
/* ===================================================================== */
.gnt-hero { position: relative; overflow: hidden; padding: 80px 0 90px; background: linear-gradient(180deg, #fbfbfd 0%, #fff 100%); }
.gnt-hero::before { content: ""; position: absolute; width: 360px; height: 360px; left: -140px; top: -160px; border-radius: 50%; background: rgba(255, 200, 120, .22); }
.gnt-hero::after { content: ""; position: absolute; width: 18px; height: 18px; left: 46%; top: 70px; border-radius: 50%; background: rgba(var(--gnt-primary-rgb), .35); box-shadow: 220px 320px 0 -4px rgba(37, 165, 95, .35), -260px 380px 0 -2px rgba(124, 77, 255, .25); }
.gnt-hero .container { position: relative; z-index: 1; }
.gnt-hero .gnt-eyebrow { font-size: 15px; letter-spacing: .14em; }
html.gnt-public .gnt-hero__title { font-size: 46px; line-height: 1.22; font-weight: 600; margin: 0 0 18px; }
.gnt-hero__title span { color: var(--gnt-primary); }
.gnt-hero__text { font-size: 16px; line-height: 1.8; max-width: 580px; margin: 0 0 30px; }
.gnt-hero__search { position: relative; display: flex; align-items: center; gap: 0; background: #fff; border: 1px solid var(--gnt-border); border-radius: 60px; padding: 6px; box-shadow: 0 18px 50px rgba(16, 24, 40, .08); max-width: 680px; }
.gnt-hero__field { position: relative; flex: 1 1 auto; display: flex; align-items: center; min-width: 0; }
.gnt-hero__field > i { position: absolute; left: 20px; color: #b5b5b5; }
.gnt-hero__field input { width: 100%; border: 0; outline: 0; height: 52px; padding: 0 16px 0 46px; background: transparent; font-size: 15px; color: var(--gnt-dark); border-radius: 60px; }
#header_search_load_spinner { position: absolute; right: 12px; color: var(--gnt-muted); font-size: 13px; }
.gnt-hero__select { position: relative; flex: 0 0 auto; border-left: 1px solid var(--gnt-border); }
.gnt-hero__select select { height: 52px; border: 0; outline: 0; background: transparent; padding: 0 34px 0 18px; font-size: 14px; font-weight: 500; color: var(--gnt-dark); cursor: pointer; -webkit-appearance: none; appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23767676' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
.gnt-hero__search .gnt-btn { border-radius: 60px; height: 52px; }
.gnt-hero__suggest { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 20; background: #fff; border: 1px solid var(--gnt-border); border-radius: var(--gnt-radius-lg); box-shadow: 0 18px 40px rgba(16, 24, 40, .12); max-height: 360px; overflow-y: auto; padding: 8px 0; }
.gnt-hero__suggest:empty { display: none !important; }
.gnt-hero__suggest a { display: block; padding: 8px 18px; color: var(--gnt-dark); font-size: 14px; }
.gnt-hero__suggest a:hover { background: var(--gnt-bg-2); color: var(--gnt-primary); }
.gnt-hero__suggest img { max-width: 32px; border-radius: 4px; margin-right: 8px; }
.gnt-hero__trending { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.gnt-hero__trending > span { font-size: 14px; color: var(--gnt-text); }
.gnt-hero__actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 32px; }
.gnt-hero__play { display: inline-flex; align-items: center; gap: 12px; margin-left: 8px; color: var(--gnt-dark) !important; }
.gnt-hero__play-ico { width: 54px; height: 54px; border-radius: 50%; border: 2px solid var(--gnt-dark); display: inline-flex; align-items: center; justify-content: center; position: relative; }
.gnt-hero__play-ico::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--gnt-dark); }
.gnt-hero__play-ico i { position: relative; z-index: 1; color: #fff; font-size: 13px; margin-left: 2px; }
.gnt-hero__play strong { display: block; font-size: 15px; font-weight: 600; }
.gnt-hero__play small { display: block; font-size: 13px; color: var(--gnt-muted); }
.gnt-hero__art img { width: 100%; height: auto; display: block; animation: gnt-float 7s ease-in-out infinite; }
@keyframes gnt-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .gnt-hero__art img { animation: none; } }
@media (max-width: 991.98px) {
    .gnt-hero { padding: 48px 0 56px; }
    html.gnt-public .gnt-hero__title { font-size: 32px; }
}
@media (max-width: 575.98px) {
    html.gnt-public .gnt-hero__title { font-size: 27px; }
    .gnt-hero__search { flex-wrap: wrap; border-radius: 12px; padding: 8px; gap: 8px; }
    .gnt-hero__field { flex: 1 1 100%; border: 1px solid var(--gnt-border); border-radius: 8px; }
    .gnt-hero__select { flex: 1 1 auto; border: 1px solid var(--gnt-border); border-radius: 8px; }
    .gnt-hero__select select { width: 100%; height: 46px; }
    .gnt-hero__field input { height: 46px; }
    .gnt-hero__search .gnt-btn { border-radius: 8px; height: 48px; flex: 1 1 auto; }
}

/* Partners */
.gnt-partners { background: #f4f4f4; padding: 30px 0; }
.gnt-partners__list { display: flex; align-items: center; justify-content: space-around; flex-wrap: wrap; gap: 28px 40px; list-style: none; margin: 0; padding: 0; }
.gnt-partners__list img { max-height: 44px; max-width: 150px; width: auto; filter: grayscale(1); opacity: .7; transition: filter .3s ease, opacity .3s ease; }
.gnt-partners__list img:hover { filter: none; opacity: 1; }

/* Steps */
.gnt-step { position: relative; height: 100%; padding: 34px 28px 30px; background: #fff; border: 1px solid var(--gnt-border); border-radius: var(--gnt-radius); transition: box-shadow .25s ease, transform .25s ease; }
.gnt-step:hover { box-shadow: var(--gnt-shadow-hover); transform: translateY(-3px); }
.gnt-step__num { position: absolute; top: 18px; right: 22px; font-size: 40px; font-weight: 700; color: #f1f1f1; line-height: 1; }
.gnt-step__icon { width: 62px; height: 62px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--gnt-primary-soft); color: var(--gnt-primary); font-size: 24px; margin-bottom: 18px; }
.gnt-step h3 { font-size: 19px; margin: 0 0 8px; }
.gnt-step p { margin: 0; font-size: 14.5px; }

/* Category cards */
.gnt-cat { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; height: 100%; padding: 24px; color: inherit !important; }
.gnt-cat:hover { border-color: rgba(var(--gnt-primary-rgb), .45); transform: translateY(-3px); }
.gnt-cat__icon { width: 56px; height: 56px; border-radius: 12px; background: var(--gnt-primary-soft); color: var(--gnt-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 10px; overflow: hidden; }
.gnt-cat__icon img { max-width: 32px; max-height: 32px; object-fit: contain; }
.gnt-cat__name { font-size: 17px; font-weight: 600; color: var(--gnt-dark); }
.gnt-cat__count { font-size: 13px; color: var(--gnt-muted); }
.gnt-cat__subs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.gnt-cat__subs .gnt-chip { font-size: 12px; padding: 2px 10px; }

/* Dark CTA band */
.gnt-band { position: relative; overflow: hidden; padding: 110px 0; color: #fff;
    background: var(--gnt-band-img, linear-gradient(120deg, #2b1055 0%, #6a1b5f 50%, #b0124a 100%)) center / cover no-repeat; }
.gnt-band::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(43, 16, 85, .82), rgba(176, 18, 74, .72)); }
.gnt-band::after { content: ""; position: absolute; inset: 0; opacity: .14; background-image: radial-gradient(#fff 1px, transparent 1.4px); background-size: 26px 26px; }
.gnt-band .container { position: relative; z-index: 1; }
.gnt-band .gnt-eyebrow { color: var(--gnt-primary); }
html.gnt-public .gnt-band h2 { color: #fff; font-size: 40px; line-height: 1.4; max-width: 860px; margin: 0 auto 16px; }
.gnt-band p { color: rgba(255, 255, 255, .85) !important; font-size: 18px; max-width: 680px; margin: 0 auto 34px; }
.gnt-band__actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
@media (max-width: 767.98px) { .gnt-band { padding: 70px 0; } html.gnt-public .gnt-band h2 { font-size: 27px; } .gnt-band p { font-size: 15px; } }

/* About + counters */
.gnt-about__eyebrow { display: block; font-size: 15px; color: var(--gnt-text); margin-bottom: 6px; }
html.gnt-public .gnt-about__title { font-size: 32px; margin: 0 0 18px; }
.gnt-about__text { font-size: 15.5px; line-height: 1.9; margin: 0 0 24px; }
html.gnt-public .gnt-about__sub { font-size: 22px; margin: 0 0 16px; }
.gnt-about__points { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 30px; list-style: none; margin: 0 0 30px; padding: 0; }
.gnt-about__points li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--gnt-text); }
.gnt-about__points i { color: var(--gnt-primary); margin-top: 5px; }
.gnt-about__art img { width: 100%; height: auto; }
@media (max-width: 575.98px) { .gnt-about__points { grid-template-columns: 1fr; } }
.gnt-counters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 70px; padding-top: 50px; border-top: 1px solid var(--gnt-border); }
.gnt-counter { display: flex; align-items: center; gap: 18px; padding: 0 20px; border-right: 1px solid var(--gnt-border); }
.gnt-counter:last-child { border-right: 0; }
.gnt-counter__icon { font-size: 40px; color: var(--gnt-primary); line-height: 1; }
.gnt-counter strong { font-size: 38px; font-weight: 600; color: var(--gnt-dark); line-height: 1.1; }
.gnt-counter__plus { font-size: 22px; font-weight: 600; color: var(--gnt-dark); margin-left: 2px; }
.gnt-counter span:not(.gnt-counter__icon):not(.gnt-counter__plus) { display: block; font-size: 15px; color: var(--gnt-text); }
@media (max-width: 991.98px) {
    .gnt-counters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 0; margin-top: 50px; padding-top: 36px; }
    .gnt-counter:nth-child(2n) { border-right: 0; }
}
@media (max-width: 575.98px) {
    .gnt-counter { flex-direction: column; text-align: center; gap: 10px; padding: 0 8px; }
    .gnt-counter strong { font-size: 28px; }
}

/* Most hired (photo cards) */
.gnt-agent { height: 100%; padding: 14px; display: flex; flex-direction: column; }
.gnt-agent__photo { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 2px; background: linear-gradient(135deg, #ffe1e1, #fff4dc); }
.gnt-agent__photo img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.gnt-agent:hover .gnt-agent__photo img { transform: scale(1.05); }
.gnt-agent__initial { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 64px; font-weight: 600; color: rgba(var(--gnt-primary-rgb), .75); }
.gnt-agent__promoted { position: absolute; bottom: 12px; left: 12px; z-index: 2; }
.gnt-agent .gnt-tag-featured { z-index: 2; }
.gnt-agent__body { padding: 16px 6px 2px; flex: 1 1 auto; display: flex; flex-direction: column; }
.gnt-agent__name { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.gnt-agent__name a { color: var(--gnt-primary-text) !important; }
.gnt-agent__name .gnt-verified { color: #c9c9c9; }
html.gnt-public .gnt-agent__title { font-size: 18px; font-weight: 500; margin: 2px 0 4px; line-height: 1.4; }
.gnt-agent__title a { color: var(--gnt-dark); }
.gnt-agent__rate { font-size: 14.5px; margin: 0 0 14px; display: flex; gap: 8px; align-items: center; }
.gnt-agent__rate i { color: #9a9a9a; }
.gnt-agent__meta { list-style: none; margin: auto 0 0; padding: 14px 0 0; border-top: 1px solid var(--gnt-border); display: grid; gap: 10px; }
.gnt-agent__meta li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--gnt-text); }
.gnt-agent__ico { width: 30px; height: 30px; border-radius: 50%; background: #f4f4f4; display: inline-flex; align-items: center; justify-content: center; color: var(--gnt-primary); font-size: 12px; }

/* Tabs */
.gnt-tabs { display: inline-flex; gap: 6px; background: var(--gnt-bg-2); padding: 5px; border-radius: 40px; border: 1px solid var(--gnt-border); }
.gnt-tabs__btn { border: 0; background: transparent; padding: 9px 18px; border-radius: 40px; font-size: 14px; font-weight: 500; color: var(--gnt-text); cursor: pointer; }
.gnt-tabs__btn.is-active { background: var(--gnt-primary); color: #fff; }

/* Testimonials */
.gnt-scroll-nav { display: flex; gap: 10px; }
.gnt-scroll-nav__btn { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--gnt-border-2); background: #fff; color: var(--gnt-dark); cursor: pointer; }
.gnt-scroll-nav__btn:hover { background: var(--gnt-primary); border-color: var(--gnt-primary); color: #fff; }
.gnt-testimonials__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 3); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 18px; scrollbar-width: thin; }
.gnt-testimonials__track > * { scroll-snap-align: start; }
@media (max-width: 991.98px) { .gnt-testimonials__track { grid-auto-columns: calc((100% - 24px) / 2); } }
@media (max-width: 575.98px) { .gnt-testimonials__track { grid-auto-columns: 88%; } }
.gnt-quote { margin: 0; padding: 30px 28px; display: flex; flex-direction: column; gap: 14px; }
.gnt-quote__mark { font-size: 30px; color: rgba(var(--gnt-primary-rgb), .25); }
.gnt-quote blockquote { margin: 0; font-size: 15px; line-height: 1.85; color: var(--gnt-text); flex: 1 1 auto; }
.gnt-quote figcaption { display: flex; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px solid var(--gnt-border); }
.gnt-quote figcaption strong { display: block; font-size: 15px; color: var(--gnt-dark); font-weight: 600; }
.gnt-quote figcaption small { display: block; font-size: 13px; color: var(--gnt-muted); }

/* Blog cards */
.gnt-post { height: 100%; overflow: hidden; display: flex; flex-direction: column; }
.gnt-post__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--gnt-bg); }
.gnt-post__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.gnt-post:hover .gnt-post__img img { transform: scale(1.05); }
.gnt-post__body { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; }
.gnt-post__meta { display: flex; gap: 14px; font-size: 13px; color: var(--gnt-muted); }
.gnt-post__meta span:first-child { color: var(--gnt-primary-text); font-weight: 500; }
html.gnt-public .gnt-post h3 { font-size: 17px; font-weight: 500; line-height: 1.5; margin: 0 0 6px; flex: 1 1 auto; }

/* App promo */
.gnt-app { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 40px 48px; border-radius: 12px; background: linear-gradient(120deg, #fff1f1 0%, #fff8ec 100%); border: 1px solid #ffe0d6; }
html.gnt-public .gnt-app h2 { font-size: 28px; margin: 0 0 6px; }
.gnt-app p { margin: 0; }
.gnt-app__stores { display: flex; gap: 12px; flex-wrap: wrap; }
.gnt-store { display: inline-flex; align-items: center; gap: 10px; background: var(--gnt-dark); color: #fff !important; padding: 10px 18px; border-radius: 8px; }
.gnt-store i { font-size: 26px; }
.gnt-store span { display: flex; flex-direction: column; font-size: 16px; font-weight: 600; line-height: 1.2; }
.gnt-store small { font-size: 11px; font-weight: 400; opacity: .8; }

/* Browse links grid */
.gnt-links { border-top: 1px solid var(--gnt-border); }
html.gnt-public .gnt-links h3 { font-size: 16px; font-weight: 600; margin: 0 0 14px; }
.gnt-links ul { list-style: none; margin: 0 0 10px; padding: 0; }
.gnt-links li { margin-bottom: 8px; }
.gnt-links li a { font-size: 14px; color: var(--gnt-text); }
.gnt-links li a:hover { color: var(--gnt-primary); }
.gnt-links .gnt-link { font-size: 14px; }
.gnt-testimonials__track.is-few { grid-auto-columns: minmax(280px, 420px); justify-content: center; overflow: visible; }

/* ===================================================================== */
/* PROFILE (freelancer / expert / agency)                                 */
/* ===================================================================== */
.gnt-profile-page { background: var(--gnt-bg); padding-bottom: 70px; }
.gnt-cover { position: relative; height: 300px; padding-top: 26px; color: #fff;
    background: var(--gnt-cover-img, radial-gradient(circle at 20% 30%, rgba(var(--gnt-primary-rgb), .55), transparent 45%), radial-gradient(circle at 80% 70%, rgba(255, 179, 71, .45), transparent 50%), linear-gradient(120deg, #2b1055 0%, #7a1a5d 55%, #c2185b 100%)) center / cover no-repeat; }
.gnt-cover::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, .15), rgba(0, 0, 0, .45)); }
.gnt-cover .container { position: relative; z-index: 1; }
.gnt-cover .gnt-breadcrumb { justify-content: flex-start; }
.gnt-profile-wrap { position: relative; z-index: 2; margin-top: -150px; }
.gnt-profile-head { background: #fff; border: 1px solid var(--gnt-border); border-radius: var(--gnt-radius); display: grid; grid-template-columns: 1fr auto; box-shadow: 0 10px 40px rgba(16, 24, 40, .08); margin-bottom: 30px; }
.gnt-profile-head__main { display: flex; gap: 26px; align-items: center; padding: 30px; min-width: 0; }
.gnt-profile-head__avatar { position: relative; flex-shrink: 0; width: 130px; height: 130px; border-radius: 8px; overflow: hidden; background: var(--gnt-primary-soft); }
.gnt-profile-head__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gnt-profile-head__avatar .gnt-initial { width: 100%; height: 100%; font-size: 44px; border-radius: 0; }
.gnt-profile-head__avatar .gnt-online-dot { right: 8px; bottom: 8px; width: 16px; height: 16px; }
.gnt-profile-head__info { min-width: 0; }
.gnt-profile-head__name { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
html.gnt-public .gnt-profile-head__name h1 { font-size: 28px; font-weight: 600; margin: 0; color: var(--gnt-dark); line-height: 1.25; }
.gnt-profile-head__level img { max-height: 28px; width: auto; }
.gnt-profile-head__title { font-size: 17px; color: var(--gnt-dark) !important; margin: 4px 0 12px; }
.gnt-profile-head__meta { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; margin: 0; padding: 0; font-size: 14px; color: var(--gnt-text); }
.gnt-profile-head__meta li { display: inline-flex; align-items: center; gap: 7px; }
.gnt-profile-head__meta i { color: #b5b5b5; }
.gnt-profile-head__meta .gnt-rating i { color: var(--gnt-star); }
.gnt-profile-head__meta li.is-online i, .gnt-side__status.is-online i { color: var(--gnt-success); }
.gnt-profile-head__meta li:last-child i { font-size: 8px; }
.gnt-profile-head__side { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 16px; padding: 30px; text-align: right; }
.gnt-profile-head__rate strong { display: block; font-size: 30px; font-weight: 600; color: var(--gnt-dark); line-height: 1.1; }
.gnt-profile-head__rate span { font-size: 14px; color: var(--gnt-text); }
.gnt-profile-head__cta .gnt-btn { min-width: 150px; }
.gnt-profile-head__owner { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; padding: 0 30px 24px; }
.gnt-profile-head__stats { grid-column: 1 / -1; border: 0; border-top: 1px solid var(--gnt-border); border-radius: 0 0 var(--gnt-radius) var(--gnt-radius); }
.gnt-stat--money { font-size: 22px !important; }
@media (max-width: 767.98px) {
    .gnt-cover { height: 220px; }
    .gnt-profile-wrap { margin-top: -110px; }
    .gnt-profile-head { grid-template-columns: 1fr; }
    .gnt-profile-head__main { flex-direction: column; text-align: center; padding: 24px 20px 10px; }
    .gnt-profile-head__name, .gnt-profile-head__meta { justify-content: center; }
    .gnt-profile-head__side { align-items: center; text-align: center; padding: 10px 20px 24px; }
    .gnt-profile-head__owner { justify-content: center; padding: 0 20px 20px; }
}
.gnt-profile-body .gnt-box { margin-bottom: 30px; }
.gnt-prose { font-size: 15px; line-height: 1.85; color: var(--gnt-text); }
.gnt-prose p:last-child { margin-bottom: 0; }
.gnt-textbtn { background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.gnt-owner-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; border-top: 0 !important; }

.gnt-timeline { position: relative; }
.gnt-timeline__item { position: relative; padding: 0 0 22px 26px; border-left: 2px solid var(--gnt-border); margin-left: 6px; }
.gnt-timeline__item:last-child { padding-bottom: 0; }
.gnt-timeline__item::before { content: ""; position: absolute; left: -8px; top: 4px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--gnt-primary); }
html.gnt-public .gnt-timeline__item h3 { font-size: 16px; font-weight: 600; margin: 0 0 2px; color: var(--gnt-dark); }
.gnt-timeline__item h3 small { font-weight: 400; color: var(--gnt-text); font-size: 14px; }
.gnt-timeline__org { margin: 0; font-size: 14px; color: var(--gnt-dark) !important; }
.gnt-timeline__date { margin: 2px 0 0; font-size: 13px; color: var(--gnt-muted) !important; }
.gnt-timeline__text { margin: 8px 0 0; font-size: 14.5px; }

.gnt-portfolio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 575.98px) { .gnt-portfolio { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gnt-portfolio__item { position: relative; display: block; padding: 0; border: 0; border-radius: var(--gnt-radius); overflow: hidden; aspect-ratio: 4 / 3; background: var(--gnt-bg); cursor: pointer; text-align: left; }
.gnt-portfolio__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.gnt-portfolio__item:hover img { transform: scale(1.06); }
.gnt-portfolio__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 10px; background: linear-gradient(to top, rgba(0, 0, 0, .72), transparent); color: #fff; display: flex; flex-direction: column; }
.gnt-portfolio__cap strong { font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gnt-portfolio__cap small { font-size: 12px; opacity: .8; }

.gnt-review { padding: 20px 0; border-bottom: 1px solid var(--gnt-border); }
.gnt-review:first-of-type { padding-top: 0; }
.gnt-review:last-of-type { border-bottom: 0; }
.gnt-review__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.gnt-review__head strong { display: block; font-size: 15px; color: var(--gnt-dark); font-weight: 600; }
.gnt-review__meta { font-size: 13px; color: var(--gnt-muted); }
html.gnt-public .gnt-review__title { font-size: 15px; font-weight: 500; margin: 0 0 6px; color: var(--gnt-dark); }
.gnt-review__text { margin: 0; font-size: 14.5px; line-height: 1.8; }
.gnt-review__earned { margin: 8px 0 0; font-size: 13px; color: var(--gnt-muted) !important; }
.gnt-review__earned strong { color: var(--gnt-dark); }

.gnt-side .gnt-box { padding: 24px; margin-bottom: 24px; }
.gnt-side__who { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
html.gnt-public .gnt-side__name { font-size: 17px; font-weight: 600; margin: 0 0 2px; color: var(--gnt-dark); }
.gnt-side__status { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--gnt-muted); }
.gnt-side__status i { font-size: 8px; color: #c9c9c9; }
.gnt-side__note { display: flex; align-items: center; gap: 8px; margin: 14px 0 0; font-size: 13px; color: var(--gnt-muted) !important; }
.gnt-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
html.gnt-public .gnt-side .toggle-switch { width: 52px; height: 28px; }
html.gnt-public .gnt-side .toggle-switch .toggle-slider { background: #d6d6d6; border-radius: 28px; }
html.gnt-public .gnt-side .toggle-switch .toggle-slider::before { height: 22px; width: 22px; left: 3px; bottom: 3px; }
html.gnt-public .gnt-side .toggle-switch input:checked + .toggle-slider { background: var(--gnt-success); }
html.gnt-public .gnt-side .toggle-switch input:checked + .toggle-slider::before { transform: translateX(24px); }

/* Profile popups (portfolio details) */
html.gnt-public .gnt-profile-page .popup-overlay { position: fixed; inset: 0; z-index: 1060; background: rgba(15, 16, 20, .55); display: none; }
html.gnt-public .gnt-profile-page .popup-overlay.popup-active { display: block; }
html.gnt-public .gnt-profile-page .popup-fixed { position: fixed; top: 50%; left: 50%; z-index: 1061; width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 40px); overflow-y: auto; transform: translate(-50%, -46%); opacity: 0; visibility: hidden; transition: all .25s ease; }
html.gnt-public .gnt-profile-page .popup-fixed.popup-active { transform: translate(-50%, -50%); opacity: 1; visibility: visible; }
html.gnt-public .gnt-profile-page .popup-contents { position: relative; background: #fff; border-radius: var(--gnt-radius-lg); padding: 26px; box-shadow: 0 30px 80px rgba(0, 0, 0, .25); min-height: 120px; }
html.gnt-public .gnt-profile-page .popup-contents-close { position: absolute; top: 12px; right: 14px; width: 34px; height: 34px; border-radius: 50%; background: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); z-index: 2; }

/* ===================================================================== */
/* DETAIL PAGES (service / job)                                           */
/* ===================================================================== */
.gnt-detail-page { background: var(--gnt-bg); }
.gnt-detail { padding: 50px 0 70px; }
.gnt-detail__seller { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.gnt-detail__seller-link { display: flex; align-items: center; gap: 14px; color: inherit !important; min-width: 0; }
.gnt-detail__seller-link strong { display: block; color: var(--gnt-dark); font-weight: 600; font-size: 16px; }
.gnt-detail__seller-link:hover strong { color: var(--gnt-primary); }
.gnt-detail__seller-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; font-size: 13px; color: var(--gnt-muted); }
.gnt-detail__seller-meta strong { display: inline; font-size: 13px; }
.gnt-detail__seller-actions { display: flex; align-items: center; gap: 10px; }
.gnt-detail__seller-name { font-size: 18px !important; }
html.gnt-public .gnt-detail__sub { font-size: 17px; font-weight: 600; margin: 24px 0 12px; color: var(--gnt-dark); }
.gnt-detail__about-seller { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.gnt-facts--grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.gnt-facts--grid li { padding: 12px 0 !important; }
@media (max-width: 575.98px) { .gnt-facts--grid { grid-template-columns: 1fr; } }

/* Gallery */
.gnt-gallery { position: relative; border-radius: var(--gnt-radius); overflow: hidden; background: #f1f2f4; }
.gnt-gallery__viewport { overflow: hidden; }
.gnt-gallery__track { display: flex; transition: transform .45s ease; }
.gnt-gallery__track .screen-card { flex: 0 0 100%; }
.gnt-gallery__frame { aspect-ratio: 16 / 9; width: 100%; }
.gnt-gallery__frame img, .gnt-gallery__frame video { width: 100%; height: 100%; object-fit: cover; display: block; }
.gnt-gallery__frame--empty { display: flex; align-items: center; justify-content: center; color: var(--gnt-muted); }
.gnt-gallery__nav { position: absolute; top: 50%; z-index: 3; width: 44px; height: 44px; margin-top: -22px; border: 0; border-radius: 50%; background: #fff; color: var(--gnt-dark); box-shadow: 0 6px 18px rgba(0, 0, 0, .15); cursor: pointer; }
.gnt-gallery__nav--prev { left: 14px; } .gnt-gallery__nav--next { right: 14px; }
.gnt-gallery__nav:hover { background: var(--gnt-primary); color: #fff; }
.gnt-gallery__thumbs { display: flex; gap: 10px; overflow-x: auto; padding-top: 12px; }
.gnt-gallery__thumbs .thumbnail { position: relative; flex: 0 0 84px; height: 64px; border-radius: var(--gnt-radius); overflow: hidden; border: 2px solid transparent; cursor: pointer; background: #222; }
.gnt-gallery__thumbs .thumbnail.active { border-color: var(--gnt-primary); }
.gnt-gallery__thumbs img, .gnt-gallery__thumbs video { width: 100%; height: 100%; object-fit: cover; }
.gnt-gallery__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 12px; }

.gnt-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.gnt-checklist li { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; color: var(--gnt-text); }
.gnt-checklist i { color: var(--gnt-success); margin-top: 4px; font-size: 13px; }
.gnt-checklist--sm li { font-size: 14px; }

/* Compare table */
.gnt-box__title--pad { padding: 26px 30px 0; margin-bottom: 18px !important; }
.gnt-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.gnt-table th, .gnt-table td { padding: 14px 18px; border-top: 1px solid var(--gnt-border); text-align: center; color: var(--gnt-dark); }
.gnt-table th[scope=row], .gnt-table thead th:first-child { text-align: left; font-weight: 500; color: var(--gnt-text); }
.gnt-table thead th { background: var(--gnt-bg-2); font-weight: 600; }
.gnt-table thead th span { display: block; }
.gnt-table__price { font-size: 17px; color: var(--gnt-primary-text); }
.gnt-table tbody tr:nth-child(even) { background: #fcfcfd; }
.gnt-table__total td, .gnt-table__total th { font-weight: 600 !important; color: var(--gnt-dark) !important; background: var(--gnt-bg-2); }
.gnt-yes { color: var(--gnt-success); } .gnt-no { color: #c9c9c9; }

/* Order panel */
.gnt-order { padding: 0 !important; overflow: hidden; box-shadow: 0 10px 34px rgba(16, 24, 40, .07); }
.gnt-order__tabs { display: flex; border-bottom: 1px solid var(--gnt-border); }
.gnt-order__tabs .package-tab { flex: 1 1 0; text-align: center; padding: 15px 8px; font-size: 14px; font-weight: 500; color: var(--gnt-text); cursor: pointer; border-bottom: 3px solid transparent; transition: color .2s ease, border-color .2s ease; }
.gnt-order__tabs .package-tab:hover { color: var(--gnt-dark); }
.gnt-order__tabs .package-tab.active { color: var(--gnt-primary-text); border-bottom-color: var(--gnt-primary); background: #fff; }
.gnt-order__body { padding: 24px 26px 26px; }
html.gnt-public .gnt-order__price { font-size: 32px !important; font-weight: 600; color: var(--gnt-dark); line-height: 1.15; }
.gnt-order__was { color: var(--gnt-muted); font-size: 14px; }
.gnt-order__name { margin: 4px 0 16px; font-size: 15px; color: var(--gnt-text); }
.gnt-order__meta { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; margin: 0 0 16px; padding: 0 0 16px; border-bottom: 1px solid var(--gnt-border); font-size: 14px; color: var(--gnt-dark); font-weight: 500; }
.gnt-order__meta i { color: var(--gnt-primary); margin-right: 6px; }
.gnt-order__extras { margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--gnt-border-2); }
.gnt-order__extras p { margin: 0 0 10px; font-size: 14px; font-weight: 600; color: var(--gnt-dark) !important; }
.gnt-order__extra { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 14px; cursor: pointer; }
.gnt-order__extra .form-check-input { margin: 0; flex-shrink: 0; }
.gnt-order__extra span { flex: 1 1 auto; color: var(--gnt-text); }
.gnt-order__extra strong { color: var(--gnt-dark); font-weight: 500; }
.gnt-order__actions { display: grid; gap: 10px; margin-top: 22px; }
.gnt-order__actions form { margin: 0; }
.gnt-order__note { margin: 0; font-size: 14px; padding: 12px 14px; border-radius: var(--gnt-radius); background: var(--gnt-bg-2); display: flex; gap: 8px; }
.gnt-order__safe { display: flex; gap: 8px; align-items: flex-start; margin: 16px 0 0; font-size: 13px; color: var(--gnt-muted) !important; }
.gnt-order__safe i { color: var(--gnt-success); margin-top: 3px; }
.gnt-order__as-client .btn-profile { display: flex; width: 100%; justify-content: center; align-items: center; height: 48px; border-radius: var(--gnt-radius); background: var(--gnt-primary); color: #fff !important; font-weight: 500; }
.gnt-order__as-client form button { height: 48px; border-radius: var(--gnt-radius) !important; padding: 0 !important; }
.gnt-related { background: #fff; border-top: 1px solid var(--gnt-border); }

/* Job details */
.gnt-jobhead__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.gnt-jobhead__client { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; color: #6d7c90; }
html.gnt-public .gnt-jobhead__title { font-size: 24px; font-weight: 600; margin: 4px 0 14px; color: var(--gnt-dark); line-height: 1.35; }
.gnt-jobhead__pills { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 22px; }
.gnt-jobhead__facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; list-style: none; margin: 0 -30px -30px; padding: 0; border-top: 1px solid var(--gnt-border); }
.gnt-jobhead__facts li { display: flex; flex-direction: column; gap: 2px; padding: 18px 22px; border-right: 1px solid var(--gnt-border); border-bottom: 1px solid var(--gnt-border); }
.gnt-jobhead__facts li:nth-child(4n) { border-right: 0; }
.gnt-jobhead__facts i { color: var(--gnt-primary); font-size: 16px; margin-bottom: 6px; }
.gnt-jobhead__facts span { font-size: 13px; color: var(--gnt-muted); }
.gnt-jobhead__facts strong { font-size: 15px; color: var(--gnt-dark); font-weight: 600; }
.gnt-jobhead__facts strong small { font-size: 12px; color: var(--gnt-muted); font-weight: 400; }
.gnt-jobhead__facts em { font-style: normal; font-size: 12px; color: var(--gnt-muted); }
@media (max-width: 767.98px) { .gnt-jobhead__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 -20px -20px; } .gnt-jobhead__facts li:nth-child(2n) { border-right: 0; } }
.gnt-related-jobs .gnt-box__title { margin-top: 10px; }
.gnt-apply__price { margin-bottom: 18px; }
.gnt-apply__price strong { display: block; font-size: 30px; font-weight: 600; color: var(--gnt-dark); line-height: 1.1; }
.gnt-apply__price strong small { font-size: 14px; color: var(--gnt-muted); font-weight: 400; }
.gnt-apply__price span { font-size: 14px; color: var(--gnt-muted); }
.gnt-apply__hint { font-size: 13px; text-align: center; margin: 10px 0 0; color: var(--gnt-muted) !important; }
.gnt-order__note--ok { background: #e7f7ee; color: #1b7f4a !important; }
.gnt-order__note--warn { background: #fdecec; color: #b42318 !important; }

/* Modals driven by .hidden / .flex (Tailwind-era scripts) */
.gnt-modal { position: fixed; inset: 0; z-index: 2000; align-items: center; justify-content: center; padding: 16px; background: rgba(15, 16, 20, .55); }
.gnt-modal.flex { display: flex !important; }
.gnt-modal__dialog { width: 100%; max-width: 700px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; background: #fff; border-radius: var(--gnt-radius-lg); box-shadow: 0 30px 80px rgba(0, 0, 0, .3); overflow: hidden; }
.gnt-modal__dialog--sm { max-width: 420px; }
.gnt-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 26px; border-bottom: 1px solid var(--gnt-border); }
html.gnt-public .gnt-modal__head h2 { font-size: 20px; font-weight: 600; margin: 0; color: var(--gnt-dark); }
.gnt-modal__head p { margin: 2px 0 0; font-size: 13px; color: var(--gnt-muted); }
.gnt-modal__close { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--gnt-border); background: #fff; color: var(--gnt-dark); cursor: pointer; flex-shrink: 0; }
.gnt-modal__close:hover { background: var(--gnt-primary); border-color: var(--gnt-primary); color: #fff; }
.gnt-modal__body { padding: 22px 26px 26px; overflow-y: auto; }
.gnt-modal__body .input-group-text { background: var(--gnt-bg-2); border-color: #e3e3e3; }
.gnt-upload { display: flex; align-items: center; gap: 14px; padding: 18px; border: 2px dashed #dcdcdc; border-radius: var(--gnt-radius); cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.gnt-upload:hover { border-color: var(--gnt-primary); background: #fffafa; }
.gnt-upload i { font-size: 26px; color: var(--gnt-primary); }
.gnt-upload strong { display: block; font-size: 14px; color: var(--gnt-dark); font-weight: 500; }
.gnt-upload small { display: block; font-size: 12px; color: var(--gnt-muted); }

/* Own profile (edit view) */
.gnt-cover--sm { height: 230px; }
.gnt-own__bar { margin-top: 26px; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 40px; background: rgba(255, 255, 255, .14); color: #fff; font-size: 14px; backdrop-filter: blur(4px); }
.gnt-own__wrap { margin-top: -90px; display: grid; gap: 24px; }
.gnt-own__wrap > div[class*="rounded-"], .gnt-own__wrap > section { background: #fff; box-shadow: 0 6px 24px rgba(16, 24, 40, .05); }
.gnt-own .bg-primary { background-color: var(--gnt-primary) !important; }
.gnt-own .text-primary { color: var(--gnt-primary-text) !important; }
.gnt-own__wrap { gap: 0; }
.gnt-own__wrap > .mt-8 { margin-top: 24px !important; padding: 26px 30px !important; background: #fff; border: 1px solid var(--gnt-border); border-radius: var(--gnt-radius); }
html.gnt-public .gnt-own__wrap > .mt-8 > h2 { font-size: 20px !important; font-weight: 600 !important; color: var(--gnt-dark) !important; margin-bottom: 4px; }
.gnt-own__wrap > .mt-5 { margin-top: 24px !important; }
/* new_design's scroll animation (service_card.js) starts .card-animate at opacity 0; profile cards must always show */
html.gnt-public .project_wrapper_area .card-animate { opacity: 1 !important; transform: none !important; visibility: visible !important; }

/* Home about block: action buttons row */
.gnt-about__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
