/* kestano.com — aurora marketplace theme */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --night:#050403;
  --night2:#0a0806;
  --panel:rgba(255,255,255,.045);
  --panelUp:rgba(255,255,255,.08);
  --line:rgba(255,255,255,.10);
  --lineUp:rgba(255,255,255,.18);
  --ink:#f6efe1;
  --mut:#bdb098;
  --dim:#8d8474;
  --ind:#d4af37;
  --vio:#f0d68a;
  --tea:#d9b877;
  --aurora:linear-gradient(100deg,#d4af37,#f0d68a 48%,#d9b877);
  --rBig:28px;
  --rMid:22px;
  --rPill:999px;
  --fontStack:'Plus Jakarta Sans',-apple-system,'Segoe UI',sans-serif;
}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--fontStack);
  background:
    radial-gradient(140% 100% at 50% 30%, transparent 55%, rgba(3,3,2,.5) 100%),
    radial-gradient(1200px 800px at 85% -10%, rgba(212,175,55,.17), transparent 60%),
    radial-gradient(1000px 700px at -15% 25%, rgba(240,214,138,.13), transparent 55%),
    radial-gradient(900px 700px at 110% 62%, rgba(217,184,119,.08), transparent 55%),
    radial-gradient(1000px 640px at 12% 105%, rgba(212,175,55,.11), transparent 60%),
    var(--night2);
  color:var(--ink);
  line-height:1.6;
  overflow-x:hidden;
  min-height:100vh;
}
/* film grain over everything — kills any remaining flatness */
body::after{
  content:"";position:fixed;inset:0;z-index:500;pointer-events:none;
  opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>");
}
::selection{background:rgba(240,214,138,.45);color:#fff}

img,svg,canvas{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
:focus-visible{outline:2px solid var(--tea);outline-offset:3px;border-radius:6px}

.wrap{width:min(1180px,92vw);margin-inline:auto}

.srOnly{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ============ floating pill nav ============ */
.pillNav{
  position:fixed;top:18px;left:50%;transform:translateX(-50%);
  z-index:60;width:min(960px,calc(100vw - 28px));
  border-radius:var(--rPill);
  background:rgba(11,10,7,.62);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid var(--line);
  box-shadow:0 12px 40px rgba(3,2,1,.45);
}
.navInner{display:flex;align-items:center;gap:18px;padding:10px 12px 10px 20px}
.navBrand{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.navBrand svg{height:30px;width:auto}
.navLinks{display:flex;gap:4px;margin-left:auto;align-items:center}
.navLinks a{
  padding:8px 14px;border-radius:var(--rPill);
  font-size:.92rem;font-weight:500;color:var(--mut);
  transition:color .2s,background .2s;
}
.navLinks a:hover{color:var(--ink);background:rgba(255,255,255,.06)}
.navCta{
  flex:0 0 auto;margin-left:6px;
  padding:10px 20px;border-radius:var(--rPill);
  background:var(--aurora);color:#140f03;font-weight:700;font-size:.92rem;
  transition:transform .2s,box-shadow .2s;
  box-shadow:0 4px 18px rgba(212,175,55,.35);
}
.navCta:hover{transform:translateY(-1px);box-shadow:0 8px 26px rgba(212,175,55,.5)}
.navBurger{display:none;margin-left:auto;padding:8px;border-radius:12px}
.navBurger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:transform .25s,opacity .25s}
.navSheet{display:none}

@media (max-width:900px){
  .navLinks{display:none}
  .navCta{display:none}
  .navBurger{display:block}
  .navSheet{
    display:none;flex-direction:column;gap:2px;
    padding:8px 14px 16px;
    border-top:1px solid var(--line);
  }
  .pillNav.isOpen{border-radius:26px}
  .pillNav.isOpen .navSheet{display:flex}
  .pillNav.isOpen .navBurger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .pillNav.isOpen .navBurger span:nth-child(2){opacity:0}
  .pillNav.isOpen .navBurger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .navSheet a{padding:12px 10px;border-radius:14px;font-weight:600;color:var(--mut)}
  .navSheet a:hover{background:rgba(255,255,255,.06);color:var(--ink)}
  .navSheet .sheetCta{
    margin-top:8px;text-align:center;background:var(--aurora);
    color:#140f03;font-weight:700;border-radius:var(--rPill);padding:13px;
  }
}

/* ============ hero ============ */
.hero{
  position:relative;min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  padding:130px 0 90px;overflow:hidden;
  /* CSS light-field under the canvas: the fold glows even before/without JS */
  background:
    radial-gradient(58% 52% at 50% 44%, rgba(184,134,11,.26), transparent 70%),
    radial-gradient(42% 38% at 63% 32%, rgba(240,214,138,.20), transparent 70%),
    radial-gradient(38% 34% at 39% 58%, rgba(217,184,119,.12), transparent 70%);
}
.heroCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.heroCopy{position:relative;z-index:2;text-align:center;width:min(1120px,94vw)}
.heroKicker{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 18px;border-radius:var(--rPill);
  background:rgba(255,255,255,.055);border:1px solid var(--line);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  font-size:.84rem;font-weight:600;color:var(--mut);letter-spacing:.02em;
}
.heroKicker i{width:7px;height:7px;border-radius:50%;background:var(--tea);box-shadow:0 0 10px var(--tea);font-style:normal}
.heroTitle{
  margin:30px 0 24px;
  font-size:clamp(3.4rem,7.5vw,6.5rem);
  font-weight:800;line-height:1.02;letter-spacing:-.045em;
  text-shadow:0 4px 44px rgba(5,4,3,.55);
  text-wrap:balance;
}
.heroTitle em{
  font-style:normal;
  background:linear-gradient(100deg,#e8cf95,#ecd39c);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.heroSub{
  font-size:clamp(1.02rem,1.6vw,1.24rem);
  color:#cfc2a4;max-width:640px;margin:0 auto 38px;font-weight:400;
  line-height:1.7;text-shadow:0 2px 24px rgba(5,4,3,.6);
  text-wrap:pretty;
}
.heroCtas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btnA{
  display:inline-flex;align-items:center;gap:9px;
  padding:16px 32px;border-radius:var(--rPill);
  background:var(--aurora);color:#140f03;font-weight:700;font-size:1.02rem;
  box-shadow:0 6px 28px rgba(212,175,55,.4);
  transition:transform .2s,box-shadow .2s;
}
.btnA:hover{transform:translateY(-2px);box-shadow:0 12px 38px rgba(212,175,55,.55)}
.btnA svg{width:17px;height:17px}
.btnB{
  display:inline-flex;align-items:center;gap:9px;
  padding:16px 32px;border-radius:var(--rPill);
  background:rgba(255,255,255,.05);border:1px solid var(--lineUp);
  color:var(--ink);font-weight:600;font-size:1.02rem;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:background .2s,transform .2s;
}
.btnB:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}

/* floating illustrative UI chips */
.chipCloud{position:absolute;inset:0;z-index:1;pointer-events:none}
.uiChip{
  position:absolute;
  display:flex;align-items:center;gap:10px;
  padding:12px 18px;border-radius:18px;
  background:rgba(15,13,9,.55);
  border:1px solid var(--line);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 14px 44px rgba(3,2,1,.5);
  font-size:.86rem;font-weight:600;white-space:nowrap;
  will-change:transform;
  /* heavy-cloth float: long period, small travel — presence, not restlessness */
  animation:chipDrift 16s cubic-bezier(.45,.05,.55,.95) infinite alternate;
}
.uiChip small{display:block;font-size:.72rem;font-weight:500;color:var(--dim);white-space:nowrap}
.uiChip .chipIco{
  width:32px;height:32px;border-radius:11px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
}
.uiChip .chipIco svg{width:16px;height:16px}
.icoTeal{background:rgba(217,184,119,.16);color:var(--tea)}
.icoVio{background:rgba(240,214,138,.18);color:#f0d68a}
.icoInd{background:rgba(212,175,55,.18);color:#dcbb5e}
.chipOne{top:21%;left:6%;animation-delay:0s}
.chipTwo{top:16%;right:7%;animation-delay:-5s}
.chipThree{bottom:23%;left:9%;animation-delay:-9.5s}
.chipFour{bottom:19%;right:6%;animation-delay:-3.2s}
@keyframes chipDrift{
  from{margin-top:0}
  to{margin-top:-9px}
}
@media (max-width:900px){
  .chipOne,.chipThree{left:-6px}
  .chipTwo,.chipFour{right:-6px}
  .uiChip{transform:scale(.82);font-size:.8rem}
  .chipOne{top:12%}.chipTwo{top:auto;bottom:34%}
  .chipThree{bottom:10%}.chipFour{bottom:4%}
}
@media (max-width:600px){
  .chipTwo,.chipThree{display:none}
  .chipOne{top:10%}.chipFour{bottom:5%}
}

.heroHint{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);
  z-index:2;color:var(--dim);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px;
}
.heroHint::after{
  content:"";width:1px;height:34px;
  background:linear-gradient(var(--dim),transparent);
  animation:hintPulse 3.8s ease-in-out infinite;
}
@keyframes hintPulse{0%,100%{opacity:.35}50%{opacity:.9}}

/* ============ count strip ============ */
.countStrip{
  position:relative;z-index:3;
  margin-top:-46px;
}
.countStrip .wrap{
  display:grid;grid-template-columns:repeat(5,1fr);
  border-radius:var(--rBig);
  background:rgba(14,12,8,.7);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid var(--line);
  box-shadow:0 24px 60px rgba(3,2,1,.5);
  overflow:hidden;
}
.countItem{
  padding:32px 20px;text-align:center;
  border-left:1px solid var(--line);
}
.countItem:first-child{border-left:none}
.countNum{
  font-size:clamp(1.7rem,3vw,2.5rem);font-weight:800;letter-spacing:-.03em;
  background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.countLbl{font-size:.85rem;color:var(--mut);margin-top:4px;font-weight:500}
@media (max-width:768px){
  .countStrip .wrap{grid-template-columns:1fr 1fr}
  .countItem:nth-child(odd){border-left:none}
  .countItem{border-top:1px solid var(--line);padding:24px 12px}
  .countItem:nth-child(-n+2){border-top:none}
  .countItem:last-child{grid-column:span 2}
}

/* ============ shared section chrome ============ */
.blockPad{padding:110px 0;position:relative}
/* per-section atmosphere — no section sits on a flat field */
#products{background:
  radial-gradient(900px 520px at 88% 6%, rgba(212,175,55,.12), transparent 60%),
  radial-gradient(760px 480px at 2% 92%, rgba(217,184,119,.08), transparent 60%)}
#how{background:
  radial-gradient(1050px 540px at 50% -6%, rgba(240,214,138,.13), transparent 65%),
  radial-gradient(700px 420px at 8% 100%, rgba(212,175,55,.08), transparent 60%)}
#industries{background:
  radial-gradient(900px 540px at 8% 10%, rgba(212,175,55,.11), transparent 60%),
  radial-gradient(820px 500px at 96% 88%, rgba(240,214,138,.10), transparent 60%)}
#faq{background:
  radial-gradient(820px 500px at 50% 12%, rgba(217,184,119,.07), transparent 60%),
  radial-gradient(720px 440px at 88% 94%, rgba(212,175,55,.09), transparent 60%)}
.blockHead{max-width:640px;margin-bottom:56px}
.blockHead.isCenter{margin-inline:auto;text-align:center}
.blockTag{
  display:inline-block;padding:6px 16px;border-radius:var(--rPill);
  font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--tea);background:rgba(217,184,119,.09);border:1px solid rgba(217,184,119,.22);
  margin-bottom:18px;
}
.blockTitle{
  font-size:clamp(1.8rem,3.6vw,2.7rem);
  font-weight:800;letter-spacing:-.03em;line-height:1.12;
  text-wrap:balance;
}
.blockSub{color:var(--mut);margin-top:14px;font-size:1.04rem;line-height:1.65;text-wrap:pretty}

