/* Reelwright — a production studio, not a template: paper, ink, one red, a serif for headlines. */
:root{
  --ink:#141414;--ink2:#3b3935;--muted:#716c64;--line:#dcd7cd;--soft:#efebe3;--paper:#f7f5f0;--white:#fffefb;
  --night:#111110;--night2:#1c1b19;
  --accent:#d5402b;--accent-dark:#b8331f;--ok:#2f6f3e;
  --r:2px;--max:1320px;--pad:clamp(16px,3.2vw,40px);
  --sans:"Helvetica Neue",Helvetica,Arial,system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:Newsreader,"Iowan Old Style","Palatino Linotype",Georgia,serif;
  --grad:var(--accent);--font:var(--sans);--display:var(--serif);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
img,video{display:block;max-width:100%}
h1,h2,h3,h4{margin:0;font-family:var(--serif);font-weight:400;line-height:1.1;letter-spacing:-.01em}
h2{font-size:24px}
p{margin:0 0 .9em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.narrow-wrap{max-width:720px}
.narrow-wrap.flush{padding:0;margin:0}
.muted{color:var(--muted)}
.small{font-size:13px}
.center{text-align:center}
section{margin:88px 0}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:22px;padding-top:14px;border-top:1px solid var(--ink)}
.sec-head a{color:var(--ink2);font-size:14px;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.h-xl{font-size:clamp(28px,3.2vw,42px)}
section>.h-xl{padding-top:14px;border-top:1px solid var(--ink);margin-bottom:28px}
.sec-head .h-xl{border:0;padding:0;margin:0}
.ic{width:17px;height:17px;flex:none}

/* buttons: square, flat */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border:1px solid var(--ink);border-radius:var(--r);
  background:var(--ink);color:#fff;font:500 14px/1.2 var(--sans);cursor:pointer;text-decoration:none!important;transition:background .15s,color .15s}
.btn:hover{background:#000}
.btn-lg{padding:14px 22px;font-size:15px}
.btn-sm{padding:8px 14px;font-size:13px}
.btn-accent,.btn-grad,.btn-primary,.top .btn-sm{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-accent:hover,.btn-grad:hover,.btn-primary:hover,.top .btn-sm:hover{background:var(--accent-dark);border-color:var(--accent-dark)}
.btn-quiet{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-quiet:hover{background:var(--ink);color:#fff}
.btn-light{background:#fff;color:var(--ink);border-color:#fff}
.btn-light:hover{background:var(--paper)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn-ghost:hover{background:#fff;color:var(--ink)}
.btn-block{display:flex;width:100%}
.btn[disabled]{opacity:.5;cursor:default}

/* header / footer */
.top{background:var(--night);position:sticky;top:0;z-index:20;color:#fff}
.top-in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);height:60px;display:flex;align-items:center;gap:28px}
.logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-size:23px;letter-spacing:-.01em;line-height:1}
.logo:hover{text-decoration:none}
.logo .mark{width:24px;height:24px;flex:none}
.logo .word i{font-style:normal}
.hsearch{flex:1;max-width:300px}
.hsearch input{width:100%;padding:7px 0;border:0;border-bottom:1px solid rgba(255,255,255,.25);border-radius:0;font:14px var(--sans);
  background:transparent;color:#fff}
.hsearch input::placeholder{color:rgba(255,255,255,.45)}
.hsearch input:focus{outline:none;border-color:#fff}
.topnav{display:flex;gap:26px;margin-left:auto;font-size:14px;color:rgba(255,255,255,.8)}
.topnav a:hover{color:#fff}
.top-login{font-size:14px;color:rgba(255,255,255,.8);white-space:nowrap}
.top-login:hover{color:#fff}
.foot{background:var(--night);color:rgba(255,255,255,.62);margin-top:110px}
.foot-in{max-width:var(--max);margin:0 auto;padding:60px var(--pad) 36px;display:grid;grid-template-columns:2fr 1.3fr 1.3fr 1fr;gap:36px;font-size:14px}
.foot .logo{color:#fff;margin-bottom:16px}
.foot-brand p{max-width:330px;line-height:1.6}
.foot nav{display:flex;flex-direction:column;gap:8px}
.foot nav b{color:#fff;font-weight:500;margin-bottom:6px}
.foot nav a:hover{color:#fff}
.foot-legal{max-width:var(--max);margin:0 auto;padding:18px var(--pad) 28px;border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:rgba(255,255,255,.4)}

/* hero: headline + a strip of real work */
.hero{margin:0;background:var(--night);color:#fff;padding-bottom:2px}
.hero-in{max-width:var(--max);margin:0 auto;padding:72px var(--pad) 48px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  gap:56px;align-items:end}
.hero h1{font-size:clamp(42px,6.2vw,92px);line-height:.98;letter-spacing:-.025em}
.hero h1 em{font-style:normal;color:rgba(255,255,255,.5)}
.lead{font-size:17px;color:rgba(255,255,255,.72);margin-bottom:24px;max-width:460px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.hero-note{font-size:13px;color:rgba(255,255,255,.45);margin:0}
.facts-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
.facts-row li{padding:16px 18px 18px 0;font-size:13px;color:rgba(255,255,255,.55)}
.facts-row b{display:block;font-family:var(--serif);font-weight:400;font-size:26px;color:#fff;line-height:1.1;margin-bottom:2px}
.strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px}
.reel{display:block;position:relative;color:#fff;background:var(--night2)}
.reel:hover{text-decoration:none}
.reel-v{display:block;aspect-ratio:9/14;overflow:hidden}
.reel video{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.reel:hover video{transform:scale(1.03)}
.reel-cap{display:flex;justify-content:space-between;gap:10px;padding:10px 12px 12px;font-size:12px;color:rgba(255,255,255,.7)}
.reel-cap span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reel:hover .reel-cap{color:#fff}

/* brands */
.brands{padding:30px 0;border-bottom:1px solid var(--line)}
.brands-in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);display:flex;align-items:baseline;gap:18px 40px;flex-wrap:wrap}
.brands-label{font-size:13px;color:var(--muted);flex:0 0 auto}
.brands-list{display:flex;flex-wrap:wrap;gap:12px 36px;align-items:baseline}
.brands-list span{font-family:var(--serif);font-size:22px;color:var(--ink2);letter-spacing:-.01em;white-space:nowrap}

/* section intros */
.eyebrow-dark{font-size:14px;color:var(--muted);margin:0 0 10px}
.lead-muted{font-size:18px;color:var(--ink2);max-width:700px;margin:0}
.page-head{margin:28px 0 8px}
.page-title{font-size:clamp(34px,4.4vw,60px);line-height:1.02;letter-spacing:-.02em;margin-bottom:14px}
.page-foot{margin-top:40px}

/* categories: text tabs */
.cats{display:flex;gap:24px;overflow-x:auto;scrollbar-width:none;white-space:nowrap;font-size:14px;margin:40px 0 32px;
  border-bottom:1px solid var(--line)}
.cats::-webkit-scrollbar{display:none}
.cats a{padding:10px 0;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.cats a:hover{color:var(--ink);text-decoration:none}
.cats a.on{color:var(--ink);border-bottom-color:var(--ink)}

/* cards */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 20px}
.gig{display:block;color:var(--ink)}
.gig:hover{text-decoration:none}
.thumb{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--night2);margin-bottom:12px}
.thumb img,.thumb video,.noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb .fg{transition:transform .5s}
.gig:hover .thumb .fg{transform:scale(1.03)}
.thumb.wide .bg{filter:blur(24px) brightness(.5);transform:scale(1.25)}
.thumb.wide .fg,.thumb.wide video{object-fit:contain}
.gig:hover .thumb.wide .fg{transform:none}
.thumb video{opacity:0;transition:opacity .2s;z-index:2}
.thumb.playing video{opacity:1}
.badges{position:absolute;left:0;bottom:0;display:flex;z-index:3}
.badges span{font-size:11px;font-weight:500;color:#fff;background:rgba(17,17,16,.78);padding:3px 7px}
.play{display:none}
.gig-title{font-size:15px;font-weight:500;margin:0 0 4px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.gig:hover .gig-title{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.gig-meta{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;color:var(--muted);margin:0}
.gig-meta span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gig-price{white-space:nowrap;color:var(--ink)}
.pager{display:flex;flex-wrap:wrap;gap:4px;margin-top:48px}
.pager a{min-width:40px;padding:8px 12px;text-align:center;border:1px solid var(--line)}
.pager a[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}
.empty{padding:40px 0;color:var(--ink2);border-top:1px solid var(--line)}
.empty .btn{margin-top:8px}

/* home sections */
.band{margin:88px 0}
.how{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.how li{display:flex;flex-direction:column;gap:6px}
.how-n{font-family:var(--serif);font-size:44px;line-height:1;color:var(--accent);margin-bottom:10px}
.how b{font-weight:500;font-size:16px}
.how span:not(.how-n){color:var(--ink2);font-size:14px}
.why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.why div{border-top:1px solid var(--line);padding-top:16px}
.why b{display:block;font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.15;margin-bottom:8px}
.why p{color:var(--ink2);font-size:14px;margin:0}
.faq{max-width:880px;border-bottom:1px solid var(--line)}
.faq details{border-top:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 36px 18px 0;font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font:300 24px/1 var(--sans);color:var(--muted)}
.faq details[open] summary::after{content:"−"}
.faq p{color:var(--ink2);padding-bottom:10px;max-width:760px}
.cta{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;background:var(--night);color:#fff;
  padding:52px clamp(24px,4vw,64px)}
.cta h2{font-size:clamp(28px,3vw,42px);margin-bottom:8px}
.cta p{margin:0;color:rgba(255,255,255,.7);max-width:620px}
.cta .btn-light{background:var(--accent);border-color:var(--accent);color:#fff}
.cta .btn-light:hover{background:var(--accent-dark)}

/* services: a menu, not cards */
.svcs{border-bottom:1px solid var(--line)}
.svc{display:grid;grid-template-columns:48px minmax(0,1.1fr) minmax(0,1.4fr) 130px;gap:24px;align-items:baseline;
  padding:20px 0;border-top:1px solid var(--line);color:var(--ink)}
.svc:hover{text-decoration:none;background:var(--soft)}
.svc-n{font-size:13px;color:var(--muted);padding-left:4px}
.svc b{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.15}
.svc p{color:var(--ink2);font-size:15px;margin:0}
.svc-price{text-align:right;font-size:15px;padding-right:6px}
.svc:hover b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.type-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px;border-bottom:1px solid var(--line)}
.type-links a{display:flex;justify-content:space-between;gap:10px;padding:13px 0;border-top:1px solid var(--line);font-size:16px}
.type-links span{font-size:13px;color:var(--muted)}
.ind-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px}
.ind-cols div{display:flex;flex-direction:column;gap:6px;font-size:14px}
.ind-cols b{font-weight:500;margin-bottom:4px}
.ind-cols a{color:var(--ink2)}

/* lists */
.crumbs{font-size:13px;color:var(--muted);padding:22px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.crumbs i{font-style:normal;opacity:.5}
.crumbs a{color:var(--muted)}
.dir{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 28px;margin-top:36px}
.dir-col{border-top:1px solid var(--ink);padding-top:14px}
.dir h2{font-size:20px;margin-bottom:12px}
.dir ul{list-style:none;margin:0;padding:0}
.dir li{padding:5px 0;font-size:14px;display:flex;justify-content:space-between;gap:8px}
.dir a{color:var(--ink2)}
.count{font-size:12px;color:var(--muted)}
.ind-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.ind-ctas{display:flex;gap:10px;flex-wrap:wrap}
.ind-about{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin:40px 0 8px;padding-top:24px;border-top:1px solid var(--line)}
.ind-about h2{margin-bottom:12px}
.ind-about p{color:var(--ink2);font-size:16px}
.sample-note{margin:0 0 18px}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ticks li{display:flex;gap:10px;align-items:flex-start;color:var(--ink2)}
.ticks .ic{color:var(--ok);margin-top:3px}

/* video page */
.vp{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:44px;align-items:start;margin-top:18px}
.vp-media .player{--ar:16 / 9;position:relative;width:100%;aspect-ratio:var(--ar);background:#000;overflow:hidden}
.vp.tall .vp-media{background:var(--night);padding:28px 0}
.vp.tall .player{max-width:min(100%,calc(78vh * 9 / 16));margin:0 auto}
.player video,.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain;background:#000}
.vp-side{position:sticky;top:84px}
.chips{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:12px;font-size:13px;color:var(--muted)}
.chip+.chip::before{content:"·";margin-right:14px;margin-left:-8px}
.vp-side h1{font-size:clamp(26px,2.4vw,34px);margin-bottom:12px}
.vp-by{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-size:14px;color:var(--ink2)}
.vp-by b{font-weight:500}
.ava{--h:20;width:30px;height:30px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center;
  font:500 11px/1 var(--sans);color:#fff;background:hsl(var(--h) 25% 38%);overflow:hidden}
.ava img{width:100%;height:100%;object-fit:cover}
.offer{background:var(--white);border:1px solid var(--ink);padding:22px}
.offer-top{display:flex;justify-content:space-between;align-items:baseline}
.offer-label{font-size:13px;color:var(--muted)}
.offer-price{font-family:var(--serif);font-size:40px;line-height:1;letter-spacing:-.02em}
.offer-name{font-weight:500;margin:6px 0 12px}
.offer-facts{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--ink2);padding:10px 0;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);margin-bottom:14px}
.offer-facts span{display:inline-flex;align-items:center;gap:6px}
.offer-items{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px;font-size:14px;color:var(--ink2)}
.offer-items li{display:flex;gap:9px;align-items:flex-start}
.offer-items .ic{color:var(--ok);width:16px;height:16px;margin-top:3px}
.offer .btn{background:var(--accent);border-color:var(--accent)}
.offer .btn:hover{background:var(--accent-dark)}
.offer-ask{display:block;text-align:center;font-size:14px;color:var(--ink2);margin-top:12px;text-decoration:underline;text-underline-offset:3px}
.offer-note{display:flex;gap:8px;align-items:center;justify-content:center;font-size:12px;color:var(--muted);margin:14px 0 0}
.offer-note .ic{width:14px;height:14px}
.vp-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;margin-top:52px;align-items:start}
.vp-text{max-width:760px;color:var(--ink2);font-size:16px}
.vp-text h2{color:var(--ink);font-size:26px;margin:36px 0 12px}
.vp-text h2:first-child{margin-top:0}
.vp-text .faq summary{font-size:16px;color:var(--ink)}
.vp-text .faq p{font-size:15px}
.facts{margin:0;border-top:1px solid var(--ink)}
.facts div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.facts dt{color:var(--muted)}
.facts dd{margin:0;text-align:right}
.facts a{text-decoration:underline;text-underline-offset:3px}
.side-plan{margin-top:24px;background:var(--night);color:#fff;padding:22px}
.side-plan b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.15}
.side-plan p{color:rgba(255,255,255,.68);font-size:14px;margin:8px 0 16px}

/* service & about pages */
.svc-hero{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;align-items:start;margin-top:28px}
.svc-hero .lead-muted{margin-top:6px}
.svc-offer .offer-price{font-size:32px}
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;margin-top:28px}
.about-stats{list-style:none;padding:0;margin:0;display:grid;gap:0;font-size:14px;color:var(--muted);border-top:1px solid var(--ink)}
.about-stats li{padding:16px 0;border-bottom:1px solid var(--line)}
.about-stats b{display:block;font-family:var(--serif);font-weight:400;font-size:40px;line-height:1;color:var(--ink);margin-bottom:4px}

/* forms */
.form-card{background:var(--white);border:1px solid var(--line);padding:clamp(22px,4vw,44px);margin-top:28px}
.form-alt{font-size:14px;color:var(--ink2);margin:14px 0 0}
.form-alt a{text-decoration:underline;text-underline-offset:3px}
.co-summary{margin:20px 0 4px}
.co-video{display:flex;gap:14px;align-items:center;margin-bottom:12px;padding:12px;border:1px solid var(--line)}
.co-video:hover{text-decoration:none;border-color:var(--ink)}
.co-video img{width:60px;height:76px;object-fit:cover;flex:none;background:var(--night2)}
.co-video b{display:block;font-size:15px;font-weight:500}
.co-video .muted{font-size:13px}
.co-offer{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 14px;background:var(--soft);font-size:14px}
.co-offer b{font-family:var(--serif);font-weight:400;font-size:26px}
.order-form{margin-top:24px}
.order-form label,.app label{display:block;margin-bottom:16px;font-size:13px;color:var(--ink2)}
.order-form input,.order-form textarea,.order-form select,.app input,.app textarea,.app select{display:block;width:100%;margin-top:6px;
  padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);font:15px var(--sans);color:var(--ink);background:#fff}
.order-form input:focus,.order-form textarea:focus,.order-form select:focus,.app input:focus,.app textarea:focus{outline:none;border-color:var(--ink)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opt{margin:4px 0 16px}
.opt summary{cursor:pointer;font-size:14px;color:var(--ink2);padding:6px 0 12px;list-style:none;text-decoration:underline;text-underline-offset:3px}
.opt summary::-webkit-details-marker{display:none}
.order-form .btn{margin:6px 0 12px;background:var(--accent);border-color:var(--accent)}
.order-form .btn:hover{background:var(--accent-dark)}
.form-error{color:#b42318;font-size:14px}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
[hidden]{display:none!important}
.narrow-wrap h2{margin:40px 0 10px}
.narrow-wrap p{color:var(--ink2)}

/* order pages, accounts, admin (served by the API) */
.app{max-width:var(--max);margin:0 auto;padding:24px var(--pad) 64px}
.app section{margin:0}
.app h1{font-size:34px}
.app .narrow{max-width:420px;margin:48px auto}
.role-pick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.role-pick label{display:flex;gap:8px;align-items:flex-start;border:1px solid var(--line);padding:12px;margin:0;cursor:pointer;color:var(--ink)}
.role-pick label:has(input:checked){border-color:var(--ink)}
.role-pick input{width:auto;margin:3px 0 0}
.role-pick small{display:block;color:var(--muted);font-size:12px}
.acct-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:8px 0 24px}
.card{background:var(--white);border:1px solid var(--line);padding:22px}
.card h2{font-size:22px;margin-bottom:12px}
.order-wrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start;margin-top:16px}
.order-main{display:grid;gap:16px}
.order-side{position:sticky;top:84px}
.crumb{margin:0;font-size:13px}
.steps-line{list-style:none;padding:0;margin:14px 0 4px;display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.steps-line li{font-size:12px;color:var(--muted);border-top:2px solid var(--line);padding-top:7px}
.steps-line li.done{border-color:var(--ink);color:var(--ink2)}
.steps-line li.now{border-color:var(--accent);color:var(--ink);font-weight:500}
.quote-amount{font-family:var(--serif);font-size:38px;margin-bottom:6px}
.thread{display:grid;gap:10px;margin-bottom:14px}
.msg{padding:11px 14px;background:var(--soft);font-size:14px}
.msg-client{background:#e9edf2}
.msg-serialform{background:#f6e7e3}
.msg-system{background:none;color:var(--muted);font-size:13px;padding:2px 0}
.msg-meta{font-size:12px;color:var(--muted);margin-bottom:2px}
.msg-body a{text-decoration:underline}
.reply,.inline-form{display:grid;gap:8px}
.reply .btn,.inline-form .btn{justify-self:start}
.inline-form{margin-top:12px}
.inline{display:inline}
.files{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:6px}
.files a{text-decoration:underline}
.kv{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:12px}
.kv th,.kv td{text-align:left;padding:7px 0;border-bottom:1px solid var(--line);vertical-align:top}
.kv th{color:var(--muted);font-weight:400;width:42%}
.kv a{text-decoration:underline}
.pill{display:inline-block;font-size:12px;border:1px solid var(--line);padding:2px 8px;vertical-align:middle}
.pill-muted{color:var(--muted)}
.table{width:100%;border-collapse:collapse;font-size:13px;background:var(--white)}
.table th,.table td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line)}
.table a{text-decoration:underline}
.tabs{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0 16px;font-size:13px;color:var(--muted)}
.tabs a.on{color:var(--ink);font-weight:500}

@media (max-width:1100px){
  .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dir,.why,.ind-cols,.how{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vp-body,.svc-hero,.about-grid{grid-template-columns:minmax(0,1fr)}
  .strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .type-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .svc{grid-template-columns:40px minmax(0,1fr) 110px}
  .svc p{grid-column:2 / 4}
}
@media (max-width:860px){
  .topnav{display:none}
  .hero-in{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:44px;padding-bottom:36px}
  .facts-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 14px}
  .vp,.order-wrap{grid-template-columns:minmax(0,1fr)}
  .vp-side,.order-side{position:static}
  .foot-in{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1 / -1}
  .ind-about{grid-template-columns:1fr;gap:24px}
}
@media (max-width:560px){
  .top-in{gap:12px;height:56px}
  .logo{font-size:21px}
  .logo .mark{width:22px;height:22px}
  .hsearch{display:none}
  .top-login{margin-left:auto}
  .hero h1{font-size:44px}
  .strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .strip::-webkit-scrollbar{display:none}
  .reel{flex:0 0 44%;scroll-snap-align:start}
  .hero-ctas .btn{flex:1}
  .brands-list span{font-size:18px}
  .grid{gap:28px 12px}
  .gig-title{font-size:14px}
  .gig-meta{flex-direction:column;align-items:flex-start;gap:2px}
  .vp-media{margin:0 calc(var(--pad) * -1)}
  .vp.tall .player{width:min(100%,calc(70vh * 9 / 16))}
  .field-row,.role-pick{grid-template-columns:1fr}
  .dir,.why,.how,.ind-cols,.type-links{grid-template-columns:1fr}
  .svc{grid-template-columns:32px minmax(0,1fr);gap:6px 12px}
  .svc p,.svc-price{grid-column:2}
  .svc-price{text-align:left}
  .steps-line{grid-template-columns:repeat(3,1fr)}
  section,.band{margin:60px 0}
  .cta{padding:36px 22px}
  .foot-in{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.wrap-hero{max-width:var(--max);margin:0 auto;padding:0 var(--pad) 28px}
.brands{margin:0!important}
/* hero background showreel, darkened so the headline stays readable */
.hero-top{position:relative;overflow:hidden;background:var(--night) center/cover no-repeat}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(17,17,16,.86) 0%,rgba(17,17,16,.62) 55%,rgba(17,17,16,.72) 100%),
             linear-gradient(180deg,rgba(17,17,16,.35) 0%,rgba(17,17,16,0) 30%,rgba(17,17,16,.75) 88%,#111110 100%)}
.hero-top .hero-in,.hero-top .wrap-hero{position:relative;z-index:2}
.hero h1{text-shadow:0 1px 24px rgba(0,0,0,.35)}
@media (max-width:860px){.hero-shade{background:linear-gradient(180deg,rgba(17,17,16,.7) 0%,rgba(17,17,16,.78) 60%,#111110 100%)}}

/* ================= editorial layout (v3) ================= */
h1,h2,.sx-title,.page-title{text-wrap:balance}
p,.lead,.lead-muted{text-wrap:pretty}
.offer-price,.svc-price,.gig-price,.facts-row b,.reel-cap,.how-n{font-variant-numeric:tabular-nums lining-nums}

/* hero: headline across the page, text block under it on the right */
.hero-in{display:block;padding:88px var(--pad) 40px}
.hero h1{font-size:clamp(48px,7.6vw,124px);line-height:.94;letter-spacing:-.035em;max-width:15ch;margin-bottom:56px}
.hero-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px;align-items:end}
.hero-kicker{font-size:13px;line-height:1.5;color:rgba(255,255,255,.5);margin:0;text-transform:uppercase;letter-spacing:.08em}
.hero-side{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 40px;align-items:end;border-top:1px solid rgba(255,255,255,.18);padding-top:20px}
.hero-side .lead{margin:0;max-width:44ch}
.hero-side .hero-ctas{margin:0;flex-wrap:nowrap}
.facts-row{border-top:0}
.facts-row li{border-left:1px solid rgba(255,255,255,.14);padding:4px 20px 6px}
.facts-row li:first-child{border-left:0;padding-left:0}
.wrap-hero{padding-bottom:40px}

/* numbered sections: label column + content column */
.sx{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:24px;margin:120px 0 0;border-top:1px solid var(--ink);padding-top:18px}
.sx-head{display:contents}
.sx-label{grid-column:1;grid-row:1;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-top:12px}
.sx-title{grid-column:2;grid-row:1;font-size:clamp(32px,3.6vw,54px);line-height:1.02;letter-spacing:-.025em;max-width:20ch;margin:0 0 40px}
.sx-link{grid-column:2;grid-row:1;justify-self:end;align-self:start;padding-top:14px;font-size:14px}
.sx-link a{text-decoration:underline;text-underline-offset:3px}
.sx-title+.sx-link,.sx-head .sx-link{position:relative}
.sx-body{grid-column:2;min-width:0}
.sx-wide .sx-body{grid-column:1 / -1}
.sx-more{margin:40px 0 0;text-align:center}
.sx .cats{margin-top:0}
.sx .svcs{border-bottom:1px solid var(--line)}
.sx .svc{grid-template-columns:44px minmax(0,1fr) minmax(0,1.2fr) 110px}
.sx .type-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.sx .why{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 40px}
.sx .why b{font-size:26px}
.sx .why p{font-size:15px;max-width:40ch}
.sx .ind-cols{grid-template-columns:repeat(3,minmax(0,1fr))}
.sx-faq .faq{max-width:none}
.sx-faq .faq summary{font-family:var(--serif);font-size:22px;padding:20px 40px 20px 0}
.sx-faq .faq summary::after{top:18px}

/* process: numbers on one rule */
.how{position:relative;gap:40px}
.how::before{content:"";position:absolute;left:0;right:0;top:26px;border-top:1px solid var(--line)}
.how-n{position:relative;display:inline-block;align-self:flex-start;background:var(--paper);padding-right:14px;font-size:52px;margin-bottom:18px}
.how b{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.15}
.how span:not(.how-n){font-size:15px;max-width:30ch}

/* finale: one big sentence */
.finale{background:var(--night);color:#fff;margin:140px 0 0}
.finale-in{max-width:var(--max);margin:0 auto;padding:100px var(--pad) 110px}
.finale .sx-label{display:block;color:rgba(255,255,255,.45);padding:0;margin:0 0 28px}
.finale h2{font-size:clamp(44px,6.4vw,104px);line-height:.98;letter-spacing:-.035em;max-width:16ch;margin-bottom:64px}
.finale h2 span{color:rgba(255,255,255,.45)}
.finale-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px;align-items:end;border-top:1px solid rgba(255,255,255,.18);padding-top:22px}
.finale-row p{margin:0;color:rgba(255,255,255,.7);font-size:17px;max-width:44ch}
.finale-row .hero-ctas{margin:0;justify-self:end}
body:has(.finale) .foot{margin-top:0;border-top:1px solid rgba(255,255,255,.1)}

/* footer wordmark */
.foot-mark{max-width:var(--max);margin:0 auto;padding:10px var(--pad) 0;font-family:var(--serif);font-size:clamp(72px,16.5vw,250px);
  line-height:.78;letter-spacing:-.045em;color:rgba(255,255,255,.92);white-space:nowrap;overflow:hidden}

/* other pages: a bit more air and the same voice */
.sec-head h2{font-size:clamp(26px,2.6vw,36px)}
.vp-text{line-height:1.7}
.vp-text p{max-width:66ch}
.page-title{letter-spacing:-.03em}

@media (max-width:1100px){
  .sx{grid-template-columns:minmax(0,1fr)}
  .sx-label,.sx-title,.sx-link,.sx-body,.sx-wide .sx-body{grid-column:1}
  .sx-label{grid-row:auto;padding:0;margin-bottom:12px}
  .sx-title{grid-row:auto;margin-bottom:28px}
  .sx-link{grid-row:auto;justify-self:start;padding:0;margin:-12px 0 24px}
  .hero-row,.finale-row{grid-template-columns:minmax(0,1fr)}
  .hero-kicker{display:none}
  .finale-row .hero-ctas{justify-self:start}
  .sx .ind-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .hero-side{grid-template-columns:minmax(0,1fr)}
  .hero-side .hero-ctas{flex-wrap:wrap}
  .facts-row li{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.14);padding-top:12px}
  .how::before{display:none}
  .sx{margin-top:80px}
}
@media (max-width:560px){
  .hero-in{padding-top:48px}
  .hero h1{font-size:46px;margin-bottom:32px}
  .sx .svc{grid-template-columns:32px minmax(0,1fr)}
  .sx .type-links,.sx .why,.sx .ind-cols{grid-template-columns:1fr}
  .sx-faq .faq summary{font-size:19px}
  .finale-in{padding:64px var(--pad) 72px}
  .finale h2{font-size:42px;margin-bottom:36px}
  .foot-mark{font-size:22vw}
}
/* v3 fixes */
.hero-side{grid-template-columns:minmax(0,1fr);gap:22px}
.hero-side .lead{max-width:54ch;font-size:18px}
.sx .svc{grid-template-columns:40px minmax(0,1.35fr) minmax(0,1fr) 100px}
.sx .svc b{font-size:23px}
.sx .svc{grid-template-columns:40px minmax(0,1.35fr) minmax(0,1fr) 120px}.svc-price{white-space:nowrap}
@media (max-width:1100px){.hero-row{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){.how{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.how-n{font-size:34px;margin-bottom:8px}.how b{font-size:20px}}
@media (max-width:560px){.how span:not(.how-n){font-size:14px}}

/* ================= inner pages (v3) ================= */
.ph{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:24px;margin:44px 0 0;padding-bottom:12px}
.ph-left{padding-top:14px}
.ph-left .sx-label{padding:0}
.ph-meta{margin:16px 0 0;font-size:14px;line-height:1.7;color:var(--ink2)}
.ph .page-title{font-size:clamp(40px,5.6vw,88px);line-height:.98;letter-spacing:-.035em;max-width:17ch;margin-bottom:22px}
.ph .lead-muted{font-size:19px;max-width:56ch}
.ph-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.split{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:48px;align-items:start}
.prose{font-size:18px;line-height:1.65;color:var(--ink2);max-width:62ch;margin:0 0 1em}
.prose a{text-decoration:underline;text-underline-offset:3px}
.sx-more-l{margin:28px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.split .facts{margin-top:4px}
.split .side-plan{margin-top:20px}
.split .offer{margin-top:4px}
.list-body{margin-top:24px}
.facts-light{margin:48px 0 0;border-top:1px solid var(--ink)}
.facts-light li{color:var(--muted);border-left-color:var(--line);padding-top:16px}
.facts-light b{color:var(--ink)}
.finale-sm{margin:120px 0 0}
.wrap .finale-sm .finale-in{padding:64px clamp(24px,4vw,64px) 68px}
.finale-sm h2{font-size:clamp(34px,4.2vw,64px);margin-bottom:40px}
.vp{margin-bottom:8px}
.vp-side h1{font-size:clamp(28px,2.6vw,40px);line-height:1.05;letter-spacing:-.02em}
@media (max-width:1100px){
  .ph{grid-template-columns:minmax(0,1fr)}
  .ph-left{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;padding:0;margin-bottom:16px}
  .ph-meta{margin:0}
  .ph-meta span{display:inline}
  .ph-meta span+span::before{content:"·";margin:0 8px;color:var(--muted)}
  .split{grid-template-columns:minmax(0,1fr);gap:28px}
}
@media (max-width:560px){
  .ph{margin-top:28px}
  .ph .page-title{font-size:40px}
  .ph .lead-muted,.prose{font-size:17px}
  .ph-ctas .btn{flex:1}
  .finale-sm h2{font-size:32px}
  .facts-light{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.ph-meta span{display:block}
@media (max-width:1100px){.ph-meta span{display:inline}}

/* ================= home hero v4: copy left, a wall of work right ================= */
.hero2{background:var(--night);color:#fff;overflow:hidden}
.hero2-in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:56px;align-items:center;height:min(860px,calc(100vh - 60px));min-height:640px}
.hero2-copy{padding:48px 0}
.hero2-copy .sx-label{display:block;color:rgba(255,255,255,.5);padding:0;margin:0 0 22px}
.hero2 h1{font-size:clamp(40px,4.4vw,68px);line-height:1.02;letter-spacing:-.03em;margin:0 0 22px;max-width:13ch}
.hero2 .lead{font-size:17px;max-width:46ch;margin:0 0 28px}
.hero2 .hero-ctas{margin:0 0 40px}
.hero-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.16)}
.hero-facts li{padding:14px 12px 14px 0;font-size:13px;color:rgba(255,255,255,.5);border-bottom:1px solid rgba(255,255,255,.08)}
.hero-facts b{display:block;font-family:var(--serif);font-weight:400;font-size:22px;color:#fff;line-height:1.15;font-variant-numeric:lining-nums}
.wall{height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 9%,#000 91%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 9%,#000 91%,transparent 100%)}
.wall-col{display:flex;flex-direction:column;gap:12px}
.wall-col:nth-child(1){transform:translateY(-14%)}
.wall-col:nth-child(2){transform:translateY(4%)}
.wall-col:nth-child(3){transform:translateY(-6%)}
.wcard{position:relative;display:block;aspect-ratio:9/16;flex:none;overflow:hidden;background:var(--night2)}
.wcard video{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.wcard:hover{text-decoration:none}
.wcard:hover video{transform:scale(1.04)}
.wcap{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;gap:8px;padding:28px 10px 9px;font-size:12px;
  color:rgba(255,255,255,.85);background:linear-gradient(180deg,transparent,rgba(0,0,0,.65));opacity:0;transition:opacity .25s}
.wcap span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wcard:hover .wcap{opacity:1}
.hero2+.wrap>.sx:first-child,.brands+.wrap>.sx:first-child{margin-top:96px}
@media (max-width:1100px){
  .hero2-in{grid-template-columns:minmax(0,1fr);height:auto;min-height:0;gap:8px}
  .hero2-copy{padding:48px 0 24px}
  .hero2 h1{max-width:16ch}
  .wall{height:auto;display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:none;mask-image:none;
    margin:0 calc(var(--pad) * -1);padding:0 var(--pad) 32px;scroll-snap-type:x mandatory}
  .wall::-webkit-scrollbar{display:none}
  .wall-col{display:contents}
  .wall-col:nth-child(n){transform:none}
  .wcard{flex:0 0 38%;scroll-snap-align:start}
  .wcap{opacity:1}
}
@media (max-width:560px){
  .hero2-copy{padding-top:36px}
  .hero2 h1{font-size:40px}
  .hero2 .hero-ctas .btn{flex:1}
  .wcard{flex-basis:46%}
}
.hero2{margin:0}
.hero2 h1{font-size:clamp(38px,4vw,62px);max-width:14ch}
.hero2 .hero-ctas{margin-bottom:36px}
.hero-facts{grid-template-columns:repeat(4,minmax(0,1fr))}
.hero-facts li{border-bottom:0;padding:14px 10px 0 0;font-size:12px;line-height:1.35}
.hero-facts b{font-size:19px;margin-bottom:3px}
@media (max-width:560px){.hero-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-facts li{padding-bottom:12px}}
/* hero v4: height follows the copy; the wall never pushes it taller */
.hero2-in{height:auto;min-height:min(820px,calc(100vh - 60px))}
.wall{align-self:stretch;height:auto;contain:size;overflow:hidden}
@media (max-width:1100px){.hero2-in{min-height:0}.wall{contain:none;overflow-x:auto}}

/* ================= home hero v5: compact copy, a row of work right under it ================= */
.hero3{background:var(--night);color:#fff;margin:0}
.hero3-in{max-width:var(--max);margin:0 auto;padding:56px var(--pad) 40px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:56px;align-items:end}
.hero3-l .sx-label{display:block;color:rgba(255,255,255,.5);padding:0;margin:0 0 20px}
.hero3 h1{font-size:clamp(40px,4.6vw,72px);line-height:1;letter-spacing:-.03em;margin:0;max-width:15ch}
.hero3-r .lead{font-size:16px;max-width:46ch;margin:0 0 22px}
.hero3-r .hero-ctas{margin:0 0 24px}
.hero3 .hero-facts li{padding:12px 8px 0 0}
.hero3 .hero-facts b{font-size:18px}
.strip3{grid-template-columns:repeat(6,minmax(0,1fr));gap:2px}
.strip3 .reel-v{aspect-ratio:3/4}
.strip3 .reel-cap{padding:10px 12px 14px}
@media (max-width:1100px){
  .hero3-in{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:40px}
  .strip3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:560px){
  .hero3 h1{font-size:40px}
  .hero3 .hero-ctas .btn{flex:1}
  .hero3 .hero-facts{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hero3 .hero-facts b{font-size:16px}
  .strip3{display:flex}
  .strip3 .reel{flex:0 0 46%}
}
/* hero: pull the video row up so it peeks into the first screen */
.hero-in{padding-top:56px;padding-bottom:28px}
.hero h1{margin-bottom:36px}
.hero-side{padding-top:16px}
.wrap-hero{padding-bottom:22px}
.facts-row li{padding-top:2px;padding-bottom:2px}
.facts-row b{font-size:24px}
@media (max-width:560px){.hero-in{padding-top:40px}.hero h1{margin-bottom:24px}}

/* packages / kits */
.kits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.kit{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);padding:28px}
.kit:first-child{border-color:var(--ink)}
.kit-name{font-family:var(--serif);font-size:30px;line-height:1.1;margin:0 0 8px}
.kit-for{color:var(--ink2);font-size:15px;margin:0 0 18px;min-height:3em}
.kit-price{margin:0 0 4px;display:flex;align-items:baseline;gap:12px}
.kit-price b{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1;letter-spacing:-.02em;font-variant-numeric:lining-nums}
.kit-price s{color:var(--muted);font-size:18px}
.kit-days{font-size:13px;color:var(--muted);margin:0 0 18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.kit .ticks{margin-bottom:24px;flex:1;font-size:15px}
.kit-custom{background:transparent;border-style:dashed}
.kit-custom .ticks li{font-size:14px}
@media (max-width:1100px){.kits{grid-template-columns:minmax(0,1fr)}.kit-for{min-height:0}}
.hero h1{font-size:clamp(44px,6.2vw,98px);max-width:19ch}
@media (max-width:560px){.hero h1{font-size:40px}}

/* ================= package builder ================= */
.b-head{margin:28px 0 28px}
.b-steps{list-style:none;padding:0;margin:8px 0 14px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:15px;color:var(--muted)}
.b-steps li{display:flex;align-items:center;gap:8px}
.b-steps span{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:13px}
.b-steps li.on{color:var(--ink)}
.b-steps li.on span{background:var(--ink);border-color:var(--ink);color:#fff}
.b-tiers{font-size:14px;color:var(--ink2);margin:0}
.b-tiers a{text-decoration:underline;text-underline-offset:3px;margin-left:6px}
.b-wrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.b-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.bt{position:relative;display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);cursor:pointer;
  transition:border-color .15s,box-shadow .15s,transform .15s;user-select:none;outline:none}
.bt:hover{border-color:#bdb6aa;transform:translateY(-2px)}
.bt:focus-visible{box-shadow:0 0 0 3px rgba(213,64,43,.35)}
.bt.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.bt-art{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--soft)}
.bt-art img{width:100%;height:100%;object-fit:cover}
.bt-svg,.bt-svg svg{display:block;width:100%;height:100%}
.bt-check{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid var(--line);
  color:transparent;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;transition:.15s}
.bt.on .bt-check{background:var(--accent);border-color:var(--accent);color:#fff}
.bt-body{display:flex;flex-direction:column;gap:3px;padding:14px 16px 16px;flex:1}
.bt-body b{font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.15}
.bt-sub{font-size:13px;color:var(--muted);line-height:1.4}
.bt-price{margin-top:auto;padding-top:10px;font-size:17px;font-weight:600;font-variant-numeric:lining-nums}
.bt-price small{font-weight:400;color:var(--muted);font-size:13px}
.bt-qty{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:8px 10px}
.bt-qty button{width:38px;height:38px;border:1px solid var(--line);background:#fff;font:500 20px/1 var(--sans);cursor:pointer;color:var(--ink)}
.bt-qty button:hover{border-color:var(--ink)}
.bt-qty span{font-size:17px;font-weight:600;min-width:30px;text-align:center}
.bsum{position:sticky;top:84px;background:var(--white);border:1px solid var(--ink);padding:22px}
.bsum h2{font-size:26px;margin-bottom:14px}
.bsum-lines{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px;font-size:15px}
.bsum-lines li{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:baseline}
.bsum-lines li button{border:0;background:none;color:var(--muted);font-size:18px;cursor:pointer;padding:0 2px}
.bsum-lines li button:hover{color:var(--accent)}
.bsum-empty{display:block!important;color:var(--muted)}
.bsum-row{display:flex;justify-content:space-between;font-size:14px;color:var(--ink2);padding:6px 0;border-top:1px solid var(--line)}
.bsum-off{color:var(--ok);font-weight:600}
.bsum-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--ink);padding:12px 0 6px;margin-top:4px}
.bsum-total b{font-family:var(--serif);font-weight:400;font-size:40px;line-height:1;font-variant-numeric:lining-nums}
.bsum-hint{font-size:13px;color:var(--accent);margin:0 0 14px}
.bsum-note{font-size:12px;color:var(--muted);margin:12px 0 0}
.bsum [aria-disabled="true"],.b-bar [aria-disabled="true"]{opacity:.45;pointer-events:auto}
.b-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:none;justify-content:space-between;align-items:center;gap:12px;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--night);color:#fff}
.b-bar small{display:block;font-size:11px;color:rgba(255,255,255,.6)}
.b-bar b{font-family:var(--serif);font-weight:400;font-size:26px}
.form-card .bsum-lines{margin-top:18px}
.form-card .bsum-total b{font-size:32px}
/* kits: picture previews in the build-your-own card */
.kit-minis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 22px;flex:1;align-content:start}
.kit-mini{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--ink2)}
.kit-mini img,.kit-mini .bt-svg{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--soft)}
.kit-mini em{font-style:normal}
@media (max-width:1100px){.b-wrap{grid-template-columns:minmax(0,1fr)}.b-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bsum{position:static}}
@media (max-width:860px){.b-bar:not([hidden]){display:flex}}
@media (max-width:560px){.b-grid{gap:10px}.bt-body{padding:10px 12px 12px}.bt-body b{font-size:17px}.bt-sub{display:none}
  .bt-price{font-size:15px;padding-top:6px}.bt-check{width:26px;height:26px;top:8px;right:8px}
  .bt-qty button{width:34px;height:34px}body:has(.b-bar:not([hidden])) .foot{padding-bottom:70px}}
@media (max-width:1100px){.sx .svc{grid-template-columns:40px minmax(0,1fr) 110px}.sx .svc p{grid-column:2 / 4}}
@media (max-width:560px){.sx .svc{grid-template-columns:32px minmax(0,1fr);gap:6px 12px}.sx .svc p,.sx .svc .svc-price{grid-column:2}.sx .svc .svc-price{text-align:left}}

/* ================= hubs: doors, offer cards, sample layouts ================= */
.doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.door{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);color:var(--ink);transition:transform .2s,border-color .2s}
.door:hover{text-decoration:none;border-color:var(--ink);transform:translateY(-3px)}
.door-art{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--soft)}
.door-art img{width:100%;height:100%;object-fit:cover}
.door-body{display:flex;flex-direction:column;gap:6px;padding:20px 22px 22px}
.door-body b{font-family:var(--serif);font-weight:400;font-size:36px;line-height:1}
.door-sub{color:var(--ink2);font-size:16px}
.door-price{margin-top:6px;font-weight:600;font-size:15px;display:flex;justify-content:space-between}
.door-price i{font-style:normal;color:var(--accent);font-size:20px;transition:transform .2s}
.door:hover .door-price i{transform:translateX(4px)}
.ocs{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.oc{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line)}
.oc-art{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--soft)}
.oc-art img{width:100%;height:100%;object-fit:cover}
.oc-body{display:flex;flex-direction:column;gap:4px;padding:16px 18px 18px;flex:1}
.oc-body b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.15}
.oc-sub{font-size:14px;color:var(--ink2);line-height:1.45}
.oc-price{margin-top:auto;padding-top:12px;font-size:18px;font-weight:600;font-variant-numeric:lining-nums}
.oc-price small{font-weight:400;font-size:13px;color:var(--muted)}
.oc-ctas{display:flex;align-items:center;gap:14px;margin-top:12px}
.oc-ctas .btn{flex:1}
.oc-more{font-size:14px;text-decoration:underline;text-underline-offset:3px;color:var(--ink2)}
.mocks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:12px}
.mock{margin:0}
.mock svg{display:block;width:100%;height:auto;background:#fff}
.mock figcaption{font-size:13px;color:var(--muted);margin-top:8px}
@media (max-width:860px){.doors,.mocks{grid-template-columns:minmax(0,1fr)}.door{flex-direction:row}.door-art{flex:0 0 38%;aspect-ratio:auto}
  .door-body{padding:14px 16px}.door-body b{font-size:28px}.door-sub{font-size:14px}}
@media (max-width:560px){.ocs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.oc-sub{display:none}.oc-body{padding:12px}
  .oc-body b{font-size:18px}.oc-ctas{flex-direction:column;align-items:stretch;gap:8px}.oc-more{text-align:center}
  .mocks{grid-auto-flow:column;grid-auto-columns:82%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory}
  .mock{scroll-snap-align:start}}
@media (max-width:560px){.oc-ctas .btn{padding:10px 6px;font-size:13px}}

/* ================= concept projects ================= */
.ccs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.cc{display:flex;flex-direction:column;color:var(--ink);background:var(--white);border:1px solid var(--line);transition:transform .2s,border-color .2s}
.cc:hover{text-decoration:none;transform:translateY(-3px);border-color:var(--ink)}
.cc-shot{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--soft);border-bottom:1px solid var(--line)}
.cc-shot img{width:100%;height:100%;object-fit:cover;object-position:top}
.cc-body{display:flex;flex-direction:column;gap:2px;padding:16px 18px 18px}
.cc-tag{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:600}
.cc-body b{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.15}
.cc-sub{font-size:14px;color:var(--muted)}
.logos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lg{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;border:1px solid var(--line);transition:transform .2s}
.lg:hover{text-decoration:none;transform:scale(1.02)}
.lg-logo{display:inline-flex;align-items:center;gap:12px;font-size:clamp(20px,2vw,28px);line-height:1;padding:0 16px;text-align:left}
.lg-logo svg{flex:none}
.shots{position:relative;padding-right:12%}
.shot-d{display:block;border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.12)}
.shot-d img{width:100%;display:block}
.shot-m{position:absolute;right:0;bottom:-28px;width:22%;border:6px solid #111;border-radius:22px;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.25);background:#111}
.shot-m img{width:100%;display:block}
.brandkit{display:grid;grid-template-columns:1fr 1fr .8fr;gap:16px}
.bk-logo{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;border:1px solid var(--line)}
.bk-meta .sx-label{display:block;margin:0 0 10px;padding:0}
.sws{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:22px}
.sw{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);font-variant-numeric:tabular-nums}
.sw i{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);flex:none}
.bk-type{font-size:34px;line-height:1.1;margin:0 0 4px}
.ig{max-width:380px;background:#fff;border:1px solid var(--line);border-radius:28px;padding:20px 16px;box-shadow:0 20px 50px rgba(0,0,0,.08);color:#111}
.ig-top{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.ig-av{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;border:2px solid #e5e5e5}
.ig-top b{display:block;font:600 15px var(--sans)}
.ig-top span{font-size:13px;color:#555}
.ig-top p{font-size:13px;margin:4px 0 0;line-height:1.35}
.ig-hls{display:flex;gap:14px;margin:0 0 14px;padding:0 2px}
.ig-h{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:#333}
.ig-h i{width:52px;height:52px;border-radius:50%;border:2px solid;display:flex;align-items:center;justify-content:center}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin:0 -16px -20px;border-radius:0 0 26px 26px;overflow:hidden}
.ig-t{width:100%;aspect-ratio:1;object-fit:cover;display:flex;align-items:center;justify-content:center}
.ig-txt{color:#fff;font-size:15px;line-height:1.15;padding:10px;text-align:center}
.wtabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin:36px 0 0;font-size:15px}
.wtabs a{padding:10px 0;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.wtabs a.on,.wtabs a:hover{color:var(--ink);border-color:var(--ink);text-decoration:none}
@media (max-width:1100px){.ccs,.logos{grid-template-columns:repeat(2,minmax(0,1fr))}.brandkit{grid-template-columns:1fr 1fr}.bk-meta{grid-column:1 / -1}}
@media (max-width:560px){.ccs,.logos,.brandkit{grid-template-columns:minmax(0,1fr)}.shots{padding-right:0;padding-bottom:40px}.shot-m{width:34%;border-width:4px;border-radius:14px;bottom:0}
  .lg-logo{font-size:22px}.ig{margin:0 auto}}

/* concept socials: TikTok + YouTube mocks */
.socials{display:grid;grid-template-columns:repeat(2,minmax(0,380px));gap:28px;margin-bottom:36px}
.tt{background:#111;color:#fff;border-radius:28px;padding:20px 14px 0;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.18)}
.tt-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding-bottom:12px}
.tt-av{width:76px;height:76px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #333}
.tt-head b{font:600 16px var(--sans)}.tt-name{font-size:13px;color:#aaa}
.tt-btns{display:flex;gap:8px;margin:8px 0}.tt-btns i{font-style:normal;background:#fe2c55;padding:7px 22px;border-radius:4px;font-weight:600;font-size:14px}
.tt-btns i.g{background:#2f2f2f}.tt-head p{font-size:13px;margin:0;color:#ddd}
.tt-tabs{display:flex;justify-content:center;gap:40px;border-bottom:1px solid #2a2a2a;font-size:13px;color:#888;padding:8px 0}.tt-tabs .on{color:#fff;border-bottom:2px solid #fff;padding-bottom:6px}
.tt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin:0 -14px}
.tt-t{position:relative;aspect-ratio:3/4;overflow:hidden}.tt-t img{width:100%;height:100%;object-fit:cover}
.tt-t i{position:absolute;left:6px;bottom:4px;font-style:normal;font-size:11px;text-shadow:0 1px 4px #000}
.yt{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;max-width:960px}
.yt-banner{position:relative;height:150px;overflow:hidden}.yt-banner img{width:100%;height:100%;object-fit:cover;opacity:.6}
.yt-banner span{position:absolute;left:28px;bottom:22px;font-size:clamp(22px,2.6vw,36px);text-shadow:0 2px 12px rgba(0,0,0,.5)}
.yt-row{display:flex;align-items:center;gap:16px;padding:18px 24px}.yt-av{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none}
.yt-row b{display:block;font:600 20px var(--sans);color:#111}.yt-row span{font-size:13px;color:#666}
.yt-row i{margin-left:auto;font-style:normal;background:#111;color:#fff;border-radius:999px;padding:9px 18px;font-weight:600;font-size:14px}
.yt-vids{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:0 24px 24px}
.yt-th{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#eee}.yt-th img{width:100%;height:100%;object-fit:cover}
.yt-th i{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.8);color:#fff;font-style:normal;font-size:12px;padding:1px 5px;border-radius:4px}
.yt-v b{display:block;font:600 14px/1.3 var(--sans);color:#111;margin-top:8px}.yt-v span{font-size:12px;color:#666}
@media (max-width:860px){.socials{grid-template-columns:minmax(0,1fr)}.ig,.tt{max-width:420px;margin:0 auto;width:100%}.yt-vids{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.yt-vids{grid-template-columns:1fr}.yt-banner{height:110px}}
.wchips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.wchips button{border:1px solid var(--line);background:var(--white);padding:8px 14px;font:14px var(--sans);cursor:pointer;color:var(--ink2)}
.wchips button.on,.wchips button:hover{border-color:var(--ink);color:var(--ink)}
.ccs .cc[hidden]{display:none}

/* ================= brand kit board ================= */
.bb{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:220px;gap:12px}
.bb-t{position:relative;background:#e8e4dc;overflow:hidden;display:flex;align-items:center;justify-content:center}
.bb-l{position:absolute;left:12px;bottom:10px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#6c675f}
.bb-l.light{color:rgba(255,255,255,.75)}
.bb-cards{grid-column:span 3;grid-row:span 2;background:#d9d4ca}
.bb-card{position:absolute;width:300px;height:172px;border-radius:6px;box-shadow:0 18px 40px rgba(0,0,0,.22);padding:20px;display:flex}
.bb-card.front{background:var(--d);transform:rotate(-7deg) translate(-70px,-50px);flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}
.bb-card.back{background:var(--l);color:var(--il);transform:rotate(5deg) translate(60px,60px);justify-content:space-between;font-size:12px;line-height:1.5}
.bb-card.back p{margin:10px 0 0}.bb-ct{text-align:right;align-self:flex-end;margin:0;opacity:.8}
.bb-mugwrap{grid-column:span 2;background:#ebe7df}
.bb-mug{position:relative;width:120px;height:140px}
.bb-mug-b{position:absolute;inset:0;background:var(--l);border-radius:8px 8px 22px 22px;box-shadow:inset -14px 0 20px rgba(0,0,0,.08),0 14px 24px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center}
.bb-mug i{position:absolute;right:-34px;top:30px;width:46px;height:62px;border:12px solid var(--l);border-left:0;border-radius:0 30px 30px 0;filter:drop-shadow(0 6px 8px rgba(0,0,0,.12))}
.bb-totewrap{grid-column:span 1;grid-row:span 2;background:#e2ddd3}
.bb-tote{position:relative;width:130px;height:170px;margin-top:40px}
.bb-tote i{position:absolute;left:28px;top:-58px;width:74px;height:80px;border:6px solid var(--d);border-bottom:0;border-radius:40px 40px 0 0}
.bb-tote-b{position:absolute;inset:0;background:var(--d);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:10px;box-shadow:0 16px 30px rgba(0,0,0,.2)}
.bb-badgewrap{grid-column:span 2;grid-row:span 2;background:#dcd7cd}
.bb-lanyard{position:absolute;top:-10px;left:50%;width:28px;height:110px;background:var(--a);transform:translateX(-50%)}
.bb-badge{position:relative;margin-top:70px;width:170px;height:240px;background:#fff;border-radius:12px;box-shadow:0 20px 40px rgba(0,0,0,.2);text-align:center;overflow:hidden;color:#222}
.bb-hole{position:absolute;top:10px;left:50%;width:36px;height:8px;border-radius:4px;background:#ddd;transform:translateX(-50%)}
.bb-badge-top{background:var(--d);height:84px;display:flex;align-items:center;justify-content:center;padding-top:14px}
.bb-badge p{font-size:10px;letter-spacing:.2em;margin:18px 0 2px;color:#888}.bb-badge b{display:block;font-size:34px;font-weight:400;line-height:1.1}
.bb-badge span{display:block;font-size:11px;color:#888;margin-top:6px}
.bb-letterwrap{grid-column:span 2;grid-row:span 2;background:#e6e1d8}
.bb-letter{width:200px;height:270px;background:#fff;box-shadow:0 16px 34px rgba(0,0,0,.15);padding:20px 18px;transform:rotate(-2deg)}
.bb-lh{display:flex;align-items:center;gap:8px;margin-bottom:10px}.bb-letter p{font-size:8px;color:#888;margin:0 0 18px;line-height:1.5}
.bb-letter i{display:block;height:5px;background:#ececec;margin:0 0 9px;border-radius:2px}.bb-letter i.s{width:60%}
.bb-stickwrap{grid-column:span 2;gap:14px;background:#efebe4}
.bb-stick{width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 16px rgba(0,0,0,.15);border:4px solid #fff}
.bb-stick:nth-child(2){transform:rotate(-10deg) translateY(-8px)}
.bb-bagwrap{grid-column:span 2;grid-row:span 2;background:#ddd8ce}
.bb-bag{position:relative;width:180px;height:230px;background:var(--l);box-shadow:0 18px 36px rgba(0,0,0,.18);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:16px}
.bb-bag-fold{position:absolute;left:0;right:0;top:0;height:22px;background:rgba(0,0,0,.06)}
.bb-banner{grid-column:span 4;background-size:cover;background-position:center;justify-content:flex-start}
.bb-banner>div{padding:26px 34px;color:#fff;max-width:70%}.bb-banner p{font-size:28px;line-height:1.1;margin:10px 0 8px}.bb-banner span{font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.bb-posterwrap{grid-column:span 2;grid-row:span 2;background:#d6d1c7}
.bb-poster{width:190px;height:270px;display:flex;flex-direction:column;box-shadow:0 18px 36px rgba(0,0,0,.25);overflow:hidden}
.bb-poster img{height:150px;width:100%;object-fit:cover}.bb-poster p{font-size:15px;line-height:1.15;margin:12px 12px 8px;flex:1}
.bb-poster span{align-self:flex-start;margin:0 12px 14px;color:#fff;font-size:10px;padding:5px 9px;letter-spacing:.06em}
@media (max-width:1100px){.bb{grid-template-columns:repeat(4,minmax(0,1fr))}.bb-cards,.bb-banner{grid-column:span 4}.bb-totewrap{grid-column:span 2}}
@media (max-width:560px){.bb{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:190px}.bb-cards,.bb-banner{grid-column:span 2}
  .bb-mugwrap,.bb-totewrap,.bb-badgewrap,.bb-letterwrap,.bb-stickwrap,.bb-bagwrap,.bb-posterwrap{grid-column:span 2}
  .bb-card{width:230px;height:132px}.bb-card.front{transform:rotate(-7deg) translate(-40px,-36px)}.bb-card.back{transform:rotate(5deg) translate(34px,40px)}
  .bb-banner>div{max-width:100%;padding:18px}.bb-banner p{font-size:22px}.bb-stick{width:70px;height:70px}}
.bb{grid-auto-flow:dense}
.bb-mugwrap{grid-row:span 2}
.bb-stickwrap{grid-row:span 2;flex-wrap:wrap;align-content:center}
@media (max-width:1100px){.bb-mugwrap,.bb-stickwrap{grid-row:span 1}}
/* real-work previews (site screenshots, brand kits, socials) in tiles and doors */
.art-shot{width:100%;height:100%;object-fit:cover;object-position:top center}
.bt-art .art-shot,.oc-art .art-shot,.door-art .art-shot,.kit-mini .art-shot{display:block}
.kit-mini img.art-shot{aspect-ratio:4/3}

/* ================= brand presentation (slides) ================= */
.bp{display:grid;gap:14px;--sh:0 1px 1px rgba(0,0,0,.06),0 6px 12px rgba(0,0,0,.08),0 24px 48px rgba(0,0,0,.14),0 60px 90px rgba(0,0,0,.08);
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.bp-s{position:relative;overflow:hidden;aspect-ratio:16/9;width:100%;font-family:var(--sans)}
.bp-cap{position:absolute;left:24px;bottom:18px;font:500 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:rgba(0,0,0,.45)}
.bp-cap.light{color:rgba(255,255,255,.75)}
.bp-no{position:absolute;right:26px;top:22px;font:500 12px var(--sans);letter-spacing:.16em;opacity:.5}
.bp-cover{display:flex;align-items:center;justify-content:center}
.bp-pat{position:absolute;inset:-60px;background-size:110px;opacity:.07;transform:rotate(-8deg)}
.bp-center{position:relative;text-align:center}.bp-center p{margin:30px 0 0;font-size:12px;letter-spacing:.26em;text-transform:uppercase;opacity:.7}
.bp-logos{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:14px;aspect-ratio:16/10}
.bp-logos>div{position:relative;display:flex;align-items:center;justify-content:center}
.bp-logos>div::after,.bp-cover::after,.bp-type::after,.bp-merch::after,.bp-social::after{content:"";position:absolute;inset:0;background:var(--grain);pointer-events:none}
.bp-logos small{position:absolute;left:18px;bottom:14px;font:500 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.55}
.bp-pal{display:grid;grid-template-columns:1.6fr 1fr 1fr .7fr;aspect-ratio:16/7}
.bp-sw{display:flex;flex-direction:column;justify-content:space-between;padding:26px 24px}
.bp-sw b{font-size:20px;font-weight:600}.bp-sw span{font-size:13px;line-height:1.7;opacity:.8;font-variant-numeric:tabular-nums}
.bp-type{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:40px;padding:50px 60px;aspect-ratio:16/8}
.bp-aa{font-size:clamp(120px,20vw,300px);line-height:.85;letter-spacing:-.04em;text-align:center}
.bp-fn{font-size:34px;margin:0 0 14px}.bp-alpha{font-size:21px;line-height:1.5;margin:0 0 22px;opacity:.85;word-break:break-all}.bp-body{font-size:15px;line-height:1.6;max-width:46ch;opacity:.8;margin:0}
.bp-desk{background:radial-gradient(120% 90% at 30% 20%,#ebe8e2,#c6c2bb 75%)}
.bp-letter{position:absolute;left:7%;top:8%;width:29%;aspect-ratio:1/1.414;background:#fff;box-shadow:var(--sh);transform:rotate(-4deg);padding:4% 3.4%;color:var(--il);box-sizing:border-box}
.bp-lh{margin-bottom:12%}.bp-date{font:11px var(--sans);opacity:.6;margin:0 0 10%}
.bp-letter i{display:block;height:5px;background:#ececeb;border-radius:3px;margin:0 0 6%}.bp-letter i.s{width:65%}.bp-letter i.xs{width:35%}
.bp-lf{position:absolute;left:10%;right:10%;bottom:5%;border-top:2px solid;padding-top:8px;font:9px var(--sans);opacity:.75}
.bp-env{position:absolute;left:33%;top:55%;width:34%;aspect-ratio:2.2/1;background:#fbfaf7;box-shadow:var(--sh);transform:rotate(5deg);padding:3% 3.4%;color:var(--il);box-sizing:border-box}
.bp-env p{position:absolute;left:46%;top:44%;margin:0;font:11px/1.6 var(--sans);opacity:.75}
.bp-bc{position:absolute;width:25%;aspect-ratio:1.75/1;box-shadow:var(--sh);display:flex;border-radius:3px;box-sizing:border-box}
.bp-bc.front{right:8%;top:10%;transform:rotate(9deg);align-items:center;justify-content:center}
.bp-bc.back{right:13%;top:46%;transform:rotate(-5deg);padding:3%;justify-content:space-between}
.bp-bc.back>div>span{display:block;font-size:11px;opacity:.65;margin-top:4px}.bp-bc.back p{align-self:flex-end;text-align:right;font-size:10px;line-height:1.6;margin:0;opacity:.8}
.bp-bc.back em{position:absolute;left:0;top:0;bottom:0;width:5px}
.bp-tee{position:absolute;left:5%;top:10%;width:34%;filter:drop-shadow(0 30px 40px rgba(0,0,0,.25))}
.bp-tee-logo{position:absolute;left:22%;top:36%;transform:translateX(-50%)}
.bp-cap-h{position:absolute;left:41%;top:12%;width:22%;filter:drop-shadow(0 20px 26px rgba(0,0,0,.22))}
.bp-cap-logo{position:absolute;left:52%;top:20%;transform:translateX(-50%)}
.bp-tote2{position:absolute;right:7%;top:22%;width:24%;aspect-ratio:.9/1;box-shadow:var(--sh);display:flex;align-items:center;justify-content:center}
.bp-tote2>.bp-hdl{position:absolute;left:28%;top:-26%;width:44%;height:32%;border:7px solid;border-bottom:0;border-radius:60px 60px 0 0;box-sizing:border-box}
.bp-mug2{position:absolute;left:46%;bottom:13%;width:11%;aspect-ratio:.85/1}
.bp-mug2>div{position:absolute;inset:0;border-radius:6px 6px 18px 18px;box-shadow:inset -12px 0 18px rgba(0,0,0,.08),var(--sh);display:flex;align-items:center;justify-content:center}
.bp-mug2>i{position:absolute;right:-26%;top:22%;width:32%;height:44%;border:10px solid #fff;border-left:0;border-radius:0 30px 30px 0;box-sizing:border-box}
.bp-sign{background-size:cover;background-position:center}
.bp-blade{position:absolute;left:10%;top:12%}.bp-arm{display:block;width:150px;height:8px;background:#1a1a1a;border-radius:4px}
.bp-blade>div{margin:0 0 0 28px;width:230px;height:230px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 30px 60px rgba(0,0,0,.45);border:6px solid #1a1a1a}
.bp-door{position:absolute;right:8%;bottom:14%;text-align:right;text-shadow:0 2px 14px rgba(0,0,0,.5)}.bp-door p{font-size:44px;margin:0 0 10px}
.bp-door span{font:14px/1.7 var(--sans);letter-spacing:.04em}
.bp-social{display:grid;grid-template-columns:repeat(3,1fr) .62fr;gap:2.4%;padding:5% 5% 7%;aspect-ratio:16/8;align-items:center;box-sizing:border-box}
.bp-post{position:relative;aspect-ratio:1;background-size:cover;background-position:center;box-shadow:var(--sh);display:flex;flex-direction:column;justify-content:flex-end;padding:7%;color:#fff;box-sizing:border-box}
.bp-post>span{position:absolute;left:7%;top:7%}.bp-post p{margin:0;font-size:22px;line-height:1.1}.bp-post small{margin-top:10px;font:12px var(--sans);opacity:.85}
.bp-post i{position:absolute;left:7%;bottom:7%;font:600 13px var(--sans);font-style:normal;padding:8px 12px}
.bp-story{position:relative;aspect-ratio:9/16;background-size:cover;background-position:center;box-shadow:var(--sh);border-radius:14px;color:#fff;padding:12% 10%;display:flex;flex-direction:column;justify-content:flex-end;box-sizing:border-box}
.bp-story>span{position:absolute;left:10%;top:7%}.bp-story p{margin:0;font-size:20px;line-height:1.05}.bp-story em{font:12px var(--sans);font-style:normal;opacity:.85;margin-top:8px}
@media (max-width:860px){.bp{gap:8px}.bp-s{aspect-ratio:4/3}.bp-logos{aspect-ratio:1;gap:8px}.bp-logos>div>span{transform:scale(.6)}
  .bp-pal{grid-template-columns:1fr 1fr;aspect-ratio:1}.bp-sw{padding:16px}.bp-sw b{font-size:16px}.bp-sw span{font-size:11px}
  .bp-type{grid-template-columns:1fr;padding:28px;aspect-ratio:auto;gap:10px}.bp-aa{font-size:110px}.bp-fn{font-size:24px}.bp-alpha{font-size:14px}
  .bp-social{grid-template-columns:1fr 1fr;aspect-ratio:auto}.bp-story{display:none}.bp-post p{font-size:15px}
  .bp-center>span{transform:scale(.6)}.bp-letter{width:42%}.bp-env{width:50%;left:22%;top:60%}.bp-bc{width:38%}.bp-bc.back{top:52%}.bp-bc>*{transform:scale(.7)}
  .bp-tee-logo,.bp-cap-logo,.bp-tote2>span,.bp-mug2 svg{transform:translateX(-50%) scale(.6)}
  .bp-blade{transform:scale(.6);transform-origin:0 0}.bp-door p{font-size:26px}.bp-door span{font-size:11px}}
.bp>section.bp-s{margin:0!important;padding-top:0;padding-bottom:0}
.bp>section.bp-type{padding:50px 60px}.bp>section.bp-social{padding:5% 5% 7%}
.bp-story>span,.bp-letter .bp-lh,.bp-env>div,.bp-bc{white-space:nowrap}
@media (max-width:860px){.bp>section.bp-type{padding:28px}}
@media (max-width:860px){
  .bp-desk,.bp-merch,.bp-sign{aspect-ratio:16/10!important}
  .bp-letter{width:30%;padding:4% 3.4%}.bp-env{width:34%;left:33%;top:55%}.bp-bc{width:26%}.bp-bc.back{top:46%;padding:3%}
  .bp-bc>*,.bp-tee-logo,.bp-cap-logo,.bp-tote2>span,.bp-mug2 svg,.bp-blade,.bp-center>span,.bp-logos>div>span{transform:none!important}
  .bp-tee-logo,.bp-cap-logo{transform:translateX(-50%)!important}
  .bp-letter>*,.bp-env>*,.bp-bc>*,.bp-tee-logo,.bp-cap-logo,.bp-tote2>span,.bp-mug2>div>svg,.bp-door{zoom:.4}
  .bp-blade{zoom:.38}.bp-mug2>i{border-width:5px}.bp-tote2>.bp-hdl{border-width:4px}.bp-letter i{height:3px}
  .bp-center>span{zoom:.6}.bp-logos>div>span{zoom:.42}.bp-door p{font-size:44px}.bp-door span{font-size:14px}
  .bp-cap{font-size:9px;left:12px;bottom:10px}}

/* promise band: "we take care of everything" */
.promise{background:#141312;color:#f3f0ea;margin:72px 0 0;padding:88px 0}
.promise-in{max-width:1320px;margin:0 auto;padding:0 32px}
.promise .sx-label{color:rgba(243,240,234,.55)}
.promise h2{font-size:clamp(34px,4.6vw,68px);line-height:1.02;letter-spacing:-.02em;margin:14px 0 56px;max-width:16ch;font-weight:500}
.pr-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.14)}
.pr-i{padding:28px 28px 34px 0;border-bottom:1px solid rgba(255,255,255,.14);transition:background .3s}
.pr-i:not(:nth-child(3n+1)){padding-left:28px;border-left:1px solid rgba(255,255,255,.14)}
.pr-i span{display:block;font-size:12px;letter-spacing:.14em;color:var(--accent,#e2562b);margin-bottom:22px}
.pr-i b{display:block;font-size:22px;font-weight:500;margin-bottom:10px}
.pr-i p{margin:0;font-size:15px;line-height:1.55;color:rgba(243,240,234,.68);max-width:34ch}
.pr-i:hover{background:rgba(255,255,255,.03)}
.promise+.finale{margin-top:0}
@media (max-width:860px){.promise{padding:60px 0}.promise-in{padding:0 16px}.pr-grid{grid-template-columns:1fr}
  .pr-i,.pr-i:not(:nth-child(3n+1)){padding:22px 0;border-left:0}.promise h2{margin-bottom:32px}}

/* ================= work gallery v2: bento + hover + reveal ================= */
.ccs{grid-template-columns:repeat(12,minmax(0,1fr))!important;grid-auto-rows:clamp(170px,17vw,270px);grid-auto-flow:dense;gap:14px!important}
.ccs .cc{position:relative;grid-column:span 4;grid-row:span 2;overflow:hidden;border:0;background:#111;color:#fff;isolation:isolate}
.ccs .cc:nth-child(6n+1){grid-column:span 7;grid-row:span 2}
.ccs .cc:nth-child(6n+2),.ccs .cc:nth-child(6n+3){grid-column:span 5;grid-row:span 1}
.ccs .cc:nth-child(12n+7){grid-column:7/span 6}
.ccs-brand .cc:nth-child(6n+4),.ccs-brand .cc:nth-child(6n+5),.ccs-brand .cc:nth-child(6n+6){grid-row:span 1}
.ccs .cc:hover{transform:none}
.ccs .cc-shot{position:absolute;inset:0;aspect-ratio:auto;border:0;background:#1a1a1a}
.ccs .cc-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),opacity .6s ease}
.ccs .cc-shot .i2{opacity:0;object-position:center}
.ccs .cc-shot .im{display:none}
.ccs:not(.ccs-brand) .cc:nth-child(6n+4) .im,.ccs:not(.ccs-brand) .cc:nth-child(6n+5) .im,.ccs:not(.ccs-brand) .cc:nth-child(6n+6) .im{display:block}
.ccs .cc:hover .cc-shot img{transform:scale(1.05)}
.ccs .cc:hover .cc-shot .i2{opacity:1}
.ccs .cc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.72));z-index:1;transition:opacity .4s}
.ccs .cc-body{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 24px;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ccs .cc-body b{color:#fff;font-size:clamp(22px,2.2vw,34px)}
.ccs .cc-tag{color:rgba(255,255,255,.75)}
.ccs .cc-sub{color:rgba(255,255,255,.72);max-height:0;opacity:0;overflow:hidden;transition:max-height .5s,opacity .4s}
.ccs .cc:hover .cc-sub{max-height:40px;opacity:1}
.ccs .cc-go{position:absolute;right:20px;top:20px;z-index:2;background:#fff;color:#111;font-size:13px;font-weight:600;padding:10px 16px;border-radius:999px;
  opacity:0;transform:translateY(-8px) scale(.9);transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.ccs .cc-go i{font-style:normal;display:inline-block;transition:transform .3s}
.ccs .cc:hover .cc-go{opacity:1;transform:none}.ccs .cc:hover .cc-go i{transform:translateX(3px)}
.ccs.n3 .cc:nth-child(1){grid-column:span 7;grid-row:span 2}.ccs.n3 .cc:nth-child(2),.ccs.n3 .cc:nth-child(3){grid-column:span 5;grid-row:span 1}
html.rv .ccs .cc{opacity:0;transform:translateY(46px)}
html.rv .ccs .cc.in{opacity:1;transform:none;transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
@media (hover:none){.ccs .cc-go{opacity:1;transform:none}.ccs .cc-sub{max-height:40px;opacity:1}}
@media (max-width:760px){.ccs{grid-template-columns:1fr 1fr!important;grid-auto-rows:44vw;gap:10px!important}
  .ccs .cc,.ccs .cc:nth-child(n){grid-column:span 2!important;grid-row:span 1!important}
  .ccs:not(.ccs-brand) .cc:nth-child(6n+4),.ccs:not(.ccs-brand) .cc:nth-child(6n+5){grid-column:span 1!important;grid-row:span 2!important}
  .ccs .cc:nth-child(6n+6) .im{display:none!important}
  .ccs .cc-body{padding:14px 16px}.ccs .cc-go{display:none}}

/* ===== photo mockups ===== */
.bp-ph{aspect-ratio:auto!important;background:#141312!important;overflow:hidden}
.bp-fx{height:56.25vw;max-height:none}
.bp-cv{position:absolute;left:0;top:0;width:1440px;height:810px;transform-origin:0 0}
.mk{position:absolute;overflow:hidden;background:#ddd}
.mk>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mk-p{position:absolute;left:0;top:0;transform-origin:0 0;mix-blend-mode:multiply;box-sizing:border-box}
.mk-p.ink{display:flex;align-items:center;justify-content:center;text-align:center;opacity:.9}
.mk-p.ink>span{white-space:normal}
.mk-p>*{width:100%;height:100%;box-sizing:border-box}
.pp-letter{position:relative;padding:44px 40px;font-size:9.5px;line-height:1.55;background:transparent}
.pp-lh{margin-bottom:34px}.pp-d{opacity:.6;margin:0 0 18px}.pp-t{margin:0 0 10px;opacity:.85}
.pp-f{position:absolute;left:40px;right:40px;bottom:30px;border-top:2px solid;padding-top:8px;font-size:8px;opacity:.75}
.pp-c1{display:flex;align-items:center;justify-content:center}
.pp-c2{position:relative;display:flex;justify-content:space-between;padding:26px 26px 22px 30px}
.pp-c2 span{display:block;font-size:11px;opacity:.65;margin-top:4px}.pp-c2 p{align-self:flex-end;text-align:right;font-size:10px;line-height:1.6;margin:0;opacity:.8}
.pp-c2 em{position:absolute;left:0;top:0;bottom:0;width:6px}
.pp-b{display:flex;flex-direction:column}
.pp-bt{height:46%;display:flex;align-items:center;justify-content:center}
.pp-bb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;position:relative}
.pp-bb b{font-size:40px}.pp-bb span{font-size:12px;letter-spacing:.24em;text-transform:uppercase;opacity:.6}
.pp-bb i{position:absolute;left:0;right:0;bottom:0;height:12px}
.bp-ph .bp-cap{z-index:3}
@media (max-width:860px){.bp-ph{aspect-ratio:auto!important}.bp-ph .mk-p,.bp-ph .mk-p *{zoom:1!important}}
.pp-b2{display:flex;flex-direction:column;align-items:flex-start;padding:0 0 0 0}
.pp-b2t{width:100%;height:34%;display:flex;align-items:center;padding:0 18px}
.pp-b2 b{font-size:24px;margin:18px 0 4px 18px}.pp-b2 span{font-size:10px;letter-spacing:.18em;text-transform:uppercase;opacity:.6;margin-left:18px}

/* ================= realistic iPhone + Instagram / TikTok ================= */
.iph{--w:340px;position:relative;width:calc(var(--w) + 28px);flex:none;padding:4px;border-radius:60px;
  background:linear-gradient(135deg,#d9d7d2 0%,#9e9c97 18%,#e8e6e1 35%,#8d8b86 55%,#cfcdc8 75%,#7d7b77 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.35),0 2px 3px rgba(0,0,0,.2),0 30px 60px -10px rgba(0,0,0,.35),0 60px 120px -20px rgba(0,0,0,.25);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;color:#000;text-align:left;margin:0 auto}
.iph-dk{background:linear-gradient(135deg,#4a4946 0%,#232220 25%,#55534f 45%,#1c1b19 70%,#3b3a37 100%)}
.iph>i[class^=iph-b]{position:absolute;width:4px;border-radius:2px;background:inherit;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
.iph-b1{left:-3px;top:118px;height:30px}.iph-b2{left:-3px;top:170px;height:58px}.iph-b3{left:-3px;top:240px;height:58px}.iph-b4{right:-3px;top:190px;height:92px}
.iph-bz{background:#050505;border-radius:56px;padding:10px;box-shadow:inset 0 0 0 1.5px #2a2a2a}
.iph-scr{position:relative;width:var(--w);height:calc(var(--w) * 2.164);border-radius:46px;overflow:hidden;background:#fff}
.iph-sb{position:absolute;left:0;right:0;top:0;height:50px;z-index:6;display:flex;align-items:center;justify-content:space-between;padding:6px 30px 0 34px;font-size:15px;font-weight:600;letter-spacing:-.01em;background:inherit}
.iph-sb span{display:flex;gap:6px;align-items:center}.iph-sb svg{fill:currentColor}
.iph-di{position:absolute;left:50%;top:11px;width:104px;height:30px;margin-left:-52px;border-radius:20px;background:#000;z-index:7}
.iph-hm{position:absolute;left:50%;bottom:7px;width:122px;height:5px;margin-left:-61px;border-radius:3px;background:#111;z-index:7}
.iph-in{position:absolute;inset:50px 0 0 0;overflow:hidden}
.iph-gl{position:absolute;inset:4px;border-radius:56px;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 32%)}
.iph-scr>.iph-in>img{width:100%;height:100%;object-fit:cover;object-position:top}
.iph-site .iph-in{inset:0}.iph-site .iph-sb{background:transparent;color:#fff;mix-blend-mode:difference}
.app-bar{position:absolute;left:0;right:0;bottom:0;height:72px;padding:10px 22px 26px;display:flex;justify-content:space-between;align-items:center;background:#fff;border-top:1px solid #dbdbdb;z-index:5}
.app-me{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid #000}
/* instagram */
.ig2{font-size:13px;line-height:1.35;color:#000;height:100%}
.ig2-nav{display:flex;align-items:center;gap:10px;padding:4px 14px 8px}.ig2-nav b{flex:1;font-size:17px;font-weight:700;letter-spacing:-.01em}.ig2-nav span{display:flex;gap:16px}
.ig2-top{display:flex;align-items:center;gap:22px;padding:6px 14px 10px}
.ig2-ring{flex:none;padding:3px;border-radius:50%;background:linear-gradient(45deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5)}
.ig2-av{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:3px solid #fff}
.ig2-st{flex:1;display:flex;justify-content:space-between;text-align:center}.ig2-st b{display:block;font-size:16px;font-weight:700}.ig2-st span{font-size:13px}
.ig2-bio{padding:0 14px}.ig2-bio b{display:block;font-weight:600}.ig2-cat{display:block;color:#737373}.ig2-bio p{margin:0}
.ig2-bio a{display:inline-flex;align-items:center;gap:4px;color:#00376b;font-weight:600}
.ig2-btns{display:flex;gap:6px;padding:12px 14px 4px}.ig2-btns i{flex:1;font-style:normal;text-align:center;font-weight:600;font-size:13px;padding:7px 0;border-radius:8px;background:#efefef}
.ig2-btns i.f{background:#0095f6;color:#fff}.ig2-btns i.sq{flex:0 0 34px;display:flex;align-items:center;justify-content:center}
.ig2-hls{display:flex;gap:14px;padding:12px 14px 10px;overflow:hidden}
.ig-h{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12px;flex:none;width:62px}
.ig-h i{width:60px;height:60px;border-radius:50%;border:1px solid #dbdbdb;padding:3px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#fff}
.ig-h i img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.ig2-tabs,.tt2-tabs{display:flex;border-top:1px solid #dbdbdb}.ig2-tabs span,.tt2-tabs span{flex:1;display:flex;justify-content:center;padding:9px 0;color:#8e8e8e}
.ig2-tabs span.on,.tt2-tabs span.on{color:#000;box-shadow:inset 0 -1.5px 0 #000}
.ig2-grid,.tt2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px}
.g-t{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;overflow:hidden;background:#eee}
.g-t img{width:100%;height:100%;object-fit:cover}
.g-t em{position:absolute;right:6px;top:6px;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}.g-t em svg{width:16px;height:16px}
.g-txt{padding:10px;font-size:15px;line-height:1.1;color:#fff;text-align:center}
/* tiktok */
.tt2{font-size:13px;line-height:1.35;color:#161823;height:100%;background:#fff}
.tt2-nav{display:flex;align-items:center;gap:10px;padding:4px 14px 6px}.tt2-nav b{flex:1;text-align:center;font-size:17px;font-weight:700}.tt2-nav span{display:flex;gap:14px}
.tt2-head{display:flex;flex-direction:column;align-items:center;text-align:center;padding:4px 18px 10px}
.tt2-av{width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.tt2-head>b{margin:10px 0 12px;font-size:16px;font-weight:600}
.tt2-st{display:flex;gap:26px;margin-bottom:14px}.tt2-st b{display:block;font-size:17px;font-weight:700}.tt2-st span{font-size:12.5px;color:#73747b}
.tt2-btns{display:flex;gap:6px}.tt2-btns i{font-style:normal;font-weight:600;font-size:14px;padding:10px 26px;border-radius:4px;background:#f1f1f2}
.tt2-btns i.f{background:#fe2c55;color:#fff;padding:10px 40px}.tt2-btns i.sq{padding:10px 10px;display:flex;align-items:center}
.tt2-head p{margin:12px 0 4px}.tt2-head a{display:inline-flex;align-items:center;gap:4px;font-weight:600}
.tt2-grid .g-t small{position:absolute;left:6px;bottom:5px;display:flex;align-items:center;gap:3px;color:#fff;font-size:12px;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.tt2-grid .g-t small svg{fill:#fff;stroke:none}
.tt2-grid .pin{left:6px;right:auto;top:6px;background:#fe2c55;color:#fff;font-style:normal;font-size:11px;font-weight:600;padding:2px 5px;border-radius:3px;filter:none}
.tt2-bar{padding:6px 14px 24px;height:78px}.tt2-bar span{display:flex;flex-direction:column;align-items:center;gap:1px;color:#8a8b91;font-size:10px}
.tt2-bar span.on{color:#000}.tt2-bar small{font-size:10px}
.tt2-plus i{display:block;width:44px;height:29px;border-radius:8px;background:#000;box-shadow:-3px 0 0 #25f4ee,3px 0 0 #fe2c55;position:relative}
.tt2-plus i::before,.tt2-plus i::after{content:"";position:absolute;left:50%;top:50%;background:#fff;transform:translate(-50%,-50%)}
.tt2-plus i::before{width:14px;height:2.5px}.tt2-plus i::after{width:2.5px;height:14px}
.socials{display:flex;gap:44px;justify-content:center;flex-wrap:wrap;align-items:flex-start}
@media (max-width:760px){.socials .iph{--w:300px}.socials{gap:28px}.iph{--w:300px}}
.shot-m2{position:absolute;right:-10px;bottom:-60px;transform:scale(.62);transform-origin:100% 100%;filter:drop-shadow(0 30px 40px rgba(0,0,0,.2))}
@media (max-width:860px){.shot-m2{transform:scale(.4);bottom:-30px;right:0}}
@media (max-width:560px){.shot-m2{transform:scale(.3)}}
.bp-name{display:grid;grid-template-columns:1.1fr 1fr;gap:6%;align-items:center;padding:0 7%;aspect-ratio:16/8;box-sizing:border-box}
.bp>section.bp-name{padding:0 7%}
.nm-k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.55;margin:0 0 18px}
.nm-l h3{font-size:clamp(44px,6vw,96px);line-height:.95;font-weight:400;margin:0 0 22px;letter-spacing:-.01em}
.nm-w{font-size:17px;line-height:1.55;max-width:36ch;margin:0 0 26px;opacity:.85}
.nm-h{display:flex;align-items:center;gap:10px;font-size:13px;opacity:.75;margin:0}.nm-h i{width:8px;height:8px;border-radius:50%}
.nm-r ol{list-style:none;margin:0;padding:0;border-top:1px solid currentColor}
.nm-r li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 0;border-bottom:1px solid color-mix(in srgb,currentColor 25%,transparent)}
.nm-n{font-size:clamp(20px,2vw,30px);opacity:.45;text-decoration:line-through;text-decoration-thickness:1px}
.nm-x{font-size:12px;opacity:.6;text-align:right}
@media (max-width:860px){.bp>section.bp-name{grid-template-columns:1fr;aspect-ratio:auto;padding:36px 24px}.nm-w{font-size:14px}}
.bp{counter-reset:bps}.bp>.bp-s{counter-increment:bps}.bp-no:empty::before{content:counter(bps,decimal-leading-zero)}

/* legal pages */
.legal{max-width:760px;margin:0 0 80px;font-size:16px;line-height:1.7}
.legal h2{font-family:var(--serif);font-weight:400;font-size:26px;margin:44px 0 12px}
.legal p,.legal li{color:var(--ink)}.legal ul{padding-left:20px}.legal li{margin:0 0 8px}
.lg-meta{color:var(--muted);font-size:14px}
mark.todo{background:#fff1a8;color:#5a4a00;padding:1px 6px;border-radius:3px;font-size:.92em}
.foot-legal a{color:inherit;opacity:.7;margin-left:18px}