*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--brand-paper);color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}
/* The container query context is the body, so it is full-width and fixed-position
   descendants (drawer, scrim, dev bar) resolve against the viewport box. */
body{container-type:inline-size;container-name:page}
/* The page is full width. Every max-width constraint lives on .container, so a section that
   changes background changes it edge to edge while its content stays on the 12-column grid. */
.page{background:var(--brand-paper);overflow:clip}
a{color:var(--brand-navy);text-decoration:none}
.page a:where(:not(.ds-btn,.hdrcta,.tri-panel)),footer.site a:where(:not(.ds-btn,.hdrcta)){text-decoration:none;border-bottom:0}
.page a:where(:not(.ds-btn,.hdrcta,.tri-panel)):hover,footer.site a:where(:not(.ds-btn,.hdrcta)):hover{border-bottom-color:transparent}
/* Inline prose links keep the design system's Sky rule and its Sun hover. */
.page p a.inline,.page li a.inline{border-bottom:1px solid var(--rule-accent)}
.page p a.inline:hover,.page li a.inline:hover{border-bottom-color:var(--sun-500)}
a:hover{color:var(--sun-700)}
.container{max-width:1440px;margin:0 auto;padding:0 32px}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.eyebrow{font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--text-eyebrow);margin:0}
.eyebrow.inv{color:var(--sky-300)}
.rule48{width:48px;border-top:2px solid var(--brand-accent);display:block;margin-bottom:16px}
.rule60{width:60px;border-top:4px solid var(--brand-accent);display:block;margin-bottom:18px}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;color:var(--text-heading);margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
/* utility strip */
/* ---- utility layer: an intentional band, not microtype ---- */
.util{background:var(--navy-800);color:#D7E4EE}
.util .container{height:48px;display:flex;align-items:center;justify-content:flex-start}
.util .ic{flex:0 0 auto;opacity:.9}
.util-phone{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;color:#D7E4EE;font-size:12.5px;letter-spacing:.02em;text-decoration:none}
.util-phone__l{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-sky)}
.util-phone__n{font-weight:600;font-variant-numeric:tabular-nums;color:var(--white)}
.util-phone:hover .util-phone__n{color:var(--brand-sky)}
.utilr{display:flex;align-items:stretch;gap:0;position:relative;height:48px}
.loginbtn,.util-search{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;height:48px;padding:0 18px;background:none;border:0;border-left:1px solid rgba(145,195,235,.22);font-family:var(--font-sans);font-size:12.5px;font-weight:600;letter-spacing:.06em;color:#D7E4EE;cursor:pointer;text-decoration:none}
.util-search{padding-right:0}
.loginbtn:hover,.util-search:hover,.loginbtn[aria-expanded="true"]{color:var(--white)}
.loginbtn[aria-expanded="true"] .lucide-chevron-down{transform:rotate(180deg)}
.logindrop{position:absolute;top:42px;right:0;min-width:250px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-raised);padding:6px 0;z-index:60}
.logindrop a,.logindrop span.dis{display:block;padding:11px 18px;font-size:11px;letter-spacing:.04em;text-transform:none;color:var(--brand-navy)}
.logindrop a small,.logindrop span.dis small{display:block;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-top:3px}
.logindrop a:hover{background:var(--navy-050)}
.logindrop span.dis{color:var(--text-muted);cursor:default}
/* header */
/* ---- primary masthead ---- */
header.site{position:sticky;top:0;z-index:50;height:100px;background:rgba(247,244,238,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
/* Direct child only — the mega panel also contains a .container and must not inherit the
   84px flex header row. */
/* Three zones: brand, centered primary navigation, action. Grid keeps the navigation group
   compositionally centred in the masthead regardless of logo and CTA widths. */
header.site>.container{height:100px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:40px}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand .ds-logo{height:56px}
nav.main{display:flex;align-items:stretch;justify-content:center;gap:34px;height:100px;grid-column:2}
/* Each primary control fills the masthead height and carries its state on the masthead's own
   bottom edge, so the active item physically connects to the tray below it. */
nav.main>.navitem{display:flex;position:static}
nav.main>a,nav.main .navtoggle{display:flex;align-items:center;height:100%;box-sizing:border-box}
nav.main>a{font-family:var(--font-sans);font-size:15.5px;font-weight:500;letter-spacing:.005em;color:var(--brand-navy);text-decoration:none}
/* Compact navigation panel: centred beneath the navigation group, sized by its content,
   anchored to the masthead's bottom edge so the open control's Sun rule connects to it. */
.navpanel{position:absolute;top:100%;left:50%;transform:translateX(-50%);width:max-content;min-width:760px;max-width:900px;background:var(--white);border:1px solid var(--line);border-top:0;border-radius:0 0 var(--radius-control) var(--radius-control);box-shadow:var(--shadow-raised);z-index:45;display:none}
.navmenu{display:flex;align-items:flex-start;gap:32px;padding:26px 28px}
.navmenu__group{flex:1 1 0;min-width:0}
.navmenu__glabel{font-family:var(--font-sans);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);margin:0 0 12px}
.navmenu__group ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.navmenu__group li a{display:inline-block;padding:3px 0;font-family:var(--font-sans);font-size:15px;font-weight:500;line-height:1.35;color:var(--brand-navy)}
.navmenu__group li a:hover,.navmenu__group li a:focus-visible{color:var(--sun-700)}
.navmenu__group li a.lead{font-weight:600}
.navmenu__group li a.lead span{display:inline-block;transition:transform var(--duration-hover) var(--ease-standard)}
.navmenu__group li a.lead:hover span{transform:translateX(3px)}

/* Without JavaScript, hover and focus-within open the panel. With JavaScript, the script is
   the single authority via data-open, so Escape can actually close it. */
html:not(.js) .navitem:hover>.navpanel,html:not(.js) .navitem:focus-within>.navpanel,html.js .navitem>.navpanel[data-open="true"]{display:block}
.navitem{position:static}
.navtoggle{position:relative;background:none;border:0;padding:0;font-family:var(--font-sans);font-size:15.5px;font-weight:500;letter-spacing:.005em;color:var(--brand-navy);cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.navtoggle .ic{transition:transform var(--duration-hover) var(--ease-standard);opacity:.75}
.navitem.is-open .navtoggle .ic{transform:rotate(180deg);opacity:1}
.navitem.is-open .navtoggle{font-weight:600}
a:focus-visible,button:focus-visible{outline:2px solid var(--brand-accent);outline-offset:2px}
.navpanel ul{margin:0;padding:0;list-style:none}
/* sections */
section{position:relative}
.sec{padding:88px 0}
.sec.tight{padding:64px 0}
.paper{background:var(--brand-paper)}.white{background:var(--white)}.fog{background:var(--brand-fog)}
.navy{background:var(--brand-navy)}.navy h2,.navy h3{color:var(--text-inverse)}
/* hero */
.hero{padding:56px 0 48px}
.hero h1{font-size:72px;line-height:.98;letter-spacing:-.03em;max-width:13ch}
.hero .lead{font-size:20px;line-height:1.55;color:var(--text-secondary);max-width:36ch;margin-top:22px}
.heroactions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
@media (max-height:880px){.hero{padding:36px 0 32px}.hero h1{font-size:60px}.hero .lead{margin-top:18px;font-size:19px}.heroactions{margin-top:20px}}
/* triage */
.triage{padding:0 0 4px;background:var(--brand-fog)}
.triage .container{padding-top:34px;padding-bottom:34px}
.triage h2{font-size:30px;line-height:1.05;max-width:8ch;margin-top:10px}
.tri-rows{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--line);gap:1px}
.tri-rows>*{background:var(--brand-fog)}
/* generic */
.measure{max-width:65ch}
.smallcaps{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.withheld{font-family:var(--font-display);font-weight:500;font-size:30px;line-height:1;color:var(--brand-navy)}
.withheld.inv{color:var(--text-inverse)}
.withheldnote{font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--text-muted);margin-top:6px}
.withheldnote.inv{color:var(--sky-300)}
/* index rows */
.rows{border-top:2px solid var(--brand-navy)}
.rowlink{display:grid;grid-template-columns:2.6fr 1.4fr 1.4fr .9fr 24px;gap:24px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line);transition:background-color var(--duration-hover) var(--ease-standard)}
.rowlink:hover{background:var(--navy-050)}
.rowlink .t{font-family:var(--font-display);font-weight:500;font-size:20px;line-height:1.15;color:var(--brand-navy)}
.rowlink .m{font-size:13px;color:var(--text-secondary)}
.rowlink .ar{color:var(--brand-navy);font-size:15px;text-align:right}
/* insight teaser */
.fchip{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sky-800);border:1px solid var(--sky-300);background:var(--sky-100);padding:5px 7px}
.imeta{font-size:12px;color:var(--text-muted);margin-top:12px;display:flex;gap:14px;flex-wrap:wrap}
.imeta b{font-weight:500;color:var(--text-secondary)}
/* footer */
footer.site{background:var(--navy-800);color:var(--sky-300);padding:70px 0 34px}
footer.site .foot-h{font-size:11px;font-weight:700;font-family:var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--brand-sky);margin:0 0 16px}
.foot-brand{margin-top:-5px}
.foot-cols{grid-column:4 / span 9;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
/* The column label IS the primary nav item, so it is a link that keeps the label styling. */
footer.site .foot-h a{color:inherit;font-size:inherit;font-weight:inherit;letter-spacing:inherit}
footer.site .foot-h a:hover{color:var(--white)}
footer.site ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
footer.site a{color:var(--text-inverse);font-size:13.5px}
footer.site a:hover{color:var(--text-inverse)}
footer.site .legal{margin-top:72px;border-top:1px solid rgba(255,255,255,.18);padding:26px 0 6px;display:flex;justify-content:space-between;align-items:baseline;gap:16px 24px;flex-wrap:wrap}
footer.site .legal p{font-size:11.5px;line-height:1.65;color:var(--sky-300)}
footer.site .legal-copy{margin:0}
/* full-width bottom disclosure band — long approved compliance language only */
footer.site .legal-band{margin-top:30px;border-top:1px solid rgba(255,255,255,.14);padding:44px 0 10px}
footer.site .legal-band p{font-size:11.5px;line-height:1.7;color:var(--sky-300)}
footer.site .legal-band .disc{max-width:74ch}
footer.site .legal-band .disc+.disc{margin-top:10px}
.slotnote{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--sun-700);border-bottom:1px solid var(--brand-accent);padding-bottom:2px}
/* reveal */
html.js .rv{opacity:0;transform:translateY(18px);transition:opacity 620ms var(--ease-standard),transform 620ms var(--ease-standard)}
html.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
/* responsive */
/* --- development placeholders --- */
.ap-ph{font-size:9.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--sun-700);border-bottom:1px solid var(--brand-accent);padding-bottom:2px;display:inline-block}
.ap-ph.inv{color:var(--brand-sky);border-bottom-color:var(--brand-sky)}
[data-ap-mode="production"] .ap-ph{outline:2px solid red;outline-offset:2px}
.ap-devbar{position:fixed;right:18px;bottom:18px;z-index:200;font-family:var(--font-sans);display:flex;flex-direction:column;align-items:flex-end}
.ap-devbar-row{display:flex;gap:1px}
.ap-devbar-x{background:var(--navy-800);color:var(--sky-300);border:0;border-radius:0 3px 3px 0;padding:0 10px;font-size:11px;cursor:pointer;min-height:34px}
.ap-devbar-x:hover{color:var(--text-inverse)}
.ap-devbar-btn{display:block;background:var(--navy-800);color:var(--text-inverse);border:0;border-radius:3px 0 0 3px;padding:11px 14px;font:700 10px/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;box-shadow:var(--shadow-raised)}
.ap-devbar-btn b{color:var(--brand-accent)}
.ap-devbar-btn span{color:var(--sky-300);margin-left:8px;font-weight:400}
.ap-devbar-panel{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-raised);padding:16px 18px;margin-bottom:8px;max-width:340px}
.ap-devbar-h{font:700 9px/1.4 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-navy);margin-bottom:10px}
.ap-devbar-k{font-size:11.5px;line-height:1.6;color:var(--text-secondary)}
.ap-devbar-k b{color:var(--brand-navy)}
.ap-devbar-k em{font-style:normal;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--sun-700)}
.ap-devbar-f{font-size:10px;line-height:1.5;color:var(--text-muted);margin-top:10px;border-top:1px solid var(--line);padding-top:9px}
@media print{.ap-devbar{display:none}}
/* --- drawer navigation --- */
.navtrigger{display:none;align-items:center;gap:10px;background:none;border:0;cursor:pointer;font:700 11px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-navy);min-height:44px;padding:0 2px}
.navtrigger i{display:block;width:22px;height:1.5px;background:var(--brand-navy);position:relative}
.navtrigger i::before,.navtrigger i::after{content:"";position:absolute;left:0;width:22px;height:1.5px;background:var(--brand-navy)}
.navtrigger i::before{top:-6px}.navtrigger i::after{top:6px}
.scrim{position:fixed;inset:0;background:rgba(0,27,54,.42);backdrop-filter:blur(2px);z-index:70;border:0}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,100%);background:var(--brand-paper);z-index:80;display:flex;flex-direction:column;box-shadow:var(--shadow-overlay,0 18px 50px rgba(0,43,84,.10))}
.drawer-top{display:flex;align-items:center;justify-content:space-between;height:84px;padding:0 24px;border-bottom:1px solid var(--line);flex:0 0 auto}
.drawer-close{background:none;border:0;cursor:pointer;font:700 11px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-navy);min-height:44px;padding:0 4px}
.drawer-body{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.drawer-util{display:flex;gap:0;border-bottom:1px solid var(--line);background:var(--brand-fog)}
.drawer-util a{flex:1;min-height:56px;display:flex;align-items:center;justify-content:center;font:700 10px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-navy);border-left:1px solid var(--line)}
.drawer-util a:first-child{border-left:0}
.drawer-sec{border-bottom:1px solid var(--line)}
.drawer-row{width:100%;background:none;border:0;text-align:left;cursor:pointer;min-height:64px;padding:16px 24px;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;font-family:inherit}
.drawer-row .n{font-family:var(--font-display);font-weight:500;font-size:22px;line-height:1;color:var(--text-numeral)}
.drawer-row .t{font-family:var(--font-display);font-weight:500;font-size:23px;line-height:1.1;color:var(--brand-navy)}
.drawer-row .t small{display:block;font-family:var(--font-sans);font-size:12.5px;font-weight:400;line-height:1.45;color:var(--text-muted);margin-top:4px}
.drawer-row .c{font-size:16px;color:var(--brand-navy)}
.drawer-sub{padding:0 24px 20px;background:var(--white);border-top:1px solid var(--line)}
.drawer-sub a{display:block;min-height:52px;display:flex;align-items:center;font-size:15px;color:var(--brand-navy);border-bottom:1px solid var(--line)}
.drawer-sub .act{padding-top:18px}
.drawer-plain a{display:flex;align-items:center;min-height:60px;padding:0 24px;font-family:var(--font-display);font-weight:500;font-size:21px;color:var(--brand-navy);border-bottom:1px solid var(--line)}
.drawer-logins{padding:20px 24px 26px;background:var(--brand-fog)}
.drawer-logins h5{font:700 10px/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text-eyebrow);margin:0 0 6px}
.drawer-logins a,.drawer-logins span{display:block;min-height:52px;display:flex;flex-direction:column;justify-content:center;font-size:14.5px;color:var(--brand-navy);border-bottom:1px solid var(--line)}
.drawer-logins span{color:var(--text-muted)}
.drawer-logins small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-top:3px}
.drawer-foot{flex:0 0 auto;padding:16px 24px;border-top:1px solid var(--line);background:var(--brand-paper)}
/* Nav breakpoint set from measured fit: the header's intrinsic need is 843px
   (logo 150 + nav 6 items 508 + CTA 121 + gaps and padding). Drawer engages at 1000px,
   which leaves ~157px of slack so the nav is never crowded against the logo or the CTA.
   Grid stacking is a separate, later breakpoint — an 8/4 hero still reads well at 1024. */
