/*
Theme Name: Soul Mail Club
Theme URI: https://soulmailclub.at
Author: Theresa Holzleitner
Description: OnePager-Theme für den Soul Mail Club – Parallax-Scrolling, Video-Header, Kuvert-Choreografie, Kartendeck.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: Proprietär – nur für soulmailclub.at
Text Domain: soulmailclub
*/

  /* ---------- Fonts (Base64) ---------- */
  @font-face{
    font-family:'Noona Louise';
    src:url(assets/fonts/noona.woff2) format('woff2');
    font-weight:400; font-style:normal; font-display:swap;
  }
  @font-face{
    font-family:'Open Sans';
    src:url(assets/fonts/os-latin-ext.woff2) format('woff2');
    font-weight:300 800; font-style:normal; font-display:swap;
    unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
  }
  @font-face{
    font-family:'Open Sans';
    src:url(assets/fonts/os-latin.woff2) format('woff2');
    font-weight:300 800; font-style:normal; font-display:swap;
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
  }

  :root{
    --bordeaux:#410016;
    --rosa:#ca9baa;
    --hellblau:#cfdaff;
    --graublau:#a4b4be;
    --olive:#827c36;
    --weiss:#ffffff;
    --rosa-tint:#f6edf0;      /* stark aufgehelltes Markenrosa für ruhige Flächen */
    --bordeaux-soft:#6b3247;  /* aufgehelltes Bordeaux für Fließtext auf hell */

    --display:'Noona Louise','Snell Roundhand',cursive;
    --body:'Open Sans','Segoe UI',system-ui,sans-serif;

    --nav-h:76px;
  }

  html{ scroll-behavior:smooth; }
  body{
    background:var(--weiss);
    color:var(--bordeaux);
    font-family:var(--body);
    font-weight:300;
    font-size:1.0625rem;
    line-height:1.7;
    overflow-x:hidden;
    overflow-x:clip;   /* kein Scroll-Container → position:sticky bleibt intakt */
  }

  h1,h2,h3{ margin:0; text-wrap:balance; }
  h1,h2{ font-family:var(--display); font-weight:400; line-height:1.05; }
  h1{ font-size:clamp(3rem,8vw,6.2rem); }
  h2{ font-size:clamp(2.4rem,5.5vw,4rem); }
  h3{ font-family:var(--body); font-weight:600; font-size:1.15rem; letter-spacing:.01em; }
  p{ margin:0; max-width:64ch; }
  strong{ font-weight:600; }
  section{ scroll-margin-top:var(--nav-h); }

  .eyebrow{
    font-family:var(--body);
    font-size:.75rem; font-weight:700;
    letter-spacing:.24em; text-transform:uppercase;
  }
  .hand{ font-family:var(--display); }

  .wrap{ max-width:1160px; margin-inline:auto; padding-inline:clamp(1.25rem,5vw,3rem); }

  /* ---------- Parallax-Ebenen ---------- */
  section.plx{ position:relative; overflow:hidden; }
  .layer{ position:absolute; pointer-events:none; will-change:transform; z-index:1; }
  [data-depth]{ transform:rotate(var(--rot,0deg)); }
  .float{ animation:floaty 6s ease-in-out infinite; }
  .float.f2{ animation-duration:7.5s; animation-delay:-2s; }
  .float.f3{ animation-duration:9s; animation-delay:-4s; }
  @keyframes floaty{ 0%,100%{ translate:0 0; } 50%{ translate:0 -14px; } }

  /* ---------- Buttons ---------- */
  .btn{
    display:inline-block;
    font-family:var(--body); font-size:.95rem; font-weight:600;
    letter-spacing:.03em; text-decoration:none; text-align:center;
    padding:.9rem 1.9rem; border-radius:999px; border:none; cursor:pointer;
    transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
  }
  .btn-primary{ background:var(--bordeaux); color:var(--weiss); }
  .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(65,0,22,.35); }
  .btn-light{ background:var(--weiss); color:var(--bordeaux); }
  .btn-light:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(65,0,22,.2); }
  .btn-ghost{ background:transparent; color:var(--weiss); border:1.5px solid rgba(255,255,255,.75); }
  .btn-ghost:hover{ background:rgba(255,255,255,.14); }
  a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{
    outline:3px solid var(--olive); outline-offset:3px; border-radius:6px;
  }

  /* ---------- Reveals ---------- */
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:none; }
  .reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; } .reveal.d3{ transition-delay:.24s; }
  body.no-motion .reveal{ opacity:1; transform:none; transition:none; }
  body.no-motion .layer{ transform:rotate(var(--rot,0deg)) !important; }
  body.no-motion .float{ animation:none; }
  @media (prefers-reduced-motion:reduce){
    html{ scroll-behavior:auto; }
    .reveal{ opacity:1; transform:none; transition:none; }
    .float{ animation:none; }
  }

  /* =================== 1 · NAVIGATION =================== */
  .site-nav{
    position:fixed; inset:0 0 auto 0; z-index:60;
    height:var(--nav-h);
    display:flex; align-items:center; justify-content:space-between; gap:1rem;
    padding-inline:clamp(1rem,4vw,2.5rem);
    background:rgba(202,155,170,.93);
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(65,0,22,.14);
  }
  .brand{ display:flex; align-items:center; }
  .brand img{ height:52px; width:52px; display:block; }
  .site-nav nav{ display:flex; gap:clamp(1rem,3vw,2.2rem); align-items:center; }
  .site-nav nav a{
    font-family:var(--body); font-size:.92rem; font-weight:600;
    color:var(--bordeaux); text-decoration:none;
    padding:.4rem .2rem; border-bottom:2px solid transparent;
    transition:border-color .2s ease, color .2s ease;
  }
  .site-nav nav a:hover{ border-bottom-color:var(--rosa); }
  .nav-burger{
    display:none;
    background:none; border:1.5px solid var(--bordeaux); border-radius:8px;
    font-family:var(--body); font-size:.85rem; font-weight:600; color:var(--bordeaux);
    padding:.45rem .8rem; cursor:pointer;
  }
  @media (max-width:720px){
    .nav-burger{ display:block; }
    .site-nav nav{
      position:absolute; top:var(--nav-h); left:0; right:0;
      flex-direction:column; align-items:flex-start; gap:0;
      background:var(--rosa);
      border-bottom:1px solid rgba(65,0,22,.14);
      display:none; padding:0.5rem 1.5rem 1rem;
    }
    .site-nav nav.open{ display:flex; }
    .site-nav nav a{ padding:.7rem .2rem; width:100%; }
  }

  /* =================== 2 · HERO (Video) =================== */
  .hero{
    background:#4a3628;              /* Fallback, bis das Video lädt */
    color:var(--weiss);
    padding-top:var(--nav-h);
    position:relative;
    overflow:hidden;
  }
  .hero-video{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover; object-position:center;
  }
  .hero-shade{                       /* Lesbarkeits-Verlauf über der rechten Bildhälfte */
    position:absolute; inset:0;
    background:linear-gradient(270deg, rgba(65,0,22,.72) 0%, rgba(65,0,22,.38) 40%, rgba(65,0,22,.08) 68%, transparent 86%);
    pointer-events:none;
  }
  .hero .wrap{
    min-height:calc(100vh - var(--nav-h) - 56px);
    display:flex; flex-direction:column;
    align-items:flex-end; justify-content:center; text-align:right;
    position:relative; z-index:2;
    padding-block:4rem 3rem;
  }
  .hero-copy{ display:flex; flex-direction:column; align-items:flex-end; gap:1.5rem; max-width:620px; }
  .hero .eyebrow{ color:var(--hellblau); }
  .hero h1{ font-style:normal; text-shadow:0 2px 18px rgba(65,0,22,.35); }
  .hero-note{ font-size:1.15rem; max-width:46ch; color:rgba(255,255,255,.94); }
  .hero-ctas{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.9rem; margin-top:.4rem; }
  @media (max-width:720px){
    .hero-video{ object-position:60% center; }
    .hero-shade{ background:linear-gradient(270deg, rgba(65,0,22,.72) 0%, rgba(65,0,22,.45) 55%, rgba(65,0,22,.25) 100%); }
  }

  /* Ticker */
  .ticker{
    background:var(--bordeaux); color:var(--rosa);
    overflow:hidden; white-space:nowrap;
    padding-block:.85rem;
    font-family:var(--body); font-weight:600; font-size:.9rem; letter-spacing:.05em; text-transform:uppercase;
  }
  .ticker-track{ display:flex; width:max-content; animation:ticker 55s linear infinite; }
  .ticker-half{ display:flex; align-items:center; gap:2.6rem; padding-right:2.6rem; }
  .ticker-half .dot{ color:var(--hellblau); font-size:.7em; }
  @keyframes ticker{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
  body.no-motion .ticker-track{ animation:none; }

  /* =================== 3 · ABOUT =================== */
  /* Gepinnte Szene: zu → öffnet sich → Brief kommt heraus → weiterscrollen.
     Hintergrund = Fond der Kuvert-Fotos, damit sie nahtlos einsitzen. */
  .about{ background:#dad6d2; height:340vh; }
  .about-sticky{
    position:sticky; top:0; min-height:100vh;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:1.1rem; text-align:center;
    padding:calc(var(--nav-h) + .8rem) 1.25rem 1.4rem;
  }
  .about h2{ color:var(--bordeaux); }
  .env-stage{ position:relative; width:min(480px, 92vw, 62vh); }
  .letter-mask{
    position:absolute; left:9%; right:9%;
    bottom:58.7%;                      /* Falzlinie des offenen Kuverts, JS animiert nach unten */
    z-index:4;                         /* Brief liegt vor dem Kuvert-Futter */
    overflow:hidden;
  }
  .mail-letter{
    background:var(--weiss);
    border:1px solid rgba(202,155,170,.55);
    border-bottom:none;
    border-radius:6px 6px 0 0;
    box-shadow:0 -8px 26px rgba(65,0,22,.12);
    padding:clamp(1.1rem,3vw,1.8rem) clamp(1rem,3vw,1.6rem) 2.2rem;
    text-align:left;
    transform:translateY(103%);
    will-change:transform;
  }
  .mail-letter .salut{ font-family:var(--display); font-size:clamp(1.35rem,3vw,1.8rem); display:block; margin-bottom:.7rem; }
  .mail-letter p{ color:var(--bordeaux-soft); font-size:clamp(.85rem,2.1vh,.98rem); line-height:1.55; max-width:58ch; }
  .mail-letter p + p{ margin-top:.65rem; }
  .mail-letter .sign{ font-family:var(--display); font-size:1.45rem; display:inline-block; margin-top:.8rem; transform:rotate(-2deg); }
  .env-open{
    position:relative; z-index:1;
    display:block; width:100%; height:auto;
    border-radius:8px;
    opacity:0;
  }
  .env-closed{
    position:absolute; left:0; bottom:0; z-index:2;
    width:100%; height:auto;
    border-radius:8px;
    opacity:1;
  }
  .env-open, .env-closed, .mail-letter{ will-change:transform,opacity; }
  body.no-motion .about{ height:auto; }
  body.no-motion .about-sticky{ position:static; min-height:0; padding-block:5rem; }
  body.no-motion .letter-mask{ position:relative; inset:auto; margin-bottom:-48%; padding-inline:9%; left:auto; right:auto; }
  body.no-motion .mail-letter{ transform:translateY(0); }
  body.no-motion .env-closed{ opacity:0; }
  body.no-motion .env-open{ opacity:1; }
  @media (prefers-reduced-motion:reduce){
    .mail-letter{ transform:translateY(0); }
    .env-closed{ opacity:0; }
    .env-open{ opacity:1; }
  }

  /* =================== 4 · INHALTE (Kartendeck) =================== */
  .deck-section{ background:var(--bordeaux); color:var(--weiss); height:440vh; }
  body.no-motion .deck-section{ height:auto; }
  .deck-sticky{
    position:sticky; top:0; height:100vh;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:1.6rem; overflow:hidden;
  }
  body.no-motion .deck-sticky{ position:static; height:auto; padding-block:5rem; }
  .deck-head{ text-align:center; display:flex; flex-direction:column; gap:.5rem; z-index:2; padding-inline:1.25rem; }
  .deck-head .eyebrow{ color:var(--rosa); }
  .deck-head h2{ color:var(--rosa); }
  .deck-hint{ font-size:.85rem; color:rgba(255,255,255,.65); letter-spacing:.06em; }

  .deck{ position:relative; width:min(560px,90vw); height:min(54vh,460px); }
  body.no-motion .deck{
    width:100%; max-width:1160px; height:auto;
    display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:1.4rem; padding-inline:clamp(1.25rem,5vw,3rem);
  }
  .deck-card{
    position:absolute; inset:0;
    border-radius:14px;
    padding:clamp(1.4rem,3vw,2.4rem);
    display:flex; flex-direction:column; gap:.9rem; justify-content:flex-start;
    box-shadow:0 18px 44px rgba(0,0,0,.35);
    will-change:transform,opacity;
    transform:rotate(var(--base-rot,0deg));
  }
  body.no-motion .deck-card{ position:static; transform:none; height:100%; }
  .deck-card .k-label{
    font-family:var(--body); font-size:.72rem; font-weight:700;
    letter-spacing:.22em; text-transform:uppercase; opacity:.75;
  }
  .deck-card .k-title{ font-family:var(--display); font-size:clamp(1.9rem,4vw,2.7rem); line-height:1.05; }
  .deck-card p{ font-size:1.02rem; }
  .card-brief{ background:var(--weiss); color:var(--bordeaux); }
  .card-brief p{ color:var(--bordeaux-soft); }
  .card-wisdom{ background:var(--hellblau); color:var(--olive); }
  .card-sticker{ background:var(--rosa-tint); color:var(--bordeaux); }
  .card-sticker p{ color:var(--bordeaux-soft); }
  .card-safe{ background:var(--rosa); color:var(--weiss); }
  .card-safe p{ color:rgba(255,255,255,.94); }
  .k-deco{ position:absolute; top:1.2rem; right:1.4rem; display:flex; gap:.4rem; }

  .deck-dots{ display:flex; gap:.55rem; z-index:2; }
  .deck-dots span{
    width:10px; height:10px; border-radius:50%;
    background:rgba(255,255,255,.3);
    transition:background .3s ease, transform .3s ease;
  }
  .deck-dots span.on{ background:var(--rosa); transform:scale(1.25); }
  body.no-motion .deck-dots, body.no-motion .deck-hint{ display:none; }

  /* =================== 5 · PREISE =================== */
  .pricing{ padding-block:clamp(5rem,10vw,8rem); background:var(--weiss); }
  .gingham{
    position:absolute; inset:-12% 0;
    background:
      repeating-linear-gradient(0deg, rgba(202,155,170,.32) 0 26px, transparent 26px 52px),
      repeating-linear-gradient(90deg, rgba(202,155,170,.32) 0 26px, transparent 26px 52px),
      var(--weiss);
    z-index:0;
  }
  .pricing .wrap{ position:relative; z-index:2; display:flex; flex-direction:column; gap:2.4rem; align-items:center; text-align:center; }
  .pricing .eyebrow{ color:var(--olive); }
  .price-grid{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
    gap:1.8rem; width:100%; max-width:820px;
  }
  .price-card{
    background:var(--weiss);
    border:1.5px solid rgba(65,0,22,.14);
    border-radius:16px;
    padding:2.4rem 2rem;
    display:flex; flex-direction:column; gap:1rem; align-items:center;
    box-shadow:0 14px 34px rgba(65,0,22,.12);
    position:relative;
  }
  .price-card.featured{ border-color:var(--bordeaux); }
  .price-badge{
    position:absolute; top:-16px; left:50%; transform:translateX(-50%) rotate(-2deg);
    background:var(--olive); color:var(--weiss);
    font-family:var(--body); font-size:.75rem; font-weight:700; letter-spacing:.08em;
    padding:.35rem .9rem; border-radius:999px;
    white-space:nowrap;
  }
  .price-name{ font-family:var(--display); font-size:2rem; }
  .price-value{ font-size:2.6rem; font-weight:300; font-variant-numeric:tabular-nums; line-height:1; }
  .price-value small{ font-size:1rem; font-weight:600; color:var(--bordeaux-soft); }
  .price-card ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.4rem; font-size:.95rem; color:var(--bordeaux-soft); }
  .price-note{ font-size:.85rem; color:var(--bordeaux-soft); max-width:52ch; }

  /* =================== 6 · INSTAGRAM =================== */
  .insta{ background:var(--graublau); padding-block:clamp(5rem,10vw,8rem); }
  .insta .wrap{ display:flex; flex-direction:column; gap:2.4rem; position:relative; z-index:2; }
  .insta .eyebrow{ color:var(--bordeaux); opacity:.75; }
  .insta-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
    gap:1.4rem; align-items:end;
  }
  .ig-tile{
    display:flex; flex-direction:column; gap:.8rem;
    border-radius:14px; padding:1.3rem;
    text-decoration:none;
    box-shadow:0 12px 28px rgba(65,0,22,.18);
    transition:transform .25s ease, box-shadow .25s ease;
    position:relative; overflow:hidden;
  }
  .ig-tile:hover{ transform:translateY(-5px); box-shadow:0 18px 36px rgba(65,0,22,.26); }
  .ig-tile.sq{ aspect-ratio:4/5; }     /* Carousel-Format */
  .ig-tile.reel{ aspect-ratio:9/16; }  /* Reel-Format */
  .ig-kind{
    font-family:var(--body); font-size:.68rem; font-weight:700;
    letter-spacing:.2em; text-transform:uppercase;
    display:flex; align-items:center; gap:.45rem;
  }
  .ig-tile .big{ font-family:var(--display); font-size:clamp(1.5rem,2.6vw,2rem); line-height:1.08; margin-top:auto; }
  .ig-tile .cap{ font-size:.82rem; opacity:.85; }
  .t-rosa{ background:var(--rosa); color:var(--weiss); }
  .t-blau{ background:var(--hellblau); color:var(--olive); }
  .t-weiss{ background:var(--weiss); color:var(--bordeaux); }
  .t-bordeaux{ background:var(--bordeaux); color:var(--rosa); }
  .insta-ctas{ display:flex; flex-wrap:wrap; gap:.9rem; }

  /* =================== 7 · BRIEFKASTEN =================== */
  /* Farbkombination aus dem CD: Bordeaux #410016 + Rosa #ca9baa */
  .mailbox{ background:var(--rosa); padding-block:clamp(5rem,10vw,8rem); }
  .mailbox .wrap{
    display:grid; grid-template-columns:1.05fr .95fr;
    gap:clamp(2rem,5vw,4rem); align-items:center;
    position:relative; z-index:2;
  }
  @media (max-width:880px){ .mailbox .wrap{ grid-template-columns:1fr; } }
  .mailbox .eyebrow{ color:var(--weiss); }
  .mailbox h2{ color:var(--bordeaux); }
  .mailbox-copy{ display:flex; flex-direction:column; gap:1.3rem; }
  .mailbox-copy p{ color:var(--bordeaux); }

  .login-card{
    background:var(--weiss);
    border-radius:16px;
    padding:clamp(1.6rem,3vw,2.4rem);
    box-shadow:0 16px 40px rgba(65,0,22,.14);
    display:flex; flex-direction:column; gap:1rem;
  }
  .login-card h3{ font-family:var(--display); font-weight:400; font-size:1.9rem; }
  .login-card label{ font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--bordeaux-soft); display:flex; flex-direction:column; gap:.35rem; }
  .login-card input{
    font-family:var(--body); font-size:1rem; font-weight:300;
    padding:.75rem .9rem;
    border:1.5px solid rgba(65,0,22,.2); border-radius:10px;
    background:var(--rosa-tint); color:var(--bordeaux);
  }
  .login-card input:focus{ border-color:var(--bordeaux); }
  .login-note{ font-size:.85rem; color:var(--bordeaux); display:none; }
  .login-note.show{ display:block; }
  .login-card .mini{ font-size:.82rem; color:var(--bordeaux-soft); }
  .login-card .mini a{ color:var(--bordeaux); }

  /* =================== 8 · FAQ =================== */
  .faqs{ background:var(--weiss); padding-block:clamp(5rem,10vw,8rem); }
  .faqs .wrap{ display:flex; flex-direction:column; gap:2.2rem; position:relative; z-index:2; }
  .faqs .eyebrow{ color:var(--olive); }
  .faq-list{ display:flex; flex-direction:column; gap:.8rem; max-width:780px; }
  .faq-list details{
    border:1.5px solid rgba(202,155,170,.55);
    border-radius:12px;
    padding:1.05rem 1.3rem;
    background:var(--weiss);
    transition:background .25s ease;
  }
  .faq-list details[open]{ background:var(--rosa-tint); }
  .faq-list summary{
    cursor:pointer; list-style:none;
    display:flex; justify-content:space-between; align-items:center; gap:1rem;
    font-weight:600; font-size:1rem;
  }
  .faq-list summary::-webkit-details-marker{ display:none; }
  .faq-list summary .sym{
    flex:none; width:28px; height:28px; border-radius:50%;
    background:var(--rosa); color:var(--weiss);
    display:flex; align-items:center; justify-content:center;
    font-size:1.15rem; font-weight:400; line-height:1;
    transition:transform .3s ease, background .3s ease;
  }
  .faq-list details[open] .sym{ transform:rotate(45deg); background:var(--olive); }
  .faq-list details p{ margin-top:.9rem; color:var(--bordeaux-soft); font-size:.98rem; }
  .faq-list details p + p{ margin-top:.6rem; }
  .faq-list a{ color:var(--olive); }

  /* =================== 9 · FOOTER =================== */
  footer{
    background:var(--bordeaux); color:var(--rosa);
    padding-block:3.5rem 2.2rem;
  }
  footer .wrap{ display:flex; flex-direction:column; gap:2.2rem; }
  .foot-top{ display:flex; flex-wrap:wrap; gap:2rem; justify-content:space-between; align-items:center; }
  .foot-brand{ display:flex; align-items:center; gap:1rem; }
  .foot-brand svg{ height:54px; width:auto; }
  .foot-brand .fb-name{ font-family:var(--display); font-size:1.7rem; color:var(--weiss); }
  .socials{ display:flex; gap:.9rem; }
  .socials a{
    width:44px; height:44px; border-radius:50%;
    border:1.5px solid rgba(202,155,170,.6);
    display:flex; align-items:center; justify-content:center;
    color:var(--rosa); transition:background .25s ease, color .25s ease;
  }
  .socials a:hover{ background:var(--rosa); color:var(--bordeaux); }
  .foot-legal{
    display:flex; flex-wrap:wrap; gap:1rem 2rem; align-items:center; justify-content:space-between;
    border-top:1px solid rgba(202,155,170,.3);
    padding-top:1.6rem;
    font-size:.85rem;
  }
  .foot-legal nav{ display:flex; flex-wrap:wrap; gap:1.2rem; }
  footer a{ color:var(--weiss); text-decoration:none; }
  footer a:hover{ text-decoration:underline; }
  .foot-contact a{ font-weight:600; }

  /* =================== Legal-Overlays =================== */
  .legal-page{
    position:fixed; inset:0; z-index:100;
    background:var(--weiss); color:var(--bordeaux);
    overflow-y:auto;
    display:none;
  }
  .legal-page.show{ display:block; }
  .legal-head{
    position:sticky; top:0;
    background:rgba(255,255,255,.95); backdrop-filter:blur(8px);
    border-bottom:1px solid rgba(202,155,170,.4);
    padding:1rem clamp(1.25rem,5vw,3rem);
    display:flex; justify-content:space-between; align-items:center; gap:1rem;
  }
  .legal-head .lp-title{ font-family:var(--display); font-size:1.8rem; }
  .legal-body{ max-width:760px; margin-inline:auto; padding:2.5rem clamp(1.25rem,5vw,3rem) 5rem; display:flex; flex-direction:column; gap:1rem; }
  .legal-body h3{ margin-top:1.4rem; color:var(--olive); }
  .legal-body p, .legal-body li{ color:var(--bordeaux-soft); font-size:.97rem; }
  .legal-body ul{ margin:0; padding-left:1.2rem; }
  .legal-body .placeholder{
    background:var(--rosa-tint); border:1.5px dashed var(--rosa);
    border-radius:12px; padding:1.4rem; color:var(--bordeaux);
  }

  /* =================== Motion-Toggle & Toast =================== */
  #motionToggle{
    position:fixed; right:1.1rem; bottom:1.1rem; z-index:90;
    font-family:var(--body); font-size:.78rem; font-weight:700; letter-spacing:.04em;
    background:var(--weiss); color:var(--bordeaux);
    border:1.5px solid var(--bordeaux); border-radius:999px;
    padding:.55rem 1rem; cursor:pointer;
    box-shadow:0 4px 14px rgba(65,0,22,.25);
  }
  #motionToggle:hover{ background:var(--rosa-tint); }
  #toast{
    position:fixed; left:50%; bottom:5rem; transform:translateX(-50%) translateY(20px);
    background:var(--bordeaux); color:var(--weiss);
    font-size:.9rem; font-weight:600;
    padding:.8rem 1.4rem; border-radius:999px;
    opacity:0; pointer-events:none;
    transition:opacity .35s ease, transform .35s ease;
    z-index:95; max-width:90vw; text-align:center;
  }
  #toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

  @media (max-width:640px){
    .layer.hide-sm{ display:none; }
  }

/* ---------- WordPress Admin-Bar ---------- */
body.admin-bar .site-nav{ top:32px; }
@media (max-width:782px){ body.admin-bar .site-nav{ top:46px; } }