@font-face{font-family:SpaceGrotesk;src:url("/assets/fonts/SpaceGrotesk-variable.woff2") format("woff2");font-weight:300 700;font-display:swap}
:root{color-scheme:dark;--bg:#101013;--surface:#19191e;--line:#36363e;--ink:#f7f7f8;--muted:#c6c6cf;--yellow:#e8cf35}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:SpaceGrotesk,"PingFang SC","Noto Sans CJK SC",system-ui,sans-serif;font-size:16px;line-height:1.6}
a{color:inherit}
img,video{max-width:100%}
.wrap{width:min(1220px,calc(100% - 48px));margin-inline:auto}
.skip{position:absolute;left:16px;top:-90px;z-index:20;background:var(--yellow);color:#111;padding:10px 14px}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}
.site-header{min-height:82px;width:min(1220px,calc(100% - 48px));margin:auto;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line)}
.brand{display:inline-flex;align-items:center;gap:19px;text-decoration:none;white-space:nowrap}
.brand img{display:block;width:168px;height:auto}
.brand span{border-left:1px solid var(--line);padding-left:18px;color:var(--muted);font-size:21px}
.site-header nav{display:flex;gap:26px;margin-left:auto}
.site-header nav a{text-decoration:none;color:var(--muted);font-size:14px;font-weight:600}
.site-header nav a:hover,.footer a:hover,.text-link:hover{color:var(--yellow)}
.language{display:grid;place-items:center;min-width:46px;height:46px;border:1px solid var(--line);border-radius:50%;font-size:14px;font-weight:700;text-decoration:none}
.language:hover{border-color:var(--yellow)}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.91fr);align-items:center;gap:clamp(28px,5vw,72px);padding-block:clamp(54px,7vw,96px)}
.label{margin:0 0 16px;color:var(--yellow);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.1;text-wrap:balance}
h1{max-width:720px;margin-bottom:24px;font-size:clamp(42px,5.9vw,80px);letter-spacing:-.035em}
h1 em{display:block;color:var(--yellow);font-style:normal}
.hero-copy>p:not(.label){max-width:59ch;color:var(--muted);font-size:18px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-height:54px;padding:14px 22px;border:1px solid var(--line);border-radius:8px;text-decoration:none;font-weight:700;line-height:1.25}
.button.primary{background:var(--yellow);border-color:var(--yellow);color:#111}
.button.primary:hover{background:#f4dc4c}
.button.secondary:hover{border-color:var(--yellow)}
.hero-poster{position:relative;display:block;overflow:hidden;border-radius:10px;aspect-ratio:1.04;background:var(--surface)}
.hero-poster img{width:100%;height:100%;display:block;object-fit:cover;object-position:51% center}
.hero-poster::after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.75));pointer-events:none}
.hero-poster span{position:absolute;bottom:20px;left:22px;right:22px;z-index:1;display:flex;justify-content:space-between;align-items:center;font-size:18px;font-weight:700}
.hero-poster b{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--yellow);color:#111}
.works{padding-block:78px 96px;border-top:1px solid var(--line)}
.section-heading{max-width:760px;margin-bottom:34px}
h2{margin-bottom:16px;font-size:clamp(34px,4.3vw,58px);letter-spacing:-.03em}
.section-heading>p:last-child,.learning p:not(.label),.course-main>p:not(.label){max-width:65ch;color:var(--muted);font-size:17px}
.film-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.film-card{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.film-media{aspect-ratio:16/9;background:#08080a}
.film-media video{display:block;width:100%;height:100%;object-fit:contain}
.film-copy{padding:clamp(22px,3vw,32px)}
.film-type{display:block;margin-bottom:16px;color:var(--yellow);font-size:13px;font-weight:700}
h3{margin-bottom:14px;font-size:clamp(25px,2.7vw,34px);letter-spacing:-.02em}
.film-copy p{min-height:6.2em;margin-bottom:18px;color:var(--muted);font-size:15px}
.text-link{display:inline-flex;gap:12px;align-items:center;color:var(--ink);font-weight:700;text-underline-offset:5px}
.learning{background:#1b1b20;border-block:1px solid var(--line)}
.learning-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,7vw,100px);padding-block:85px}
.learning ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.learning li{padding:17px 0;border-bottom:1px solid var(--line);font-size:17px;font-weight:600}
.learning li::before{content:"↗";margin-right:16px;color:var(--yellow)}
.course{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:clamp(36px,7vw,110px);padding-block:90px}
.course-facts{align-self:start;border-top:2px solid var(--yellow)}
.course-facts p{display:grid;grid-template-columns:105px 1fr;gap:16px;margin:0;padding:17px 0;border-bottom:1px solid var(--line);font-size:15px}
.course-facts strong{color:var(--yellow)}
.course-facts span{color:var(--muted)}
.footer{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding-block:35px 30px;border-top:1px solid var(--line)}
.footer p{color:var(--muted)}
.footer p strong{color:var(--ink)}
.footer>div{display:flex;justify-content:flex-end;gap:12px 22px;flex-wrap:wrap}
.footer a{font-size:14px;text-decoration:none}
.footer small{grid-column:1/-1;color:#a9a9b3;font-size:12px}
@media(max-width:980px){.site-header nav{display:none}.language{margin-left:auto}.hero{grid-template-columns:1fr}.hero-poster{aspect-ratio:16/9}.film-copy p{min-height:0}}
@media(max-width:700px){.wrap,.site-header{width:min(100% - 32px,1220px)}.site-header{min-height:70px;gap:12px}.brand{gap:10px}.brand img{width:126px}.brand span{padding-left:10px;font-size:16px}.hero{padding-block:44px 58px}.hero-poster{aspect-ratio:4/3}.hero-copy>p:not(.label){font-size:16px}.film-grid,.learning-inner,.course,.footer{grid-template-columns:1fr}.works{padding-block:58px 68px}.learning-inner,.course{padding-block:64px}.footer>div{justify-content:flex-start}.course-facts p{grid-template-columns:100px 1fr}.film-copy{padding:23px}}
@media(max-width:390px){.brand img{width:112px}.brand span{font-size:14px}.language{min-width:41px;height:41px}.button{width:100%}h1{font-size:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Meta Ads course: same typography and layout as the existing Academy. */
.course-entry{margin:22px 0 0}.course-entry a{font-size:15px}
.meta-course{border-top:1px solid var(--line)}
.meta-course>*,.meta-aside{min-width:0}
.meta-syllabus{padding-left:22px;margin:22px 0 26px;color:var(--muted)}
.meta-syllabus li{padding:9px 0 9px 5px;border-bottom:1px solid var(--line)}
.meta-syllabus li::marker{color:var(--yellow);font-weight:700}
.meta-poster{display:block;width:100%;height:auto;border-radius:8px;margin-bottom:28px}
.course-note{margin-top:20px;font-size:14px;color:var(--muted)}
.private-coaching{margin-top:30px;padding-block:20px;border-block:1px solid var(--line)}
.private-coaching summary{cursor:pointer;font-weight:700;color:var(--yellow)}
.private-coaching p{margin:16px 0 0;color:var(--muted)}