/* BBOY MASCOT — v2 visual layer (black / white, sand accent). Loaded after styles.css; every rule is scoped to body.v2. */

body.v2{--bg:#000;--ink:#fff;--muted:#8f8f8f;--soft:#b8b8b8;--line:#262626;--accent:var(--btn);--ease:cubic-bezier(.22,1,.36,1);--pad:4vw;
 background:#000;color:var(--ink);font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-weight:450;font-size:16px;line-height:1.5}
body.v2 ::selection{background:var(--accent);color:#111111}
body.v2 em{font-family:inherit;font-style:normal;font-weight:300;color:inherit}
body.v2 h1,body.v2 h2,body.v2 h3{font-family:inherit}
body.v2 a:hover{color:inherit}
body.v2 a:focus-visible,body.v2 button:focus-visible,body.v2 summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
body.v2 .section{border-bottom:0;padding:14vh var(--pad)}
body.v2 .section p{color:var(--soft);font-size:17px;line-height:1.65;max-width:58ch}
body.v2 .mono-label{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:13px;line-height:1.4;color:var(--soft);margin:0 0 22px;letter-spacing:0}
body.v2 .v2-head h2{font-size:clamp(44px,7.2vw,124px);line-height:.9;letter-spacing:-.055em;font-weight:820;margin:0 0 48px;max-width:14ch}

/* Header — fixed, inverts over imagery */
body.v2 .v2-header{position:fixed;top:0;left:0;right:0;z-index:30;min-height:0;padding:22px var(--pad);border:0;background:transparent;mix-blend-mode:difference;color:var(--ink);display:flex;justify-content:space-between;align-items:center}
body.v2 .v2-header .brand{font-size:19px;font-weight:820;letter-spacing:-.035em}
body.v2 .v2-header nav{gap:30px;font-size:15px;text-transform:none;letter-spacing:0;width:auto}
body.v2 .v2-header nav a{min-height:44px;border:0;background:linear-gradient(currentColor,currentColor) right 72%/0 1px no-repeat;transition:background-size .45s var(--ease)}
body.v2 .v2-header nav a:hover,body.v2 .v2-header nav a:focus-visible{background-size:100% 1px;background-position:left 72%}

/* Buttons with rolling label */
body.v2 .btn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border-radius:999px;font-size:15px;font-weight:600;letter-spacing:-.01em;overflow:hidden;white-space:nowrap;transition:background-color .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease)}
body.v2 .btn-solid{background:var(--ink);color:#111111}
body.v2 .btn-solid:hover{background:var(--accent);color:#111111}
body.v2 .btn-ghost{border:1px solid rgba(255,255,255,.38);color:var(--ink)}
body.v2 .btn-ghost:hover{border-color:#fff;color:var(--ink)}
body.v2 .roll{display:block;line-height:20px;text-shadow:0 48px currentColor;transition:transform .55s var(--ease)}
body.v2 .btn:hover .roll,body.v2 .btn:focus-visible .roll{transform:translateY(-48px)}
body.v2 .link-line{display:inline-flex;align-items:center;min-height:44px;font-size:16px;font-weight:500;color:var(--ink);background:linear-gradient(currentColor,currentColor) left 78%/100% 1px no-repeat;transition:background-size .5s var(--ease)}
body.v2 .link-line:hover{background-size:0 1px;background-position:right 78%}

/* Hero — video inside a capsule that opens to full screen as you scroll */
body.v2 .v2-hero{position:relative;height:230svh;min-height:0;max-height:none;padding:0;display:block;overflow:visible;isolation:auto}
body.v2 .v2-hero:after{display:none}
body.v2 .hero-stage{--p:1;--cw:min(30vw,440px);--ch:74svh;position:sticky;top:0;height:100svh;overflow:hidden}
body.v2 .hero-stage .hero-media{position:absolute;inset:0;z-index:0;background:#000;
 clip-path:inset(calc((1 - var(--p)) * (50% - var(--ch) / 2)) calc((1 - var(--p)) * (50% - var(--cw) / 2)) round calc((1 - var(--p)) * var(--cw) / 2));will-change:clip-path}
body.v2 .hero-stage .hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 45%),linear-gradient(180deg,rgba(0,0,0,.35),transparent 22%);opacity:var(--p)}
body.v2 .hero .hero-media img,body.v2 .hero .hero-video{object-position:center center}
body.v2 .hero-name{position:absolute;inset:0;z-index:2;margin:0;pointer-events:none;font-size:clamp(76px,14.6vw,270px);line-height:.8;letter-spacing:-.065em;font-weight:860;color:var(--ink)}
body.v2 .hero-word{position:absolute;white-space:nowrap;will-change:transform,opacity}
body.v2 .hero-word-a{left:calc(var(--pad) - .04em);top:15svh;transform:translate3d(calc(var(--p) * -45vw),0,0);opacity:calc(1 - var(--p) * 1.7)}
body.v2 .hero-word-b{right:var(--pad);bottom:22svh;transform:translate3d(calc(var(--p) * 45vw),0,0);opacity:calc(1 - var(--p) * 1.7)}
body.v2 .hero-foot{position:absolute;left:var(--pad);right:var(--pad);bottom:5svh;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;opacity:1}
body.v2 .hero-meta{margin:0;font-size:17px;line-height:1.45;color:var(--ink);max-width:none}
body.v2 .hero-actions{display:flex;gap:12px;margin:0;flex-wrap:wrap}
body.v2 .hero-motion{position:absolute;top:auto;bottom:calc(5svh + 70px);right:var(--pad);z-index:3;background:transparent;border:0;color:var(--soft);font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:0;padding:10px 0;min-height:44px;opacity:calc(1 - var(--p) * 2)}
body.v2 .hero-motion:hover{color:var(--ink);border:0}

/* Intro */
body.v2 .v2-intro{padding:24vh var(--pad) 16vh;max-width:1440px}
body.v2 .intro-text{margin:0;font-size:clamp(30px,3.9vw,64px);line-height:1.06;letter-spacing:-.035em;font-weight:720;max-width:24ch}
body.v2 .intro-text .w{opacity:.16;transition:opacity .35s linear}
body.v2 .intro-text .w.on{opacity:1}
body.v2 .credit-row{list-style:none;display:flex;flex-wrap:wrap;gap:8px 34px;padding:0;margin:64px 0 34px;color:var(--soft);font-size:16px}

/* Selected work — staggered two-column rhythm */
body.v2 .v2-work{padding-top:12vh}
body.v2 .motion-toolbar{margin-bottom:18px}
body.v2 .motion-toolbar p{font-size:15px;color:var(--muted)}
body.v2 .motion-toggle{border:1px solid #333;border-radius:999px;background:transparent;color:var(--ink);font-size:14px;padding:10px 18px}
body.v2 .filters{gap:10px;margin-bottom:9vh}
body.v2 .filters button{border:1px solid #333;border-radius:999px;background:transparent;color:var(--ink);font-size:14px;padding:11px 20px;transition:border-color .3s,background-color .3s,color .3s}
body.v2 .filters button:hover{border-color:#fff}
body.v2 .filters button[aria-pressed=true]{background:var(--ink);color:#111111;border-color:#fff}
body.v2 .work-grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:3vw;row-gap:10vh}
body.v2 .work-card:nth-child(odd){grid-column:1/8}
body.v2 .work-card:nth-child(even){grid-column:8/13;margin-top:24vh}
body.v2 .media-button{border-radius:12px;background:#0d0d0d}
body.v2 .media-button:after{background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 38%)}
body.v2 .media-button img{transition:transform 1.1s var(--ease),filter .4s}
body.v2 .media-button:hover img,body.v2 .media-button:focus-visible img{transform:scale(1.035)}
body.v2 .featured-film[data-category="screen stage"] .media-button img,body.v2 .featured-film[data-category="screen stage"] .scroll-preview{background:#0d0d0d}
body.v2 .media-action{font-size:14px;font-weight:500}
body.v2 .play-mark:before{border-color:rgba(255,255,255,.5)}
body.v2 .work-caption{margin-top:18px}
body.v2 .work-caption h3{font-size:20px;font-weight:600;letter-spacing:-.02em}
body.v2 .work-caption>span{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:0;color:var(--muted)}
body.v2 .section .work-summary{font-size:15px;color:var(--muted)}
body.v2 .work-outro{border:0;margin-top:14vh;justify-content:flex-start;gap:36px}

/* What I do — accordion */
body.v2 .v2-practice{padding:16vh var(--pad);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:4vw;align-items:start}
body.v2 .v2-practice .v2-head{position:sticky;top:110px}
body.v2 .practice-list details{border-top:1px solid var(--line)}
body.v2 .practice-list details:last-child{border-bottom:1px solid var(--line)}
body.v2 .practice-list summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;cursor:pointer;font-size:clamp(26px,3.3vw,54px);line-height:1;letter-spacing:-.04em;font-weight:780;color:#5c5c5c;transition:color .45s var(--ease)}
body.v2 .practice-list summary::-webkit-details-marker{display:none}
body.v2 .practice-list summary:hover,body.v2 .practice-list details[open] summary{color:var(--ink)}
body.v2 .practice-list i{position:relative;flex:0 0 22px;height:22px}
body.v2 .practice-list i:before,body.v2 .practice-list i:after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:currentColor;transition:transform .45s var(--ease)}
body.v2 .practice-list i:after{transform:rotate(90deg)}
body.v2 .practice-list details[open] i:after{transform:rotate(0)}
body.v2 .practice-list details p{margin:-6px 0 30px;font-size:18px;line-height:1.6;color:var(--soft);max-width:48ch}

/* Teaching & artist */
body.v2 .v2-teaching{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center}
body.v2 .v2-teaching h2,body.v2 .v2-about h2{font-size:clamp(40px,5vw,84px);line-height:.95;letter-spacing:-.05em;font-weight:800;margin:0 0 30px}
body.v2 .v2-teaching .btn{margin-top:16px}
body.v2 .v2-teaching img{border-radius:12px}
body.v2 .v2-teaching figcaption{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;color:var(--muted);margin-top:14px}
body.v2 .v2-about{display:grid;grid-template-columns:.8fr 1.2fr;gap:7vw;align-items:center}
body.v2 .v2-about .portrait-wrap img{border-radius:12px;aspect-ratio:4/5;object-fit:cover}
body.v2 .v2-about .lead{font-size:24px;line-height:1.4;color:var(--ink)}

/* Call to action — capsule portrait under oversized type */
body.v2 .v2-cta{padding:8vh var(--pad) 12vh}
body.v2 .cta-link{position:relative;display:grid;place-items:center;min-height:92svh;color:var(--ink)}
body.v2 .cta-capsule{display:block;width:min(26vw,380px);aspect-ratio:3/5;border-radius:999px;overflow:hidden;transition:transform .9s var(--ease)}
body.v2 .cta-capsule img{width:100%;height:100%;object-fit:cover;filter:grayscale(.15) contrast(1.05)}
body.v2 .cta-text{position:absolute;inset:auto 0;text-align:center;font-size:clamp(58px,10.6vw,196px);line-height:.84;letter-spacing:-.06em;font-weight:860;text-transform:uppercase;transition:color .6s var(--ease)}
body.v2 .cta-link:hover .cta-capsule,body.v2 .cta-link:focus-visible .cta-capsule{transform:scale(1.05)}
body.v2 .cta-link:hover .cta-text,body.v2 .cta-link:focus-visible .cta-text{color:var(--accent)}

/* Contact */
body.v2 .v2-contact{padding-top:10vh}
body.v2 .v2-contact .v2-head h2{max-width:13ch}
body.v2 .contact-intro{margin-top:-18px}
body.v2 .booking-form{border-top:1px solid var(--line);max-width:960px}
body.v2 .booking-form h3{font-size:26px;font-weight:700;letter-spacing:-.02em}
body.v2 .field label{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:0;color:var(--soft)}
body.v2 .field input,body.v2 .field select,body.v2 .field textarea{border-bottom-color:#3a3a3a;font-size:18px;transition:border-color .3s}
body.v2 .field input:focus,body.v2 .field select:focus,body.v2 .field textarea:focus{border-bottom-color:#fff}
body.v2 .field select option{background:#000}
body.v2 .form-actions .button{border-radius:999px;background:var(--ink);color:#111111;min-height:54px;padding:0 28px;font-size:15px;font-weight:600;letter-spacing:-.01em;text-transform:none;gap:16px;transition:background-color .45s var(--ease)}
body.v2 .form-actions .button:hover{background:var(--accent)}
body.v2 .contact-alt{margin-top:12vh;max-width:960px}
body.v2 .email{font-size:clamp(28px,5vw,76px);font-weight:760;letter-spacing:-.05em;border-bottom:1px solid #3a3a3a;transition:color .45s var(--ease)}
body.v2 .email:hover{color:var(--accent)}
body.v2 .copy-email{color:var(--ink);border-bottom-color:#555;font-size:15px}
body.v2 .social-links{border-top:0;margin-top:9vh;padding-top:0;gap:8px 40px;font-size:20px;font-weight:600}
body.v2 .social-links a{border-bottom:0;background:linear-gradient(currentColor,currentColor) left 80%/100% 1px no-repeat;transition:background-size .5s var(--ease)}
body.v2 .social-links a:hover{background-size:0 1px;background-position:right 80%}
body.v2 .social-links em{font-size:14px;font-weight:400;color:var(--muted)}

/* Footer, sticky booking bar, dialog */
body.v2 .v2-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:40px var(--pad);border-top:1px solid var(--line);font-size:14px}
body.v2 .v2-footer span{display:flex;gap:24px;flex-wrap:wrap;color:var(--soft);font-size:14px}
body.v2 .v2-footer .brand{font-weight:820;letter-spacing:-.03em}
body.v2 .v2-footer>a:last-child{font-size:14px;color:var(--soft)}
body.v2 .mobile-booking{background:var(--accent);color:#111111}
body.v2 dialog{background:#000;border:1px solid var(--line);border-radius:16px;color:var(--ink)}
body.v2 .dialog-top{background:#000}
body.v2 .close-dialog{border-radius:999px;border-color:#444}
body.v2 .video-options{background:#0d0d0d}
body.v2 .project-details h2{font-weight:800;letter-spacing:-.045em}

@media(max-width:950px){
 body.v2 .v2-practice{grid-template-columns:1fr}
 body.v2 .v2-practice .v2-head{position:static}
}
@media(max-width:700px){
 body.v2{--pad:6vw}
 body.v2 .v2-header{padding:16px var(--pad);flex-wrap:wrap;gap:4px}
 body.v2 .v2-header nav{width:100%;justify-content:space-between;gap:10px;font-size:14px}
 body.v2 .hero-stage{--cw:62vw;--ch:42svh}
 body.v2 .v2-hero{height:200svh}
 body.v2 .hero-name{font-size:19vw}
 body.v2 .hero-word-a{top:17svh}
 body.v2 .hero-word-b{bottom:auto;top:57svh}
 body.v2 .hero-foot{bottom:calc(62px + 3svh);flex-direction:column;align-items:flex-start;gap:16px}
 body.v2 .hero-meta{font-size:15px}
 body.v2 .hero-actions .btn{min-height:48px;padding:0 20px;font-size:14px}
 body.v2 .v2-intro{padding:16vh var(--pad) 10vh}
 body.v2 .intro-text{font-size:clamp(26px,7.4vw,40px)}
 body.v2 .work-grid{grid-template-columns:1fr;row-gap:56px}
 body.v2 .work-card:nth-child(odd),body.v2 .work-card:nth-child(even){grid-column:1/-1;margin-top:0}
 body.v2 .filters{margin-bottom:40px}
 body.v2 .v2-teaching,body.v2 .v2-about{grid-template-columns:1fr;gap:36px}
 body.v2 .cta-link{min-height:72svh}
 body.v2 .cta-capsule{width:58vw}
 body.v2 .cta-text{font-size:17vw}
 body.v2 .work-outro{flex-direction:column;align-items:flex-start;gap:6px}
 body.v2 .social-links{font-size:18px}
 body.v2 .v2-footer{padding-bottom:calc(30px + 62px)}
}
@media(prefers-reduced-motion:reduce){
 body.v2 .v2-hero{height:100svh}
 body.v2 .hero-stage{position:relative}
 body.v2 .intro-text .w{opacity:1;transition:none}
 body.v2 .roll,body.v2 .media-button img,body.v2 .cta-capsule,body.v2 .btn,body.v2 .practice-list i:before,body.v2 .practice-list i:after{transition:none}
}

/* Secondary pages (career, video library, thank-you) */
body.v2 .archive-intro{padding-top:20vh}
body.v2 .archive-intro h1,body.v2 .thanks h1{font-weight:860;letter-spacing:-.06em;line-height:.86}
body.v2 .section .archive-note{border-left-color:#444}
body.v2 .career-list h3{font-weight:650;letter-spacing:-.02em}
body.v2 .career-list .career-meta{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:0;text-transform:none;color:var(--soft)}
body.v2 .career-list article{border-top-color:var(--line)}
body.v2 .library-grid .media-label{display:none}
body.v2 .external-videos a{border-top-color:var(--line)}
body.v2>footer:not(.v2-footer){border-top:1px solid var(--line);padding:40px var(--pad)}
body.v2 .button{border-radius:999px;background:var(--ink);color:#111111}
body.v2 .button:hover{background:var(--accent);color:#111111}

/* Hero corner controls: sound (starts off) + pause */
body.v2 .hero-controls{position:absolute;right:var(--pad);bottom:calc(5svh + 74px);z-index:4;display:flex;gap:8px}
body.v2 .hero-controls .hero-motion{position:static;opacity:1;padding:0 14px;border:1px solid rgba(255,255,255,.3);border-radius:999px;min-height:40px;color:var(--ink);background:rgba(0,0,0,.35);backdrop-filter:blur(8px)}
body.v2 .hero-sound{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px 0 10px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(0,0,0,.35);backdrop-filter:blur(8px);color:var(--ink);font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;cursor:pointer;transition:border-color .3s,background-color .3s}
body.v2 .hero-sound[hidden],body.v2 .hero-controls .hero-motion[hidden]{display:none}
body.v2 .hero-sound svg{width:18px;height:18px}
body.v2 .hero-sound:hover,body.v2 .hero-controls .hero-motion:hover{border-color:#fff}
body.v2 .hero-sound[aria-pressed=true]{background:var(--ink);color:#111111;border-color:#fff}

/* Films inside cards */
body.v2 .film{position:relative;border-radius:12px;overflow:hidden;background:#0d0d0d}
body.v2 .film .media-button{border-radius:0}
body.v2 .film-video{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:contain;background:transparent;pointer-events:none;visibility:hidden}
body.v2 .film.is-full .film-video{visibility:visible;background:#000}
body.v2 .film.is-full .media-action,body.v2 .film.is-full .play-mark{opacity:0}
body.v2 .film-controls{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;display:flex;align-items:center;gap:8px;padding:4px 6px;border-radius:999px;background:rgba(0,0,0,.6);backdrop-filter:blur(10px);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .35s var(--ease),transform .35s var(--ease)}
body.v2 .film.is-full .film-controls.is-visible,body.v2 .film.is-full .film-controls:has(:focus-visible){opacity:1;transform:none;pointer-events:auto}
body.v2 .film-btn{flex:0 0 40px;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}
body.v2 .film-btn svg{width:20px;height:20px}
body.v2 .film-sound{background:var(--ink);color:#111111}
body.v2 .film.has-sound .film-sound{background:var(--accent)}
body.v2 .film-seek{flex:1;min-width:0;height:24px;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
body.v2 .film-seek::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:rgba(255,255,255,.35)}
body.v2 .film-seek::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;margin-top:-5px;border-radius:50%;background:var(--ink);border:0}
body.v2 .film-seek::-moz-range-track{height:3px;border-radius:3px;background:rgba(255,255,255,.35)}
body.v2 .film-seek::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--ink);border:0}
body.v2 .film-time{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:11px;color:#ddd;white-space:nowrap;min-width:72px;text-align:right}
body.v2 .film-error .film-controls{display:none}

/* Credits under each card */
body.v2 .card-credits{margin-top:10px}
body.v2 .card-credits summary{display:inline-flex;align-items:center;min-height:40px;font-size:14px;color:var(--soft);cursor:pointer;list-style:none}
body.v2 .card-credits summary::-webkit-details-marker{display:none}
body.v2 .card-credits summary::after{content:"+";margin-left:8px;transition:transform .3s var(--ease)}
body.v2 .card-credits[open] summary::after{transform:rotate(45deg)}
body.v2 .card-credits summary:hover{color:var(--ink)}
body.v2 .section .card-credits p{font-size:14px;line-height:1.6;color:var(--soft);margin:6px 0 10px}
body.v2 .section .card-credits .card-credit-line{font-size:13px;color:var(--muted)}
body.v2 .card-credits .link-line{font-size:14px}
@media(max-width:700px){
 body.v2 .hero-controls{top:118px;bottom:auto;gap:6px}
 body.v2 .hero-sound{width:40px;padding:0;justify-content:center}
 body.v2 .hero-sound span{display:none}
 body.v2 .hero-controls .hero-motion{width:40px;padding:0;font-size:0;display:grid;place-items:center}
 body.v2 .hero-controls .hero-motion::before{content:"";width:10px;height:12px;border-left:3px solid #fff;border-right:3px solid #fff}
 body.v2 .hero-controls .hero-motion[aria-pressed=true]::before{width:0;height:0;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff;margin-left:3px}
 body.v2 .film-time{min-width:0;font-size:10px}
}

/* Header: hides while scrolling down past the opening, returns solid when scrolling up */
body.v2 .v2-header{transition:transform .45s var(--ease),background-color .3s}
body.v2 .v2-header.is-solid{mix-blend-mode:normal;background:rgba(0,0,0,.84);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
body.v2 .v2-header.is-hidden:not(:focus-within){transform:translateY(-105%)}

/* Theater — big screen that grows out of the card */
body.v2 .theater{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--ink);overflow:hidden}
body.v2 .theater::backdrop{background:rgba(0,0,0,.55)}
body.v2 .theater-shell{position:absolute;inset:0;background:#000;display:flex;flex-direction:column;padding:22px var(--pad) calc(18px + env(safe-area-inset-bottom,0px))}
body.v2 .theater-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px}
body.v2 .theater-label{margin:0 0 10px}
body.v2 .theater-title{font-size:clamp(28px,4.2vw,68px);font-weight:820;letter-spacing:-.045em;line-height:.95;margin:0}
body.v2 .theater-meta{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;color:var(--soft);margin:12px 0 0}
body.v2 .theater-close{flex:0 0 auto;min-height:46px;padding:0 22px;border:1px solid rgba(255,255,255,.4);border-radius:999px;background:transparent;color:var(--ink);font-size:15px;font-weight:600;cursor:pointer;transition:background-color .3s,color .3s,border-color .3s}
body.v2 .theater-close:hover{background:var(--ink);color:#111111;border-color:#fff}
body.v2 .theater-stage{position:relative;flex:1;min-height:0;border-radius:14px;overflow:hidden;background:#050505}
body.v2 .theater-stage .film-video{visibility:visible;background:#000;pointer-events:auto}
body.v2 .theater-stage .film-controls{left:50%;right:auto;width:min(780px,calc(100% - 24px));bottom:14px;transform:translate(-50%,8px)}
body.v2 .theater-stage .film-controls.is-visible,body.v2 .theater-stage .film-controls:has(:focus-visible){opacity:1;pointer-events:auto;transform:translate(-50%,0)}
body.v2 .film.in-theater .media-action{opacity:0}
@media(max-width:700px){
 body.v2 .theater-shell{padding:16px 4vw calc(14px + env(safe-area-inset-bottom,0px))}
 body.v2 .theater-title{font-size:30px}
 body.v2 .theater-close{min-height:42px;padding:0 16px;font-size:14px}
 body.v2 .theater-stage{border-radius:10px}
 body.v2 .theater-stage .film-controls{width:calc(100% - 16px);bottom:8px}
}

/* No play glyph over the films (iOS draws it as an emoji); the label "Tap to play / Hover to play" is enough */
body.v2 .play-mark{display:none}
/* Big screen on a phone held sideways: the film fills the screen, only a small Close button stays */
@media(orientation:landscape) and (max-height:520px){
 body.v2 .theater-shell{padding:0}
 body.v2 .theater-top{position:absolute;top:10px;left:12px;right:12px;z-index:5;margin:0;justify-content:flex-end;pointer-events:none}
 body.v2 .theater-top>div{display:none}
 body.v2 .theater-close{pointer-events:auto;min-height:40px;background:rgba(0,0,0,.55);backdrop-filter:blur(8px)}
 body.v2 .theater-stage{border-radius:0}
 body.v2 .theater-stage .film-controls{bottom:10px}
}
body.v2 .footer-credit{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;color:var(--muted)}

/* Photo gallery inside a card: photos glide sideways, the outgoing one shrinks and fades like the photo series */
body.v2 .gallery{position:absolute;inset:0;z-index:0;overflow:hidden;background:#000}
body.v2 .media-button:has(.gallery){touch-action:pan-y}
body.v2 .g-track{display:flex;height:100%;will-change:transform;transition:transform 1.1s cubic-bezier(.65,0,.35,1)}
body.v2 .g-track.no-anim,body.v2 .g-track.no-anim .g-slide{transition:none}
body.v2 .g-slide{flex:0 0 100%;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none;
 transform:scale(.88);opacity:.45;border-radius:22px;transition:transform 1.1s cubic-bezier(.65,0,.35,1),opacity 1.1s ease,border-radius 1.1s ease}
body.v2 .g-slide.is-on{transform:scale(1);opacity:1;border-radius:0}
body.v2 .g-dots{position:absolute;right:20px;bottom:22px;z-index:3;display:flex;gap:6px}
body.v2 .g-dots span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.4);transition:background-color .4s,width .4s}
body.v2 .g-dots span.is-on{width:18px;border-radius:3px;background:var(--ink)}
@media(prefers-reduced-motion:reduce){body.v2 .g-track,body.v2 .g-slide{transition:none}}

/* Letters lift slightly under the mouse */
body.v2 .lt{display:inline-block;transition:transform .45s cubic-bezier(.34,1.56,.64,1),color .3s}
body.v2 .lw{display:inline-block;white-space:nowrap}
body.v2 .lt.up{transform:translateY(-.12em) rotate(-3deg)}
body.v2 .lt.up-s{transform:translateY(-.05em)}
@media(prefers-reduced-motion:reduce){body.v2 .lt{transition:none}body.v2 .lt.up,body.v2 .lt.up-s{transform:none}}

/* Photo series (Markus Ranck) — drag / swipe rail */
body.v2 .v2-photos{padding:14vh 0 12vh;overflow:hidden}
body.v2 .photos-head{padding:0 var(--pad)}
body.v2 .photos-head h2{margin-bottom:28px}
body.v2 .photos-intro{color:var(--soft);font-size:clamp(17px,1.5vw,22px);line-height:1.5;max-width:46ch;margin:0 0 7vh}
body.v2 .photos-rail{position:relative;display:flex;align-items:center;gap:clamp(12px,1.6vw,24px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:2vh var(--pad);scroll-padding:0 var(--pad);scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab;outline:0;touch-action:pan-x pan-y;-webkit-user-select:none;user-select:none}
body.v2 .photos-rail::-webkit-scrollbar{display:none}
body.v2 .photos-rail.is-drag{cursor:grabbing;scroll-snap-type:none}
body.v2 .photos-rail:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
body.v2 .ph{flex:0 0 auto;margin:0;height:min(72vh,760px);aspect-ratio:var(--ar,3/4);scroll-snap-align:center;position:relative;overflow:hidden;border-radius:22px;background:#111;
 transform:scale(calc(1 - var(--d,0) * .09));opacity:calc(1 - var(--d,0) * .5);transform-origin:center;
 clip-path:inset(18% 32% 18% 32% round 999px);transition:clip-path 1.25s cubic-bezier(.7,0,.2,1) calc(var(--i) * 60ms)}
body.v2 .photos-credit{transition:opacity .4s var(--ease)}
body.v2 .photos-credit.is-empty{opacity:0}
body.v2 .v2-photos.in .ph{clip-path:inset(0 round 22px)}
body.v2 .ph img{display:block;width:100%;height:100%;object-fit:cover;transform:translateX(calc(var(--s,0) * -5%)) scale(1.1);pointer-events:none;-webkit-user-drag:none}
body.v2 .ph.is-active{opacity:1}
body.v2 .photos-bar{display:flex;align-items:center;gap:24px;padding:28px var(--pad) 0;font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-size:12px;color:var(--soft)}
body.v2 .photos-credit{white-space:nowrap}
body.v2 .photos-progress{flex:1;height:1px;background:var(--line);position:relative;overflow:hidden}
body.v2 .photos-progress i{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(var(--prog,.1))}
body.v2 .photos-count{white-space:nowrap;font-variant-numeric:tabular-nums}
body.v2 .photos-count b{color:var(--ink);font-weight:400}
body.v2 .photos-nav{display:flex;gap:10px}
body.v2 .photos-nav button{width:48px;height:48px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
body.v2 .photos-nav button:hover{background:var(--ink);color:#111111;border-color:#fff}
body.v2 .photos-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:700px){
 body.v2 .v2-photos{padding:11vh 0 9vh}
 body.v2 .photos-intro{font-size:17px;margin-bottom:5vh}
 body.v2 .photos-rail{gap:12px;padding:1vh 11vw;scroll-padding:0 11vw;min-height:calc(78vw * 4 / 3 + 2vh)}
 body.v2 .ph{height:auto;width:78vw;border-radius:16px}
 body.v2 .ph.land{width:78vw}
 body.v2 .ph:not(.land){aspect-ratio:3/4}
 body.v2 .v2-photos.in .ph{clip-path:inset(0 round 16px)}
 body.v2 .photos-bar{flex-wrap:wrap;gap:14px 18px}
 body.v2 .photos-progress{order:3;flex-basis:100%}
 body.v2 .photos-credit{flex:1}
 body.v2 .photos-nav{display:none}
}
@media(prefers-reduced-motion:reduce){body.v2 .ph{transition:none;clip-path:none;transform:none}body.v2 .ph img{transform:none}}
body.v2 .photos-hint{display:none}
@media(hover:none){body.v2 .photos-hint{display:inline-flex;align-items:center;gap:6px;color:var(--ink);transition:opacity .5s}body.v2 .photos-hint::after{content:"";width:18px;height:1px;background:currentColor;animation:ph-hint 1.6s var(--ease) infinite}body.v2 .v2-photos.used .photos-hint{opacity:0}}
@keyframes ph-hint{0%{transform:translateX(0);opacity:1}70%{transform:translateX(10px);opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){body.v2 .photos-hint::after{animation:none}}

/* Teaching uses the same photo rail as the photo series; the places in the text follow the photos */
body.v2 .v2-photos.v2-teaching{display:block}
body.v2 .v2-teaching .photos-head .btn{margin-top:4px}
body.v2 .v2-teaching .photos-intro{margin-bottom:22px}
body.v2 .v2-teaching .t-places{margin-bottom:34px}
body.v2 .t-place{font:inherit;color:var(--muted);background:none;border:0;padding:0;cursor:pointer;text-align:left;
 background-image:linear-gradient(currentColor,currentColor),linear-gradient(rgba(255,255,255,.22),rgba(255,255,255,.22));background-repeat:no-repeat;background-size:0 1px,100% 1px;background-position:left 100%,left 100%;
 transition:color .5s var(--ease),background-size .9s var(--ease)}
body.v2 .t-place:hover{color:var(--ink)}
body.v2 .t-place.is-on{color:var(--ink);background-size:100% 1px,100% 1px}
body.v2 .v2-teaching .photos-head{margin-bottom:5vh}
@media(max-width:700px){body.v2 .v2-teaching .photos-bar .photos-credit{flex-basis:100%;order:-1}body.v2 .v2-teaching .photos-rail{min-height:0}body.v2 .v2-teaching .photos-hint{margin-left:auto}}



/* Original bboymascot.com palette and type: dark green-black, warm off-white, sand accents; Arial with Georgia for emphasis */
body.v2{--btn:#ffcc33;--accent-2:#ffcc33;--grad:linear-gradient(100deg,#ffcc33 0%,#ffcc33 100%);--card:#1a1d21;--card-2:#202328;--bg:#111316;--ink:#f3f3f1;--muted:#7f848b;--soft:#aeb2b8;--line:#2a2e33;--accent:#ffcc33;background:#111316;color:#f3f3f1}
body.v2 .mono-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase}
body.v2 .media-button,body.v2 .film,body.v2 .ph,body.v2 .gallery{background:#1a1d21}
body.v2 .video-options{background:#102022}
body.v2 dialog,body.v2 .dialog-top,body.v2 .theater-shell{background:#111316}
body.v2 .btn-solid{background:var(--btn);color:#111111}
body.v2 .btn-solid:hover{background:#ffd966;color:#111111}
body.v2 .button,body.v2 .form-actions .button{background:var(--btn);color:#111111;border-color:var(--btn)}
body.v2 .button:hover,body.v2 .form-actions .button:hover{background:#ffd966;color:#111111}
body.v2 .mobile-booking{background:var(--btn);color:#111111}
body.v2 .mobile-booking:hover{background:#ffd966}
body.v2 .filters button[aria-pressed=true]{background:var(--btn);color:#111111;border-color:var(--btn)}
body.v2 ::selection{background:var(--btn);color:#111111}
body.v2 .photos-progress i{background:#f3f3f1}
body.v2 .g-dots span.is-on{background:#f3f3f1}
body.v2 .film.has-sound .film-sound{background:var(--btn);color:#111111}
/* Type pairing from bboymascot.com: heavy Arial + Georgia italic in sand for the second beat */
body.v2 h1 em,body.v2 h2 em,body.v2 .cta-text em{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;color:var(--accent);letter-spacing:-.045em}
body.v2 .hero-name{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-weight:900;letter-spacing:-.065em;text-shadow:0 2px 30px rgba(0,0,0,.25)}
body.v2 .hero-name em{letter-spacing:-.055em;padding-right:.06em}
body.v2 .hero-meta strong{font-weight:700;font-size:1.25em;display:inline-block;margin-bottom:4px}
body.v2 .cta-text em{text-transform:none}
body.v2 .cta-link:hover .cta-text em,body.v2 .cta-link:focus-visible .cta-text em{color:var(--ink)}
@media(max-width:700px){body.v2 .hero-word-b{top:50svh}}

body.v2 .credit-link,body.v2 .footer-credit a{color:var(--ink);background:linear-gradient(currentColor,currentColor) left 100%/100% 1px no-repeat;padding-bottom:1px}
body.v2 .credit-link:hover,body.v2 .footer-credit a:hover{color:var(--accent)}
body.v2 .card-credits .card-film-by{display:inline-block;margin:0 0 10px}

body.v2 .hero-credit{margin:10px 0 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}
body.v2 .hero-credit a{color:var(--ink);background:linear-gradient(currentColor,currentColor) left 100%/100% 1px no-repeat;padding-bottom:1px}
body.v2 .hero-credit a:hover{color:var(--accent)}

/* Phones (portrait): the opening film fills the whole screen (its own sharp vertical 1080x1920 cut from the 4K master) */
@media(max-width:700px){
 body.v2 .hero .hero-media img,body.v2 .hero .hero-video{object-fit:cover;object-position:center center}
 body.v2 .hero-stage .hero-media:after{background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,.25) 38%,transparent 55%),linear-gradient(180deg,rgba(0,0,0,.45),transparent 20%)}
}
@media(orientation:landscape) and (max-height:520px){body.v2 .hero-controls{bottom:auto;top:calc(64px + 2svh)}body.v2 .hero-meta{font-size:14px}}
/* Legal pages */
body.v2 .legal{max-width:860px;padding-top:20vh}
body.v2 .legal h1{font-size:clamp(44px,7vw,104px);line-height:.9;letter-spacing:-.05em;font-weight:900;margin:0 0 6vh;hyphens:manual}
body.v2 .legal h2{font-size:20px;letter-spacing:-.01em;font-weight:700;margin:42px 0 10px;color:var(--ink)}
body.v2 .legal p{font-size:16px;line-height:1.7;color:var(--soft);max-width:68ch}
body.v2 .legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
body.v2 .legal-date{margin-top:40px;font-size:13px!important;color:var(--muted)!important}
body.v2 .footer-legal a{color:var(--soft)}
body.v2 .form-privacy{font-size:13px;color:var(--muted);margin:14px 0 0}body.v2 .form-privacy a{color:var(--soft);text-decoration:underline;text-underline-offset:3px}
/* Showreel: one wide film above the filters */
body.v2 .reel-grid{margin:0 0 9vh;row-gap:0}
body.v2 .reel-grid .work-card.reel-card{grid-column:1/-1;margin-top:0}
body.v2 .reel-card .media-button img,body.v2 .reel-card .scroll-preview{aspect-ratio:16/9;object-fit:cover}
body.v2 .reel-card .work-caption h3{font-size:clamp(28px,3vw,44px)}
/* Credits band: names glide slowly, pause on hover */
body.v2 .credit-band{margin:64px 0 34px}
body.v2 .credit-band .mono-label{margin-bottom:16px}
body.v2 .credit-marquee{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
body.v2 .credit-band .credit-row{flex:0 0 auto;display:flex;flex-wrap:nowrap;gap:0;margin:0;padding:0;animation:credit-slide 46s linear infinite}
body.v2 .credit-band .credit-row li{white-space:nowrap;font-size:clamp(20px,2.2vw,30px);font-weight:700;letter-spacing:-.02em;color:var(--ink);padding:0 .9em}
body.v2 .credit-band .credit-row li:nth-child(even){font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;color:var(--accent)}
body.v2 .credit-band .credit-row li::after{content:"·";color:var(--muted);margin-left:1.8em;font-style:normal}
body.v2 .credit-marquee:hover .credit-row{animation-play-state:paused}
@keyframes credit-slide{to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){body.v2 .credit-band .credit-row{animation:none;flex-wrap:wrap}body.v2 .credit-band .credit-row[aria-hidden]{display:none}}
body.v2 .press-link{margin-left:28px}
@media(max-width:700px){body.v2 .press-link{display:table;margin:18px 0 0}}
body.v2 .press-btn{display:inline-flex;align-items:center;min-height:44px;margin-left:12px;padding:0 18px;border:1px solid rgba(240,237,228,.3);border-radius:999px;font-size:14px;color:var(--ink);transition:background-color .3s,color .3s}
body.v2 .press-btn:hover{background:var(--btn);color:#111111;border-color:var(--btn)}
body.v2 .lang-toggle{font:inherit;font-size:13px;letter-spacing:.06em;min-height:32px;padding:0 11px;border:1px solid currentColor;border-radius:999px;background:transparent;color:inherit;cursor:pointer;opacity:.85;transition:opacity .3s}
body.v2 .lang-toggle:hover{opacity:1}
@media(max-width:700px){body.v2 .v2-header .lang-toggle{position:absolute;top:14px;right:var(--pad);min-height:30px;font-size:12px}}
@media(min-width:701px){body.v2 .v2-header .lang-toggle{margin-left:22px}body.v2 .v2-header nav{margin-left:auto}}
html[lang="de"] body.v2 .cta-text em{font-size:.6em;letter-spacing:-.03em}
body.v2 .legal-todo{color:#e8b04a;font-weight:700}
/* Partners / sponsors */
body.v2 .v2-partners{padding:12vh var(--pad) 6vh}
body.v2 .partners-head h2{font-size:clamp(36px,4.6vw,72px);line-height:.95;letter-spacing:-.05em;font-weight:900;margin:0 0 18px}
body.v2 .partners-intro{color:var(--soft);font-size:17px;max-width:46ch;margin:0 0 6vh}
body.v2 .partners-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,28px)}
body.v2 .partner{position:relative;display:flex;flex-direction:column;gap:28px;padding:clamp(24px,3vw,44px);border:1px solid var(--line);border-radius:22px;background:rgba(240,237,228,.02);color:var(--ink);overflow:hidden;transition:border-color .5s var(--ease),background-color .5s var(--ease),transform .6s var(--ease)}
body.v2 .partner:hover{border-color:rgba(240,237,228,.4);background:rgba(240,237,228,.05);transform:translateY(-4px)}
body.v2 .partner-logo{display:flex;align-items:center;min-height:clamp(70px,8vw,120px)}
body.v2 .partner-logo img{max-height:clamp(56px,6vw,96px);max-width:70%;width:auto;object-fit:contain}
body.v2 .partner-word{font-size:clamp(34px,4vw,62px);font-weight:900;letter-spacing:-.05em;line-height:.9}
body.v2 .partner:nth-child(even) .partner-word{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;color:var(--accent);letter-spacing:-.03em}
body.v2 .partner-meta{display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--line);padding-top:18px}
body.v2 .partner-kind{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
body.v2 .partner-desc{font-size:15px;color:var(--soft)}
body.v2 .partner-go{position:absolute;top:clamp(20px,2.4vw,34px);right:clamp(20px,2.4vw,34px);font-size:22px;color:var(--soft);transition:transform .5s var(--ease),color .3s}
body.v2 .partner:hover .partner-go{transform:translate(4px,-4px);color:var(--ink)}
@media(max-width:700px){body.v2 .partners-grid{grid-template-columns:1fr}body.v2 .v2-partners{padding:9vh var(--pad) 4vh}}
body.v2 .partner-logo img{display:block;height:auto;transition:transform .6s var(--ease),opacity .4s}
body.v2 .partner-logo[data-partner="middle-beast"] img{width:clamp(74px,7.5vw,112px);max-height:none}
body.v2 .partner-logo[data-partner="steppix"] img{width:clamp(190px,20vw,300px);max-height:none;max-width:80%}
body.v2 .partner:hover .partner-logo img{transform:scale(1.04)}
/* partner link button: thin ring + drawn arrow, arrow swaps on hover */
body.v2 .partner-go{position:absolute;top:clamp(18px,2.2vw,30px);right:clamp(18px,2.2vw,30px);width:50px;height:50px;border-radius:50%;border:1px solid rgba(240,237,228,.24);color:var(--ink);display:grid;place-items:center;font-size:0;transform:none;background:transparent;transition:background-color .45s var(--ease),border-color .45s var(--ease),color .3s,transform .5s var(--ease)}
body.v2 .partner-go .pg-track{position:relative;width:20px;height:20px;overflow:hidden;display:block}
body.v2 .partner-go .pg-a,body.v2 .partner-go .pg-b{position:absolute;inset:0;display:block;transition:transform .55s var(--ease)}
body.v2 .partner-go svg{width:20px;height:20px;display:block}
body.v2 .partner-go .pg-b{transform:translate(-120%,120%)}
body.v2 .partner:hover .partner-go,body.v2 .partner:focus-visible .partner-go{background:var(--button,var(--btn));border-color:var(--button,var(--btn));color:#111111;transform:rotate(0deg) scale(1.06)}
body.v2 .partner:hover .pg-a,body.v2 .partner:focus-visible .pg-a{transform:translate(120%,-120%)}
body.v2 .partner:hover .pg-b,body.v2 .partner:focus-visible .pg-b{transform:translate(0,0)}
body.v2 .partner:active .partner-go{transform:scale(.94)}
@media (max-width:760px){body.v2 .partner-go{width:44px;height:44px}body.v2 .partner-go .pg-track,body.v2 .partner-go svg{width:18px;height:18px}}
@media (prefers-reduced-motion:reduce){body.v2 .partner-go,body.v2 .partner-go .pg-a,body.v2 .partner-go .pg-b{transition:none}}

/* ===== Opening-film controls: one glass capsule, drawn icons, live progress ring ===== */
body.v2 .hero-controls{gap:4px;padding:4px;border-radius:999px;background:rgba(8,14,15,.42);border:1px solid rgba(240,237,228,.16);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%)}
body.v2 .hero-controls:not(:has(button:not([hidden]))){display:none}
body.v2 .hero-sound{height:44px;min-height:44px;padding:0 16px 0 13px;gap:9px;border:0;border-radius:999px;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;font-size:13px;letter-spacing:.02em;transition:background-color .4s var(--ease),color .3s,transform .2s}
body.v2 .hero-sound .hs-ic{display:inline-grid;width:18px;height:18px}
body.v2 .hero-sound .hs-ic svg{width:18px;height:18px}
body.v2 .hero-sound .hs-eq{display:inline-flex;align-items:flex-end;gap:2px;height:13px;width:0;margin-left:-9px;overflow:hidden;transition:width .4s var(--ease),margin .4s var(--ease)}
body.v2 .hero-sound .hs-eq i{flex:0 0 2px;height:100%;border-radius:1px;background:currentColor;transform-origin:50% 100%;transform:scaleY(.3)}
body.v2 .hero-sound:hover{background:rgba(240,237,228,.1);border-color:transparent}
body.v2 .hero-sound[aria-pressed=true]{background:var(--btn);color:#111111;border-color:transparent}
body.v2 .hero-sound[aria-pressed=true] .hs-eq{width:14px;margin-left:0}
body.v2 .hero-sound[aria-pressed=true] .hs-eq i{animation:hs-eq .9s ease-in-out infinite alternate}
body.v2 .hero-sound .hs-eq i:nth-child(2){animation-delay:-.45s}
body.v2 .hero-sound .hs-eq i:nth-child(3){animation-delay:-.2s}
body.v2 .hero-sound .hs-eq i:nth-child(4){animation-delay:-.65s}
@keyframes hs-eq{0%{transform:scaleY(.22)}100%{transform:scaleY(1)}}
body.v2 .hero-controls .hero-motion{position:relative;inset:auto;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:rgba(240,237,228,.08);backdrop-filter:none;-webkit-backdrop-filter:none;display:grid;place-items:center;font-size:0;color:var(--ink);transition:background-color .3s,transform .2s}
body.v2 .hero-controls .hero-motion::before{content:none}
body.v2 .hero-controls .hero-motion:hover{background:rgba(240,237,228,.17)}
body.v2 .hero-motion .hm-icon{position:relative;z-index:1;width:18px;height:18px}
body.v2 .hero-motion .hm-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
body.v2 .hero-motion .hm-ring circle{fill:none;stroke:var(--btn);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--prog,0));transition:stroke-dashoffset .3s linear}
body.v2 .hero-sound:active,body.v2 .hero-controls .hero-motion:active{transform:scale(.94)}

/* ===== Phone menu ===== */
body.v2 .menu-btn{display:none}
body.v2 .site-menu{display:none}
@media(max-width:700px){
 body.v2 .v2-header{flex-wrap:nowrap;gap:8px;padding:14px var(--pad)}
 body.v2 .v2-header nav{display:none}
 body.v2 .v2-header .brand{margin-right:auto}
 body.v2 .v2-header .lang-toggle{position:static;min-height:38px;padding:0 13px;font-size:12px}
 body.v2 .menu-btn{display:inline-flex;align-items:center;gap:10px;min-height:38px;padding:0 5px 0 15px;border:1px solid currentColor;border-radius:999px;background:transparent;color:inherit;font:inherit;font-size:13px;letter-spacing:.04em;cursor:pointer;-webkit-tap-highlight-color:transparent}
 body.v2 .menu-btn .mb-lines{position:relative;width:28px;height:28px;border-radius:50%;background:currentColor;transition:transform .5s var(--ease)}
 body.v2 .menu-btn .mb-lines i{position:absolute;left:8px;right:8px;height:1.5px;border-radius:1px;background:#111316;transition:transform .5s var(--ease)}
 body.v2 .menu-btn .mb-lines i:first-child{top:11px}
 body.v2 .menu-btn .mb-lines i:last-child{top:15.5px}
 body.v2 .menu-btn[aria-expanded=true] .mb-lines{transform:rotate(90deg)}
 body.v2 .menu-btn[aria-expanded=true] .mb-lines i:first-child{transform:translateY(2.25px) rotate(45deg)}
 body.v2 .menu-btn[aria-expanded=true] .mb-lines i:last-child{transform:translateY(-2.25px) rotate(-45deg)}
 body.v2 .menu-btn:active{transform:scale(.96)}
 body.v2.menu-open{overflow:hidden}
 body.v2.menu-open .v2-header{transform:none!important;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
 body.v2 .site-menu{display:block;position:fixed;inset:0;z-index:29;overflow-y:auto;overscroll-behavior:contain;color:var(--ink);background:radial-gradient(120% 60% at 100% 0%,rgba(255,204,51,.10),transparent 60%),#111316;clip-path:circle(0px at calc(100% - var(--pad) - 19px) 33px);transition:clip-path .75s cubic-bezier(.7,0,.2,1)}
 body.v2 .site-menu[hidden]{display:none}
 body.v2 .site-menu.is-open{clip-path:circle(150% at calc(100% - var(--pad) - 19px) 33px)}
 body.v2 .sm-inner{min-height:100%;display:flex;flex-direction:column;padding:92px var(--pad) calc(28px + env(safe-area-inset-bottom))}
 body.v2 .sm-kicker{margin:0 0 16px;opacity:0;transition:opacity .5s .25s}
 body.v2 .site-menu.is-open .sm-kicker{opacity:1}
 body.v2 .sm-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
 body.v2 .sm-list li{overflow:hidden;border-bottom:1px solid var(--line)}
 body.v2 .sm-list a{display:flex;align-items:center;gap:16px;padding:17px 0;color:var(--ink);text-decoration:none;font-size:clamp(34px,10.5vw,50px);font-weight:700;letter-spacing:-.035em;line-height:1.05;transform:translateY(110%);transition:transform .8s var(--ease) calc(.2s + var(--i)*.07s),color .3s;-webkit-tap-highlight-color:transparent}
 body.v2 .site-menu.is-open .sm-list a{transform:none}
 body.v2 .sm-num{align-self:flex-start;margin-top:6px;min-width:22px;font:600 12px/1 "Schibsted Grotesk",Arial,Helvetica,sans-serif;letter-spacing:0;color:var(--accent)}
 body.v2 .sm-txt{transition:color .3s}
 body.v2 .sm-arrow{margin-left:auto;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.35;transition:transform .5s var(--ease),opacity .3s}
 body.v2 .sm-list a:hover .sm-txt,body.v2 .sm-list a:focus-visible .sm-txt,body.v2 .sm-list a:active .sm-txt{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;color:var(--accent)}
 body.v2 .sm-list a:hover .sm-arrow,body.v2 .sm-list a:focus-visible .sm-arrow,body.v2 .sm-list a:active .sm-arrow{opacity:1;transform:translateX(4px);color:var(--accent)}
 body.v2 .sm-foot{margin-top:auto;padding-top:40px;display:grid;gap:22px;opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease) .1s,transform .6s var(--ease) .1s}
 body.v2 .site-menu.is-open .sm-foot{opacity:1;transform:none;transition-delay:.5s}
 body.v2 .sm-book{justify-self:start}
 body.v2 .sm-social{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;color:var(--soft)}
 body.v2 .sm-social a{color:inherit;text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
 /* film controls sit just under the slimmer header */
 body.v2 .hero-controls{top:72px;gap:3px;padding:3px}
 body.v2 .hero-sound{width:auto;min-width:42px;height:42px;min-height:42px;padding:0 12px;justify-content:center;gap:8px}
 body.v2 .hero-sound .hs-ic,body.v2 .hero-sound .hs-eq{display:inline-flex}
 body.v2 .hero-sound .hs-label{display:none}
 body.v2 .hero-controls .hero-motion{width:42px;height:42px;min-height:42px}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce){
 body.v2 .site-menu,body.v2 .sm-list a,body.v2 .sm-foot,body.v2 .sm-kicker{transition:none}
}
@media(prefers-reduced-motion:reduce){body.v2 .hero-sound[aria-pressed=true] .hs-eq i{animation:none;transform:scaleY(.7)}}

/* Work previews: one quiet line + a small on/off switch (no wrapping pill) */
body.v2 .motion-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body.v2 .motion-toolbar p{margin:0;font-size:14px;line-height:1.45;color:var(--muted)}
body.v2 .motion-toggle{flex:0 0 auto;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 2px 0 0;border:0;border-radius:0;background:transparent;color:var(--soft);font:inherit;font-size:13px;letter-spacing:.04em;white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent}
body.v2 .motion-toggle:hover{color:var(--ink)}
body.v2 .motion-toggle .mt-switch{position:relative;width:38px;height:22px;border-radius:999px;background:var(--btn);transition:background-color .35s var(--ease)}
body.v2 .motion-toggle .mt-switch i{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#111111;transform:translateX(16px);transition:transform .35s var(--ease),background-color .35s}
body.v2 .motion-toggle[aria-pressed=true] .mt-switch{background:#2b3436}
body.v2 .motion-toggle[aria-pressed=true] .mt-switch i{transform:none;background:var(--soft)}
body.v2 .motion-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px}
@media(max-width:700px){body.v2 .motion-toolbar{gap:12px}body.v2 .motion-toolbar p{font-size:13px}}

/* ===== Tighter rhythm between sections ===== */
body.v2{--sec:clamp(64px,9vh,104px)}
body.v2 .v2-intro{padding:clamp(96px,16vh,170px) var(--pad) clamp(56px,9vh,104px)}
body.v2 .v2-work{padding-top:var(--sec);padding-bottom:calc(var(--sec) * .6)}
body.v2 .work-grid{row-gap:clamp(44px,7vh,72px)}
body.v2 .work-card:nth-child(even){margin-top:clamp(48px,11vh,120px)}
body.v2 .work-outro{margin-top:44px}
body.v2 .v2-practice{padding:var(--sec) var(--pad)}
body.v2 .v2-photos{padding:var(--sec) 0 calc(var(--sec) * .85)}
body.v2 .v2-about{padding-top:var(--sec);padding-bottom:var(--sec)}
body.v2 .v2-partners{padding:var(--sec) var(--pad) calc(var(--sec) * .5)}
body.v2 .v2-cta{padding:calc(var(--sec) * .6) var(--pad) var(--sec)}
body.v2 .v2-contact{padding-top:var(--sec)}
@media(max-width:700px){
 body.v2{--sec:56px}
 body.v2 .v2-intro{padding:80px var(--pad) 48px}
 body.v2 .work-grid{row-gap:44px}
 body.v2 .work-card:nth-child(even){margin-top:0}
 body.v2 .work-outro{margin-top:32px}
}

/* ===== Chapter bars: 01  Selected work ———— /07 ===== */
body.v2 .has-chapter .ch-src{display:none}
body.v2 .chapter{grid-column:1/-1;display:flex;align-items:center;gap:14px;margin:0 0 clamp(26px,4vh,44px);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft)}
body.v2 .v2-photos>.chapter{margin-left:var(--pad);margin-right:var(--pad)}
body.v2 .ch-num{display:inline-block;overflow:hidden;line-height:1.1;padding-bottom:1px}
body.v2 .ch-num span{display:inline-block;font:700 12px/1.1 "Schibsted Grotesk",Arial,Helvetica,sans-serif;letter-spacing:0;color:var(--accent);transform:translateY(105%);transition:transform .8s var(--ease)}
body.v2 .ch-name{opacity:0;transform:translateX(-10px);transition:opacity .7s var(--ease) .15s,transform .7s var(--ease) .15s;white-space:nowrap}
body.v2 .ch-line{flex:1;height:1px;background:linear-gradient(90deg,var(--accent),var(--line) 35%);transform:scaleX(0);transform-origin:left center;transition:transform 1.3s var(--ease) .2s}
body.v2 .ch-total{color:var(--muted);letter-spacing:.08em;opacity:0;transition:opacity .6s .9s}
body.v2 .chapter.in .ch-num span,body.v2 .chapter.in .ch-name{transform:none;opacity:1}
body.v2 .chapter.in .ch-line{transform:scaleX(1)}
body.v2 .chapter.in .ch-total{opacity:1}

/* ===== Category band (moves with the scroll) ===== */
body.v2 .kinetic{position:relative;overflow:hidden;padding:clamp(18px,3vh,30px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:radial-gradient(80% 140% at 50% 50%,rgba(255,204,51,.06),transparent 70%);user-select:none;pointer-events:none}
body.v2 .k-row{overflow:hidden;white-space:nowrap;line-height:1}
body.v2 .k-track{display:inline-flex;align-items:center;will-change:transform}
body.v2 .k-word{padding:0 .32em;font-size:clamp(40px,6.4vw,104px);letter-spacing:-.045em}
body.v2 .k-a .k-word{font-weight:800;color:var(--ink)}
body.v2 .k-b .k-word{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;letter-spacing:-.03em;color:var(--accent)}
body.v2 .k-a .k-word:nth-child(4n+3){color:transparent;-webkit-text-stroke:1.2px rgba(240,237,228,.55)}
body.v2 .k-star{display:inline-grid;place-items:center;width:clamp(18px,2.2vw,34px);height:clamp(18px,2.2vw,34px);margin:0 .2em}
body.v2 .k-star svg{width:100%;height:100%;fill:var(--accent)}
body.v2 .k-b .k-star svg{fill:var(--soft);opacity:.6}
body.v2 .k-b{margin-top:clamp(6px,1vh,12px)}
@media(max-width:700px){body.v2 .k-word{font-size:42px}body.v2 .kinetic{padding:16px 0}}

/* ===== "What I do" rotating word + highlighted service ===== */
body.v2 .svc-rotator{display:flex;align-items:baseline;gap:.4em;margin:18px 0 0;font-size:clamp(26px,2.6vw,40px);line-height:1.15}
body.v2 .svc-for{font-size:.5em;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:400}
body.v2 .svc-slot{position:relative;display:inline-block;flex:1;min-width:0;height:1.25em;overflow:hidden}
body.v2 .svc-word{position:absolute;left:0;top:0;white-space:nowrap;font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;color:var(--accent);transform:translateY(110%);opacity:0;transition:transform .7s var(--ease),opacity .5s}
body.v2 .svc-word.is-on{transform:none;opacity:1}
body.v2 .svc-word.is-out{transform:translateY(-110%);opacity:0}
body.v2 .practice-list summary span{transition:transform .5s var(--ease),color .4s}
body.v2 .practice-list details.is-hot summary{color:var(--ink)}
body.v2 .practice-list details.is-hot summary span{transform:translateX(14px)}
body.v2 .practice-list summary{position:relative}
body.v2 .practice-list summary::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--accent);transform:scale(0);transition:transform .45s var(--ease)}
body.v2 .practice-list details.is-hot summary::before{transform:scale(1)}
@media(max-width:700px){body.v2 .svc-rotator{margin-top:12px;font-size:28px}}
@media(prefers-reduced-motion:reduce){body.v2 .chapter *,body.v2 .svc-word{transition:none}}

/* ===== Minimal pass ===== */
/* work controls: filters + previews switch on one row */
body.v2 .work-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:clamp(28px,4vh,44px) 0 clamp(28px,4vh,40px)}
body.v2 .work-controls .filters{margin:0}
body.v2 .work-controls .motion-toggle{margin-left:auto}
/* card play hint: a small round icon instead of "Hover/Tap to play" */
body.v2 .media-action.ma-play{left:16px;right:auto;bottom:16px;width:40px;height:40px;padding:0;display:grid;place-items:center;border-radius:50%;background:rgba(8,14,15,.45);border:1px solid rgba(240,237,228,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink);transition:background-color .35s var(--ease),color .3s,transform .4s var(--ease),opacity .3s}
body.v2 .media-action.ma-play svg{width:18px;height:18px}
body.v2 .media-button:hover .media-action.ma-play,body.v2 .media-button:focus-visible .media-action.ma-play{background:var(--btn);border-color:var(--btn);color:#111111;transform:scale(1.06)}
/* category band: one row, bold and italic words alternate */
body.v2 .k-a .k-word.k-it{font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif;font-style:normal;font-weight:300;letter-spacing:-.03em;color:var(--accent);-webkit-text-stroke:0}
body.v2 .k-a .k-word:nth-child(4n+3){-webkit-text-stroke:0}
/* phone caption: title, then year/place on one quiet line */
@media(max-width:700px){
 body.v2 .work-caption{flex-direction:column;align-items:flex-start;gap:4px}
 body.v2 .work-caption>span{text-align:left;max-width:none;font-size:11px;letter-spacing:.06em}
 body.v2 .media-action.ma-play{width:36px;height:36px;left:12px;bottom:12px}
 body.v2 .work-controls{gap:12px}
 body.v2 .work-controls .motion-toggle{margin-left:0}
 /* "Book Mascot": a small floating pill instead of a full-width bar */
 body.v2 .mobile-booking{display:flex;left:auto;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));min-height:46px;padding:0 20px;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.45);transform:translateY(140%);opacity:0;transition:transform .5s var(--ease),opacity .4s;pointer-events:none;z-index:20}
 body.v2 .mobile-booking.is-shown{transform:none;opacity:1;pointer-events:auto}
 body.v2 .mobile-booking strong{font-size:14px;font-weight:600}
 body.v2.menu-open .mobile-booking{opacity:0;pointer-events:none}
}
@media(max-width:700px){body.v2{padding-bottom:0}body.v2 .v2-footer{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
body.v2 .v2-about>.chapter{grid-row:1}
body.v2 .v2-about .portrait-wrap,body.v2 .v2-about .about-copy{grid-row:2}
@media(max-width:700px){body.v2 .v2-about .about-copy{grid-row:2}body.v2 .v2-about .portrait-wrap{grid-row:3}}

/* =====================================================================
   NEON CARDS — visual concept from the reference video
   Stage: near-black. Each section is a dark plum card with rounded
   corners; pink / violet glow; white pill buttons; outlined tags.
   ===================================================================== */
body.v2{--gutter:clamp(8px,1.1vw,16px);--gap:clamp(10px,1.1vw,16px);--r:clamp(22px,2.4vw,34px)}
body.v2 ::selection{background:#ffcc33;color:#111111}

/* section cards */
body.v2 :is(.v2-intro,.v2-work,.v2-practice,.v2-photos,.v2-classes,.v2-about,.v2-partners,.v2-cta,.v2-contact){position:relative;isolation:isolate;max-width:none;margin:var(--gap) var(--gutter);border-radius:var(--r);border:1px solid rgba(255,255,255,.06);background:radial-gradient(110% 55% at 100% 0%,rgba(255,204,51,.075),transparent 55%),radial-gradient(90% 45% at 0% 100%,rgba(255,204,51,.045),transparent 60%),var(--card);overflow:clip;transform-origin:50% 0%;will-change:auto}
body.v2 .v2-cta{background:radial-gradient(60% 70% at 50% 55%,rgba(255,204,51,.16),transparent 70%),var(--card)}
body.v2 .v2-footer{margin:0 var(--gutter)}

/* headline accents: lighter weight, neon colour */
body.v2 h1 em,body.v2 h2 em,body.v2 .cta-text em{font-family:inherit;font-style:normal;font-weight:300;letter-spacing:-.05em;color:#ffcc33}
body.v2 .hero-name em{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:300}
body.v2 .svc-word,body.v2 .k-a .k-word.k-it{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.08em}
body.v2 .credit-band .credit-row li:nth-child(even),body.v2 .partner:nth-child(even) .partner-word{color:#ffcc33;font-weight:300}
body.v2 .ch-num span,body.v2 .sm-num{color:#ffcc33}
body.v2 .ch-line{background:linear-gradient(90deg,#ffcc33,var(--line) 40%)}
body.v2 .k-star svg{fill:#ffcc33}
body.v2 .practice-list summary::before{background:#ffcc33;box-shadow:none}

/* buttons: white pill + dark round icon (like "LEARN MORE ●") */
body.v2 .btn{text-transform:uppercase;letter-spacing:.07em;font-size:12px;font-weight:700}
body.v2 .btn-solid,body.v2 .form-actions .button,body.v2 .sm-book{display:inline-flex;align-items:center;gap:12px;background:var(--btn);color:#111111;border-color:var(--btn);padding-right:6px}
body.v2 .btn-solid::after,body.v2 .form-actions .button::after,body.v2 .sm-book::after{content:"";flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#111111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") center/15px no-repeat;transition:transform .45s var(--ease)}
body.v2 .btn-solid:hover::after,body.v2 .form-actions .button:hover::after,body.v2 .sm-book:hover::after{transform:rotate(45deg)}
body.v2 .form-actions .button>span{display:none}
body.v2 .form-actions .button{text-transform:uppercase;letter-spacing:.07em;font-size:12px;font-weight:700}
body.v2 .btn-ghost{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
body.v2 .btn-ghost:hover{background:rgba(255,255,255,.1)}

/* outlined tags (like "BC 2 LIGHT") */
body.v2 .work-caption>span,body.v2 .partner-kind{display:inline-flex;align-items:center;padding:4px 10px;border:1px solid rgba(255,255,255,.2);border-radius:999px;font-size:10px;line-height:1.2;letter-spacing:.09em;text-transform:uppercase;color:var(--soft);white-space:nowrap}
body.v2 .work-caption{align-items:center}

/* glass cards */
body.v2 .partner{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.08)}
body.v2 .partner:hover{border-color:rgba(255,204,51,.45);box-shadow:0 0 0 1px rgba(255,204,51,.15),0 20px 60px -20px rgba(255,204,51,.35)}
body.v2 .media-button{border-radius:18px}
body.v2 .media-button img,body.v2 .media-button video{border-radius:inherit}

/* header nav like "SERVICES  SOLUTIONS  …  EXPLORE ▶" */
@media(min-width:701px){
 body.v2 .v2-header nav a{font-size:12px;letter-spacing:.12em;text-transform:uppercase}
 body.v2 .v2-header nav a[href$="#contact"]{padding:0 16px 0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.22);display:inline-flex;align-items:center;gap:10px;background-image:none}
 body.v2 .v2-header nav a[href$="#contact"]::after{content:"";width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent currentColor}
}

/* faint giant word behind each section head (like "VR BOXXX") */
body.v2 .wm{position:absolute;z-index:-1;top:clamp(14px,3vh,40px);right:-.03em;margin:0;font-size:clamp(84px,15vw,250px);line-height:.85;font-weight:800;letter-spacing:-.06em;color:rgba(255,255,255,.035);white-space:nowrap;pointer-events:none;user-select:none}
body.v2 .wm span{display:inline-block;opacity:0;transform:translateY(30%);filter:blur(8px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease);transition-delay:calc(var(--i) * 70ms)}
body.v2 .wm.in span{opacity:1;transform:none;filter:none}
@media(max-width:700px){body.v2 .wm{font-size:24vw;top:10px}}

/* rotating round badge (like "EXPLORE WITHOUT LIMITS") */
body.v2 .badge{position:absolute;width:var(--bs,120px);height:var(--bs,120px);display:grid;place-items:center;pointer-events:none;z-index:3}
body.v2 .badge svg.ring{position:absolute;inset:0;width:100%;height:100%;animation:badge-spin 16s linear infinite}
body.v2 .badge svg.ring text{font:700 9.5px "Schibsted Grotesk",Arial,Helvetica,sans-serif;letter-spacing:2.6px;fill:rgba(255,255,255,.85);text-transform:uppercase}
body.v2 .badge .core{width:42%;height:42%;border-radius:50%;display:grid;place-items:center;background:rgba(12,10,16,.55);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff}
body.v2 .badge .core svg{width:42%;height:42%}
@keyframes badge-spin{to{transform:rotate(360deg)}}
body.v2 .reel-card .media-action.ma-play{display:none}
body.v2 .reel-card .badge{left:50%;top:50%;margin:calc(var(--bs,120px) / -2) 0 0 calc(var(--bs,120px) / -2);--bs:clamp(96px,11vw,150px)}
body.v2 .reel-card .media-button:hover .badge .core{background:#ffcc33;border-color:#ffcc33}
body.v2 .v2-cta .badge{--bs:clamp(96px,10vw,140px);right:clamp(16px,6vw,110px);bottom:clamp(16px,6vh,70px)}
body.v2 .v2-cta .badge .core{background:var(--btn);color:#111111;border:0}


/* staggered entrance inside each card */
body.v2 .rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease);transition-delay:var(--rd,0ms)}
body.v2 .rv.rv-txt{filter:blur(6px)}
body.v2 .rv.rv-in{opacity:1;transform:none;filter:none}
@media(prefers-reduced-motion:reduce){body.v2 .rv{opacity:1;transform:none;filter:none;transition:none}body.v2 .wm span{opacity:1;transform:none;filter:none;transition:none}body.v2 .badge svg.ring{animation:none}}

@media(max-width:700px){
 body.v2{--gutter:8px;--gap:8px;--r:22px}
 body.v2 .work-caption{align-items:flex-start}
 body.v2 .v2-cta .badge{right:14px;bottom:14px;--bs:92px}
}
body.v2 .partner-kind{align-self:flex-start;width:max-content;max-width:100%}
/* Opening film: start dark and let the film fade in (instead of showing a blurred still frame) */
html.hero-film body.v2 .hero .hero-media .hero-poster{opacity:0;transition:opacity .4s}
html.hero-film body.v2 .hero .hero-video{transition:opacity 1.1s ease}

/* Opening name in Climate Crisis (SIL OFL, self-hosted; see assets/fonts/ClimateCrisis-OFL.txt) */
@font-face{font-family:"Climate Crisis";src:url("assets/fonts/climate-crisis-hero.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
body.v2 .hero-name,body.v2 .hero-name em{font-family:"Climate Crisis","Schibsted Grotesk",Arial,Helvetica,sans-serif;font-weight:400;font-style:normal;font-synthesis:none}
body.v2 .hero-name{letter-spacing:-.02em;font-size:var(--hn-size,clamp(64px,11.5vw,220px))}
body.v2 .hero-name em{letter-spacing:-.02em}
@media(max-width:700px){body.v2 .hero-name{font-size:var(--hn-size-m,12.4vw)}}

/* Phones: focus + depth for the work cards (driven by --f 0..1 and --px from sections.js) */
@media(max-width:700px){
 html.work-focus body.v2 .work-card{--f:1;--px:0px}
 html.work-focus body.v2 .work-card>.film:not(.is-full):not(.in-theater),html.work-focus body.v2 .work-card>.media-button{transform:scale(calc(.9 + .1 * var(--f)));transform-origin:50% 50%;will-change:transform}
 html.work-focus body.v2 .work-card .media-button>img,html.work-focus body.v2 .work-card .media-button .scroll-preview{transform:translate3d(0,var(--px),0) scale(1.12);filter:grayscale(calc(1 - var(--f))) brightness(calc(.62 + .38 * var(--f)));transition:none}
 html.work-focus body.v2 .work-card .work-caption,html.work-focus body.v2 .work-card .work-summary,html.work-focus body.v2 .work-card .card-credits{opacity:calc(.4 + .6 * var(--f))}
 html.work-focus body.v2 .work-card .media-action.ma-play{opacity:calc(.3 + .7 * var(--f))}
}

/* =====================================================================
   CARBON & YELLOW — glass cards (reference: esports profile look)
   ===================================================================== */
@font-face{font-family:"Schibsted Grotesk";src:url("assets/fonts/schibsted-grotesk-latin-wght-normal.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Chivo Mono";src:url("assets/fonts/chivo-mono-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
body.v2{--bg:#111316;--ink:#f3f3f1;--soft:#aeb2b8;--muted:#7f848b;--line:rgba(255,255,255,.09);--accent:#ffcc33;--btn:#ffcc33;--grad:linear-gradient(100deg,#ffcc33 0%,#ffd966 100%);--card:rgba(26,29,33,.62);--mono:"Chivo Mono",ui-monospace,Menlo,monospace;
 background:#111316;color:#f3f3f1;font-family:"Schibsted Grotesk",Arial,Helvetica,sans-serif}
html:has(body.v2){background:#111316}
/* backdrop behind the glass: soft light pools + fine grain, fixed */
body.v2::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
 background:
  radial-gradient(60vw 45vh at 12% 8%,rgba(255,204,51,.09),transparent 70%),
  radial-gradient(55vw 50vh at 92% 38%,rgba(255,255,255,.055),transparent 70%),
  radial-gradient(70vw 55vh at 30% 95%,rgba(255,204,51,.06),transparent 70%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
  #111316}
/* section cards: translucent glass (the light pools show through) */
body.v2 :is(.v2-intro,.v2-work,.v2-practice,.v2-photos,.v2-classes,.v2-about,.v2-partners,.v2-cta,.v2-contact){
 background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012) 40%),rgba(28,31,35,.58);
 border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 30px 80px -40px rgba(0,0,0,.6)}
body.v2 .v2-cta{background:radial-gradient(60% 70% at 50% 55%,rgba(255,204,51,.12),transparent 70%),rgba(28,31,35,.58)}
/* small glass panels (real blur) */
body.v2 .partner,body.v2 .class-card .cc-back,body.v2 .theater-shell{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
body.v2 .class-card{background:rgba(22,24,28,.55)}
body.v2 .partner:hover{border-color:rgba(255,204,51,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 20px 60px -24px rgba(255,204,51,.28)}
body.v2 .media-button{box-shadow:0 0 0 1px rgba(255,255,255,.07)}
/* type: strong grotesk for titles, mono for labels / tags / times / numbers */
body.v2 h1,body.v2 h2,body.v2 h3,body.v2 .cta-text,body.v2 .practice-list summary,body.v2 .brand{font-family:"Schibsted Grotesk",Arial,sans-serif}
body.v2 h2,body.v2 .cta-text{font-weight:800}
body.v2 h1 em,body.v2 h2 em,body.v2 .cta-text em{color:var(--accent);font-weight:400}
body.v2 .mono-label,body.v2 .chapter,body.v2 .ch-num span,body.v2 .work-caption>span,body.v2 .partner-kind,body.v2 .cc-time,body.v2 .cc-age,body.v2 .cc-eyebrow,body.v2 .cc-place,body.v2 .cc-more,body.v2 .film-time,body.v2 .svc-for,body.v2 .hero-credit,body.v2 .media-label,body.v2 .photos-caption,body.v2 .form-privacy,body.v2 label,body.v2 .filters button,body.v2 .motion-toggle,body.v2 .lang-toggle,body.v2 .sm-num,body.v2 .footer-legal,body.v2 .footer-credit{font-family:var(--mono);letter-spacing:.04em}
body.v2 .chapter,body.v2 .cc-eyebrow,body.v2 .work-caption>span,body.v2 .partner-kind{color:var(--accent)}
body.v2 .ch-num span{font-weight:700}
body.v2 .btn,body.v2 .form-actions .button,body.v2 .sm-book,body.v2 .cc-cta,body.v2 .mobile-booking strong{font-family:var(--mono);font-weight:700;letter-spacing:.08em}
@media(min-width:701px){body.v2 .v2-header nav a{font-family:var(--mono);letter-spacing:.1em;font-size:12px}}
/* yellow buttons, dark text */
body.v2 .btn-solid,body.v2 .form-actions .button,body.v2 .sm-book,body.v2 .mobile-booking,body.v2 .cc-cta{background:#ffcc33;color:#111;border-color:#ffcc33}
body.v2 .btn-solid:hover,body.v2 .form-actions .button:hover,body.v2 a.cc-cta:hover,body.v2 .mobile-booking:hover{background:#ffd966;color:#111}
body.v2 .btn-ghost{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18)}
/* opening name: white + yellow, like the sprayed name in the reference */
body.v2 .hero-name em{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#ffcc33}
body.v2 .hero-stage .hero-media{background:#111316}
body.v2 .ch-line{background:linear-gradient(90deg,#ffcc33,var(--line) 40%)}
body.v2 .practice-list summary::before{background:#ffcc33;box-shadow:0 0 10px rgba(255,204,51,.6)}
body.v2 .k-star svg{fill:#ffcc33}
body.v2 .hero-motion .hm-ring circle{stroke:#ffcc33}
body.v2 .hero-sound[aria-pressed=true]{background:#ffcc33;color:#111}
body.v2 .motion-toggle .mt-switch{background:#ffcc33}
body.v2 .filters button[aria-pressed=true]{background:#ffcc33;color:#111;border-color:#ffcc33}
body.v2 ::selection{background:#ffcc33;color:#111}
@media(max-width:700px){body.v2 .partner,body.v2 .class-card .cc-back{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}}

body.v2 h1,body.v2 h2,body.v2 h3,body.v2 .cta-text,body.v2 .intro-text,body.v2 .practice-list summary,body.v2 .k-word,body.v2 .cc-school,body.v2 .cc-title{word-spacing:.1em}
body.v2 h2{letter-spacing:-.04em}

/* ===== Improvements round: lighter, calmer, shorter ===== */
body.v2{--muted:#8f949b}
/* work: 6 first, the rest on request */
body.v2 .work-grid:not(.show-all):not(.filtered) .work-card.is-extra{display:none}
body.v2 .work-more{display:flex;justify-content:center;margin-top:clamp(36px,6vh,64px)}
body.v2 .work-more[hidden]{display:none}
body.v2 .work-more-btn{min-width:240px;justify-content:center}
/* showreel keeps its small round play icon (spinning badge removed) */
body.v2 .reel-card .media-action.ma-play{display:grid}
/* header logo in the opening name's typeface */
body.v2 .v2-header .brand{font-family:"Climate Crisis","Schibsted Grotesk",Arial,sans-serif;font-weight:400;letter-spacing:.01em;font-size:15px;word-spacing:.05em}
@media(max-width:700px){body.v2 .v2-header .brand{font-size:13px}}
@media(max-width:360px){body.v2 .v2-header .brand{font-size:11.5px}}

/* ===== Yellow only where it matters (~10%): booking buttons, the opening name, "active" markers ===== */
body.v2{--hi:#d6d8dc}
/* second beat of headlines: light grey, thin weight */
body.v2 h1 em,body.v2 h2 em,body.v2 .cta-text em,body.v2 .cc-title em{color:var(--hi)}
body.v2 .hero-name em{color:#ffcc33}
body.v2 .svc-word,body.v2 .k-a .k-word.k-it{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--hi)}
body.v2 .credit-band .credit-row li:nth-child(even),body.v2 .partner:nth-child(even) .partner-word{color:var(--hi)}
/* labels and tags: grey, outlined */
body.v2 .chapter,body.v2 .mono-label,body.v2 .cc-eyebrow,body.v2 .cc-age,body.v2 .svc-for{color:var(--soft)}
body.v2 .ch-num span{color:var(--ink)}
body.v2 .work-caption>span,body.v2 .partner-kind{color:var(--soft);border-color:rgba(255,255,255,.18)}
body.v2 .k-star svg{fill:var(--muted)}
/* the background light pools: calmer and more neutral */
body.v2::before{opacity:.75}

/* ===== Floating pill header (ref. Studio Babelsberg): always visible, the page scrolls underneath ===== */
body.v2 .v2-header,body.v2 .v2-header.is-solid{top:12px;left:50%;right:auto;width:min(1180px,calc(100% - 24px));transform:translateX(-50%);padding:8px 8px 8px 24px;min-height:58px;border-radius:999px;mix-blend-mode:normal;
 background:rgba(17,19,22,.62);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:0 12px 40px -12px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06);transition:background-color .3s,box-shadow .3s}
body.v2 .v2-header.is-hidden:not(:focus-within){transform:translateX(-50%)}
body.v2 .v2-header.is-solid{background:rgba(17,19,22,.78)}
body.v2 .v2-header nav a{min-height:40px}
@media(min-width:701px){body.v2 .v2-header .lang-toggle{margin-left:14px;min-height:40px;width:40px;padding:0;justify-content:center;display:inline-flex;align-items:center}}
@media(max-width:700px){
 body.v2 .v2-header,body.v2 .v2-header.is-solid{top:10px;width:calc(100% - 20px);padding:6px 6px 6px 18px;min-height:52px}
 body.v2.menu-open .v2-header{transform:translateX(-50%)!important;background:rgba(17,19,22,.62);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
 body.v2 .site-menu{clip-path:circle(0px at calc(100% - 40px) 36px)}
 body.v2 .site-menu.is-open{clip-path:circle(150% at calc(100% - 40px) 36px)}
 body.v2 .hero-controls{top:76px}
}

/* ===== More air between the cards ===== */
body.v2{--gutter:clamp(12px,2vw,32px);--gap:clamp(18px,2.4vw,36px)}
body.v2 .work-grid{column-gap:clamp(20px,3vw,48px)}
body.v2 .class-cards{gap:clamp(14px,1.8vw,28px)}
body.v2 .partners-grid{gap:clamp(14px,1.8vw,28px)}
@media(max-width:700px){body.v2{--gutter:10px;--gap:16px}}

/* ===== Audit fixes ===== */
/* menu jumps: section top lands just below the floating header */
html:has(body.v2){scroll-padding-top:86px}
@media(max-width:700px){html:has(body.v2){scroll-padding-top:70px}}
/* small labels at least 11px */
body.v2 .work-caption>span,body.v2 .partner-kind,body.v2 .cc-age,body.v2 .film-time{font-size:11px}
/* bigger touch targets on phones */
@media(max-width:700px){
 body.v2 .t-place{min-height:36px;padding:6px 0;display:inline-flex;align-items:center}
 body.v2 .form-privacy a,body.v2 .hero-credit a{display:inline-block;padding:10px 0;margin:-10px 0}
 body.v2 .film-seek{min-height:32px}
}
@media(max-width:700px){body.v2 .v2-header .brand{padding:12px 0;margin:-12px 0}body.v2 .film-seek{min-height:36px}}

/* ===== Design refinement ===== */
/* Footer: tidy, one typeface, aligned on one baseline */
body.v2 .v2-footer span{display:inline;gap:0}
body.v2 .v2-footer>span{display:inline-flex;align-items:baseline;gap:8px;flex-wrap:wrap}
body.v2 .v2-footer{align-items:baseline;row-gap:14px;font-family:"Schibsted Grotesk",Arial,sans-serif}
body.v2 .v2-footer a,body.v2 .v2-footer>span,body.v2 .footer-credit,body.v2 .footer-legal{font-family:"Schibsted Grotesk",Arial,sans-serif;font-size:13px;letter-spacing:0;color:var(--soft)}
body.v2 .v2-footer .brand{font-family:"Climate Crisis","Schibsted Grotesk",Arial,sans-serif;font-weight:400;font-size:15px;letter-spacing:.01em;color:var(--ink)}
body.v2 .v2-footer .brand span{display:inline}
body.v2 .footer-credit a{color:var(--ink);padding-bottom:2px}
body.v2 .footer-legal{gap:6px!important}
body.v2 .v2-footer a:hover{color:var(--ink)}
@media(max-width:700px){
 body.v2 .v2-footer{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:18px 16px;padding-top:32px}
 body.v2 .v2-footer .brand{grid-column:1}
 body.v2 .v2-footer>a[href="#home"]:not(.brand){grid-column:2;grid-row:1;justify-self:end}
 body.v2 .v2-footer>span{grid-column:1/-1}
}
/* Headings: one size per level, one weight, no lonely last words */
body.v2 main section h2:not(.cta-text){font-size:clamp(40px,6.2vw,96px);font-weight:800;line-height:.95}
body.v2 h1,body.v2 h2,body.v2 h3,body.v2 .cc-school{text-wrap:balance}
body.v2 p,body.v2 .photos-intro,body.v2 .lead{text-wrap:pretty}
/* Nested corners: a card inside a card is rounder on the outside than inside */
body.v2 .class-card{border-radius:22px}
@media(max-width:700px){body.v2 .class-card,body.v2 .partner,body.v2 .ph{border-radius:16px}}
/* Contact: the two small actions look like a pair */
body.v2 .copy-email{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink);background:transparent}
body.v2 .copy-email:hover{border-color:var(--ink)}
body.v2 .press-btn{font-family:var(--mono);font-size:12px;letter-spacing:.06em;border-color:rgba(255,255,255,.18)}
/* Privacy note: quiet body text, not typewriter */
body.v2 .form-privacy{font-family:"Schibsted Grotesk",Arial,sans-serif;font-size:13px;letter-spacing:0;color:var(--muted)}
/* Teaching places: keep inline (no odd line breaks), bigger tap area via padding */
@media(max-width:700px){body.v2 .t-place{display:inline;min-height:0;padding:4px 0;line-height:2}}
body.v2 .v2-footer .brand{display:inline-block;white-space:nowrap}
@media(max-width:700px){body.v2 .t-place{display:inline;min-height:0;padding:0;line-height:inherit}body.v2 .t-places{line-height:1.9}}
@media(max-width:700px){body.v2 .v2-header .brand{margin:-12px auto -12px 0}}

/* About: facts block (selected work, brands, services) */
body.v2 .about-facts{display:grid;gap:26px;margin-top:34px;padding-top:28px;border-top:1px solid var(--line)}
body.v2 .af-label{margin:0 0 12px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
body.v2 .af-list{list-style:none;margin:0;padding:0}
body.v2 .af-list li{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;padding:11px 0;border-bottom:1px solid var(--line)}
body.v2 .af-list li:first-child{padding-top:0}
body.v2 .af-list strong{font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
body.v2 .af-list li:first-child strong{color:#ffcc33}
body.v2 .af-list span{font-size:13px;color:var(--soft)}
body.v2 .af-brands{margin:0;font-size:16px;line-height:1.6;color:var(--ink)}
body.v2 .af-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
body.v2 .af-chips li{padding:7px 13px;border:1px solid rgba(255,255,255,.16);border-radius:999px;font-size:13px;color:var(--ink)}
body.v2 .about-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:30px}
body.v2 .af-based{margin:0;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--soft)}
@media(max-width:700px){body.v2 .af-list strong{font-size:16px}body.v2 .af-list li{flex-direction:column;gap:3px}}
@media(min-width:701px){body.v2 .v2-about{align-items:start}body.v2 .v2-about .portrait-wrap{position:sticky;top:110px;align-self:start}}

/* Featured: Apache 207 & Luciano — "Gesegnet" */
body.v2 .reel-grid{row-gap:clamp(40px,6vh,72px)}
body.v2 .feature-card .media-button{aspect-ratio:16/9;box-shadow:0 0 0 1px rgba(255,204,51,.35),0 40px 90px -40px rgba(255,204,51,.25)}
body.v2 .feature-card .media-label{color:#111;background:#ffcc33;padding:6px 11px;border-radius:999px;left:18px;right:auto;top:18px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;font-weight:700;z-index:2}
body.v2 .feature-card .work-caption h3{font-size:clamp(26px,3vw,44px);font-weight:800;letter-spacing:-.03em}
body.v2 .feature-card .work-summary{font-size:16px;color:var(--soft);max-width:60ch}
@media(max-width:700px){body.v2 .feature-card .media-label{top:12px;left:12px;font-size:10px}body.v2 .feature-card .work-caption h3{font-size:24px}}
body.v2 .feature-card .media-label{display:inline-flex;align-items:center;left:auto;right:18px;z-index:4;pointer-events:none;transition:opacity .3s}
body.v2 .feature-card .film.is-full .media-label,body.v2 .feature-card .film.in-theater .media-label{opacity:0}
@media(max-width:700px){body.v2 .feature-card .media-label{left:auto;right:12px}}

/* Rodada 60 — rotation and narrow-card fixes */
body.v2 .film{container-type:inline-size}
@container (max-width:340px){body.v2 .film-time{display:none}body.v2 .film-controls{gap:4px}body.v2 .film-btn{flex-basis:36px;width:36px;height:36px}}
@media(orientation:landscape) and (max-height:520px){
 body.v2 .feature-card .film{width:min(100%,calc((100svh - 110px) * 16 / 9));margin-inline:auto}
}

/* Link to the official video (opens YouTube in a new tab) — quiet glass pill, same family as the other pills */
body.v2 .watch-link{display:inline-flex;align-items:center;gap:14px;min-height:44px;padding:0 5px 0 18px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.035);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--ink);text-decoration:none;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:border-color .35s var(--ease),background-color .35s var(--ease)}
body.v2 .watch-link i{font-style:normal;font-weight:400;color:var(--muted);margin-left:2px}
body.v2 .watch-link .wl-ic{flex:0 0 34px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);transition:background-color .35s var(--ease),color .35s var(--ease),transform .45s var(--ease)}
body.v2 .watch-link svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.v2 .watch-link:hover,body.v2 .watch-link:focus-visible{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.07)}
body.v2 .watch-link:hover .wl-ic,body.v2 .watch-link:focus-visible .wl-ic{background:var(--ink);color:#111;transform:rotate(45deg)}
body.v2 .feature-card .watch-link{margin:4px 0 2px}
@media(min-width:701px){
 body.v2 .feature-card{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:32px;align-items:start}
 body.v2 .feature-card>*{grid-column:1/-1}
 body.v2 .feature-card>.work-summary{grid-column:1}
 body.v2 .feature-card>.watch-link{grid-column:2;grid-row:3;justify-self:end;margin:6px 0 0}
}
body.v2 .project-details .watch-link{margin:18px 22px 6px 0;vertical-align:middle}

/* Opening name: only "MASCOT" (the "BBOY" word is hidden; the full name stays in the title for search and screen readers) */
body.v2 .hero-word-a{display:none}
@media(max-width:700px){body.v2 .hero-word-b{top:22svh}}