/* ============================================================
   WITBANK PROPERTY EXPO · scroll-snap deck system
   One scroll = one panel = one idea.
   Attendee gold, exhibitor blue.
   ============================================================ */
:root{
  --sap:#14267A; --sap-d:#0A1450; --sap-x:#2445B8;
  --elec:#1E4DFF; --elec-l:#5B85FF;
  --ivory:#FFFCF5; --cream:#FFFEFA; --sand:#FBF4E4;
  --gold:#E8B93C; --gold-l:#FFE29A; --gold-h:#F5C94D;
  --bronze:#6B4E0F; --bronze-d:#5A4109;
  --ink:#0C1636; --ink-s:#2A3555; --ink-m:#464F70;
  --pale:#DCE4FB; --pale-s:#A6B4E0;
  --ok:#2FBF71;
  --bar:42px;
}
*{box-sizing:border-box;margin:0;padding:0}

/* The page itself does NOT scroll. A single dedicated container does.
   Putting scroll-snap on <html> while <body> has overflow-x:hidden makes
   body its own scroll container and the snapping silently stops working.
   One explicit container removes all of that ambiguity. */
html,body{height:100%;overflow:hidden;margin:0;padding:0}
body{
  font-family:'Inter',system-ui,sans-serif;font-weight:500;line-height:1.5;
  background:var(--sap-d);color:var(--ink);-webkit-font-smoothing:antialiased;
}
.deck{
  height:100vh;height:100dvh;
  overflow-y:scroll;overflow-x:hidden;
  scroll-snap-type:y mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  scrollbar-width:none;-ms-overflow-style:none;
}
.deck::-webkit-scrollbar{display:none;width:0}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}

/* ---------- panel ---------- */
.panel{
  height:100%;min-height:100%;flex:0 0 100%;
  scroll-snap-align:start;scroll-snap-stop:always;
  position:relative;overflow:hidden;
  display:flex;align-items:center;
  padding:calc(var(--bar) + 1.2rem) 0 4.2rem;
}
.in{width:100%;max-width:1180px;margin:0 auto;padding:0 6vw;position:relative;z-index:3}
.mid{text-align:center}
.tight{max-width:900px}

