/* ===== Build.Traffic — core ===== */
:root{
--ink:#08090A;--ink2:#0C0E10;--surf:#121417;--surf2:#171A1D;
--line:rgba(255,255,255,.10);--line2:rgba(255,255,255,.18);
--fg:#EDEBE6;--fg2:rgba(237,235,230,.62);--fg3:rgba(237,235,230,.38);
--acc:#C6F24E;--acc-ink:#0B0D07;--acc2:#FF5C33;
--f-sans:'Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
--f-serif:'Instrument Serif',Georgia,serif;
--f-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
--r:18px;--r-lg:26px;
--pad:clamp(20px,4.4vw,72px);
--max:1420px;
--sec:clamp(84px,10vw,168px);
--ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
.bt-html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
.bt-body{margin:0;background:var(--ink);color:var(--fg);font-family:var(--f-sans);font-size:16px;line-height:1.55;font-weight:400;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.bt-body.is-locked{overflow:hidden}
img,video,svg,iframe{max-width:100%;display:block}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4,h5,p,figure{margin:0}
ul{margin:0;padding:0;list-style:none}
::selection{background:var(--acc);color:var(--acc-ink)}
.bt-body::-webkit-scrollbar{width:9px}
.bt-body::-webkit-scrollbar-track{background:var(--ink)}
.bt-body::-webkit-scrollbar-thumb{background:#2A2E33;border-radius:9px}
.bt-skip{position:fixed;top:-100px;left:16px;z-index:999;background:var(--acc);color:var(--acc-ink);padding:10px 16px;border-radius:8px}
.bt-skip:focus{top:16px}

.bt-wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.bt-sec{padding-block:var(--sec);position:relative}
.bt-grain{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* type */
.bt-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:11px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--fg3)}
.bt-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);flex:none}
.bt-eyebrow--plain::before{display:none}
.bt-h1{font-size:clamp(2.9rem,9.4vw,8.6rem);line-height:.92;letter-spacing:-.045em;font-weight:600}
.bt-h2{font-size:clamp(2.1rem,5.4vw,4.6rem);line-height:1.02;letter-spacing:-.038em;font-weight:600}
.bt-h3{font-size:clamp(1.4rem,2.4vw,2.15rem);line-height:1.12;letter-spacing:-.028em;font-weight:600}
.bt-h4{font-size:clamp(1.12rem,1.5vw,1.4rem);line-height:1.25;letter-spacing:-.02em;font-weight:600}
em,.bt-it{font-family:var(--f-serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.bt-lead{font-size:clamp(1.02rem,1.5vw,1.28rem);line-height:1.6;color:var(--fg2);max-width:62ch}
.bt-mono{font-family:var(--f-mono);font-size:12px;letter-spacing:.04em;color:var(--fg3)}

/* section head */
.bt-shead{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:clamp(38px,5vw,72px)}
.bt-shead__top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:18px}

/* buttons */
.bt-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 28px;border-radius:100px;background:var(--acc);color:var(--acc-ink);font-weight:600;font-size:15px;letter-spacing:-.01em;overflow:hidden;isolation:isolate;transition:color .4s var(--ease),transform .5s var(--ease)}
.bt-btn::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--fg);transform:translateY(101%);border-radius:100px;transition:transform .5s var(--ease)}
.bt-btn:hover::after{transform:translateY(0)}
.bt-btn--sm{padding:11px 20px;font-size:13.5px}
.bt-btn--lg{padding:19px 38px;font-size:16.5px}
.bt-btn--ghost{background:transparent;color:var(--fg);border:1px solid var(--line2)}
.bt-btn--ghost::after{background:var(--acc)}
.bt-btn--ghost:hover{color:var(--acc-ink)}

.bt-copy{display:inline-flex;align-items:center;gap:12px;padding:14px 22px;border:1px solid var(--line);border-radius:100px;font-family:var(--f-mono);font-size:13px;color:var(--fg2);transition:border-color .3s,color .3s}
.bt-copy:hover{border-color:var(--acc);color:var(--fg)}
.bt-copy__hint{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg3)}
.bt-copy.is-done .bt-copy__hint{color:var(--acc)}

/* loader */
.bt-loader{position:fixed;inset:0;z-index:9999;background:var(--ink);display:grid;place-items:center;transition:opacity .6s var(--ease),visibility .6s}
.bt-loader.is-done{opacity:0;visibility:hidden}
.bt-loader__inner{width:min(420px,72vw);text-align:center}
.bt-loader__mark{font-size:clamp(1.5rem,4vw,2.4rem);font-weight:600;letter-spacing:-.04em}
.bt-loader__mark span{color:var(--acc)}
.bt-loader__bar{height:2px;background:var(--line);margin:22px 0 12px;overflow:hidden}
.bt-loader__bar i{display:block;height:100%;width:0;background:var(--acc);transition:width .25s linear}
.bt-loader__num{font-family:var(--f-mono);font-size:12px;color:var(--fg3)}

/* cursor */
.bt-cursor{position:fixed;top:0;left:0;width:12px;height:12px;border-radius:50%;background:var(--acc);pointer-events:none;z-index:9997;transform:translate(-50%,-50%);transition:width .35s var(--ease),height .35s var(--ease),background .3s;mix-blend-mode:difference;display:none}
.bt-cursor.is-on{display:block}
.bt-cursor.is-big{width:78px;height:78px;background:var(--acc)}
.bt-cursor__label{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--acc-ink);opacity:0;transition:opacity .25s}
.bt-cursor.is-big .bt-cursor__label{opacity:1}

/* nav */
.bt-nav{position:fixed;top:0;left:0;right:0;z-index:900;padding:14px 0;transition:transform .5s var(--ease),background .4s,border-color .4s;border-bottom:1px solid transparent}
.bt-nav.is-stuck{background:rgba(8,9,10,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom-color:var(--line)}
.bt-nav.is-hidden{transform:translateY(-105%)}
.bt-nav__in{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad);display:flex;align-items:center;justify-content:space-between;gap:24px}
.bt-logo{display:inline-flex;align-items:center;gap:9px;font-size:17px;font-weight:600;letter-spacing:-.035em}
.bt-logo__dot{width:9px;height:9px;border-radius:50%;background:var(--acc);animation:btPulse 2.6s infinite}
@keyframes btPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.6);opacity:.5}}
.bt-logo__txt em{color:var(--acc);font-family:var(--f-sans);font-style:normal}
.bt-nav__links{display:flex;align-items:center;gap:6px}
.bt-navlink{padding:9px 15px;border-radius:100px;font-size:14.5px;color:var(--fg2);transition:color .3s,background .3s}
.bt-navlink span{position:relative;display:block;overflow:hidden;height:1.2em}
.bt-navlink span::after{content:attr(data-txt);position:absolute;left:0;top:100%;color:var(--acc)}
.bt-navlink span,.bt-navlink span::after{transition:transform .45s var(--ease)}
.bt-navlink:hover{color:var(--fg);background:rgba(255,255,255,.05)}
.bt-navlink:hover span,.bt-navlink:hover span::after{transform:translateY(-100%)}
.bt-nav__right{display:flex;align-items:center;gap:12px}
.bt-burger{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;position:relative}
.bt-burger i{position:absolute;left:13px;width:18px;height:1.5px;background:var(--fg);transition:transform .4s var(--ease),opacity .3s}
.bt-burger i:nth-child(1){top:19px}
.bt-burger i:nth-child(2){top:25px}
.bt-burger.is-open i:nth-child(1){transform:translateY(3px) rotate(45deg)}
.bt-burger.is-open i:nth-child(2){transform:translateY(-3px) rotate(-45deg)}