@container page (max-width:1280px){
  nav.main{gap:22px}
  nav.main>div>a,nav.main>a{font-size:13px}
}
@container page (max-width:1000px){
  nav.main{display:none}
  .navtrigger{display:inline-flex;grid-column:2;justify-self:end}
  header.site>.container{grid-template-columns:1fr auto}
  .util .container{height:44px}
  .utilr,.loginbtn,.util-search{height:44px}
  .utilsoc .soc{height:44px}
  header.site,header.site>.container{height:84px}
  .brand .ds-logo{height:40px}
  header.site .hdrcta{display:none !important}
  header.site>.container{gap:20px}
}
@container page (max-width:900px){
  .g12>*,.navpanel .inner>*,footer.site .legal>*{grid-column:1 / -1 !important}
  .hero{padding:40px 0 36px}
  .hero h1{font-size:56px;max-width:none}
  .hero .lead{max-width:38ch}
  .heromedia{max-width:560px;margin-top:36px}
  .heromedia figure{height:auto;aspect-ratio:16 / 9}
  .sec{padding:64px 0}
  .tri-rows{grid-template-columns:1fr;margin-top:26px}
}
@container page (max-width:720px){
  .g12{gap:16px}
  .container{padding:0 20px}
  .hero{padding:24px 0 22px}
  .hero h1{font-size:40px}
  .hero .lead{font-size:16.5px;max-width:34ch}
  .heromedia{max-width:none;margin-top:24px}
  .heromedia figure{height:auto;aspect-ratio:16 / 9}
  .heroactions{margin-top:18px}
  .triage .container{padding-top:26px;padding-bottom:26px}
  .rowlink{grid-template-columns:1fr;gap:5px}
  .rowlink .ar{display:none}
  .sec{padding:52px 0}
  .util .container{justify-content:space-between}
  .util a[href="#search"]{display:none}
}
/* --- site menu: static markup, :target fallback, JS upgrades it to an overlay drawer --- */
.sitemenu{display:none;background:var(--brand-paper);border-top:1px solid var(--line)}
.sitemenu:target{display:block}
html.js .sitemenu{display:none}
html.js body.menu-open .sitemenu{display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;width:min(430px,100%);z-index:80;border-top:0;box-shadow:0 18px 50px rgba(0,43,84,.18)}
html.js body.menu-open .scrim{display:block}
.scrim{display:none;position:fixed;inset:0;background:rgba(0,27,54,.42);backdrop-filter:blur(2px);z-index:70;border:0;width:100%}
body.menu-open{overflow:hidden}
.sitemenu .drawer-top{display:none}
html.js .sitemenu .drawer-top{display:flex}

