/* ═══════════════════════════════════════════════════════════════════
   LUCERA — the shared layer. Every page links this; nothing is
   duplicated in a page's own stylesheet.

   ground   #050A18 ink · #0A1330 navy · #0F1A40 raised
   accent   #00ABDA cyan   — interactive and active state, nothing else
   spectrum --d1..--d5     — the five decisions only, nowhere else
   warm     #FFC46A        — the dawn moment and the lit path only
   light    #EEF1F5 paper  — the light surfaces
   form     square corners · hairlines · one easing everywhere
   motif    light from a single origin, in every section
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --ink:#050A18; --navy:#0A1330; --navy2:#0F1A40;
  --hair:rgba(140,190,235,.16); --hair2:rgba(140,190,235,.30);
  --cyan:#00ABDA; --cyanD:#0589BA; --ice:#7FD8F0; --sun:#FFC46A;
  /* warm accents, sampled out of the hero photograph itself */
  --w1:#F2CFA8;   /* the halo around the sun            */
  --w2:#DAA781;   /* the glow along the horizon         */
  --w3:#C08A62;   /* the same, deep enough for paper    */
  --wpale:#F7EADC;/* a warm tint for the light surfaces */
  --paper:#EEF1F5; --paper2:#E2E7EF; --pink:#0C1533;
  --txt:#EDF1F8; --dim:#93A2C2; --dim2:#6C7CA2;
  /* light-surface text */
  --lt:#0C1533; --lt2:#3A4468; --lt3:#6B7591; --lthair:rgba(12,21,51,.14);
  --gut:clamp(22px,5vw,84px); --max:1360px;
  /* ── the type scale ──────────────────────────────────────────────
     Five levels, and every heading picks one. A heading never carries
     a size of its own, so two headings of the same rank are the same
     size wherever they appear. */
  --t-hero:calc(clamp(31px,5.5vw,88px)*var(--ds));  /* the homepage hero, alone   */
  --t-page:calc(clamp(36px,5vw,68px)*var(--ds));    /* the title of a page        */
  --t-sec: calc(clamp(29px,4.2vw,60px)*var(--ds));  /* a section heading          */
  --t-sub: calc(clamp(24px,2.5vw,34px)*var(--ds));  /* a heading inside a section */
  --t-card:calc(clamp(20px,1.9vw,27px)*var(--ds));  /* a card, panel or prose one */
  --e:cubic-bezier(.22,.61,.30,1);
  /* one type system — Archivo display over Manrope body */
  --fd:'Archivo'; --fdk:system-ui,sans-serif;
  --fb:Manrope; --fbk:system-ui,sans-serif;
  /* the UI face (labels, buttons, eyebrows) is the body face — two fonts, no third */
  --fl:var(--fb); --flk:var(--fbk);
  --ds:.75;          /* display size scale */
  --dt:1.25;         /* display tracking scale */
  --dwt:600;         /* display weight */
  /* the five decisions carry the prism spectrum; everywhere else, cyan alone */
  --d1:#2ED3C6; --d2:#22A6E8; --d3:#3A76E0; --d4:#7A5AD8; --d5:#A94FCF;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--navy);color:var(--txt);font-family:var(--fb),system-ui,sans-serif;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.in{max-width:var(--max);margin:0 auto}
section{padding:clamp(90px,10.5vw,164px) var(--gut);position:relative}

h1,h2,h3,h4.dsp{font-family:var(--fd),var(--fdk);font-weight:var(--dwt);color:#fff}
h1{font-size:var(--t-page);line-height:.92;letter-spacing:calc(-.026em*var(--dt))}
h2{font-size:var(--t-sec);line-height:.98;letter-spacing:calc(-.022em*var(--dt))}
h3{font-size:var(--t-sub);line-height:1.06;letter-spacing:calc(-.02em*var(--dt))}
h4.dsp{font-size:var(--t-card);line-height:1.12;letter-spacing:calc(-.018em*var(--dt))}
.label{font-family:var(--fl),var(--flk);font-weight:400;font-size:11.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--cyan);display:block}
.sechead .label{margin-bottom:22px}
.sechead h2{max-width:23ch;text-wrap:balance}
/* the founders heading runs the full measure */
#team .sechead h2{max-width:none}
#team .sechead .lede{max-width:none}
#stories .sechead h2{max-width:none}
#stories .sechead .lede{max-width:none}
.lightsec .sechead h2,.cta h2{text-wrap:balance}
.lede{margin-top:22px;max-width:54ch;font-size:18.5px;line-height:1.62;color:var(--dim)}
.link{font-family:var(--fl),var(--flk);font-weight:500;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:#fff;text-decoration:none;display:inline-flex;gap:11px;
  align-items:center;border-bottom:1px solid var(--hair2);padding-bottom:7px;
  transition:border-color .24s var(--e),color .24s var(--e)}