/* mobile menu */
.bt-menu{position:fixed;inset:0;z-index:880;background:var(--ink2);padding:110px var(--pad) 40px;display:flex;flex-direction:column;justify-content:space-between;clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease);visibility:hidden}
.bt-menu.is-open{clip-path:inset(0 0 0 0);visibility:visible}
.bt-menu__grid{display:flex;flex-direction:column;justify-content:space-between;height:100%;gap:40px}
.bt-menu__nav{display:flex;flex-direction:column;gap:4px}
.bt-menu__nav a{display:flex;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(26px);transition:opacity .5s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i)*.06s + .15s)}
.bt-menu.is-open .bt-menu__nav a{opacity:1;transform:none}
.bt-menu__nav em{font-family:var(--f-mono);font-style:normal;font-size:11px;color:var(--acc)}
.bt-menu__nav span{font-size:clamp(2.2rem,11vw,3.6rem);font-weight:600;letter-spacing:-.04em;line-height:1.05}
.bt-menu__foot{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:22px}
.bt-menu__foot div{display:flex;flex-direction:column;gap:5px}
.bt-menu__foot a{font-size:14px;color:var(--fg2);transition:color .3s}
.bt-menu__foot a:hover{color:var(--acc)}

@media(max-width:1024px){
.bt-nav__links{display:none}
.bt-burger{display:block}
.bt-nav__right .bt-btn{display:none}
}

/* reveal */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal-d="1"]{transition-delay:.08s}[data-reveal-d="2"]{transition-delay:.16s}
[data-reveal-d="3"]{transition-delay:.24s}[data-reveal-d="4"]{transition-delay:.32s}
[data-reveal-d="5"]{transition-delay:.4s}[data-reveal-d="6"]{transition-delay:.48s}
.bt-split .w{display:inline-block;overflow:hidden;vertical-align:top}
.bt-split .w i{display:inline-block;font-style:inherit;transform:translateY(105%);transition:transform .95s var(--ease);transition-delay:calc(var(--wi)*.035s)}
.bt-split.is-in .w i{transform:none}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
[data-reveal]{opacity:1;transform:none}
.bt-split .w i{transform:none}
}

/* ===== hero ===== */
.bt-hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding-top:150px;padding-bottom:0;overflow:hidden}
.bt-hero__orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;pointer-events:none}
.bt-hero__orb--1{width:46vw;height:46vw;background:radial-gradient(circle,rgba(198,242,78,.30),transparent 68%);top:-14vw;right:-8vw;animation:btFloat 16s ease-in-out infinite}
.bt-hero__orb--2{width:38vw;height:38vw;background:radial-gradient(circle,rgba(255,92,51,.20),transparent 68%);bottom:-10vw;left:-10vw;animation:btFloat 20s ease-in-out infinite reverse}
@keyframes btFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(-4%,6%)}}
.bt-hero__grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:clamp(60px,7vw,110px) clamp(60px,7vw,110px);mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 20%,transparent 78%);opacity:.5;pointer-events:none}
.bt-hero__in{position:relative;z-index:2;width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.bt-hero__top{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:clamp(26px,4vw,52px)}
.bt-hero__intro{max-width:34ch;font-size:clamp(.98rem,1.25vw,1.14rem);color:var(--fg2);line-height:1.5}
.bt-hero__meta{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.bt-hero__time{font-family:var(--f-mono);font-size:13px;color:var(--fg2)}
.bt-hero__title{font-size:clamp(3rem,10.4vw,9.4rem);line-height:.9;letter-spacing:-.05em;font-weight:600}
.bt-hero__title .l{display:block}
.bt-hero__chip{display:inline-flex;align-items:center;vertical-align:middle;height:.72em;aspect-ratio:16/9;border-radius:100px;overflow:hidden;margin:0 .12em;transform:translateY(-.06em);border:1px solid var(--line2);background:var(--surf)}
.bt-hero__chip img,.bt-hero__chip video{width:100%;height:100%;object-fit:cover}
.bt-hero__actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:clamp(28px,3.6vw,46px)}
.bt-hero__bottom{margin-top:clamp(40px,5vw,74px);border-top:1px solid var(--line);padding:16px 0 22px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.bt-scroll{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg3)}
.bt-scroll i{width:1px;height:26px;background:linear-gradient(var(--acc),transparent);display:block;animation:btScroll 1.8s infinite}
@keyframes btScroll{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* marquee */
.bt-marquee{overflow:hidden;border-block:1px solid var(--line);padding:16px 0;display:flex;gap:0;white-space:nowrap;user-select:none;background:var(--ink2)}
.bt-marquee__row{display:flex;align-items:center;gap:38px;padding-right:38px;animation:btMarq 34s linear infinite;flex:none}
.bt-marquee:hover .bt-marquee__row{animation-play-state:paused}
.bt-marquee--rev .bt-marquee__row{animation-direction:reverse}
@keyframes btMarq{to{transform:translateX(-100%)}}
.bt-marquee__i{display:inline-flex;align-items:center;gap:38px;font-size:clamp(1.1rem,2.1vw,1.7rem);font-weight:500;letter-spacing:-.03em;color:var(--fg2)}
.bt-marquee__i::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--acc);flex:none}
.bt-marquee--big .bt-marquee__i{font-size:clamp(2rem,5.4vw,4.4rem);font-weight:600;color:var(--fg)}

/* stats */
.bt-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.bt-stat{background:var(--ink);padding:clamp(24px,3vw,40px)}
.bt-stat__n{font-size:clamp(2.4rem,5vw,4.2rem);font-weight:600;letter-spacing:-.05em;line-height:1;color:var(--fg)}
.bt-stat__n em{color:var(--acc)}
.bt-stat__l{margin-top:10px;font-size:14px;color:var(--fg2);max-width:22ch}
@media(max-width:860px){.bt-stats{grid-template-columns:repeat(2,1fr)}}

