@font-face{font-family:"Cormorant Garamond";font-weight:500;font-style:normal;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-weight:600;font-style:normal;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Jost";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/jost-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Jost";font-weight:500;font-style:normal;font-display:swap;src:url(assets/fonts/jost-latin-500-normal.woff2) format("woff2")}
body{--accent:#3fd9c6;--bg:#030a0b;--gold:#e6b866;--ui:var(--gold);--text:#f4f2eb;--muted:#bcc4c2;--hero:url(assets/hero-teal.webp);--hd:74px}
body.about{--accent:#eeb25e;--bg:#090705;--hero:url(assets/hero-gold.webp)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:
  radial-gradient(ellipse at 0% 22%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 34%),
  radial-gradient(ellipse at 100% 50%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 32%),
  radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--ui) 5%,transparent),transparent 40%),
  var(--bg);color:var(--text);font-family:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:400;line-height:1.8;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}

header{position:fixed;top:0;left:0;right:0;z-index:20;height:var(--hd);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,5vw,84px);
  border-bottom:1px solid rgba(255,255,255,.07);transition:background .25s}
header.solid{background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:18px;font-size:15px;letter-spacing:.3em}
.brand img{width:58px;height:auto;display:block}
nav{display:flex;gap:clamp(16px,3.2vw,56px);font-size:15px}
nav a{opacity:.86;padding:7px 0;border-bottom:1.5px solid transparent}
nav a:hover{opacity:1}
nav a.active{opacity:1;color:var(--ui);border-color:var(--ui)}

.hero{--hh:clamp(680px,78vh,820px);position:relative;isolation:isolate;overflow:hidden;height:var(--hh);display:flex;justify-content:center;align-items:flex-start;padding:calc(var(--hh)*.31) 20px 0;border-bottom:1px solid rgba(255,255,255,.09)}
.hero::before{content:"";position:absolute;inset:-2%;z-index:-3;background:var(--hero) center center / cover no-repeat;filter:brightness(.68) saturate(.84) contrast(.94);transform:scale(1.03)}
.hero::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(ellipse at 8% 45%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 46%),
  radial-gradient(ellipse at 92% 46%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 44%),
  radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--ui) 12%,transparent),transparent 50%),
  linear-gradient(90deg,color-mix(in srgb,var(--accent) 9%,transparent),transparent 27%,transparent 73%,color-mix(in srgb,var(--accent) 9%,transparent));opacity:.78}
