/* ============ TIGER EXCHANGE — tigerexcch.co.in — "MONSOON CIRCUIT" ============ */
@font-face{font-family:'Chakra Petch';src:url('/fonts/chakrapetch-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:optional;unicode-range:U+0000-00FF,U+2000-206F,U+20B9,U+2212,U+2013-2014}
@font-face{font-family:'Chakra Petch';src:url('/fonts/chakrapetch-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:optional;unicode-range:U+0000-00FF,U+2000-206F,U+20B9,U+2212,U+2013-2014}
@font-face{font-family:'Inter Tight';src:url('/fonts/intertight.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:optional;unicode-range:U+0000-00FF,U+2000-206F,U+20B9,U+2212,U+2013-2014}

:root{
  --bg:#05141C; --surface:#0A2230; --raised:#0E2B3B; --border:#164A5E;
  --cyan:#22D3EE; --sky:#38BDF8; --aqua:#0EA5B7; --tiger:#FF7A1A;
  --gold:#FFC24B; --ink:#05141C; --wa:#25D366;
  --text:#EAF7FB; --muted:#9FC4D0; --dim:#6E97A6;
  --disp:'Chakra Petch',system-ui,'Segoe UI',sans-serif;
  --body:'Inter Tight',system-ui,'Segoe UI',Roboto,sans-serif;
  --wrap:1160px; --r:14px;
}
*,*::before,*::after{box-sizing:border-box}
:where(body *){min-width:0}
html{overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:17px;line-height:1.7;overflow-x:clip;max-width:100%;overflow-wrap:break-word;
  background-image:radial-gradient(120% 60% at 50% -10%,rgba(34,211,238,.10),transparent 60%),radial-gradient(80% 40% at 90% 8%,rgba(255,122,26,.06),transparent 60%)}
img{max-width:100%;height:auto;display:block}
a{color:var(--cyan);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--disp);line-height:1.18;margin:0 0 .5em;font-weight:700;letter-spacing:.2px}
h1{font-size:clamp(1.8rem,5.2vw,3rem)}
h2{font-size:clamp(1.45rem,3.6vw,2.15rem);margin-top:1.6em}
h3{font-size:clamp(1.15rem,2.4vw,1.4rem)}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
li{margin:.35em 0}
strong{color:#fff}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
main{max-width:100%;overflow-x:clip;display:block}
section{padding-block:clamp(30px,5vw,54px)}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:8px;top:8px;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;background:var(--gold);color:var(--ink);padding:0;z-index:200}
.skip:focus{width:auto;height:auto;overflow:visible;clip:auto;clip-path:none;padding:10px 16px}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:100;width:100%;max-width:100vw;background:rgba(7,26,36,.92);backdrop-filter:blur(9px);border-bottom:1px solid var(--border)}
.hdr .bar{display:flex;align-items:center;gap:16px;height:64px}
.hdr .logo{display:flex;align-items:center}
.hdr .logo img{height:34px;width:auto}
.nav{margin-left:auto;display:flex;align-items:center;gap:22px}
.nav a{color:var(--text);font-weight:500;font-size:.97rem}
.nav a[aria-current=page]{color:var(--cyan)}
.nav .cta-sm{margin-left:4px}
.burger{margin-left:auto;display:none;background:var(--raised);border:1px solid var(--border);color:var(--text);width:44px;height:44px;border-radius:10px;font-size:1.3rem;cursor:pointer}
@media(max-width:900px){
  .nav{position:absolute;left:0;right:0;top:64px;flex-direction:column;align-items:stretch;gap:0;background:#08202C;border-bottom:1px solid var(--border);max-height:0;overflow:hidden;transition:max-height .28s ease;margin:0}
  .nav.open{max-height:80vh;overflow:auto}
  .nav a{padding:14px 20px;border-top:1px solid rgba(22,74,94,.5)}
  .nav .cta-sm{margin:12px 20px}
  .burger{display:block}
}

/* ---------- buttons / CTA (droplet-notch chamfer) ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--disp);font-weight:700;font-size:1rem;padding:13px 26px;border:0;cursor:pointer;letter-spacing:.4px;
  clip-path:polygon(0 0,100% 0,100% 72%,88% 100%,0 100%)}
.btn-gold{background:var(--gold)!important;color:var(--ink)!important;box-shadow:0 6px 20px rgba(255,194,75,.24)}
.btn-gold:hover{filter:brightness(1.06);text-decoration:none}
.btn-wa{background:var(--wa)!important;color:#04180C!important}
.btn-wa:hover{filter:brightness(1.06);text-decoration:none}
.btn-ghost{background:var(--raised)!important;color:var(--text)!important;border:1px solid var(--border)}
.cta-sm{padding:9px 16px;font-size:.9rem}

/* ---------- hero + rain motif ---------- */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--border)}
.hero canvas.rain{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.5;pointer-events:none}
.hero .wrap{position:relative;z-index:2}
.waterline{position:relative;height:3px;background:linear-gradient(90deg,transparent,var(--cyan),var(--sky),transparent);box-shadow:0 0 16px var(--cyan);opacity:.8}
.eyebrow{display:inline-block;font-family:var(--disp);font-weight:600;letter-spacing:2px;text-transform:uppercase;font-size:.78rem;color:var(--cyan);border:1px solid var(--border);border-radius:999px;padding:5px 14px;margin-bottom:14px;background:rgba(34,211,238,.06)}
.lede{font-size:1.12rem;color:var(--muted);max-width:60ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}

/* ---------- login / signup card (droplet ripple) ---------- */
.acard{position:relative;background:linear-gradient(180deg,#0C2A39,#081E29);border:1px solid var(--border);border-radius:18px;padding:26px;box-shadow:0 20px 50px rgba(0,0,0,.4);overflow:hidden}
.acard::before{content:"";position:absolute;top:-40px;right:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.22),transparent 70%);pointer-events:none}
.acard h2,.acard h3{margin-top:0}
.acard .fld{display:block;margin:0 0 12px}
.acard label{font-size:.82rem;color:var(--muted);display:block;margin-bottom:5px}
.acard input{width:100%;background:#06171F;border:1px solid var(--border);border-radius:10px;color:var(--text);padding:12px 14px;font-family:var(--body);font-size:1rem}
.acard input:focus{border-color:var(--cyan);outline:none}
.acard .btn{width:100%;justify-content:center;margin-top:6px}
.acard .hint{font-size:.85rem;color:var(--dim);margin:12px 0 0}
.acard .hint a{color:var(--cyan)}

/* ---------- generic surfaces ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px}
.grid{display:grid;gap:18px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
@media(max-width:820px){.g3{grid-template-columns:1fr}.g2{grid-template-columns:1fr}}
.note{border-left:3px solid var(--cyan);background:rgba(34,211,238,.05);padding:14px 18px;border-radius:0 10px 10px 0;margin:0 0 1.2em}
.note.warn{border-left-color:var(--tiger);background:rgba(255,122,26,.06)}
.dropcap::first-letter{font-family:var(--disp);font-size:3.1rem;font-weight:700;float:left;line-height:.8;padding:6px 10px 0 0;color:var(--cyan)}
figure{margin:0 0 1.4em}
figure img{border-radius:var(--r);border:1px solid var(--border);width:100%}
figcaption{font-size:.82rem;color:var(--dim);margin-top:6px;text-align:center}

/* ---------- horizontal scroll rail w/ affordance ---------- */
.rail-wrap{position:relative}
.rail{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{height:7px}.rail::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}
.rail>*{flex:0 0 auto;scroll-snap-align:start}
.rail-wrap::after{content:"";position:absolute;top:0;right:0;bottom:14px;width:46px;background:linear-gradient(90deg,transparent,var(--bg));pointer-events:none}
.gcard{width:172px;background:var(--raised);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.gcard img{width:100%;aspect-ratio:4/3;object-fit:cover;border:0;border-radius:0}
.gcard span{display:block;padding:9px 12px;font-family:var(--disp);font-weight:600;font-size:.9rem}

/* ---------- tables ---------- */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;border:1px solid var(--border);border-radius:12px;margin:0 0 1.3em}
.tbl-wrap>table{min-width:430px;width:100%;border-collapse:collapse;font-size:.95rem}
.tbl-wrap th,.tbl-wrap td{padding:11px 14px;text-align:left;border-bottom:1px solid rgba(22,74,94,.6)}
.tbl-wrap th{background:#0B2735;color:var(--cyan);font-family:var(--disp);font-weight:600}
.tbl-wrap tr:last-child td{border-bottom:0}

/* ---------- seo-box variants ---------- */
.seo-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px 24px;margin-block:1.4em;font-size:.96rem}
.seo-box.band{background:linear-gradient(180deg,rgba(34,211,238,.07),rgba(14,43,59,.35));border-radius:0;border-inline:0;border-color:var(--border)}
.seo-box.ledger{border-left:4px solid var(--cyan)}
.seo-box.cols{columns:2;column-gap:34px}
@media(max-width:700px){.seo-box.cols{columns:1}}
.seo-box.grid-kw{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:700px){.seo-box.grid-kw{grid-template-columns:1fr}}
.seo-box.prose{background:transparent;border:0;border-top:2px solid var(--border);border-radius:0;padding-inline:0}
.seo-box h3,.seo-box h4{color:var(--cyan)}

/* ---------- chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 1.2em}
.chips span{background:var(--raised);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:6px 13px;font-size:.85rem}

/* ---------- FAQ ---------- */
.faq details{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin:0 0 12px;overflow:hidden}
.faq summary{cursor:pointer;padding:15px 18px;font-family:var(--disp);font-weight:600;list-style:none;position:relative;padding-right:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"💧";position:absolute;right:16px;top:14px;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq details>div{padding:0 18px 16px;color:var(--muted)}

/* ---------- breadcrumb / related ---------- */
.crumb{font-size:.82rem;color:var(--dim);padding-top:14px}
.crumb a{color:var(--muted)}
.related{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}
.related a{background:var(--raised);border:1px solid var(--border);border-radius:10px;padding:10px 16px;color:var(--text);font-weight:500;font-size:.92rem}

/* ---------- footer ---------- */
.ft{background:#061922;border-top:1px solid var(--border);margin-top:40px;padding-block:38px 22px;font-size:.9rem}
.ft .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:26px}
@media(max-width:820px){.ft .cols{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.ft .cols{grid-template-columns:1fr}}
.ft .lbl{font-family:var(--disp);font-weight:600;color:var(--cyan);font-size:.82rem;letter-spacing:1px;text-transform:uppercase;margin-bottom:10px}
.ft a{color:var(--muted);display:block;padding:4px 0}
.ft .social{display:flex;gap:12px;margin-top:12px}
.ft .social a{width:38px;height:38px;display:grid;place-items:center;background:var(--raised);border:1px solid var(--border);border-radius:9px;padding:0}
.ft .social svg{width:18px;height:18px;fill:var(--muted)}
.ft .tp{display:inline-block;margin-top:12px;color:var(--muted);font-size:.85rem;text-decoration:none}
.ft .tp:hover{color:var(--sky)}
.ft .qtech{display:flex;align-items:center;gap:10px;margin-top:16px}
.ft .qtech .plate{background:#fff;border-radius:8px;padding:6px 9px;display:inline-flex}
.ft .qtech .plate img{height:22px;width:auto}
.ft .qtech small{color:var(--dim);font-size:.78rem;line-height:1.4}
.ft .legal{border-top:1px solid rgba(22,74,94,.6);margin-top:24px;padding-top:16px;color:var(--dim);font-size:.82rem}
.ft .blurb{color:var(--dim);font-size:.86rem;max-width:44ch}

/* ---------- whatsapp float ---------- */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:120;width:60px;height:60px;border-radius:50%;background:var(--wa);display:grid;place-items:center;box-shadow:0 8px 24px rgba(37,211,102,.4);animation:wapulse 2.4s infinite}
.wa-float svg{width:32px;height:32px;fill:#fff}
@keyframes wapulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.45)}70%{box-shadow:0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}

/* ---------- reveal (default VISIBLE) ---------- */
.rv{transition:opacity .5s ease,transform .5s ease}
.js .rv.pre{opacity:0;transform:translateY(18px)}
.js .rv.on{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1!important;transform:none!important}}

/* ---------- home hero slider (crossfade + slow drift; first slide visible without JS) ---------- */
.tg-slider{position:relative}
.tg-track{display:grid;border-radius:var(--r);overflow:hidden}
.tg-track>.tg-slide{grid-area:1/1;display:block}
html:not(.js) .tg-track>.tg-slide:not(:first-child){display:none}
.js .tg-track>.tg-slide{opacity:0;transform:scale(1.05);transition:opacity .9s ease,transform 6.5s linear}
.js .tg-track>.tg-slide.is-on{opacity:1;transform:scale(1)}
.tg-dots{display:none;justify-content:center;gap:2px;margin-top:4px}
.js .tg-dots{display:flex}
.tg-dot{width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;border-radius:12px}
.tg-dot::before{content:"";width:10px;height:10px;border-radius:99px;background:var(--border);transition:width .3s ease,background .3s ease;pointer-events:none}
.tg-dot[aria-current="true"]::before{width:28px;background:var(--gold)}
.tg-dot:focus-visible{outline:2px solid var(--gold);outline-offset:-6px}
.tg-cap>span{display:none}
.tg-cap>span.is-on{display:block}
html:not(.js) .tg-cap>span:first-child{display:block}

/* ---------- sluice-gate reveal: curtain exists ONLY after JS adds .on; image never hidden by default ---------- */
.gate{position:relative;overflow:hidden}
.js .gate.on::before,.js .gate.on::after{content:"";position:absolute;left:0;right:0;height:50.5%;z-index:2;pointer-events:none;background:repeating-linear-gradient(90deg,#0E2B3B 0 22px,#0A2230 22px 26px);animation:gateUp 1.1s cubic-bezier(.7,0,.2,1) .08s forwards}
.js .gate.on::before{top:0;border-bottom:2px solid var(--gold)}
.js .gate.on::after{bottom:0;border-top:2px solid var(--gold);animation-name:gateDown}
.js .gate.done::before,.js .gate.done::after{content:none}
@keyframes gateUp{to{transform:translateY(-104%)}}
@keyframes gateDown{to{transform:translateY(104%)}}
@media(prefers-reduced-motion:reduce){.gate::before,.gate::after{content:none!important}.js .tg-track>.tg-slide{transform:none}}
