/* ==========================================================================
   MUL 2010 · site.css — chrome for "shell" pages:
   homepage (index.html), weeks landing (weeks/index.html), listening.
   Requires base.css to be loaded first.
   ========================================================================== */

.site-header{position:sticky;top:0;z-index:100;background:rgba(250,251,254,0.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.header-inner{min-height:4rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.brand{font-family:var(--font-display);font-weight:700;font-size:1.3rem;color:var(--ink)}
.brand small{margin-left:.65rem;padding-left:.8rem;border-left:1px solid var(--line);font-family:var(--font-body);font-size:.8rem;font-weight:500;color:var(--muted)}
.primary-nav ul{display:flex;flex-wrap:wrap;gap:.15rem 1.4rem;margin:0;padding:0;list-style:none}
.primary-nav a{display:inline-block;padding:1.2rem 0 .9rem;color:var(--muted);border-bottom:3px solid transparent;font-size:.88rem;font-weight:650}
.primary-nav a:hover,.primary-nav a[aria-current="page"]{color:var(--ink);border-color:var(--clay)}

.eyebrow{margin:0 0 .7rem;color:var(--ocean);font-size:.78rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
h1{max-width:18ch;font-size:clamp(2.2rem,5vw,3.4rem);color:var(--ink)}
.lede{max-width:46rem;margin:1.1rem 0 0;font-size:1.08rem;color:var(--muted)}

.hero{padding:clamp(2.4rem,6vw,4rem) 0 2.2rem}
.hero-meta{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin-top:1.5rem;padding-top:1.1rem;border-top:1px dashed var(--line)}
.hero-meta div{font-size:.9rem;color:var(--ink)}
.hero-meta .meta-label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.2rem}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:2.7rem;padding:.7rem 1.5rem;border:1px solid var(--line);color:var(--ink);background:rgba(255,255,255,0.6);font-weight:650;border-radius:999px;box-shadow:var(--shadow-cut);transition:transform var(--speed-fast) ease, box-shadow var(--speed-fast) ease}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);color:var(--ink)}
.btn.primary{color:#fff;background:var(--clay);border-color:transparent}
.btn.ghost{background:transparent;border-style:dashed}

.section{padding:var(--space-7) 0}
.section-label{margin:0 0 var(--space-5);color:var(--ocean);font-family:var(--font-display);font-size:1.5rem;font-weight:600;display:flex;align-items:center;gap:.6rem}
.section-label .mark{color:var(--sun);font-size:1.1rem}
.section-note{color:var(--muted);font-size:.9rem;margin:-.75rem 0 var(--space-5)}

.panel-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-cut)}
.panel-card + .panel-card{margin-top:var(--space-5)}
.panel-card p{color:var(--muted);font-size:.92rem}
.panel-card .fine{font-size:.82rem;color:var(--muted);margin-top:.6rem}

/* ── Tables (syllabus grade table + schedule) ── */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th{text-align:left;padding:var(--space-3) var(--space-4);background:rgba(198,203,219,0.4);border-bottom:1px solid var(--line);color:var(--ink);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover td{background:rgba(217,164,65,0.14)}
.table-wrap{border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-cut);background:var(--paper)}

.grade-pct{font-weight:700;color:var(--clay);white-space:nowrap}
.grade-desc{font-size:.85rem;color:var(--muted);margin-top:.2rem}
.fmt-pill{display:inline-flex;align-items:center;gap:4px;font-size:.68rem;font-weight:700;letter-spacing:.04em;padding:2px 8px;border-radius:999px;margin-left:6px;white-space:nowrap;background:rgba(95,130,114,0.2);border:1px solid var(--line);color:var(--ink)}

.policy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4);margin-top:var(--space-4)}
.policy-item{font-size:.9rem}
.policy-label{font-weight:700;color:var(--ocean);margin-bottom:.25rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-family:var(--font-display)}

/* ── Schedule rows ── */
.week-num{color:var(--muted);font-size:.82rem;font-weight:700;white-space:nowrap}
.week-date{color:var(--muted);font-size:.85rem;white-space:nowrap}
.week-topic{font-weight:600;color:var(--ink)}
.week-reading{font-size:.85rem;color:var(--muted)}
.week-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.badge-sm{font-size:.68rem;font-weight:700;padding:2px 9px;border-radius:999px;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;border:1px solid var(--line)}
.badge-quiz{background:rgba(95,130,114,0.3);color:#24402f}
.badge-assign{background:rgba(59,63,140,0.18);color:#2b2e66}
.badge-exam{background:rgba(160,61,46,0.28);color:#7a2e22}
tr.current-week td{background:rgba(217,164,65,0.22)}

.week-page-link{display:inline-flex;align-items:center;gap:.3rem;font-size:.78rem;font-weight:650;padding:3px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink);background:rgba(255,255,255,0.55);white-space:nowrap}
.week-page-link:hover{border-color:var(--clay);color:var(--clay)}
.week-page-link.locked{opacity:.38;pointer-events:none}

/* Listening-quiz study-material rows inside the schedule */
.lq-row td{background:rgba(95,130,114,0.14);padding:var(--space-3) var(--space-4)}
.lq-link{display:flex;align-items:center;gap:.75rem;color:var(--ink);font-size:.9rem;font-weight:650}
.lq-link:hover{color:var(--clay)}
.lq-sub{font-size:.79rem;color:var(--muted);font-weight:400;margin-top:.1rem}
.lq-open{margin-left:auto;font-size:.78rem;opacity:.7;white-space:nowrap;color:var(--ocean)}

/* ── Contact ── */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-5)}
.contact-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.25rem;font-weight:700}
.contact-value{color:var(--ink);font-size:.95rem;font-weight:600}