.card-hero{width:min(940px,92vw);min-height:calc(var(--hh)*.42);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px 44px 22px;border-radius:14px;
  background:linear-gradient(170deg,color-mix(in srgb,var(--accent) 16%,transparent),color-mix(in srgb,var(--accent) 5%,transparent) 60%),color-mix(in srgb,var(--bg) 46%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  box-shadow:0 0 0 1px rgba(255,255,255,.035) inset,0 24px 60px rgba(0,0,0,.36),0 0 42px color-mix(in srgb,var(--accent) 7%,transparent)}
.wordmark{font-size:17px;letter-spacing:.42em;margin:0;padding-left:.42em}
.wordmark b{font-weight:400;color:var(--gold)}
.eyebrow{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:0}
.card-hero .eyebrow{color:var(--text);font-size:13px;letter-spacing:.34em}
.rule{width:56px;height:1px;background:var(--ui);margin:12px 0 16px;opacity:.95}
.card-hero .rule{margin:12px auto 16px;background:var(--gold)}
h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(28px,2.7vw,38px);line-height:1.12;margin:0 0 12px;text-wrap:balance}
.card-hero p{font-size:15.5px;line-height:1.7;color:#e2e4df;margin:0 auto 8px;max-width:76ch}
.btn{display:inline-flex;align-items:center;gap:16px;margin-top:28px;padding:10px 34px;border:1px solid var(--ui);border-radius:999px;font-size:15px;color:#fff}
.btn:hover{background:color-mix(in srgb,var(--ui) 14%,transparent)}

body{display:flex;flex-direction:column;min-height:100vh}
main{position:relative;flex:1}
.wrap{width:min(1320px,90vw);margin:0 auto}
.band{position:relative;border-bottom:1px solid rgba(255,255,255,.08);padding:34px 0;background:
  radial-gradient(ellipse at 12% 42%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 34%),
  radial-gradient(ellipse at 88% 56%,color-mix(in srgb,var(--ui) 5%,transparent),transparent 30%),
  linear-gradient(180deg,color-mix(in srgb,var(--accent) 2.5%,transparent),transparent 46%,color-mix(in srgb,var(--accent) 2%,transparent))}
.row{display:grid;grid-template-columns:minmax(280px,.8fr) 1.45fr;gap:clamp(24px,5vw,90px);align-items:center}
h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(28px,2.7vw,38px);line-height:1.12;margin:8px 0 0;text-wrap:balance}
.lead{font-size:15.5px;color:#d5dad7;margin:0;max-width:46ch}
.row.r4{grid-template-columns:minmax(250px,.5fr) 1.6fr;gap:clamp(20px,3vw,48px)}
.cards{display:grid;gap:22px}
.c4{gap:16px}
.c3{grid-template-columns:repeat(3,1fr)} .c4{grid-template-columns:repeat(4,1fr)}
.card{padding:24px 18px 24px;border-radius:12px;text-align:center;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 8%,transparent),rgba(255,255,255,.012));border:1px solid color-mix(in srgb,var(--accent) 26%,transparent)}
.icon{flex:none;width:52px;height:52px;border:1px solid var(--ui);border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;color:var(--ui)}
.icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.card h3,.item h3{font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;margin:0}
.card .rule{margin:11px auto 13px;width:30px}
.card p{font-size:14.5px;line-height:1.6;color:#d5dad7;margin:0}
.card.wide{text-align:left;padding:26px 30px 28px}
.card.wide .head{display:flex;align-items:center;gap:26px;margin-bottom:16px}
.card.wide .icon{margin:0;width:58px;height:58px}
.card.wide .rule{margin:12px 0 0;width:52px}
.card.wide h3{letter-spacing:.3em}
.meet{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.meet h2{font-size:clamp(34px,3.4vw,46px);margin-bottom:8px}
.meet .logo-side{text-align:center}
.meet .logo-side img{width:260px;height:auto;filter:drop-shadow(0 0 14px rgba(230,184,102,.14))}
.meet .logo-side p{margin:10px 0 0}
.items{display:grid;grid-template-columns:1fr 1px 1fr;gap:clamp(20px,4vw,70px);align-items:center;width:min(1180px,100%);margin:0 auto}
.items .sep{width:1px;height:76px;background:rgba(255,255,255,.2)}
.item{display:flex;gap:28px;align-items:center}
.item .icon{margin:0;width:58px;height:58px}
.item h3{color:var(--ui);font-size:11.5px;letter-spacing:.24em;margin-bottom:3px}
.item p{font-size:14.5px;line-height:1.6;color:#d5dad7;margin:0}
.center{text-align:center}
.center h2{margin:8px auto 24px;max-width:26ch}
.direction{display:grid;grid-template-columns:1.25fr 1px 1fr;gap:clamp(24px,5vw,80px);align-items:center;width:min(1380px,100%);margin:0 auto}
.direction .sep{width:2px;height:40px;background:var(--ui)}
.direction h2{font-size:clamp(26px,2.5vw,34px);margin-top:10px}
.company{font-size:13.5px;color:var(--muted);margin:26px 0 0;text-align:center}
.notice{width:min(860px,100%);margin:0 auto;padding:28px 34px;border-radius:12px;text-align:center;background:rgba(255,255,255,.025);border:1px solid color-mix(in srgb,var(--accent) 44%,transparent)}
.notice h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:23px;color:var(--ui);margin:0 0 12px}
.notice p{font-size:14.5px;color:#d5dad7;margin:0 auto 10px;max-width:68ch}

.legal main{padding-top:calc(var(--hd) + 46px)}
.doc{width:min(840px,90vw);margin:0 auto 10px;padding:38px clamp(22px,4vw,52px) 40px;border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 6%,transparent),rgba(255,255,255,.012));border:1px solid color-mix(in srgb,var(--accent) 26%,transparent)}
.doc h1{font-size:clamp(32px,3.2vw,42px);margin:8px 0 6px}
.doc .date{font-size:13px;color:var(--muted);margin:0 0 22px}
.doc h2{font-size:23px;font-weight:600;margin:28px 0 8px}
.doc p,.doc li{font-size:15.5px;color:#d9dedb;margin:0 0 10px}
.doc ul{margin:0 0 10px;padding-left:20px}
.doc a{color:var(--accent);border-bottom:1px solid color-mix(in srgb,var(--accent) 45%,transparent)}
.doc dl{display:grid;grid-template-columns:max-content 1fr;gap:8px 26px;margin:0 0 10px;font-size:15.5px}
.doc dt{color:var(--gold);letter-spacing:.04em}
.doc dd{margin:0;color:#d9dedb}
.todo{background:rgba(230,184,102,.14);border:1px dashed var(--gold);border-radius:4px;padding:0 6px;color:#f3d9a2}

footer{background:rgba(0,0,0,.42);padding:26px clamp(18px,5vw,84px) 26px;font-size:13px;color:#b3bab8}
.legal footer{margin-top:54px;border-top:1px solid rgba(255,255,255,.09)}
.f-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.f-brand{display:flex;align-items:center;gap:16px;letter-spacing:.3em;color:#ecebe6;font-size:13.5px;justify-self:start}
.f-brand img{width:54px;height:auto}
.f-links{display:flex;justify-content:center;flex-wrap:wrap;row-gap:10px}
.f-links a{padding:0 22px;border-left:1px solid rgba(255,255,255,.28);line-height:1.1;color:#dfe2df}
.f-links a:first-child{border-left:0}
.f-links a:hover,.f-contact a:hover{color:#fff}
.f-copy{justify-self:end;text-align:right;font-size:12.5px}
.f-contact{margin:20px 0 0;font-size:12px;text-align:center}
.f-contact a{color:var(--gold)}
.f-note{max-width:860px;margin:8px auto 0;font-size:11.5px;line-height:1.6;color:#8f9897;text-align:center}
@media(max-width:1000px){
  .row,.meet,.items,.direction{grid-template-columns:1fr;text-align:center;gap:24px}
  .row .rule,.meet .rule{margin-left:auto;margin-right:auto}
  .lead{margin:0 auto}
  .items .sep,.direction .sep{display:none}
  .item{flex-direction:column;gap:12px}
  .c4{grid-template-columns:repeat(2,1fr)}
  .f-row{grid-template-columns:1fr;justify-items:center}
  .f-brand,.f-copy{justify-self:center;text-align:center}
}
@media(max-width:700px){
  .brand span{display:none}
  header{background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
  .brand img{width:50px}
  nav{font-size:14px}
  .c3,.c4{grid-template-columns:1fr}
  .card.wide .head{gap:16px}
  .hero{height:auto;min-height:var(--hh);padding-top:calc(var(--hh)*.31);padding-bottom:40px}
  .card-hero{min-height:0}
  .card-hero{padding:22px 18px 26px}
  .wordmark{font-size:14px;letter-spacing:.3em}
  .f-links a{padding:2px 12px}
  .doc dl{grid-template-columns:1fr;gap:2px 0}
  .doc dd{margin-bottom:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}header{transition:none}}


@media (min-width: 1001px){
  .hero{
    height:100vh;
    min-height:720px;
    max-height:none;
    padding:var(--hd) 24px 24px;
    display:grid;
    place-items:center;
  }
  .hero::before{
    inset:0;
    transform:none;
    background-position:center center;
    background-size:cover;
    filter:brightness(.56) saturate(.72) contrast(.92);
  }
  .hero::after{
    opacity:.58;
    background:
      radial-gradient(ellipse at 12% 40%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 42%),
      radial-gradient(ellipse at 88% 45%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 42%),
      radial-gradient(ellipse at 50% 55%,transparent 0 42%,color-mix(in srgb,var(--ui) 7%,transparent) 72%,transparent 100%);
  }
  .card-hero{
    width:min(860px,72vw);
    min-height:auto;
    padding:34px 52px 38px;
    border-radius:18px;
    background:linear-gradient(180deg,rgba(6,17,18,.30),rgba(3,10,11,.22));
    border:1px solid color-mix(in srgb,var(--accent) 54%,rgba(255,255,255,.15));
    backdrop-filter:blur(15px) saturate(120%);
    -webkit-backdrop-filter:blur(15px) saturate(120%);
    box-shadow:0 18px 70px rgba(0,0,0,.24),0 0 28px color-mix(in srgb,var(--accent) 9%,transparent),inset 0 0 0 1px rgba(255,255,255,.03);
  }
}


.card,.notice,.doc{
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 10%,transparent),rgba(255,255,255,.018));
  border:1px solid color-mix(in srgb,var(--accent) 34%,rgba(255,255,255,.10));
  backdrop-filter:blur(12px) saturate(115%);
  -webkit-backdrop-filter:blur(12px) saturate(115%);
  box-shadow:0 10px 34px rgba(0,0,0,.18),inset 0 0 0 1px rgba(255,255,255,.025);
}


footer{border-top:1px solid rgba(255,255,255,.10);background:color-mix(in srgb,var(--bg) 88%,black 12%)}


.hero::before{inset:-24px;transform:none;filter:brightness(.48) saturate(.50) contrast(.74) blur(3px)}
.hero::after{opacity:1;background:
  radial-gradient(ellipse at 10% 45%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 45%),
  radial-gradient(ellipse at 90% 46%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 44%),
  linear-gradient(color-mix(in srgb,var(--bg) 58%,transparent),color-mix(in srgb,var(--bg) 58%,transparent))}
@media (min-width: 1001px){
  .hero::before{inset:-24px;transform:none;filter:brightness(.48) saturate(.50) contrast(.74) blur(3px)}
  .hero::after{opacity:1;background:
    radial-gradient(ellipse at 12% 40%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 42%),
    radial-gradient(ellipse at 88% 45%,color-mix(in srgb,var(--accent) 6%,transparent),transparent 42%),
    linear-gradient(color-mix(in srgb,var(--bg) 58%,transparent),color-mix(in srgb,var(--bg) 58%,transparent))}
}
@media (min-width: 1001px){ .card-hero{backdrop-filter:blur(5px) saturate(110%);-webkit-backdrop-filter:blur(5px) saturate(110%);background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 30%,transparent),color-mix(in srgb,var(--bg) 22%,transparent));} }


.centered-section-head{width:min(1100px,100%);margin:0 auto 32px;text-align:center}
.centered-section-head .eyebrow{margin-bottom:0}
.centered-section-head h2{max-width:none;margin:8px auto 0}
.centered-section-head .rule{margin:13px auto 16px}
.centered-section-head .lead{max-width:930px;margin:0 auto}
.centered-section-head .subline{font-size:15px;color:#d5dad7;margin:10px auto 0;max-width:900px}
.equal-cards{width:min(1180px,100%);margin:0 auto;align-items:stretch}
.equal-cards>.card{min-height:260px;height:100%}
.about .equal-cards>.card{min-height:260px}
.contact-card{width:min(920px,90vw);margin:calc(var(--hd) + 56px) auto 58px;padding:36px clamp(22px,4vw,46px);border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 10%,transparent),rgba(255,255,255,.018));border:1px solid color-mix(in srgb,var(--accent) 34%,rgba(255,255,255,.10));backdrop-filter:blur(12px) saturate(115%);-webkit-backdrop-filter:blur(12px) saturate(115%);box-shadow:0 10px 34px rgba(0,0,0,.18),inset 0 0 0 1px rgba(255,255,255,.025)}
.contact-intro{text-align:center;margin-bottom:30px}.contact-intro h1{margin:8px auto 12px}.contact-intro p{max-width:62ch;margin:0 auto;color:#d5dad7}
.contact-form{display:flex;flex-direction:column;gap:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-field{display:flex;flex-direction:column;gap:8px;font-size:13px;color:#e7e8e3}.form-field input,.form-field select,.form-field textarea{width:100%;border:1px solid color-mix(in srgb,var(--accent) 30%,rgba(255,255,255,.14));border-radius:9px;background:rgba(0,0,0,.20);color:var(--text);font:inherit;font-size:15px;padding:13px 14px;outline:none}.form-field textarea{resize:vertical;min-height:160px}.form-field select option{background:#111;color:#fff}.form-submit{align-self:center;cursor:pointer;background:transparent}.form-note{font-size:12px;color:var(--muted);margin:0;text-align:center}.form-success{margin-top:8px;padding:18px 20px;border-radius:10px;text-align:center;border:1px solid color-mix(in srgb,var(--accent) 40%,rgba(255,255,255,.10));background:color-mix(in srgb,var(--accent) 8%,transparent)}
@media(max-width:700px){.equal-cards>.card,.about .equal-cards>.card{min-height:0}.centered-section-head{margin-bottom:24px}.form-grid{grid-template-columns:1fr}.contact-card{margin-top:calc(var(--hd) + 28px)}}



.about-hero-title span{display:block}
.hero-spaced-copy{width:100%;margin:14px auto 0}
.hero-spaced-copy p{margin:0 auto 17px;max-width:none}
.hero-spaced-copy p:last-child{margin-bottom:0}
.subline-large{font-size:20px!important;line-height:1.6;margin-top:16px!important;letter-spacing:.01em}
.single-line-heading{max-width:none!important}
.conversational-line{max-width:none!important;margin-top:20px!important;line-height:1.7!important}
.equal-cards>.card{padding-top:28px;padding-bottom:28px}
.centered-section-head{margin-bottom:38px}
.centered-section-head h2{line-height:1.2}
.centered-section-head .lead{line-height:1.7}

@media (min-width:1001px){
  .desktop-line{white-space:nowrap}
  .desktop-only{display:block}
  .about .card-hero{width:min(1020px,82vw)}
  .single-line-heading{white-space:nowrap}
  .conversational-line{white-space:nowrap}
}
@media (max-width:1000px){
  .desktop-only{display:none}
  .hero-spaced-copy p{white-space:normal}
  .subline-large{font-size:18px!important}
}
@media (max-width:700px){
  .hero-spaced-copy{margin-top:10px}
  .hero-spaced-copy p{margin-bottom:14px}
  .subline-large{font-size:17px!important}
}



.card-hero .btn{margin-top:32px}
.meet .btn{margin-top:30px}
.hero-spaced-copy p{line-height:1.7}
.card p,.item p{line-height:1.6}
.notice p,.form-note,.form-success p{line-height:1.6}
.about-hero-title{text-transform:uppercase}
@media (min-width:1001px){
  .about .card-hero{width:min(1320px,94vw);padding-left:58px;padding-right:58px}
  .about-hero-title{white-space:nowrap;font-size:clamp(27px,2.25vw,34px);max-width:none}
  .about .card-hero p{max-width:none}
}



body:not(.about) nav a.active{
  color:var(--accent);
  border-color:var(--accent);
}


.about .hero-spaced-copy{
  margin-top:14px;
}
.about .hero-spaced-copy p{
  line-height:1.7;
  margin-bottom:17px;
}
.about .hero-spaced-copy p:last-child{
  margin-bottom:0;
}


.card p,
.item p{
  line-height:1.6;
}


.meet .logo-side img{
  width:190px;
}




body{line-height:1.9}


.card-hero,
.about .card-hero{
  width:min(1040px,92vw);
}


.card-hero h1,
.about-hero-title{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:500;
  font-size:clamp(28px,2.7vw,38px);
  line-height:1.12;
  text-transform:none;
  margin:0 0 18px;
}


.card-hero > p:not(.eyebrow):not(.wordmark),
.about .hero-spaced-copy p{
  line-height:1.45;
  margin:0 auto 14px;
  max-width:none;
}
.card-hero > p:not(.eyebrow):not(.wordmark):last-of-type,
.about .hero-spaced-copy p:last-child{
  margin-bottom:0;
}
.about .hero-spaced-copy{
  margin:0 auto;
  width:100%;
}


.card-hero .btn,
.about .card-hero .btn{
  margin-top:32px;
}


.card p,
.item p{
  line-height:1.5;
}


.equal-cards{align-items:stretch}
.equal-cards>.card{min-height:260px;height:100%;padding-top:28px;padding-bottom:28px}


.meet .logo-side img{width:190px}


nav a.active{color:var(--ui);border-color:var(--ui)}
body:not(.about){--ui:#3fd9c6}

@media (min-width:1001px){
  .desktop-line{white-space:nowrap}
  .about .card-hero{width:min(1040px,92vw)}
}

@media (max-width:1000px){
  .desktop-line{white-space:normal}
}

@media (max-width:700px){
}




.card-hero > p:not(.eyebrow):not(.wordmark),
.about .hero-spaced-copy p{line-height:30px;margin:0 auto;text-wrap:balance}
.about .hero-spaced-copy{margin:0 auto}

.card-hero h1,
.about-hero-title{margin-bottom:13.9px}
.card-hero .btn,
.about .card-hero .btn{margin-top:28.5px}

.about .card-hero .rule{margin:14.1px auto 18.1px}


.card p,
.item p{line-height:30px;text-wrap:balance}
.card .rule{margin-bottom:8.9px}
.card.wide .head{margin-bottom:11.9px}
.item h3{margin-bottom:0}
.notice p{line-height:30px;margin:0 auto;text-wrap:balance}


.lead,.subline,.company,.contact-intro p,.form-success p,.doc p,.doc li,.doc dd,.doc dt{line-height:30px}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

.meet .btn{margin-top:28.5px}


.btn-row{display:flex;justify-content:center;flex-wrap:wrap;gap:14px 18px;margin-top:28.5px}
.card-hero .btn-row .btn{margin-top:0}
.company-alone{margin-top:0}


body:not(.about) .equal-cards>.card p{max-width:300px;margin-left:auto;margin-right:auto}
.about .band.center .equal-cards>.card p{max-width:330px;margin-left:auto;margin-right:auto}


.f-note{text-wrap:balance}

html[lang="en"] .meet .lead{max-width:520px;text-wrap:balance}
html[lang="en"] body:not(.about) .equal-cards>.card:nth-child(1) p{max-width:250px}
html[lang="en"] .about #approach.equal-cards>.card:nth-child(3) p,html[lang="en"] .about #approach .equal-cards>.card:nth-child(3) p{max-width:215px}


nav{align-items:center}
.lang-switch{display:inline-flex;align-items:center;gap:8px;margin-left:clamp(6px,1.4vw,22px)}
nav .lang-switch a{display:inline-block;min-width:40px;text-align:center;padding:5px 11px;border:1px solid rgba(255,255,255,.38);border-radius:999px;font-size:12.5px;letter-spacing:.1em;line-height:1.2;opacity:.85;color:inherit;transition:background .2s,border-color .2s,color .2s}
nav .lang-switch a:hover{opacity:1;border-color:var(--ui)}
nav .lang-switch a.on{opacity:1;background:var(--ui);border-color:var(--ui);color:#0b0f10;font-weight:500}
.lang-note{font-size:13.5px;line-height:1.6;opacity:.8;margin:6px 0 18px}
.lang-note a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){nav{gap:12px;font-size:13.5px}.lang-switch{gap:5px;margin-left:2px}nav .lang-switch a{min-width:32px;padding:3px 7px;font-size:11.5px}}
@media(max-width:400px){nav{gap:10px;font-size:13px}.brand img{width:44px}}

html[lang="fr"] .about #approach .equal-cards>.card:nth-child(3) p,html[lang="fr"] .about #approach.equal-cards>.card:nth-child(3) p{max-width:235px}
.lang-note a{border-bottom:0}

.equal-cards>.card p{margin-left:auto;margin-right:auto}

/* Responsive reading and keyboard access. */
.card-hero h1,.about-hero-title,.desktop-line,.single-line-heading{white-space:normal}
.card-hero > p:not(.eyebrow):not(.wordmark){max-width:80ch;margin-bottom:12px}
.contact-lead{max-width:62ch;margin:0 auto;text-align:center}
.band{scroll-margin-top:90px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
@media(max-width:700px){.hero{min-height:620px;padding-top:140px;padding-bottom:64px}.brand span{display:none}.card-hero{width:100%}header{padding-left:14px;padding-right:14px}nav{gap:12px}.lang-switch{gap:4px}.wordmark{font-size:13px;letter-spacing:.25em}.card-hero h1{font-size:32px}.btn{padding:10px 22px}.f-contact{overflow-wrap:anywhere}}

/* Two panels and a compact company page. */
.c2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1000px}
.c2>.card p{max-width:36ch!important;margin-inline:auto}
.company-card{text-align:center;max-width:840px;margin-top:calc(var(--hd) + 70px)}
.company-card h1{margin:16px 0 24px}
.company-card>p:not(.eyebrow){max-width:62ch;margin:0 auto 18px;line-height:1.9}
.about .card-hero h1{max-width:28ch}
@media(max-width:700px){.c2{grid-template-columns:1fr}nav{gap:9px;font-size:12px}.lang-switch{gap:4px}nav .lang-switch a{min-width:28px;padding:4px 6px}.brand img{width:42px}.about .card-hero h1{font-size:30px}}
@media(min-width:701px) and (max-width:1100px){.brand span{display:none}}

/* Aligned hero frames, deliberate copy lines, and raised supporting panels. */
.hero{height:auto;min-height:0;max-height:none;padding:calc(var(--hd) + 40px) 0 26px;display:flex;align-items:center;justify-content:center}
.card-hero,.about .card-hero{width:min(1320px,94vw);min-height:400px;padding:32px 40px;text-align:center;margin:0 auto}
.card-hero h1,.about .card-hero h1{max-width:none;margin:0 auto 20px;line-height:1.2}
.hero-lines{width:100%;text-align:center}
.card-hero .hero-lines p,.about .card-hero .hero-lines p{max-width:none;line-height:30px;margin:0 auto;text-wrap:initial}
.about .hero-lines p:last-child{margin-top:14px}
.hero + main>.band:first-child{padding-top:18px}
.centered-section-head{margin-bottom:22px}
.centered-section-head h2{margin-top:6px}
.centered-section-head .rule{margin:10px auto 12px}
.equal-cards{margin-inline:auto;text-align:center}
.equal-cards>.card{min-height:230px;padding-top:24px;padding-bottom:24px}
.meet{text-align:center;grid-template-columns:minmax(0,1fr) 180px;max-width:1120px;gap:36px}
.meet .lead{max-width:65ch!important;margin-inline:auto}
.meet h2{font-size:clamp(26px,2.3vw,34px);margin-bottom:16px}
.meet .logo-side img{width:125px;height:auto}
.meet .logo-side .eyebrow{font-size:10px;letter-spacing:.2em}
.meet .launch-follow{margin-top:0}
@media(min-width:1001px){
 .card-hero h1,.about .card-hero h1{font-size:clamp(22px,2.1vw,30px);white-space:nowrap}
 .card-hero .hero-lines p{font-size:clamp(12px,1.06vw,15px);white-space:nowrap}
}
@media(max-width:1000px){
 .card-hero,.about .card-hero{padding:30px 24px}
 .card-hero h1,.about .card-hero h1{font-size:clamp(26px,3.6vw,32px);white-space:normal}
 .card-hero .hero-lines p{white-space:normal;font-size:15px;line-height:1.8;margin-bottom:10px}
 .meet{grid-template-columns:1fr;gap:24px}
}
@media(max-width:700px){
 .hero{padding-top:calc(var(--hd) + 26px);padding-bottom:18px}
 .card-hero,.about .card-hero{width:92vw;min-height:0;padding:28px 20px}
 .card-hero .btn-row{margin-top:22px}
 .equal-cards>.card{min-height:0}
 .meet .logo-side img{width:110px}
}

/* V67 layout pass (texts unchanged) */
/* 1. Neon edge: bright at the top, fading down the sides, no line at the bottom */
.card-hero,.card,.notice,.contact-card,.doc{position:relative;border-color:transparent!important;
  box-shadow:0 -8px 22px -12px color-mix(in srgb,var(--accent) 75%,transparent),0 18px 50px rgba(0,0,0,.22)!important}
.card-hero::after,.card::after,.notice::after,.contact-card::after,.doc::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  border:1.5px solid color-mix(in srgb,var(--accent) 92%,white 8%);
  box-shadow:inset 0 10px 18px -10px color-mix(in srgb,var(--accent) 55%,transparent),0 0 10px color-mix(in srgb,var(--accent) 45%,transparent);
  -webkit-mask:linear-gradient(180deg,#000 0%,rgba(0,0,0,.8) 28%,rgba(0,0,0,.25) 62%,transparent 88%);
  mask:linear-gradient(180deg,#000 0%,rgba(0,0,0,.8) 28%,rgba(0,0,0,.25) 62%,transparent 88%)}
/* 2. Lower cards more transparent */
.card{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,transparent),rgba(255,255,255,.006) 70%,transparent)!important;
  backdrop-filter:blur(5px) saturate(110%)!important;-webkit-backdrop-filter:blur(5px) saturate(110%)!important}
/* 3. Coming-soon text on three lines on desktop */
@media(min-width:1001px){.launch-lines .ln{display:block}}
/* 4. Hero sentences keep a readable size on small laptops instead of shrinking to 12px */
@media(min-width:1001px) and (max-width:1299px){.card-hero .hero-lines p{font-size:14.5px;white-space:normal;text-wrap:balance}}
/* 5. Footer: brand and copyright never split; stacked when the row is too narrow; no stray separators on phones */
.f-brand span,.f-copy{white-space:nowrap}
@media(min-width:701px) and (max-width:1279px){.f-row{grid-template-columns:1fr;justify-items:center;row-gap:18px}.f-brand,.f-copy{justify-self:center;text-align:center}}
@media(min-width:701px) and (max-width:1599px){html[lang="fr"] .f-row{grid-template-columns:1fr;justify-items:center;row-gap:18px}html[lang="fr"] .f-brand,html[lang="fr"] .f-copy{justify-self:center;text-align:center}}
@media(min-width:701px) and (max-width:1100px){.f-brand span{display:inline}}
@media(max-width:700px){.f-links{column-gap:22px}.f-links a{border-left:0;padding:2px 0}}
/* 6. No single word left alone on the last line of a paragraph */
main p,main li,main dd{text-wrap:pretty}
@media(max-width:1000px){.card-hero .hero-lines p{text-wrap:pretty}}

/* V68: a real breathing space between the large top frame and the cards below, on both sides of the separation line */
.hero{padding-bottom:72px!important}
.hero + main>.band:first-child{padding-top:80px!important}
@media(max-width:1000px){.hero{padding-bottom:56px!important}.hero + main>.band:first-child{padding-top:60px!important}}
@media(max-width:700px){.hero{padding-bottom:44px!important}.hero + main>.band:first-child{padding-top:48px!important}}

/* V69: the whole background image is visible (head, feet, ground); the veil is unchanged; no hard line under the hero */
.hero{border-bottom:0!important}
@media(min-width:1001px){.hero{min-height:calc(100vw * 942 / 1670)!important}}
.hero::before{background-position:center bottom!important;
  -webkit-mask:linear-gradient(180deg,#000 0%,#000 84%,rgba(0,0,0,.55) 93%,transparent 100%);mask:linear-gradient(180deg,#000 0%,#000 84%,rgba(0,0,0,.55) 93%,transparent 100%)}
.hero + main>.band:first-child{border-top:0!important}
.hero + main>.band:first-child::before{content:"";position:absolute;left:0;right:0;top:0;height:220px;pointer-events:none;z-index:0;
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 97%,white 2%) 0%,color-mix(in srgb,var(--bg) 60%,transparent) 50%,transparent 100%)}
.hero + main>.band:first-child>*{position:relative;z-index:1}

/* V70: Home, "Our convictions" brought closer to the hero button (desktop); the image stays whole behind it */
@media(min-width:1001px){
  body:not(.about) .hero + main>.band:first-child{margin-top:-70px;padding-top:40px!important}
  body:not(.about) .hero + main>.band:first-child::before{top:70px}
}
/* V70: "Coming soon" block, more air between the lines */
#vision .meet>div>.eyebrow{margin-bottom:16px}
#vision .meet h2{margin-bottom:24px}
#vision .meet .launch-follow{margin-top:12px}

/* V71: smaller logo in the Home "Coming soon" block */
.meet .logo-side img{width:92px!important}
@media(max-width:700px){.meet .logo-side img{width:84px!important}}

/* Demonstration only: the existing full-page veil is untouched. This mask affects only
   the flattened brain area so that a true rotating neural object can sit in its place. */
.brain-occlusion{display:none}
.brain-animation{position:absolute;z-index:2;left:50%;top:clamp(12px,1.6vw,32px);width:min(380px,54vw);height:min(260px,37vw);transform:translateX(-50%);pointer-events:none;mix-blend-mode:screen;opacity:1}
.brain-canvas{display:block;width:100%;height:100%}
.card-hero{z-index:1}
@media(max-width:700px){.brain-occlusion,.brain-animation{top:clamp(30px,7vw,48px);width:min(290px,76vw);height:min(204px,54vw)}.brain-occlusion{background:radial-gradient(ellipse at 50% 52%,rgba(3,10,11,.92) 0 37%,rgba(3,10,11,.75) 56%,rgba(3,10,11,.3) 72%,transparent 84%)}}
.about .brain-occlusion{background:radial-gradient(ellipse at 50% 52%,rgba(9,7,5,.93) 0 37%,rgba(9,7,5,.79) 55%,rgba(9,7,5,.34) 70%,transparent 83%)}
@media(max-width:700px){.about .brain-occlusion{background:radial-gradient(ellipse at 50% 52%,rgba(9,7,5,.92) 0 37%,rgba(9,7,5,.75) 56%,rgba(9,7,5,.3) 72%,transparent 84%)}}


/* FNW v77 — head/shoulders layout. No dark rectangle, no global brightness changes.
   The card itself is the cutoff: the hologram and shoulders are separate layers,
   tied to the same centered column on all viewports. */
body{--hero:url(assets/hero-teal-ambient-v77.webp)}
body.about{--hero:url(assets/hero-gold-ambient-v77.webp)}
.brain-occlusion{display:none!important}
.hero{display:block!important;position:relative!important;height:auto!important;max-height:none!important;min-height:0!important;
  padding:329px 0 72px!important}
.hero>.brain-animation{top:100px!important;left:50%!important;width:232px!important;height:166px!important;
  transform:translateX(-50%)!important;position:absolute!important;z-index:4!important;mix-blend-mode:screen}
.hero>.shoulder-outline{position:absolute;top:250px;left:50%;width:280px;height:84px;
  transform:translateX(-50%);z-index:2;pointer-events:none;opacity:.58;mix-blend-mode:screen;color:var(--accent)}
.hero>.shoulder-outline svg{display:block;width:100%;height:100%;overflow:visible}
.hero>.card-hero{position:relative;z-index:3;margin-inline:auto}
.about .hero>.shoulder-outline{color:var(--accent)}
@media(min-width:701px) and (max-width:1000px){
 .hero{padding-top:328px!important}
 .hero>.brain-animation{top:100px!important;width:224px!important;height:161px!important}
 .hero>.shoulder-outline{top:248px;width:275px;height:80px}
}
@media(max-width:700px){
 .hero{padding-top:279px!important;padding-bottom:44px!important}
 .hero>.brain-animation{top:88px!important;width:174px!important;height:126px!important}
 .hero>.shoulder-outline{top:203px;width:208px;height:78px;opacity:.52}
}
@media(max-width:370px){
 .hero{padding-top:270px!important}
 .hero>.brain-animation{top:89px!important;width:163px!important;height:120px!important}
 .hero>.shoulder-outline{top:198px;width:196px;height:74px}
}
@media(prefers-reduced-motion:reduce){.hero>.brain-animation{animation:none}}


/* FNW v79 — restore the discreet human contour, at the v77-approved location.
   No added rectangular cover, no changes to overall background veil or hero framing.
   The neck and the beginning of shoulders remain suggested rather than illuminated;
   their very end fades into the existing content card before the chest begins. */
.hero>.shoulder-outline{
  display:block!important;
  opacity:.26!important;
  filter:blur(.7px);
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.92) 0%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.38) 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.92) 0%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.38) 88%,transparent 100%);
}
@media(max-width:700px){.hero>.shoulder-outline{opacity:.32!important}}
@media(max-width:370px){.hero>.shoulder-outline{opacity:.3!important}}

/* v80: restored silhouette from the unaltered v71 source image, without drawing a fake outline.
   Both pages share a single geometric system. Original cards align exactly across same viewports. */
.hero>.shoulder-outline{display:none!important}
.hero>.fnw-original-outline{position:absolute;z-index:2;left:50%;top:178px;width:320px;height:138px;transform:translateX(-50%);pointer-events:none;mix-blend-mode:screen;opacity:.31;filter:brightness(.7) saturate(.66);-webkit-mask-image:radial-gradient(ellipse 39% 52% at 50% 56%,black 30%,rgba(0,0,0,.75) 60%,transparent 100%);mask-image:radial-gradient(ellipse 39% 52% at 50% 56%,black 30%,rgba(0,0,0,.75) 60%,transparent 100%)}
.hero>.fnw-original-outline svg{width:100%;height:100%;display:block}
/* Card beginning is identical on Home and Vision; bottom adjusts to text only. */
.hero>.card-hero{margin-inline:auto!important}
@media(min-width:701px) and (max-width:1000px){.hero>.fnw-original-outline{top:178px;width:314px;height:135px}}
@media(max-width:700px){.hero>.fnw-original-outline{top:137px;width:282px;height:121px;opacity:.37}}
@media(max-width:370px){.hero>.fnw-original-outline{top:140px;width:269px;height:116px;opacity:.3}}

/* FNW v81 — complete ORIGINAL anatomical outline preserved from v71 source.
   Keep the same brain/card geometry, same site veil and original page colors.
   No black shape and no relighting of the page as a whole. */
.hero>.fnw-original-outline{
  position:absolute!important;display:block!important;
  z-index:2!important;left:50%!important;top:219px!important;
  width:303px!important;height:auto!important;
  opacity:.45!important;transform:translateX(-50%)!important;
  object-fit:contain;mix-blend-mode:screen;
  filter:brightness(.8) saturate(.74) blur(.35px)!important;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 3%,#000 93%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,transparent 0%,#000 3%,#000 93%,transparent 100%)!important;
}
/* The original anatomy remains a whisper through the glass, while typography stays legible. */
.hero>.card-hero{z-index:3!important}
@media(max-width:700px){
  .hero>.fnw-original-outline{top:179px!important;width:226px!important;opacity:.49!important}
}
@media(max-width:370px){
  .hero>.fnw-original-outline{top:179px!important;width:214px!important;opacity:.47!important}
}

/* FNW v82: full silhouette underneath the glass. A SECOND ultra-discreet
   pass restores just the legs and feet through the translucent card.
   The figure uses only pixel data from the original, not synthetic outlines.
   The dark veil, card backgrounds, layout and brain positions are unchanged. */
.hero>.fnw-original-outline {opacity:.27!important;filter:brightness(.8) saturate(.74) blur(.55px)!important}
.hero>.fnw-glass-trace{
  position:absolute;pointer-events:none;z-index:4;left:50%;top:219px;
  width:303px;height:auto;transform:translateX(-50%);
  mix-blend-mode:screen;opacity:.15;
  filter:saturate(.65) blur(.45px);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,transparent 25%,rgba(0,0,0,.4) 31%,black 45%,black 82%,transparent 99%);
  mask-image:linear-gradient(to bottom,transparent 0%,transparent 25%,rgba(0,0,0,.4) 31%,black 45%,black 82%,transparent 99%);
}
@media(max-width:700px){
 .hero>.fnw-original-outline{opacity:.28!important}
 .hero>.fnw-glass-trace{top:179px;width:226px;opacity:.22}
}
@media(max-width:370px){
 .hero>.fnw-original-outline{opacity:.27!important}
 .hero>.fnw-glass-trace{top:179px;width:214px;opacity:.22}
}


/* FNW v84: complete figure from the original image (head, neck, shoulders, body, legs, feet).
   The brain sits above the head; the card starts below the shoulders and above the chest;
   legs and feet stay visible below the card. Veil, card styles and typography unchanged. */
.hero{padding-top:380px!important;padding-bottom:150px!important}
.hero>.fnw-original-outline{top:248px!important;width:213px!important;opacity:.3!important}
.hero>.fnw-glass-trace{top:248px;width:213px;opacity:.16;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,transparent 54%,rgba(0,0,0,.45) 62%,black 70%,black 96%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,transparent 54%,rgba(0,0,0,.45) 62%,black 70%,black 96%,transparent 100%)}
.hero>.card-hero{min-height:400px}
@media(min-width:701px) and (max-width:1000px){
 .hero{padding-top:380px!important}
 .hero>.fnw-original-outline{top:248px!important;width:213px!important}
 .hero>.fnw-glass-trace{top:248px;width:213px}
}
@media(max-width:700px){
 .hero{padding-top:298px!important;padding-bottom:70px!important}
 .hero>.fnw-original-outline{top:200px!important;width:150px!important;opacity:.32!important}
 .hero>.fnw-glass-trace{top:200px;width:150px;opacity:.2}
}
@media(max-width:370px){
 .hero{padding-top:296px!important}
 .hero>.fnw-original-outline{top:200px!important;width:146px!important}
 .hero>.fnw-glass-trace{top:200px;width:146px}
}
/* v84: the first section no longer overlaps the feet (cancels the V70 pull-up on Home) */
@media(min-width:1001px){body:not(.about) .hero + main>.band:first-child{margin-top:0;padding-top:60px!important}body:not(.about) .hero + main>.band:first-child::before{top:0}}
@media(max-width:700px){.hero{padding-top:304px!important;padding-bottom:70px!important}.hero>.fnw-original-outline{width:186px!important}.hero>.fnw-glass-trace{width:186px}}
@media(max-width:370px){.hero{padding-top:302px!important}.hero>.fnw-original-outline{width:180px!important}.hero>.fnw-glass-trace{width:180px}}


/* FNW v85: the original full image is the hero background (figure, rings, platform), behind a dark veil.
   Only the animated brain stays bright. The card starts at the chest, below the shoulders, and ends
   around mid-thigh on Home; head, neck and shoulders show above it, knees, calves and feet below it.
   All positions are fractions of the hero height, so the figure keeps its place at every width. */
body{--hero:url(assets/hero-teal.webp)}
body.about{--hero:url(assets/hero-gold.webp)}
.hero{--hh:max(930px,56.4vw)}
@media(min-width:701px) and (max-width:1000px){.hero{--hh:880px}}
@media(max-width:700px){.hero{--hh:820px}}
.hero{display:block!important;position:relative!important;overflow:hidden;height:auto!important;min-height:var(--hh)!important;max-height:none!important;
  padding:calc(var(--hh)*.335) 0 40px!important}
.hero::before{inset:0!important;transform:none!important;background:var(--hero) center top / cover no-repeat!important;
  filter:brightness(.52) saturate(.6) contrast(.92) blur(.4px)!important;-webkit-mask:none!important;mask:none!important}
.hero::after{opacity:1!important;background:
  radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),
  linear-gradient(rgba(2,8,9,.74),rgba(2,8,9,.74))!important}
.about .hero::after{background:
  radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(9,7,5,.35) 16%,transparent 24%),
  linear-gradient(rgba(8,6,4,.74),rgba(8,6,4,.74))!important}