/* ==== design-system component classes (parity with the React components) ==== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;background:var(--brand-navy);color:#fff;padding:12px 16px;z-index:300;font:700 11px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase}
.skip:focus{left:0}
.ds-logo{width:auto;display:block}
.ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-sans);font-weight:600;text-transform:uppercase;letter-spacing:.10em;border-radius:var(--radius-control);border:1px solid transparent;text-decoration:none;white-space:nowrap;transition:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.ds-btn--sm{font-size:.625rem;padding:11px 15px;min-height:36px}
.ds-btn--md{font-size:.6875rem;padding:13px 16px;min-height:42px}
.ds-btn--lg{font-size:.75rem;padding:16px 22px;min-height:48px}
.ds-btn--full{width:100%}
.ds-btn--primary{background:var(--action-primary-bg);color:var(--action-primary-fg);border-color:var(--action-primary-bg)}
.ds-btn--primary:hover{background:var(--action-primary-bg-hover);border-color:var(--action-primary-bg-hover);color:var(--action-primary-fg)}
.ds-btn--secondary{background:transparent;color:var(--action-secondary-fg);border-color:var(--action-secondary-border)}
.ds-btn--secondary:hover{background:var(--action-secondary-bg-hover);color:var(--action-secondary-fg)}
.ds-btn--inverse-outline{background:transparent;color:var(--text-inverse);border-color:rgba(255,255,255,.55)}
.ds-btn--inverse-outline:hover{background:rgba(255,255,255,.10);border-color:var(--text-inverse);color:var(--text-inverse)}
.ds-sh{display:flex;flex-direction:column;align-items:flex-start}
.ds-sh__rule{width:48px;border-top:2px solid var(--brand-accent);margin-bottom:var(--space-4)}
.ds-sh__rule--feature{width:60px;border-top-width:4px;margin-bottom:18px}
.ds-sh__eyebrow{font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--text-eyebrow)}
.ds-sh__title{font-family:var(--font-display);font-weight:500;font-size:var(--type-display-2);line-height:var(--leading-display);letter-spacing:var(--tracking-display);color:var(--text-heading);margin:15px 0 0;max-width:var(--measure-headline)}
.ds-sh__lede{font-family:var(--font-sans);font-size:var(--type-lead);line-height:var(--leading-normal);color:var(--text-secondary);max-width:65ch;margin:20px 0 0}
.ds-sh--navy .ds-sh__eyebrow{color:var(--sky-300)}
.ds-sh--navy .ds-sh__title{color:var(--text-inverse)}
.ds-sh--navy .ds-sh__lede{color:#CFDEE8}
.ds-media{position:relative;margin:0;overflow:hidden;display:flex;align-items:flex-end}
.ds-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ds-media--property{background:linear-gradient(180deg,#9ECFE5 0 28%,#E7EEF1 28% 44%,#C6B7A5 44% 61%,#8F7056 61%)}
.ds-media--place{background:linear-gradient(180deg,#9FCFE5 0 46%,#B8C8CF 46% 54%,#846E57 54%)}
.ds-media--people{background:linear-gradient(135deg,#C8D0D6,#7B8A91)}
.ds-media--details{background:repeating-linear-gradient(90deg,#B1A18D 0 22px,#D0C5B7 22px 44px)}
.ds-media--construction{background:linear-gradient(135deg,#7F939D,#C2B39F)}
/* Authored crops. One class per commissioned ratio; container queries restate them. */
.ds-media--ar-3x2{aspect-ratio:3 / 2}.ds-media--ar-4x3{aspect-ratio:4 / 3}.ds-media--ar-16x9{aspect-ratio:16 / 9}.ds-media--ar-21x9{aspect-ratio:21 / 9}.ds-media--ar-16x7{aspect-ratio:16 / 7}.ds-media--ar-1x1{aspect-ratio:1 / 1}
.ds-media__scrim{position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,25,45,.72))}
.ds-media__cap{position:relative;padding:22px;color:var(--text-inverse)}
.ds-media__label{display:block;font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.ds-media__desc{display:block;font-family:var(--font-sans);font-size:13px;line-height:1.5;color:#E9EEF1;margin-top:5px}
.proofband{background:var(--brand-navy)}
.proofband .container{padding-top:52px;padding-bottom:52px}
.ds-proof{display:grid;grid-template-columns:repeat(12,1fr);gap:0 24px;color:var(--text-inverse);align-items:start}
.ds-proof__intro{grid-column:span 3;padding-right:28px}
.ds-proof__eyebrow{display:block;color:var(--brand-sky);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.18em}
.ds-proof__title{font-family:var(--font-display);font-weight:500;font-size:28px;line-height:1.1;letter-spacing:-.02em;margin:10px 0 0;color:#fff}
.ds-proof__lead{margin:12px 0 0;font-family:var(--font-sans);font-size:14px;line-height:1.6;color:#C3D3DE;max-width:34ch}
.ds-proof__item{grid-column:span 2;padding-left:24px;border-left:1px solid var(--border-inverse);display:grid;grid-template-rows:minmax(40px,auto) minmax(16px,auto) auto;row-gap:10px;align-content:start}
.ds-proof__value{display:block;align-self:start;font-family:var(--font-display);font-weight:500;font-size:38px;line-height:1;letter-spacing:-.02em;color:#fff}
.ds-proof__value.tnum{font-variant-numeric:tabular-nums}
.ds-proof__item--wide{grid-column:span 3}
.ds-proof__item--wide .ds-proof__value{font-size:34px;line-height:1.04}
.ds-proof__pending{display:block;align-self:start;width:86px;height:26px;background:rgba(145,195,235,.16);border-bottom:2px solid rgba(145,195,235,.42)}
.ds-proof__label{display:block;align-self:start;color:var(--brand-sky);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;line-height:1.3}
.ds-proof__qual{display:block;font-family:var(--font-sans);font-size:13.5px;line-height:1.45;color:#D3DFE9;text-wrap:pretty}
.ds-arow{display:grid;grid-template-columns:auto 1fr auto;gap:var(--space-3);align-items:center;padding:22px 18px 22px 22px;border-left:1px solid var(--line);text-decoration:none;background:transparent;transition:background-color var(--duration-hover) var(--ease-standard)}
.ds-arow:hover{background:var(--white)}
.ds-arow__n{font-family:var(--font-display);font-weight:500;font-size:28px;line-height:1;color:var(--text-numeral)}
.ds-arow__t{display:block;font-family:var(--font-display);font-weight:500;font-size:22px;line-height:1.05;color:var(--text-heading);margin-bottom:4px}
.ds-arow__d{display:block;font-family:var(--font-sans);font-size:12px;line-height:1.45;color:var(--text-muted)}
.ds-arow__a{font-size:18px;color:var(--brand-navy);transition:transform var(--duration-hover) var(--ease-standard)}
.ds-arow:hover .ds-arow__a{transform:translateX(3px)}
.ds-facts{margin:0;display:grid;column-gap:var(--space-6)}
.ds-facts__row{padding:15px 0;border-top:1px solid var(--line)}
.ds-facts__row--first{border-top:0}
.ds-facts__label{font-family:var(--font-sans);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-eyebrow)}
.ds-facts__value{margin:5px 0 0;font-family:var(--font-sans);font-size:14px;color:var(--brand-navy)}
.ds-facts--navy .ds-facts__row{border-top-color:var(--border-inverse)}
.ds-facts--navy .ds-facts__label{color:var(--brand-sky)}
.ds-facts--navy .ds-facts__value{color:var(--text-inverse)}
/* ==== header / menus ==== */
.navlink{font-size:13.5px;color:var(--brand-navy);padding:6px 0;display:inline-block}
html.js .navitem>.navlink{display:none}

.loginbtn{background:none;border:0;padding:0;font:inherit;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-inverse);cursor:pointer}
.loginbtn:hover{color:var(--brand-sky)}
.logindrop{display:none}
.logindrop[data-open="true"]{display:block}
.logindrop span.dis small,.logindrop a small{display:block}
/* ==== home sections ==== */
.hero-copy{grid-column:1 / span 8;display:flex;flex-direction:column;justify-content:center}
.heromedia{grid-column:9 / span 4}
.tm{font-size:.38em;vertical-align:super;letter-spacing:0}
.triage-intro{grid-column:1 / span 3;display:flex;flex-direction:column;justify-content:center}
.tri-rows{grid-column:4 / span 9}
.feat-copy{grid-column:1 / span 5;display:flex;flex-direction:column;justify-content:center}
.feat-media{grid-column:6 / span 7}
.qlist{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:1px;background:var(--line)}
.qlist li{background:var(--white);display:grid;grid-template-columns:auto 1fr;gap:14px;padding:12px 0}
.qlist__n{font-family:var(--font-display);font-weight:500;font-size:18px;line-height:1.2;color:var(--text-numeral)}
.qlist__q{font-family:var(--font-sans);font-size:13.5px;font-weight:600;color:var(--brand-navy)}
.qlist__q small{display:block;font-weight:400;font-size:12.5px;line-height:1.5;color:var(--text-muted);margin-top:2px}
.feat-facts{margin:30px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.feat-facts__row{border-top:1px solid var(--line);padding:14px 0}
.feat-facts__row--top{border-top:2px solid var(--brand-navy)}
.feat-facts dt{font-size:10px}
.feat-facts dd{margin:7px 0 0}
.slotline{margin-top:18px}
/* California judgment. The media column bleeds to the left viewport edge: --caj-edge is the
   distance from the viewport to the container content box, so the negative margin cancels the
   gutter at every width without a viewport-height rule. Height comes from the crop, capped. */
.caj{--caj-edge:max(32px,(100cqw - 1376px)/2);padding:72px 0}
.caj-media{grid-column:1 / span 7;align-self:center;margin-left:calc(-1 * var(--caj-edge))}
.caj-media .ds-media{width:100%;max-height:540px}
.caj-photo{margin:0;width:100%;aspect-ratio:3 / 2;max-height:540px;overflow:hidden;background:var(--brand-fog);border-radius:0 6px 6px 0}
.caj-photo img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;display:block}
.caj-copy{grid-column:8 / span 5;align-self:center;padding-top:0}
.caj-copy .ds-sh__lede{max-width:36ch}
.caj-sub{margin:20px 0 0;max-width:36ch;font-size:15px;line-height:1.65;color:var(--text-secondary)}
.caj-link{display:inline-block;white-space:nowrap;margin-top:30px;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-navy)}
.caj-link:hover{color:var(--sun-700)}
.caj-dev{grid-column:1 / -1;margin-top:22px}
/* --- Client testimonials: full-width Navy band rail — the approved 3-up composition at
   desktop, 2-up tablet, 1-up mobile. The viewport scrolls horizontally with snap (touch,
   trackpad); enhance.js drives the heading-region prev/next controls + indicator and hides
   them while every record is already visible. --- */
.testi{background:var(--brand-navy)}
.testi.sec{padding:76px 0}
.testi-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.testi-h{color:var(--text-inverse);font-size:40px;line-height:1.08;margin-top:14px}
.testi-nav{display:flex;align-items:center;gap:10px;padding-bottom:5px}
.testi-nav[hidden]{display:none}
.testi-ind{font-family:var(--font-sans);font-size:11px;font-weight:500;letter-spacing:.14em;color:var(--sky-300);font-variant-numeric:tabular-nums;margin-right:8px}
.testi-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:1px solid rgba(145,195,235,.38);border-radius:4px;background:transparent;color:var(--white);cursor:pointer;transition:border-color var(--duration-hover) var(--ease-standard),background-color var(--duration-hover) var(--ease-standard)}
.testi-btn svg{width:18px;height:18px}
.testi-btn:hover:not(:disabled){border-color:rgba(145,195,235,.75);background:rgba(145,195,235,.08)}
.testi-btn:focus-visible{outline:2px solid var(--brand-accent);outline-offset:2px}
.testi-btn:disabled{opacity:.42;cursor:default}
/* Editorial asymmetric composition: the leftmost visible voice leads at ~5 columns,
   supporting voices at ~3.5; the featured class travels with the rail (enhance.js).
   Sun rules open each quote as punctuation; no borders, no cards. */
.testi-viewport{margin-top:16px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.testi-viewport::-webkit-scrollbar{display:none}
.testi-list{display:flex;--testi-sup:.291667;--testi-pv:3}
.testi-item{box-sizing:border-box;margin:0;flex:0 0 29.1667%;min-width:0;padding:0 48px 0 0;display:flex;flex-direction:column;scroll-snap-align:start}
.testi-item.is-featured{flex-basis:41.6667%;padding-right:72px}
.testi-rule{display:block;width:40px;height:2px;background:var(--brand-accent);margin-bottom:20px}
.testi-q{margin:0;font-family:var(--font-display);font-weight:400;font-size:20px;line-height:1.45;color:#E9EEF1;text-wrap:pretty}
.testi-item.is-featured .testi-q{font-size:26px;line-height:1.42}
.testi-attr{display:flex;flex-direction:column;gap:5px;margin-top:30px}
.testi-name{font-family:var(--font-display);font-size:15.5px;font-weight:400;color:var(--white)}
.testi-role{font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--sky-300)}
/* JS-managed slot rotation: the records travel between fixed slots — on advance the next
   record moves into the leftmost featured slot and enlarges while the others shift along.
   Position, width and quote type all transition; nothing is swapped abruptly. enhance.js
   locks the list height to the tallest record at both geometries, so changing testimonials
   never changes the Navy band's height or the position of the page below. */
.testi-win{overflow:hidden;scroll-snap-type:none}
.testi-win .testi-list{display:block;position:relative}
.testi-win .testi-item{position:absolute;top:0;left:0;width:29.1667%;padding:0 48px 0 0;transform-origin:0 0;transition:left 640ms var(--ease-standard),width 640ms var(--ease-standard),padding-right 640ms var(--ease-standard),transform 640ms var(--ease-standard),opacity 240ms linear}
/* The record scales as it travels: the incoming quote grows into the featured slot while the
   outgoing one recedes. Transforms stay at ITEM level only — the children carry the section's
   locked entrance motion (mo-l rule draw, mo-r rise) and must not be out-specified. */
.testi-win .testi-q{transition:font-size 640ms var(--ease-standard),line-height 640ms var(--ease-standard)}
.testi-win .testi-item[data-slot="off-l"]{z-index:0;transform:translateX(-70px) scale(.94);transform-origin:0 40%;transition-duration:320ms,320ms,320ms,320ms,110ms}
.testi-win .testi-item[data-slot="off-r"]{z-index:0;transform:translateX(22px) scale(.985);transition-duration:320ms,320ms,320ms,320ms,110ms}
.testi-win .testi-item[data-slot="0"]{z-index:2;left:0;width:41.6667%;padding-right:72px;opacity:1;visibility:visible;transform:none}
.testi-win .testi-item[data-slot="1"]{z-index:1;left:41.6667%;opacity:1;visibility:visible;transform:none}
.testi-win .testi-item[data-slot="2"]{z-index:1;left:70.8333%;opacity:1;visibility:visible;transform:none}
.testi-win .testi-item[data-slot="off-l"]{left:-16%;width:41.6667%;padding-right:72px;opacity:0;visibility:hidden}
.testi-win .testi-item[data-slot="off-r"]{left:100%;opacity:0;visibility:hidden}
.testi-win .testi-item.is-leaving{visibility:visible}
.testi-measure{position:absolute;top:0;left:0;width:100%;height:0;overflow:visible;visibility:hidden;pointer-events:none}
.testi-measure .testi-item{transition:none}
@media (prefers-reduced-motion:reduce){.testi-win .testi-item,.testi-win .testi-q{transition:none}.testi-win .testi-item[data-slot="off-l"],.testi-win .testi-item[data-slot="off-r"]{transform:none}}
.testi-devtag{font-family:var(--font-sans);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-accent)}
@container page (max-width:1100px){.testi-list{--testi-sup:.416667;--testi-pv:2}.testi-item{flex-basis:41.6667%}.testi-item.is-featured{flex-basis:58.3333%;padding-right:56px}.testi-win .testi-item{width:41.6667%}.testi-win .testi-item[data-slot="0"],.testi-win .testi-item[data-slot="off-l"]{width:58.3333%;padding-right:56px}.testi-win .testi-item[data-slot="1"]{left:58.3333%}.testi-win .testi-item[data-slot="off-l"]{left:-22%}}
@container page (max-width:720px){.testi.sec{padding:56px 0}.testi-h{font-size:30px}.testi-viewport{margin-top:14px}.testi-list{--testi-sup:1;--testi-pv:1}.testi-item{flex-basis:100%;padding:0}.testi-item.is-featured{flex-basis:100%;padding-right:0}.testi-item.is-featured .testi-q{font-size:22px}.testi-win .testi-item{width:100%}.testi-win .testi-item[data-slot="0"],.testi-win .testi-item[data-slot="off-l"]{width:100%;padding-right:0}.testi-win .testi-item[data-slot="off-l"]{left:-100%}}
/* --- Insights: publishing front page. 6 / [gutter] / 5, one image, hairline rows. --- */
.insv.sec{padding:0}
.insv .container{padding-top:64px;padding-bottom:64px}
.insv-head{grid-column:1 / span 8}
.insv-eyebrow{position:relative;padding-top:18px}
.insv-eyebrow::before{content:"";position:absolute;top:0;left:0;width:48px;height:2px;background:var(--brand-accent)}
.insv-h{font-family:var(--font-display);font-weight:500;font-size:38px;line-height:1.1;letter-spacing:-.02em;color:var(--text-heading);margin-top:14px;max-width:22ch;text-wrap:balance}
.insv-all{grid-column:9 / span 4;justify-self:end;align-self:start;margin-top:65px;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--brand-navy)}
.insv-all:hover{color:var(--sun-700)}
.insv-lead{grid-column:1 / span 6;margin-top:16px}
.insv-lead--solo{grid-column:1 / span 8}
.insv-rail{grid-column:8 / span 5;margin-top:16px;display:flex;flex-direction:column}
.ilead{display:block;color:inherit;text-decoration:none}
.ilead__media{display:block;position:relative;overflow:hidden}
.ilead__media .ds-media{margin:0}
.ilead__play{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border:1.5px solid rgba(255,255,255,.9);border-radius:50%;background:rgba(0,27,54,.42)}
.ilead__play::after{content:"";position:absolute;left:22px;top:18px;border-left:16px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent}
.ilead__meta{display:block;margin-top:18px;font-family:var(--font-sans);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-eyebrow)}
.ilead__h{display:block;font-family:var(--font-display);font-weight:500;font-size:35px;line-height:1.1;letter-spacing:-.02em;color:var(--text-heading);margin-top:12px;max-width:none;text-wrap:pretty}
.ilead:hover .ilead__h{color:var(--sun-700)}
.ilead__s{display:block;margin-top:14px;font-size:15.5px;line-height:1.62;color:var(--text-secondary);max-width:62ch}
.ilead__a{display:inline-block;margin-top:16px;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--brand-navy)}
.ilead:hover .ilead__a{color:var(--sun-700)}
.ilead:focus-visible,.irow:focus-visible{outline:2px solid var(--brand-accent);outline-offset:4px}
.irow{display:block;border-top:1px solid var(--line);padding:28px 0;color:inherit;text-decoration:none}
.irow:last-child{border-bottom:1px solid var(--line)}
.irow__meta{display:block;font-family:var(--font-sans);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-eyebrow)}
.irow__h{display:block;font-family:var(--font-display);font-weight:500;font-size:24px;line-height:1.18;letter-spacing:-.015em;color:var(--text-heading);margin-top:10px;text-wrap:pretty}
.irow:hover .irow__h{color:var(--sun-700)}
.irow__s{display:block;margin-top:9px;font-size:14.5px;line-height:1.58;color:var(--text-secondary)}
.irow__a{display:inline-block;margin-top:12px;font-family:var(--font-sans);font-size:12.5px;font-weight:600;letter-spacing:.06em;color:var(--brand-navy)}
.irow:hover .irow__a{color:var(--sun-700)}
.insv-dev{grid-column:1 / -1}
.rowhead{display:grid;grid-template-columns:2.6fr 1.4fr 1.4fr .9fr 24px;gap:24px;padding:0 0 8px;font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.rowempty{border-bottom:1px solid var(--line);padding:26px 0}
/* final CTA — navy closing band: invitation 1-4, three peer audience rows 5-12.
   Hairline under the section divides it from the footer so the two read as one navy
   conclusion with separate roles. */
.final{border-bottom:1px solid rgba(145,195,235,.24)}
.final .eyebrow{color:var(--sky-300)}
.final-h{font-size:60px;line-height:1;letter-spacing:-.03em;max-width:11ch;margin-top:18px}
.final-invite{grid-column:1 / span 4}
.final-lead{margin-top:20px;font-size:16px;line-height:1.6;color:var(--brand-paper);max-width:36ch}
.final-promise{margin-top:12px;font-size:13.5px;line-height:1.6;color:var(--sky-300);max-width:36ch}
.final-paths{grid-column:5 / span 8;align-self:center}
.fpath{display:grid;grid-template-columns:150px 1fr auto;gap:24px;align-items:baseline;padding:32px 10px 32px 0;border-top:1px solid rgba(145,195,235,.28);transition:background-color var(--duration-hover) var(--ease-standard)}
.fpath:last-of-type{border-bottom:1px solid rgba(145,195,235,.28)}
/* quiet secondary general-inquiry line in the left editorial column */
.final-alt{margin:18px 0 0;display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:0 7px;font-family:var(--font-sans);font-size:13px;line-height:1.5;color:var(--sky-300)}
.final-alt__a{color:var(--white);font-weight:600;letter-spacing:.02em;text-decoration:none}
.final-alt__a:hover{color:var(--sun-300, #E8A87C)}
.final-alt__a:focus-visible{outline:2px solid var(--brand-accent);outline-offset:3px}
.fpath:hover{background:rgba(145,195,235,.08)}
.fpath:focus-visible{outline:2px solid var(--brand-accent);outline-offset:2px}
.fpath__t{font-family:var(--font-display);font-weight:500;font-size:25px;line-height:1.1;color:var(--white)}
.fpath__i{font-size:14.5px;line-height:1.55;color:var(--sky-300)}
.fpath__a{font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--white);white-space:nowrap}
.fpath__ar{display:inline-block;color:var(--brand-sky);transition:transform var(--duration-hover) var(--ease-standard)}
.fpath:hover .fpath__ar{transform:translateX(4px)}
.final-dev{grid-column:1 / -1}
@container page (max-width:1100px){.final-invite{grid-column:1 / -1}.final-paths{grid-column:1 / -1;margin-top:38px}}
@container page (max-width:720px){.fpath{grid-template-columns:1fr;gap:7px;padding:22px 0}}
/* ==== footer ==== */
.foot-rule{display:block;width:40px;height:2px;background:var(--brand-accent);margin-top:20px}
/* Footer lead-in: one brand line plus the single Success Stories destination. No CTA here —
   Next Steps above the footer owns conversion. The footer's one warm accent rule lives here. */
.foot-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding-bottom:26px;margin-bottom:40px;border-bottom:1px solid rgba(255,255,255,.18)}
.foot-brandline{display:flex;align-items:center;margin:0;font-family:var(--font-sans);font-size:16px;line-height:1.5;color:var(--sky-300)}
.foot-brandline__n{font-weight:600;color:var(--text-inverse)}
.foot-brandline .foot-rule--cta{flex:none;width:28px;margin:0 16px 0 0}
.foot-dot{color:var(--brand-accent);margin:0 8px}
footer.site .foot-cta__alt{font-family:var(--font-sans);font-size:12px;font-weight:600;letter-spacing:.10em;text-transform:uppercase;color:var(--brand-sky)}
footer.site .foot-cta__alt:hover{color:var(--white)}
.foot-rule--cta{margin-top:0;width:48px}
@container page (max-width:900px){.foot-top{padding-bottom:28px;margin-bottom:48px}}
.foot-line{font-size:13.5px;line-height:1.65;color:var(--sky-300);margin-top:22px;max-width:26ch}
.foot-contact{font-size:13.5px;line-height:1.9;color:var(--text-inverse);margin-top:26px}
/* The two numbers read as one line: unbreakable, sized to content so a narrow brand column
   cannot leave a dangling separator (it borrows the gutter before .foot-cols instead). */
.foot-phones{display:flex;flex-wrap:nowrap;align-items:baseline;gap:0 12px;width:max-content;white-space:nowrap}
.foot-psep{color:var(--sky-300)}
/* Narrower brand columns cannot hold both numbers on one line — they stack cleanly there
   rather than overflowing into the navigation or leaving a dangling separator. */
@container page (max-width:1180px){.foot-phones{display:block;width:auto;white-space:normal}.foot-num{display:block}.foot-psep{display:none}}
.legal-links{margin:0;display:flex;gap:16px}
.legal-links a{font-size:11.5px;color:var(--sky-300)}
/* ==== chooser, stubs, article ==== */
.chooser{grid-column:9 / span 4;align-self:end}
.chooser__opt{display:block;border-top:2px solid var(--brand-navy);padding:20px 0 22px;transition:background-color var(--duration-hover) var(--ease-standard)}
.chooser__opt:hover{background:var(--white)}
.chooser__n{font-family:var(--font-display);font-weight:500;font-size:26px;color:var(--text-numeral)}
.chooser__t{display:block;font-family:var(--font-display);font-weight:500;font-size:24px;line-height:1.1;color:var(--text-heading);margin-top:10px}
.chooser__d{display:block;font-size:13.5px;line-height:1.55;color:var(--text-muted);margin-top:6px}
.chooser__c{display:inline-block;margin-top:14px;font-size:11px;font-weight:700;letter-spacing:.10em;text-transform:uppercase;color:var(--brand-navy)}
.chooser__alt{margin-top:26px;font-size:13px;line-height:1.6;color:var(--text-muted)}
.stublist{margin:26px 0 0;padding:0;list-style:none;border-top:2px solid var(--brand-navy)}
.stublist li{border-bottom:1px solid var(--line)}
.stublist a{display:block;padding:15px 0;font-family:var(--font-display);font-weight:500;font-size:20px;color:var(--brand-navy)}
.art-h{font-size:54px;line-height:1.04;letter-spacing:-.025em;margin:16px 0 0;max-width:22ch}
.art-s{font-size:20px;line-height:1.55;color:var(--text-secondary);margin-top:18px;max-width:56ch}
/* ==== container-driven stacking for the new blocks ==== */
@container page (max-width:1180px){
  .caj-media .ds-media{max-height:440px}
  .caj-photo{max-height:440px}
}
@container page (max-width:1100px){
  .insv-lead,.insv-lead--solo{grid-column:1 / -1}
  .insv-rail{grid-column:1 / -1;margin-top:34px}
  .ilead__h{max-width:26ch}
}
@container page (max-width:900px){
  .insv-head,.insv-all{grid-column:1 / -1}
  .insv-all{justify-self:start;margin-top:26px;order:9}
}
@container page (max-width:720px){
  .insv .container{padding-top:44px;padding-bottom:44px}
  .insv-h{font-size:29px}
  .insv-lead{margin-top:10px}
  .ilead__h{font-size:28px}
  .irow__h{font-size:22px}
}
@container page (max-width:900px){
  .caj-media{grid-column:1 / -1;align-self:start;margin-right:calc(-1 * var(--caj-edge))}
  .caj-media .ds-media{aspect-ratio:4 / 3;max-height:400px}
  .caj-photo{aspect-ratio:4 / 3;max-height:400px}
  .caj-photo img{object-position:64% 52%}
  .caj-photo{border-radius:0}
  .caj-copy{grid-column:1 / -1;align-self:start;padding-top:34px}
  .caj-copy .ds-sh__lede,.caj-sub{max-width:52ch}
  .rowhead{display:none}
  .iteaser__t{font-size:32px;max-width:none}
  .final-h{font-size:44px;max-width:none}
  .chooser{justify-self:start}
}
@container page (max-width:720px){
  .caj{--caj-edge:20px}
  .caj-photo{aspect-ratio:4 / 5;max-height:none}
  .caj-photo img{object-position:58% 42%}
  .proofband .container{padding-top:44px;padding-bottom:44px}
  .ds-proof{grid-template-columns:1fr;gap:22px}
  .ds-proof__title{font-size:29px}
  .ds-proof__item,.ds-proof__item--wide{grid-template-rows:auto 16px auto;padding-left:16px}
  .ds-proof__item--wide .ds-proof__value{font-size:27px}
  .ds-proof__value{font-size:27px}
  .ds-proof__pending{width:100%;max-width:78px;height:22px}

  .art-h{font-size:36px}
  .iteaser__t{font-size:27px}
}



@container page (max-width:1000px){
  .navpanel{display:none !important}
}
@container page (max-width:1200px){

}

/* ---- primary masthead action ---- */
.hdrcta{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:0 0 auto;grid-column:3;justify-self:end;min-height:50px;min-width:182px;padding:0 22px;background:var(--action-primary-bg);color:var(--action-primary-fg);border:1px solid var(--action-primary-bg);border-radius:var(--radius-control);font-family:var(--font-sans);font-size:15.5px;font-weight:600;letter-spacing:.01em;text-decoration:none;white-space:nowrap;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.hdrcta:hover{background:var(--action-primary-bg-hover);border-color:var(--action-primary-bg-hover);color:var(--action-primary-fg)}
.hdrcta .ic{transition:transform var(--duration-hover) var(--ease-standard)}
.hdrcta:hover .ic{transform:translateX(3px)}
@container page (max-width:1240px){
  nav.main{gap:26px}
  nav.main>a,.navtoggle{font-size:14.5px}
  .hdrcta{min-width:auto}
  .navpanel{min-width:700px}
}

/* ContourField (design system, components/brand/ContourField.jsx) — survey pattern, navy tone,
   opacity 0.16, 64px grid. CSS line work only; supports content, never carries a layout. */
.contourfield{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(0,43,84,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(0,43,84,.16) 1px,transparent 1px);background-size:64px 64px}

/* Primary-nav state, declared last so it beats both the design system's bare `a` border and
   .navtoggle's own border:0 reset. The 2px sits on the masthead's bottom edge. */
nav.main>a,nav.main .navtoggle{border:0;border-bottom:2px solid transparent;transition:border-color var(--duration-hover) var(--ease-standard),color var(--duration-hover) var(--ease-standard)}
nav.main>a:hover,nav.main>a:focus-visible,nav.main .navtoggle:hover,nav.main .navtoggle:focus-visible{border-bottom-color:var(--brand-accent)}
nav.main .navitem.is-open .navtoggle{border-bottom-color:var(--brand-accent)}
html:not(.js) nav.main .navitem:hover .navtoggle{border-bottom-color:var(--brand-accent)}


/* ---- primary navigation: one rule set for every top-level control ----
   A control with a dropdown (.navitem > .navlink, upgraded to .navtoggle by enhance.js) and a
   direct link (nav.main > a) must be identical in height, baseline, type and state geometry.
   Declared last so it beats both the design system's bare `a` and .navtoggle's own resets. */
nav.main{flex-wrap:nowrap}
/* With JavaScript the toggle replaces the link; declared here so it outranks the late
   .navlink geometry rule below (which otherwise re-showed the label twice). */
html.js nav.main>.navitem>.navlink{display:none}
nav.main>.navitem{display:flex;align-items:stretch;position:static}
nav.main>a,
nav.main>.navitem>.navlink,
nav.main>.navitem>.navtoggle{display:flex;align-items:center;gap:7px;height:100%;box-sizing:border-box;padding:0;background:none;border:0;border-bottom:2px solid transparent;font-family:var(--font-sans);font-size:15.5px;font-weight:500;letter-spacing:.005em;line-height:1;white-space:nowrap;color:var(--brand-navy);text-decoration:none;cursor:pointer;transition:border-color var(--duration-hover) var(--ease-standard),color var(--duration-hover) var(--ease-standard)}
nav.main>a:hover,nav.main>a:focus-visible,
nav.main>.navitem>.navlink:hover,nav.main>.navitem>.navlink:focus-visible,
nav.main>.navitem>.navtoggle:hover,nav.main>.navitem>.navtoggle:focus-visible,
nav.main .navitem.is-open>.navtoggle,
html:not(.js) nav.main .navitem:hover>.navlink{border-bottom-color:var(--brand-accent)}
nav.main .navitem.is-open>.navtoggle{font-weight:600}

/* Utility strip at small widths: the phone label and the search word are dropped before the
   row can overlap itself. */
@container page (max-width:720px){
  .util .container{gap:10px}
  .util-phone__l,.util-follow__l{display:none}
  .loginbtn,.util-search{padding:0 12px;font-size:11.5px}
  .util-search{font-size:0;gap:0}
}
@container page (max-width:520px){
  .loginbtn{font-size:0;gap:0;padding:0 10px}
  .loginbtn .ic{display:none}
  .loginbtn::after{content:"Login";font-size:11.5px;font-weight:600;letter-spacing:.06em}
}

/* Nav fit, measured rather than assumed: with the JavaScript chevrons the five controls plus
   logo and CTA need ~1235px at full size. One compaction step, then the drawer — never a
   wrapped masthead. */
@container page (max-width:1340px){
  nav.main{gap:26px}
  nav.main>a,nav.main>.navitem>.navlink,nav.main>.navitem>.navtoggle{font-size:14.5px}
  .hdrcta{font-size:14.5px}
}
@container page (max-width:1260px){
  nav.main{gap:20px}
  nav.main>a,nav.main>.navitem>.navlink,nav.main>.navitem>.navtoggle{font-size:14px}
  .hdrcta{min-width:auto;padding:0 18px;font-size:14px}
  header.site>.container{gap:28px}
}
@container page (max-width:1199px){
  nav.main{display:none}
  .navpanel{display:none !important}
  .navtrigger{display:inline-flex;grid-column:2;justify-self:end}
  header.site,header.site>.container{height:84px}
  header.site>.container{grid-template-columns:1fr auto;gap:20px}
  .brand .ds-logo{height:40px}
  .util .container{height:44px}
  .utilr,.loginbtn,.util-search{height:44px}
  .utilsoc .soc{height:44px}
  header.site .hdrcta{display:none !important}
}

/* ==== hero: full-width background media (hero-only overrides) ==== */
.hero--media{position:relative;padding:0;background:var(--navy-800);display:flex;align-items:center;min-height:clamp(430px,50vh,520px);overflow:hidden}
.hero--media .hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:75% 48%}
/* Navy scrim, strongest left, clear by the right third so the property and the California
   light stay visible. Not a black cinematic wash. */
.hero--media .hero__scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,27,54,.93) 0%,rgba(0,27,54,.85) 26%,rgba(0,27,54,.44) 50%,rgba(0,27,54,.12) 70%,rgba(0,27,54,0) 84%)}
.hero--media .container{position:relative;width:100%;padding-top:72px;padding-bottom:76px}
.hero--media .hero-copy{grid-column:1 / span 6;display:block}
.hero--media .rule48{margin-bottom:12px}
.hero--media .eyebrow{color:var(--brand-sky)}
/* Headline widened to a two-line break ("Capitalize on / the Opportunity") — eyebrow +
   headline + lead read as one editorial group; CTAs sit apart from the narrative. */
