
/* Mobile refinements v80 – public pages and shared tools */

@media (max-width: 760px){
  .modal{ padding:0; }
  .modal .panel{
    width:100%;
    max-width:none !important;
    height:100dvh;
    max-height:100dvh;
    border-radius:0;
    margin:0;
  }
  .modal .panelHeader,
  .modal .panelFooter{ padding:14px 16px; }
  .modal .panelBody{ padding:14px 16px; }
  #promoModal .promoPanel,
  #previewModal .panel{ border-radius:0; }
}

@media (max-width: 980px){
  .hero{ gap:14px; }
  .hero .card,
  .card.heroCard{ min-width:0; }
}

/* Home */
@media (max-width: 860px){
  body.home .hero.heroPanel{ padding:22px 16px 14px; }
  body.home .hero h1{ max-width: 16ch; }
  body.home .heroFocus,
  body.home .heroValueGrid,
  body.home .heroStack,
  body.home .supportGrid,
  body.home .orgGrid,
  body.home .orgMiniGrid,
  body.home .studioGrid,
  body.home .studioSplit,
  body.home .whyPillars,
  body.home .whyBand .featureGrid{ gap:10px; }
  body.home .heroValueCard,
  body.home .featureCard,
  body.home .orgGrid .card,
  body.home .supportGrid .card,
  body.home .whyPillars .card,
  body.home .whyBand .featureCard{ padding:14px; }
}
@media (max-width: 640px){
  body.home .heroKicker,
  body.home .tagRow{ gap:6px; }
  body.home .heroValueGrid{ margin-top:10px; }
  body.home .heroValueBadge,
  body.home .heroValuePill,
  body.home .heroKicker .tag{ white-space:normal; }
  body.home .heroImage{ min-height: 0; }
  body.home .heroMicroNote{ font-size:.85rem; }
  body.home .studioPanel,
  body.home .orgGrid .card,
  body.home .supportGrid .card,
  body.home .featureCard{ box-shadow:none; }
}

/* Learn cockpit */
@media (max-width: 980px){
  body.cockpit .cockpitTop{ gap:10px; }
  body.cockpit .cockpitHelp .hint{ display:none; }
}
@media (max-width: 760px){
  body.cockpit .cockpitTop{ margin-bottom:10px; }
  body.cockpit .heroCard,
  body.cockpit .insightsCard,
  body.cockpit .onboardCard,
  body.cockpit .referralCard,
  body.cockpit .card{ border-radius:16px; }
  body.cockpit .heroCtas{ display:grid; grid-template-columns:1fr; }
  body.cockpit .heroCtas .btn{ justify-content:center; }
  body.cockpit .hudGrid,
  body.cockpit .laneGrid,
  body.cockpit .tripletGrid,
  body.cockpit .ideaGrid,
  body.cockpit .sidebarCompactGrid,
  body.cockpit #certPersonGrid{ grid-template-columns:1fr !important; }

  body.cockpit #handbookModal .panelHeader,
  body.cockpit #handbookModal .panelFooter{ position:sticky; background:var(--surface); z-index:2; }
  body.cockpit #handbookModal .panelHeader{ top:0; }
  body.cockpit #handbookModal .panelFooter{ bottom:0; border-top:1px solid var(--border); }
  body.cockpit #handbookModal .hbGrid{ grid-template-columns:1fr; }
  body.cockpit #handbookModal .hbToc,
  body.cockpit #handbookModal .hbDoc{ max-height:none; height:auto; }
  body.cockpit #handbookModal:not(.hb-mobile-reading) .hbDoc{ display:none; }
  body.cockpit #handbookModal.hb-mobile-reading .hbToc{ display:none; }
  body.cockpit #handbookModal .hbMobileBack{ display:inline-flex; }
}
@media (min-width: 761px){
  body.cockpit #handbookModal .hbMobileBack{ display:none !important; }
}

/* Quality page */
@media (max-width: 760px){
  .qHeroGrid,
  .qPillars,
  .qDetailsGrid,
  .qAuthorGrid,
  .qAlignGrid,
  .qCycleGrid{ grid-template-columns:1fr !important; gap:12px !important; }
  .qSummary,
  .qPillar,
  .qDemo,
  .qDetailCard,
  .qAuthorItem,
  .qCardPad{ padding:14px !important; }
  .qSnRow{ display:grid !important; grid-template-columns:1fr; gap:4px; align-items:start; }
  .qTable .qHead{ display:none; }
  .qTable .qRow{ display:grid; grid-template-columns:1fr; gap:8px; padding:12px; }
  .qTable .qRow > div{ padding:0 !important; }
  .qTable .qRow > div[role="cell"]::before{ display:block; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted2); margin-bottom:2px; }
  .qTable .qRow > div[role="cell"]:nth-child(1)::before{ content:"Element"; }
  .qTable .qRow > div[role="cell"]:nth-child(2)::before{ content:"Ort"; }
  .qTable .qRow > div[role="cell"]:nth-child(3)::before{ content:"Zweck"; }
}

