*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --gold:     #F4C948;
      --gold-dim: #c9a030;
      --ink:      #0d0d0d;
      --paper:    #fafaf7;
      --paper2:   #f2f2ee;
      --text:     #1a1a1a;
      --muted:    #666660;
      --border:   #e0e0d8;
      --r:        8px;
    }
    html { scroll-behavior: smooth; }
    body { font-family: 'Inter', sans-serif; background: var(--paper); color: var(--text); line-height: 1.6; overflow-x: hidden; }
    :focus-visible { outline:3px solid var(--gold); outline-offset:3px; }

    /* ── NAV ───────────────────────────────────────────── */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 200;
      display: flex; align-items: center; justify-content: space-between;
      padding: 0 5vw; height: 58px;
      background: rgba(13,13,13,0.92);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(244,201,72,0.25);
      transition: background 0.3s;
    }
    .nav-logo {
      font-family:'Playfair Display',serif;
      font-size:1.25rem;
      color:var(--gold);
      text-decoration:none;
      letter-spacing:0.04em;
      font-style:italic;
    }
    .nav-logo-short { display:none; }
    .nav-links { display:flex; gap:2rem; list-style:none; }
    .nav-links a { color:#aaaaaa; text-decoration:none; font-size:0.78rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; transition:color 0.2s; }
    .nav-links a:hover { color:var(--gold); }
    .nav-cta { background:var(--gold); color:var(--ink); padding:0.45rem 1.1rem; border-radius:var(--r); font-size:0.78rem; font-weight:700; text-decoration:none; transition:background 0.2s; }
    .nav-cta:hover { background:#e8bc30; }
    .nav-student-btn { background:transparent; color:#aaaaaa; padding:0.45rem 1.1rem; border-radius:var(--r); font-size:0.78rem; font-weight:500; text-decoration:none; border:1px solid rgba(255,255,255,0.15); transition:all 0.2s; }
    .nav-student-btn:hover { color:#ffffff; border-color:rgba(255,255,255,0.4); }

    /* ── HERO ──────────────────────────────────────────── */
    .hero {
      position: relative;
      min-height: 100vh;
      display: grid;
      grid-template-columns: 1fr 1fr;
      overflow: hidden;
      background: var(--ink);
    }
    .hero-text-side {
      display: flex; flex-direction: column; justify-content: center;
      padding: 8rem 5vw 6rem;
      position: relative; z-index: 2;
    }
    .hero-img-side {
      position: relative; overflow: hidden;
    }
    .hero-slides { position:absolute; inset:0; background:#000000; }
    .hero-slide { position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease; }
    .hero-slide picture,
    .hero-slide img { display:block; width:100%; height:100%; }
    .hero-slide img { object-fit:cover; object-position:center top; }
    .hero-slide.active { opacity:1; }
    .slide-dots {
      position:absolute; bottom:2.5rem; left:0;
      display:flex; gap:8px; z-index:3;
      padding: 0 5vw;
    }
    .dot { width:6px; height:6px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,0.3); cursor:pointer; transition:all 0.3s; }
    .dot.active { background:var(--gold); width:20px; border-radius:3px; }
    .hero-img-fade {
      position:absolute; inset:0;
      background: linear-gradient(to right, var(--ink) 0%, rgba(13,13,13,0.5) 35%, transparent 60%);
      z-index: 1;
    }
    .hero-eyebrow {
      display: inline-block;
      font-size:0.7rem; font-weight:700; letter-spacing:0.22em; text-transform:uppercase;
      color:var(--gold); margin-bottom:1.4rem;
      border: 1px solid rgba(244,201,72,0.35);
      padding: 0.4rem 1rem; border-radius:20px;
      width: fit-content;
    }
    .hero-studio-name {
      font-family:'Playfair Display',serif;
      font-size: clamp(3.2rem, 6vw, 5.8rem);
      font-weight:700;
      font-style:italic;
      line-height:0.95;
      letter-spacing:-0.01em;
      margin-bottom:1.6rem;
      background: linear-gradient(
        90deg,
        #c9a030 0%,
        #F4C948 20%,
        #fffbe0 40%,
        #F4C948 60%,
        #c9a030 80%,
        #F4C948 100%
      );
      background-size: 200% auto;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      animation: shimmer 3s linear infinite;
    }
    @keyframes shimmer {
      0%   { background-position: 200% center; }
      100% { background-position: -200% center; }
    }
    .hero h1 {
      font-family:'Playfair Display',serif;
      font-size: clamp(1.4rem, 2.5vw, 2rem);
      color:rgba(255,255,255,0.75); line-height:1.3; margin-bottom:1.2rem;
      font-weight:400;
    }
    .hero h1 em { font-style:italic; color:var(--gold); }
    .hero-sub { font-size:1rem; color:rgba(255,255,255,0.65); max-width:440px; margin:0 0 2.4rem; line-height:1.75; }
    .hero-btns { display:flex; gap:1rem; flex-wrap:wrap; }
    .btn { display:inline-block; padding:0.75rem 1.8rem; border-radius:var(--r); font-size:0.88rem; font-weight:600; text-decoration:none; transition:all 0.2s; cursor:pointer; border:none; }
    .btn-gold { background:var(--gold); color:var(--ink); }
    .btn-gold:hover { background:#e8bc30; transform:translateY(-1px); box-shadow:0 6px 20px rgba(244,201,72,0.35); }
    .btn-ghost { background:transparent; color:#ffffff; border:1.5px solid rgba(255,255,255,0.35); }
    .btn-ghost:hover { border-color:var(--gold); color:var(--gold); }
    @media(max-width:720px){
      .hero { grid-template-columns:1fr; }
      .hero-img-side { height:115vw; min-height:360px; max-height:520px; background:var(--ink); }
      .hero-slide { background-color:var(--ink); }
      .hero-slide img { object-fit:contain; object-position:center; }
      .hero-img-fade {
        background:
          linear-gradient(to right, var(--ink) 0%, transparent 11%, transparent 89%, var(--ink) 100%),
          linear-gradient(to bottom, var(--ink) 0%, transparent 16%, transparent 82%, var(--ink) 100%);
      }
      .hero-text-side { padding: 6.2rem 5vw 4rem; }
      .hero-studio-name { font-size:clamp(2.7rem,13vw,3.2rem); margin-bottom:1.4rem; }
      .hero h1 { font-size:1.65rem; }
      .hero-sub { font-size:0.92rem; line-height:1.7; margin-bottom:2rem; }
      .hero-btns { display:grid; grid-template-columns:1fr 1fr; gap:0.75rem; }
      .hero-btns .btn { padding:0.75rem 0.65rem; text-align:center; }
    }
    @media(orientation:portrait) and (min-width:721px) and (max-width:1100px){
      .hero { grid-template-columns:1fr; min-height:0; }
      .hero-text-side { min-height:620px; padding:7rem 7vw 4.5rem; }
      .hero-img-side { height:min(90vw,720px); min-height:520px; max-height:720px; background:var(--ink); }
      .hero-slide { background-color:var(--ink); }
      .hero-slide img { object-fit:contain; object-position:center; }
      .hero-img-fade {
        background:
          linear-gradient(to right, var(--ink) 0%, transparent 11%, transparent 89%, var(--ink) 100%),
          linear-gradient(to bottom, var(--ink) 0%, transparent 16%, transparent 82%, var(--ink) 100%);
      }
    }

    /* ── GALLERY STRIP ─────────────────────────────────── */
    #gallery { background:var(--ink); padding:60px 0 50px; overflow:hidden; }
    .gallery-header { padding:0 5vw; margin-bottom:2rem; }
    .gallery-header .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.5rem; }
    .gallery-header h2 { font-family:'Playfair Display',serif; font-size:clamp(1.6rem,3vw,2.4rem); color:#ffffff; }
    .gallery-scroll {
      display:flex; gap:1rem; padding:0 5vw;
      overflow-x:auto; scroll-snap-type:x mandatory;
      scrollbar-width:none; cursor:grab;
      align-items:flex-end;
    }
    .gallery-scroll::-webkit-scrollbar { display:none; }
    .gallery-scroll.dragging { cursor:grabbing; }
    .gallery-item {
      flex-shrink:0; scroll-snap-align:start;
      border-radius:var(--r); overflow:hidden;
      position:relative; background:var(--ink);
      transition: width 0.3s ease, height 0.3s ease, transform 0.3s ease;
      transform-origin: bottom center;
    }
    .gallery-item picture { display:block; }
    .gallery-item img { display:block; height:280px; width:220px; object-fit:cover; object-position:center top; transition: width 0.3s ease, height 0.3s ease; }
    .gallery-item .caption {
      position:absolute; bottom:0; left:0; right:0;
      background:linear-gradient(to top, rgba(0,0,0,0.8), transparent);
      padding:1rem 0.8rem 0.6rem;
      font-size:0.72rem; color:rgba(255,255,255,0.7);
      opacity:0; transition:opacity 0.3s;
    }
    .gallery-item:hover .caption { opacity:1; }
    .gallery-hint { text-align:center; margin-top:1.2rem; font-size:0.72rem; color:rgba(255,255,255,0.3); letter-spacing:0.08em; }

    /* ── ABOUT ─────────────────────────────────────────── */
    #about { background:var(--ink); padding:90px 5vw; }
    .about-wrap { display:grid; grid-template-columns:1fr 1.2fr; gap:5rem; max-width:1200px; align-items:start; }
    .about-img-wrap { position:relative; }
    .about-img-wrap img { width:100%; border-radius:16px; display:block; box-shadow:0 20px 60px rgba(0,0,0,0.5); }
    .about-img-badge {
      position:absolute; bottom:-16px; right:-16px;
      background:var(--gold); color:var(--ink);
      padding:0.8rem 1.2rem; border-radius:var(--r);
      font-size:0.78rem; font-weight:700; text-align:center;
      box-shadow:0 4px 16px rgba(244,201,72,0.4);
    }
    .about-img-badge span { display:block; font-size:1.4rem; font-weight:700; line-height:1; margin-bottom:3px; }
    .about-text .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.8rem; }
    .about-text h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.6rem); color:#ffffff; line-height:1.2; margin-bottom:1.2rem; }
    .about-text p { font-size:0.95rem; color:#999999; line-height:1.85; margin-bottom:1rem; }
    .about-quote { border-left:3px solid var(--gold); padding:1rem 1.4rem; margin:1.5rem 0; font-family:'Playfair Display',serif; font-size:1.05rem; font-style:italic; color:#ddddcc; line-height:1.6; }
    .about-tags { display:flex; flex-wrap:wrap; gap:0.5rem; margin:1.2rem 0; }
    .about-tag {
      font-size:0.75rem; font-weight:600; padding:0.3rem 0.8rem;
      border-radius:20px;
      border-color:rgba(244,201,72,0.4); color:var(--gold); background:rgba(244,201,72,0.08);
      border: 1px solid rgba(244,201,72,0.4);
    }
    .about-tag.gold { border-color:rgba(244,201,72,0.4); color:var(--gold); background:rgba(244,201,72,0.08); }
    .about-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2rem; }
    .astat { text-align:center; padding:1rem; background:rgba(255,255,255,0.04); border-radius:var(--r); border:1px solid rgba(255,255,255,0.08); }
    .astat-n { font-family:'Playfair Display',serif; font-size:1.8rem; color:var(--gold); font-weight:700; line-height:1; }
    .astat-l { font-size:0.72rem; color:#777777; text-transform:uppercase; letter-spacing:0.08em; margin-top:3px; }

    /* ── CURRICULUM ────────────────────────────────────── */
    #curriculum { background:var(--ink); padding:90px 5vw; }
    #curriculum .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.8rem; }
    #curriculum h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:#ffffff; margin-bottom:0.8rem; }
    #curriculum > p { font-size:0.97rem; color:#888888; max-width:560px; line-height:1.8; margin-bottom:3rem; }
    .cur-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1.2rem; max-width:1100px; }
    .cur-card { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:var(--r); padding:1.5rem; transition:background 0.2s,border-color 0.2s; }
    .cur-card:hover { background:rgba(244,201,72,0.06); border-color:rgba(244,201,72,0.25); }
    .cur-wk { font-size:0.68rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:0.5rem; }
    .cur-title { font-family:'Playfair Display',serif; font-size:1.05rem; color:#ffffff; margin-bottom:0.5rem; }
    .cur-desc { font-size:0.82rem; color:#777777; line-height:1.6; }

    /* ── PROGRAMMES ────────────────────────────────────── */
    #programmes { background:var(--paper2); padding:90px 5vw; }
    #programmes .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:0.8rem; }
    #programmes h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--ink); margin-bottom:0.8rem; }
    .programmes-intro { font-size:0.97rem; color:var(--muted); max-width:620px; line-height:1.8; margin-bottom:2.5rem; }
    .programme-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; max-width:950px; }
    .programme-card { background:#ffffff; border:1px solid var(--border); border-radius:16px; padding:2rem; display:flex; flex-direction:column; }
    .programme-card.featured { background:var(--ink); border-color:rgba(244,201,72,0.35); }
    .programme-kicker { color:var(--gold-dim); font-size:0.68rem; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; margin-bottom:0.55rem; }
    .programme-card.featured .programme-kicker { color:var(--gold); }
    .programme-title { font-family:'Playfair Display',serif; font-size:1.55rem; color:var(--ink); margin-bottom:0.5rem; }
    .programme-card.featured .programme-title { color:#ffffff; }
    .programme-summary { font-size:0.86rem; color:var(--muted); line-height:1.65; margin-bottom:1.4rem; }
    .programme-card.featured .programme-summary { color:#999990; }
    .programme-list { list-style:none; display:flex; flex-direction:column; gap:0.75rem; margin-bottom:1.7rem; }
    .programme-list li { position:relative; padding-left:1.4rem; color:#4f4f49; font-size:0.83rem; line-height:1.5; }
    .programme-list li::before { content:'✓'; position:absolute; left:0; color:var(--gold-dim); font-weight:700; }
    .programme-card.featured .programme-list li { color:#c2c2b8; }
    .programme-card.featured .programme-list li::before { color:var(--gold); }
    .programme-pricing { margin-top:auto; margin-bottom:1rem; color:#777770; font-size:0.74rem; }
    .programme-card.featured .programme-pricing { color:#777770; }
    .programme-cta { display:block; border-radius:var(--r); padding:0.8rem 1rem; background:var(--ink); color:#ffffff; text-decoration:none; text-align:center; font-size:0.84rem; font-weight:700; }
    .programme-card.featured .programme-cta { background:var(--gold); color:var(--ink); }

    /* STUDENT RESULTS */
    #results { background:var(--ink); padding:90px 5vw; }
    #results .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.8rem; }
    #results h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:#ffffff; margin-bottom:0.8rem; }
    .results-intro { font-size:0.97rem; color:#8f8f88; max-width:650px; line-height:1.8; margin-bottom:2.5rem; }
    .student-work-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-bottom:3.5rem; }
    .student-work { position:relative; overflow:hidden; border-radius:14px; background:#181817; aspect-ratio:3/4; }
    .student-work picture { display:block; width:100%; height:100%; }
    .student-work img { width:100%; height:100%; display:block; object-fit:cover; transition:transform 0.35s ease; }
    .student-work:hover img { transform:scale(1.025); }
    .student-work figcaption { position:absolute; inset:auto 0 0; padding:2.5rem 1rem 0.9rem; background:linear-gradient(transparent,rgba(0,0,0,0.82)); color:#ffffff; font-size:0.72rem; letter-spacing:0.04em; display:flex; align-items:end; justify-content:space-between; gap:0.75rem; }
    .student-work-age { color:var(--gold); font-size:0.66rem; font-weight:700; white-space:nowrap; text-transform:uppercase; }
    .testimonial-heading { font-family:'Playfair Display',serif; font-size:clamp(1.45rem,2.6vw,2rem); color:#ffffff; margin-bottom:1.4rem; }
    .testimonial-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
    .testimonial-card { border:1px solid rgba(255,255,255,0.1); border-radius:14px; padding:1.6rem; background:rgba(255,255,255,0.035); }
    .testimonial-card blockquote { color:#d2d2ca; font-family:'Playfair Display',serif; font-size:1rem; line-height:1.75; margin-bottom:1rem; }
    .testimonial-card blockquote::before { content:'“'; color:var(--gold); font-size:2rem; line-height:0; vertical-align:-0.35em; margin-right:0.2rem; }
    .testimonial-card cite { color:var(--gold); font-size:0.72rem; font-style:normal; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; }

    /* ── VIDEO LIBRARY ─────────────────────────────────── */
    #videos { background:var(--paper); padding:90px 5vw; }
    #videos .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:0.8rem; }
    #videos h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--ink); margin-bottom:0.8rem; }
    #videos > p { font-size:0.97rem; color:var(--muted); max-width:560px; line-height:1.8; margin-bottom:2rem; }
    .pw-gate { max-width:440px; background:#ffffff; border:1px solid var(--border); border-radius:var(--r); padding:2.5rem 2rem; text-align:center; }
    .pw-gate h3 { font-family:'Playfair Display',serif; font-size:1.25rem; color:var(--ink); margin-bottom:0.5rem; }
    .pw-gate p.pw-desc { font-size:0.88rem; color:var(--muted); margin-bottom:1.8rem; line-height:1.6; }
    .google-btn {
      display:inline-flex; align-items:center; gap:0.75rem;
      background:#ffffff; border:1.5px solid #dddddd;
      border-radius:var(--r); padding:0.7rem 1.4rem;
      font-size:0.92rem; font-weight:500; color:#3c3c3c;
      cursor:pointer; transition:box-shadow 0.2s, border-color 0.2s;
      font-family:'Inter',sans-serif;
    }
    .google-btn:hover { box-shadow:0 2px 12px rgba(0,0,0,0.12); border-color:#bbbbbb; }
    .google-btn svg { width:20px; height:20px; flex-shrink:0; }
    .pw-err { font-size:0.82rem; color:#c0392b; margin-top:1rem; display:none; line-height:1.5; }
    .pw-loading { font-size:0.82rem; color:var(--muted); margin-top:1rem; display:none; }
    .pw-welcome { font-size:0.82rem; color:#1a7a1a; margin-top:1rem; display:none; font-weight:500; }
    .pw-user-info { display:flex; align-items:center; gap:0.75rem; margin-top:1.2rem; padding:0.8rem 1rem; background:var(--paper2); border-radius:var(--r); display:none; }
    .pw-avatar { width:36px; height:36px; border-radius:50%; object-fit:cover; }
    .pw-user-name { font-size:0.88rem; font-weight:500; color:var(--ink); text-align:left; }
    .pw-user-email { font-size:0.75rem; color:var(--muted); text-align:left; }
    .pw-signout { font-size:0.75rem; color:var(--muted); text-decoration:underline; cursor:pointer; margin-top:0.6rem; display:none; }
    .vid-lib { display:none; }
    .vid-lib.open { display:block; }
    .vid-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.5rem; flex-wrap:wrap; gap:0.5rem; }
    .vid-user-chip { display:flex; align-items:center; gap:0.5rem; background:#f5f5f0; border:1px solid var(--border); border-radius:20px; padding:0.3rem 0.8rem 0.3rem 0.4rem; }
    .vid-user-chip img { width:24px; height:24px; border-radius:50%; }
    .vid-user-chip span { font-size:0.78rem; color:var(--muted); }
    .vid-signout-btn { font-size:0.75rem; color:var(--muted); background:none; border:none; cursor:pointer; text-decoration:underline; }
    .materials-resource { max-width:1100px; margin:1.25rem 0 0; padding:1rem 1.1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; background:#fffaf0; border:1px solid rgba(139,116,22,0.28); border-radius:var(--r); }
    .materials-resource-copy { display:flex; align-items:center; gap:0.85rem; }
    .materials-resource-icon { width:40px; height:40px; flex:0 0 40px; display:flex; align-items:center; justify-content:center; color:var(--gold-dim); background:rgba(244,201,72,0.2); border-radius:10px; }
    .materials-resource-icon svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
    .materials-resource-title { color:var(--ink); font-size:0.88rem; font-weight:700; margin-bottom:0.2rem; }
    .materials-resource-desc { color:var(--muted); font-size:0.76rem; line-height:1.45; }
    .materials-resource-link { flex-shrink:0; padding:0.62rem 0.9rem; color:var(--ink); background:var(--gold); border-radius:7px; font-size:0.76rem; font-weight:700; text-decoration:none; transition:background 0.2s, transform 0.2s; }
    .materials-resource-link:hover { background:#e7ba32; transform:translateY(-1px); }
    .library-chooser { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem; max-width:1100px; margin:1.7rem 0 2rem; }
    .library-choice { position:relative; min-height:150px; overflow:hidden; display:flex; align-items:center; justify-content:center; padding:1.5rem 4.75rem; border:1px solid rgba(244,201,72,0.3); border-radius:16px; background:var(--ink); color:#ffffff; text-align:center; cursor:pointer; box-shadow:0 12px 30px rgba(17,17,15,0.12); transition:border-color 0.2s,box-shadow 0.2s,transform 0.2s,background 0.2s; }
    .library-choice::before { content:''; position:absolute; inset:0 auto auto 0; width:100%; height:3px; background:var(--gold); }
    .library-choice-index { position:absolute; top:1.25rem; left:1.5rem; color:var(--gold); font-size:0.68rem; font-weight:700; letter-spacing:0.16em; }
    .library-choice-title { font-family:'Playfair Display',serif; font-size:clamp(1.35rem,2.5vw,1.8rem); line-height:1.15; }
    .library-choice-arrow { position:absolute; top:50%; right:1.5rem; width:34px; height:34px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(244,201,72,0.5); border-radius:50%; color:var(--gold); transform:translateY(-50%); transition:background 0.2s,color 0.2s,transform 0.2s; }
    .library-choice-arrow svg { width:16px; height:16px; display:block; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
    .library-choice:hover { border-color:var(--gold); box-shadow:0 16px 36px rgba(17,17,15,0.2); transform:translateY(-3px); }
    .library-choice:hover .library-choice-arrow { background:var(--gold); color:var(--ink); transform:translate(2px,-50%); }
    .library-choice.active { border-color:var(--gold); background:#20201d; box-shadow:inset 0 0 0 1px rgba(244,201,72,0.35),0 16px 36px rgba(17,17,15,0.2); }
    .library-content[hidden] { display:none; }
    .course-progress { max-width:1100px; margin:1.4rem 0 0.5rem; padding:1rem 1.2rem; background:#ffffff; border:1px solid var(--border); border-radius:var(--r); }
    .course-progress-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:0.65rem; }
    .course-progress-title { color:var(--ink); font-size:0.82rem; font-weight:700; }
    .course-progress-count { color:var(--muted); font-size:0.75rem; }
    .course-progress-track { height:8px; overflow:hidden; background:#e8e8e1; border-radius:999px; }
    .course-progress-fill { width:0; height:100%; background:var(--gold-dim); border-radius:inherit; transition:width 0.35s ease; }
    .course-progress-status { min-height:1.2em; margin-top:0.55rem; color:var(--muted); font-size:0.72rem; }
    .course-progress-status.error { color:#a6281d; }
    .vid-lib { display:none; }
    .vid-lib.open { display:block; }
    .ep-lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted); margin:2.5rem 0 1rem; padding-bottom:0.5rem; border-bottom:1px solid var(--border); }
    .ep-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.2rem; max-width:1100px; }
    .ep-card { background:#ffffff; border:1px solid var(--border); border-radius:var(--r); overflow:hidden; transition:box-shadow 0.2s,transform 0.2s; cursor:pointer; }
    .ep-card:hover { box-shadow:0 8px 30px rgba(0,0,0,0.12); transform:translateY(-2px); }
    .ep-card.completed { border-color:rgba(139,116,22,0.55); }
    .ep-thumb {
      width:100%; aspect-ratio:16/9; background:var(--ink); position:relative; overflow:hidden;
    }
    .ep-thumb-img {
      width:100%; height:100%; object-fit:cover; display:block;
      transition:transform 0.4s ease;
    }
    .ep-card:hover .ep-thumb-img { transform:scale(1.04); }
    .ep-thumb-overlay {
      position:absolute; inset:0;
      background:rgba(0,0,0,0.35);
      display:flex; align-items:center; justify-content:center;
      transition:background 0.3s;
    }
    .ep-card:hover .ep-thumb-overlay { background:rgba(0,0,0,0.18); }
    .ep-play-btn {
      width:52px; height:52px; border-radius:50%;
      background:var(--gold); display:flex; align-items:center; justify-content:center;
      transition:transform 0.2s, box-shadow 0.2s;
      box-shadow:0 4px 20px rgba(0,0,0,0.4);
    }
    .ep-card:hover .ep-play-btn { transform:scale(1.1); box-shadow:0 6px 28px rgba(244,201,72,0.5); }
    .ep-play-btn svg { width:20px; height:20px; fill:var(--ink); margin-left:3px; }
    .ep-badge { position:absolute; top:10px; left:10px; background:var(--gold); color:var(--ink); font-size:0.68rem; font-weight:700; padding:3px 8px; border-radius:4px; z-index:2; }
    .ep-track { position:absolute; top:10px; right:10px; background:rgba(0,0,0,0.7); color:#ffffff; font-size:0.65rem; font-weight:600; padding:3px 8px; border-radius:4px; z-index:2; }
    .ep-body { padding:1rem 1.2rem; }
    .ep-num { font-size:0.68rem; font-weight:700; color:var(--gold-dim); letter-spacing:0.1em; text-transform:uppercase; margin-bottom:0.3rem; }
    .ep-title { font-size:0.9rem; font-weight:600; color:var(--ink); line-height:1.4; margin-bottom:0.4rem; }
    .ep-dur { font-size:0.78rem; color:var(--muted); }
    .ep-complete-btn { margin-top:0.65rem; padding:0.4rem 0.7rem; border:1px solid #d7d7cf; border-radius:6px; background:var(--paper); color:var(--muted); font:inherit; font-size:0.72rem; font-weight:600; cursor:pointer; }
    .ep-complete-btn:hover { border-color:var(--gold-dim); color:var(--ink); }
    .ep-complete-btn.completed { background:rgba(244,201,72,0.2); border-color:var(--gold-dim); color:#5f4d0a; }
    @media (max-width:650px) {
      .library-chooser { grid-template-columns:1fr; }
      .library-choice { min-height:104px; padding:1.2rem 4rem; }
      .library-choice-index { top:1rem; left:1.2rem; }
      .library-choice-arrow { right:1.2rem; }
      .materials-resource { align-items:stretch; flex-direction:column; }
      .materials-resource-link { text-align:center; }
    }

    /* ── MODAL PLAYER ──────────────────────────────────── */
    .modal-overlay {
      position:fixed; inset:0; z-index:1000;
      background:rgba(0,0,0,0.96);
      display:flex; flex-direction:column; align-items:center; justify-content:center;
      opacity:0; visibility:hidden; pointer-events:none;
      transition:opacity 0.3s;
    }
    .modal-overlay.open { opacity:1; visibility:visible; pointer-events:all; }
    .modal-header {
      width:100%; max-width:900px;
      display:flex; justify-content:space-between; align-items:flex-start;
      padding:1.2rem 1.5rem 0.8rem;
    }
    .modal-ep { font-size:0.7rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold); margin-bottom:0.3rem; }
    .modal-title { font-family:'Playfair Display',serif; font-size:1.1rem; color:#ffffff; line-height:1.4; max-width:700px; }
    .modal-close {
      background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.15);
      color:#ffffff; width:36px; height:36px; border-radius:50%;
      font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center;
      flex-shrink:0; margin-left:1rem; transition:background 0.2s;
    }
    .modal-close:hover { background:rgba(255,255,255,0.18); }
    .modal-player {
      width:100%; max-width:900px;
      background:#000;
      position:relative;
    }
    .modal-video-stage {
      width:100%;
      aspect-ratio:16/9;
      background:#000;
      position:relative;
      overflow:hidden;
    }
    .modal-video-stage iframe {
      width:100%; height:100%; border:none; display:block; pointer-events:none;
    }
    .modal-center-play-feedback {
      position:absolute;
      left:50%;
      top:50%;
      z-index:3;
      width:68px;
      height:68px;
      border-radius:50%;
      display:flex;
      align-items:center;
      justify-content:center;
      background:rgba(0,0,0,0.68);
      color:#ffffff;
      font-size:1.7rem;
      opacity:0;
      transform:translate(-50%,-50%) scale(0.86);
      transition:opacity 0.18s, transform 0.18s;
      pointer-events:none;
    }
    .modal-center-play-feedback.is-visible {
      opacity:1;
      transform:translate(-50%,-50%) scale(1);
    }
    .modal-fullscreen-btn {
      position:absolute;
      top:12px;
      right:12px;
      z-index:3;
      width:40px;
      height:40px;
      border:1px solid rgba(255,255,255,0.35);
      border-radius:7px;
      background:rgba(0,0,0,0.72);
      color:#ffffff;
      font-size:1.25rem;
      line-height:1;
      cursor:pointer;
      transition:opacity 0.2s, background 0.2s;
    }
    .modal-fullscreen-btn:hover { background:rgba(0,0,0,0.92); }
    .modal-player-controls {
      position:relative;
      min-height:58px;
      display:flex;
      align-items:center;
      gap:0.7rem;
      padding:0.7rem 0.85rem;
      background:#101010;
      border-top:1px solid rgba(255,255,255,0.12);
      max-height:120px;
      overflow:hidden;
      transition:opacity 0.2s, transform 0.2s, max-height 0.25s, min-height 0.25s, padding 0.25s, border-color 0.25s;
    }
    .modal-player.is-controls-hidden .modal-player-controls {
      min-height:0;
      max-height:0;
      padding-top:0;
      padding-bottom:0;
      border-top-color:transparent;
      opacity:0;
      transform:translateY(8px);
      pointer-events:none;
    }
    .modal-player.is-controls-hidden .modal-fullscreen-btn { opacity:0; pointer-events:none; }
    .modal-player-control-btn {
      flex:0 0 auto;
      min-width:42px;
      height:38px;
      padding:0 0.65rem;
      border:1px solid rgba(255,255,255,0.3);
      border-radius:6px;
      background:rgba(255,255,255,0.1);
      color:#ffffff;
      font:inherit;
      font-size:0.85rem;
      font-weight:600;
      cursor:pointer;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      touch-action:manipulation;
      -webkit-tap-highlight-color:transparent;
    }
    .modal-player-control-btn:hover { background:rgba(255,255,255,0.2); }
    .modal-sound-icon { width:21px; height:21px; display:block; }
    .modal-sound-icon-off { display:none; }
    .modal-player-control-btn.is-muted .modal-sound-icon-on { display:none; }
    .modal-player-control-btn.is-muted .modal-sound-icon-off { display:block; }
    .modal-volume-control { flex:0 0 auto; display:flex; align-items:center; gap:0.45rem; }
    .modal-volume-slider { width:82px; accent-color:var(--gold); cursor:pointer; }
    .modal-captions-btn { color:#858585; }
    .modal-captions-btn.is-active { color:#ffffff; background:rgba(255,255,255,0.18); }
    .modal-captions-btn:disabled { color:#555555; cursor:not-allowed; opacity:0.65; }
    .modal-player-seek { flex:1 1 auto; min-width:80px; accent-color:var(--gold); cursor:pointer; }
    .modal-player-time { flex:0 0 auto; min-width:92px; color:#ffffff; font-size:0.72rem; text-align:center; font-variant-numeric:tabular-nums; }
    .modal-player-speed {
      flex:0 0 auto;
      height:38px;
      padding:0 0.45rem;
      border:1px solid rgba(255,255,255,0.3);
      border-radius:6px;
      background:#202020;
      color:#ffffff;
      font:inherit;
      font-size:0.78rem;
      font-weight:600;
      cursor:pointer;
    }
    .modal-player:fullscreen,
    .modal-player:-webkit-full-screen {
      width:100%;
      height:100%;
      max-width:none;
      display:flex;
      flex-direction:column;
    }
    .modal-player:fullscreen .modal-video-stage,
    .modal-player:-webkit-full-screen .modal-video-stage {
      flex:1 1 auto;
      min-height:0;
      aspect-ratio:auto;
    }
    .modal-footer {
      width:100%; max-width:900px;
      padding:0.8rem 1.5rem;
      display:flex; align-items:center; justify-content:space-between; gap:1rem;
    }
    .modal-studio { font-size:0.75rem; color:rgba(255,255,255,0.3); letter-spacing:0.05em; }
    .modal-studio span { color:var(--gold); }
    .modal-actions { display:flex; align-items:center; gap:0.6rem; }
    .modal-complete-btn { padding:0.55rem 0.9rem; border:1px solid rgba(255,255,255,0.25); border-radius:6px; background:rgba(255,255,255,0.08); color:#ffffff; font:inherit; font-size:0.75rem; font-weight:600; cursor:pointer; }
    .modal-complete-btn.completed { background:var(--gold); border-color:var(--gold); color:var(--ink); }
    .modal-next-btn { padding:0.55rem 0.9rem; border:1px solid var(--gold); border-radius:6px; background:var(--gold); color:var(--ink); font:inherit; font-size:0.75rem; font-weight:700; cursor:pointer; }
    .modal-next-btn:disabled { border-color:rgba(255,255,255,0.15); background:rgba(255,255,255,0.06); color:rgba(255,255,255,0.38); cursor:not-allowed; }

    /* ── HOW ───────────────────────────────────────────── */
    #how { background:var(--ink); padding:90px 5vw; }
    #how .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.8rem; }
    #how h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:#ffffff; margin-bottom:3rem; }
    .steps { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:1.2rem; max-width:1000px; }
    .step { padding:1.5rem; border:1px solid rgba(255,255,255,0.07); border-radius:var(--r); background:rgba(255,255,255,0.02); }
    .step-n { font-family:'Playfair Display',serif; font-size:2.2rem; color:var(--gold); line-height:1; margin-bottom:0.8rem; }
    .step-t { font-size:0.88rem; font-weight:600; color:#ffffff; margin-bottom:0.4rem; }
    .step-d { font-size:0.82rem; color:#777777; line-height:1.6; }

    /* FAQ */
    #faq { background:var(--paper2); padding:90px 5vw; }
    #faq .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:0.8rem; }
    #faq h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--ink); margin-bottom:0.8rem; }
    .faq-intro { max-width:620px; margin-bottom:2.2rem; color:var(--muted); font-size:0.95rem; line-height:1.75; }
    .faq-list { display:grid; gap:0.7rem; max-width:900px; }
    .faq-item { background:#ffffff; border:1px solid var(--border); border-radius:var(--r); overflow:hidden; }
    .faq-item summary { position:relative; padding:1.1rem 3rem 1.1rem 1.2rem; color:var(--ink); font-size:0.9rem; font-weight:600; line-height:1.5; cursor:pointer; list-style:none; }
    .faq-item summary::-webkit-details-marker { display:none; }
    .faq-item summary::after { content:'+'; position:absolute; top:50%; right:1.2rem; transform:translateY(-50%); color:var(--gold-dim); font-size:1.4rem; font-weight:400; }
    .faq-item[open] summary::after { content:'-'; }
    .faq-item p { padding:0 1.2rem 1.2rem; color:var(--muted); font-size:0.84rem; line-height:1.7; }
    .faq-materials-link { display:inline-block; margin-top:0.65rem; color:var(--gold-dim); font-weight:700; text-decoration:none; }
    .faq-materials-link:hover { text-decoration:underline; }

    /* ── CONTACT ───────────────────────────────────────── */
    #contact { background:var(--paper); padding:90px 5vw; }
    #contact .lbl { font-size:0.7rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:0.8rem; }
    #contact h2 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--ink); margin-bottom:2.5rem; }
    .contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; max-width:900px; align-items:start; }
    .c-detail { display:flex; flex-direction:column; gap:1.3rem; }
    .c-item-l { font-size:0.68rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--muted); margin-bottom:0.25rem; }
    .c-item-v { font-size:0.97rem; font-weight:500; color:var(--ink); line-height:1.6; }
    .c-item-v a { color:var(--gold-dim); text-decoration:none; }
    .c-item-v a:hover { text-decoration:underline; }
    .enrol-box { background:var(--ink); border-radius:var(--r); padding:2.2rem; text-align:center; }
    .enrol-box h3 { font-family:'Playfair Display',serif; font-size:1.4rem; color:#ffffff; margin-bottom:0.6rem; }
    .enrol-box p { font-size:0.88rem; color:#777777; margin-bottom:1.6rem; line-height:1.7; }
    .enrol-box small { display:block; margin-top:1rem; font-size:0.75rem; color:#444444; }
    .contact-layout { display:grid; grid-template-columns:minmax(240px,0.7fr) minmax(0,1.3fr); gap:1.5rem; max-width:1040px; align-items:start; }
    .registration-card { background:#ffffff; border:1px solid var(--border); border-radius:16px; padding:2.5rem; box-shadow:0 16px 45px rgba(0,0,0,0.06); }
    #registration { scroll-margin-top:74px; }
    .registration-card h3 { font-family:'Playfair Display',serif; font-size:1.55rem; color:var(--ink); line-height:1.25; margin-bottom:0.5rem; }
    .registration-intro { font-size:0.85rem; color:var(--muted); line-height:1.65; margin-bottom:1.8rem; }
    .registration-form { display:grid; grid-template-columns:1fr 1fr; gap:1rem 1.2rem; }
    .registration-form[hidden] { display:none; }
    .form-field { display:flex; flex-direction:column; gap:0.4rem; }
    .form-field.full { grid-column:1 / -1; }
    .form-field label, .form-legend { font-size:0.75rem; font-weight:600; color:var(--ink); line-height:1.4; }
    .required-mark { color:#a6281d; }
    .form-field input, .form-field select, .form-field textarea {
      width:100%; border:1px solid #d7d7cf; border-radius:6px; background:var(--paper);
      color:var(--ink); font:inherit; font-size:0.85rem; padding:0.72rem 0.8rem;
      outline:none; transition:border-color 0.2s,box-shadow 0.2s,background 0.2s;
    }
    .form-field textarea { min-height:92px; resize:vertical; }
    .form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color:var(--gold-dim); box-shadow:0 0 0 3px rgba(244,201,72,0.18); background:#ffffff; }
    .form-field input::placeholder, .form-field textarea::placeholder { color:#a0a09a; }
    .form-field input[readonly] { background:#ecebe5; color:#575750; cursor:not-allowed; }
    .form-options { display:grid; grid-template-columns:1fr 1fr; gap:0.55rem 1rem; margin-top:0.15rem; }
    .form-option { display:flex; align-items:flex-start; gap:0.55rem; font-size:0.78rem; color:#4d4d48; line-height:1.45; cursor:pointer; }
    .form-option input { width:16px; height:16px; margin-top:2px; accent-color:var(--gold-dim); flex:0 0 auto; }
    .consent-options { display:flex; flex-direction:column; gap:0.65rem; }
    .registration-verify { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem; border:1px solid #d7d7cf; border-radius:10px; background:var(--paper); }
    .registration-verify-copy { min-width:0; }
    .registration-verify-title { margin:0 0 0.2rem; color:var(--ink); font-size:0.8rem; font-weight:700; }
    .registration-verify-text { margin:0; color:var(--muted); font-size:0.72rem; line-height:1.5; }
    .registration-verify-btn { flex:0 0 auto; border:1px solid #c9c7bf; border-radius:8px; padding:0.7rem 0.9rem; background:#ffffff; color:var(--ink); font:inherit; font-size:0.76rem; font-weight:700; cursor:pointer; }
    .registration-verify-btn:hover { border-color:var(--gold-dim); }
    .registration-identity { grid-column:1 / -1; display:flex; align-items:center; gap:0.7rem; padding:0.8rem 1rem; border:1px solid #b9dfc1; border-radius:10px; background:#eaf7ed; }
    .registration-identity[hidden], .registration-verify[hidden] { display:none; }
    .registration-identity img { width:34px; height:34px; border-radius:50%; background:#ffffff; }
    .registration-identity-copy { min-width:0; flex:1; }
    .registration-identity-label { margin:0 0 0.1rem; color:#185f2b; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.07em; }
    .registration-identity-email { margin:0; color:#185f2b; font-size:0.78rem; overflow-wrap:anywhere; }
    .registration-change-account { border:0; background:none; color:#185f2b; padding:0.3rem; font:inherit; font-size:0.7rem; text-decoration:underline; cursor:pointer; }
    .registration-submit { grid-column:1 / -1; margin-top:0.4rem; background:var(--ink); color:#ffffff; border:0; border-radius:var(--r); padding:0.9rem 1.4rem; font:inherit; font-size:0.9rem; font-weight:700; cursor:pointer; transition:background 0.2s,transform 0.2s; }
    .registration-submit:hover { background:#262626; transform:translateY(-1px); }
    .registration-submit:disabled { opacity:0.65; cursor:wait; transform:none; }
    .registration-status { display:none; grid-column:1 / -1; border-radius:var(--r); padding:0.9rem 1rem; font-size:0.82rem; line-height:1.5; }
    .registration-status.success { display:block; color:#185f2b; background:#eaf7ed; border:1px solid #b9dfc1; }
    .registration-status.error { display:block; color:#8b2018; background:#fff0ee; border:1px solid #e8c0bc; }
    .registration-note { grid-column:1 / -1; font-size:0.7rem; color:#888880; line-height:1.5; text-align:center; }
    .registration-note a { color:var(--gold-dim); }
    .privacy-details { grid-column:1 / -1; border-top:1px solid var(--border); padding-top:0.8rem; color:#777770; font-size:0.72rem; line-height:1.55; }
    .privacy-details summary { color:var(--ink); font-weight:600; cursor:pointer; width:fit-content; margin:0 auto; }
    .privacy-details p { margin-top:0.7rem; }
    .privacy-details a { color:var(--gold-dim); }
    .registration-confirmation { text-align:center; padding:1rem 0 0.25rem; scroll-margin-top:82px; }
    .registration-confirmation[hidden] { display:none; }
    .confirmation-mark { width:64px; height:64px; border-radius:50%; margin:0 auto 1.2rem; display:flex; align-items:center; justify-content:center; background:#eaf7ed; color:#185f2b; border:1px solid #b9dfc1; font-size:1.8rem; font-weight:700; }
    .registration-confirmation .lbl { margin-bottom:0.65rem; }
    .registration-confirmation h3 { margin-bottom:0.8rem; }
    .confirmation-summary { color:var(--muted); font-size:0.88rem; line-height:1.7; max-width:540px; margin:0 auto 1.6rem; }
    .confirmation-steps { text-align:left; background:var(--paper); border:1px solid var(--border); border-radius:var(--r); padding:1.2rem 1.3rem; margin-bottom:1.4rem; }
    .confirmation-steps h4 { color:var(--ink); font-size:0.8rem; margin-bottom:0.8rem; }
    .confirmation-steps ol { margin:0; padding-left:1.2rem; display:flex; flex-direction:column; gap:0.65rem; }
    .confirmation-steps li { color:#5f5f59; font-size:0.78rem; line-height:1.5; padding-left:0.25rem; }
    .confirmation-contact { font-size:0.75rem; color:#777770; line-height:1.6; margin-bottom:1.3rem; }
    .confirmation-contact a { color:var(--gold-dim); font-weight:600; }
    .confirmation-actions { display:flex; align-items:center; justify-content:center; gap:0.75rem; flex-wrap:wrap; }
    .confirmation-primary, .confirmation-secondary { border-radius:var(--r); padding:0.78rem 1rem; font:inherit; font-size:0.8rem; font-weight:700; cursor:pointer; text-decoration:none; }
    .confirmation-primary { background:var(--ink); color:#ffffff; border:1px solid var(--ink); }
    .confirmation-secondary { background:transparent; color:var(--ink); border:1px solid #cfcfc7; }

    /* ── FOOTER ────────────────────────────────────────── */
    footer { background:var(--ink); border-top:1px solid #1a1a1a; padding:2rem 5vw; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
    .f-logo { font-family:'Playfair Display',serif; color:var(--gold); font-size:1rem; }
    .f-copy { font-size:0.75rem; color:#444444; }

    /* ── RESPONSIVE ────────────────────────────────────── */
    @media(max-width:720px){
      nav { height:58px; padding:0 4vw; gap:0.45rem; }
      .nav-logo { font-size:1.05rem; white-space:nowrap; flex-shrink:0; }
      .nav-logo-full { display:none; }
      .nav-logo-short { display:inline; }
      nav > div { gap:0.4rem !important; margin-left:auto; }
      .nav-student-btn,.nav-cta { padding:0.4rem 0.62rem; font-size:0.68rem; white-space:nowrap; }
      .about-wrap,.contact-grid{grid-template-columns:1fr;gap:2.5rem;}
      .programme-grid{grid-template-columns:1fr;}
      .student-work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0.65rem;}
      .testimonial-grid{grid-template-columns:1fr;}
      .contact-layout,.registration-form{grid-template-columns:1fr;}
      .form-field.full,.registration-submit,.registration-status,.registration-note{grid-column:1;}
      .registration-card{padding:1.5rem;}
      .registration-verify{align-items:stretch;flex-direction:column;}
      .registration-verify-btn{width:100%;}
      .registration-identity{align-items:flex-start;flex-wrap:wrap;}
      .form-options{grid-template-columns:1fr;}
      .about-stats{grid-template-columns:repeat(2,1fr);}
      .nav-links{display:none;}
      .pw-row{flex-direction:column;}
      .about-img-badge{right:0;bottom:-12px;}
      .modal-player-controls{display:grid;grid-template-columns:40px minmax(106px,1fr) 40px 64px;gap:0.45rem;padding:0.55rem 0.6rem;}
      .modal-player-seek{grid-column:1/4;grid-row:1;width:100%;}
      .modal-player-time{display:block;grid-column:4;grid-row:1;min-width:72px;font-size:0.66rem;}
      .modal-player-control-btn{min-width:40px;padding:0 0.5rem;font-size:0.75rem;}
      .modal-volume-control{gap:0.3rem;}
      .modal-volume-slider{width:62px;}
      .modal-player-speed{width:64px;min-width:64px;max-width:64px;justify-self:end;padding:0 0.3rem;}
      .modal-footer{align-items:flex-start;flex-direction:column;}
      .modal-actions{width:100%;}
      .modal-complete-btn,.modal-next-btn{flex:1;}
    }
    @media(prefers-reduced-motion:reduce){
      html { scroll-behavior:auto; }
      *,*::before,*::after { animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
    }

/* Public lesson previews */
.public-preview { margin-bottom:2.5rem; }
.public-preview .ep-grid { grid-template-columns:repeat(5,minmax(0,1fr)); max-width:1400px; }
@media (max-width:1199px) {
  .public-preview .ep-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:850px) {
  .public-preview .ep-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:550px) {
  .public-preview .ep-grid { grid-template-columns:minmax(0,1fr); }
}
.preview-card { display:flex; flex-direction:column; justify-content:flex-start; align-items:stretch; width:100%; min-width:0; padding:0; text-align:left; font:inherit; }
.preview-card .ep-thumb { flex:none; }
.preview-card .ep-thumb, .preview-card .ep-body, .preview-card .ep-num,
.preview-card .ep-title, .preview-card .ep-dur { display:block; }
.preview-card:focus-visible { outline:3px solid var(--gold-dim); outline-offset:5px; }
.preview-note { margin-top:1.2rem; color:var(--muted); font-size:0.88rem; line-height:1.7; }
.enrol-dialog { margin:auto; width:min(520px, calc(100% - 2rem)); max-height:90dvh; overflow:auto; padding:2.5rem; border:0; border-radius:var(--r); background:var(--paper); color:var(--ink); }
.enrol-dialog::backdrop { background:rgba(0,0,0,0.75); }
.enrol-dialog h3 { font-family:'Playfair Display',serif; font-size:1.8rem; margin-bottom:1rem; }
.enrol-dialog > p:not(.lbl) { color:var(--muted); line-height:1.8; margin-bottom:1.5rem; }
.enrol-dialog-close { float:right; border:0; background:transparent; color:var(--ink); font-size:1.3rem; cursor:pointer; padding:0.25rem; }
.modal-complete-btn[hidden] { display:none; }

/* Navigation and learning path */
.nav-menu-toggle { display:none; }
nav a { white-space:nowrap; }
#pwGate, #registration { scroll-margin-top:90px; }
.curriculum-topic { max-width:1100px; border-bottom:1px solid rgba(255,255,255,0.16); }
.curriculum-topic > summary { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.35rem 0; cursor:pointer; list-style:none; }
.curriculum-topic > summary::-webkit-details-marker { display:none; }
.curriculum-topic > summary:focus-visible { outline:2px solid var(--gold); outline-offset:5px; border-radius:4px; }
.curriculum-topic > summary:hover .curriculum-group { color:#fff; }
.curriculum-group { font-family:'Inter',sans-serif; font-size:clamp(1.1rem,2.2vw,1.4rem); font-weight:700; line-height:1.4; color:var(--gold); margin:0; }
.curriculum-toggle { position:relative; flex:0 0 24px; height:24px; color:var(--gold); }
.curriculum-toggle::before, .curriculum-toggle::after { content:""; position:absolute; background:currentColor; top:11px; left:4px; width:16px; height:2px; }
.curriculum-toggle::after { transform:rotate(90deg); }
.curriculum-topic[open] > summary .curriculum-toggle::after { transform:rotate(0); }
.curriculum-topic > .cur-grid { padding-bottom:1.5rem; }
.player-status { color:white; text-align:center; padding:0.5rem 1rem; }
#playerRetry[hidden] { display:none; }
@media(max-width:1100px) {
  .nav-logo-full { display:none; }
  .nav-logo-short { display:inline; }
  .nav-menu-toggle { display:block; border:1px solid #777; border-radius:6px; padding:0.45rem 0.6rem; background:transparent; color:white; cursor:pointer; margin-left:auto; }
  .nav-links { display:none; position:absolute; top:100%; left:0; right:0; background:var(--ink); padding:1.2rem 5vw; border-top:1px solid #444; }
  .nav-links.menu-open { display:flex; flex-direction:column; gap:1.2rem; }
}
@media(max-width:380px) {
  .nav-logo { font-size:0.85rem; }
  .nav-student-btn,.nav-cta,.nav-menu-toggle { padding:0.4rem; font-size:0.65rem; }
}

#curriculum .cur-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media(max-width:900px) { #curriculum .cur-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:550px) { #curriculum .cur-grid { grid-template-columns:minmax(0,1fr); } }

/* A compact welcome for each learner */
.learner-section { padding:3rem 5vw; background:var(--paper2); }
.learner-section > h2 { font-family:'Playfair Display',serif; font-size:clamp(1.5rem,3vw,2rem); margin-bottom:1.5rem; }
.learner-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; max-width:1100px; }
.learner-grid h3 { font-size:1rem; margin-bottom:0.5rem; }
.learner-grid p { font-size:0.9rem; color:var(--muted); line-height:1.75; }
#guardianField[hidden] { display:none; }
@media(max-width:700px) { .learner-grid { grid-template-columns:1fr; gap:1.25rem; } }

/* Artwork and parent feedback share one compact studio section. */
#results { padding:65px 5vw; }
#results .results-intro { max-width:620px; margin-bottom:2rem; }
.results-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2.5rem; max-width:1100px; align-items:start; }
.results-subheading { font-size:0.7rem; font-weight:600; letter-spacing:0.13em; text-transform:uppercase; color:var(--gold); margin:0 0 1rem; }
#results .student-work-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0.75rem; margin:0; }
#results .student-work { border-radius:6px; border:1px solid rgba(244,201,72,0.18); aspect-ratio:3/4; }
#results .student-work img { object-fit:contain; }
#results .student-work figcaption { padding:1.8rem 0.6rem 0.6rem; font-size:0.64rem; flex-wrap:wrap; gap:0.15rem 0.4rem; }
#results .student-work-age { font-size:0.6rem; }
#results .testimonial-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.1rem; }
#results .testimonial-card { padding:0 0 1rem; border:0; border-top:1px solid rgba(244,201,72,0.25); border-radius:0; background:transparent; }
#results .testimonial-card blockquote { font-size:0.86rem; line-height:1.75; margin:1rem 0 0.75rem; }
#results .testimonial-card cite { font-size:0.62rem; letter-spacing:0.06em; }
@media(max-width:900px) {
  .results-layout { grid-template-columns:1fr; gap:2rem; max-width:680px; }
}
@media(max-width:550px) {
  #results .student-work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #results .testimonial-grid { grid-template-columns:1fr; gap:0.75rem; }
  #results .testimonial-card { padding-bottom:0.25rem; }
}