.hero>.fnw-original-outline,.hero>.fnw-glass-trace,.hero>.shoulder-outline{display:none!important}
.hero>.brain-occlusion{display:block!important;position:absolute;z-index:2;left:50%;top:calc(var(--hh)*.015);width:calc(var(--hh)*.66);height:calc(var(--hh)*.19);transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(ellipse at 50% 50%,rgba(3,10,11,.9) 0 40%,rgba(3,10,11,.6) 62%,transparent 80%)}
.about .hero>.brain-occlusion{background:radial-gradient(ellipse at 50% 50%,rgba(9,7,5,.9) 0 40%,rgba(9,7,5,.6) 62%,transparent 80%)}
.hero>.brain-animation{top:calc(var(--hh)*.004)!important;left:50%!important;width:calc(var(--hh)*.30)!important;height:calc(var(--hh)*.18)!important;transform:translateX(-50%)!important;position:absolute!important;z-index:4!important;mix-blend-mode:screen}
.hero>.card-hero{position:relative;z-index:3;min-height:330px!important;margin-inline:auto!important}
.hero + main>.band:first-child{margin-top:0!important;padding-top:60px!important}
.hero + main>.band:first-child::before{top:0}

/* FNW v87: one single background image for both pages (the gold original, whose figure is finer),
   so the silhouette is identical on Home and Vision. Home turns it teal with a hue rotation. */