.hero--media h1{color:var(--text-inverse);font-size:72px;line-height:.94;letter-spacing:-.03em;max-width:15ch;margin-top:10px}
.hero--media .lead{color:#E2EAF1;font-size:20px;line-height:1.47;max-width:40ch;margin-top:16px}
.hero--media .heroactions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero--media .hero__ph{margin-top:26px}
/* Hero-only expressive treatment: Sun Accent carries the primary action against the
   photograph, with Navy text for contrast. The global Button and the masthead CTA stay Navy. */
.hero--media .heroactions .ds-btn--primary{background:var(--brand-accent);border-color:var(--brand-accent);color:var(--brand-navy)}
.hero--media .heroactions .ds-btn--primary:hover{background:var(--sun-600,#C9622E);border-color:var(--sun-600,#C9622E);color:var(--brand-navy)}
.hero--media .heroactions .ds-btn--inverse-outline{border-color:rgba(255,255,255,.62);color:var(--text-inverse)}
.hero--media .heroactions .ds-btn--inverse-outline:hover{background:rgba(255,255,255,.12);border-color:var(--text-inverse)}
/* Short desktop viewports (~768px): step the display size one notch and tighten the frame so
   the Choose Your Path intro crests the fold. Mirrors the existing max-height pattern above. */
@media (max-height:820px){.hero--media .container{padding-top:36px;padding-bottom:28px}.hero--media h1{font-size:64px}.hero--media .lead{margin-top:14px}.hero--media .heroactions{margin-top:22px}}
@container page (max-width:1100px){
  .hero--media h1{font-size:60px}
  .hero--media .hero-copy{grid-column:1 / span 8}
  .hero--media .hero__img{object-position:78% 50%}
  .hero--media .hero__scrim{background:linear-gradient(90deg,rgba(0,27,54,.94) 0%,rgba(0,27,54,.88) 38%,rgba(0,27,54,.60) 62%,rgba(0,27,54,.24) 82%,rgba(0,27,54,.06) 100%)}
}
@container page (max-width:720px){
  .hero--media{min-height:470px}
  .hero--media .container{padding-top:40px;padding-bottom:40px}
  .hero--media .hero-copy{grid-column:1 / -1}
  .hero--media h1{font-size:42px;max-width:none}
  .hero--media .lead{font-size:16.5px;max-width:32ch}
  /* No mobile crop exists yet: hold the building in frame and carry the copy on a stronger
     vertical scrim rather than centre-cropping the photograph blindly. */
  .hero--media .hero__img{object-position:76% 42%}
  .hero--media .hero__scrim{background:linear-gradient(180deg,rgba(0,27,54,.90) 0%,rgba(0,27,54,.70) 46%,rgba(0,27,54,.40) 100%)}
  .hero--media .heroactions{gap:10px}
  .hero--media .ds-btn{width:100%}
}

/* Dropdown indicator. Explicit inline SVG, currentColor stroke, one interactive target
   with its label. About has no panel and therefore no chevron. */
nav.main .nav-chevron{display:block;width:9px;height:6px;flex:0 0 9px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.7;overflow:visible;transition:transform 180ms ease,opacity 180ms ease}
nav.main [aria-expanded="true"] .nav-chevron,nav.main .navitem.is-open>.navtoggle .nav-chevron{transform:rotate(180deg);opacity:1}
nav.main>.navitem>.navlink:hover .nav-chevron,nav.main>.navitem>.navtoggle:hover .nav-chevron,nav.main>.navitem>.navtoggle:focus-visible .nav-chevron{opacity:1}
html:not(.js) nav.main .navitem:hover>.navlink .nav-chevron{transform:rotate(180deg);opacity:1}

/* ==== Choose your path (homepage only) ====
   Three selection panels on the full-width Coastal Fog. Local classes: the global AudienceCard
   is untouched. */
.triage{background:var(--brand-fog);padding:0}
.triage .container{padding-top:54px;padding-bottom:58px;align-items:stretch}
.triage-intro{grid-column:1 / span 3;display:flex;flex-direction:column;justify-content:center;padding-right:12px}
.triage h2{font-size:32px;line-height:1.05;max-width:none;margin-top:0}
.triage-intro__l{margin-top:14px;font-size:14px;line-height:1.55;color:var(--text-secondary);max-width:26ch}
.tri-rows{grid-column:4 / span 9;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;background:none;border:0}
.tri-panel{display:flex;flex-direction:column;background:var(--brand-paper);border:1px solid var(--line);border-radius:3px;padding:26px 24px 22px;position:relative;text-decoration:none;transition:background-color 200ms var(--ease-standard),border-color 200ms var(--ease-standard)}
.tri-panel::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:transparent;border-radius:3px 3px 0 0;transition:background-color 200ms var(--ease-standard)}
.tri-panel__t{font-family:var(--font-display);font-weight:500;font-size:27px;line-height:1.08;color:var(--text-heading);margin-top:0;transition:color 200ms var(--ease-standard)}
/* Two-line minimum so the intent zone is structural, not copy-dependent, and the three action
   lines share one baseline without manual line breaks. */
.tri-panel__i{font-size:15.5px;line-height:1.45;color:var(--text-primary);margin:10px 0 22px;min-height:calc(2 * 1.45 * 15.5px)}
.tri-panel__a{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-family:var(--font-sans);font-size:12.5px;font-weight:600;letter-spacing:.06em;color:var(--brand-navy);display:flex;align-items:center;gap:8px;transition:color 200ms var(--ease-standard)}
.tri-panel__ar{display:inline-block;transition:transform 200ms var(--ease-standard)}
.tri-panel:hover,.tri-panel:focus-visible{background:var(--white);border-color:var(--brand-navy)}
.tri-panel:hover::before,.tri-panel:focus-visible::before{background:var(--brand-accent)}
.tri-panel:hover .tri-panel__t,.tri-panel:focus-visible .tri-panel__t{color:var(--brand-navy)}
.tri-panel:hover .tri-panel__a,.tri-panel:focus-visible .tri-panel__a{color:var(--sun-700)}
.tri-panel:hover .tri-panel__ar{transform:translateX(5px)}
@container page (max-width:1100px){
  .triage-intro{grid-column:1 / -1;padding-right:0}
  .triage-intro__l{max-width:46ch}
  .tri-rows{grid-column:1 / -1;margin-top:26px;gap:16px}
}
@container page (max-width:760px){
  .triage .container{padding-top:38px;padding-bottom:42px}
  .tri-rows{grid-template-columns:1fr;gap:14px}
  .tri-panel{padding:22px 20px 20px}
  .tri-panel__t{font-size:25px}
  .tri-panel__i{min-height:0}
}
/* Success stories — three funded transactions, open editorial 4/4/4.
   No card borders: the photography, hairline and type carry the structure. Local classes only. */
.stories .container{padding-top:84px;padding-bottom:84px;align-items:end}
.stories-head{grid-column:1 / span 8}
.stories-eyebrow{position:relative;padding-top:18px}
.stories-eyebrow::before{content:"";position:absolute;top:0;left:0;width:48px;height:2px;background:var(--brand-accent)}
.stories-h{font-family:var(--font-display);font-weight:500;font-size:38px;line-height:1.1;letter-spacing:-.02em;color:var(--text-heading);margin-top:14px;max-width:26ch;text-wrap:balance}
.stories-sub{margin-top:14px;font-size:16.5px;line-height:1.6;color:var(--text-secondary);max-width:56ch}
.stories-all{grid-column:9 / span 4;justify-self:end;align-self:start;margin-top:65px;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--brand-navy)}
.stories-all:hover{color:var(--sun-700)}
.stories-list{grid-column:1 / -1;margin-top:46px;padding-top:0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}
.story{display:flex;flex-direction:column;padding-top:26px;color:inherit;text-decoration:none}
.story__photo{margin:0;aspect-ratio:16 / 10;background:var(--brand-fog);overflow:hidden}
.story__photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 520ms cubic-bezier(.2,.6,.2,1)}
.story:hover .story__photo img{transform:scale(1.02)}
.story__meta{margin-top:16px;font-family:var(--font-sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-eyebrow)}
.story__h{font-family:var(--font-display);font-weight:500;font-size:23px;line-height:1.2;letter-spacing:-.015em;color:var(--text-heading);margin-top:10px;text-wrap:pretty}
.story__t{margin-top:10px;font-size:15px;line-height:1.6;color:var(--text-secondary);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.story__a{margin-top:auto;padding-top:20px;font-family:var(--font-sans);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--brand-navy)}
.story:hover .story__a{color:var(--sun-700)}
.story:focus-visible{outline:2px solid var(--brand-accent);outline-offset:4px}
.devonly{display:none}
[data-dev="true"] .devonly{display:block;margin-top:14px;font-size:11px;line-height:1.9;color:var(--text-muted)}
[data-dev="true"] .stories-dev{grid-column:1 / -1}
[data-dev="true"] .ds-proof__dev{display:block;margin-top:10px;font-size:10px;letter-spacing:.06em;color:var(--brand-sky)}
[data-dev="true"] .ds-proof__dev .ap-ph{display:inline}
@container page (max-width:1400px){
  .insv-h{font-size:34px}
  .ilead__h{font-size:31px}
  .proofband .container{padding-top:48px;padding-bottom:48px}
  .testi-h{font-size:34px}
  .testi-q{font-size:19px}
  .testi-item.is-featured .testi-q{font-size:24px}
  .ds-proof__title{font-size:26px}
  .ds-proof__value{font-size:34px}
  .ds-proof__item{grid-template-rows:minmax(36px,auto) minmax(16px,auto) auto}
  .ds-proof__item--wide .ds-proof__value{font-size:31px}
  .stories .container{padding-top:72px;padding-bottom:72px}
  .stories-h{font-size:34px}
  .stories-list{gap:0 28px;margin-top:40px}
  .story__h{font-size:21.5px}
}
@container page (max-width:1180px){
  .ds-proof{grid-template-columns:repeat(2,1fr);gap:28px 24px}
  .ds-proof__intro{grid-column:1 / -1;padding-right:0}
  .ds-proof__item,.ds-proof__item--wide{grid-column:span 1;min-height:0}
}
@container page (max-width:1100px){
  .stories-head{grid-column:1 / -1}
  .stories-all{grid-column:1 / -1;justify-self:start;align-self:start;margin-top:20px}
  .stories-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 28px;margin-top:34px}
}
@container page (max-width:760px){
  .stories .container{padding-top:56px;padding-bottom:56px}
  .stories-h{font-size:30px}
  .stories-list{grid-template-columns:1fr;gap:32px}
  .story__photo{aspect-ratio:3 / 2}
}

