/* Video Editing Courses: "edit suite" theme.
   Layout concept: the page reads like an editing timeline. Dark graphite workspace,
   clip label colours from editing software, timecode type, one playhead that moves. */
@font-face{font-family:"Big Shoulders";font-weight:800;font-display:swap;src:url(fonts/big-shoulders-display-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Big Shoulders";font-weight:900;font-display:swap;src:url(fonts/big-shoulders-display-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Sans";font-weight:400;font-display:swap;src:url(fonts/instrument-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Sans";font-weight:400;font-style:italic;font-display:swap;src:url(fonts/instrument-sans-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Instrument Sans";font-weight:600;font-display:swap;src:url(fonts/instrument-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Sans";font-weight:700;font-display:swap;src:url(fonts/instrument-sans-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:700;font-display:swap;src:url(fonts/jetbrains-mono-latin-700-normal.woff2) format("woff2")}

/* Metric-matched fallbacks: phones show Roboto (Android) or Arial (iPhone) for a moment before Instrument Sans loads.
   size-adjust makes those fallbacks take the same width, so text does not reflow when the real font arrives. */
@font-face{font-family:"IS fallback R";src:local("Roboto"),local("Roboto-Regular");size-adjust:109%}
@font-face{font-family:"BS fallback";font-weight:800 900;src:local("Arial Bold"),local("Arial-BoldMT"),local("Roboto Bold"),local("Roboto-Bold"),local("Liberation Sans Bold");size-adjust:69.6%}
@font-face{font-family:"IS fallback A";src:local("Arial"),local("ArialMT"),local("Liberation Sans");size-adjust:100%}

:root{
  color-scheme:dark;
  --bg:#121216;        /* graphite workspace, slight blue */
  --panel:#1B1B22;     /* panels */
  --panel2:#23232C;
  --line:#2E2E3A;
  --fg:#F3F2F7;
  --muted:#A3A1B3;
  --rec:#FF4343;       /* record / live */
  --recbtn:#D3262C;    /* red for buttons with white text (AA contrast) */
  --violet:#A48BFF;    /* clip label colours */
  --teal:#2CCDB6;
  --mango:#FFAD33;
  --rose:#FF73A6;
  --sky:#55A9FF;
  --leaf:#86D46F;
  --ink:#0C0C10;
  --display:"Big Shoulders","BS fallback",Impact,sans-serif;
  --body:"Instrument Sans","IS fallback R","IS fallback A",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --gut:max(16px,env(safe-area-inset-left,0px));
  --gutR:max(16px,env(safe-area-inset-right,0px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--fg)}
a:hover{color:var(--teal)}
:focus-visible{outline:2px solid var(--mango);outline-offset:3px}
h1,h2,h3{text-wrap:balance}
h2{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(40px,6vw,76px);line-height:.92;letter-spacing:.005em;margin:0 0 20px}
h3,h2.h3{font-size:21px;line-height:1.25;margin:0 0 8px}
h2.h3{font-family:var(--body);font-weight:700;text-transform:none;letter-spacing:0}
p{margin:0 0 14px}
.mono{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase}
.skip{position:absolute;left:-999px;top:8px;background:var(--mango);color:var(--ink);padding:10px 14px;z-index:99}
.skip:focus{left:8px}
.wrap{max-width:1220px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gutR)}
.band{padding-block:clamp(56px,8vw,104px);position:relative}
.band.alt{background:var(--panel)}
.lead{font-size:clamp(18px,1.8vw,21px);color:var(--muted);max-width:62ch}
.kick{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;color:var(--muted)}
.kick i{width:22px;height:10px;border-radius:3px;background:var(--c,var(--teal));display:inline-block}

/* ---------- scrubber (top bar) ---------- */
.scrub{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(18,18,22,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:41;background:var(--bg)}
.nav{display:flex;align-items:center;gap:14px;justify-content:space-between;padding-block:10px;height:64px}
.logo{min-width:0;flex:1 1 auto;display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--display);font-weight:900;font-size:24px;text-transform:uppercase;letter-spacing:.02em;line-height:1}
.logo svg{flex:none}
.logo span{min-width:0}
.logo small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.08em;color:var(--muted)}
.links{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.links a{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:8px 10px;border-radius:6px;color:var(--muted)}
.links a:hover,.links a[aria-current]{color:var(--fg);background:var(--panel2)}
.navcta{flex:none;display:flex;gap:8px;align-items:center}
.tc{contain:layout paint;width:118px;font-family:var(--mono);font-size:13px;font-weight:700;color:var(--rec);display:flex;align-items:center;gap:7px;font-variant-numeric:tabular-nums}
.tc::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--rec);animation:blink 1.2s steps(2) infinite}
.bar{height:3px;background:var(--line);position:relative}
.bar{overflow:hidden}
.bar span{position:absolute;inset:0;transform-origin:left;transform:scaleX(var(--p,0));will-change:transform;background:linear-gradient(90deg,var(--violet),var(--teal),var(--mango))}
.bar b{position:absolute;top:0;left:0;width:2px;height:3px;background:var(--rec);transform:translateX(calc(var(--p,0) * 100vw - 2px));will-change:transform}
@media (max-width:980px){.links{display:none}.tc{display:none}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;text-decoration:none;padding:15px 22px;border-radius:10px;border:1.5px solid var(--line);background:var(--panel2);color:var(--fg);transition:transform .2s,background .2s,border-color .2s;line-height:1.1}
.btn:hover{transform:translateY(-2px);border-color:var(--muted);color:var(--fg)}
.btn.rec{background:var(--recbtn);border-color:var(--recbtn);color:#fff}
.btn.rec:hover{background:#E53338}
.btn.lime{background:var(--mango);border-color:var(--mango);color:var(--ink)}
.btn.sm{padding:10px 14px;font-size:14px;border-radius:8px}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}

/* ---------- hero ---------- */
.hero{padding-block:clamp(28px,4vw,56px) clamp(40px,5vw,72px);position:relative;overflow:hidden}
.hero .grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.hero h1{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(50px,7.4vw,108px);line-height:.86;margin:0;letter-spacing:.005em}
.hero h1 .cut{display:block;color:var(--mango)}
.hero h1 .sub{display:block;font-family:var(--body);text-transform:none;font-weight:600;font-size:clamp(19px,2vw,24px);line-height:1.3;letter-spacing:0;color:var(--fg);margin-top:16px}
.hero h1 .sub em{font-style:normal;background:var(--recbtn);color:#fff;padding:1px 7px;border-radius:4px}
.hero .lead{margin-top:16px}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.facts span{font-family:var(--mono);font-size:12px;letter-spacing:.04em;padding:7px 10px;border:1px solid var(--line);border-radius:6px;color:var(--muted)}
.facts span b{color:var(--fg);font-weight:700}
@media (max-width:900px){.hero .grid{grid-template-columns:1fr}}

/* program monitor */
.suite{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
.mon{position:relative;aspect-ratio:16/9;max-width:100%;border-radius:8px;overflow:hidden;background:#000}
.shot{position:absolute;inset:0;opacity:0;animation:shot 12s infinite;will-change:transform,opacity}
.shot svg{width:100%;height:100%;display:block}
.s1{animation-delay:0s}.s2{animation-delay:4s}.s3{animation-delay:8s}
.s1{opacity:1}
@keyframes shot{0%{opacity:0;transform:scale(1.04)}3%{opacity:1}31%{opacity:1;transform:scale(1.1)}35%{opacity:0}100%{opacity:0}}
.ovl{position:absolute;inset:0;pointer-events:none}
.ovl .safe{position:absolute;inset:7% 6%;border:1px dashed rgba(255,255,255,.35);border-radius:3px}
.ovl .cn{position:absolute;width:18px;height:18px;border:2px solid #fff;opacity:.85}
.cn.a{left:12px;top:12px;border-right:0;border-bottom:0}.cn.b{right:12px;top:12px;border-left:0;border-bottom:0}.cn.c{left:12px;bottom:12px;border-right:0;border-top:0}.cn.d{right:12px;bottom:12px;border-left:0;border-top:0}
.ovl .recb{position:absolute;left:38px;top:14px;font-family:var(--mono);font-size:12px;font-weight:700;color:#fff;display:flex;gap:6px;align-items:center;text-shadow:0 1px 3px #000}
.ovl .recb::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--rec);animation:blink 1.2s steps(2) infinite}
.ovl .mtc{position:absolute;right:38px;top:14px;font-family:var(--mono);font-size:12px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 1px 3px #000}
.ovl .cap{position:absolute;left:50%;bottom:11%;transform:translateX(-50%);background:rgba(0,0,0,.66);color:#fff;font-weight:700;font-size:clamp(11px,1.3vw,15px);padding:5px 10px;border-radius:4px;white-space:nowrap}
.ovl .cap span{position:absolute;inset:5px 10px;opacity:0;animation:capt 12s infinite;white-space:nowrap}
.ovl .cap span:first-child{position:static;opacity:1;visibility:hidden}
.ovl .cap .k1{animation-delay:0s}.ovl .cap .k2{animation-delay:4s}.ovl .cap .k3{animation-delay:8s}
@keyframes capt{0%{opacity:0}4%{opacity:1}30%{opacity:1}33%{opacity:0}100%{opacity:0}}

/* timeline */
.tl{margin-top:12px;position:relative;font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.ruler{display:flex;justify-content:space-between;padding:0 0 4px 34px;font-variant-numeric:tabular-nums}
.trk{display:grid;grid-template-columns:30px 1fr;gap:4px;align-items:center;margin-top:3px}
.trk b{font-weight:700;color:var(--muted);text-align:center;background:var(--panel2);border-radius:4px;padding:4px 0}
.lane{position:relative;height:24px;background:#15151b;border-radius:4px;overflow:hidden}
.clip{position:absolute;top:2px;bottom:2px;border-radius:3px;padding:3px 6px;color:var(--ink);font-weight:700;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.02em}
.wave{position:absolute;inset:3px 0;overflow:hidden}
.wave i{position:absolute;inset:0 auto 0 0;width:720px;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27360%27%20height%3D%2720%27%20fill%3D%27%232CCDB6%27%3E%3Crect%20x%3D%220%22%20y%3D%225.1%22%20width%3D%223.5%22%20height%3D%229.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%226%22%20y%3D%226.4%22%20width%3D%223.5%22%20height%3D%227.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2212%22%20y%3D%222.6%22%20width%3D%223.5%22%20height%3D%2214.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2218%22%20y%3D%227.0%22%20width%3D%223.5%22%20height%3D%226.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2224%22%20y%3D%223.5%22%20width%3D%223.5%22%20height%3D%2213.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2230%22%20y%3D%224.8%22%20width%3D%223.5%22%20height%3D%2210.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2236%22%20y%3D%227.1%22%20width%3D%223.5%22%20height%3D%225.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2242%22%20y%3D%223.7%22%20width%3D%223.5%22%20height%3D%2212.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2248%22%20y%3D%227.2%22%20width%3D%223.5%22%20height%3D%225.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2254%22%20y%3D%224.2%22%20width%3D%223.5%22%20height%3D%2211.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2260%22%20y%3D%227.0%22%20width%3D%223.5%22%20height%3D%226.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2266%22%20y%3D%226.8%22%20width%3D%223.5%22%20height%3D%226.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2272%22%20y%3D%224.3%22%20width%3D%223.5%22%20height%3D%2211.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2278%22%20y%3D%221.3%22%20width%3D%223.5%22%20height%3D%2217.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2284%22%20y%3D%226.6%22%20width%3D%223.5%22%20height%3D%226.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2290%22%20y%3D%225.8%22%20width%3D%223.5%22%20height%3D%228.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2296%22%20y%3D%222.8%22%20width%3D%223.5%22%20height%3D%2214.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22102%22%20y%3D%220.4%22%20width%3D%223.5%22%20height%3D%2219.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22108%22%20y%3D%223.2%22%20width%3D%223.5%22%20height%3D%2213.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22114%22%20y%3D%224.5%22%20width%3D%223.5%22%20height%3D%2211.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22120%22%20y%3D%220.2%22%20width%3D%223.5%22%20height%3D%2219.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22126%22%20y%3D%227.2%22%20width%3D%223.5%22%20height%3D%225.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22132%22%20y%3D%221.1%22%20width%3D%223.5%22%20height%3D%2217.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22138%22%20y%3D%225.3%22%20width%3D%223.5%22%20height%3D%229.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22144%22%20y%3D%226.4%22%20width%3D%223.5%22%20height%3D%227.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22150%22%20y%3D%226.6%22%20width%3D%223.5%22%20height%3D%226.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22156%22%20y%3D%225.2%22%20width%3D%223.5%22%20height%3D%229.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22162%22%20y%3D%221.4%22%20width%3D%223.5%22%20height%3D%2217.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22168%22%20y%3D%226.1%22%20width%3D%223.5%22%20height%3D%227.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22174%22%20y%3D%223.1%22%20width%3D%223.5%22%20height%3D%2213.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22180%22%20y%3D%222.7%22%20width%3D%223.5%22%20height%3D%2214.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22186%22%20y%3D%224.7%22%20width%3D%223.5%22%20height%3D%2210.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22192%22%20y%3D%223.4%22%20width%3D%223.5%22%20height%3D%2213.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22198%22%20y%3D%227.0%22%20width%3D%223.5%22%20height%3D%225.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22204%22%20y%3D%227.1%22%20width%3D%223.5%22%20height%3D%225.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22210%22%20y%3D%226.0%22%20width%3D%223.5%22%20height%3D%228.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22216%22%20y%3D%222.4%22%20width%3D%223.5%22%20height%3D%2215.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22222%22%20y%3D%224.3%22%20width%3D%223.5%22%20height%3D%2211.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22228%22%20y%3D%225.1%22%20width%3D%223.5%22%20height%3D%229.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22234%22%20y%3D%223.1%22%20width%3D%223.5%22%20height%3D%2213.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22240%22%20y%3D%224.1%22%20width%3D%223.5%22%20height%3D%2211.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22246%22%20y%3D%225.3%22%20width%3D%223.5%22%20height%3D%229.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22252%22%20y%3D%221.5%22%20width%3D%223.5%22%20height%3D%2216.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22258%22%20y%3D%222.3%22%20width%3D%223.5%22%20height%3D%2215.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22264%22%20y%3D%225.7%22%20width%3D%223.5%22%20height%3D%228.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22270%22%20y%3D%223.2%22%20width%3D%223.5%22%20height%3D%2213.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22276%22%20y%3D%223.6%22%20width%3D%223.5%22%20height%3D%2212.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22282%22%20y%3D%220.9%22%20width%3D%223.5%22%20height%3D%2218.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22288%22%20y%3D%222.0%22%20width%3D%223.5%22%20height%3D%2215.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22294%22%20y%3D%225.3%22%20width%3D%223.5%22%20height%3D%229.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22300%22%20y%3D%220.1%22%20width%3D%223.5%22%20height%3D%2219.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22306%22%20y%3D%226.6%22%20width%3D%223.5%22%20height%3D%226.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22312%22%20y%3D%224.4%22%20width%3D%223.5%22%20height%3D%2211.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22318%22%20y%3D%221.8%22%20width%3D%223.5%22%20height%3D%2216.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22324%22%20y%3D%226.4%22%20width%3D%223.5%22%20height%3D%227.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22330%22%20y%3D%223.8%22%20width%3D%223.5%22%20height%3D%2212.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22336%22%20y%3D%227.2%22%20width%3D%223.5%22%20height%3D%225.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22342%22%20y%3D%222.5%22%20width%3D%223.5%22%20height%3D%2215.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22348%22%20y%3D%221.8%22%20width%3D%223.5%22%20height%3D%2216.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22354%22%20y%3D%223.2%22%20width%3D%223.5%22%20height%3D%2213.6%22%20rx%3D%221%22/%3E%3C/svg%3E") repeat-x left center/360px 100%;opacity:.85;animation:wave 6s linear infinite;will-change:transform}
.wave.m i{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27360%27%20height%3D%2720%27%20fill%3D%27%2386D46F%27%3E%3Crect%20x%3D%220%22%20y%3D%220.9%22%20width%3D%223.5%22%20height%3D%2218.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%226%22%20y%3D%225.1%22%20width%3D%223.5%22%20height%3D%229.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2212%22%20y%3D%222.3%22%20width%3D%223.5%22%20height%3D%2215.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2218%22%20y%3D%223.0%22%20width%3D%223.5%22%20height%3D%2213.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2224%22%20y%3D%223.2%22%20width%3D%223.5%22%20height%3D%2213.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2230%22%20y%3D%224.1%22%20width%3D%223.5%22%20height%3D%2211.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2236%22%20y%3D%221.2%22%20width%3D%223.5%22%20height%3D%2217.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2242%22%20y%3D%220.4%22%20width%3D%223.5%22%20height%3D%2219.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2248%22%20y%3D%223.9%22%20width%3D%223.5%22%20height%3D%2212.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2254%22%20y%3D%222.5%22%20width%3D%223.5%22%20height%3D%2215.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2260%22%20y%3D%227.0%22%20width%3D%223.5%22%20height%3D%225.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2266%22%20y%3D%222.2%22%20width%3D%223.5%22%20height%3D%2215.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2272%22%20y%3D%222.6%22%20width%3D%223.5%22%20height%3D%2214.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2278%22%20y%3D%220.1%22%20width%3D%223.5%22%20height%3D%2219.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2284%22%20y%3D%221.3%22%20width%3D%223.5%22%20height%3D%2217.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2290%22%20y%3D%225.4%22%20width%3D%223.5%22%20height%3D%229.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2296%22%20y%3D%224.6%22%20width%3D%223.5%22%20height%3D%2210.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22102%22%20y%3D%222.5%22%20width%3D%223.5%22%20height%3D%2215.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22108%22%20y%3D%227.3%22%20width%3D%223.5%22%20height%3D%225.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22114%22%20y%3D%224.0%22%20width%3D%223.5%22%20height%3D%2211.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22120%22%20y%3D%226.2%22%20width%3D%223.5%22%20height%3D%227.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22126%22%20y%3D%226.6%22%20width%3D%223.5%22%20height%3D%226.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22132%22%20y%3D%227.1%22%20width%3D%223.5%22%20height%3D%225.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22138%22%20y%3D%221.7%22%20width%3D%223.5%22%20height%3D%2216.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22144%22%20y%3D%226.5%22%20width%3D%223.5%22%20height%3D%226.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22150%22%20y%3D%225.6%22%20width%3D%223.5%22%20height%3D%228.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22156%22%20y%3D%224.6%22%20width%3D%223.5%22%20height%3D%2210.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22162%22%20y%3D%221.0%22%20width%3D%223.5%22%20height%3D%2218.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22168%22%20y%3D%226.9%22%20width%3D%223.5%22%20height%3D%226.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22174%22%20y%3D%224.1%22%20width%3D%223.5%22%20height%3D%2211.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22180%22%20y%3D%223.4%22%20width%3D%223.5%22%20height%3D%2213.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22186%22%20y%3D%220.9%22%20width%3D%223.5%22%20height%3D%2218.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22192%22%20y%3D%221.4%22%20width%3D%223.5%22%20height%3D%2217.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22198%22%20y%3D%221.0%22%20width%3D%223.5%22%20height%3D%2218.0%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22204%22%20y%3D%225.4%22%20width%3D%223.5%22%20height%3D%229.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22210%22%20y%3D%224.4%22%20width%3D%223.5%22%20height%3D%2211.2%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22216%22%20y%3D%224.8%22%20width%3D%223.5%22%20height%3D%2210.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22222%22%20y%3D%220.9%22%20width%3D%223.5%22%20height%3D%2218.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22228%22%20y%3D%220.3%22%20width%3D%223.5%22%20height%3D%2219.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22234%22%20y%3D%226.4%22%20width%3D%223.5%22%20height%3D%227.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22240%22%20y%3D%226.2%22%20width%3D%223.5%22%20height%3D%227.6%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22246%22%20y%3D%225.8%22%20width%3D%223.5%22%20height%3D%228.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22252%22%20y%3D%225.7%22%20width%3D%223.5%22%20height%3D%228.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22258%22%20y%3D%223.9%22%20width%3D%223.5%22%20height%3D%2212.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22264%22%20y%3D%223.1%22%20width%3D%223.5%22%20height%3D%2213.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22270%22%20y%3D%225.5%22%20width%3D%223.5%22%20height%3D%228.9%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22276%22%20y%3D%227.5%22%20width%3D%223.5%22%20height%3D%225.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22282%22%20y%3D%224.4%22%20width%3D%223.5%22%20height%3D%2211.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22288%22%20y%3D%224.7%22%20width%3D%223.5%22%20height%3D%2210.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22294%22%20y%3D%223.3%22%20width%3D%223.5%22%20height%3D%2213.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22300%22%20y%3D%220.4%22%20width%3D%223.5%22%20height%3D%2219.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22306%22%20y%3D%222.3%22%20width%3D%223.5%22%20height%3D%2215.4%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22312%22%20y%3D%223.6%22%20width%3D%223.5%22%20height%3D%2212.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22318%22%20y%3D%222.9%22%20width%3D%223.5%22%20height%3D%2214.3%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22324%22%20y%3D%222.4%22%20width%3D%223.5%22%20height%3D%2215.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22330%22%20y%3D%227.1%22%20width%3D%223.5%22%20height%3D%225.8%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22336%22%20y%3D%220.8%22%20width%3D%223.5%22%20height%3D%2218.5%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22342%22%20y%3D%221.7%22%20width%3D%223.5%22%20height%3D%2216.7%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22348%22%20y%3D%220.9%22%20width%3D%223.5%22%20height%3D%2218.1%22%20rx%3D%221%22/%3E%3Crect%20x%3D%22354%22%20y%3D%221.5%22%20width%3D%223.5%22%20height%3D%2217.0%22%20rx%3D%221%22/%3E%3C/svg%3E");animation-duration:9s}
@keyframes wave{to{transform:translateX(-360px)}}
.phw{position:absolute;top:0;bottom:0;left:34px;right:0;z-index:3;animation:ph 12s linear infinite;will-change:transform;pointer-events:none}
.playhead{position:absolute;top:0;bottom:0;left:0;width:2px;background:var(--rec)}
.playhead::before{content:"";position:absolute;top:-2px;left:-5px;border:6px solid transparent;border-top:8px solid var(--rec)}
@keyframes ph{from{transform:translateX(0)}to{transform:translateX(calc(100% - 2px))}}
.tl{overflow-x:clip}
/* pause everything that animates while it is off screen */
.off,.off *,.off *::before,.off *::after{animation-play-state:paused!important}
.mtc{contain:layout paint}
@keyframes blink{50%{opacity:0}}

/* ---------- facts strip ---------- */
.strip{border-block:1px solid var(--line);background:var(--panel)}
.strip .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.strip div.it{padding:22px 18px;border-left:1px solid var(--line)}
.strip div.it:first-child{border-left:0}
.strip strong{display:block;font-family:var(--display);font-weight:900;font-size:40px;line-height:1;text-transform:uppercase}
.strip span{color:var(--muted);font-size:15px}
@media (max-width:820px){.strip .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}.strip div.it:nth-child(3){border-left:0}.strip div.it{border-top:1px solid var(--line)}.strip div.it:nth-child(-n+2){border-top:0}}

/* ---------- generic grids / cards ---------- */
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;min-width:0}
.band.alt .card{background:var(--bg)}
.card p:last-child{margin-bottom:0}
.card .tag{display:inline-block;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);background:var(--c,var(--teal));padding:3px 8px;border-radius:4px;margin-bottom:12px}
.muted{color:var(--muted)}

/* course "bin" cards */
.bin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:980px){.bin{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.bin{grid-template-columns:1fr}}
.cc{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:var(--fg);transition:transform .3s,border-color .3s}
.cc:hover{transform:translateY(-6px);border-color:var(--c);color:var(--fg)}
.cc .th{position:relative;aspect-ratio:16/9;background:var(--c);overflow:hidden}
.cc .th svg{position:absolute;inset:0;width:100%;height:100%}
.cc .dur{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.8);color:#fff;font-family:var(--mono);font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px}
.cc .bd{padding:18px 18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.cc h3{margin:0}
.cc p{margin:0;color:var(--muted);font-size:15.5px}
.cc .go{margin-top:auto;padding-top:8px;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--c)}
.cc .prog{height:3px;background:var(--line)}
.cc .prog i{display:block;height:100%;width:0;background:var(--c);transition:width .9s ease}
.cc:hover .prog i{width:100%}

/* syllabus timeline (to scale, in weeks) */
.syl{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;overflow-x:auto}
.syl .inner{min-width:760px}
.syl .wk{display:grid;grid-template-columns:repeat(25,1fr);font-family:var(--mono);font-size:10px;color:var(--muted);margin-left:92px;border-bottom:1px solid var(--line);padding-bottom:4px}
.syl .row{display:grid;grid-template-columns:86px 1fr;gap:6px;margin-top:8px;align-items:stretch}
.syl .row>b{font-family:var(--mono);font-size:11px;color:var(--muted);background:var(--panel2);border-radius:5px;display:flex;align-items:center;justify-content:center;text-align:center;padding:4px}
.syl .lanes{display:grid;grid-template-columns:repeat(25,1fr);gap:3px}
.syl .m{border-radius:5px;padding:8px 9px;color:var(--ink);font-weight:700;font-size:13px;line-height:1.2;min-height:62px}
.syl .m small{display:block;font-family:var(--mono);font-size:10px;font-weight:500;margin-top:4px;opacity:.8}
.mods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
@media (max-width:760px){.mods{grid-template-columns:1fr}}
.mod{display:grid;grid-template-columns:44px 1fr;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;min-width:0}
.band.alt .mod{background:var(--bg)}
.mod .n{font-family:var(--display);font-weight:900;font-size:34px;line-height:1;color:var(--c,var(--teal))}
.mod ul{margin:6px 0 0;padding-left:18px;color:var(--muted);font-size:15.5px}
.mod li{margin:2px 0}
.mod .sw{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--fg);margin-top:8px}

/* grading slider */
.grade{position:relative;aspect-ratio:21/9;max-width:100%;border-radius:12px;overflow:hidden;border:1px solid var(--line);user-select:none;touch-action:pan-y;background:#000}
.grade .layer{position:absolute;inset:0}
.grade .layer svg{width:100%;height:100%;display:block}
.grade .log{filter:saturate(.25) contrast(.62) brightness(1.18)}
.grade .graded{clip-path:inset(0 0 0 var(--x,50%))}
.grade .graded svg{filter:saturate(1.35) contrast(1.12)}
.grade .hand{position:absolute;top:0;bottom:0;left:var(--x,50%);width:2px;background:#fff;transform:translateX(-1px)}
.grade .hand button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.55);color:#fff;font:700 15px var(--mono);cursor:ew-resize}
.grade .lab{position:absolute;top:12px;font-family:var(--mono);font-size:11px;font-weight:700;background:rgba(0,0,0,.7);color:#fff;padding:4px 8px;border-radius:4px}
.grade .lab.l{left:12px}.grade .lab.r{right:12px}
.grade input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.scopes{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.scopes span{font-family:var(--mono);font-size:11.5px;color:var(--muted);border:1px solid var(--line);padding:6px 9px;border-radius:6px}

/* YouTube studio card */
.yt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
@media (max-width:900px){.yt{grid-template-columns:1fr}}
.studio{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:18px}
.studio .row{display:flex;gap:14px;align-items:flex-start}
.thumb{position:relative;flex:none;width:46%;aspect-ratio:16/9;border-radius:8px;overflow:hidden}
.thumb svg{width:100%;height:100%;display:block}
.thumb .dur{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.85);color:#fff;font:700 10px var(--mono);padding:2px 5px;border-radius:3px}
.studio h3{font-size:16px}
.studio .meta{font-family:var(--mono);font-size:11px;color:var(--muted)}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.kpis div{background:var(--panel);border-radius:8px;padding:10px}
.kpis b{display:block;font-family:var(--display);font-weight:900;font-size:28px;line-height:1;font-variant-numeric:tabular-nums}
.kpis span{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
.ret{margin-top:12px}
.ret svg{width:100%;height:auto;display:block}
.ret .line{stroke-dasharray:640;stroke-dashoffset:0}
.ret.go .line{animation:draw 2.4s ease forwards}
@keyframes draw{from{stroke-dashoffset:640}to{stroke-dashoffset:0}}

/* phones (reels) */
.phones{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.phone{width:150px;aspect-ratio:9/16;border-radius:20px;border:3px solid var(--panel2);background:#000;position:relative;overflow:hidden}
.phone .reel{position:absolute;inset:0;display:flex;flex-direction:column;animation:reel 9s infinite}
.phone .reel div{flex:none;height:100%;display:flex;align-items:flex-end;padding:12px;font-weight:700;font-size:13px;color:#fff;line-height:1.2}
@keyframes reel{0%,28%{transform:translateY(0)}33%,61%{transform:translateY(-100%)}66%,94%{transform:translateY(-200%)}100%{transform:translateY(-300%)}}
.phone:nth-child(2) .reel{animation-delay:-3s}.phone:nth-child(3) .reel{animation-delay:-6s}

/* tables */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:15.5px}
th,td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--panel2);font-weight:700}
tr:last-child td{border-bottom:0}
td strong{color:var(--fg)}

/* chips / topic cloud */
.cloud{display:flex;flex-wrap:wrap;gap:8px}
.cloud span{border:1px solid var(--line);border-radius:999px;padding:7px 13px;font-size:15px;background:var(--panel)}
.cloud span.b{font-weight:700;border-color:var(--c,var(--teal));color:var(--fg)}
.band.alt .cloud span{background:var(--bg)}

/* marquee */
.marq{overflow:hidden;border-block:1px solid var(--line);padding-block:14px;background:var(--panel)}
.marq .tr{display:flex;gap:44px;width:max-content;animation:marq 34s linear infinite}
.marq span{font-family:var(--display);font-weight:900;font-size:30px;text-transform:uppercase;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:44px}
.marq span::after{content:"";width:10px;height:10px;border-radius:2px;background:var(--rec)}
@keyframes marq{to{transform:translateX(-50%)}}

/* stories */
.story{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:start}
.story img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--c,var(--violet))}
.brands{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.brands span{font-family:var(--mono);font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:10px 14px;border:1px dashed var(--line);border-radius:8px;color:var(--fg)}

/* faq */
.faq details{border-bottom:1px solid var(--line);padding:16px 0}
.faq summary{cursor:pointer;font-weight:700;font-size:18px;display:flex;justify-content:space-between;gap:16px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);color:var(--mango);font-size:20px;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:10px 0 0;color:var(--muted);max-width:75ch}

/* location */
.loc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:22px;align-items:stretch}
@media (max-width:860px){.loc{grid-template-columns:1fr}}
.map{position:relative;min-height:340px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--panel2)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:1;filter:invert(.92) hue-rotate(180deg) saturate(.85) brightness(.92) contrast(.95)} /* real Google map in night mode */
.mapfb{position:absolute;inset:0;display:block;text-decoration:none;color:var(--fg)}
.mapfb svg{width:100%;height:100%;display:block}
.mapcap{position:absolute;left:14px;bottom:14px;background:rgba(12,12,16,.88);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:14px;line-height:1.5}
.vid{max-width:760px}
.vfacade{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--panel2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E")}
.vfacade img{width:100%;height:100%;object-fit:cover}
.vfacade iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vplay{position:absolute;left:50%;top:50%;width:84px;height:58px;border-radius:14px;background:var(--rec);transform:translate(-50%,-50%);box-shadow:0 10px 30px rgba(0,0,0,.5)}
.vplay::after{content:"";position:absolute;left:34px;top:17px;border:12px solid transparent;border-left:20px solid #fff}
.vlab{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,.75);color:#fff;padding:5px 9px;border-radius:5px}
.nap{font-size:18px;line-height:1.7}
.nap strong{font-family:var(--display);font-weight:900;font-size:30px;text-transform:uppercase;display:block;line-height:1}
.form{background:#fff;border-radius:12px;overflow:hidden}
.crmform{border-top:4px solid var(--recbtn);box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.crmform iframe{display:block;width:100%;min-height:580px;height:580px;border:0;background:#fff} /* form is 520px, 564px with an error message: no inner scroll */

/* enquiry popup */
.fmodal{width:min(560px,100vw - 24px);max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--fg);overflow:hidden}
.fmodal[open]{display:flex;flex-direction:column}
.fmodal::backdrop{background:rgba(6,6,10,.78);backdrop-filter:blur(3px)}
.fm-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.fm-x{flex:none;width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--fg);font-size:18px;cursor:pointer}
.fm-body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:0}
.fm-body iframe{min-height:580px;height:580px}
.fm-foot{padding:12px 18px;border-top:1px solid var(--line);font-size:14.5px;color:var(--muted)}
.fm-foot a{color:var(--fg)}
@media (max-width:560px){.fmodal{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;margin:0}}
body.noscroll{overflow:hidden}

/* video player */
.vplayer{margin:26px 0 0;max-width:100%}
.vp-stage{position:relative;aspect-ratio:16/9;max-width:100%;background:#000;border-radius:12px 12px 0 0;overflow:hidden;border:1px solid var(--line);border-bottom:0}
.vp-host,.vp-host iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.vp-poster{position:absolute;inset:0;padding:0;border:0;background:#000;cursor:pointer;z-index:2;display:block;width:100%}
.vp-poster img{width:100%;height:100%;object-fit:cover;opacity:.9}
.vplayer.playing .vp-poster{display:none}
.vplayer.loading .vplay{animation:blink .8s steps(2) infinite}
.vp-bar{display:flex;align-items:center;gap:6px;padding:8px;background:var(--panel2);border:1px solid var(--line);border-radius:0 0 12px 12px}
.vp-b{min-width:44px;height:40px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--fg);font:700 14px var(--mono);cursor:pointer}
.vp-b:hover{border-color:var(--muted)}
.vp-time{margin-left:auto;margin-right:auto;color:var(--muted);font-variant-numeric:tabular-nums}
.vplayer:fullscreen{background:#000;display:flex;flex-direction:column;justify-content:center}
.vplayer:fullscreen .vp-stage{border-radius:0;aspect-ratio:auto;flex:1}
.vplayer.fakefull{position:fixed;inset:0;z-index:90;margin:0;background:#000;display:flex;flex-direction:column;justify-content:center;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
.vplayer.fakefull .vp-stage{border-radius:0}
.vplayer.fakefull figcaption{display:none}

/* page hero (inner pages) */
.ph{padding-block:clamp(30px,4vw,56px)}
.ph .grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:32px;align-items:center}
@media (max-width:900px){.ph .grid{grid-template-columns:1fr}}
.ph h1{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(46px,6.6vw,92px);line-height:.88;margin:0}
.ph h1 em{font-style:normal;color:var(--c,var(--mango))}
.crumbs{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.crumbs a{color:var(--muted);text-decoration:none}
.slate{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.slate .clap{height:34px;background:repeating-linear-gradient(-45deg,var(--fg) 0 18px,var(--ink) 18px 36px);transform-origin:left bottom;animation:clap 6s ease-in-out infinite}
@keyframes clap{0%,86%,100%{transform:rotate(0)}90%{transform:rotate(-12deg)}94%{transform:rotate(0)}}
.slate dl{display:grid;grid-template-columns:auto 1fr;margin:0;font-size:15px}
.slate dt,.slate dd{padding:10px 14px;border-top:1px solid var(--line);margin:0}
.slate dt{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-right:1px solid var(--line)}
.slate dd{font-weight:600}

/* prose blocks */
.prose{max-width:74ch}
.prose ul{padding-left:20px}
.prose li{margin:6px 0}
.note{font-size:14.5px;color:var(--muted);margin-top:12px}

/* footer */
footer{background:var(--ink);border-top:1px solid var(--line);padding-block:56px 110px}
footer .big{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(44px,9vw,140px);line-height:.85;letter-spacing:.005em;overflow-wrap:anywhere}
footer .big span{color:var(--rec)}
footer .cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:36px;font-size:15px}
@media (max-width:860px){footer .cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){footer .cols{grid-template-columns:1fr}}
footer .fh{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--muted);margin:0 0 8px;font-weight:700}
footer a{color:var(--fg);text-decoration:none}
footer a:hover{color:var(--mango)}
footer .fine a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
footer .fine{margin-top:36px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}

/* mobile action bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;gap:8px;padding:10px max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));background:rgba(12,12,16,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line)}
.mbar a{flex:1;text-align:center;text-decoration:none;font-weight:700;padding:13px 8px;border-radius:10px}
@media (max-width:760px){.mbar{display:flex;backdrop-filter:none;-webkit-backdrop-filter:none;background:#0C0C10}.scrub{backdrop-filter:none;-webkit-backdrop-filter:none;background:#121216}}

/* razor cut on click */
.razor{position:absolute;width:2px;height:120px;background:var(--rec);pointer-events:none;z-index:60;transform:translate(-1px,-60px);animation:razor .7s ease-out forwards}
.razor::after{content:"CUT";position:absolute;top:-18px;left:6px;font:700 10px var(--mono);color:var(--rec);letter-spacing:.1em}
@keyframes razor{0%{opacity:1;height:0;transform:translate(-1px,0)}35%{height:120px;transform:translate(-1px,-60px)}100%{opacity:0;height:120px;transform:translate(-1px,-60px)}}

/* reveal: content is always visible; a clip-coloured bar wipes across once (like a transition) */
.rv{position:relative}
.rv.in::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--c,var(--teal));pointer-events:none;z-index:2;animation:wipe .9s cubic-bezier(.7,0,.2,1) forwards}
@keyframes wipe{0%{clip-path:inset(0 100% 0 0)}45%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
.navcta .short{display:none}
@media (max-width:560px){.navcta .long{display:none}.navcta .short{display:inline}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .shot{opacity:0}.s1{opacity:1}
  .rv.in::after{display:none}
  .ovl .cap .k1{opacity:1}
}

/* enquiry form (our own, matches the site) */
.eform-card{background:var(--bg);border:1px solid var(--line);border-top:4px solid var(--recbtn);border-radius:14px;padding:20px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.eform{display:flex;flex-direction:column;gap:10px}
.eform input,.eform select{width:100%;min-width:0;height:50px;padding:0 14px;border-radius:10px;border:1.5px solid var(--line);background:var(--panel);color:var(--fg);font:500 16px var(--body);outline:none;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.eform select{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.eform select.empty{color:var(--muted)}
button{font-family:inherit}
.eform option{color:#111;background:#fff}
.eform input::placeholder{color:var(--muted);opacity:1}
.eform input:focus,.eform select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(44,205,182,.18)}
.eform .bad{border-color:var(--rec)!important;box-shadow:0 0 0 3px rgba(255,67,67,.18)!important}
.ef-tel{position:relative}
.ef-tel span{position:absolute;left:14px;top:50%;transform:translateY(-50%);font:700 15px var(--mono);color:var(--muted);pointer-events:none}
.ef-tel input{padding-left:54px}
.ef-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ef-go{font-family:var(--body);justify-content:center;width:100%;height:54px;font-size:17px;margin-top:4px;cursor:pointer}
.ef-go[disabled]{opacity:.7;cursor:wait}
.ef-msg{margin:0;min-height:0;font-size:14.5px;font-weight:600}
.ef-msg:empty{display:none}
.ef-msg.err{color:#FF8A8A}
.ef-msg.ok{color:var(--teal)}
.ef-note{margin:0;font-size:13px;color:var(--muted);text-align:center}
.fmodal .fm-body{padding:16px 18px}

/* anchor links land below the sticky header */
[id]{scroll-margin-top:84px}

/* student testimonials section: video and points share one height on desktop */
.says{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:stretch;margin-top:8px}
.says .vplayer{margin:0}
.says figcaption{display:none}
.says-r{display:flex;flex-direction:column;gap:12px;min-width:0}
.rate{display:flex;align-items:center;gap:14px;padding:12px 16px;background:var(--panel);border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--fg);transition:border-color .2s}
.rate:hover{border-color:var(--mango);color:var(--fg)}
.rate strong{font-family:var(--display);font-weight:900;font-size:46px;line-height:1}
.rate strong span{color:var(--mango);font-size:28px;margin-left:3px}
.rate b{font-size:16px}
.rate .muted{font-size:14px}
.points{list-style:none;margin:0;padding:0;flex:1;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:10px}
.points li{position:relative;display:flex;flex-direction:column;justify-content:center;gap:3px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 14px 10px 22px;min-width:0}
.points li::before{content:"";position:absolute;left:10px;top:12px;bottom:12px;width:4px;border-radius:3px;background:var(--c)}
.points li b{font-size:15.5px;line-height:1.25}
.points li span{color:var(--muted);font-size:13.5px;line-height:1.35}
.says-note{margin:0;font-size:13px;color:var(--muted)}
@media (max-width:1100px){.says{grid-template-columns:1fr}.points{grid-auto-rows:auto}}
@media (max-width:480px){.points{grid-template-columns:1fr}}

/* two plain bands in a row get a thin divider */
.band:not(.alt) + .band:not(.alt){border-top:1px solid var(--line)}