/* work cards */
.bt-works{display:flex;flex-direction:column;gap:clamp(26px,3.4vw,54px)}
.bt-work{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,3vw,52px);align-items:center;padding:clamp(22px,2.6vw,40px);border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(180deg,var(--surf),var(--ink2));overflow:hidden;transition:border-color .5s var(--ease),transform .6s var(--ease)}
.bt-work::before{content:"";position:absolute;inset:0;background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--ac,#C6F24E) 12%,transparent),transparent 62%);opacity:0;transition:opacity .5s;pointer-events:none}
.bt-work:hover::before{opacity:1}
.bt-work:hover{border-color:var(--line2)}
.bt-work:nth-child(even){grid-template-columns:.95fr 1.05fr}
.bt-work:nth-child(even) .bt-work__media{order:-1}
.bt-work__idx{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;color:var(--ac,var(--acc))}
.bt-work__title{font-size:clamp(1.9rem,3.6vw,3.1rem);font-weight:600;letter-spacing:-.04em;line-height:1.04;margin:12px 0 12px}
.bt-work__desc{color:var(--fg2);font-size:clamp(.95rem,1.1vw,1.04rem);max-width:46ch}
.bt-work__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.bt-tag{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;padding:7px 13px;border:1px solid var(--line);border-radius:100px;color:var(--fg2)}
.bt-work__metrics{display:flex;gap:clamp(18px,2.4vw,34px);margin-top:24px;flex-wrap:wrap}
.bt-work__metric b{display:block;font-size:clamp(1.3rem,2.2vw,1.9rem);font-weight:600;letter-spacing:-.04em;color:var(--ac,var(--acc))}
.bt-work__metric span{font-size:12px;color:var(--fg3)}
.bt-work__links{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.bt-work__media{position:relative;perspective:1400px}
.bt-browser{border-radius:14px;overflow:hidden;border:1px solid var(--line2);background:var(--surf2);box-shadow:0 30px 70px -30px rgba(0,0,0,.85);transform:rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg));transition:transform .5s var(--ease)}
.bt-browser__bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#1B1F23;border-bottom:1px solid var(--line)}
.bt-browser__bar i{width:8px;height:8px;border-radius:50%;background:#3A4046}
.bt-browser__url{margin-left:10px;flex:1;height:20px;border-radius:100px;background:#111417;display:flex;align-items:center;padding:0 12px;font-family:var(--f-mono);font-size:10px;color:var(--fg3);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.bt-browser__shot{aspect-ratio:16/10;overflow:hidden;background:#0D0F11}
.bt-browser__shot img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.2s var(--ease)}
.bt-work:hover .bt-browser__shot img{transform:scale(1.035)}
.bt-phone{position:absolute;right:-2%;bottom:-9%;width:23%;min-width:96px;border-radius:16px;overflow:hidden;border:2px solid #24282C;background:#0D0F11;box-shadow:0 24px 50px -18px rgba(0,0,0,.9);transition:transform .6s var(--ease)}
.bt-work:hover .bt-phone{transform:translateY(-8px)}
.bt-phone img{width:100%;aspect-ratio:9/19;object-fit:cover;object-position:top center}
.bt-work--offline .bt-browser__shot{display:grid;place-items:center;aspect-ratio:16/10}
.bt-offline{text-align:center;padding:30px;color:var(--fg3)}
.bt-offline b{display:block;font-size:clamp(1.4rem,2.6vw,2.2rem);color:var(--fg2);letter-spacing:-.03em;font-weight:600}
@media(max-width:900px){
.bt-work,.bt-work:nth-child(even){grid-template-columns:1fr}
.bt-work:nth-child(even) .bt-work__media{order:0}
.bt-work__media{margin-top:8px}
.bt-phone{width:26%;right:2%;bottom:-6%}
}

/* ===== video rail ===== */
.bt-vid{background:var(--ink2);border-block:1px solid var(--line)}
.bt-vid__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,3.4vw,50px)}
.bt-rail{position:relative}
.bt-rail__track{display:flex;gap:clamp(14px,1.6vw,24px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:6px var(--pad) 26px;margin-inline:calc(var(--pad)*-1);scrollbar-width:none;cursor:grab}
.bt-rail__track::-webkit-scrollbar{display:none}
.bt-rail__track.is-drag{cursor:grabbing;scroll-snap-type:none}
.bt-vcard{flex:0 0 auto;scroll-snap-align:center;width:clamp(220px,25vw,310px);border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--surf);position:relative;transition:border-color .4s,transform .5s var(--ease)}
.bt-vcard--wide{width:clamp(320px,44vw,560px)}
.bt-vcard:hover{border-color:var(--acc);transform:translateY(-6px)}
.bt-vcard__frame{position:relative;width:100%;aspect-ratio:var(--ar,9/16);background:#0D0F11;overflow:hidden}
.bt-vcard__frame img,.bt-vcard__frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bt-vcard__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,9,10,.05) 40%,rgba(8,9,10,.82));pointer-events:none}
.bt-vcard__ph{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(140deg,#16191C,#0C0E10);color:var(--fg3);font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.bt-vcard__play{position:absolute;left:16px;bottom:16px;z-index:3;width:46px;height:46px;border-radius:50%;background:var(--acc);display:grid;place-items:center;transition:transform .45s var(--ease)}
.bt-vcard__play svg{width:14px;height:14px;fill:var(--acc-ink);margin-left:2px}
.bt-vcard:hover .bt-vcard__play{transform:scale(1.12)}
.bt-vcard__meta{position:absolute;left:16px;right:16px;bottom:18px;z-index:3;padding-left:60px}
.bt-vcard__cli{font-size:14.5px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.bt-vcard__cat{font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc)}
.bt-vcard__tag{position:absolute;top:14px;left:14px;z-index:3;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:6px 11px;border-radius:100px;background:rgba(8,9,10,.6);backdrop-filter:blur(8px);border:1px solid var(--line);color:var(--fg2)}
.bt-rail__ui{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:8px}
.bt-rail__bar{flex:1;height:2px;background:var(--line);position:relative;overflow:hidden;border-radius:2px}
.bt-rail__bar i{position:absolute;left:0;top:0;height:100%;width:22%;background:var(--acc);border-radius:2px;transition:transform .12s linear}
.bt-rail__btns{display:flex;gap:8px}
.bt-rail__btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:background .3s,color .3s,border-color .3s}
.bt-rail__btn:hover{background:var(--acc);color:var(--acc-ink);border-color:var(--acc)}
.bt-rail__btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}
.bt-rail__hint{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3);white-space:nowrap}
.bt-empty{border:1px dashed var(--line2);border-radius:var(--r-lg);padding:clamp(34px,5vw,64px);text-align:center;color:var(--fg2)}
.bt-empty b{display:block;color:var(--fg);font-size:1.2rem;margin-bottom:8px;letter-spacing:-.02em}

