
  @font-face { font-family: "FiraGO"; src: url("../fonts/firago-georgian.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
  @font-face { font-family: "TBC Contractica Caps"; src: url("../fonts/TBCContracticaCAPS-Light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; ascent-override: 98%; descent-override: 22%; }
  @font-face { font-family: "TBC Contractica Caps"; src: url("../fonts/TBCContracticaCAPS-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; ascent-override: 98%; descent-override: 22%; }
  @font-face { font-family: "TBC Contractica Caps"; src: url("../fonts/TBCContracticaCAPS-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; ascent-override: 98%; descent-override: 22%; }
  @font-face { font-family: "TBC Contractica Caps"; src: url("../fonts/TBCContracticaCAPS-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; ascent-override: 98%; descent-override: 22%; }

  :root {
    --black:#141414; --white:#fff; --gray:#e6e7e8; --blue-light:#abcee1; --blue:#4083c2; --navy:#0c273c;
    --ink-2:#4a5b6b; --muted:#6e7a84; --line:rgba(12,39,60,.12);
    --h:78px; --h-sm:58px; --ease:cubic-bezier(.4,0,.2,1);
    --font:"Noto Sans Georgian", system-ui, -apple-system, sans-serif;
    --disp:"TBC Contractica Caps", var(--font);
  }
  * { margin:0; padding:0; box-sizing:border-box; }
  html, body { overflow-x:clip; max-width:100%; }
  body { font-family:var(--font); color:var(--navy); background:#fff; -webkit-font-smoothing:antialiased; }
  a { color:inherit; text-decoration:none; }
  ul { list-style:none; }
  button { font-family:inherit; cursor:pointer; border:0; background:none; color:inherit; }
  ::selection { background:var(--blue-light); color:var(--navy); }
  :focus-visible { outline:2px solid var(--blue); outline-offset:3px; border-radius:4px; }

  /* ============================ HEADER ============================ */
  .site-header { position:fixed; top:0; left:0; right:0; z-index:100; height:var(--h); color:#fff; font-family:var(--disp); transition:height .4s var(--ease); }
  .site-header::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:rgba(255,255,255,.7); backdrop-filter:blur(16px) saturate(140%); -webkit-backdrop-filter:blur(16px) saturate(140%); border-bottom:1px solid rgba(12,39,60,.07); opacity:0; transition:opacity .4s var(--ease); }
  .site-header.scrolled { height:var(--h-sm); color:var(--navy); }
  .site-header.scrolled::after { opacity:1; }
  .site-header--solid { color:var(--navy); }
  .site-header--solid:not(.scrolled) { border-bottom:1px solid #00000010; }
  .site-header--solid .logo__img { filter:brightness(1) invert(0); }
  .bar { height:100%; width:100%; padding:0 40px; display:flex; align-items:center; gap:40px; }
  .logo { display:flex; align-items:center; }
  .logo__img { height:50px; width:auto; display:block; filter:brightness(0) invert(1); transition:height .4s var(--ease), filter .4s var(--ease); }
  .scrolled .logo__img { height:44px; filter:brightness(1) invert(0); }
  .nav { margin-right:auto; margin-left:clamp(28px,4vw,68px); }
  .nav ul { display:flex; align-items:center; gap:clamp(24px,2vw,32px); }
  .nav a { font-size:14px; font-weight:500; letter-spacing:.01em; opacity:.9; transition:opacity .25s var(--ease), font-size .4s var(--ease); }
  .nav a:hover, .nav a[aria-current="page"] { opacity:1; }
  .scrolled .nav a { font-size:13px; }
  .btn { display:inline-flex; align-items:center; gap:8px; padding:11px 22px; border:1px solid currentColor; border-radius:10px; font-size:14px; font-weight:500; letter-spacing:.01em; white-space:nowrap; opacity:.95; transition:padding .4s var(--ease), font-size .4s var(--ease), background-color .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease); }
  .btn__arrow { width:13px; height:13px; flex:none; transition:color .25s var(--ease); }
  .btn:hover { background:rgba(255,255,255,.14); }
  .scrolled .btn { padding:8px 16px; font-size:12.5px; }
  .scrolled .btn, .site-header--solid .btn { background:var(--blue-light); border-color:var(--blue-light); color:var(--navy); }
  .scrolled .btn .btn__arrow, .site-header--solid .btn .btn__arrow { color:var(--blue); }
  .scrolled .btn:hover, .site-header--solid .btn:hover { background:#9bc6dd; border-color:#9bc6dd; }
  .lang { display:flex; align-items:center; gap:7px; font-size:14px; font-weight:500; transition:font-size .4s var(--ease); }
  .lang button { opacity:.45; letter-spacing:.04em; transition:opacity .25s var(--ease); }
  .lang button[aria-pressed="true"] { opacity:1; }
  .lang span.sep { opacity:.35; }
  .scrolled .lang { font-size:12px; }
  .burger { display:none; width:38px; height:38px; }
  .burger span { display:block; width:20px; height:1.5px; margin:5px auto; background:currentColor; transition:.3s var(--ease); }
  body.open .burger span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  body.open .burger span:nth-child(2) { opacity:0; }
  body.open .burger span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
  @media (max-width:860px) {
    .bar { gap:16px; padding:0 22px; }
    .nav { position:fixed; inset:var(--h) 0 auto 0; margin:0; background:rgba(255,255,255,.96); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); transform:translateY(-12px); opacity:0; visibility:hidden; transition:.3s var(--ease); }
    body.open .nav { transform:translateY(0); opacity:1; visibility:visible; }
    .nav ul { flex-direction:column; gap:0; padding:8px 22px 18px; }
    .nav a { color:var(--navy); padding:14px 0; width:100%; border-bottom:1px solid rgba(12,39,60,.08); font-size:16px; }
    .lang { margin-left:auto; }
    .btn { display:none; }
    .burger { display:block; }
  }
  /* ===== Mega menu ===== */
  .nav__mega { position:static; }
  .nav__mega > a { display:inline-flex; align-items:center; gap:5px; }
  .nav__caret { width:11px; height:11px; transition:transform .25s var(--ease); }
  .nav__mega.is-open .nav__caret { transform:rotate(180deg); }
  .nav__panel { position:fixed; left:0; right:0; top:var(--h); z-index:55; background:rgba(255,255,255,.72); -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%); border-bottom:1px solid rgba(12,39,60,.08); box-shadow:0 30px 60px rgba(8,22,36,.13); opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity .28s var(--ease), transform .28s var(--ease), visibility .28s var(--ease); }
  .scrolled .nav__panel { top:var(--h-sm); }
  .nav__mega.is-open .nav__panel { opacity:1; visibility:visible; transform:translateY(0); }
  .nav__panel a { opacity:1; }
  .mega { max-width:1760px; margin:0 auto; padding:32px clamp(24px,3.4vw,56px) 38px; color:var(--navy); }
  .mega--proj { display:flex; flex-direction:column; gap:22px; }
  .mega__cards { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
  .pmc { position:relative; display:block; border-radius:12px; overflow:hidden; aspect-ratio:4/5; background:#0a1f30; color:#fff; }
  .pmc img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
  .pmc:hover img { transform:scale(1.06); }
  .pmc::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,20,32,.1) 0%, rgba(8,20,32,0) 38%, rgba(8,20,32,.82) 100%); }
  .pmc__logo { position:absolute; top:12px; left:12px; z-index:2; width:40px; height:40px; border-radius:50%; overflow:hidden; background:#fff; box-shadow:0 4px 14px rgba(8,22,36,.25); }
  .pmc__logo img { position:static; width:100%; height:100%; object-fit:cover; }
  .pmc__b { position:absolute; left:14px; right:14px; bottom:13px; z-index:2; }
  .pmc__name { display:block; font-family:var(--disp); font-weight:500; font-size:15px; line-height:1.15; }
  .pmc__loc { display:block; margin-top:5px; font-family:"FiraGO", var(--font); font-size:10.5px; letter-spacing:.01em; color:rgba(255,255,255,.82); }
  .mega__foot { display:flex; justify-content:space-between; align-items:center; gap:20px; border-top:1px solid rgba(12,39,60,.1); padding-top:20px; }
  .mega__note { font-size:13px; color:#5b6770; }
  .mega__note b { color:var(--navy); font-weight:700; }
  .mega__all { display:inline-flex; align-items:center; gap:9px; padding:11px 20px; border-radius:10px; background:var(--navy); color:#fff; font-family:var(--disp); font-size:13px; transition:background .25s var(--ease); }
  .mega__all:hover { background:#0f3654; }
  .mega__all svg { width:16px; height:16px; transition:transform .3s var(--ease); }
  .mega__all:hover svg { transform:translateX(3px); }
  .mega--media { display:grid; grid-template-columns:25% minmax(0,1fr); gap:40px; align-items:start; }
  .mcat { display:flex; flex-direction:column; gap:4px; }
  .mcat__h { font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#9aa4ac; margin-bottom:8px; padding:0 16px; }
  .mcat a { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border-radius:12px; transition:background .2s var(--ease); }
  .mcat a:hover { background:rgba(12,39,60,.06); }
  .mcat a span { font-family:var(--disp); font-size:16px; color:var(--navy); }
  .mcat__arr { width:14px; height:14px; flex:none; color:var(--blue); transition:transform .25s var(--ease); }
  .mcat a:hover .mcat__arr { transform:translate(2px,-2px); }
  .mnews { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .ncardh { display:flex; gap:14px; align-items:center; padding:8px; border-radius:12px; transition:background .2s var(--ease); }
  .ncardh:hover { background:rgba(12,39,60,.05); }
  .ncardh__img { flex:none; width:104px; height:70px; border-radius:10px; object-fit:cover; }
  .ncardh__t { min-width:0; }
  .ncardh__date { display:block; font-size:12px; color:#8a939b; }
  .ncardh__title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-top:5px; font-size:14px; line-height:1.34; color:var(--navy); font-weight:500; }
  .site-header.header--mega { color:var(--navy); }
  .site-header.header--mega::after { opacity:1; }
  .site-header.header--mega .logo__img { filter:brightness(1) invert(0); }
  @media (max-width:860px) {
    .nav { max-height:calc(100dvh - var(--h)); overflow-y:auto; }
    .nav__panel { position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; background:transparent; border:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
    .mega { padding:6px 0 14px; max-width:none; }
    .mega--proj { gap:14px; }
    .mega__cards { grid-template-columns:repeat(2,1fr); gap:12px; }
    .mega__foot { flex-direction:column; align-items:flex-start; gap:14px; }
    .mega--media { grid-template-columns:1fr; gap:16px; }
    .mnews { grid-template-columns:1fr; }
    .mcat__h, .mcat a, .ncardh { padding-left:0; padding-right:0; }
    .nav__mega .nav__caret { display:none; }
  }

  /* ============================ FAQ PAGE ============================ */
  .faq { min-height:100vh; padding:calc(var(--h-sm) + 60px) 0 0; background:linear-gradient(180deg,#f1f6fa 0%,#e7f0f7 100%); }
  .faq__head { max-width:1280px; margin:0 auto clamp(40px,5vw,60px); padding:0 clamp(24px,3.4vw,56px); }
  .faq__label { display:inline-flex; align-items:center; gap:10px; font-family:var(--disp); font-size:12.5px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--blue); }
  .faq__label::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--blue); flex:none; }
  .faq__title { margin-top:16px; font-family:var(--disp); font-weight:500; font-size:clamp(30px,4.2vw,54px); line-height:1.05; letter-spacing:-.01em; color:var(--navy); }
  .faq__intro { margin-top:18px; max-width:56ch; font-size:clamp(14px,1.5vw,16px); line-height:1.65; color:var(--ink-2); }

  .faq__wrap { max-width:1280px; margin:0 auto; padding:0 clamp(24px,3.4vw,56px) clamp(72px,9vw,120px);
    display:grid; grid-template-columns:clamp(220px,23vw,280px) minmax(0,1fr); gap:clamp(28px,5vw,84px); align-items:start; }
  @media (max-width:820px){ .faq__wrap{ grid-template-columns:1fr; gap:28px; } }

  /* category rail */
  .faqcats { position:sticky; top:calc(var(--h-sm) + 28px); display:flex; flex-direction:column; gap:4px; }
  .faqcat { display:flex; align-items:center; gap:13px; width:100%; padding:14px 16px; border-radius:12px; font-size:15px; font-weight:500; color:#5b6770; text-align:left; transition:background .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease); }
  .faqcat svg { width:18px; height:18px; flex:none; }
  .faqcat:hover { background:rgba(12,39,60,.05); color:var(--navy); }
  .faqcat[aria-selected="true"] { background:#fff; color:var(--blue); box-shadow:0 12px 30px -18px rgba(12,39,60,.5); }
  @media (max-width:820px){
    .faqcats { position:static; flex-direction:row; flex-wrap:wrap; gap:8px; }
    .faqcat { width:auto; padding:10px 15px; border:1px solid var(--line); background:#fff; }
    .faqcat[aria-selected="true"] { border-color:var(--blue); box-shadow:none; }
  }

  /* accordion */
  .faqpanel { display:none; }
  .faqpanel.active { display:block; }
  .faqpanel.active .faqitem { animation:faqRise .5s var(--ease) both; }
  .faqpanel.active .faqitem:nth-child(2){ animation-delay:.05s; }
  .faqpanel.active .faqitem:nth-child(3){ animation-delay:.1s; }
  .faqpanel.active .faqitem:nth-child(4){ animation-delay:.15s; }
  .faqpanel.active .faqitem:nth-child(5){ animation-delay:.2s; }
  @keyframes faqRise { from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
  .faqitem { border-bottom:1px solid var(--line); }
  .faqitem:first-child { border-top:1px solid var(--line); }
  .faqq { display:flex; align-items:center; gap:24px; width:100%; text-align:left; padding:26px 0; }
  .faqq__text { flex:1; min-width:0; font-size:clamp(16px,1.7vw,19px); font-weight:500; line-height:1.35; color:var(--navy); transition:color .25s var(--ease); }
  .faqitem.open .faqq__text { color:var(--blue); }
  .faqq__ico { width:42px; height:42px; flex:none; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; color:var(--navy); background:#fff; transition:background .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease); }
  .faqq:hover .faqq__ico { border-color:var(--navy); }
  .faqitem.open .faqq__ico { background:var(--navy); border-color:var(--navy); color:#fff; }
  .faqq__ico svg { width:15px; height:15px; transition:transform .35s var(--ease); }
  .faqitem.open .faqq__ico svg { transform:rotate(180deg); }
  .faqa { overflow:hidden; display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s var(--ease); }
  .faqitem.open .faqa { grid-template-rows:1fr; }
  .faqa__in { overflow:hidden; min-height:0; }
  .faqa p { padding:0 66px 28px 0; font-size:15px; line-height:1.72; color:var(--ink-2); max-width:70ch; }
  @media (max-width:520px){ .faqq__text{ font-size:16px; } .faqa p{ padding-right:0; } .faqq{ gap:14px; } }

  /* ============================ SITE FOOTER ============================ */
  .site-footer { position:relative; overflow:hidden; isolation:isolate; font-family:var(--font); color:#b9cad8; background:radial-gradient(135% 90% at 50% -22%, rgba(64,131,194,.22), transparent 56%), radial-gradient(70% 60% at 88% 6%, rgba(171,206,225,.10), transparent 60%), linear-gradient(180deg, #0c273c 0%, #0a2031 56%, #07151f 100%); }
    .sf-partners { position: relative; padding: clamp(20px,2.4vw,30px) 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .sf-partners__row { max-width: 1760px; margin: 0 auto; padding: 0 clamp(24px,3.4vw,56px);
    display: flex; align-items: center; gap: clamp(24px,3vw,48px); }
  .sf-partners__label { flex: none; width: min-content;
    font-family: "TBC Contractica Caps", var(--font); font-size: 13px; font-weight: 500;
    line-height: 1.4; letter-spacing: .02em; color: rgba(255,255,255,.5); }
  .sf-plogos { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; flex-wrap: nowrap;
    justify-content: flex-end; gap: clamp(18px,2.2vw,34px); }
  .sf-plogo { height: 36px; width: auto; object-fit: contain; display: block;
    filter: brightness(0) invert(1); opacity: .72; transition: opacity .3s var(--ease); }
  .sf-plogo:hover { opacity: 1; }
  .sf-plogo--keystone-investments { height: 32px; } .sf-plogo--cepi { height: 40px; }
  @media (max-width: 980px) { .sf-plogos { flex-wrap: wrap; gap: 22px 30px; }
    .sf-plogo { height: 32px; } .sf-plogo--keystone-investments { height: 28px; } .sf-plogo--cepi { height: 36px; } }
  @media (max-width: 720px) {
    .sf-partners__row { flex-direction: column; align-items: flex-start; gap: 15px; }
    .sf-partners__label { width: auto; }
    .sf-plogos { justify-content: flex-start; gap: 20px 28px; }
    .sf-plogo { height: 30px; }
    .sf-plogo--keystone-investments { height: 27px; } .sf-plogo--cepi { height: 33px; }
  }
  .sf-main { position:relative; max-width:1760px; margin:0 auto; padding:clamp(48px,5vw,76px) clamp(24px,3.4vw,56px) clamp(20px,2.5vw,32px); display:grid; grid-template-columns:1.7fr .9fr .9fr 1.25fr; gap:clamp(28px,4vw,56px); }
  .sf-brand { display:flex; flex-direction:column; align-items:flex-start; gap:22px; max-width:360px; }
  .sf-brand__logo { height:58px; width:auto; align-self:flex-start; filter:brightness(0) invert(1); }
  .sf-brand__text { font-size:14px; line-height:1.7; color:rgba(255,255,255,.58); }
  .sf-cta { align-self:flex-start; display:inline-flex; align-items:center; gap:9px; padding:11px 20px; border-radius:11px; background:var(--blue-light); color:var(--navy); font-size:13.5px; font-weight:600; letter-spacing:.01em; transition:background .25s var(--ease), transform .25s var(--ease); }
  .sf-cta svg { width:13px; height:13px; }
  .sf-cta:hover { background:#c3deee; }
  .sf-social { display:flex; gap:10px; }
  .sf-social a { width:40px; height:40px; border:1px solid rgba(255,255,255,.14); border-radius:11px; display:grid; place-items:center; color:rgba(255,255,255,.72); transition:background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease); }
  .sf-social a:hover { background:var(--blue); border-color:var(--blue); color:#fff; }
  .sf-social svg { width:17px; height:17px; }
  .sf-col__h { font-family:var(--disp); font-weight:500; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:#fff; margin:0 0 18px; }
  .sf-links { display:flex; flex-direction:column; gap:12px; }
  .sf-links a { font-size:14px; color:rgba(255,255,255,.6); width:fit-content; transition:color .25s var(--ease), transform .25s var(--ease); }
  .sf-links a:hover { color:#fff; transform:translateX(3px); }
  .sf-contact { display:flex; flex-direction:column; gap:15px; }
  /* the flex gap stacks on the heading margin — trim it so the first row lines up with the link columns */
  .sf-contact .sf-col__h { margin-bottom:3px; }
  .sf-contact__row { display:flex; gap:12px; align-items:flex-start; font-size:14px; line-height:1.5; color:rgba(255,255,255,.62); }
  .sf-contact__row svg { width:17px; height:17px; flex:none; margin-top:2px; color:var(--blue-light); }
  .sf-contact__row a { transition:color .25s var(--ease); }
  .sf-contact__row a:hover { color:#fff; }
  .sf-symbol { position:relative; z-index:0; display:flex; justify-content:center; margin-top:clamp(-26px,-2.6vw,-14px); margin-bottom:clamp(-48px,-4.4vw,-30px); pointer-events:none; user-select:none; }
  .sf-symbol svg { width:min(700px, 92vw); height:auto; display:block; -webkit-mask-image:linear-gradient(180deg, #000 0%, #000 58%, transparent 100%); mask-image:linear-gradient(180deg, #000 0%, #000 58%, transparent 100%); }
  .sf-symbol path { fill:rgba(171,206,225,.05); stroke:rgba(171,206,225,.12); stroke-width:1.4; }
  .sf-bottom { position:relative; z-index:1; border-top:1px solid rgba(255,255,255,.08); max-width:1760px; margin:0 auto; padding:22px clamp(24px,3.4vw,56px); display:flex; align-items:center; justify-content:space-between; gap:14px 28px; flex-wrap:wrap; font-size:12.5px; color:rgba(255,255,255,.45); }
  .sf-bottom__legal { display:flex; gap:22px; flex-wrap:wrap; }
  .sf-bottom__legal a { transition:color .25s var(--ease); }
  .sf-bottom__legal a:hover { color:#fff; }
  .sf-top { display:inline-flex; align-items:center; gap:10px; color:rgba(255,255,255,.6); transition:color .25s var(--ease); }
  .sf-top:hover { color:#fff; }
  .sf-top__btn { width:38px; height:38px; border:1px solid rgba(255,255,255,.16); border-radius:50%; display:grid; place-items:center; color:inherit; transition:background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease); }
  .sf-top:hover .sf-top__btn { background:var(--blue); border-color:var(--blue); color:#fff; }
  .sf-top__btn svg { width:16px; height:16px; }
  @media (max-width:980px) { .sf-main { grid-template-columns:1fr 1fr; gap:36px 28px; } .sf-brand { grid-column:1 / -1; max-width:520px; } }
  @media (max-width:560px) { .sf-main { grid-template-columns:1fr; } .sf-bottom { flex-direction:column; align-items:flex-start; gap:18px; } .sf-symbol { margin-bottom:clamp(-30px,-7vw,-18px); } }
  @media (prefers-reduced-motion:reduce) { .sf-marquee__track { animation:none; } *{ animation:none!important; } }

  /* ============================ CONSULTATION MODAL ============================ */
  .cd-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center;
    padding: 24px; opacity: 0; visibility: hidden; transition: opacity .3s var(--ease), visibility .3s var(--ease); }
  .cd-modal.open { opacity: 1; visibility: visible; }
  .cd-modal__overlay { position: absolute; inset: 0; background: rgba(7,21,31,.5);
    backdrop-filter: blur(10px) saturate(120%); -webkit-backdrop-filter: blur(10px) saturate(120%); }
  .cd-card { position: relative; z-index: 1; width: min(860px, 100%);
    height: min(500px, calc(100vh - 48px));   /* definite height → media aspect-ratio resolves to a true square */
    background: #fff; border-radius: 12px; padding: 5px; box-shadow: 0 40px 100px -28px rgba(8,22,36,.6);
    display: flex; overflow: hidden; transform: translateY(18px) scale(.98);
    transition: transform .4s var(--ease); }
  .cd-modal.open .cd-card { transform: none; }

  /* left media — 50/50 with the form */
  .cd-media { position: relative; flex: 1 1 0; min-width: 0; align-self: stretch;
    border-radius: 8px; overflow: hidden; }
  .cd-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .cd-media::after { content: ""; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(7,21,31,.5) 0%, rgba(7,21,31,.12) 38%, rgba(7,21,31,.72) 100%); }
  .cd-media__inner { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column;
    justify-content: space-between; padding: clamp(18px,2.2vw,26px); color: #fff; }
  .cd-media__title { font-family: "TBC Contractica Caps", var(--font); font-weight: 500;
    font-size: clamp(20px,2.6vw,27px); line-height: 1.08; max-width: 8em; }
  .cd-media__contacts { display: flex; flex-direction: column; gap: 11px; }
  .cd-mc { display: flex; align-items: flex-start; gap: 10px; color: rgba(255,255,255,.88);
    font-size: 13px; line-height: 1.4; transition: color .2s var(--ease); }
  .cd-mc svg { width: 16px; height: 16px; flex: none; margin-top: 1px; color: var(--blue-light); }
  a.cd-mc:hover { color: #fff; }

  /* right form */
  .cd-form { flex: 1; min-width: 0; padding: clamp(22px,2.4vw,30px) clamp(20px,2.4vw,30px);
    display: flex; flex-direction: column; justify-content: center; overflow-y: auto; }
  .cd-form__head { margin-bottom: clamp(16px,2vw,22px); }
  .cd-form__title { font-family: "TBC Contractica Caps", var(--font); font-weight: 500; color: var(--navy);
    font-size: clamp(20px,2.3vw,25px); line-height: 1.1; margin: 0; }
  .cd-field { margin-bottom: 12px; }
  .cd-field label { display: block; font-size: 12px; font-weight: 600; color: var(--navy); margin-bottom: 7px; }
  .cd-input { width: 100%; height: 48px; padding: 0 14px; font-size: 14px; color: var(--navy); font-family: var(--font);
    border: 1px solid #dbe2e8; border-radius: 10px; background: #fff;
    transition: border-color .2s var(--ease), box-shadow .2s var(--ease); }
  .cd-input::placeholder { color: #9aa6b1; }
  .cd-input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(64,131,194,.14); }
  .cd-phone { display: flex; gap: 8px; }
  .cd-cc { display: flex; align-items: center; gap: 7px; height: 48px; padding: 0 12px; flex: none;
    border: 1px solid #dbe2e8; border-radius: 10px; background: #f6f9fb; font-size: 14px; color: var(--navy); }
  .cd-cc img { width: 20px; height: 20px; border-radius: 50%; display: block; }
  .cd-phone .cd-input { flex: 1; }
  .cd-submit { margin-top: 7px; width: 100%; height: 52px; display: inline-flex; align-items: center;
    justify-content: center; gap: 10px; background: var(--navy); color: #fff; border-radius: 11px;
    font-family: "TBC Contractica Caps", var(--font); font-size: 13px; font-weight: 500; letter-spacing: .05em;
    text-transform: uppercase; transition: background .25s var(--ease), transform .2s var(--ease); }
  .cd-submit:hover { background: #143957; transform: translateY(-2px); }
  .cd-submit svg { width: 16px; height: 16px; transition: transform .3s var(--ease); }
  .cd-submit:hover svg { transform: translateX(4px); }
  .cd-note { margin-top: 12px; font-size: 11.5px; color: #8190a0; text-align: center; line-height: 1.45; }

  .cd-close { position: absolute; top: 14px; right: 14px; z-index: 3; width: 38px; height: 38px; border-radius: 50%;
    display: grid; place-items: center; background: rgba(255,255,255,.92); color: var(--navy);
    border: 1px solid rgba(12,39,60,.08); box-shadow: 0 6px 18px rgba(8,22,36,.14);
    transition: background .2s var(--ease), transform .3s var(--ease); }
  .cd-close:hover { background: #fff; transform: rotate(90deg); }
  .cd-close svg { width: 18px; height: 18px; }

  .cd-success { display: none; flex: 1; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: 12px; padding: 24px; }
  .cd-form.done > form, .cd-form.done > .cd-form__head { display: none; }
  .cd-form.done .cd-success { display: flex; }
  .cd-success__ico { width: 62px; height: 62px; border-radius: 50%; background: rgba(64,131,194,.12);
    color: var(--blue); display: grid; place-items: center; }
  .cd-success__ico svg { width: 30px; height: 30px; }
  .cd-success h3 { font-family: "TBC Contractica Caps", var(--font); font-weight: 500; color: var(--navy); font-size: 23px; }
  .cd-success p { font-size: 14px; color: #5a6b7b; line-height: 1.55; max-width: 300px; }

  .cd-open { overflow: hidden !important; }

  @media (max-width: 680px) {
    .cd-modal { padding: 16px; }
    .cd-card { flex-direction: column; height: auto; max-height: calc(100vh - 32px); overflow-y: auto; }
    .cd-media { flex: none; align-self: stretch; aspect-ratio: auto; width: auto; min-height: 184px; height: 184px; }
    .cd-form { overflow-y: visible; }
    .cd-media__title { font-size: 22px; }
  }
  @media (prefers-reduced-motion: reduce) { .cd-card { transition: none; } }
  
.sv2{color:var(--navy);background:#fff;--sv2-line:rgba(12,39,60,.13);--sv2-gut:clamp(30px,3vw,64px);}
.sv2 *{box-sizing:border-box;}
.sv2-wrap{max-width:1760px;margin:0 auto;padding:0 clamp(24px,3.4vw,56px);}
/* intro */
.sv2-intro{padding:clamp(124px,11.5vw,180px) 0 clamp(30px,3.6vw,46px);background:#eef3f7;}
.sv2-eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;font-family:"TBC Contractica Caps",var(--font);font-size:.76rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);}
.sv2-dot{width:7px;height:7px;border-radius:50%;background:var(--blue);flex:none;}
.sv2-title{margin:0 0 clamp(16px,1.8vw,22px);font-family:"TBC Contractica Caps",var(--font);font-weight:600;color:var(--navy);font-size:clamp(30px,3.4vw,42px);line-height:1.05;letter-spacing:-.005em;}
.sv2-lead{max-width:600px;font-size:clamp(15px,1.4vw,17px);line-height:1.6;color:#5a6b7b;}
.sv2-filter{display:flex;flex-wrap:wrap;gap:9px;margin-top:clamp(24px,2.6vw,34px);}
.sv2-pill{font-family:"TBC Contractica Caps",var(--font);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;padding:10px 18px;border-radius:100px;border:1px solid var(--sv2-line);background:#fff;color:var(--navy);cursor:pointer;transition:background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);}
.sv2-pill:hover{border-color:var(--navy);}
.sv2-pill.is-active{background:var(--navy);border-color:var(--navy);color:#fff;}
/* thin-line divided grid, edge-aligned cells */
.sv2-gridsec{padding-bottom:clamp(48px,7vw,104px);}
.sv2-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--sv2-line);border-bottom:1px solid var(--sv2-line);}
.sv2-cell{padding:clamp(34px,3.4vw,56px) 0;border-bottom:1px solid var(--sv2-line);scroll-margin-top:120px;}
.sv2-cell.is-l{padding-right:var(--sv2-gut);border-right:1px solid var(--sv2-line);}
.sv2-cell.is-r{padding-left:var(--sv2-gut);}
.sv2-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;}
.sv2-ico{color:var(--navy);}
.sv2-ico svg{width:30px;height:30px;display:block;}
.sv2-num{font-family:"TBC Contractica Caps",var(--font);font-weight:500;font-size:clamp(26px,2.4vw,38px);line-height:1;color:rgba(12,39,60,.15);}
.sv2-name{margin:0 0 14px;font-family:"TBC Contractica Caps",var(--font);font-weight:500;color:var(--navy);font-size:clamp(19px,1.5vw,23px);line-height:1.14;}
.sv2-body{max-width:620px;margin:0 0 24px;font-size:15px;line-height:1.65;color:#55636f;}
.sv2-points{list-style:none;margin:0 0 20px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 26px;}
.sv2-point{position:relative;padding-left:22px;font-size:13.5px;line-height:1.45;color:var(--navy);}
.sv2-point::before{content:"";position:absolute;left:2px;top:3px;width:5px;height:9px;border:solid var(--blue);border-width:0 2px 2px 0;transform:rotate(45deg);}
.sv2-outcome{margin:0 0 24px;font-size:14px;line-height:1.55;color:var(--blue);font-weight:500;}
.sv2-req{display:inline-flex;align-items:center;gap:9px;padding:0;border:0;background:none;cursor:pointer;font-family:"TBC Contractica Caps",var(--font);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);transition:color .2s var(--ease);}
.sv2-req svg{width:14px;height:14px;transition:transform .28s var(--ease);}
.sv2-req:hover{color:var(--blue);}
.sv2-req:hover svg{transform:translateX(4px);}
/* hover-spotlight: guide the eye one service at a time instead of a flat wall of text */
.sv2-cell{position:relative;transition:opacity .3s var(--ease);}
.sv2-cell::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .35s var(--ease);background:linear-gradient(180deg,rgba(43,108,176,.07),rgba(43,108,176,.015));}
.sv2-cell>*{position:relative;z-index:1;}
.sv2-num,.sv2-ico{transition:color .3s var(--ease);}
@media(hover:hover){
  .sv2-grid:hover .sv2-cell:not(:hover){opacity:.55;}
  .sv2-cell:hover::before{opacity:1;}
  .sv2-cell:hover .sv2-num{color:var(--blue);}
  .sv2-cell:hover .sv2-ico{color:var(--blue);}
}
/* RE 360 mark — unobtrusive in the intro */
.sv2-intro .sv2-wrap{position:relative;}
.sv2-mark{position:absolute;top:clamp(124px,11.5vw,180px);right:clamp(24px,3.4vw,56px);width:clamp(84px,8.5vw,124px);height:auto;opacity:.92;mix-blend-mode:multiply;pointer-events:none;}
@media(max-width:820px){ .sv2-mark{position:static;display:block;width:96px;margin:0 0 22px;} }
/* top-level split: developer services / for investors */
.sv2-tabs{display:inline-flex;gap:5px;padding:5px;margin:clamp(16px,1.8vw,24px) 0 0;background:#fff;border:1px solid rgba(12,39,60,.08);border-radius:100px;}
.sv2-tab{font-family:"TBC Contractica Caps",var(--font);font-size:13px;font-weight:500;letter-spacing:.02em;padding:11px 22px;border:0;border-radius:100px;background:transparent;color:var(--navy);cursor:pointer;transition:background .25s var(--ease),color .25s var(--ease);}
.sv2-tab:hover{color:var(--blue);}
.sv2-tab.is-active,.sv2-tab.is-active:hover{background:var(--navy);color:#fff;}
@media(max-width:520px){ .sv2-tabs{display:flex;width:100%;} .sv2-tab{flex:1;padding:11px 12px;text-align:center;} }
.sv2-invest{padding:clamp(52px,8vw,104px) 0 clamp(64px,9vw,120px);border-top:1px solid var(--sv2-line);}
.sv2-invest__in{max-width:640px;}
.sv2-invest__h{margin:0 0 14px;font-family:"TBC Contractica Caps",var(--font);font-weight:600;color:var(--navy);font-size:clamp(22px,2.4vw,32px);line-height:1.14;}
.sv2-invest__p{margin:0 0 28px;font-size:15.5px;line-height:1.65;color:#55636f;}
/* ===== Services explorer — interactive dark-card rebuild ===== */
.sv2-grid>.sv2-cell.is-l:last-child{border-right:0;}
/* ===== redesign: phase bands ===== */
.sv2-band{display:flex;align-items:center;gap:clamp(16px,2vw,30px);padding:clamp(30px,4vw,58px) 0 clamp(14px,1.7vw,22px);scroll-margin-top:120px;}
.sv2-band__no{flex:none;font-family:"TBC Contractica Caps",var(--font);font-weight:500;font-size:clamp(40px,6vw,74px);line-height:.85;color:rgba(12,39,60,.11);letter-spacing:-.02em;}
.sv2-band__tx{display:flex;flex-direction:column;gap:6px;}
.sv2-band__ix{display:inline-flex;align-items:center;gap:9px;font-family:"TBC Contractica Caps",var(--font);font-size:11.5px;font-weight:500;letter-spacing:.09em;color:var(--blue);text-transform:uppercase;}
.sv2-band__ix::before{content:"";width:18px;height:2px;border-radius:2px;background:var(--blue);}
.sv2-band__h{margin:0;font-family:"TBC Contractica Caps",var(--font);font-weight:600;color:var(--navy);font-size:clamp(21px,2.3vw,30px);line-height:1.08;}
.sv2-band__ct{font-size:13px;color:#8a99a8;}
/* ===== redesign: sticky phase rail (dev only) ===== */
.sv2-phasenav{position:sticky;top:var(--h-sm,60px);z-index:20;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--sv2-line);}
.sv2-phasenav[hidden]{display:none;}
.sv2-phasenav__in{max-width:1760px;margin:0 auto;padding:0 clamp(24px,3.4vw,56px);display:flex;align-items:center;gap:clamp(14px,2vw,30px);overflow-x:auto;scrollbar-width:none;}
.sv2-phasenav__in::-webkit-scrollbar{display:none;}
.sv2-phasenav__lbl{flex:none;font-family:"TBC Contractica Caps",var(--font);font-size:11px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:#9aa7b2;}
.sv2-rlink{flex:none;display:inline-flex;align-items:baseline;gap:7px;white-space:nowrap;font-family:"TBC Contractica Caps",var(--font);font-size:13.5px;color:#5a6b7b;padding:14px 2px 13px;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s var(--ease),border-color .2s var(--ease);}
.sv2-rlink__n{font-size:11px;color:#aab5c0;transition:color .2s var(--ease);}
.sv2-rlink:hover{color:var(--navy);}
.sv2-rlink.is-here{color:var(--navy);border-color:var(--blue);}
.sv2-rlink.is-here .sv2-rlink__n{color:var(--blue);}
/* ===== redesign: deep-link landing pulse ===== */
@keyframes sv2Pulse{0%{background:rgba(43,108,176,.12);}100%{background:transparent;}}
.sv2-cell.sv2-pulse{animation:sv2Pulse 1.5s var(--ease);}
/* ===== redesign: closing CTA (the one dark surface) ===== */
.sv2-ctawrap{max-width:1760px;margin:0 auto;padding:clamp(30px,4vw,56px) clamp(24px,3.4vw,56px) clamp(60px,8vw,110px);}
.sv2-cta{position:relative;overflow:hidden;isolation:isolate;color:#fff;border-radius:26px;padding:clamp(42px,5.5vw,76px) clamp(28px,4vw,60px);text-align:center;background:radial-gradient(125% 130% at 88% -12%,rgba(43,108,176,.5),var(--navy) 58%);box-shadow:0 46px 100px -50px rgba(8,22,36,.5);}
.sv2-cta__h{margin:0 auto 22px;max-width:20ch;font-family:"TBC Contractica Caps",var(--font);font-weight:500;font-size:clamp(23px,2.9vw,38px);line-height:1.14;}
.sv2-cta .sv2-req{color:#fff;border:1px solid rgba(255,255,255,.42);padding:14px 26px;border-radius:100px;}
.sv2-cta .sv2-req:hover{background:#fff;color:var(--navy);}
.sv2-cta .sv2-req:hover svg{transform:translateX(4px);}
@media(max-width:820px){ .sv2-phasenav{position:static;} }
/* responsive */
@media(max-width:820px){
  .sv2-grid{grid-template-columns:1fr;}
  .sv2-cell,.sv2-cell.is-l,.sv2-cell.is-r{padding-left:0;padding-right:0;border-right:none;}
}
@media(max-width:460px){ .sv2-points{grid-template-columns:1fr;} }
@media(prefers-reduced-motion:reduce){ .sv2-req svg{transition:none;} }
  
  /* ===== eyebrow normalization → match home .about__label ===== */
  .ab-eyebrow, .archive__label, .blog__eyebrow, .eyebrow, .faq__label, .media__label,
  .sv2-eyebrow, .works__eyebrow, .reels__eyebrow, .hero__kicker {
    font-family: "TBC Contractica Caps", var(--font) !important;
    font-size: 13px !important; font-weight: 500 !important;
    letter-spacing: .1em !important; text-transform: uppercase !important; gap: 0 !important;
  }
  /* light-section eyebrows → navy, like About */
  .ab-eyebrow, .archive__label, .blog__eyebrow, .eyebrow, .faq__label, .media__label, .sv2-eyebrow {
    color: var(--navy) !important; opacity: .55 !important;
  }
  /* dark-section eyebrows → light equivalent */
  .works__eyebrow, .reels__eyebrow, .hero__kicker, .eyebrow--light {
    color: rgba(255,255,255,.65) !important; opacity: 1 !important;
  }
  /* strip all dot/line decorations */
  .ab-eyebrow::before, .ab-eyebrow::after, .archive__label::before, .archive__label::after,
  .blog__eyebrow::before, .blog__eyebrow::after, .eyebrow::before, .eyebrow::after,
  .faq__label::before, .faq__label::after, .media__label::before, .media__label::after,
  .sv2-eyebrow::before, .sv2-eyebrow::after, .works__eyebrow::before, .works__eyebrow::after,
  .reels__eyebrow::before, .reels__eyebrow::after, .hero__kicker::before, .hero__kicker::after {
    display: none !important; content: none !important;
  }
  .sv2-dot { display: none !important; }
  
  /* ===== mobile menu redesign ===== */
  @media (max-width: 860px){
    .site-header .bar{ gap:14px; padding:0 20px; }
    .burger{ display:block; position:relative; z-index:60; }
    .bar .lang{ margin-left:auto; }
    body.open .site-header{ background:#fff !important; color:var(--navy) !important; height:var(--h) !important; }
    body.open .site-header::after{ opacity:1 !important; }
    body.open .logo__img{ filter:none !important; }
    body.open .burger span{ background:var(--navy) !important; }
    body.open .lang{ color:var(--navy) !important; }
    body.open{ overflow:hidden !important; }

    .nav{
      position:fixed !important; inset:var(--h) 0 0 0 !important; margin:0 !important;
      display:block !important; background:#fff !important;
      transform:translateY(-8px); opacity:0; visibility:hidden;
      transition:opacity .26s var(--ease), transform .26s var(--ease), visibility .26s var(--ease);
      overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
    }
    .scrolled .nav{ inset:var(--h) 0 0 0 !important; }
    body.open .nav{ transform:none; opacity:1; visibility:visible; }

    .nav > ul{ flex-direction:column; align-items:stretch !important; gap:0 !important; padding:6px 0 0 !important; }
    .nav > ul > li{ border-bottom:1px solid rgba(12,39,60,.09); width:100%; }
    .nav a{
      color:var(--navy) !important; text-shadow:none !important; opacity:1 !important;
      padding:19px 24px !important; width:100%; font-size:17px !important; font-weight:500;
      border:0 !important; display:flex !important; align-items:center; justify-content:space-between; gap:12px;
      text-align:left; -webkit-tap-highlight-color:transparent;
    }
    .nav__has::after{ display:none !important; }

    .nav__mega > a{ cursor:pointer; }
    .nav__mega > a .nav__caret{ display:inline-block !important; width:16px; height:16px; opacity:.4; transition:transform .3s var(--ease); flex:none; }
    .nav__mega.is-open > a .nav__caret{ transform:rotate(180deg); opacity:.7; }
    .nav__mega.is-open > a{ color:var(--blue) !important; }
    .nav__panel{
      position:static !important; opacity:1 !important; visibility:visible !important; transform:none !important;
      top:auto !important; left:auto !important; right:auto !important; width:auto !important; min-width:0 !important;
      background:transparent !important; box-shadow:none !important; border:0 !important; padding:0 !important;
      display:grid !important; grid-template-rows:0fr; transition:grid-template-rows .34s var(--ease);
    }
    .nav__mega.is-open > .nav__panel{ grid-template-rows:1fr; background:#f6f9fc !important; }
    .nav__panel > div{ min-height:0; overflow:hidden; }

    /* padding must be 0: .mega is the overflow box, so any padding survives the 0fr collapse
       and leaves a visible gap under Services / Projects / Media before they expand */
    .mega{ display:block !important; width:auto !important; max-width:none !important; padding:0 !important; margin:0 !important; }
    .mega__cards{ display:block !important; grid-template-columns:none !important; gap:0 !important; }
    .nav__panel .pmc{ display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:flex-start !important; gap:13px !important; height:auto !important; min-height:0 !important; aspect-ratio:auto !important; border-radius:0 !important; background:none !important; box-shadow:none !important; overflow:visible !important; padding:11px 24px !important; border-bottom:1px solid rgba(12,39,60,.06) !important; }
    .nav__panel .pmc > img{ display:block !important; position:static !important; inset:auto !important; width:46px !important; height:46px !important; object-fit:cover !important; border-radius:8px !important; flex:none !important; }
    .pmc::before, .pmc::after{ display:none !important; content:none !important; }
    .pmc__logo{ display:none !important; }
    .pmc__b{ position:static !important; inset:auto !important; padding:0 !important; display:flex; flex-direction:column; gap:2px; }
    .pmc__name{ position:static !important; color:var(--navy) !important; font-size:15px !important; font-weight:500 !important; text-shadow:none !important; }
    .pmc__loc{ color:#7688a0 !important; font-size:12px !important; text-shadow:none !important; }
    .mega__foot{ display:flex !important; padding:15px 24px !important; border-top:1px solid rgba(12,39,60,.07) !important; margin:0 !important; }
    .mega__note{ display:none !important; }
    .mega__foot .mega__all{ color:var(--blue) !important; background:none !important; box-shadow:none !important; border:0 !important; align-items:center !important; font-weight:600 !important; padding:0 !important; justify-content:flex-start !important; font-size:14px !important; }
    .mega--media{ display:block !important; grid-template-columns:none !important; }
    .mcat{ padding:2px 0 !important; }
    .mcat__h{ display:none !important; }
    .mcat a{ padding:13px 24px 13px 40px !important; font-size:15px !important; border-bottom:1px solid rgba(12,39,60,.06) !important; }
    .mcat__arr{ display:none !important; }
    .mnews{ display:none !important; }

    .nav__mfoot{ padding:24px 24px calc(28px + env(safe-area-inset-bottom)); }
    .nav__mfoot .nav__mcta{ display:flex !important; align-items:center; justify-content:center; gap:10px; width:100%;
      padding:17px 20px !important; border-radius:12px; background:var(--navy) !important;
      font-family:"TBC Contractica Caps",var(--font); font-size:13px !important; font-weight:500; letter-spacing:.05em; text-transform:uppercase; }
    .nav__mfoot .nav__mcta, .nav__mfoot .nav__mcta span{ color:#fff !important; }
    .nav__mfoot .nav__mcta svg{ width:15px; height:15px; flex:none; }
    .nav__mfoot .nav__mtel{ display:flex !important; align-items:center; justify-content:center !important; gap:9px;
      margin-top:8px; color:var(--navy) !important; font-size:15px !important; opacity:.72; }
    .nav__mfoot .nav__mtel svg{ width:18px; height:18px; flex:none; color:#25D366; }
  }
  @media (min-width:861px){ .nav__mfoot{ display:none !important; } }
  
  /* mobile responsiveness fixes (audit) */
  @media(max-width:600px){ .sv2-req{ min-height:44px !important; padding:10px 0 !important; } }
  
  /* ===== unified scroll-reveal + motion polish ===== */
  :root{ --grease: cubic-bezier(.22,1,.36,1); }
  .grev{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--grease), transform .8s var(--grease); will-change:opacity,transform; }
  .grev.gin{ opacity:1; transform:none; }
  .rv{ transition:opacity .8s var(--grease), transform .8s var(--grease) !important; }
  .reveal.is-in{ animation-duration:.8s !important; animation-timing-function:var(--grease) !important; }
  @media (prefers-reduced-motion: reduce){ .grev,.rv{ opacity:1 !important; transform:none !important; transition:none !important; } .reveal,.reveal.is-in{ animation:none !important; opacity:1 !important; } }
  
  .mega--svc { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: clamp(28px,3vw,44px); align-items: start; }
  .svcm__lbl { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #9aa4ac; margin: 0 0 10px; padding: 0 4px; }
  .svcaud { display: flex; flex-direction: column; gap: 8px; }
  .svcaud a { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 12px; border: 1px solid rgba(12,39,60,.1); transition: background .2s var(--ease), border-color .2s var(--ease); }
  .svcaud a:hover { background: rgba(12,39,60,.04); border-color: rgba(12,39,60,.22); }
  .svcaud__ico { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: rgba(43,108,176,.1); color: var(--blue); }
  .svcaud__ico svg { width: 19px; height: 19px; }
  .svcaud__tx { min-width: 0; }
  .svcaud__k { display: block; font-family: "TBC Contractica Caps", var(--font); font-size: 15px; color: var(--navy); }
  .svcphs { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 4px 22px; }
  .svccol { display: flex; flex-direction: column; }
  .svccol__h { font-family: "TBC Contractica Caps", var(--font); font-size: 13px; font-weight: 600; color: var(--navy); margin: 0 0 6px; padding: 0 8px; }
  .svclink { position: relative; display: flex; align-items: baseline; gap: 8px; padding: 11px 18px 11px 12px; border-radius: 10px; transition: background .2s var(--ease); }
  .svclink:hover { background: rgba(12,39,60,.06); }
  /* same arrow as the mega footer links — slides in on hover, space is always reserved so nothing reflows */
  .svclink::after { content: ""; position: absolute; right: 4px; top: 50%; width: 12px; height: 12px;
    background: var(--blue); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
    opacity: 0; transform: translate(-5px,-50%);
    transition: opacity .25s var(--ease), transform .3s var(--ease); }
  .svclink:hover::after, .svclink:focus-visible::after { opacity: 1; transform: translate(0,-50%); }
  @media (prefers-reduced-motion: reduce) { .svclink::after { transition: opacity .15s linear; transform: translate(0,-50%); } }
  .svclink__n { flex: none; font-size: 11px; color: var(--blue); font-family: "TBC Contractica Caps", var(--font); }
  .svclink__t { font-size: 13px; color: #38485f; line-height: 1.3; }
  @media (max-width: 860px) {
    .mega--svc { grid-template-columns: 1fr; gap: 16px; }
    .svcphs { grid-template-columns: 1fr 1fr; border-left: 0; padding-left: 0; gap: 2px 14px; }
    .svcm__lbl { display: none; }
  }

  /* services mega — audience switches the right-hand list (hover on desktop) */
  .svcaud a { position: relative; }
  .svcaud a.is-on { background: rgba(12,39,60,.05); border-color: rgba(12,39,60,.28); }
  .svcaud a.is-on .svcaud__ico { background: var(--blue); color: #fff; }
  .svcphs { display: block; }
  .svcpanel { display: none; }
  .svcpanel.is-on { display: block; }
  .svcpanel__h { font-family: "TBC Contractica Caps", var(--font); font-size: 14px; font-weight: 600;
    color: var(--navy); margin: 0 0 16px; padding: 0 8px; }
  /* tools/build_assets.py svcgrid_columns: three columns, rows from the services. */
  .svcgrid { display: block; columns: 3; column-gap: 22px; }
  .svcgrid .svclink { break-inside: avoid; margin-bottom: 4px; }
  @media (max-width: 860px) {
    /* audience switch = two underlined tabs (active: blue rule, inactive: hairline) */
    .svcaudwrap { padding: 0 !important; }
    .svcaud { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 !important;
      border-bottom: 1px solid rgba(12,39,60,.10); }
    .svcaud a { display: flex !important; align-items: center; justify-content: center !important;
      gap: 0 !important; padding: 15px 8px !important; margin-bottom: -1px;
      border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important;
      background: none !important; color: #6e7a84 !important; }
    .svcaud a .svcaud__ico { display: none !important; }
    .svcaud__tx { flex: 0 1 auto !important; text-align: center; }
    .svcaud__k { font-family: "TBC Contractica Caps", var(--font) !important; font-size: 13.5px !important;
      letter-spacing: .02em; color: inherit !important; }
    .svcaud a.is-on { background: none !important; border-bottom-color: var(--blue) !important; color: var(--navy) !important; }
    .svcaud a.is-on .svcaud__ico { background: none !important; }
    .svcaud a.is-on::after { content: none !important; display: none !important; }

    /* the service list = plain one-column menu rows, same rhythm as the Media links */
    .svcphs { margin-top: 0 !important; }
    .svcpanel__h { display: none !important; }
    .svcgrid { display: block !important; columns: auto !important; grid-template-columns: none !important; grid-template-rows: none !important; gap: 0 !important; }
    .svcgrid .svclink { margin-bottom: 0 !important; }
    .nav__panel .svclink { display: flex !important; align-items: center !important; gap: 12px !important;
      justify-content: flex-start !important; padding: 13px 24px !important; border-radius: 0 !important;
      border-bottom: 1px solid rgba(12,39,60,.06) !important; }
    .nav__panel .svclink::after { content: none !important; display: none !important; }
    .svclink__n { flex: none; width: 18px; font-size: 12px !important; color: #9aa4ac !important; }
    .svclink__t { font-size: 15px !important; line-height: 1.3 !important; color: var(--navy) !important; }
  }

  /* ===================== SERVICES — split hero + audience accordion ===================== */
  .sv3 { --l: rgba(12,39,60,.11); background: #fff; }
  .sv3-wrap { max-width: 1560px; margin: 0 auto; padding: 0 clamp(24px,3.4vw,56px); }

  /* hero — light-blue band with the RE 360 mark as a right-side watermark */
  .sv3-hero { position: relative; overflow: hidden; background: #eef3f7;
    padding: clamp(104px,11vw,158px) 0 clamp(34px,4vw,52px); }
  .sv3-hero .sv3-wrap { position: relative; z-index: 1; }
  .sv3-mark { position: absolute; z-index: 0; right: -7%; bottom: -6%;
    width: min(60vw, 1020px); height: auto; opacity: .9;
    pointer-events: none; user-select: none; }
  .sv3-title { margin: 0; max-width: 21ch; font-family: var(--disp); font-weight: 600; color: var(--navy);
    font-size: clamp(30px,4.4vw,56px); line-height: 1.06; letter-spacing: -.012em; }

  /* audience tabs */
  .sv2-tabs { display: inline-flex; gap: 5px; padding: 5px; margin: clamp(26px,3vw,40px) 0 0;
    background: #f4f7fa; border: 1px solid rgba(12,39,60,.08); border-radius: 100px; }
  .sv2-tab { font-family: var(--disp); font-size: 13px; font-weight: 500; letter-spacing: .02em;
    padding: 12px 24px; border: 0; border-radius: 100px; background: transparent; color: var(--muted);
    cursor: pointer; transition: background .3s var(--ease), color .3s var(--ease); }
  .sv2-tab:hover { color: var(--navy); }
  .sv2-tab.is-active, .sv2-tab.is-active:hover { background: var(--navy); color: #fff; }

  /* split layout */
  .sv3-sec[hidden] { display: none; }
  .sv3-split { display: grid; grid-template-columns: minmax(0,440px) minmax(0,1fr);
    gap: clamp(36px,4.6vw,92px); align-items: start;
    padding: clamp(30px,4vw,56px) clamp(24px,3.4vw,56px) clamp(80px,10vw,140px); }
  .sv3-side { position: sticky; top: calc(var(--h) + 34px); }
  .sv3-side__h { margin: 0; font-family: var(--disp); font-weight: 600; color: var(--navy);
    font-size: clamp(26px,3vw,42px); line-height: 1.1; letter-spacing: -.01em; }
  .sv3-side__p { margin: 18px 0 0; font-size: 16px; line-height: 1.7; color: var(--ink-2); max-width: 36ch; }
  /* same button as the header CTA / footer .sf-cta — light blue, 11px radius, ↗ arrow */
  .sv3-cta { display: inline-flex; align-items: center; gap: 9px; margin-top: clamp(22px,2.6vw,32px);
    padding: 13px 22px; border-radius: 11px; background: var(--blue-light); color: var(--navy);
    font-size: 14px; font-weight: 600; letter-spacing: .01em;
    transition: background .25s var(--ease), transform .25s var(--ease); }
  .sv3-cta:hover { background: #c3deee; transform: translateY(-2px); }
  .sv3-cta svg { width: 13px; height: 13px; flex: none; }

  /* accordion */
  .sv3-item { border-bottom: 1px solid var(--l); scroll-margin-top: 120px; }
  .sv3-list > .sv3-item:first-child { border-top: 1px solid var(--l); }
  .sv3-h { margin: 0; }
  .sv3-row { width: 100%; display: grid; grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center; gap: clamp(14px,2vw,26px); padding: clamp(18px,1.9vw,26px) 0;
    background: none; border: 0; text-align: left; cursor: pointer; font: inherit; color: inherit; }
  .sv3-n { font-family: var(--disp); font-size: 12.5px; color: #93a1ad; transition: color .25s var(--ease); }
  .sv3-nm { font-family: var(--disp); font-weight: 500; font-size: clamp(17px,1.85vw,25px); line-height: 1.2;
    color: var(--navy); transition: transform .4s var(--ease), color .25s var(--ease); }
  .sv3-tog { position: relative; flex: none; width: 36px; height: 36px; border-radius: 50%;
    border: 1px solid var(--l); transition: background .3s var(--ease), border-color .3s var(--ease); }
  .sv3-tog::before, .sv3-tog::after { content: ""; position: absolute; left: 50%; top: 50%;
    background: var(--navy); transition: transform .35s var(--ease), background .3s var(--ease); }
  .sv3-tog::before { width: 13px; height: 1.6px; margin: -.8px 0 0 -6.5px; }
  .sv3-tog::after  { width: 1.6px; height: 13px; margin: -6.5px 0 0 -.8px; }
  .sv3-row:hover .sv3-nm { transform: translateX(6px); color: var(--blue); }
  .sv3-row:hover .sv3-n { color: var(--blue); }
  .sv3-row:hover .sv3-tog { border-color: rgba(12,39,60,.3); }
  .sv3-item.is-open .sv3-tog { background: var(--navy); border-color: var(--navy); }
  .sv3-item.is-open .sv3-tog::before { background: #fff; }
  .sv3-item.is-open .sv3-tog::after { transform: scaleY(0); background: #fff; }
  .sv3-item.is-open .sv3-nm { color: var(--navy); }
  .sv3-item.is-open .sv3-n { color: var(--blue); }

  .sv3-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s var(--ease); }
  .sv3-item.is-open .sv3-panel { grid-template-rows: 1fr; }
  .sv3-panel__in { overflow: hidden; }
  .sv3-panel__grid { display: block;
    padding: 2px 0 clamp(26px,2.8vw,36px); opacity: 0; transform: translateY(6px);
    transition: opacity .4s var(--ease) .06s, transform .4s var(--ease) .06s; }
  .sv3-item.is-open .sv3-panel__grid { opacity: 1; transform: none; }
  .sv3-body { margin: 0; font-size: 15px; line-height: 1.7; color: var(--ink-2); max-width: 62ch; }

  .sv3-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px;
    font-family: var(--disp); font-weight: 500; font-size: 13.5px; color: var(--blue);
    padding-bottom: 2px; border-bottom: 1px solid rgba(64,131,194,.35);
    transition: color .25s var(--ease), border-color .25s var(--ease); }
  .sv3-more:hover { color: var(--navy); border-color: var(--navy); }
  .sv3-more svg { width: 15px; height: 15px; transition: transform .3s var(--ease); }
  .sv3-more:hover svg { transform: translateX(4px); }

  @media (max-width: 980px) {
    .sv3-split { grid-template-columns: 1fr; gap: 34px; }
    .sv3-side { position: static; }
    .sv3-side__p { max-width: none; }
    .sv3-mark { width: 104vw; right: -18%; bottom: -9%; opacity: .55; }
  }
  @media (max-width: 560px) {
    .sv2-tabs { display: flex; width: 100%; }
    .sv2-tab { flex: 1; padding: 12px 10px; text-align: center; }
  }
  @media (prefers-reduced-motion: reduce) {
    .sv3-panel, .sv3-panel__grid, .sv3-nm, .sv3-tog::before, .sv3-tog::after { transition: none !important; }
  }

  /* consultation modal — mobile/iOS fixes (mobile-only; desktop untouched) */
  @media (max-width: 680px) {
    /* iOS treats 100vh as the LARGE viewport, so the card could exceed the visible
       area inside the fixed overlay and clip its own top — close button unreachable */
    .cd-card { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); }
    /* Safari zooms the page when a focused input is under 16px */
    .cd-input, .cd-form select, .cd-form textarea { font-size: 16px; }
    /* flex children default to min-width:auto, so the +995 chip could force overflow */
    .cd-phone .cd-input { min-width: 0; }
    .cd-cc { flex: none; }
    /* 38px close button is under the 44px touch target */
    .cd-close { width: 44px; height: 44px; }
  }

/* ===== GREA type & spacing scale — one 3-level system for all inner pages =====
   L1 page titles · L2 section titles · L3 card/item titles (+ lead, eyebrow, card tokens).
   Anchored on the client-approved news.html values. Injected last in <head> so it
   wins the cascade at equal specificity — home (index.html) keeps its display scale. */
:root{
  --t-h1: clamp(28px,3.4vw,46px);
  --t-h2: clamp(22px,2.6vw,32px);
  --t-h3: clamp(18px,2vw,24px);
  --t-lead: clamp(15px,1.35vw,17.5px);
  --t-eyebrow: 13px;
  --t-card: 17px;
  --hero-top: calc(var(--h) + clamp(34px,4.2vw,52px));
  --sec-pad: clamp(56px,6.5vw,96px);
}
/* L1 — page titles + full-width display bands */
.ab-hero__title, .archive__title, .art__title, .hero__title, .faq__title, .media__title,
.ftitle, .sv3-title, .sv2-title, .svp-title, .banner__h, .inquire__h, .next__big
{ font-family:"TBC Contractica Caps",var(--font); font-weight:700; font-size:var(--t-h1); line-height:1.12; }
/* L2 — section titles */
.ab-h2, .sec-title, .blog__title, .more__title, .pgroup__title, .msec__title, .news__title,
.sec__h, .pnum__title, .about__h, .specs__h, .sv3-side__h, .sv2-invest__h, .sv2-band__h,
.svp-sec > h2, .svp-next__h
{ font-family:"TBC Contractica Caps",var(--font); font-weight:700; font-size:var(--t-h2); line-height:1.16; }
/* L3 — card / item / accordion titles (size only; each keeps its family & weight) */
.ab-mvv__h, .ab-band__l, .ab-glink__t, .vac__title, .vac-loc__t, .feat__title, .latest__h,
.faqq__text, .fcard__title, .fhead h2, .legal h2, .ctacard__h, .role__t, .amen__i,
.sv3-nm, .sv2-name, .svp-faq__i h3, .svp-next__t, .success h3
{ font-size:var(--t-h3); }
/* flat 20px: service-page FAQ questions + career vacancy titles */
.svp-faq__i h3, .vac__title{ font-size:20px; }
/* dense-grid card titles */
.pcard__name, .mcard__title, .ncard__title, .ab-mem__n, .svp-agent__n { font-size:var(--t-card); }
/* leads / intro statements */
.ab-hero__lead, .ab-intro__body p:first-child, .hero__sub, .sec-sub, .vac__lead, .faq__intro,
.svp-lead, .sv2-lead, .sv3-side__p, .intro__sub, .about__body .first
{ font-size:var(--t-lead); line-height:1.6; }
.art__lead{ font-size:var(--t-lead) !important; line-height:1.62 !important; }
/* eyebrows — align every page to the existing 13px caps standard */
.ab-eyebrow, .ab-label, .ab-stats__pl, .archive__label, .eyebrow, .faq__label, .media__label,
.feyebrow, .elabel, .pnum__eyebrow, .svp-n
{ font-family:"TBC Contractica Caps",var(--font); font-size:var(--t-eyebrow); font-weight:500; letter-spacing:.1em; text-transform:uppercase; }
/* services CTA band — match the shared prefooter CTA (.cta2__h) */
.sv2-cta__h{ font-size:clamp(20px,2.6vw,27px); }
@media (max-width:700px){ :root{ --hero-top: calc(var(--h) + 22px); } }
/* page spacing — one hero offset, capped section gaps */
.sv3-hero{padding-top:var(--hero-top);}
.sv3-split,.sv2-invest,.sv2-ctawrap,.sv2-gridsec{padding-bottom:var(--sec-pad);}
.faq__wrap{padding-bottom:var(--sec-pad);}

  /* ===== client testimonials — single-column slider with dot pagination.
     Lives at the END of the service content column (not a full-width band). ===== */
  .tsl{ --tl:rgba(12,39,60,.11); display:block; margin-top:clamp(38px,4.4vw,60px); }
  .tsl__h{ margin:0 0 clamp(16px,1.8vw,22px); font-family:var(--disp); font-weight:700; color:var(--navy);
    font-size:var(--t-h2); line-height:1.16; }
  .tsl__card{ position:relative; background:#f5f8fb; border:1px solid var(--tl); border-radius:18px;
    padding:clamp(22px,2.4vw,34px); }
  /* every quote sits in the same grid cell: the card sizes to the tallest and the slides cross-fade */
  .tsl__stage{ display:grid; }
  .tsl__item{ grid-area:1/1; display:flex; flex-direction:column; min-width:0;
    opacity:0; visibility:hidden; transform:translateY(12px); pointer-events:none;
    transition:opacity .5s var(--ease), transform .5s var(--ease), visibility .5s; }
  .tsl__item.is-active{ opacity:1; visibility:visible; transform:none; pointer-events:auto; }
  /* client wordmarks ship white-on-transparent — flip them to ink for the light card */
  .tsl__logo{ width:auto; height:auto; max-height:clamp(26px,2.6vw,38px); max-width:min(190px,60%);
    object-fit:contain; object-position:left center; filter:brightness(0); opacity:.8; }
  .tsl__q{ flex:1 1 auto; margin:clamp(16px,1.9vw,24px) 0 clamp(20px,2.4vw,28px); max-width:56ch;
    font-size:clamp(15.5px,1.4vw,18px); line-height:1.62; color:var(--navy); }
  .tsl__by{ display:flex; align-items:center; gap:13px; }
  /* initials placeholder — swap the span content for <img src="…" alt=""> when real headshots arrive */
  .tsl__ava{ flex:none; width:48px; height:48px; border-radius:50%; overflow:hidden; background:#e3ebf2;
    display:grid; place-items:center; font-family:var(--disp); font-weight:500; font-size:15px; color:var(--navy); }
  .tsl__ava img{ width:100%; height:100%; object-fit:cover; display:block; }
  .tsl__who{ display:flex; flex-direction:column; gap:3px; min-width:0; }
  .tsl__n{ font-family:var(--disp); font-weight:600; font-size:clamp(14.5px,1.3vw,16px); line-height:1.2; color:var(--navy); }
  .tsl__r{ font-size:13px; line-height:1.4; color:var(--muted); }
  .tsl__dots{ display:flex; gap:9px; margin-top:clamp(16px,1.8vw,22px); }
  .tsl__dot{ width:9px; height:9px; padding:0; border:0; border-radius:50%; background:rgba(12,39,60,.2);
    cursor:pointer; transition:background .3s var(--ease), width .3s var(--ease); }
  .tsl__dot:hover{ background:rgba(12,39,60,.42); }
  .tsl__dot.is-active{ width:26px; border-radius:5px; background:var(--navy); }
  @media (max-width:640px){
    .tsl__ava{ width:44px; height:44px; font-size:14px; }
    .tsl__logo{ max-width:66%; }
  }
  @media (prefers-reduced-motion: reduce){
    .tsl__item{ transition:opacity .2s !important; transform:none !important; }
  }
  
/* Shared chrome rules this page's prototype never carried (build_assets.py carry_chrome_rules) */
.cd-lead{display: none;}.cd-form--lead > #cdFormEl{display: none;}.cd-form--lead .cd-lead{display: block;}.cd-row{display: grid; grid-template-columns: 1fr 1fr; gap: 10px;}.cd-select{appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 38px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c273c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat: no-repeat; background-position: right 13px center; background-size: 16px;}
@media (max-width: 480px){.cd-row{grid-template-columns: 1fr; gap: 0;}}

/* Client review: a two-line menu button, a little wider
   (tools/build_assets.py burger_two_lines). The design's middle bar is
   gone rather than hidden on open, and the button lays the pair out so
   the X folds from the gap it actually has. */
  @media (max-width: 860px) {
    .burger { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; }
    .burger span { width: 26px; height: 2px; margin: 0; border-radius: 1px; }
    .burger span:nth-child(2) { display: none; }
    body.open .burger span:nth-child(1) { transform: translateY(4.5px) rotate(45deg); }
    body.open .burger span:nth-child(3) { transform: translateY(-4.5px) rotate(-45deg); }
  }

  /* Client review: the country code and the number are one field, not two
     boxes (tools/build_assets.py phone_single_field). .cd-phone carries the
     border, the radius and the focus ring; .cd-cc keeps a single
     border-right as the divider inside them. Both halves keep the inner
     radius on their outer side, so a background the UA paints on one of
     them - autofill - follows the control instead of squaring off the
     corners it reaches. */
  .cd-phone { gap: 0; height: 48px; background: #fff;
    border: 1px solid #dbe2e8; border-radius: 10px;
    transition: border-color .2s var(--ease), box-shadow .2s var(--ease); }
  .cd-phone:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(64,131,194,.14); }
  .cd-phone .cd-ccode-wrap { display: flex; }
  .cd-phone .cd-cc, .cd-phone .cd-input { height: auto; background: transparent;
    border: 0; border-radius: 0; box-shadow: none; }
  .cd-phone .cd-cc { border-right: 1px solid #dbe2e8;
    border-radius: 9px 0 0 9px;
    padding-left: 14px; }
  .cd-phone .cd-cc:hover { background: rgba(12,39,60,.035); }
  .cd-phone .cd-input { border-radius: 0 9px 9px 0;
    padding-left: 12px; }
  .cd-phone:has(.cd-input[aria-invalid="true"]) { border-color: #cf4b46; }
  .cd-phone:has(.cd-input[aria-invalid="true"]):focus-within { box-shadow: 0 0 0 3px rgba(207,75,70,.14); }

  /* Client review: the modal needs the country dropdown the pages have
     (tools/build_assets.py modal_picker_css). The design's own picker rules,
     carried across under the modal's class names so the two cannot drift;
     the overrides below are what a fixed overlay needs and nothing else. */
  .cd-cc__car { width:12px;height:12px;color:var(--muted);transition:transform .25s var(--ease); }
  .cd-cc[aria-expanded="true"] .cd-cc__car { transform:rotate(180deg); }
  .cd-ccmenu { position:absolute;top:calc(100% + 8px);left:0;z-index:50;width:330px;max-width:78vw;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 26px 64px rgba(8,22,36,.2);padding:10px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s var(--ease),transform .2s var(--ease); }
  .cd-ccmenu.open { opacity:1;visibility:visible;transform:none; }
  .cd-ccsearch { position:relative;margin-bottom:8px; }
  .cd-ccsearch svg { position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted); }
  .cd-ccsearch input { width:100%;height:42px;padding:0 12px 0 36px;font-size:14px;border:1px solid var(--line);border-radius:9px;background:#fff; }
  .cd-ccsearch input:focus { outline:none;border-color:var(--blue); }
  .cd-cclist { max-height:262px;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:1px;scrollbar-width:thin; }
  .cd-cclist::-webkit-scrollbar { width:8px; }
  .cd-cclist::-webkit-scrollbar-thumb { background:var(--gray);border-radius:8px;border:2px solid #fff; }
  .cd-ccopt { display:flex;align-items:center;gap:11px;width:100%;padding:9px 11px;border-radius:9px;text-align:left;font-size:14px;color:var(--navy);transition:background .15s var(--ease); }
  .cd-ccopt:hover,.cd-ccopt.active,.cd-ccopt[aria-selected="true"] { background:#eef4f9; }
  .cd-ccopt img { width:24px;height:24px;border-radius:50%;flex:none;box-shadow:0 0 0 1px rgba(12,39,60,.08); }
  .cd-ccopt__name { flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  .cd-ccopt__dial { color:var(--muted);font-variant-numeric:tabular-nums;font-size:13.5px; }
  .cd-ccopt__check { width:16px;height:16px;color:var(--blue);opacity:0;flex:none; }
  .cd-ccopt[aria-selected="true"] .cd-ccopt__check { opacity:1; }
  .cd-ccempty { padding:18px;text-align:center;font-size:13.5px;color:var(--muted); }
  .cd-ccmenu { position: fixed; top: 0; left: 0; }
  .cd-cclist { max-height: var(--cd-cclist-max, 262px); }

  /* Client review: "scroll in dropdown ... and not whole page scroll".
     The list contains its own overscroll; the menu around it did not, so a
     wheel over its padding or its search box chained to the document and
     dragged the open menu off the viewport (tools/build_assets.py
     picker_menu_contains_scroll). */
  .cd-ccmenu { overflow: hidden; overscroll-behavior: contain; }

/* Client review: the mega panel's height eases when it changes, instead of
   snapping (tools/build_assets.py mega_panel_morph). The module pins a px
   height on .nav__panel for the length of a switch and clears it again; these
   rules are what make that read as one sheet growing or shrinking rather than
   two sheets of different heights crossing over each other.

   The timing is the panel's own fade, read off the rule above rather than typed
   here, so the height moves with the rest of the site's motion. */
  /* transform is named here although height is what we came for: this rule
     REPLACES the panel's own transition shorthand, so anything the design fades
     has to be repeated or it snaps the moment .is-open goes. Without it a close
     that lands inside a morph dropped the sheet's 8px in a single frame at full
     opacity - the most visible frame of the whole close. */
  .nav__panel.grea-morph { overflow: hidden;
    transition: height .28s var(--ease), opacity .28s var(--ease), visibility .28s var(--ease),
      transform .28s var(--ease); }
  /* The incoming sheet is the outgoing one continued: it takes over the frost
     at the height the other had reached, with no fade or 8px drop of its own -
     only its contents cross-fade. Once .is-open goes the rule above applies
     again, so closing still fades exactly as the design drew it. */
  .nav__mega.is-open > .nav__panel.grea-morph { transition: height .28s var(--ease); transform: none; }
  /* The audience switch is the SAME sheet, and it may still be running the
     entrance - the investor card is only a pointer-flick below the trigger. So
     it gets a class of its own that ADDS height to the design's list instead of
     replacing it: a property dropping out of transition-property has its
     running transition cancelled and jumps to its end value, which snapped a
     sheet still at a fifth of its opacity to fully open in one frame. It is
     placed after the rule above so it wins the tie if an item morph left its
     class on this same panel. */
  .nav__mega.is-open > .nav__panel.grea-morph--h,
  .nav__panel.grea-morph--h { overflow: hidden;
    transition: height .28s var(--ease), opacity .28s var(--ease),
      transform .28s var(--ease), visibility .28s var(--ease); }
  /* The contents cross-fade with a beat between them rather than dissolving
     through each other: the old list is gone by 45% and the new one starts at
     35%, because two sets of Georgian text at half opacity in the same place
     read as neither. Both are fractions of the design's own duration. */
  .nav__panel.grea-morph--in > .mega {
    animation: grea-mega-in calc(.28s * .65) var(--ease) calc(.28s * .35) both; }
  /* The outgoing sheet gives up its background at once - two frosted panels
     stacked for a quarter second read as a flash - but keeps its content for
     the cross-fade, clipped to the same animating height. It also stops taking
     the pointer: it is transparent but still hit-testable until visibility
     lands, and the later mega in the DOM sits above the one that replaced it.
     transform stays none for its whole life, so a close catching it mid-fade
     leaves it where it stands rather than sliding a frostless sheet. */
  .nav__panel.grea-morph--out { transform: none; background: transparent; box-shadow: none;
    border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none;
    pointer-events: none;
    transition: height .28s var(--ease), opacity calc(.28s * .45) var(--ease), visibility .28s var(--ease); }
  /* The services audience switch. The outgoing list leaves the flow, so the
     height the panel eases to is the incoming list's, and fades where it stood
     rather than leaving a hole above the incoming one. */
  .svcphs.grea-morph { position: relative; }
  .svcpanel.grea-morph--out { display: block; position: absolute; top: 0; left: 0; right: 0;
    pointer-events: none; animation: grea-mega-out calc(.28s * .45) var(--ease) both; }
  .svcpanel.grea-morph--in {
    animation: grea-mega-in calc(.28s * .65) var(--ease) calc(.28s * .35) both; }
  @keyframes grea-mega-in { from { opacity: 0; } to { opacity: 1; } }
  @keyframes grea-mega-out { from { opacity: 1; } to { opacity: 0; } }
  /* The module never starts a morph under reduce; this is for the preference
     being turned on while one is in flight. */
  @media (prefers-reduced-motion: reduce) {
    .nav__panel.grea-morph, .nav__panel.grea-morph--h,
    .nav__mega.is-open > .nav__panel.grea-morph,
    .nav__mega.is-open > .nav__panel.grea-morph--h { transition: none; }
    .nav__panel.grea-morph--in > .mega,
    .svcpanel.grea-morph--out, .svcpanel.grea-morph--in { animation: none; }
  }


/* The studio credit, in the Back to top button's place: the button's height,
   so the footer's bottom bar keeps the design's. */
.sf-credit { min-height: 38px; }


/* The client asked for the portrait to lead the testimonial: a tall image down
   the left of the card, the wordmark, quote and attribution stacked beside it.
   The figcaption becomes display:contents so the portrait and the name can sit
   in the card's own grid without changing the design's markup. */
@media (min-width: 761px) {
  .tsl__item {
    display: grid;
    grid-template-columns: clamp(140px, 16vw, 196px) minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    align-self: stretch;
    column-gap: clamp(22px,2.4vw,34px);
    align-items: start;
  }
  .tsl__by { display: contents; }
  .tsl__ava {
    grid-column: 1;
    grid-row: 1 / -1;
    width: 100%;
    height: auto;
    align-self: stretch;
    font-size: clamp(20px, 2vw, 28px);
    /* Out of the card's padding and up to 10px of its edge - top,
       bottom and left. Negative margins rather than a layout change, so the
       text column keeps exactly the padding it had. The corner radius is the
       card's own minus that inset, which is what keeps the two curves
       concentric. */
    margin: calc(10px - clamp(22px,2.4vw,34px)) 0 calc(10px - max(clamp(22px,2.4vw,34px), calc(2 * 10px + 9px))) calc(10px - clamp(22px,2.4vw,34px));
    border-radius: calc(18px - 10px);
  }
  .tsl__logo { grid-column: 2; grid-row: 1; align-self: start; }
  .tsl__q { grid-column: 2; grid-row: 2; }
  .tsl__who { grid-column: 2; grid-row: 3; align-self: end; }
}

/* A quotation mark in the top right corner, in the display face, at the
   weight of a watermark. Decoration, so it is a pseudo-element and aria sees
   nothing; the card is already position:relative in the design. */
.tsl__card::after {
  content: "“";
  position: absolute;
  top: 10px;
  right: clamp(22px,2.4vw,34px);
  font-family: var(--disp);
  font-size: clamp(72px, 7vw, 116px);
  line-height: 1;
  color: var(--navy);
  opacity: .09;
  pointer-events: none;
}

/* The dots sit in the card's own bottom-right corner - build_templates.py's
   testimonial_dots_in_card() moves the node inside the card so they can.
   Same 10px from the edge as the portrait and the quote mark, so the
   three corner elements line up on one grid.

   The card's bottom padding grows to clear them where it is smaller than the
   strip needs (2 x inset + the 9px dot), and the portrait's bottom margin is
   written against that same value, or it would stop short of the corner. */
.tsl__card {
  padding-bottom: max(clamp(22px,2.4vw,34px), calc(2 * 10px + 9px));
}

.tsl__dots {
  position: absolute;
  right: clamp(22px,2.4vw,34px);
  bottom: 10px;
  margin: 0;
  justify-content: flex-end;
}

/* Below that a column would leave the quote about 180px to live in, so the
   portrait stays on the attribution row as the design has it - squared off
   rather than round, so it still reads as the same component. */
@media (max-width: 760px) {
  .tsl__ava {
    width: 64px;
    height: 64px;
    border-radius: 12px;
  }
}
