@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#090910;--panel:#111119;--white:#f4f2eb;--muted:#a4a3b0;--yellow:#ffe034;--red:#e92937;--blue:#243dde;--border:#ffffff20}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}header{height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 5.5%;border-bottom:1px solid var(--border);position:relative;z-index:5;background:#090910e8}.brand{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:800;letter-spacing:1.3px;line-height:1.15}.brand>span:last-child>span{display:block;color:var(--yellow);letter-spacing:3px}.brand-icon{font-family:'Barlow Condensed',Impact,sans-serif;font-size:34px!important;font-style:italic;position:relative;border:2px solid var(--white);padding:2px 7px;transform:skew(-7deg)}.brand-icon span{position:absolute;color:var(--yellow);font-size:18px;right:-9px;top:-10px}nav{display:flex;gap:36px;align-items:center;font-size:13px;font-weight:600}nav a:hover{color:var(--yellow)}.nav-cta{padding:13px 20px;border:1px solid #ffffff50}.nav-cta span{margin-left:22px}.hero{min-height:720px;height:calc(100svh - 100px);max-height:940px;position:relative;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;padding:65px 5.5% 70px;background:radial-gradient(ellipse at 78% 50%,#17186480,transparent 52%),radial-gradient(ellipse at 90% 4%,#9c0b2430,transparent 45%)}.hero-grid{position:absolute;inset:0;opacity:.16;background-image:linear-gradient(#7774 1px,transparent 1px),linear-gradient(90deg,#7774 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent,#000)}.hero-copy{z-index:2;position:relative}.eyebrow{font-size:10px;letter-spacing:2.3px;font-weight:700;display:flex;align-items:center;gap:10px}.eyebrow i{width:7px;height:7px;background:var(--yellow);border-radius:100%;box-shadow:0 0 12px #ffe03466}h1,h2,h3{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;text-transform:uppercase;margin:0;font-weight:800}h1{font-size:clamp(90px,9vw,154px);line-height:.82;letter-spacing:-2px;margin:30px 0;position:relative}h1>span{color:var(--yellow)}h1 em{font-size:80px;position:absolute;color:var(--yellow);font-style:normal;margin-left:22px;bottom:8px;animation:turn 24s linear infinite}.hero p{color:var(--muted);font-size:14px;line-height:1.85;max-width:375px}.actions{display:flex;align-items:center;gap:25px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;padding:17px 23px;border:0;font-size:12px;font-weight:800;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px);background:#ffed86}.yellow{background:var(--yellow);color:#101013}.button span{font-size:20px}.text-link{font-size:12px;font-weight:600;border-bottom:1px solid #ffffff60;padding-bottom:7px}.text-link:hover{color:var(--yellow)}.hero-foot{font-size:8px;letter-spacing:1.8px;color:#9a99aa;margin-top:40px;display:flex;align-items:center;gap:18px}.hero-foot b{font-size:18px;color:#e1dfe7}.hero-art{position:relative;perspective:1300px;min-width:0}.orbit{position:absolute;width:570px;height:570px;border:1px solid #5358ff40;left:-5%;top:1%;border-radius:50%;transform:rotateX(22deg)}.orbit-two{width:700px;height:700px;left:-18%;top:-9%;border-style:dashed;opacity:.5}.art-type{position:absolute;top:25%;left:-4%;font-family:'Barlow Condensed',Impact,sans-serif;font-size:140px;color:transparent;-webkit-text-stroke:1px #7274c933;letter-spacing:10px;transform:rotate(-90deg)}.float-case{position:absolute;width:260px;height:354px;padding:0;border:0;border-radius:13px;background:#666;box-shadow:10px 12px 0 -6px #87858b,13px 14px 0 -7px #181720,20px 35px 60px #000b;overflow:hidden;transform-style:preserve-3d}.front-case{left:37%;top:19%;transform:rotate(12deg) rotateY(-15deg);animation:float-front 7s ease-in-out infinite;z-index:2}.back-case{left:4%;top:8%;transform:rotate(-13deg) rotateY(18deg);animation:float-back 8s ease-in-out infinite}.case-photo{display:block;position:absolute;inset:0;background-repeat:no-repeat;background-size:148% 123%;background-position:50% 52%;filter:brightness(1.14);border:2px solid #dfd1b46b;border-radius:12px}.case-photo.front{background-image:url('assets/front.jpg')}.case-photo.back{background-image:url('assets/back.jpg');background-size:147% 123%}.shine{position:absolute;inset:-100%;background:linear-gradient(110deg,transparent 40%,#fff4 49%,transparent 58%);animation:shine 8s ease-in-out infinite;pointer-events:none}.starburst{position:absolute;top:3%;right:2%;z-index:3;background:var(--yellow);color:#151521;width:113px;height:113px;clip-path:polygon(50% 0,61% 15%,79% 6%,80% 26%,100% 29%,89% 46%,100% 61%,80% 68%,80% 91%,60% 84%,49% 100%,38% 84%,19% 93%,18% 71%,0 65%,10% 49%,0 31%,20% 27%,20% 7%,39% 15%);font-size:12px;line-height:1.3;font-weight:900;display:grid;place-content:center;text-align:center;transform:rotate(13deg)}.art-caption{position:absolute;bottom:9%;left:22%;border-left:2px solid var(--yellow);padding-left:18px;display:flex;flex-direction:column;gap:7px}.tiny{font-size:8px;letter-spacing:2px;color:var(--yellow)}.art-caption strong{font-size:22px;font-family:'Barlow Condensed',Impact,sans-serif;text-transform:uppercase}.art-caption>span:last-child{font-size:10px;color:var(--muted)}.art-caption b{margin-left:25px;color:white}.scroll-cue{position:absolute;bottom:23px;left:5.5%;font-size:8px;letter-spacing:2px;color:var(--muted)}.scroll-cue span{margin-left:15px}.ticker{overflow:hidden;transform:rotate(-1.5deg) scale(1.01);background:var(--yellow);color:#0a0a13;border-top:1px solid #ffe034;border-bottom:1px solid #ffe034}.ticker>div{display:flex;align-items:center;gap:35px;width:max-content;white-space:nowrap;font:700 23px 'Barlow Condensed',Impact,sans-serif;letter-spacing:2px;padding:13px 0;animation:ticker 30s linear infinite}.ticker span{font-size:23px}.section{padding:110px 7%;max-width:1600px;margin:auto}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:40px}h2{font-size:clamp(46px,5vw,74px);line-height:.97;letter-spacing:-.5px;margin-top:19px}h2 span{color:var(--muted)}.section-head p,.spotlight-info p,.brothers p,.request p{font-size:14px;line-height:1.9;color:var(--muted)}.spotlight-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:7%;align-items:center}.gallery-stage{position:relative;background:#e1e2de;aspect-ratio:1.1;overflow:hidden}.gallery-stage>button{width:100%;height:100%;border:0;padding:0;background:none;display:block}.gallery-stage img{width:100%;height:100%;object-fit:contain;transition:transform .5s}.gallery-stage button:hover img{transform:scale(1.035)}.photo-label{position:absolute;top:20px;left:22px;z-index:1;font-size:9px;font-weight:700;letter-spacing:2px;color:#16161e;background:#fff9;padding:8px}.zoom{position:absolute;bottom:20px;right:20px;background:#090910;color:white;padding:12px 16px;font-size:11px}.pill{font-size:8px;letter-spacing:1.5px;color:var(--yellow);border:1px solid #ffe03455;padding:7px 10px;display:inline-block}h3{font-size:51px;line-height:1;margin:23px 0 18px}.view-buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:25px 0}.view-buttons button{background:transparent;border:1px solid var(--border);color:var(--muted);padding:15px 13px;font-size:10px;display:flex;justify-content:space-between;gap:12px}.view-buttons .active{border-color:var(--yellow);color:var(--yellow);background:#ffe03409}.spotlight-info small{font-size:10px;color:var(--muted)}.collection{background:#111119;max-width:none}.demo-note{font-size:11px;color:#b2b1bf;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:17px 0;margin-bottom:25px}.demo-note span{font-size:8px;color:var(--yellow);letter-spacing:1px;margin-right:20px}.filters{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:30px}.search{display:flex;align-items:center;gap:10px;border-bottom:1px solid #ffffff40;padding:8px 0;width:30%}.search span{font-size:24px}.search input{width:100%;background:transparent;border:0;color:white;font-size:12px;outline-offset:2px}.platforms{display:flex;gap:6px}.platforms button{font-size:11px;color:var(--muted);padding:10px 13px;border:1px solid transparent;background:transparent}.platforms .active{background:var(--white);color:var(--bg)}select{background:#191921;color:var(--white);border:1px solid var(--border);font-size:11px;padding:10px}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.product{min-width:0}.product-visual{height:300px;background:radial-gradient(ellipse at 50% 60%,var(--glow),#1a1a2411 68%),#171720;display:flex;align-items:center;justify-content:center;position:relative;width:100%;border:1px solid var(--border);overflow:hidden}.product-visual:after{content:'';position:absolute;inset:20px;border:1px solid #ffffff06}.mini-case{height:205px;width:145px;background:linear-gradient(135deg,#ffffff15,transparent),var(--case);border:1px solid #ffffff60;border-radius:7px;box-shadow:5px 4px 0 #55565e,15px 20px 20px #0006;transform:rotate(-8deg);transition:transform .35s;display:flex;flex-direction:column;justify-content:space-between;padding:14px;color:#fff;text-align:left;position:relative;overflow:hidden}.mini-case:after{content:'✦';position:absolute;font-size:120px;top:30px;left:22px;opacity:.22}.mini-case b{font:700 31px/.9 'Barlow Condensed',Impact,sans-serif;z-index:1}.mini-case small{font-size:7px;letter-spacing:2px;z-index:1}.product-visual:hover .mini-case{transform:rotate(0) translateY(-7px)}.placeholder-tag{position:absolute;top:12px;left:12px;font-size:7px;letter-spacing:1px;color:#b7b5c4}.card-arrow{position:absolute;bottom:12px;right:16px;font-size:19px;color:var(--yellow)}.product-meta{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);margin-top:18px}.product h3{font-size:24px;margin:9px 0}.product-bottom{display:flex;justify-content:space-between;align-items:center;font-size:11px}.condition{color:#a8c9b0}.result-count{color:var(--muted);font-size:10px;margin-top:25px}.empty{grid-column:1/-1;padding:55px;text-align:center;color:var(--muted)}.brothers{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}.brothers-image{position:relative;background:transparent;transform:rotate(-3deg);max-width:470px}.brothers-image img{display:block;width:100%}.image-sticker{position:absolute;bottom:15px;right:-18px;background:var(--yellow);color:#111;font-weight:800;font-size:11px;letter-spacing:1px;padding:13px;transform:rotate(6deg)}.brothers h2{margin-bottom:26px}.brothers p{max-width:470px}.brothers .text-link{display:inline-block;margin-top:15px}.request{position:relative;overflow:hidden;max-width:none;background:linear-gradient(115deg,#16167a,#171450 55%,#73172f);display:grid;grid-template-columns:1.2fr 1fr;gap:9%;border-top:1px solid #5555a3}.request h2 span{color:var(--yellow)}.request p{color:#cccde2}.request-copy,form{z-index:1}.request-decor{position:absolute;font:800 550px/.8 'Barlow Condensed',Impact,sans-serif;transform:rotate(15deg);color:#ffffff05;top:0;left:32%}.request-note{font-size:10px;color:#bbbbd6}form{display:flex;flex-direction:column;gap:10px}form label{font-size:12px;margin-top:10px}form label span{color:#a7a6c3}form input,form textarea{width:100%;background:#0a091c70;border:1px solid #ffffff30;padding:15px;color:white;font-size:12px;resize:vertical}form .button{margin-top:8px}form small{font-size:9px;line-height:1.8;color:#c0bfd4}#requestResult a{display:inline-block;color:var(--yellow);font-size:12px;margin-top:12px;text-decoration:underline}footer{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:45px 5.5%;flex-wrap:wrap}footer>span{font-size:8px;letter-spacing:1.5px;color:var(--muted)}footer>a:not(.brand){font-size:11px}footer small{width:100%;border-top:1px solid var(--border);padding-top:25px;font-size:9px;color:var(--muted)}dialog{background:#15151f;color:var(--white);border:1px solid #ffffff40;padding:40px;max-width:760px;width:90vw;max-height:90svh}dialog::backdrop{background:#030309dd;backdrop-filter:blur(8px)}.close{position:absolute;right:10px;top:6px;background:#111;color:white;border:1px solid #ffffff40;font-size:26px;z-index:3;width:32px;height:32px;line-height:1}#largePhoto{display:block;max-height:70svh;max-width:100%;margin:auto}.dialog-photo-nav{display:flex;align-items:center;justify-content:space-between;margin-top:15px;font-size:12px}.dialog-photo-nav button{background:none;border:1px solid var(--border);color:white;padding:8px 20px}#productDetails h3{font-size:40px}#productDetails p{font-size:13px;color:var(--muted);line-height:1.8}.detail-list{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:20px 0;margin-bottom:20px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);font-size:12px}.detail-list span{color:var(--muted)}.skip{position:fixed;left:10px;top:-100px;z-index:99;background:var(--yellow);color:#000;padding:12px}.skip:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@keyframes float-front{50%{transform:translateY(-17px) rotate(9deg) rotateY(-9deg)}}@keyframes float-back{50%{transform:translateY(12px) rotate(-10deg) rotateY(12deg)}}@keyframes shine{0%,25%{transform:translateX(-30%)}75%,100%{transform:translateX(30%)}}@keyframes turn{to{transform:rotate(360deg)}}@keyframes ticker{to{transform:translateX(-50%)}}
@media(min-width:1500px){.float-case{width:310px;height:423px}.hero-art{max-width:750px}.hero{padding-top:90px}}
@media(max-width:1100px){.hero{min-height:700px}.float-case{width:215px;height:293px}.front-case{left:33%;top:23%}.back-case{left:2%;top:12%}.starburst{right:-5%;top:4%;width:95px;height:95px;font-size:10px}.actions{gap:17px;flex-wrap:wrap}.art-caption{bottom:14%;left:10%}.products{gap:15px}.product-visual{height:250px}.mini-case{width:125px;height:175px}.filters{flex-wrap:wrap}.search{width:40%}.sort{margin-left:auto}.hero h1 em{font-size:50px}.section{padding:80px 6%}}
@media(max-width:760px){header{height:80px;padding:0 6%}.brand{font-size:10px}.brand-icon{font-size:26px!important}nav{gap:18px;font-size:11px}nav a:nth-child(2){display:none}.nav-cta{padding:9px 10px}.nav-cta span{display:none}.hero{display:flex;flex-direction:column;min-height:1050px;height:auto;max-height:none;padding:45px 7% 60px}.hero h1{font-size:100px;margin:27px 0 24px}.hero h1 em{font-size:60px}.hero p{font-size:13px}.eyebrow{font-size:8px;letter-spacing:1.8px}.hero-foot{margin-top:25px;font-size:7px}.hero-art{height:460px;flex-shrink:0;margin-top:35px}.float-case{width:185px;height:252px}.front-case{left:40%;top:14%}.back-case{left:8%;top:3%}.starburst{right:0;top:1%;width:82px;height:82px;font-size:9px}.orbit{width:390px;height:390px;left:0;top:0}.orbit-two{width:460px;height:460px;left:-30px;top:-30px}.art-caption{bottom:8%;left:16%}.art-type{font-size:100px}.scroll-cue{left:7%}.ticker>div{font-size:18px;padding:10px 0}.section{padding:65px 7%}.section-head{align-items:start;flex-direction:column;gap:15px;margin-bottom:28px}.section-head p{margin:0;font-size:12px}.spotlight-grid{grid-template-columns:1fr;gap:30px}.gallery-stage{aspect-ratio:1}.spotlight-info h3{font-size:42px}.products{grid-template-columns:1fr 1fr;gap:25px 14px}.product-visual{height:220px}.mini-case{height:156px;width:110px}.mini-case b{font-size:25px}.product h3{font-size:21px}.product-meta{font-size:8px}.product-bottom{font-size:10px}.demo-note{font-size:10px;line-height:1.8}.demo-note span{display:block}.filters{gap:15px}.search{width:100%}.platforms{gap:0;flex-wrap:wrap}.platforms button{padding:9px 10px;font-size:10px}.sort{margin-left:0}.brothers{grid-template-columns:1fr;gap:45px}.brothers-image{max-width:320px;width:90%;margin:auto}.request{grid-template-columns:1fr;gap:30px}.request h2{font-size:48px}.request p{font-size:12px}footer{padding:35px 7%;gap:25px}footer>span{order:3;width:100%;font-size:7px}footer small{order:4}dialog{padding:40px 20px 20px}.button{font-size:11px}.detail-list{font-size:11px}}@media(max-width:370px){.float-case{width:160px;height:219px}.hero h1{font-size:88px}.product-visual{height:190px}.mini-case{width:95px;height:140px}.platforms button{padding:8px}.brand{font-size:9px}nav{gap:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}


/* Category navigation: one panel at a time. */
[hidden]{display:none!important}
header{position:sticky;top:0;backdrop-filter:blur(16px)}
.site-tabs{gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}
.site-tabs a{display:block;flex-shrink:0;padding:15px 16px;border-bottom:2px solid transparent;color:var(--muted);white-space:nowrap}
.site-tabs a[aria-selected="true"]{color:var(--yellow);border-bottom-color:var(--yellow);background:#ffe03409}
main{min-height:calc(100svh - 100px)}
@media(max-width:900px){header{height:auto;min-height:100px;flex-wrap:wrap;padding-top:14px;gap:10px}.site-tabs{width:100%;order:2}.site-tabs a{padding:13px 15px}.site-tabs a:nth-child(2){display:block}}
@media(max-width:760px){header{padding:12px 6% 0;min-height:110px}.site-tabs{gap:0;font-size:11px}.site-tabs a{padding:13px 12px}main{min-height:calc(100svh - 110px)}}

/* Use the supplied Steelbookbrothers artwork as the brand mark. */
.brand-logo{display:block;width:96px;height:90px;object-fit:contain}
footer .brand-logo{width:120px;height:120px}
@media(max-width:900px){header .brand-logo{width:84px;height:78px}}

/* Illustrative case proportions for the four Steelbook formats. */
.product-visual{--case-unit:145px}
.mini-case{width:var(--case-unit);height:calc(var(--case-unit)*1.42)}
.mini-case.case-g2{height:calc(var(--case-unit)*1.26)}
.mini-case.case-g3{width:calc(var(--case-unit)*.94);height:calc(var(--case-unit)*.94)}
.mini-case.case-g4{width:calc(var(--case-unit)*.70);height:calc(var(--case-unit)*1.19);padding:10px}
.case-g4 b{font-size:22px}
.case-g4 small{font-size:6px;letter-spacing:.5px}
@media(max-width:1100px){.product-visual{--case-unit:125px}.case-g4 b{font-size:19px}}
@media(max-width:760px){.product-visual{--case-unit:110px}.mini-case{padding:10px}.case-g3 b{font-size:22px}.case-g4 b{font-size:16px}.mini-case small{font-size:5px;letter-spacing:.6px}.product-meta{flex-wrap:wrap;gap:5px}}
@media(max-width:370px){.product-visual{--case-unit:95px}.case-g3 b{font-size:19px}.case-g4 b{font-size:14px}.case-g4{padding:8px}}

/* A restrained dark edge replaces the grey block around collection cases. */
.mini-case{box-shadow:2px 2px 0 #252630,8px 12px 20px #0007}

.legal-disclaimer{width:100%;border-top:1px solid var(--border);padding-top:24px;color:#b9b8c5}
.legal-disclaimer h2{font-family:Arial,sans-serif;font-size:13px;line-height:1.6;font-weight:700;letter-spacing:.3px;color:var(--white);text-transform:none;margin:0 0 12px}
.legal-disclaimer p{font-size:12px;line-height:1.8;margin:8px 0;max-width:1100px}
.legal-disclaimer a{color:var(--yellow);text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.legal-disclaimer{order:4}footer small{order:5}}

.footer-motto{max-width:560px;text-align:center;font-size:12px;line-height:1.8;letter-spacing:1px;text-transform:uppercase}
.footer-motto p{margin:0 0 10px}
.footer-motto p:last-child{margin-bottom:0}
.footer-motto .motto-brand,.footer-motto strong{color:var(--yellow)}
.footer-motto .motto-brand{font-weight:800;font-size:15px}
@media(max-width:760px){.footer-motto{order:3;width:100%;max-width:none;font-size:11px}}

/* Keep the playful angle consistent; hover only lifts the case. */
.product-visual .mini-case{transform:rotate(-8deg)}
.product-visual:hover .mini-case{transform:translateY(-7px) rotate(-8deg)}

.brothers p .text-link{display:inline;margin-top:0;padding-bottom:0;border-bottom:0;font-size:inherit;line-height:inherit;text-decoration:underline;text-underline-offset:4px}

.inquiry-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);pointer-events:none}#requestForm button:disabled{opacity:.65;cursor:wait}#requestResult{font-size:14px;line-height:1.6;overflow-wrap:anywhere}.brothers a[href^="mailto:"]{overflow-wrap:anywhere}

.inquiry-success{max-width:520px;width:calc(100% - 32px);padding:32px;border:1px solid #ffe03460;border-radius:14px;background:#111119;color:#f4f2eb}.inquiry-success::backdrop{background:#000b;backdrop-filter:none}.inquiry-success h2{font-size:42px;line-height:1.05;margin:20px 0}.inquiry-success p{font-size:16px;line-height:1.7;color:#b5b6c9}.inquiry-success .button{margin-top:12px;min-height:48px;width:100%}@media(max-width:760px){.inquiry-success{padding:24px}.inquiry-success h2{font-size:36px}}