/* lightbox */
.bt-lightbox{position:fixed;inset:0;z-index:9990;background:rgba(6,7,8,.94);backdrop-filter:blur(14px);display:grid;place-items:center;padding:clamp(16px,4vw,60px);opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s}
.bt-lightbox.is-open{opacity:1;visibility:visible}
.bt-lightbox__stage{width:min(100%,1100px);max-height:88svh;display:grid;place-items:center}
.bt-lightbox__stage>*{border-radius:16px;overflow:hidden;background:#000;max-height:88svh}
.bt-lightbox__stage iframe,.bt-lightbox__stage video{width:auto;height:88svh;max-width:100%;aspect-ratio:var(--ar,9/16);border:0}
.bt-lightbox__stage .bt-lb-wide{aspect-ratio:16/9;height:auto;width:min(100%,1100px)}
.bt-lightbox__close{position:absolute;top:clamp(14px,3vw,32px);right:clamp(14px,3vw,32px);width:48px;height:48px;border-radius:50%;border:1px solid var(--line2);font-size:26px;line-height:1;display:grid;place-items:center;transition:background .3s,color .3s}
.bt-lightbox__close:hover{background:var(--acc);color:var(--acc-ink)}

/* services stack */
.bt-svcs{display:flex;flex-direction:column;gap:18px}
.bt-svc{position:sticky;top:calc(88px + var(--i,0)*14px);border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(150deg,var(--surf2),var(--ink2));padding:clamp(26px,3.4vw,54px);display:grid;grid-template-columns:auto 1fr auto;gap:clamp(20px,3vw,52px);align-items:start;overflow:hidden}
.bt-svc__n{font-family:var(--f-mono);font-size:12px;color:var(--acc);letter-spacing:.14em}
.bt-svc__t{font-size:clamp(1.5rem,3vw,2.5rem);font-weight:600;letter-spacing:-.04em;line-height:1.05}
.bt-svc__d{margin-top:14px;color:var(--fg2);max-width:52ch;font-size:clamp(.95rem,1.1vw,1.05rem)}
.bt-svc__list{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.bt-svc__art{width:clamp(90px,10vw,140px);aspect-ratio:1;border-radius:20px;background:radial-gradient(circle at 30% 25%,rgba(198,242,78,.35),transparent 62%),linear-gradient(160deg,#1A1E22,#0E1113);border:1px solid var(--line);display:grid;place-items:center;flex:none}
.bt-svc__art svg{width:46%;height:46%;stroke:var(--acc);fill:none;stroke-width:1.2}
@media(max-width:880px){.bt-svc{grid-template-columns:1fr;position:relative;top:auto}.bt-svc__art{display:none}}

/* process */
.bt-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px);counter-reset:s}
.bt-step{border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.8vw,40px);background:var(--ink2);position:relative;overflow:hidden;transition:border-color .4s,transform .5s var(--ease)}
.bt-step:hover{border-color:var(--acc);transform:translateY(-5px)}
.bt-step__n{font-family:var(--f-serif);font-style:italic;font-size:clamp(2.6rem,5vw,4rem);color:var(--acc);line-height:1}
.bt-step h3{margin:14px 0 10px;font-size:clamp(1.15rem,1.7vw,1.5rem);font-weight:600;letter-spacing:-.03em}
.bt-step p{color:var(--fg2);font-size:.97rem}
@media(max-width:860px){.bt-steps{grid-template-columns:1fr}}

/* testimonials */
.bt-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.bt-quote{border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.6vw,38px);background:var(--ink2);display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.bt-quote p{font-size:clamp(1.02rem,1.35vw,1.2rem);line-height:1.5;letter-spacing:-.02em}
.bt-quote footer{display:flex;flex-direction:column;gap:2px}
.bt-quote b{font-size:14.5px;font-weight:600}
.bt-quote span{font-size:12.5px;color:var(--fg3)}
.bt-quote::before{content:"“";font-family:var(--f-serif);font-size:4rem;line-height:.6;color:var(--acc);display:block}
@media(max-width:900px){.bt-quotes{grid-template-columns:1fr}}

/* faq */
.bt-faq{border-top:1px solid var(--line)}
.bt-faq__i{border-bottom:1px solid var(--line)}
.bt-faq__q{width:100%;display:flex;align-items:center;gap:20px;padding:clamp(20px,2.4vw,30px) 0;text-align:left;font-size:clamp(1.05rem,1.8vw,1.5rem);font-weight:500;letter-spacing:-.03em;transition:color .3s}
.bt-faq__q:hover{color:var(--acc)}
.bt-faq__q em{font-family:var(--f-mono);font-style:normal;font-size:11px;color:var(--fg3);flex:none;width:26px}
.bt-faq__q i{margin-left:auto;width:16px;height:16px;position:relative;flex:none}
.bt-faq__q i::before,.bt-faq__q i::after{content:"";position:absolute;background:currentColor;transition:transform .4s var(--ease)}
.bt-faq__q i::before{top:50%;left:0;width:100%;height:1.5px;transform:translateY(-50%)}
.bt-faq__q i::after{left:50%;top:0;height:100%;width:1.5px;transform:translateX(-50%)}
.bt-faq__i.is-open .bt-faq__q i::after{transform:translateX(-50%) scaleY(0)}
.bt-faq__a{overflow:hidden;height:0;transition:height .5s var(--ease)}
.bt-faq__a div{padding:0 0 26px 46px;color:var(--fg2);max-width:70ch}
@media(max-width:640px){.bt-faq__a div{padding-left:0}}

/* ===== cta + footer ===== */
.bt-cta{padding-block:clamp(80px,9vw,150px);text-align:center;position:relative;overflow:hidden;border-top:1px solid var(--line);background:radial-gradient(ellipse 70% 100% at 50% 100%,rgba(198,242,78,.12),transparent 70%)}
.bt-cta__title{font-size:clamp(2.3rem,7.4vw,6.2rem);line-height:.98;letter-spacing:-.05em;font-weight:600;margin:18px auto 0;max-width:16ch}
.bt-cta__sub{margin:22px auto 0;color:var(--fg2);max-width:52ch;font-size:clamp(.98rem,1.2vw,1.1rem)}
.bt-cta__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.bt-footer{border-top:1px solid var(--line);padding-top:clamp(50px,6vw,86px);background:var(--ink)}
.bt-footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(26px,3vw,48px)}
.bt-footer__col{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.bt-footer__col a{font-size:14.5px;color:var(--fg2);transition:color .3s,transform .3s}
.bt-footer__col a:hover{color:var(--acc);transform:translateX(3px)}
.bt-footer__lead{font-size:clamp(1.05rem,1.6vw,1.35rem);letter-spacing:-.025em;max-width:30ch;line-height:1.35}
.bt-footer__clock{margin-top:20px;display:flex;flex-direction:column;gap:4px;font-family:var(--f-mono);font-size:13px;color:var(--fg2)}
.bt-footer__mark{font-size:clamp(3.4rem,15.5vw,15rem);font-weight:600;letter-spacing:-.06em;line-height:.85;margin-top:clamp(40px,5vw,80px);color:transparent;-webkit-text-stroke:1px rgba(237,235,230,.16);text-align:center;white-space:nowrap}
.bt-footer__mark em{color:var(--acc);-webkit-text-stroke:0;font-family:var(--f-sans);font-style:normal}
.bt-footer__base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:clamp(26px,3vw,44px);padding:22px 0 26px;font-size:12.5px;color:var(--fg3)}
@media(max-width:900px){.bt-footer__grid{grid-template-columns:1fr 1fr}.bt-footer__col--lead{grid-column:1/-1}}