/* Verify */
@media (max-width: 760px){
  .verifyHero .hero{ gap:12px; }
  .verifySidebar{ padding:14px !important; }
  .reportInner{ padding:12px !important; }
  .reportHeader{ gap:8px !important; }
  .reportStatus{ align-items:flex-start !important; width:100%; }
  .reportActions{ justify-content:stretch !important; }
  .reportActions .btn{ flex:1 1 100%; justify-content:center; }
}
@media (max-width: 560px){
  .reportTable,
  .reportTable tbody,
  .reportTable tr,
  .reportTable th,
  .reportTable td{ display:block; width:100% !important; }
  .reportTable{ border-radius:14px; }
  .reportTable tr{ padding:10px 12px; }
  .reportTable tr + tr{ border-top:1px solid var(--border); }
  .reportTable th,
  .reportTable td{ border:0 !important; background:transparent !important; padding:0 !important; }
  .reportTable th{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted2); margin-bottom:4px; }
  .reportTable td + th,
  .reportTable td + td,
  .reportTable th + td{ margin-top:6px; }
}

/* Checkout and purchase status */
@media (max-width: 760px){
  body.cockpit.buy .heroCard,
  body.cockpit.buy .sidebarCard,
  body.cockpit.buy .benefitCard,
  body.cockpit.buy .card,
  body.cockpit:not(.verify):not(.legalPage) .summaryBox{ border-radius:16px; }
  body.cockpit.buy .checkoutStepper{ gap:10px; }
  body.cockpit.buy .seg{ width:100%; }
  body.cockpit.buy .segBtn{ flex:1 1 0; }
  body.cockpit.buy #checkoutCard .grid[style*="repeat(2"],
  body.cockpit.buy #checkoutCard .grid[style*="1fr 1fr"],
  body.cockpit.buy .sidebarCompactGrid{ grid-template-columns:1fr !important; }
  body.cockpit.buy #summaryProduct,
  body.cockpit.buy #summaryDesc,
  body.cockpit.buy #summaryPrice,
  body.cockpit.buy #summaryMeta{ margin-top:4px; }

  body.cockpit .heroCard,
  body.cockpit .card{ min-width:0; }
  body.cockpit .heroCard .actions,
  body.cockpit .card .actions{ gap:8px; }
}
@media (max-width: 560px){
  body.cockpit.buy .checkoutStepper{ gap:8px; }
  body.cockpit.buy .stepChip{ min-width:0; padding:10px; }
  body.cockpit.buy .stepChip .stepCopy::after{ display:none; }
  body.cockpit.buy .stepChip .stepTitle{ font-size:13px; }
}

/* Course info */
@media (max-width: 760px){
  body.courseInfo #facts{ grid-template-columns:1fr !important; gap:10px; }
  body.courseInfo .goalsSummaryRow,
  body.courseInfo #goalsCard,
  body.courseInfo .asideBlock{ padding:14px; }
  body.courseInfo .goalPillList{ display:grid; grid-template-columns:1fr; }
  body.courseInfo .goalPill{ justify-content:flex-start; border-radius:16px; }
  body.courseInfo .steps{ gap:12px; }
}

