/* Socraty 2026 design layer: tokens, type, header, footer, sticky bar. Loaded on every page after styles.css. */
:root {
  --paper:#fcfcfa; --white:#ffffff; --ink:#161616; --body:#3d4745; --muted:#5c6664; --green:#08705f; --lime:#e4f3ef; --line:rgba(15,23,22,.12);
  --emerald:#08705f; --emerald-deep:#065e50; --emerald-soft:#e4f3ef; --ivory:#f2f2ef; --teal:#0f9d8a; --mint:#5fd3c1; --amber:#8a540a; --amber-soft:#fbf1e1;
  --wf:#08705f; --wf-soft:#e4f3ef; --wf-internal:#08705f; --wf-website:#08705f; --wf-sales:#8a540a;
  --serif:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif; --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
html { scroll-padding-top:96px }
body { background:var(--paper); color:var(--ink); font-family:var(--sans); text-wrap:pretty }
h1, h2, h3, .brand strong { font-family:var(--sans); font-weight:700; letter-spacing:-.03em }
h1 em, h2 em { font-style:normal; font-weight:700; color:var(--muted) }
.hub-head h1 { font-size:clamp(38px,5vw,60px); line-height:1.04; letter-spacing:-.035em }
.article-body h2, .legal-body h2 { font-size:clamp(22px,2.4vw,28px); letter-spacing:-.02em }
:focus-visible { outline:3px solid var(--emerald); outline-offset:3px; border-radius:4px }
.button { border-radius:12px } .button-dark { background:var(--ink); color:#fff } .button-dark:hover { background:var(--emerald) }
.contact-section { background:var(--emerald-soft) } .contact-dark { background:var(--ink) }
.contact-dark .button-dark { background:var(--emerald); color:#fff } .contact-dark .button-dark:hover { background:var(--mint); color:var(--ink) }
.contact-dark h2 em { color:var(--mint) } .contact-dark .copy-status, .price-anchor .text-link { color:var(--mint) }
.named-card, .price-card, .offer-card, .try-pane, .director-card { border-radius:18px }
.price-card.is-featured { border-color:var(--emerald) }

/* Header */
.d-header { position:sticky; top:0; z-index:50; background:rgba(247,246,242,.9); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); border-bottom:1px solid rgba(15,23,22,.08) }
.d-header-in { max-width:1180px; margin:0 auto; padding:12px 24px; display:flex; align-items:center; gap:12px 28px; min-height:66px }
.d-brand { display:inline-flex; align-items:center; gap:9px; color:var(--ink); flex-shrink:0; min-height:44px }
.d-brand svg { width:24px; height:24px; fill:currentColor }
.d-brand strong { font:700 20px/1 var(--sans); letter-spacing:-.02em }
.d-nav { display:flex; align-items:center; gap:4px 24px; margin-left:auto; font:500 14px/1 var(--sans) }
.d-nav a { color:var(--body); padding:12px 0; border-bottom:2px solid transparent; white-space:nowrap }
.d-nav a:hover { color:var(--ink) }
.d-nav a[aria-current="page"] { color:var(--ink); border-bottom-color:var(--teal) }
.d-nav .d-nav-demo { color:var(--ink); font-weight:600; padding:11px 14px; border-radius:9px; border-bottom:0; margin-left:4px }
.d-nav .d-nav-demo:hover { background:rgba(15,23,22,.06) }
.d-nav .d-nav-book { background:var(--ink); color:#fff; font-weight:600; padding:12px 16px; border-radius:9px; border-bottom:0 }
.d-nav .d-nav-book:hover { background:var(--emerald); color:#fff }
.d-header .menu-toggle { display:none; margin-left:auto; background:transparent; border:1px solid rgba(15,23,22,.2); border-radius:9px; padding:10px 14px; min-height:44px; font:600 14px/1 var(--sans); color:var(--ink) }
@media(max-width:900px) {
  html.js .d-header .menu-toggle { display:inline-flex; align-items:center; gap:8px }
  .d-header-in { flex-wrap:wrap }
  .d-nav { flex-wrap:wrap; margin-left:0; width:100% }
  html.js .d-nav { display:none; flex-direction:column; align-items:stretch; gap:0; padding:6px 0 10px }
  html.js .d-nav.is-open { display:flex }
  html.js .d-nav a { padding:14px 2px; border-bottom:1px solid rgba(15,23,22,.08); font-size:16px }
  html.js .d-nav .d-nav-demo, html.js .d-nav .d-nav-book { margin:10px 0 0; text-align:center; border-bottom:0; padding:15px 16px }
}

/* Footer */
.d-footer { border-top:1px solid rgba(15,23,22,.09); background:var(--ivory); color:var(--ink) }
.d-footer-in { max-width:1180px; margin:0 auto; padding:56px 24px 36px; display:grid; gap:40px }
.d-footer-top { display:flex; flex-wrap:wrap; gap:32px 48px }
.d-footer-about { flex:1 1 260px; max-width:320px; display:grid; gap:12px; align-content:start }
.d-footer-about p { margin:0; font:400 14px/1.6 var(--sans); color:var(--muted) }
.d-footer-about a.d-mail { display:inline-block; justify-self:start; font:600 14px/1.4 var(--sans); color:var(--emerald); padding:6px 0; text-decoration:underline; text-underline-offset:4px }
.d-footer-cols { flex:3 1 520px; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr)); gap:24px 20px }
.d-footer-cols h2 { font:700 12px/1 var(--sans); letter-spacing:.08em; color:var(--muted); margin:0 0 8px; text-transform:uppercase }
.d-footer-cols ul { list-style:none; margin:0; padding:0; display:grid; gap:2px }
.d-footer-cols a { display:inline-flex; align-items:center; min-height:32px; color:var(--ink); font:500 14px/1.3 var(--sans) }
.d-footer-cols a:hover { color:var(--emerald) }
.d-footer-legal { display:flex; flex-wrap:wrap; gap:8px 32px; justify-content:space-between; padding-top:24px; border-top:1px solid rgba(15,23,22,.09); font:400 13px/1.6 var(--sans); color:var(--muted) }
.d-footer-legal span { max-width:760px }

/* Sticky mobile bar */
@media(max-width:760px) {
  .sticky-cta { background:rgba(247,246,242,.96); border-top:1px solid rgba(15,23,22,.1) }
  .sticky-cta a { border-radius:10px; border-color:rgba(15,23,22,.2) }
  .sticky-cta .sticky-primary { background:var(--ink); border-color:var(--ink) }
}
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important } }
.article-body a, .director-links a, .legal-body a { display:inline-block; padding:3px 0 }
.box-label { color:var(--body) }

/* Flat, square, quiet: Kavida-style pass */
h1, h2, h3 { letter-spacing:-.02em } .hub-head h1 { font-size:clamp(32px,3.7vw,48px); line-height:1.14; letter-spacing:-.02em }
.d-header { background:rgba(252,252,250,.96) } .d-nav { font-size:15px } .d-nav .d-nav-book, .d-nav .d-nav-demo, .d-header .menu-toggle { border-radius:4px }
.button, .named-card, .price-card, .offer-card, .try-pane, .director-card, .sticky-cta a, .film-btn, .film-try { border-radius:4px !important }
.d-footer { background:var(--paper) }