.d-nav{background:linear-gradient(150deg,#1B37A0 0%,#14267A 42%,#0A1450 100%);color:var(--pale)}
.d-sap{background:linear-gradient(150deg,#1B37A0 0%,#14267A 42%,#0A1450 100%);color:var(--pale)}
.d-deep{background:linear-gradient(160deg,#111F62 0%,#0A1450 55%,#060D38 100%);color:var(--pale)}
.d-ivory{background:linear-gradient(160deg,var(--cream) 0%,var(--ivory) 55%,var(--sand) 100%);color:var(--ink)}
.d-white{background:#fff;color:var(--ink)}
.d-gold{background:linear-gradient(150deg,#F0C75A 0%,var(--gold) 45%,#C79A26 100%);color:#14100A}
.d-blue{background:linear-gradient(150deg,#3B62FF 0%,var(--elec) 45%,#0F2FB0 100%);color:#fff}

.tex{position:absolute;inset:0;pointer-events:none;z-index:1}
.d-sap .tex,.d-deep .tex,.d-nav .tex{background-image:linear-gradient(rgba(91,133,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(91,133,255,.11) 1px,transparent 1px);background-size:72px 72px}
.d-ivory .tex,.d-white .tex{background-image:linear-gradient(rgba(18,35,92,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(18,35,92,.05) 1px,transparent 1px);background-size:72px 72px}
.orb{position:absolute;border-radius:50%;filter:blur(120px);z-index:0;pointer-events:none}
.bgimg{position:absolute;inset:0;z-index:0}
.bgimg img{width:100%;height:100%;object-fit:cover}
.veil{position:absolute;inset:0;z-index:1}

/* ---------- type ---------- */
h1,h2,h3,.anton{font-family:'Anton',Impact,sans-serif;font-weight:400;text-transform:uppercase;line-height:.94;letter-spacing:.005em}
h1{font-size:clamp(2.1rem,5.6vw,4.6rem)}
h2{font-size:clamp(1.85rem,4.9vw,4rem)}
h3{font-size:clamp(1.05rem,1.9vw,1.35rem)}
.d-sap h2,.d-deep h2,.d-nav h2,.d-blue h2,.d-sap h3,.d-deep h3,.d-blue h3{color:#fff}
.d-ivory h2,.d-white h2,.d-ivory h3,.d-white h3{color:#0A1330}
.d-gold h2,.d-gold h3{color:#14100A}
.foil{background:linear-gradient(178deg,#FFF3CE 0%,#FFD86B 30%,var(--gold) 58%,#B0801F 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.d-ivory .foil,.d-white .foil{background:linear-gradient(178deg,#956B11 0%,#825D0E 55%,var(--bronze) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.d-gold .foil,.d-blue .foil{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#fff}
.d-gold .foil{color:#3A2A05}

.eyebrow{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:clamp(.78rem,1.1vw,.95rem);
  letter-spacing:.3em;text-transform:uppercase;display:flex;align-items:center;gap:.9rem;margin-bottom:1.2rem
}
.eyebrow::before{content:"";width:2rem;height:3px;background:var(--elec);flex:none}
.d-gold .eyebrow::before{background:#3A2A05}
.d-blue .eyebrow::before{background:#fff}
.d-sap .eyebrow,.d-deep .eyebrow,.d-nav .eyebrow{color:var(--gold)}
.d-ivory .eyebrow,.d-white .eyebrow{color:var(--bronze)}
.d-gold .eyebrow{color:#3A2A05}
.d-blue .eyebrow{color:#fff}
.eyebrow.c{justify-content:center}
.eyebrow.c::before{display:none}

.lede{font-size:clamp(1.05rem,1.75vw,1.42rem);line-height:1.5;font-weight:500;margin-top:1.1rem}
.d-sap .lede,.d-deep .lede,.d-nav .lede{color:#EDF1FF}
.d-ivory .lede,.d-white .lede{color:#1B2547}
.d-gold .lede{color:#241A06}
.d-blue .lede{color:#EAF0FF}
.serif{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:600}
.big-serif{font-size:clamp(1.5rem,3.4vw,2.6rem);line-height:1.25}
strong{font-weight:700}
.d-sap strong,.d-deep strong,.d-nav strong,.d-blue strong{color:#fff}
.fine{font-size:clamp(.76rem,.95vw,.85rem);line-height:1.45;margin-top:1.1rem}
.d-sap .fine,.d-deep .fine,.d-nav .fine{color:#AEBBE4}
.d-ivory .fine,.d-white .fine{color:var(--ink-m)}
.d-gold .fine{color:#4A3708}
.d-blue .fine{color:#C9D6FF}

/* ---------- countdown bar ---------- */
.cdbar{
  position:fixed;top:0;left:0;right:0;height:var(--bar);z-index:300;
  background:#060D38;border-bottom:1px solid rgba(232,185,60,.45);
  display:flex;align-items:center;justify-content:center;gap:1rem;padding:0 .9rem
}
.cdbar .lbl{font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem;color:var(--gold)}
.cdbar.exh .lbl{color:var(--elec-l)}
.cdbar .units{display:flex;gap:.75rem;align-items:baseline}
.cdbar .u{display:flex;align-items:baseline;gap:.22rem}
.cdbar .n{font-family:'Anton',sans-serif;font-size:1.1rem;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.cdbar .t{font-family:'Barlow Condensed',sans-serif;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--pale-s)}
.cdbar .go{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  font-size:.78rem;padding:.38rem 1rem;background:var(--gold);color:#12100A;white-space:nowrap
}
.cdbar.exh .go{background:var(--elec);color:#fff}

/* ---------- brand mark ---------- */
.mark{
  position:fixed;top:calc(var(--bar) + .9rem);left:6vw;z-index:250;
  display:flex;align-items:center;gap:.6rem
}
.mark img{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:50%;padding:5px;box-shadow:0 0 0 1px rgba(232,185,60,.6)}
.mark span{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
@media(max-width:700px){.mark span{display:none}}

/* ---------- dots + counter ---------- */
.dots{position:fixed;right:1.4rem;top:50%;transform:translateY(-50%);z-index:250;display:flex;flex-direction:column;gap:.55rem}
.dots a{width:7px;height:7px;border-radius:50%;background:rgba(150,162,205,.55);transition:.25s;display:block}
.dots a.on{background:var(--gold);box-shadow:0 0 0 4px rgba(232,185,60,.2)}
.dots.exh a.on{background:var(--elec-l);box-shadow:0 0 0 4px rgba(91,133,255,.22)}
.pgn{position:fixed;left:6vw;bottom:1.3rem;z-index:250;font-family:'Barlow Condensed',sans-serif;letter-spacing:.24em;font-size:.74rem;text-transform:uppercase;color:rgba(255,255,255,.75);text-shadow:0 1px 8px rgba(0,0,0,.5)}
.hint{position:fixed;right:1.4rem;bottom:1.3rem;z-index:250;font-family:'Barlow Condensed',sans-serif;letter-spacing:.2em;font-size:.7rem;text-transform:uppercase;color:rgba(255,255,255,.7);transition:opacity .5s;text-shadow:0 1px 8px rgba(0,0,0,.5)}
@media(max-width:860px){.dots{display:none}.hint{display:none}.pgn{left:auto;right:1rem;bottom:5.2rem}}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;font-family:'Barlow Condensed',sans-serif;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;font-size:clamp(.88rem,1.1vw,1rem);
  padding:.95rem 2rem;border:2px solid transparent;transition:.2s;cursor:pointer;text-align:center
}
.btn.gold{background:var(--gold);color:#12100A;border-color:var(--gold)}
.btn.gold:hover{background:var(--gold-h);transform:translateY(-2px)}
.btn.blue{background:var(--elec);color:#fff;border-color:var(--elec)}
.btn.blue:hover{background:var(--elec-l);transform:translateY(-2px)}
.btn.dark{background:#0A1450;color:#fff;border-color:#0A1450}
.btn.dark:hover{background:#14267A;transform:translateY(-2px)}
.btn.ghostw{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn.ghostw:hover{border-color:var(--gold);color:var(--gold)}
.btn.ghostd{background:transparent;color:var(--ink);border-color:rgba(12,22,54,.35)}
.btn.ghostd:hover{border-color:var(--elec);color:var(--elec)}
.btnrow{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.8rem}
.btnrow.c{justify-content:center}

/* ---------- three/four up ---------- */
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.1rem;margin-top:2rem}
.tcard{padding:1.5rem 1.3rem;position:relative;overflow:hidden}
.d-sap .tcard,.d-deep .tcard{background:rgba(7,15,60,.62);border:1px solid rgba(91,133,255,.35)}
.d-ivory .tcard,.d-white .tcard{background:#fff;border:1px solid rgba(12,22,54,.13);box-shadow:0 6px 20px rgba(12,22,54,.07)}
.d-gold .tcard{background:rgba(255,255,255,.55);border:1px solid rgba(58,42,5,.2)}
.d-blue .tcard{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3)}
.tcard::before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,var(--elec),var(--gold))}
.tcard .k{font-family:'Barlow Condensed',sans-serif;font-size:.78rem;letter-spacing:.2em;font-weight:700;display:block;margin-bottom:.6rem}
.d-sap .tcard .k,.d-deep .tcard .k{color:var(--gold)}
.d-ivory .tcard .k,.d-white .tcard .k{color:var(--bronze)}
.d-gold .tcard .k{color:#6B4E0F}
.d-blue .tcard .k{color:#fff}
.tcard h3{margin-bottom:.45rem}
.tcard p{font-size:clamp(.88rem,1.1vw,.98rem);line-height:1.45}
.d-sap .tcard p,.d-deep .tcard p{color:#DBE3FB}
.d-ivory .tcard p,.d-white .tcard p{color:var(--ink-s)}
.d-gold .tcard p{color:#3A2A05}
.d-blue .tcard p{color:#EAF0FF}

/* ---------- big figures ---------- */
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;margin-top:2rem;background:rgba(232,185,60,.42)}
.d-ivory .figs,.d-white .figs{background:rgba(107,78,15,.3)}
.fig{padding:1.7rem .8rem;text-align:center;position:relative}
.d-sap .fig,.d-deep .fig{background:#0C1856}
.d-ivory .fig,.d-white .fig{background:#fff}
.fig .n{font-family:'Anton',sans-serif;font-size:clamp(2.2rem,4.6vw,3.4rem);line-height:1;display:block}
.fig .l{font-family:'Barlow Condensed',sans-serif;font-size:clamp(.72rem,.95vw,.85rem);letter-spacing:.15em;text-transform:uppercase;margin-top:.5rem;display:block;font-weight:700}
.d-sap .fig .l,.d-deep .fig .l{color:#C0CCF0}
.d-ivory .fig .l,.d-white .fig .l{color:var(--ink-s)}
.fig::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--elec)}

/* ---------- question stack (the "can you answer this" beat) ---------- */
.qs{list-style:none;margin-top:1.6rem}
.qs li{
  font-family:'Anton',sans-serif;text-transform:uppercase;line-height:1.05;
  font-size:clamp(1.15rem,2.5vw,2rem);padding:.75rem 0;position:relative;padding-left:2.6rem
}
.qs li::before{
  content:"?";position:absolute;left:0;top:.7rem;font-size:.85em;
  font-family:'Anton',sans-serif;color:var(--gold)
}
.d-ivory .qs li,.d-white .qs li{color:#0A1330;border-bottom:1px solid rgba(18,35,92,.12)}
.d-sap .qs li,.d-deep .qs li{color:#fff;border-bottom:1px solid rgba(255,255,255,.14)}
.d-ivory .qs li::before,.d-white .qs li::before{color:var(--bronze)}

/* ---------- outcome ticks ---------- */
.outs{list-style:none;margin-top:1.6rem;display:grid;gap:.7rem}
.outs li{
  position:relative;padding:.55rem 0 .55rem 2.4rem;
  font-size:clamp(1rem,1.6vw,1.28rem);font-weight:600;line-height:1.35
}
.outs li::before{
  content:"✓";position:absolute;left:0;top:.5rem;width:1.5rem;height:1.5rem;
  display:flex;align-items:center;justify-content:center;
  background:var(--ok);color:#fff;font-size:.85rem;font-weight:700;border-radius:50%
}
.d-sap .outs li,.d-deep .outs li{color:#fff}
.d-ivory .outs li,.d-white .outs li{color:#141D3C}
.d-gold .outs li{color:#14100A}
.d-gold .outs li::before{background:#14100A;color:var(--gold)}

/* ---------- split ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.frame{position:relative}
.frame img{width:100%;max-height:58svh;object-fit:cover;border:1px solid rgba(232,185,60,.5)}
.frame::before{content:"";position:absolute;left:-7px;top:0;bottom:0;width:5px;background:var(--elec);z-index:2}

/* ---------- who's in the room chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.chip{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  font-size:clamp(.8rem,1.05vw,.95rem);padding:.55rem 1.05rem;border:1px solid
}
.d-sap .chip,.d-deep .chip{border-color:rgba(232,185,60,.55);color:#fff;background:rgba(232,185,60,.1)}
.d-ivory .chip,.d-white .chip{border-color:rgba(107,78,15,.4);color:var(--ink);background:rgba(232,185,60,.14)}

/* ---------- run of day ---------- */
.run{list-style:none;margin-top:1.4rem;display:grid;gap:.1rem}
.run li{display:flex;gap:1.1rem;align-items:baseline;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.12)}
.d-ivory .run li,.d-white .run li{border-color:rgba(18,35,92,.11)}
.run .t{font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.08em;font-size:clamp(.85rem,1.1vw,1rem);min-width:4.4rem}
.d-sap .run .t,.d-deep .run .t{color:var(--gold)}
.d-ivory .run .t,.d-white .run .t{color:var(--bronze-d)}
.run .d{font-size:clamp(.9rem,1.15vw,1.05rem)}
.run li.k .d{font-weight:700}
.d-ivory .run .d,.d-white .run .d{color:#232C4C}
.d-sap .run .d,.d-deep .run .d{color:#E3EAFD}

/* ---------- ticket / package ---------- */
.tix{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:1.8rem;align-items:stretch}
.tk{background:#fff;border:1px solid rgba(12,22,54,.14);padding:1.5rem 1.3rem;display:flex;flex-direction:column;position:relative;transition:.3s}
.tk::before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:var(--elec)}
.tk:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(12,22,54,.16)}
.tk.best{background:linear-gradient(168deg,var(--sap-x),#0C1856);border-color:var(--gold);box-shadow:0 0 0 2px rgba(232,185,60,.5)}
.tk.best::before{background:linear-gradient(90deg,var(--gold-l),var(--gold))}
.tk.best .tn,.tk.best .pr{color:#fff}
.tk.best .tm{color:var(--gold-l)}
.tk.best li{color:#CFD8F2;border-color:rgba(255,255,255,.14)}
.tk.best .fine{color:#AFBBDF}
.flag{position:absolute;top:0;right:0;background:var(--gold);color:#12100A;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.68rem;letter-spacing:.14em;padding:.26rem .7rem;text-transform:uppercase}
.tn{font-family:'Anton',sans-serif;font-size:clamp(1.05rem,1.5vw,1.28rem);text-transform:uppercase;line-height:1.05;color:var(--ink)}
.tm{font-family:'Barlow Condensed',sans-serif;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-d);font-weight:700;margin-top:.3rem}
.pr{font-family:'Anton',sans-serif;font-size:clamp(1.7rem,2.9vw,2.3rem);margin:.7rem 0 .5rem;line-height:1;color:var(--ink)}
.tk ul{list-style:none;flex:1;margin:.3rem 0 1rem}
.tk li{font-size:clamp(.8rem,1vw,.9rem);padding:.36rem 0 .36rem 1.2rem;position:relative;color:var(--ink-s);border-top:1px solid rgba(18,35,92,.09)}
.tk li:first-child{border-top:none}
.tk li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700;font-size:.78rem}
.tk .fine{margin-top:.7rem}

/* ---------- category chips ---------- */
.cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:rgba(232,185,60,.35);margin-top:1.6rem}
.cat{background:#0C1856;padding:.95rem 1.05rem;position:relative;display:flex;justify-content:space-between;align-items:center;gap:.8rem}
.cat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--elec)}
.cat .nm{font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.05em;color:#fff;text-transform:uppercase;font-size:clamp(.86rem,1.05vw,.98rem);line-height:1.15}
.cat .st{font-family:'Barlow Condensed',sans-serif;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ok);font-weight:700;white-space:nowrap}
.cat.taken{opacity:.5}
.cat.taken .st{color:var(--pale-s)}
.cat.taken::before{background:var(--pale-s)}

/* ---------- form (exhibitor) ---------- */
.form{background:#fff;border:1px solid rgba(12,22,54,.14);padding:1.5rem;box-shadow:0 10px 34px rgba(12,22,54,.1);max-height:74svh;overflow-y:auto}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.f{display:flex;flex-direction:column;gap:.3rem}
.f.full{grid-column:1/-1}
.f label{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-s)}
.f input,.f select,.f textarea{font-family:'Inter',sans-serif;font-size:.95rem;font-weight:500;padding:.65rem .75rem;border:1px solid rgba(12,22,54,.22);background:var(--cream);color:var(--ink);width:100%}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--elec);box-shadow:0 0 0 3px rgba(30,77,255,.14)}
.f textarea{min-height:70px;resize:vertical}
.chk{display:flex;gap:.6rem;align-items:flex-start;grid-column:1/-1;margin-top:.2rem}
.chk input{width:auto;margin-top:.2rem}
.chk span{font-size:.82rem;color:var(--ink-s)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(24px);transition:opacity .65s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1)}
.panel.seen .rv{opacity:1;transform:none}
.panel.seen .rv:nth-child(2){transition-delay:.07s}
.panel.seen .rv:nth-child(3){transition-delay:.14s}
.panel.seen .rv:nth-child(4){transition-delay:.21s}
.panel.seen .rv:nth-child(5){transition-delay:.28s}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- mobile sticky CTA ---------- */
.mob{
  position:fixed;bottom:0;left:0;right:0;z-index:280;display:none;gap:.45rem;padding:.55rem;
  background:rgba(6,13,56,.97);border-top:1px solid rgba(232,185,60,.45)
}
.mob .btn{flex:1;padding:.75rem .4rem;font-size:.82rem}

.swipe{display:none}
.mobonly{display:none}

/* ---------- responsive ---------- */
@media(max-width:860px){
  .split{grid-template-columns:1fr;gap:1.1rem}
  .frame img{max-height:20svh}

  /* Card rows become a swipeable strip so a panel always fits one screen. */
  .tix,.trio{
    display:flex;overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    gap:.75rem;margin:1.3rem -6vw 0;padding:.2rem 6vw .4rem;
    scrollbar-width:none;-ms-overflow-style:none;
  }
  .tix::-webkit-scrollbar,.trio::-webkit-scrollbar{display:none;height:0}
  .tix>*,.trio>*{flex:0 0 76vw;scroll-snap-align:center}
  .swipe{
    display:block;margin-top:.7rem;font-family:'Barlow Condensed',sans-serif;
    font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.7rem;opacity:.75
  }
  .cdbar .go{display:none}
  .cdbar .lbl{font-size:.68rem;letter-spacing:.08em}
  .cdbar .units{gap:.5rem}
  .cdbar .n{font-size:.98rem}
  .cdbar .t{font-size:.58rem}
  .mob{display:flex}
  .panel{padding:calc(var(--bar) + 3.6rem) 0 4.6rem}
  .fgrid{grid-template-columns:1fr}
  .form{max-height:56svh}

  /* Invoice panel: the form is the job on mobile, so the long
     reassurance list collapses to one line and the panel still fits. */
  .p-form .outs,.p-form .lede{display:none}
  .p-form .mobonly{
    display:block;font-size:.92rem;line-height:1.45;color:var(--ink-s);margin-top:.5rem
  }
  .p-form .split{gap:.7rem}
  .p-form h2{font-size:clamp(1.5rem,6.4vw,2rem)}
}
@media(max-width:520px){
  .cdbar .u:nth-child(4){display:none}
  .trio{gap:.7rem}
  .tcard{padding:1.05rem .95rem}
}
/* very short screens: let a dense panel scroll internally rather than clip */
@media(max-height:620px){
  .deck{scroll-snap-type:none}
  .panel{height:auto;min-height:auto;flex:0 0 auto;padding:calc(var(--bar) + 2.2rem) 0 3rem}
}
@media print{
  html,body{height:auto;overflow:visible}
  .deck{height:auto;overflow:visible;scroll-snap-type:none}
  .cdbar,.dots,.pgn,.hint,.mob,.mark{display:none}
  .panel{height:auto;min-height:auto;flex:0 0 auto;page-break-after:always}
  .rv{opacity:1;transform:none}
}

/* ===== WordPress integration ===== */
body.wex-page{margin:0;padding:0}
body.admin-bar .deck{height:calc(100dvh - 32px)}
@media screen and (max-width:782px){body.admin-bar .deck{height:calc(100dvh - 46px)}}
body.admin-bar .cdbar{top:32px}
@media screen and (max-width:782px){body.admin-bar .cdbar{top:46px}}
.tk.gone{opacity:.55}
.tk.gone::before{background:#A6B4E0}
.flag.flag-out{background:#8A94B8;color:#fff}
.btn.is-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}

/* ===== generic content page (privacy notice, terms, etc) ===== */
body.wex-page .wex-doc{
  min-height:100dvh;overflow-y:auto;
  background:linear-gradient(160deg,#FFFEFA 0%,#FFFCF5 55%,#FBF4E4 100%);
  padding:clamp(3rem,8vw,6rem) 0;
}
.wex-doc-in{max-width:760px;margin:0 auto;padding:0 6vw}
.wex-doc-in h1{
  font-family:'Anton',Impact,sans-serif;text-transform:uppercase;
  font-size:clamp(1.9rem,4.6vw,3.2rem);line-height:.98;color:#0A1330;margin-bottom:1.4rem
}
.wex-doc-body{color:#2A3555;font-size:1.05rem;line-height:1.7}
.wex-doc-body h2,.wex-doc-body h3{
  font-family:'Anton',Impact,sans-serif;text-transform:uppercase;
  color:#0A1330;margin:2rem 0 .7rem;line-height:1.1
}
.wex-doc-body h2{font-size:1.5rem}
.wex-doc-body h3{font-size:1.2rem}
.wex-doc-body p{margin-bottom:1rem}
.wex-doc-body ul,.wex-doc-body ol{margin:0 0 1rem 1.3rem}
.wex-doc-body li{margin-bottom:.4rem}
.wex-doc-body a{color:#1E4DFF;text-decoration:underline}
.wex-doc-back{margin-top:2.5rem}
.wex-doc-back a{
  font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#6B4E0F
}
/* the generic page scrolls normally, unlike the decks */
body.wex-page:has(.wex-doc){overflow:auto}