:root {
  --body-bg:#111214;--bg:#1A1B1E;--surface:#2B2D31;--surface-high:#35373C;
  --primary:#A8C7FA;--primary-container:#004A77;--on-surface:#E3E2E6;
  --on-surface-variant:#C4C6CF;--outline:#8E9099;--error:#FFB4AB;
  --error-container:#93000A;--success:#81C995;--warning:#FDD663;
  --copy:#A8C7FA;--on-primary:#003258;
  --hdr:56px;--radius:12px;
  --tr:0.3s cubic-bezier(.4,0,.2,1);
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bot:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;overflow-x:hidden}
body{font-family:'DM Sans',system-ui,-apple-system,sans-serif;background:var(--body-bg);color:var(--on-surface);line-height:1.6;min-height:100vh;min-height:100dvh;overflow-x:hidden;transition:background var(--tr),color var(--tr)}
a{color:var(--primary);text-decoration:none}
::selection{background:var(--primary);color:var(--on-primary)}

/* HEADER */
.hdr{height:var(--hdr);background:var(--bg);border-bottom:1px solid color-mix(in srgb,var(--outline) 40%,transparent);display:flex;align-items:center;padding-left:max(12px,env(safe-area-inset-left,12px));padding-right:max(12px,env(safe-area-inset-right,12px));gap:8px;transition:background var(--tr),border-color var(--tr)}
.hdr-menu{width:40px;height:40px;border:none;background:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;flex-shrink:0;padding:0}
.hdr-menu span{display:block;width:22px;height:2px;background:var(--on-surface);border-radius:1px;transition:transform .25s,opacity .25s}
.hdr-menu.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hdr-menu.open span:nth-child(2){opacity:0}
.hdr-menu.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.hdr-logo{font-weight:700;font-size:15px;color:var(--primary);white-space:nowrap;flex-shrink:0;cursor:pointer;display:flex;align-items:center;gap:6px}
.hdr-logo-box{width:28px;height:28px;border-radius:6px;background:var(--primary);color:var(--on-primary);display:grid;place-items:center;font-size:12px;font-weight:700}
.hdr-spacer{flex:1}
.hdr-btn{padding:5px 10px;border-radius:6px;font-size:12px;font-weight:600;border:1px solid var(--outline);background:transparent;color:var(--on-surface-variant);cursor:pointer;white-space:nowrap;transition:all var(--tr)}
.hdr-btn:hover{background:var(--surface-high);color:var(--on-surface)}
.hdr-btn.accent{border-color:var(--primary);color:var(--primary)}
#langBtn{display:inline-flex;align-items:center;gap:6px;line-height:1}
.lang-btn-flag{font-size:14px;line-height:1}
.lang-btn-code{line-height:1}

/* DESKTOP NAV */
.desktop-nav{display:none;gap:1px;flex:1;min-width:0;overflow:visible}
.desktop-nav .nav-link{padding:5px 7px;border-radius:6px;font-size:11.5px;font-weight:500;color:var(--on-surface-variant);white-space:nowrap;cursor:pointer;transition:background var(--tr),color var(--tr)}
.desktop-nav .nav-link:hover{background:var(--surface-high);color:var(--on-surface)}
.desktop-nav .nav-link.active{background:var(--surface);color:var(--primary)}

/* DRAWER */
.drawer-overlay{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,0.5);opacity:0;pointer-events:none;transition:opacity .3s}
.drawer-overlay.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;bottom:0;left:0;z-index:91;width:auto;min-width:200px;max-width:85vw;background:var(--bg);padding-top:calc(var(--hdr) + 12px);padding-bottom:calc(16px+var(--safe-bot));transform:translateX(-100%);transition:transform .3s;overflow-y:auto;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer .nav-link{display:block;padding:14px 28px;font-size:15px;font-weight:500;color:var(--on-surface-variant);cursor:pointer;transition:all .15s;white-space:nowrap}
.drawer .nav-link:hover,.drawer .nav-link.active{background:var(--surface);color:var(--primary)}
.drawer-sep{height:1px;background:var(--outline);opacity:0.3;margin:8px 28px}

/* PAGES */
.page{display:none;padding:16px 0 24px;min-height:80vh;animation:pageIn .35s ease-out}
.page.active{display:block}
@keyframes pageIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.container{max-width:1080px;margin:0 auto;padding:0 max(16px,env(safe-area-inset-left,16px))}

