/* ═══════════════════════════════════════════════════════════════
   BODHAKA v2 — "Notebook & Chalkboard" design system
   Shared by every page in /v2. Fonts loaded per-page via Google Fonts:
   Anton · Source Serif 4 · Kalam · Inter
   ═══════════════════════════════════════════════════════════════ */
:root{
  --paper:#faf7ee;
  --paper-dim:#f2eddd;
  --board:#21443b;
  --board-deep:#173129;
  --chalk:#f2efe4;
  --chalk-dim:#c5d4cb;
  --chalk-gold:#ffd98a;
  --ink:#1a1d21;
  --soft:#41464d;
  --muted:#8a8f97;
  --amber:#d99a2b;
  --amber-deep:#a96f0f;
  --inkblue:#3a6ba3;
  --margin-red:#cf6a5a;
  --rule-blue:rgba(58,107,163,.16);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--paper); color:var(--ink); font-family:'Source Serif 4', Georgia, serif;}
img{max-width:100%;}

/* ── large-screen scaling ──
   Body copy is set in px, so on wide external monitors the site looked
   physically small. Scale the whole page up proportionally instead of
   letting it shrink into the extra width. */
@media (min-width:1600px){ body{zoom:1.12;} }
@media (min-width:1920px){ body{zoom:1.25;} }
@media (min-width:2400px){ body{zoom:1.5;} }

/* ── notebook ruled paper ── */
.ruled{
  background-image:
    linear-gradient(var(--rule-blue) 1px, transparent 1px),
    linear-gradient(90deg, var(--margin-red) 1.5px, transparent 1.5px);
  background-size:100% 38px, 100% 100%;
  background-position:0 24px, 72px 0;
}
@media (max-width:760px){ .ruled{background-position:0 24px, 28px 0;} }

.container{max-width:1180px; margin:0 auto; padding:0 5vw;}
.container-narrow{max-width:880px; margin:0 auto; padding:0 5vw;}

/* ── type ── */
h1,h2,h3,h4,.anton{font-family:'Anton', Impact, sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:.01em;}
.hand{font-family:'Kalam', cursive;}
.ui{font-family:'Inter', sans-serif;}
.hl{background:linear-gradient(transparent 52%, rgba(217,154,43,.42) 52%, rgba(217,154,43,.42) 92%, transparent 92%);}
.hl-blue{background:linear-gradient(transparent 52%, rgba(58,107,163,.28) 52%, rgba(58,107,163,.28) 92%, transparent 92%);}
.tm{font-size:.42em; font-style:normal; letter-spacing:0; position:relative; top:-1.15em; vertical-align:baseline; display:inline-block; margin-left:1px;}
.kicker{font-family:'Kalam',cursive; font-size:17px; color:var(--amber-deep); letter-spacing:.04em;}
.kicker::before{content:"※ "; color:var(--margin-red);}
.small-hand{font-family:'Kalam',cursive; font-size:15px; color:var(--soft);}
.standfirst{margin-top:24px; font-size:clamp(16px,1.5vw,19.5px); line-height:1.6; max-width:52ch; color:var(--soft);}
.note{position:absolute; font-family:'Kalam',cursive; font-size:15.5px; color:var(--inkblue); line-height:1.3; max-width:180px;}