body{--hero:url(assets/hero-gold.webp)}
body.about{--hero:url(assets/hero-gold.webp)}
body:not(.about) .hero::before{filter:brightness(.52) saturate(.6) contrast(.92) blur(.4px) hue-rotate(134deg)!important}

/* FNW v88: phones and tablets. The hero starts below the fixed header so the brain is never hidden by it;
   on phones the hero height follows the card instead of a fixed 820px, removing the empty band under it. */
@media(max-width:1000px){.hero{margin-top:var(--hd)}}
@media(max-width:700px){.hero{min-height:0!important;padding-bottom:56px!important}}
@media(max-width:700px){.hero::before{background-size:auto max(var(--hh),100%)!important;background-position:center top!important}}

/* FNW v88b: the figure sits lower so the brain floats clearly above the head; denser veil on phones. */
.hero{--drop:28px}
@media(max-width:700px){.hero{--drop:44px}}
.hero{padding-top:calc(var(--hh)*.335 + var(--drop))!important}
.hero::before{background-position:center var(--drop)!important}
@media(max-width:700px){
  .hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),linear-gradient(rgba(2,8,9,.80),rgba(2,8,9,.80))!important}
  .about .hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(9,7,5,.35) 16%,transparent 24%),linear-gradient(rgba(8,6,4,.80),rgba(8,6,4,.80))!important}
}