/* ===== page heads ===== */
.bt-phead{padding-top:clamp(140px,15vw,210px);padding-bottom:clamp(40px,5vw,72px);position:relative;overflow:hidden}
.bt-phead__orb{position:absolute;width:44vw;height:44vw;border-radius:50%;filter:blur(100px);background:radial-gradient(circle,rgba(198,242,78,.20),transparent 68%);top:-18vw;right:-12vw;pointer-events:none}
.bt-phead h1{font-size:clamp(2.6rem,8.2vw,6.6rem);line-height:.94;letter-spacing:-.05em;font-weight:600;margin:16px 0 0;max-width:18ch}
.bt-phead p{margin-top:24px}
.bt-crumb{display:flex;gap:8px;align-items:center;font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3)}

/* grid list (work index) */
.bt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2vw,30px)}
.bt-card{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--ink2);display:flex;flex-direction:column;transition:border-color .45s,transform .55s var(--ease)}
.bt-card:hover{border-color:var(--line2);transform:translateY(-6px)}
.bt-card__shot{aspect-ratio:16/10;overflow:hidden;background:#0D0F11;position:relative}
.bt-card__shot img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform 1.1s var(--ease)}
.bt-card:hover .bt-card__shot img{transform:scale(1.05)}
.bt-card__body{padding:clamp(20px,2.2vw,30px);display:flex;flex-direction:column;gap:12px;flex:1}
.bt-card__row{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.bt-card__t{font-size:clamp(1.2rem,2vw,1.7rem);font-weight:600;letter-spacing:-.03em}
.bt-card__s{font-family:var(--f-mono);font-size:11px;color:var(--fg3);letter-spacing:.08em;text-transform:uppercase}
.bt-card__d{color:var(--fg2);font-size:.95rem}
@media(max-width:820px){.bt-grid{grid-template-columns:1fr}}

/* split rows (about/experience) */
.bt-rows{border-top:1px solid var(--line)}
.bt-row{display:grid;grid-template-columns:180px 1fr auto;gap:clamp(16px,3vw,44px);padding:clamp(22px,2.6vw,34px) 0;border-bottom:1px solid var(--line);align-items:start;transition:background .4s,padding-inline .4s var(--ease)}
.bt-row:hover{background:rgba(255,255,255,.025)}
.bt-row__k{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg3);padding-top:6px}
.bt-row__t{font-size:clamp(1.15rem,1.9vw,1.55rem);font-weight:600;letter-spacing:-.03em}
.bt-row__d{margin-top:8px;color:var(--fg2);max-width:62ch;font-size:.97rem}
.bt-row__x{font-family:var(--f-mono);font-size:11.5px;color:var(--fg3);white-space:nowrap;padding-top:6px}
@media(max-width:820px){.bt-row{grid-template-columns:1fr;gap:8px}.bt-row__x{padding-top:0}}

/* pills */
.bt-pills{display:flex;flex-wrap:wrap;gap:9px}
.bt-pill{font-size:13.5px;padding:9px 16px;border:1px solid var(--line);border-radius:100px;color:var(--fg2);transition:border-color .3s,color .3s,background .3s}
.bt-pill:hover,.bt-pill.is-on{border-color:var(--acc);color:var(--acc-ink);background:var(--acc)}

/* form */
.bt-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.bt-field{display:flex;flex-direction:column;gap:8px}
.bt-field--full{grid-column:1/-1}
.bt-field label{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3)}
.bt-field input,.bt-field textarea,.bt-field select{width:100%;background:var(--ink2);border:1px solid var(--line);border-radius:12px;padding:15px 17px;color:var(--fg);font-family:var(--f-sans);font-size:15.5px;transition:border-color .3s,background .3s}
.bt-field textarea{min-height:150px;resize:vertical}
.bt-field input:focus,.bt-field textarea:focus,.bt-field select:focus{outline:none;border-color:var(--acc);background:#101315}
.bt-field input::placeholder,.bt-field textarea::placeholder{color:var(--fg3)}
.bt-form .wpcf7-not-valid-tip{color:var(--acc2);font-size:12.5px;font-family:var(--f-mono)}
.wpcf7-response-output{grid-column:1/-1;border:1px solid var(--line)!important;border-radius:12px;padding:14px 18px!important;margin:0!important;font-size:14px;color:var(--fg2)}
.wpcf7-spinner{filter:invert(1)}
@media(max-width:760px){.bt-form{grid-template-columns:1fr}}

/* contact split */
.bt-contact{display:grid;grid-template-columns:1fr .85fr;gap:clamp(28px,4vw,72px);align-items:start}
.bt-contact__aside{display:flex;flex-direction:column;gap:26px;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.8vw,40px);background:var(--ink2);position:sticky;top:100px}
.bt-contact__item{display:flex;flex-direction:column;gap:6px}
.bt-contact__item a{font-size:clamp(1rem,1.5vw,1.2rem);letter-spacing:-.02em;transition:color .3s}
.bt-contact__item a:hover{color:var(--acc)}
@media(max-width:900px){.bt-contact{grid-template-columns:1fr}.bt-contact__aside{position:relative;top:auto}}

