/* ============================================================
   SERA STUDIOS: STYLES
   COLOURS AND FONTS are the first lines below (:root).
     --bg      page background (off-white)
     --fg      main text and borders (near-black)
     --red     brand red used for buttons, panels, highlights
     --btn     the nav "Contact us" button colour
     --dark    dark section background
     --cream   / --cream-2   warm cream used on About and hover cards
     --ink-2   second near-black
     --d       heading font (condensed)   --b   body font
   The big SERA wordmark is drawn by js/main.js (function fit) in the
   font "Archivo", expanded, weight 900. Band colour is #f6f6f6 there.
   Tip: keep text on red at 4.5:1 contrast or better (white on #e51a24 passes).
   ============================================================ */
:root{--bg:#f6f6f6;--fg:#0d0d0d;--cream-2:#f2eee6;--btn:#e51a24;--red:#e51a24;--ink-2:#0d0d0d;--dark:#0d0d0d;--cream:#f2eee6;
--d:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--b:'Montserrat',Arial,sans-serif;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#f6f6f6}}
:root[data-theme="dark"]{--bg:#f6f6f6}
html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--fg);font-family:var(--b);overflow-x:hidden}
a{color:inherit;text-decoration:none}
h1,h2,h3,.d{font-family:var(--d);text-transform:uppercase;font-weight:800;line-height:.9}
.star{display:inline-block;width:.5em;height:.5em;background:currentColor;clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);margin:0 .3em}
/* NAV */
header{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:50;display:flex;justify-content:space-between;padding:20px 32px;pointer-events:none}
.box{display:flex;border:2px solid var(--fg);background:var(--bg);pointer-events:auto;height:48px;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px}
.box>*{display:flex;align-items:center;padding:0 16px;border-right:2px solid var(--fg)}
.box>*:last-child{border-right:0}
.box .lg{background:#fff;padding:0 8px}.box .lg img{height:32px}
.box a:hover{background:var(--fg);color:var(--bg)}
.tick{width:300px;overflow:hidden;padding:0;font-weight:600;border-right:2px solid var(--fg)}
.tick div{white-space:nowrap;animation:mq 14s linear infinite;padding-left:16px}
.box .cta{background:var(--btn);color:#fff}
@keyframes mq{to{transform:translateX(-50%)}}
@media(max-width:800px){.tick,.box .lk{display:none}header{padding:12px}}
/* HERO */
.hero{padding-top:110px}
.wm{font-family:var(--d);font-weight:800;text-transform:uppercase;white-space:nowrap;line-height:.78;color:var(--fg);padding:0 32px;text-align:center;transition:color 1s;
background:linear-gradient(120deg,#222,#888,#111,#5a6a70,#222);background-size:300% 300%;-webkit-background-clip:text;background-clip:text;animation:bg 8s ease infinite;overflow:hidden}
.wm.on{color:transparent;-webkit-text-fill-color:transparent}
@keyframes bg{50%{background-position:100% 50%}}
.vid{position:relative;height:80vh;min-height:420px;margin-top:40px;background:linear-gradient(120deg,#050505,#2a2f31,#0b0b0b,#3a3f3a);background-size:300% 300%;animation:bg 10s ease infinite;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:48px;gap:14px;text-align:center}
.vid h2{font-size:clamp(32px,4vw,52px)}
.red{background:var(--red);color:#fff;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:22px;padding:12px 22px;transition:.2s}
.red:hover{background:#fff;color:var(--fg)}
.vid .l,.vid .r{position:absolute;bottom:40px;font-size:11px;letter-spacing:.1em;border:1px solid #fff;padding:6px 14px;border-radius:99px}
.vid .l{left:32px}.vid .r{right:32px}
/* WHAT WE DO */
.wwd{position:relative;min-height:100vh;display:grid;grid-template-columns:1fr 2fr;padding:96px 32px 0;gap:32px}
.lbl{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:15px}
.wwd h2{font-size:clamp(28px,3.4vw,46px);margin-bottom:20px}
.wwd p{font-size:14px;line-height:1.5;max-width:460px}
.mono{display:block;width:clamp(120px,14vw,200px);margin-top:28px}
.acc{display:flex;height:620px;grid-column:1/-1;margin:0 -32px;position:relative;z-index:2}
.pn{flex:0 0 64px;overflow:hidden;transition:flex .7s cubic-bezier(.7,0,.2,1);cursor:pointer;position:relative;padding:24px 20px}
.pn.open{flex:1}
.pn:nth-child(1){background:var(--red);color:#fff}.pn:nth-child(2){background:#0d0d0d;color:#f2eee6}.pn:nth-child(3){background:#f2eee6}
.pn .vt{position:absolute;left:14px;bottom:24px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:30px;transition:opacity .3s}
.pn.open .vt{opacity:0}
.pn .in{opacity:0;transition:opacity .4s;min-width:min(600px,80vw);padding-left:48px}
.pn.open .in{opacity:1;transition-delay:.4s}
.pn .t{font-size:clamp(60px,9vw,140px);white-space:nowrap;margin-bottom:16px}
.pn .ph{height:240px;width:62%;background:linear-gradient(135deg,#0008,#0003),#335;margin-bottom:16px}
.pn p{font-size:13px;max-width:420px;margin-bottom:16px}
.pn li{list-style:none;font-family:var(--d);font-weight:800;text-transform:uppercase;border-bottom:1px solid currentColor;padding:6px 0;max-width:420px}
.pn ul{padding:0}
@media(max-width:800px){.wwd{grid-template-columns:1fr}.acc{height:520px}.pn .ph{width:100%}}
/* DIRECTORS */
.dir{background:var(--dark);color:var(--cream);padding:120px 32px;text-align:center}
.names{max-width:1200px;margin:0 auto}
.names a{display:block;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:clamp(48px,8vw,110px);line-height:1.1;border-bottom:1px solid #333;padding:6px 0;position:relative;transition:color .3s;color:#777}
.names:hover a{color:#555}
.names a:hover{color:var(--red)}
.names a .pic{display:inline-block;width:0;height:.8em;background:var(--cream);vertical-align:middle;transition:width .3s;margin:0 0 .06em}
.names a:hover .pic{width:1em;margin:0 .15em}
.names a:nth-child(3),.names a:nth-child(4){color:var(--cream)}
.under{display:inline-block;margin-top:40px;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px;border-bottom:2px solid var(--cream)}
/* WORK */
.work{background:var(--dark);color:var(--cream);padding:0 0 100px;text-align:center}
.wg{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #333}
.wg a{text-align:left;border-right:1px solid #333;border-bottom:1px solid #333;overflow:hidden}
.wg .ph{aspect-ratio:16/10;background:linear-gradient(135deg,#223,#554,#233);background-size:200%;transition:transform .6s}
.wg a:hover .ph{transform:scale(1.06)}
.wg .im{overflow:hidden}
.wg .tx{display:flex;justify-content:space-between;padding:14px 16px 0;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px}
.wg .tx small{font-family:var(--b);font-size:11px;font-weight:400;color:#999}
.wg .cl{padding:6px 16px 20px;font-size:11px;color:#999}
.vw{margin-top:48px;display:flex;justify-content:center;align-items:center;gap:24px;font-size:28px}
@media(max-width:800px){.wg{grid-template-columns:1fr}}
/* FUEL */
.fuel{background:var(--dark);color:var(--cream);height:150vh;position:relative;overflow:hidden}
.fuel h2{position:sticky;top:38vh;text-align:center;font-size:clamp(48px,7vw,100px);max-width:600px;margin:0 auto;z-index:1;padding-top:20vh}
.pol{position:absolute;width:210px;aspect-ratio:4/5;background:#e9e4d8;padding:10px 10px 40px;box-shadow:0 10px 30px #0008;transition:transform .1s linear}
.pol i{display:block;height:100%;background:linear-gradient(135deg,#789,#a97)}
.pol:nth-child(odd) i{background:linear-gradient(135deg,#a76,#445)}
/* QUOTES / NEWS / FOOT */
.sec{padding:100px 32px}
.sec h2{font-size:clamp(44px,7vw,100px);margin-bottom:32px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{border:2px solid var(--fg);padding:24px;transition:.25s;background:var(--bg)}
.card:hover{background:var(--cream-2);transform:translateY(-6px)}
.card .ph{aspect-ratio:3/2;background:#ddd;margin-bottom:14px}
.card h3{font-size:28px;margin-bottom:6px}.card p,.card small{font-size:13px}
@media(max-width:800px){.g3{grid-template-columns:1fr}}
.endc{background:var(--red);text-align:center;padding:110px 32px}
.endc h2{font-size:clamp(48px,9vw,140px);margin-bottom:28px}
.endc a{display:inline-block;background:var(--fg);color:var(--bg);font-family:var(--d);font-weight:800;font-size:24px;text-transform:uppercase;padding:14px 30px}
footer{background:var(--dark);color:var(--cream);padding:64px 32px 28px;display:grid;grid-template-columns:2fr 1fr 1fr 2fr;gap:32px}
footer h3{font-size:44px;margin-bottom:10px}footer li{list-style:none;padding:3px 0;color:#999;font-size:14px}footer ul{padding:0}
footer form{display:flex;margin-top:10px}footer input{flex:1;min-width:0;padding:12px;background:transparent;border:2px solid var(--cream);color:var(--cream);font:inherit}
footer button{background:var(--btn);border:0;padding:0 20px;font-family:var(--d);font-weight:800;font-size:18px;cursor:pointer}
.lg2{grid-column:1/-1;font-size:11px;color:#777;display:flex;justify-content:space-between}
@media(max-width:800px){footer{grid-template-columns:1fr 1fr}}
.rv{opacity:0;transform:translateY(40px);transition:.8s cubic-bezier(.2,.7,.2,1)}.rv.in{opacity:1;transform:none}

.pg{display:none}.pg.on{display:block}
.ph1{padding:150px 32px 40px;background:var(--bg)}.ph1 h1{font-size:clamp(60px,12vw,200px)}
.pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.pills button{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px;border:2px solid var(--fg);background:transparent;padding:8px 18px;cursor:pointer}
.pills button.on,.pills button:hover{background:var(--fg);color:var(--bg)}
.work.pg-w{padding-top:0}.wg a[hidden]{display:none}
.ab{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:40px 32px 100px;align-items:start}
.ab .big{aspect-ratio:4/5;background:linear-gradient(135deg,#111,#445,#a76);background-size:200%;animation:bg 9s ease infinite}
.ab p{font-size:15px;line-height:1.7;margin-bottom:18px;max-width:520px}
.stats{display:grid;grid-template-columns:1fr;border-top:2px solid var(--fg);margin-top:32px}
.stats div{padding:16px 0;font-size:12px}.stats b{display:block;font-family:var(--d);font-size:54px;font-weight:800}
.roles{background:var(--cream-2);padding:80px 32px}.roles ul{padding:0}
.roles li{list-style:none;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:clamp(40px,6vw,88px);border-bottom:2px solid var(--fg);padding:8px 0;display:flex;justify-content:space-between;align-items:baseline}
.roles li small{font-family:var(--b);font-size:13px;font-weight:400;text-transform:none;max-width:300px}
.ct{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:20px 32px 100px}
.ct p{font-size:16px;max-width:460px;margin-bottom:28px;line-height:1.6}.ct .k{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:14px;color:#777}
.ct .v{font-family:var(--d);font-weight:800;font-size:clamp(26px,3.4vw,44px);word-break:break-all;display:block;margin-bottom:24px;border-bottom:2px solid var(--fg)}
.ct form{display:grid;gap:12px}.ct input,.ct textarea,.ct select{font:inherit;padding:14px;border:2px solid var(--fg);background:transparent}
.ct button{background:var(--red);color:#fff;border:2px solid var(--fg);font-family:var(--d);font-weight:800;font-size:22px;text-transform:uppercase;padding:14px;cursor:pointer}
@media(max-width:800px){.ab,.ct{grid-template-columns:1fr}}
#intro{position:fixed;inset:0;z-index:100;background:#101010;display:grid;place-items:center;transition:background .25s,clip-path 1s cubic-bezier(.7,0,.2,1);clip-path:inset(0)}
#intro .iw{position:relative;display:grid;place-items:center;color:#fff;transition:color .25s}
#intro.w .iw{color:#101010}
#it{font-size:72px;line-height:1;text-transform:uppercase;white-space:nowrap}
#il{height:150px;opacity:0;position:absolute;transform:scale(.7);transition:.5s}
#il.s{opacity:1;transform:none}
#intro.go{clip-path:inset(0 0 100% 0)}
body.lock{overflow:hidden}header{transition:opacity .8s .4s}body.pre header{opacity:0}
.wmwrap{position:relative;background:#111;isolation:isolate}
.wmwrap video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s}
.wmwrap.on video{opacity:1}
.wm{position:relative;background:#f6f6f6;-webkit-background-clip:border-box;background-clip:border-box;animation:none;color:#000;-webkit-text-fill-color:#000;mix-blend-mode:lighten;transition:none;line-height:.85;padding:.04em 32px 0}
.wm.on{color:#000;-webkit-text-fill-color:#000}
.vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.vid::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,#000a);z-index:0}
.vid h2,.vid .red{position:relative;z-index:1}.vid .l,.vid .r{z-index:1}
.wg .cl{padding-bottom:4px}.wg .cr{padding:0 16px 22px;font-size:11px;color:#8a8a8a;line-height:1.6}
.wg .tx span::after{content:" ↗";color:var(--red)}.wg .tx small{max-width:48%;text-align:right;line-height:1.3}
.pj{padding:150px 32px 0}.pj .back{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:18px;border-bottom:2px solid var(--fg)}
.pj h1{font-size:clamp(44px,8vw,130px);margin:28px 0 16px}.pj .tag{display:inline-block;border:2px solid var(--fg);padding:6px 14px;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:18px}
.pmedia{display:grid;place-items:center;margin:36px 32px 0;aspect-ratio:16/8;min-width:0;background:linear-gradient(120deg,#050505,#2a2f31,#0b0b0b,#3a3f3a);background-size:300% 300%;animation:bg 10s ease infinite;position:relative;overflow:hidden}
.pmedia video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.pmedia .red{position:relative;z-index:1}
.pd{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;padding:56px 32px 80px}.pd .lbl{margin-bottom:14px}.pd p{font-size:20px;line-height:1.6;max-width:620px}
.pd dl{border-top:2px solid var(--fg);margin:0}.pd dl div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid #ccc;font-size:14px;line-height:1.5}
.pd dt{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:16px;color:#777}.pd dd{margin:0}.pd dd a{color:var(--red);font-weight:600}
.pn2{display:flex;justify-content:space-between;gap:24px;border-top:2px solid var(--fg);margin:0 32px;padding:28px 0 60px;flex-wrap:wrap}
.pn2 a{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:clamp(26px,3.6vw,52px);line-height:1}.pn2 a:hover{color:var(--red)}
@media(max-width:800px){.pd{grid-template-columns:1fr;gap:32px;padding:40px 16px 60px}.pd dl div{grid-template-columns:110px 1fr}.pmedia{margin:28px 16px 0;aspect-ratio:16/10}.pmedia .red{font-size:18px;padding:10px 16px}.pj{padding-inline:16px}.pn2{margin:0 16px}}
.wwd{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}@media(max-width:800px){.wwd{grid-template-columns:minmax(0,1fr)}}.acc{overflow:hidden;min-width:0}
.wg .im{position:relative;overflow:hidden}.wg .cv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s,transform .6s}.wg .cv.on{opacity:1}.wg a:hover .cv{transform:scale(1.06)}
.pmedia .red{position:absolute;left:20px;bottom:20px;z-index:2}.pmedia::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 60%,#0008);z-index:1;pointer-events:none}
.ab p{font-size:17px}.stats b{font-size:clamp(28px,7vw,54px)}
.team{padding-top:40px}.tm{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.tm div{border-top:2px solid var(--fg);padding-top:16px}.tm h3{font-size:clamp(28px,3vw,40px);margin-bottom:8px}.tm span{display:block;font-size:14px;color:#666;margin-bottom:10px}.tm a{color:var(--red);font-weight:600;font-size:14px}
@media(max-width:800px){.tm{grid-template-columns:1fr 1fr;gap:20px}.roles li{display:block}.roles li small{display:block;margin-top:6px;max-width:none}.roles{padding:56px 16px}.ab{padding:24px 16px 56px}.team{padding-inline:16px}}
@media(max-width:800px){.ph1{padding:120px 16px 24px}.sec{padding-inline:16px}}
.ct p{font-size:18px}.ct input,.ct textarea{font-size:16px;color:var(--fg)}.ct textarea{resize:vertical}
@media(max-width:800px){.ct{padding:20px 16px 60px}}
@media(max-width:800px){
header{padding:10px 12px}header .box:last-child{display:none}
.box{height:46px;font-size:18px}.box .lk{display:flex;padding:0 12px}.box .lg{padding:0 8px}
.vid{padding-bottom:96px}.vid .l{display:none}.vid .r{bottom:22px;right:16px;height:48px!important}.vid .red{font-size:20px}
.pn{flex:0 0 46px;padding:18px 10px}.pn .vt{left:9px;bottom:18px;font-size:22px}
.pn .in{min-width:0;padding-left:0;padding-right:6px}.pn .t{font-size:clamp(40px,12vw,56px);overflow:hidden}
.pn .ph{width:100%;height:170px}.pn p{max-width:none;font-size:13px}.pn li{max-width:none;font-size:18px}
.acc{height:600px}}
.tag{margin-top:4px}
.stills{padding:0 32px 72px}.stills .lbl{margin-bottom:16px}.sg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.sti{border:0;padding:0;background:#ddd;cursor:zoom-in;aspect-ratio:16/10;overflow:hidden}.sti img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}.sti:hover img,.sti:focus-visible img{transform:scale(1.05)}
.pn2{margin-bottom:0;padding-bottom:36px}
.nextp{position:relative;display:block;background:#0d0d0d;color:#f2eee6;overflow:hidden;min-height:44vh;display:flex;align-items:flex-end}
.nextp .cv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s,transform .8s}.nextp .cv.on{opacity:.45}.nextp:hover .cv{transform:scale(1.04);opacity:.65}
.nin{position:relative;z-index:1;padding:64px 32px}.nin span{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px;color:var(--red)}
.nin h2{font-size:clamp(40px,8vw,120px);margin:10px 0 0;color:#f2eee6;transition:color .3s}.nextp:hover h2{color:var(--red)}
#lb{position:fixed;inset:0;z-index:200;background:#000e;display:none;align-items:center;justify-content:center}#lb.on{display:flex}
#lb img{max-width:min(92vw,1200px);max-height:86vh;object-fit:contain}
#lb button{position:absolute;background:transparent;border:2px solid #fff;color:#fff;width:48px;height:48px;font-size:30px;line-height:1;cursor:pointer;font-family:var(--d)}
#lb button:hover{background:#fff;color:#000}.lbx{top:20px;right:20px}.lbp{left:16px;top:50%}.lbn{right:16px;top:50%}





:focus-visible{outline:3px solid var(--red);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.tick div,.marquee div{animation:none}}
@media(max-width:800px){.stills{padding:0 16px 48px}.sg{grid-template-columns:1fr 1fr}.nin{padding:48px 16px}.nextp{min-height:36vh}}
.vid h2{font-size:clamp(30px,2.9vw,46px);letter-spacing:-.01em}.vid .red{font-size:18px;padding:9px 16px}
.vals{position:relative;background:#0d0d0d;color:#f6f6f6;padding:150px 32px 160px;border-top:1px solid #2a2a2a}
.vals .vlogo{position:absolute;top:56px;right:32px;height:clamp(70px,8vw,120px)}
.vh{font-size:clamp(46px,6.8vw,112px);line-height:.88;letter-spacing:-.015em;max-width:11em}
.vs{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:clamp(17px,1.5vw,24px);margin-top:14px;line-height:1.1}
.vg{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(32px,5vw,72px);margin-top:clamp(72px,10vw,150px)}
.vg h3{font-size:clamp(30px,3.1vw,48px);margin-bottom:clamp(20px,2.6vw,40px)}
.vg p{font-size:clamp(16px,1.35vw,21px);line-height:1.4;max-width:21em;color:#e8e6e1}
.vals>.red{display:inline-block;margin-top:clamp(56px,6vw,96px);font-size:20px;padding:11px 20px}
.vg .rv:nth-child(2){transition-delay:.12s}.vg .rv:nth-child(3){transition-delay:.24s}
@media(max-width:800px){.vals{padding:96px 16px 104px}.vals .vlogo{top:28px;right:16px}.vg{grid-template-columns:1fr;gap:44px;margin-top:56px}.vh{padding-top:56px}}
.wm{font-family:'Archivo','Arial Black','Helvetica Neue',Arial,sans-serif;font-stretch:125%;font-weight:900;letter-spacing:-.01em;line-height:.8;padding:.08em 28px 0}
#it{font-size:inherit}
.lv{display:flex;flex-direction:column;align-items:center;color:#fff;font-family:'Archivo','Arial Black',Arial,sans-serif;font-size:clamp(34px,8vw,64px);line-height:1}
.lv1{flex-direction:row;gap:.1em}.lv1 b{border:.07em solid currentColor;width:1.25em;height:1.25em;display:grid;place-items:center;font-weight:900;font-stretch:125%}
.lv2 span{font-weight:900;font-style:italic;font-stretch:125%;font-size:1.5em;color:transparent;-webkit-text-stroke:.03em var(--fg);letter-spacing:.02em}
.lv2 i{display:block;width:100%;height:.22em;margin:.12em 0;background:repeating-linear-gradient(currentColor 0 .04em,transparent .04em .09em)}
.lv2 em,.lv3 em{font-style:normal;font-size:.36em;letter-spacing:.8em;margin-right:-.8em;font-weight:700}
.lv3 .row{display:flex;margin-bottom:.2em}.lv3 .pt{width:.5em;height:.5em;margin:0 .07em}.lv3 span{font-weight:900;font-size:1.6em;letter-spacing:-.02em;font-stretch:125%}.lv3 em{margin-top:.25em}
.lv4 span{position:relative;display:inline-block;font-weight:900;font-style:italic;font-stretch:125%;font-size:1.8em;letter-spacing:-.04em}
.lv4 span::after{content:"";position:absolute;left:-.12em;right:-.12em;top:50%;height:.1em;background:var(--cc,#101010);transform:rotate(-12deg)}
.lv5 svg{width:min(46vw,250px);height:auto}.lv5 .ring{transform-origin:100px 100px;animation:ringspin 2.4s linear infinite}@keyframes ringspin{to{transform:rotate(360deg)}}
.stage{position:relative;overflow:hidden;background:#111;isolation:isolate}
.stage>video.hv{position:absolute;left:0;width:100%;top:-26%;height:132%;object-fit:cover;opacity:0;transition:opacity 1.4s;will-change:transform}
.stage.on>video.hv{opacity:1}
.wmwrap{position:relative;background:none;isolation:auto}
.vid{background:none;animation:none;margin-top:0;height:62vh;min-height:380px;position:relative}
.hero{padding-top:110px}.wm{line-height:.78;padding:.03em 28px .1em}
.vid .l{border:0;padding:0;border-radius:0;left:32px;bottom:28px;font-size:16px}.vid .l .lv5 svg{width:104px}
.lv.dk,.dk .lv,.dk.lv{color:#0d0d0d}
.lvm{display:flex;justify-content:center;font-size:clamp(30px,4.6vw,56px);margin-bottom:34px;color:#0d0d0d}
.lvs{margin-top:44px;font-size:40px;display:flex;--cc:#f6f6f6;color:#0d0d0d}
.lvf{margin-bottom:14px;font-size:30px}.lvf .lv{align-items:flex-start}
.nlv{position:absolute;top:36px;right:32px;font-size:30px;z-index:1;--cc:#0d0d0d}
@media(max-width:800px){.vid .l{display:block;left:16px;bottom:22px}.vid .l .lv5 svg{width:70px}.nlv{top:24px;right:16px;font-size:24px}.lvm{margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){.lv5 .ring{animation:none}}
.lv{--fg:#fff}.lv.dk,.dk .lv,.dk.lv{--fg:#0d0d0d}
.nlv{top:auto;bottom:34px;right:32px;font-size:28px}
@media(max-width:800px){.nlv{bottom:22px;right:16px;font-size:22px}.nin{padding-bottom:84px}}
.vid .l .ring{animation:none}
.seg{display:flex;gap:0;margin-top:26px;border:2px solid var(--fg);width:max-content;max-width:100%}
.seg a{font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px;padding:9px 22px;border-right:2px solid var(--fg)}.seg a:last-child{border-right:0}
.seg a.on,.seg a:hover{background:var(--fg);color:var(--bg)}
.vint{margin-top:18px;font-size:17px;max-width:32em}
.vsec{background:#0d0d0d;color:#f2eee6;padding:44px 32px 110px}
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.vtile{appearance:none;border:0;padding:0;background:none;color:inherit;text-align:left;cursor:pointer;font:inherit;display:block}
.vtv{position:relative;display:block;aspect-ratio:9/16;background:#1a1a1a;overflow:hidden}
.vtv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}.vtile:hover .vtv video{transform:scale(1.04)}


.vtc{display:flex;gap:10px;align-items:baseline;padding:12px 2px 0;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:20px;line-height:1.1}
.vtc b{color:var(--red);font-size:16px}.vtc span{flex:1}.vtc small{font-family:var(--b);font-weight:400;font-size:12px;color:#999}
.vtile:focus-visible .vtv{outline:3px solid var(--red);outline-offset:3px}






@media(max-width:1100px){.vgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.vsec{padding:32px 16px 80px}.vgrid{grid-template-columns:repeat(2,1fr);gap:12px}.vtc{font-size:16px;flex-wrap:wrap;gap:6px}.seg a{font-size:18px;padding:8px 16px}.vbp,.vbn{top:auto;bottom:20px}.vbp{left:20px}.vbn{right:20px}}
.vtile{align-self:start;display:flex;flex-direction:column;justify-content:flex-start;width:100%}.vtile .vtv{width:100%}
.vtile{cursor:default}.vtile:hover .vtv video{transform:none}.vtc small{margin-left:auto}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:12px;top:-60px;z-index:300;background:#0d0d0d;color:#fff;padding:12px 18px;font-family:var(--d);font-weight:800;text-transform:uppercase;font-size:18px;transition:top .15s}.skip:focus{top:12px}
.pg:focus{outline:none}
footer li a{display:inline-block;padding:7px 0}
.pd dd a{color:#c8141d;display:inline-block;padding:5px 0}
.back{display:inline-block;padding:6px 0}
.pd dt,.ct .k{color:#666}.lg2{color:#8a8a8a}.vtc b{color:#ff3b43}
@media(max-width:360px){.box .lk{padding:0 8px;font-size:16px}.box .lg{padding:0 6px}header{padding:10px 8px}}
@media(max-width:380px){.endc{padding:80px 16px}.endc h2{font-size:40px}.lvm{font-size:30px}}
.wm{background:none!important;mix-blend-mode:normal!important;color:transparent!important;-webkit-text-fill-color:transparent!important}
.wm #wmc{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.wm #wmt{position:relative;opacity:0}

.cfs{min-height:1.5em;font-size:15px;margin:0}.cfp{font-size:12px;color:#666;margin:0}.ct button:disabled{opacity:.6;cursor:wait}
