/* Signature theme for the SilverMoose subpages (industry pages, guides, examples, webshop, Moose Aid).
   Loaded after the existing branch.css and menu.css: it only restyles, so the pages keep their content and structure. */
:root{--bg:#10130f;--panel:#1b2019;--ink:#f3f4eb;--muted:#b2b9aa;--soft:#d3d9cb;--line:#343c2f;--lime:#a8dd6a;--link:#a8dd6a;--accent:#a8dd6a;--accent-ink:#1a270e}
:root[data-theme=light]{--bg:#f3f1e9;--panel:#e8e7dd;--ink:#222b22;--muted:#586250;--soft:#38432f;--line:#cbd0c2;--lime:#49672a;--link:#49672a;--accent:#49672a;--accent-ink:#f4f6ed}
:root[data-theme=light] .eyebrow,:root[data-theme=light] .price strong,:root[data-theme=light] .check li:before,:root[data-theme=light] .brand svg{color:var(--accent)}

body{font-family:Manrope,Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
.wrap{max-width:1180px;padding:0 max(20px,4vw)}

/* Header: Signature wordmark, menu and flags */
header .wrap{min-height:92px}
.brand{font-size:24px;letter-spacing:-1.1px;gap:9px}
.brand svg{color:var(--accent);width:34px;height:34px}
.brand-dot{color:var(--accent);margin-left:-9px}
header nav{gap:6px 26px;font-size:13px;font-weight:600}
header nav a{padding:6px 2px;border-radius:999px}
header nav a:hover{color:var(--accent)}
.tools{gap:8px}
.tools button{font-family:inherit;border-radius:999px;min-width:38px;min-height:34px}
.tools button[aria-pressed=true]{background:transparent;color:var(--ink);border-color:var(--accent)}
.tools .flag{display:inline-grid;place-items:center;width:38px;height:28px;min-height:0;padding:0;border-radius:7px;opacity:.55;transition:opacity .2s}
.tools .flag svg{width:24px;height:15px;border-radius:2px;display:block}
.tools .flag:hover{opacity:.9}
.tools .flag[aria-pressed=true]{opacity:1}

/* Hero: big Signature headline with the silver moose faintly in the background on wide screens */
.hero{position:relative;isolation:isolate;overflow:hidden;padding:84px 0 64px}
.hero::after{content:'';position:absolute;z-index:-1;inset:0 0 0 38%;background:url('assets/moose.webp') 70% 45%/cover no-repeat;opacity:.32;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
:root[data-theme=light] .hero::after{opacity:.16}
.eyebrow{font-size:11px;letter-spacing:2.1px;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent);flex:none}
h1{font-weight:500;letter-spacing:-.045em;line-height:1.02;font-size:clamp(40px,6.2vw,84px);max-width:15ch;margin:.35em 0 .45em}
h2{font-weight:500;letter-spacing:-.04em;line-height:1.08;font-size:clamp(28px,3.8vw,46px)}
.card h3{font-weight:600;letter-spacing:-.02em}
.lead{color:var(--soft);max-width:58ch;line-height:1.7}

/* Buttons: Signature shape. Primary is the lime button; the rest are outlined. */
.cta{gap:14px;margin-top:32px}
.btn{display:inline-flex;align-items:center;gap:14px;min-height:52px;padding:15px 22px;border-radius:6px;font-size:13px;font-weight:700;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}

/* Sections, cards, tables and questions */
section{padding:72px 0}
.grid{gap:18px}
.card{border-radius:10px;padding:24px}
.price strong{font-size:30px;font-weight:600;letter-spacing:-.03em}
.examples{border-radius:10px}
details{border-radius:10px;padding:18px 22px}
summary{font-weight:600}
footer{padding:36px 0 48px}
@media(max-width:640px){.wrap{padding:0 16px}header .wrap{gap:10px}.head-right{gap:8px}.tools{gap:5px}.tools .flag{width:32px;height:26px}.tools .flag svg{width:20px;height:13px}.tools button{min-width:32px}.brand svg{width:28px;height:28px}.hero{padding:52px 0 40px}.hero::after{inset:auto 0 0 0;height:55%;opacity:.18;-webkit-mask-image:linear-gradient(0deg,#000,transparent);mask-image:linear-gradient(0deg,#000,transparent)}header .wrap{min-height:76px}.brand{font-size:21px}}
@media(prefers-reduced-motion:reduce){.btn{transition:none}.btn:hover{transform:none}}