:root{--bg:#0a0908;--panel:#14110d;--text:#f2ede4;--muted:#aaa194;--line:#ffffff1c;--accent:#d59a48;--accent-rgb:213,154,72}body.marketing{--accent:#e45f73;--accent-rgb:228,95,115}body.video{--accent:#36b8d8;--accent-rgb:54,184,216}body.design{--accent:#9b72e8;--accent-rgb:155,114,232}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.nav{height:76px;position:fixed;z-index:50;top:0;left:0;right:0;display:flex;align-items:center;padding:0 4vw;border-bottom:1px solid var(--line);background:#0a0908d9;backdrop-filter:blur(16px)}.brand{font-size:24px;font-weight:900}.brand span,.kicker,.eyebrow,.meta small{color:var(--accent)}nav{margin:auto;display:flex;gap:30px}nav a,.resume{font-size:11px;text-transform:uppercase;letter-spacing:.16em}.resume{border:1px solid #ffffff38;padding:11px 15px;transition:.2s}.resume:hover,.btn:hover{border-color:var(--accent);box-shadow:0 0 24px rgba(var(--accent-rgb),.18)}.hero{height:100vh;min-height:700px;position:relative;display:flex;align-items:center;overflow:hidden}.hero-bg{position:absolute;inset:-4%;background:linear-gradient(90deg,#080706f7 0%,#080706c4 44%,#08070632 80%),url('../assets/images/hero.jpg') 65% center/cover no-repeat;filter:saturate(.48) sepia(.08);transform:scale(1.04);will-change:transform}.hero:after{content:'VISION';position:absolute;right:2vw;bottom:5vh;font-size:clamp(60px,11.5vw,164px);font-weight:900;letter-spacing:-.07em;color:rgba(var(--accent-rgb),.08);pointer-events:none}.hero-copy{position:relative;z-index:2;width:min(900px,86vw);margin-left:8vw}.eyebrow,.kicker{font-size:10px;font-weight:700;letter-spacing:.23em;text-transform:uppercase}.hero h1,.page-hero h1{font-size:clamp(62px,8.3vw,130px);line-height:.84;letter-spacing:-.06em;margin:28px 0 34px}.hero h1 em,.page-hero h1 em{font-weight:300;color:transparent;-webkit-text-stroke:1px #e2d9c7}.dek{font-size:clamp(18px,1.5vw,24px);line-height:1.55;color:#c6bfb2;max-width:730px}.actions{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}.btn{padding:15px 21px;border:1px solid #ffffff42;font-size:11px;text-transform:uppercase;letter-spacing:.12em;transition:.2s}.btn.primary{background:var(--accent);color:#090807;border-color:var(--accent)}.intro,.about,.split{padding:115px 8vw;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}.intro h2,.section-head h2,.about h2,.split h2{font-size:clamp(42px,5vw,76px);line-height:.96;letter-spacing:-.045em;margin:18px 0}.intro-copy,.about p,.split p,.copy{font-size:19px;line-height:1.7;color:#afa79a}.lanes{display:grid;grid-template-columns:repeat(3,1fr);margin:0 4vw 120px;border-block:1px solid var(--line)}.lanes a{padding:42px;border-right:1px solid var(--line);transition:.3s}.lanes a:last-child{border:0}.lanes a:hover{background:rgba(var(--accent-rgb),.06);transform:translateY(-5px)}.lanes span{color:var(--accent);font-size:11px}.lanes h3{font-size:34px;margin:30px 0 10px}.lanes p{color:var(--muted)}.work{padding:25px 4vw 110px}.section-head{padding:0 4vw 50px;display:flex;justify-content:space-between;align-items:end}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{border:0;background:transparent;color:#948b7c;padding:9px 11px;text-transform:uppercase;font-size:10px;letter-spacing:.13em;cursor:pointer}.filters button.active,.filters button:hover{color:var(--accent)}.grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:260px;gap:16px}.card{grid-column:span 5;position:relative;overflow:hidden;background:#17140f}.card.wide{grid-column:span 7}.card.tall{grid-row:span 2}.card img{width:100%;height:100%;object-fit:cover;transition:.7s;filter:saturate(.8)}.card:hover img{transform:scale(1.045);filter:saturate(1)}.shade{position:absolute;inset:0;background:linear-gradient(0deg,#080705f2,transparent 65%)}.meta{position:absolute;left:28px;right:28px;bottom:25px}.meta h3{font-size:28px;margin:7px 0}.meta p{margin:0;color:#bbb3a6}.numbers{margin:30px 4vw 120px;border-block:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}.numbers div{padding:44px 28px;border-right:1px solid var(--line)}.numbers strong{display:block;font-size:clamp(40px,5vw,70px);color:var(--accent)}.numbers span{color:var(--muted)}.portrait{height:600px;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:saturate(.55) sepia(.12)}.contact{padding:130px 8vw;background:#13100b;border-top:1px solid var(--line)}.contact h2{font-size:clamp(58px,8vw,120px);line-height:.88;letter-spacing:-.055em}.contact>a,.text-link{border-bottom:1px solid var(--accent);padding-bottom:6px}.page-hero{padding:170px 8vw 85px;min-height:62vh;display:flex;align-items:end;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 40%,rgba(var(--accent-rgb),.16),transparent 34%),linear-gradient(135deg,#17130d,#090806)}.page-hero:after{content:attr(data-word);position:absolute;right:-1vw;top:19%;font-size:clamp(75px,14vw,210px);font-weight:900;letter-spacing:-.07em;color:rgba(var(--accent-rgb),.055)}.page-hero>div{position:relative;z-index:2}.page-hero p{max-width:760px}.portfolio-grid{padding:30px 8vw 110px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tile{background:#15130f;border:1px solid var(--line);overflow:hidden;transition:.25s}.tile:hover{transform:translateY(-4px);border-color:rgba(var(--accent-rgb),.55)}.tile img{width:100%;height:320px;object-fit:cover}.tile .pad{padding:24px}.tile h3{font-size:26px;margin:8px 0}.tile p{color:var(--muted);line-height:1.55}.feature{grid-column:span 2}.feature img{height:500px}.campaign-grid{padding:20px 8vw 110px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start}.campaign-card{position:relative;background:#13110e;border:1px solid var(--line);overflow:hidden;cursor:pointer}.campaign-card .thumb{height:420px;overflow:hidden;background:#fff}.campaign-card img{width:100%;height:100%;object-fit:cover;object-position:top;transition:.6s}.campaign-card:hover img{transform:scale(1.025)}.campaign-card .hover{position:absolute;inset:0;background:linear-gradient(0deg,#080706f7 5%,#08070655 58%,transparent);display:flex;align-items:end;padding:24px;opacity:.2;transition:.3s}.campaign-card:hover .hover{opacity:1}.campaign-card h3{margin:6px 0;font-size:25px}.campaign-card p{margin:0;color:#c1b9ac;line-height:1.45}.modal{position:fixed;z-index:100;inset:0;background:#050504ed;display:none;overflow:auto;padding:5vh 5vw}.modal.open{display:block}.modal-close{position:fixed;right:3vw;top:3vh;z-index:110;border:1px solid #ffffff44;background:#0b0a08;color:#fff;width:46px;height:46px;font-size:25px;cursor:pointer}.modal-inner{max-width:1300px;margin:auto;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:4vw;align-items:start}.modal-art{background:#fff}.modal-art img{width:100%;height:auto}.modal-copy{position:sticky;top:8vh}.modal-copy h2{font-size:clamp(38px,4vw,62px);letter-spacing:-.04em;margin:12px 0 25px}.modal-copy h4{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:10px;margin:26px 0 8px}.modal-copy p{color:#bdb4a6;line-height:1.65}.editable-note{border-left:2px solid var(--accent);padding-left:16px}.video-frame{aspect-ratio:16/9;width:100%;background:#000}.video-frame video{width:100%;height:100%}.project{padding:140px 8vw 100px}.project-head{max-width:900px;margin-bottom:60px}.project h1{font-size:clamp(52px,7vw,100px);letter-spacing:-.055em;margin:16px 0}.project-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.project-gallery img{width:100%;height:auto;background:#17140f}.facts{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line);margin:50px 0}.facts div{padding:25px;border-right:1px solid var(--line)}.facts small{color:var(--accent);text-transform:uppercase;letter-spacing:.12em}.facts p{color:#c5bdaf}.sticky-story{padding:90px 8vw;display:grid;grid-template-columns:1fr 1fr;gap:7vw}.sticky-media{position:sticky;top:110px;height:70vh;overflow:hidden}.sticky-media img{width:100%;height:100%;object-fit:cover}.story-copy section{min-height:52vh;display:flex;flex-direction:column;justify-content:center}.story-copy h3{font-size:38px;margin:10px 0}.story-copy p{color:var(--muted);font-size:18px;line-height:1.7}.footer{padding:28px 4vw;display:flex;justify-content:space-between;color:#766e61;font-size:10px;text-transform:uppercase;letter-spacing:.12em;border-top:1px solid var(--line)}.reveal{opacity:0;transform:translateY(22px);transition:.7s ease}.reveal.in{opacity:1;transform:none}@media(max-width:900px){nav{display:none}.resume{margin-left:auto}.intro,.about,.split{grid-template-columns:1fr;padding:85px 6vw}.lanes{grid-template-columns:1fr;margin:0 6vw 80px}.lanes a{border-right:0;border-bottom:1px solid var(--line)}.section-head{display:block}.grid{display:block}.card{height:420px;margin-bottom:14px}.numbers{grid-template-columns:1fr 1fr}.portfolio-grid,.campaign-grid{grid-template-columns:1fr 1fr}.feature{grid-column:span 2}.modal-inner{grid-template-columns:1fr}.modal-copy{position:static}.sticky-story{grid-template-columns:1fr}.sticky-media{position:relative;top:auto;height:55vh}}@media(max-width:560px){.hero-copy{margin:50px 22px 0}.hero h1{font-size:58px}.intro,.about,.contact,.page-hero,.project{padding-left:24px;padding-right:24px}.lanes{margin-inline:24px}.work{padding-inline:14px}.card{height:340px}.numbers{grid-template-columns:1fr}.portfolio-grid,.campaign-grid{grid-template-columns:1fr;padding-inline:24px}.feature{grid-column:auto}.tile img,.feature img{height:320px}.campaign-card .thumb{height:390px}.facts{grid-template-columns:1fr}.footer{display:block;line-height:2}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
/* Homepage lane accents: one design system, three employer entry points. */
body:not(.marketing):not(.video):not(.design) .lanes a:nth-child(1):hover{--accent:#e45f73;box-shadow:inset 0 -3px #e45f73}body:not(.marketing):not(.video):not(.design) .lanes a:nth-child(2):hover{--accent:#36b8d8;box-shadow:inset 0 -3px #36b8d8}body:not(.marketing):not(.video):not(.design) .lanes a:nth-child(3):hover{--accent:#9b72e8;box-shadow:inset 0 -3px #9b72e8}


/* V4 PATCH 01 — neon gallery system */
:root{--frame-glow:0 0 18px rgba(var(--accent-rgb),.28),0 0 42px rgba(var(--accent-rgb),.10)}
.portfolio-grid{gap:clamp(28px,3vw,48px);align-items:start}
.tile{position:relative;overflow:visible;background:transparent;border:0;padding:12px 12px 0}
.tile:before,.campaign-card:before,.card:before{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;border:1px solid rgba(var(--accent-rgb),.58);clip-path:polygon(0 0,30% 0,30% 2px,2px 2px,2px 30%,0 30%,0 0,100% 0,100% 30%,calc(100% - 2px) 30%,calc(100% - 2px) 2px,70% 2px,70% 0,100% 0,100% 100%,70% 100%,70% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 70%,100% 70%,100% 100%,0 100%,0 70%,2px 70%,2px calc(100% - 2px),30% calc(100% - 2px),30% 100%,0 100%)}
.tile:after,.campaign-card:after,.card:after{content:"";position:absolute;z-index:-1;inset:8px -8px -8px 8px;border:1px solid rgba(var(--accent-rgb),.18);box-shadow:var(--frame-glow);pointer-events:none;transition:.35s ease}
.tile:hover:after,.campaign-card:hover:after,.card:hover:after{inset:4px -12px -12px 4px;border-color:rgba(var(--accent-rgb),.48);box-shadow:0 0 22px rgba(var(--accent-rgb),.40),0 0 60px rgba(var(--accent-rgb),.16)}
.tile>img,.tile .video-frame,.tile .neon-media{width:100%;background:#0d0c0b;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 45px #0008;overflow:hidden}
.tile>img{height:auto;max-height:540px;object-fit:contain}
.feature>img{height:auto;max-height:650px;object-fit:contain}
.tile .pad{padding:20px 4px 10px;position:relative}
.tile .pad:before{content:"";display:block;width:44px;height:1px;background:var(--accent);box-shadow:0 0 12px rgba(var(--accent-rgb),.65);margin-bottom:17px;transition:width .3s ease}
.tile:hover .pad:before{width:92px}
.tile h3{font-size:clamp(25px,2.3vw,36px);margin:6px 0 8px;letter-spacing:-.025em}
.tile p{max-width:38rem}
.campaign-grid{gap:clamp(28px,3vw,46px)}
.campaign-card{overflow:visible;border:0;background:transparent;padding:10px}
.campaign-card .thumb{box-shadow:0 18px 45px #0008;border:1px solid rgba(255,255,255,.08)}
.campaign-card .hover{inset:10px;padding:24px;opacity:0}
.campaign-card:hover{transform:translateY(-5px)}
.card{overflow:visible;border:0}
.card img,.card .shade{overflow:hidden}
.card:before{inset:-7px}
.card:after{inset:7px -9px -9px 7px}
.neon-media{aspect-ratio:16/9;display:grid;place-items:center;position:relative}
.neon-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.8)}
.verified-feature .pad{max-width:780px}
body:not(.marketing):not(.video):not(.design) .hero:after{color:rgba(213,154,72,.11)}
@media(max-width:900px){.portfolio-grid{gap:30px}.tile{padding:8px}.campaign-grid{gap:30px}.campaign-card{padding:8px}}
@media(prefers-reduced-motion:reduce){.tile:after,.campaign-card:after,.card:after{transition:none}}

/* V4 PATCH 02 — 20pt-equivalent animated neon tubes + disciplined grids */
:root{--tube:18px;--tube-core:5px;--tube-soft:32px}
.portfolio-grid,.campaign-grid{align-items:stretch}
.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:46px 34px}
.portfolio-grid .tile,.portfolio-grid .feature{grid-column:span 1;display:flex;flex-direction:column;min-width:0}
.tile,.campaign-card{isolation:isolate}
.tile:before,.campaign-card:before{display:none}
.tile:after,.campaign-card:after{display:none}
.neon-media,.tile>img,.campaign-card .thumb{position:relative;z-index:1;border:0;outline:0;box-shadow:0 22px 48px #000a}
.tile>img{width:100%;height:100%;max-height:none;object-fit:cover}
.feature>img{height:100%;max-height:none}
/* Standard gallery viewports. Full originals remain available in project/lightbox views. */
body.video .tile>img,body.video .neon-media{aspect-ratio:16/9;height:auto;object-fit:cover}
body.design .tile>img{aspect-ratio:4/3;height:auto;object-fit:cover}
body.marketing .campaign-card .thumb{aspect-ratio:4/3;height:auto}
body.marketing .campaign-card .thumb img{object-fit:cover;object-position:top}
/* Segmented tube: a broad colored glass stroke with a white-hot core and bloom. */
.tile,.campaign-card{--tube-a:var(--accent);--tube-glow:rgba(var(--accent-rgb),.82)}
.tile .neon-media:before,.tile>img+ .pad:before{content:none}
.tile:has(>img):before,.tile:has(.neon-media):before,.campaign-card:before{content:"";display:block;position:absolute;z-index:4;pointer-events:none;inset:-10px -10px auto -10px;height:calc(100% - 92px);max-height:calc(100% - 92px);border-radius:5px;background:
 linear-gradient(90deg,var(--tube-a) 0 31%,transparent 31% 68%,var(--tube-a) 68% 100%) top/100% var(--tube) no-repeat,
 linear-gradient(180deg,var(--tube-a) 0 38%,transparent 38% 64%,var(--tube-a) 64% 100%) right/var(--tube) 100% no-repeat,
 linear-gradient(90deg,var(--tube-a) 0 20%,transparent 20% 57%,var(--tube-a) 57% 100%) bottom/100% var(--tube) no-repeat,
 linear-gradient(180deg,var(--tube-a) 0 24%,transparent 24% 56%,var(--tube-a) 56% 100%) left/var(--tube) 100% no-repeat;
 filter:drop-shadow(0 0 4px var(--tube-a)) drop-shadow(0 0 13px var(--tube-glow)) drop-shadow(0 0 28px rgba(var(--accent-rgb),.44));opacity:.92;transition:filter .28s ease,opacity .28s ease;animation:neonIgnite .72s both}
.campaign-card:before{inset:-10px;height:calc(100% + 20px);max-height:none}
.tile:has(>img):after,.tile:has(.neon-media):after,.campaign-card:after{content:"";display:block;position:absolute;z-index:5;pointer-events:none;inset:-4px -4px auto -4px;height:calc(100% - 104px);max-height:calc(100% - 104px);border-radius:4px;background:
 linear-gradient(90deg,#fff 0 31%,transparent 31% 68%,#fff 68% 100%) top/100% var(--tube-core) no-repeat,
 linear-gradient(180deg,#fff 0 38%,transparent 38% 64%,#fff 64% 100%) right/var(--tube-core) 100% no-repeat,
 linear-gradient(90deg,#fff 0 20%,transparent 20% 57%,#fff 57% 100%) bottom/100% var(--tube-core) no-repeat,
 linear-gradient(180deg,#fff 0 24%,transparent 24% 56%,#fff 56% 100%) left/var(--tube-core) 100% no-repeat;
 filter:drop-shadow(0 0 4px var(--tube-a));opacity:.76;animation:neonIgnite .72s .04s both}
.campaign-card:after{inset:-4px;height:calc(100% + 8px);max-height:none}
.tile:hover:before,.campaign-card:hover:before{opacity:1;filter:drop-shadow(0 0 5px var(--tube-a)) drop-shadow(0 0 17px var(--tube-glow)) drop-shadow(0 0 42px rgba(var(--accent-rgb),.62));animation:neonFlicker 1.9s linear infinite}
.tile:hover:after,.campaign-card:hover:after{opacity:.96;animation:neonFlicker 1.9s .03s linear infinite}
@keyframes neonIgnite{0%,8%{opacity:.08}11%{opacity:.9}15%{opacity:.18}21%{opacity:1}27%{opacity:.38}36%,100%{opacity:.92}}
@keyframes neonFlicker{0%,18%,22%,64%,68%,100%{opacity:.96}20%{opacity:.66}66%{opacity:.78}}
/* Keep copy orderly under identical presentation windows. */
.tile .pad{flex:1;padding:27px 4px 10px}.tile .pad:before{display:none}.tile h3{margin-top:5px}
.campaign-card .hover{inset:0}
/* Web pieces get a restrained premium-laptop cue, not a stock monitor mockup. */
body.design .tile[href*="web-design"]{padding-bottom:12px}
body.design .tile[href*="web-design"]>img{border:8px solid #17191d;border-bottom-width:13px;border-radius:9px 9px 3px 3px;box-shadow:0 22px 48px #000b}
body.design .tile[href*="web-design"] .pad:after{content:"";display:block;width:56%;height:5px;margin:-5px auto 0;border-radius:0 0 20px 20px;background:linear-gradient(90deg,#292b31,#555963 50%,#292b31);transform:translateY(-100px);opacity:.9;pointer-events:none}
@media(max-width:1050px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){:root{--tube:13px;--tube-core:4px}.portfolio-grid{grid-template-columns:1fr;gap:40px}.campaign-grid{grid-template-columns:1fr}.tile:has(>img):before,.tile:has(.neon-media):before{height:calc(100% - 86px)}.tile:has(>img):after,.tile:has(.neon-media):after{height:calc(100% - 98px)}}
@media(prefers-reduced-motion:reduce){.tile:before,.tile:after,.campaign-card:before,.campaign-card:after{animation:none!important}}
