@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');
:root{--bg:#101012;--panel:#19191c;--ink:#f3f0e9;--muted:#b5b3b0;--red:#ad242c;--line:#ffffff20}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.7 Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,summary:focus-visible{outline:2px solid #ff6269;outline-offset:5px}h1,h2,h3,p{margin:0}h1,h2,h3,.brand{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;line-height:1.04}h1{font-size:clamp(50px,7vw,110px);font-weight:700;letter-spacing:-.025em}h2{font-size:clamp(35px,4vw,58px);font-weight:600}h3{font-size:35px;font-weight:600}p{color:var(--muted)}header{position:sticky;top:0;z-index:30;background:#101012f2;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.top{max-width:1440px;margin:auto;padding:22px 5%;display:flex;justify-content:space-between;align-items:center;gap:25px}.brand{font-size:26px;letter-spacing:.09em;white-space:nowrap;font-weight:700}.brand span{font-weight:500;color:#b9b6b2}.top nav{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:500}.nav-contact{border:1px solid #777;padding:7px 17px}.menu{position:relative}.menu summary{cursor:pointer;list-style:none}.menu summary::-webkit-details-marker{display:none}.menu summary span{margin-left:5px}.menu>div{position:absolute;top:35px;right:0;width:295px;background:#202023;border:1px solid #444;padding:10px;box-shadow:0 20px 40px #0008}.menu>div a{display:block;padding:9px 12px}.menu a:hover,.menu a[aria-current]{background:#ffffff0a;color:#f5787e}.preview{text-align:center;padding:10px 20px;letter-spacing:.18em;font-size:9px;color:#b4b1ae;background:#171719}.preview span{color:#cb3e46;margin:0 10px}.home-hero,.page-hero{position:relative;background:linear-gradient(90deg,#08080af2 0%,#0a0a0bc0 44%,#0a0a0b28 100%),url('/assets/film-set.webp') center/cover;min-height:640px;display:flex;align-items:center;border-bottom:1px solid var(--line)}.hero-inner{padding:85px 6%;width:100%;max-width:1440px;margin:auto;position:relative;z-index:1}.hero-inner h1{max-width:850px}.home-hero h1{text-transform:uppercase;max-width:660px}.home-hero h1 span{color:#d03840}.eyebrow{font-size:10px;letter-spacing:.2em;font-weight:600;color:#d9666c;margin-bottom:20px}.intro{font-size:17px;line-height:1.8;max-width:600px;margin-top:27px;color:#e0ded9}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.button{display:inline-flex;justify-content:space-between;align-items:center;gap:22px;background:#a82029;color:white;padding:14px 24px;font-size:12px;font-weight:600;border:1px solid #cc3e46;line-height:1.5;transition:background .2s,transform .2s}.button:hover{background:#c12a34;transform:translateY(-2px)}.button.secondary{background:#14141660;border:1px solid #888}.hero-index{position:absolute;right:6%;bottom:20px;font-size:9px;letter-spacing:.17em;color:#bbb}.intro-band{padding:75px 6%;max-width:1440px;margin:auto;display:grid;grid-template-columns:1fr 1fr;column-gap:9%}.intro-band .eyebrow{grid-column:1/-1}.intro-band p:last-child{font-size:16px;max-width:590px;padding-top:6px}.explore{padding:30px 6% 90px;max-width:1440px;margin:auto}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px}.section-heading p:last-child{font-size:13px}.cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}.card{position:relative;min-height:290px;overflow:hidden;padding:30px;display:flex;align-items:end;background:linear-gradient(0deg,#08080afa,#131315b8),url('/assets/film-set.webp') center/cover;border:1px solid #ffffff24;transition:border-color .2s,transform .2s}.card:hover{border-color:#bb4047;transform:translateY(-3px)}.card div{max-width:430px}.card p{font-size:13px;max-width:360px;margin-top:14px}.card-number{position:absolute;top:20px;right:24px;font-family:'Barlow Condensed',Impact,sans-serif;font-size:45px;line-height:1;color:#ffffff32}.card-link{display:flex;gap:30px;font-size:10px;text-transform:uppercase;letter-spacing:.15em;margin-top:23px;color:#d6d3cd}.card-link b{font-size:18px;color:#ed747a;line-height:1}.feature{background-position:80% 60%}.short{background-position:30% 30%}.script{background:radial-gradient(ellipse at 100% 0%,#8e563640,transparent 60%),linear-gradient(135deg,#292320,#111114)}.pre{background:radial-gradient(ellipse at 100% 20%,#b5985540,transparent 60%),linear-gradient(135deg,#292923,#111114)}.producer{background-position:70% 80%}.post{background:radial-gradient(ellipse at 100% 20%,#42778f40,transparent 60%),linear-gradient(135deg,#202c34,#111114)}.projects{background:radial-gradient(ellipse at 100% 30%,#a7203050,transparent 60%),linear-gradient(135deg,#30161b,#111114)}.contact-banner{padding:80px 6%;text-align:center;background:linear-gradient(#30090bca,#12080ae8),url('/assets/film-set.webp') center 60%/cover;border-block:1px solid #692027}.contact-banner p:not(.eyebrow){margin:20px auto;max-width:620px}.contact-banner .button{margin-top:10px}footer{padding:55px 6% 28px;max-width:1440px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:30px}footer p{font-size:12px;margin-top:14px}footer nav{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;font-size:11px}footer a:hover{color:#e96970}.fine{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px!important;color:#747477!important;font-size:10px!important}.back{display:inline-block;color:#d2cfcb;font-size:11px;margin-bottom:35px}.page-hero{min-height:610px;background-position:center}.page-hero h1{font-size:clamp(45px,5.4vw,77px);max-width:880px}.page-label{font-size:14px;color:#d4cfc8;margin-bottom:15px}.page-hero .intro{max-width:770px;font-size:15px}.page-hero .button{margin-top:30px}.page-content{max-width:1440px;margin:auto;padding:80px 6%;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:8%}.text-section{display:flex;gap:28px;margin-bottom:45px;padding-bottom:35px;border-bottom:1px solid var(--line)}.section-no{font-size:12px;color:#d0555e;padding-top:7px}.text-section h2{font-size:34px;line-height:1.12;margin-bottom:20px}.text-section p{font-size:14px;line-height:1.9}.page-content aside{align-self:start;background:var(--panel);border-top:3px solid var(--red);padding:30px;position:sticky;top:110px}.page-content aside h2{font-size:32px}.page-content aside ul{padding-left:18px;color:#ceccc6;font-size:12px;line-height:1.9;margin:25px 0}.page-content aside li{margin-bottom:14px;padding-left:3px}.page-content aside li::marker{color:#d35d64}.page-content aside .button{width:100%;font-size:11px}.small{font-size:10px;margin-top:17px}.next{border-top:1px solid var(--line);padding:65px 6%;max-width:1440px;margin:auto}.related{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin-top:32px}.related a{font-size:13px;border-bottom:1px solid var(--line);padding:17px 0;display:flex;justify-content:space-between}.related a span{color:#d75b63}.related a:hover{color:#e76a73}.skip{position:fixed;left:12px;top:-60px;z-index:100;background:white;color:black;padding:10px}.skip:focus{top:12px}@media(min-width:1600px){.hero-inner{padding-left:86px}.home-hero{min-height:760px}}@media(max-width:850px){.top{padding:17px 5%}.top nav{gap:15px;font-size:11px}.brand{font-size:22px}.nav-contact{display:none}.home-hero,.page-hero{min-height:590px}.hero-inner{padding:65px 6%}.intro-band{gap:25px;grid-template-columns:1fr}.intro-band p:last-child{max-width:100%}.section-heading{align-items:start;flex-direction:column}.page-content{grid-template-columns:1fr;gap:25px;padding-top:50px}.page-content aside{position:static}.card{min-height:310px;padding:25px}.card h3{font-size:30px}footer{grid-template-columns:1fr}.fine{grid-column:1}.intro{max-width:550px}}@media(max-width:560px){.top{flex-wrap:wrap;gap:12px}.top nav{width:100%;justify-content:space-between}.top .brand{font-size:25px}.top nav .nav-contact{display:block;padding:4px 11px}.menu>div{left:-45px;right:auto;width:275px}.preview{font-size:7px;letter-spacing:.1em}.home-hero{min-height:610px;background-position:68% center;background-image:linear-gradient(90deg,#08080ae8,#08080aa8),url('/assets/film-set.webp')}.hero-inner{padding:55px 6% 70px}.home-hero h1{font-size:64px}.intro{font-size:15px}.eyebrow{font-size:8px}.hero-index{font-size:7px}.intro-band{padding:50px 6%}.section-heading p:last-child br{display:none}.cards{grid-template-columns:1fr;gap:15px}.card{min-height:260px}.explore{padding-bottom:50px}.contact-banner{padding:55px 6%}.contact-banner h2{font-size:40px}.page-hero h1{font-size:48px}.page-hero{min-height:610px;background-image:linear-gradient(90deg,#08080af0,#08080abf),url('/assets/film-set.webp')}.page-hero .intro{font-size:14px}.text-section{gap:15px}.text-section h2{font-size:30px}.text-section p{font-size:13px}.related{grid-template-columns:1fr}.next{padding:50px 6%}.hero-actions .button{font-size:10px;padding:13px 17px}footer nav{font-size:10px}footer{padding-top:40px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Individual visual identity for every Film page and its matching navigation card. */
.page-hero{background-image:linear-gradient(90deg,#08080af5 0%,#08080ac7 44%,#08080a32 100%),var(--scene);background-position:center;background-size:cover}
.card{background-image:linear-gradient(0deg,#08080afa 0%,#08080ab7 45%,#08080a22 100%),var(--scene);background-size:cover;background-position:center}
body[data-page="commercials-advertising"]{--panel:#201b18;background:linear-gradient(145deg,#1c1512,#101012 65%)}
body[data-page="feature-films"]{--panel:#21171d;background:linear-gradient(145deg,#20131c,#101012 65%)}
body[data-page="short-films"]{--panel:#201d17;background:linear-gradient(145deg,#201b12,#101012 65%)}
body[data-page="send-us-your-script"]{--panel:#211b16;background:linear-gradient(145deg,#20160f,#101012 65%)}
body[data-page="pre-production-services"]{--panel:#1d2019;background:linear-gradient(145deg,#1a2015,#101012 65%)}
body[data-page="producer-services"]{--panel:#1b1e21;background:linear-gradient(145deg,#171e23,#101012 65%)}
body[data-page="post-production-services"]{--panel:#162126;background:linear-gradient(145deg,#10242b,#101012 65%)}
body[data-page="current-projects"]{--panel:#24161a;background:linear-gradient(145deg,#291117,#101012 65%)}
@media(max-width:560px){.page-hero{background-image:linear-gradient(90deg,#08080af0,#08080aae),var(--scene);background-position:60% center}.card{background-position:65% center}}
.about-hero{min-height:650px}.about-story{max-width:1440px;margin:auto;padding:75px 6%}.about-story h2{max-width:850px}.story-columns{display:grid;grid-template-columns:1fr 1fr;gap:7%;margin-top:35px}.story-columns p{font-size:15px;line-height:1.95}.brand-pair{display:grid;grid-template-columns:1fr 1fr;max-width:1440px;margin:auto;padding:0 6%;gap:24px}.brand-panel{padding:50px 35px;border:1px solid var(--line);background:#18181b}.brand-panel h2{font-size:46px;margin-bottom:28px}.brand-panel p:not(.eyebrow){font-size:14px;line-height:1.9;margin-top:20px}.brand-panel .button{margin-top:30px}.films-panel{background:linear-gradient(#16161be0,#121216f5),url('/assets/feature-films.webp') center/cover}.sauce-panel{background:linear-gradient(#241810c8,#18120ff0),url('/assets/about-synyster.webp') right/cover}.values{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:45px;padding-top:35px;border-top:1px solid var(--line)}.values h3{font-size:30px;color:#eee6da;margin-bottom:12px}.values p{font-size:13px}.about-contact{background-image:linear-gradient(#30090bca,#12080aeb),url('/assets/about-synyster.webp')}@media(max-width:850px){.top nav{gap:12px}.brand-pair{gap:16px}.brand-panel{padding:35px 25px}.brand-panel h2{font-size:38px}.story-columns{gap:30px}}@media(max-width:560px){.top nav{gap:8px;font-size:10px}.top nav .nav-contact{padding:4px 8px}.story-columns,.brand-pair,.values{grid-template-columns:1fr}.about-story{padding:50px 6%}.story-columns{gap:22px}.brand-panel h2{font-size:40px}.about-hero{min-height:620px}}
/* Emblem is woven into the opening composition; the supplied artwork stays intact. */
.about-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:center;padding:35px max(6%,calc((100vw - 1440px)/2 + 86px));min-height:720px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 80% 70%,#57220c28,transparent 48%),radial-gradient(ellipse at 75% 20%,#16413c20,transparent 40%),#101012}
.about-hero:after{content:"";position:absolute;bottom:0;left:6%;right:6%;height:1px;background:linear-gradient(90deg,transparent,#bc79396b,transparent)}
.about-hero .hero-inner{padding:35px 25px 35px 0;margin:0;position:relative;z-index:2;max-width:650px}
.about-hero h1{font-size:clamp(48px,4.8vw,74px);max-width:650px}.about-hero .intro{max-width:540px;font-size:15px}.about-hero .eyebrow{color:#e3a466}.about-hero .button{background:#98212a;border-color:#b96342}
.about-emblem{position:relative;margin:0 -3% 0 -2%;align-self:center;z-index:1}.about-emblem:before{content:"";position:absolute;inset:15%;background:#d7531720;filter:blur(70px);z-index:-1}.about-emblem img{display:block;width:100%;height:auto;object-fit:contain;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent);mask-image:radial-gradient(ellipse 70% 70% at center,#000 57%,#000d 65%,transparent 77%)}
body[data-page="about"] .about-story .eyebrow{color:#ce935d}body[data-page="about"] .values h3{color:#e6bd8b}
@media(max-width:1000px){.about-hero{padding:35px 6%;min-height:650px;grid-template-columns:1.05fr 1fr}.about-hero h1{font-size:55px}.about-hero .intro{font-size:14px}.about-hero .hero-inner{padding-right:10px}.about-emblem{margin:0 -9% 0 -5%}}
@media(max-width:700px){.about-hero{grid-template-columns:1fr;min-height:0;padding:45px 6% 15px;gap:10px}.about-hero .hero-inner{padding:0;max-width:100%}.about-hero h1{font-size:54px}.about-hero .intro{max-width:100%}.about-emblem{width:min(100%,520px);margin:0 auto}.about-hero .button{margin-top:25px}.about-hero .page-label{font-size:12px}}
/* Full-section emblem background with copy layered above the artwork. */
.about-hero.emblem-background{display:block;min-height:clamp(880px,80vw,1500px);padding:70px 6%;background-image:linear-gradient(90deg,#090909e6 0%,#090909b3 25%,#09090930 51%,#09090900 75%),linear-gradient(0deg,#101012 0%,#10101200 12%),url('/assets/synyster-emblem.jpg');background-size:cover;background-position:center center;background-repeat:no-repeat;align-content:start}
.about-hero.emblem-background .hero-inner{padding:10px 0;max-width:440px;position:relative;z-index:2;margin:0}.about-hero.emblem-background h1{font-size:clamp(46px,4vw,66px);text-shadow:0 3px 22px #000}.about-hero.emblem-background .intro{font-size:14px;max-width:380px;color:#ebe3d9;text-shadow:0 2px 12px #000}.about-hero.emblem-background .page-label{font-size:12px;color:#e4cbb0}.about-hero.emblem-background .eyebrow{color:#edbc85}.about-hero.emblem-background:after{bottom:0}
@media(max-width:1000px) and (min-width:701px){.about-hero.emblem-background{min-height:1000px;padding-top:55px;background-position:55% center}.about-hero.emblem-background .hero-inner{max-width:360px}.about-hero.emblem-background h1{font-size:48px}}
@media(max-width:700px){.about-hero.emblem-background{min-height:0;padding:calc(100vw - 35px) 6% 50px;background-color:#101012;background-image:linear-gradient(0deg,#101012 0%,#10101200 45%),url('/assets/synyster-emblem.jpg');background-size:100% 100vw,100% auto;background-position:top center;background-repeat:no-repeat}.about-hero.emblem-background .hero-inner{max-width:100%;padding:0}.about-hero.emblem-background h1{font-size:52px}.about-hero.emblem-background .intro{max-width:100%;font-size:14px}.about-hero.emblem-background .eyebrow{margin-bottom:16px}}

/* Shared uploaded brand artwork in every page header. */
.top .brand-logo{display:block;flex:0 0 auto;width:260px;line-height:0;letter-spacing:normal}.brand-logo img{display:block;width:100%;height:auto;object-fit:contain}.top{padding-top:10px;padding-bottom:10px}.top nav{gap:24px}
@media(max-width:1000px){.top .brand-logo{width:220px}.top nav{gap:16px}}
@media(max-width:700px){.top .brand-logo{width:min(260px,75vw)}.top{padding-top:10px;padding-bottom:14px}.top nav{flex-wrap:wrap;justify-content:center;gap:12px 18px}}

/* Dissolve the artwork's dark backdrop into the shared header. */
header{background:#101012;isolation:isolate}.brand-logo img{mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse at center,#000 58%,#000c 77%,transparent 100%);mask-image:radial-gradient(ellipse at center,#000 58%,#000c 77%,transparent 100%)}

@media(min-width:1001px){.top{gap:20px}.top nav{gap:18px;flex-wrap:wrap;justify-content:flex-end}}
@media(min-width:701px) and (max-width:1000px){.top nav{flex-wrap:wrap;justify-content:flex-end;gap:12px 16px}}