/* ── figures: ink frame + plaster strips holding the image ── */
.fig{position:relative; background:#fff; border:3px solid var(--ink); box-shadow:10px 10px 0 var(--amber);}
.fig img{width:100%; display:block;}
.fig .tab{
  position:absolute; top:-30px; left:18px; z-index:6;
  font-family:'Inter',sans-serif; font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  background:var(--ink); color:var(--paper); padding:7px 14px 6px; border-radius:6px 6px 0 0;
}
.fig figcaption{font-family:'Kalam',cursive; font-size:15px; color:var(--soft); padding:10px 14px; border-top:2px dashed rgba(26,29,33,.25); background:#fff;}
.fig.shadow-soft{box-shadow:10px 10px 0 rgba(26,29,33,.14);}

/* cellotape — translucent sticky tape with torn serrated ends;
   pin one at each corner you like (class name kept as .plaster so
   existing markup keeps working) */
.plaster{
  position:absolute; width:118px; height:34px; z-index:5; pointer-events:none;
  background:linear-gradient(105deg,
    rgba(240,233,202,.78) 0%,
    rgba(255,255,255,.9) 28%,
    rgba(238,230,198,.74) 52%,
    rgba(255,255,255,.86) 74%,
    rgba(240,233,202,.8) 100%);
  box-shadow:0 2px 5px rgba(0,0,0,.22);
  border-top:1px solid rgba(255,255,255,.5);
  border-bottom:1px solid rgba(120,110,80,.14);
  clip-path:polygon(
    2.5% 0%, 100% 0%, 97.5% 10%, 100% 22%, 97.8% 34%, 100% 47%,
    97.5% 60%, 100% 72%, 97.8% 85%, 100% 100%, 2.5% 100%,
    0% 88%, 2.2% 76%, 0% 63%, 2.5% 50%, 0% 38%, 2.2% 26%, 0% 13%);
}
.plaster::before{
  content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(90deg,
    transparent 0 16px, rgba(255,255,255,.14) 16px 17px);
}
.plaster.tl{top:-13px; left:-34px; transform:rotate(-42deg);}
.plaster.tr{top:-13px; right:-34px; transform:rotate(42deg);}
.plaster.bl{bottom:-13px; left:-34px; transform:rotate(42deg);}
.plaster.br{bottom:-13px; right:-34px; transform:rotate(-42deg);}
.plaster.top{top:-15px; left:50%; transform:translateX(-50%) rotate(-3deg);}

/* ── buttons ── */
.btn{
  display:inline-block; text-decoration:none; font-family:'Anton',sans-serif; font-size:16.5px;
  letter-spacing:.06em; text-transform:uppercase; padding:15px 30px;
  border:3px solid var(--ink); transition:transform .12s, box-shadow .12s; cursor:pointer;
}
.btn-amber{background:var(--amber); color:var(--ink); box-shadow:7px 7px 0 var(--ink);}
.btn-amber:hover{transform:translate(3px,3px); box-shadow:4px 4px 0 var(--ink);}
.btn-line{background:transparent; color:var(--ink); box-shadow:7px 7px 0 rgba(26,29,33,.18);}
.btn-line:hover{transform:translate(3px,3px); box-shadow:4px 4px 0 rgba(26,29,33,.18);}
.btn-chalk{background:var(--chalk); color:var(--board-deep); border-color:var(--chalk); box-shadow:7px 7px 0 var(--amber);}
.btn-chalk:hover{transform:translate(3px,3px); box-shadow:4px 4px 0 var(--amber);}

/* ── nav ── */
nav.v2{
  position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:3px solid var(--ink);
  display:flex; align-items:center; justify-content:space-between; padding:12px 4vw;
}
nav.v2 .brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink);}
nav.v2 .brand img{width:36px;height:36px;}
nav.v2 .brand .nm{font-family:'Anton',sans-serif; font-size:20px;}
nav.v2 .brand small{display:block; font-family:'Kalam',cursive; font-size:11.5px; color:var(--soft);}
nav.v2 ul{display:flex; gap:20px; list-style:none; font-family:'Inter',sans-serif; font-size:13.5px; font-weight:600; align-items:center;}
nav.v2 ul a{color:var(--ink); text-decoration:none; white-space:nowrap;}
nav.v2 ul a:hover{color:var(--amber-deep);}
nav.v2 .btn{font-family:'Inter',sans-serif; font-weight:500; font-size:13px; letter-spacing:.04em; padding:10px 22px; border-width:2.5px; box-shadow:4px 4px 0 var(--ink); white-space:nowrap; text-transform:none;}
nav.v2 .btn:hover{color:var(--inkblue);}
@media (max-width:1240px){ nav.v2 ul{gap:15px; font-size:12.5px;} }
.flag-new{
  font-family:'Kalam',cursive; font-size:11px; color:#fff; background:var(--margin-red);
  padding:1px 7px 2px; border-radius:999px; margin-left:5px; vertical-align:2px;
}
nav.v2 .nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:6px;}
nav.v2 .nav-toggle span{display:block; width:24px; height:3px; background:var(--ink); margin:5px 0;}
@media (max-width:980px){
  nav.v2 ul{
    display:none; position:absolute; top:100%; left:0; right:0; background:var(--paper);
    border-bottom:3px solid var(--ink); flex-direction:column; padding:18px 6vw; gap:16px; align-items:flex-start;
  }
  nav.v2 ul.open{display:flex;}
  nav.v2 .nav-toggle{display:block;}
}

