/* teachers-Seiten: gemeinsames Aussehen aller sechs Sprachen (seit 31.10.2026). Ändern: nur hier. */
  :root{
    --bg:#F7FFF7; --bg-deep:#D5E2EC; --ink:#15171A; --ink-soft:#4A5159; --paper:#FFFFFF;
    --yellow:#FFE66D; --teal:#4ECDC4; --jet:#292F36; --coral:#FF6B6B;
    --gold:#FFE66D; --cyan:#4ECDC4; --radius:22px;
  }
  *,*::before,*::after{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    margin:0; background:var(--bg); color:var(--ink);
    font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    font-size:18px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  }
  img{ max-width:100%; display:block; }
  a{ color:inherit; }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }
  .skip{ position:absolute; left:-999px; top:8px; background:var(--ink); color:#fff; padding:10px 16px; border-radius:999px; z-index:100; }
  .skip:focus{ left:12px; }
  :focus-visible{ outline:3px solid var(--ink); outline-offset:3px; }
  .dot{ width:34px; height:34px; flex:none; background:url("favicon-192.png") center/contain no-repeat; }

  /* Bausteine */
  .chip{ display:inline-flex; align-items:center; gap:8px; font-family:"Fraunces",serif; font-weight:800; font-size:15px;
    padding:6px 14px; border:2px solid var(--ink); border-radius:999px; background:var(--yellow); box-shadow:2px 3px 0 var(--ink); }
  .chip.white{ background:var(--paper); }
  .num{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:50%;
    border:2px solid var(--ink); font-family:"Fraunces",serif; font-weight:800; font-size:18px; background:var(--yellow); flex:none; }
  h1,h2,h3,h4{ font-family:"Fraunces",serif; margin:0; }
  h1{ font-weight:900; font-size:clamp(40px,6.4vw,76px); line-height:.98; letter-spacing:-.025em; }
  h2{ font-weight:900; font-size:clamp(30px,4vw,48px); line-height:1.04; letter-spacing:-.02em; margin-top:14px; }
  h3{ font-weight:800; font-size:clamp(22px,2.6vw,30px); line-height:1.12; letter-spacing:-.01em; }
  h4{ font-weight:800; font-size:20px; line-height:1.2; }
  .lede{ font-size:clamp(18px,2vw,21px); max-width:46ch; margin:20px 0 0; }
  .sec-lede{ max-width:56ch; margin:16px 0 0; color:var(--ink-soft); }
  .btn{ display:inline-flex; align-items:center; gap:10px; background:var(--yellow); color:var(--ink); border:2px solid var(--ink);
    padding:14px 26px; border-radius:999px; font-weight:700; font-size:16px; text-decoration:none; box-shadow:5px 5px 0 var(--ink);
    transition:transform .15s ease, box-shadow .15s ease; cursor:pointer; font-family:inherit; }
  .btn:hover{ transform:translate(-3px,-3px); box-shadow:8px 8px 0 var(--ink); }
  .btn.teal{ background:var(--teal); } .btn.white{ background:var(--paper); }
  .card{ background:var(--paper); border:2px solid var(--ink); border-radius:var(--radius); box-shadow:5px 5px 0 var(--ink); padding:24px 26px; }
  section{ padding:96px 0; }

  /* Hero */
  .hero{ background:var(--teal); padding:72px 0 88px; position:relative; overflow:hidden; }
  .hero::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(20,23,26,.12) 1.5px,transparent 1.6px); background-size:26px 26px; pointer-events:none; }
  .hero .wrap{ position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; }
  .hero-actions{ display:flex; flex-wrap:wrap; gap:16px 22px; align-items:center; margin-top:34px; }
  .hero-actions .soft{ font-size:15px; font-weight:600; color:var(--ink); }
  .clock{ background:var(--paper); border:2px solid var(--ink); border-radius:28px; box-shadow:8px 8px 0 var(--ink); padding:26px 28px 28px; transform:rotate(1.4deg); position:relative; }
  .clock-top{ display:flex; align-items:center; gap:14px; }
  .clock-top img{ width:64px; height:64px; }
  .clock-big{ font-family:"Fraunces",serif; font-weight:900; font-size:64px; line-height:.9; letter-spacing:-.03em; }
  .clock-big small{ font-size:22px; font-weight:800; margin-left:6px; }
  .clock ul{ list-style:none; margin:20px 0 0; padding:0; display:grid; gap:9px; font-size:16px; font-weight:600; }
  .clock li{ display:flex; gap:12px; align-items:center; }
  .clock li b{ display:inline-flex; min-width:44px; justify-content:center; padding:2px 8px; border:2px solid var(--ink); border-radius:999px; font-family:"Fraunces",serif; font-size:14px; }

  /* Ablauf einer Stunde */
  .arc{ display:grid; grid-template-columns:5fr 10fr 15fr 10fr 5fr; gap:6px; margin-top:44px; }
  .arc-seg{ border:2px solid var(--ink); border-radius:16px; padding:14px 16px 16px; min-height:150px; display:flex; flex-direction:column; gap:6px; box-shadow:4px 4px 0 var(--ink); }
  .arc-seg .mins{ font-family:"Fraunces",serif; font-weight:900; font-size:30px; line-height:1; }
  .arc-seg .mins small{ font-size:14px; font-weight:800; margin-left:3px; }
  .arc-seg h4{ font-size:17px; }
  .arc-seg p{ margin:0; font-size:14.5px; line-height:1.4; }
  .s1{ background:var(--teal); } .s2{ background:var(--yellow); } .s3{ background:var(--coral); } .s4{ background:var(--paper); } .s5{ background:var(--jet); }
  .arc-seg.s5{ color:#fff; }
  .arc-note{ margin-top:22px; font-size:15px; color:var(--ink-soft); max-width:62ch; }

  /* Kapitelraster */
  .chapters{ background:var(--bg-deep); }
  .ch-grid{ list-style:none; margin:44px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:20px; }
  .ch{ display:flex; flex-direction:column; gap:12px; background:var(--paper); border:2px solid var(--ink); border-radius:var(--radius); padding:20px 22px 22px; text-decoration:none; color:inherit; min-height:178px; }
  .ch h3{ font-size:20px; line-height:1.15; }
  .ch .top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .ch .status{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:none; padding:3px 10px; border-radius:999px; border:1.5px solid var(--ink); background:var(--bg); white-space:nowrap; }
  .ch-grid > li{ display:flex; } .ch-grid > li > .ch{ flex:1; }
  a.ch{ box-shadow:5px 5px 0 var(--ink); transition:transform .15s ease, box-shadow .15s ease; }
  a.ch:hover{ transform:translate(-3px,-3px); box-shadow:8px 8px 0 var(--ink); }
  a.ch .status{ background:var(--teal); }
  .ch.soon{ background:rgba(255,255,255,.55); border-style:dashed; color:var(--ink-soft); }
  .ch.soon .num{ background:var(--paper); }
  .ch .go{ margin-top:auto; font-weight:700; font-size:15px; }

  /* Stundenplan */
  .lesson{ background:var(--gold); }
  .lesson-head{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
  .lesson-grid{ display:grid; grid-template-columns:320px 1fr; gap:36px; margin-top:44px; align-items:start; }
  .meta{ position:sticky; top:104px; display:grid; gap:18px; }
  .meta dl{ margin:0; display:grid; gap:14px; }
  .meta dt{ font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); }
  .meta dd{ margin:2px 0 0; font-weight:600; font-size:16.5px; line-height:1.4; }
  .meta .btn{ justify-content:center; font-size:15px; padding:12px 20px; }
  .steps{ list-style:none; margin:0; padding:0; display:grid; gap:20px; counter-reset:step; }
  .step{ background:var(--paper); border:2px solid var(--ink); border-radius:var(--radius); box-shadow:5px 5px 0 var(--ink); padding:24px 26px; display:grid; grid-template-columns:64px 1fr; column-gap:22px; row-gap:0; align-content:start; }
  .step .t{ grid-row:1 / span 5; display:flex; flex-direction:column; align-items:center; gap:6px; }
  .step .t b{ font-family:"Fraunces",serif; font-weight:900; font-size:34px; line-height:1; }
  .step .t span{ font-size:12px; font-weight:700; letter-spacing:.08em; }
  .step .bar{ width:10px; flex:1; min-height:20px; border:2px solid var(--ink); border-radius:999px; }
  .step.s1 .bar{ background:var(--teal); } .step.s2 .bar{ background:var(--yellow); } .step.s3 .bar{ background:var(--coral); } .step.s4 .bar{ background:var(--paper); } .step.s5 .bar{ background:var(--jet); }
  .step h3{ font-size:24px; }
  .step p{ margin:6px 0 0; font-size:17px; }
  .who{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
  .who div{ background:var(--bg); border-radius:14px; padding:12px 16px; font-size:16px; }
  .who strong{ display:block; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:3px; }
  .link-guide{ display:inline-flex; margin-top:6px; font-weight:700; font-size:15px; }
  .extras{ display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:20px; margin-top:28px; }
  .extras h4{ margin-bottom:10px; }
  .extras ul{ margin:0; padding-left:1.1em; display:grid; gap:7px; font-size:16.5px; }
  details.answers{ margin-top:28px; background:var(--jet); color:#fff; border:2px solid var(--ink); border-radius:var(--radius); box-shadow:5px 5px 0 var(--ink); }
  details.answers summary{ cursor:pointer; padding:20px 26px; font-family:"Fraunces",serif; font-weight:800; font-size:21px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px; }
  details.answers summary::-webkit-details-marker{ display:none; }
  details.answers summary::after{ content:"+"; font-size:30px; line-height:1; color:var(--yellow); }
  details.answers[open] summary::after{ content:"\2212"; }
  details.answers .inner{ padding:0 26px 24px; font-size:16.5px; }
  details.answers :focus-visible{ outline-color:var(--yellow); }
  .draft-note{ display:flex; gap:12px; align-items:flex-start; background:var(--paper); border:2px dashed var(--ink); border-radius:16px; padding:14px 18px; margin-top:28px; font-size:15.5px; }

  /* Werkzeuge */
  .tools-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; margin-top:44px; }
  .tool{ display:flex; flex-direction:column; gap:12px; }
  .tool .ico{ font-size:34px; line-height:1; }
  .tool p{ margin:0; font-size:16.5px; }
  .tool .chip{ align-self:flex-start; font-size:13px; padding:3px 12px; }

  /* Gut zu wissen */
  .know{ background:var(--jet); color:#fff; }
  .know h2{ color:#fff; }
  .know-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; margin-top:44px; list-style:none; padding:0; }
  .know-grid li{ background:rgba(255,255,255,.07); border:2px solid rgba(255,255,255,.25); border-radius:var(--radius); padding:22px 24px; }
  .know-grid h4{ color:var(--yellow); margin-bottom:8px; }
  .know-grid p{ margin:0; font-size:16.5px; color:rgba(255,255,255,.88); }

  /* Kontakt */
  .ask{ background:var(--teal); text-align:center; }
  .ask h2{ max-width:20ch; margin:14px auto 0; }
  .ask p{ max-width:52ch; margin:18px auto 30px; }

  footer.site{ padding:60px 0 40px; color:var(--ink-soft); font-size:14px; }
  footer.site .row{ border-top:1px solid rgba(20,23,26,.1); padding-top:24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
  footer.site a{ color:var(--ink); text-decoration:none; margin-left:18px; }

  /* Schmal */
  @media (max-width:980px){
    section{ padding:72px 0; }
    .hero .wrap{ grid-template-columns:1fr; gap:44px; }
    .clock{ max-width:420px; transform:rotate(1deg); }
    .arc{ grid-template-columns:1fr; }
    .arc-seg{ min-height:0; flex-direction:row; align-items:baseline; flex-wrap:wrap; gap:4px 14px; }
    .arc-seg p{ flex-basis:100%; }
    .lesson-grid{ grid-template-columns:1fr; }
    .meta{ position:static; }
  }
  @media (max-width:640px){
    .wrap{ padding:0 18px; }
    section{ padding:56px 0; }
    .hero{ padding:44px 0 60px; }
    .who{ grid-template-columns:1fr; }
    .step{ grid-template-columns:1fr; padding:20px; }
    .step .t{ grid-row:auto; flex-direction:row; align-items:center; }
    .step .bar{ width:auto; height:10px; flex:1; min-height:0; }
    .step h3{ font-size:22px; }
    .ch-grid{ grid-template-columns:1fr; }
    .ch{ min-height:0; }
    footer.site a{ margin:0 14px 0 0; }
  }
  @media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } .btn,a.ch{ transition:none; } }

  /* Drucken: nur die Stunde */
  @media print{
     footer.site, .hero, .arc-wrap, .chapters, .tools, .know, .ask, .meta .btn, .draft-note{ display:none !important; }
    section{ padding:0; } .lesson{ background:#fff; }
    body{ font-size:12pt; background:#fff; }
    .card,.step,details.answers{ box-shadow:none; break-inside:avoid; }
    .lesson-grid{ grid-template-columns:1fr; } .meta{ position:static; }
    details.answers:not([open]) .inner{ display:block; }
    details.answers{ background:#fff; color:#000; } details.answers summary::after{ display:none; }
  }

  /* Nach dem Gremium (28.10.2026) */
  .banner{ background:var(--ink); color:#fff; text-align:center; font-size:14.5px; padding:9px 18px; line-height:1.45; }
  .banner a{ color:var(--yellow); }
  .hero .langs{ margin-top:18px; font-size:15px; font-weight:600; }
  details.answers.light{ background:var(--paper); color:var(--ink); }
  details.answers.light summary::after{ color:var(--ink); }
  details.answers.light :focus-visible{ outline-color:var(--ink); }
  details.answers .inner h4{ color:var(--yellow); margin:16px 0 6px; font-size:18px; }
  details.answers.light .inner h4{ color:var(--ink); }
  details.answers .inner ul{ margin:6px 0 6px 1.1em; padding:0; display:grid; gap:6px; }
  details.answers .inner table{ border-collapse:collapse; width:100%; margin:8px 0; font-size:15.5px; }
  details.answers .inner th, details.answers .inner td{ border:1.5px solid currentColor; padding:6px 10px; text-align:left; }
  .stack{ display:grid; gap:20px; margin-top:28px; }
  .kitcard{ display:flex; gap:20px; align-items:center; flex-wrap:wrap; background:var(--paper); border:2px solid var(--ink); border-radius:var(--radius); box-shadow:5px 5px 0 var(--ink); padding:22px 26px; }
  .kitcard .kit-ico{ font-size:38px; line-height:1; }
  .kitcard h4{ margin:0 0 4px; }
  .kitcard p{ margin:0; font-size:16.5px; }
  .kitcard > div{ flex:1 1 260px; }
  .kitcard .btn{ margin-left:auto; font-size:15px; padding:12px 22px; }
  .step ul{ margin:8px 0 0 1.1em; padding:0; display:grid; gap:4px; font-size:16.5px; }
  .know-grid{ grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); }
  .know-grid a{ color:var(--yellow); }
  @media (max-width:640px){ .kitcard .btn{ margin-left:0; } }
  @media print{ .banner, .know, .kitcard{ display:none !important; } }

  /* Struktur B: zwei Stunden */
  .arc.a1{ grid-template-columns:6fr 5fr 22fr 6fr 6fr; }
  .arc.a2{ grid-template-columns:6fr 6fr 22fr 6fr 5fr; }
  .arc-label{ margin:40px 0 -26px; font-family:"Fraunces",serif; font-weight:800; font-size:20px; }
  .arc-label:first-of-type{ margin-top:36px; }
  .pkg{ list-style:none; margin:44px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; }
  .pkg > li{ display:flex; } .pkg > li > .ch{ flex:1; }
  .pkg .ch p{ margin:0; font-size:16.5px; }
  .gap-note{ margin-top:26px; display:flex; gap:14px; align-items:flex-start; background:var(--paper); border:2px dashed var(--ink); border-radius:16px; padding:16px 20px; font-size:16.5px; max-width:70ch; }
  .lesson + .lesson{ border-top:2px solid var(--ink); }
  .checks{ list-style:none; margin:10px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
  .checks li{ border:2px solid var(--ink); border-radius:14px; padding:10px 12px; font-weight:600; font-size:15.5px; background:var(--paper); }
  .checks li span{ display:block; font-size:24px; line-height:1.1; }
  @media (max-width:980px){ .arc.a1, .arc.a2{ grid-template-columns:1fr; } .arc-label{ margin:34px 0 -22px; } }
  @media print{ .lesson{ break-before:page; } .pkg, .gap-note{ display:none !important; } }
  /* Nur die gewählte Stunde drucken (Gremium 31.10.2026) */
  @media print{ header.site{ display:none !important; } body[data-print="lesson-1"] #lesson-2, body[data-print="lesson-2"] #lesson-1{ display:none !important; } body[data-print] .lesson{ break-before:auto; } }
  /* Paketkarten mit direkten Links (Gremium 31.10.2026) */
  .pkg > li{ flex-direction:column; gap:10px; }
  .pkg-links{ display:flex; flex-wrap:wrap; gap:10px; margin:0; }
  .pkg-links a{ display:inline-flex; align-items:center; min-height:44px; padding:6px 16px; border:2px solid var(--ink); border-radius:999px; background:var(--paper); color:var(--ink); font-weight:700; font-size:16px; text-decoration:none; }
  .pkg-links a:hover{ background:var(--yellow); }
  .know-grid h3{ font-size:20px; line-height:1.2; color:var(--yellow); margin-bottom:8px; }
  /* /header-aligned */

  /* Handy-Durchgang (30.10.2026): Antworttabellen passen aufs Handy */
  .lesson-grid > *{ min-width: 0; }
  @media (max-width: 600px){
    details.answers .inner{ padding: 0 18px 20px; }
    details.answers .inner table{ display: block; overflow-x: auto; font-size: 14.5px; }
    details.answers .inner th, details.answers .inner td{ padding: 6px 7px; }
  }