/* ==== T1 refinement pass: tablet footer columns, mobile hit areas, mobile triage tightening ==== */
.skip{display:inline-flex;align-items:center;min-height:44px}
@container page (max-width:900px){
  .foot-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 24px}
}
@container page (max-width:720px){
  .utilr,.loginbtn,.util-search{height:44px}
  .util-phone{min-height:44px}
  footer.site ul{gap:0}
  footer.site ul a{display:flex;align-items:center;min-height:44px}
  .legal-links{flex-wrap:wrap;gap:0 20px}
  .legal-links a{display:inline-flex;align-items:center;min-height:44px}
  .stories-all,.caj-link,.insv-all{display:inline-flex;align-items:center;min-height:44px}
  .triage .container{padding-top:36px;padding-bottom:36px}
  .tri-rows{gap:12px;margin-top:20px}
  .tri-panel{padding:18px 18px 16px}
  .tri-panel__i{margin:8px 0 16px;min-height:0}
  .tri-panel__a{padding-top:12px}
  .triage-intro__l{margin-top:10px}
}
@container page (max-width:520px){
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 16px}
}
/* Narrow-phone fallback: two nav columns get cramped below ~360px. */
@container page (max-width:359px){
  .foot-cols{grid-template-columns:1fr;gap:26px}
}