.info-footer{padding:var(--space-6) 0;background:var(--stone);border-top:1px solid var(--line)}

/* ==========================================================================
   Weeks landing grid (weeks/index.html)
   ========================================================================== */
.week-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-4);margin-top:var(--space-5)}
.week-card{display:flex;flex-direction:column;gap:.4rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-cut);color:var(--ink);transition:transform var(--speed-base) ease, box-shadow var(--speed-base) ease}
a.week-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift);color:var(--ink);border-color:var(--clay)}
.wc-num{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ocean)}
.wc-date{font-size:.82rem;color:var(--muted)}
.wc-topic{font-family:var(--font-display);font-size:1.12rem;font-weight:600;color:var(--ink);line-height:1.2}
.wc-arrow{margin-top:auto;padding-top:.5rem;font-size:.8rem;font-weight:650;color:var(--clay)}
.week-card.current{border-color:var(--clay);box-shadow:var(--shadow-lift);background:rgba(217,164,65,0.18)}
.week-card.locked{opacity:.45;pointer-events:none;box-shadow:none}
.week-card.locked .wc-arrow{display:none}
.week-card.finals{background:rgba(198,203,219,0.5)}

/* ==========================================================================
   Listening page (listening/index.html)
   ========================================================================== */
.section-sub{font-size:.88rem;color:var(--muted);margin:-.6rem 0 var(--space-5)}

.spotify-banner{display:flex;align-items:center;gap:var(--space-4);background:#1DB954;border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);color:#fff;box-shadow:var(--shadow-soft);transition:opacity var(--speed-fast) ease}
.spotify-banner:hover{opacity:.9;color:#fff}
.spotify-banner-title{font-size:1rem;font-weight:700;margin-bottom:2px}
.spotify-banner-sub{font-size:.82rem;opacity:.88}

.topic-block{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:var(--space-4);box-shadow:var(--shadow-cut)}
.topic-head{display:flex;align-items:center;gap:.75rem;padding:.7rem var(--space-5);background:rgba(95,130,114,0.14);border-bottom:1px solid var(--line)}
.topic-week-chip{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ocean);background:rgba(255,255,255,0.6);border:1px solid var(--line);border-radius:999px;padding:2px 9px;flex-shrink:0;white-space:nowrap}
.topic-title{font-family:var(--font-display);font-weight:600;color:var(--ink);font-size:1rem}
.topic-sub{font-size:.8rem;color:var(--muted);margin-top:1px}

.track-table{table-layout:fixed}
.track-table colgroup col:nth-child(1){width:30%}
.track-table colgroup col:nth-child(2){width:22%}
.track-table colgroup col:nth-child(3){width:18%}
.track-table colgroup col:nth-child(4){width:30%}
.track-table td{color:var(--ink);vertical-align:middle;word-wrap:break-word}
.track-table td:first-child{font-weight:600}
.track-table td:nth-child(2){color:var(--muted);font-size:.83rem;font-style:italic}
.track-table td:nth-child(3){color:var(--muted);font-size:.83rem}

.loc-btn{display:inline-flex;align-items:center;gap:3px;font-size:.68rem;font-weight:700;letter-spacing:.04em;padding:3px 9px;border-radius:999px;white-space:nowrap;vertical-align:middle;margin:2px 3px 2px 0;text-decoration:none;cursor:default;line-height:1.4;font-style:normal;border:1px solid var(--line)}
a.loc-btn{cursor:pointer}
a.loc-btn:hover{opacity:.8;text-decoration:none}
.loc-ch{background:rgba(95,130,114,0.22);color:#24402f}
.loc-sp{background:#edf9f2;color:#1a8c3e;border-color:rgba(29,185,84,0.35)}
.loc-yt{background:rgba(255,0,0,0.06);color:#b30000;border-color:rgba(255,0,0,0.2)}
.loc-ext{background:rgba(59,63,140,0.1);color:#2b2e66}
.loc-slide{background:rgba(217,164,65,0.24);color:#7a2e22}

@media(max-width:650px){
  .header-inner{display:block;padding:.8rem 0}
  .brand small{display:none}
  .primary-nav ul{margin-top:.4rem;gap:.1rem .8rem}
  .primary-nav a{padding:.45rem 0}
  /* Homepage schedule: hide the wide "Readings & Notes" column */
  .schedule-table th:nth-child(4),.schedule-table td:nth-child(4){display:none}
  /* Listening: hide the (usually empty) Keywords column */
  .track-table th:nth-child(3),.track-table td:nth-child(3){display:none}
}