/* Schriften (Barlow, SIL Open Font License) lokal eingebettet, keine Verbindung zu Google */
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-400.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;}
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-400.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;}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-500.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;}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-500.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;}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-600.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;}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-600.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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-condensed-500.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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-condensed-500.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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-600.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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-600.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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-700.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;}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-700.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;}


  /* ============ FARBEN ============
     Dunkel ist Standard, Hell über data-theme="light".
     Die Akzentfarbe wird über die Bojenfarbe gewählt (siehe Script unten).
     Jede Seite liegt etwas tiefer: Start und OC hell, CCR tiefer, Cave am dunkelsten. */
  :root{
    --surface:#17384A;
    --mid:#0E2533;
    --deep:#081620;
    --abyss:#04090D;
    --panel:rgba(230,238,241,0.035);
    --card:rgba(230,238,241,0.045);
    --card-hover:rgba(230,238,241,0.075);
    --text:#E6EEF1;
    --muted:#9DB0B9;
    --dim:#8DA1AA;
    --line:rgba(230,238,241,0.11);
    --line-strong:rgba(230,238,241,0.2);
    --nav-bg:rgba(14,37,51,0.88);
    --menu-bg:#0E2533;
    --field-bg:rgba(4,9,13,.55);
    --float-bg:rgba(8,22,32,.94);
    --wave:rgba(230,238,241,.35);
    --grid:rgba(230,238,241,.08);
    --area1:#1B4255;
    --area2:#0F2C3A;
    --area3:#06121A;
    --accent:#FF6B00;
    --accent-text:var(--accent);
    --on-accent:#07131A;
    --maxw:1120px;
    --display:'Barlow Condensed','Arial Narrow',Arial,sans-serif;
    --body:'Barlow','Helvetica Neue',Arial,sans-serif;
    color-scheme:dark;
    box-sizing:border-box;
  }
  :root[data-theme="light"]{
    --surface:#F4F9FB;
    --mid:#E3EFF4;
    --deep:#CBDFE8;
    --abyss:#AFCBD8;
    --panel:rgba(255,255,255,0.5);
    --card:rgba(255,255,255,0.62);
    --card-hover:rgba(255,255,255,0.85);
    --text:#0C2230;
    --muted:#3D5765;
    --dim:#566F7C;
    --line:rgba(12,34,48,0.12);
    --line-strong:rgba(12,34,48,0.24);
    --nav-bg:rgba(244,249,251,0.9);
    --menu-bg:#EAF3F7;
    --field-bg:rgba(255,255,255,.8);
    --float-bg:rgba(255,255,255,.96);
    --wave:rgba(12,34,48,.3);
    --grid:rgba(12,34,48,.08);
    --area1:#FFFFFF;
    --area2:#E2EEF3;
    --area3:#C6DCE6;
    /* Akzent bleibt auch im hellen Modus in der vollen Neonfarbe */
    color-scheme:light;
  }
  *,*::before,*::after{box-sizing:inherit;}
  html{scroll-behavior:smooth;scroll-padding-top:calc(84px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%;text-size-adjust:100%;}

  /* Seitenhintergrund: je tiefer die Seite, desto dunkler */
  body{
    margin:0;color:var(--text);font-family:var(--body);font-size:17px;line-height:1.6;
    min-height:100vh;
    background:linear-gradient(180deg,var(--bg-a) 0%,var(--bg-b) 55%,var(--bg-c) 100%);
    background-color:var(--bg-c);
    -webkit-font-smoothing:antialiased;
    --bg-a:var(--surface);--bg-b:var(--mid);--bg-c:var(--deep);
  }
  :root[data-page="oc"] body{--bg-a:var(--surface);--bg-b:var(--surface);--bg-c:var(--mid);}
  :root[data-page="ccr"] body{--bg-a:var(--mid);--bg-b:var(--mid);--bg-c:var(--deep);}
  :root[data-page="cave"] body{--bg-a:var(--deep);--bg-b:var(--deep);--bg-c:var(--abyss);}
  :root[data-page="rebreather"] body,:root[data-page="ablauf"] body{--bg-a:var(--mid);--bg-b:var(--deep);--bg-c:var(--deep);}

  /* Sprachumschaltung: Inhalte stehen doppelt (lang="de" / lang="en") */
  :root[data-lang="de"] body [lang="en"],
  :root[data-lang="en"] body [lang="de"]{display:none !important;}

  h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.1;margin:0;letter-spacing:0;}
  a{color:inherit;}
  img,svg{display:block;max-width:100%;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;}
  @media (min-width:700px){.wrap{padding:0 40px;}}
  :focus-visible{outline:2px solid var(--accent-text);outline-offset:3px;}

  /* Seiten: immer nur eine sichtbar */
  .page{display:none;}
  .page.active{display:block;animation:pagein .25s ease-out;}
  @keyframes pagein{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

  /* ============ NAVIGATION ============ */
  .nav{position:sticky;top:0;z-index:40;background:var(--nav-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px);}
  .nav-inner{max-width:var(--maxw);margin:0 auto;padding:0 22px;height:64px;display:flex;align-items:center;gap:16px;}
  @media (min-width:700px){.nav-inner{padding:0 40px;}}
  .wordmark{display:flex;flex-direction:column;line-height:1;text-decoration:none;margin-right:auto;font-family:var(--display);}
  .wordmark{flex-direction:row;align-items:center;gap:10px;}
  .wm-text{display:flex;flex-direction:column;line-height:1;}
  .wm-logo{width:46px;height:46px;flex:none;transition:transform .3s ease;}
  .wordmark:hover .wm-logo{transform:rotate(-8deg) scale(1.05);}
  .wm-main{font-weight:700;font-size:1.3rem;letter-spacing:.04em;white-space:nowrap;}
  .wm-main .dot{color:var(--accent-text);padding:0 .12em;}
  .wm-sub{font-weight:600;font-size:.78rem;letter-spacing:.32em;color:var(--accent-text);margin-top:3px;text-transform:uppercase;}
  .nav-links{display:none;gap:20px;font-size:.95rem;color:var(--muted);}
  .nav-links a{text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;}
  .nav-links a:hover{color:var(--text);}
  .nav-links a[aria-current="page"]{color:var(--text);border-bottom-color:var(--accent-text);}
  @media (min-width:1100px){.nav-links{display:flex;}}
  .lang{flex:none;display:flex;border:1px solid var(--line-strong);border-radius:999px;overflow:hidden;}
  .lang button{background:none;border:0;color:var(--muted);font:600 .82rem var(--body);padding:6px 11px;cursor:pointer;}
  .lang button[aria-pressed="true"]{background:var(--accent-text);color:var(--on-accent);}
  .icon-btn{flex:none;display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:none;border:1px solid var(--line-strong);border-radius:50%;color:var(--text);cursor:pointer;padding:0;}
  .icon-btn svg{width:18px;height:18px;}
  .theme-btn .i-sun{display:none;}
  :root[data-theme="light"] .theme-btn .i-sun{display:block;}
  :root[data-theme="light"] .theme-btn .i-moon{display:none;}
  .nav .nav-cta{display:none;}
  @media (min-width:1100px){.nav .nav-cta{display:inline-block;}}
  .burger{border:0;border-radius:8px;}
  .burger svg{width:22px;height:22px;}
  @media (min-width:1100px){.burger{display:none;}}
  .mobile-menu{display:none;flex-direction:column;background:var(--menu-bg);border-bottom:1px solid var(--line);max-height:calc(100dvh - 64px);overflow-y:auto;overscroll-behavior:contain;}
  .mobile-menu.open{display:flex;}
  .mobile-menu a{padding:15px 22px;border-top:1px solid var(--line);text-decoration:none;color:var(--text);font-size:1.05rem;}
  .mobile-menu a[aria-current="page"]{color:var(--accent-text);font-weight:600;}
  .mobile-menu a.menu-cta{color:var(--accent-text);font-weight:600;}
  @media (min-width:1100px){.mobile-menu{display:none !important;}}

  /* ============ BUTTONS ============ */
  .btn{box-sizing:border-box;display:inline-block;font:600 1rem var(--body);text-decoration:none;padding:12px 24px;border-radius:999px;border:1px solid transparent;cursor:pointer;text-align:center;}
  .btn-primary{background:var(--accent-text);color:var(--on-accent);}
  .btn-primary:hover{filter:brightness(1.08);}
  .btn-ghost{border-color:var(--line-strong);color:var(--text);background:none;}
  .btn-ghost:hover{border-color:var(--muted);}
  .btn-small{padding:8px 16px;font-size:.9rem;}
  .text-link{color:var(--accent-text);text-decoration:none;border-bottom:1px solid currentColor;font-weight:600;}

  /* ============ ABSCHNITTE ============ */
  section{padding:64px 0;}
  @media (min-width:900px){section{padding:84px 0;}}
  .band{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .section-head{max-width:66ch;margin-bottom:36px;}
  .section-head h1,.section-head h2{font-size:clamp(2.1rem,4.4vw,3rem);font-weight:700;}
  .section-head p{color:var(--muted);margin:12px 0 0;}
  .eyebrow{display:block;font:600 .8rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);margin-bottom:10px;}
  .page-head{padding-bottom:20px;}
  .page-head + section{padding-top:8px;}

  /* ============ HERO ============ */
  .hero{padding:56px 0 64px;}
  @media (min-width:900px){.hero{padding:84px 0 88px;}}
  .hero-grid{display:grid;gap:40px;align-items:center;}
  @media (min-width:900px){.hero-grid{grid-template-columns:1.05fr .95fr;}}
  .hero h1{font-size:clamp(2.6rem,6.2vw,4.6rem);font-weight:700;max-width:13ch;}
  .hero .lead{color:var(--muted);font-size:1.12rem;max-width:44ch;margin:22px 0 0;}
  .hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;}
  .profile .p-line{stroke:var(--accent-text);}
  .profile .p-buoy{fill:var(--accent-text);}
  .profile .p-wave{stroke:var(--wave);}
  .profile .p-grid{stroke:var(--grid);}
  .profile .p-label{fill:var(--dim);}
  .profile .p-dot{fill:var(--text);stroke:var(--text);}

  /* Startseite: drei Bereiche, von hell nach dunkel */
  .areas{display:grid;gap:16px;}
  @media (min-width:860px){.areas{grid-template-columns:repeat(3,1fr);}}
  .area{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 24px 24px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--text);transition:transform .15s ease,border-color .15s ease;}
  .area:hover{transform:translateY(-2px);border-color:var(--line-strong);}
  .area-1{background:var(--area1);}
  .area-2{background:var(--area2);}
  .area-3{background:var(--area3);}
  .area .area-depth{font:700 2.6rem/1 var(--display);color:var(--accent-text);}
  .area .area-depth .pre{font-size:1rem;font-weight:500;color:var(--muted);margin-right:2px;}
  .area .area-depth small{font-size:1rem;font-weight:500;color:var(--muted);margin-left:4px;}
  .area h3{font-size:1.6rem;}
  .area p{margin:0;color:var(--muted);}
  .area .area-meta{margin-top:auto;padding-top:12px;border-top:1px dashed var(--line-strong);display:flex;justify-content:space-between;gap:10px;font-size:.92rem;color:var(--muted);}
  .area .area-go{color:var(--accent-text);font-weight:600;}
  .after-areas{margin:22px 0 0;color:var(--muted);}

  /* Einstieg: welcher Kurs passt zu meinem Brevet */
  .starter{display:grid;gap:0;border-top:1px solid var(--line);}
  .starter-row,.starter-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 28px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);}
  .starter-head{padding:10px 0;font:600 .72rem/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);}
  .starter-label{display:none;}
  .starter-next{font-size:1.08rem;}
  .starter-have{color:var(--muted);font-weight:500;}
  .starter-have small{display:block;color:var(--dim);font-size:.85rem;font-weight:400;}
  .starter-arrow{color:var(--accent-text);font-weight:700;text-align:center;}
  .starter-next a{text-decoration:none;border-bottom:1px solid var(--line-strong);font-weight:600;}
  .starter-next a:hover{border-color:var(--accent-text);}
  .starter-note{color:var(--dim);font-size:.92rem;margin:16px 0 0;max-width:70ch;}

  /* Über mich kurz (Start) und Über-mich-Seite */
  .about{display:grid;gap:36px;}
  @media (min-width:900px){.about{grid-template-columns:1.2fr .8fr;gap:64px;align-items:start;}}
  .about-text p{color:var(--muted);max-width:60ch;margin:0 0 14px;}
  .about-text p strong{color:var(--text);font-weight:600;}
  .quals{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
  .quals li{padding:12px 0;border-bottom:1px solid var(--line);color:var(--muted);}
  .quals li strong{display:block;color:var(--text);font-weight:600;}
  .quals a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--accent-text);}

  /* Weg-Leiste auf den Kursseiten */
  .path{display:flex;flex-wrap:wrap;align-items:center;gap:8px 6px;margin:18px 0 0;padding:14px 16px;border:1px dashed var(--line-strong);border-radius:12px;font-size:.92rem;color:var(--muted);}
  .path-label{width:100%;font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);}
  .path a{text-decoration:none;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:3px 11px;white-space:nowrap;}
  .path a:hover{border-color:var(--accent-text);}
  .path .sep{color:var(--accent-text);font-weight:700;}
  .head-grid{display:grid;gap:28px;align-items:start;}
  @media (min-width:900px){.head-grid{grid-template-columns:minmax(0,1fr) 260px;gap:48px;}}
  .chart{margin:0;max-width:260px;}
  .chart a{display:block;}
  .chart img{width:100%;height:auto;border-radius:12px;border:1px solid var(--line-strong);transition:transform .15s ease;}
  .chart a:hover img{transform:scale(1.02);}
  .chart figcaption{font-size:.82rem;color:var(--dim);margin-top:8px;}
  @media (max-width:899px){.chart{max-width:220px;}}
  .page-note{margin:14px 0 0;color:var(--text);border-left:3px solid var(--accent-text);padding-left:12px;max-width:70ch;}

  .list-tools{display:flex;justify-content:flex-end;margin:0 0 12px;}
  .toggle-all{background:none;border:0;color:var(--muted);font:500 .95rem var(--body);cursor:pointer;padding:8px 0;border-bottom:1px solid var(--line-strong);}
  .toggle-all:hover{color:var(--text);}

  /* ============ KURSKARTEN (auf- und zuklappbar) ============ */
  .course{border:1px solid var(--line);border-radius:14px;background:var(--card);margin:0 0 12px;transition:background .15s ease,border-color .15s ease;}
  .course:hover{background:var(--card-hover);}
  .course[open]{border-color:var(--line-strong);}
  .course > summary{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:20px;align-items:start;padding:22px 24px;cursor:pointer;list-style:none;}
  .course > summary::-webkit-details-marker{display:none;}
  .metric{display:block;font-family:var(--display);color:var(--accent-text);}
  .sum-main,.sum-text,.sum-req{display:block;}
  .metric-big{display:block;font-size:3rem;font-weight:700;line-height:.95;}
  .metric-word .metric-big{font-size:1.9rem;line-height:1.05;}
  .metric-long .metric-big{font-size:1.3rem;}
  .metric-small{display:block;font-size:.9rem;font-weight:500;color:var(--muted);margin-top:4px;line-height:1.25;}
  .sum-main h3{font-size:1.6rem;}
  .sum-text{margin:6px 0 0;color:var(--muted);max-width:66ch;}
  .sum-req{margin:10px 0 0;font-size:.92rem;color:var(--text);}
  .sum-req b{font-weight:600;color:var(--dim);}
  .sum-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right;}
  .sum-price{font:700 1.4rem/1.1 var(--display);white-space:nowrap;}
  .sum-toggle{display:inline-flex;align-items:center;gap:6px;font-size:.9rem;font-weight:600;color:var(--accent-text);white-space:nowrap;}
  .sum-toggle::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s ease;}
  .course[open] .sum-toggle::after{transform:rotate(-135deg) translateY(-2px);}
  .t-close{display:none;}
  .course[open] .t-open{display:none;}
  .course[open] .t-close{display:inline;}
  .course-detail{padding:0 24px 24px calc(24px + 96px + 20px);}
  .course-detail .desc{color:var(--muted);margin:0 0 18px;max-width:70ch;padding-top:18px;border-top:1px solid var(--line);}
  .prereq h4,.facts dt{font-family:var(--body);font-size:.85rem;font-weight:600;color:var(--dim);}
  .prereq-note{margin:2px 0 0;font-size:.85rem;color:var(--dim);font-style:italic;}
  .prereq ul{margin:6px 0 18px;padding-left:18px;max-width:70ch;}
  .prereq li{margin-bottom:4px;}
  .prereq li::marker{color:var(--accent-text);}
  .facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 24px;margin:0;padding:16px 0 0;border-top:1px dashed var(--line-strong);}
  @media (min-width:900px){.facts{grid-template-columns:repeat(4,minmax(0,1fr));}}
  .facts dd{margin:2px 0 0;font-size:.98rem;}
  .facts .price dd{font-family:var(--display);font-size:1.45rem;font-weight:700;line-height:1.2;}
  .min-note{margin:14px 0 0;font-size:.9rem;color:var(--dim);max-width:70ch;}
  .more{margin-top:16px;max-width:70ch;}
  .more p{margin:0 0 10px;color:var(--muted);}
  .more strong{display:block;color:var(--text);font-weight:600;}
  .infobox{margin:0 0 18px;padding:12px 14px;border-radius:10px;background:var(--panel);border:1px solid var(--line);font-size:.93rem;color:var(--muted);max-width:70ch;}
  .infobox strong{color:var(--text);}
  .detail-cta{margin-top:18px;}
  .ref-card{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:18px 24px;border:1px dashed var(--line-strong);border-radius:14px;color:var(--muted);}
  .ref-card strong{color:var(--text);}

  /* Ablauf */
  .info-grid{display:grid;gap:28px 40px;}
  @media (min-width:700px){.info-grid{grid-template-columns:repeat(2,1fr);}}
  @media (min-width:1000px){.info-grid{grid-template-columns:repeat(3,1fr);}}
  .info h3{font-size:1.3rem;margin-bottom:6px;}
  .info p{margin:0;color:var(--muted);}

  /* Rebreather */
  .units{display:grid;gap:20px;}
  @media (min-width:860px){.units{grid-template-columns:repeat(3,1fr);}}
  .unit{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--card);overflow:hidden;}
  .unit-photo{position:relative;aspect-ratio:1/1;background:var(--area2);border-bottom:3px solid var(--accent-text);}
  .unit-photo img{width:100%;height:100%;object-fit:cover;}
  .unit-photo .ph{position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:var(--dim);font-size:.9rem;}
  .unit-photo.missing img{display:none;}
  .unit-photo.missing .ph{display:flex;}
  .unit-photo .ph svg{width:44px;height:44px;opacity:.6;}
  .unit-body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1;}
  .unit h3{font-size:1.7rem;}
  .unit .unit-type{color:var(--accent-text);font-weight:600;font-size:.95rem;margin:4px 0 10px;}
  .unit .unit-sum{margin:0;color:var(--muted);}
  .unit .unit-when{margin:14px 0 0;padding:9px 12px;border-left:3px solid var(--accent-text);border-radius:0 8px 8px 0;background:var(--panel);color:var(--muted);font-size:.92rem;line-height:1.5;}
  .unit .unit-when strong{display:block;color:var(--text);font-weight:600;}
  .unit details{margin-top:auto;padding-top:14px;}
  .unit summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--accent-text);padding:6px 0;}
  .unit summary::-webkit-details-marker{display:none;}
  .unit summary::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s ease;}
  .unit details[open] summary::after{transform:rotate(-135deg) translateY(-2px);}
  .unit details p{margin:8px 0 0;color:var(--muted);}
  .buy{margin-top:32px;padding:24px;border:1px solid var(--line-strong);border-left:3px solid var(--accent-text);border-radius:12px;max-width:760px;}
  .buy h3{font-size:1.4rem;margin-bottom:6px;}
  .buy p{color:var(--muted);margin:0 0 16px;}
  .buy-row{display:grid;gap:18px;margin-top:32px;}
  .buy-row .buy{margin-top:0;max-width:none;}
  @media (min-width:900px){.buy-row{grid-template-columns:1fr 1fr;}}
  .buy-try{background:color-mix(in srgb,var(--accent) 7%,transparent);}
  .buy-try strong{color:var(--text);white-space:nowrap;}

  /* IDF */
  .idf-grid{display:grid;gap:36px;}
  @media (min-width:900px){.idf-grid{grid-template-columns:.9fr 1.1fr;gap:64px;}}
  .idf-intro p{color:var(--muted);}
  .idf-points{display:grid;gap:22px;}
  .idf-points h3{font-size:1.25rem;margin-bottom:4px;}
  .idf-points p{margin:0;color:var(--muted);}

  /* Rechtliches */
  .legal-grid{display:grid;gap:40px;}
  @media (min-width:900px){.legal-grid{grid-template-columns:.7fr 1.3fr;gap:64px;}}
  .legal-h{font-size:1.8rem;margin-bottom:12px;}
  .legal p{color:var(--muted);margin:0 0 12px;}
  .legal a{text-decoration:none;border-bottom:1px solid var(--line-strong);}
  .legal-text h3{font-size:1.15rem;margin:18px 0 4px;color:var(--text);}
  .legal-small{font-size:.88rem;color:var(--dim) !important;}

  /* Kontakt */
  .contact-grid{display:grid;gap:44px;}
  @media (min-width:900px){.contact-grid{grid-template-columns:.8fr 1.2fr;}}
  .contact-info p{color:var(--muted);}
  .contact-info dl{margin:24px 0 0;display:grid;gap:14px;}
  .contact-info dt{font-size:.85rem;color:var(--dim);font-weight:600;}
  .contact-info dd{margin:2px 0 0;}
  .contact-info a,.footer-inner a{text-decoration:none;border-bottom:1px solid var(--line-strong);}
  .contact-info a:hover,.footer-inner a:hover{border-color:var(--accent-text);}
  form{display:grid;gap:16px;}
  .row2{display:grid;gap:16px;}
  @media (min-width:560px){.row2{grid-template-columns:1fr 1fr;}}
  .field{display:grid;gap:6px;}
  .field label{font-size:.9rem;color:var(--muted);}
  .field input,.field select,.field textarea{width:100%;background:var(--field-bg);border:1px solid var(--line-strong);color:var(--text);padding:12px 14px;border-radius:10px;font:inherit;font-size:1rem;}
  .field select option,.field select optgroup{background:var(--menu-bg);color:var(--text);}
  .field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent-text);}
  .field textarea{min-height:120px;resize:vertical;}
  .form-note{font-size:.88rem;color:var(--dim);margin:0;}

  /* Abschluss-Band */
  .cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;}
  .cta-band h2{font-size:clamp(1.8rem,3.4vw,2.4rem);font-weight:700;}
  .cta-band p{margin:6px 0 0;color:var(--muted);}

  footer{padding:36px 0 110px;border-top:1px solid var(--line);color:var(--dim);font-size:.9rem;}
  .footer-inner{display:flex;flex-direction:column;gap:10px;flex-wrap:wrap;}
  @media (min-width:700px){.footer-inner{flex-direction:row;justify-content:space-between;}}

  /* ============ BOJENFARBE (Farbwahl) ============ */
  .buoy{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:50;display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
  .buoy-toggle{display:flex;align-items:center;gap:10px;background:var(--float-bg);border:1px solid var(--line-strong);color:var(--text);border-radius:999px;padding:8px 14px 8px 8px;font:600 .9rem var(--body);cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
  .buoy-toggle .dot{width:26px;height:26px;border-radius:50%;background:var(--accent-text);box-shadow:inset 0 -6px 0 rgba(0,0,0,.18);}
  .buoy-panel{display:none;background:var(--float-bg);border:1px solid var(--line-strong);border-radius:16px;padding:14px;max-width:340px;}
  .buoy.open .buoy-panel{display:block;}
  .buoy-panel p{margin:0 0 10px;font-size:.9rem;color:var(--muted);}
  .swatches{display:flex;flex-wrap:wrap;gap:10px;}
  .swatch{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;box-shadow:inset 0 -7px 0 rgba(0,0,0,.18);}
  .swatch[aria-pressed="true"]{border-color:var(--text);transform:scale(1.08);}
  .swatch-mono{background:linear-gradient(135deg,#0A0A0A 50%,#F2F6F8 50%) !important;border-color:var(--line-strong);}
  /* Bojenfarbe Schwarz: dunkler Modus weiss, heller Modus schwarz */
  :root[data-accent="mono"]{--accent:#F2F6F8;--accent-text:#F2F6F8;}
  :root[data-accent="mono"][data-theme="light"]{--accent:#0A0A0A;--accent-text:#0A0A0A;--on-accent:#FFFFFF;}

  /* Heller Modus: Neonfarbe bleibt. Symbole (Pfeile, Kennzahlen, Linien) bekommen eine dunkle Kontur,
     kleine Neon-Schrift nur einen Hauch davon, damit beides auf Weiss sichtbar ist */
  :root[data-theme="light"] :is(.wm-main .dot,.metric-big,.area .area-depth,.starter-arrow,.path .sep,.profile .p-line,.profile .p-buoy,.buoy-toggle .dot),
  :root[data-theme="light"] .starter-next::before,
  :root[data-theme="light"] .sum-toggle::after,
  :root[data-theme="light"] .unit summary::after{
    filter:drop-shadow(0 0 .6px rgba(12,34,48,.9)) drop-shadow(0 0 .3px rgba(12,34,48,.9));
  }
  :root[data-theme="light"] :is(.wm-sub,.eyebrow,.area .area-go,.sum-toggle,.text-link,.unit .unit-type,.unit summary,.mobile-menu a[aria-current="page"],.mobile-menu a.menu-cta){
    text-shadow:0 0 .5px rgba(12,34,48,.75),0 0 .5px rgba(12,34,48,.75);
  }
  /* Pfeile etwas kräftiger */
  .starter-arrow{font-size:1.35rem;line-height:1;}
  .path .sep{font-size:1.05rem;}
  .starter-next::before{font-size:1.15em;}
  /* Kursablauf als nummerierte Schritte */
  .steps-flow{list-style:none;margin:0;padding:0;counter-reset:st;display:grid;gap:0;}
  @media (min-width:860px){.steps-flow{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;}}
  .steps-flow li{position:relative;counter-increment:st;padding:18px 0 18px 54px;border-top:1px solid var(--line);}
  .steps-flow li::before{content:counter(st);position:absolute;left:0;top:18px;width:36px;height:36px;border-radius:50%;border:2px solid var(--accent-text);display:grid;place-items:center;font:700 1.1rem/1 var(--display);color:var(--accent-text);}
  .steps-flow h3{font-size:1.3rem;margin-bottom:6px;}
  .steps-flow p{margin:0;color:var(--muted);}
  :root[data-theme="light"] .steps-flow li::before{filter:drop-shadow(0 0 .6px rgba(12,34,48,.9)) drop-shadow(0 0 .3px rgba(12,34,48,.9));}
  @media (min-width:860px){.idf-points{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 32px;}}
  /* ============ MOBILE ============ */
  @media (max-width:699px){
    body{font-size:16.5px;}
    .wrap,.nav-inner{padding-left:20px;padding-right:20px;}
    p,li,dd{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;}
    .nav-inner{height:60px;gap:10px;}
    .wm-main{font-size:1.1rem;letter-spacing:.02em;}
    .wm-sub{font-size:.68rem;letter-spacing:.26em;}
    .lang button{padding:9px 11px;}
    .icon-btn{width:40px;height:40px;}
    .burger{width:44px;height:44px;margin-right:-8px;}
    .mobile-menu{max-height:calc(100dvh - 60px);}
    .mobile-menu a{padding:15px 20px;}
    html{scroll-padding-top:calc(76px + env(safe-area-inset-top,0px));}

    .hero{padding:40px 0 48px;}
    .hero-grid{gap:32px;}
    .hero h1{font-size:clamp(2.3rem,10.5vw,3rem);}
    .hero .lead{font-size:1.05rem;margin-top:16px;}
    .hero-ctas{margin-top:26px;}
    .hero-ctas .btn{flex:1 1 100%;}
    .profile{display:none;}

    section{padding:48px 0;}
    .section-head{margin-bottom:24px;}
    .section-head h1,.section-head h2{font-size:2rem;}

    .starter-row{grid-template-columns:1fr;gap:4px;padding:12px 0;}
    .starter-arrow{display:none;}
    .starter-head{display:none;}
    .starter-label{display:inline;color:var(--dim);font-weight:400;}

    /* Über mich: Zusammenfassung als kompaktes Raster neben- statt untereinander */
    .about{gap:24px;}
    .quals{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
    .quals li{font-size:.92rem;padding:10px 0;}
    .about .quals{order:-1;}

    .course > summary{grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;padding:18px;}
    .course .metric{grid-column:1 / -1;display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 8px;}
    .metric-big,.metric-word .metric-big{font-size:2rem;line-height:1;}
    .metric-small{margin-top:0;font-size:.92rem;}
    .sum-main{grid-column:1 / -1;}
    .sum-main h3{font-size:1.45rem;}
    .sum-side{grid-column:1 / -1;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-strong);text-align:left;}
    .sum-price{font-size:1.25rem;}
    .course-detail{padding:0 18px 20px;}
    .facts{gap:14px 16px;}
    .facts dd{font-size:.95rem;}
    .facts .price dd{font-size:1.25rem;}
    .detail-cta .btn,.buy .btn,form button[type="submit"],.cta-band .btn{width:100%;}
    .ref-card{padding:16px 18px;}

    .area{padding:22px 20px 20px;}
    .buy{padding:20px;}
    .contact-grid,.legal-grid,.idf-grid{gap:32px;}
    .legal-h{font-size:1.6rem;}
    footer{padding-bottom:96px;}

    .buoy{right:max(14px,env(safe-area-inset-right,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));}
    .buoy-toggle{padding:9px;box-shadow:0 4px 16px rgba(0,0,0,.3);}
    .buoy-toggle > span[lang]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
    .buoy-panel{max-width:calc(100vw - 28px);}
    .swatch{width:40px;height:40px;}
  }
  @media (max-width:380px){
    .wm-sub{display:none;}

  }

  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*{transition:none !important;animation:none !important;}}

  /* ============ LEBENDIGER EINSTIEG ============ */
  .hero{position:relative;overflow:hidden;isolation:isolate;}
  .hero-fx{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;}
  .hero-fx .ray{position:absolute;top:-20%;width:18%;height:140%;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,0) 70%);filter:blur(6px);transform-origin:top center;animation:sway 11s ease-in-out infinite alternate;}
  .hero-fx .r1{left:8%;transform:rotate(14deg);}
  .hero-fx .r2{left:30%;width:10%;transform:rotate(9deg);animation-duration:14s;animation-delay:-4s;opacity:.7;}
  .hero-fx .r3{left:55%;width:22%;transform:rotate(18deg);animation-duration:9s;animation-delay:-2s;opacity:.6;}
  .hero-fx .r4{left:78%;width:9%;transform:rotate(11deg);animation-duration:13s;animation-delay:-7s;opacity:.5;}
  @keyframes sway{from{translate:-3% 0;opacity:.55;}to{translate:4% 0;opacity:1;}}
  :root[data-theme="light"] .hero-fx .ray{background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0) 70%);}
  .motes i{position:absolute;bottom:-10px;width:var(--s,3px);height:var(--s,3px);border-radius:50%;background:rgba(230,238,241,.55);animation:mote linear infinite;}
  :root[data-theme="light"] .motes i{background:rgba(12,34,48,.25);}
  @keyframes mote{from{transform:translate(0,0);opacity:0;}10%{opacity:1;}to{transform:translate(var(--dx,20px),-110vh);opacity:0;}}
  .hero-eyebrow{margin-bottom:14px;}
  .hero h1{animation:rise .8s ease-out both;}
  .hero .lead{animation:rise .8s ease-out .15s both;}
  .hero-ctas{animation:rise .8s ease-out .3s both;}
  @keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
  /* Tauchprofil zeichnet sich selbst */
  /* Zeichnen des Profils: siehe Skript (Web Animations) */

  .profile .p-buoy-g{animation:bob 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center bottom;}
  @keyframes bob{50%{transform:translateY(3px) rotate(4deg);}}
  .profile .p-diver{fill:var(--accent);stroke:var(--text);stroke-width:1.5;}
  .profile .p-now{fill:var(--text);font-weight:600;font-variant-numeric:tabular-nums;}
  .scroll-cue{position:absolute;left:50%;bottom:18px;translate:-50% 0;width:26px;height:42px;border:2px solid var(--line-strong);border-radius:14px;display:block;}
  .scroll-cue span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--accent);animation:cue 1.8s ease-in-out infinite;}
  @keyframes cue{0%{opacity:0;transform:translateY(0);}30%{opacity:1;}100%{opacity:0;transform:translateY(14px);}}
  @media (max-width:699px){.scroll-cue{display:none;}}

  /* ============ ZAHLEN-BAND ============ */
  .stats{padding:36px 0;border-bottom:1px solid var(--line);}
  .stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 14px;}
  @media (max-width:519px){.stats .stat{padding-left:10px;}.stats .stat-num{font-size:1.9rem;}.stats .stat-lab{font-size:.84rem;}}
  @media (min-width:860px){.stats-grid{gap:22px 18px;}}
  .stat{display:flex;flex-direction:column;gap:4px;padding-left:14px;border-left:3px solid var(--accent);}
  .stat-num{font:700 clamp(2.2rem,5vw,3.2rem)/1 var(--display);color:var(--text);font-variant-numeric:tabular-nums;}
  .stat-lab{font-size:.92rem;color:var(--muted);}

  /* ============ KURSBEREICHE: Symbole und Hover ============ */
  .area-icon{display:inline-flex;width:46px;height:46px;color:var(--accent-text);margin-bottom:2px;}
  .area-icon svg{width:100%;height:100%;}
  .area{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;}
  .area:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 14px 34px rgba(0,0,0,.28);}
  .area:hover .area-icon{animation:wiggle .5s ease;}
  @keyframes wiggle{30%{transform:rotate(-8deg);}60%{transform:rotate(6deg);}}
  .course{transition:background .15s ease,border-color .15s ease,box-shadow .2s ease;}
  .course:hover{box-shadow:0 10px 26px rgba(0,0,0,.18);}
  .unit{transition:transform .2s ease,box-shadow .2s ease;}
  .unit:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.28);}

  /* ============ EINBLENDEN BEIM SCROLLEN ============ */
  :root.fx-ready .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease;}
  :root.fx-ready .reveal.in{opacity:1;transform:none;}

  /* ============ TIEFENMESSER ============ */
  .depth-gauge{position:fixed;right:18px;top:50%;translate:0 -50%;z-index:30;display:none;flex-direction:column;align-items:center;gap:8px;pointer-events:none;}
  @media (min-width:1280px){.depth-gauge{display:flex;}}
  .dg-label{font:600 .68rem var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);}
  .dg-track{position:relative;width:4px;height:180px;border-radius:2px;background:var(--line-strong);}
  .dg-fill{position:absolute;left:0;top:0;width:100%;height:0;border-radius:2px;background:var(--accent);transition:height .15s linear;}
  .dg-fish{position:absolute;left:50%;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(255,107,0,.18);transition:top .15s linear;}
  .dg-val{position:absolute;right:16px;top:0;translate:0 -50%;font:700 .98rem/1 var(--display);color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;padding:4px 8px;border-radius:7px;background:var(--float-bg);border:1px solid var(--line-strong);box-shadow:0 4px 14px rgba(0,0,0,.25);transition:top .15s linear;}
  .dg-ticks{position:absolute;inset:0;}
  .dg-ticks i{position:absolute;left:-5px;width:14px;height:1px;background:var(--line-strong);}
  /* Tiefenmesser zum Scrollen: Skala anklicken oder den Punkt ziehen (die Fläche zum Anfassen ist breiter als die Skala) */
  .dg-track{pointer-events:auto;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;}
  .dg-track::before{content:"";position:absolute;inset:-12px -14px;}
  .dg-track:hover .dg-fish,.depth-gauge.dragging .dg-fish{box-shadow:0 0 0 6px rgba(255,107,0,.3);}
  .depth-gauge.dragging .dg-track{cursor:grabbing;}
  .depth-gauge.dragging .dg-fill,.depth-gauge.dragging .dg-fish,.depth-gauge.dragging .dg-val{transition:none;}

  @media (prefers-reduced-motion:reduce){
    .hero-fx .ray,.motes i,.profile .p-buoy-g,.scroll-cue span,.hero h1,.hero .lead,.hero-ctas{animation:none !important;}

    :root.fx-ready .reveal{opacity:1;transform:none;transition:none;}
  }

  /* ============ FOTO IM EINSTIEG ============ */
  .hero-photo{position:absolute;inset:0;z-index:-2;background:url(../images/FB_IMG_1789289834014.jpg) 70% 45%/cover no-repeat;}
  .hero-photo::after{content:"";position:absolute;inset:0;
    background:
      linear-gradient(90deg,var(--bg-a) 0%,color-mix(in srgb,var(--bg-a) 82%,transparent) 38%,color-mix(in srgb,var(--bg-a) 35%,transparent) 72%,color-mix(in srgb,var(--bg-a) 20%,transparent) 100%),
      linear-gradient(0deg,var(--bg-a) 0%,transparent 28%);}
  :root[data-theme="light"] .hero-photo::after{
    background:
      linear-gradient(90deg,var(--bg-a) 0%,color-mix(in srgb,var(--bg-a) 88%,transparent) 42%,color-mix(in srgb,var(--bg-a) 55%,transparent) 100%),
      linear-gradient(0deg,var(--bg-a) 0%,transparent 30%);}
  @media (max-width:899px){
    .hero-photo{background-position:78% 40%;}
    .hero-photo::after{background:linear-gradient(180deg,color-mix(in srgb,var(--bg-a) 55%,transparent) 0%,color-mix(in srgb,var(--bg-a) 80%,transparent) 50%,var(--bg-a) 100%);}
    :root[data-theme="light"] .hero-photo::after{background:linear-gradient(180deg,color-mix(in srgb,var(--bg-a) 72%,transparent) 0%,color-mix(in srgb,var(--bg-a) 90%,transparent) 50%,var(--bg-a) 100%);}
  }
  /* Tauchprofil als Tauchcomputer-Display auf Glas */
  .hero .profile{padding:14px 10px 6px;border-radius:18px;border:1px solid var(--line-strong);
    background:color-mix(in srgb,var(--bg-c) 62%,transparent);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);
    box-shadow:0 20px 50px rgba(0,0,0,.35);}
  .hero .profile .p-label{fill:var(--muted);}
  :root[data-theme="light"] .hero .profile{background:color-mix(in srgb,var(--surface) 78%,transparent);box-shadow:0 16px 40px rgba(12,34,48,.15);}
  @media (min-width:900px){.hero .profile{margin-left:auto;max-width:460px;}}

  /* ============ FOTOS IN DEN SEITENKÖPFEN ============ */
  .page-head.has-photo{position:relative;isolation:isolate;}
  .page-head.has-photo::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:var(--ph) 50% 35%/cover no-repeat;opacity:.42;
    -webkit-mask-image:radial-gradient(120% 90% at 78% 0%,#000 0%,rgba(0,0,0,.55) 45%,transparent 78%);
            mask-image:radial-gradient(120% 90% at 78% 0%,#000 0%,rgba(0,0,0,.55) 45%,transparent 78%);}
  :root[data-theme="light"] .page-head.has-photo::before{opacity:.22;}
  @media (max-width:699px){.page-head.has-photo::before{opacity:.3;-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 85%);mask-image:linear-gradient(180deg,#000 0%,transparent 85%);}}
  .ph-oc{--ph:url(../images/kopf-oc.jpg);}
  .ph-ccr{--ph:url(../images/Kopf-ccr.jpg);}
  .ph-cave{--ph:url(../images/kopf-cave.jpg);}
  .ph-rebreather{--ph:url(../images/kopf-rebreather.jpg);}
  .ph-ablauf{--ph:url(../images/kopf-ablauf.jpg);}
  .page-head.has-photo .chart{box-shadow:0 18px 40px rgba(0,0,0,.35);}

  /* ============ PORTRÄT ÜBER MICH ============ */
  .about-quote{margin:4px 0 22px;padding:16px 20px;border-left:3px solid var(--accent-text);border-radius:0 12px 12px 0;background:var(--card);}
  .about-quote p{margin:0;font:600 1.18rem/1.45 var(--body);color:var(--text);}
  .portrait{margin:0 0 26px;position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line-strong);box-shadow:0 18px 44px rgba(0,0,0,.35);}
  .portrait img{display:block;width:100%;height:auto;}
  .portrait-sq img{aspect-ratio:1/1;object-fit:cover;object-position:50% 30%;}
  .about-side{display:flex;flex-direction:column;gap:0;min-width:0;}
  @media (max-width:699px){.about .about-side{order:-1;}.about-side .quals{order:0;}.portrait{max-width:420px;}}
  .unit-photo{overflow:hidden;}
  .unit-photo.fit img{position:absolute;inset:0;object-fit:contain;}
  .portrait figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 16px 12px;font-size:.88rem;color:#E6EEF1;background:linear-gradient(0deg,rgba(4,9,13,.8),transparent);}

  /* ============ INSTAGRAM-GALERIE ============ */
  .ig-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px 28px;margin-bottom:26px;}
  .ig-head h2{font-size:clamp(2rem,4vw,2.6rem);font-weight:700;margin:6px 0 0;}
  .ig-head p{margin:8px 0 0;color:var(--muted);max-width:52ch;}
  .ig-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  @media (min-width:700px){.ig-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}}
  .ig-grid a{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:10px;background:var(--card);}
  .ig-grid img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease,filter .4s ease;}
  .ig-grid a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(4,9,13,.55));opacity:0;transition:opacity .3s ease;}
  .ig-grid .ig-ico{position:absolute;right:10px;bottom:10px;z-index:1;width:26px;height:26px;color:#fff;opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .3s ease;}
  .ig-grid a:hover img,.ig-grid a:focus-visible img{transform:scale(1.06);filter:saturate(1.15);}
  .ig-grid a:hover::after,.ig-grid a:focus-visible::after,.ig-grid a:hover .ig-ico,.ig-grid a:focus-visible .ig-ico{opacity:1;transform:none;}
  @media (max-width:699px){.ig-grid a:nth-child(n+8){display:none;}}
  .ig-grid{grid-auto-flow:row dense;}
  .ig-grid a.tall{grid-row:span 2;aspect-ratio:auto;}
  .ig-grid a.tall img{position:absolute;inset:0;}
  .ig-btn{display:inline-flex;align-items:center;gap:10px;}
  .ig-btn svg{width:20px;height:20px;}

  /* ============ STIMMUNG AUF ALLEN SEITEN ============
     Fester Hintergrund hinter dem Inhalt: Lichtstrahlen und Schwebeteilchen.
     Je tiefer die Seite und je weiter gescrollt, desto schwächer das Tageslicht.
     In der Höhle gibt es kein Tageslicht, dafür Lampenkegel. */
  .sea-fx{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;--sun:1;--depth:0;}
  .sea-rays{position:absolute;inset:0;opacity:calc(var(--sun) * (1 - var(--depth) * .75));transition:opacity .8s ease;}
  .sea-rays span{position:absolute;top:-25%;height:150%;background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,0) 65%);filter:blur(8px);transform-origin:top center;animation:sway 12s ease-in-out infinite alternate;}
  .sea-rays span:nth-child(1){left:4%;width:14%;rotate:16deg;}
  .sea-rays span:nth-child(2){left:24%;width:7%;rotate:11deg;animation-duration:15s;animation-delay:-5s;opacity:.7;}
  .sea-rays span:nth-child(3){left:46%;width:18%;rotate:19deg;animation-duration:10s;animation-delay:-3s;opacity:.55;}
  .sea-rays span:nth-child(4){left:68%;width:9%;rotate:13deg;animation-duration:14s;animation-delay:-8s;opacity:.6;}
  .sea-rays span:nth-child(5){left:86%;width:12%;rotate:17deg;animation-duration:11s;animation-delay:-6s;opacity:.45;}
  :root[data-theme="light"] .sea-rays span{background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,0) 65%);}
  .sea-motes{position:absolute;inset:0;opacity:calc(.5 + var(--depth) * .5);}
  .sea-motes i{position:absolute;bottom:-10px;width:var(--s,3px);height:var(--s,3px);border-radius:50%;background:rgba(230,238,241,.4);animation:mote linear infinite;}
  :root[data-theme="light"] .sea-motes i{background:rgba(12,34,48,.2);}
  /* Lampenkegel (nur Höhle) */
  .sea-beams{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;}
  .sea-beams span{position:absolute;top:-8%;width:38vmax;height:120vh;transform-origin:50% 0;
    clip-path:polygon(47% 0,53% 0,100% 100%,0 100%);
    background:linear-gradient(180deg,rgba(255,248,226,.12),rgba(255,248,226,.03) 55%,rgba(255,248,226,0) 85%);filter:blur(18px);
    animation:sweep 17s ease-in-out infinite alternate;}
  .sea-beams span:nth-child(1){left:52%;rotate:24deg;}
  .sea-beams span:nth-child(2){left:-6%;rotate:-20deg;animation-duration:21s;animation-delay:-9s;opacity:.6;}
  @keyframes sweep{from{transform:rotate(-9deg);}to{transform:rotate(11deg);}}
  :root[data-theme="light"] .sea-beams span{background:linear-gradient(180deg,rgba(255,250,235,.7),rgba(255,250,235,.15) 55%,rgba(255,250,235,0) 85%);}
  /* Taschenlampe folgt der Maus (nur Höhle) */
  .sea-torch{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;
    background:radial-gradient(circle 280px at var(--mx,70%) var(--my,30%),rgba(255,246,220,.075),rgba(255,246,220,.03) 45%,transparent 72%);}
  :root[data-theme="light"] .sea-torch{background:radial-gradient(circle 280px at var(--mx,70%) var(--my,30%),rgba(255,255,255,.55),transparent 72%);}

  /* Stärke pro Seite: je tiefer, desto weniger Tageslicht */
  :root[data-page="start"] .sea-fx,:root[data-page="oc"] .sea-fx{--sun:1;}
  :root[data-page="ueber"] .sea-fx,:root[data-page="kontakt"] .sea-fx{--sun:.85;}
  :root[data-page="ccr"] .sea-fx,:root[data-page="ablauf"] .sea-fx{--sun:.65;}
  :root[data-page="rebreather"] .sea-fx{--sun:.5;}
  :root[data-page="rechtliches"] .sea-fx{--sun:.35;}
  :root[data-page="cave"] .sea-fx{--sun:0;}
  :root[data-page="cave"] .sea-beams{opacity:1;}
  :root[data-page="cave"] .sea-torch{opacity:1;}
  :root[data-page="cave"] .sea-motes{opacity:.35;}

  @media (prefers-reduced-motion:reduce){
    .sea-rays span,.sea-motes i,.sea-beams span{animation:none !important;}
    .sea-motes{display:none;}
    .ig-grid img{transition:none;}
  }

  /* ============ LOGO, VERGRÖSSERTE CHARTS, FORMULAR-HINWEIS ============ */
  @media (max-width:699px){.wm-logo{width:38px;height:38px;}.wordmark{gap:8px;}}
  @media (max-width:400px){.nav-inner{gap:8px;padding-left:16px;padding-right:16px;}.wm-main{font-size:1rem;}.wm-logo{width:30px;height:30px;}.wordmark{gap:6px;}}
  @media (max-width:345px){.wm-text{display:none;}}
  .stat{min-width:0;}
  .stat-lab{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere;}
  @media (max-width:360px){.stats-grid{gap:18px 10px;}.stats .stat{padding-left:8px;}.stats .stat-num{font-size:1.65rem;}}
  .chart a.zoom-link{cursor:zoom-in;}
  .lightbox{padding:0;border:0;margin:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;background:transparent;color:#E6EEF1;overflow:hidden;}
  .lightbox::backdrop{background:rgba(4,9,13,.9);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}
  .lb-body{display:flex;width:100%;height:100%;overflow:auto;padding:66px 14px 44px;box-sizing:border-box;}
  .lb-body img{margin:auto;display:block;max-width:100%;max-height:100%;width:auto;height:auto;border-radius:8px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.5);cursor:zoom-in;}
  .lightbox.zoomed .lb-body img{max-width:none;max-height:none;cursor:zoom-out;}
  .lb-close{position:fixed;top:14px;right:14px;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid rgba(230,238,241,.3);background:rgba(8,22,32,.88);color:#E6EEF1;font:600 .95rem var(--body);cursor:pointer;}
  .lb-close:hover{border-color:var(--accent);}
  .lb-hint{position:fixed;left:0;right:0;bottom:12px;margin:0;text-align:center;font-size:.85rem;color:#9DB0B9;pointer-events:none;}
  html:has(dialog[open]){overflow:hidden;}
  .form-sent{margin-top:16px;padding:14px 16px;border:1px solid var(--line-strong);border-left:3px solid var(--accent-text);border-radius:10px;background:var(--card);}
  .form-sent p{margin:0 0 12px;color:var(--muted);}
  .copy-ok{margin-left:12px;font-weight:600;color:var(--accent-text);}
  /* ============ KURSDAUER, NACHWEISE, MIETE, GALERIE-ANSICHT ============ */
  .sum-days{font-size:.85rem;color:var(--dim);white-space:nowrap;margin-top:-6px;}
  @media (max-width:699px){.sum-days{margin-top:0;}}
  .quals li > .verify{display:table;margin-top:5px;font-size:.88rem;}
  .quals .verify-line{display:block;margin-top:5px;font-size:.88rem;color:var(--muted);}
  .buy-row{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
  .buy strong{color:var(--text);}
  .ig-more{margin:18px 0 0;font-size:.95rem;}
  .ig-more a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--accent-text);font-weight:600;}
  @media (max-width:699px){.buoy{display:none !important;}}
  .lb-nav{display:none;position:fixed;top:50%;translate:0 -50%;z-index:2;width:46px;height:46px;padding:0 0 4px;border-radius:50%;border:1px solid rgba(230,238,241,.3);background:rgba(8,22,32,.85);color:#E6EEF1;font:400 1.9rem/1 var(--body);cursor:pointer;place-items:center;}
  .lb-nav:hover{border-color:var(--accent);}
  .lb-prev{left:12px;}
  .lb-next{right:12px;}
  .lightbox.gallery .lb-nav{display:grid;}
  .lb-count{display:none;position:fixed;top:24px;left:18px;margin:0;font:600 .9rem var(--body);color:#9DB0B9;}
  .lightbox.gallery .lb-count{display:block;}
  .lightbox.gallery .lb-body img{background:transparent;}
  .lb-hint .hint-gal{display:none;}
  .lightbox.gallery .lb-hint .hint-gal{display:inline;}
  @media (max-width:699px){.lb-nav{width:40px;height:40px;font-size:1.6rem;}.lightbox.gallery .lb-body{padding-left:6px;padding-right:6px;}}
  .facts .price dd .price-incl{display:block;margin-top:4px;font:400 .8rem/1.35 var(--body);color:var(--dim);}
  /* ============ KLEINE DETAILS ============ */
  .skip-link{position:absolute;left:12px;top:-80px;z-index:100;padding:10px 16px;border-radius:999px;background:var(--accent-text);color:var(--on-accent);font-weight:600;text-decoration:none;transition:top .15s ease;}
  .skip-link:focus{top:12px;}
  .crumbs{padding:18px 0 0;font-size:.85rem;color:var(--dim);}
  .crumbs a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--line-strong);}
  .crumbs a:hover{border-color:var(--accent-text);}
  .crumbs + section{padding-top:28px;}
  @media (max-width:699px){.crumbs + section{padding-top:22px;}}
  .unit-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;padding:0;}
  .unit-chips span{font-size:.74rem;font-weight:600;letter-spacing:.03em;padding:3px 9px;border-radius:999px;border:1px solid var(--line-strong);color:var(--muted);}
  abbr[title]{text-decoration:underline dotted;text-decoration-thickness:1px;text-underline-offset:3px;cursor:help;}
  @media print{
    .nav,.skip-link,.buoy,.sea-fx,.depth-gauge,.hero-fx,.hero-photo,.scroll-cue,.lightbox,.list-tools,.detail-cta,.ig-grid,.ig-more,.ig-btn,.cta-band .btn,.crumbs,.stats{display:none !important;}
    :root,:root[data-theme]{--text:#000;--muted:#222;--dim:#444;--line:#ccc;--line-strong:#999;--card:#fff;--panel:#fff;--surface:#fff;--mid:#fff;--deep:#fff;--abyss:#fff;color-scheme:light;}
    body{background:#fff !important;color:#000;}
    .page-head.has-photo::before{display:none !important;}
    .course,.unit,.infobox{break-inside:avoid;box-shadow:none !important;}
    :root.fx-ready .reveal{opacity:1 !important;transform:none !important;}
    a{color:#000;text-decoration:none;}
    section{padding:18px 0 !important;}
  }
  /* ============ REBREATHER-VERGLEICH ============ */
  .compare-head{margin:44px 0 16px;}
  .compare-head h2{font-size:clamp(1.7rem,3.4vw,2.2rem);margin:0 0 6px;}
  .compare-head p{margin:0;color:var(--muted);max-width:60ch;}
  .compare-wrap{overflow-x:auto;border:1px solid var(--line-strong);border-radius:12px;background:var(--card);-webkit-overflow-scrolling:touch;}
  .compare-wrap:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px;}
  .compare{width:100%;min-width:680px;border-collapse:collapse;font-size:.92rem;line-height:1.45;}
  .compare th,.compare td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;}
  .compare tbody tr:last-child th,.compare tbody tr:last-child td{border-bottom:0;}
  .compare thead th{font:700 1.15rem/1.2 var(--display);color:var(--text);border-bottom:2px solid var(--accent-text);background:var(--mid);}
  .compare tbody th{font-weight:600;color:var(--dim);width:20%;}
  .compare tbody td{color:var(--text);width:26.66%;}
  .compare tbody tr:hover td,.compare tbody tr:hover th{background:var(--card-hover);}
  .compare th:first-child{position:sticky;left:0;z-index:1;background:var(--mid);}
  .compare-swipe{display:none;margin:8px 0 0;font-size:.8rem;color:var(--dim);text-align:center;}
  @media (max-width:760px){.compare-swipe{display:block;}}
  .compare-note{margin:12px 0 0;font-size:.85rem;color:var(--dim);max-width:80ch;}
  @media print{.compare{min-width:0;font-size:.8rem;}.compare-wrap{overflow:visible;}.compare-swipe{display:none !important;}}

  /* ============ SPRACHWAHL ALS LINK (eigene Seite pro Sprache) ============ */
  .lang a{display:inline-flex;align-items:center;color:var(--muted);font:600 .82rem var(--body);padding:6px 11px;text-decoration:none;}
  .lang a[aria-current="true"]{background:var(--accent-text);color:var(--on-accent);}
  @media (max-width:699px){.lang a{padding:9px 11px;}}