/* case study body */
.bt-case{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,56px)}
.bt-case__block h3{font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:600;letter-spacing:-.03em;margin-bottom:12px}
.bt-case__block p{color:var(--fg2);font-size:.99rem}
@media(max-width:820px){.bt-case{grid-template-columns:1fr}}
.bt-shot{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#0D0F11}
.bt-shot img{width:100%;display:block}
.bt-prose{color:var(--fg2);max-width:72ch}
.bt-prose p{margin-bottom:1.1em}
.bt-prose h2,.bt-prose h3{color:var(--fg);letter-spacing:-.03em;margin:1.6em 0 .5em}

/* ig embed */
.bt-ig{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,22px)}
.bt-ig iframe{width:100%;aspect-ratio:9/14;border:1px solid var(--line);border-radius:18px;background:#0D0F11}
@media(max-width:900px){.bt-ig{grid-template-columns:1fr}}
.bt-note{font-family:var(--f-mono);font-size:11.5px;color:var(--fg3);letter-spacing:.04em}

/* ===== hero floating stack ===== */
.bt-hero__stack{position:absolute;top:16vh;right:calc(var(--pad) - 10px);width:min(38vw,560px);z-index:1;pointer-events:none;transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .8s var(--ease)}
.bt-hero__card{position:absolute;top:0;right:0;margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line2);background:#0D0F11;box-shadow:0 40px 90px -40px rgba(0,0,0,.95);width:100%;aspect-ratio:16/10;opacity:0;animation:btCardIn 1.1s var(--ease) forwards;animation-delay:calc(.5s + var(--d)*.14s)}
.bt-hero__card img{width:100%;height:100%;object-fit:cover;object-position:top center}
.bt-hero__card--1{transform:translate(0,0) rotate(-7deg) scale(.86)}
.bt-hero__card--2{transform:translate(5%,9%) rotate(-1deg) scale(.93)}
.bt-hero__card--3{transform:translate(10%,19%) rotate(5deg) scale(1)}
@keyframes btCardIn{from{opacity:0;translate:0 40px}to{opacity:1;translate:0 0}}
.bt-hero__stack::after{content:"";position:absolute;inset:-14% -10% -34% -10%;background:radial-gradient(ellipse at 50% 60%,transparent 42%,var(--ink) 78%);pointer-events:none}
@media(max-width:1180px){.bt-hero__stack{display:none}}

/* hero density tune */
.bt-hero{min-height:96svh}
@media(min-width:1181px){.bt-hero__top{margin-bottom:clamp(40px,7vw,96px)}}

/* phone mockup must never clip */
.bt-work{padding-bottom:clamp(30px,3.4vw,54px)}
.bt-work__media{padding-bottom:6%}
.bt-phone{bottom:0;right:0}
@media(max-width:900px){.bt-work__media{padding-bottom:9%}.bt-phone{right:2%}}

/* video rail: keep 9:16 reels honest, stop any stretch */
.bt-vcard__frame img,.bt-vcard__frame video{object-fit:cover;object-position:center}

/* focus states */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}

/* ===== hero stack + bottom bar corrections ===== */
.bt-hero__stack{top:13vh;right:var(--pad);width:min(34vw,470px)}
.bt-hero__card--1{transform:translate(-14%,-4%) rotate(-8deg) scale(.84)}
.bt-hero__card--2{transform:translate(-7%,6%) rotate(-3deg) scale(.92)}
.bt-hero__card--3{transform:translate(0,16%) rotate(3deg) scale(1)}
.bt-hero__bottom{flex-wrap:wrap;row-gap:12px}
.bt-hero__meta{flex-direction:row;align-items:center;gap:14px;display:flex;flex-wrap:wrap}
.bt-hero__bottom .bt-hero__time{font-family:var(--f-mono);font-size:12px;color:var(--fg2)}
@media(max-width:760px){
.bt-hero__creds{display:none}
.bt-hero__bottom{justify-content:space-between}
}
@media(max-width:1180px){.bt-hero{min-height:auto;padding-top:130px;padding-bottom:0}}

/* ===== mobile polish ===== */
@media(max-width:760px){
:root{--sec:clamp(64px,13vw,96px)}
.bt-hero__title{font-size:clamp(2.9rem,13.6vw,4.6rem);letter-spacing:-.045em}
.bt-hero__actions{gap:10px}
.bt-hero__actions .bt-btn{flex:1 1 100%;justify-content:center}
.bt-hero__actions .bt-copy{flex:1 1 100%;justify-content:center}
.bt-work{padding:18px}
.bt-work__links .bt-btn{flex:1 1 auto;justify-content:center}
.bt-stats{border-radius:18px}
.bt-quote{padding:22px}
.bt-cta__actions .bt-btn,.bt-cta__actions .bt-copy{width:100%;justify-content:center}
.bt-footer__mark{font-size:15.5vw}
.bt-rail__hint{display:none}
.bt-vcard{width:min(72vw,270px)}
.bt-vcard--wide{width:min(88vw,420px)}
.bt-shead__top{align-items:flex-start;flex-direction:column;gap:14px}
}
@media(max-width:420px){
.bt-work__metrics{gap:16px}
.bt-work__metric b{font-size:1.25rem}
}

/* tablet */
@media(min-width:761px) and (max-width:1180px){
.bt-work__media{max-width:70%;margin-inline:auto}
.bt-quotes{grid-template-columns:1fr 1fr}
.bt-quotes .bt-quote:last-child{grid-column:1/-1}
}

/* long-word safety */
.bt-h1,.bt-h2,.bt-hero__title,.bt-work__title,.bt-cta__title,.bt-phead h1{overflow-wrap:break-word}

/* ===== overflow guards ===== */
html.bt-html{overflow-x:hidden;max-width:100%}
.bt-body{overflow-x:clip;max-width:100vw}
.bt-main,.bt-footer,.bt-cta,.bt-nav{max-width:100vw}
.bt-footer__mark{max-width:100%;overflow:hidden}
@media(max-width:760px){
.bt-footer__mark{white-space:normal;font-size:14vw;line-height:.95;-webkit-text-stroke-width:.7px}
.bt-hero__creds{display:none}
.bt-hero__bottom{gap:10px}
}
.bt-hero,.bt-phead{max-width:100vw;overflow-x:clip}

/* ===== loader: never trap the page ===== */
.bt-loader{animation:btLoaderOut .5s var(--ease) 2.4s forwards}
@keyframes btLoaderOut{to{opacity:0;visibility:hidden;pointer-events:none}}
.bt-loader.is-done{animation:none}
@media(prefers-reduced-motion:reduce){.bt-loader{display:none}}