/* ==== social clusters: utility strip, drawer, footer. The SVGs carry their own rounded-square
   perimeter; boxes below are hit areas only. ==== */
.soc{display:inline-flex;align-items:center;justify-content:center;color:var(--sky-300)}
.soc svg{width:16px;height:16px;display:block}
a.soc:hover{color:var(--white)}
/* Follow + social: one compact cluster. Auto margins on the cluster and on .utilr split the
   strip's free space, seating the cluster mid-right rather than glued to Client login.
   Badges: 20px artwork in 27px-wide boxes (7px visible gaps, 48px-tall targets) — the box no
   longer dictates the visual rhythm. */
.util-follow{display:flex;align-items:center;margin-left:auto}
.util-follow__l{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-sky);margin-right:9px}
.utilsoc{display:flex;align-items:center}
.utilsoc .soc{width:27px;height:48px;--soc-glyph:var(--navy-800)}
.utilsoc .soc svg{width:20px;height:20px}
.utilr{margin-left:auto}
.drawer-soc{display:flex;gap:6px;padding:2px 12px;border-bottom:1px solid var(--line);background:var(--brand-fog)}
.drawer-soc .soc{width:48px;height:48px;color:var(--brand-navy);--soc-glyph:var(--brand-fog)}
.drawer-soc .soc svg{width:20px;height:20px}
.drawer-soc a.soc:hover{color:var(--sun-700)}
.foot-soc{display:flex;gap:7px;margin:20px 0 0}
.foot-soc .soc{width:30px;height:30px;opacity:.72;--soc-glyph:var(--navy-800)}
.foot-soc a.soc:hover{opacity:1}
.foot-soc .soc svg{width:24px;height:24px}
.soc:focus-visible{outline:2px solid var(--brand-accent);outline-offset:2px}
@container page (max-width:720px){.foot-soc .soc{width:44px;height:44px}}
@container page (max-width:520px){
  .util-follow{display:none}
}

