/* =========================================================
   /launch — new service line landing page
   "Frosted glass, calm-futuristic" — scoped to .lp only so the
   agency pages keep the bold-on-white system untouched.
   ========================================================= */

.lp{
  --lp-ink:#101322;
  --lp-ink-2:#2C3145;
  --lp-muted:#666E85;
  --lp-line:rgba(16,19,34,.09);
  --lp-glass:rgba(255,255,255,.58);
  --lp-glass-2:rgba(255,255,255,.78);
  --lp-edge:rgba(255,255,255,.72);
  --lp-shadow:0 26px 60px -34px rgba(16,22,60,.42);
  --lp-r:28px;
  color:var(--lp-ink);
  background:#F6F7FB;
}

/* Soft aurora ground, pinned to the viewport. This is a fixed *layer* rather than
   background-attachment:fixed on purpose — iOS Safari ignores that and sizes the
   image to the whole document, which smears the gradients down the page. */
.lp::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(52vw 46vw at 12% -6%, #DCE3FA 0%, rgba(220,227,250,0) 62%),
    radial-gradient(46vw 42vw at 92% 4%,  #E4DCF6 0%, rgba(228,220,246,0) 60%),
    radial-gradient(58vw 50vw at 78% 62%, #D9EAE6 0%, rgba(217,234,230,0) 62%),
    radial-gradient(46vw 44vw at 6% 84%,  #E3EAF6 0%, rgba(227,234,246,0) 62%);
}

.lp .nav.solid{background:rgba(255,255,255,.62)}
.lp ::selection{background:var(--accent);color:#fff}

/* ---------- shared bits ---------- */
.lp-eyebrow{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--lp-muted);display:inline-flex;align-items:center;gap:.65em;margin:0 0 22px;
}
.lp-eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)}

.lp h1,.lp h2,.lp h3{color:var(--lp-ink)}
.lp-display{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(2rem,4.9vw,3.9rem);line-height:1;letter-spacing:-.03em;margin:0;
}
.lp-h2{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.9rem,4.2vw,3.2rem);line-height:1;letter-spacing:-.025em;margin:0;
  text-wrap:balance;
}
.lp-lead{
  font-size:clamp(1.05rem,1.6vw,1.32rem);line-height:1.5;color:var(--lp-ink-2);
  max-width:46ch;margin:22px 0 0;
}

/* glass surface */
.lp-glass{
  background:var(--lp-glass);
  -webkit-backdrop-filter:blur(20px) saturate(1.6);
  backdrop-filter:blur(20px) saturate(1.6);
  border:1px solid var(--lp-edge);
  border-radius:var(--lp-r);
  box-shadow:var(--lp-shadow);
}

/* pill button, softer than the agency .btn */
.lp-btn{
  display:inline-flex;align-items:center;gap:.6em;
  padding:17px 32px;border-radius:100px;background:var(--accent);color:#fff;
  font-weight:600;font-size:15.5px;letter-spacing:.005em;
  box-shadow:0 16px 34px -16px rgba(68,87,201,.7);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .3s;
}
.lp-btn:hover{transform:translateY(-2px);box-shadow:0 22px 40px -16px rgba(68,87,201,.8)}
.lp-btn .arw{transition:transform .4s var(--ease)}
.lp-btn:hover .arw{transform:translateX(4px)}
.lp-btn.ghost{
  background:var(--lp-glass-2);color:var(--lp-ink);
  border:1px solid var(--lp-edge);box-shadow:var(--lp-shadow);
}

/* ---------- hero ---------- */
.lp-hero{
  position:relative;isolation:isolate;
  padding:clamp(104px,9vw,134px) 0 clamp(16px,2.2vw,28px);
}
.lp-hero .lp-display{max-width:15ch;text-wrap:balance}
.lp-hero-foot{
  display:flex;align-items:center;gap:18px 26px;flex-wrap:wrap;
  margin-top:clamp(28px,4vw,44px);
}
.lp-hero-note{
  font-family:var(--font-mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--lp-muted);
}

/* ---------- paths ---------- */
.lp-section{padding-block:clamp(32px,4.6vw,58px)}
.lp-section-head{margin-bottom:clamp(16px,2.2vw,26px)}

.lp-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
@media (max-width:960px){.lp-paths{grid-template-columns:1fr;max-width:640px}}