/* ===== Contact Form 7 (we ship our own styles) ===== */
.screen-reader-response{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.wpcf7 form .wpcf7-response-output{display:none}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output{display:block}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--acc)!important;color:var(--fg)}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output{border-color:var(--acc2)!important}
.wpcf7-form-control-wrap{display:block;width:100%}
.wpcf7-not-valid-tip{display:block;margin-top:6px;color:var(--acc2);font-family:var(--f-mono);font-size:12px}
.wpcf7-spinner{display:inline-block;margin-left:12px;vertical-align:middle;width:20px;height:20px;border-radius:50%;border:2px solid var(--line2);border-top-color:var(--acc);background:none!important;animation:btSpin .8s linear infinite;visibility:hidden}
.wpcf7-spinner.is-active,form.submitting .wpcf7-spinner{visibility:visible}
@keyframes btSpin{to{transform:rotate(360deg)}}
.bt-field select{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EDEBE6' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;background-size:16px;cursor:pointer}
.bt-field select option{background:#101315;color:var(--fg)}
.bt-form input[type=submit]{cursor:pointer;border:0}
.bt-form p{margin:0}
.bt-form input[type=submit]{transition:background .35s var(--ease),transform .35s var(--ease)}
.bt-form input[type=submit]:hover{background:var(--fg);transform:translateY(-2px)}
.wpcf7 form .hidden-fields-container,fieldset.hidden-fields-container{display:none!important;border:0!important;margin:0!important;padding:0!important}

/* ===== video card: force block-level so aspect-ratio applies ===== */
.bt-vcard{display:block;padding:0;text-align:left;appearance:none;-webkit-appearance:none}
.bt-vcard__frame{display:block!important;width:100%;aspect-ratio:var(--ar,9/16);position:relative;overflow:hidden;background:#0D0F11}
.bt-vcard__meta{display:block}
.bt-vcard__cli,.bt-vcard__cat{display:block}
.bt-vcard__play{display:grid}
.bt-vcard__tag,.bt-vcard__ph{display:grid}
.bt-vcard__tag{place-items:center}
.bt-rail__track{align-items:stretch}
.bt-vcard__frame>img,.bt-vcard__frame>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* poster treatment so bright first-frames still look on-brand */
.bt-vcard__frame::after{background:linear-gradient(180deg,rgba(8,9,10,.42) 0%,rgba(8,9,10,.12) 38%,rgba(8,9,10,.55) 72%,rgba(8,9,10,.94) 100%)}
.bt-vcard__frame>img{filter:saturate(.92) contrast(1.04) brightness(.96);transition:filter .5s var(--ease),transform 1s var(--ease)}
.bt-vcard:hover .bt-vcard__frame>img{filter:none;transform:scale(1.04)}
.bt-vcard__tag{background:rgba(8,9,10,.72)}

/* ===== hero stack: never collide with the headline ===== */
.bt-hero__in{position:relative;z-index:3}
.bt-hero__stack{z-index:1}
.bt-hero__stack::after{inset:-16% -12% -46% -12%;background:radial-gradient(ellipse at 50% 44%,transparent 34%,rgba(8,9,10,.86) 72%,var(--ink) 92%)}
@media(max-width:1279px){.bt-hero__stack{display:none}}
@media(min-width:1280px){.bt-hero__stack{width:min(30vw,430px);top:12vh}}
@media(min-width:1280px) and (max-height:920px){.bt-hero__stack{width:min(24vw,340px);top:10vh}}
@media(min-width:1280px) and (max-height:800px){.bt-hero__stack{display:none}}
@media(min-width:1700px){.bt-hero__stack{width:min(28vw,500px);top:14vh}}

/* ===== brand mark ===== */
.bt-logo__img{height:26px;width:auto;display:block}
@media(max-width:520px){.bt-logo__img{height:22px}}
.bt-loader__mark img{height:clamp(30px,6vw,48px);width:auto;margin:0 auto;display:block}
.bt-footer__mark i{font-style:normal;color:var(--acc);-webkit-text-stroke:0}
.bt-footer__mark{letter-spacing:-.055em}

/* =====================================================================
   BRAND: orange system (#FF4A17, sampled from the Build.Traffic logo)
   Overrides the earlier lime palette. Later rules win, so this block
   is the single place to retune the accent.
   ===================================================================== */
:root{
--acc:#FF4A17;
--acc-rgb:255,74,23;
--acc-ink:#150A05;      /* dark text on orange: 6.2:1, passes AA */
--acc-soft:#FF8A3D;
--acc2:#FF3D71;         /* errors, kept clearly distinct from the brand */
}

/* glows and gradients */
.bt-hero__orb--1{background:radial-gradient(circle,rgba(255,74,23,.30),transparent 68%)}
.bt-hero__orb--2{background:radial-gradient(circle,rgba(255,150,40,.18),transparent 68%)}
.bt-phead__orb{background:radial-gradient(circle,rgba(255,74,23,.22),transparent 68%)}
.bt-cta{background:radial-gradient(ellipse 70% 100% at 50% 100%,rgba(255,74,23,.14),transparent 70%)}
.bt-svc__art{background:radial-gradient(circle at 30% 25%,rgba(255,74,23,.34),transparent 62%),linear-gradient(160deg,#1A1E22,#0E1113)}
.bt-work::before{background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--ac,#FF4A17) 13%,transparent),transparent 62%)}
.bt-hero__card{box-shadow:0 40px 90px -40px rgba(0,0,0,.95),0 0 0 1px rgba(255,74,23,.07)}

/* buttons keep dark ink on orange for contrast */
.bt-btn{color:var(--acc-ink)}
.bt-btn--ghost{color:var(--fg)}
.bt-btn--ghost:hover{color:var(--acc-ink)}
.bt-form input[type=submit]{color:var(--acc-ink)}

/* selection + scrollbar */
::selection{background:var(--acc);color:var(--acc-ink)}
.bt-body::-webkit-scrollbar-thumb{background:#3A2A24}
.bt-body::-webkit-scrollbar-thumb:hover{background:var(--acc)}

/* the marquee dot + eyebrow bullet read better slightly warmer */
.bt-marquee__i::after{background:var(--acc)}
.bt-eyebrow::before{background:var(--acc)}

/* video play button */
.bt-vcard__play{background:var(--acc)}
.bt-vcard__play svg{fill:var(--acc-ink)}
.bt-vcard__cat{color:var(--acc-soft)}

/* stats + metrics */
.bt-stat__n em{color:var(--acc)}
.bt-step__n{color:var(--acc)}
.bt-quote::before{color:var(--acc)}
.bt-faq__q:hover{color:var(--acc)}
.bt-footer__mark em{color:var(--acc)}
.bt-loader__bar i{background:var(--acc)}
.bt-loader__mark span{color:var(--acc)}

/* wordmark: keep the period legible now that it is orange on near-black */
.bt-logo__txt em{font-weight:800;font-size:1.2em;line-height:0;margin:0 .01em}
.bt-loader__mark span{font-weight:800}

/* =====================================================================
   LOADER v2 - word roll + slat wipe
   The overlay is built from vertical slats. They lift away in sequence
   on exit, so the hero is revealed rather than cross-faded.
   ===================================================================== */
.bt-loader{background:transparent;display:grid;place-items:center;transition:none;animation:none}
.bt-loader__slats{position:absolute;inset:0;display:flex;z-index:0}
.bt-loader__slats i{flex:1 1 0;background:var(--ink);transform-origin:top center;transform:scaleY(1);transition:transform .82s cubic-bezier(.76,0,.24,1);transition-delay:calc(var(--s)*.055s)}
.bt-loader__inner{position:relative;z-index:2;text-align:center;width:min(560px,86vw);transition:opacity .35s ease,transform .5s var(--ease)}

.bt-loader__mark{font-size:clamp(1.8rem,5vw,3rem);font-weight:600;letter-spacing:-.045em;line-height:1;opacity:0;animation:btMarkIn .7s var(--ease) .05s forwards}
.bt-loader__mark span{color:var(--acc);font-weight:800;font-size:1.2em;line-height:0}
@keyframes btMarkIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.bt-loader__rule{height:1px;background:var(--line);margin:20px auto 16px;width:100%;overflow:hidden}
.bt-loader__rule i{display:block;height:100%;width:100%;background:var(--acc);transform:scaleX(0);transform-origin:left center;animation:btRule 1.35s cubic-bezier(.65,0,.35,1) .1s forwards}
@keyframes btRule{to{transform:scaleX(1)}}

.bt-loader__roll{height:1.5em;overflow:hidden;font-family:var(--f-mono);font-size:clamp(11px,1.4vw,13px);letter-spacing:.22em;text-transform:uppercase}
.bt-loader__stack{animation:btRoll 1.45s cubic-bezier(.76,0,.24,1) .1s forwards}
.bt-loader__stack span{display:block;height:1.5em;line-height:1.5em;color:var(--fg3)}
.bt-loader__stack span:last-child{color:var(--acc)}
@keyframes btRoll{
0%,14%{transform:translateY(0)}
22%,40%{transform:translateY(-1.5em)}
48%,66%{transform:translateY(-3em)}
74%,100%{transform:translateY(-4.5em)}
}

/* exit */
.bt-loader.is-done{visibility:visible;opacity:1;pointer-events:none}
.bt-loader.is-done .bt-loader__inner{opacity:0;transform:translateY(-10px)}
.bt-loader.is-done .bt-loader__slats i{transform:scaleY(0)}
.bt-loader.is-gone{visibility:hidden}

/* safety net: if JS never runs, the slats still clear the screen */
.bt-loader__slats i{animation:btSlatFail .8s cubic-bezier(.76,0,.24,1) forwards;animation-delay:calc(2.6s + var(--s)*.055s)}
.bt-loader.is-done .bt-loader__slats i{animation:none}
@keyframes btSlatFail{to{transform:scaleY(0)}}

@media(prefers-reduced-motion:reduce){
.bt-loader{display:none}
}

/* =====================================================================
   LOADER v3 - "settle"
   One panel lifts. One wordmark travels from centre into its real nav
   position and stops there. Only transform and opacity animate, so it
   stays on the compositor and does not jitter.
   ===================================================================== */
.bt-loader{position:fixed;inset:0;z-index:9999;background:transparent;display:block;transition:none;animation:none;pointer-events:none}

.bt-loader__veil{position:absolute;inset:0;background:var(--ink);transform:translateY(0);transition:transform .88s cubic-bezier(.76,0,.24,1) .14s}

.bt-loader__mark{
position:fixed;left:50%;top:50%;z-index:2;
display:inline-flex;align-items:center;gap:9px;
font-family:var(--f-sans);font-size:17px;font-weight:600;letter-spacing:-.035em;line-height:1;color:var(--fg);
white-space:nowrap;
transform:translate(-50%,-50%) scale(var(--s0,3));
transition:transform .95s cubic-bezier(.76,0,.24,1),opacity .2s ease .78s;
will-change:transform;
}
.bt-loader__mark .bt-logo__txt em{color:var(--acc);font-family:var(--f-sans);font-style:normal;font-weight:800;font-size:1.2em;line-height:0}
.bt-loader__mark .bt-logo__dot{width:9px;height:9px;border-radius:50%;background:var(--acc);flex:none;animation:none}

@media(max-width:700px){.bt-loader__mark{--s0:2.1}}
@media(min-width:701px) and (max-width:1100px){.bt-loader__mark{--s0:2.6}}

/* exit: the mark lands on the real logo, the panel clears upward */
.bt-loader.is-done .bt-loader__mark{transform:translate(calc(-50% + var(--tx,0px)),calc(-50% + var(--ty,0px))) scale(1);opacity:0}
.bt-loader.is-done .bt-loader__veil{transform:translateY(-101%)}
.bt-loader.is-gone{display:none}

/* the real nav logo stays hidden until the travelling mark has landed */
.bt-body:not(.is-ready) .bt-nav .bt-logo{opacity:0}
.bt-body.is-ready .bt-nav .bt-logo{opacity:1;transition:opacity .01s linear .62s}

/* safety net: clear itself even if JS never runs */
.bt-loader__veil{animation:btVeilFail .9s cubic-bezier(.76,0,.24,1) 2.6s forwards}
.bt-loader.is-done .bt-loader__veil{animation:none}
@keyframes btVeilFail{to{transform:translateY(-101%)}}

@media(prefers-reduced-motion:reduce){
.bt-loader{display:none}
.bt-body .bt-nav .bt-logo{opacity:1}
}

/* nav logo reveal, with a hard CSS guarantee it comes back even if JS dies */
.bt-body:not(.is-ready) .bt-nav .bt-logo{opacity:0;animation:btLogoIn .01s linear 2.7s forwards}
.bt-body.is-ready .bt-nav .bt-logo{opacity:1;animation:none;transition:opacity .01s linear .6s}
@keyframes btLogoIn{to{opacity:1}}

/* =====================================================================
   LOADER REMOVED
   No intro overlay. The hero is the first thing that paints.
   These rules neutralise every earlier loader rule and guarantee the
   nav logo is visible with no dependency on JS.
   ===================================================================== */
.bt-loader,.bt-loader__veil,.bt-loader__mark,.bt-loader__slats,.bt-loader__inner{display:none!important}
.bt-nav .bt-logo,
.bt-body:not(.is-ready) .bt-nav .bt-logo,
.bt-body.is-ready .bt-nav .bt-logo{opacity:1!important;animation:none!important;transition:none}
.bt-logo__dot{animation:btPulse 2.6s infinite}

/* =====================================================================
   NAME: "build traffic" - no dot. The orange now sits on the t of
   traffic, echoing the logo mark instead of a full stop.
   ===================================================================== */
.bt-logo__txt em,
.bt-footer__mark em{color:var(--acc);font-family:var(--f-sans);font-style:normal;font-weight:inherit;font-size:inherit;line-height:inherit;margin:0}
.bt-logo__txt{letter-spacing:-.03em}

/* =====================================================================
   HEADLINE LEGIBILITY
   Tracking was set for a smaller render; at hero size the negative
   letter-spacing was closing up pairs like "We". Loosened, and the
   word masks widened so no glyph overhang gets clipped.
   ===================================================================== */
.bt-hero__title{letter-spacing:-.022em;word-spacing:.02em}
.bt-h1,.bt-phead h1{letter-spacing:-.024em}
.bt-h2,.bt-cta__title{letter-spacing:-.022em}
.bt-h3,.bt-work__title{letter-spacing:-.02em}
.bt-menu__nav span{letter-spacing:-.025em}
.bt-svc__t,.bt-row__t,.bt-card__t{letter-spacing:-.018em}
.bt-stat__n{letter-spacing:-.03em}

/* italic serif accents need a touch more room than the sans */
.bt-hero__title em,.bt-h1 em,.bt-h2 em,.bt-cta__title em,.bt-phead h1 em{letter-spacing:0;padding-right:.02em}

/* widen the reveal mask so ascenders, descenders and italic overhangs
   are never cut off by overflow:hidden */
.bt-split .w{padding:.04em .06em .16em;margin:-.04em -.06em -.16em}
.bt-split .w i{transform:translateY(125%)}
.bt-split.is-in .w i{transform:none}