/* LexVault public site + investor portal sign-in.
   The interactive brief under /portal/brief has its own, unchanged stylesheet. */

:root{
  --navy-950:#0A1322; --navy-900:#0F1C30; --navy-850:#122239; --navy-800:#162943; --navy-700:#1E3554;
  --line-d:rgba(201,162,90,.16); --line-d2:rgba(233,228,216,.10);
  --gold:#C9A25A; --gold-2:#B8924C; --gold-soft:#E9D9B5;
  --ivory:#FBF9F4; --cream:#F6F1E7; --ink:#1B2430; --muted:#5A6371; --rule:#E2DCD0;
  --on-dark:#ECE7DC; --on-dark-2:#AEB5BF;
  --serif:"EB Garamond",Garamond,"Times New Roman",Georgia,serif;
  --sans:"IBM Plex Sans",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;overflow-x:clip}
body{font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.gold{color:var(--gold)}
.brand{display:inline-flex;align-items:center;text-decoration:none;line-height:0}
.brand .logo{display:block;height:32px;width:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* =========================================================
   INVESTOR PORTAL SIGN-IN (Reference 2)
   ========================================================= */
.portal-page{background:var(--navy-900);color:var(--ink);color-scheme:light}
.portal{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;min-height:100dvh}

.p-side{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;
  padding:56px clamp(40px,6vw,88px) 48px;
  color:var(--on-dark);
  background:
    radial-gradient(60% 45% at 78% 22%,rgba(42,74,116,.38),transparent 70%),
    radial-gradient(70% 60% at 10% 100%,rgba(8,16,30,.7),transparent 70%),
    linear-gradient(165deg,var(--navy-800) 0%,var(--navy-900) 55%,var(--navy-950) 100%);
}
.p-side::after{ /* faint vault ring */
  content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-170px;top:6%;
  border-radius:50%;border:1px solid rgba(201,162,90,.07);
  box-shadow:0 0 0 46px rgba(201,162,90,.025),inset 0 0 0 46px rgba(201,162,90,.02);
}
.p-top{align-self:flex-start}
.p-side .brand .logo{height:36px}
.p-intro{margin:auto 0 0;padding-top:72px}
.p-title{font-family:var(--serif);font-weight:500;font-size:clamp(3.2rem,5.6vw,5.2rem);line-height:1.02;letter-spacing:-.01em;margin:0 0 30px;color:#F4F0E6}
.p-lede{font-size:1.18rem;line-height:1.65;color:var(--on-dark-2);max-width:31em;margin:0}
.p-tiles{list-style:none;padding:0;margin:56px 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:620px}
.tile{
  display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:4px;align-items:center;
  padding:20px 20px 18px;border-radius:10px;
  background:rgba(22,41,67,.55);border:1px solid var(--line-d2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.tile svg{width:20px;height:20px;fill:none;stroke:var(--gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.tile-t{font-family:var(--serif);font-size:1.32rem;line-height:1.15;color:var(--gold);font-weight:500}
.tile-d{grid-column:1 / -1;font-size:.88rem;line-height:1.45;color:var(--on-dark-2);margin-top:4px}
.p-foot{margin-top:64px;font-size:.82rem;line-height:1.6;color:rgba(174,181,191,.75)}
.p-foot p{margin:0}

.p-auth{
  position:relative;display:flex;align-items:center;justify-content:center;
  padding:96px clamp(28px,6vw,96px);background:var(--ivory);
}
.p-back{position:absolute;top:44px;right:clamp(28px,4vw,56px);font-size:.88rem;color:var(--muted);text-decoration:none}
.p-back:hover{color:var(--ink)}
.auth{width:100%;max-width:420px}
.auth h2{font-family:var(--serif);font-weight:500;font-size:2.9rem;line-height:1.05;margin:0 0 10px;color:var(--ink);letter-spacing:-.005em}
.auth-sub{margin:0 0 40px;color:var(--muted);font-size:1.02rem}
.auth label{display:block;font-weight:500;font-size:.95rem;margin:0 0 10px;color:var(--ink)}
.field{position:relative;display:flex;align-items:center}
.field-ico{position:absolute;left:16px;width:19px;height:19px;fill:none;stroke:#8A929E;stroke-width:1.6;stroke-linecap:round;pointer-events:none}
.field input{
  width:100%;height:56px;padding:0 54px 0 48px;border-radius:9px;
  border:1px solid var(--rule);background:#fff;color:var(--ink);
  font:inherit;font-size:1rem;letter-spacing:.02em;
  transition:border-color .15s,box-shadow .15s;
}
.field input::placeholder{color:#A3AAB4;letter-spacing:.12em}
.field input:focus{outline:none;border-color:var(--navy-700);box-shadow:0 0 0 3px rgba(30,53,84,.12)}
.eye{position:absolute;right:8px;width:40px;height:40px;display:grid;place-items:center;border:0;background:none;border-radius:8px;cursor:pointer;color:#7D8591}
.eye:hover{color:var(--ink);background:rgba(27,36,48,.05)}
.eye svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.eye .eye-shut,.eye[aria-pressed="true"] .eye-open{display:none}
.eye[aria-pressed="true"] .eye-shut{display:block}
.submit{
  width:100%;height:56px;margin-top:28px;border:0;border-radius:9px;cursor:pointer;
  background:var(--navy-800);color:#F4F0E6;font:inherit;font-weight:500;font-size:1.02rem;letter-spacing:.01em;
  box-shadow:0 1px 2px rgba(10,19,34,.2),0 6px 18px rgba(10,19,34,.14);
  transition:background .15s,transform .05s;
}
.submit:hover{background:var(--navy-700)}
.submit:active{transform:translateY(1px)}
.submit:disabled{opacity:.75;cursor:progress}
.auth-msg{margin:-16px 0 24px;padding:12px 14px;border-radius:8px;font-size:.92rem;background:#EEF2F6;color:var(--navy-800);border:1px solid #DCE3EB}
.auth-msg.is-error{background:#FBEFEC;color:#8A2E1E;border-color:#F0D4CC}
.auth-note{margin-top:36px;padding:16px 18px;border-radius:9px;border:1px solid var(--rule);background:var(--cream)}
.auth-note p{margin:0;font-size:.9rem;line-height:1.55;color:var(--muted)}
.auth-note .auth-note-t{font-weight:500;color:var(--ink);margin-bottom:4px}
.auth-fine{margin:40px 0 0;text-align:center;font-size:.82rem;line-height:1.6;color:#666D78}

@media (max-width: 900px){
  .portal{grid-template-columns:1fr;min-height:0}
  .p-side{display:contents}
  .p-side::after{display:none}
  .p-top,.p-intro,.p-tiles,.p-foot{background:var(--navy-900);margin:0;max-width:none}
  .p-top{order:1;display:flex;padding:28px 24px 0;width:100%}
  .p-side .brand .logo{height:28px}
  .p-intro{order:2;padding:40px 24px 44px;background:linear-gradient(180deg,var(--navy-900),var(--navy-850))}
  .p-title{font-size:clamp(2.7rem,12vw,3.6rem);margin-bottom:18px}
  .p-lede{font-size:1.05rem}
  .p-auth{order:3;padding:44px 24px 52px;align-items:flex-start}
  .p-back{display:none}
  .auth{max-width:none}
  .auth h2{font-size:2.3rem}
  .auth-sub{margin-bottom:30px}
  .auth-note{margin-top:28px}
  .auth-fine{display:none}
  .p-tiles{order:4;padding:36px 24px 8px;gap:12px}
  .tile{padding:16px 14px 14px}
  .tile-t{font-size:1.12rem}
  .tile-d{font-size:.82rem}
  .p-foot{order:5;padding:24px 24px calc(32px + env(safe-area-inset-bottom,0px))}
}
@media (max-width: 380px){ .p-tiles{grid-template-columns:1fr} }

/* =========================================================
   PUBLIC HOME (Reference 1)
   ========================================================= */
.home{background:#09090B;color:var(--on-dark);color-scheme:dark}
.h-nav{
  position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;
  max-width:1280px;margin:0 auto;padding:22px clamp(16px,4vw,40px);
}
.h-cta{
  display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;text-decoration:none;
  border:1px solid rgba(201,162,90,.55);color:var(--gold-soft);font-size:.92rem;font-weight:500;
  transition:background .15s,border-color .15s,color .15s;
}
.h-cta:hover{background:rgba(201,162,90,.12);border-color:var(--gold);color:#fff}
.h-cta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

.hero{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(28px,5vw,56px) 16px 0;
  background:
    radial-gradient(55% 40% at 50% 0%,rgba(255,255,255,.06),transparent 70%),
    linear-gradient(180deg,#141416 0%,#0B0B0D 48%,#050506 100%);
}
.hero::after{ /* soft stage floor, like a studio sweep */
  content:"";position:absolute;z-index:-1;left:50%;bottom:-62%;width:150%;aspect-ratio:2.2;transform:translateX(-50%);
  border-radius:50%;background:radial-gradient(closest-side,rgba(120,120,128,.28),rgba(60,60,66,.12) 55%,transparent 75%);
}
.lockup{display:flex;flex-direction:column;align-items:center;text-align:center;margin:0 auto clamp(40px,7vw,80px)}
.lockup h1{margin:0;line-height:0}
.lockup-logo{display:block;width:clamp(190px,24vw,320px);height:auto;filter:drop-shadow(0 0 28px rgba(201,162,90,.12))}
.lockup .tag{margin:clamp(16px,2vw,24px) 0 0;font-size:clamp(.72rem,1.2vw,1rem);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}

/* ---- device stage: 1em = 1% of stage width ---- */
.stage-wrap{max-width:1240px;margin:0 auto;container-type:inline-size}
.stage{position:relative;font-size:1cqw;height:57.5em;font-family:var(--sans);user-select:none}
.stage *{line-height:1.3}
.dev{position:absolute}
.dev .scr{position:absolute;overflow:hidden;background:var(--navy-900);color:var(--on-dark)}

/* laptop */
.laptop{left:19em;top:0;width:63em;z-index:1}
.laptop .lid{
  position:relative;height:39.4em;border-radius:1.5em 1.5em .5em .5em;
  background:#0B0B0C;border:.18em solid #2A2B2E;
  box-shadow:0 0 0 .08em #5C5E63,0 2.5em 5em rgba(0,0,0,.6);
}
.laptop .lid::before{content:"";position:absolute;top:.6em;left:50%;width:.45em;height:.45em;margin-left:-.22em;border-radius:50%;background:#1E2022;box-shadow:inset 0 0 .1em #3a3d42}
.laptop .scr{inset:1.7em 1.5em 1.5em}
.laptop .base{
  position:relative;left:-6.5em;width:76em;height:1.9em;border-radius:.2em .2em 2.4em 2.4em / .2em .2em 1.6em 1.6em;
  background:linear-gradient(180deg,#E3E4E6 0%,#C3C5C9 35%,#8E9196 80%,#5E6166 100%);
  box-shadow:0 1.4em 2.6em rgba(0,0,0,.65);
}
.laptop .base::before{content:"";position:absolute;left:50%;top:0;width:11em;height:.75em;margin-left:-5.5em;border-radius:0 0 1em 1em;background:linear-gradient(180deg,#A7AAAF,#C9CBCF)}

/* phone */
.phone{left:4em;top:15.5em;width:19.6em;height:41.4em;z-index:3;border-radius:3.3em;padding:.85em;
  background:linear-gradient(145deg,#E6D6B6,#A88C5C 40%,#D9C49C 70%,#8C7448);
  box-shadow:0 2.5em 4.5em rgba(0,0,0,.7),inset 0 0 0 .12em rgba(255,255,255,.35);
}
.phone .bezel{position:relative;width:100%;height:100%;border-radius:2.6em;background:#050506;padding:.55em}
.phone .scr{inset:.55em;border-radius:2.1em}
.phone .island{position:absolute;z-index:2;top:1.15em;left:50%;width:6.4em;height:1.75em;margin-left:-3.2em;border-radius:1em;background:#000}

/* tablet */
.tablet{left:54em;top:25.5em;width:43.5em;height:31.2em;z-index:2;border-radius:2.3em;padding:1.35em;
  background:linear-gradient(150deg,#3A3C40,#1B1C1F 45%,#2C2E32);
  box-shadow:0 2.8em 5em rgba(0,0,0,.72),inset 0 0 0 .14em #4A4C51;
}
.tablet .scr{inset:1.35em;border-radius:1.05em}

/* shared mini-UI pieces */
.ui-grid{background-image:linear-gradient(rgba(140,170,210,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(140,170,210,.045) 1px,transparent 1px);background-size:3.2em 3.2em}
.ui-brand{display:flex;align-items:center}
.ui-logo{display:block;height:1em;width:auto}
.ui-pill{display:inline-flex;align-items:center;gap:.35em;border-radius:99em;border:.08em solid rgba(201,162,90,.4);color:var(--gold);padding:.25em .7em}
.ui-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:.3em;background:var(--gold);color:#16120A;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.ui-card{background:rgba(30,53,84,.42);border:.08em solid rgba(233,228,216,.08);border-radius:.6em}
.ok{color:#7FC8A0}.warn{color:#E5B868}.mut{color:#7F8B9C}
.dot{display:inline-block;width:.55em;height:.55em;border-radius:50%;background:currentColor;vertical-align:.05em}

/* laptop screen: public site concept */
.ls{font-size:1em}
.ls-nav{display:flex;align-items:center;justify-content:space-between;padding:2.1em 3.2em 1.4em;font-size:.95em}
.ls-nav .ui-brand{font-size:1.9em}
.ls-nav nav{display:flex;gap:2.6em;color:#C3CAD4;font-size:1.05em}
.ls-nav .right{display:flex;gap:.8em;align-items:center}
.ls-nav .ui-pill{font-size:.95em}
.ls-status{margin:0 3.2em;padding:.9em 0;border-top:.08em solid rgba(233,228,216,.07);border-bottom:.08em solid rgba(233,228,216,.07);font-family:var(--mono);font-size:.82em;letter-spacing:.06em;color:#7F8B9C;text-align:center;white-space:nowrap}
.ls-status .ok{margin:0 .3em}
.ls-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:2.4em;padding:3.4em 3.2em 0 4.2em}
.ls-eye{font-family:var(--mono);font-size:.82em;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.6em}
.ls-eye::before{content:"";display:inline-block;width:2.6em;height:.08em;background:var(--gold);vertical-align:.3em;margin-right:.8em}
.ls-h{font-family:var(--serif);font-weight:500;font-size:3.05em;line-height:1.06;color:#F1ECE2;letter-spacing:-.01em}
.ls-p{font-size:1.08em;line-height:1.55;color:#A9B2BE;margin-top:1.1em;max-width:30em}
.ls-cta{display:flex;align-items:center;gap:2em;margin-top:1.9em}
.ls-cta .ui-btn{font-size:.95em;padding:1.25em 2.1em}
.ls-cta > span:not(.ui-btn){color:#C3CAD4;font-size:1.05em}
.ls-console{margin-top:.4em;padding:0;overflow:hidden;font-size:.95em}
.ls-console .bar{display:flex;align-items:center;gap:.45em;padding:.9em 1.1em;border-bottom:.08em solid rgba(233,228,216,.07);font-family:var(--mono);font-size:.8em;letter-spacing:.12em;color:#8D98A8}
.ls-console .bar i{width:.75em;height:.75em;border-radius:50%;background:#E0675A}
.ls-console .bar i:nth-child(2){background:#E5B868}.ls-console .bar i:nth-child(3){background:#7FC8A0;margin-right:.7em}
.ls-console .row{display:flex;justify-content:space-between;gap:1em;padding:.95em 1.2em;border-bottom:.08em solid rgba(233,228,216,.05);font-size:1em;color:#C9D0D9}
.ls-console .row small{font-family:var(--mono);font-size:.82em;letter-spacing:.04em}

/* phone screen: registration flow */
.ps{display:flex;flex-direction:column;font-size:1em}
.ps-status{display:flex;justify-content:space-between;align-items:center;padding:1.25em 1.9em .6em 2.3em;font-size:1.05em;font-weight:600;color:#EEE}
.ps-status span:last-child{letter-spacing:.1em;font-size:.85em}
.ps-head{display:flex;justify-content:space-between;align-items:center;padding:1.3em 1.4em 1.1em;border-bottom:.08em solid rgba(233,228,216,.07)}
.ps-head .ui-brand{font-size:1.55em}
.ps-burger{width:1.4em;height:1em;background:linear-gradient(#C3CAD4,#C3CAD4) 0 0/100% .12em no-repeat,linear-gradient(#C3CAD4,#C3CAD4) 0 50%/100% .12em no-repeat,linear-gradient(#C3CAD4,#C3CAD4) 0 100%/100% .12em no-repeat}
.ps-title{padding:1.1em 1.4em .2em}
.ps-title b{display:block;font-family:var(--serif);font-weight:500;font-size:1.65em;color:#F1ECE2}
.ps-title span{font-size:.85em;color:#8D98A8}
.ps-steps{display:flex;flex-direction:column;gap:.45em;padding:.7em 1.1em}
.step{display:grid;grid-template-columns:2.2em 1fr;gap:.8em;padding:.8em .9em;border-radius:.7em}
.step .ic{width:2.2em;height:2.2em;border-radius:50%;display:grid;place-items:center;font-size:.95em;border:.12em solid rgba(127,139,156,.4);color:#7F8B9C}
.step.done .ic{background:rgba(127,200,160,.14);border-color:rgba(127,200,160,.5);color:#7FC8A0}
.step.live{background:rgba(30,53,84,.55);border:.08em solid rgba(201,162,90,.35)}
.step.live .ic{border-color:var(--gold);box-shadow:inset 0 0 0 .38em var(--navy-850),inset 0 0 0 1em var(--gold)}
.step b{display:block;font-size:1.05em;font-weight:600;color:#E6E1D7}
.step.live b{color:var(--gold)}
.step.todo b{color:#7F8B9C;font-weight:500}
.step small{display:block;font-size:.8em;color:#8D98A8;margin-top:.25em}
.step.todo small{color:#5D6878}
.step .prog{height:.28em;border-radius:1em;background:rgba(233,228,216,.08);margin-top:.8em;overflow:hidden}
.step .prog::before{content:"";display:block;width:62%;height:100%;background:var(--gold);border-radius:1em}
.ps-foot{margin-top:auto;padding:.6em 1.4em 1.6em;font-family:var(--mono);font-size:.7em;letter-spacing:.1em;text-transform:uppercase;color:#5D6878;text-align:center}

/* tablet screen: verification dashboard */
.ts{font-size:1em;padding:0}
.ts-nav{display:flex;align-items:center;justify-content:space-between;padding:1.25em 1.8em;border-bottom:.08em solid rgba(233,228,216,.07);font-size:.85em}
.ts-nav .ui-brand{font-size:1.5em}
.ts-nav nav{display:flex;gap:2em;color:#AEB7C3}
.ts-nav nav .on{color:#F1ECE2;box-shadow:0 .25em 0 -.05em var(--gold)}
.ts-nav .ui-pill{font-size:.9em}
.ts-body{padding:1.1em 1.8em}
.ts-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.9em}
.ts-head > div b{display:block;font-size:1.65em;font-weight:600;color:#F1ECE2}
.ts-head > div span{font-size:.8em;color:#8D98A8}
.ts-head .ui-btn{font-size:.72em;padding:.9em 1.3em;border-radius:.35em}
.ts-cols{display:grid;grid-template-columns:1fr 1.35fr;gap:1em}
.ts-card{padding:.95em 1.1em}
.ts-k{font-family:var(--mono);font-size:.62em;letter-spacing:.14em;text-transform:uppercase;color:#7F8B9C;margin-bottom:.8em}
.verdict{display:flex;align-items:center;gap:.8em}
.verdict .seal{width:3.2em;height:3.2em;border-radius:50%;display:grid;place-items:center;flex:none;border:.15em solid #7FC8A0;color:#7FC8A0;font-size:.95em;font-weight:700;background:rgba(127,200,160,.08)}
.verdict b{display:block;font-size:1.15em;color:#F1ECE2}
.verdict small{font-size:.74em;color:#8D98A8}
.vh{margin-top:.8em;display:flex;flex-direction:column;gap:.45em;font-size:.76em}
.vh div{display:grid;grid-template-columns:1.8em 1fr auto;align-items:center;gap:.5em;padding:.5em .6em;white-space:nowrap;border-radius:.4em;background:rgba(10,19,34,.35)}
.vh div:first-child{background:rgba(127,200,160,.08);box-shadow:inset .2em 0 0 #7FC8A0}
.vh em{font-style:normal;font-family:var(--mono);color:#C3CAD4}
.vh span{color:#C3CAD4}
.vh small{font-size:.9em}
.ts-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.8em;margin-bottom:.8em}
.ts-stats .ui-card{padding:.7em 1em}
.ts-stats b{display:block;font-size:1.45em;color:#F1ECE2;margin-top:.15em}
.ts-stats .ts-k{margin:0}
.auth-tbl{width:100%;border-collapse:collapse;font-size:.76em}
.auth-tbl th{text-align:left;font-family:var(--mono);font-weight:400;font-size:.8em;letter-spacing:.12em;text-transform:uppercase;color:#7F8B9C;padding:0 .4em .7em;border-bottom:.08em solid rgba(233,228,216,.08)}
.auth-tbl td{padding:.55em .4em;border-bottom:.08em solid rgba(233,228,216,.05);color:#D5DAE1;white-space:nowrap}
.auth-tbl td:first-child{color:#F1ECE2}
.badge{display:inline-block;padding:.2em .6em;border-radius:99em;font-size:.88em;background:rgba(127,200,160,.12);color:#7FC8A0}
.badge.warn{background:rgba(229,184,104,.13);color:#E5B868}

.stage-note{max-width:1240px;margin:clamp(20px,3vw,36px) auto 0;padding:0 0 clamp(36px,6vw,64px);text-align:center;font-size:.85rem;color:#8A8F98;letter-spacing:.01em}
.stage-note b{color:#B9BEC6;font-weight:500}

/* intro below the composition */
.intro{background:#050506;padding:clamp(48px,8vw,96px) 16px clamp(56px,8vw,104px);border-top:1px solid rgba(255,255,255,.05)}
.intro-in{max-width:880px;margin:0 auto;text-align:center}
.intro h2{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.08;color:#F2EEE6;margin:0 0 20px;letter-spacing:-.005em}
.intro p{font-size:clamp(1.05rem,1.6vw,1.22rem);line-height:1.6;color:var(--on-dark-2);max-width:36em;margin:0 auto}
.intro .chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:28px 0 36px;padding:0;list-style:none}
.intro .chips li{padding:7px 16px;border-radius:999px;border:1px solid rgba(233,228,216,.14);color:#C9CED6;font-size:.92rem}
.btn-gold{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:8px;text-decoration:none;background:var(--gold);color:#16120A;font-weight:600;font-size:.98rem;letter-spacing:.02em;transition:background .15s}
.btn-gold:hover{background:#D6B06A}
.btn-gold svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.h-foot{background:#050506;border-top:1px solid rgba(255,255,255,.06);padding:28px clamp(16px,4vw,40px) calc(28px + env(safe-area-inset-bottom,0px))}
.h-foot-in{max-width:1280px;margin:0 auto;display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between;font-size:.82rem;color:#7D828B;line-height:1.6}
.h-foot p{margin:0;max-width:62em}
.f-logo{line-height:0;flex-basis:100%}
.f-logo img{display:block;height:22px;width:auto;opacity:.92}
.h-foot a{color:#B9BEC6;text-decoration:none}
.h-foot a:hover{color:var(--gold-soft)}

@media (max-width: 640px){
  .h-nav .brand .logo{height:24px}
  .h-cta{padding:8px 14px;font-size:.86rem}
  .lockup .tag{font-size:.7rem;letter-spacing:.2em}
  .stage-note{padding-left:8px;padding-right:8px;font-size:.8rem}
}
@media (prefers-reduced-motion: no-preference){
  .dev{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
  .laptop{animation-delay:.05s}.tablet{animation-delay:.18s}.phone{animation-delay:.3s}
  .step.live .prog::before{animation:fill 2.6s ease-in-out infinite alternate}
}
@keyframes rise{from{opacity:0;transform:translateY(2.5em)}to{opacity:1;transform:none}}
@keyframes fill{from{width:28%}to{width:86%}}