/* ============================================================================
   dCover — pre-launch landing v2 (/fly) — PROTOTYPE. Design proposal, not product code.
   Tokens copied unchanged from public/theme.css.

   SPACING LADDER: 8 · 16 · 24 · 32 · 40 · 48 · 56 · 64 · 80 · 96 · 128 px.
   4 px only for fine detail inside a component. Line heights on a 4 px step.

   TYPE: hook (h1/h2) 28/40 phone · 40/56 laptop (hero 56/72) — Tiro Bangla 400, Figtree 700 in English
         answer 18/28 phone · 20/32 laptop     title 18/28 600     body 16/28 (en 16/24)     small 14/24 (en 14/20)

   DEPTH — by role, three levels only:
     flat    the page, text
     object  things you could pick up (pass, board, prints, card, phones): an 8 px solid edge + one soft shadow, tilted
     lifted  the two forms — the only places you type
   RED: the logo and the one action on screen.
   ========================================================================== */
@font-face{font-family:"Figtree";font-style:normal;font-weight:400 700;font-display:swap;src:url("assets/fonts/Figtree-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans Bengali";font-style:normal;font-weight:400 700;font-display:swap;src:url("assets/fonts/NotoSansBengali-bn.woff2") format("woff2");
  unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0-1CF9,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"Tiro Bangla";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/TiroBangla-bengali.woff2") format("woff2");
  unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0-1CF9,U+200C-200D,U+20B9,U+25CC,U+A8F1}

:root{
  --accent:#d71921; --accent-ink:#fff;
  --bg:#f3f6fb; --surface:#fff; --surface-2:#f6f7f9; --chip:#eef0f2;
  --ink:#121316; --text:#1e2328; --ink-2:#5e636b; --hair:#e3e6ea; --hair-2:#c9cdd3;
  --focus-ring:#121316; --field-edge:#767c85;
  --lifted:0 1px 2px rgba(18,19,22,.06),0 4px 14px rgba(18,19,22,.10),0 24px 48px -16px rgba(18,19,22,.16);
  --edge:#c9cdd3; --obj-soft:0 32px 48px -16px rgba(18,19,22,.32);
  --board:#121316; --board-edge:#2c2f35; --board-2:#a3a8b0; --board-line:#2c2f35; --board-tile:#26292f;
  --sans:"Figtree","Noto Sans Bengali",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --display:"Tiro Bangla","Figtree","Noto Sans Bengali",sans-serif;
}
:root[data-theme="dark"]{
  --bg:#121316; --surface:#1b1d22; --surface-2:#212329; --chip:#2a2d33;
  --ink:#fff; --text:#e9ebee; --ink-2:#a3a8b0; --hair:#2c2f35; --hair-2:#454951;
  --focus-ring:#fff; --field-edge:#7a8089;
  --lifted:0 0 0 1px #2c2f35,0 24px 48px -16px rgba(0,0,0,.6);
  --edge:#454951; --obj-soft:0 32px 48px -16px rgba(0,0,0,.72);
  --board:#1b1d22; --board-edge:#454951; --board-line:#2c2f35; --board-tile:#2a2d33;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:28px;overflow-x:hidden}
:root[data-lang="en"] body{line-height:24px}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
img{display:block;max-width:100%;height:auto}
a{color:var(--ink)}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
[hidden]{display:none!important}
.wrap{max-width:1440px;margin:0 auto;padding-inline:16px}
@media (min-width:600px){.wrap{padding-inline:32px}}
@media (min-width:1024px){.wrap{padding-inline:48px}}
@media (min-width:1280px){.wrap{padding-inline:96px}}

/* type */
.hook{font-family:var(--display);font-weight:400;font-size:28px;line-height:40px;color:var(--ink)}
:root[data-lang="en"] .hook{font-family:var(--sans);font-weight:700;line-height:36px;letter-spacing:-.02em}
.ans{font-size:18px;line-height:28px;color:var(--text);margin-top:8px}
.t3{font-size:18px;line-height:28px;font-weight:600;color:var(--ink)}
.sm{font-size:14px;line-height:24px}
:root[data-lang="en"] .sm{line-height:20px}
.mute{color:var(--ink-2)}
.fig{font-family:"Figtree",sans-serif}
@media (min-width:1024px){
  .hook{font-size:40px;line-height:56px}
  :root[data-lang="en"] .hook{line-height:48px}
  .hero .hook{font-size:56px;line-height:72px}
  :root[data-lang="en"] .hero .hook{line-height:64px}
  .ans{font-size:20px;line-height:32px;margin-top:16px}
}

/* prototype bar (not product) */
.proto{background:#121316;color:#fff;font-size:14px;line-height:24px}
.proto .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-block:8px}
.proto b{font-weight:600;flex:1}
.proto button{min-height:32px;padding:4px 16px;border:1px solid #454951;border-radius:8px;background:transparent;color:#fff;cursor:pointer}
.proto [aria-pressed="true"]{background:#fff;color:#121316}
:root[data-chrome="0"] .proto{display:none}

/* header */
.bar{background:var(--surface);border-bottom:1px solid var(--hair);position:relative;z-index:5}
.bar .wrap{display:flex;align-items:center;gap:8px;height:56px}
.logo{display:inline-flex;align-items:center;min-height:48px}
.logo img{height:24px;width:auto}
.logo .d{display:none}
:root[data-theme="dark"] .logo .l{display:none}
:root[data-theme="dark"] .logo .d{display:block}
.bar .sp{flex:1}
.bar .tel{display:none}
.linkbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;min-width:48px;padding:0 16px;border:0;border-radius:8px;background:transparent;color:var(--ink);font-weight:600;cursor:pointer;text-decoration:none}
.linkbtn:hover{background:var(--chip)}
.linkbtn svg{width:24px;height:24px}
@media (min-width:1024px){.bar .wrap{height:72px}.logo img{height:32px}.bar .tel{display:inline-flex}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:8px 24px;border:1px solid var(--field-edge);border-radius:8px;background:var(--surface);color:var(--ink);font-size:16px;line-height:24px;font-weight:600;text-decoration:none;cursor:pointer}
.btn svg{width:24px;height:24px;flex:none}
.btn.go{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);font-weight:700}
.btn.go:hover{filter:brightness(.94)}
.btn.ink{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.btn.block{display:flex;width:100%}
.btn[aria-busy="true"]{opacity:.72;pointer-events:none}
.cta{margin-top:24px}
@media (min-width:1024px){.cta{margin-top:32px}}

/* airline logo tiles — always on white, the way the logos were drawn */
.al{display:block;width:48px;height:48px;border-radius:8px;background:#fff;border:1px solid #e3e6ea;overflow:hidden;flex:none}
.al img{width:100%;height:100%}
.strip{display:flex;align-items:center;gap:8px;margin-top:16px}
.strip .al{width:40px;height:40px}
.strip .lbl{margin-inline-start:8px;color:var(--ink-2)}

/* forms (lifted) */
.card{background:var(--surface);border-radius:24px;box-shadow:var(--lifted);padding:16px;position:relative}
@media (min-width:600px){.card{padding:32px}}
.card-h{margin-bottom:16px}
.fgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.fgrid .cell{grid-column:span 3;min-width:0;position:relative}
.fgrid .full{grid-column:1/-1}
.fgrid .w4{grid-column:span 4}.fgrid .w2{grid-column:span 2}
@media (min-width:600px){.fgrid{gap:16px}.fgrid .w4,.fgrid .w2{grid-column:span 3}}
.fld{display:flex;flex-direction:column;justify-content:center;height:64px;padding:8px 16px;border:1px solid var(--field-edge);border-radius:8px;background:var(--surface);cursor:text}
.fld .k{font-size:14px;line-height:20px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fld .v{display:block;width:100%;height:24px;padding:0;margin:0;border:0;border-radius:0;outline:0;background:transparent;color:var(--ink);font-size:16px;line-height:24px;font-weight:600;min-width:0}
.fld .v::placeholder{color:var(--ink-2);font-weight:400;opacity:1}
.fld select.v{appearance:none;-webkit-appearance:none;cursor:pointer;padding-inline-end:24px;background:no-repeat right center/16px 16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23767c85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E")}
.fld select.v option{color:#121316;background:#fff}
.fld:focus-within{outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--ink)}
.cell.bad .fld{border:2px solid var(--ink)}
.err{display:none;margin-top:8px;padding:8px 16px;border-inline-start:4px solid var(--ink);background:var(--chip);border-radius:4px;color:var(--ink);font-size:14px;line-height:24px;font-weight:600}
.cell.bad .err{display:block}
.err::before{content:"\26A0\FE0E  "}
.hint{display:grid;grid-template-columns:24px 1fr;gap:8px;margin-top:8px;color:var(--text)}
.hint svg{width:24px;height:24px;color:var(--ink)}
.hint b{color:var(--ink);font-weight:600}
.trap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.exact{display:none}.exact.on{display:contents}
.actions{display:grid;gap:8px;margin-top:16px}
.fine{margin-top:8px;color:var(--ink-2)}
/* the site's airport list: code tile · city · country / airport name */
.ac{display:none;position:absolute;z-index:30;top:72px;left:0;width:min(326px,calc(100vw - 64px));max-height:320px;overflow:auto;background:var(--surface);border:1px solid var(--hair-2);border-radius:8px;box-shadow:0 16px 32px -8px rgba(18,19,22,.32);padding:8px}
.ac.open{display:block}
.cell.r .ac{left:auto;right:0}
.ac-head{padding:8px;font-size:14px;line-height:20px;color:var(--ink-2)}
.ac-item{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:center;width:100%;min-height:56px;padding:8px;border:0;border-radius:8px;background:transparent;text-align:start;cursor:pointer}
.ac-item:hover,.ac-item.on{background:var(--chip)}
.ac-item .code{display:grid;place-items:center;height:32px;border-radius:4px;background:var(--ink);color:var(--surface);font-family:"Figtree",sans-serif;font-size:14px;font-weight:700;letter-spacing:.04em}
.ac-item .t1{display:block;font-weight:600;color:var(--ink);font-size:16px;line-height:24px}
.ac-item .t2{display:block;font-size:14px;line-height:20px;color:var(--ink-2)}
.ac-empty{padding:8px;font-size:14px;line-height:24px}
@media (min-width:600px){.ac{width:360px}}
/* yes / no */
.seg{border:0;padding:0;margin:0;min-width:0}
.seg legend{padding:0;font-size:14px;line-height:20px;color:var(--ink-2);margin-bottom:8px}
.seg div{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg label{display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid var(--field-edge);border-radius:8px;font-weight:600;color:var(--ink);cursor:pointer}
.seg input{position:absolute;opacity:0;margin:0}
.seg input:checked+span{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;border-radius:8px;background:var(--ink);color:var(--surface)}
.seg label:focus-within{outline:2px solid var(--focus-ring);outline-offset:2px}
/* confirmation */
.done-h{display:flex;gap:16px;align-items:flex-start}
.tick{flex:none;width:48px;height:48px;border-radius:50%;background:var(--ink);color:var(--surface);display:grid;place-items:center}
.tick svg{width:24px;height:24px}
.slip{margin-top:16px;padding:16px;border-radius:8px;background:var(--surface-2);border:1px dashed var(--hair-2)}
.slip dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px}
.slip dt{color:var(--ink-2);font-size:14px;line-height:24px}
.slip dd{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.next{margin-top:16px;display:grid;gap:8px;counter-reset:n}
.next li{display:grid;grid-template-columns:32px 1fr;gap:16px;align-items:center;counter-increment:n}
.next li::before{content:counter(n);width:32px;height:32px;border-radius:50%;border:1px solid var(--field-edge);display:grid;place-items:center;font-family:"Figtree",sans-serif;font-weight:700;font-size:14px;line-height:1;color:var(--ink)}

/* sections */
.sec{padding-block:64px}
.sec.white{background:var(--surface);border-block:1px solid var(--hair)}
.sec .wrap{display:grid;gap:40px}
.sec .txt{max-width:560px}
.vis{position:relative;min-width:0}
@media (min-width:1024px){
  .sec{padding-block:128px}
  .sec .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:96px;align-items:center}
  .sec.flip .txt{order:2}
}

/* flap tiles */
.flap{display:inline-block;padding:4px 8px;border-radius:4px;background:var(--ink);color:var(--surface);font-family:"Figtree",sans-serif;font-size:14px;line-height:24px;font-weight:700;letter-spacing:.04em}

/* ---- a. hero ---- */
.hero{padding-block:16px 64px}
.hero .wrap{display:grid;gap:24px}
.hero .passbox{display:none}
@media (min-width:1024px){
  .hero{padding-block:64px 128px}
  .hero .wrap{grid-template-columns:minmax(0,1fr) 416px;column-gap:64px;align-items:start}
  .hero .strip{margin-top:32px}
  .hero .strip .al{width:48px;height:48px}
  .hero .passbox{display:block;margin-top:64px;padding-inline:16px 48px;perspective:1600px}
}
@media (min-width:1280px){.hero .wrap{grid-template-columns:minmax(0,1fr) 480px;column-gap:96px}}
/* OBJECT: the boarding pass */
.pass3d{position:relative;transform:rotateX(12deg) rotateY(-14deg) rotateZ(3deg);transform-style:preserve-3d;max-width:560px}
.pass-back{position:absolute;inset:0;border-radius:16px;background:var(--board);border:1px solid var(--board-line);transform:translate(40px,32px) rotate(5deg)}
.pass-sh{position:relative;filter:drop-shadow(0 8px 0 var(--edge)) drop-shadow(0 32px 24px rgba(18,19,22,.28))}
.pass{display:grid;grid-template-columns:1fr 128px;background:var(--surface);border-radius:16px;
  -webkit-mask:radial-gradient(circle at calc(100% - 128px) 0,transparent 12px,#000 13px) top/100% 51% no-repeat,radial-gradient(circle at calc(100% - 128px) 100%,transparent 12px,#000 13px) bottom/100% 51% no-repeat;
  mask:radial-gradient(circle at calc(100% - 128px) 0,transparent 12px,#000 13px) top/100% 51% no-repeat,radial-gradient(circle at calc(100% - 128px) 100%,transparent 12px,#000 13px) bottom/100% 51% no-repeat}
.pass-main{padding:24px}
.pass-top{display:flex;justify-content:space-between;align-items:center;color:var(--ink-2);font-size:14px;line-height:24px;letter-spacing:.08em}
.pass-top img{height:24px}
.pass-route{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;margin-top:24px}
.pass-route b{display:block;font-family:"Figtree",sans-serif;font-weight:700;font-size:48px;line-height:48px;color:var(--ink);letter-spacing:-.02em}
.pass-route span{font-size:14px;line-height:24px;color:var(--ink-2)}
.pass-route .ln{height:24px;color:var(--ink);display:grid;grid-template-columns:1fr 24px 1fr;align-items:center}
.pass-route .ln::before,.pass-route .ln::after{content:"";border-top:2px dashed var(--hair-2)}
.pass-route .ln svg{width:24px;height:24px}
.pass-f{display:grid;grid-template-columns:repeat(3,auto);justify-content:space-between;gap:16px;margin-top:24px;padding-top:16px;border-top:1px solid var(--hair)}
.pass-f dt{font-size:14px;line-height:20px;color:var(--ink-2)}
.pass-f dd{font-weight:600;color:var(--ink)}
.pass-stub{padding:24px 16px;border-inline-start:2px dashed var(--hair-2);display:grid;gap:16px;align-content:space-between;justify-items:center}
.pass-stub .als{display:grid;grid-template-columns:40px 40px;gap:8px}
.pass-stub .al{width:40px;height:40px}
.bars{width:96px;height:40px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 8px,transparent 8px 10px,var(--ink) 10px 11px,transparent 11px 16px)}

/* ---- b. OBJECT: the departures board with the airline wall ---- */
.vis.p{perspective:1600px}
.dboard{background:var(--board);color:#fff;border-radius:16px;padding:16px;border:1px solid var(--board-line);box-shadow:0 8px 0 var(--board-edge),var(--obj-soft)}
.db-top{display:flex;justify-content:space-between;font-size:14px;line-height:24px;color:var(--board-2);padding:0 8px 16px;letter-spacing:.04em}
.db-top b{color:#fff;font-family:"Figtree",sans-serif}
.db-row{display:grid;grid-template-columns:56px 1fr auto;gap:16px;align-items:center;padding:8px;border-top:1px solid var(--board-line)}
.db-row .al{width:56px;height:56px;border:0}
.db-row .nm{font-weight:600;font-size:18px;line-height:28px;min-width:0}
.db-row .st{display:block;font-size:14px;line-height:20px;color:var(--board-2);font-weight:400}
.db-row .to{display:flex;gap:4px}
.db-row .to i{font-style:normal;display:grid;place-items:center;width:24px;height:32px;border-radius:4px;background:var(--board-tile);font-family:"Figtree",sans-serif;font-weight:700;font-size:16px}
.db-sub{padding:16px 8px 8px;font-size:14px;line-height:24px;color:var(--board-2);border-top:1px solid var(--board-line);letter-spacing:.04em}
.foot-note{margin-top:16px;color:var(--ink-2)}
@media (min-width:1024px){.dboard{padding:24px;transform:rotateY(12deg) rotateX(4deg) rotateZ(-1deg)}.db-row .al{width:64px;height:64px}.db-row{grid-template-columns:64px 1fr auto;gap:24px}.db-row .to i{width:32px;height:40px;font-size:20px}}

/* ---- c. OBJECT: two prints and a connection tag ---- */
.prints{position:relative;height:320px;max-width:560px}
.print{position:absolute;border:8px solid #fff;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 8px 0 var(--edge),var(--obj-soft)}
:root[data-theme="dark"] .print{border-color:#e9ebee;background:#e9ebee}
.print img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.print.p1{left:0;top:0;width:56%;height:272px;transform:rotate(-5deg)}
.print.p2{right:0;top:48px;width:56%;height:240px;transform:rotate(4deg)}
.tag{position:absolute;left:16px;bottom:0;display:flex;align-items:center;gap:8px;padding:8px 16px 8px 8px;border-radius:8px;background:var(--surface);box-shadow:0 4px 0 var(--edge),0 16px 24px -8px rgba(18,19,22,.4);transform:rotate(-2deg);font-weight:600;color:var(--ink)}
.tag .al{width:40px;height:40px}
.tag .flap{margin-inline:4px}
@media (min-width:1024px){.prints{height:480px}.print.p1{height:400px}.print.p2{height:360px;top:96px}.tag{left:32px;bottom:8px}}

/* ---- d. umrah ---- */
.umrah .wrap{gap:0}
.umrah .txt{margin-bottom:32px}
.um-ph{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/3;box-shadow:var(--obj-soft)}
.um-ph img{width:100%;height:100%;object-fit:cover}
.um-form{margin:-64px 8px 0;z-index:2}
@media (min-width:1024px){
  .umrah .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0;align-items:center}
  .umrah .txt{grid-column:1/-1;margin-bottom:48px;max-width:720px}
  .um-ph{aspect-ratio:auto;height:640px}
  .um-form{margin:0 0 0 -128px}
}

/* ---- e. OBJECT: the visiting card ---- */
.cards{position:relative;height:272px;max-width:480px;perspective:1600px}
.vc{position:absolute;left:0;top:16px;width:88%;aspect-ratio:7/4;border-radius:16px;padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.vc.back{background:var(--board);border:1px solid var(--board-line);transform:translate(32px,24px) rotate(6deg);align-items:flex-end;justify-content:flex-end}
.vc.back img{height:48px}
.vc.front{background:var(--surface);box-shadow:0 8px 0 var(--edge),var(--obj-soft);transform:rotate(-4deg);color:var(--ink)}
.vc.front img{height:24px;align-self:flex-start}
.vc .ad{font-weight:600}
.vc .pin{display:flex;gap:8px;align-items:flex-start}
.vc .pin svg{width:24px;height:24px;flex:none;color:var(--accent)}
.contact{margin-top:24px;display:grid;gap:8px;max-width:480px}
.contact a{display:grid;grid-template-columns:24px 1fr;gap:16px;align-items:center;min-height:56px;padding:8px 16px;border-radius:8px;border:1px solid var(--hair-2);background:var(--surface);text-decoration:none;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.contact svg{width:24px;height:24px}
@media (min-width:1024px){.cards{height:352px}.vc{padding:32px}.vc.front img{height:32px}.vc.front{transform:rotateX(10deg) rotateY(14deg) rotateZ(-4deg)}}

/* ---- f. the face ---- */
.face{background:#121316;color:#fff;overflow:hidden}
.face .wrap{display:grid;gap:0;align-items:end}
.face .txt{padding-block:64px 32px}
.face .hook{color:#fff}
.face .who{margin-top:24px;display:grid;gap:8px}
.face .nm{font-family:"Figtree","Noto Sans Bengali",sans-serif;font-weight:700;font-size:28px;line-height:40px}
.face .ln{color:#c9cdd3;max-width:480px}
.face .btn{background:#fff;border-color:#fff;color:#121316}
.face .pic{justify-self:center;width:100%;max-width:400px;aspect-ratio:1;position:relative}
.face .pic img{width:100%;height:100%;object-fit:cover}
.face .pic::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 32px 32px #121316}
@media (min-width:1024px){
  .face .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px}
  .face .txt{padding-block:128px;order:2;align-self:center}
  .face .pic{max-width:640px;justify-self:start;margin-top:48px}
  .face .nm{font-size:40px;line-height:56px}
}

/* ---- g. OBJECT: two phones ---- */
.phones{position:relative;height:480px;perspective:1600px;max-width:480px;margin-inline:auto;width:100%}
.ph{position:absolute;width:200px;border-radius:32px;padding:8px;background:#121316;border:1px solid #454951;box-shadow:8px 8px 0 -1px #2c2f35,var(--obj-soft)}
.ph .scr{border-radius:24px;overflow:hidden;padding-top:24px;background:#fff}
.ph.and .scr{background:#1b1d22}
.ph img{width:100%}
.ph::before{content:"";position:absolute;top:16px;left:50%;background:#121316;z-index:1}
.ph.ios::before{width:56px;height:16px;border-radius:8px;margin-left:-28px}
.ph.and::before{width:8px;height:8px;border-radius:50%;margin-left:-4px;top:20px}
.ph.ios{left:0;top:0;transform:rotateY(18deg) rotateX(4deg) rotateZ(-3deg);z-index:2}
.ph.and{right:0;top:32px;transform:rotateY(-18deg) rotateX(4deg) rotateZ(3deg)}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:8px 24px;border-radius:8px;border:1px dashed var(--field-edge);color:var(--ink);font-weight:600}
.pill small{font-size:14px;font-weight:400;color:var(--ink-2)}
@media (min-width:1024px){.phones{height:640px;max-width:560px}.ph{width:264px;border-radius:40px}.ph .scr{border-radius:32px}.ph.and{top:48px}}

/* footer + phone bottom bar */
.foot{border-top:1px solid var(--hair);background:var(--surface)}
.foot .wrap{padding-block:32px;display:grid;gap:8px}
.foot nav{display:flex;gap:8px}
.foot nav a{display:inline-flex;align-items:center;min-height:48px;padding-inline-end:16px}
.thumb{position:fixed;inset:auto 0 0 0;z-index:20;display:grid;grid-template-columns:1fr 56px;gap:8px;padding:8px 16px;padding-bottom:calc(8px + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--hair);transform:translateY(100%);transition:transform .2s ease}
.thumb.on{transform:none}
.thumb .wa{padding:0}
@media (max-width:1023px){body{padding-bottom:72px}}
@media (min-width:1024px){.thumb{display:none}}
@media (prefers-reduced-motion:reduce){.thumb{transition:none}}
dialog.sheet{border:0;padding:0;border-radius:24px 24px 0 0;background:var(--surface);color:var(--text);width:100%;max-width:560px;margin:auto auto 0}
dialog.sheet::backdrop{background:rgba(18,19,22,.56)}
.sheet-in{padding:24px 16px;display:grid;gap:16px}
.bubble{padding:16px;border-radius:16px 16px 4px 16px;background:var(--chip);color:var(--ink);white-space:pre-line}
@media (min-width:600px){dialog.sheet{border-radius:24px;margin:auto}.sheet-in{padding:32px}}

/* ===================== v3 ===================== */
/* a. hero: headline + pass on top, then the master site's search box (same parts, same order), then the contact row */
.hero .wrap{display:block}
.hero .top{display:grid;gap:24px}
.hero .card{margin-top:24px}
.qrow{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.qtabs{display:flex;gap:8px}
.qtabs button{min-height:48px;padding:8px 24px;border:0;border-bottom:4px solid transparent;border-radius:8px;background:transparent;font-weight:600;color:var(--ink-2);cursor:pointer}
.qtabs button[aria-pressed="true"]{background:var(--chip);color:var(--ink);border-bottom-color:var(--ink)}
.sbox{display:grid;gap:8px}
.places{position:relative;display:grid;gap:8px}
.cell{min-width:0;position:relative}
button.fld{width:100%;text-align:start;cursor:pointer;font:inherit}
.fld .v.none{color:var(--ink-2);font-weight:400}
.fld .v{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.swap{position:absolute;right:16px;top:44px;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid var(--field-edge);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer;z-index:1}
.swap svg{width:24px;height:24px}
.swap .sw-h{display:none}
.quiet{display:inline-flex;align-items:center;gap:8px;min-height:48px;color:var(--text);cursor:pointer}
.quiet input{width:24px;height:24px;margin:0;accent-color:var(--ink)}
.crow{display:grid;gap:8px;margin-top:8px}
.under{display:grid;gap:8px;margin-top:8px}
@media (min-width:1024px){
  .hero{padding-block:48px 128px}
  .hero .top{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
  .hero .passbox{margin-top:0;padding-inline:32px 48px}
  .hero .card{margin-top:64px}
  .qrow{margin-bottom:16px}
  .sbox{grid-template-columns:minmax(0,2.4fr) minmax(0,1.2fr) minmax(0,1fr)}
  .places{grid-template-columns:1fr 1fr}
  .places .cell+.swap+.cell .fld{padding-inline-start:40px}
  .swap{right:auto;left:50%;margin-left:-24px;top:8px}
  .swap .sw-v{display:none}.swap .sw-h{display:block}
  #fare{position:relative}
  #fare .quiet{position:absolute;top:0;right:0}
  .crow{grid-template-columns:1fr 1fr 1fr 256px;align-items:start;margin-top:16px;column-gap:8px;row-gap:8px}
  .crow .cell[data-f="whatsapp"]{grid-column:3;grid-row:1 / span 2}
  .crow .c-go{grid-column:4;grid-row:1}
  .crow .c-go .btn{min-height:64px}
  .crow .c-wa{grid-column:4;grid-row:2}
  .crow .c-note{grid-column:1 / span 2;grid-row:2;align-self:center}
  .under{grid-template-columns:1fr auto;align-items:center;margin-top:16px}
}
/* sheets used by the search box */
.sheet .ac{display:block;position:static;width:auto;max-height:none;border:0;box-shadow:none;padding:0}
.sheet .ac-item{grid-template-columns:48px 1fr}
.sheet-in .fgrid{gap:8px}
.step{display:grid;grid-template-columns:1fr 48px 32px 48px;gap:8px;align-items:center;min-height:64px;border-bottom:1px solid var(--hair)}
.step b{display:block;color:var(--ink);font-weight:600}
.step small{font-size:14px;line-height:20px;color:var(--ink-2)}
.step button{width:48px;height:48px;padding:0;border-radius:50%;border:1px solid var(--field-edge);background:var(--surface);font-size:24px;line-height:1;cursor:pointer;color:var(--ink)}
.step button:disabled{opacity:.4;cursor:default}
.step output{text-align:center;font-family:"Figtree",sans-serif;font-weight:700;font-size:18px;color:var(--ink)}

/* the $1 band — small and sincere */
.give{background:var(--surface);border-block:1px solid var(--hair)}
.give .wrap{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:center;padding-block:32px}
.give .one{display:grid;place-items:center;width:56px;height:56px;border-radius:8px;background:var(--ink);color:var(--surface);font-family:"Figtree",sans-serif;font-weight:700;font-size:24px;line-height:1}
@media (min-width:1024px){.give .wrap{padding-block:48px;gap:24px}}

/* h. partners */
.partner .kick{display:inline-block;margin-bottom:16px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.chipx{padding:8px 16px;border-radius:8px;background:var(--chip);color:var(--ink);font-weight:600;font-size:14px;line-height:24px}
.chipx.later{background:transparent;border:1px dashed var(--field-edge)}
/* OBJECT: the partner's own site */
.win{max-width:400px;margin-top:48px;border-radius:16px;background:var(--surface);box-shadow:0 8px 0 var(--edge),var(--obj-soft);overflow:hidden;transform:rotate(-3deg)}
.win-bar{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--chip);color:var(--ink-2);font-size:14px;line-height:24px}
.win-bar i{width:8px;height:8px;border-radius:50%;background:var(--hair-2)}
.win-bar span{margin-inline-start:8px}
.win-body{padding:24px;display:grid;gap:16px}
.win-body img{height:24px}
.ccard{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:center;padding:16px;border-radius:8px;border:1px solid var(--hair-2)}
.ccard .av{width:48px;height:48px;border-radius:50%;background:var(--chip);display:grid;place-items:center;color:var(--ink-2)}
.ccard .av svg{width:24px;height:24px}
.ccard small{display:block;font-size:14px;line-height:20px;color:var(--ink-2)}
.ccard b{color:var(--ink)}
.partner .card{margin-top:8px}
.more{display:inline-flex;align-items:center;min-height:48px;margin-top:8px}
@media (min-width:1024px){.partner .wrap{grid-template-columns:minmax(0,1fr) 480px;align-items:start}.partner .card{margin-top:0}}

/* ===================== v4 — four real pages, one system ===================== */
/* rhythm: every section 64 phone / 96 laptop. one two-column grid: 1fr 1fr, gap 64; a form column is always 480. */
@media (min-width:1024px){.sec{padding-block:96px}.sec .wrap{gap:64px}.hero{padding-block:48px 96px}}
.hook{text-wrap:balance;padding-inline-end:8px}
/* header */
.bar .wrap{gap:8px}
.nav{display:none}
.nav a{display:inline-flex;align-items:center;min-height:48px;padding:0 16px;border-radius:8px;color:var(--ink-2);font-weight:600;text-decoration:none;border-bottom:4px solid transparent;border-top:4px solid transparent}
.nav a:hover{color:var(--ink);background:var(--chip)}
.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--ink);border-radius:8px 8px 0 0}
.bar .lang{display:none}
.menubtn{display:inline-flex}
@media (min-width:1024px){.nav{display:flex;gap:8px;margin-inline-start:32px}.bar .lang{display:inline-flex}.menubtn{display:none}}
/* phone menu (sheet) */
.menu a.row{display:grid;grid-template-columns:1fr 24px;align-items:center;min-height:64px;padding:8px 16px;border-radius:8px;border:1px solid var(--hair-2);text-decoration:none;color:var(--ink);font-weight:600;font-size:18px;line-height:28px}
.menu a.row small{display:block;font-size:14px;line-height:20px;font-weight:400;color:var(--ink-2)}
.menu a.row[aria-current="page"]{border:2px solid var(--ink);background:var(--chip)}
.menu a.row svg{width:24px;height:24px}
.menu .rows{display:grid;gap:8px}
/* inner-page hero: text + visual on the left, the form (always 480) on the right */
.phero{padding-block:24px 64px}
.phero .wrap{display:grid;gap:32px}
.phero .card{align-self:start}
.phero .vis{margin-top:32px}
@media (min-width:1024px){.phero{padding-block:64px 96px}.phero .wrap{grid-template-columns:minmax(0,1fr) 480px;gap:64px;align-items:start}.phero .vis{margin-top:48px}}
.fee{margin-top:16px;padding:8px 16px;border-inline-start:4px solid var(--ink);background:var(--chip);border-radius:4px;color:var(--ink);font-weight:600}
.feeline{color:var(--ink);font-weight:600}
.photo{border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:var(--chip)}
.photo img{width:100%;height:100%;object-fit:cover}
/* ruled lists (doors, who-does-what, locations) — lines, not boxes */
.ledger{border-top:4px solid var(--ink)}
.ledger>li,.ledger>a{display:grid;grid-template-columns:1fr 24px;gap:16px;align-items:center;padding-block:16px;border-bottom:1px solid var(--hair-2);text-decoration:none;color:var(--text);min-height:64px}
.ledger b{display:block;color:var(--ink);font-size:18px;line-height:28px;font-weight:600}
.ledger svg{width:24px;height:24px;color:var(--ink)}
.ledger>a:hover{background:var(--surface-2)}
.two{display:grid;gap:32px}
@media (min-width:1024px){.two{grid-template-columns:1fr 1fr;gap:64px}}
.plain .wrap{display:block}
.plain .hook{margin-bottom:32px;max-width:720px}
.loc{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;align-items:center;padding:16px 8px;border-top:1px solid var(--board-line)}
.loc .to{display:flex;gap:4px}
.loc .to i{font-style:normal;display:grid;place-items:center;width:24px;height:32px;border-radius:4px;background:var(--board-tile);color:#fff;font-family:"Figtree",sans-serif;font-weight:700;font-size:16px}
.loc b{font-size:18px;line-height:28px;font-weight:600}
.loc span.d{grid-column:2;color:var(--board-2);font-size:14px;line-height:24px}
.dboard.flat{transform:none}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.checks label{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:8px 16px;border:1px solid var(--field-edge);border-radius:8px;font-weight:600;color:var(--ink);cursor:pointer}
.checks input{width:24px;height:24px;margin:0;accent-color:var(--ink)}
.checks label:focus-within{outline:2px solid var(--focus-ring);outline-offset:2px}
.lgd{font-size:14px;line-height:20px;color:var(--ink-2);margin-bottom:8px}
/* shared trust block: the person + how to reach us, compact */
.trust .wrap{display:block}
.trust .hook{margin-bottom:32px}
.person{display:grid;grid-template-columns:128px 1fr;gap:24px;align-items:center;padding:24px;border-radius:16px;background:#121316;color:#fff;border:1px solid var(--board-line)}
.person img{width:128px;height:128px;border-radius:8px;object-fit:cover;object-position:50% 20%}
.person .nm{font-family:"Figtree","Noto Sans Bengali",sans-serif;font-weight:700;font-size:24px;line-height:32px}
.person .ln{color:#c9cdd3;margin-top:8px}
.reach{display:grid;gap:8px}
.reach .ad{display:grid;grid-template-columns:24px 1fr;gap:16px;padding:8px 16px;color:var(--ink);font-weight:600}
.reach .ad svg{width:24px;height:24px;color:var(--accent)}
.reach .contact{margin-top:0;max-width:none}
@media (min-width:1024px){.person{grid-template-columns:160px 1fr;padding:32px;gap:32px;align-self:start}.person img{width:160px;height:160px}.reach .contact{grid-template-columns:1fr 1fr}}
.soonrow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding-block:32px}
.soonrow .t3{margin-inline-end:8px}
.soonrow .pill{min-height:48px}
/* footer */
.foot .wrap{display:grid;gap:32px;padding-block:48px}
.foot h2{font-size:14px;line-height:24px;font-weight:600;color:var(--ink-2);margin-bottom:8px}
.foot ul{display:grid}
.foot li a,.foot .legal a{display:inline-flex;align-items:center;min-height:48px;min-width:48px;color:var(--ink);text-decoration:none;font-weight:600}
.foot .legal{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;padding-top:16px;border-top:1px solid var(--hair);color:var(--ink-2)}
.foot .legal a{font-weight:400;text-decoration:underline}
@media (min-width:1024px){.foot .wrap{grid-template-columns:2fr 1fr 1fr;gap:64px}.foot .legal{grid-column:1/-1}}

/* ----- affiliate (waitlist) page ----- */
.why{display:grid;border-top:4px solid var(--ink)}
.why li{padding:24px 0;border-bottom:1px solid var(--hair-2)}
.why b{display:block;color:var(--ink);font-size:18px;line-height:28px;font-weight:600;margin-bottom:8px}
@media (min-width:1024px){.why{grid-template-columns:1fr 1fr;column-gap:64px}.why b{font-size:20px}}
.steps3{display:grid;gap:24px;counter-reset:s}
.steps3 li{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:start;counter-increment:s}
.steps3 li::before{content:counter(s);width:48px;height:48px;border-radius:8px;background:var(--ink);color:var(--surface);display:grid;place-items:center;font-family:"Figtree",sans-serif;font-weight:700;font-size:20px;line-height:1}
.steps3 b{display:block;color:var(--ink);font-size:18px;line-height:28px;font-weight:600}
@media (min-width:1024px){.steps3{grid-template-columns:1fr 1fr 1fr;gap:64px}}
.get .wrap{display:grid;gap:40px}
.get .win{margin-top:0;transform:rotate(-2deg)}
.get .hook{margin-bottom:24px}
@media (min-width:1024px){.get .wrap{grid-template-columns:1fr 1fr;gap:64px;align-items:center}}
.faq{border-top:4px solid var(--ink);max-width:800px}
.faq details{border-bottom:1px solid var(--hair-2)}
.faq summary{display:grid;grid-template-columns:1fr 24px;gap:16px;align-items:center;min-height:64px;padding-block:16px;cursor:pointer;list-style:none;color:var(--ink);font-size:18px;line-height:28px;font-weight:600}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:"Figtree",sans-serif;font-size:24px;line-height:24px;text-align:center}
.faq details[open] summary::after{content:"\2212"}
.faq details p{padding-bottom:24px;max-width:640px}
.ctaband{background:#121316;color:#fff}
.ctaband .wrap{display:grid;gap:24px;padding-block:64px;align-items:center}
.ctaband .hook{color:#fff}
.ctaband p{color:#c9cdd3;margin-top:8px}
.ctaband .btn{background:#fff;border-color:#fff;color:#121316;justify-self:start}
@media (min-width:1024px){.ctaband .wrap{grid-template-columns:1fr auto;padding-block:96px}}
/* ----- affiliate B: logos first, tiers, dashboard object ----- */
.al.big{width:80px;height:80px;border-radius:16px}
.airrow{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:24px}
.airrow .one{display:flex;align-items:center;gap:16px;font-weight:600;color:var(--ink)}
.airrow small{display:block;font-size:14px;line-height:20px;color:var(--ink-2);font-weight:400}
.tiers{display:grid;gap:16px}
.tier{padding:24px;border-radius:16px;border:1px solid var(--hair-2);background:var(--bg)}
.tier.start{background:var(--surface);box-shadow:var(--lifted);border:0}
.tier .nm{font-size:20px;line-height:28px;font-weight:600;color:var(--ink)}
.tier .pr{font-family:"Figtree",sans-serif;font-weight:700;font-size:40px;line-height:48px;color:var(--ink);margin-top:8px}
.tier .pr small{font-size:16px;line-height:24px;font-weight:600;color:var(--ink-2)}
.tier .when{margin-top:8px;color:var(--ink-2);font-size:14px;line-height:24px;min-height:48px}
.tier ul{margin-top:16px;display:grid;gap:8px;border-top:1px solid var(--hair);padding-top:16px}
.tier li{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:start}
.tier li svg{width:24px;height:24px;color:var(--ink)}
.tier .ttag{display:inline-block;margin-bottom:16px}
@media (min-width:1024px){.tiers{grid-template-columns:1fr 1fr 1fr;gap:32px;align-items:start}.tier{padding:32px}.tier.start{transform:translateY(-16px)}}
.dashbox{perspective:1600px;max-width:560px}
.dash{background:var(--surface);border-radius:16px;padding:24px;box-shadow:0 8px 0 var(--edge),var(--obj-soft);transform:rotateX(8deg) rotateY(-10deg) rotateZ(1deg);border:1px solid var(--hair)}
.dash-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--hair);font-size:14px;line-height:24px;color:var(--ink-2)}
.dash-top b{color:var(--ink)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.stat{padding:16px;border-radius:8px;background:var(--chip)}
.stat small{display:block;font-size:14px;line-height:20px;color:var(--ink-2)}
.stat b{display:block;font-family:"Figtree",sans-serif;font-weight:700;font-size:28px;line-height:40px;color:var(--ink)}
.bars2{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;align-items:end;height:96px;margin-top:16px;padding-top:16px;border-top:1px solid var(--hair)}
.bars2 i{display:block;background:var(--ink);border-radius:4px 4px 0 0}
.bars2 i.r{background:var(--accent)}
.steps3.six{counter-reset:s}
@media (min-width:1024px){.steps3.six{grid-template-columns:1fr 1fr 1fr;row-gap:40px}}
.pnote{margin-top:16px;color:var(--ink-2)}
/* ----- merged affiliate page ----- */
.earn .wrap{display:grid;gap:40px}
.earn .hook{margin-bottom:24px}
@media (min-width:1024px){.earn .wrap{grid-template-columns:1fr 1fr;gap:64px;align-items:center}.earn .steps3{grid-template-columns:1fr;gap:24px}}
.quote{display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:start;max-width:720px}
.quote img{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:#121316}
.quote .q{font-family:var(--display);font-size:24px;line-height:36px;color:var(--ink)}
:root[data-lang="en"] .quote .q{font-family:var(--sans);font-weight:600;line-height:32px}
.quote .who{margin-top:8px;color:var(--ink-2)}
@media (min-width:1024px){.quote .q{font-size:28px;line-height:40px}:root[data-lang="en"] .quote .q{line-height:36px}}
.practice .wrap{display:grid;gap:32px}
@media (min-width:1024px){.practice .wrap{grid-template-columns:1fr 1fr;gap:64px;align-items:center}}

.ptog{display:inline-flex;gap:8px;margin-top:16px;padding:4px;border-radius:8px;background:var(--chip)}
.ptog button{min-height:48px;padding:0 16px;border:0;border-radius:8px;background:transparent;color:var(--ink-2);font-weight:600;cursor:pointer}
.ptog button[aria-pressed="true"]{background:var(--ink);color:var(--surface)}

/* ===================== v5 — English first, light first ===================== */
.bn-note{display:none;background:var(--chip);color:var(--ink);font-size:14px;line-height:20px}
.bn-note .wrap{padding-block:8px}
.bn-note small{display:block;font-size:14px;line-height:20px;color:var(--ink-2)}
:root[data-lang="bn"] .bn-note{display:block}
.tbtn svg{width:24px;height:24px}
.tbtn .moon{display:none}
:root[data-theme="dark"] .tbtn .sun{display:none}
:root[data-theme="dark"] .tbtn .moon{display:block}
/* partners strip */
.partners .wrap{display:block}
.partners .hook{margin-bottom:8px}
.partners .lead{color:var(--text);max-width:720px;margin-bottom:32px}
.pgrid{display:grid;gap:16px}
.ptile{padding:24px;border-radius:16px;background:var(--surface);border:1px solid var(--hair-2);display:grid;gap:8px;align-content:start}
.ptile .k{font-size:14px;line-height:20px;color:var(--ink-2)}
.ptile .nm{font-size:20px;line-height:28px;font-weight:600;color:var(--ink)}
.ptile ul{display:grid;gap:4px;color:var(--text)}
.ptile li{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:start}
.ptile li svg{width:24px;height:24px;color:var(--ink)}
.certs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.certs a{display:block;border-radius:8px;overflow:hidden;border:1px solid var(--hair-2);background:#fff}
.certs img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:top}
.certs small{display:block;padding:4px 8px;font-size:14px;line-height:20px;color:#5e636b;background:#fff}
.reg{font-family:"Figtree",sans-serif;font-weight:600;color:var(--ink)}
@media (min-width:1024px){.pgrid{grid-template-columns:1fr 1fr 1fr;gap:32px}.ptile{padding:32px}}
.pstrip{border-block:1px solid var(--hair);background:var(--surface)}
.pstrip .wrap{display:flex;flex-wrap:wrap;gap:8px 32px;align-items:center;min-height:64px;padding-block:8px;font-size:14px;line-height:24px;color:var(--ink-2)}
.pstrip b{color:var(--ink);font-weight:600}
.pstrip .lbl{text-transform:uppercase;letter-spacing:.08em;font-size:14px}
/* fifth-grader form: bigger tiles, cabin chips, two big date choices */
.cabins{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.cabins button{min-height:48px;padding:8px 16px;border:1px solid var(--field-edge);border-radius:8px;background:var(--surface);color:var(--ink);font-weight:600;cursor:pointer}
.cabins button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.dchoice{display:grid;gap:8px;margin-bottom:16px}
.dchoice .btn{min-height:64px;justify-content:start;text-align:start}
.dchoice .btn[aria-pressed="true"]{border:2px solid var(--ink)}
.sheet .fld{min-height:72px}
.thumb.always{grid-template-columns:1fr 56px}
/* package list */
.pack{border-top:4px solid var(--ink);margin-top:24px}
.pack li{display:grid;grid-template-columns:32px 1fr;gap:16px;align-items:start;padding-block:16px;border-bottom:1px solid var(--hair-2);counter-increment:p}
.pack{counter-reset:p}
.pack li::before{content:counter(p);width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--surface);display:grid;place-items:center;font-family:"Figtree",sans-serif;font-weight:700;font-size:14px}
.pack b{display:block;color:var(--ink);font-weight:600}

/* partners page */
.plink{display:inline-flex;align-items:center;min-height:48px;color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.plink:hover{text-decoration-thickness:2px}
.ptile .more{color:var(--ink);font-weight:600;text-decoration:none}
.partner-page .lic{align-self:start}
.facts{display:grid;gap:8px}
.facts dt{font-size:14px;line-height:20px;color:var(--ink-2);margin-top:8px}
.facts dd{color:var(--text)}
.certs3{display:grid;gap:16px}
.certbig{display:block;border-radius:16px;overflow:hidden;border:1px solid var(--hair-2);background:#fff;box-shadow:0 8px 0 var(--edge),var(--obj-soft)}
.certbig img{width:100%;height:auto;display:block}
.certbig small{display:block;padding:8px 16px;font-size:14px;line-height:20px;color:#5e636b;background:#fff;border-top:1px solid #e3e6ea}
@media (min-width:1024px){.certs3{grid-template-columns:1fr 1fr 1fr;gap:32px}}
#s-others .wrap{display:grid;gap:40px}
#s-others .hook{margin-bottom:16px}
@media (min-width:1024px){#s-others .wrap{grid-template-columns:1fr 1fr;gap:64px;align-items:start}}
.ledger>li.plain{grid-template-columns:1fr}

/* ===================== v6 — Join funnel, referral link, consultant list, story =====================
   Same ladder (8 · 16 · 24 · 32 · 40 · 48 · 56 · 64 · 80 · 96 · 128), same tokens, same one-red rule. */

/* header: six nav items need 1280; the phone number shows as text only at 1440 */
@media (min-width:1024px) and (max-width:1279px){.nav{display:none}.bar .lang{display:none}.menubtn{display:inline-flex}}
.bar .tel .num{display:none}
@media (min-width:1440px){.bar .tel .num{display:inline}}
.melink{max-width:160px}
.melink span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.melink[hidden]{display:none!important}

/* the referral line — small, under the header, never a banner */
.refline{background:var(--surface-2);border-bottom:1px solid var(--hair);font-size:14px;line-height:20px;color:var(--ink)}
.refline .wrap{display:flex;align-items:center;gap:8px;padding-block:8px}
.refline svg{width:16px;height:16px;flex:none;color:var(--ink-2)}

/* person card / story card in the shared trust block */
.person .rs,.storycard .rs{display:inline-flex;align-items:center;min-height:48px;margin-top:8px;color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px}
.storycard{display:grid;grid-template-columns:96px 1fr;gap:24px;align-items:start;padding:24px;border-radius:16px;background:#121316;color:#fff;border:1px solid #2c2f35}
.storycard img{width:96px;height:96px;border-radius:8px;object-fit:cover;object-position:50% 20%}
.storycard .nm{font-family:"Figtree","Noto Sans Bengali",sans-serif;font-weight:700;font-size:20px;line-height:28px}
.storycard p:not(.nm){color:#c9cdd3;margin-top:8px}
@media (min-width:1024px){.storycard{grid-template-columns:160px 1fr;padding:32px;gap:32px}.storycard img{width:160px;height:160px}}

/* ---------- Join: three doors, one ladder ---------- */
.jhero{padding-block:32px 64px}
.jhero .lead{max-width:720px}
.doors{display:grid;gap:16px;margin-top:32px}
.door{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:16px;background:var(--surface);border:1px solid var(--hair-2)}
.door.d1{border-color:transparent;box-shadow:var(--lifted)}
.door.d2{border:2px solid var(--ink)}
.door.d3{background:#121316;border-color:#2c2f35}
:root[data-theme="dark"] .door.d3{background:#26292f;border-color:#454951}
.door .dstep{font-size:14px;line-height:20px;font-weight:600;color:var(--ink-2)}
.door h2{font-size:20px;line-height:28px;font-weight:600;color:var(--ink)}
.door p{color:var(--text)}
.door.d3 .dstep,.door.d3 p{color:#c9cdd3}
.door.d3 h2{color:#fff}
.door .btn{margin-top:auto}
.door .push{flex:1}
.door.d3 .btn{background:#fff;border-color:#fff;color:#121316}
@media (min-width:1024px){.jhero{padding-block:64px 96px}.doors{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:48px}.door{padding:32px}}

/* a section that opens a door: kicker + hook + answer on the left, the object or form on the right */
.dsec .wrap{display:grid;gap:40px}
.dsec .kick{display:inline-block;margin-bottom:16px}
@media (min-width:1024px){.dsec .wrap{grid-template-columns:minmax(0,1fr) 480px;gap:64px;align-items:start}}
.rules{margin-top:16px;color:var(--ink-2)}

/* ---------- the link card (an object you keep) ---------- */
.linkcard{display:grid;gap:16px;padding:24px;border-radius:16px;background:var(--surface);border:1px solid var(--hair-2);box-shadow:0 8px 0 var(--edge),var(--obj-soft)}
.lk-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.lk-top .k{font-size:14px;line-height:20px;color:var(--ink-2)}
.lk-url{font-family:"Figtree",sans-serif;font-size:18px;line-height:28px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.lk-url .pre{color:var(--ink-2);font-weight:400}
.lk-row{display:grid;gap:16px;align-items:center}
.lk-qr{width:160px;height:160px;border-radius:8px;overflow:hidden;border:1px solid #e3e6ea;background:#fff}
.lk-qr svg{display:block;width:100%;height:100%}
.lk-qr .qb{fill:#fff}.lk-qr .qf{fill:#121316}
.lk-actions{display:grid;gap:8px}
.lk-cap{font-size:14px;line-height:20px;color:var(--ink-2)}
.lk-edit{display:grid;gap:8px;padding-top:16px;border-top:1px solid var(--hair)}
.pfxrow{display:flex;align-items:center;min-width:0}
.pfx{color:var(--ink-2);font-size:16px;line-height:24px;white-space:nowrap}
.pfxrow .v{flex:1;min-width:0}
.lk-err{color:var(--ink);font-size:14px;line-height:24px;font-weight:600;padding:8px 16px;border-inline-start:4px solid var(--ink);background:var(--chip);border-radius:4px}
.lk-err::before{content:"\26A0\FE0E  "}
.lk-edit .two-b{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (min-width:600px){.lk-row{grid-template-columns:160px 1fr}}
.btn[data-copied]{border-color:var(--ink)}

/* ---------- refer.html ---------- */
.rpoints{margin-top:24px}
.seemock{max-width:560px}
.seemock .win{max-width:none;margin-top:0;transform:none}
.seemock .refline{border-radius:0}
.seemock .mock-h{font-family:var(--display);font-size:24px;line-height:36px;color:var(--ink);padding:24px}
:root[data-lang="en"] .seemock .mock-h{font-family:var(--sans);font-weight:700;line-height:32px}
.signin-line{margin-top:16px}
.signin-line a{display:inline-flex;align-items:center;min-height:48px;font-weight:600}

/* ---------- me.html ---------- */
.mehead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px}
.stats3{display:grid;gap:8px}
.stat3{padding:16px 24px;border-radius:16px;background:var(--surface);border:1px solid var(--hair-2)}
.stat3 small{display:block;font-size:14px;line-height:20px;color:var(--ink-2)}
.stat3 b{display:block;font-family:"Figtree",sans-serif;font-weight:700;font-size:32px;line-height:40px;color:var(--ink)}
@media (min-width:600px){.stats3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.payline{margin-top:16px;color:var(--text)}
.rtable{border-top:4px solid var(--ink);margin-top:24px}
.rrow{display:grid;grid-template-columns:1fr auto;grid-template-areas:"n s" "r a";gap:4px 16px;padding-block:16px;border-bottom:1px solid var(--hair-2);align-items:center}
.rrow .c1{grid-area:n;font-weight:600;color:var(--ink)}
.rrow .c2{grid-area:r;font-family:"Figtree",sans-serif;font-size:14px;line-height:20px;color:var(--ink-2)}
.rrow .c3{grid-area:s;justify-self:end}
.rrow .c4{grid-area:a;justify-self:end;font-size:14px;line-height:20px;color:var(--ink-2)}
.rrow.th{display:none}
@media (min-width:1024px){
  .rrow{grid-template-columns:2fr 2fr 1.5fr 1.5fr;grid-template-areas:"n r s a"}
  .rrow .c3,.rrow .c4{justify-self:start}
  .rrow.th{display:grid;padding-block:8px;font-size:14px;line-height:20px;color:var(--ink-2)}
  .rrow.th span{font-weight:400;color:var(--ink-2)}
}
.chip2{display:inline-block;padding:4px 8px;border-radius:4px;font-size:14px;line-height:20px;font-weight:600}
.chip2.asked{background:var(--chip);color:var(--ink)}
.chip2.ticketed{background:var(--ink);color:var(--surface)}
.chip2.refunded{border:1px solid var(--field-edge);color:var(--ink)}
.stepup{display:grid;gap:8px;padding:24px;border-radius:16px;border:1px dashed var(--field-edge)}
.stepup a{display:inline-flex;align-items:center;min-height:48px;font-weight:600;color:var(--ink)}
.medash .wrap{display:grid;gap:40px}
@media (min-width:1024px){.medash .wrap{grid-template-columns:minmax(0,1fr) 480px;gap:64px;align-items:start}}

/* ---------- find.html ---------- */
.search{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:24px;max-width:560px}
.search .btn{min-height:64px}
.clist{border-top:4px solid var(--ink);margin-top:32px;max-width:800px}
.crow2{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:center;padding-block:16px;border-bottom:1px solid var(--hair-2)}
.crow2 .av{width:48px;height:48px;border-radius:50%;background:var(--chip);display:grid;place-items:center;font-family:"Figtree",sans-serif;font-weight:700;color:var(--ink)}
.crow2 .nm{font-weight:600;color:var(--ink);font-size:18px;line-height:28px}
.crow2 .ar{color:var(--ink-2);font-size:14px;line-height:20px}
.crow2 .act{grid-column:1/-1}
@media (min-width:1024px){.crow2{grid-template-columns:48px 1fr auto}.crow2 .act{grid-column:auto}}
.findnone{max-width:800px;margin-top:32px;padding:24px;border-radius:16px;background:var(--surface);border:1px solid var(--hair-2);display:grid;gap:8px}
.findnone .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.listnote{max-width:800px;margin-top:24px;color:var(--ink-2)}
.minilist{border-radius:16px;background:var(--surface);border:1px solid var(--hair-2);padding:24px}
.minilist .crow2{border-bottom:0;padding-block:16px 0}
.minilist .more{display:inline-flex;align-items:center;min-height:48px;font-weight:600;color:var(--ink)}

/* ---------- story.html ---------- */
.shero{background:#121316;color:#fff;overflow:hidden}
.shero .wrap{display:grid;gap:0;align-items:end}
.shero .txt{padding-block:48px 32px}
.shero .flap{background:#fff;color:#121316}
.shero .hook{color:#fff;margin-top:16px}
.shero .by{margin-top:16px;color:#c9cdd3}
.shero .pic{justify-self:center;width:100%;max-width:400px;aspect-ratio:1;position:relative}
.shero .pic img{width:100%;height:100%;object-fit:cover}
.shero .pic::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 32px 32px #121316}
@media (min-width:1024px){.shero .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px}.shero .txt{padding-block:96px;align-self:center}.shero .pic{max-width:480px;margin-top:48px}}
.story .wrap{display:grid;gap:48px}
.story-body{max-width:720px}
.story-body h2{margin-top:48px}
.story-body h2:first-child{margin-top:0}
.story-body p{margin-top:16px;font-size:18px;line-height:32px}
:root[data-lang="en"] .story-body p{line-height:28px}
.army{margin-top:24px}
.army a{color:var(--text)}
.closing{margin-top:48px;padding-top:32px;border-top:4px solid var(--ink)}
.closing .q{font-family:var(--display);font-size:28px;line-height:40px;color:var(--ink)}
:root[data-lang="en"] .closing .q{font-family:var(--sans);font-weight:700;line-height:36px}
.closing .sig{border:0;margin-top:16px;padding-top:0}
.closing .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.story-aside{display:grid;gap:24px;align-content:start}
.tline{border-top:4px solid var(--ink)}
.tline li{display:grid;grid-template-columns:128px 1fr;gap:16px;padding-block:16px;border-bottom:1px solid var(--hair-2)}
.tline .y{font-family:"Figtree","Noto Sans Bengali",sans-serif;font-weight:700;color:var(--ink)}
@media (min-width:1024px){.story .wrap{grid-template-columns:minmax(0,1fr) 400px;gap:96px;align-items:start}.story-aside{position:sticky;top:32px}.closing .q{font-size:32px;line-height:48px}:root[data-lang="en"] .closing .q{line-height:40px}}

.foot .wrap{grid-template-columns:none}
@media (min-width:1024px){.foot .wrap{grid-template-columns:2fr 1fr 1fr 1fr}}

/* theme switch: two buttons, the active one filled (v5 showed both icons with no state) */
.tseg{display:inline-flex;border:1px solid var(--hair-2);border-radius:8px;overflow:hidden}
.tseg button{display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;background:transparent;color:var(--ink-2);cursor:pointer}
.tseg button svg{width:24px;height:24px}
.tseg button[aria-pressed="true"]{background:var(--ink);color:var(--surface)}
.tseg button:focus-visible{outline-offset:-4px}
.nav a{padding:0 8px;min-width:48px;justify-content:center}

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

/* the link card inside a lifted form card: flatter, QR 128 */
.card .linkcard{box-shadow:none;border-color:var(--hair-2)}
.card .lk-qr{width:128px;height:128px}
@media (min-width:600px){.card .lk-row{grid-template-columns:128px 1fr}}
.lk-actions .btn{padding-inline:16px}
/* partner strip: compact on a phone */
.pstrip .pi{display:inline-flex;flex-wrap:wrap;align-items:center}
@media (max-width:599px){.pstrip .pd{display:none}.pstrip .wrap{gap:0 16px}.pstrip .lbl{flex-basis:100%}}

[tabindex="-1"]:focus{outline:none}

/* the server said no (a rate limit, or no network), or a calm note: keep the typed values, point to WhatsApp */
.send-err{margin:8px 0 0;padding:8px 16px;border-inline-start:4px solid var(--ink);background:var(--chip);border-radius:4px;color:var(--ink);font-size:14px;line-height:24px;font-weight:600}

/* ---- the airport picker (MSD 2026-10-07, "like Kayak"). Phone: a full page, both rows on top — the chosen From shows ✓,
   the row being typed is outlined — so choosing From visibly moves you to To. From 768 px: a dropdown laid over the field. */
dialog.picker{width:100%;max-width:none;height:100%;max-height:none;margin:0;border-radius:0;inset:0}
dialog.picker .sheet-in{padding:16px;gap:16px;align-content:start;max-width:640px;margin-inline:auto}
.pk-top{display:flex;align-items:center;gap:8px}
.pk-x{display:grid;place-items:center;width:48px;height:48px;margin-inline-start:-12px;border:0;border-radius:24px;background:transparent;color:var(--ink);cursor:pointer}
.pk-x svg{width:24px;height:24px}
.pk-x:hover{background:var(--chip)}
.pk-strip{display:grid;border:1px solid var(--field-edge);border-radius:8px;background:var(--surface);overflow:hidden}
.pk-row{display:flex;flex-direction:column;justify-content:center;min-height:64px;padding:8px 16px;position:relative}
.pk-row+.pk-row{border-top:1px solid var(--field-edge)}
.pk-row .k{font-size:14px;line-height:20px;color:var(--ink-2)}
.pk-row .pk-v{display:flex;align-items:center;gap:8px;width:100%;min-height:24px;padding:0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:16px;line-height:24px;font-weight:600;text-align:start;cursor:pointer}
.pk-row .pk-v::after{content:"";position:absolute;inset:0}                         /* the whole row is the tap target */
.pk-row .pk-v.none{color:var(--ink-2);font-weight:400}
.pk-row.done .pk-v::before{content:"";flex:none;width:20px;height:20px;border-radius:10px;background:var(--ink) no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.pk-row.on{box-shadow:inset 0 0 0 2px var(--ink);border-radius:8px}
.pk-row.on .pk-v{display:none}
.pk-row:not(.on) .pk-slot{display:none}
.pk-slot .v{display:block;width:100%;height:24px;padding:0;margin:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:16px;line-height:24px;font-weight:600}
.pk-slot .v::placeholder{color:var(--ink-2);font-weight:400;opacity:1}
.pk-row.just{animation:pk-just .9s ease-out}
@keyframes pk-just{0%{background:var(--chip)}100%{background:transparent}}
/* the form's tile that was just filled: a short tint so the eye lands on it */
.cell.just .fld{animation:pk-tile 1.1s ease-out}
@keyframes pk-tile{0%{background:var(--chip);border-color:var(--ink)}100%{background:var(--surface)}}
.cell.picking .fld{border:2px solid var(--ink)}
@media (prefers-reduced-motion:reduce){.pk-row.just,.cell.just .fld{animation:none}}
/* 768 px and up: a dropdown over the field — its first row sits exactly on the tile, so you type where you clicked */
@media (min-width:768px){
  dialog.picker.drop{position:absolute;inset:auto;height:auto;max-height:none;margin:0;padding:0;border-radius:8px;
    box-shadow:0 16px 40px rgba(18,19,22,.22),0 0 0 1px var(--field-edge);overflow:visible;z-index:30}
  dialog.picker.drop .sheet-in{padding:0;gap:0;max-width:none}
  dialog.picker.drop .pk-top{display:none}
  dialog.picker.drop .pk-strip{border:0;border-radius:8px 8px 0 0}
  dialog.picker.drop .pk-row:not(.on){display:none}
  dialog.picker.drop .pk-row.on{border-radius:8px 8px 0 0}
  dialog.picker.drop .ac{max-height:min(420px,60vh);overflow:auto;padding:8px;border-top:1px solid var(--field-edge)}
}
dialog.picker:not(.drop) .sheet-in{min-height:100%}                                 /* a tap on empty space is not a "close" */

/* ---- the calendar (MSD 2026-10-07): the chosen days are ONE solid block — --ink on --surface, so black in light and
   white in dark; the days between are the same block a shade softer; past days are greyed and can't be tapped. */
dialog.cal .sheet-in{display:flex;flex-direction:column;gap:0;padding:0;height:100%;max-width:none}
dialog.cal .pk-top{padding:8px 16px 0}
.cal-wk,.cm-wk{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:14px;line-height:20px;font-weight:600;color:var(--ink-2)}
.cal-wk{padding:8px 16px;border-bottom:1px solid var(--hair)}
.cm-wk{display:none}
.cal-body{position:relative;flex:1;min-height:0}
.cal-months{height:100%;overflow:auto;padding:8px 16px 16px;overscroll-behavior:contain}
.cal-nav{display:none}
.cm+.cm{margin-top:24px}
.cm-h{margin:8px 0 8px;font-size:18px;line-height:28px;font-weight:700;color:var(--ink)}
.cg{display:grid;grid-template-columns:repeat(7,1fr);row-gap:4px}
.cd{height:48px;min-width:0;border:0;border-radius:8px;background:transparent;color:var(--ink);font:inherit;font-size:16px;font-weight:600;cursor:pointer;font-variant-numeric:tabular-nums}
.cd:disabled{color:var(--ink-2);opacity:.45;cursor:default;font-weight:400}
.cd.td{box-shadow:inset 0 0 0 1px var(--field-edge)}
@media (hover:hover){.cd:not(:disabled):not(.s):not(.e):not(.in):hover{box-shadow:inset 0 0 0 2px var(--ink)}}
.cd:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.cd.s,.cd.e,.cd.in{background:var(--ink);color:var(--surface)}
.cd.in{background:color-mix(in srgb,var(--ink) 84%,var(--surface));border-radius:0}
.cd.s{border-radius:8px 0 0 8px}.cd.e{border-radius:0 8px 8px 0}.cd.solo{border-radius:8px}
.cd.in.w0,.cd.e.w0{border-top-left-radius:8px;border-bottom-left-radius:8px}
.cd.in.w6,.cd.s.w6:not(.solo){border-top-right-radius:8px;border-bottom-right-radius:8px}
.cd.tent.in,.cd.tent.e{background:color-mix(in srgb,var(--ink) 40%,var(--surface))}   /* the range you are about to choose */
.cal-foot{display:grid;gap:12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--hair);background:var(--surface)}
.cal-sum{display:grid;grid-template-columns:1fr 1fr}
.cal-sum>div{display:grid;gap:2px;min-width:0}
.cal-sum>div+div{padding-inline-start:16px;border-inline-start:1px solid var(--hair)}
.cal-sum small{font-size:14px;line-height:20px;color:var(--ink-2)}
.cal-sum b{font-size:16px;line-height:24px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-sum b.none{font-weight:400;color:var(--ink-2)}
.cal-foot .btn:disabled{opacity:1;background:var(--chip);color:var(--ink-2);border-color:transparent;cursor:default}
@media (min-width:768px){
  dialog.cal.drop .sheet-in{height:auto}
  dialog.cal.drop .pk-top,dialog.cal.drop .cal-wk{display:none}
  dialog.cal.drop .cal-months{display:grid;grid-template-columns:1fr 1fr;gap:32px;height:auto;overflow:visible;padding:16px 24px 8px}
  dialog.cal.drop .cm+.cm{margin-top:0}
  dialog.cal.drop .cm-h{text-align:center;font-size:16px;line-height:48px;margin:0}
  dialog.cal.drop .cm-wk{display:grid;margin-bottom:4px}
  dialog.cal.drop .cal-nav{display:grid;place-items:center;position:absolute;top:16px;z-index:1;width:48px;height:48px;border:0;border-radius:24px;background:transparent;color:var(--ink);cursor:pointer}
  dialog.cal.drop .cal-nav svg{width:24px;height:24px}
  dialog.cal.drop .cal-nav:hover:not(:disabled){background:var(--chip)}
  dialog.cal.drop .cal-nav:disabled{opacity:.3;cursor:default}
  dialog.cal.drop .cal-nav.pv{left:24px}dialog.cal.drop .cal-nav.nx{right:24px}
  dialog.cal.drop .cal-foot{grid-template-columns:1fr 240px;align-items:center;padding:12px 24px 16px;border-radius:0 0 8px 8px}
  .cell.picking .fld{border:2px solid var(--ink)}
}

/* ---- the header, simpler (MSD 2026-10-07): Flights · Umrah · Airport help · Ways to connect ▾ · Who we are ▾ */
.nav-g{position:relative;display:inline-flex}
.nav-b{display:inline-flex;align-items:center;gap:4px;min-height:48px;padding:0 8px 0 16px;border:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-radius:8px;background:transparent;color:var(--ink-2);font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.nav-b:hover,.nav-b[aria-expanded="true"]{color:var(--ink);background:var(--chip)}
.nav-b[aria-current="page"]{color:var(--ink);border-bottom-color:var(--ink);border-radius:8px 8px 0 0}
.nav-b .cr{width:16px;height:16px;transition:transform .15s}
.nav-b[aria-expanded="true"] .cr{transform:rotate(180deg)}
.nav-pop{position:absolute;top:calc(100% + 8px);left:0;z-index:40;display:grid;gap:4px;min-width:300px;padding:8px;border:1px solid var(--hair-2);border-radius:8px;background:var(--surface);box-shadow:0 16px 40px rgba(18,19,22,.18)}
.nav-pop[hidden]{display:none}
.nav .nav-pop a{display:grid;gap:2px;justify-content:stretch;align-items:start;min-height:56px;padding:8px 16px;border:0;border-radius:8px;color:var(--ink);font-weight:600;line-height:24px;white-space:normal;text-align:start}
.nav .nav-pop a small{font-size:14px;line-height:20px;font-weight:400;color:var(--ink-2)}
.nav .nav-pop a:hover{background:var(--chip)}
@media (min-width:1024px) and (max-width:1199.98px){.nav{margin-inline-start:16px;gap:0}.nav a,.nav-b{padding-inline:8px}}
.menu .rows-h{margin:16px 0 0;padding:0 4px;font-size:14px;line-height:20px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
/* the last word on every page: "Still not sure?" */
.sec.still{padding-block:48px}
.still .wrap{display:grid;justify-items:start;gap:8px}
.still p{margin:0;color:var(--text);max-width:60ch}
.still .btn{margin-top:8px}
/* the consultant page: who does what, in three columns from 768 px */
.who3{display:grid;gap:32px;margin-top:32px}
.who3 .t3{margin:0 0 8px}
@media (min-width:768px){.who3{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* the Refer page: exclusively Emirates and Turkish Airlines, with the airline tiles as designed */
.exair{display:grid;align-content:start;gap:16px}
.exair .t3{margin:0}
.exair p{margin:0;color:var(--text);max-width:48ch}
.exair .flap{justify-self:start}

/* ---- who we've been serving (MSD 2026-10-07): facts, not testimonials; real words later, with permission */
.srv3{display:grid;gap:16px;margin-top:32px}
@media (min-width:768px){.srv3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.srv{display:grid;align-content:start;justify-items:start;gap:8px;padding:24px;border:1px solid var(--hair-2);border-radius:16px;background:var(--surface)}
.srv .t3{margin:8px 0 0}
.srv p{margin:0;color:var(--text)}
.srv-ask{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding:16px 24px;border-radius:16px;background:var(--chip)}
.srv-ask p{margin:0;color:var(--text)}
/* ---- the "Serving with" strip: one line on a phone, so the search sits higher */
@media (max-width:599px){
  .pstrip .wrap{flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;min-height:48px;gap:0 16px;scrollbar-width:none}
  .pstrip .wrap::-webkit-scrollbar{display:none}
  .pstrip .lbl{flex-basis:auto}
  .pstrip .pi{flex-wrap:nowrap}
}
/* ---- the boarding pass flips like a departure board (MSD 2026-10-07) */
.pass-route b .fl{display:inline-block;transform-origin:50% 55%;backface-visibility:hidden}
.pass-route b .fl.out{animation:fl-out .11s ease-in forwards}
.pass-route b .fl.in{animation:fl-in .13s ease-out}
@keyframes fl-out{to{transform:rotateX(90deg)}}
@keyframes fl-in{from{transform:rotateX(-90deg)}to{transform:none}}
.pass-route .city{transition:opacity .25s}
.pass-route .city.fade{opacity:0}
.pass-route b .fl{font-size:inherit;line-height:inherit;color:inherit;font-weight:inherit}   /* not the small "city" text style */
.sec.serving .wrap{display:block}
/* four certificates on the Partners page (IATA added 2026-10-07) */
@media (min-width:768px){.certs3.c4{grid-template-columns:1fr 1fr}}
@media (min-width:1280px){.certs3.c4{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}}
/* the Umrah checklist (MSD 2026-10-07): what you need, two columns where there is room */
@media (min-width:600px){.checks.needs{display:grid;grid-template-columns:1fr 1fr;gap:8px}}
.checks.needs{display:grid;gap:8px}.checks.needs label{width:100%}
/* the Umrah opening (MSD 2026-10-07): his words, then who it is for */
.um-quote{display:flex;gap:16px;align-items:flex-start;margin:24px 0 0;padding:16px 16px 16px 20px;border-inline-start:4px solid var(--ink);background:var(--surface);border-radius:0 12px 12px 0}
.um-quote img{flex:none;width:56px;height:56px;border-radius:28px;object-fit:cover}
.um-quote p{margin:0;font-size:18px;line-height:28px;font-weight:600;color:var(--ink)}
.um-quote cite{display:block;margin-top:8px;font-style:normal;font-size:14px;color:var(--ink-2)}
.um-points{margin-top:24px}
.wa-tick{display:inline-flex;align-items:center;gap:8px;min-height:48px;margin-top:4px;font-size:16px;color:var(--ink);cursor:pointer}
.wa-tick input{width:24px;height:24px;margin:0;accent-color:var(--ink)}
/* Umrah, 1024 px and up (2026-10-07): the story on the left with the photo under it; the form beside it, visible at once */
@media (min-width:1024px){
  .umrah .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:48px;row-gap:32px;align-items:start}
  .umrah .txt{grid-column:1;grid-row:1;margin-bottom:0;max-width:none}
  .um-ph{grid-column:1;grid-row:2;height:400px}
  .um-form{grid-column:2;grid-row:1 / span 2;margin:0;position:sticky;top:96px}
}
.checks input,.wa-tick input{flex:none}
.strip{flex-wrap:wrap}
/* the hero is one line, then the search (MSD 2026-10-07, "like Kayak"); the rest sits under the box */
.under-search{display:grid;gap:16px;margin-top:24px;max-width:860px}
.under-search .sm-ans{margin:0;font-size:16px;line-height:24px;color:var(--text)}
.under-search .strip{margin-top:0}
/* the app, coming soon — store-style buttons (official badges once the apps are live) */
.stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.store{display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:8px 20px 8px 16px;border-radius:12px;background:var(--ink);color:var(--surface)}
.store svg{width:28px;height:28px;flex:none}
.store small{display:block;font-size:12px;line-height:16px;opacity:.85}
.store b{display:block;font-size:18px;line-height:22px;font-weight:700;letter-spacing:-.01em}
/* the small line under the headline (the pain, in one line) */
.hero .hsub{margin:16px 0 0;max-width:40ch;font-size:18px;line-height:28px;color:var(--text)}
@media (max-width:599px){.hero .hsub{font-size:16px;line-height:24px;margin-top:8px}}
/* the boarding pass deals the next route, card after card (MSD 2026-10-07) */
.pass-sh.deal-out{animation:deal-out .38s cubic-bezier(.4,0,1,1) forwards}
.pass-sh.deal-in{animation:deal-in .55s cubic-bezier(0,0,.2,1)}
@keyframes deal-out{to{transform:translate(-56px,36px) rotate(-7deg);opacity:0}}
@keyframes deal-in{from{transform:translate(64px,-28px) rotate(5deg);opacity:0}to{transform:none;opacity:1}}
.pass-back{transition:transform .5s cubic-bezier(.2,0,.2,1)}
.pass3d.dealing .pass-back{transform:translate(48px,40px) rotate(7deg)}
@media (prefers-reduced-motion:reduce){.pass-sh.deal-out,.pass-sh.deal-in{animation:none}}

/* the official App Store badge (2026-10-14: the iPhone app is live) — Apple's file, unaltered, never under 40 px tall */
.badge{display:inline-flex;align-items:center;border-radius:8px}
.badge img{display:block;height:56px;width:auto}
.soonrow .badge img{height:48px}
.badge:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.appnote{margin-top:12px}