/* ── chalkboard band ── */
.board{
  background:
    radial-gradient(ellipse 90% 70% at 50% 0%, rgba(255,255,255,.05), transparent 60%),
    linear-gradient(180deg, var(--board) 0%, var(--board-deep) 100%);
  color:var(--chalk); padding:84px 0 92px;
  border-top:14px solid var(--amber); border-bottom:14px solid var(--amber);
}
.board .kicker{color:var(--chalk-gold);}
.board .kicker::before{color:#ff9d8a;}
.board h2{color:#fff;}
.board .chalk-em{color:var(--chalk-gold);}
.board p{color:var(--chalk-dim);}
.board .frame{border:3px dashed rgba(242,239,228,.4); padding:clamp(24px,4vw,54px); position:relative;}
.chalk-dash{height:7px; background:repeating-linear-gradient(90deg, var(--amber) 0 14px, transparent 14px 22px);}

/* ── sections ── */
.sec{padding:80px 0 88px;}
.sec-dim{background:var(--paper-dim); border-top:3px solid var(--ink);}
.sec h2{font-size:clamp(28px,3.8vw,46px); line-height:1.04;}

/* ── document / legal prose (policies, terms, about) ── */
.doc-hero{padding:76px 0 50px;}
.doc-hero h1{font-size:clamp(36px,4.8vw,62px); line-height:1.02; margin-top:14px; max-width:24ch;}
.doc-hero .doc-meta{margin-top:18px; font-family:'Kalam',cursive; font-size:15.5px; color:var(--soft);}
.doc{padding:30px 0 90px;}
.doc article{max-width:820px;}
.doc h2{font-size:clamp(22px,2.6vw,30px); margin:54px 0 0; padding-top:18px; border-top:3px solid var(--ink);}
.doc h3{font-size:clamp(17px,2vw,21px); margin:34px 0 0; color:var(--ink);}
.doc h4{font-family:'Inter',sans-serif; font-weight:700; text-transform:none; letter-spacing:0; font-size:16px; margin:26px 0 0;}
.doc p{margin-top:16px; font-size:16px; line-height:1.75; color:var(--soft);}
.doc li{margin-top:10px; font-size:15.5px; line-height:1.7; color:var(--soft);}
.doc ul, .doc ol{margin-top:14px; padding-left:26px;}
.doc strong{color:var(--ink);}
.doc a{color:var(--inkblue);}
.doc table{width:100%; border-collapse:collapse; margin-top:20px; font-size:14.5px; font-family:'Inter',sans-serif;}
.doc th{font-weight:700; text-align:left; background:var(--ink); color:var(--paper); padding:10px 12px;}
.doc td{padding:10px 12px; border:1.5px solid rgba(26,29,33,.25); color:var(--soft); vertical-align:top; line-height:1.6;}
.doc .callout{
  margin-top:24px; padding:18px 24px; border-left:6px solid var(--amber); background:#fff;
  border-top:1.5px solid rgba(26,29,33,.12); border-bottom:1.5px solid rgba(26,29,33,.12);
  font-size:15.5px; line-height:1.7; color:var(--soft);
}
.toc{
  margin-top:34px; padding:22px 26px; background:#fff; border:3px solid var(--ink);
  box-shadow:8px 8px 0 rgba(26,29,33,.12); max-width:820px;
}
.toc .toc-title{font-family:'Anton',sans-serif; font-size:15px; letter-spacing:.08em; text-transform:uppercase;}
.toc ol{margin-top:12px; padding-left:24px; columns:2; column-gap:40px;}
.toc li{margin-top:7px; font-size:14.5px; font-family:'Inter',sans-serif;}
.toc a{color:var(--inkblue); text-decoration:none;}
.toc a:hover{text-decoration:underline;}
@media (max-width:700px){ .toc ol{columns:1;} }

/* ── cards ── */
.card{background:#fff; border:3px solid var(--ink); padding:24px 22px 26px; position:relative;}
.card.lift{box-shadow:8px 8px 0 rgba(26,29,33,.12);}
.card h3{font-size:19px;}
.card p{margin-top:10px; font-size:14.5px; line-height:1.6; color:var(--soft);}
.idx-dot{
  position:absolute; top:-18px; left:18px; width:36px; height:36px; border-radius:50%;
  background:var(--inkblue); color:#fff; font-family:'Anton',sans-serif; font-size:16px;
  display:flex; align-items:center; justify-content:center; border:3px solid var(--paper-dim);
}

/* ── reveal on scroll ── */
.rv{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease;}
.rv.in{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){ .rv{opacity:1; transform:none; transition:none;} }

/* ── footer ── */
footer.v2{
  background:var(--board-deep); color:var(--chalk-dim); padding:46px 0 40px;
  font-family:'Inter',sans-serif; font-size:13px; border-top:14px solid var(--amber);
}
footer.v2 .cols{display:flex; justify-content:space-between; flex-wrap:wrap; gap:26px;}
footer.v2 a{color:var(--chalk); text-decoration:none;}
footer.v2 a:hover{color:var(--chalk-gold);}
footer.v2 .hand{color:var(--chalk-gold); font-size:15px;}
footer.v2 h5{font-family:'Anton',sans-serif; font-weight:400; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--chalk); margin-bottom:10px;}
footer.v2 ul{list-style:none;}
footer.v2 li{margin-top:7px;}
footer.v2 .legal{margin-top:30px; padding-top:18px; border-top:1.5px dashed rgba(242,239,228,.25); font-size:12px; color:#9fb0a6; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}