/* ===================================================================== GEO ASSISTANCE — Design System Brand: action blue #1F7BEE / #398FFC · deep navy #08183A · emergency red #EC1C24 Type: Google Sans (Latin, self-hosted) + Noto Sans Georgian (KA fallback) + Bebas Neue (display accents) — see @font-face below ===================================================================== */ /* ----- Self-hosted type ------------------------------------------------- Google Sans (Latin, subset) for the whole UI, Noto Sans Georgian as a per-glyph fallback for Georgian, Bebas Neue for occasional display accents. */ @font-face{font-family:"Google Sans";src:url("../fonts/GoogleSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:"Google Sans";src:url("../fonts/GoogleSans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap} @font-face{font-family:"Google Sans";src:url("../fonts/GoogleSans-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap} @font-face{font-family:"Google Sans";src:url("../fonts/GoogleSans-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap} @font-face{font-family:"Noto Sans Georgian";src:url("../fonts/NotoSansGeorgian-Regular.woff2") format("woff2");font-weight:400;font-display:swap} @font-face{font-family:"Noto Sans Georgian";src:url("../fonts/NotoSansGeorgian-Medium.woff2") format("woff2");font-weight:500;font-display:swap} @font-face{font-family:"Noto Sans Georgian";src:url("../fonts/NotoSansGeorgian-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap} @font-face{font-family:"Noto Sans Georgian";src:url("../fonts/NotoSansGeorgian-Bold.woff2") format("woff2");font-weight:700;font-display:swap} @font-face{font-family:"Bebas Neue";src:url("../fonts/BebasNeue-Regular.woff2") format("woff2");font-weight:400;font-display:swap} /* --------------------------------------------------------------------- Tokens --------------------------------------------------------------------- */ :root{ /* Brand */ --c-brand: #1f7bee; /* primary action blue (AA on white for buttons) */ --c-brand-bright: #398ffc; /* exact brand blue — accents & gradients */ --c-brand-dark: #0b57c7; /* hover */ --c-navy: #08183a; /* deep navy — headings, hero, footer */ --c-navy-soft: #12224b; --c-red: #ec1c24; /* emergency / urgent CTA */ --c-red-dark: #cf141b; /* Ink & surfaces */ --c-ink: #232733; --c-muted: #5f6b7d; --c-line: #e7ecf3; --c-bg: #ffffff; --c-bg-soft: #f4f8fd; /* soft blue-tinted section */ --c-bg-chip: #e9f2fe; /* light blue chip */ --c-bg-navy: #08183a; /* Type */ --font: "Google Sans", "Noto Sans Georgian", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --font-display: "Bebas Neue", "Google Sans", sans-serif; /* Radius */ --r-sm: 10px; --r: 16px; --r-lg: 24px; --r-pill: 999px; /* Shadow */ --sh-sm: 0 1px 2px rgba(8,24,58,.06), 0 2px 8px rgba(8,24,58,.05); --sh: 0 6px 24px rgba(8,24,58,.08); --sh-lg: 0 20px 48px rgba(8,24,58,.14); --ring: 0 0 0 4px rgba(57,143,252,.18); /* Layout */ --container: 1300px; --container-wide: 1400px; --gutter: clamp(16px, 4vw, 40px); --t: .22s cubic-bezier(.4,0,.2,1); } /* --------------------------------------------------------------------- Reset / base --------------------------------------------------------------------- */ *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth} body{ margin:0; font-family:var(--font); color:var(--c-ink); background:var(--c-bg); line-height:1.62; font-size:17px; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; } img{max-width:100%;height:auto;display:block} a{color:var(--c-brand);text-decoration:none;transition:color var(--t)} a:hover{color:var(--c-brand-dark)} h1,h2,h3,h4{font-weight:700;line-height:1.14;color:var(--c-navy);margin:0 0 .5em;letter-spacing:-.02em} h1{font-size:clamp(2.1rem,4.6vw,3.4rem)} h2{font-size:clamp(1.7rem,3.4vw,2.5rem)} h3{font-size:clamp(1.2rem,2vw,1.45rem)} p{margin:0 0 1rem} ul{margin:0;padding:0} button{font-family:inherit} :focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px} .skip-link{position:absolute;left:-999px;top:0;background:#fff;padding:10px 16px;z-index:1000} .skip-link:focus{left:8px;top:8px} /* --------------------------------------------------------------------- Layout helpers --------------------------------------------------------------------- */ .container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)} .section{padding:clamp(56px,8vw,104px) 0} .section--soft{background:var(--c-bg-soft)} .section--navy{background:var(--c-navy);color:#dfe7f4} .section--tight{padding:clamp(40px,5vw,64px) 0} .section-head{max-width:720px;margin:0 auto clamp(34px,4vw,54px);text-align:center} .section-head--left{margin-inline:0;text-align:left} .section-head p{color:var(--c-muted);font-size:1.06rem;margin:0} .eyebrow{ display:inline-flex;align-items:center;gap:8px; font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase; color:var(--c-brand);background:var(--c-bg-chip); padding:7px 14px;border-radius:var(--r-pill);margin-bottom:16px; } .section--navy .eyebrow{background:rgba(57,143,252,.16);color:#8fc0ff} .section--navy h2,.section--navy h3{color:#fff} .grid{display:grid;gap:clamp(18px,2.4vw,28px)} .grid-3{grid-template-columns:repeat(3,1fr)} .grid-4{grid-template-columns:repeat(4,1fr)} .grid-2{grid-template-columns:repeat(2,1fr)} .js [data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)} .js [data-reveal].is-visible{opacity:1;transform:none} /* --------------------------------------------------------------------- Buttons --------------------------------------------------------------------- */ .btn{ display:inline-flex;align-items:center;justify-content:center;gap:10px; font-weight:600;font-size:1rem;line-height:1; padding:15px 26px;border-radius:var(--r-pill); border:1px solid transparent;cursor:pointer;transition:all var(--t);white-space:nowrap; } .btn--primary{background:var(--c-brand);color:#fff;box-shadow:0 8px 20px rgba(31,123,238,.28)} .btn--primary:hover{background:var(--c-brand-dark);color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(31,123,238,.36)} .btn--ghost{background:#fff;color:var(--c-navy);border-color:var(--c-line)} .btn--ghost:hover{border-color:var(--c-brand);color:var(--c-brand);transform:translateY(-2px)} .btn--light{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.32)} .btn--light:hover{background:#fff;color:var(--c-navy)} .btn--emergency{background:var(--c-red);color:#fff;padding:12px 20px;box-shadow:0 8px 18px rgba(236,28,36,.3)} .btn--emergency:hover{background:var(--c-red-dark);color:#fff;transform:translateY(-2px)} .btn--lg{padding:17px 32px;font-size:1.05rem} .btn .pulse{width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:pulse 1.8s infinite} @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}70%{box-shadow:0 0 0 9px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}} /* --------------------------------------------------------------------- Header --------------------------------------------------------------------- */ .site-header{position:sticky;top:0;z-index:100} .topbar{background:var(--c-navy);color:#c4d2ea;font-size:.82rem} .topbar__inner{display:flex;align-items:center;gap:20px;height:40px} .topbar__item{display:inline-flex;align-items:center;gap:7px;color:#c4d2ea} .topbar__item:hover{color:#fff} .topbar__item--muted{color:#8598ba} .topbar__spacer{flex:1} .lang-switch{display:inline-flex;gap:2px;font-weight:600} .lang{padding:2px 7px;border-radius:6px;cursor:pointer;color:#8598ba;font-size:.78rem} .lang.is-active{background:rgba(255,255,255,.12);color:#fff} .navbar{background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--c-line);transition:box-shadow var(--t)} .site-header.is-stuck .navbar{box-shadow:var(--sh)} .navbar__inner{display:flex;align-items:center;gap:22px;min-height:74px} .brand{display:inline-flex;align-items:center;gap:10px;color:var(--c-navy);font-weight:700} .brand__mark{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--c-brand-bright),var(--c-brand));color:#fff} .brand__text{font-size:1.12rem;letter-spacing:.04em} .brand__text strong{color:var(--c-brand)} .brand--light{color:#fff} .brand--light .brand__text{color:#fff} .primary-nav{margin-left:auto} .nav-menu{list-style:none;display:flex;align-items:center;gap:4px} .nav-menu li{position:relative} .nav-menu a{display:block;padding:10px 14px;color:var(--c-navy);font-weight:500;border-radius:10px} .nav-menu a:hover,.nav-menu .current-menu-item>a,.nav-menu .current_page_item>a{color:var(--c-brand);background:var(--c-bg-chip)} .nav-menu .sub-menu{position:absolute;top:100%;left:0;min-width:230px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r-sm);box-shadow:var(--sh);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:all var(--t)} .nav-menu li:hover>.sub-menu{opacity:1;visibility:visible;transform:none} .nav-menu .sub-menu a{padding:9px 12px} .navbar__cta{margin-left:4px} .nav-toggle{display:none;flex-direction:column;gap:5px;width:44px;height:44px;border:1px solid var(--c-line);background:#fff;border-radius:10px;cursor:pointer;align-items:center;justify-content:center} .nav-toggle span{width:20px;height:2px;background:var(--c-navy);border-radius:2px;transition:all var(--t)} body.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)} body.nav-open .nav-toggle span:nth-child(2){opacity:0} body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} /* --------------------------------------------------------------------- Hero --------------------------------------------------------------------- */ .hero{position:relative;color:#eaf1fb;background:radial-gradient(1200px 500px at 78% -8%,rgba(57,143,252,.5),transparent 60%),linear-gradient(160deg,#0a1c44 0%,#08183a 55%,#0a1731 100%);overflow:hidden} .hero::after{content:"";position:absolute;inset:0;background:url('data:image/svg+xml;utf8,');pointer-events:none} .hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:clamp(56px,7vw,96px) 0} .hero h1{color:#fff;margin-bottom:.4em} .hero__lead{font-size:1.18rem;color:#c4d2ea;max-width:44ch;margin-bottom:28px} .hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:30px} .hero__trust{display:flex;gap:26px;flex-wrap:wrap;color:#a9bdda;font-size:.92rem} .hero__trust b{color:#fff;display:block;font-size:1.5rem;font-weight:700;line-height:1} .hero__badge{display:inline-flex;align-items:center;gap:9px;background:rgba(236,28,36,.14);border:1px solid rgba(236,28,36,.4);color:#ffb3b6;padding:7px 15px;border-radius:var(--r-pill);font-size:.85rem;font-weight:600;margin-bottom:22px} .hero__badge .dot{width:8px;height:8px;border-radius:50%;background:var(--c-red);box-shadow:0 0 0 0 rgba(236,28,36,.6);animation:pulse 1.8s infinite} .hero__card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-lg);padding:26px;backdrop-filter:blur(4px)} .hero__card h3{color:#fff;font-size:1.15rem;margin-bottom:16px} .hero__list{list-style:none;display:grid;gap:12px} .hero__list li{display:flex;align-items:flex-start;gap:12px;color:#d5e0f2;font-size:.98rem} .hero__list svg{flex:none;color:#6fd08c;margin-top:2px} .hero__wave{display:block;width:100%;height:auto;color:var(--c-bg)} /* --------------------------------------------------------------------- Stat counters --------------------------------------------------------------------- */ .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,26px)} .stat{text-align:center;padding:24px 12px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);box-shadow:var(--sh-sm)} .stat__num{font-size:clamp(2rem,3.4vw,2.7rem);font-weight:800;color:var(--c-brand);line-height:1;letter-spacing:-.02em} .stat__label{color:var(--c-muted);font-size:.94rem;margin-top:8px} .section--navy .stat{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)} .section--navy .stat__num{color:#7fb4ff} .section--navy .stat__label{color:#a9bdda} /* --------------------------------------------------------------------- Cards — services --------------------------------------------------------------------- */ .card{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg);padding:32px;transition:transform var(--t),box-shadow var(--t),border-color var(--t);height:100%;display:flex;flex-direction:column} .card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg);border-color:transparent} .card__icon{width:60px;height:60px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--c-brand-bright),var(--c-brand));color:#fff;margin-bottom:20px} .card__icon svg{width:30px;height:30px} .card h3{margin-bottom:10px} .card p{color:var(--c-muted);margin-bottom:18px} .card__link{margin-top:auto;font-weight:600;display:inline-flex;align-items:center;gap:7px} .card__link svg{transition:transform var(--t)} .card:hover .card__link svg{transform:translateX(4px)} .card--service{position:relative;overflow:hidden} .card--service::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--c-brand-bright),var(--c-brand))} /* What We Do — compact chips */ .wwd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px} .wwd{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);padding:16px 18px;transition:all var(--t)} .wwd:hover{border-color:var(--c-brand);box-shadow:var(--sh-sm);transform:translateY(-3px)} .wwd__ic{width:44px;height:44px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--c-bg-chip);color:var(--c-brand)} .wwd__ic svg{width:22px;height:22px} .wwd b{display:block;color:var(--c-navy);font-size:1rem;font-weight:600} .wwd span{color:var(--c-muted);font-size:.85rem} /* Why us */ .why{display:grid;grid-template-columns:repeat(3,1fr);gap:28px} .why__item{display:flex;gap:16px} .why__ic{width:52px;height:52px;flex:none;border-radius:14px;display:grid;place-items:center;background:#fff;border:1px solid var(--c-line);color:var(--c-brand);box-shadow:var(--sh-sm)} .why__item h3{font-size:1.15rem;margin-bottom:6px} .why__item p{color:var(--c-muted);font-size:.96rem;margin:0} /* --------------------------------------------------------------------- Providers --------------------------------------------------------------------- */ .provider-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px} .provider-card{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg);overflow:hidden;transition:all var(--t);display:flex;flex-direction:column} .provider-card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg);border-color:transparent} .provider-card__media{position:relative;aspect-ratio:16/10;background:linear-gradient(135deg,#eef4fd,#dfeafb);display:grid;place-items:center} .provider-card__media img{width:100%;height:100%;object-fit:cover} .provider-card__logo{max-width:66%;max-height:60%;object-fit:contain} .provider-card__badge{position:absolute;top:12px;left:12px;background:var(--c-navy);color:#fff;font-size:.74rem;font-weight:600;padding:5px 11px;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:6px} .provider-card__body{padding:20px 22px;display:flex;flex-direction:column;gap:8px;flex:1} .provider-card__body h3{font-size:1.18rem;margin:0} .provider-card__meta{color:var(--c-muted);font-size:.9rem;display:flex;align-items:center;gap:6px} .provider-card__foot{margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--c-line)} .provider-card__foot .go{font-weight:600;display:inline-flex;align-items:center;gap:6px} .tag{font-size:.75rem;font-weight:600;color:var(--c-brand);background:var(--c-bg-chip);padding:4px 10px;border-radius:var(--r-pill)} /* Logo wall (partners) */ .logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;align-items:center} .logo-wall__item{height:96px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);display:grid;place-items:center;padding:16px;transition:all var(--t)} .logo-wall__item:hover{box-shadow:var(--sh-sm);transform:translateY(-3px)} .logo-wall__item img{max-height:100%;max-width:100%;object-fit:contain;filter:grayscale(1);opacity:.7;transition:all var(--t)} .logo-wall__item:hover img{filter:none;opacity:1} .logo-wall__ph{font-weight:700;color:#9aa6b8;letter-spacing:.02em;text-align:center;font-size:.95rem} /* Insurer partners */ .insurer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px} .insurer{background:#fff;border:1px solid var(--c-line);border-radius:var(--r);padding:22px;text-align:center;transition:all var(--t)} .insurer:hover{box-shadow:var(--sh);transform:translateY(-4px)} .insurer__logo{height:56px;display:grid;place-items:center;margin-bottom:10px;font-weight:800;color:var(--c-navy);font-size:1.2rem} .insurer p{font-size:.86rem;color:var(--c-muted);margin:0} /* --------------------------------------------------------------------- Breadcrumb + sub-archive --------------------------------------------------------------------- */ .breadcrumb{font-size:.9rem;color:var(--c-muted);padding:18px 0} .breadcrumb a{color:var(--c-muted)} .breadcrumb a:hover{color:var(--c-brand)} .breadcrumb .crumb-sep{margin:0 8px;color:#c3ccda} .breadcrumb [aria-current]{color:var(--c-navy);font-weight:600} .page-hero{background:var(--c-bg-soft);border-bottom:1px solid var(--c-line);padding:clamp(30px,4vw,48px) 0 clamp(34px,5vw,54px)} .page-hero h1{margin-bottom:.3em} .page-hero p{color:var(--c-muted);max-width:64ch;font-size:1.08rem;margin:0} .page-hero__flag{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;font-weight:600;color:var(--c-brand);background:var(--c-bg-chip);padding:6px 13px;border-radius:var(--r-pill);margin-bottom:14px} /* --------------------------------------------------------------------- Single: service / provider --------------------------------------------------------------------- */ .single-wrap{display:grid;grid-template-columns:1fr 340px;gap:48px;align-items:start} .prose{font-size:1.05rem} .prose h2{margin-top:1.4em} .prose img{border-radius:var(--r);margin:1.2em 0} .aside-card{background:#fff;border:1px solid var(--c-line);border-radius:var(--r);padding:24px;box-shadow:var(--sh-sm);position:sticky;top:110px} .aside-card h3{font-size:1.1rem} .info-list{list-style:none;display:grid;gap:14px;margin:0} .info-list li{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;color:var(--c-ink)} .info-list svg{flex:none;color:var(--c-brand);margin-top:2px} .info-list b{display:block;color:var(--c-muted);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em} .map-embed{aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;border:1px solid var(--c-line);background:#eaf0f8} .map-embed iframe{width:100%;height:100%;border:0} /* Related chips */ .related-services{display:flex;flex-wrap:wrap;gap:10px} .related-services a{background:var(--c-bg-chip);color:var(--c-brand);padding:8px 15px;border-radius:var(--r-pill);font-weight:600;font-size:.9rem} .related-services a:hover{background:var(--c-brand);color:#fff} /* --------------------------------------------------------------------- CTA band --------------------------------------------------------------------- */ .cta-band{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--c-brand),var(--c-brand-dark));border-radius:var(--r-lg);padding:clamp(34px,5vw,60px);color:#fff;text-align:center} .cta-band h2{color:#fff} .cta-band p{color:rgba(255,255,255,.9);max-width:56ch;margin:0 auto 26px} .cta-band .btn--light{border-color:#fff} /* --------------------------------------------------------------------- Contact form --------------------------------------------------------------------- */ .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start} .field{margin-bottom:18px} .field label{display:block;font-weight:600;font-size:.92rem;margin-bottom:7px;color:var(--c-navy)} .field input,.field textarea,.field select{width:100%;padding:14px 16px;border:1px solid var(--c-line);border-radius:var(--r-sm);font:inherit;background:#fff;transition:border-color var(--t),box-shadow var(--t)} .field input:focus,.field textarea:focus,.field select:focus{border-color:var(--c-brand);box-shadow:var(--ring);outline:none} .field textarea{min-height:130px;resize:vertical} .contact-channels{display:grid;gap:14px} .channel{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);padding:18px 20px;transition:all var(--t)} .channel:hover{box-shadow:var(--sh-sm);border-color:var(--c-brand)} .channel__ic{width:48px;height:48px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--c-bg-chip);color:var(--c-brand)} .channel b{display:block;color:var(--c-navy)} .channel span{color:var(--c-muted);font-size:.9rem} /* --------------------------------------------------------------------- Accordion --------------------------------------------------------------------- */ .accordion{max-width:820px;margin:0 auto;display:grid;gap:12px} .accordion__item{background:#fff;border:1px solid var(--c-line);border-radius:var(--r);overflow:hidden} .accordion__q{width:100%;text-align:left;padding:18px 22px;background:none;border:0;font-weight:600;font-size:1.05rem;color:var(--c-navy);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px} .accordion__q::after{content:"+";font-size:1.4rem;color:var(--c-brand);transition:transform var(--t)} .accordion__item.is-open .accordion__q::after{transform:rotate(45deg)} .accordion__a{max-height:0;overflow:hidden;transition:max-height .3s ease;color:var(--c-muted)} .accordion__item.is-open .accordion__a{max-height:400px} .accordion__a p{padding:0 22px 20px} /* Steps */ .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:step} .step{position:relative;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);padding:26px 22px} .step::before{counter-increment:step;content:counter(step);position:absolute;top:-16px;left:22px;width:38px;height:38px;border-radius:50%;background:var(--c-brand);color:#fff;display:grid;place-items:center;font-weight:700;box-shadow:0 6px 14px rgba(31,123,238,.3)} .step h3{font-size:1.08rem;margin:12px 0 6px} .step p{color:var(--c-muted);font-size:.93rem;margin:0} /* --------------------------------------------------------------------- Footer (light, with navy bottom bar — matches brand) --------------------------------------------------------------------- */ .site-footer{background:var(--c-bg-soft);color:var(--c-ink);padding-top:clamp(48px,6vw,72px);border-top:1px solid var(--c-line)} .footer__top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-bottom:28px;margin-bottom:32px;border-bottom:1px solid var(--c-line)} .footer__grid{display:grid;grid-template-columns:1.3fr 1fr 1.2fr 1.3fr;gap:36px;padding-bottom:40px} .footer__brand .brand{color:var(--c-navy)} .footer__brand .brand__text{color:var(--c-navy)} .footer__tagline{color:var(--c-muted);font-size:.95rem;max-width:34ch;margin:16px 0 18px} .footer__social{display:flex;gap:10px} .footer__social a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--c-line);color:var(--c-brand)} .footer__social a:hover{background:var(--c-brand);color:#fff;border-color:var(--c-brand)} .footer__title{color:var(--c-navy);font-size:1rem;font-weight:700;margin-bottom:16px} .footer__title--red{color:var(--c-red)} .footer__menu,.footer__contact{list-style:none;display:grid;gap:10px} .footer__menu a,.footer__contact a{color:var(--c-ink)} .footer__menu a:hover,.footer__contact a:hover{color:var(--c-brand)} .footer__contact li{color:var(--c-ink);font-size:.94rem} .footer__contact .lbl{display:block;color:var(--c-red);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;margin-bottom:1px} .footer__bottom{background:var(--c-navy);color:#9fb0cf;padding:16px 0} .footer__bottom-inner{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.85rem} .footer__bottom a{color:#c4d2ea} /* --------------------------------------------------------------------- Utilities --------------------------------------------------------------------- */ .text-center{text-align:center} .mt-0{margin-top:0} .mb-0{margin-bottom:0} .stack-sm{display:grid;gap:10px} .cluster{display:flex;flex-wrap:wrap;gap:14px;align-items:center} .cluster--center{justify-content:center} .divider{height:1px;background:var(--c-line);border:0;margin:0} .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} /* --------------------------------------------------------------------- Responsive --------------------------------------------------------------------- */ @media (max-width:1024px){ .hero__inner{grid-template-columns:1fr;gap:36px} .hero__card{max-width:520px} .wwd-grid,.logo-wall,.insurer-grid{grid-template-columns:repeat(3,1fr)} .stats{grid-template-columns:repeat(2,1fr)} .single-wrap{grid-template-columns:1fr} .aside-card{position:static} .steps{grid-template-columns:repeat(2,1fr)} } @media (max-width:860px){ .nav-toggle{display:flex;margin-left:auto} .primary-nav{position:fixed;inset:0 0 0 auto;width:min(320px,82vw);background:#fff;flex-direction:column;padding:88px 22px 22px;box-shadow:var(--sh-lg);transform:translateX(100%);transition:transform var(--t);overflow-y:auto;z-index:120} body.nav-open .primary-nav{transform:none} body.nav-open::after{content:"";position:fixed;inset:0;background:rgba(8,24,58,.4);z-index:110} .nav-menu{flex-direction:column;align-items:stretch;gap:2px} .nav-menu a{padding:12px 14px} .nav-menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 12px} .navbar__cta{display:none} .grid-3,.grid-4,.provider-grid,.why{grid-template-columns:1fr} .grid-2,.contact-grid,.footer__grid{grid-template-columns:1fr} .wwd-grid,.insurer-grid{grid-template-columns:repeat(2,1fr)} .footer__grid{gap:28px} } @media (max-width:520px){ .topbar__item--hide-sm{display:none} .stats,.logo-wall,.wwd-grid,.insurer-grid,.steps{grid-template-columns:1fr 1fr} .hero__trust{gap:18px} } /* ===================================================================== HOME v2 — matches the Geo Assistance brand screenshot ===================================================================== */ /* Header extras */ .topbar__cta{background:var(--c-red);color:#fff;padding:6px 16px;border-radius:var(--r-pill);font-weight:600;font-size:.8rem} .topbar__cta:hover{background:var(--c-red-dark);color:#fff} .social{display:inline-flex;gap:8px} .social a{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--c-line);color:var(--c-brand)} .social a:hover{background:var(--c-brand);color:#fff;border-color:var(--c-brand)} .btn--navy{background:var(--c-navy);color:#fff;box-shadow:0 8px 18px rgba(8,24,58,.22)} .btn--navy:hover{background:#0d234f;color:#fff;transform:translateY(-2px)} .btn--red{background:var(--c-red);color:#fff;box-shadow:0 8px 18px rgba(236,28,36,.26)} .btn--red:hover{background:var(--c-red-dark);color:#fff;transform:translateY(-2px)} .btn--outline{background:#fff;border-color:var(--c-line);color:var(--c-navy)} .btn--outline:hover{border-color:var(--c-navy);color:var(--c-navy);transform:translateY(-2px)} /* Section head with an action button on the right */ .head-row{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:34px;flex-wrap:wrap} .head-row h2{margin:0} .head-row .eyebrow{margin-bottom:10px} /* Home hero */ .home-hero{background:radial-gradient(680px 380px at 8% -10%,rgba(236,28,36,.06),transparent 62%),radial-gradient(760px 520px at 96% 6%,rgba(57,143,252,.12),transparent 60%),#fff;padding:clamp(40px,6vw,86px) 0} .home-hero__inner{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,4vw,56px);align-items:center} .home-hero__title{color:var(--c-navy);margin-bottom:.35em} .home-hero__text{color:var(--c-muted);font-size:1.07rem;max-width:52ch;margin-bottom:26px} .rating{display:flex;align-items:center;gap:14px;margin-top:34px} .rating__avatars{display:flex} .rating__avatars span,.rating__avatars img{width:46px;height:46px;border-radius:50%;border:3px solid #fff;margin-left:-14px;background:#dfe8f6;object-fit:cover;display:grid;place-items:center;color:#6f88ac;font-weight:700;font-size:.85rem;box-shadow:var(--sh-sm)} .rating__avatars :first-child{margin-left:0} .rating__num{font-size:1.55rem;font-weight:800;color:var(--c-navy);line-height:1} .rating__stars{color:#f5b301;letter-spacing:2px;font-size:.95rem} .rating__label{color:var(--c-muted);font-size:.82rem} .hero-tiles{display:grid;grid-template-columns:1fr 1fr;gap:20px} .hero-tile{position:relative;aspect-ratio:3/4;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh);background-size:cover;background-position:center;transition:transform var(--t)} .hero-tile:nth-child(2){margin-top:34px} .hero-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,20,45,.74),rgba(8,20,45,.04) 58%)} .hero-tile__label{position:absolute;left:0;right:0;bottom:0;z-index:1;color:#fff;font-weight:700;font-size:1.12rem;text-align:center;padding:22px 16px} .hero-tile:hover{transform:translateY(-5px)} /* Image-placeholder gradients (swap for real photos) */ .ph-tbilisi{background-image:linear-gradient(160deg,#5b7fb0,#2b3f63)} .ph-abroad{background-image:linear-gradient(160deg,#6a7f9e,#39506f)} .ph-tourism{background-image:linear-gradient(160deg,#8aa1c4,#4d6488)} .ph-coop{background-image:linear-gradient(160deg,#7d93b3,#41567a)} .ph-airport{background-image:linear-gradient(160deg,#9bb0cf,#5a7396)} .ph-dental{background-image:linear-gradient(160deg,#a7bcd8,#61799b)} .ph-house{background-image:linear-gradient(160deg,#c0453f,#8e2f2c)} .ph-transport{background-image:linear-gradient(160deg,#8ea3c2,#516987)} .ph-photo{position:relative} .ph-photo::before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml;utf8,') center/44px no-repeat;opacity:.5} /* About */ .about__lead{max-width:none} .about p{color:var(--c-muted)} .about__note{color:var(--c-muted);font-style:italic;border-top:1px solid var(--c-line);padding-top:18px;margin-top:6px} .ins-logos{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin:24px 0 6px} .ins-logo{height:92px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r);display:grid;place-items:center;font-weight:800;letter-spacing:.02em;color:var(--c-navy);text-align:center;transition:all var(--t)} .ins-logo:hover{box-shadow:var(--sh-sm);transform:translateY(-3px)} .ins-logo small{display:block;font-weight:600;font-size:.62rem;color:var(--c-muted);letter-spacing:.06em} /* Red stat counters */ .stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:22px;padding-top:26px;border-top:1px solid var(--c-line)} .stat-b__num{font-size:clamp(1.8rem,3.2vw,2.5rem);font-weight:800;color:var(--c-red);line-height:1;letter-spacing:-.02em} .stat-b__label{color:var(--c-navy);font-weight:600;font-size:.95rem;margin-top:7px} /* Service tiles */ .svc-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:20px} .svc-tile{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh-sm);background-size:cover;background-position:center;transition:transform var(--t),box-shadow var(--t)} .svc-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,20,45,.78),rgba(8,20,45,0) 62%)} .svc-tile:hover{transform:translateY(-6px);box-shadow:var(--sh-lg)} .svc-tile__label{position:absolute;left:0;right:0;bottom:0;z-index:1;color:#fff;font-weight:600;padding:18px 14px;text-align:center} /* Why us — interactive tabs */ .whyus{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(24px,3vw,44px);align-items:stretch} .whyus__tabs{list-style:none;display:grid;gap:2px;align-content:start} .whyus__tab{width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--c-line);padding:17px 6px;font-size:1.06rem;font-weight:600;color:var(--c-navy);cursor:pointer;transition:color var(--t),border-color var(--t)} .whyus__tab:hover{color:var(--c-red)} .whyus__tab.is-active{color:var(--c-red);border-bottom-color:var(--c-red)} .whyus__panel{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg);box-shadow:var(--sh);display:grid;place-items:center;padding:clamp(28px,4vw,52px)} .whyus__quote{font-size:1.16rem;color:var(--c-ink);font-style:italic;text-align:center;max-width:48ch;margin:0} .whyus__quote::before{content:"";display:block;width:46px;height:3px;background:var(--c-red);margin:0 auto 20px;border-radius:2px} /* What we do — image tiles with label beneath */ .wwd-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:22px} .wwd-tile__img{aspect-ratio:16/11;border-radius:var(--r);overflow:hidden;background-size:cover;background-position:center;box-shadow:var(--sh-sm);margin-bottom:14px;transition:transform var(--t),box-shadow var(--t)} .wwd-tile:hover .wwd-tile__img{transform:translateY(-4px);box-shadow:var(--sh)} .wwd-tile__label{font-weight:600;color:var(--c-navy)} @media (max-width:1024px){ .home-hero__inner{grid-template-columns:1fr} .hero-tiles{max-width:520px} .svc-tiles,.wwd-tiles{grid-template-columns:repeat(2,1fr)} .ins-logos{grid-template-columns:repeat(3,1fr)} .stats-row{grid-template-columns:repeat(2,1fr)} .whyus{grid-template-columns:1fr} } @media (max-width:560px){ .svc-tiles,.wwd-tiles,.ins-logos,.stats-row{grid-template-columns:1fr 1fr} .hero-tile:nth-child(2){margin-top:0} } /* ===================================================================== HOME v3 — "Curo"-style layout, recoloured to the Geo Assistance brand. Deep-navy sections + soft-light sections + red primary CTA + bright-blue highlight (playing the reference's yellow role). ===================================================================== */ :root{ --c-paper:#f2f6fb; --c-cream:#eef4fd; } body{ background:var(--c-paper); } .navbar{ background:var(--c-paper); backdrop-filter:none; border-bottom:1px solid rgba(8,24,58,.07); } /* Section-label pills */ .gc-pill{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:600;color:var(--c-navy);background:#fff;border:1px solid var(--c-line);padding:7px 16px;border-radius:var(--r-pill)} .section--navy .gc-pill{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#dfe7f4} /* Buttons for navy surfaces */ .btn--onnavy{background:rgba(255,255,255,.10);color:#fff;border-color:rgba(255,255,255,.30)} .btn--onnavy:hover{background:#fff;color:var(--c-navy);transform:translateY(-2px)} /* Soft light "bright" primary — plays the reference's yellow role on navy */ .btn--soft{background:#d8e9ff;color:var(--c-navy);box-shadow:0 10px 22px rgba(3,26,64,.28)} .btn--soft:hover{background:#c6ddff;color:var(--c-navy);transform:translateY(-2px)} /* ---- Hero: navy rounded card ---- */ .gc-hero{position:relative;overflow:hidden;background:linear-gradient(160deg,#0a1d46,#08183a 60%,#0a1731);color:#e9f0fb;padding:clamp(40px,6vw,92px) 0} .gc-hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(28px,4vw,58px);align-items:center} .gc-badge{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:600;color:#dfe7f4;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);padding:7px 15px;border-radius:var(--r-pill);margin-bottom:22px} .gc-badge .star{color:#f5b301} .gc-h1{font-size:clamp(2.3rem,5vw,3.9rem);line-height:1.07;font-weight:700;letter-spacing:-.025em;color:#fff;margin:0 0 20px} .gc-h1 .hl{color:var(--c-brand-bright)} .gc-ava{display:inline-block;width:.8em;height:.8em;border-radius:50%;vertical-align:-.05em;margin:0 .03em;border:2px solid rgba(255,255,255,.65)} .gc-ava--1{background:linear-gradient(135deg,#ec1c24,#ff7a54)} .gc-ava--2{background:linear-gradient(135deg,#398ffc,#7cc0ff)} .gc-ava--3{background:linear-gradient(135deg,#0a1d46,#4a6aa4)} .gc-lead{color:#b7c5de;font-size:1.06rem;max-width:46ch;margin:0 0 28px} .gc-hero__cta{display:flex;flex-wrap:wrap;gap:14px} .gc-hero__media{position:relative} .gc-hero__media::before{content:"";position:absolute;inset:-8% -5% -8% 4%;background:url('data:image/svg+xml;utf8,') 0 0/38px 44px;opacity:.55} .gc-hero__img{position:relative;border-radius:22px;aspect-ratio:5/4.3;background:linear-gradient(160deg,#cfe0f2,#94b1d6);box-shadow:var(--sh-lg);overflow:hidden} /* ---- Split heading / text (About) ---- */ .gc-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start} .gc-h2{font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;color:var(--c-navy);margin:0} .section--navy .gc-h2{color:#fff} .gc-body p{color:var(--c-muted)} .section--navy .gc-body p{color:#b7c5de} /* ---- Centered section head ---- */ .gc-head{text-align:center;max-width:660px;margin:0 auto clamp(30px,4vw,52px)} .gc-head .gc-pill{margin-bottom:16px} .gc-head h2{margin:0} .gc-head p{color:var(--c-muted);margin:12px 0 0;font-size:1.03rem} .section--navy .gc-head p{color:#b7c5de} /* ---- Rounded cards ---- */ .gc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px)} .gc-cards--4{grid-template-columns:repeat(4,1fr)} .gc-card{background:#fff;border:1px solid var(--c-line);border-radius:22px;padding:30px;display:flex;flex-direction:column;height:100%;transition:transform var(--t),box-shadow var(--t)} .gc-card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg)} .gc-card--cream{background:var(--c-cream);border-color:transparent} .gc-card__ic{width:54px;height:54px;border-radius:15px;background:var(--c-navy);color:#fff;display:grid;place-items:center;margin-bottom:18px} .gc-card__ic svg{width:26px;height:26px} .gc-card h3{color:var(--c-navy);margin:0 0 8px;font-size:1.2rem} .gc-card p{color:var(--c-muted);margin:0 0 16px;font-size:.96rem} .gc-card .card__link{margin-top:auto;color:var(--c-red);font-weight:600;display:inline-flex;gap:6px;align-items:center} .gc-card .card__link svg{transition:transform var(--t)} .gc-card:hover .card__link svg{transform:translateX(4px)} /* ---- CTA band (navy, rounded) ---- */ .gc-cta{position:relative;overflow:hidden;background:linear-gradient(160deg,#0a1d46,#08183a);border-radius:clamp(20px,3vw,30px);padding:clamp(34px,5vw,64px);text-align:center;color:#e9f0fb} .gc-cta h2{color:#fff} .gc-cta p{color:#b7c5de;max-width:52ch;margin:0 auto 26px} @media (max-width:1024px){ .gc-cards,.gc-cards--4{grid-template-columns:repeat(2,1fr)} } @media (max-width:900px){ .gc-hero__grid,.gc-split{grid-template-columns:1fr} } @media (max-width:600px){ .gc-cards,.gc-cards--4{grid-template-columns:1fr} } /* ===================================================================== ENUMERA-style layer — minimal editorial + motion (hero + about). White canvas, light large headings, "//" labels, preloader, load/scroll reveals, Lenis smooth scroll. Brand-recoloured. ===================================================================== */ body{background:#fff} .navbar{background:#fff} /* Lenis smooth scroll */ html.lenis,html.lenis body{height:auto} .lenis.lenis-smooth{scroll-behavior:auto !important} .lenis.lenis-stopped{overflow:hidden} /* ---- Preloader removed ---- */ /* ---- "//" section labels ---- */ .em-label{display:inline-block;font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--c-muted)} .em-label::before{content:"// ";color:var(--c-red);font-weight:700} /* ---- Hero ---- */ .em-hero{background:#fff;padding:clamp(34px,6vw,94px) 0 clamp(30px,5vw,72px);overflow:hidden} .em-hero__grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(30px,5vw,64px);align-items:center} .em-hero__title{font-size:clamp(2.6rem,6.2vw,5rem);font-weight:400;line-height:1.03;letter-spacing:-.03em;color:var(--c-navy);margin:20px 0 26px} .em-hero__title .hl{color:var(--c-brand)} .em-hero__lead{font-size:1.13rem;line-height:1.62;color:var(--c-muted);max-width:48ch;margin:0 0 32px} .em-hero__cta{display:flex;gap:14px;flex-wrap:wrap} .em-hero__media{position:relative} .em-hero__img{aspect-ratio:4/3.5;border-radius:8px;background:linear-gradient(150deg,#cfe0f2,#9fb9d9);box-shadow:var(--sh-lg);overflow:hidden} .em-hero__media::after{content:"";position:absolute;right:-12px;top:-12px;width:118px;height:120px;background:url('data:image/svg+xml;utf8,') 0 0/26px 30px;opacity:.55} /* Hero load motion */ .js .em-hero__title{overflow:hidden} .js .em-hero__title>span{display:block;transform:translateY(115%);animation:em-rise 1s cubic-bezier(.16,1,.3,1) 1.05s forwards} .js .em-hero .em-load{opacity:0;transform:translateY(24px);animation:em-load .9s cubic-bezier(.16,1,.3,1) forwards} .js .em-hero .em-load--1{animation-delay:1.12s} .js .em-hero .em-load--2{animation-delay:1.24s} .js .em-hero .em-load--3{animation-delay:1.36s} .js .em-hero__img{clip-path:inset(0 0 100% 0);animation:em-clip 1.15s cubic-bezier(.16,1,.3,1) 1.1s forwards} @keyframes em-rise{to{transform:translateY(0)}} @keyframes em-load{to{opacity:1;transform:none}} @keyframes em-clip{to{clip-path:inset(0 0 0 0)}} /* ---- About (section after hero) ---- */ .em-h2{font-size:clamp(1.9rem,3.8vw,3.1rem);font-weight:400;line-height:1.08;letter-spacing:-.025em;color:var(--c-navy);margin:0} .em-about__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:start;margin-top:clamp(22px,3vw,38px)} .em-about__body p{color:var(--c-muted);font-size:1.05rem;line-height:1.65;margin:0 0 18px} .em-about__img{aspect-ratio:5/4.2;border-radius:8px;background:linear-gradient(150deg,#e7edf5,#c1d3e8);box-shadow:var(--sh);overflow:hidden} .em-about__img img{width:100%;height:100%;object-fit:cover;display:block} .em-stats{margin-top:clamp(40px,6vw,80px)} @media (max-width:900px){ .em-hero__grid,.em-about__grid{grid-template-columns:1fr} } /* ===================================================================== EM v2 — immersive gradient-sphere hero + two-tone editorial section. (Overrides the minimal em layer above.) enumeramolecular-inspired, recoloured: deep-navy canvas, glowing blue/violet orbs + red accent. ===================================================================== */ /* Brand mark colours (red cross) */ .brand__mark{background:var(--c-red)} .brand__text{color:var(--c-navy)} .brand__text strong{color:var(--c-red)} /* Header overlaid transparently on the hero (front page only) */ body.home-hero .site-header{position:absolute;top:0;left:0;right:0;z-index:50} body.home-hero .navbar{background:transparent;border-bottom:0} body.home-hero .brand__text{color:#fff} body.home-hero .brand__text strong{color:#fff} body.home-hero .nav-menu a{color:rgba(255,255,255,.88)} body.home-hero .nav-menu a:hover,body.home-hero .nav-menu .current-menu-item>a{color:#fff;background:rgba(255,255,255,.12)} body.home-hero .navbar__cta{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.42);color:#fff;box-shadow:none} body.home-hero .navbar__cta:hover{background:#fff;color:var(--c-navy)} body.home-hero .nav-toggle{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3)} body.home-hero .nav-toggle span{background:#fff} /* Immersive hero */ .em-hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;background:#0a0e2a;color:#fff;padding:120px 0 40px} .em-hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden} .em-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:48%;background:linear-gradient(transparent,rgba(6,9,26,.62));z-index:1;pointer-events:none} .orb{position:absolute;border-radius:50%;filter:blur(64px);opacity:.9;mix-blend-mode:screen;will-change:transform} .orb--1{width:54vw;height:54vw;left:12%;top:-8%;background:radial-gradient(circle at 35% 35%,#5b7cff,#3327a0 62%,transparent 72%);animation:orb1 20s ease-in-out infinite} .orb--2{width:46vw;height:46vw;right:4%;top:0;background:radial-gradient(circle at 40% 40%,#a45cff,#5a2ea0 60%,transparent 72%);animation:orb2 24s ease-in-out infinite} .orb--3{width:40vw;height:40vw;left:34%;top:22%;background:radial-gradient(circle at 45% 40%,#ff6ea6,#8a2b6a 58%,transparent 72%);animation:orb3 22s ease-in-out infinite} .orb--4{width:26vw;height:26vw;right:20%;top:30%;background:radial-gradient(circle at 40% 40%,#39a0ff,#1e5bd0 60%,transparent 72%);animation:orb1 26s ease-in-out infinite reverse} .orb--5{width:20vw;height:20vw;left:8%;top:44%;background:radial-gradient(circle at 40% 40%,#ec1c24,#7a1420 62%,transparent 72%);opacity:.5;animation:orb2 28s ease-in-out infinite} @keyframes orb1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(6%,8%) scale(1.12)}} @keyframes orb2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-7%,6%) scale(1.08)}} @keyframes orb3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(4%,-6%) scale(1.14)}} .em-hero__stars{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.55) 1px,transparent 1px);background-size:48px 48px;opacity:.1} .em-hero__inner{position:relative;z-index:2;width:100%} .em-hero .em-label{color:rgba(255,255,255,.82)} .em-hero__title{font-size:clamp(3rem,9vw,7.4rem);font-weight:300;line-height:.98;letter-spacing:-.035em;color:#fff;margin:16px 0 0} .em-hero__foot{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-top:clamp(28px,4vw,52px)} .em-hero__lead{color:rgba(255,255,255,.82);font-size:1.04rem;line-height:1.6;max-width:44ch;margin:0} .em-hero__cta{display:flex;gap:14px;flex-wrap:wrap} .btn--glass{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.42);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} .btn--glass:hover{background:#fff;color:var(--c-navy);transform:translateY(-2px)} /* Hero load motion (retimed for the taller hero) */ .js .em-hero__title>span{animation-delay:1.15s} .js .em-hero .em-load--1{animation-delay:1.2s} .js .em-hero .em-load--2{animation-delay:1.55s} .js .em-hero .em-load--3{animation-delay:1.68s} /* Two-tone editorial section */ .em-about{background:#fff;padding:clamp(60px,10vw,150px) 0} .em-about__h{font-size:clamp(2rem,5.2vw,4.3rem);font-weight:400;line-height:1.04;letter-spacing:-.025em;color:var(--c-navy);margin:16px 0 0;max-width:22ch} .em-about__h .em-muted{color:#b4bac6} .em-about__cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);margin-top:clamp(34px,5vw,64px)} .em-about__cols p{color:var(--c-muted);font-size:1.02rem;line-height:1.68;margin:0} .em-about__cols .col-foot{margin-top:22px} @media (max-width:820px){ .em-hero{padding:104px 0 40px} .em-hero__title{font-size:clamp(2.6rem,12vw,4rem)} .em-hero__foot{flex-direction:column;align-items:flex-start;gap:22px} .em-about__cols{grid-template-columns:1fr} } @media (prefers-reduced-motion:reduce){ .orb{animation:none !important} } /* ===================================================================== EM v3 — contact top-bar, glass sticky header, hero service cards + diamond ===================================================================== */ /* ---- Contact top-bar (navy) ---- */ .topbar{background:var(--c-navy);color:#fff;font-size:.85rem;position:relative;z-index:2;overflow:hidden} .topbar__inner{display:flex;align-items:center;gap:24px;min-height:46px} .topbar__item{display:inline-flex;align-items:center;gap:8px;color:#fff} .topbar__item:hover{color:#fff} .topbar__item svg{color:var(--c-red);flex:none} .topbar__spacer{flex:1} .topbar__cta{align-self:stretch;display:inline-flex;align-items:center;background:var(--c-red);color:#fff;font-weight:600;padding:0 26px;margin-right:calc(-1 * var(--gutter));transition:background var(--t)} .topbar__cta:hover{background:var(--c-red-dark);color:#fff} /* ---- Header: fixed & transparent over hero → glass + shrink when stuck ---- */ body.home-hero .site-header{position:fixed;top:0;left:0;right:0;z-index:50} .navbar{transition:background var(--t),box-shadow var(--t)} .navbar__inner{transition:min-height var(--t)} .site-header.is-stuck .topbar{display:none} body.home-hero .site-header.is-stuck .navbar{background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);box-shadow:0 8px 30px rgba(8,24,58,.13);border-bottom-color:transparent} body.home-hero .site-header.is-stuck .navbar__inner{min-height:58px} body.home-hero .site-header.is-stuck .brand__text{color:var(--c-navy)} body.home-hero .site-header.is-stuck .brand__text strong{color:var(--c-red)} body.home-hero .site-header.is-stuck .nav-menu a{color:var(--c-navy)} body.home-hero .site-header.is-stuck .nav-menu a:hover,body.home-hero .site-header.is-stuck .nav-menu .current-menu-item>a{color:var(--c-brand);background:var(--c-bg-chip)} body.home-hero .site-header.is-stuck .nav-toggle{background:#fff;border-color:var(--c-line)} body.home-hero .site-header.is-stuck .nav-toggle span{background:var(--c-navy)} body.home-hero .site-header.is-stuck .navbar__cta{background:var(--c-red);border-color:transparent;color:#fff} /* ---- Hero: two columns (copy + service cards) ---- */ .em-hero{align-items:center} .em-hero__inner{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(28px,4vw,58px);align-items:center} .em-hero__title{font-size:clamp(2.5rem,5.4vw,4.5rem)} .em-hero__lead{margin:24px 0 0} .em-hero__cta{margin-top:28px} .em-hero__cards{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:18px} .svc-card{position:relative;display:block;aspect-ratio:3/3.8;border-radius:16px;overflow:hidden;background-size:cover;background-position:center;box-shadow:var(--sh-lg);transition:transform var(--t)} .svc-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,9,26,.1),rgba(6,9,26,.76))} .svc-card:hover{transform:translateY(-6px)} .svc-card__label{position:absolute;left:20px;bottom:20px;z-index:1;color:#fff;font-size:clamp(1.2rem,1.7vw,1.55rem);font-weight:700} .svc-card--georgia{background-image:linear-gradient(160deg,#3a5570,#0f1a2b)} .svc-card--abroad{background-image:linear-gradient(160deg,#4a5a72,#141c2b)} /* Diamond element bridging the two cards */ .em-hero__diamond{position:absolute;left:50%;top:50%;width:90px;height:90px;transform:translate(-50%,-50%) rotate(45deg);border-radius:18px;background:linear-gradient(135deg,#ff5a4e,var(--c-red));box-shadow:0 18px 46px rgba(236,28,36,.5);display:grid;place-items:center;z-index:3;border:3px solid rgba(255,255,255,.16)} .em-hero__diamond svg{transform:rotate(-45deg);color:#fff;width:36px;height:36px} .js .em-hero__diamond{opacity:0;animation:em-dia 1s cubic-bezier(.16,1,.3,1) 1.7s forwards} @keyframes em-dia{0%{opacity:0;transform:translate(-50%,-50%) rotate(45deg) scale(.4)}100%{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1)}} @media (max-width:980px){ .em-hero{padding-top:112px} .em-hero__inner{grid-template-columns:1fr;gap:34px} .em-hero__cards{max-width:520px} } @media (max-width:820px){ .topbar__item--hide-md{display:none} .topbar__cta{padding:0 18px} } @media (max-width:520px){ .topbar__item--hide-sm{display:none} .svc-card__label{font-size:1.15rem} } /* ===================================================================== Container widths: header 1400, all other sections 1200 ===================================================================== */ body{padding:0 !important} .site-header .container{max-width:var(--container-wide)} /* Dark canvas behind the transparent header so no white ever shows at the top */ body.home-hero{background:#0a0e2a} /* Original logo: white over the dark hero, full-colour once the bar goes glass */ .brand__logo,.custom-logo{height:44px;width:auto;display:block} body.home-hero .site-header:not(.is-stuck) .brand__logo, body.home-hero .site-header:not(.is-stuck) .custom-logo{filter:brightness(0) invert(1)} /* ===================================================================== EM v4 — LIGHT hero: soft pastel gradient + dark, legible text ===================================================================== */ .em-hero{background:linear-gradient(155deg,#eaf1fd 0%,#f3edfb 48%,#fdeef2 100%)} .em-hero::after{display:none} .em-hero__stars{display:none} /* Pastel orbs — multiply on the light canvas for soft colour washes */ .orb{mix-blend-mode:multiply;opacity:.5;filter:blur(72px)} .orb--1{background:radial-gradient(circle at 40% 40%,#a9c6ff,transparent 68%)} .orb--2{background:radial-gradient(circle at 40% 40%,#d6c0ff,transparent 66%)} .orb--3{background:radial-gradient(circle at 40% 40%,#ffc2d6,transparent 66%)} .orb--4{background:radial-gradient(circle at 40% 40%,#bfe2ff,transparent 66%)} .orb--5{background:radial-gradient(circle at 40% 40%,#ffc9c9,transparent 68%);opacity:.38} /* Dark, high-contrast hero text */ .em-hero__title{color:var(--c-navy)} .em-hero__lead{color:#3c4457} .em-hero .em-label{color:var(--c-navy)} /* Light canvas behind the transparent header */ body.home-hero{background:#eaf1fd} /* Header contents go dark over the light hero */ body.home-hero .brand__text{color:var(--c-navy)} body.home-hero .brand__text strong{color:var(--c-red)} body.home-hero .nav-menu a{color:var(--c-navy)} body.home-hero .nav-menu a:hover,body.home-hero .nav-menu .current-menu-item>a{color:var(--c-brand);background:var(--c-bg-chip)} body.home-hero .nav-toggle{background:#fff;border-color:var(--c-line)} body.home-hero .nav-toggle span{background:var(--c-navy)} body.home-hero .navbar__cta{background:var(--c-red);border-color:transparent;color:#fff} body.home-hero .navbar__cta:hover{background:var(--c-red-dark);color:#fff} body.home-hero .site-header:not(.is-stuck) .brand__logo, body.home-hero .site-header:not(.is-stuck) .custom-logo{filter:none} /* Hero refinements: smaller title + lead, taller service cards */ .em-hero__title{font-size:clamp(2rem,4vw,3.2rem)} .em-hero__lead{font-size:.96rem;line-height:1.6} .svc-card{aspect-ratio:3/5} /* Keep the headline on a single line at desktop (two-column) widths */ @media (min-width:981px){ .em-hero__title{white-space:nowrap;font-size:clamp(1.4rem,2.9vw,2.4rem)} } /* ===================================================================== EM v5 — FULL-BLEED VIDEO HERO + header over video (FINAL / current) --------------------------------------------------------------------- Rebuilt hero: a muted, looping brand film (Batumi coast → clinical care → travel) sits behind a legibility scrim; the header floats transparently over it in white, then snaps to a white glass bar once scrolled. The hero section carries the `.em-hero--video` modifier, so every rule here out-specifies the earlier pastel-orb hero layers (v1–v4) and wins deterministically — no need to unpick the older blocks above. ===================================================================== */ /* ---- Header, transparent & white over the video (front page only) ---- */ body.home-hero{background:#0a0e2a} /* Contact strip → slim translucent glass over the film */ body.home-hero .site-header:not(.is-stuck) .topbar{ background:linear-gradient(180deg,rgba(6,12,30,.72),rgba(6,12,30,.30)); -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px); border-bottom:1px solid rgba(255,255,255,.08); } body.home-hero .site-header:not(.is-stuck) .topbar__item{color:#eaf1fb} body.home-hero .site-header:not(.is-stuck) .topbar__item:hover{color:#fff} body.home-hero .site-header:not(.is-stuck) .topbar__item svg{color:#ff8f93} /* Nav bar → fully transparent; white logo + white links */ body.home-hero .site-header:not(.is-stuck) .navbar{background:transparent;border-bottom-color:transparent} body.home-hero .site-header:not(.is-stuck) .brand__logo, body.home-hero .site-header:not(.is-stuck) .custom-logo{filter:brightness(0) invert(1)} body.home-hero .site-header:not(.is-stuck) .nav-menu a{color:rgba(255,255,255,.9)} body.home-hero .site-header:not(.is-stuck) .nav-menu a:hover, body.home-hero .site-header:not(.is-stuck) .nav-menu .current-menu-item>a, body.home-hero .site-header:not(.is-stuck) .nav-menu .current_page_item>a{color:#fff;background:rgba(255,255,255,.14)} body.home-hero .site-header:not(.is-stuck) .nav-toggle{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.34)} body.home-hero .site-header:not(.is-stuck) .nav-toggle span{background:#fff} body.home-hero .site-header:not(.is-stuck) .navbar__cta{background:var(--c-red);border-color:transparent;color:#fff;box-shadow:0 8px 20px rgba(236,28,36,.30)} body.home-hero .site-header:not(.is-stuck) .navbar__cta:hover{background:var(--c-red-dark);color:#fff} /* The mobile nav drawer is a solid white panel — keep its links dark on the home hero (the white-over-video colour would be invisible), and give the open X button a light surface so it stays legible above the drawer. */ @media (max-width:860px){ body.home-hero .site-header:not(.is-stuck) .primary-nav .nav-menu a{color:var(--c-navy)} body.home-hero .site-header:not(.is-stuck) .primary-nav .nav-menu a:hover, body.home-hero .site-header:not(.is-stuck) .primary-nav .nav-menu .current-menu-item>a, body.home-hero .site-header:not(.is-stuck) .primary-nav .nav-menu .current_page_item>a{color:var(--c-brand);background:var(--c-bg-chip)} /* Lift the header (and its drawer) above the dim overlay so the panel reads as solid white and the X stays tappable. */ body.nav-open .site-header{z-index:120} .nav-toggle{position:relative;z-index:130} body.home-hero.nav-open .site-header:not(.is-stuck) .nav-toggle{background:#fff;border-color:var(--c-line)} body.home-hero.nav-open .site-header:not(.is-stuck) .nav-toggle span{background:var(--c-navy)} } /* ---- Hero shell ---- */ .em-hero--video{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden; background:#0a0e2a;color:#fff;padding:clamp(140px,20vh,210px) 0 clamp(96px,14vh,140px)} .em-hero--video::after, .em-hero--video .em-hero__media::after, .em-hero--video .em-hero__media::before{display:none} /* neutralise older ::after/::before overlays */ /* Media layer: poster background (always painted) + looping video on top */ .em-hero__media{position:absolute;inset:0;z-index:0;overflow:hidden;background:#0a0e2a center/cover no-repeat} .em-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;transform:scale(1.03)} .em-hero__scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background: linear-gradient(90deg,rgba(5,11,28,.90) 0%,rgba(5,11,28,.66) 34%,rgba(5,11,28,.34) 64%,rgba(5,11,28,.15) 100%), linear-gradient(180deg,rgba(5,11,28,.58) 0%,rgba(5,11,28,0) 22%,rgba(5,11,28,.10) 56%,rgba(5,11,28,.82) 100%)} .em-hero--video .em-hero__inner{position:relative;z-index:2;width:100%;display:block} .em-hero__content{max-width:680px} /* Eyebrow badge */ .em-hero__badge{display:inline-flex;align-items:center;gap:10px; background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24); -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px); color:#fff;font-weight:600;font-size:.82rem;padding:8px 16px;border-radius:var(--r-pill)} .em-hero__badge .dot{width:8px;height:8px;flex:none;border-radius:50%;background:var(--c-red);box-shadow:0 0 0 0 rgba(236,28,36,.7);animation:pulse 1.8s infinite} /* Title */ .em-hero--video .em-hero__title{color:#fff;font-weight:600; font-size:clamp(2.4rem,5.4vw,4.7rem);line-height:1.05;letter-spacing:-.03em; white-space:normal;max-width:16ch;margin:22px 0 20px;padding-bottom:.08em; text-shadow:0 2px 34px rgba(0,0,0,.40)} .em-hero--video .em-hero__title .hl{color:#8fc2ff} /* Lead */ .em-hero--video .em-hero__lead{color:rgba(233,240,251,.92);font-size:clamp(1.02rem,1.35vw,1.18rem); line-height:1.62;max-width:54ch;margin:0 0 32px;text-shadow:0 1px 18px rgba(0,0,0,.34)} /* CTAs */ .em-hero--video .em-hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin:0 0 32px} .em-hero__cta .btn svg{width:18px;height:18px;flex:none} /* Trust row */ .em-hero__trust{display:flex;align-items:center;gap:13px;flex-wrap:wrap} .em-trust__stars{color:#ffc24b;letter-spacing:3px;font-size:1.02rem;text-shadow:0 1px 10px rgba(0,0,0,.4)} .em-trust__label{color:rgba(233,240,251,.9);font-size:.95rem} .em-trust__label strong{color:#fff;font-weight:700} /* Scroll cue */ .em-hero__scroll{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:2; display:inline-flex;flex-direction:column;align-items:center;gap:9px; color:rgba(255,255,255,.8);font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase} .em-hero__scroll:hover{color:#fff} .em-hero__scroll .chev{width:28px;height:28px;border:1px solid rgba(255,255,255,.4);border-radius:50%; display:grid;place-items:center;animation:em-bounce 1.8s ease-in-out infinite} .em-hero__scroll .chev svg{width:14px;height:14px} @keyframes em-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}} @media (max-width:820px){ .em-hero--video{min-height:90svh;padding:clamp(120px,20vh,160px) 0 92px} .em-hero__content{max-width:100%} .em-hero--video .em-hero__title{font-size:clamp(2.1rem,8.6vw,3.2rem);max-width:18ch} } @media (max-width:520px){ .em-hero__scroll{display:none} } /* Reduced motion: hold on the poster, drop the entrance choreography */ @media (prefers-reduced-motion:reduce){ .em-hero__video{display:none} .em-hero--video .em-load{animation:none;opacity:1;transform:none} .js .em-hero--video .em-hero__title>span{animation:none;transform:none} .em-hero__scroll .chev,.em-hero__badge .dot{animation:none} } /* ===================================================================== EM v6 — Google Sans type · quiet squared buttons · nav-left header with language switcher · hero service buttons · line-mask motion primitives (FINAL layer — supersedes button/header/hover styling above) ===================================================================== */ /* ---- Buttons: squared, calm, one confident fill-sweep on hover ---------- No upward lift, no shadow bounce. A pseudo wipes in from the bottom on a long ease while the label rides above it. Applies to every .btn variant. */ .btn{position:relative;overflow:hidden;isolation:isolate; border-radius:9px;gap:9px;padding:14px 26px;font-size:.95rem;font-weight:600;letter-spacing:.005em; transition:color .45s cubic-bezier(.16,1,.3,1),border-color .45s ease} .btn::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateY(101%); transition:transform .55s cubic-bezier(.19,1,.22,1)} .btn:hover::before{transform:translateY(0)} .btn:hover{transform:none} .btn:active{transform:scale(.985)} .btn--lg{padding:16px 30px;font-size:1rem} .btn svg{transition:transform .45s cubic-bezier(.16,1,.3,1)} .btn:hover svg{transform:translateX(3px)} .btn--red{background:var(--c-red);color:#fff;box-shadow:none} .btn--red::before{background:var(--c-navy)} .btn--red:hover{color:#fff} .btn--primary{background:var(--c-brand);color:#fff;box-shadow:none} .btn--primary::before{background:var(--c-navy)} .btn--primary:hover{color:#fff} .btn--navy{background:var(--c-navy);color:#fff;box-shadow:none} .btn--navy::before{background:var(--c-red)} .btn--navy:hover{color:#fff} .btn--glass{background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} .btn--glass::before{background:#fff} .btn--glass:hover{color:var(--c-navy);border-color:#fff} .btn--ghost{background:#fff;color:var(--c-navy);border:1px solid var(--c-line)} .btn--ghost::before{background:var(--c-navy)} .btn--ghost:hover{color:#fff;border-color:var(--c-navy)} .btn--outline{background:transparent;color:var(--c-navy);border:1px solid var(--c-line)} .btn--outline::before{background:var(--c-navy)} .btn--outline:hover{color:#fff;border-color:var(--c-navy)} .btn--onnavy{background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.3)} .btn--onnavy::before{background:#fff} .btn--onnavy:hover{color:var(--c-navy)} .btn--soft{background:#d8e9ff;color:var(--c-navy);box-shadow:none} .btn--soft::before{background:#fff} .btn--soft:hover{color:var(--c-navy)} .btn--light{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.32)} .btn--light::before{background:#fff} .btn--light:hover{color:var(--c-navy)} .btn--emergency{background:var(--c-red);color:#fff;padding:13px 22px} .btn--emergency::before{background:var(--c-navy)} .btn--emergency:hover{color:#fff} /* ---- Header: logo · nav (left) · … · lang switcher · CTA (right) --------- */ .navbar__inner{gap:clamp(20px,2.4vw,38px);min-height:70px} .brand{flex:none} .brand__logo,.custom-logo{height:40px} .primary-nav{margin-left:0} .nav-menu{gap:clamp(18px,1.9vw,30px)} .nav-menu a{position:relative;display:inline-block;padding:6px 0;font-size:.9rem;font-weight:500;color:var(--c-navy);background:none;border-radius:0} .nav-menu a::after{content:"";position:absolute;left:0;bottom:-1px;height:1.5px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.16,1,.3,1)} .nav-menu a:hover::after,.nav-menu .current-menu-item>a::after,.nav-menu .current_page_item>a::after{transform:scaleX(1)} .nav-menu a:hover,.nav-menu .current-menu-item>a,.nav-menu .current_page_item>a{background:none;color:var(--c-brand)} .nav-menu .sub-menu a::after{display:none} .navbar__actions{margin-left:auto;display:flex;align-items:center;gap:clamp(12px,1.4vw,20px)} .navbar__cta{margin-left:0;padding:12px 22px;font-size:.9rem} /* Language switcher (globe · code · chevron) sits left of the CTA */ .lang-switch{position:relative;display:inline-flex;align-items:center;gap:7px;font-size:.86rem;font-weight:500;color:var(--c-navy);cursor:pointer;padding:8px 2px;background:none;border:0} .lang-switch__globe{width:18px;height:18px;flex:none} .lang-switch__cur{letter-spacing:.03em} .lang-switch__chev{width:11px;height:11px;flex:none;opacity:.55;transition:transform .35s cubic-bezier(.16,1,.3,1)} .lang-switch:hover .lang-switch__chev,.lang-switch:focus-within .lang-switch__chev{transform:rotate(180deg)} .lang-switch__menu{position:absolute;top:calc(100% + 12px);right:0;min-width:132px;list-style:none;background:#fff;border:1px solid var(--c-line);border-radius:12px;box-shadow:var(--sh);padding:6px;margin:0;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .28s ease,transform .28s cubic-bezier(.16,1,.3,1),visibility .28s;z-index:60} .lang-switch:hover .lang-switch__menu,.lang-switch:focus-within .lang-switch__menu{opacity:1;visibility:visible;transform:none} .lang-switch__menu a{display:block;padding:9px 13px;border-radius:8px;font-size:.86rem;color:var(--c-navy)} .lang-switch__menu a::after{display:none} .lang-switch__menu a:hover,.lang-switch__menu a.is-active{background:var(--c-bg-chip);color:var(--c-brand)} /* Header state colours over the video (white) — underline replaces the pill */ body.home-hero .site-header:not(.is-stuck) .nav-menu a{color:rgba(255,255,255,.92);background:none} body.home-hero .site-header:not(.is-stuck) .nav-menu a:hover, body.home-hero .site-header:not(.is-stuck) .nav-menu .current-menu-item>a, body.home-hero .site-header:not(.is-stuck) .nav-menu .current_page_item>a{color:#fff;background:none} body.home-hero .site-header:not(.is-stuck) .lang-switch{color:#fff} body.home-hero .site-header:not(.is-stuck) .lang-switch__chev{opacity:.8} /* Stuck state: navy links, brand-blue underline, no chip */ body.home-hero .site-header.is-stuck .nav-menu a:hover, body.home-hero .site-header.is-stuck .nav-menu .current-menu-item>a, body.home-hero .site-header.is-stuck .nav-menu .current_page_item>a{color:var(--c-brand);background:none} /* ---- Hero: two service buttons beneath the primary CTA ------------------- */ .em-hero__services{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 30px} .svc-btn{position:relative;display:inline-flex;align-items:center;gap:10px;overflow:hidden;isolation:isolate; padding:12px 20px;border-radius:9px;font-size:.92rem;font-weight:500;color:#fff; background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.26); -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px); transition:color .45s cubic-bezier(.16,1,.3,1),border-color .45s ease} .svc-btn::before{content:"";position:absolute;inset:0;z-index:-1;background:#fff;transform:translateY(101%);transition:transform .5s cubic-bezier(.19,1,.22,1)} .svc-btn:hover{color:var(--c-navy);border-color:#fff} .svc-btn:hover::before{transform:translateY(0)} .svc-btn__ico{width:16px;height:16px;flex:none;opacity:.85;transition:transform .45s cubic-bezier(.16,1,.3,1)} .svc-btn:hover .svc-btn__ico{transform:translateX(4px);opacity:1} /* ---- Motion primitives: per-word line mask (built by JS when GSAP loads) -- */ .split-line{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.02em} .split-line__i{display:inline-block} /* Hidden-until-JS states (gated on .js so a paint never flashes). JS reveals them via GSAP, or a fallback makes them visible if GSAP fails to load. */ .js [data-split],.js [data-split-load]{opacity:0} .js .em-hero--video [data-hero]{opacity:0} /* Neutralise the older CSS load animation/`display:block` on the video-hero title — its direct-child spans are now per-word masks and must stay inline. */ .em-hero--video .em-hero__title>span{animation:none;display:inline-block;transform:none} .split-line,.em-hero--video .em-hero__title>span.split-line{display:inline-block} /* Drawer footer (lang + CTA) — only rendered inside the mobile drawer */ .nav-extra{display:none} .lang-inline{display:flex;gap:8px} .lang-inline a{padding:8px 14px;border-radius:8px;font-size:.9rem;font-weight:500;color:var(--c-navy);border:1px solid var(--c-line)} .lang-inline a.is-active{background:var(--c-navy);color:#fff;border-color:var(--c-navy)} @media (max-width:860px){ /* Restore comfortable tap targets + drop the underline in the drawer */ .nav-menu a{padding:12px 14px;font-size:1rem} .nav-menu a::after{display:none} .navbar__actions{display:none} /* desktop lang + CTA hidden on mobile */ .nav-extra{display:flex;flex-direction:column;gap:18px;margin-top:24px;padding-top:22px;border-top:1px solid var(--c-line)} .nav-extra .btn{justify-content:center;width:100%} .nav-extra .lang-inline a::after{display:none} } /* ===================================================================== EM v7 — hero eyebrow (no wrapper) · header call icon · refined button hover · bigger pre-scroll logo · no-underline nav · video parallax · About insurer strip · "Our Services" bento (FINAL layer) ===================================================================== */ :root{ --c-red-deep:#a90f18; } /* ---- Hero eyebrow: text directly on the video, no pill wrapper -------- */ .em-hero__badge{ background:none;border:0;padding:0;-webkit-backdrop-filter:none;backdrop-filter:none; color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase; text-shadow:0 1px 12px rgba(0,0,0,.4)} .em-hero__badge .dot{width:7px;height:7px} /* ---- Refined button hover: sweep to a deep in-family red (no navy) ---- */ .btn--red::before{background:var(--c-red-deep)} .btn--navy::before{background:#17305f} .navbar__call::before,.navbar__call:hover::before{background:var(--c-red-deep)} /* ---- Header: circular "request a call" icon button (top right) -------- */ .navbar__call{position:relative;overflow:hidden;isolation:isolate;flex:none; width:46px;height:46px;border-radius:50%;display:grid;place-items:center; background:var(--c-red);color:#fff;border:0;cursor:pointer; box-shadow:0 8px 20px rgba(236,28,36,.28);transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s} .navbar__call::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateY(101%);transition:transform .5s cubic-bezier(.19,1,.22,1)} .navbar__call:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(236,28,36,.38)} .navbar__call:hover::before{transform:translateY(0)} .navbar__call svg{width:20px;height:20px} /* ---- Bigger logo before scroll, shrinks when stuck ------------------- */ .brand__logo,.custom-logo{transition:height .35s cubic-bezier(.16,1,.3,1)} body.home-hero .site-header:not(.is-stuck) .brand__logo, body.home-hero .site-header:not(.is-stuck) .custom-logo{height:58px} .site-header.is-stuck .brand__logo,.site-header.is-stuck .custom-logo{height:40px} /* ---- Nav: no underline — a quiet colour/opacity shift on hover -------- */ .nav-menu a{transition:color .25s ease,opacity .25s ease} .nav-menu a::after{display:none !important} .nav-menu a:hover,.nav-menu .current-menu-item>a,.nav-menu .current_page_item>a{color:var(--c-brand);background:none} body.home-hero .site-header:not(.is-stuck) .nav-menu a{color:rgba(255,255,255,.82)} body.home-hero .site-header:not(.is-stuck) .nav-menu a:hover, body.home-hero .site-header:not(.is-stuck) .nav-menu .current-menu-item>a, body.home-hero .site-header:not(.is-stuck) .nav-menu .current_page_item>a{color:#fff} /* ---- Hero video parallax: overscan so the drift never reveals edges --- */ .em-hero__video{transform:scale(1.2);will-change:transform} /* ---- About: insurance-partner strip ---------------------------------- */ .about-insurers{margin-top:clamp(30px,4vw,48px);padding-top:clamp(26px,3vw,36px);border-top:1px solid var(--c-line)} .about-insurers__label{display:block;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted);margin-bottom:18px} .insurer-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:14px} .insurer-tile{height:clamp(74px,7.5vw,92px);overflow:hidden;background:#fff;border:1px solid var(--c-line);border-radius:16px;display:grid;place-items:center;padding:12px;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s} .insurer-tile:hover{transform:translateY(-4px);box-shadow:var(--sh);border-color:transparent} .insurer-tile img{height:clamp(40px,4.4vw,54px);width:auto;max-width:88%;object-fit:contain} /* ---- "Our Services" — bento in the reference (Polyroc) style ---------- */ .svc-section{background:linear-gradient(180deg,#fff 0%,var(--c-paper) 100%)} .svc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(26px,3.4vw,44px)} .svc-head__l .gc-pill{margin-bottom:14px} .svc-head__l h2{margin:0} .svc-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.6vw,22px)} .svc-cardx--a{grid-column:1;grid-row:1} .svc-cardx--b{grid-column:2;grid-row:1} .svc-cardx--c{grid-column:3;grid-row:1 / span 2} .svc-cardx--d{grid-column:1 / span 2;grid-row:2} .svc-cardx{position:relative;overflow:hidden;display:flex;flex-direction:column; background:#fff;border:1px solid var(--c-line);border-radius:26px;padding:clamp(22px,2.2vw,30px); min-height:230px;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s,border-color .45s} .svc-cardx:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);border-color:transparent} .svc-cardx--c,.svc-cardx--d{background: radial-gradient(120% 90% at 90% 0%,rgba(57,143,252,.14),transparent 60%), radial-gradient(120% 120% at 0% 100%,rgba(236,28,36,.08),transparent 55%),#fff} .svc-cardx--c{min-height:100%} .svc-cardx__tag{align-self:flex-start;font-size:.74rem;font-weight:600;letter-spacing:.02em;color:var(--c-brand);background:var(--c-bg-chip);padding:6px 13px;border-radius:var(--r-pill);margin-bottom:16px} .svc-cardx h3{color:var(--c-navy);font-size:clamp(1.18rem,1.5vw,1.5rem);margin:0 0 8px;letter-spacing:-.01em} .svc-cardx p{color:var(--c-muted);font-size:.96rem;margin:0 0 20px;max-width:34ch} .svc-cardx__link{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:var(--c-navy);font-weight:600;font-size:.94rem} .svc-cardx__link svg{width:18px;height:18px;transition:transform .4s cubic-bezier(.16,1,.3,1)} .svc-cardx:hover .svc-cardx__link svg{transform:translateX(5px)} .svc-cardx__link:hover{color:var(--c-brand)} /* 3D-icon illustration slot: gradient placeholder + line-icon until the PNG is dropped in. The hides itself (onerror) when the PNG is missing. */ .svc-ill{position:relative;align-self:flex-start;width:clamp(72px,7vw,104px);aspect-ratio:1;border-radius:22px; margin-bottom:auto;display:grid;place-items:center; background:linear-gradient(150deg,#eaf2ff,#dbe8fb);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 10px 24px rgba(8,24,58,.08)} .svc-cardx--a .svc-ill{background:linear-gradient(150deg,#e7f0ff,#d4e6ff)} .svc-cardx--b .svc-ill{background:linear-gradient(150deg,#eaf7ee,#d6ecdf)} .svc-cardx--c .svc-ill{background:linear-gradient(150deg,#fdeef0,#f8dfe3)} .svc-cardx--d .svc-ill{background:linear-gradient(150deg,#fff4e6,#ffe6cc)} .svc-cardx--c .svc-ill,.svc-cardx--d .svc-ill{width:clamp(84px,8vw,120px)} .svc-ill__ph{width:50%;height:50%;color:var(--c-navy);opacity:.55} .svc-ill__img{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain;filter:drop-shadow(0 8px 16px rgba(8,24,58,.18))} @media (max-width:900px){ .svc-bento{grid-template-columns:1fr 1fr} .svc-cardx--a{grid-column:1;grid-row:1} .svc-cardx--b{grid-column:2;grid-row:1} .svc-cardx--c{grid-column:1;grid-row:2} .svc-cardx--d{grid-column:2;grid-row:2} .insurer-strip{grid-template-columns:repeat(3,1fr)} } @media (max-width:600px){ .svc-bento{grid-template-columns:1fr} .svc-cardx--a,.svc-cardx--b,.svc-cardx--c,.svc-cardx--d{grid-column:1;grid-row:auto} .insurer-strip{grid-template-columns:repeat(2,1fr)} .navbar__call{width:42px;height:42px} } /* Reduced motion: no video parallax drift */ @media (prefers-reduced-motion:reduce){ .em-hero__video{transform:scale(1.06)} } /* Mobile: keep the call icon in the header (left of the hamburger); the language switcher stays in the drawer. */ @media (max-width:860px){ .navbar__actions{display:flex;order:2;margin-left:auto;gap:10px} .navbar__actions .lang-switch{display:none} .nav-toggle{order:3;margin-left:10px} } /* ===================================================================== EM v8 — richer "Our Services" bento: each card a filled composition (floating chips, network nodes, insurer mockup panel, destination cards) ===================================================================== */ .svc-bento{grid-template-rows:auto auto} .svc-cardx{--pad:clamp(22px,2vw,30px);padding:var(--pad);gap:0;min-height:360px} .svc-cardx--d{min-height:300px} .svc-cardx--a,.svc-cardx--b,.svc-cardx--c{flex-direction:column} .svc-cardx--d{flex-direction:row;align-items:stretch;gap:clamp(18px,2.4vw,40px)} .svc-cardx__body{display:flex;flex-direction:column;align-items:flex-start} .svc-cardx__body h3{margin:0 0 8px} .svc-cardx__body p{margin:0 0 16px} .svc-cardx__link{margin-top:auto} /* Bleeding visual panel pinned to the card's rounded bottom */ .svc-viz{position:relative;overflow:hidden;margin:auto calc(-1*var(--pad)) calc(-1*var(--pad));margin-top:20px} .svc-viz__icon{filter:drop-shadow(0 12px 20px rgba(8,24,58,.22));pointer-events:none} .svc-chip{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px); border:1px solid rgba(8,24,58,.06);color:var(--c-navy);font-size:.8rem;font-weight:500;padding:8px 13px;border-radius:var(--r-pill);box-shadow:0 6px 14px rgba(8,24,58,.08)} .svc-chip .d{width:6px;height:6px;border-radius:50%;background:var(--c-brand)} /* A — Services in Georgia: 3D icon + floating service chips over a blue wash */ .svc-viz--pills{min-height:170px;padding:20px;background:radial-gradient(120% 120% at 100% 100%,#cfe1ff,#e9f2ff);display:flex;flex-wrap:wrap;gap:9px;align-content:flex-start} .svc-viz--pills .svc-viz__icon{position:absolute;right:14px;bottom:2px;width:118px;height:118px;object-fit:contain} .svc-viz--pills .svc-chip:nth-child(4){margin-left:20px} /* B — Services Abroad: globe with orbiting destination nodes + dashed ring */ .svc-viz--globe{min-height:170px;background:radial-gradient(120% 120% at 0% 100%,#d6f0e0,#eafaf1);display:grid;place-items:center} .svc-viz--globe::before{content:"";position:absolute;width:180px;height:180px;border:1.5px dashed rgba(31,123,238,.35);border-radius:50%} .svc-viz--globe .svc-viz__icon{width:126px;height:126px;object-fit:contain;position:relative} .svc-node{position:absolute;background:#fff;border:1px solid var(--c-line);border-radius:var(--r-pill);padding:6px 11px;font-size:.75rem;font-weight:600;color:var(--c-navy);box-shadow:0 6px 14px rgba(8,24,58,.1)} .svc-node--1{top:16px;left:18px} .svc-node--2{bottom:18px;left:30px} .svc-node--3{top:30px;right:16px} /* C — Cooperation: insurer mockup panel + shield + wave, filling the tall card */ .svc-cardx--c{padding-bottom:0} .ins-mock{background:#fff;border:1px solid var(--c-line);border-radius:16px;box-shadow:0 12px 30px rgba(8,24,58,.08);padding:14px;margin-bottom:20px} .ins-mock__bar{display:flex;gap:5px;margin-bottom:12px} .ins-mock__bar span{width:8px;height:8px;border-radius:50%;background:var(--c-line)} .ins-mock__bar span:first-child{background:#ff6b6b} .ins-mock__label{display:flex;align-items:center;gap:7px;font-size:.78rem;font-weight:600;color:var(--c-muted);margin-bottom:12px} .ins-mock__label .live{width:7px;height:7px;border-radius:50%;background:#39c26b;box-shadow:0 0 0 0 rgba(57,194,107,.5);animation:pulse 1.8s infinite} .ins-mock__logos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px} .ins-mock__logos .t{height:46px;background:#fff;border:1px solid var(--c-line);border-radius:10px;display:grid;place-items:center;padding:8px} .ins-mock__logos .t img{max-height:100%;max-width:100%;width:auto;object-fit:contain} .svc-cardx--c .svc-shield{align-self:center;width:clamp(110px,10vw,150px);height:auto;margin:6px 0 18px;filter:drop-shadow(0 16px 26px rgba(8,24,58,.22))} .svc-cardx--c .svc-cardx__body{margin-top:auto} .svc-wave{position:absolute;left:0;right:0;bottom:0;width:100%;height:90px;z-index:0} .svc-cardx--c>.ins-mock,.svc-cardx--c>.svc-shield,.svc-cardx--c>.svc-cardx__body{position:relative;z-index:1} .ins-mock__logos .t--more{font-size:.72rem;font-weight:600;color:var(--c-muted);border-style:dashed} /* D — Medical Tourism: copy left, suitcase + destination cards right */ .svc-cardx--d{background: radial-gradient(120% 120% at 100% 0%,rgba(255,183,94,.20),transparent 55%), radial-gradient(120% 120% at 0% 100%,rgba(57,143,252,.12),transparent 55%),#fff} .svc-cardx--d .svc-cardx__body{flex:1 1 46%;justify-content:center} .svc-viz--dest{flex:1 1 54%;border-radius:20px;background:radial-gradient(120% 120% at 80% 20%,#fff0dc,#ffe4c4); display:grid;place-items:center;min-height:200px;margin:calc(-1*var(--pad)) calc(-1*var(--pad)) calc(-1*var(--pad)) 0;border-top-left-radius:0;border-bottom-left-radius:0} .svc-viz--dest .svc-viz__icon{width:clamp(120px,13vw,168px);height:auto;object-fit:contain;position:relative} .svc-dest{position:absolute;display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px); border:1px solid rgba(8,24,58,.06);border-radius:var(--r-pill);padding:7px 13px;font-size:.8rem;font-weight:600;color:var(--c-navy);box-shadow:0 8px 18px rgba(8,24,58,.12)} .svc-dest .f{font-size:1rem;line-height:1} .svc-dest--1{top:20px;left:16px} .svc-dest--2{top:64px;right:14px} .svc-dest--3{bottom:56px;left:12px} .svc-dest--4{bottom:18px;right:20px} .btn--tiny{padding:11px 18px;font-size:.86rem} @media (max-width:900px){ .svc-cardx{min-height:320px} .svc-cardx--d{flex-direction:column} .svc-viz--dest{margin:20px calc(-1*var(--pad)) calc(-1*var(--pad));border-radius:0;min-height:220px} .ins-mock__logos{grid-template-columns:repeat(5,1fr)} } @media (max-width:600px){ .svc-cardx{min-height:0} .ins-mock__logos{grid-template-columns:repeat(3,1fr)} .svc-viz--pills .svc-viz__icon{width:96px;height:96px} } /* ===================================================================== EM v9 — services polish: no eyebrow tags · one continuous gradient per card (no split) · bigger 3D icons · soft/spread shadow + gentle tilt on hover · compact chips · circle flags ===================================================================== */ .svc-cardx__tag{display:none} /* One smooth gradient across the whole card (tint → white, no 2-part split) */ .svc-cardx--a{background:linear-gradient(180deg,#fff 15%,#dbe8ff 100%)} .svc-cardx--b{background:linear-gradient(180deg,#fff 15%,#d6f0e1 100%)} .svc-cardx--c{background:linear-gradient(180deg,#fff 32%,#fce3e7 100%)} .svc-cardx--d{background:linear-gradient(108deg,#fff 34%,#ffe6cc 100%)} /* Softer, far more spread + blurred shadow; gentle scale + tilt on hover */ .svc-cardx{transition:transform .55s cubic-bezier(.16,1,.3,1),box-shadow .6s ease,border-color .45s} .svc-cardx:hover{transform:scale(1.025) rotate(-1deg); box-shadow:0 46px 100px -34px rgba(8,24,58,.24), 0 20px 60px rgba(8,24,58,.06); border-color:transparent} .svc-cardx--d:hover{transform:scale(1.02) rotate(-.5deg)} .svc-cardx .svc-viz__icon{transition:transform .55s cubic-bezier(.16,1,.3,1)} .svc-cardx:hover .svc-viz__icon{transform:scale(1.06) rotate(2deg)} /* Visuals sit directly on the card gradient — drop the separate panels */ .svc-viz{overflow:visible} .svc-viz--pills,.svc-viz--globe,.svc-viz--dest{background:none} .svc-viz--dest{margin:0;min-height:210px} .svc-cardx--d{align-items:center} /* Bigger 3D icons */ .svc-viz--pills .svc-viz__icon{width:clamp(124px,13vw,172px);height:auto;right:4px;bottom:-8px} .svc-viz--globe .svc-viz__icon{width:clamp(132px,14vw,180px);height:auto} .svc-viz--globe::before{width:200px;height:200px} .svc-cardx--c .svc-shield{width:clamp(146px,14vw,200px)} .svc-viz--dest .svc-viz__icon{width:clamp(152px,16vw,216px);height:auto} /* Compact chips */ .svc-chip{padding:5px 12px;font-size:.78rem;gap:6px;font-weight:600} .svc-chip .d{width:5px;height:5px} /* Destination cards with circle flags */ .svc-dest{padding:5px 13px 5px 6px;gap:8px} .svc-dest__flag{width:22px;height:22px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 1px rgba(8,24,58,.06),0 3px 6px rgba(8,24,58,.12)} @media (max-width:600px){ .svc-viz--pills .svc-viz__icon{width:118px} .svc-cardx:hover{transform:scale(1.012) rotate(-.4deg)} } /* Georgia card: let the chips layer above the (now bigger) icon, like the reference's tags-over-photo — so any overlap reads as intentional. */ .svc-viz--pills .svc-viz__icon{z-index:1} .svc-viz--pills .svc-chip{position:relative;z-index:2} /* ===================================================================== EM v10 — services round 2: frosted pills · lighter+smooth hover · cleaner Cooperation card · consistent "//" eyebrow · navy stats divider ===================================================================== */ /* Frosted, translucent floating pills (less stark than solid white) */ .svc-chip,.svc-node,.svc-dest{ background:rgba(255,255,255,.5); -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%); border:1px solid rgba(255,255,255,.55);box-shadow:0 6px 16px rgba(8,24,58,.05)} .svc-chip{color:var(--c-navy)} /* Hover fix: the [data-reveal] transition used to strip box-shadow, and .is-visible{transform:none} out-specified :hover — so the tilt never ran and the shadow snapped in. Re-assert both here, lighter + smooth. */ .js [data-reveal].svc-cardx,.svc-section .svc-cardx{ transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .55s cubic-bezier(.16,1,.3,1),box-shadow .55s ease} .svc-cardx{box-shadow:0 6px 24px rgba(8,24,58,.05)} .svc-section .svc-cardx:hover{transform:scale(1.02) rotate(-.7deg); box-shadow:0 30px 64px -26px rgba(8,24,58,.15),0 10px 26px rgba(8,24,58,.04);border-color:transparent} .svc-section .svc-cardx--d:hover{transform:scale(1.014) rotate(-.4deg)} /* Consistent "// SERVICES" eyebrow (matches About) */ .svc-head__l .em-label{display:block;margin-bottom:14px} /* Cleaner Cooperation card: no wave, small uniform logos, tidy spacing */ .svc-wave{display:none} .svc-cardx--c{padding-bottom:var(--pad)} .ins-mock{padding:13px 13px 15px;border-radius:14px;box-shadow:0 14px 34px rgba(8,24,58,.10)} .ins-mock__label{margin-bottom:11px;font-size:.76rem} .ins-mock__logos{gap:7px} .ins-mock__logos .t{height:42px;padding:8px;border-radius:9px;background:#fff;border-color:#eef2f8} .ins-mock__logos .t img{height:17px;width:auto;max-width:92%;object-fit:contain} .ins-mock__logos .t--more{font-size:.68rem} .svc-cardx--c .svc-shield{width:clamp(118px,11vw,156px);margin:16px 0 20px} /* Navy stats band — the divider between About and Services */ .stats-band{background:linear-gradient(120deg,#0a1d46,#08183a 62%,#0a1731);color:#fff;padding:clamp(46px,6vw,80px) 0} .stats-row--band{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,32px);margin:0;padding:0;border:0;text-align:center} .stats-row--band>div{position:relative;padding:4px 10px} .stats-row--band>div+div::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:1px;background:rgba(255,255,255,.14)} .stats-band .stat-b__num{color:#fff;font-size:clamp(2rem,3.4vw,3rem)} .stats-band .stat-b__label{color:#9fb3d6;font-weight:500;margin-top:9px} @media (max-width:700px){ .stats-row--band{grid-template-columns:1fr 1fr;gap:28px 16px} .stats-row--band>div+div::before{display:none} } /* ===================================================================== EM v11 — service cards: 12px radius, shadow-only hover (no card scale) ===================================================================== */ .svc-cardx{border-radius:12px} .ins-mock{border-radius:10px} .svc-section .svc-cardx:hover,.svc-section .svc-cardx--d:hover{transform:none} .svc-cardx:hover .svc-viz__icon{transform:scale(1.05) rotate(2deg)} /* icon still reacts */ /* ===================================================================== EM v12 — lighter card gradients · smaller 2-line About heading · tighter ===================================================================== */ .svc-cardx--a{background:linear-gradient(180deg,#fff 22%,#e9f1ff 100%)} .svc-cardx--b{background:linear-gradient(180deg,#fff 22%,#e8f7ef 100%)} .svc-cardx--c{background:linear-gradient(180deg,#fff 40%,#fdedf0 100%)} .svc-cardx--d{background:linear-gradient(108deg,#fff 42%,#fff1e2 100%)} /* About heading: smaller so it fits on two lines, and less space after it */ .em-about__h{font-size:clamp(1.65rem,3.2vw,2.6rem);max-width:34ch;line-height:1.14} .em-about{padding-bottom:clamp(38px,5vw,76px)} /* ===================================================================== EM v13 — About heading: bigger again, break controlled ("or abroad" starts line 2 via
), natural wrap on small screens ===================================================================== */ .em-about__h{font-size:clamp(2rem,4.3vw,3.5rem);max-width:none;line-height:1.12} @media (max-width:640px){ .em-about__h{font-size:clamp(1.7rem,6.5vw,2.4rem)} .em-about__br{display:none} /* let it wrap naturally on mobile */ } /* ===================================================================== EM v14 — Testimonials (replaces "What We Do"): bento of review cards with a photo-featured centre card + carousel controls ===================================================================== */ .rv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:clamp(24px,4vw,56px);flex-wrap:wrap;margin-bottom:clamp(28px,3.6vw,46px)} .rv-head__l .em-label{display:block;margin-bottom:14px} .rv-head__l h2{margin:0;max-width:16ch} .rv-head__sub{color:var(--c-muted);max-width:42ch;font-size:1.02rem;line-height:1.6;margin:0 0 6px} .rv-bento{position:relative;display:grid;grid-template-columns:1fr 1.12fr 1fr;grid-auto-rows:1fr;gap:clamp(14px,1.5vw,20px)} .rv-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-line);border-radius:16px; padding:clamp(20px,1.8vw,26px);box-shadow:0 6px 24px rgba(8,24,58,.04);transition:opacity .22s ease,box-shadow .4s ease,border-color .4s ease} .rv-card:hover{box-shadow:0 16px 40px rgba(8,24,58,.09);border-color:transparent} .rv-card--tl{grid-column:1;grid-row:1} .rv-card--bl{grid-column:1;grid-row:2} .rv-card--tr{grid-column:3;grid-row:1} .rv-card--br{grid-column:3;grid-row:2} .rv-qmark{display:block;font-family:Georgia,"Times New Roman",serif;font-size:2.8rem;line-height:.9;height:.55em;color:var(--c-navy);opacity:.9} .rv-card__text{color:var(--c-ink);font-size:.97rem;line-height:1.56;margin:16px 0 20px} .rv-card__foot{margin-top:auto;display:flex;align-items:center;gap:11px} .rv-ava{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:.8rem;background:var(--c,#1f7bee)} .rv-card__meta{flex:1;min-width:0} .rv-card__meta b{display:block;color:var(--c-navy);font-size:.9rem;font-weight:600;line-height:1.2} .rv-card__meta span{color:var(--c-muted);font-size:.79rem} .rv-star{width:18px;height:18px;flex:none;color:#f5b301} /* Featured centre card — coordinator photo + dark quote panel */ .rv-feature{grid-column:2;grid-row:1 / span 2;position:relative;overflow:hidden;border-radius:16px;min-height:420px;background:var(--c-navy)} .rv-feature__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%} .rv-feature__scrim{position:absolute;inset:0;background: radial-gradient(120% 80% at 80% 0%,rgba(31,123,238,.30),transparent 55%), linear-gradient(to top,rgba(6,15,36,.94) 6%,rgba(6,15,36,.15) 46%,rgba(6,15,36,.30) 100%)} .rv-feature__badge{position:absolute;top:16px;left:16px;z-index:2;display:inline-flex;align-items:center;gap:7px; background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.28); color:#fff;font-size:.74rem;font-weight:600;padding:6px 12px;border-radius:var(--r-pill)} .rv-feature__badge .live{width:7px;height:7px;border-radius:50%;background:#39c26b;box-shadow:0 0 0 0 rgba(57,194,107,.5);animation:pulse 1.8s infinite} .rv-feature__quote{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;padding:18px 20px;border-radius:14px; background:rgba(8,18,42,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12)} .rv-feature__quote p{color:#eef4ff;font-size:.98rem;line-height:1.5;margin:0 0 13px} .rv-feature__foot{display:flex;align-items:center;gap:8px} .rv-feature__foot b{color:#fff;font-size:.9rem;font-weight:600} .rv-feature__foot span{color:#a9bdda;font-size:.78rem} .rv-feature__foot .rv-star{margin-left:auto} /* Carousel controls */ .rv-nav{display:flex;align-items:center;gap:10px;margin-top:22px} .rv-nav__btn{width:46px;height:46px;flex:none;border-radius:50%;border:1px solid var(--c-line);background:#fff;color:var(--c-navy); display:grid;place-items:center;cursor:pointer;transition:all var(--t)} .rv-nav__btn:hover{border-color:var(--c-navy);transform:translateY(-2px)} .rv-nav__btn svg{width:18px;height:18px} .rv-nav__btn--fill{background:var(--c-navy);color:#fff;border-color:var(--c-navy)} .rv-nav__btn--fill:hover{background:#0d234f} .rv-nav__dots{margin-left:6px;color:var(--c-muted);font-size:.85rem;font-weight:600} @media (max-width:900px){ .rv-bento{grid-template-columns:1fr 1fr} .rv-feature{grid-column:1 / span 2;grid-row:1;min-height:320px} .rv-card--tl{grid-column:1;grid-row:2}.rv-card--tr{grid-column:2;grid-row:2} .rv-card--bl{grid-column:1;grid-row:3}.rv-card--br{grid-column:2;grid-row:3} } @media (max-width:560px){ .rv-bento{grid-template-columns:1fr} .rv-feature,.rv-card--tl,.rv-card--tr,.rv-card--bl,.rv-card--br{grid-column:1;grid-row:auto} } /* ===================================================================== EM v15 — testimonials on dark navy: light text, dark-tuned controls, GSAP-owned card swap (opacity/transform handled in JS) ===================================================================== */ .rv-section{background:linear-gradient(160deg,#0a1d46,#08183a 60%,#0a1731);color:#e9f0fb} .rv-section .rv-head .em-label{color:#a9bce0} .rv-section .rv-head__l h2{color:#fff} .rv-section .rv-head__sub{color:#9fb3d6} .rv-section .rv-feature{border:1px solid rgba(255,255,255,.08)} .rv-section .rv-nav__btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff} .rv-section .rv-nav__btn:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.42)} .rv-section .rv-nav__btn--fill{background:#fff;border-color:#fff;color:var(--c-navy)} .rv-section .rv-nav__btn--fill:hover{background:#eaf1fb} /* GSAP drives the swap → keep opacity/transform out of the CSS transition */ .rv-card{transition:box-shadow .4s ease,border-color .4s ease;will-change:transform} /* ===================================================================== EM v16 — feature strip right after the hero: icon-left / text-right value boxes (animated "ping" icon, stacked language flags) ===================================================================== */ .feat-strip{background:#fff;padding:clamp(38px,5vw,64px) 0} .feat-grid{display:flex;flex-wrap:wrap;gap:clamp(14px,1.4vw,20px)} .feat{flex:1 1 300px;display:flex;align-items:flex-start;gap:16px; background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:clamp(18px,1.6vw,24px); box-shadow:0 6px 24px rgba(8,24,58,.04);transition:box-shadow .45s ease,border-color .45s ease} .feat:hover{box-shadow:0 18px 46px rgba(8,24,58,.10);border-color:transparent} .feat__txt b{display:block;color:var(--c-navy);font-size:1.04rem;font-weight:600;margin-bottom:5px;letter-spacing:-.01em} .feat__txt span{display:block;color:var(--c-muted);font-size:.9rem;line-height:1.5} /* icon chip */ .feat__ic{position:relative;flex:none;width:54px;height:54px;border-radius:15px;display:grid;place-items:center;color:var(--c-navy)} .feat__ic svg{width:26px;height:26px;position:relative;z-index:1} .feat__ic--blue{background:linear-gradient(150deg,#e7f0ff,#d6e6ff)} .feat__ic--green{background:linear-gradient(150deg,#e6f7ee,#d3efdf)} .feat__ic--amber{background:linear-gradient(150deg,#fff2df,#ffe6c6)} .feat__ic--violet{background:linear-gradient(150deg,#efeaff,#e0d7ff)} .feat__ic--red{background:linear-gradient(150deg,#ffe8ea,#ffd6da);color:var(--c-red)} /* "Fast response" — expanding ping rings + a little bolt pulse */ .feat__ic--pulse::before,.feat__ic--pulse::after{content:"";position:absolute;inset:0;border-radius:15px;border:2px solid var(--c-red);opacity:0;animation:feat-ping 2.2s cubic-bezier(.2,.6,.3,1) infinite} .feat__ic--pulse::after{animation-delay:1.1s} .feat__ic--pulse svg{animation:feat-bolt 2.2s ease-in-out infinite;transform-origin:center} @keyframes feat-ping{0%{transform:scale(1);opacity:.55}80%,100%{transform:scale(1.6);opacity:0}} @keyframes feat-bolt{0%,100%{transform:scale(1)}12%{transform:scale(1.18)}24%{transform:scale(1)}} /* "Your language" — stacked circle flags (spread a touch on hover) */ .feat__flags{flex:none;display:inline-flex;align-items:center;padding-top:2px} .feat__flags img{width:38px;height:38px;border-radius:50%;border:2.5px solid #fff;margin-left:-13px;object-fit:cover; box-shadow:0 3px 8px rgba(8,24,58,.16);transition:margin-left .3s cubic-bezier(.16,1,.3,1)} .feat__flags img:first-child{margin-left:0} .feat:hover .feat__flags img{margin-left:-6px} .feat:hover .feat__flags img:first-child{margin-left:0} @media (prefers-reduced-motion:reduce){ .feat__ic--pulse::before,.feat__ic--pulse::after,.feat__ic--pulse svg{animation:none} } /* ===================================================================== Services mega-menu — global header dropdown (Directions · What we do · Contact). Desktop: opens on hover / keyboard focus. Mobile: toggled open inside the drawer via main.js. Rendered from header.php on every page. ===================================================================== */ .navbar{position:relative} .navbar__inner{position:relative} .nav-menu li.has-mega{position:static} .mega-toggle{display:inline-flex!important;align-items:center;gap:6px} .mega-caret{transition:transform .3s cubic-bezier(.4,0,.2,1);opacity:.85} .has-mega:hover .mega-caret,.has-mega.is-open .mega-caret{transform:rotate(180deg)} .mega{position:absolute;top:calc(100% - 22px);left:0;right:0;max-width:var(--container);margin-inline:auto;transform:translateY(8px); z-index:120;padding-top:36px; opacity:0;visibility:hidden;pointer-events:none; transition:opacity .28s ease,transform .28s cubic-bezier(.4,0,.2,1),visibility .28s} .has-mega:hover .mega,.has-mega:focus-within .mega,.has-mega.is-open .mega{ opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)} .mega__inner{display:grid;grid-template-columns:minmax(216px,.82fr) 1.85fr minmax(240px,.9fr); background:#fff;border:1px solid var(--c-line);border-radius:12px; box-shadow:0 26px 64px rgba(8,24,58,.17)} .mega__dirs{padding:22px 20px;background:var(--c-bg-chip);border-right:1px solid var(--c-line);border-radius:12px 0 0 12px} .mega__do{padding:22px 24px} .mega__label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.15em; text-transform:uppercase;color:var(--c-muted);margin:0 0 15px} .mega__label::before{content:"// ";color:var(--c-red);font-weight:700} .mega .mega-dir{display:flex!important;align-items:center;gap:13px;padding:12px;border-radius:12px; background:#fff!important;border:1px solid var(--c-line);text-decoration:none; transition:border-color .2s ease,box-shadow .3s ease,transform .3s ease} .mega .mega-dir + .mega-dir{margin-top:10px} .mega .mega-dir:hover{border-color:rgba(57,143,252,.5);box-shadow:0 12px 26px rgba(8,24,58,.1);transform:translateY(-2px)} .mega-dir__ic{width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:12px; background:linear-gradient(150deg,#eaf1fd,#dbe7fb)} .mega-dir__ic img{width:40px;height:40px;object-fit:contain;display:block} .mega-dir__tx b{display:block;color:var(--c-navy);font-size:.95rem;font-weight:600;line-height:1.2} .mega-dir__tx small{color:var(--c-muted);font-size:.78rem} .mega-list{list-style:none;margin:0;padding:0;display:grid; grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,auto); grid-auto-flow:column;gap:2px 12px} .mega-list a{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:9px; color:var(--c-navy)!important;font-size:.9rem;font-weight:500;text-decoration:none;line-height:1.25; transition:background .2s ease,color .2s ease} .mega-list a:hover{background:var(--c-bg-chip)!important;color:var(--c-brand)!important} .mega-dir__tx b{color:var(--c-navy)!important} .mega-ic{width:22px;height:22px;flex:none;display:grid;place-items:center;color:var(--c-red)} .mega-ic svg{width:20px;height:20px} .mega__contact{padding:22px 22px;background:linear-gradient(180deg,#fbfcff,#f2f7fe);border-left:1px solid var(--c-line);display:flex;flex-direction:column;border-radius:0 12px 12px 0} .mega-contact-note{font-size:.82rem;color:var(--c-muted);line-height:1.5;margin:-2px 2px 14px} .mega .mega-contact{display:flex!important;align-items:center;gap:12px;padding:9px 10px;border-radius:11px;text-decoration:none;transition:background .2s ease} .mega .mega-contact + .mega-contact{margin-top:3px} .mega .mega-contact:hover{background:#fff!important} .mega-contact__ic{width:38px;height:38px;flex:none;border-radius:10px;display:grid;place-items:center;background:#fff;border:1px solid var(--c-line);color:var(--c-red)} .mega-contact__tx{min-width:0} .mega-contact__tx small{display:block;font-size:.72rem;color:var(--c-muted);font-weight:600} .mega-contact__tx b{display:block;color:var(--c-navy)!important;font-size:.9rem;font-weight:600;line-height:1.2;white-space:nowrap} .mega .mega-cta{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;margin-top:16px;padding:12px 18px;border-radius:9px;background:var(--c-red)!important;color:#fff!important;font-weight:600;font-size:.9rem;text-decoration:none;transition:background .25s ease} .mega .mega-cta:hover{background:#a90f18!important;color:#fff!important} .mega .mega-cta svg{transition:transform .25s ease} .mega .mega-cta:hover svg{transform:translateX(3px)} .mega-hours{margin-top:12px;font-size:.74rem;color:var(--c-muted);display:flex;align-items:center;gap:8px} .mega-hours::before{content:"";width:7px;height:7px;border-radius:50%;background:#39c26b;box-shadow:0 0 0 3px rgba(57,194,107,.2)} /* Over the transparent home hero, the bar solidifies while the mega is open */ body.home-hero .site-header:not(.is-stuck):has(.has-mega:hover) .navbar, body.home-hero .site-header:not(.is-stuck):has(.has-mega.is-open) .navbar{background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);box-shadow:0 8px 30px rgba(8,24,58,.13);border-bottom-color:transparent} body.home-hero .site-header:not(.is-stuck):has(.has-mega:hover) .nav-menu a, body.home-hero .site-header:not(.is-stuck):has(.has-mega.is-open) .nav-menu a{color:var(--c-navy)} body.home-hero .site-header:not(.is-stuck):has(.has-mega:hover) .nav-menu .current-menu-item>a, body.home-hero .site-header:not(.is-stuck):has(.has-mega.is-open) .nav-menu .current-menu-item>a{color:var(--c-brand);background:var(--c-bg-chip)} body.home-hero .site-header:not(.is-stuck):has(.has-mega:hover) .lang-switch, body.home-hero .site-header:not(.is-stuck):has(.has-mega.is-open) .lang-switch{color:var(--c-navy)} body.home-hero .site-header:not(.is-stuck):has(.has-mega:hover) .brand__logo, body.home-hero .site-header:not(.is-stuck):has(.has-mega:hover) .custom-logo, body.home-hero .site-header:not(.is-stuck):has(.has-mega.is-open) .brand__logo, body.home-hero .site-header:not(.is-stuck):has(.has-mega.is-open) .custom-logo{filter:none} @media (max-width:860px){ .nav-menu li.has-mega{position:relative} .mega{position:static;transform:none;width:auto;padding-top:8px;opacity:1;visibility:visible; pointer-events:auto;display:none} .has-mega.is-open .mega{display:block;transform:none} .mega__inner{grid-template-columns:1fr;box-shadow:none;border-color:var(--c-line)} .mega__dirs{border-right:0;border-bottom:1px solid var(--c-line);border-radius:12px 12px 0 0} .mega__contact{border-left:0;border-top:1px solid var(--c-line);border-radius:0 0 12px 12px} .mega-list{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-flow:row} } /* ===================================================================== Float-hero — interior pages (e.g. About) whose header floats over a LIGHT hero and then snaps to a white glass bar on scroll. Same motion as the home hero (transparent → glass + shrink), but dark-on-light text since the hero is light. Toggled by the global .is-stuck scroll class. ===================================================================== */ body.float-hero .site-header{position:fixed;top:0;left:0;right:0;z-index:50} /* The first section clears the fixed header (contact strip + nav bar). */ body.float-hero .float-hero__sec{padding-top:clamp(128px,15vh,170px)} /* At the top: transparent nav bar + larger logo (nav links stay navy = legible). */ body.float-hero .site-header:not(.is-stuck) .navbar{background:transparent;border-bottom-color:transparent} body.float-hero .site-header:not(.is-stuck) .brand__logo, body.float-hero .site-header:not(.is-stuck) .custom-logo{height:52px} /* On scroll: hide the contact strip, glass bar + shadow, shrink the logo. */ body.float-hero .site-header.is-stuck .topbar{display:none} body.float-hero .site-header.is-stuck .navbar{background:rgba(255,255,255,.82); -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%); box-shadow:0 8px 30px rgba(8,24,58,.13);border-bottom-color:transparent} body.float-hero .site-header.is-stuck .navbar__inner{min-height:60px} body.float-hero .site-header.is-stuck .brand__logo, body.float-hero .site-header.is-stuck .custom-logo{height:40px} /* ===================================================================== Provider clinics — auto-scrolling marquee of image cards (featured photo + real logo chip + name). Pure-CSS loop; pauses on hover. ===================================================================== */ /* Homepage lower band — providers, FAQ and CTA sit on white (matches the approved preview). Pinned explicitly so a cached or adjacent dark section can never bleed through and hide the navy headings or the outline CTA. */ #providers,#faq{background:#fff} body.home .section--tight{background:#fff} #providers .gc-h2{color:var(--c-navy)} #providers .btn--outline{background:#fff;color:var(--c-navy);border-color:var(--c-line)} /* FAQ — "Questions, answered." : sticky two-column intro + animated accordion */ .faq-wrap{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(28px,5vw,72px);align-items:start} .faq-intro{position:sticky;top:100px;align-self:start} .faq-intro .em-label{display:block;margin-bottom:14px} .faq-intro h2{margin:0 0 14px} .faq-intro>p{color:var(--c-muted);margin:0 0 22px;font-size:1.02rem;line-height:1.6;max-width:34ch} .faq-call{display:inline-flex;align-items:center;gap:12px;background:var(--c-bg-chip);border-radius:14px;padding:13px 17px} .faq-call__ic{width:40px;height:40px;flex:none;border-radius:50%;background:var(--c-red);color:#fff;display:grid;place-items:center} .faq-call b{display:block;color:var(--c-navy);font-size:.92rem;line-height:1.2} .faq-call span{color:var(--c-muted);font-size:.8rem} .faq-wrap .accordion{max-width:none;margin:0} .faq-wrap .accordion__item{transition:border-color .3s ease,box-shadow .3s ease} .faq-wrap .accordion__a{max-height:none;display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .5s cubic-bezier(.4,0,.15,1)} .faq-wrap .accordion__item.is-open .accordion__a{grid-template-rows:1fr} .faq-wrap .accordion__inner{overflow:hidden;min-height:0} .faq-wrap .accordion__q::after{transition:transform .45s cubic-bezier(.4,0,.15,1)} @media (max-width:860px){.faq-wrap{grid-template-columns:1fr}.faq-intro{position:static;top:auto}} .clinic-marquee{position:relative;overflow:hidden;padding:36px 0 58px;margin-block:-18px -36px} .clinic-marquee::before,.clinic-marquee::after{content:"";position:absolute;top:0;bottom:0;width:9%;max-width:120px;z-index:2;pointer-events:none} .clinic-marquee::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))} .clinic-marquee::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))} .clinic-track{display:flex;gap:22px;width:max-content;padding:0 var(--gutter);animation:clinic-scroll 48s linear infinite} .clinic-marquee:hover .clinic-track{animation-play-state:paused} @keyframes clinic-scroll{to{transform:translateX(calc(-50% - 11px))}} .clinic-card{flex:none;width:clamp(250px,22vw,296px);aspect-ratio:4/5;position:relative;overflow:hidden;border-radius:16px;box-shadow:0 8px 26px rgba(8,24,58,.1);transition:box-shadow .4s ease,transform .4s ease} .clinic-card:hover{box-shadow:0 22px 52px rgba(8,24,58,.18);transform:translateY(-4px)} .clinic-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} .clinic-card__overlay{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;align-items:center;gap:12px;padding:22px 15px 16px;background:linear-gradient(to top,rgba(6,15,36,.95) 16%,rgba(6,15,36,.55) 55%,rgba(6,15,36,0));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} .clinic-logo{flex:none;display:flex;align-items:center;justify-content:center;height:48px;padding:0 12px;background:#fff;border-radius:10px;box-shadow:0 3px 10px rgba(8,24,58,.22)} .clinic-logo img{height:30px;width:auto;max-width:104px;object-fit:contain;display:block} .clinic-meta{min-width:0} .clinic-meta b{display:block;color:#fff;font-size:.94rem;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .clinic-meta span{color:rgba(255,255,255,.72);font-size:.79rem} @media (prefers-reduced-motion:reduce){.clinic-track{animation:none}} /* ===================================================================== Site footer (.gf) — deep-navy, four-column, global on every page. Rendered from footer.php; matches the home design. ===================================================================== */ .gf{--gf-line:rgba(255,255,255,.09);--gf-txt:#93a6c6;--gf-white:#fff;--gf-red:#ec1c24; background:linear-gradient(180deg,#0c1e46 0%,#0a1836 58%,#081025 100%); color:var(--gf-txt);border-top:3px solid var(--gf-red);line-height:1.6; font-family:"Google Sans","Noto Sans Georgian",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased} .gf *,.gf *::before,.gf *::after{box-sizing:border-box} .gf__container{max-width:1300px;margin-inline:auto;padding:clamp(52px,6vw,84px) clamp(16px,4vw,40px) 0} .gf a{color:var(--gf-txt);text-decoration:none;transition:color .2s ease} .gf a:hover{color:var(--gf-white)} .gf ul{list-style:none;margin:0;padding:0} .gf :focus-visible{outline:2px solid rgba(57,143,252,.75);outline-offset:3px;border-radius:3px} .gf__main{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:clamp(30px,4vw,60px);padding-bottom:clamp(38px,5vw,56px)} .gf__logo{display:inline-block;margin-bottom:22px} .gf__logo img{height:42px;width:auto;display:block;filter:brightness(0) invert(1)} .gf__tag{max-width:44ch;font-size:.95rem;line-height:1.7;margin:0 0 26px;color:#aabbd6} .gf__contact{display:flex;flex-direction:column;gap:12px;margin:0 0 26px} .gf__contact li{display:flex;flex-direction:column;line-height:1.35} .gf__contact a{color:var(--gf-white);font-size:.98rem;font-weight:500;width:-moz-max-content;width:max-content} .gf__contact a:hover{color:#cfe0f7} .gf__contact span{color:var(--gf-txt);font-size:.8rem} .gf__addr{color:var(--gf-txt);font-size:.92rem} .gf__social{display:flex;gap:18px} .gf__social a{color:#7f93b6;line-height:0} .gf__social a:hover{color:var(--gf-white)} .gf__col h3{color:var(--gf-white);font-size:.82rem;font-weight:600;letter-spacing:.04em;margin:2px 0 17px} .gf__col ul{display:flex;flex-direction:column;gap:12px} .gf__col a{font-size:.93rem} .gf__insurers{display:flex;align-items:center;flex-wrap:wrap;gap:9px 20px;padding:22px 0;border-top:1px solid var(--gf-line)} .gf__insurers b{color:var(--gf-txt);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin-right:4px} .gf__insurers a{color:#c0cde2;font-weight:600;font-size:.92rem} .gf__insurers a:hover{color:var(--gf-white)} .gf__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 18px;padding:22px 0 30px;border-top:1px solid var(--gf-line)} .gf__bottom p{margin:0;color:#7f93b6;font-size:.85rem} .gf__legal{display:flex;gap:22px} .gf__legal a{font-size:.85rem} @media (max-width:900px){.gf__main{grid-template-columns:1fr 1fr;gap:34px}.gf__brandcol{grid-column:1 / -1}} @media (max-width:560px){.gf__main{grid-template-columns:1fr}.gf__bottom{flex-direction:column;align-items:flex-start}} @media (prefers-reduced-motion:reduce){.gf *{transition:none}} /* ===================================================================== Providers — bespoke archive grid + single (clinic / branch) editorial page ===================================================================== */ .prov-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,30px)} .prov-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-line);border-radius:18px;overflow:hidden;color:inherit;text-decoration:none; transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s,border-color .5s} .prov-card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg);border-color:transparent} .prov-card__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(150deg,#eef4fd,#dfeafb)} .prov-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease} .prov-card:hover .prov-card__media img{transform:scale(1.05)} .prov-card__logo{position:absolute;left:14px;bottom:14px;z-index:2;height:46px;min-width:46px;padding:0 12px; background:#fff;border-radius:12px;box-shadow:0 6px 18px rgba(8,24,58,.22);display:flex;align-items:center;justify-content:center} .prov-card__logo img{height:28px;width:auto;max-width:100px;object-fit:contain;display:block} .prov-card__body{padding:22px;display:flex;flex-direction:column;flex:1} .prov-card__city{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;font-size:.77rem;font-weight:600; color:var(--c-brand);background:var(--c-bg-chip);padding:5px 11px;border-radius:var(--r-pill);margin-bottom:12px} .prov-card__city svg{width:12px;height:12px} .prov-card h3{color:var(--c-navy);font-size:1.2rem;margin:0 0 8px} .prov-card__sum{color:var(--c-muted);font-size:.92rem;line-height:1.55;margin:0} .prov-card__foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;margin-top:18px;border-top:1px solid var(--c-line)} .prov-card__branches{font-size:.82rem;color:var(--c-muted);font-weight:500} .prov-card__go{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--c-navy);font-size:.9rem} .prov-card__go svg{width:16px;height:16px;transition:transform .4s cubic-bezier(.16,1,.3,1)} .prov-card:hover .prov-card__go{color:var(--c-brand)} .prov-card:hover .prov-card__go svg{transform:translateX(4px)} @media(max-width:900px){.prov-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.prov-grid{grid-template-columns:1fr}} /* Single provider — hero */ .prov-hero{background:var(--c-bg-soft);border-bottom:1px solid var(--c-line)} .prov-hero__inner{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(28px,4vw,54px);align-items:center;padding:clamp(6px,2vw,20px) 0 clamp(30px,4vw,50px)} .prov-hero__logo{height:60px;display:inline-flex;align-items:center;padding:0 16px;background:#fff;border:1px solid var(--c-line);border-radius:15px;box-shadow:var(--sh-sm);margin-bottom:18px} .prov-hero__logo img{height:34px;width:auto;max-width:150px;object-fit:contain;display:block} .prov-hero h1{margin:0 0 12px} .prov-hero__meta{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:22px} .prov-hero__cta{display:flex;flex-wrap:wrap;gap:12px} .prov-hero__media{aspect-ratio:4/3;border-radius:20px;overflow:hidden;box-shadow:var(--sh-lg);background:linear-gradient(150deg,#cfe0f2,#9fb9d9)} .prov-hero__media img{width:100%;height:100%;object-fit:cover;display:block} @media(max-width:860px){.prov-hero__inner{grid-template-columns:1fr}} /* Single provider — branches */ .prov-branches{margin-top:clamp(40px,5vw,64px)} .prov-branches-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px} .prov-branch{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid var(--c-line);border-radius:16px;padding:16px 18px;text-decoration:none;color:inherit; transition:transform var(--t),box-shadow var(--t),border-color var(--t)} .prov-branch:hover{border-color:var(--c-brand);box-shadow:var(--sh-sm);transform:translateY(-3px)} .prov-branch__ic{width:46px;height:46px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--c-bg-chip);color:var(--c-brand)} .prov-branch__ic svg{width:22px;height:22px} .prov-branch__tx{flex:1;min-width:0} .prov-branch__tx b{display:block;color:var(--c-navy);font-size:1rem;line-height:1.25} .prov-branch__tx span{color:var(--c-muted);font-size:.87rem} .prov-branch__go{flex:none;color:var(--c-muted);display:grid;place-items:center;transition:transform var(--t),color var(--t)} .prov-branch:hover .prov-branch__go{color:var(--c-brand);transform:translateX(3px)} @media(max-width:640px){.prov-branches-grid{grid-template-columns:1fr}} /* ===================================================================== Service inner pages — hero visual, services grid, how-it-works stepper, why-choose cards, testimonials, FAQ accordion, destination pills. ===================================================================== */ .svc-hero__viz{position:relative;aspect-ratio:5/4.4;border-radius:22px;overflow:hidden;box-shadow:var(--sh-lg);background:radial-gradient(120% 120% at 100% 0%,#d6e6ff,#eef4fd);display:grid;place-items:center} .svc-hero__viz--abroad{background:radial-gradient(120% 120% at 100% 0%,#d6f0e0,#eafaf1)} .svc-hero__viz--tourism{background:radial-gradient(120% 120% at 100% 0%,#ffe6c4,#fff4e6)} .svc-hero__viz img{width:60%;height:auto;object-fit:contain;filter:drop-shadow(0 18px 34px rgba(8,24,58,.22));position:relative;z-index:1} .svc-hero__viz .svc-chip{position:absolute;z-index:2} .svc-inc{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.5vw,20px)} .svc-inc__card{background:#fff;border:1px solid var(--c-line);border-radius:16px;padding:22px;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s,border-color .45s} .svc-inc__card:hover{transform:translateY(-5px);box-shadow:var(--sh);border-color:transparent} .svc-inc__ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--c-bg-chip);color:var(--c-brand);margin-bottom:14px} .svc-inc__ic svg{width:23px;height:23px} .svc-inc__card b{display:block;color:var(--c-navy);font-size:1rem;margin-bottom:5px} .svc-inc__card span{color:var(--c-muted);font-size:.9rem;line-height:1.5} @media(max-width:900px){.svc-inc{grid-template-columns:repeat(2,1fr)}} @media(max-width:520px){.svc-inc{grid-template-columns:1fr}} .hiw__head{text-align:center;max-width:620px;margin:0 auto clamp(36px,4.5vw,58px)} .hiw__head .em-label{margin-bottom:10px} .hiw__head h2{margin:0 0 10px} .hiw__head p{color:var(--c-muted);margin:0} .hiw__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,72px);align-items:center} .hiw__media{position:relative;padding:0 6% 6% 0} .hiw__photo{aspect-ratio:4/3.9;border-radius:22px;overflow:hidden;box-shadow:var(--sh-lg);background:linear-gradient(150deg,#cfe0f2,#9fb9d9);position:relative} .hiw__photo::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);border-radius:22px} .hiw__photo img{width:100%;height:100%;object-fit:cover;display:block} .hiw__mock{position:absolute;right:0;bottom:0;width:70%;background:#fff;border:1px solid var(--c-line);border-radius:18px;box-shadow:0 24px 60px rgba(8,24,58,.18);padding:16px} .hiw__mock b{display:block;font-size:.82rem;font-weight:700;color:var(--c-navy);margin-bottom:12px} .hiw__mock-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px} .hiw__mock-grid i{aspect-ratio:1;border-radius:10px;background:var(--c-bg-soft);border:1px solid var(--c-line);display:grid;place-items:center;color:var(--c-brand)} .hiw__mock-grid i svg{width:16px;height:16px;opacity:.7} .hiw__pill{position:absolute;top:8%;right:16%;z-index:3;display:inline-flex;align-items:center;gap:8px;background:var(--c-red);color:#fff;font-weight:600;font-size:.86rem;padding:9px 15px;border-radius:var(--r-pill);box-shadow:0 12px 26px rgba(236,28,36,.32)} .hiw__pill svg{width:16px;height:16px} .hiw__steps{display:grid} .hiw__step{display:grid;grid-template-columns:auto 1fr;gap:18px;position:relative;padding-bottom:30px} .hiw__step:last-child{padding-bottom:0} .hiw__rail{position:relative;width:48px;display:flex;justify-content:center} .hiw__rail::after{content:"";position:absolute;top:52px;bottom:-30px;left:50%;transform:translateX(-50%);width:2px;background:var(--c-line)} .hiw__step:last-child .hiw__rail::after{display:none} .hiw__ic{width:48px;height:48px;flex:none;border-radius:13px;display:grid;place-items:center;background:#fff;border:1px solid var(--c-line);color:var(--c-navy);position:relative;z-index:1;transition:all var(--t)} .hiw__ic svg{width:22px;height:22px} .hiw__step--active .hiw__ic{background:var(--c-brand);border-color:var(--c-brand);color:#fff;box-shadow:0 10px 22px rgba(31,123,238,.3)} .hiw__tx b{display:block;color:var(--c-navy);font-size:1.12rem;font-weight:600;margin:10px 0 6px;letter-spacing:-.01em} .hiw__tx p{color:var(--c-muted);font-size:.96rem;line-height:1.6;margin:0} @media(max-width:900px){.hiw__grid{grid-template-columns:1fr;gap:44px}.hiw__media{max-width:520px}} .why2{background:var(--c-bg-soft)} .why2__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,3.6vw,44px)} .why2__head-l{max-width:560px} .why2__head-l .em-label{margin-bottom:12px} .why2__head-l h2{margin:0 0 10px} .why2__head-l p{color:var(--c-muted);margin:0;font-size:1.02rem;line-height:1.6} .why2__cards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,1.6vw,22px)} .why2__card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-line);border-radius:20px;padding:26px;min-height:248px;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s,border-color .45s} .why2__card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);border-color:transparent} .why2__card--fill{background:linear-gradient(160deg,#0a1d46,#08183a);border-color:transparent} .why2__ic{width:46px;height:46px;flex:none;border-radius:12px;display:grid;place-items:center;border:1px solid var(--c-line);color:var(--c-navy);margin-bottom:16px} .why2__ic svg{width:23px;height:23px} .why2__card--fill .why2__ic{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff} .why2__card h3{color:var(--c-navy);font-size:1.14rem;margin:0 0 8px} .why2__card p{color:var(--c-muted);font-size:.93rem;line-height:1.55;margin:0 0 18px} .why2__card--fill h3{color:#fff} .why2__card--fill p{color:#b7c5de} .why2__card .btn{margin-top:auto;align-self:flex-start} @media(max-width:900px){.why2__cards{grid-template-columns:repeat(2,1fr)}} @media(max-width:520px){.why2__cards{grid-template-columns:1fr}} .tst__head{text-align:center;max-width:660px;margin:0 auto clamp(34px,4vw,52px)} .tst__head .em-label{margin-bottom:12px} .tst__head h2{margin:0 0 12px} .tst__head h2 em{font-style:italic;color:var(--c-brand)} .tst__head p{color:var(--c-muted);margin:0} .tst__cards{display:grid;grid-template-columns:1fr 1.06fr 1fr;gap:clamp(16px,1.8vw,22px);align-items:stretch} .tst__card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-line);border-radius:18px;padding:clamp(22px,2vw,28px);box-shadow:0 6px 24px rgba(8,24,58,.05);position:relative;transition:box-shadow .4s,transform .4s} .tst__card:hover{box-shadow:0 20px 46px rgba(8,24,58,.1);transform:translateY(-3px)} .tst__card--fill{background:linear-gradient(165deg,#0a1d46,#08183a);border-color:transparent;box-shadow:var(--sh-lg)} .tst__stars{color:#f5b301;letter-spacing:2px;font-size:.95rem;margin-bottom:14px} .tst__quote{color:var(--c-ink);font-size:.99rem;line-height:1.6;margin:0 0 22px;flex:1} .tst__card--fill .tst__quote{color:#eaf1fb} .tst__qmark{position:absolute;top:20px;right:24px;font-family:Georgia,serif;font-size:3.2rem;line-height:1;color:#fff;opacity:.16} .tst__foot{margin-top:auto;display:flex;align-items:center;gap:12px} .tst__ava{width:44px;height:44px;flex:none;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:.85rem;background:var(--c,#1f7bee)} .tst__meta b{display:block;color:var(--c-navy);font-size:.92rem;font-weight:600;line-height:1.2} .tst__meta span{color:var(--c-muted);font-size:.8rem} .tst__card--fill .tst__meta b{color:#fff} .tst__card--fill .tst__meta span{color:#a9bdda} .tst__footer{text-align:center;margin-top:clamp(30px,4vw,44px)} .tst__footer i{display:block;color:var(--c-muted);font-style:italic;margin-bottom:14px} .tst__footer a{font-weight:600;color:var(--c-brand);display:inline-flex;align-items:center;gap:7px} @media(max-width:820px){.tst__cards{grid-template-columns:1fr}.tst__qmark{display:none}} .faq2{background:linear-gradient(160deg,#0a1d46,#08183a 60%,#0a1731)} .faq2__head{text-align:center;margin-bottom:clamp(28px,3.5vw,44px)} .faq2__tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8fb0e6;margin-bottom:14px} .faq2__head h2{color:#fff;margin:0} .faq2__list{max-width:820px;margin:0 auto;display:grid;gap:12px} .faq2__item{background:#fff;border:1.5px solid transparent;border-radius:16px;overflow:hidden;transition:border-color .35s ease,box-shadow .35s ease} .faq2__item.is-open{border-color:rgba(57,143,252,.55);box-shadow:0 22px 50px rgba(3,12,32,.4)} .faq2__q{width:100%;display:flex;align-items:center;gap:16px;padding:19px 20px;background:none;border:0;cursor:pointer;text-align:left} .faq2__num{width:24px;flex:none;color:var(--c-muted);font-size:.85rem;font-weight:600} .faq2__q-text{flex:1;font-weight:600;font-size:1.03rem;color:var(--c-navy);letter-spacing:-.01em} .faq2__toggle{width:36px;height:36px;flex:none;border-radius:50%;background:var(--c-navy);color:#fff;display:grid;place-items:center;transition:background .3s ease} .faq2__toggle::before{content:"+";font-size:1.25rem;line-height:1} .faq2__item.is-open .faq2__toggle{background:var(--c-brand)} .faq2__item.is-open .faq2__toggle::before{content:"\00d7"} .faq2__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.4,0,.15,1)} .faq2__item.is-open .faq2__a{grid-template-rows:1fr} .faq2__a-in{overflow:hidden;min-height:0} .faq2__a p{color:var(--c-muted);font-size:.97rem;line-height:1.62;margin:0;padding:0 60px 22px 60px} .faq2__foot{text-align:center;margin-top:28px;color:#9fb3d6;font-size:.95rem} .faq2__foot a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px} .dest-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px} .dest-pill{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r-pill);padding:9px 18px 9px 9px;font-weight:600;color:var(--c-navy);box-shadow:var(--sh-sm)} .dest-pill img{width:24px;height:24px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(8,24,58,.06)}