.link i{font-style:normal;transition:transform .24s var(--e)}
.link:hover{color:var(--cyan);border-color:var(--cyan)}
.link:hover i{transform:translateX(4px)}
.link.c{color:var(--cyan);border-color:rgba(0,171,218,.42)}
.btn{display:inline-block;background:var(--cyan);color:#04121B;
  font-family:var(--fl),var(--flk);font-weight:500;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;padding:19px 34px;text-decoration:none;
  border:1px solid var(--cyan);transition:.26s var(--e)}
.btn:hover{background:transparent;color:var(--cyan)}
.btn.ghost{background:transparent;color:#fff;border-color:var(--hair2)}
.btn.ghost:hover{border-color:#fff;background:#fff;color:#04121B}

/* ── light surfaces — the paper plane, used by whole sections now ───── */
.lightsec{background:var(--paper);color:var(--lt)}
.lightsec.warm{background:linear-gradient(168deg,var(--wpale) 0%,var(--paper) 46%,#E9EDF3 100%)}
.lightsec h1,.lightsec h2,.lightsec h3,.lightsec h4.dsp{color:var(--lt)}
.lightsec .lede{color:var(--lt2)}
.lightsec .label{color:var(--cyanD)}
.lightsec .link{color:var(--lt);border-color:var(--lthair)}
.lightsec .link:hover{color:var(--cyanD);border-color:var(--cyanD)}
.lightsec .btn{background:var(--lt);border-color:var(--lt);color:var(--paper)}
.lightsec .btn:hover{background:transparent;color:var(--lt)}

/* ── header ─────────────────────────────────────────────────────────── */
header{position:fixed;top:0;left:0;right:0;z-index:90;background:rgba(5,10,24,.93);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--hair)}
header .bar{display:flex;align-items:center;justify-content:space-between;padding:16px var(--gut)}
header svg{height:25px;display:block}
header a.home{display:block;line-height:0}
header nav{display:flex;gap:clamp(14px,1.9vw,30px);align-items:center;
  font-family:var(--fl),var(--flk);font-weight:400;font-size:11.5px;letter-spacing:.11em}
header nav>a,header .drop>a{padding:6px 0;display:block}
header nav a{color:#C3CEE4;text-decoration:none;text-transform:uppercase;transition:color .24s var(--e)}
header nav a:hover,header nav a.on{color:#fff}
header nav a.navcta{color:var(--cyan);font-weight:500;border:1px solid rgba(0,171,218,.55);
  padding:8px 15px;line-height:1;transition:background .24s var(--e),color .24s var(--e),
  border-color .24s var(--e)}
header nav a.navcta:hover{background:var(--cyan);border-color:var(--cyan);color:#04121B}

/* the home item opens the page's own sections on hover */
header .drop{position:relative}
header .drop>a{display:flex;align-items:center;gap:7px}
header .drop>a i{font-style:normal;font-size:8px;line-height:1;opacity:.6;transition:transform .26s var(--e)}
header .drop:hover>a i{transform:rotate(180deg)}
header .drop menu{position:absolute;left:-16px;top:100%;margin-top:9px;min-width:210px;
  background:rgba(5,10,24,.97);border:1px solid var(--hair);backdrop-filter:blur(14px);
  list-style:none;padding:7px 0;opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .24s var(--e),transform .24s var(--e),visibility .24s}
header .drop:hover menu,header .drop:focus-within menu{opacity:1;visibility:visible;transform:none}
header .drop menu a{display:block;padding:9px 18px;font-size:11px;letter-spacing:.09em;
  color:#B4C0DA;text-transform:uppercase;white-space:nowrap;transition:.2s var(--e)}
header .drop menu a:hover{color:#fff;background:rgba(0,171,218,.14)}

/* ── the mobile menu ────────────────────────────────────────────────
   On a narrow screen the inline links leave the bar and live in a
   panel under it; the burger in the bar opens and closes it. */
header .bar{position:relative;z-index:95}
/* the logo and the burger must ride above the open panel (z-index 94),
   which as a positioned later sibling would otherwise paint over them */
header a.home,.menubtn{position:relative;z-index:96}
.menubtn{display:none;appearance:none;background:transparent;border:0;cursor:pointer;
  width:44px;height:40px;padding:10px;margin-right:-10px}
.menubtn span{display:block;height:2px;background:#E8F0FC;margin:6px 0;
  transition:transform .3s var(--e)}
header.open .menubtn span:first-child{transform:translateY(4px) rotate(45deg)}
header.open .menubtn span:last-child{transform:translateY(-4px) rotate(-45deg)}
@media(max-width:1240px){
  .menubtn{display:block}
  header nav{position:fixed;left:0;right:0;top:0;z-index:94;
    flex-direction:column;align-items:flex-start;gap:2px;
    padding:calc(63px + 18px) var(--gut) 26px;
    background:rgba(5,10,24,.97);border-bottom:1px solid var(--hair);
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .28s var(--e),transform .28s var(--e),visibility .28s}
  header.open nav{opacity:1;visibility:visible;transform:none}
  header nav>a,header .drop>a{padding:11px 0;font-size:13px}
  header nav a.navcta{margin-top:10px}
}

/* ── page header, shared by every subpage ───────────────────────────── */
.phead{position:relative;overflow:hidden;isolation:isolate;padding:clamp(140px,15vw,220px) var(--gut) clamp(60px,7vw,100px);
  background:linear-gradient(180deg,var(--ink),var(--navy))}
svg.rays{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;
  mix-blend-mode:screen}
.phead .in{position:relative;z-index:2}
.phead h1{max-width:19ch}
.phead .lede{margin-top:22px;max-width:60ch;font-size:17px}
.crumb{font-family:var(--fl),var(--flk);font-weight:400;font-size:11px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim2);margin-bottom:18px;display:block}
.crumb a{color:var(--dim2);text-decoration:none}
.crumb a:hover{color:var(--cyan)}

/* ── placeholder page ───────────────────────────────────────────────── */
.stub{min-height:100svh;display:flex;align-items:center;position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(120px,14vh,190px) var(--gut) clamp(70px,9vh,120px);
  background:linear-gradient(180deg,var(--ink),var(--navy))}
.stub .in{position:relative;z-index:2;width:100%}
.stub .tagline{display:inline-flex;align-items:center;gap:12px;font-family:var(--fl),var(--flk);
  font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--w2);
  border:1px solid rgba(218,167,129,.34);padding:10px 15px}
.stub h1{margin-top:clamp(26px,3vw,42px);max-width:15ch}
.stub .lede{max-width:52ch}
.stub .next{margin-top:clamp(34px,4vw,54px);display:flex;gap:26px;flex-wrap:wrap;align-items:center}
.stub .ghost{margin-top:clamp(40px,5vw,68px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--hair);
  border-left:1px solid var(--hair);border-right:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.stub .ghost div{background:rgba(10,19,48,.6);padding:18px 18px 22px}
.stub .ghost b{display:block;font-family:var(--fl),var(--flk);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--dim2)}
.stub .ghost span{display:block;margin-top:11px;font-size:14px;line-height:1.5;color:#9AA8C6}
.lightsec .stub{background:transparent}

/* ── footer ─────────────────────────────────────────────────────────── */
footer{background:var(--ink);border-top:1px solid var(--hair);padding:38px var(--gut) 30px}
footer .in{display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap;align-items:flex-start}
footer nav{display:flex;gap:26px;flex-wrap:wrap}
footer a{color:var(--dim);text-decoration:none;font-size:13px;transition:color .24s var(--e)}
footer a:hover{color:var(--cyan)}
footer .sm{font-size:12.5px;color:var(--dim2)}

/* ── the one motion primitive the subpages share ────────────────────── */
.rv{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--e),transform .7s var(--e)}
/* reveal() adds .shown — deliberately not .in, which is the layout container */
.rv.shown{opacity:1;transform:none}
.rv.d1{transition-delay:.07s} .rv.d2{transition-delay:.14s} .rv.d3{transition-delay:.21s}
.rv.d4{transition-delay:.28s} .rv.d5{transition-delay:.35s}

/* ── shared surfaces ────────────────────────────────────────────────── */
.panel{border:1px solid var(--hair);background:linear-gradient(168deg,var(--navy2),#080F2A);
  padding:clamp(24px,2.3vw,34px);transition:border-color .3s var(--e),transform .3s var(--e)}
.panel:hover{border-color:var(--hair2)}
.panel h3,.panel h4{color:#fff}
.panel p{margin-top:13px;font-size:14.5px;line-height:1.62;color:var(--dim)}
.panel .n{font-family:var(--fl),var(--flk);font-weight:600;font-size:10.5px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);display:block}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.split{display:grid;grid-template-columns:minmax(280px,.82fr) 1.18fr;
  gap:clamp(34px,5.4vw,84px);align-items:start}
.rule{border:0;border-top:1px solid var(--hair);margin:0}

/* ── the contact band: heading, form, and where we are ─────────────── */
/* the band is the whole page, so it must clear the fixed header itself —
   the compact section rhythm alone dips below the bar at some widths */
#contactsec{padding-top:clamp(116px,13vw,150px)}
#contactsec .sechead h1{max-width:24ch}
/* the data-protection note, directly under the form */
#contactsec .formnote{margin-top:14px;font-size:13.5px;line-height:1.55;color:var(--lt3);max-width:64ch}
#contactsec .formnote a{color:var(--cyanD);text-decoration:none;border-bottom:1px solid var(--lthair)}
#contactsec .formnote a:hover{border-color:var(--cyanD)}
#contactsec .sechead{margin-bottom:clamp(28px,3.2vw,44px)}
#contactsec .cgrid{align-items:start}
.postal{font-style:normal;font-family:var(--fd),var(--fdk);font-weight:400;
  letter-spacing:-.01em;font-size:clamp(19px,1.7vw,24px);line-height:1.5;color:var(--lt);
  border-top:1px solid var(--lthair);padding-top:22px}
/* doubled selector: .note is defined later in the file and would win the
   specificity tie, putting its warm box around a plain email line */
.note.cmail{margin-top:16px;border:0;background:transparent;padding:0}
/* the address in the same hand as the postal lines, marked by an envelope —
   read and copied, never clicked */
.cmail .mail{display:inline-flex;align-items:center;gap:.5em;
  font-family:var(--fd),var(--fdk);font-weight:400;letter-spacing:-.01em;
  font-size:clamp(19px,1.7vw,24px);line-height:1.5;color:var(--lt);cursor:text}
.cmail .mail::before{content:"";flex:none;width:1em;height:1em;background:var(--cyanD);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='1.5'/%3E%3Cpath d='M3 6l9 7 9-7'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='1.5'/%3E%3Cpath d='M3 6l9 7 9-7'/%3E%3C/svg%3E") center/contain no-repeat}

/* a plain list of facts, hairline-separated — used on every subpage */
.facts{list-style:none;border-top:1px solid var(--hair);margin-top:22px}
.facts li{border-bottom:1px solid var(--hair);padding:15px 0;display:grid;
  grid-template-columns:minmax(120px,.32fr) 1fr;gap:clamp(14px,2vw,32px);align-items:baseline}
.facts i{font-style:normal;font-family:var(--fl),var(--flk);font-weight:400;font-size:10px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim2)}
.facts b{font-weight:400;font-size:14.5px;color:#D9E1F1}
.facts b span{display:block;font-size:13px;color:var(--dim2);margin-top:4px}

/* ── the news page: what we announced, and where we will be ─────────── */
.split-ne{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(300px,.82fr);
  gap:clamp(32px,4.4vw,76px);align-items:start}
.newsevents .label{margin-bottom:20px}

/* the lead release, then the rest as a titled list */
.panel.lead h3{margin-top:13px;font-size:clamp(21px,1.9vw,28px);line-height:1.14;
  letter-spacing:calc(-.02em*var(--dt))}
.panel.lead h3 a{color:inherit;text-decoration:none;transition:color .24s var(--e)}
.panel.lead h3 a:hover{color:var(--cyan)}
.panel.lead p{margin-top:15px;font-size:15px}
.panel.lead .link{margin-top:22px}
.newsrest{list-style:none;margin-top:clamp(18px,1.8vw,26px);border-top:1px solid var(--hair)}
.newsrest li{border-bottom:1px solid var(--hair)}
.newsrest a{display:block;padding:16px 0;text-decoration:none;
  transition:padding-left .3s var(--e)}
.newsrest a:hover{padding-left:10px}
.newsrest b{display:block;font-family:var(--fd),var(--fdk);font-weight:var(--dwt);
  letter-spacing:calc(-.015em*var(--dt));font-size:16.5px;line-height:1.3;color:#E7EDF8;
  transition:color .24s var(--e)}
.newsrest a:hover b{color:var(--cyan)}
.newsrest i{display:block;margin-top:7px;font-style:normal;font-family:var(--fl),var(--flk);
  font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--dim2)}

/* the events: when it runs, what it is, where it is */
.evlist{list-style:none;border-top:1px solid var(--hair)}
.evlist li{border-bottom:1px solid var(--hair)}
.evlist .ev{display:grid;grid-template-columns:minmax(96px,auto) minmax(0,1fr) auto;
  gap:clamp(12px,1.4vw,22px);padding:17px 0;color:inherit;text-decoration:none;
  transition:padding-left .3s var(--e)}
/* an entry is a button that opens the event window */
.evlist button.ev{appearance:none;background:none;border:0;font:inherit;text-align:left;
  width:100%;cursor:pointer}
.evlist button.ev::after{content:"›";align-self:center;font-size:18px;line-height:1;color:var(--dim2);
  transition:transform .24s var(--e),color .24s var(--e)}
.evlist button.ev:hover{padding-left:6px}
.evlist button.ev:hover::after,.evlist button.ev:focus-visible::after{color:var(--cyan);transform:translateX(3px)}
.evlist button.ev:hover .what b,.evlist button.ev:focus-visible .what b{color:var(--cyan)}
.evlist button.ev:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.evlist .what .sub{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:6px}
.evlist .what .sub i{margin-top:0}
.evlist .when{font-family:var(--fl),var(--flk);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--cyan);white-space:nowrap;padding-top:3px;
  font-variant-numeric:tabular-nums}
.evlist .what b{display:block;font-family:var(--fd),var(--fdk);font-weight:var(--dwt);
  letter-spacing:calc(-.015em*var(--dt));font-size:16.5px;line-height:1.3;color:#fff;
  transition:color .24s var(--e)}
.evlist .what i{display:block;margin-top:6px;font-style:normal;font-size:13.5px;
  line-height:1.4;color:var(--dim)}

/* the tag that flags a keynote or a panel of Lucera's — in the lists and
   in the event window alike */
.evtag{display:inline-block;font-style:normal;font-family:var(--fl),var(--flk);font-weight:600;
  font-size:9.5px;line-height:1.3;letter-spacing:.13em;text-transform:uppercase;color:#fff;
  background:var(--cyanD);padding:3px 7px 2px;white-space:nowrap}

/* ── the event window ─────────────────────────────────────────────────
   Opened from the homepage strip and the News page (site.js). */
.evmodal{position:fixed;inset:0;z-index:130;background:rgba(4,9,22,.66);
  display:flex;align-items:center;justify-content:center;padding:22px}
.evmodal[hidden]{display:none}
.evmodal .card{position:relative;width:min(560px,100%);max-height:88vh;overflow:auto;
  overscroll-behavior:contain;background:#fff;border:1px solid var(--lthair);
  box-shadow:0 30px 80px rgba(4,9,22,.35);
  padding:clamp(26px,3vw,36px) clamp(22px,3vw,36px) clamp(24px,3vw,32px)}
.evmodal .x{position:absolute;top:8px;right:8px;appearance:none;border:0;background:transparent;
  font-size:26px;line-height:1;color:var(--lt3);cursor:pointer;padding:10px}
.evmodal .x:hover{color:var(--lt)}
.evmodal .when{display:block;padding-right:36px;font-family:var(--fl),var(--flk);font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--cyanD);font-variant-numeric:tabular-nums}
.evmodal h3{margin-top:12px;padding-right:20px;color:var(--lt);font-size:var(--t-card);line-height:1.15}
.evmodal .venue{margin-top:8px;font-size:14.5px;line-height:1.5;color:var(--lt3)}
.evmodal .note{margin-top:14px;font-size:15px;line-height:1.6;color:var(--lt2)}
.evmodal .session{margin-top:22px;padding:18px 20px 20px;background:rgba(0,171,218,.07);
  border:1px solid rgba(5,137,186,.2)}
.evmodal .session .head{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}
.evmodal .session .k{font-family:var(--fl),var(--flk);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--lt3)}
.evmodal .session .t{display:block;margin-top:13px;font-family:var(--fd),var(--fdk);
  font-weight:var(--dwt);letter-spacing:-.01em;font-size:clamp(17px,1.5vw,20px);line-height:1.28;color:var(--lt)}
.evmodal .session .at{margin-top:10px;font-size:14px;line-height:1.5;font-weight:600;color:var(--lt2)}
.evmodal .session .who{margin-top:3px;font-size:14px;line-height:1.5;color:var(--lt2)}
.evmodal .session .with{margin-top:10px;font-size:13.5px;line-height:1.55;color:var(--lt3)}
.evmodal .session .link{margin-top:14px}
.evmodal .acts{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.evmodal .btn{background:var(--lt);border-color:var(--lt);color:#fff;padding:16px 26px}
.evmodal .btn:hover{background:transparent;color:var(--lt)}
.evmodal .link{color:var(--lt);border-color:var(--lthair)}
.evmodal .link:hover{color:var(--cyanD);border-color:var(--cyanD)}
.evmodal .link:hover i{transform:translate(2px,-2px)}
@media (max-width:880px){
  .split-ne{grid-template-columns:1fr;gap:clamp(38px,6vw,60px)}
}

/* ── sticky section nav ─────────────────────────────────────────────── */
.snav{position:sticky;top:58px;z-index:60;background:rgba(5,10,24,.9);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hair)}
.snav .in{display:flex;gap:clamp(16px,2.6vw,40px);padding:0 var(--gut);overflow-x:auto;
  scrollbar-width:none}
.snav .in::-webkit-scrollbar{display:none}
.snav a{white-space:nowrap;padding:15px 0;text-decoration:none;position:relative;
  font-family:var(--fl),var(--flk);font-weight:400;font-size:10.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim2);
  transition:color .26s var(--e)}
.snav a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--cyan);transform:scaleX(0);transform-origin:left;
  transition:transform .32s var(--e)}
.snav a:hover{color:#C3CEE4}
.snav a.on{color:#fff}
.snav a.on::after{transform:scaleX(1)}

/* ── form controls ──────────────────────────────────────────────────── */
.field{display:block;margin-top:22px}
.field span{font-family:var(--fl),var(--flk);font-weight:400;font-size:10px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--dim2);display:block;margin-bottom:9px}
.field input,.field textarea,.field select{width:100%;background:rgba(6,12,30,.6);color:var(--txt);
  border:1px solid var(--hair);padding:14px 16px;font:inherit;font-size:15px;
  transition:border-color .24s var(--e),background .24s var(--e)}
.field textarea{min-height:150px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:0;border-color:var(--cyan);
  background:rgba(0,171,218,.06)}
.field input::placeholder,.field textarea::placeholder{color:#5D6B92}

/* ── functional subpages ─────────────────────────────────────────────
   Compact light headers (no hero), light forms, roles, legal prose.   */
.phead.light{background:var(--paper);border-bottom:1px solid var(--lthair)}
.phead.light h1{color:var(--lt)}
.phead.light .lede{color:var(--lt2)}
.phead.light .crumb,.phead.light .crumb a{color:var(--lt3)}
.phead.light .crumb a:hover{color:var(--cyanD)}
.phead.fn{padding:clamp(116px,13vw,150px) var(--gut) clamp(40px,5vw,62px)}
.phead.fn h1{max-width:24ch}
.phead.fn .lede{margin-top:18px;max-width:64ch}

.lightsec.plain{background:var(--paper);color:var(--lt)}
/* functional pages don't need the tall section rhythm of the homepage */
section.compact{padding-top:clamp(44px,5.4vw,78px);padding-bottom:clamp(44px,5.4vw,78px)}
/* form-led split: wide first column (the form), narrow second (the address) */
.split.rev{grid-template-columns:1.15fr minmax(260px,.82fr)}
.stack{max-width:var(--max);margin:0 auto}
.subhead{font-family:var(--fl),var(--flk);font-weight:600;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cyanD);display:block;margin-bottom:20px}

/* light form fields */
.lightsec .field span{color:var(--lt3)}
.lightsec .field input,.lightsec .field textarea,.lightsec .field select{
  background:#fff;color:var(--lt);border-color:var(--paper2)}
.lightsec .field input::placeholder,.lightsec .field textarea::placeholder{color:#9AA6BC}
.lightsec .field input:focus,.lightsec .field textarea:focus,.lightsec .field select:focus{
  border-color:var(--cyanD);background:#fff}

/* light facts list */
.lightsec .facts,.lightsec .facts li{border-color:var(--lthair)}
.lightsec .facts i{color:var(--lt3)}
.lightsec .facts b{color:var(--lt)}
.lightsec .facts b span{color:var(--lt3)}
.lightsec .rule{border-color:var(--lthair)}
.facts a{color:inherit;text-decoration:none;transition:color .2s var(--e)}
.facts a:hover{color:var(--cyanD)}

/* light card — roles, form container, contact block */
.lcard{border:1px solid var(--lthair);background:#fff;
  padding:clamp(22px,2.4vw,32px);transition:border-color .3s var(--e)}
.lcard:hover{border-color:#C9D2DE}
.lcard h3{color:var(--lt);font-size:var(--t-card)}
.lcard .meta{display:block;margin-top:9px;font-family:var(--fl),var(--flk);font-size:10.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--cyanD)}
.lcard p{margin-top:14px;font-size:15px;line-height:1.62;color:var(--lt2)}
.lcard ul{list-style:none;margin-top:16px}
.lcard ul li{position:relative;padding:6px 0 6px 20px;font-size:14px;color:var(--lt2);line-height:1.55}
.lcard ul li::before{content:"";position:absolute;left:0;top:13px;width:6px;height:6px;background:var(--cyanD)}
.lcard .foot{margin-top:24px}

/* legal / plain prose on light */
.prose{max-width:78ch}
.prose>*+*{margin-top:14px}
.prose h2{color:var(--lt);font-size:var(--t-card);margin-top:40px;letter-spacing:-.01em}
.prose h2:first-child{margin-top:0}
.prose h3{color:var(--lt);font-size:16px;margin-top:24px}
.prose p{font-size:15px;line-height:1.72;color:var(--lt2)}
.prose ul{padding-left:20px}
.prose li{font-size:15px;line-height:1.7;color:var(--lt2);margin-top:6px}
.prose a{color:var(--cyanD);text-decoration:none;border-bottom:1px solid var(--lthair)}
.prose a:hover{border-color:var(--cyanD)}

/* ── a press release ──────────────────────────────────────────────────
   The headline is a sentence, so it gets a measure and size of its own;
   the release reads in one column with the contacts beside it. */
.phead.press h1{font-size:calc(clamp(34px,3.4vw,50px)*var(--ds));max-width:40ch;
  line-height:1.1;text-wrap:balance}
.presswrap{display:grid;grid-template-columns:minmax(0,760px) minmax(260px,300px);
  gap:clamp(40px,5vw,88px);align-items:start}
.release p,.release li{font-size:16px;line-height:1.75}
.release p strong{color:var(--lt)}
/* the highlights under the headline */
.release>ul:first-child{list-style:none;padding:24px 28px 22px;background:#fff;
  border:1px solid var(--lthair);margin-bottom:34px}
.release>ul:first-child li{position:relative;padding-left:22px;color:var(--lt);margin-top:10px}
.release>ul:first-child li:first-child{margin-top:0}
.release>ul:first-child li::before{content:"";position:absolute;left:0;top:.72em;width:7px;height:7px;
  background:var(--cyanD)}
/* the CEO's words */
.release blockquote{margin:32px 0;padding:26px 30px;background:rgba(0,171,218,.07);border:0}
.release blockquote p{font-size:17px;line-height:1.7;color:var(--lt)}
.release h2{margin-top:48px}
.pressside{position:sticky;top:104px}
.presscontact p{margin-top:14px;font-size:14px;line-height:1.6;color:var(--lt2)}
.presscontact p b{color:var(--lt)}
.pressside .presspdf,.pressside .pressback{margin-top:26px}
@media(max-width:1040px){
  .presswrap{grid-template-columns:minmax(0,760px)}
  .pressside{position:static}
}
.ph{font-style:normal;color:var(--w3);background:rgba(192,138,98,.10);
  padding:0 5px;border:1px solid rgba(192,138,98,.30)}
.note{border:1px solid rgba(192,138,98,.34);background:rgba(247,234,220,.55);
  padding:15px 18px;font-size:13.5px;line-height:1.62;color:var(--lt2)}
.note a,.confirm a{color:var(--cyanD);text-decoration:none;border-bottom:1px solid var(--lthair)}
.note a:hover,.confirm a:hover{border-color:var(--cyanD)}
.confirm{border:1px solid var(--cyanD);background:rgba(0,171,218,.06);padding:clamp(24px,2.6vw,34px)}
.confirm h3{color:var(--lt)}
.confirm p{margin-top:12px;font-size:15px;color:var(--lt2);line-height:1.62}

/* ── illumination + cards ─────────────────────────────────────────────
   The prism wash and card treatment from the homepage's Success stories,
   shared so the subpages read as part of the same site. LUCERA.illuminate
   draws the ray fan and, given cards, brightens the rays that reach the one
   under the cursor. */
.illum{position:relative;overflow:hidden;isolation:isolate}
.illum .wash{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;
  mix-blend-mode:multiply}
.illum .in{position:relative;z-index:2}


@media(max-width:1040px){
  /* .split.rev is doubled so its two-column desktop rule cannot outrank
     the stack — the form first, the address below it */
  .g3,.g4,.split,.split.rev{grid-template-columns:1fr}
}
@media(max-width:700px){ .g2{grid-template-columns:1fr} }
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}}

/* ── Contact Form 7 ───────────────────────────────────────────────────
   The form is built from the theme's own field markup, so it only needs
   the wrappers CF7 adds around each control to get out of the way. */
.wpcf7 p{margin:0}
.wpcf7 .field input,.wpcf7 .field textarea,.wpcf7 .field select{width:100%}
/* a five-field form should read as one calm card, not a tower: tighter
   rhythm than the default .field spacing, and a message box that suggests
   a paragraph or two rather than an essay */
.wpcf7 .field,.wpcf7 .g2,.mform .field,.mform .g2{margin-top:16px}
.wpcf7 .g2 .field,.mform .g2 .field{margin-top:0}
.wpcf7 form>.field:first-child,.wpcf7 form>.g2:first-child,
.wpcf7 .hidden-fields-container+.g2,.wpcf7 .hidden-fields-container+.field,
.mform>.field:first-child,.mform>.g2:first-child{margin-top:0}
.wpcf7 .field textarea,.mform .field textarea{height:160px;min-height:120px}

.mform .foot{margin-top:22px}
.wpcf7-form-control-wrap{display:block}
.wpcf7 .wpcf7-submit{cursor:pointer}
.wpcf7-not-valid-tip{margin-top:7px;font-size:12px;color:#C0392B}
.wpcf7-response-output{margin:22px 0 0!important;padding:14px 17px!important;
  border:1px solid var(--lthair)!important;font-size:13.5px;line-height:1.55}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--cyanD)!important;
  background:rgba(0,171,218,.06)}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output{border-color:rgba(192,138,98,.6)!important;
  background:rgba(247,234,220,.5)}
.wpcf7-spinner{margin-left:12px}