.lp-card{
  padding:clamp(28px,3.2vw,40px);
  display:flex;flex-direction:column;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s;
}
.lp-card:hover{
  transform:translateY(-5px);
  border-color:rgba(255,255,255,.95);
  box-shadow:0 34px 70px -34px rgba(16,22,60,.5);
}
.lp-card h3{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.45rem,2.3vw,1.85rem);line-height:1.05;letter-spacing:-.02em;margin:0 0 12px;
}
.lp-card p{margin:0;color:var(--lp-muted);font-size:16px;line-height:1.55}

.lp-card-cta{
  margin-top:auto;align-self:flex-start;
  display:inline-flex;align-items:center;gap:.5em;
  font-weight:600;font-size:15px;color:var(--accent);
  /* padding, not margin, so the whole 44px is tappable */
  padding:22px 0 0;min-height:44px;box-sizing:content-box;
  text-align:left;transition:gap .3s var(--ease);
}
.lp-card-cta:hover{gap:.9em}
.lp-card-cta .arw{transition:transform .4s var(--ease)}
.lp-card.open .lp-card-cta .arw{transform:rotate(90deg)}

/* path 2 sub-options — revealed on click */
.lp-subs{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.lp-card.open .lp-subs{grid-template-rows:1fr}
.lp-subs-inner{overflow:hidden;min-height:0}
.lp-subs-list{display:grid;gap:10px;padding-top:18px}
.lp-sub{
  display:flex;flex-direction:column;gap:3px;
  padding:15px 18px;border-radius:16px;
  background:var(--lp-glass-2);border:1px solid var(--lp-edge);
  transition:transform .35s var(--ease),background .3s;
}
.lp-sub:hover{transform:translateX(4px);background:#fff}
.lp-sub .s-when{font-size:14px;color:var(--lp-muted)}
.lp-sub .s-what{font-weight:600;font-size:15.5px;color:var(--lp-ink)}
.lp-subs[inert]{opacity:.001}

/* ---------- how it works ---------- */
.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:860px){.lp-steps{grid-template-columns:1fr;max-width:640px}}
.lp-step{padding:clamp(24px,2.8vw,34px)}
.lp-step .n{
  font-family:var(--font-mono);font-size:12.5px;letter-spacing:.16em;
  color:var(--accent);display:block;margin-bottom:16px;
}
.lp-step h3{
  font-family:var(--font-display);font-weight:800;font-size:1.35rem;
  letter-spacing:-.015em;margin:0 0 8px;
}
.lp-step p{margin:0;color:var(--lp-muted);font-size:15.5px;line-height:1.55}

/* ---------- credibility line ---------- */
.lp-cred{
  display:flex;align-items:flex-start;gap:16px;
  padding:22px 26px;border-radius:22px;max-width:78ch;
  background:rgba(255,255,255,.5);border:1px solid var(--lp-edge);
}
.lp-cred .m{font-size:15px;line-height:1.55;color:var(--lp-muted);margin:0}
.lp-cred .dot{
  width:9px;height:9px;border-radius:50%;background:var(--accent);
  flex:none;margin-top:8px;
}

/* ---------- final CTA ---------- */
.lp-final{
  text-align:center;padding:clamp(48px,8vw,96px) clamp(24px,5vw,64px);
  background:linear-gradient(180deg,rgba(255,255,255,.74),rgba(255,255,255,.5));
}
.lp-final .lp-h2{font-size:clamp(2.1rem,5.2vw,3.9rem)}
.lp-final .lp-btn{margin-top:32px}
.lp-final-note{
  margin:22px 0 0;font-family:var(--font-mono);font-size:12.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--lp-muted);
}

.lp-bottom{padding-bottom:clamp(60px,9vw,120px)}