/* Legal docs and withdrawal */
@media (max-width: 900px){
  body.cockpit.legalPage .legalMeta{ gap:10px; }
  body.cockpit.legalPage .legalActions{ width:100%; display:flex; flex-wrap:wrap; gap:8px; }
  body.cockpit.legalPage .legalActions .btn{ flex:1 1 180px; justify-content:center; }
  body.cockpit.legalPage .legalToc{ padding:12px; }
  body.cockpit.legalPage .legalTocDetails summary{
    list-style:none;
    cursor:pointer;
    font-weight:750;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  body.cockpit.legalPage .legalTocDetails summary::-webkit-details-marker{ display:none; }
  body.cockpit.legalPage .legalTocDetails summary::after{ content:'▾'; color:var(--muted2); }
  body.cockpit.legalPage .legalTocDetails[open] summary::after{ content:'▴'; }
  body.cockpit.legalPage .legalTocDetails nav{ margin-top:10px; }
  body.cockpit.legalPage .legalContent{ font-size:15px; }
}
@media (max-width: 680px){
  body.cockpit.withdrawPage .summaryBox,
  body.cockpit.withdrawPage .heroCard,
  body.cockpit.legalPage .card{ border-radius:16px; }
}

/* Success / transfer / cancel pages */
@media (max-width: 760px){
  body.cockpit .hero .heroCard,
  body.cockpit .hero .card{ padding:14px; }
  body.cockpit .hero .actions .btn,
  body.cockpit .panelFooter .btn{ flex:1 1 100%; justify-content:center; }
}

/* Admin / setup / health – modest mobile fallback */
@media (max-width: 760px){
  .adminLayout .side{ order:2; }
  .adminLayout .main{ order:1; }
  .adminLayout .side .body{ max-height:none; }
  .editorToolbar,
  .editorModeBar,
  .editorMetaActions,
  .editorOverlayLead,
  .tasklibCalibInlineControls{ display:grid !important; grid-template-columns:1fr !important; }
  .lessonEditorModal .panel,
  .tasklibCalibrationOverlayModal .panel,
  .tasklibPreviewModal .panel{ width:100% !important; max-width:none !important; height:100dvh; max-height:100dvh; border-radius:0; }
}


/* Device-width finetuning v81 – 390 px · 430 px · 768 px */

@media (min-width: 681px) and (max-width: 900px){
  body.cockpit .container{ padding-left:18px; padding-right:18px; }
  body.cockpit .hero.heroPanel{ padding:22px 18px 16px !important; }
  body.cockpit .hero.heroPanel.hasSwoosh::after{ display:none; }
  body.home .heroValueGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px; }
  body.home .heroValueCard.is-featured{ grid-column: 1 / -1; }
  body.cockpit .heroCtas{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  body.courseInfo #facts{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body.cockpit.verify .hero{ gap:14px; }
  body.cockpit:not(.legalPage) .summaryBox{ padding:16px; }
  body.cockpit #handbookModal .panel{ width:min(94vw, 860px); max-height:90dvh; border-radius:20px; }
  body.cockpit #handbookModal .hbGrid{ grid-template-columns: 260px minmax(0,1fr); }
  body.cockpit #handbookModal .hbToc,
  body.cockpit #handbookModal .hbDoc{ max-height: min(68dvh, 760px); }
  body.cockpit .hudGrid,
  body.cockpit .laneGrid,
  body.cockpit .tripletGrid,
  body.cockpit .ideaGrid,
  .qDetailsGrid,
  .qHeroGrid{ gap:12px !important; }
}

@media (max-width: 900px){
  body.cockpit .container{ padding-left:14px; padding-right:14px; }
  body.cockpit .hero.heroPanel{ padding:20px 14px 14px !important; }
  body.cockpit .hero.heroPanel.hasSwoosh::after{ display:none; }
  body.cockpit .navActions,
  body.cockpit .actions,
  body.cockpit .stepActions,
  body.cockpit .laneActions,
  body.cockpit .reportActions,
  body.cockpit .verifyActions{ gap:8px; flex-wrap:wrap; }
  body.cockpit .hero .btn,
  body.cockpit .navActions .btn{ min-width:0; }
  body.cockpit .sectionTitle,
  .qSumHead,
  .qCardHead,
  .qDetailHead,
  .reportHeader{ align-items:flex-start !important; }
  body.cockpit .sectionTitle,
  .qSumHead,
  .qCardHead,
  .qDetailHead{ gap:6px; }
  body.cockpit .tag,
  body.cockpit .pill,
  body.cockpit .stepMeta,
  body.home .heroValuePill,
  .qChip,
  .taskPill{ white-space:normal; }
}

/* Header CTA compaction */
@media (max-width: 900px){
  body.home .topbar .navActions > a.btn[href="buy.html"],
  body.cockpit:not(.legalPage) .topbar .navActions > a.btn[href="buy.html"]{
    display:none !important;
  }
}
@media (max-width: 900px){
  body.home .topbar .navActions > .btn.primary.requires-noauth,
  body.cockpit:not(.legalPage) .topbar .navActions > .btn.primary.requires-noauth{
    min-width:0;
    padding-inline:14px;
    white-space:nowrap;
    font-size:0;
  }
  body.home .topbar .navActions > .btn.primary.requires-noauth::after,
  body.cockpit:not(.legalPage) .topbar .navActions > .btn.primary.requires-noauth::after{
    content:"Starten";
    font-size:14px;
    line-height:1.2;
  }

  .mobileNav .mobileEntry{
    font-weight:700;
  }
  .mobileNav .mobileEntryPrimary{
    background: color-mix(in oklab, var(--accent) 12%, var(--surface));
    border-color: color-mix(in oklab, var(--accent) 28%, var(--border));
  }
  .mobileNav .mobileEntrySecondary{
    background: color-mix(in oklab, var(--surface2) 88%, transparent);
    border-color: color-mix(in oklab, var(--border) 88%, transparent);
  }
}
@media (max-width: 430px){
  .menuBtn .label{ display:none; }
  .menuBtn{ padding-inline:12px; }
}

/* Home */
@media (max-width: 900px){
  body.home .hero{ gap:12px; }
  body.home .hero h1{ max-width:none; }
  body.home .heroValueHead{ align-items:flex-start; gap:8px; }
  body.home .heroValueMeta{ flex-wrap:wrap; gap:6px; }
  body.home .stepActions{ display:grid; grid-template-columns:1fr; gap:8px; }
  body.home .stepActions .btn{ width:100%; justify-content:center; }
  body.home #promoModal .promoCodeRow{ grid-template-columns:1fr; gap:8px; }
  body.home #promoModal .promoFooter,
  body.home #previewModal .panelFooter{ display:grid; grid-template-columns:1fr; }
  body.home #promoModal .promoFooter .btn,
  body.home #previewModal .panelFooter .btn{ width:100%; justify-content:center; }
}
@media (max-width: 430px){
  body.home .hero.heroPanel{ padding:18px 12px 12px !important; }
  body.home .heroValueGrid,
  body.home .supportGrid,
  body.home .orgGrid,
  body.home .studioGrid,
  body.home .whyPillars,
  body.home .whyBand .featureGrid{ grid-template-columns:1fr !important; }
  body.home .heroValueCard,
  body.home .featureCard,
  body.home .supportGrid .card,
  body.home .orgGrid .card,
  body.home .studioCardLite{ padding:13px; border-radius:16px; }
  body.home .heroValueBadge{ align-self:flex-start; }
}
@media (max-width: 390px){
  body.home .hero h1{ font-size: clamp(1.72rem, 8.4vw, 2.1rem); }
  body.home .heroValuePill{ font-size:.78rem; padding:5px 8px; }
}

/* Learn cockpit */
@media (max-width: 900px){
  body.cockpit .cockpitTop{ gap:10px; align-items:flex-start; }
  body.cockpit .cockpitHelp{ width:100%; }
  body.cockpit .cockpitHelp .hbIntro{ text-align:left; }
  body.cockpit .onboardGrid,
  body.cockpit .onPrefsGrid{ grid-template-columns:1fr !important; }
  body.cockpit .onActions,
  body.cockpit #prefsDetails > div[style*="justify-content:flex-end"]{ display:grid !important; grid-template-columns:1fr; }
  body.cockpit .onActions .btn,
  body.cockpit #prefsDetails .btn{ width:100%; justify-content:center; }
  body.cockpit .progressRow{ gap:6px; }
  body.cockpit .laneHead{ flex-direction:column; align-items:flex-start; gap:8px; }
  body.cockpit .laneActions .btn,
  body.cockpit .heroCtas .btn{ width:100%; justify-content:center; }
  body.cockpit #handbookModal .panelBody{ padding:12px 14px 18px; }
  body.cockpit #handbookModal .hbSearchLabel{ display:grid; gap:4px; }
  body.cockpit #handbookModal #hbQuery{ font-size:16px; }
  body.cockpit #handbookModal .hbToc a{ padding:12px; }
  body.cockpit #handbookModal .hbDoc{ padding:14px; }
}
@media (max-width: 430px){
  body.cockpit .cockpitTop h1{ font-size: clamp(1.6rem, 8vw, 2rem); }
  body.cockpit .cockpitHelp .hint{ display:none; }
  body.cockpit .progressRow{ flex-direction:column; align-items:flex-start; }
  body.cockpit #handbookModal .panelFooter{ display:grid; grid-template-columns:1fr; }
  body.cockpit #handbookModal .panelFooter .btn{ width:100%; justify-content:center; }
}

/* Quality */
@media (max-width: 900px){
  .qSummary,
  .qPillar,
  .qDemo,
  .qDetailCard,
  .qVizCard,
  .taskPanel,
  .taskCard{ box-shadow:none; }
  .qPred,
  .qDemoAssistRow,
  .qDemoActions,
  .taskSteps{ display:grid !important; grid-template-columns:1fr !important; gap:8px; }
  .qNodeTxt,
  .qCoopWhyT,
  .qPanelText{ min-width:0; }
}
@media (max-width: 430px){
  .qSummary,
  .qPillar,
  .qDemo,
  .qDetailCard,
  .qCardPad,
  .taskPanel,
  .taskCard{ padding:12px !important; border-radius:16px; }
}

/* Verify */
@media (max-width: 900px){
  body.cockpit.verify .heroCard{ padding:14px; }
  body.cockpit.verify .verifyActions,
  body.cockpit.verify .reportActions{ display:grid !important; grid-template-columns:1fr; }
  body.cockpit.verify .verifyActions .btn,
  body.cockpit.verify .reportActions .btn{ width:100%; justify-content:center; }
  body.cockpit.verify .reportStripe{ padding:12px; }
  body.cockpit.verify .reportSheet{ overflow:hidden; }
}
@media (max-width: 430px){
  body.cockpit.verify .reportHeader{ flex-direction:column; }
  body.cockpit.verify .reportInner{ padding:10px !important; }
}

/* Checkout + status pages */
@media (max-width: 900px){
  body.cockpit.buy .heroCard,
  body.cockpit.buy .summaryBox,
  body.cockpit.buy .benefitCard,
  body.cockpit.buy .sidebarCard,
  body.cockpit.withdrawPage .summaryBox,
  body.cockpit .heroCard{ padding:14px; }
  body.cockpit.buy .stepActions,
  body.cockpit.withdrawPage .stepActions{ display:grid; grid-template-columns:1fr; }
  body.cockpit.buy .stepActions .btn,
  body.cockpit.withdrawPage .stepActions .btn,
  body.cockpit .hero .actions .btn{ width:100%; justify-content:center; }
  body.cockpit.buy .stepChip,
  body.cockpit.withdrawPage .stepChip{ align-items:flex-start; }
  body.cockpit.buy .stepChip .stepMeta,
  body.cockpit.withdrawPage .stepChip .stepMeta{ white-space:normal; overflow:visible; text-overflow:clip; }
}
@media (max-width: 430px){
  body.cockpit.buy .stepChip,
  body.cockpit.withdrawPage .stepChip{ padding:10px 12px; }
  body.cockpit.buy .stepDot,
  body.cockpit.withdrawPage .stepDot{ width:28px; height:28px; }
  body.cockpit.buy .stepTitle,
  body.cockpit.withdrawPage .stepTitle{ font-size:13px; }
}

/* Course info */
@media (max-width: 900px){
  body.courseInfo .hero .actions,
  body.courseInfo .navActions{ display:grid; grid-template-columns:1fr; gap:8px; }
  body.courseInfo .hero .actions .btn,
  body.courseInfo .navActions .btn{ width:100%; justify-content:center; }
  body.courseInfo .goalPillList{ gap:8px; }
  body.courseInfo #facts .card,
  body.courseInfo .asideBlock,
  body.courseInfo #goalsCard{ box-shadow:none; }
}
@media (max-width: 430px){
  body.courseInfo .goalsSummaryRow,
  body.courseInfo #goalsCard,
  body.courseInfo .asideBlock{ padding:12px; }
}

/* Legal pages */
@media (max-width: 900px){
  body.cockpit.legalPage .legalMeta{ flex-direction:column; align-items:flex-start; }
  body.cockpit.legalPage .legalMetaStand{ display:block; }
  body.cockpit.legalPage .legalContent p,
  body.cockpit.legalPage .legalContent li{ max-width:none; }
  body.cockpit.legalPage .legalActions .btn{ flex:1 1 100%; }
}
@media (max-width: 430px){
  body.cockpit.legalPage .legalContent{ font-size:14.5px; }
  body.cockpit.legalPage .legalToc{ padding:10px; }
  body.cockpit.legalPage .legalActions{ gap:6px; }
}

/* Course lesson */
@media (max-width: 430px){
  body.cockpit .heroActionRail,
  body.cockpit .mobileUnitQuickActions,
  body.cockpit .lessonHeaderTools{ grid-template-columns:1fr !important; }
  body.cockpit .heroActionRail .btn,
  body.cockpit .mobileUnitQuickActions .btn,
  body.cockpit .lessonHeaderTools .btn{ width:100%; justify-content:center; }
  body.cockpit .lessonOverview,
  body.cockpit .lessonMetaInline{ gap:8px; }
}

/* Shared modals */
@media (max-width: 430px){
  .modal .panelHeader,
  .modal .panelFooter,
  .modal .panelBody,
  #promoModal .promoHeader,
  #promoModal .promoBody{ padding-left:12px; padding-right:12px; }
}
