:root{--ink:#090a0b;--white:#f1f0eb;--silver:#bfc3c9;--muted:#abaeb0;--line:#ffffff26;--pad:clamp(24px,4.3vw,100px);--sans:'Helvetica Neue',Helvetica,Arial,sans-serif;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:var(--ink);color:var(--white);font-family:var(--sans);-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}p{line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--white);outline-offset:7px}svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.3;fill:none}::selection{color:var(--ink);background:var(--white)}.skip-link{position:fixed;top:-100px;left:20px;background:var(--white);color:var(--ink);padding:15px;z-index:100}.skip-link:focus{top:10px}.site-header{position:absolute;top:0;left:0;width:100%;height:100px;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:0 var(--pad)}.wordmark{font-size:34px;font-weight:500;letter-spacing:-1.9px;display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap}.brand-dot{height:6px;width:6px;border-radius:50%;background:currentColor;flex-shrink:0}.site-header nav{display:flex;align-items:center;gap:55px;font-size:13px}.site-header nav a{padding:12px 0}.nav-contact{display:flex;align-items:center;gap:35px;border-bottom:1px solid #ffffff70}.nav-contact svg{width:16px;height:16px}.hero{position:relative;isolation:isolate;height:100svh;min-height:800px;max-height:1250px;overflow:hidden;background:#161816}.hero-media{position:absolute;inset:0;z-index:-3}.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#000b 0%,#0002 20%,#0000 32%,#0003 42%,#000b 68%,#0b0c0df5 100%),linear-gradient(90deg,#0004,transparent 70%)}.hero-topline{position:absolute;top:142px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:baseline;gap:25px;text-shadow:0 1px 10px #000}.hero-topline p{font-size:17px;font-weight:400}.hero-topline>span{font-size:11px}.hero-topline i{font-family:Georgia,serif;font-size:18px;margin:0 3px}.hero-content{position:absolute;left:var(--pad);right:var(--pad);bottom:143px}.hero h1{font-size:clamp(68px,7.4vw,128px);font-weight:500;line-height:.98;letter-spacing:-.065em}.hero h1 span{display:block}.hero h1 span+span{margin-top:3px}.hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-top:38px}.hero-bottom>p{font-size:16px;line-height:1.55;color:#e2dfd6;max-width:470px}.watch-film{display:flex;align-items:center;gap:20px;text-align:left;padding:0;font-size:14px;min-height:60px}.watch-film small{display:block;font-size:11px;color:#c5c2b9;margin-top:8px}.play-circle{height:62px;width:62px;border:1px solid #ffffff99;border-radius:50%;display:grid;place-items:center;flex-shrink:0;transition:background .2s,color .2s}.play-circle svg{width:18px;height:18px;fill:currentColor;stroke:none;transform:translateX(1px)}.watch-film:hover .play-circle{background:var(--white);color:var(--ink)}.hero-footer{position:absolute;bottom:28px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:center;font-size:11px;border-top:1px solid #ffffff3b;padding-top:17px}.hero-footer>a{display:flex;align-items:center;gap:25px;padding:7px 0}.hero-footer>a span{font-size:17px}.hero-footer button{display:flex;align-items:center;gap:9px;min-height:40px;font-size:10px;padding:0}.motion-symbol{font-size:12px}.studio-section{padding:115px var(--pad) 85px}.studio-intro{display:grid;grid-template-columns:1fr 2fr;gap:50px}.section-label{font-size:13px;color:var(--muted)}.studio-intro>.section-label{padding-top:10px}.studio-intro h2{font-size:clamp(48px,5.2vw,85px);line-height:1.02;font-weight:400;letter-spacing:-.055em}.studio-description{font-size:17px;color:var(--muted);max-width:595px;margin-top:30px}.offerings{margin:70px 0 0 calc((100% - 50px)/3 + 50px);display:grid;grid-template-columns:1fr 1fr;gap:50px}.offerings article{border-top:1px solid var(--line);padding-top:24px}.offerings h3{font-size:22px;line-height:1.2;font-weight:400;letter-spacing:-.5px}.offerings p{font-size:13px;line-height:1.7;color:var(--muted);margin-top:15px;max-width:350px}.production-line{font-size:11px;color:#969690;display:flex;gap:21px;flex-wrap:wrap;justify-content:flex-end;margin-top:70px}.production-line span{color:#535650}.contact-section{padding:90px var(--pad) 95px;border-top:1px solid var(--line)}.contact-cta{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:28px}.contact-cta h2{font-weight:400;letter-spacing:-.065em;line-height:1;font-size:clamp(72px,11vw,190px)}.contact-cta svg{height:7vw;width:7vw;stroke-width:1;transition:transform .3s}.contact-cta:hover svg{transform:translate(6px,-6px)}.email-link{display:inline-block;margin-top:42px;font-size:14px;border-bottom:1px solid #ffffff60;padding-bottom:7px}footer{border-top:1px solid var(--line);padding:35px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:11px;color:var(--muted)}footer .wordmark{font-size:27px;color:var(--white)}footer .brand-dot{width:4px;height:4px}.preview-note{font-size:10px}.screening-room{width:min(1200px,94vw);max-height:94svh;border:1px solid #ffffff36;background:var(--ink);color:var(--white);padding:25px;overflow-y:auto}.screening-room::backdrop{background:#080909f2;backdrop-filter:blur(15px)}.screening-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:22px}.close-screening{display:flex;align-items:center;gap:20px;padding:10px;font-size:12px}.close-screening span{font-size:28px;line-height:.6}#screening-video{display:block;width:100%;max-height:67svh;background:#000}.screening-bottom{display:flex;justify-content:space-between;gap:35px;margin-top:25px}.screening-bottom h2{font-size:30px;font-weight:400;letter-spacing:-1px}.screening-bottom p{font-size:12px;color:var(--muted)}
@media(min-width:1800px){.hero h1{font-size:7.2vw}.hero-content{bottom:165px}}
@media(max-width:1000px){.hero{min-height:780px}.hero h1{font-size:8vw}.hero-content{bottom:145px}.hero-topline p{font-size:15px}.hero-topline>span{font-size:10px}.hero-bottom>p{font-size:14px;max-width:390px}.studio-intro{grid-template-columns:1fr 2.5fr;gap:35px}.offerings{margin-left:0;margin-top:50px}.production-line{justify-content:flex-start}.studio-description{font-size:15px}.site-header nav{gap:35px}.watch-film{font-size:12px;gap:15px}.play-circle{height:52px;width:52px}}
@media(max-width:700px){:root{--pad:6vw}.site-header{height:82px;gap:20px}.wordmark{font-size:28px}.brand-dot{width:5px;height:5px}.site-header nav{gap:0;font-size:11px}.site-header nav>a:first-child{display:none}.nav-contact{gap:17px}.nav-contact svg{width:13px}.hero{height:100svh;min-height:780px;max-height:1000px}.hero-topline{top:110px;display:block}.hero-topline p{font-size:14px}.hero-topline>span{display:block;font-size:9px;margin-top:12px;color:#d6d3c9}.hero-topline i{font-size:13px}.hero-shade{background:linear-gradient(180deg,#000b,transparent 23%,#0002 34%,#000b 52%,#0b0c0df5 82%,var(--ink)),linear-gradient(90deg,#0002,transparent)}.hero-content{bottom:132px}.hero h1{font-size:clamp(45px,11.65vw,79px);line-height:1.03;letter-spacing:-.055em}.hero h1 span:first-child{max-width:400px}.hero h1 span+span{margin-top:5px}.hero-bottom{display:block;margin-top:25px}.hero-bottom>p{font-size:13px;max-width:330px}.desktop-break{display:none}.watch-film{margin-top:28px;font-size:12px;min-height:48px;gap:15px}.watch-film small{font-size:10px;margin-top:5px}.play-circle{width:46px;height:46px}.hero-footer{bottom:22px;font-size:10px;padding-top:15px}.hero-footer>a{gap:17px}.hero-footer button{font-size:9px;min-height:44px}.studio-section{padding:65px var(--pad) 50px}.studio-intro{display:block}.studio-intro>.section-label{padding:0;margin-bottom:28px}.section-label{font-size:11px}.studio-intro h2{font-size:11.5vw;line-height:1.05}.studio-description{font-size:14px;margin-top:24px}.offerings{grid-template-columns:1fr;gap:30px;margin-top:40px}.offerings h3{font-size:22px}.offerings p{font-size:13px;max-width:100%}.production-line{display:block;line-height:2.2;font-size:10px;margin-top:37px;max-width:300px}.production-line span{padding:0 7px}.contact-section{padding:55px var(--pad) 60px}.contact-cta{margin-top:25px;gap:12px}.contact-cta h2{font-size:14.2vw}.contact-cta svg{width:9vw;height:9vw;flex-shrink:0}.email-link{font-size:12px;margin-top:27px}footer{display:grid;grid-template-columns:1fr 1fr;gap:25px 10px;font-size:9px;padding-top:28px;padding-bottom:28px}footer .wordmark{font-size:23px}footer>span:nth-child(2){text-align:right;font-size:9px;max-width:110px;justify-self:end}footer .preview-note{font-size:8px;grid-column:1/-1}.screening-room{padding:15px}.screening-top{font-size:10px}.screening-bottom{flex-direction:column;gap:14px}.screening-bottom h2{font-size:24px}.screening-bottom p{font-size:11px}.close-screening{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Revision 4: one silver composition, two complete headline statements. */
.site-header { height: 104px; }
.hero { display: flex; flex-direction: column; height: calc(100svh - 112px); min-height: 790px; max-height: 1200px; padding: 0 var(--pad); background: var(--ink); }
.hero-media { z-index: -3; }
.hero-media canvas, .art-fallback { display: block; position: absolute; width: 100%; height: 100%; inset: 0; }
.hero-media canvas[hidden] { display: none; }
.art-fallback { background: var(--ink) url('./assets/liquid-silver-still.webp') center / cover no-repeat; }
.hero-shade { background: linear-gradient(180deg, #090a0b44, transparent 23%, #090a0b0d 35%, #090a0baa 59%, #090a0bf2 86%, var(--ink)), linear-gradient(90deg, #090a0b33, transparent 60%); }
.hero-topline { top: 138px; }
.hero-topline p { font-size: 15px; color: #e0e1df; }
.hero-content { position: relative; inset: auto; margin-top: auto; padding-top: 310px; padding-bottom: 105px; }
.hero h1 { font-size: clamp(72px, 8.2vw, 150px); font-weight: 400; line-height: 1.015; letter-spacing: -.063em; }
.hero h1 span + span { margin-top: 0; }
.hero h1 span:first-child { max-width: none; }
.hero-bottom { align-items: flex-end; gap: 55px; margin-top: 32px; }
.hero-bottom > p { font-size: 18px; line-height: 1.6; color: #c6c8c9; max-width: 565px; text-wrap: pretty; }
.watch-film { gap: 20px; font-size: 13px; min-height: 78px; flex-shrink: 0; }
.watch-film small { font-size: 11px; color: var(--muted); margin-top: 9px; }
.film-thumbnail { position: relative; display: block; width: 124px; height: 78px; overflow: hidden; border-radius: 2px; }
.film-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: .72; transition: opacity .2s; }
.play-circle { position: absolute; inset: 0; margin: auto; height: 34px; width: 34px; border-color: #ffffff9c; background: #090a0b66; }
.play-circle svg { width: 12px; height: 12px; }
.watch-film:hover .film-thumbnail img { opacity: 1; }
.hero-footer { bottom: 27px; gap: 20px; border: 0; padding: 0; color: var(--muted); }
.hero-footer a { gap: 26px; min-height: 40px; color: var(--white); }
.hero-footer a span { font-size: 19px; }

/* Historical brands stay visible together, without a moving marquee. */
.brand-band { padding: 30px var(--pad) 42px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #101214; }
.brand-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 25px; margin-bottom: 34px; }
.brand-heading h2 { font-size: 13px; font-weight: 400; }
.brand-heading p { font-size: 11px; color: var(--muted); }
.brand-logos { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(6, 1fr); gap: 36px 40px; align-items: center; }
.brand-logos li { height: 44px; display: flex; justify-content: center; align-items: center; }
.brand-logos img { width: 140px; height: 44px; max-width: 100%; object-fit: contain; opacity: .9; filter: grayscale(1); }
.brand-logos img[alt="ATR"], .brand-logos img[alt="Expo 2020 Dubai"] { filter: grayscale(1) brightness(2); }
.studio-intro h2 { font-size: clamp(54px, 6vw, 96px); }
.studio-description { max-width: 580px; }
.offerings h3 { font-size: 23px; }
.offerings p { font-size: 14px; margin-top: 17px; }
.production-line { font-size: 12px; color: var(--muted); }

@media (max-width: 1100px) {
  .hero { min-height: 760px; }
  .hero h1 { font-size: 8.15vw; }
  .hero-bottom { gap: 35px; }
  .hero-bottom > p { font-size: 16px; max-width: 530px; }
  .film-thumbnail { width: 98px; height: 68px; }
  .watch-film { font-size: 12px; gap: 14px; }
  .brand-logos { gap: 30px; }
  .brand-logos img { width: 115px; }
}
@media (max-width: 800px) {
  .hero { height: auto; min-height: 850px; }
  .hero-content { padding-top: 340px; }
  .hero-bottom { display: block; margin-top: 26px; }
  .hero-bottom > p { max-width: 600px; }
  .watch-film { margin-top: 26px; min-height: 62px; }
  .film-thumbnail { width: 98px; height: 62px; }
  .brand-heading { display: block; }
  .brand-heading p { margin-top: 7px; }
}
@media (max-width: 600px) {
  :root { --pad: 6vw; }
  .site-header { height: 86px; }
  .hero { height: auto; min-height: 100svh; max-height: none; }
  .hero-topline { top: 115px; }
  .hero-topline p { font-size: 13px; }
  .hero-shade { background: linear-gradient(180deg, #090a0b55, transparent 14%, #090a0b26 24%, #090a0bcc 42%, #090a0bf5 61%, var(--ink) 88%); }
  .hero-content { padding-top: 290px; padding-bottom: 88px; }
  .hero h1 { font-size: clamp(43px, 12.15vw, 74px); line-height: 1.04; letter-spacing: -.052em; }
  .hero h1 span:first-child { max-width: none; }
  .hero h1 span + span { margin-top: 6px; }
  .hero-bottom { margin-top: 26px; }
  .hero-bottom > p { font-size: 16px; line-height: 1.65; max-width: 450px; }
  .watch-film { margin-top: 25px; font-size: 12px; gap: 16px; }
  .watch-film small { font-size: 10px; margin-top: 7px; }
  .hero-footer { bottom: 19px; font-size: 10px; gap: 10px; }
  .hero-footer a { gap: 13px; }
  #interaction-hint { max-width: 152px; text-align: right; font-size: 9px; line-height: 1.5; }
  .brand-band { padding: 28px var(--pad) 36px; }
  .brand-heading { margin-bottom: 30px; }
  .brand-heading h2 { font-size: 12px; }
  .brand-heading p { font-size: 10px; }
  .brand-logos { grid-template-columns: repeat(3, 1fr); gap: 28px 20px; }
  .brand-logos li, .brand-logos img { height: 34px; }
  .brand-logos img { width: 100%; }
  .studio-intro h2 { font-size: 14vw; line-height: 1.03; }
  .studio-description { font-size: 15px; }
  .offerings { gap: 32px; }
  .offerings h3 { font-size: 23px; }
  .offerings p { font-size: 14px; }
  .production-line { font-size: 11px; max-width: 320px; }
}