/* ---------- mobile ---------- */
@media (max-width:760px){
  /* backdrop blur is the most expensive thing on this page; phones get a lighter
     blur over a slightly more opaque fill, which reads the same over a soft ground */
  .lp{--lp-glass:rgba(255,255,255,.72);--lp-glass-2:rgba(255,255,255,.86)}
  .lp-glass{-webkit-backdrop-filter:blur(8px) saturate(1.3);backdrop-filter:blur(8px) saturate(1.3)}
  .lp-hero{padding-top:clamp(112px,26vw,140px)}
  /* the display floor is tuned for tablets; on a phone it runs to the edge */
  .lp-display{font-size:clamp(2rem,7.4vw,2.5rem)}
  .lp-step h3{font-size:1.22rem}
  .lp-hero-foot{gap:14px 20px}
  .lp-btn{padding:16px 26px}
  .lp-final .lp-btn{width:100%;justify-content:center}
  .lp-cred{padding:20px 22px}
}
/* phones that also can't hover: no transform-on-hover states to get stuck in */
@media (hover:none){
  .lp-card:hover{transform:none}
  .lp-sub:hover{transform:none}
  .lp-btn:hover{transform:none}
}

@media (prefers-reduced-motion:reduce){
  .lp-card,.lp-btn,.lp-sub,.lp-subs{transition:none}
}

/* =========================================================
   Offer pages — /launch/get-started · /launch/funding · /launch/contracts
   Same frosted system as /launch, longer-form layout.
   ========================================================= */

.lp-pagehead{padding:clamp(120px,16vw,190px) 0 clamp(30px,4vw,50px)}
.lp-back{
  display:inline-flex;align-items:center;gap:.5em;min-height:44px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--lp-muted);transition:gap .3s var(--ease),color .3s;
}
.lp-back:hover{gap:.9em;color:var(--accent)}
.lp-pagehead h1{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(2.2rem,4.6vw,3.9rem);line-height:.98;letter-spacing:-.03em;
  margin:14px 0 0;text-wrap:balance;
}

/* headline + photo share one row, on the same split as the content grid below,
   so the copy and the picture are both above the fold */
.lp-headgrid{
  display:grid;grid-template-columns:1.35fr .65fr;
  gap:clamp(24px,3.4vw,48px);align-items:center;margin-top:18px;
}
.lp-headcopy .lp-lead{max-width:52ch}
@media (max-width:940px){
  /* stacks under the copy, and goes wide so it stays a band, not a slab */
  .lp-headgrid{grid-template-columns:1fr;gap:24px;align-items:start}
}

/* two-column body: content left, sticky price/CTA rail right */
.lp-offer{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(24px,3.4vw,48px);align-items:start}
@media (max-width:940px){.lp-offer{grid-template-columns:1fr}}

.lp-block{padding:clamp(26px,3vw,40px);margin-bottom:20px}
.lp-block h2{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.35rem,2.2vw,1.75rem);letter-spacing:-.02em;margin:0 0 18px;
}
.lp-block p{margin:0;color:var(--lp-ink-2);font-size:16.5px;line-height:1.6}
.lp-block p + p{margin-top:14px}

.lp-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.lp-list li{
  position:relative;padding-left:32px;font-size:16px;line-height:1.55;color:var(--lp-ink-2);
}
.lp-list li::before{
  content:"";position:absolute;left:0;top:.45em;width:16px;height:16px;border-radius:50%;
  background:var(--accent);opacity:.16;
}
.lp-list li::after{
  content:"";position:absolute;left:5px;top:calc(.45em + 5px);width:6px;height:6px;
  border-radius:50%;background:var(--accent);
}

/* price / delivery rail */
.lp-rail{position:sticky;top:96px;padding:clamp(26px,3vw,34px)}
@media (max-width:940px){.lp-rail{position:static}}
.lp-fact{margin:0;font-size:16px;line-height:1.5;color:var(--lp-ink-2)}
.lp-rail hr{border:0;height:1px;background:var(--lp-line);margin:24px 0}
.lp-rail .lp-btn{width:100%;justify-content:center}
.lp-rail-fine{
  margin:16px 0 0;font-size:13.5px;line-height:1.5;color:var(--lp-muted);text-align:center;
}

/* the two funding offers, side by side */
.lp-two{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;align-items:start}
@media (max-width:880px){.lp-two{grid-template-columns:1fr}}
.lp-two > * {scroll-margin-top:96px}
.lp-offer-card{padding:clamp(26px,3vw,38px);display:flex;flex-direction:column;height:100%}
.lp-offer-card h2{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.05;letter-spacing:-.02em;margin:0;
}
.lp-label{
  display:block;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--lp-muted);margin:0 0 10px;
}
.lp-offer-card h2 + .lp-label{margin-top:24px}
.lp-offer-card p{margin:0;color:var(--lp-ink-2);font-size:15.5px;line-height:1.6}
.lp-offer-card p:last-of-type{margin-bottom:26px}
.lp-offer-card .lp-btn{margin-top:auto;align-self:flex-start}
.lp-divider{height:1px;background:var(--lp-line);border:0;margin:24px 0}