/* ============ bento products ============ */
.bento{
  display:grid;gap:18px;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:minmax(190px,auto);
}
.bentoCard{
  position:relative;border-radius:var(--rMid);
  background:var(--panel);
  padding:28px 26px;
  display:flex;flex-direction:column;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background .3s;
  overflow:hidden;
}
.bentoCard::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(150deg,rgba(255,255,255,.22),rgba(255,255,255,.04) 38%,rgba(212,175,55,.16) 78%,rgba(217,184,119,.22));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;
}
.bentoCard:hover{
  transform:translateY(-6px);
  background:var(--panelUp);
  box-shadow:0 22px 50px rgba(3,2,1,.55),0 0 0 1px rgba(240,214,138,.14),0 0 60px -18px rgba(240,214,138,.5);
}
.spanTwo{grid-column:span 2}
.spanRows{grid-row:span 2}
.cardGlyph{
  width:46px;height:46px;border-radius:15px;margin-bottom:auto;
  display:flex;align-items:center;justify-content:center;
  background:rgba(212,175,55,.13);
}
.cardGlyph svg{width:22px;height:22px;stroke:#e0c070}
.bentoCard:nth-child(3n) .cardGlyph{background:rgba(240,214,138,.14)}
.bentoCard:nth-child(3n) .cardGlyph svg{stroke:#f0d68a}
.bentoCard:nth-child(3n+2) .cardGlyph{background:rgba(217,184,119,.11)}
.bentoCard:nth-child(3n+2) .cardGlyph svg{stroke:#d9b74a}
.cardName{font-size:1.18rem;font-weight:700;letter-spacing:-.015em;margin:20px 0 8px}
.cardDesc{font-size:.92rem;color:var(--mut);line-height:1.55}
.cardMeta{
  display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;
}
.cardMeta span{
  font-size:.76rem;font-weight:700;padding:6px 12px;border-radius:var(--rPill);
  background:rgba(255,255,255,.06);border:1px solid var(--line);color:#ece0c4;
}
.cardMeta .metaHot{background:rgba(217,184,119,.1);border-color:rgba(217,184,119,.28);color:var(--tea)}
.bentoBig{
  background:
    radial-gradient(120% 130% at 10% 0%,rgba(212,175,55,.22),transparent 55%),
    radial-gradient(120% 130% at 95% 100%,rgba(217,184,119,.14),transparent 55%),
    var(--panel);
}
.bentoBig .cardName{font-size:1.5rem}
@media (max-width:1024px){
  .bento{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .bento{grid-template-columns:1fr}
  .spanTwo{grid-column:span 1}
  .spanRows{grid-row:span 1}
}

/* ============ how it works ============ */
.flowRow{
  display:grid;grid-template-columns:repeat(6,1fr);gap:16px;
  position:relative;counter-reset:step;
}
.flowRow::before{
  content:"";position:absolute;top:33px;left:12%;right:12%;height:2px;
  background:linear-gradient(90deg,rgba(212,175,55,.7),rgba(240,214,138,.7),rgba(217,184,119,.7));
  opacity:.4;
}
.flowStep{position:relative;text-align:center;padding:0 10px}
.flowDot{
  counter-increment:step;
  width:66px;height:66px;margin:0 auto 22px;border-radius:22px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(14,12,8,.9);
  border:1px solid var(--lineUp);
  font-weight:800;font-size:1.25rem;position:relative;z-index:1;
  box-shadow:0 10px 30px rgba(3,2,1,.5);
}
.flowStep h3{font-size:1.08rem;font-weight:700;margin-bottom:8px;letter-spacing:-.01em}
.flowStep p{font-size:.9rem;color:var(--mut)}
@media (max-width:1100px){
  .flowRow{grid-template-columns:repeat(3,1fr);row-gap:36px}
  .flowRow::before{display:none}
}
@media (max-width:900px){
  .flowRow{grid-template-columns:1fr;gap:36px;max-width:420px;margin-inline:auto}
  .flowRow::before{display:block;left:50%;right:auto;top:8%;bottom:8%;width:2px;height:auto;
    background:linear-gradient(rgba(212,175,55,.7),rgba(240,214,138,.7),rgba(217,184,119,.7))}
}

/* ============ match explainer band ============ */
.matchBand{
  position:relative;border-radius:var(--rBig);overflow:hidden;
  background:
    radial-gradient(900px 420px at 15% 0%,rgba(212,175,55,.3),transparent 60%),
    radial-gradient(700px 420px at 90% 110%,rgba(217,184,119,.22),transparent 55%),
    radial-gradient(600px 400px at 60% 40%,rgba(240,214,138,.2),transparent 60%),
    #110e09;
  border:1px solid var(--lineUp);
  padding:clamp(40px,6vw,76px);
  display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,70px);align-items:center;
}
.matchBand h2{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:800;letter-spacing:-.028em;line-height:1.14;margin-bottom:18px}
.matchBand>div>p{color:#ddd0b4;font-size:1.02rem;margin-bottom:14px}
.matchList{list-style:none;margin-top:22px;display:grid;gap:12px}
.matchList li{
  display:flex;gap:12px;align-items:flex-start;
  font-size:.95rem;color:#e8dcc2;
}
.matchList svg{width:20px;height:20px;flex:0 0 auto;margin-top:2px;stroke:var(--tea)}
.matchDemo{
  border-radius:var(--rMid);
  background:rgba(8,7,4,.66);
  border:1px solid var(--line);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding:22px;display:grid;gap:12px;
}
.demoHead{font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;align-items:center}
.demoHead b{color:var(--tea);font-weight:700;letter-spacing:0;text-transform:none}
.demoRow{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:14px 16px;border-radius:16px;
  background:rgba(255,255,255,.045);border:1px solid var(--line);
  font-size:.9rem;font-weight:600;
}
.demoRow small{display:block;font-weight:500;color:var(--dim);font-size:.76rem}
.demoRow .rowBadge{
  font-size:.72rem;font-weight:700;padding:5px 11px;border-radius:var(--rPill);
  background:rgba(217,184,119,.12);color:var(--tea);border:1px solid rgba(217,184,119,.3);
  white-space:nowrap;
}
.demoRow.isDim{opacity:.45}
.demoRow.isDim .rowBadge{background:rgba(255,255,255,.06);color:var(--dim);border-color:var(--line)}
.demoFoot{font-size:.74rem;color:var(--dim);text-align:center}
@media (max-width:900px){
  .matchBand{grid-template-columns:1fr}
}

/* ============ industries ============ */
.indGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.indGrid.svcGrid{grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.indGrid.svcGrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.indGrid.svcGrid{grid-template-columns:1fr}}
.indCard{
  border-radius:var(--rMid);padding:24px 22px;
  background:var(--panel);border:1px solid var(--line);
  transition:transform .25s,border-color .25s,background .25s;
}
.indCard:hover{transform:translateY(-4px);border-color:rgba(240,214,138,.35);background:var(--panelUp)}
.indCard h3{font-size:1rem;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:10px}
.indCard h3 svg{width:19px;height:19px;stroke:#e6c97e;flex:0 0 auto}
.indCard p{font-size:.85rem;color:var(--mut);line-height:1.5}
@media (max-width:1024px){.indGrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.indGrid{grid-template-columns:1fr}}

/* ============ FAQ ============ */
.faqList{max-width:780px;margin-inline:auto;display:grid;gap:12px}
.faqItem{
  border-radius:var(--rMid);
  background:var(--panel);border:1px solid var(--line);
  overflow:hidden;transition:border-color .25s,background .25s;
}
.faqItem[open]{border-color:rgba(212,175,55,.4);background:var(--panelUp)}
.faqItem summary{
  list-style:none;cursor:pointer;
  padding:20px 24px;
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  font-weight:700;font-size:1rem;letter-spacing:-.01em;
}
.faqItem summary::-webkit-details-marker{display:none}
.faqItem summary::after{
  content:"";width:11px;height:11px;flex:0 0 auto;
  border-right:2px solid var(--tea);border-bottom:2px solid var(--tea);
  transform:rotate(45deg);transition:transform .25s;margin-right:4px;
}
.faqItem[open] summary::after{transform:rotate(225deg)}
.faqItem div{padding:0 24px 22px;color:var(--mut);font-size:.94rem;line-height:1.65}

/* ============ CTA band ============ */
.ctaBand{
  text-align:center;border-radius:var(--rBig);
  padding:clamp(50px,8vw,90px) clamp(24px,5vw,60px);
  background:
    radial-gradient(700px 380px at 50% -20%,rgba(240,214,138,.34),transparent 65%),
    radial-gradient(500px 320px at 12% 110%,rgba(212,175,55,.25),transparent 60%),
    radial-gradient(500px 320px at 88% 110%,rgba(217,184,119,.2),transparent 60%),
    #100d08;
  border:1px solid var(--lineUp);
  position:relative;overflow:hidden;
}
.ctaBand h2{font-size:clamp(1.9rem,4vw,3rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin-bottom:16px}
.ctaBand p{color:#ded1b3;max-width:540px;margin:0 auto 32px;font-size:1.05rem}
.ctaBand .heroCtas{margin-bottom:18px}
.ctaBand .bandNote{font-size:.84rem;color:var(--dim)}
.ctaBand .bandNote a{color:var(--tea);font-weight:600}

/* ============ footer ============ */
.siteFoot{
  border-top:1px solid var(--line);
  margin-top:110px;padding:64px 0 40px;
  background:
    radial-gradient(920px 420px at 50% 0%, rgba(212,175,55,.09), transparent 60%),
    radial-gradient(700px 380px at 92% 100%, rgba(240,214,138,.07), transparent 60%),
    rgba(6,5,4,.5);
}
.footGrid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px;margin-bottom:44px;
}
.footBrand svg{height:30px;width:auto;margin-bottom:14px}
.footBrand p{font-size:.9rem;color:var(--mut);max-width:280px}
.footCol h3{font-size:.78rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--dim);margin-bottom:16px}
.footCol ul{list-style:none;display:grid;gap:9px}
.footCol a{font-size:.9rem;color:var(--mut);transition:color .2s}
.footCol a:hover{color:var(--tea)}
.footCol address{font-style:normal;font-size:.9rem;color:var(--mut);display:grid;gap:9px}
.footCol address a{color:var(--mut)}
.footDisc{
  border-top:1px solid var(--line);padding-top:26px;
  font-size:.8rem;color:var(--dim);line-height:1.7;
}
.footDisc strong{color:#d2c5a6}
.footBase{
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-top:22px;font-size:.8rem;color:var(--dim);
}
.footBase a{color:var(--dim)}
.footBase a:hover{color:var(--tea)}
@media (max-width:900px){.footGrid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footGrid{grid-template-columns:1fr}}

/* ============ reveal on scroll ============ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ============ inner pages ============ */
.pageTop{
  padding:170px 0 40px;text-align:center;
  background:radial-gradient(56% 70% at 50% 28%, rgba(184,134,11,.17), transparent 70%);
}
.pageTop h1{font-size:clamp(2rem,4.5vw,3.1rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin-bottom:14px}
.pageTop h1 em{font-style:normal;background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent}
.pageTop p{color:var(--mut);max-width:560px;margin:0 auto;font-size:1.04rem}

.docBody{
  max-width:760px;margin:30px auto 110px;
  border-radius:var(--rBig);border:1px solid var(--line);
  background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:clamp(28px,5vw,56px);
}
.docBody h2{font-size:1.25rem;font-weight:700;letter-spacing:-.015em;margin:34px 0 12px}
.docBody h2:first-child{margin-top:0}
.docBody p,.docBody li{color:var(--mut);font-size:.96rem;line-height:1.75}
.docBody ul{padding-left:22px;margin:10px 0}
.docBody a{color:var(--tea);font-weight:600}
.docBody .docMeta{font-size:.8rem;color:var(--dim);margin-bottom:26px}

/* ============ apply form ============ */
.applyGrid{
  display:grid;grid-template-columns:1fr 1.15fr;gap:44px;
  align-items:start;margin:24px 0 110px;
}
.applyAside{position:sticky;top:110px;display:grid;gap:16px}
.asideCard{
  border-radius:var(--rMid);padding:24px;
  background:var(--panel);border:1px solid var(--line);
}
.asideCard h3{font-size:1rem;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:10px}
.asideCard h3 svg{width:19px;height:19px;stroke:var(--tea)}
.asideCard p{font-size:.88rem;color:var(--mut)}
.asideSteps{list-style:none;display:grid;gap:14px;counter-reset:mini}
.asideSteps li{
  counter-increment:mini;display:flex;gap:14px;align-items:flex-start;
  font-size:.9rem;color:var(--mut);
}
.asideSteps li::before{
  content:counter(mini);flex:0 0 auto;
  width:28px;height:28px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(212,175,55,.16);color:#ddbc62;font-weight:700;font-size:.82rem;
}
.asideSteps b{color:var(--ink);display:block;font-size:.92rem}

.formCard{
  border-radius:var(--rBig);
  background:rgba(14,12,8,.72);
  border:1px solid var(--lineUp);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  padding:clamp(26px,4vw,42px);
  box-shadow:0 30px 70px rgba(3,2,1,.5);
}
.fRow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fField{margin-bottom:18px}
.fField label{
  display:block;font-size:.84rem;font-weight:600;color:#e0d4b8;margin-bottom:7px;
}
.fField input,.fField select,.fField textarea{
  width:100%;padding:14px 16px;
  border-radius:16px;border:1px solid var(--lineUp);
  background:rgba(5,4,3,.6);color:var(--ink);
  font:inherit;font-size:.95rem;
  transition:border-color .2s,box-shadow .2s;
  appearance:none;-webkit-appearance:none;
}
.fField select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238383ad' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;
  padding-right:40px;
}
.fField textarea{min-height:110px;resize:vertical}
.fField input:focus,.fField select:focus,.fField textarea:focus{
  outline:none;border-color:var(--vio);
  box-shadow:0 0 0 3px rgba(240,214,138,.22);
}
.fField.hasErr input,.fField.hasErr select{border-color:#ff7d9c;box-shadow:0 0 0 3px rgba(255,125,156,.15)}
.fErr{display:none;font-size:.8rem;color:#ff9db5;margin-top:6px}
.fField.hasErr .fErr{display:block}
.formCard .btnA{width:100%;justify-content:center;margin-top:8px}
.formFine{font-size:.78rem;color:var(--dim);text-align:center;margin-top:16px;line-height:1.6}
.formFine a{color:var(--tea)}
.hpTrap{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.okState{
  display:none;text-align:center;padding:40px 10px;
}
.okState.isOn{display:block}
.okState .okRing{
  width:74px;height:74px;margin:0 auto 24px;border-radius:26px;
  background:rgba(217,184,119,.12);border:1px solid rgba(217,184,119,.4);
  display:flex;align-items:center;justify-content:center;
}
.okState .okRing svg{width:34px;height:34px;stroke:var(--tea)}
.okState h2{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;margin-bottom:10px}
.okState p{color:var(--mut);max-width:380px;margin:0 auto;font-size:.95rem}
@media (max-width:900px){
  .applyGrid{grid-template-columns:1fr}
  .applyAside{position:static;order:2}
  .fRow{grid-template-columns:1fr}
}

/* ============ 404 ============ */
.lostWrap{
  min-height:100svh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:120px 20px 80px;position:relative;overflow:hidden;
}
.lostCode{
  font-size:clamp(6rem,20vw,12rem);font-weight:800;letter-spacing:-.05em;line-height:1;
  background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 44px rgba(240,214,138,.35));
}
.lostWrap h1{font-size:clamp(1.4rem,3vw,2rem);font-weight:700;margin:14px 0 10px;letter-spacing:-.02em}
.lostWrap>p{color:var(--mut);max-width:420px;margin-bottom:30px}

/* ============ inline lucide icons ============ */
.lci{display:block;width:20px;height:20px;stroke-width:2;flex:0 0 auto}
.countItem .lci{width:18px;height:18px;margin:0 auto 10px;color:var(--tea)}
.flowDot .lci{width:26px;height:26px}
.flowStep:nth-child(-n+2) .flowDot{color:#dcbb5e}
.flowStep:nth-child(n+3) .flowDot{color:#f0d68a}
.flowStep:nth-child(n+5) .flowDot{color:#d9b74a}

/* ============ brand photography — indigo duotone + aurora accent ============ */
/* Photos are grayscaled, re-hued with the aurora gradient, then scrimmed into
   the night background so imagery sits inside the brand, never on top of it. */
.photoBand{
  position:relative;isolation:isolate;overflow:hidden;
  height:clamp(230px,36vw,430px);
  border-block:1px solid var(--line);
}
.photoBand img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) brightness(.8) contrast(1.06);
}
.photoBand::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(115deg,#d4af37,#f0d68a 52%,#d9b877 130%);
  mix-blend-mode:color;
}
.photoBand::after{
  content:"";position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(180deg,var(--night2) 0%,rgba(11,10,7,.22) 26%,rgba(11,10,7,.3) 72%,var(--night2) 100%),
    radial-gradient(120% 140% at 50% 50%,rgba(8,7,5,.05),rgba(8,7,5,.52));
}

/* product-section accent: photo lives inside the big working-capital card */
.cardPhoto{
  position:absolute;inset:0;left:34%;margin:0;z-index:0;
  isolation:isolate;pointer-events:none;
}
.cardPhoto img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) brightness(.72) contrast(1.08);
}
.cardPhoto::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(115deg,#d4af37,#f0d68a 55%,#d9b877 125%);
  mix-blend-mode:color;
}
.cardPhoto::after{
  content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(90deg,#0f0c07 0%,rgba(16,13,8,.94) 18%,rgba(16,13,8,.55) 58%,rgba(16,13,8,.24) 100%);
}
.bentoCard::before{z-index:3}
.bentoBig>.cardGlyph,.bentoBig>.cardName,.bentoBig>.cardDesc,.bentoBig>.cardMeta{position:relative;z-index:1}
.bentoBig .cardDesc{max-width:48ch}
@media (max-width:600px){
  .cardPhoto{left:24%}
  .cardPhoto::after{background:linear-gradient(90deg,#0f0c07 0%,rgba(16,13,8,.95) 32%,rgba(16,13,8,.74) 70%,rgba(16,13,8,.48) 100%)}
  .photoBand{height:clamp(200px,52vw,300px)}
}

/* ============ motion prefs ============ */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .reveal{opacity:1;transform:none}
  .uiChip{animation:none}
}

/* ============ bento mosaic v5 — varied card sizes, no two adjacent equal ============ */
.mosaic{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.mosaic .indCard{display:flex;flex-direction:column}
.mzW{grid-column:span 4}
.mzN{grid-column:span 2}
.mzH{grid-column:span 3}
.mzTall{grid-column:span 3;grid-row:span 2}
.mzW,.mzTall{padding:30px 28px}
.mzW h3,.mzTall h3{font-size:1.12rem}
.mzW p,.mzTall p{max-width:52ch}
.mzTall{
  justify-content:space-between;gap:18px;
  background:
    radial-gradient(120% 120% at 12% 0%,rgba(212,175,55,.18),transparent 55%),
    radial-gradient(110% 120% at 95% 100%,rgba(217,184,119,.1),transparent 55%),
    var(--panel);
}
.mzTall .mzFoot{font-size:.8rem;color:var(--dim);border-top:1px solid var(--line);padding-top:14px}
@media (max-width:900px){
  .mosaic{grid-template-columns:1fr 1fr}
  .mzW,.mzN,.mzH{grid-column:span 1}
  .mzTall{grid-column:span 2;grid-row:auto}
}
@media (max-width:560px){
  .mosaic{grid-template-columns:1fr}
  .mzW,.mzN,.mzH,.mzTall{grid-column:span 1}
}

/* ============ application desk v5 — five steps ============ */
.stepMeta{margin-bottom:22px}
.stepHead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
#stepLabel{font-size:.86rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.stepBar{height:4px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
#stepFill{height:100%;width:20%;border-radius:999px;background:var(--aurora);transition:width .45s cubic-bezier(.2,.8,.2,1)}
.step{display:none}
.step.isOn{display:block;animation:stepIn .45s cubic-bezier(.2,.8,.2,1)}
@keyframes stepIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.stepTitle{
  font-size:1.35rem;font-weight:800;letter-spacing:-.02em;margin-bottom:6px;outline:none;
}
.stepNote{font-size:.9rem;color:var(--mut);margin-bottom:24px;line-height:1.6}
.fHint{font-size:.78rem;color:var(--dim);margin-top:6px;line-height:1.5}
.checkInline{
  display:flex;align-items:center;gap:10px;margin-top:10px;
  font-size:.86rem;font-weight:500;color:var(--mut);cursor:pointer;
}
.checkInline input{width:17px;height:17px;accent-color:var(--vio);cursor:pointer}

/* segmented yes/no */
.segField{margin-bottom:18px}
.segField>label{display:block;font-size:.84rem;font-weight:600;color:#e0d4b8;margin-bottom:8px}
.seg{display:inline-flex;gap:8px}
.seg label{cursor:pointer}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:86px;padding:11px 22px;border-radius:var(--rPill);
  background:rgba(5,4,3,.6);border:1px solid var(--lineUp);
  font-size:.9rem;font-weight:600;color:var(--mut);
  transition:border-color .2s,background .2s,color .2s;
}
.seg input:checked+span{
  background:rgba(212,175,55,.16);border-color:rgba(240,214,138,.55);color:var(--ink);
  box-shadow:0 0 0 3px rgba(240,214,138,.14);
}
.seg input:focus-visible+span{outline:2px solid var(--tea);outline-offset:2px}
.segField.hasErr .seg span{border-color:#ff7d9c}
.segField .fErr{display:none;font-size:.8rem;color:#ff9db5;margin-top:6px}
.segField.hasErr .fErr{display:block}

/* dropzones */
.dropZone{
  border:1.5px dashed var(--lineUp);border-radius:18px;
  padding:28px 20px;text-align:center;cursor:pointer;
  background:rgba(5,4,3,.35);
  transition:border-color .2s,background .2s;
}
.dropZone:hover,.dropZone.isOver{border-color:var(--vio);background:rgba(212,175,55,.08)}
.dropZone p{font-size:.92rem;color:var(--ink);font-weight:600}
.dropZone p b{color:var(--tea)}
.dropZone small{display:block;margin-top:6px;font-size:.76rem;color:var(--dim)}
.fileChips{list-style:none;display:grid;gap:8px;margin-top:12px}
.fileChips li{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;border-radius:14px;
  background:rgba(255,255,255,.05);border:1px solid var(--line);
  font-size:.84rem;
}
.fileChips .fcName{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fileChips .fcSize{color:var(--dim);flex:0 0 auto;margin-left:auto}
.fileChips button{
  flex:0 0 auto;width:26px;height:26px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.07);color:var(--mut);font-size:1rem;line-height:1;
  transition:background .2s,color .2s;
}
.fileChips button:hover{background:rgba(255,125,156,.18);color:#ff9db5}
.docNote{min-height:1.2em;font-size:.8rem;color:#ffc7a1;margin-top:10px}

/* signature */
.sigWrap{
  border:1px solid var(--lineUp);border-radius:18px;overflow:hidden;
  background:rgba(5,4,3,.6);position:relative;
  transition:border-color .2s,box-shadow .2s;
}
.sigWrap::after{
  content:"";position:absolute;left:24px;right:24px;bottom:30px;height:1px;
  background:rgba(255,255,255,.18);pointer-events:none;
}
.sigWrap.isSigned{border-color:rgba(217,184,119,.5)}
.sigWrap.hasErr{border-color:#ff7d9c;box-shadow:0 0 0 3px rgba(255,125,156,.15)}
.sigWrap canvas{width:100%;height:170px;display:block;touch-action:none;cursor:crosshair}
.sigRow{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.sigRow small{font-size:.78rem;color:var(--dim)}
.sigClear{
  padding:8px 18px;border-radius:var(--rPill);font-size:.82rem;font-weight:600;
  background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--mut);
  transition:background .2s,color .2s;
}
.sigClear:hover{background:rgba(255,255,255,.11);color:var(--ink)}

/* consent */
.consentRow{
  display:flex;gap:12px;align-items:flex-start;
  padding:16px;border-radius:16px;margin-bottom:18px;
  background:rgba(255,255,255,.04);border:1px solid var(--line);
  font-size:.88rem;color:#e2d6ba;line-height:1.55;cursor:pointer;
}
.consentRow input{width:18px;height:18px;margin-top:2px;flex:0 0 auto;accent-color:var(--tea);cursor:pointer}
.consentErr{font-size:.8rem;color:#ff9db5;margin:-8px 0 16px}

/* review read-back */
.reviewList{
  display:grid;gap:0;margin-bottom:24px;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;
  background:rgba(5,4,3,.4);
}
.reviewList>div{
  display:grid;grid-template-columns:180px 1fr;gap:14px;
  padding:11px 18px;border-top:1px solid rgba(255,255,255,.06);
  font-size:.86rem;
}
.reviewList>div:first-child{border-top:none}
.reviewList dt{color:var(--dim);font-weight:600}
.reviewList dd{color:var(--ink);overflow-wrap:anywhere}
@media (max-width:560px){.reviewList>div{grid-template-columns:1fr;gap:2px}}

/* nav + failure */
.appNav{display:flex;gap:12px;margin-top:26px}
.appNav .btnNext{flex:1;justify-content:center}
.btnBack{
  display:inline-flex;align-items:center;gap:8px;
  padding:16px 26px;border-radius:var(--rPill);
  background:rgba(255,255,255,.05);border:1px solid var(--lineUp);
  color:var(--mut);font-weight:600;font-size:.98rem;
  transition:background .2s,color .2s;
}
.btnBack:hover{background:rgba(255,255,255,.1);color:var(--ink)}
.appFail{
  display:none;margin-top:16px;padding:14px 18px;border-radius:16px;
  background:rgba(255,125,156,.08);border:1px solid rgba(255,125,156,.3);
  font-size:.88rem;color:#ffb9cb;
}
.appFail.isOn{display:block}

/* ============ motion layer v6 ============
   Scroll choreography. Every animated state is opt-in via .mo-on (set by
   motion.js) so that with JS disabled, or under prefers-reduced-motion,
   content renders in its final visible state and nothing is ever trapped
   in a hidden start position. */

/* word-mask type reveal */
.mo-on .moWord{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}
.mo-on .moWordIn{
  display:inline-block;transform:translateY(115%);
  transition:transform .95s cubic-bezier(.16,1,.3,1);
}
.mo-on .moIn .moWordIn{transform:none}

/* clip-path wipe for media + panels */
.mo-on .moWipe{
  clip-path:inset(0 100% 0 0);
  transition:clip-path 1.15s cubic-bezier(.16,1,.3,1);
}
.mo-on .moWipe.moIn{clip-path:inset(0 0 0 0)}

/* rise + fade for grids */
.mo-on .moRise{
  opacity:0;transform:translateY(30px);
  transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1);
}
.mo-on .moRise.moIn{opacity:1;transform:none}

/* scroll progress — hairline, champagne, sits above the pill nav */
.moBar{position:fixed;top:0;left:0;right:0;height:2px;z-index:80;pointer-events:none;background:rgba(255,255,255,.05)}
.moBar i{
  display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,#d4af37,#e6cd94);
  transition:transform .12s linear;
}

/* magnetic controls + card tilt */
.mo-on .moMag{transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .25s}
.mo-on .moTilt{
  transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .3s,background .3s;
  transform-style:preserve-3d;
}
/* pointer-tracked sheen — the card knows where the cursor is */
.mo-on .moTilt::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:4;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(230,205,150,.10),transparent 60%);
  opacity:0;transition:opacity .35s;
}
.mo-on .moTilt:hover::after{opacity:1}

@media (prefers-reduced-motion: reduce){
  .moBar{display:none}
  .mo-on .moWordIn,.mo-on .moRise{transform:none;opacity:1}
  .mo-on .moWipe{clip-path:none}
}

/* ============ v7 hero copy scrim ============
   The liquid-chrome hero is deliberately bright, so the copy needs its own
   contrast floor. Scrimming inside .heroCopy (rather than dimming the shader)
   keeps the metal luminous everywhere except directly behind the type. */
.heroCopy{isolation:isolate}
.heroCopy::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  inset:-10% -14%;
  background:
    radial-gradient(58% 52% at 50% 48%, rgba(4,4,3,.55), rgba(4,4,3,.34) 46%, rgba(4,4,3,0) 78%);
}
/* the gradient wordmark line needs a touch more separation than plain text */
.heroTitle em{text-shadow:0 2px 30px rgba(4,6,16,.85)}
.heroSub{text-shadow:0 2px 18px rgba(4,6,16,.9),0 0 40px rgba(4,6,16,.7)}

/* ============ secure application link ============ */
.secPanel{
  border-radius:var(--rMid);
  border:1px solid rgba(217,184,119,.22);
  background:rgba(217,184,119,.05);
  padding:18px 20px;margin-bottom:24px;
}
.secPanel h2{
  font-size:.95rem;font-weight:700;letter-spacing:-.01em;color:var(--ink);
  display:flex;align-items:center;gap:9px;margin:0 0 10px;
}
.secPanel h2 svg{width:17px;height:17px;flex:0 0 auto;stroke:var(--tea)}
.secPanelList{list-style:none;display:grid;gap:7px;margin:0;padding:0}
/* NB: not display:flex — a flex li turns every text run and the inline
   <a> into separate flex items, which scrambles the sentence. Keep the
   li in normal inline flow and float the bullet out of it. */
.secPanelList li{
  font-size:.82rem;color:var(--mut);line-height:1.55;
  position:relative;padding-left:16px;
}
.secPanelList li::before{
  content:"";position:absolute;left:0;top:8px;
  width:4px;height:4px;border-radius:50%;background:var(--tea);opacity:.75;
}
.secPanelList a{color:var(--tea);font-weight:600}
.secFor{
  margin:13px 0 0;padding-top:12px;
  border-top:1px solid rgba(217,184,119,.16);
  font-size:.82rem;color:var(--mut);line-height:1.55;
}
.secFor b{color:var(--ink);font-weight:700}

.resumeNote{
  display:flex;gap:12px;align-items:flex-start;
  padding:13px 16px;border-radius:16px;margin-bottom:22px;
  background:rgba(255,255,255,.05);border:1px solid var(--line);
  font-size:.83rem;color:var(--mut);line-height:1.55;
}
.resumeNote p{margin:0;flex:1}
.resumeNote .resumeClear{
  background:none;border:0;padding:0;font:inherit;
  color:var(--tea);font-weight:600;cursor:pointer;
  text-decoration:underline;text-underline-offset:2px;
}
.resumeNote .resumeX{
  flex:0 0 auto;background:none;border:0;cursor:pointer;
  color:var(--dim);font-size:1.15rem;line-height:1;padding:0 2px;
  transition:color .2s;
}
.resumeNote .resumeX:hover{color:var(--ink)}

.consentRow .consentText{flex:1}
.consentRow .consentText label{cursor:pointer;margin:0}
.consentRow a{color:var(--tea);font-weight:600}
.consentRow.hasErr{border-color:rgba(255,125,156,.45);background:rgba(255,125,156,.06)}