/* HOME */
.home-hero{text-align:center;padding:clamp(32px,8vw,72px) 0 clamp(24px,4vw,48px);position:relative}
.home-hero::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(600px,90vw);height:min(400px,60vw);background:radial-gradient(ellipse,var(--primary-container),transparent);opacity:0.25;pointer-events:none;filter:blur(40px)}
.home-hero h1{font-size:clamp(26px,5.5vw,48px);font-weight:700;letter-spacing:-0.03em;line-height:1.15;position:relative}
.home-hero h1 em{font-style:normal;color:var(--primary)}
.home-hero p{font-size:clamp(14px,2vw,17px);color:var(--on-surface-variant);max-width:620px;margin:14px auto 0;position:relative;line-height:1.65}
.home-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));margin-top:clamp(24px,4vw,40px)}
.home-card{background:var(--surface);border-radius:var(--radius);padding:20px;cursor:pointer;border:1px solid transparent;transition:all var(--tr);display:flex;align-items:flex-start;gap:14px}
.home-card:hover{border-color:var(--primary);transform:translateY(-2px)}
.home-card:active{transform:scale(0.98)}
.home-card-icon{width:40px;height:40px;border-radius:10px;flex-shrink:0;background:var(--primary-container);color:var(--primary);display:grid;place-items:center;font-size:18px}
.home-card-text h3{font-size:15px;font-weight:700;color:var(--on-surface);margin-bottom:4px}
.home-card-text p{font-size:13px;color:var(--on-surface-variant);line-height:1.5}

