/* ============================================================
   legal.css — shared styling for the three policy pages
   (terms.html, refund.html, privacy.html).

   These pages exist because a payment gateway will not approve a
   site without them. They deliberately do NOT re-use the big inline
   stylesheet in index.html — they need type and a footer, not a hero,
   a gallery or a video grid. The colour tokens below are copied from
   index.html so the two match; if the palette there changes, change
   it here too.
   ============================================================ */

:root{
  --ink:#1a1208; --ink-soft:#3a2c18; --cream:#f7f2ea; --cream-2:#efe6d6;
  --gold:#b8860b; --gold-bright:#c8a24a; --rust:#8b4513; --line:#e2d6c0;
  --muted:#6d5f49; --white:#fffdf9;
  --serif:Georgia,'Times New Roman',serif;
  --sans:'Segoe UI',system-ui,-apple-system,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.68;-webkit-font-smoothing:antialiased}
a{color:var(--rust);text-decoration:none;border-bottom:1px solid rgba(139,69,19,.32)}
a:hover{color:var(--gold);border-color:var(--gold)}
.wrap{max-width:760px;margin:0 auto;padding:0 22px}

/* ---------- top bar ---------- */
.topbar{background:var(--white);border-bottom:1px solid var(--line);padding:14px 0}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;border:none}
.brand:hover{border:none}
.mark{position:relative;width:46px;height:46px;border-radius:50%;overflow:hidden;background:var(--ink);
  color:var(--gold-bright);display:grid;place-items:center;font-family:var(--serif);font-size:20px;font-weight:700;
  flex:none;box-shadow:0 0 0 2px var(--gold-bright), 0 0 0 4px rgba(200,162,74,.28)}
/* Top-aligned — the portrait is a tall head-and-shoulders shot and a centre
   crop shaves the top of the head off. Same rule as index.html. */
.mark img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0%}
.brand b{display:block;font-family:var(--serif);font-size:21px;letter-spacing:.04em;color:var(--ink);line-height:1.1}
.brand .full{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.back{font-size:13.5px;font-weight:600;white-space:nowrap}

/* ---------- document ---------- */
.doc{padding:52px 0 20px}
.eyebrow{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:700}
h1{font-family:var(--serif);font-size:clamp(30px,6vw,42px);line-height:1.15;margin:10px 0 8px;font-weight:400}
.updated{font-size:13px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:30px}
h2{font-family:var(--serif);font-size:clamp(20px,3.4vw,24px);font-weight:400;margin:36px 0 10px;color:var(--ink)}
h3{font-family:var(--sans);font-size:15px;font-weight:700;margin:22px 0 6px}
p{margin:0 0 14px;color:var(--ink-soft)}
ul,ol{margin:0 0 16px;padding-left:22px;color:var(--ink-soft)}
li{margin-bottom:8px}
b,strong{color:var(--ink)}
.lede{font-size:17px;color:var(--ink)}

/* A bordered aside for the things that matter most — the refund window,
   the "we never see your card" line, the certificate condition. */
.note{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:0 10px 10px 0;padding:18px 22px;margin:22px 0}
.note p:last-child{margin-bottom:0}

/* Deliberately loud, because an unfilled placeholder must not reach a
   payment gateway's reviewer unnoticed. Delete the element once filled. */
.todo{background:#fff4d6;border:1px dashed var(--rust);border-radius:10px;padding:14px 18px;margin:22px 0;
  font-size:14px;color:var(--rust)}

/* A registration number must never break across two lines — half an
   identifier is worse than useless to anyone checking it. */
.udyam{white-space:nowrap}

table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14.5px}
th,td{text-align:left;padding:11px 12px;border:1px solid var(--line);vertical-align:top}
th{background:var(--cream-2);font-weight:700;color:var(--ink)}
td{color:var(--ink-soft)}

.contact{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:22px 24px;margin:34px 0 0}
.contact p{margin-bottom:6px}

/* ---------- footer ---------- */
footer{margin-top:56px;background:var(--ink);color:#c9bda6;padding:26px 0;font-size:13px}
footer a{color:var(--gold-bright);border-color:rgba(200,162,74,.4)}
footer .wrap{text-align:center}
.foot-links{margin-bottom:10px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}

@media (max-width:560px){
  .doc{padding:34px 0 14px}
  .brand .full{display:none}
  table{font-size:13.5px}
  th,td{padding:9px 10px}
}