/* policy.css — shared styling for the Contact, Terms, Refunds and Privacy
   pages, rebuilt on the cult page's design language so the legal pages read
   as part of the product rather than a bolt-on.

   What changed: these pages ran on their own cream palette with Poppins
   headings, and switched to dark only by following the OS through
   prefers-color-scheme — so a visitor who chose light on the cult page still
   got dark here if their system said so, and there was no way to change it.
   The tokens below are lifted from cult.html verbatim, the display face is
   Fraunces to match, and the theme is driven by html[data-theme] using the
   same ac_theme localStorage key. A choice made anywhere on the site now
   holds everywhere, and the header toggle works on these pages too. */

:root{
  /* ground */
  --void:#08061a;
  --deep:#0d0a26;
  --panel:#131030;
  --panel-2:#1a1640;

  /* type */
  --parch:#e8dcc0;
  --ink:#f4f0ff;
  --body:#b9b2d6;
  --muted:#7d76a4;

  /* accents */
  --brand:#f0546c;
  --brand-deep:#d63b53;
  --brand-soft:rgba(240,84,108,.10);
  --gold:#e0ad4e;
  --gold-soft:rgba(224,173,78,.12);
  --brass:#9a7b3f;
  --brass-lit:#c9a86a;
  --ok:#3fb984;

  /* structure */
  --line:rgba(232,220,192,.14);
  --line-2:rgba(232,220,192,.07);
  --r:14px;
  --r-lg:22px;

  --font-display:"Fraunces","Tiro Devanagari Hindi",Georgia,serif;
  --font-body:"Inter","Tiro Devanagari Hindi",system-ui,-apple-system,sans-serif;
  --font-mono:"JetBrains Mono","Tiro Devanagari Hindi",ui-monospace,SFMono-Regular,monospace;
}

html[data-theme="light"]{
  --void:#eef3fb;
  --deep:#e4ecf8;
  --panel:#ffffff;
  --panel-2:#f5f8fd;

  --parch:#1a1633;
  --ink:#120f26;
  --body:#463f63;
  --muted:#6f6889;

  --brand:#d0243f;
  --brand-deep:#a81730;
  --brand-soft:rgba(208,36,63,.09);
  --gold:#8f6410;
  --gold-soft:rgba(176,125,23,.13);
  --brass:#8a6420;
  --brass-lit:#6f4f16;
  --ok:#0f6b4a;

  --line:rgba(26,22,51,.14);
  --line-2:rgba(26,22,51,.07);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--void);
  color:var(--body);
  font-family:var(--font-body);
  font-size:15.5px;line-height:1.68;
  -webkit-font-smoothing:antialiased;
  transition:background .3s ease,color .3s ease;
}

/* the same sky the cult page sits under, at lower intensity — long legal
   text has to stay comfortable to read over it */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 520px at 82% -14%, var(--brand-soft), transparent 62%),
    radial-gradient(720px 460px at 6% 2%, var(--gold-soft), transparent 64%);
}
html[data-theme="light"] body::before{
  background:
    radial-gradient(1000px 560px at 80% -12%, rgba(255,214,140,.42), transparent 62%),
    radial-gradient(820px 500px at 6% 2%, rgba(190,214,255,.55), transparent 64%);
}

.wrap{max-width:820px;margin:0 auto;padding:22px 20px 64px}

/* ===== HEADER ============================================================ */
.ptop{
  display:flex;align-items:center;gap:14px;
  padding:14px 0 16px;margin-bottom:26px;
  border-bottom:1px solid var(--line);
}
.plogo{display:block;line-height:0;text-decoration:none;flex:0 0 auto}
.plogo img{display:block;height:30px;width:auto;transition:opacity .25s}
.plogo:hover img{opacity:.8}
.pctl{margin-left:auto;display:flex;align-items:center;gap:10px;flex:0 0 auto}

.back{
  display:inline-block;margin:0 0 16px;
  font-family:var(--font-mono);font-size:11.5px;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;transition:color .2s;
}
.back:hover{color:var(--gold)}

/* ===== PAGE HEAD ========================================================= */
.phead{margin-bottom:26px}
h1{
  font-family:var(--font-display);font-size:clamp(28px,4.4vw,38px);font-weight:600;
  color:var(--parch);letter-spacing:-.015em;line-height:1.14;margin:0 0 10px;
}
.lede{font-size:16px;color:var(--muted);margin:0;max-width:62ch}
.updated{
  font-family:var(--font-mono);font-size:11px;color:var(--muted);
  letter-spacing:.1em;text-transform:uppercase;margin-top:12px;
}

/* ===== CARDS ============================================================= */
.pcard{
  position:relative;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:24px 26px;margin-bottom:14px;
}
.pcard h2{
  font-family:var(--font-display);font-size:20px;font-weight:600;color:var(--parch);
  letter-spacing:-.01em;margin:0 0 14px;
}
.pcard h3{
  font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--ink);
  margin:22px 0 8px;
}
.pcard p{margin:0 0 12px}
.pcard p:last-child{margin-bottom:0}
.pcard ul,.pcard ol{margin:0 0 12px;padding-left:22px}
.pcard li{margin-bottom:7px}
.pcard li::marker{color:var(--brass-lit)}
.pcard a{color:var(--brand);text-decoration:none;font-weight:500}
.pcard a:hover{text-decoration:underline;text-decoration-color:var(--gold)}
strong{color:var(--ink);font-weight:600}

