/* onlytherent.com — editorial base styles. Light default, dark via [data-theme="dark"]. */
:root{
  --ink:#141414; --muted:#6b6259; --paper:#fbf8f3; --surface:#fff; --line:#e6dfd5;
  --accent:#c2410c; --link:#a5340a;
  --law:#1c3a6e; --law-bg:#e8edf6; --reg:#1f5c2a; --reg-bg:#e9f2ea;
  --pol:#7a5a12; --pol-bg:#f7f0e0; --arg:#6b2c58; --arg-bg:#f4eaf0; --unres:#4a4a4a; --unres-bg:#eeeeee;
  --radius:14px; --maxw:1120px;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --ink:#ece7df; --muted:#a89f92; --paper:#17140f; --surface:#1e1a14; --line:#332c23;
  --accent:#ff7a3d; --link:#ffa06b;
  --law:#a9c4ea; --law-bg:#1e2b40; --reg:#a8d3b1; --reg-bg:#1b2e1f;
  --pol:#e0c47f; --pol-bg:#2e2716; --arg:#e0aed0; --arg-bg:#2c1e28; --unres:#c9c9c9; --unres-bg:#242424;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
img{max-width:100%}
a{color:var(--link)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* Header */
header.site{padding:20px 0 6px}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.wordmark{font-weight:800;font-size:20px;letter-spacing:-.02em;text-decoration:none;color:var(--ink)}
.wordmark span{color:var(--accent)}
.hnav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hnav a{color:var(--muted);text-decoration:none;font-size:15px}
.hnav a:hover,.hnav a[aria-current="page"]{color:var(--ink)}
.hnav a[aria-current="page"]{font-weight:650}

/* Theme slider */
.theme-toggle{position:relative;width:52px;height:28px;border-radius:999px;border:1px solid var(--line);background:transparent;cursor:pointer;padding:0;flex:0 0 52px}
.theme-toggle:hover{border-color:var(--ink)}
.theme-toggle .knob{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;transition:transform .18s ease}
html[data-theme="dark"] .theme-toggle .knob{transform:translateX(24px)}
.theme-toggle svg{width:13px;height:13px;display:block}
.theme-toggle .icon-sun{display:none}
html[data-theme="dark"] .theme-toggle .icon-moon{display:none}
html[data-theme="dark"] .theme-toggle .icon-sun{display:block}
@media (prefers-reduced-motion: reduce){.theme-toggle .knob{transition:none}}

/* Typography */
.hero{padding:34px 0 8px}
h1{font-size:clamp(34px,5.4vw,58px);line-height:1.05;letter-spacing:-.03em;margin:0 0 20px;font-weight:800;max-width:17em}
/* Region-aware homepage headline. data-verdict is set before first paint by the
   Worker from Cloudflare's regionCode, or by quote.js from the timezone when
   the Worker cannot place the visitor. "law" and "reg" append the closing claim
   where it holds, in the accent colour; "soft" swaps the opening sentence for
   the softer version used where it does not, leaving the qualifiers below the
   headline to do the rest of the work. With no verdict the headline stands
   alone. */
h1[data-verdict] .verdict{display:none}
h1[data-verdict="soft"] .v-head{display:none}
h1[data-verdict="soft"] .v-soft{display:inline}
h1[data-verdict="law"] .v-law,
h1[data-verdict="reg"] .v-reg{display:inline;color:var(--accent)}
/* The prohibition itself, underlined on the homepage. Underlined in the text
   colour, not the accent, so it reads as emphasis rather than as a link. */
h1 .hl{text-decoration:underline;text-decoration-thickness:.07em;text-underline-offset:.1em}
.lede{font-size:21px;color:var(--muted);max-width:40em;margin:0 0 14px}
h2{font-size:clamp(22px,2.6vw,28px);letter-spacing:-.02em;margin:44px 0 14px}
h3{font-size:19px;margin:28px 0 10px}
section{padding:6px 0 18px}
.prose p,.prose li{max-width:44em}
.prose ul{padding-left:22px}
.muted{color:var(--muted)}
.small{font-size:14.5px}

/* Pull quote */
.pull{margin:40px 0;padding:32px 0;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.pull p{font-size:clamp(22px,3.2vw,34px);line-height:1.25;font-weight:600;letter-spacing:-.015em;margin:0 0 14px;max-width:22em}
.pull cite,.quote cite{font-style:normal;color:var(--muted);font-size:14.5px;display:block}
.pull .small{margin-top:12px}

/* Evidence badges */
.badge{display:inline-block;font:11px/1 system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;padding:4px 8px;border-radius:999px;margin-right:8px;vertical-align:2px}
.ev-law{background:var(--law-bg);color:var(--law)}
.ev-reg{background:var(--reg-bg);color:var(--reg)}
.ev-pol{background:var(--pol-bg);color:var(--pol)}
.ev-arg{background:var(--arg-bg);color:var(--arg)}
.ev-unres{background:var(--unres-bg);color:var(--unres)}

/* Quote block */
.quote{border-left:3px solid var(--accent);padding:4px 0 4px 18px;margin:20px 0;color:var(--ink)}
.quote p{margin:0 0 8px}
.src{display:block;margin-top:6px;font-size:14.5px;color:var(--muted)}
.src a{color:var(--link)}

/* Cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:18px 0}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.card b{display:block;font-size:13px;letter-spacing:.09em;color:var(--accent);margin-bottom:8px}
.card p{margin:0 0 10px;font-size:15.5px}
.card a{font-size:15px;font-weight:600}

/* Panels */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;margin:24px 0}
.offer{background:var(--ink);color:var(--paper);border-radius:18px;padding:26px}
html[data-theme="dark"] .offer{background:#0f0d0a;color:#f3eee7}
.offer h3{margin:0 0 8px;font-size:20px}
.offer p{color:var(--muted);font-size:15.5px;margin:0 0 18px}
html[data-theme="dark"] .offer p{color:#bcb2a5}
.btn{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;font-weight:650;padding:12px 18px;border-radius:10px}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}

/* Tables */
.tbl{width:100%;border-collapse:collapse;margin:18px 0;font-size:15.5px}
.tbl th,.tbl td{text-align:left;padding:12px 12px 12px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

/* FAQ */
.faq{max-width:62em}
.qa{border-top:1px solid var(--line)}
.qa:last-of-type{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;gap:16px;align-items:baseline;padding:18px 0 16px;font-size:clamp(17px,2.1vw,20px);font-weight:650;letter-spacing:-.012em}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before{content:"+";color:var(--accent);font-weight:800;font-size:23px;line-height:1;flex:0 0 20px}
.qa[open] summary{padding-bottom:4px}
.qa[open] summary::before{content:"\2013"}
.qa .a{padding:0 0 22px 36px;color:var(--ink)}
.qa .a p{margin:0 0 12px;max-width:44em}

/* Letter template */
.letterbox{margin:18px 0}
.lettertop{display:flex;justify-content:flex-end;margin-bottom:8px}
.letter{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;font:15.5px/1.7 Georgia,serif;white-space:pre-wrap;margin:0}
.copybtn{background:transparent;border:1px solid var(--line);border-radius:999px;color:var(--muted);font:inherit;font-size:14px;font-weight:600;padding:7px 15px;cursor:pointer}
.copybtn:hover{border-color:var(--ink);color:var(--ink)}
/* Announced, never shown: a visible status line here appeared and vanished as
   it was set, which moved the letters below it around. */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* Jurisdiction switcher under each letter. All three bars set the same value,
   so the letters can never be read in a combination that cannot be sent. */
.jurbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:12px}
.jurbar .lbl{font-size:14px;color:var(--muted);margin-right:4px}
.jurbtn{background:transparent;border:1px solid var(--line);border-radius:999px;color:var(--muted);font:inherit;font-size:12.5px;font-weight:650;letter-spacing:.05em;padding:5px 12px;cursor:pointer}
.jurbtn:hover{border-color:var(--ink);color:var(--ink)}
.jurbtn[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
/* Footer */
footer.site{margin-top:56px;padding:28px 0 40px;border-top:1px solid var(--line);color:var(--muted);font-size:14.5px}
footer.site .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
footer.site a{color:var(--muted)}

@media(max-width:640px){
  .wrap{padding:0 18px}
  h1{font-size:clamp(30px,8vw,40px)}
}