/* FNW v88c: on phones the figure is taller (1100px reference) so the card lands between the chest
   and mid-thigh exactly like on desktop, with legs and feet visible below it. */
@media(max-width:700px){.hero{--hh:1100px;--drop:40px;padding-bottom:40px!important}}
@media(max-width:700px){
  .hero{min-height:calc(var(--hh)*.95 + var(--drop))!important}
  .hero>.brain-animation{top:calc(var(--hh)*.03)!important;width:calc(var(--hh)*.235)!important;height:calc(var(--hh)*.14)!important}
}

/* FNW v89: the brain sits closer to the head, linked to it by a luminous funnel of neural strands
   (narrow at the head, widening up to the brain), drawn by the same animation. The canvas now spans
   brain + funnel and ends exactly at the top of the head; the figure moves down to make room. */
.hero{--bh:.165;--fh:.075;--drop:calc(var(--hh)*(.165 + .075 - .178) + 12px)}
@media(max-width:700px){.hero{--bh:.135;--fh:.06;--drop:calc(var(--hh)*(.135 + .06 - .178) + 12px)}}
.hero>.brain-animation{top:12px!important;height:calc(var(--hh)*(var(--bh) + var(--fh)))!important;width:calc(var(--hh)*.30)!important;--bf:.6875}
@media(max-width:700px){.hero>.brain-animation{width:calc(var(--hh)*.235)!important;--bf:.6923}}
.hero>.brain-occlusion{top:calc(var(--hh)*.015 + var(--drop))}
.hero::before{background-color:#020809!important}
.about .hero::before{background-color:#080604!important}
.hero{background:var(--bg)!important}

/* FNW v90: hero hook line, launch notification form, relabelled "next step" block. Nothing removed. */
.hero-hook{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(20px,1.7vw,24px);line-height:30px;color:var(--ui);margin:-6px auto 14px;max-width:none;text-wrap:balance}
.notify-form{margin:22px auto 0;max-width:65ch;text-align:center}
.notify-lead{margin:0 auto 14px}
.notify-row{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}
.notify-row input{width:min(320px,100%);border:1px solid color-mix(in srgb,var(--accent) 30%,rgba(255,255,255,.14));border-radius:999px;background:rgba(0,0,0,.20);color:var(--text);font:inherit;font-size:15px;padding:10px 18px;outline:none}
.notify-row input::placeholder{color:#9aa3a1}
.notify-row .btn{margin-top:0;cursor:pointer;background:transparent}
.notify-msg{margin:12px auto 0;font-size:14.5px;line-height:30px;color:#d5dad7}
@media(max-width:700px){.notify-row{flex-direction:column}.notify-row input{width:100%}}
.card-hero p.hero-hook,.hero .card-hero > p.hero-hook{font-family:"Cormorant Garamond",Georgia,serif!important;font-weight:500;font-size:clamp(21px,1.75vw,25px)!important;line-height:30px!important;color:var(--ui)!important;margin:-4px auto 14px!important;max-width:none!important;white-space:normal!important}

/* FNW v91: on phones the brain and the funnel use exactly the desktop proportions (same shape, same width
   relative to the figure); the figure moves down by the same amount as on desktop. */
@media(max-width:700px){
  .hero{--bh:.165;--fh:.075;--drop:calc(var(--hh)*(.165 + .075 - .178) + 12px)}
  .hero>.brain-animation{width:calc(var(--hh)*.30)!important;height:calc(var(--hh)*(var(--bh) + var(--fh)))!important;top:12px!important;--bf:.6875}
}

/* FNW v92: confirmation shown as a centered glass window in the site's design after "Notify me". */
.notify-modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(2,8,9,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.notify-modal[hidden]{display:none}
.notify-box{position:relative;width:min(560px,100%);padding:36px clamp(22px,4vw,46px) 34px;border-radius:14px;text-align:center;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 12%,transparent),rgba(255,255,255,.02)),color-mix(in srgb,var(--bg) 92%,transparent);
  box-shadow:0 -8px 22px -12px color-mix(in srgb,var(--accent) 75%,transparent),0 24px 60px rgba(0,0,0,.5)}
.notify-box::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;border:1.5px solid color-mix(in srgb,var(--accent) 92%,white 8%);
  -webkit-mask:linear-gradient(180deg,#000 0%,rgba(0,0,0,.8) 28%,rgba(0,0,0,.25) 62%,transparent 88%);mask:linear-gradient(180deg,#000 0%,rgba(0,0,0,.8) 28%,rgba(0,0,0,.25) 62%,transparent 88%)}
.notify-box .rule{margin:12px auto 16px}
.notify-box h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(22px,2vw,28px);line-height:1.25;letter-spacing:0;text-transform:none;margin:0 0 10px;color:var(--text)}
.notify-box p:not(.eyebrow){font-size:15.5px;line-height:30px;color:#d5dad7;margin:0}
.notify-box .btn{margin-top:22px;cursor:pointer;background:transparent}
body.notify-open{overflow:hidden}

/* FNW v95: the animation box extends 40px below the funnel tip so the contact glow fades instead of being cut;
   the veil over the picture's own brain stops just above the top of the head. */
.hero>.brain-animation{--pad:40px;height:calc(var(--hh)*(var(--bh) + var(--fh)) + 40px)!important}
.hero>.brain-occlusion{height:calc(var(--hh)*.17)}
/* v95: on every screen size the hero starts below the header, so the brain never sits behind the menu bar */
.hero{margin-top:var(--hd)!important}

/* FNW v96: no dark band under the header. The hero starts at the top of the page again (under the
   transparent header); the brain and the figure are pushed down by the header height instead, and the
   top of the picture fades into the page background rather than ending on a hard edge. */
.hero{margin-top:0!important;--drop:calc(var(--hh)*(.165 + .075 - .178) + 12px + var(--hd))}
@media(max-width:700px){.hero{--drop:calc(var(--hh)*(.165 + .075 - .178) + 12px + var(--hd))}}
.hero>.brain-animation{top:calc(12px + var(--hd))!important}
@media(min-width:701px){.hero{min-height:calc(var(--hh) + var(--hd))!important}}
.hero::before{-webkit-mask:linear-gradient(to bottom,transparent var(--drop),#000 calc(var(--drop) + 140px))!important;mask:linear-gradient(to bottom,transparent var(--drop),#000 calc(var(--drop) + 140px))!important}
@media(max-width:700px){header:not(.solid){background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* FNW v97: the picture covers the whole page instead of stopping at the bottom of the hero. The hero no
   longer clips its background: the image is drawn at its full height (feet and platform included) and
   runs on behind the sections below, which become translucent under the same veil. Nothing removed. */
.hero{overflow:visible!important;overflow-x:clip!important}
body{overflow-x:clip}
.hero::before{top:0!important;left:0!important;right:0!important;bottom:auto!important;height:calc(var(--hh) + var(--drop))!important;
  background:var(--hero) center var(--drop) / auto var(--hh) no-repeat!important;background-color:#020809!important;
  -webkit-mask:linear-gradient(to bottom,transparent var(--drop),#000 calc(var(--drop) + 140px),#000 calc(100% - 200px),transparent 100%)!important;
  mask:linear-gradient(to bottom,transparent var(--drop),#000 calc(var(--drop) + 140px),#000 calc(100% - 200px),transparent 100%)!important}
.about .hero::before{background-color:#080604!important}
.hero ~ main{position:relative;background:rgba(2,8,9,.74)}
.about .hero ~ main{background:rgba(8,6,4,.74)}
@media(max-width:700px){.hero ~ main{background:rgba(2,8,9,.80)}.about .hero ~ main{background:rgba(8,6,4,.80)}}
.hero ~ footer{position:relative;background:rgba(2,8,9,.88)!important}
.about .hero ~ footer{background:rgba(8,6,4,.88)!important}
.hero + main>.band:first-child::before{display:none!important}
.hero + main>.band{background:none!important;border-bottom-color:rgba(255,255,255,.06)!important}
@media(max-width:700px){.hero::before{-webkit-mask:linear-gradient(to bottom,transparent var(--drop),#000 calc(var(--drop) + 140px),#000 calc(100% - 90px),transparent 100%)!important;
  mask:linear-gradient(to bottom,transparent var(--drop),#000 calc(var(--drop) + 140px),#000 calc(100% - 90px),transparent 100%)!important}}
/* FNW v97b: a second, fixed layer behind the whole page: the same picture, blurred and dimmed, stays in
   place while the page scrolls, so the site never falls back on flat black below the hero picture. */
body:has(.hero){position:relative}
body:has(.hero)::before{content:"";position:fixed;inset:-40px;z-index:-1;pointer-events:none;
  background:var(--hero) center center / cover no-repeat #020809;
  filter:brightness(.46) saturate(.6) contrast(.9) blur(14px)}
body:not(.about):has(.hero)::before{filter:brightness(.46) saturate(.6) contrast(.9) blur(14px) hue-rotate(134deg)}
.hero ~ main{background:rgba(2,8,9,.55)}
.about .hero ~ main{background:rgba(8,6,4,.55)}
@media(max-width:700px){.hero ~ main{background:rgba(2,8,9,.70)}.about .hero ~ main{background:rgba(8,6,4,.70)}}
.hero ~ footer{background:rgba(2,8,9,.80)!important}
.about .hero ~ footer{background:rgba(8,6,4,.80)!important}

/* FNW v98: on phones the figure reference height goes from 1100px to 950px so the name and the hook line
   fit in the first screen; brain, funnel and card keep the same proportions and stay centered. Desktop
   untouched. */
@media(max-width:700px){.hero{--hh:950px}}
/* FNW v99: the body is reduced to its outline. The picture file is the original one with the inside of
   the figure (head, torso, thighs) darkened so that only the luminous rim remains; the surroundings, the
   arms, the lower legs and the platform are untouched. The phone reference height goes to 900px. */
body{--hero:url(assets/hero-gold-outline.webp)}
body.about{--hero:url(assets/hero-gold-outline.webp)}
@media(max-width:700px){.hero{--hh:900px}}
/* FNW v99b: the outline itself is drawn above the veil as a soft luminous line (gold on the gold pages,
   teal on the Home), aligned on the picture, so it stays visible where the veil dims everything else. */
.hero::after{background:url(assets/hero-rim-gold.png) center var(--drop) / auto var(--hh) no-repeat,
  radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),
  linear-gradient(rgba(2,8,9,.74),rgba(2,8,9,.74))!important}
.about .hero::after{background:url(assets/hero-rim-gold.png) center var(--drop) / auto var(--hh) no-repeat,
  radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(9,7,5,.35) 16%,transparent 24%),
  linear-gradient(rgba(8,6,4,.74),rgba(8,6,4,.74))!important}
body:not(.about) .hero::after{background:url(assets/hero-rim-teal.png) center var(--drop) / auto var(--hh) no-repeat,
  radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),
  linear-gradient(rgba(2,8,9,.74),rgba(2,8,9,.74))!important}
@media(max-width:700px){
  body:not(.about) .hero::after{background:url(assets/hero-rim-teal.png) center var(--drop) / auto var(--hh) no-repeat,
    radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),
    linear-gradient(rgba(2,8,9,.80),rgba(2,8,9,.80))!important}
  .about .hero::after{background:url(assets/hero-rim-gold.png) center var(--drop) / auto var(--hh) no-repeat,
    radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(9,7,5,.35) 16%,transparent 24%),
    linear-gradient(rgba(8,6,4,.80),rgba(8,6,4,.80))!important}}
/* FNW v99c: the picture's own brain above the head is switched off in the file, so the dark occlusion
   ellipse can be shorter and no longer touches the top of the head. */
.hero>.brain-occlusion{height:calc(var(--hh)*.15)!important}
/* FNW v99d: final choice. The v97 silhouette is kept as it is (original picture and its own rim); only
   the inside of the body is dimmed to 45% in the picture file. No drawn outline, occlusion as in v97. */
body{--hero:url(assets/hero-gold-soft.webp)}
body.about{--hero:url(assets/hero-gold-soft.webp)}
.hero>.brain-occlusion{height:calc(var(--hh)*.17)!important}
.hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),linear-gradient(rgba(2,8,9,.74),rgba(2,8,9,.74))!important}
.about .hero::after,body.about .hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(9,7,5,.35) 16%,transparent 24%),linear-gradient(rgba(8,6,4,.74),rgba(8,6,4,.74))!important}
body:not(.about) .hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),linear-gradient(rgba(2,8,9,.74),rgba(2,8,9,.74))!important}
@media(max-width:700px){
  body:not(.about) .hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(3,10,11,.35) 16%,transparent 24%),linear-gradient(rgba(2,8,9,.80),rgba(2,8,9,.80))!important}
  .about .hero::after,body.about .hero::after{background:radial-gradient(ellipse at 50% 11%,transparent 0 6%,rgba(9,7,5,.35) 16%,transparent 24%),linear-gradient(rgba(8,6,4,.80),rgba(8,6,4,.80))!important}}
/* FNW v100: no visual change. Anti-spam protection of the contact form and of "Notify me"
   (contact.php, script.js, contact pages). */
/* FNW v101: the contact form fits in one screen on a computer. Email address and reason for contact share
   one row, tighter spacing, shorter message box; the card is a little wider so the intro stays on one line.
   Phones keep the one-column layout. */
@media(min-width:701px){
  .contact-card{width:min(1000px,90vw);margin-top:calc(var(--hd) + 26px);margin-bottom:40px;padding-top:24px;padding-bottom:26px}
  .contact-intro{margin-bottom:14px}
  .contact-intro p:not(.eyebrow){max-width:none}
  .contact-intro h1{margin-bottom:8px}
  .contact-form{gap:12px}.form-grid{gap:14px}
  .form-field{gap:6px}
  .form-field input,.form-field select,.form-field textarea{padding:10px 13px}
  .form-field textarea{min-height:104px}
  .form-submit{margin-top:2px}
}