/* Client login reads as one group: 5px label-to-chevron, 26px chevron-to-divider (Search side of the divider keeps its 18px). */
.loginbtn{padding-right:26px}
.loginbtn .lucide-chevron-down{margin-left:-3px}

/* ==== V2.1 mega menu, destination-row model (prototype: Borrowers, Insights) ==== */
.navpanel--mega{min-width:0;max-width:none;width:min(1376px,calc(100% - 64px));overflow:hidden}
.megamenu{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;padding:26px 40px 28px;align-items:start}
.mega-main{grid-column:1 / span 8}
.mega-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.mega-cols--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.mega-glabel{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-eyebrow);margin:0 0 4px;padding:0 10px}
.mega-row{display:flex;gap:12px;align-items:flex-start;padding:9px 10px;border-radius:4px;transition:background-color var(--duration-hover) var(--ease-standard)}
.mega-row:hover,.mega-row:focus-visible{background:var(--brand-fog)}
.mega-row__ic{flex:0 0 auto;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;background:var(--sky-100);border-radius:4px;color:var(--brand-navy);transition:color var(--duration-hover) var(--ease-standard)}
.mega-row__t{display:block;font-size:14.5px;font-weight:600;line-height:1.3;color:var(--brand-navy)}
.mega-row__d{display:block;margin-top:2px;font-size:13px;line-height:1.42;color:var(--text-secondary);max-width:270px}
.mega-rail{grid-column:9 / span 4;background:var(--brand-fog);align-self:stretch;margin:-26px -40px -28px 0;padding:26px 28px;display:flex;flex-direction:column;gap:10px}
.mega-rail .mega-glabel{padding:0}
.mega-mini{display:flex;gap:14px;align-items:flex-start;padding:8px;margin:0 -8px;border-radius:4px;transition:background-color var(--duration-hover) var(--ease-standard)}
.mega-mini:hover{background:rgba(255,255,255,.66)}
.mega-mini__th{flex:0 0 92px;width:92px;aspect-ratio:4 / 3;overflow:hidden;display:block}
.mega-mini__th img,.mega-mini__th .ds-media{width:100%;height:100%;object-fit:cover;display:block}
.mega-mini__meta{display:block;font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--text-eyebrow)}
.mega-mini__h{display:block;font-family:var(--font-display);font-weight:500;font-size:17px;line-height:1.28;color:var(--text-heading);margin-top:4px;text-wrap:pretty}
.mega-mini:hover .mega-mini__h{color:var(--sun-700)}
.mega-mini__a{display:inline-block;margin-top:5px;font-size:11.5px;font-weight:600;color:var(--brand-navy);white-space:nowrap}
.mega-rail__sep{margin-top:auto;padding-top:14px;border-top:1px solid var(--brand-stone)}
.mega-cta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-navy)}
.mega-cta .ar{transition:transform var(--duration-hover) var(--ease-standard)}
.mega-cta:hover{color:var(--sun-700)}
.mega-cta:hover .ar{transform:translateX(4px)}
/* Active trigger: restrained Sky rule under the open item's label */
.nav-label{position:relative}
html:not(.js) .navitem:hover>.navlink .nav-label::after,html:not(.js) .navitem:focus-within>.navlink .nav-label::after,html.js .navitem.is-open .navtoggle .nav-label::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;background:var(--brand-sky)}

