/*
 * Course-wide UI/UX refinement layer
 * Scope: /learn/data-analyst routes only (loaded conditionally by Header.astro).
 * Goal: reduce oversized cards/empty height, tighten hierarchy, preserve roomy workspaces.
 */

/* ---------- Shared rhythm ---------- */
.lesson-hero.lesson-hero{padding:42px 0 52px}
.lesson-breadcrumb.lesson-breadcrumb{margin-bottom:34px}
.lesson-hero-grid.lesson-hero-grid{grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr);gap:44px;align-items:end}
.lesson-hero h1{max-width:860px;margin:18px 0 20px;font-size:clamp(50px,7vw,94px);line-height:.9;letter-spacing:-.06em}
.lesson-dek.lesson-dek{max-width:760px;font-size:clamp(18px,1.8vw,25px);line-height:1.32}
.lesson-objectives.lesson-objectives{padding-top:14px}
.lesson-objectives ol{margin-top:16px}
.lesson-objectives li{padding:7px 0 7px 6px;font-size:15px;line-height:1.4}

.lesson-band.lesson-band{padding:42px 0}
.lesson-band-grid.lesson-band-grid{grid-template-columns:minmax(120px,.38fr) minmax(0,1.62fr);gap:36px}
.lesson-band p{max-width:960px;font-size:clamp(27px,3.25vw,46px);line-height:1.06;letter-spacing:-.036em}

.lesson-section.lesson-section{padding:68px 0}
.lesson-section-head.lesson-section-head{grid-template-columns:58px minmax(0,1fr);gap:18px;margin-bottom:28px}
.lesson-section-head h2{max-width:900px;margin-top:6px;font-size:clamp(36px,4.35vw,60px);line-height:.96;letter-spacing:-.044em}
.lesson-prose.lesson-prose{max-width:780px;margin:30px 0 0 76px}
.lesson-prose p{font-size:17px;line-height:1.62}
.lesson-prose h3{font-size:26px}

/* ---------- Card density: one idea per card, no decorative empty height ---------- */
.scenario-card.scenario-card{grid-template-columns:minmax(220px,.52fr) minmax(0,1.48fr);gap:32px;padding:22px;border-radius:16px}
.scenario-card blockquote{font-size:clamp(24px,2.6vw,38px);line-height:1.12}
.scenario-meta{gap:8px 14px}

.framework-grid.framework-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.framework-grid article{min-height:200px;padding:17px}
.framework-grid h3,.driver-grid h3{margin:28px 0 9px;font-size:23px;line-height:1.04}
.framework-grid p,.driver-grid p{font-size:14px;line-height:1.48}
.framework-grid strong{padding-top:16px;font-size:14px}

.driver-grid article{min-height:200px;padding:17px}
.driver-grid h3{margin-top:28px}

.exercise-card.exercise-card{grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr);gap:34px;padding:24px;border-radius:16px}
.exercise-title h3{font-size:clamp(28px,3vw,42px);line-height:1}
.exercise-questions li{padding-block:9px;line-height:1.45}

.prompt-card.prompt-card{border-radius:14px}
.prompt-label.prompt-label{padding:12px 16px}
.prompt-card pre{padding:20px;max-height:540px}
.prompt-card code{font-size:12.5px;line-height:1.65}

.lesson-callout.lesson-callout{grid-template-columns:92px minmax(0,1fr);gap:18px;margin-top:28px;padding:20px 0}
.lesson-callout p{font-size:20px;line-height:1.38}
.lesson-callout.soft{margin-top:22px;padding:18px;border-radius:12px}

.validation-list div{grid-template-columns:58px minmax(0,1fr);gap:18px;padding:16px 0}
.validation-list p{font-size:clamp(18px,1.7vw,24px);line-height:1.32}

.solution-grid.solution-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.solution-grid article{min-height:185px;padding:19px}
.solution-grid p{margin-top:28px;font-size:16px;line-height:1.5}
.analysis-brief.analysis-brief{margin-top:22px;padding:22px;border-radius:14px}
.analysis-brief p{margin-top:12px;font-size:clamp(21px,2.1vw,30px);line-height:1.25}

/* Keep actual working surfaces roomy; only reduce decorative outer padding. */
.sql-runner,.sql-playground,.sheet-app-shell,.spreadsheet-module .sheet-table-wrap,.pq-editor-shell,.query-lab,.pivot-lab{max-width:100%}