@media (max-width:760px){
  .lp-pagehead{padding-top:clamp(104px,24vw,130px)}
  .lp-pagehead h1{font-size:clamp(2.1rem,8.6vw,3rem)}
  .lp-offer-card .lp-btn,.lp-rail .lp-btn{width:100%;justify-content:center}
  .lp-label{font-size:12px}
}

/* =========================================================
   Photography — soft-edged, muted, sits inside the glass system
   ========================================================= */

/* an offer card leads with the deliverable, not a photo */
.lp-offer-card .lp-deliver{max-width:206px;margin-bottom:22px}

/* =========================================================
   Deliverable mockups — a look at what actually lands in the inbox
   ========================================================= */

.lp-deliver{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(122px,1fr));
  gap:12px;margin:0 0 26px;
}
.lp-deliver figure{
  margin:0;padding:10px;border-radius:16px;
  background:var(--lp-glass-2);border:1px solid var(--lp-edge);
}
.lp-deliver img{width:100%;height:auto;display:block}
.lp-deliver figcaption{
  margin-top:8px;text-align:center;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--lp-muted);
}
/* two per row on the funding offer cards, which are half-width already */
@media (max-width:520px){
  .lp-deliver{grid-template-columns:repeat(2,1fr)}
  .lp-deliver figcaption{font-size:10px}
}

/* =========================================================
   The journey — a route across the business's stages.
   Each stop links to its offer page; hovering one fills the route
   up to that point and lights the matching card below.
   ========================================================= */

.lp-journey{margin:0 0 clamp(22px,3vw,36px)}

.lp-route-wrap{position:relative;height:140px}
.lp-route{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lp-route path,.lp-route line{fill:none;stroke-linecap:round}
.rt-base{stroke:var(--lp-line);stroke-width:3;
  stroke-dasharray:100;stroke-dashoffset:100;
  transition:stroke-dashoffset 1.5s var(--ease)}
.lp-journey.in .rt-base{stroke-dashoffset:0}
.rt-fill{stroke:var(--accent);stroke-width:3.5;
  stroke-dasharray:100;stroke-dashoffset:100;
  transition:stroke-dashoffset .7s var(--ease)}
.rt-drop{stroke:var(--lp-line);stroke-width:1.5;stroke-dasharray:3 5;opacity:0;
  transition:opacity .6s var(--ease) .5s}
.lp-journey.in .rt-drop{opacity:1}

/* stops sit on the route — real circles, so they live outside the stretched svg */
.lp-dot{
  position:absolute;left:var(--x);top:var(--y);
  transform:translate(-50%,-50%) scale(.4);opacity:0;
  width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-mono);font-size:15px;color:var(--lp-muted);
  background:var(--lp-glass-2);border:1px solid var(--lp-edge);
  box-shadow:0 10px 22px -14px rgba(16,22,60,.6);
  cursor:pointer;
  transition:transform .55s var(--ease),opacity .5s var(--ease),
             background .3s,color .3s,border-color .3s;
}
.lp-journey.in .lp-dot{transform:translate(-50%,-50%) scale(1);opacity:1}
.lp-dot:nth-of-type(2){transition-delay:.1s}
.lp-dot:nth-of-type(3){transition-delay:.2s}
.lp-dot:nth-of-type(4){transition-delay:.3s}
.lp-journey.in .lp-dot.on{
  transform:translate(-50%,-50%) scale(1.16);
  background:var(--accent);border-color:var(--accent);color:#fff;
  box-shadow:0 14px 30px -12px rgba(68,87,201,.85);
}
.lp-dot.rt-end{border-style:dashed}