/* --- Header logo: one-shot reveal. The SVG is inlined in the masthead (a <style> inside an
   <img>-referenced SVG is stripped in delivery), so the motion lives here. Default state is
   the FINISHED lockup — the mask windows are open and the sweep is transparent in the markup,
   so a failed stylesheet or reduced-motion preference simply shows the completed logo. The
   animation runs once on load with fill:both; nothing loops and nothing replays on hover. --- */
.brand .ap-logo{display:block;height:56px;width:auto}
.ap-logo .ap-wipe{animation-timing-function:var(--ease-standard);animation-iteration-count:1;animation-fill-mode:both}
.ap-logo .ap-wipe--word{animation-name:apWipeInL;animation-delay:80ms;animation-duration:740ms}
.ap-logo .ap-wipe--portfolio{animation-name:apWipeInR;animation-delay:820ms;animation-duration:420ms}
/* The arrow is drawn LEFT→RIGHT, in the stroke’s own direction of travel, and starts while
   the stroke is still arriving — the sweep hands off into the mark rather than the mark
   appearing after it. No opacity reveal on the arrow: it is only ever the wipe. */
.ap-logo .ap-wipe--arrow{animation-name:apWipeInR;animation-delay:1000ms;animation-duration:420ms}
.ap-logo .ap-sweep{animation:apLogoSweep 1200ms var(--ease-standard) 120ms 1 both}
@keyframes apWipeInL{from{transform:translateX(700px)}to{transform:translateX(0)}}
@keyframes apWipeInR{from{transform:translateX(-700px)}to{transform:translateX(0)}}
@keyframes apLogoSweep{0%{opacity:0;transform:skewX(-6deg) translateX(-620px)}10%{opacity:.85}68%{opacity:.85}88%{opacity:.46}100%{opacity:0;transform:skewX(-6deg) translateX(-40px)}}
@media (prefers-reduced-motion:reduce){.ap-logo .ap-wipe,.ap-logo .ap-sweep{animation:none}}