/* definition lists for contact / business details */
.kv{display:grid;grid-template-columns:160px 1fr;gap:11px 20px;margin:0}
.kv dt{
  font-family:var(--font-mono);font-size:10.5px;font-weight:500;
  text-transform:uppercase;letter-spacing:.13em;color:var(--brass-lit);padding-top:3px;
}
.kv dd{margin:0;color:var(--body)}

/* callout for the important line on a page */
.note-box{
  background:var(--gold-soft);border:1px solid var(--line);
  border-left:2px solid var(--gold);
  border-radius:11px;padding:15px 17px;margin:0 0 14px;font-size:14.5px;
}
.note-box.warn{background:var(--brand-soft);border-left-color:var(--brand)}

/* ===== PRICING TABLES ==================================================== */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 16px}
.plan{
  position:relative;background:var(--panel-2);border:1px solid var(--line);
  border-radius:var(--r);padding:22px 18px;text-align:center;
}
.plan.best{border-color:var(--gold);background:var(--panel)}
.plan-badge{
  position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  background:var(--gold);color:#221641;font-family:var(--font-mono);
  font-size:9.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:3px 10px;border-radius:99px;white-space:nowrap;
}
.plan-name{
  font-family:var(--font-mono);font-size:10.5px;font-weight:500;
  text-transform:uppercase;letter-spacing:.13em;color:var(--muted);
}
.plan-amt{
  font-family:var(--font-display);font-size:34px;font-weight:600;color:var(--parch);
  letter-spacing:-.02em;line-height:1.2;margin:6px 0 1px;
}
.plan-per{font-size:12.5px;color:var(--muted)}
.plan-save{margin-top:7px;font-size:12px;font-weight:600;color:var(--ok)}
.plan-tax{font-size:11px;color:var(--muted);margin-top:5px}

.ftable{width:100%;border-collapse:collapse;font-size:14.5px;margin:0 0 12px}
.ftable th{
  text-align:left;padding:10px 12px;font-family:var(--font-mono);
  font-size:10.5px;font-weight:500;text-transform:uppercase;letter-spacing:.11em;
  color:var(--brass-lit);background:var(--panel-2);border-bottom:1px solid var(--line);
}
.ftable td{padding:10px 12px;border-bottom:1px solid var(--line-2)}
.ftable tr:last-child td{border-bottom:none}
.ftable td:last-child{text-align:right;white-space:nowrap;font-weight:600;color:var(--ink)}

/* ===== FOOTER ============================================================ */
.pfoot{margin-top:36px;padding-top:22px;border-top:1px solid var(--line);text-align:center}
.plinks{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:center;margin-bottom:14px}
.plinks a{font-size:13.5px;color:var(--muted);text-decoration:none;font-weight:500;transition:color .2s}
.plinks a:hover{color:var(--gold)}
.pcopy{
  font-family:var(--font-mono);font-size:10.5px;color:var(--muted);margin:0;
  letter-spacing:.14em;text-transform:uppercase;
}

/* ===== CONTROLS ========================================================== */
/* both lifted from the cult header so the two sets of pages feel identical */
.themeb{
  width:36px;height:36px;flex:0 0 auto;display:grid;place-items:center;
  border:1px solid var(--line);border-radius:999px;background:var(--panel);
  color:var(--body);cursor:pointer;transition:.16s;padding:0;
}
.themeb:hover{border-color:var(--gold);color:var(--gold)}
.themeb:active{transform:scale(.93)}
.themeb svg{width:17px;height:17px}
.themeb .ic-sun{display:none}
html[data-theme="light"] .themeb .ic-sun{display:block}
html[data-theme="light"] .themeb .ic-moon{display:none}

.plang{
  display:flex;gap:2px;background:var(--panel);border:1px solid var(--line);
  border-radius:999px;padding:3px;width:max-content;
}
.plang button{
  border:none;background:none;color:var(--muted);font-family:var(--font-mono);
  font-size:10.5px;font-weight:500;letter-spacing:.1em;padding:6px 13px;
  border-radius:999px;cursor:pointer;transition:.16s;
}
.plang button:hover{color:var(--ink)}
.plang button.on{background:var(--gold);color:#221641;font-weight:700}

/* In light mode --gold darkens to #8f6410, so the dark-purple label it carries
   on the dark theme would sit dark-on-dark. cult.html solves this the same
   way; matching it keeps the two controls identical. */
html[data-theme="light"] .plang button.on{color:#fff}
html[data-theme="light"] .plan-badge{color:#fff}

html[lang="hi"] body{font-size:15px}

@media (max-width:560px){
  .wrap{padding:18px 17px 52px}
  .kv{grid-template-columns:1fr;gap:2px 0}
  .kv dt{padding-top:12px}
  .plans{grid-template-columns:1fr}
  .pcard{padding:19px 18px}
  .plogo img{height:26px}
  .pctl{gap:8px}
}

@media(prefers-reduced-motion:reduce){
  body,.themeb,.back,.plinks a{transition:none}
}