/* the labels under the route */
.lp-stops{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
}
.lp-stops > li{min-width:0}
.lp-stop{
  display:flex;flex-direction:column;gap:6px;height:100%;
  padding:16px 14px 18px;border-radius:18px;text-align:center;
  border:1px solid transparent;
  transition:background .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease);
}
a.lp-stop:hover,a.lp-stop:focus-visible{
  background:var(--lp-glass);border-color:var(--lp-edge);transform:translateY(-3px);
}
.lp-stop .n{
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--lp-muted);
}
.lp-stop .t{
  font-family:var(--font-display);font-weight:800;font-size:1.14rem;
  line-height:1.15;letter-spacing:-.015em;color:var(--lp-ink);
}
.lp-stop .d{font-size:14px;line-height:1.5;color:var(--lp-muted)}
/* visible at rest so it reads as clickable, brighter on hover */
.lp-stop .go{
  margin-top:auto;padding-top:10px;font-weight:600;font-size:13.5px;color:var(--accent);
  opacity:.6;transition:opacity .3s var(--ease)}
a.lp-stop:hover .go,a.lp-stop:focus-visible .go{opacity:1}
a.lp-stop:hover .go .arw,a.lp-stop:focus-visible .go .arw{
  display:inline-block;transform:translateX(4px);transition:transform .3s var(--ease)}
.lp-stop.is-end .t,.lp-stop.is-end .d{color:var(--lp-muted)}

/* hovering a stop lifts its matching card in the grid below */
.lp-card.hi{
  transform:translateY(-5px);
  border-color:rgba(255,255,255,.95);
  box-shadow:0 34px 70px -34px rgba(16,22,60,.5);
}

/* ---------- the route becomes a vertical rail on narrow screens ---------- */
@media (max-width:820px){
  .lp-route-wrap{display:none}
  .lp-stops{grid-template-columns:1fr;gap:0;position:relative;padding-left:52px}
  .lp-stops::before{
    content:"";position:absolute;left:22px;top:26px;bottom:34px;width:2px;
    background:linear-gradient(180deg,var(--accent),var(--lp-line));border-radius:2px;
  }
  .lp-stop{
    text-align:left;align-items:flex-start;position:relative;
    padding:14px 14px 18px 0;min-height:64px;
  }
  .lp-stop::before{
    content:attr(data-n);position:absolute;left:-52px;top:12px;
    width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
    font-family:var(--font-mono);font-size:14px;color:var(--lp-muted);
    background:var(--lp-glass-2);border:1px solid var(--lp-edge);
  }
  .lp-stop .go{opacity:.75;padding-top:8px}
  a.lp-stop:hover,a.lp-stop:focus-visible{transform:none}
}

@media (prefers-reduced-motion:reduce){
  .rt-base,.rt-fill,.rt-drop,.lp-dot,.lp-stop,.lp-stop .go{transition:none}
  .rt-base{stroke-dashoffset:0}
  .lp-dot{transform:translate(-50%,-50%) scale(1);opacity:1}
}

/* five stages on the route */
.lp-stops{grid-template-columns:repeat(5,1fr)}
.lp-dot:nth-of-type(5){transition-delay:.4s}
@media (max-width:820px){.lp-stops{grid-template-columns:1fr}}

.lp-note{
  margin:22px 0 0;padding:14px 16px;border-radius:14px;
  background:var(--lp-glass-2);border:1px solid var(--lp-edge);
  font-size:14.5px;line-height:1.55;color:var(--lp-muted);
}
.lp-list a{color:var(--accent);border-bottom:1px solid rgba(68,87,201,.35)}
.lp-list a:hover{border-bottom-color:var(--accent)}

/* ---------- intake form ---------- */
.lp-form{display:grid;gap:18px;max-width:720px}
.lp-form fieldset{border:0;margin:0;display:grid;gap:16px}
.lp-form .field{display:grid;gap:8px}
.lp-form label{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--lp-muted);
}
.lp-form label .opt{text-transform:none;letter-spacing:0;opacity:.8}
.lp-form input,.lp-form textarea{
  width:100%;padding:14px 16px;border-radius:14px;
  border:1px solid var(--lp-edge);background:rgba(255,255,255,.72);
  font-family:inherit;font-size:16px;color:var(--lp-ink);
  transition:box-shadow .25s,border-color .25s,background .25s;
}
.lp-form input:focus,.lp-form textarea:focus{
  outline:0;border-color:var(--accent);background:#fff;
  box-shadow:0 0 0 3px rgba(68,87,201,.16);
}
.lp-form textarea{resize:vertical;min-height:104px}
.lp-form .chips{display:flex;flex-wrap:wrap;gap:9px}
.lp-form .chip{
  padding:11px 18px;border-radius:100px;min-height:44px;display:inline-flex;align-items:center;
  background:rgba(255,255,255,.72);border:1px solid var(--lp-edge);
  font-size:14.5px;color:var(--lp-ink-2);cursor:pointer;user-select:none;
  transition:background .25s,color .25s,border-color .25s;
}
.lp-form .chip:hover{border-color:var(--accent)}
.lp-form .chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.lp-form-foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap;max-width:720px}
@media (max-width:600px){
  .lp-form-foot .lp-btn{width:100%;justify-content:center}
}

