/*
BLURTLY BRAND SYSTEM v3.0 ("Forest & Slate Blue")
================================================================================
This stylesheet is shared by every page on blurtly.co (the homepage, the
blog index, and each post) and is the source of truth for the visual
system. The full reasoning lives in docs/brand/blurtly-brand-guidelines.md.

CORE CONSTRAINT
  Blurtly is relief oriented, not achievement oriented. The payoff is "I got
  it out of my head," not "I crushed my to do list." No checkmarks as hero
  imagery, no red and green done or undone as the dominant visual logic, no
  rigid grid as metaphor, no corporate blue as the lead color, no monospace
  type. Never use an em dash, en dash, or spaced hyphen in any copy on this
  page. Write full sentences instead.

VOICE
  Casual, warm, quiet confidence rather than exclamation. Two reliefs:
  saying it out loud gets it out of your head immediately, and you can
  trust Blurtly to follow through so it actually happens later. The
  tagline "Just Blurt It" carries both halves.

DIRECTION: Forest & Slate Blue
  Calm and understated, like a notebook rather than an app screen. This
  replaces the earlier Quiet Paper palette (muted clay and dusty blue),
  which read as too dusty and pastel. A deep forest green now carries the
  action, a slate blue answers it, both fully saturated rather than muted,
  on the same warm paper ground. No red anywhere and no yellow anywhere in
  this palette. Almost no ornamentation: no tilted type, no scattered
  sticker collage, no thick outlines. Quiet is the whole point, so when in
  doubt, remove rather than add.

COLOR: named roles, hex values for both appearances
  Role                  Light      Dark       Notes
  --------------------  ---------  ---------  ------------------------------
  Primary / Action      #1F6B45    #59A57C    Forest green. Paired with
                                               paper toned text, not ink.
  Accent                #3D5A73    #6D93B0    Slate blue. The cooler
                                               counterweight to Primary.
  Background            #F7F8F1    #1E2318    Warm paper tone.
  Surface               #FFFFFF    #262C1F    Cards, nav.
  Surface 2             #EEF0E1    #2E3526    Insets, quiet tag chips.
  Border                #E0E4CE    #3B4530
  Text / Primary        #1E2417    #EBEFE2
  Text / Secondary      #707A63    #B7C0A8
  Success (muted)       #6E9B76    #8FBF97
  Warning (muted)       #C9A227    #E0BE55
  Error (muted)         #C2564A    #E07B70

TYPOGRAPHY
  Display   Quicksand, 500/600/700   headlines and the wordmark.
  Body      Karla, 400/600/700       everything else.
  No monospace anywhere.

SPACING / RADIUS
  space: 4, 8, 16, 24, 32, 48, 64, 96, 128 (px)
  radius: sm 8px, md 14px, lg 20px, pill 999px. Restrained, not blobby.
  shadow: one soft, low opacity shadow on the hero card only. Flat
          everywhere else.

ICONOGRAPHY
  Thin line icons, 1.5px stroke, rounded caps. A single quiet curved line
  is the recurring mark, not a waveform, not a speech bubble with bursts.

LOGO / APP ICON
  Wordmark: "blurtly," lowercase, Quicksand 600, no tilt, no flourish.
  Mark: a rounded square in Primary with one soft curved line in the
  paper tone, centered. Calm and abstract rather than literal.
================================================================================
*/

  :root{
    --bg:#F7F8F1; --surface:#FFFFFF; --surface-2:#EEF0E1; --border:#E0E4CE;
    --text:#1E2417; --text-2:#707A63;
    --primary:#1F6B45; --primary-hov:#17512F; --on-primary:#F2F8F0;
    --accent:#3D5A73; --accent-hov:#2C4356; --on-accent:#EEF3F6;
    --success:#6E9B76; --warning:#C9A227; --error:#C2564A;
    --shadow: 0 16px 40px -18px rgba(30,36,23,0.18);
    --sp-1:4px; --sp-2:8px; --sp-3:16px; --sp-4:24px; --sp-5:32px; --sp-6:48px; --sp-7:64px; --sp-8:96px;
    --r-sm:8px; --r-md:14px; --r-lg:20px; --r-pill:999px;
    --display:'Quicksand', ui-rounded, system-ui, sans-serif;
    --body:'Karla', ui-sans-serif, system-ui, -apple-system, sans-serif;
    color-scheme: light dark;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#1E2318; --surface:#262C1F; --surface-2:#2E3526; --border:#3B4530;
      --text:#EBEFE2; --text-2:#B7C0A8;
      --primary:#59A57C; --primary-hov:#71B893; --on-primary:#10241A;
      --accent:#6D93B0; --accent-hov:#85A7C0; --on-accent:#14232E;
      --success:#8FBF97; --warning:#E0BE55; --error:#E07B70;
      --shadow: 0 16px 40px -18px rgba(0,0,0,0.45);
    }
  }
  :root[data-theme="dark"]{
    --bg:#1E2318; --surface:#262C1F; --surface-2:#2E3526; --border:#3B4530;
    --text:#EBEFE2; --text-2:#B7C0A8;
    --primary:#59A57C; --primary-hov:#71B893; --on-primary:#10241A;
    --accent:#6D93B0; --accent-hov:#85A7C0; --on-accent:#14232E;
    --success:#8FBF97; --warning:#E0BE55; --error:#E07B70;
    --shadow: 0 16px 40px -18px rgba(0,0,0,0.45);
  }

  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;}
  body{
    margin:0; background:var(--bg); color:var(--text); font-family:var(--body);
    font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;}
  h1,h2,h3{font-family:var(--display); margin:0; text-wrap:balance; font-weight:600;}
  p{margin:0;}
  a{color:inherit;}
  ul{list-style:none; margin:0; padding:0;}
  .wrap{max-width:1080px; margin:0 auto; padding:0 var(--sp-4);}
  section{padding:var(--sp-8) 0;}
  .eyebrow{
    font-family:var(--body); font-size:0.8rem; font-weight:700; text-transform:uppercase;
    letter-spacing:0.06em; color:var(--primary-hov);
  }
  :focus-visible{outline:2px solid var(--primary-hov); outline-offset:2px; border-radius:4px;}

  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    font-family:var(--body); font-weight:700; font-size:1rem; text-decoration:none;
    padding:13px 24px; border-radius:var(--r-pill); border:1px solid transparent;
    cursor:pointer; transition:transform 0.15s ease, background 0.15s ease;
  }
  .btn:active{transform:translateY(1px);}
  .btn-primary{background:var(--primary); color:var(--on-primary);}
  .btn-primary:hover{background:var(--primary-hov);}
  .btn-ghost{background:transparent; color:var(--text); border-color:var(--border);}
  .btn-ghost:hover{border-color:var(--primary); color:var(--primary-hov);}
  .btn-sm{padding:9px 18px; font-size:0.9rem;}

  /* ---------- NAV ---------- */
  header.site{
    position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 90%, transparent);
    backdrop-filter:blur(8px); border-bottom:1px solid var(--border);
  }
  .nav{display:flex; align-items:center; justify-content:space-between; padding:var(--sp-3) 0;}
  .logo{display:flex; align-items:center; gap:9px; font-family:var(--display); font-weight:700; font-size:1.3rem; text-decoration:none; color:var(--text);}
  .logo-mark{width:28px; height:28px; flex:none; border-radius:9px; background:var(--primary); display:flex; align-items:center; justify-content:center;}
  .nav-links{display:flex; gap:var(--sp-5); align-items:center;}
  .nav-links a{text-decoration:none; font-weight:700; font-size:0.95rem; color:var(--text-2); transition:color .15s;}
  .nav-links a:hover{color:var(--primary-hov);}
  @media (max-width:760px){ .nav-links{display:none;} }

  /* ---------- HERO ---------- */
  .hero{padding-top:var(--sp-7);}
  .hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:var(--sp-7); align-items:center;}
  @media (max-width:900px){ .hero-grid{grid-template-columns:1fr; gap:var(--sp-6);} }
  .hero h1{font-size:clamp(2.6rem,5.5vw,4rem); line-height:1.08; margin:var(--sp-3) 0 var(--sp-4);}
  .hero h1 em{font-style:normal; color:var(--primary-hov);}
  .hero p.lede{font-size:1.1rem; color:var(--text-2); max-width:46ch; margin-bottom:var(--sp-5); line-height:1.6;}
  .hero-actions{display:flex; gap:var(--sp-3); flex-wrap:wrap; align-items:center;}
  .hero-note{margin-top:var(--sp-3); font-size:0.875rem; color:var(--text-2);}

  .platform-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:var(--sp-4);}
  .platform-row .pr-label{font-size:0.8125rem; color:var(--text-2); margin-right:2px;}
  .platform-chip{
    display:inline-flex; align-items:center; gap:7px; font-size:0.8rem; font-weight:700;
    color:var(--text-2); background:transparent; border:1px solid var(--border);
    border-radius:var(--r-pill); padding:6px 12px 6px 10px;
  }
  .platform-chip svg{flex:none; color:var(--text-2);}
  .platform-chip.is-live{color:var(--text); border-color:var(--primary); background:color-mix(in srgb, var(--primary) 10%, transparent);}
  .platform-chip.is-live svg{color:var(--primary-hov);}
  .platform-chip .soon{
    font-family:var(--body); font-size:0.6rem; font-weight:800; text-transform:uppercase;
    color:var(--text-2); background:var(--surface-2); border-radius:var(--r-pill); padding:1px 6px; margin-left:2px;
  }

  /* Quiet settle card: a calm before and after, no scattered collage */
  .settle-card{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
    box-shadow:var(--shadow); padding:var(--sp-5);
  }
  .settle-label{display:flex; align-items:center; gap:8px; font-size:0.8rem; font-weight:700; color:var(--text-2); margin-bottom:var(--sp-4);}
  .settle-label svg{flex:none; color:var(--primary-hov);}
  .spoken-line{
    font-family:var(--display); font-size:1.05rem; color:var(--text-2); padding:8px 0;
    border-bottom:1px solid var(--border);
  }
  .spoken-line:first-of-type{border-top:1px solid var(--border);}
  .settle-divider{display:flex; align-items:center; gap:8px; color:var(--text-2); font-size:0.75rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; margin:var(--sp-4) 0;}
  .settle-divider svg{flex:none; color:var(--accent-hov);}
  .settled-row{
    display:flex; align-items:center; gap:12px; padding:10px 0;
  }
  .settled-row .dot{width:8px; height:8px; border-radius:50%; flex:none;}
  .settled-row .title{font-weight:700; font-size:0.95rem;}
  .settled-row .tag{font-family:var(--body); font-size:0.75rem; color:var(--text-2); margin-left:auto;}

  /* ---------- TWO RELIEFS ---------- */
  .relief-band{background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
  .relief-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-5);}
  @media (max-width:760px){ .relief-grid{grid-template-columns:1fr;} }
  .relief-card{
    background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg);
    padding:var(--sp-5); display:flex; flex-direction:column; gap:var(--sp-3);
  }
  .relief-card .icon{
    width:40px; height:40px; border-radius:var(--r-sm); background:var(--surface);
    display:flex; align-items:center; justify-content:center; color:var(--primary-hov); flex:none;
  }
  .relief-card:nth-child(2) .icon{color:var(--accent-hov);}
  .relief-card .num{font-family:var(--body); font-weight:700; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-2);}
  .relief-card h3{font-size:1.35rem; margin-top:2px;}
  .relief-card p{color:var(--text-2); font-size:0.98rem; margin-top:2px;}

  /* ---------- FEATURES ---------- */
  .section-head{max-width:60ch; margin-bottom:var(--sp-6);}
  .section-head h2{font-size:clamp(1.9rem,3.6vw,2.4rem); margin-top:var(--sp-3);}
  .feature-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-4);}
  @media (max-width:980px){ .feature-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:600px){ .feature-grid{grid-template-columns:1fr;} }
  .feature{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);
    padding:var(--sp-4); display:flex; flex-direction:column; gap:var(--sp-3);
  }
  .feature .icon{
    width:38px; height:38px; border-radius:var(--r-sm); background:var(--surface-2);
    display:flex; align-items:center; justify-content:center; color:var(--primary-hov);
  }
  .feature h3{font-size:1.1rem;}
  .feature p{color:var(--text-2); font-size:0.94rem;}

  /* ---------- HOW IT WORKS ---------- */
  .how{background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
  .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-5); margin-bottom:var(--sp-7);}
  @media (max-width:860px){ .steps{grid-template-columns:1fr;} }
  .step .idx{font-family:var(--body); font-size:0.8rem; color:var(--accent-hov); font-weight:800;}
  .step h3{font-size:1.2rem; margin:var(--sp-2) 0 var(--sp-2);}
  .step p{color:var(--text-2); font-size:0.94rem;}

  .horizon-head{margin:var(--sp-7) 0 var(--sp-4);}
  .horizon-head h3{font-size:clamp(1.3rem,2.4vw,1.6rem);}
  .horizon-head p{color:var(--text-2); max-width:62ch; margin-top:var(--sp-2); font-size:0.98rem;}

  .horizon-strip{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
    padding:var(--sp-5); display:grid; grid-template-columns:repeat(6,1fr); gap:var(--sp-4);
  }
  @media (max-width:1080px){ .horizon-strip{grid-template-columns:repeat(3,1fr);} }
  @media (max-width:560px){ .horizon-strip{grid-template-columns:1fr; gap:var(--sp-5);} }
  .horizon .dot{width:8px; height:8px; border-radius:50%; background:var(--primary); margin-bottom:12px;}
  .horizon .when{font-family:var(--body); font-weight:800; font-size:1rem; color:var(--text);}
  .horizon .ex{color:var(--text-2); font-size:0.86rem; margin-top:6px;}


  /* ---------- WAITLIST ---------- */
  .waitlist{
    background:var(--surface-2); border:1px solid var(--border);
    border-radius:var(--r-lg); padding:var(--sp-7) var(--sp-6); color:var(--text); text-align:center;
    display:flex; flex-direction:column; align-items:center; gap:var(--sp-4);
  }
  .waitlist h2{font-size:clamp(1.8rem,3.6vw,2.3rem);}
  .waitlist p{color:var(--text-2); max-width:52ch; font-size:1.02rem;}
  .wl-form{display:flex; gap:10px; width:100%; max-width:420px; flex-wrap:wrap; justify-content:center;}
  .wl-form input{
    flex:1; min-width:220px; padding:13px 18px; border-radius:var(--r-pill); border:1px solid var(--border);
    background:var(--surface); color:var(--text); font-family:var(--body); font-size:1rem;
  }
  .wl-form input::placeholder{color:var(--text-2);}
  .wl-note{font-size:0.8rem; color:var(--text-2);}
  .wl-ask{display:none; flex-direction:column; align-items:center; gap:var(--sp-3); width:100%; max-width:560px; margin:0; padding:0; border:0;}
  .wl-ask.is-visible{display:flex;}
  .wl-ask legend{color:var(--text); font-size:1.02rem; max-width:44ch; padding:0; margin-bottom:var(--sp-2);}
  .wl-chips{display:flex; flex-wrap:wrap; justify-content:center; gap:8px;}
  .wl-chip{position:relative;}
  .wl-chip input{position:absolute; opacity:0; width:1px; height:1px; margin:0;}
  .wl-chip span{
    display:inline-flex; align-items:center; gap:8px; padding:9px 16px 9px 13px; border-radius:var(--r-pill); border:1px solid var(--border);
    background:var(--surface); color:var(--text); font-size:0.92rem; cursor:pointer; transition:border-color 0.15s ease, background 0.15s ease;
  }
  .wl-chip.no-icon span{padding-left:16px;}
  .wl-chip svg{width:16px; height:16px; flex:none;}
  .wl-chip span:hover{border-color:var(--primary);}
  .wl-chip input:focus-visible + span{outline:2px solid var(--primary-hov); outline-offset:2px;}
  .wl-chip input:checked + span{background:var(--primary); color:var(--on-primary); border-color:var(--primary);}
  .wl-ask.is-busy .wl-chip span{opacity:0.6; cursor:default;}
  .wl-other{display:none;}
  .wl-other.is-visible{display:flex;}
  .wl-send:disabled{opacity:0.5; cursor:default;}

  /* ---------- FAQ ---------- */
  .faq-list{max-width:740px;}
  details{border-bottom:1px solid var(--border); padding:var(--sp-4) 0;}
  details summary{
    cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between;
    font-family:var(--display); font-weight:600; font-size:1.08rem; gap:var(--sp-3);
  }
  details summary::-webkit-details-marker{display:none;}
  details summary .plus{flex:none; width:22px; height:22px; border-radius:50%; border:1.5px solid var(--border); position:relative;}
  details summary .plus::before, details summary .plus::after{content:''; position:absolute; background:var(--text); top:50%; left:50%; transform:translate(-50%,-50%);}
  details summary .plus::before{width:9px; height:1.5px;}
  details summary .plus::after{width:1.5px; height:9px; transition:opacity .2s;}
  details[open] summary .plus::after{opacity:0;}
  details p{color:var(--text-2); margin-top:var(--sp-3); max-width:64ch; font-size:0.96rem;}

  /* ---------- FINAL CTA ---------- */
  .final-cta{text-align:center;}
  .final-cta h2{font-size:clamp(1.9rem,4vw,2.6rem); max-width:20ch; margin:var(--sp-3) auto var(--sp-4);}
  .final-cta .hero-actions{justify-content:center;}

  /* ---------- FOOTER ---------- */
  footer{border-top:1px solid var(--border); padding:var(--sp-6) 0 var(--sp-5);}
  .foot-top{display:flex; justify-content:space-between; align-items:flex-start; gap:var(--sp-5); flex-wrap:wrap; margin-bottom:var(--sp-5);}
  .foot-links{display:flex; gap:var(--sp-6); flex-wrap:wrap;}
  .foot-col h4{font-size:0.8rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-2); margin-bottom:var(--sp-3); font-weight:800;}
  .foot-col ul{display:flex; flex-direction:column; gap:10px;}
  .foot-col a{text-decoration:none; color:var(--text); font-size:0.92rem; font-weight:600;}
  .foot-col a:hover{color:var(--primary-hov);}
  .foot-bottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--sp-3); padding-top:var(--sp-4); border-top:1px solid var(--border);}
  .foot-bottom p{color:var(--text-2); font-size:0.84rem;}
  .socials{display:flex; gap:var(--sp-3);}
  .socials a{width:34px; height:34px; border-radius:50%; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; text-decoration:none; color:var(--text-2);}

  /* ---------- BLOG ---------- */
  .nav-links a[aria-current="page"]{color:var(--text);}
  .blog-index{padding-top:var(--sp-7);}
  .blog-index .section-head h1{font-size:clamp(2.2rem,4.5vw,3rem); line-height:1.1; margin:var(--sp-3) 0 var(--sp-3);}
  .blog-index .section-head p{color:var(--text-2); font-size:1.05rem; max-width:52ch;}
  .post-tabs{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:var(--sp-5);}
  .post-tabs a{
    text-decoration:none; font-weight:700; font-size:0.9rem; color:var(--text-2);
    padding:8px 16px; border-radius:var(--r-pill); border:1px solid var(--border); transition:color .15s, border-color .15s;
  }
  .post-tabs a:hover{color:var(--primary-hov); border-color:var(--primary);}
  .post-tabs a[aria-current="page"]{background:var(--primary); color:var(--on-primary); border-color:var(--primary);}
  .post-list{max-width:740px;}
  .post-item{padding:var(--sp-5) 0; border-bottom:1px solid var(--border);}
  .post-item:first-child{border-top:1px solid var(--border);}
  .post-meta{display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; font-size:0.875rem; color:var(--text-2);}
  .post-meta .eyebrow{font-size:0.75rem;}
  .post-item h2{font-size:1.5rem; line-height:1.25; margin-top:var(--sp-2);}
  .post-item h2 a{text-decoration:none;}
  .post-item h2 a:hover{color:var(--primary-hov);}
  .post-excerpt{color:var(--text-2); margin-top:var(--sp-2); max-width:62ch;}
  .post-empty{color:var(--text-2); padding:var(--sp-6) 0;}

  .post{padding:var(--sp-7) 0 var(--sp-8);}
  .post-wrap{max-width:760px;}
  .post-crumb{margin-bottom:var(--sp-4); font-size:0.875rem; font-weight:700;}
  .post-crumb a{text-decoration:none; color:var(--text-2);}
  .post-crumb a:hover{color:var(--primary-hov);}
  .post-head h1{font-size:clamp(2.1rem,4.5vw,3rem); line-height:1.12; margin:var(--sp-3) 0 var(--sp-4);}
  .post-head .lede{font-size:1.15rem; color:var(--text-2); line-height:1.55;}
  .post-cover{margin:var(--sp-6) 0 0;}
  .post-cover img{display:block; width:100%; border-radius:var(--r-lg); border:1px solid var(--border);}

  .prose{margin-top:var(--sp-6); font-size:1.08rem; line-height:1.7;}
  .prose > * + *{margin-top:var(--sp-4);}
  .prose h2{font-size:1.6rem; line-height:1.25; margin-top:var(--sp-6);}
  .prose h3{font-size:1.25rem; margin-top:var(--sp-5);}
  .prose h4{font-family:var(--display); font-size:1.05rem; margin:var(--sp-5) 0 0;}
  .prose a{color:var(--primary-hov); text-decoration-thickness:1px; text-underline-offset:3px;}
  .prose ul, .prose ol{padding-left:1.4em;}
  .prose ul{list-style:disc;}
  .prose ol{list-style:decimal;}
  .prose li + li{margin-top:var(--sp-2);}
  .prose blockquote{
    margin:var(--sp-5) 0; padding:var(--sp-3) var(--sp-4); border-left:3px solid var(--accent);
    background:var(--surface-2); border-radius:0 var(--r-md) var(--r-md) 0; font-family:var(--display); font-size:1.15rem;
  }
  .prose blockquote p{margin:0;}
  .prose figure{margin:var(--sp-6) 0;}
  .prose figure img{display:block; width:100%; border-radius:var(--r-md); border:1px solid var(--border);}
  .prose hr{border:0; border-top:1px solid var(--border); margin:var(--sp-6) 0;}
  .prose strong{font-weight:700;}

  .post-cta{
    margin-top:var(--sp-8); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg);
    padding:var(--sp-6) var(--sp-5); text-align:center; display:flex; flex-direction:column; align-items:center; gap:var(--sp-3);
  }
  .post-cta h2{font-size:1.6rem;}
  .post-cta p{color:var(--text-2); max-width:44ch;}

  .not-found{padding:var(--sp-8) 0; text-align:center;}
  .not-found h1{font-size:clamp(2.2rem,4.5vw,3rem); margin:var(--sp-3) 0 var(--sp-3);}
  .not-found p{color:var(--text-2); max-width:44ch; margin:0 auto var(--sp-5);}
  .not-found .hero-actions{justify-content:center;}

  /* ---------- CONSENT + LEGAL ---------- */
  .wl-consent{font-size:0.8rem; color:var(--text-2); max-width:44ch; margin-top:-8px;}
  .wl-consent a{color:var(--text-2);}
  .wl-consent a:hover{color:var(--primary-hov);}

  .legal{padding:var(--sp-7) 0 var(--sp-8);}
  .legal-wrap{max-width:760px;}
  .legal-head h1{font-size:clamp(2.1rem,4.5vw,3rem); line-height:1.12; margin:var(--sp-3) 0 var(--sp-2);}
  .legal-date{color:var(--text-2); font-size:0.9rem;}
  .legal-summary{
    margin-top:var(--sp-5); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg);
    padding:var(--sp-4) var(--sp-5);
  }
  .legal-summary h2{font-size:1.05rem; margin-bottom:var(--sp-3);}
  .legal-summary ul{display:flex; flex-direction:column; gap:10px; padding-left:1.2em; list-style:disc; color:var(--text-2); font-size:0.97rem;}
  .legal .prose{margin-top:var(--sp-5); font-size:1.02rem;}
  .legal .prose h2{font-size:1.35rem; margin-top:var(--sp-6);}
  .legal .prose p + p{margin-top:var(--sp-3);}