/* ---------- Practice bridge ---------- */
.practice-bridge-section.practice-bridge-section{padding:30px 0}
.practice-bridge-card.practice-bridge-card{grid-template-columns:minmax(0,1.3fr) minmax(230px,.7fr);gap:28px;padding:20px;border-radius:16px}
.practice-bridge-card .practice-run-cue{margin-bottom:12px}
.practice-bridge-card h2{margin:8px 0 9px;font-size:clamp(30px,3.3vw,48px);line-height:.98}
.practice-bridge-card p{font-size:15px;line-height:1.5}

/* ---------- Course landing: more list, less giant-card dashboard ---------- */
.course-hero.course-hero{padding:48px 0 52px}
.course-hero h1{max-width:1040px;margin:30px 0 18px;font-size:clamp(54px,7.6vw,106px);line-height:.88;letter-spacing:-.062em}
.course-subtitle.course-subtitle{max-width:840px;font-size:clamp(19px,1.9vw,27px);line-height:1.3}

.course-game-dashboard.course-game-dashboard{grid-template-columns:132px repeat(3,minmax(0,1fr));margin-top:34px;border-radius:16px}
.game-ring.game-ring{width:98px;height:98px;margin:16px}
.game-ring strong{font-size:24px}
.game-stat.game-stat{padding:18px 17px}
.game-stat strong{margin:10px 0 5px;font-size:19px}
.game-stat small{font-size:11px;line-height:1.35}

.course-facts.course-facts{margin-top:32px}
.course-fact.course-fact{min-height:88px;padding:14px 15px}
.course-fact small{margin-bottom:14px}
.course-fact strong{font-size:17px}

.course-manifesto.course-manifesto{padding:50px 0}
.course-manifesto-grid.course-manifesto-grid{grid-template-columns:minmax(120px,.4fr) minmax(0,1.6fr);gap:38px}
.course-manifesto p{font-size:clamp(29px,3.4vw,48px);line-height:1.04}

.learn-section.learn-section{padding:74px 0}
.curriculum-section.curriculum-section{padding-top:68px}
.course-outline-head.course-outline-head{grid-template-columns:.64fr 1.36fr;gap:18px 38px;margin-bottom:24px;padding:22px 24px 24px;border-radius:16px}
.course-outline-head h2{font-size:clamp(40px,4.6vw,64px);line-height:.94}
.course-outline-head p{font-size:16px;line-height:1.55}

.course-stage.course-stage{padding:58px 0}
.stage-head.stage-head{grid-template-columns:50px minmax(0,1fr) minmax(260px,.66fr);gap:20px;margin-bottom:20px}
.stage-head h2{font-size:clamp(34px,3.7vw,52px);line-height:.96}
.stage-head p{font-size:15px;line-height:1.5}
.stage-title-line{gap:14px}
.stage-badge{white-space:nowrap}

.module-row.module-row{grid-template-columns:62px minmax(210px,.72fr) minmax(0,1.28fr);gap:20px;padding:18px 0}
.module-row h3{font-size:clamp(23px,2.2vw,32px);line-height:1.05}
.module-copy p{margin-bottom:12px;font-size:15px;line-height:1.5}
.module-skills{gap:5px}
.module-skills span{padding:5px 8px;font-size:8.5px}
.module-action-row{margin-top:12px}
.module-row-link.module-row-link:hover{padding-left:10px;padding-right:10px;transform:none}

.practice-arcade-intro.practice-arcade-intro{margin-bottom:24px}
.practice-arcade-intro h3{font-size:clamp(27px,2.8vw,40px);line-height:1.05}
.practice-lab-grid.practice-lab-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.practice-lab-card.practice-lab-card{min-height:270px;padding:18px;border-radius:16px}
.practice-lab-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,17,15,.07)}
.practice-lab-card h3{font-size:clamp(22px,2vw,29px);line-height:1.05}
.practice-lab-card p{font-size:14px;line-height:1.48}
.practice-lab-card-skills{margin-top:14px;gap:5px}
.practice-lab-card-skills span{padding:5px 7px;font-size:8px}
.practice-lab-card-run{margin-top:16px;padding-top:12px}