/* =========================================================
   Intake deck — the intake is a set of cards you swipe, not
   a page you scroll. The page itself never scrolls; a card
   scrolls inside itself only if its fields overflow.
   ========================================================= */
.lp-deckpage{
  height:100svh;min-height:100svh;overflow:hidden;
  display:flex;flex-direction:column;
  overscroll-behavior:none;
}
/* older Safari has no svh; vh is close enough there */
@supports not (height:100svh){ .lp-deckpage{height:100vh;min-height:100vh} }

.deck-wrap{
  flex:1;min-height:0;display:flex;flex-direction:column;
  padding-top:clamp(74px,10vw,94px);
}

/* ---------- the slides ---------- */
.deck{flex:1;min-height:0;overflow:hidden;position:relative}
.deck-track{
  display:flex;height:100%;
  transition:transform .55s var(--ease);
  will-change:transform;
}
.deck-track.dragging{transition:none}
.deck-slide{
  flex:0 0 100%;height:100%;min-width:0;
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  padding:4px var(--pad) 22px;
  display:flex;justify-content:center;
}
.slide-card{
  width:100%;max-width:640px;
  /* auto margins centre a short card and still let a tall one scroll */
  margin-block:auto;
  padding:clamp(22px,3.4vw,36px);
  display:grid;gap:16px;align-content:start;
  opacity:0;transform:translateY(14px);
  transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.deck-slide.on .slide-card{opacity:1;transform:none}
.slide-card .lp-eyebrow{margin:0}
.slide-h{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.55rem,4.4vw,2.3rem);line-height:1.02;letter-spacing:-.028em;
  margin:0;text-wrap:balance;
}
.slide-hint{margin:0;color:var(--lp-ink-2);font-size:15.5px;line-height:1.55;max-width:52ch}
.slide-card .field{display:grid;gap:8px}
.slide-card label{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--lp-muted);
}
.slide-card label .opt{text-transform:none;letter-spacing:0;opacity:.8}
.slide-card input[type=text],.slide-card input[type=tel],
.slide-card input[type=email],.slide-card input[type=url],
.slide-card textarea{
  width:100%;padding:14px 16px;border-radius:14px;
  border:1px solid var(--lp-edge);background:rgba(255,255,255,.72);
  font-family:inherit;font-size:16px;color:var(--lp-ink);
  transition:box-shadow .25s,border-color .25s,background .25s;
}
.slide-card input:focus,.slide-card textarea:focus{
  outline:0;border-color:var(--accent);background:#fff;
  box-shadow:0 0 0 3px rgba(68,87,201,.16);
}
.slide-card textarea{resize:vertical;min-height:96px}
.slide-card .chips{display:flex;flex-wrap:wrap;gap:9px}
.slide-card .chip{
  padding:11px 18px;border-radius:100px;min-height:44px;display:inline-flex;align-items:center;
  background:rgba(255,255,255,.72);border:1px solid var(--lp-edge);
  font-size:14.5px;color:var(--lp-ink-2);cursor:pointer;user-select:none;
  transition:background .25s,color .25s,border-color .25s;
}
.slide-card .chip:hover{border-color:var(--accent)}
.slide-card .chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.slide-send{display:grid;gap:14px;margin-top:6px}
.slide-send .lp-btn{justify-self:start}
/* a field we blocked on */
.field.nudge input,.field.nudge textarea{
  border-color:#C9445A;box-shadow:0 0 0 3px rgba(201,68,90,.14);
}

