/* ============================================================
   Eigene Webschriften (selbst gehostet, seit 31.08.2026)
   ------------------------------------------------------------
   Frueher per <link> von fonts.googleapis.com geladen. Das meldet
   bei jedem Seitenaufruf die IP des Besuchers an Google; deutsche
   Gerichte haben dagegen entschieden. Die Dateien liegen jetzt in
   assets/fonts/ und werden vom eigenen Server ausgeliefert.

   Herkunft: Google Fonts CSS API v2, abgerufen am 31.08.2026.
   Public Sans v21 (variabel, wght 100-900) - eine Datei je Subset.
   Spectral  v14 (statisch) - je Schnitt eine Datei.
   Lizenz: SIL Open Font License 1.1 (beide Familien).
   Subsets: latin + latin-ext (Englisch mit deutschen Umlauten).
   Die unicode-range-Angaben stammen unveraendert aus dem Google-CSS.
   ============================================================ */
  /* Public Sans 400 - latin-ext */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url('fonts/public-sans-var-latin-ext.woff2') format('woff2');
    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;
  }
  /* Public Sans 400 - latin */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url('fonts/public-sans-var-latin.woff2') format('woff2');
    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;
  }
  /* Public Sans 500 - latin-ext */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:500;
    font-display:swap;
    src:url('fonts/public-sans-var-latin-ext.woff2') format('woff2');
    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;
  }
  /* Public Sans 500 - latin */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:500;
    font-display:swap;
    src:url('fonts/public-sans-var-latin.woff2') format('woff2');
    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;
  }
  /* Public Sans 600 - latin-ext */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:600;
    font-display:swap;
    src:url('fonts/public-sans-var-latin-ext.woff2') format('woff2');
    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;
  }
  /* Public Sans 600 - latin */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:600;
    font-display:swap;
    src:url('fonts/public-sans-var-latin.woff2') format('woff2');
    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;
  }
  /* Public Sans 700 - latin-ext */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:700;
    font-display:swap;
    src:url('fonts/public-sans-var-latin-ext.woff2') format('woff2');
    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;
  }
  /* Public Sans 700 - latin */
  @font-face{
    font-family:'Public Sans';
    font-style:normal;
    font-weight:700;
    font-display:swap;
    src:url('fonts/public-sans-var-latin.woff2') format('woff2');
    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;
  }
  /* Spectral 400 italic - latin-ext */
  @font-face{
    font-family:'Spectral';
    font-style:italic;
    font-weight:400;
    font-display:swap;
    src:url('fonts/spectral-400-italic-latin-ext.woff2') format('woff2');
    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;
  }
  /* Spectral 400 italic - latin */
  @font-face{
    font-family:'Spectral';
    font-style:italic;
    font-weight:400;
    font-display:swap;
    src:url('fonts/spectral-400-italic-latin.woff2') format('woff2');
    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;
  }
  /* Spectral 400 - latin-ext */
  @font-face{
    font-family:'Spectral';
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url('fonts/spectral-400-latin-ext.woff2') format('woff2');
    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;
  }
  /* Spectral 400 - latin */
  @font-face{
    font-family:'Spectral';
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url('fonts/spectral-400-latin.woff2') format('woff2');
    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;
  }
  /* Spectral 500 - latin-ext */
  @font-face{
    font-family:'Spectral';
    font-style:normal;
    font-weight:500;
    font-display:swap;
    src:url('fonts/spectral-500-latin-ext.woff2') format('woff2');
    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;
  }
  /* Spectral 500 - latin */
  @font-face{
    font-family:'Spectral';
    font-style:normal;
    font-weight:500;
    font-display:swap;
    src:url('fonts/spectral-500-latin.woff2') format('woff2');
    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;
  }
  /* Spectral 600 - latin-ext */
  @font-face{
    font-family:'Spectral';
    font-style:normal;
    font-weight:600;
    font-display:swap;
    src:url('fonts/spectral-600-latin-ext.woff2') format('woff2');
    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;
  }
  /* Spectral 600 - latin */
  @font-face{
    font-family:'Spectral';
    font-style:normal;
    font-weight:600;
    font-display:swap;
    src:url('fonts/spectral-600-latin.woff2') format('woff2');
    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;
  }
  /* =========================================================
     DESIGN TOKENS
     ========================================================= */
  :root{
    /* ---- palette ---- */
    --navy:#1c2333; --navy2:#141b2b; --navy3:#232d47;
    --cream:#faf9f6; --cream2:#f3f1ec;
    --red:#c8232e; --red-dark:#a91b25; --red-lift:#d3323c;
    --rose:#d98a91;
    --muted:#5b6270;   /* 5.8:1 on cream — body secondary */
    --faint:#676e7b;   /* 4.9:1 on cream — tertiary / micro labels */
    --border:rgba(28,35,51,.12);
    --border-soft:rgba(28,35,51,.09);
    --border-strong:rgba(28,35,51,.2);
    /* text on dark ground (checked against --navy) */
    --on-dark-2:rgba(250,249,246,.74);   /* 8.0:1 */
    --on-dark-3:rgba(250,249,246,.62);   /* 6.5:1 */
    --hair:rgba(250,249,246,.14);
    --hair-2:rgba(250,249,246,.38);   /* 3.2:1 on navy3 — clears WCAG 1.4.11 for borders */
    --focus:var(--red);

    /* ---- spacing scale, 4px base ---- */
    --sp-1:4px;  --sp-2:8px;   --sp-3:12px; --sp-4:16px;
    --sp-5:20px; --sp-6:24px;  --sp-7:32px; --sp-8:40px;
    --sp-9:48px; --sp-10:64px; --sp-11:80px;

    /* ---- page rhythm ---- */
    --gutter:clamp(20px,4.4vw,56px);
    --section-y:clamp(64px,7.4vw,104px);
    --grid-gap:clamp(18px,1.8vw,24px);
    --head-mb:clamp(30px,4vw,48px);
    --maxw:1280px;

    /* ---- type ---- */
    --h1:clamp(34px,5.2vw,64px);
    --h2:clamp(28px,3.05vw,41px);
    --h3:clamp(20px,1.7vw,23px);

    /* ---- shape ---- */
    --r-xs:4px; --r-sm:6px; --r-md:10px; --r-lg:14px; --r-pill:999px;

    /* ---- elevation ---- */
    --sh-flat:0 1px 2px rgba(28,35,51,.05);
    --sh-lift:0 22px 42px -26px rgba(28,35,51,.34),0 2px 6px -3px rgba(28,35,51,.07);
    --sh-red:0 16px 30px -16px rgba(200,35,46,.55);
    --sh-panel:0 40px 80px -34px rgba(20,27,43,.62);

    /* ---- motion ---- */
    --ease:cubic-bezier(.16,1,.3,1);
    --ease-soft:cubic-bezier(.33,.72,.28,1);
    --t-fast:.22s; --t-mid:.42s; --t-slow:.4s;
    --lift:-6px;
    --reveal-y:22px;
    --reveal-dur:.95s;
    --reveal-step:70ms;
  }

  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--cream);font-family:'Public Sans',system-ui,sans-serif;color:var(--navy);overflow-x:hidden;-webkit-font-smoothing:antialiased}
  h1,h2,h3{font-family:'Spectral',serif;font-weight:500;margin:0;letter-spacing:-.014em}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  ::selection{background:var(--red);color:#fff}
  /* fixed header clears anchored jumps */
  [id]{scroll-margin-top:104px}

  /* keyboard focus — one visible ring everywhere, tinted per ground */
  :focus-visible{outline:2px solid var(--focus);outline-offset:3px}
  .hero,.consult,header,footer,.forwho,.settling,.corporate,.contact,.swband{--focus:var(--rose)}
  /* light card on a dark section, and dark box on a light section — flip the ring back */
  .consult-card{--focus:var(--red)}
  .guide-box{--focus:var(--rose)}

  /* film-grain texture, sits above everything, never blocks clicks */
  body::before{content:'';position:fixed;inset:0;z-index:200;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

  /* =========================================================
     REVEAL — uses the standalone `translate` property so it can
     never collide with the `transform` used by hover states.
     ========================================================= */
  .reveal,.stagger>*{opacity:0;translate:0 var(--reveal-y);
    transition:opacity var(--reveal-dur) var(--ease),translate var(--reveal-dur) var(--ease)}
  .reveal.in,.stagger.in>*{opacity:1;translate:0 0}
  .stagger.in>*:nth-child(1){transition-delay:0ms}
  .stagger.in>*:nth-child(2){transition-delay:calc(1*var(--reveal-step))}
  .stagger.in>*:nth-child(3){transition-delay:calc(2*var(--reveal-step))}
  .stagger.in>*:nth-child(4){transition-delay:calc(3*var(--reveal-step))}
  .stagger.in>*:nth-child(5){transition-delay:calc(4*var(--reveal-step))}
  .stagger.in>*:nth-child(6){transition-delay:calc(5*var(--reveal-step))}
  .stagger.in>*:nth-child(7){transition-delay:calc(6*var(--reveal-step))}
  .stagger.in>*:nth-child(8){transition-delay:calc(7*var(--reveal-step))}
  .stagger.in>*:nth-child(9){transition-delay:calc(8*var(--reveal-step))}
  .stagger.in>*:nth-child(n+10){transition-delay:calc(9*var(--reveal-step))}
  /* wide grids cascade faster so the last card is never left behind */
  .settling-grid,.programs-grid,.process-grid,.swband-list{--reveal-step:52ms}

  .grad-text{background:linear-gradient(90deg,var(--rose),var(--red) 75%);-webkit-background-clip:text;background-clip:text;color:transparent}
  .grad-text-dark{background:linear-gradient(90deg,var(--red),var(--navy) 85%);-webkit-background-clip:text;background-clip:text;color:transparent}

  /* =========================================================
     LAYOUT PRIMITIVES
     ========================================================= */
  .wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
  section{padding:var(--section-y) 0}

  /* flex + fit-content: shrink-wraps like inline, but still owns its line */
  .eyebrow{display:flex;width:fit-content;align-items:center;gap:var(--sp-3);font:600 11px 'Public Sans',sans-serif;letter-spacing:.26em;text-transform:uppercase}
  .eyebrow::before{content:'';width:20px;height:1px;background:currentColor;opacity:.6;flex:0 0 auto}

  /* two-column head: title left, standfirst right */
  .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--sp-5) var(--sp-8);margin-bottom:var(--head-mb);flex-wrap:wrap}
  .section-head h2{font-size:var(--h2);line-height:1.14;margin-top:var(--sp-3);text-wrap:pretty}
  .section-head p{font:400 14.5px/1.7 'Public Sans',sans-serif;color:var(--muted);max-width:44ch;margin:0}
  /* stacked head: eyebrow → h2 → lead, one rhythm everywhere */
  .section-intro{max-width:76ch}
  .section-intro h2{font-size:var(--h2);line-height:1.14;margin-top:var(--sp-3);text-wrap:pretty}
  .section-intro p{font:400 15px/1.7 'Public Sans',sans-serif;color:var(--muted);margin:var(--sp-4) 0 0;max-width:72ch;text-wrap:pretty}
  .section-intro+*{margin-top:var(--head-mb)}

  /* =========================================================
     CONTROLS
     ========================================================= */
  .btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);font:600 14px 'Public Sans',sans-serif;padding:14px 28px;border-radius:var(--r-sm);border:none;cursor:pointer;
    transition:background var(--t-fast) var(--ease-soft),color var(--t-fast),transform var(--t-mid) var(--ease),box-shadow var(--t-mid) var(--ease),border-color var(--t-fast)}
  .btn::after{content:'';position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(115deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-18deg);transition:left .7s var(--ease-soft)}
  .btn:hover::after,.btn:focus-visible::after{left:140%}
  .btn:hover,.btn:focus-visible{transform:translateY(-2px)}
  .btn:active{transform:translateY(0);transition-duration:.08s}
  .btn-red{background:linear-gradient(180deg,var(--red-lift),var(--red) 60%);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 6px 14px -10px rgba(200,35,46,.7)}
  .btn-red:hover,.btn-red:focus-visible{background:linear-gradient(180deg,var(--red),var(--red-dark) 70%);box-shadow:0 1px 0 rgba(255,255,255,.16) inset,var(--sh-red)}
  .btn-outline-dark{border:1px solid var(--hair-2);color:var(--cream);background:rgba(250,249,246,.02)}
  .btn-outline-dark:hover,.btn-outline-dark:focus-visible{background:rgba(250,249,246,.1);border-color:rgba(250,249,246,.45)}
  .btn-outline-light{border:1px solid var(--border);color:var(--navy)}
  .btn-outline-light:hover,.btn-outline-light:focus-visible{border-color:rgba(200,35,46,.5);color:var(--red)}
  .btn-cream{background:var(--cream);color:var(--navy)}
  .btn-cream:hover,.btn-cream:focus-visible{background:var(--red);color:#fff;box-shadow:0 16px 28px -14px rgba(0,0,0,.45)}

  .pill{border:1px solid var(--border);border-radius:var(--r-pill);padding:var(--sp-2) var(--sp-4);font:500 12.5px 'Public Sans',sans-serif;transition:transform var(--t-mid) var(--ease),border-color var(--t-fast)}
  .pill:hover{transform:translateY(-2px);border-color:rgba(200,35,46,.4)}

  /* one card body + one lift, shared by every card on the page */
  .card,.program-card,.video-card,.quote-card,.greviews{
    background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-md);box-shadow:var(--sh-flat);
    transition:transform var(--t-mid) var(--ease),box-shadow var(--t-mid) var(--ease),border-color var(--t-mid)}
  .card:hover,.program-card:hover,.video-card:hover,.quote-card:hover,.greviews:hover,
  .card:focus-within,.program-card:focus-within,.video-card:focus-within,.greviews:focus-visible{
    transform:translateY(var(--lift));box-shadow:var(--sh-lift);border-color:var(--border)}

  /* =========================================================
     DARK SECTIONS — one system, four different depths.
     Each dips to --navy2 at the entry edge and lifts to --navy3
     on the way out, with its own accent glow and a lit top seam.
     ========================================================= */
  .forwho,.settling,.corporate,.contact{
    position:relative;overflow:hidden;color:var(--cream);
    background:linear-gradient(180deg,var(--navy2) 0%,var(--navy) 44%,var(--navy3) 100%)}
  .forwho::before,.settling::before,.corporate::before,.contact::before{
    content:'';position:absolute;inset:0;z-index:0;pointer-events:none}
  .forwho::after,.settling::after,.corporate::after,.contact::after{
    content:'';position:absolute;top:0;left:0;right:0;height:1px;z-index:2;pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(217,138,145,.42) 24%,rgba(217,138,145,.42) 76%,transparent)}
  .forwho>*,.settling>*,.corporate>*,.contact>*{position:relative;z-index:1}
  .forwho::before  {background:radial-gradient(58% 78% at 88% 6%,rgba(217,138,145,.16),transparent 70%)}
  .settling::before{background:radial-gradient(54% 70% at 4% 42%,rgba(217,138,145,.18),transparent 72%)}
  .corporate::before{background:radial-gradient(64% 92% at 94% 94%,rgba(200,35,46,.2),transparent 70%)}
  .contact::before {background:radial-gradient(72% 62% at 50% 0%,rgba(217,138,145,.15),transparent 72%)}

  /* =========================================================
     HEADER
     ========================================================= */
  header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-5) var(--gutter);background:linear-gradient(180deg,rgba(8,10,16,.6) 0%,rgba(8,10,16,.32) 60%,transparent 100%);gap:var(--sp-6);position:fixed;top:0;left:0;right:0;z-index:100;
    transition:padding var(--t-mid) var(--ease),background var(--t-mid),box-shadow var(--t-mid)}
  header.scrolled{padding-top:var(--sp-3);padding-bottom:var(--sp-3);background:rgba(20,27,43,.9);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);box-shadow:0 12px 32px -22px rgba(0,0,0,.6)}
  header .brand-name,header .brand-sub,nav.mainnav a,.navcta{text-shadow:0 1px 6px rgba(0,0,0,.5)}
  .brand{display:flex;align-items:center;gap:var(--sp-3)}
  .brand-mark{height:44px;width:44px;border-radius:var(--r-xs);background:var(--cream);display:flex;align-items:center;justify-content:center}
  .brand-mark img{height:36px;width:auto}
  .brand-name{font:600 17px/1.1 'Spectral',serif;letter-spacing:.06em;color:var(--cream)}
  .brand-sub{font:500 10px/1.2 'Public Sans',sans-serif;letter-spacing:.34em;color:var(--rose)}
  nav.mainnav{display:flex;gap:var(--sp-6);font:500 13px 'Public Sans',sans-serif}
  nav.mainnav a{color:rgba(250,249,246,.85);position:relative;padding:2px 0;transition:color var(--t-fast)}
  nav.mainnav a::after{content:'';position:absolute;left:0;right:0;bottom:-3px;height:1px;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform var(--t-mid) var(--ease)}
  nav.mainnav a:hover{color:#fff}
  nav.mainnav a:hover::after,nav.mainnav a:focus-visible::after{transform:scaleX(1)}
  .navcta{white-space:nowrap}
  #navtoggle{position:absolute;opacity:0;pointer-events:none}
  .burger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:var(--sp-2);border-radius:var(--r-xs)}
  .burger span{width:22px;height:2px;background:var(--cream);display:block}
  #navtoggle:focus-visible+nav+div .burger,#navtoggle:focus-visible~div .burger{outline:2px solid var(--rose);outline-offset:3px}

  /* =========================================================
     HERO
     ========================================================= */
  .hero{position:relative;overflow:hidden;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(120px,14vh,152px) var(--gutter) clamp(112px,15vh,148px);background:var(--navy)}
  .hero-bg{position:absolute;inset:0;z-index:0}
  .hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.05) brightness(.85)}
  .hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,27,43,.76) 0%,rgba(28,35,51,.44) 32%,rgba(28,35,51,.57) 62%,rgba(28,35,51,.86) 82%,rgba(24,31,45,.97) 93%,#141925 100%)}
  .hero-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 36%,rgba(10,13,20,.5) 78%,rgba(10,13,20,.8) 100%)}
  .hero-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 38%,rgba(217,138,145,.22) 0%,transparent 58%);mix-blend-mode:screen}
  .hero-streak{position:absolute;inset:0;background:linear-gradient(115deg,transparent 42%,rgba(250,249,246,.05) 50%,transparent 58%)}
  .hero-grid{position:absolute;inset:0;opacity:.05;background-image:linear-gradient(rgba(250,249,246,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(250,249,246,.5) 1px,transparent 1px);background-size:64px 64px}
  .orb{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
  .orb-1{width:560px;height:560px;background:radial-gradient(circle,rgba(217,138,145,.42),transparent 70%);top:-180px;left:-140px;animation:drift1 28s ease-in-out infinite alternate}
  .orb-2{width:460px;height:460px;background:radial-gradient(circle,rgba(200,35,46,.32),transparent 70%);bottom:-160px;right:-120px;animation:drift2 34s ease-in-out infinite alternate}
  .orb-3{width:380px;height:380px;background:radial-gradient(circle,rgba(120,140,190,.22),transparent 70%);top:18%;right:8%;animation:drift3 40s ease-in-out infinite alternate}
  @keyframes drift1{from{transform:translate(0,0) scale(1)}to{transform:translate(70px,50px) scale(1.18)}}
  @keyframes drift2{from{transform:translate(0,0) scale(1)}to{transform:translate(-60px,-40px) scale(1.12)}}
  @keyframes drift3{from{transform:translate(0,0) scale(1)}to{transform:translate(-50px,60px) scale(1.22)}}
  .hero-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:var(--sp-6)}
  @keyframes heroReveal{from{opacity:0;transform:translateY(24px);filter:blur(7px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
  .hero-badge{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--hair-2);background:rgba(217,138,145,.16);backdrop-filter:blur(6px);border-radius:var(--r-pill);padding:10px 20px 10px 16px;opacity:0;animation:heroReveal .9s var(--ease) .05s both}
  .hero-badge .spark{color:var(--rose);font-size:13px;animation:sparkPulse 2.4s ease-in-out infinite}
  @keyframes sparkPulse{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.25)}}
  /* die Badge ist die einzige Zeile ueber der H1 — sie traegt die Verortung
     Chennai→Deutschland, also darf sie nicht als Deko untergehen */
  .hero-badge span.txt{font:700 13px 'Public Sans',sans-serif;letter-spacing:.17em;text-transform:uppercase;color:var(--cream);text-shadow:0 1px 10px rgba(10,13,20,.5)}
  /* "to" tritt zurueck, damit CHENNAI und GERMANY als Route stehen */
  .hero-badge .to{color:rgba(250,249,246,.8);font-weight:500}
  .hero h1{font-size:var(--h1);line-height:1.06;color:var(--cream);max-width:19ch;text-wrap:pretty;text-shadow:0 1px 26px rgba(10,13,20,.5),0 1px 4px rgba(10,13,20,.32);opacity:0;animation:heroReveal 1s var(--ease) .16s both}
  .hero h1 .grad-text{text-shadow:none;filter:drop-shadow(0 1px 12px rgba(10,13,20,.5)) drop-shadow(0 1px 3px rgba(10,13,20,.3))}
  .hero p{margin:0;max-width:60ch;font:400 17px/1.65 'Public Sans',sans-serif;color:var(--on-dark-2);text-wrap:pretty;text-shadow:0 1px 16px rgba(10,13,20,.55),0 1px 3px rgba(10,13,20,.38);opacity:0;animation:heroReveal 1s var(--ease) .3s both}
  .hero .actions{display:flex;gap:var(--sp-3);margin-top:var(--sp-2);flex-wrap:wrap;justify-content:center;opacity:0;animation:heroReveal 1s var(--ease) .44s both}
  .hero .stats{display:flex;gap:clamp(24px,3.2vw,44px);margin-top:var(--sp-7);padding-top:var(--sp-7);border-top:1px solid var(--hair-2);flex-wrap:wrap;justify-content:center;opacity:0;animation:heroReveal 1s var(--ease) .58s both}
  .hero .stats>div{position:relative;padding:0 clamp(0px,1vw,12px)}
  .hero .stats>div+div::before{content:'';position:absolute;left:calc(-1*clamp(12px,1.6vw,22px));top:6px;bottom:6px;width:1px;background:var(--hair)}
  .hero .stats .num{font:500 clamp(22px,2.2vw,30px) 'Spectral',serif;color:var(--cream)}
  .hero .stats .lbl{font:400 12.5px 'Public Sans',sans-serif;color:var(--on-dark-3);margin-top:var(--sp-1)}
  .scroll-indicator{position:absolute;left:50%;bottom:var(--sp-6);transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);opacity:0;animation:heroReveal 1s var(--ease) .9s both}
  .scroll-indicator .lbl{font:600 10px 'Public Sans',sans-serif;letter-spacing:.32em;text-transform:uppercase;color:var(--on-dark-3)}
  .scroll-pill{width:24px;height:38px;border:1px solid rgba(250,249,246,.4);border-radius:var(--r-pill);display:flex;justify-content:center;padding-top:var(--sp-2)}
  .scroll-dot{width:3px;height:8px;border-radius:2px;background:var(--rose);animation:scrollDot 1.8s ease-in-out infinite}
  @keyframes scrollDot{0%,100%{transform:translateY(0);opacity:1}70%{transform:translateY(9px);opacity:0}}
  /* on short viewports the hero is already tight — drop the cue rather than crowd the stats */
  @media (max-height:740px){.scroll-indicator{display:none}}

  /* =========================================================
     CONSULT FORM  — flows out of the hero without a seam
     ========================================================= */
  /* isolate: lets the ambient glow sit on the navy ground but under the card */
  .consult{position:relative;isolation:isolate;padding:var(--sp-10) var(--gutter) var(--sp-11);
    background:linear-gradient(180deg,var(--navy) 0%,#2a1a24 46%,#33161c 78%,#2a1620 100%)}
  .consult::before{content:'';position:absolute;left:50%;top:48%;width:min(920px,124%);height:min(660px,118%);transform:translate(-50%,-50%);
    background:radial-gradient(ellipse at center,rgba(200,35,46,.26),rgba(217,138,145,.09) 44%,transparent 71%);pointer-events:none;z-index:-1}


  /* ---------------------------------------------------------
     Beratungsband — bewegter Hintergrund (25.08.2026)
     Vier Lagen: Aurora, Raster, Lichtschwenk, Randabblendung.
     Alles nur transform/opacity, damit der Browser auf der GPU
     bleibt und nichts neu berechnen muss.
     --------------------------------------------------------- */
  .consult-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-2}
  .consult-bg span{position:absolute;display:block}

  /* die Frankfurter Skyline aus dem Kopfbereich, stark heruntergedimmt und
     ganz langsam heranfahrend — Tiefe wie bei Video, aber ohne zweiten
     7,8-MB-Download; das Standbild liegt ohnehin schon vor */
  .cbg-photo{inset:-6%;background:url('../video/hero-frankfurt-poster.jpg') center/cover no-repeat;
    opacity:.17;filter:grayscale(1) contrast(1.08);will-change:transform;
    /* oben ausmaskiert: der Kopfbereich endet in vollem Navy, also darf das
       Standbild dort noch gar nicht da sein — sonst steht eine Kante im Bild */
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,transparent 9%,
      rgba(0,0,0,.5) 30%,#000 56%,#000 88%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0%,transparent 9%,
      rgba(0,0,0,.5) 30%,#000 56%,#000 88%,transparent 100%);
    animation:cbgZoom 64s var(--ease-soft) infinite alternate}
  @keyframes cbgZoom{from{transform:scale(1) translate3d(0,0,0)}
    to{transform:scale(1.14) translate3d(-2%,-1.5%,0)}}

  .cbg-aurora{border-radius:50%;filter:blur(80px);will-change:transform}
  .cbg-a1{width:min(78vw,880px);height:min(78vw,880px);left:-16vw;top:-30%;
    background:radial-gradient(circle,rgba(200,35,46,.5),rgba(217,138,145,.22) 42%,transparent 70%);
    animation:cbgDrift1 46s var(--ease-soft) infinite alternate}
  .cbg-a2{width:min(72vw,800px);height:min(72vw,800px);right:-14vw;bottom:-40%;
    background:radial-gradient(circle,rgba(169,27,37,.56),rgba(200,35,46,.24) 44%,transparent 70%);
    animation:cbgDrift2 58s var(--ease-soft) infinite alternate}
  .cbg-a3{width:min(54vw,580px);height:min(54vw,580px);left:44%;top:8%;
    background:radial-gradient(circle,rgba(217,138,145,.34),transparent 70%);
    animation:cbgDrift3 52s var(--ease-soft) infinite alternate}
  @keyframes cbgDrift1{from{transform:translate3d(0,0,0) scale(1)}
    to{transform:translate3d(90px,60px,0) scale(1.2)}}
  @keyframes cbgDrift2{from{transform:translate3d(0,0,0) scale(1.06)}
    to{transform:translate3d(-80px,-56px,0) scale(1)}}
  @keyframes cbgDrift3{from{transform:translate3d(-40px,0,0) scale(1)}
    to{transform:translate3d(60px,-70px,0) scale(1.16)}}

  /* feines Raster, das ganz langsam diagonal wandert — gibt dem Band Tiefe,
     ohne dass man die Bewegung bewusst bemerkt */
  .cbg-grid{inset:-64px;opacity:.055;
    background-image:linear-gradient(rgba(250,249,246,.5) 1px,transparent 1px),
      linear-gradient(90deg,rgba(250,249,246,.5) 1px,transparent 1px);
    background-size:64px 64px;
    animation:cbgPan 34s linear infinite}
  @keyframes cbgPan{to{transform:translate3d(64px,64px,0)}}

  /* ein einzelner Lichtschwenk, der alle 15 s einmal durchs Band zieht */
  .cbg-sheen{inset:0;
    background:linear-gradient(104deg,transparent 38%,rgba(250,249,246,.07) 47%,
      rgba(250,249,246,.11) 50%,rgba(250,249,246,.07) 53%,transparent 62%);
    animation:cbgSheen 15s var(--ease-soft) infinite}
  @keyframes cbgSheen{
    0%{transform:translate3d(-62%,0,0);opacity:0}
    12%{opacity:1}
    58%{opacity:1}
    72%,100%{transform:translate3d(62%,0,0);opacity:0}}

  /* oben und unten weich auslaufen, damit das Band nicht als Kasten
     zwischen Kopfbereich und Fundleiste steht */
  /* zwei Lagen: die lange Navy-Rampe oben setzt genau dort an, wo der
     Kopfbereich aufhoert (.hero-scrim laeuft auf volles --navy aus), und die
     Vignette fuehrt dessen dunkle Raender nach unten weiter — dadurch geht das
     eine Bild ins andere ueber, statt an einer Kante zu wechseln */
  .cbg-fade{inset:0;background:
    radial-gradient(ellipse at 50% 30%,transparent 36%,rgba(10,13,20,.4) 78%,rgba(10,13,20,.68) 100%),
    linear-gradient(180deg,
      /* der Kopfbereich endet nicht auf --navy, sondern auf --navy plus
         Vignette — also faengt das Band genau auf diesem dunkleren Ton an */
      #111620 0%,
      rgba(20,27,43,.95) 7%,
      rgba(28,35,51,.72) 18%,
      rgba(28,35,51,.3) 30%,
      transparent 44%,
      transparent 72%,
      #2a1620 100%)}

  /* Karte bekommt einen ruhigen Sockel, damit sie vor der Bewegung steht */
  .consult::before{z-index:-1}

  /* auf dem Telefon kostet ein 80-px-Weichzeichner ueber vier Lagen Akku.
     Dort bleibt die Farbe, die Feinheiten fallen weg. */
  @media (max-width:720px){
    .cbg-aurora{filter:blur(54px);will-change:auto}
    .cbg-sheen{display:none}
    .cbg-grid{animation:none}
    .cbg-photo{opacity:.13;animation:none;will-change:auto}
  }

  @media (prefers-reduced-motion:reduce){
    .cbg-photo,.cbg-aurora,.cbg-grid,.cbg-sheen{animation:none !important}
    .cbg-sheen{opacity:0}
  }

  .consult-card{position:relative;max-width:640px;margin:0 auto;
    background:linear-gradient(168deg,#fff 0%,#fdfcfb 48%,var(--cream2) 100%);
    border:1px solid rgba(255,255,255,.55);border-radius:var(--r-lg);
    /* four layers: contact edge → close ambient → mid drop → wide soft cast */
    box-shadow:
      0 1px 2px rgba(20,27,43,.18),
      0 10px 20px -12px rgba(20,27,43,.4),
      0 34px 58px -28px rgba(20,27,43,.6),
      0 72px 120px -58px rgba(20,27,43,.75),
      inset 0 1px 0 rgba(255,255,255,.95);
    padding:var(--sp-8) var(--sp-8) var(--sp-7);display:flex;flex-direction:column;gap:var(--sp-3)}
  /* brand hairline along the top edge, fading out at both ends */
  .consult-card::before{content:'';position:absolute;left:var(--sp-8);right:var(--sp-8);top:0;height:1px;border-radius:1px;pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(200,35,46,.5) 28%,rgba(217,138,145,.6) 62%,transparent)}
  .consult-card h2{font-size:25px}
  .consult-card .sub{font:400 13.5px/1.55 'Public Sans',sans-serif;color:var(--muted);margin-top:calc(-1*var(--sp-1))}
  .consult-card .row2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
  .consult-card .field-stack{display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-1)}
  .consult-card .fine{font:400 11.5px 'Public Sans',sans-serif;color:var(--faint);text-align:center}

  /* ---- fields: floating label sits inside the box, so the name never leaves ---- */
  .fld{position:relative}
  .fld input,.fld select{width:100%;height:58px;padding:23px 15px 8px;
    border:1px solid var(--border-strong);border-radius:var(--r-md);
    background-color:rgba(255,255,255,.66);color:var(--navy);
    font:400 15px 'Public Sans',sans-serif;
    box-shadow:inset 0 1px 2px rgba(28,35,51,.045);
    transition:border-color var(--t-fast),background-color var(--t-fast),box-shadow var(--t-mid) var(--ease-soft)}
  .fld select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:44px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%235b6270' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 17px center}
  .fld label{position:absolute;left:16px;top:19px;transform-origin:0 0;pointer-events:none;
    font:400 15px 'Public Sans',sans-serif;color:var(--faint);
    transition:transform var(--t-fast) var(--ease-soft),color var(--t-fast)}
  .fld input:hover,.fld select:hover{border-color:rgba(28,35,51,.32);background-color:#fff}
  .fld input:focus,.fld select:focus{outline:none;border-color:var(--red);background-color:#fff;
    box-shadow:0 0 0 3px rgba(200,35,46,.13),0 10px 22px -14px rgba(200,35,46,.65),inset 0 1px 2px rgba(28,35,51,0)}
  /* label lifts on focus, and stays lifted once the field holds a value */
  .fld input:focus+label,.fld input:not(:placeholder-shown)+label,
  .fld select:focus+label,.fld select:valid+label{transform:translateY(-11px) scale(.72);color:var(--muted)}
  .fld input:focus+label,.fld select:focus+label{color:var(--red)}
  /* keyboard ring — :focus above clears the outline, so put it back explicitly */
  .fld input:focus-visible,.fld select:focus-visible{outline:2px solid var(--red);outline-offset:2px}
  /* wrong only once something was typed, or once a submit was attempted */
  .fld input:not(:placeholder-shown):invalid,
  .cc-form.tried .fld input:invalid,.cc-form.tried .fld select:invalid{border-color:var(--red);background-color:rgba(200,35,46,.035)}

  /* ---- checkbox: native box replaced, still a real focusable input ---- */
  .cc-check{display:flex;align-items:center;gap:10px;padding:var(--sp-1) 0;cursor:pointer;user-select:none;
    font:400 13px 'Public Sans',sans-serif;color:var(--muted)}
  .cc-check input{appearance:none;-webkit-appearance:none;position:relative;flex:0 0 auto;width:19px;height:19px;margin:0;cursor:pointer;
    border:1px solid var(--border-strong);border-radius:5px;background-color:#fff;
    transition:background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-mid) var(--ease-soft)}
  .cc-check:hover input{border-color:rgba(28,35,51,.34)}
  .cc-check input:checked{background-color:var(--red);border-color:var(--red);box-shadow:0 5px 12px -6px rgba(200,35,46,.8)}
  .cc-check input::after{content:'';position:absolute;left:6px;top:2px;width:5px;height:10px;
    border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);transition:transform .24s var(--ease)}
  .cc-check input:checked::after{transform:rotate(45deg) scale(1)}

  /* ---- submit: idle → loading → done ---- */
  .cc-submit{width:100%;height:54px;margin-top:var(--sp-1);font-size:15px}
  .cc-submit .cc-lbl{display:inline-flex;align-items:center;gap:9px;transition:opacity .2s var(--ease-soft),transform .28s var(--ease)}
  .cc-submit .cc-arrow{transition:transform var(--t-mid) var(--ease)}
  .cc-submit:hover .cc-arrow,.cc-submit:focus-visible .cc-arrow{transform:translateX(4px)}
  .cc-submit .cc-spin{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;
    border:2px solid rgba(255,255,255,.3);border-top-color:#fff;opacity:0;
    transition:opacity .2s var(--ease-soft);animation:ccSpin .68s linear infinite;animation-play-state:paused}
  .cc-submit.is-loading{pointer-events:none;cursor:progress}
  .cc-submit.is-loading .cc-lbl{opacity:0;transform:translateY(-7px)}
  .cc-submit.is-loading .cc-spin{opacity:1;animation-play-state:running}
  @keyframes ccSpin{to{transform:rotate(360deg)}}

  /* ---- done panel, swapped in for the form ---- */
  .cc-done{display:none;flex-direction:column;align-items:center;text-align:center;gap:var(--sp-3);padding:var(--sp-5) 0 var(--sp-2)}
  .cc-done.on{display:flex;animation:consultItem .75s var(--ease) both}
  .cc-mark{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(180deg,var(--red-lift),var(--red));box-shadow:var(--sh-red);animation:ccPop .6s var(--ease) .08s both}
  .cc-tick{stroke-dasharray:30;stroke-dashoffset:30;animation:ccDraw .5s var(--ease) .34s both}
  @keyframes ccPop{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}
  @keyframes ccDraw{to{stroke-dashoffset:0}}
  .cc-done h3{font-size:23px}
  .cc-done p{margin:0;max-width:42ch;font:400 14px/1.6 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}

  /* ---- entrance: card rises, contents cascade behind it ---- */
  @keyframes consultRise{from{opacity:0;transform:translateY(30px) scale(.984)}to{opacity:1;transform:none}}
  @keyframes consultItem{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
  .consult-card{opacity:0}
  .consult-card.in{animation:consultRise 1s var(--ease) both}
  .consult-card>h2,.consult-card>.sub,.consult-card .field-stack>*{opacity:0}
  .consult-card.in>h2,.consult-card.in>.sub,.consult-card.in .field-stack>*{animation:consultItem .8s var(--ease) both}
  .consult-card.in>h2{animation-delay:.16s}
  .consult-card.in>.sub{animation-delay:.24s}
  .consult-card.in .field-stack>*:nth-child(1){animation-delay:.34s}
  .consult-card.in .field-stack>*:nth-child(2){animation-delay:.42s}
  .consult-card.in .field-stack>*:nth-child(3){animation-delay:.5s}
  .consult-card.in .field-stack>*:nth-child(4){animation-delay:.58s}
  .consult-card.in .field-stack>*:nth-child(5){animation-delay:.64s}
  .consult-card.in .field-stack>*:nth-child(6){animation-delay:.7s}

  /* =========================================================
     LOCATIONS STRIP
     ========================================================= */
  .locations{padding:var(--sp-8) var(--gutter);background:var(--cream2);border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
  .locations-inner{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:var(--sp-3) var(--sp-6);flex-wrap:wrap}
  .locations .label{font:600 11px 'Public Sans',sans-serif;letter-spacing:.22em;color:var(--muted);text-transform:uppercase;margin-right:var(--sp-1)}
  .loc-chip{border:1px solid var(--border);border-radius:var(--r-pill);padding:var(--sp-2) var(--sp-4);font:500 13px 'Public Sans',sans-serif;background:#fff;transition:transform var(--t-mid) var(--ease),box-shadow var(--t-mid),border-color var(--t-fast)}
  .loc-chip:hover{transform:translateY(-2px);box-shadow:0 10px 20px -14px rgba(28,35,51,.3);border-color:var(--border-strong)}
  .loc-chip.active{background:var(--navy);color:var(--cream);border-color:var(--navy)}

  /* =========================================================
     WHO IT'S FOR
     ========================================================= */
  .forwho .eyebrow{color:var(--rose)}
  .forwho h2{color:var(--cream);max-width:26ch}
  .forwho .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-7) var(--grid-gap)}
  .forwho .item{border-top:1px solid var(--hair-2);padding-top:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-3);transition:border-color var(--t-mid)}
  .forwho .item:hover{border-color:var(--rose)}
  .forwho .num{font:400 15px 'Spectral',serif;font-style:italic;color:var(--rose)}
  .forwho .txt{font:400 16.5px/1.5 'Spectral',serif;color:var(--cream);text-wrap:pretty}

  /* =========================================================
     COURSES
     ========================================================= */
  .courses .eyebrow{color:var(--red)}
  .courses-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
  .course-card{padding:var(--sp-6) var(--sp-6) var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-3)}
  .course-card:hover{border-color:rgba(200,35,46,.35)}
  .course-top{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3)}
  .course-level{font:500 26px 'Spectral',serif;color:var(--red);display:inline-block;transition:transform var(--t-mid) var(--ease)}
  .course-card:hover .course-level{transform:scale(1.12)}
  .course-tag{font:500 10.5px 'Public Sans',sans-serif;letter-spacing:.14em;color:var(--faint)}
  .course-desc{font:400 14px/1.6 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}
  button.course-link{background:none;border:0;padding:var(--sp-1) 0 0;cursor:pointer;text-align:left;border-radius:var(--r-xs)}
  .course-link,.program-link,.partner-link{font:600 13px 'Public Sans',sans-serif;color:var(--navy);margin-top:auto;transition:color var(--t-fast)}
  .course-link:hover,.program-link:hover,.partner-link:hover{color:var(--red)}
  /* Common European Framework band — the substance of the CEFR chart the academy
     supplied on 11.08.2026, rebuilt in the site's own type instead of pasting their
     screenshot (which carried typos and a foreign white ground). */
  .cefr{margin-bottom:var(--sp-9);border:1px solid var(--border);border-radius:var(--r-md);background:#fff;box-shadow:var(--sh-flat);overflow:hidden}
  .cefr-head{padding:var(--sp-6);border-bottom:1px solid var(--border);display:grid;grid-template-columns:1fr 200px;gap:var(--sp-6) var(--sp-8);align-items:center}
  .cefr-headline{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-3)}
  .cefr-label{font:500 10.5px 'Public Sans',sans-serif;letter-spacing:.14em;color:var(--red);white-space:nowrap}
  .cefr-flag{width:26px;height:auto;border-radius:2px;flex:none;display:block}
  .cefr-note{font:400 14px/1.6 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}
  .cefr-illu{margin:0;justify-self:end}
  .cefr-illu img{display:block;width:100%;max-width:200px;height:auto}
  .cefr-ladder{display:grid;grid-template-columns:repeat(3,1fr)}
  .cefr-stage{padding:var(--sp-6);border-right:1px solid var(--border);display:flex;flex-direction:column;gap:var(--sp-3)}
  .cefr-stage:last-child{border-right:none}
  .cefr-rise{height:5px;border-radius:99px;background:linear-gradient(90deg,var(--red),var(--rose))}
  .cefr-stage:nth-child(1) .cefr-rise{width:34%}
  .cefr-stage:nth-child(2) .cefr-rise{width:67%}
  .cefr-stage:nth-child(3) .cefr-rise{width:100%}
  .cefr-stufe{font:500 11px 'Public Sans',sans-serif;letter-spacing:.12em;color:var(--faint)}
  .cefr-levels{display:flex;gap:var(--sp-4);font:500 30px/1 'Spectral',serif;color:var(--red)}
  .cefr-user{font:600 13.5px 'Public Sans',sans-serif;color:var(--navy)}
  .cefr-stage p{font:400 13.5px/1.6 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}
  .formats{display:flex;margin-top:var(--sp-7);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;flex-wrap:wrap;box-shadow:var(--sh-flat)}
  .formats>div{flex:1 1 220px;padding:var(--sp-5) var(--sp-6);border-right:1px solid var(--border);font:500 13.5px/1.5 'Public Sans',sans-serif;background:#fff;transition:background var(--t-fast)}
  .formats>div:hover{background:var(--cream)}
  .formats>div:last-child{border-right:none}
  .formats small{display:block;font:400 12px 'Public Sans',sans-serif;color:var(--faint);margin-top:var(--sp-1)}

  /* =========================================================
     PROGRAMS / PATHWAYS
     ========================================================= */
  .programs{background:var(--cream2);border-top:1px solid var(--border-soft)}
  .programs .eyebrow{color:var(--red)}
  .programs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
  .program-card{padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-3)}
  .program-mono{width:44px;height:44px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font:500 15px 'Spectral',serif;color:#fff;letter-spacing:.02em;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -8px 16px -8px rgba(0,0,0,.4);
    transition:transform var(--t-mid) var(--ease),box-shadow var(--t-mid)}
  .program-card:hover .program-mono{transform:rotate(-5deg) scale(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 22px -8px rgba(0,0,0,.42)}
  .program-card h3{font-size:17px;line-height:1.32;margin-top:var(--sp-1)}
  .program-card p{margin:0;font:400 13.5px/1.6 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}
  .program-link{padding-top:var(--sp-2)}
  .guide-box{margin-top:var(--sp-7);background:linear-gradient(135deg,var(--navy2),var(--navy3));border-radius:var(--r-md);padding:var(--sp-7) var(--sp-8);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-6);flex-wrap:wrap;position:relative;overflow:hidden;box-shadow:0 24px 48px -32px rgba(20,27,43,.7)}
  .guide-box::before{content:'';position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(217,138,145,.35),transparent 70%);top:-130px;right:-60px;filter:blur(10px)}
  .guide-box::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(217,138,145,.4),transparent)}
  .guide-box>*{position:relative;z-index:1}
  .guide-box .t{font:500 19px 'Spectral',serif;color:var(--cream)}
  .guide-box .s{font:400 13px/1.55 'Public Sans',sans-serif;color:var(--on-dark-3);margin-top:var(--sp-1)}

  /* =========================================================
     PROCESS
     ========================================================= */
  .process{background:var(--cream2)}
  .process .eyebrow{color:var(--red)}
  .process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-7) var(--grid-gap)}
  .process-step{display:flex;flex-direction:column;gap:var(--sp-2);padding-top:var(--sp-4);border-top:1px solid var(--border);transition:border-color var(--t-mid)}
  .process-step:hover{border-color:rgba(200,35,46,.45)}
  .process-step .n{font:400 34px 'Spectral',serif;font-style:italic;color:var(--red);line-height:1}
  .process-step h3{font:600 17px 'Public Sans',sans-serif;color:var(--navy);margin-top:var(--sp-1)}
  .process-step p{margin:0;font:400 15px/1.65 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}

  /* =========================================================
     SETTLING IN (SettleWell)
     ========================================================= */
  .settling .eyebrow{color:var(--rose)}
  .settling-badge{display:inline-flex;align-items:center;gap:var(--sp-2);border:1px solid var(--hair-2);background:rgba(250,249,246,.05);border-radius:var(--r-pill);padding:7px 16px 7px 8px;margin-top:var(--sp-4)}
  .settling-badge .dot{width:22px;height:22px;border-radius:50%;background:var(--rose);display:flex;align-items:center;justify-content:center;font:600 10px 'Spectral',serif;color:var(--navy)}
  .settling-badge span.t{font:600 12px 'Public Sans',sans-serif;letter-spacing:.04em;color:var(--cream)}
  .settling h2{color:var(--cream);max-width:24ch}
  .settling .section-intro p{color:var(--on-dark-2);max-width:70ch}
  .settling-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-7) var(--grid-gap)}
  .settling-item{border-top:1px solid var(--hair-2);padding-top:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-2);transition:transform var(--t-mid) var(--ease),border-color var(--t-mid)}
  .settling-item:hover{transform:translateX(4px);border-color:var(--rose)}
  .settling-item:hover h3{color:var(--rose)}
  .settling-item h3{font:500 16.5px/1.3 'Spectral',serif;color:var(--cream);transition:color var(--t-fast)}
  .settling-item p{margin:0;font:400 13px/1.6 'Public Sans',sans-serif;color:var(--on-dark-3)}
  .settling-callout{margin-top:var(--sp-9);background:rgba(250,249,246,.06);border:1px solid rgba(250,249,246,.16);border-radius:var(--r-md);padding:var(--sp-7) var(--sp-8);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-6);flex-wrap:wrap;transition:background var(--t-fast),border-color var(--t-fast)}
  .settling-callout:hover{background:rgba(250,249,246,.09);border-color:rgba(250,249,246,.28)}
  .settling-callout .t{font:500 19px 'Spectral',serif;color:var(--cream)}
  .settling-callout .s{font:400 13px/1.55 'Public Sans',sans-serif;color:var(--on-dark-3);margin-top:var(--sp-1);max-width:52ch}

  /* PLACEMENTS: section removed 12.08.2026 (named students were not real).
     Its CSS was removed with it — do not re-add without the real data. */

  /* =========================================================
     TESTIMONIALS
     ========================================================= */
  .testimonials .eyebrow{color:var(--red)}
  .video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap);margin-bottom:var(--sp-8)}
  .video-card{overflow:hidden}
  .video-thumb{aspect-ratio:16/9;background:repeating-linear-gradient(45deg,#e9ecf1 0 14px,#dfe4eb 14px 28px);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
  .video-thumb video{width:100%;height:100%;object-fit:cover;display:block;background:var(--navy)}
  .play{width:52px;height:52px;border-radius:50%;background:rgba(28,35,51,.85);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;transition:transform var(--t-mid) var(--ease),background var(--t-fast),box-shadow var(--t-mid)}
  .video-card:hover .play{transform:scale(1.14);background:var(--red);box-shadow:var(--sh-red)}
  .video-tag{position:absolute;bottom:10px;left:12px;font:400 11px ui-monospace,monospace;color:var(--muted)}
  .video-meta{padding:var(--sp-4) var(--sp-5)}
  .video-meta .n{font:600 14px 'Public Sans',sans-serif}
  .video-meta .r{font:400 12.5px 'Public Sans',sans-serif;color:var(--faint);margin-top:2px}
  .certified{display:flex;gap:var(--sp-3);margin-top:var(--sp-2);align-items:center;margin-bottom:var(--sp-9);flex-wrap:wrap}
  .certified span.label{font:500 12.5px 'Public Sans',sans-serif;color:var(--muted)}
  .cert-badge{border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 14px;font:600 12.5px 'Public Sans',sans-serif;background:#fff}
  .quotes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
  .quote-card{padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-5)}
  .quote-card blockquote{margin:0;font:400 15.5px/1.62 'Spectral',serif;font-style:italic;color:var(--navy);text-wrap:pretty}
  .quote-person{display:flex;align-items:center;gap:var(--sp-3);margin-top:auto;padding-top:var(--sp-1)}
  .quote-avatar{width:38px;height:38px;border-radius:50%;background:var(--navy);color:var(--cream);display:flex;align-items:center;justify-content:center;font:600 13px 'Public Sans',sans-serif;flex:0 0 auto}
  .quote-person .n{font:600 13.5px 'Public Sans',sans-serif}
  .quote-person .r{font:400 12px 'Public Sans',sans-serif;color:var(--faint);margin-top:1px}
  /* featured alumnus — the one the academy leads with on their own courses page */
  .quote-feature{display:grid;grid-template-columns:132px 1fr;gap:var(--sp-7);align-items:center;padding:var(--sp-7);margin-bottom:var(--grid-gap)}
  .quote-feature img{width:132px;height:132px;border-radius:50%;object-fit:cover;display:block;box-shadow:var(--sh-flat)}
  .quote-feature blockquote{margin:0;font:400 clamp(18px,2vw,22px)/1.5 'Spectral',serif;font-style:italic;color:var(--navy);text-wrap:pretty}
  .quote-feature .n{margin-top:var(--sp-4);font:600 14.5px 'Public Sans',sans-serif}
  .quote-feature .r{font:400 12.5px/1.5 'Public Sans',sans-serif;color:var(--faint);margin-top:2px}
  /* Google rating strip. Stands in for the review texts, which stay on Google
     where their authors put them — this states the figure and links to it. */
  .greviews{display:flex;align-items:center;gap:var(--sp-5);margin-top:var(--grid-gap);
    padding:var(--sp-5) var(--sp-6);text-decoration:none;color:inherit;flex-wrap:wrap}
  .greviews:hover .g-cta{color:var(--red-dark)}
  .g-mark{width:38px;height:38px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
    background:var(--cream2);border:1px solid var(--border);font:600 17px 'Public Sans',sans-serif;color:var(--navy)}
  .g-body{flex:1 1 240px;min-width:0}
  .g-stars{display:flex;gap:3px}
  .g-stars svg{width:15px;height:15px;display:block;fill:#e8a317}
  .g-line{display:block;margin-top:6px;font:400 12.5px/1.5 'Public Sans',sans-serif;color:var(--muted)}
  .g-score{font:600 14px 'Public Sans',sans-serif;color:var(--navy)}
  .g-cta{font:600 12.5px 'Public Sans',sans-serif;color:var(--red);flex:0 0 auto;transition:color var(--t-fast)}

  /* =========================================================
     CORPORATE
     ========================================================= */
  .corporate .eyebrow{color:var(--rose)}
  .corporate-inner{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(32px,4.4vw,56px);align-items:center}
  .corporate h2{color:var(--cream);font-size:var(--h2);line-height:1.14;text-wrap:pretty;margin-top:var(--sp-3)}
  .corporate p{margin:var(--sp-4) 0 0;font:400 15px/1.7 'Public Sans',sans-serif;color:var(--on-dark-2);max-width:56ch;text-wrap:pretty}
  .corporate .btn{margin-top:var(--sp-6)}
  /* typographic card in place of the removed stock photo */
  .corp-formats{background:rgba(250,249,246,.05);border:1px solid var(--hair-2);border-radius:var(--r-md);padding:var(--sp-7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 30px 60px -40px rgba(0,0,0,.8),inset 0 1px 0 rgba(250,249,246,.08)}
  .corp-formats .t{font:600 10.5px 'Public Sans',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--rose);display:block;padding-bottom:var(--sp-4);border-bottom:1px solid var(--hair)}
  .corp-formats ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 var(--sp-6)}
  .corp-formats li{position:relative;padding:var(--sp-4) 0 var(--sp-4) var(--sp-5);border-bottom:1px solid var(--hair);font:400 14px/1.4 'Public Sans',sans-serif;color:var(--on-dark-2)}
  .corp-formats li::before{content:'';position:absolute;left:0;top:calc(var(--sp-4) + .6em);width:8px;height:1px;background:var(--rose)}
  .corp-formats li:nth-last-child(-n+2){border-bottom:none;padding-bottom:0}

  /* =========================================================
     CONTENT PLACEHOLDERS
     Slots waiting on material from the academy. They must read as
     deliberately empty — quiet, flat, never like finished content.
     ========================================================= */
  .ph{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--sp-5);background:var(--cream2)}
  .ph::before{content:'';position:absolute;inset:9px;border:1px dashed rgba(28,35,51,.22);border-radius:var(--r-sm);pointer-events:none}
  .ph-label{position:relative;font:500 10.5px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
  .ph-note{margin:var(--sp-7) 0 0;font:400 12.5px/1.65 'Public Sans',sans-serif;color:var(--faint);border-left:2px solid var(--border-strong);padding-left:var(--sp-4);max-width:80ch}
  .video-card.is-ph,.quote-card.is-ph{box-shadow:none;border-style:dashed;border-color:var(--border)}
  .video-card.is-ph:hover,.quote-card.is-ph:hover,
  .video-card.is-ph:focus-within{transform:none;box-shadow:none;border-color:var(--border)}
  .quote-card.is-ph blockquote{font:500 11px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
  .quote-card.is-ph .quote-avatar{background:var(--cream2);color:var(--faint);border:1px dashed var(--border-strong)}
  .quote-card.is-ph .n,.quote-card.is-ph .r,.video-card.is-ph .n,.video-card.is-ph .r{color:var(--faint)}

  /* =========================================================
     FACULTY
     ========================================================= */
  .faculty .eyebrow{color:var(--red)}
  .faculty-list{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--grid-gap)}
  .faculty-card{
    background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-md);box-shadow:var(--sh-flat);
    padding:var(--sp-6);display:grid;grid-template-columns:150px 1fr;gap:var(--sp-6);align-items:start;
    transition:box-shadow var(--t-mid) var(--ease),border-color var(--t-mid)}
  .faculty-card:hover,.faculty-card:focus-within{box-shadow:var(--sh-lift);border-color:var(--border)}
  .faculty-photo{aspect-ratio:4/5;border-radius:var(--r-sm);overflow:hidden;background:var(--cream2)}
  .faculty-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
  .faculty-name{font:500 20px 'Spectral',serif;color:var(--navy)}
  .faculty-role{font:400 13px/1.55 'Public Sans',sans-serif;color:var(--muted);margin-top:var(--sp-1)}
  .faculty-creds{display:flex;flex-wrap:wrap;gap:6px;margin:var(--sp-4) 0 var(--sp-5)}
  .faculty-creds span{font:500 11px 'Public Sans',sans-serif;letter-spacing:.03em;color:var(--navy);
    background:var(--cream2);border:1px solid var(--border-soft);border-radius:var(--r-pill);padding:4px 10px}
  .faculty-bio p{margin:0 0 var(--sp-3);font:400 14px/1.68 'Public Sans',sans-serif;color:var(--muted);text-wrap:pretty}
  .faculty-bio p:last-child{margin-bottom:0}
  .faculty-link{display:inline-block;margin-top:var(--sp-4);font:600 13px 'Public Sans',sans-serif;color:var(--navy);transition:color var(--t-fast)}
  .faculty-link:hover{color:var(--red)}

  /* =========================================================
     FINAL CTA
     ========================================================= */
  .finalcta{background:var(--cream2);border-top:1px solid var(--border-soft);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--sp-6)}
  .finalcta h2{font-size:clamp(30px,3.4vw,44px);line-height:1.12;max-width:22ch;text-wrap:pretty}
  .finalcta .de{font:400 14px 'Spectral',serif;font-style:italic;color:var(--muted)}

  /* =========================================================
     FOOTER
     ========================================================= */
  footer{background:var(--navy2);padding:var(--sp-11) var(--gutter) var(--sp-8);color:var(--on-dark-2);border-top:1px solid rgba(250,249,246,.08)}
  .footer-grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.3fr .9fr .9fr .9fr 1.1fr;gap:var(--sp-8);padding-bottom:var(--sp-9);border-bottom:1px solid var(--hair)}
  .footer-brand{display:flex;flex-direction:column;gap:var(--sp-3)}
  .footer-brand .top{display:flex;align-items:center;gap:var(--sp-3)}
  .footer-brand .mark{height:40px;width:40px;border-radius:var(--r-xs);background:var(--cream);display:flex;align-items:center;justify-content:center}
  .footer-brand .mark img{height:32px;width:auto}
  .footer-brand .desc{font:400 14px/1.7 'Public Sans',sans-serif;max-width:34ch;text-wrap:pretty}
  .footer-col{display:flex;flex-direction:column;gap:var(--sp-2);font:400 14px/1.6 'Public Sans',sans-serif}
  .footer-col .head{font:600 12px 'Public Sans',sans-serif;letter-spacing:.2em;color:var(--cream);margin-bottom:var(--sp-2);text-transform:uppercase}
  .footer-col a{color:var(--on-dark-2);transition:color var(--t-fast)}
  .footer-col a:hover{color:#fff}
  .footer-bottom{max-width:var(--maxw);margin:0 auto;display:flex;justify-content:space-between;padding-top:var(--sp-6);font:400 13px 'Public Sans',sans-serif;color:rgba(250,249,246,.62);flex-wrap:wrap;gap:var(--sp-3)}
  .footer-bottom .links{display:flex;gap:var(--sp-5);flex-wrap:wrap}
  .footer-bottom a{color:rgba(250,249,246,.62);transition:color var(--t-fast)}
  .footer-bottom a:hover{color:var(--cream)}

  /* =========================================================
     COURSE LEVEL MODAL
     ========================================================= */
  .lvl-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:var(--sp-6)}
  .lvl-modal[hidden]{display:none}
  .lvl-backdrop{position:absolute;inset:0;background:rgba(20,27,43,.72);backdrop-filter:blur(3px);animation:lvlFade .28s ease both}
  .lvl-panel{position:relative;background:var(--cream);border-radius:var(--r-lg);max-width:720px;width:100%;max-height:86vh;overflow-y:auto;overscroll-behavior:contain;padding:var(--sp-9) var(--sp-8) var(--sp-7);box-shadow:var(--sh-panel);animation:lvlRise .38s var(--ease) both}
  @keyframes lvlFade{from{opacity:0}to{opacity:1}}
  @keyframes lvlRise{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}}
  .lvl-close{position:absolute;top:var(--sp-3);right:var(--sp-3);background:none;border:0;font-size:26px;line-height:1;color:var(--faint);cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);transition:color var(--t-fast),background var(--t-fast)}
  .lvl-close:hover{color:var(--red);background:rgba(28,35,51,.06)}
  .lvl-head{display:flex;align-items:center;gap:var(--sp-5);padding-bottom:var(--sp-5);padding-right:var(--sp-8);border-bottom:1px solid var(--border-soft)}
  .lvl-badge{font:500 30px 'Spectral',serif;color:var(--red);background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-sm);width:64px;height:64px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;box-shadow:var(--sh-flat)}
  .lvl-head h3{font:400 26px 'Spectral',serif;margin:0}
  .lvl-stufe{font:600 11px 'Public Sans',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-top:var(--sp-2)}
  .lvl-body{padding:var(--sp-6) 0 var(--sp-1)}
  .lvl-body .lvl-lead{font:400 16px/1.62 'Spectral',serif;color:var(--navy);margin:0 0 var(--sp-6)}
  .lvl-body h4{font:600 11px 'Public Sans',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin:var(--sp-6) 0 var(--sp-3)}
  .lvl-body ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:var(--sp-2)}
  .lvl-body li{font:400 14.5px/1.58 'Public Sans',sans-serif;color:var(--muted)}
  .lvl-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin-top:var(--sp-6)}
  .lvl-meta div{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4)}
  .lvl-meta span{display:block;font:500 17px 'Spectral',serif;color:var(--navy)}
  .lvl-meta small{display:block;font:600 10px 'Public Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-top:var(--sp-1)}
  .lvl-fine{font:400 13px/1.62 'Public Sans',sans-serif;color:var(--faint);margin:var(--sp-5) 0 0}
  .lvl-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);flex-wrap:wrap;padding-top:var(--sp-6);margin-top:var(--sp-2);border-top:1px solid var(--border-soft)}
  .lvl-terms{font:600 13px 'Public Sans',sans-serif;color:var(--navy);transition:color var(--t-fast)}
  .lvl-terms:hover{color:var(--red)}

  /* =========================================================
     ABOUT
     ========================================================= */
  .about .eyebrow{color:var(--red)}
  .about-story{max-width:70ch;display:flex;flex-direction:column;gap:var(--sp-4)}
  .about-story p{font:400 16.5px/1.72 'Public Sans',sans-serif;color:var(--muted);margin:0;text-wrap:pretty}
  /* the academy's own founding statement, from their homepage */
  .about-story p.lead{font:400 19px/1.6 'Spectral',serif;font-style:italic;color:var(--navy);border-left:2px solid var(--red);padding-left:var(--sp-5);margin-bottom:var(--sp-2)}
  .founder{margin-top:var(--sp-10);display:grid;grid-template-columns:300px 1fr;gap:var(--sp-9);align-items:start;background:var(--cream2);border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:var(--sp-8)}
  .founder-photo{border-radius:var(--r-md);overflow:hidden;background:var(--navy);aspect-ratio:4/5;box-shadow:var(--sh-flat)}
  .founder-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;display:block}
  .founder-text h3{font:400 30px/1.15 'Spectral',serif;margin:var(--sp-3) 0 0}
  .founder-role{font:400 14px/1.55 'Public Sans',sans-serif;color:var(--faint);margin-top:var(--sp-2);max-width:52ch}
  .founder-text p{font:400 15px/1.72 'Public Sans',sans-serif;color:var(--muted);margin:var(--sp-5) 0 0;text-wrap:pretty}
  .founder-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4);margin-top:var(--sp-7);padding-top:var(--sp-6);border-top:1px solid var(--border)}
  .founder-facts span{display:block;font:500 17px 'Spectral',serif;color:var(--navy)}
  .founder-facts small{display:block;font:400 12.5px/1.5 'Public Sans',sans-serif;color:var(--faint);margin-top:var(--sp-1)}

  /* =========================================================
     PARTNERS
     ========================================================= */
  .partners{background:var(--cream2);border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
  .partners .eyebrow{color:var(--red)}
  .partner-tabs{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-7)}
  .ptab{font:600 13px 'Public Sans',sans-serif;color:var(--muted);background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-pill);padding:10px 20px;cursor:pointer;transition:background var(--t-fast),color var(--t-fast),border-color var(--t-fast),transform var(--t-mid) var(--ease)}
  .ptab:hover{border-color:rgba(200,35,46,.45);color:var(--red);transform:translateY(-1px)}
  .ptab.is-active{background:var(--navy);border-color:var(--navy);color:var(--cream)}
  .ptab.is-active:hover{color:var(--cream);border-color:var(--navy)}
  .ptab-panel{display:none}
  .ptab-panel.is-active{display:block;animation:lvlRise .42s var(--ease) both}
  .partner-card{display:grid;grid-template-columns:1.05fr 1fr;gap:0;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-flat)}
  .partner-photo{background:var(--navy);min-height:300px}
  .partner-photo img{width:100%;height:100%;object-fit:cover;display:block}
  .partner-text{padding:var(--sp-8);display:flex;flex-direction:column;justify-content:center}
  .partner-kind{font:600 10.5px 'Public Sans',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--red)}
  .partner-text h3,.partner-mini h3{font:400 26px/1.25 'Spectral',serif;margin:var(--sp-3) 0 0}
  .partner-text p,.partner-mini p{font:400 15px/1.72 'Public Sans',sans-serif;color:var(--muted);margin:var(--sp-4) 0 0;text-wrap:pretty}
  .partner-note{font-style:italic;color:var(--faint) !important;font-size:13.5px !important}
  .partner-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--grid-gap)}
  .partner-mini{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:var(--sp-7);display:flex;flex-direction:column;box-shadow:var(--sh-flat);transition:transform var(--t-mid) var(--ease),box-shadow var(--t-mid) var(--ease)}
  .partner-mini:hover{transform:translateY(var(--lift));box-shadow:var(--sh-lift)}
  .partner-mini h3{font-size:23px}
  .partner-link{margin-top:var(--sp-6)}

  /* =========================================================
     CONTACT
     ========================================================= */
  .contact .eyebrow{color:var(--rose)}
  .contact .section-head h2{color:var(--cream)}
  .contact .section-head p{color:var(--on-dark-2)}
  .contact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-7) var(--grid-gap)}
  .contact-card{border-top:1px solid var(--hair-2);padding-top:var(--sp-5);display:flex;flex-direction:column;transition:border-color var(--t-mid)}
  .contact-card:hover{border-color:var(--rose)}
  .contact-kind{font:600 10.5px 'Public Sans',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--rose)}
  .contact-value{font:400 16.5px/1.55 'Spectral',serif;color:var(--cream);margin-top:var(--sp-3)}
  .contact-value a{color:var(--cream);transition:color var(--t-fast)}
  .contact-value a:hover{color:var(--rose)}
  .contact-link{font:600 13px 'Public Sans',sans-serif;color:var(--on-dark-2);margin-top:auto;padding-top:var(--sp-5);transition:color var(--t-fast)}
  .contact-link:hover{color:var(--rose)}

  /* =========================================================
     RESPONSIVE
     ========================================================= */
  @media (max-width:1100px){
    :root{--reveal-step:56ms}
    .forwho .grid,.courses-grid,.programs-grid,.process-grid,.video-grid,.quotes-grid,.settling-grid{grid-template-columns:repeat(2,1fr)}
    .corporate-inner{grid-template-columns:1fr;gap:var(--sp-8)}
    .footer-grid{grid-template-columns:1fr 1fr;gap:var(--sp-7)}
    nav.mainnav{display:none}
    .burger{display:flex}
    #navtoggle:checked~nav.mainnav{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--navy2);flex-direction:column;padding:var(--sp-4) var(--gutter) var(--sp-5);gap:var(--sp-4);border-top:1px solid var(--hair);box-shadow:0 24px 40px -28px rgba(0,0,0,.8)}
  }
  @media (max-width:900px){
    .faculty-list{grid-template-columns:1fr}
    .founder{grid-template-columns:1fr;gap:var(--sp-7);padding:var(--sp-7) var(--sp-6)}
    .founder-photo{max-width:230px;aspect-ratio:1/1}
    .partner-card{grid-template-columns:1fr}
    .partner-photo{min-height:240px}
    .partner-text{padding:var(--sp-7) var(--sp-6)}
    .contact-grid{grid-template-columns:repeat(2,1fr)}
    .cefr-ladder{grid-template-columns:1fr}
    .cefr-stage{border-right:none;border-bottom:1px solid var(--border)}
    .cefr-stage:last-child{border-bottom:none}
    .cefr-head{grid-template-columns:1fr;gap:var(--sp-5)}
    .cefr-illu{justify-self:start}
    .cefr-illu img{max-width:170px}
    .lvl-panel{padding:var(--sp-7) var(--sp-6) var(--sp-6)}
    .guide-box,.settling-callout{padding:var(--sp-6)}
  }
  @media (max-width:640px){
    .orb{display:none}
    /* die Route muss auf einer Zeile bleiben — zweizeilig zerfaellt sie */
    .hero-badge{padding:9px 15px 9px 12px;gap:8px}
    .hero-badge span.txt{font-size:11.5px;letter-spacing:.12em}
    .forwho .grid,.courses-grid,.programs-grid,.process-grid,.video-grid,.quotes-grid,.settling-grid,.footer-grid{grid-template-columns:1fr}
    .founder-facts,.lvl-meta{grid-template-columns:1fr}
    .faculty-card{grid-template-columns:1fr;gap:var(--sp-5);padding:var(--sp-6) var(--sp-5)}
    .faculty-photo{max-width:170px}
    .quote-feature{grid-template-columns:1fr;gap:var(--sp-5);padding:var(--sp-6)}
    .quote-feature img{width:96px;height:96px}
    .partner-grid,.contact-grid{grid-template-columns:1fr}
    .hero .stats{gap:var(--sp-5)}
    .hero .stats>div+div::before{display:none}
    .corp-formats{padding:var(--sp-6)}
    .corp-formats ul{grid-template-columns:1fr}
    .corp-formats li:nth-last-child(2){border-bottom:1px solid var(--hair);padding-bottom:var(--sp-4)}
    .consult-card{padding:var(--sp-7) var(--sp-5) var(--sp-6)}
    .consult-card .row2{grid-template-columns:1fr}
    .consult-card::before{left:var(--sp-5);right:var(--sp-5)}
    /* 16px kills iOS Safari's zoom-on-focus; the box grows to keep the ratio */
    .fld input,.fld select{height:60px;font-size:16px;padding-top:24px;padding-bottom:8px}
    .fld label{font-size:16px;top:19px}
    .cc-submit{height:56px}
    .section-head{align-items:flex-start}
    .lvl-modal{padding:0}
    .lvl-panel{max-height:100svh;border-radius:0}
    .footer-bottom{flex-direction:column}
  }

  /* =========================================================
     REDUCED MOTION — nothing moves, everything is visible
     ========================================================= */
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{
      animation-duration:1ms !important;
      animation-iteration-count:1 !important;
      transition-duration:1ms !important;
      transition-delay:0ms !important;
      scroll-behavior:auto !important}
    .reveal,.stagger>*{opacity:1 !important;translate:none !important}
    .hero-badge,.hero h1,.hero p,.hero .actions,.hero .stats,.scroll-indicator{opacity:1 !important;animation:none !important}
    .orb,.hero-streak,.scroll-dot{display:none}
    .btn::after{display:none}
    /* consult card: opacity only, nothing travels. The blanket 1ms rule above
       would kill the fade too, so the card restates its own transition. */
    .consult-card{opacity:0;transform:none !important;animation:none !important;
      transition:opacity .45s linear !important}
    .consult-card.in{opacity:1}
    .consult-card>h2,.consult-card>.sub,.consult-card .field-stack>*,
    .consult-card.in>h2,.consult-card.in>.sub,.consult-card.in .field-stack>*{
      opacity:1 !important;transform:none !important;animation:none !important}
    .cc-done.on{animation:none !important}
    .cc-mark,.cc-tick{animation:none !important}
    .cc-tick{stroke-dashoffset:0}
    /* no spinner to watch — the button keeps its label and JS swaps the wording */
    .cc-submit .cc-spin{display:none}
    .cc-submit.is-loading .cc-lbl{opacity:1;transform:none}
    .cc-submit:hover .cc-arrow,.cc-submit:focus-visible .cc-arrow{transform:none}
    .cc-check input::after{transform:rotate(45deg) scale(0)}
    .cc-check input:checked::after{transform:rotate(45deg) scale(1)}
    .fld input:focus+label,.fld input:not(:placeholder-shown)+label,
    .fld select:focus+label,.fld select:valid+label{transform:translateY(-11px) scale(.72)}
    .btn:hover,.card:hover,.program-card:hover,.video-card:hover,.quote-card:hover,
    .greviews:hover,.partner-mini:hover,.settling-item:hover,.loc-chip:hover{transform:none}
  }

  /* Unter 520px passen Marke, Header-CTA und Burger nicht nebeneinander: der CTA
     ist 216px breit und nicht umbrechbar, also schob er das Burger-Menü aus dem
     Bild — overflow-x:hidden hat den Überhang kaschiert, statt ihn zu zeigen.
     Der CTA entfällt hier; derselbe Knopf steht direkt darunter im Hero. */
  @media (max-width:520px){
    .navcta{display:none}
  }

  /* =========================================================
     MEHRSEITIG — Seitenkopf, aktiver Menüpunkt, Sprungmarke
     (ergaenzt am 25.08.2026 beim Umbau auf getrennte Seiten)
     ========================================================= */
  .skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--cream);color:var(--navy);
    padding:var(--sp-3) var(--sp-5);border-radius:0 0 var(--r-sm) 0;font:600 14px 'Public Sans',sans-serif}
  .skip-link:focus{left:0}

  /* der aktive Menuepunkt traegt den Strich dauerhaft */
  nav.mainnav a[aria-current="page"]{color:#fff}
  nav.mainnav a[aria-current="page"]::after{transform:scaleX(1)}

  .pagehero{position:relative;background:var(--navy);overflow:hidden;
    padding:clamp(118px,13vw,168px) var(--gutter) clamp(52px,6vw,76px);text-align:center}
  .pagehero-bg{position:absolute;inset:0;pointer-events:none}
  .pagehero-bg .orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5}
  .pagehero-bg .orb-1{width:min(46vw,520px);height:min(46vw,520px);left:-8vw;top:-40%;
    background:radial-gradient(circle,rgba(200,35,46,.42),transparent 70%)}
  .pagehero-bg .orb-2{width:min(38vw,430px);height:min(38vw,430px);right:-6vw;bottom:-55%;
    background:radial-gradient(circle,rgba(217,138,145,.3),transparent 70%)}
  .pagehero-inner{position:relative;max-width:820px;margin:0 auto}
  .pagehero-eyebrow{font:600 11px 'Public Sans',sans-serif;letter-spacing:.3em;color:var(--rose);
    margin-bottom:var(--sp-4)}
  .pagehero h1{font:600 var(--h2)/1.14 'Spectral',serif;color:var(--cream);margin:0 0 var(--sp-5);
    letter-spacing:-.01em}
  .pagehero p{font:400 clamp(15px,1.15vw,17px)/1.65 'Public Sans',sans-serif;color:var(--on-dark-2);
    max-width:640px;margin:0 auto}

  /* der Seitenkopf traegt die Ueberschrift schon — der Wiederholung im
     ersten Abschnitt darunter nehmen wir die Luft nach oben */
  .pagehero + section{padding-top:clamp(48px,5.4vw,72px)}


  .pagehero-cta{margin-top:var(--sp-7)}
  .corporate--solo .corp-formats{max-width:720px;margin:0 auto}
  .navcards{background:var(--cream2);border-top:1px solid var(--border-soft)}
  .navcards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
  .navcard{display:flex;flex-direction:column;gap:var(--sp-3);background:var(--cream);
    border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-7) var(--sp-6);
    box-shadow:var(--sh-flat);transition:transform var(--t-mid) var(--ease),
    box-shadow var(--t-mid) var(--ease),border-color var(--t-mid)}
  .navcard:hover{transform:translateY(-3px);box-shadow:var(--sh-lift);border-color:var(--border-strong)}
  .nc-kick{font:600 10px/1.5 'Public Sans',sans-serif;letter-spacing:.16em;color:var(--red)}
  /* Kicker traegt jetzt die Kurzangabe ("A1 - C2 . Online + Chennai") statt eines
     Seitenlabels - weniger Sperrung, damit es als Angabe und nicht als Rubrik liest. */
  .nc-title{font:600 var(--h3)/1.25 'Spectral',serif;color:var(--navy)}
  .nc-text{font:400 14.5px/1.6 'Public Sans',sans-serif;color:var(--muted);flex:1}
  .nc-go{font:600 13px 'Public Sans',sans-serif;color:var(--navy);margin-top:var(--sp-2)}
  .navcard:hover .nc-go{color:var(--red)}
  @media (max-width:1080px){ .navcards-grid{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:640px){ .navcards-grid{grid-template-columns:1fr} }

  @media (max-width:1080px){
    /* das Menue wandert frueher in den Burger, sonst bricht die Leiste um */
    nav.mainnav{display:none}
    .burger{display:flex}
    #navtoggle:checked~nav.mainnav{display:flex;position:absolute;top:100%;left:0;right:0;
      background:var(--navy2);flex-direction:column;padding:var(--sp-4) var(--gutter) var(--sp-5);
      gap:var(--sp-4);border-top:1px solid var(--hair);box-shadow:0 24px 40px -28px rgba(0,0,0,.8)}
  }


  /* =========================================================
     STARTSEITE — VERTRAUENSANREISSER (25.08.2026)
     Drei Stimmen und drei Gesichter zwischen Ablauf und Wegweiser.
     Die Stimmen erben .quote-card aus dem Testimonials-Baukasten,
     die Trainerkarten die Bauweise von .faculty-card, hier auf
     dunklem Grund wie .forwho — damit die helle Strecke zwischen
     Ablauf und Wegweiser nicht zu einem Block verschmilzt.
     ========================================================= */
  .homeproof .eyebrow{color:var(--red)}
  .homeproof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
  /* Portraet statt Initialen, wo eines vorliegt — .quote-avatar ist 38px flex */
  .quote-avatar.has-photo{background:var(--cream2);overflow:hidden;padding:0}
  .quote-avatar.has-photo img{width:100%;height:100%;object-fit:cover;border-radius:50%}

  /* Weiterleitung auf die vollstaendige Seite, Duktus wie .faculty-link */
  .proof-more{display:inline-flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-7);
    font:600 13.5px 'Public Sans',sans-serif;color:var(--navy);transition:color var(--t-fast),gap var(--t-fast)}
  .proof-more:hover{color:var(--red);gap:var(--sp-3)}
  .proof-more--dark{color:var(--cream)}
  .proof-more--dark:hover{color:var(--rose)}

  /* dunkles Band, gleiche Rezeptur wie .forwho / .settling / .corporate */
  .hometrainers{--focus:var(--rose);position:relative;overflow:hidden;color:var(--cream);
    background:linear-gradient(180deg,var(--navy2) 0%,var(--navy) 44%,var(--navy3) 100%)}
  .hometrainers::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background:radial-gradient(56% 74% at 6% 8%,rgba(217,138,145,.16),transparent 70%)}
  .hometrainers::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;z-index:2;pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(217,138,145,.42) 24%,rgba(217,138,145,.42) 76%,transparent)}
  .hometrainers>*{position:relative;z-index:1}
  .hometrainers .eyebrow{color:var(--rose)}
  .hometrainers h2{color:var(--cream)}
  .hometrainers .section-intro p{color:var(--on-dark-2)}

  /* SettleWell-Streifen auf der Startseite, 31.08.2026.
     Dunkles Band nach derselben Rezeptur wie .hometrainers, damit der Wechsel
     hell/dunkel ueber die Startseite erhalten bleibt. Die Chip-Optik
     (.settling-badge) kommt unveraendert von pathways.html. */
  .swband{--focus:var(--rose);position:relative;overflow:hidden;color:var(--cream);
    background:linear-gradient(180deg,var(--navy2) 0%,var(--navy) 46%,var(--navy3) 100%)}
  .swband::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background:radial-gradient(52% 68% at 92% 10%,rgba(217,138,145,.17),transparent 70%)}
  .swband::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;z-index:2;pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(217,138,145,.42) 24%,rgba(217,138,145,.42) 76%,transparent)}
  .swband>*{position:relative;z-index:1}
  .swband .eyebrow{color:var(--rose)}
  .swband h2{font:500 clamp(28px,3.4vw,42px)/1.14 'Spectral',serif;color:var(--cream);
    max-width:18ch;margin:var(--sp-4) 0 var(--sp-4);letter-spacing:-.01em}
  .swband-head{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-9) var(--grid-gap);align-items:start}
  .swband-head>div:first-child p{margin:0;font:400 15px/1.7 'Public Sans',sans-serif;
    color:var(--on-dark-2);max-width:52ch}
  .swband-head>div:first-child p strong{color:var(--cream);font-weight:600}
  .swband-list{display:grid;grid-template-columns:1fr;gap:var(--sp-6)}
  .swband-who{font:600 11px/1.4 'Public Sans',sans-serif;letter-spacing:.08em;
    text-transform:uppercase;color:var(--rose)}
  .swband-item{border-top:1px solid var(--hair-2);padding-top:var(--sp-4);
    display:flex;flex-direction:column;gap:var(--sp-2);
    transition:transform var(--t-mid) var(--ease),border-color var(--t-mid)}
  .swband-item:hover{transform:translateX(4px);border-color:var(--rose)}
  .swband-item:hover h3{color:var(--rose)}
  .swband-item h3{margin:0;font:500 19px/1.3 'Spectral',serif;color:var(--cream);
    transition:color var(--t-fast)}
  .swband-item p{margin:0;font:400 13px/1.6 'Public Sans',sans-serif;color:var(--on-dark-3)}
  .swband-foot{margin-top:var(--sp-9);background:rgba(250,249,246,.06);
    border:1px solid rgba(250,249,246,.16);border-radius:var(--r-md);
    padding:var(--sp-7) var(--sp-8);display:flex;justify-content:space-between;
    align-items:center;gap:var(--sp-6);flex-wrap:wrap;
    transition:background var(--t-fast),border-color var(--t-fast)}
  .swband-foot:hover{background:rgba(250,249,246,.09);border-color:rgba(250,249,246,.28)}
  .swband-foot .t{font:500 19px/1.35 'Spectral',serif;color:var(--cream);max-width:30ch}
  .swband-foot .s{font:400 13px/1.55 'Public Sans',sans-serif;color:var(--on-dark-3);
    margin-top:var(--sp-1);max-width:52ch}


  .trainer-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
  .trainer-mini{display:flex;flex-direction:column;gap:var(--sp-5);
    background:rgba(250,249,246,.045);border:1px solid var(--hair);border-radius:var(--r-lg);
    padding:var(--sp-5);box-shadow:var(--sh-flat);
    transition:transform var(--t-mid) var(--ease),background var(--t-mid),border-color var(--t-mid)}
  .trainer-mini:hover{transform:translateY(-3px);background:rgba(250,249,246,.08);border-color:var(--hair-2)}
  .tm-photo{aspect-ratio:1/1;border-radius:var(--r-sm);overflow:hidden;background:var(--navy2)}
  .tm-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;display:block}
  .tm-body{margin-top:auto}
  .tm-name{font:500 19px 'Spectral',serif;color:var(--cream)}
  .tm-role{font:400 12.5px/1.55 'Public Sans',sans-serif;color:var(--on-dark-3);margin-top:var(--sp-1)}
  .tm-creds{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--sp-4)}
  .tm-creds span{font:500 11px 'Public Sans',sans-serif;letter-spacing:.03em;color:var(--cream);
    background:rgba(250,249,246,.07);border:1px solid var(--hair);border-radius:var(--r-pill);padding:4px 10px}

  /* schmale Zeile, nur Nachpruefbares — Bauweise wie .certified */
  .prooffacts{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);
    margin-top:var(--sp-9);padding-top:var(--sp-6);border-top:1px solid var(--hair)}
  .pf-label{font:600 11px 'Public Sans',sans-serif;letter-spacing:.26em;text-transform:uppercase;
    color:var(--rose);margin-right:var(--sp-2)}
  .pf-item{font:500 12.5px 'Public Sans',sans-serif;color:var(--cream);
    background:rgba(250,249,246,.06);border:1px solid var(--hair);border-radius:var(--r-sm);padding:7px 14px}

  @media (max-width:1080px){
    .homeproof-grid,.trainer-row{grid-template-columns:repeat(2,1fr)}
  }
  @media (max-width:640px){
    .homeproof-grid,.trainer-row{grid-template-columns:1fr}
    .tm-photo{aspect-ratio:4/3}
    /* sonst klebt die Beschriftung neben dem ersten Chip und der Rest bricht darunter */
    .pf-label{flex:1 0 100%;margin:0 0 var(--sp-1)}
  }
  @media (prefers-reduced-motion:reduce){
    .trainer-mini:hover{transform:none}
    .proof-more:hover{gap:var(--sp-2)}
  }

  /* Responsive zum SettleWell-Streifen. Steht bewusst am Dateiende: die
     Grundregeln von .swband stehen hinter den uebrigen Media-Queries, deshalb
     wuerden diese Ueberschreibungen dort oben verlieren. */
  @media (max-width:1100px){
    .swband-head{grid-template-columns:1fr;gap:var(--sp-7)}
    .swband h2{max-width:24ch}
  }
  @media (max-width:900px){
    .swband-foot{padding:var(--sp-6)}
  }
  @media (prefers-reduced-motion:reduce){
    .swband-item:hover{transform:none}
  }

  /* ============================================================
     Rechtsseiten (payment.html, terms.html) — 31.08.2026
     ------------------------------------------------------------
     Beide Seiten sind reiner Fliesstext und waren vorher nur im
     Wix-Auftritt vorhanden. Eine schmale Lesespalte, sonst nichts:
     der Text ist verbindlich, er soll nicht dekoriert werden.
     ============================================================ */
  .legal{background:var(--cream)}
  .legal-inner{max-width:760px;margin:0 auto}
  .legal-meta{font:500 12.5px 'Public Sans',sans-serif;color:var(--faint);
    letter-spacing:.02em;padding-bottom:var(--sp-6);margin-bottom:var(--sp-8);
    border-bottom:1px solid var(--border)}
  .legal h2{font:600 var(--h3)/1.25 'Spectral',serif;color:var(--navy);
    margin:var(--sp-9) 0 var(--sp-4)}
  .legal h2:first-of-type{margin-top:0}
  .legal h3{font:600 15px 'Public Sans',sans-serif;color:var(--navy);
    margin:var(--sp-7) 0 var(--sp-3)}
  .legal p{font:400 15.5px/1.72 'Public Sans',sans-serif;color:var(--muted);
    margin:0 0 var(--sp-5)}
  .legal ul{margin:0 0 var(--sp-5);padding-left:var(--sp-5);list-style:none}
  .legal li{position:relative;font:400 15.5px/1.72 'Public Sans',sans-serif;
    color:var(--muted);margin-bottom:var(--sp-3);padding-left:var(--sp-5)}
  .legal li::before{content:"";position:absolute;left:0;top:.68em;
    width:5px;height:5px;border-radius:50%;background:var(--rose)}
  .legal a{color:var(--red);text-decoration:underline;text-underline-offset:2px}
  .legal a:hover{color:var(--red-dark)}
  .legal strong{color:var(--navy);font-weight:600}

  /* Stufentabelle auf payment.html. Im Wix-Original mit Leerzeichen
     ausgerichtet — hier eine echte Tabelle, gleicher Inhalt. */
  .legal-table{width:100%;border-collapse:collapse;margin:0 0 var(--sp-6)}
  .legal-table th,.legal-table td{text-align:left;padding:var(--sp-3) var(--sp-4);
    border-bottom:1px solid var(--border-soft);
    font:400 15px 'Public Sans',sans-serif;color:var(--muted);vertical-align:top}
  .legal-table th{font-weight:600;color:var(--navy);
    border-bottom:1px solid var(--border-strong)}
  .legal-table td:first-child{font-weight:600;color:var(--navy);white-space:nowrap;width:1%}

  /* Querverweis zwischen den beiden Rechtsseiten */
  .legal-crossref{margin-top:var(--sp-9);padding-top:var(--sp-6);
    border-top:1px solid var(--border);
    font:400 14px 'Public Sans',sans-serif;color:var(--faint)}

  @media (max-width:640px){
    .legal-table td:first-child{white-space:normal}
  }