.lesson-system.lesson-system{grid-template-columns:repeat(7,minmax(0,1fr))}
.lesson-step.lesson-step{min-height:118px;padding:14px}
.lesson-step strong{margin-top:30px;font-size:15px}

.capstone-card.capstone-card{min-height:320px;padding:25px;border-radius:17px;gap:34px}
.capstone-card h2{font-size:clamp(42px,4.7vw,66px);line-height:.94}
.capstone-card p{font-size:17px;line-height:1.5}
.capstone-deliverables div{padding:11px 0}

.learn-footer.learn-footer{padding:60px 0}
.learn-footer h2{font-size:clamp(39px,4.8vw,64px)}

/* ---------- Applied SQL Analysis: dense reference cards, expandable detail ---------- */
.analysis-method-grid.analysis-method-grid{gap:9px}
.analysis-method-grid article{min-height:140px;padding:16px;border-radius:13px}
.analysis-method-grid strong{margin:22px 0 8px;font-size:16px}
.analysis-pattern-grid.analysis-pattern-grid{gap:12px}
.analysis-pattern-card.analysis-pattern-card{border-radius:15px}
.analysis-pattern-card>header{padding:17px}
.analysis-pattern-card h3{margin:12px 0 7px;font-size:clamp(23px,2.2vw,31px)}
.analysis-mini-visual span{min-height:68px;padding:11px}
.analysis-scenario{padding:14px 17px}
.analysis-sql-reveal summary{padding:13px 17px}
.analysis-sql-reveal pre{padding:17px}
.analysis-use-grid>div{padding:14px 17px}
.applied-guardrail-grid article{min-height:140px;padding:16px}
.applied-guardrail-grid strong{margin:22px 0 8px;font-size:16px}

/* ---------- Persistent course chrome ---------- */
.course-hud-inner.course-hud-inner{min-height:52px;grid-template-columns:minmax(180px,1fr) minmax(230px,.72fr) auto;gap:18px}
.course-hud-progress{gap:9px}
.course-hud-complete{min-height:38px;padding:6px 12px}
.course-hud-complete strong{font-size:10px}
.course-nav-reopen{border-radius:16px 0 0 16px}
.course-navigator{box-shadow:-14px 0 36px rgba(0,0,0,.11)}
.course-nav-current{padding-block:14px}
.course-nav-stage summary{min-height:42px}
.course-nav-lesson{min-height:38px}

/* ---------- Interaction/accessibility polish ---------- */
.module-row-link:focus-visible,.practice-lab-card:focus-visible,.lesson-nav a:focus-visible,.course-nav-lesson:focus-visible,.analysis-topic-nav a:focus-visible,.analysis-sql-reveal summary:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.lesson-section p,.module-copy p,.practice-lab-card p{overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){.module-row-link,.practice-lab-card,.learn-course-card,.analysis-sql-reveal summary i{transition:none!important}.practice-lab-card:hover{transform:none}}

/* ---------- Tablet ---------- */
@media(max-width:1180px){
  .practice-lab-grid.practice-lab-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lesson-system.lesson-system{grid-template-columns:repeat(4,minmax(0,1fr))}
  .stage-head.stage-head{grid-template-columns:50px minmax(0,1fr)}
  .stage-head>p{grid-column:2}
}

@media(max-width:900px){
  .lesson-hero-grid.lesson-hero-grid{grid-template-columns:1fr;gap:28px}
  .lesson-objectives{max-width:720px}
  .lesson-band-grid.lesson-band-grid{grid-template-columns:1fr;gap:14px}
  .scenario-card.scenario-card,.exercise-card.exercise-card,.practice-bridge-card.practice-bridge-card{grid-template-columns:1fr;gap:22px}
  .lesson-prose.lesson-prose{margin-left:58px}
  .framework-grid.framework-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .course-game-dashboard.course-game-dashboard{grid-template-columns:120px 1fr 1fr}
  .course-manifesto-grid.course-manifesto-grid,.course-outline-head.course-outline-head{grid-template-columns:1fr;grid-template-areas:none}
  .course-outline-kicker,.course-outline-head h2,.course-outline-head p{grid-area:auto}
  .module-row.module-row{grid-template-columns:54px minmax(0,1fr)}
  .module-copy{grid-column:2}
  .course-hud-inner.course-hud-inner{grid-template-columns:1fr auto;gap:12px;padding-top:8px;padding-bottom:8px}
}