/* ---------- upload wells ---------- */
.drop{
  position:relative;border-radius:18px;cursor:pointer;
  border:1.5px dashed rgba(16,19,34,.22);background:rgba(255,255,255,.46);
  padding:26px 20px;text-align:center;
  transition:border-color .25s,background .25s,transform .25s var(--ease);
}
.drop:hover,.drop:focus-visible{border-color:var(--accent);background:rgba(255,255,255,.72)}
.drop:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(68,87,201,.16)}
.drop.over{border-color:var(--accent);background:rgba(68,87,201,.07);transform:scale(1.01)}
.drop-face{display:grid;justify-items:center;gap:6px;pointer-events:none}
.drop-ico{width:26px;height:26px;color:var(--accent);opacity:.85}
.drop-lead{margin:2px 0 0;font-weight:600;font-size:15.5px;color:var(--lp-ink)}
.drop-sub{margin:0;font-size:13.5px;color:var(--lp-muted)}

.drop-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.drop-list:empty{display:none}
.drop-item{
  display:flex;align-items:center;gap:12px;
  padding:9px 10px;border-radius:14px;
  background:var(--lp-glass-2);border:1px solid var(--lp-edge);
}
.drop-thumb{
  width:40px;height:40px;flex:none;border-radius:10px;object-fit:cover;
  background:rgba(16,19,34,.06);display:grid;place-items:center;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;color:var(--lp-muted);
}
.drop-body{flex:1;min-width:0;display:grid;gap:5px}
.drop-name{
  font-size:14px;color:var(--lp-ink);margin:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.drop-meta{margin:0;font-size:12px;color:var(--lp-muted)}
.drop-item.err .drop-meta{color:#C9445A}
.drop-bar{height:3px;border-radius:100px;background:rgba(16,19,34,.1);overflow:hidden}
.drop-item.done .drop-bar{display:none}
.drop-bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .2s linear}
.drop-x{
  flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  color:var(--lp-muted);cursor:pointer;transition:background .2s,color .2s;
}
.drop-x:hover{background:rgba(201,68,90,.1);color:#C9445A}
.drop-x svg{width:15px;height:15px}

/* ---------- the timer rail ---------- */
.deck-bar{
  flex:none;border-top:1px solid var(--lp-line);
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
  padding-bottom:env(safe-area-inset-bottom);
}
.deck-bar-in{
  max-width:calc(640px + var(--pad) * 2);margin-inline:auto;
  display:flex;align-items:center;gap:14px;
  padding:12px var(--pad);
}
.timer{position:relative;width:44px;height:44px;flex:none}
.timer svg{width:44px;height:44px;transform:rotate(-90deg)}
.timer circle{fill:none;stroke-width:3.2;stroke-linecap:round}
.t-track{stroke:rgba(16,19,34,.11)}
.t-fill{
  stroke:var(--accent);
  stroke-dasharray:119.38;stroke-dashoffset:119.38;
  transition:stroke-dashoffset .55s var(--ease);
}
.t-num{
  position:absolute;inset:0;display:grid;place-items:center;
  font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--lp-ink);
}
.deck-meta{flex:1;min-width:0}
.deck-step{
  margin:0;font-size:13.5px;font-weight:600;color:var(--lp-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.deck-left{
  margin:2px 0 0;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--lp-muted);
}
.deck-ticks{display:flex;align-items:center;gap:5px}
.deck-tick{
  width:22px;height:34px;padding:0;flex:none;cursor:pointer;
  display:grid;place-items:center;background:none;border:0;
}
.deck-tick::before{
  content:"";width:8px;height:8px;border-radius:100px;
  background:rgba(16,19,34,.16);
  transition:background .3s,width .35s var(--ease),height .3s;
}
.deck-tick.seen::before{background:rgba(68,87,201,.42)}
.deck-tick.on::before{background:var(--accent);width:20px;height:8px}
.deck-tick:hover::before{background:var(--accent)}
.deck-nav{display:flex;gap:8px;flex:none}
.deck-arrow{
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--lp-edge);background:var(--lp-glass-2);color:var(--lp-ink);
  cursor:pointer;transition:background .25s,color .25s,transform .3s var(--ease),opacity .25s;
}
.deck-arrow svg{width:20px;height:20px}
.deck-arrow.next{background:var(--accent);border-color:var(--accent);color:#fff;
  box-shadow:0 12px 26px -14px rgba(68,87,201,.85)}
.deck-arrow:hover{transform:translateY(-2px)}
.deck-arrow[disabled]{opacity:.3;pointer-events:none;transform:none}

/* the ticks are the first thing to go when the rail gets tight */
@media (max-width:720px){
  .deck-bar-in{gap:10px}
  .deck-ticks{display:none}
  .deck-slide{padding-inline:16px}
  .deck-bar-in{padding-inline:16px}
}
@media (max-width:360px){
  .deck-meta{display:none}
}

/* the done card takes the whole deck */
.deck-done{
  flex:1;min-height:0;display:grid;place-items:center;
  padding:20px var(--pad) 40px;overflow-y:auto;
}
.deck-done .slide-card{opacity:1;transform:none;text-align:center;justify-items:center}
.deck-done .lp-btn{justify-self:center}

@media (prefers-reduced-motion:reduce){
  .deck-track,.slide-card,.t-fill,.deck-arrow,.drop{transition:none}
  .slide-card{opacity:1;transform:none}
}

/* =========================================================
   /get — dedicated, no-nav landing pages (one CTA idea each,
   for print/QR/ad traffic that already knows what it wants)
   ========================================================= */
.gl-topbar{display:flex;justify-content:center;padding:clamp(26px,4vw,40px) 0 0}
.gl-topbar img{height:24px;width:auto;display:block}
.lp-hero.gl-nonav,.lp-pagehead.gl-nonav{padding-top:clamp(20px,3vw,34px)}
.gl-proof{
  font-size:14px;color:var(--lp-muted);margin-top:18px;display:flex;align-items:center;gap:.6em;
}
.gl-proof::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none}