/* CONTENT */
.sec-title{font-size:clamp(22px,4vw,32px);font-weight:700;letter-spacing:-0.02em;margin-bottom:20px;padding-left:14px;border-left:4px solid var(--primary)}
.cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.card{background:var(--surface);border-radius:var(--radius);padding:20px;border:1px solid transparent;transition:all var(--tr)}
.card:hover{border-color:color-mix(in srgb,var(--primary) 50%,transparent)}
.card h3{font-size:15px;font-weight:700;color:var(--primary);margin-bottom:8px}
.card p,.card ul{font-size:14px;color:var(--on-surface-variant);line-height:1.65}
.card ul{padding-left:20px;margin-top:6px}
.card ul li{margin-bottom:3px}
.card-badge{display:inline-block;padding:3px 10px;border-radius:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;background:var(--primary-container);color:var(--primary);margin-bottom:10px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tag{padding:5px 12px;border-radius:18px;font-size:12px;font-weight:500;background:var(--surface-high);color:var(--on-surface-variant);border:1px solid color-mix(in srgb,var(--outline) 50%,transparent);transition:all var(--tr)}
.tag:hover{border-color:var(--primary);color:var(--primary)}
.clients-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.client{background:var(--surface);border-radius:var(--radius);padding:14px;text-align:center;font-size:14px;font-weight:600;color:var(--on-surface);border:1px solid transparent;transition:all var(--tr)}
.client:hover{border-color:var(--primary)}
.client small{display:block;font-size:11px;color:var(--primary);font-weight:500;margin-top:3px;text-transform:uppercase;letter-spacing:0.4px}
.contact-box{background:var(--surface);border-radius:var(--radius);padding:clamp(20px,3vw,32px);display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.contact-photo{width:clamp(120px,20vw,200px);border-radius:var(--radius);flex-shrink:0;overflow:hidden}
.contact-photo img{width:100%;height:auto;display:block;border-radius:var(--radius)}
.contact-info{flex:1;min-width:200px}
.contact-info h3{font-size:18px;margin-bottom:10px}
.contact-row{padding:6px 0;font-size:14px;color:var(--on-surface-variant)}
.contact-row strong{color:var(--on-surface)}
.contact-hint{margin-top:14px;padding:12px;border-radius:8px;background:var(--surface-high);font-size:13px;color:var(--on-surface-variant);line-height:1.6}
.video-box{width:100%;aspect-ratio:16/9;border-radius:var(--radius);background:var(--surface-high);display:grid;place-items:center;font-size:40px;color:var(--outline);margin-top:16px;border:2px dashed color-mix(in srgb,var(--outline) 50%,transparent)}
.back-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--on-surface-variant);margin-bottom:16px;padding:6px 0;cursor:pointer;transition:color .2s}
.back-link:hover{color:var(--primary)}
.pg-footer{margin-top:40px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--outline) 30%,transparent);text-align:center;font-size:12px;color:var(--outline)}
.pg-footer-links{margin-top:8px;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px}
.pg-footer-links span,.pg-footer-links a{color:var(--outline);cursor:pointer;font-size:11px;transition:color var(--tr);text-decoration:none}
.pg-footer-links span:hover,.pg-footer-links a:hover{color:var(--primary)}
/* LEGAL PAGES */
.legal-page h2{font-size:clamp(20px,3.5vw,28px);font-weight:700;color:var(--on-surface);margin-bottom:8px}
.legal-page h3{font-size:16px;font-weight:700;color:var(--on-surface);margin:24px 0 8px}
.legal-page p{font-size:14px;color:var(--on-surface-variant);line-height:1.7;margin-bottom:12px}
.legal-page ul{font-size:14px;color:var(--on-surface-variant);line-height:1.7;margin:0 0 12px 20px}
.legal-page .legal-meta{font-size:12px;color:var(--outline);margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid color-mix(in srgb,var(--outline) 30%,transparent)}
.legal-page .legal-notice{background:var(--surface);border-radius:var(--radius);padding:16px 20px;margin:16px 0;border-left:3px solid var(--warning)}
.legal-page .legal-notice p{color:var(--on-surface);font-size:13px;margin:0}
.legal-placeholder{color:var(--warning);background:color-mix(in srgb,var(--warning) 15%,transparent);padding:2px 6px;border-radius:4px;font-weight:600}
/* SHOP */
.shop-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.shop-chip{padding:6px 14px;border-radius:20px;font-size:13px;font-weight:600;border:1px solid var(--outline);background:transparent;color:var(--on-surface-variant);cursor:pointer;transition:all var(--tr)}
.shop-chip:hover{background:var(--surface-high);color:var(--on-surface)}
.shop-chip.active{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.shop-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.shop-card{background:var(--surface);border-radius:var(--radius);padding:0;border:1px solid transparent;transition:all var(--tr);overflow:hidden;display:flex;flex-direction:column}
.shop-card:hover{border-color:var(--primary);transform:translateY(-2px)}
.shop-card.unavailable{opacity:0.7}
.shop-card.unavailable:hover{transform:none;border-color:transparent}
.shop-card-img{height:160px;background:var(--primary-container);display:flex;align-items:center;justify-content:center;font-size:48px;position:relative;overflow:hidden}
.shop-card-img img{width:100%;height:100%;object-fit:cover}
.shop-badge{position:absolute;top:10px;right:10px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700}
.shop-badge.available{background:color-mix(in srgb,var(--success) 20%,transparent);color:var(--success)}
.shop-badge.soon{background:color-mix(in srgb,var(--warning) 20%,transparent);color:var(--warning)}
.shop-badge.inquiry{background:color-mix(in srgb,var(--primary) 20%,transparent);color:var(--primary)}
.shop-card-body{padding:16px;flex:1;display:flex;flex-direction:column;gap:8px}
.shop-cat-label{font-size:11px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:0.05em}
.shop-card h3{font-size:16px;font-weight:700;color:var(--on-surface);margin:0;line-height:1.3}
.shop-card-desc{font-size:13px;color:var(--on-surface-variant);line-height:1.6;flex:1}
.shop-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--outline) 30%,transparent)}
.shop-price{font-size:20px;font-weight:700;color:var(--on-surface)}
.shop-price small{font-size:12px;font-weight:400;color:var(--on-surface-variant);margin-left:4px}
.shop-btn{padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;border:none;cursor:pointer;transition:all var(--tr);white-space:nowrap}
.shop-btn.primary{background:var(--primary);color:var(--on-primary)}
.shop-btn.primary:hover{opacity:0.9}
.shop-btn.secondary{background:transparent;border:1px solid var(--outline);color:var(--on-surface-variant)}
.shop-btn.secondary:hover{background:var(--surface-high);color:var(--on-surface)}
.shop-btn.disabled{background:var(--surface-high);color:var(--outline);cursor:default}
/* SHOP DETAIL PANEL */
.shop-detail{display:none;background:var(--surface);border-radius:var(--radius);padding:24px;margin-bottom:24px;border:1px solid color-mix(in srgb,var(--primary) 40%,transparent)}
.shop-detail.open{display:block;animation:pageIn .3s ease-out}
.shop-detail-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px;gap:12px}
.shop-detail-head h2{font-size:20px;font-weight:700;color:var(--on-surface);margin:0}
.shop-detail-close{background:none;border:none;font-size:20px;cursor:pointer;color:var(--on-surface-variant);padding:4px;line-height:1;flex-shrink:0}
.shop-detail-close:hover{color:var(--on-surface)}
.shop-detail-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.shop-detail-tag{font-size:12px;padding:3px 10px;border-radius:20px;background:var(--primary-container);color:var(--primary);font-weight:600}
.shop-detail p{font-size:14px;color:var(--on-surface-variant);line-height:1.7;margin-bottom:12px}
.shop-detail ul{font-size:13px;color:var(--on-surface-variant);line-height:1.8;margin:0 0 16px 20px}
.shop-detail-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--outline) 30%,transparent);align-items:center}
.shop-gumroad-note{font-size:12px;color:var(--outline);margin-top:8px}
/* LESEPROBE */
.preview-tabs{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}
.preview-tab{padding:5px 12px;border-radius:6px;font-size:12px;font-weight:600;border:1px solid var(--outline);background:transparent;color:var(--on-surface-variant);cursor:pointer;transition:all var(--tr)}
.preview-tab:hover{background:var(--surface-high);color:var(--on-surface)}
.preview-tab.active{background:var(--surface);border-color:var(--primary);color:var(--primary)}
.preview-frame{position:relative;max-height:320px;overflow:hidden;border-radius:8px;border:1px solid color-mix(in srgb,var(--outline) 30%,transparent);background:var(--surface);padding:16px 20px}
.preview-frame::after{content:'';position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(transparent,var(--surface));pointer-events:none}
.preview-content{font-size:13px;color:var(--on-surface);line-height:1.7}
.preview-content h2{font-size:15px;font-weight:700;color:var(--on-surface);margin:0 0 10px}
.preview-content p{margin:0 0 10px;color:var(--on-surface-variant)}
.preview-content ul,.preview-content ol{margin:0 0 10px 20px;color:var(--on-surface-variant)}
.preview-content li{margin-bottom:4px}
.preview-content pre{background:color-mix(in srgb,var(--primary) 8%,var(--surface-high));border-radius:6px;padding:12px;overflow-x:auto;font-size:12px;font-family:monospace;color:var(--on-surface);margin:0 0 10px}
.preview-content code{font-family:monospace;font-size:12px;background:color-mix(in srgb,var(--primary) 10%,transparent);padding:1px 5px;border-radius:3px}
.preview-content .admonition{border-radius:8px;padding:10px 14px;margin:0 0 10px;border-left:3px solid var(--primary)}
.preview-content .admonition.definition{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 8%,transparent)}
.preview-content .admonition.tip{border-color:var(--success);background:color-mix(in srgb,var(--success) 8%,transparent)}
.preview-content .admonition.note{border-color:var(--warning);background:color-mix(in srgb,var(--warning) 8%,transparent)}
.preview-content .admonition.warning{border-color:var(--error);background:color-mix(in srgb,var(--error) 8%,transparent)}
.preview-content .admonition.important{border-color:var(--warning);background:color-mix(in srgb,var(--warning) 8%,transparent)}
.preview-content .admonition-title{font-weight:700;font-size:12px;margin-bottom:4px;color:var(--on-surface)}
.preview-cta{margin-top:12px;text-align:center;padding:10px;background:color-mix(in srgb,var(--primary) 8%,transparent);border-radius:6px;font-size:12px;color:var(--on-surface-variant)}
.preview-cta strong{color:var(--primary)}
/* BEAUFTRAGUNG */
.contract-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));margin-top:24px}
.contract-card{background:var(--surface);border-radius:var(--radius);padding:24px;border:1px solid transparent;transition:all var(--tr)}
.contract-card.available{border-color:color-mix(in srgb,var(--success) 40%,transparent)}
.contract-card.unavailable{border-color:color-mix(in srgb,var(--error) 30%,transparent);opacity:0.8}
.contract-card-header{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.contract-card-icon{width:44px;height:44px;border-radius:10px;background:var(--primary-container);color:var(--primary);display:grid;place-items:center;font-size:20px;flex-shrink:0}
.contract-card.unavailable .contract-card-icon{background:color-mix(in srgb,var(--error-container) 60%,transparent);color:var(--error)}
.contract-card h3{font-size:16px;font-weight:700;color:var(--on-surface);margin:0}
.contract-badge{display:inline-block;font-size:11px;font-weight:600;padding:2px 8px;border-radius:20px;margin-top:4px}
.contract-badge.ok{background:color-mix(in srgb,var(--success) 20%,transparent);color:var(--success)}
.contract-badge.no{background:color-mix(in srgb,var(--error) 20%,transparent);color:var(--error)}
.contract-card p{font-size:13px;color:var(--on-surface-variant);line-height:1.65;margin-bottom:10px}
.contract-card ul{font-size:13px;color:var(--on-surface-variant);line-height:1.65;margin:0 0 0 18px}
.contract-card ul li{margin-bottom:4px}
/* ABOUT */
.about-header{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start;margin-bottom:24px}
.about-photo{width:clamp(140px,18vw,200px);border-radius:var(--radius);background:var(--surface-high);flex-shrink:0;overflow:hidden}
.about-photo img{width:100%;height:auto;display:block;border-radius:var(--radius)}
.about-info{flex:1;min-width:220px}
.about-info h3{font-size:20px;font-weight:700;margin-bottom:4px}
.about-info .subtitle{font-size:14px;color:var(--primary);margin-bottom:10px}
.about-text{font-size:14px;line-height:1.7;color:var(--on-surface-variant)}
.timeline{margin-top:16px;padding-left:16px;border-left:2px solid var(--primary-container)}
.timeline-item{padding:8px 0 8px 12px;position:relative}
.timeline-item::before{content:'';position:absolute;left:-21px;top:14px;width:10px;height:10px;border-radius:50%;background:var(--primary)}
.timeline-year{font-size:12px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:0.5px}
.timeline-desc{font-size:14px;color:var(--on-surface-variant);margin-top:2px}
/* PRODUCT */
.product-card{background:var(--surface);border-radius:var(--radius);padding:24px;border:1px solid color-mix(in srgb,var(--primary) 30%,transparent)}
.product-card h3{font-size:18px;font-weight:700;color:var(--primary);margin-bottom:6px}
.product-type{display:inline-block;padding:3px 10px;border-radius:6px;font-size:11px;font-weight:700;background:var(--primary-container);color:var(--primary);margin-bottom:10px}
.product-desc{font-size:14px;color:var(--on-surface-variant);line-height:1.7;margin-bottom:12px}
.product-chapters{columns:2;column-gap:16px;font-size:13px;color:var(--on-surface-variant);line-height:1.8}
.product-chapters li{break-inside:avoid}
.product-meta{margin-top:14px;font-size:13px;color:var(--outline)}
/* DIALOGS */
.dlg-overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,0.55);justify-content:center;align-items:center;backdrop-filter:blur(3px)}
.dlg-overlay.active{display:flex}
.dlg{background:var(--surface);border-radius:18px;width:min(92%,420px);max-height:min(80vh,600px);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,0.4);transition:background var(--tr)}
.dlg-head{padding:16px 16px 10px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.dlg-head h2{font-size:17px;font-weight:700}
.dlg-close{width:32px;height:32px;border:none;background:var(--surface-high);border-radius:8px;cursor:pointer;font-size:16px;color:var(--on-surface);display:grid;place-items:center;transition:background .2s}
.dlg-close:hover{background:var(--outline)}
.dlg-body{overflow-y:auto;padding:0 10px 14px;flex:1;-webkit-overflow-scrolling:touch}
.clr-bar{display:flex;gap:3px;padding:0 16px 10px}
.clr-sw{flex:1;height:7px;border-radius:4px;transition:background var(--tr)}
.th-cat{font-size:11px;font-weight:700;color:var(--primary);padding:12px 6px 4px;text-transform:uppercase;letter-spacing:0.8px}
.th-item{display:flex;align-items:center;gap:10px;padding:9px 6px;border-radius:8px;cursor:pointer;transition:background .15s}
.th-item:hover{background:var(--surface-high)}
.th-item.sel{background:color-mix(in srgb,var(--primary) 12%,transparent)}
.th-dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.th-dot i{width:16px;height:16px;border-radius:50%;display:block}
.th-info{flex:1;min-width:0}
.th-name{font-size:13px;color:var(--on-surface)}
.th-item.sel .th-name{font-weight:700;color:var(--primary)}
.th-desc{font-size:11px;color:var(--outline);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.th-chk{display:none;color:var(--primary);font-size:14px;font-weight:bold}
.th-item.sel .th-chk{display:block}
/* LANG DIALOG v6-EU */
.lang-search{width:100%;padding:8px 12px;border-radius:8px;border:1px solid var(--outline);background:var(--surface-high);color:var(--on-surface);font-size:14px;margin-bottom:8px;outline:none;box-sizing:border-box}
.lang-search:focus{border-color:var(--primary)}
.lang-opt{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:8px;cursor:pointer;font-size:14px;color:var(--on-surface);transition:background .15s}
.lang-opt:hover{background:var(--surface-high)}
.lang-opt.sel{color:var(--primary);font-weight:700}
.lang-flag{font-size:20px;line-height:1}
.lang-hidden{display:none}
/* RESPONSIVE */
.wide-only{display:none}
@media(min-width:1160px){.hdr-menu{display:none}.desktop-nav{display:flex}.wide-only{display:inline}}
@media(max-width:768px){.contact-box{flex-direction:column}.contact-photo{width:100%;height:160px}.about-header{flex-direction:column}.about-photo{width:160px}.product-chapters{columns:1}}
@media(min-width:1200px){.container{padding:0 32px}.home-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-height:500px) and (orientation:landscape){:root{--hdr:48px}.home-hero{padding:16px 0 12px}.home-hero h1{font-size:24px}}
.hdr,.card,.client,.contact-box,.home-card,.video-box,.contact-photo,.bar-track,.drawer,.dlg,.tag,.about-photo,.product-card,.contact-hint,.timeline{transition:background var(--tr),color var(--tr),border-color var(--tr)}

/* ── MULTI-PAGE ERGAENZUNGEN (test.sc-sarl.com) ── */
/* In der Multi-Page-Version gibt es keine .page.active mehr - jede Seite ist eine eigene HTML-Datei */
/* Der .page-Container bleibt fuer das Layout, ist aber immer sichtbar */
.page{display:block}
.page.active{display:block}

/* Navigation: aus <span onclick=...> wurden echte <a href=...> Links.
   Optik unveraendert, aber Link-spezifische Defaults neutralisieren. */
.nav-link{color:inherit;text-decoration:none}
.nav-link:hover{color:var(--primary)}
.hdr-logo{cursor:pointer}
.hdr-logo a{color:inherit;text-decoration:none;display:flex;align-items:center;gap:10px}

/* home-card: war <div onclick=>, jetzt <a href=>.
   Visuelle Gleichheit durch Reset der Link-Defaults sicherstellen. */
.home-card{color:inherit;text-decoration:none;cursor:pointer}
.home-card:hover{color:inherit;text-decoration:none}

/* Allgemeiner Link-Reset in Cards */
a.card-link{color:inherit;text-decoration:none;display:block}

/* 404-Seite: dreisprachige Blocke */
.err404{max-width:720px;margin:0 auto;padding:40px 20px;text-align:center}
.err404 h1{font-size:72px;font-weight:700;color:var(--primary);margin-bottom:8px}
.err404 h2{font-size:20px;color:var(--on-surface-variant);margin-bottom:32px}
.err404-block{background:var(--surface);border-radius:var(--radius);padding:24px;margin-bottom:16px;text-align:left}
.err404-block .lang-tag{display:inline-block;background:var(--primary-container);color:var(--primary);padding:2px 10px;border-radius:6px;font-size:12px;font-weight:600;margin-bottom:12px}
.err404-block p{margin-bottom:12px}
.err404-block a{color:var(--primary);font-weight:500}
@media(max-width:600px){
  .err404 h1{font-size:56px}
  .err404-block{padding:16px}
}

/* Root-Weiche: Loading-Indicator */
.loader{display:flex;align-items:center;justify-content:center;min-height:100vh;flex-direction:column;gap:16px;color:var(--on-surface-variant)}
.loader .spin{width:32px;height:32px;border:3px solid var(--surface-high);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}