/* WebWerkstatt neu (Vorschau 2026-10-30): Ergänzungen zu Saras Landing (ww-page.css).
   Palette digihub: #31beb0 #FF8577 #e3e1db #55575a #313131. Akzent nur Logo-Apricot #FF8577
   (Entscheid Sara 30.10.: auch auf hellem Grund, kein dunkles Apricot). Punkte Teal #31BEB0. */
.ww-page{--ww-apricot:#FF8577;--ww-apricot-soft:#FF8577}
html[data-theme="dark"] .ww-page{--ww-apricot:#FF8577}
/* Akzente: Text-Highlight und Nummern */
.ww-page .ww-hl{color:var(--ww-apricot)}
.ww-page .ww-pain .ww-n,html[data-theme="dark"] .ww-page .ww-pain .ww-n{color:var(--ww-apricot)}
/* Zwei Wege: Vergleich mit Preisen (Zeilen per subgrid ausgerichtet) */
@media (min-width:768px){
  .ww-way-grid.ww-cmp-grid{grid-template-rows:repeat(6,auto);row-gap:0}
  .ww-cmp-grid>.ww-way{grid-row:span 6;display:grid;grid-template-rows:subgrid;gap:12px}
}
.ww-cmp-box{background:rgba(255,255,255,.55);border-radius:14px;padding:16px 18px;color:#313131}
.ww-cmp-box h4{margin:0 0 8px;font-size:.95rem;font-weight:700;letter-spacing:-.01em;color:#313131}
.ww-cmp-box ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ww-cmp-box li{position:relative;padding-left:24px;line-height:1.45}
.ww-cmp-box li::before{content:"";position:absolute;left:2px;top:.42em;width:12px;height:7px;border-left:2px solid #313131;border-bottom:2px solid #313131;transform:rotate(-45deg)}
.ww-cmp-big{margin:0 0 6px!important;font-size:clamp(1.3rem,2.1vw,1.6rem);font-weight:700;letter-spacing:-.03em;line-height:1.15}
.ww-cmp-box p{margin:0;line-height:1.55}
.ww-cmp-price{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding-top:6px}
.ww-cmp-price .ww-price{flex-basis:100%;margin:0;font-size:clamp(2.4rem,4.4vw,3.3rem)}
.ww-cmp-price .ww-price small{display:block;font-size:.8rem;font-weight:600;letter-spacing:0;margin-bottom:2px}
.ww-page .ww-way .ww-cmp-price .btn{margin-top:0}
.ww-cmp-link{color:#313131;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.ww-cmp-link:hover{text-decoration-color:#fff}
/* Fragebogen-Links in den Ablauf-Schritten */
.ww-fb-link{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-weight:600;color:var(--ww-accent);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.ww-astep .ww-fb-link{color:#313131}
/* Gut zu wissen (FAQ) */
.ww-faq-list{max-width:860px;margin-top:8px;border-top:1px solid var(--line)}
.ww-fq{border-bottom:1px solid var(--line)}
.ww-fq summary{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 4px;cursor:pointer;list-style:none;font-size:clamp(1.05rem,1.6vw,1.2rem);font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.ww-fq summary::-webkit-details-marker{display:none}
.ww-fq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;background:linear-gradient(var(--ww-apricot),var(--ww-apricot)) center/12px 2px no-repeat,linear-gradient(var(--ww-apricot),var(--ww-apricot)) center/2px 12px no-repeat;border:1.5px solid var(--ww-apricot);transition:transform .25s}
.ww-fq[open] summary::after{transform:rotate(45deg)}
.ww-fq summary:focus-visible{outline:2px solid var(--focus,#31beb0);outline-offset:2px}
.ww-fq p{margin:0;padding:0 4px 20px;color:var(--muted);line-height:1.65;max-width:68ch}
.ww-fq a,.ww-faq-more a{color:var(--ww-accent);font-weight:600}
.ww-faq-more{margin:22px 0 0;color:var(--muted)}
/* schlanker Sticky-Button mobil */
.ww-sticky{display:none}
@media (max-width:767px){
  .ww-sticky,a.ww-sticky:link,a.ww-sticky:visited{position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:999px;background:#313131;color:#fff;font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 10px 26px rgba(49,49,49,.28);transform:translateY(140%);transition:transform .3s cubic-bezier(.16,1,.3,1)}
  a.ww-sticky.is-on{transform:none}
  body:has(a.ww-sticky.is-on) .dh-quest-fab{bottom:72px}
  html[data-theme="dark"] a.ww-sticky,html[data-theme="dark"] a.ww-sticky:link,html[data-theme="dark"] a.ww-sticky:visited{background:#FF8577;color:#313131;box-shadow:0 0 0 2px #313131,0 10px 26px rgba(0,0,0,.45)}
  .ww-sticky i{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--ww-apricot-soft,#FF8577);color:#313131;font-style:normal;font-size:12px}
  body.dh-shell{padding-bottom:64px}
}
@media (prefers-reduced-motion:reduce){.ww-sticky{transition:none}.ww-fq summary::after{transition:none}}
/* Header-Lockup wie im Fragebogen: digihub-Logo | W + «WebWerkstatt.» (Entscheid Sara 30.10.) */
html body.dh-shell .site-head .ww-lockup{display:flex;align-items:center;gap:16px;min-width:0;margin-right:auto}
html body.dh-shell .site-head .ww-lockup .brand{margin-right:0}
html body.dh-shell .site-head .ww-head-ww{display:inline-flex;align-items:center;gap:9px;padding-left:16px;border-left:1px solid var(--hd-line);min-height:32px;color:var(--hd-ink);text-decoration:none;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:19px;letter-spacing:-.03em;line-height:1;white-space:nowrap}
html[data-theme="dark"] body.dh-shell .site-head .ww-head-ww{border-left-color:rgba(255,255,255,.28)}
html body.dh-shell .site-head .ww-head-ww .ww-mark{height:20px;width:auto;display:block;flex:none}
html body.dh-shell .site-head .ww-head-ww .ww-head-name .lime-dot{color:#31beb0!important}
html body.dh-shell .site-head .ww-head-ww:hover .ww-head-name{color:#259C90}
html[data-theme="dark"] body.dh-shell .site-head .ww-head-ww:hover .ww-head-name{color:#31BEB0}
@media(max-width:1023px){html body.dh-shell .site-head .brand>a{width:132px}html body.dh-shell .site-head .ww-head-ww{font-size:17px}}
@media(max-width:560px){
  html body.dh-shell .site-head .head-row{padding:0 14px;gap:6px}
  html body.dh-shell .site-head .ww-lockup{gap:10px}
  html body.dh-shell .site-head .brand>a{width:96px}
  html body.dh-shell .site-head .ww-head-ww{padding-left:10px;gap:6px;font-size:15px}
  html body.dh-shell .site-head .ww-head-ww .ww-mark{height:15px}
  html body.dh-shell .site-head .menu-btn{padding:0 10px;margin-left:0}
}
@media(max-width:400px){
  html body.dh-shell .site-head .menu-btn{font-size:0;gap:0;width:44px;justify-content:center}
  html body.dh-shell .site-head .menu-btn::after{font-size:17px}
}
@media(max-width:380px){
  html body.dh-shell .site-head .head-row{padding:0 12px;gap:4px}
  html body.dh-shell .site-head .ww-lockup{gap:8px}
  html body.dh-shell .site-head .brand>a{width:84px}
  html body.dh-shell .site-head .ww-head-ww{padding-left:8px;gap:5px;font-size:14px}
  html body.dh-shell .site-head .ww-head-ww .ww-mark{height:14px}
  html body.dh-shell .site-head .theme-toggle{width:38px;height:38px;min-width:38px}
}
/* Mitgliederbereich-Link von digihub (dh-theme.js) gehört nicht auf diese Landingpage */
.dh-foot-legal li:has([data-mb-footer]){display:none}
/* Footer ohne Navigationsspalte: zwei Spalten */
@media(min-width:800px){html body [data-dh-footer="site"] .dh-foot-main{grid-template-columns:1.2fr 1fr}}
/* Kopf: nur noch WebWerkstatt-Logo von Ania, kein digihub-Logo und keine Trennlinie (Sara 30.10.) */
html body.dh-shell .site-head .ww-head-ww,html[data-theme="dark"] body.dh-shell .site-head .ww-head-ww{padding-left:0!important;border-left:0!important}