.gl-qa{display:grid;gap:22px;margin:0}
.gl-qa dt{font-family:var(--font-display);font-weight:700;font-size:17px;margin:0 0 8px;color:var(--lp-ink)}
.gl-qa dd{margin:0;color:var(--lp-ink-2);font-size:15.5px;line-height:1.6}

.gl-form{display:grid;gap:16px;padding:clamp(24px,3.2vw,32px);max-width:420px;margin:0 auto}
.gl-field{display:grid;gap:6px;text-align:left}
.gl-field label{font-size:13px;font-weight:600;color:var(--lp-ink-2)}
.gl-field input{
  padding:13px 16px;border-radius:12px;border:1px solid var(--lp-line);
  background:#fff;font:inherit;font-size:15px;color:var(--lp-ink);width:100%;box-sizing:border-box;
}
.gl-field input:focus{outline:2px solid var(--accent);outline-offset:1px}
.gl-form-note{margin:0;font-size:12.5px;color:var(--lp-muted);text-align:center}
.gl-form-ok{padding:clamp(28px,3.6vw,40px);max-width:420px;margin:0 auto;text-align:center}
.gl-form-ok h3{margin:0 0 10px}
.gl-form-ok p{margin:0;color:var(--lp-ink-2)}

.gl-foot{
  text-align:center;padding:clamp(30px,5vw,52px) 0 clamp(40px,6vw,64px);
  font-family:var(--font-mono);font-size:12px;color:var(--lp-muted);
}
@media (max-width:640px){
  .gl-form{max-width:100%}
}

/* =========================================================
   THE MATH — a plain without/with comparison, real facts only
   (no invented numbers). Used on every offer/landing page.
   ========================================================= */
.lp-math{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-radius:14px;overflow:hidden}
.lp-math li{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
  padding:14px 18px;background:var(--lp-glass-2);font-size:15px;line-height:1.5;
}
.lp-math li:first-child{
  background:transparent;font-family:var(--font-mono);font-size:11.5px;
  text-transform:uppercase;letter-spacing:.06em;color:var(--lp-muted);padding-bottom:6px;
}
.lp-math .without{color:var(--lp-muted)}
.lp-math .without::before{content:"— ";opacity:.6}
.lp-math .with{color:var(--lp-ink);font-weight:600}
.lp-math .with::before{content:"✓ ";color:var(--accent)}
@media (max-width:560px){
  .lp-math li{grid-template-columns:1fr;gap:4px}
}

/* risk-removal — real, established policies, not a marketing promise */
.lp-risk{
  margin-top:22px;padding:16px 18px;border-radius:14px;
  background:var(--lp-glass-2);font-size:14px;line-height:1.55;color:var(--lp-ink-2);
}
.lp-risk strong{color:var(--lp-ink)}