/* ---------- Mobile ---------- */
@media(max-width:620px){
  .lesson-hero.lesson-hero{padding:30px 0 38px}
  .lesson-breadcrumb.lesson-breadcrumb{margin-bottom:24px}
  .lesson-hero h1{margin:14px 0 16px;font-size:clamp(42px,13.5vw,58px);line-height:.92}
  .lesson-dek.lesson-dek{font-size:18px;line-height:1.38}
  .lesson-objectives li{font-size:14px}

  .lesson-band.lesson-band{padding:30px 0}
  .lesson-band p{font-size:clamp(25px,8vw,34px);line-height:1.08}
  .lesson-section.lesson-section{padding:48px 0}
  .lesson-section-head.lesson-section-head{grid-template-columns:34px minmax(0,1fr);gap:12px;margin-bottom:22px}
  .lesson-section-head h2{font-size:clamp(31px,9.5vw,43px);line-height:.98}
  .lesson-prose.lesson-prose{margin:24px 0 0;max-width:none}
  .lesson-prose p{font-size:16px;line-height:1.58}

  .scenario-card.scenario-card,.exercise-card.exercise-card{padding:17px;border-radius:12px}
  .scenario-card blockquote{font-size:24px}
  .framework-grid.framework-grid,.solution-grid.solution-grid{grid-template-columns:1fr}
  .framework-grid article,.driver-grid article,.solution-grid article{min-height:0;padding:16px}
  .framework-grid h3,.driver-grid h3{margin-top:18px}
  .solution-grid p{margin-top:16px}
  .lesson-callout.lesson-callout{grid-template-columns:1fr;gap:8px;margin-top:22px;padding:16px 0}
  .lesson-callout p{font-size:18px}
  .analysis-brief.analysis-brief{padding:18px}

  .course-hero.course-hero{padding:34px 0 40px}
  .course-hero h1{margin:24px 0 16px;font-size:clamp(48px,14vw,68px);line-height:.9}
  .course-subtitle.course-subtitle{font-size:18px}
  .course-game-dashboard.course-game-dashboard{grid-template-columns:92px 1fr;margin-top:26px;border-radius:12px}
  .game-ring.game-ring{width:70px;height:70px;margin:11px}
  .game-ring strong{font-size:19px}
  .game-stat.game-stat{padding:13px 12px}
  .game-stat strong{font-size:16px}
  .game-stat:nth-of-type(3),.game-stat:nth-of-type(4){border-top:1px solid var(--line)}
  .course-facts.course-facts{grid-template-columns:repeat(2,1fr);margin-top:24px}
  .course-fact.course-fact{min-height:76px;padding:12px}
  .course-manifesto.course-manifesto{padding:38px 0}
  .course-manifesto p{font-size:29px}
  .learn-section.learn-section{padding:52px 0}
  .course-outline-head.course-outline-head{padding:18px;border-radius:12px}
  .course-outline-head h2{font-size:39px}
  .course-stage.course-stage{padding:44px 0}
  .stage-head.stage-head{grid-template-columns:1fr;gap:12px}
  .stage-head>p{grid-column:auto}
  .stage-title-line{align-items:flex-start}
  .module-row.module-row{grid-template-columns:1fr;gap:9px;padding:15px 0}
  .module-copy{grid-column:auto}
  .module-row h3{font-size:25px}
  .module-skills span{font-size:8px}
  .practice-lab-grid.practice-lab-grid{grid-template-columns:1fr}
  .practice-lab-card.practice-lab-card{min-height:0;padding:16px}
  .lesson-system.lesson-system{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lesson-step.lesson-step{min-height:96px}
  .capstone-card.capstone-card{padding:19px;border-radius:13px}

  .analysis-method-grid.analysis-method-grid,.applied-guardrail-grid.applied-guardrail-grid{grid-template-columns:1fr}
  .analysis-pattern-card>header,.analysis-scenario,.analysis-use-grid>div{padding:15px}

  .practice-bridge-section.practice-bridge-section{padding:24px 0}
  .practice-bridge-card.practice-bridge-card{padding:17px}
  .practice-bridge-card h2{font-size:31px}

  .course-hud-inner.course-hud-inner{gap:8px}
  .course-hud-progress{grid-column:1/-1}
}