:root {
  --ink: #f6f4ef;
  --muted: #a7a5ac;
  --line: rgba(255, 255, 255, 0.14);
  --violet: #8b5cf6;
  --pink: #ec4899;
  --cyan: #22d3ee;
  --orange: #ff8a33;
  --page: #06070a;
  --panel: rgba(15, 17, 27, 0.66);
}

* { box-sizing: border-box; }
.sr-only { 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; }
html { scroll-behavior: smooth; }
#work .archive-heading-row,#expertise .services-heading{scroll-margin-top:28px}
body { margin: 0; overflow-x:clip; color: var(--ink); background: var(--page); font-family: "DM Sans", sans-serif; }
a { color: inherit; }
button { font: inherit; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.skip-link { position: fixed; z-index: 99; left: 1rem; top: 1rem; padding: .75rem 1rem; background: #fff; color: #000; transform: translateY(-180%); }
.keyboard-nav .skip-link:focus { transform: translateY(0); }
.shell { width: min(100% - 48px, 1500px); margin-inline: auto; }
.hero { position: relative; min-height: 100svh; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 51% 42%, #1c1025 0, #080a10 34%, #050609 69%); }
.hero::before { content:""; position:absolute; z-index:1; left:0; right:0; bottom:0; height:150px; pointer-events:none; background:linear-gradient(180deg,transparent,rgba(5,7,10,.88) 72%,#06070a); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .28; background-image: linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size: 70px 70px; mask-image: radial-gradient(circle, #000 25%, transparent 72%); }
.noise { position:absolute; inset:0; z-index:-1; opacity:.045; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); }
.ambient { position: absolute; z-index: -2; width: 36rem; aspect-ratio: 1; border-radius: 50%; filter: blur(100px); opacity: .16; }
.ambient-one { left: 25%; top: 6%; background: var(--violet); animation: ambient 10s ease-in-out infinite alternate; }
.ambient-two { right: 3%; bottom: -25%; background: #0ea5e9; animation: ambient 13s ease-in-out infinite alternate-reverse; }

.nav { height: clamp(116px,10vw,152px); display: flex; align-items: flex-end; padding-bottom:22px; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 20; }
.intro-mark { display:inline-flex;align-items:flex-end;gap:.18em;text-decoration:none;color:#fff;font:800 clamp(2.2rem,5vw,5.3rem)/.86 "Manrope",sans-serif;text-transform:uppercase;letter-spacing:-.045em;white-space:nowrap;perspective:900px; }
.intro-mark .intro-word{display:inline-block;opacity:0;transform:translate3d(0,-1.05em,0) rotate(-5deg) scale(.78);transform-origin:50% 100%;animation:introWordBounce .78s cubic-bezier(.18,.8,.26,1.2) forwards;will-change:transform,opacity}
.intro-mark .intro-word:nth-child(2){animation-delay:.16s}.intro-mark .intro-word:nth-child(3){animation-delay:.32s}.intro-mark .intro-word:nth-child(4){animation-delay:.48s}
.intro-mark .intro-accent{color:var(--orange)}
@keyframes introWordBounce{0%{opacity:0;transform:translate3d(0,-1.05em,0) rotate(-5deg) scale(.78)}48%{opacity:1;transform:translate3d(0,.18em,0) rotate(1.5deg) scale(1.06)}68%{transform:translate3d(0,-.1em,0) rotate(-.6deg) scale(.98)}84%{transform:translate3d(0,.035em,0) rotate(.2deg) scale(1.01)}100%{opacity:1;transform:translate3d(0,0,0) rotate(0) scale(1)}}
.nav-links { display: flex; align-items: center; gap: 34px; padding-bottom:5px; font-size: 14px; }
.nav-links a { text-decoration: none; color: #d6d4da; transition: color .2s ease; }
.nav-links a:hover, .nav-links a:focus-visible { color: #fff; }
.menu-button { display: none; width: 46px; height: 46px; border: 1px solid var(--line); background: transparent; color: #fff; }
.menu-button span { display: block; width: 18px; height: 1px; background: currentColor; margin: 5px auto; }

.hero-grid { display: grid; grid-template-columns: minmax(330px, 1.02fr) minmax(430px, 1.3fr) minmax(290px, .82fr); min-height: calc(100svh - 152px); align-items: center; gap: 0; position: relative; z-index: 2; }
.hero-copy { position: relative; z-index: 9; align-self: center; padding: 30px 0 75px; }
.eyebrow { text-transform: uppercase; letter-spacing: .16em; font-size: 11px; font-weight: 700; color: #b8b6be; }
.hero-copy .eyebrow { display: flex; align-items: center; gap: 9px; }
.hero-copy .eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 16px var(--orange); }
.hero-copy h1 { font: 700 clamp(3.2rem, 4.25vw, 5.8rem)/.92 "Manrope", sans-serif; letter-spacing: -.075em; margin: 24px 0 27px; width:max-content; max-width:48vw; }
.hero-copy h1>span { display:block; white-space:nowrap; }
.hero-copy h1 em { display: inline; font-family: "Playfair Display", serif; font-weight: 600; color: transparent; letter-spacing: -.04em; background: linear-gradient(105deg, #fff 15%, #e5d8ff 55%, #bca0ff); background-clip: text; }
.intro { color: #b4b2ba; font-size: clamp(1rem, 1.25vw, 1.22rem); line-height: 1.65; max-width: 500px; }
.text-link { display: inline-flex; gap: 32px; align-items: center; margin-top: 18px; padding: 11px 0; border-bottom: 1px solid #eee; text-decoration: none; font-weight: 600; }
.text-link span { animation: arrow 1.5s ease-in-out infinite; }
.availability { margin-top: 36px; color: #7f7c86; text-transform: uppercase; letter-spacing: .13em; font-size: 9px; display: flex; gap: 9px; align-items: center; }
.availability i { width: 6px; height: 6px; border-radius: 50%; background: #53e69d; box-shadow: 0 0 10px #53e69d; }

.hero-stage { height: min(79vh, 830px); min-height: 620px; position: relative; align-self: end; pointer-events: none; }
.hero-stage::before { content:""; position:absolute; left:50%; top:48%; width:74%; aspect-ratio:1; border-radius:50%; background: radial-gradient(circle, rgba(157,78,221,.2), transparent 65%); transform:translate(-50%,-50%); filter:blur(14px); }
.orbit { position:absolute; left:50%; top:49%; border:1px solid rgba(255,255,255,.07); border-radius:50%; transform:translate(-50%,-50%) rotate(-12deg); }
.orbit-a { width:87%; aspect-ratio:1.35; }
.orbit-b { width:66%; aspect-ratio:1.05; border-color:rgba(139,92,246,.14); }
.character-wrap { position: absolute; z-index: 8; inset: 0; display: flex; align-items: flex-end; justify-content: center; transform:translateX(-4%); }
.character-glow { position:absolute; left:50%; bottom:4%; width:58%; height:68%; border-radius:50%; transform:translateX(-50%); background:radial-gradient(circle, rgba(236,72,153,.27), rgba(34,211,238,.06) 46%, transparent 70%); filter:blur(35px); animation:pulse 3s ease-in-out infinite; }
.character { position: relative; z-index: 2; width: min(94%, 780px); max-height: 96%; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 25px 35px rgba(0,0,0,.7)); animation: characterFloat 4.5s ease-in-out infinite; transform-origin: center bottom; }
.typing-hand { position:absolute; z-index:6; left:20%; bottom:28%; width:66px; height:43px; transform:rotate(13deg); filter:drop-shadow(0 4px 6px rgba(0,0,0,.45)) drop-shadow(0 0 8px rgba(236,72,153,.24)); animation:handShift 1.6s ease-in-out infinite; }
.typing-hand span { position:absolute; left:16px; bottom:2px; width:42px; height:22px; border-radius:55% 48% 52% 45%; background:linear-gradient(145deg,#fff,#d8d5e1); box-shadow:inset -3px -4px 6px rgba(104,89,130,.28); }
.typing-hand i { position:absolute; z-index:2; top:10px; width:28px; height:9px; border-radius:10px 4px 5px 10px; background:linear-gradient(180deg,#fff,#d7d3df); transform-origin:4px 50%; animation:fingerTap .72s ease-in-out infinite alternate; }
.typing-hand i:nth-of-type(1){left:0;transform:rotate(5deg)}.typing-hand i:nth-of-type(2){left:5px;top:20px;animation-delay:.11s;transform:rotate(10deg)}.typing-hand i:nth-of-type(3){left:21px;top:2px;width:24px;animation-delay:.22s;transform:rotate(-8deg)}
.typing-ui { position:absolute; z-index:9; bottom:4.8%; left:22%; height:28px; padding:0 10px; border:1px solid rgba(34,211,238,.35); background:rgba(7,13,20,.82); display:flex; gap:4px; align-items:center; color:#7deaff; font-size:8px; letter-spacing:.14em; backdrop-filter:blur(10px); animation: typingFloat 2s ease-in-out infinite; }
.typing-ui span { width:3px; height:11px; background:#6ef1ff; animation:keyBars .9s ease-in-out infinite alternate; }
.typing-ui span:nth-child(2) { animation-delay:.15s; height:16px; }
.typing-ui span:nth-child(3) { animation-delay:.3s; height:8px; }
.typing-ui b { margin-left:5px; }
.key-flash { position:absolute; z-index:11; color:white; font:600 10px "Manrope"; border:1px solid rgba(255,255,255,.2); background:rgba(9,10,15,.7); width:24px; height:24px; display:grid; place-items:center; border-radius:4px; opacity:0; animation:keyPop 2.4s linear infinite; }
.k1 { left:32%; bottom:14%; }
.k2 { left:39%; bottom:9%; animation-delay:.7s; }
.k3 { left:27%; bottom:8%; animation-delay:1.4s; }

.ui-panel { position:relative; z-index:1; border:1px solid rgba(255,255,255,.15); background:linear-gradient(145deg, rgba(27,31,47,.88), rgba(10,12,20,.66)); box-shadow:0 18px 35px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.08), 0 0 24px rgba(139,92,246,.1); backdrop-filter:blur(16px); border-radius:15px; color:#e9e6ee; overflow:hidden; }
.ui-panel::after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 28px rgba(139,92,246,.06); pointer-events:none; }
.panel-top { height:30px; border-bottom:1px solid rgba(255,255,255,.08); display:flex; gap:5px; align-items:center; padding:0 11px; }
.panel-top span { width:5px; height:5px; border-radius:50%; background:#fc6b61; }
.panel-top span:nth-child(2) { background:#f2c058; }.panel-top span:nth-child(3) { background:#4ecb73; }
.panel-top b { margin-left:auto; color:#858593; font-size:7px; letter-spacing:.05em; }
.screen-sequence { position:relative; z-index:10; align-self:center; width:min(100%,300px); justify-self:end; display:grid; gap:10px; padding:24px 0 82px; }
.screen-sequence .ui-panel { width:100%; transform:none; animation:screenBreathe 5s ease-in-out infinite; }
.screen-sequence .ui-panel:nth-child(2){animation-delay:.35s}.screen-sequence .ui-panel:nth-child(3){animation-delay:.7s}.screen-sequence .ui-panel:nth-child(4){animation-delay:1.05s}
.panel-logo { height:150px; }
.logo-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; padding:14px; }
.logo-grid i { height:55px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.025); border-radius:9px; display:grid; place-items:center; font-style:normal; font:bold 22px "Manrope"; }
.progress { height:3px; background:#252737; margin:0 15px; overflow:hidden; }
.progress span { display:block; width:42%; height:100%; background:linear-gradient(90deg,var(--pink),var(--violet),var(--cyan)); animation:progress 3s ease-in-out infinite; }
.panel-code { height:120px; }
.code-lines { display:grid; gap:6px; padding:12px 16px 9px; }
.code-lines i { height:3px; border-radius:5px; width:78%; background:linear-gradient(90deg,#ff9c63 0 25%,#ba7cff 25% 50%,#4dd9e5 50%); animation:codeLine 2.4s ease-in-out infinite; transform-origin:left; }
.code-lines i:nth-child(2){width:56%;animation-delay:.15s}.code-lines i:nth-child(3){width:86%;animation-delay:.3s}.code-lines i:nth-child(4){width:43%;animation-delay:.45s}.code-lines i:nth-child(5){width:72%;animation-delay:.6s}
.code-status { font-size:7px; color:#858593; padding:0 16px; }.code-status span{display:inline-block;width:5px;height:5px;border-radius:50%;background:#52e6a1;margin-right:5px;box-shadow:0 0 8px #52e6a1}
.panel-brand { height:130px; padding:16px; }
.panel-brand p,.panel-metrics>span { margin:0 0 7px;color:#908e9a;font-size:7px;letter-spacing:.12em; }.panel-brand strong{font:700 18px "Manrope"}.panel-brand small{font-size:7px;color:#878491}.brand-shapes{display:flex;gap:7px;margin:13px 0}.brand-shapes i{display:block;width:29px;height:29px;border-radius:7px;background:linear-gradient(135deg,#9254ff,#fa51a5);animation:shapeShift 3s ease-in-out infinite}.brand-shapes i:nth-child(2){border-radius:50%;background:linear-gradient(135deg,#2fd7ef,#4464ff);animation-delay:.3s}.brand-shapes i:nth-child(3){clip-path:polygon(50% 0,100% 100%,0 100%);border-radius:0;background:linear-gradient(135deg,#ff9e4a,#f43f7c);animation-delay:.6s}
.panel-metrics { height:105px; padding:14px 16px; }
.panel-metrics strong{font:700 26px "Manrope"}.panel-metrics small{color:#9c99a5;font-size:11px}.bars{height:25px;display:flex;align-items:flex-end;gap:5px;margin-top:5px}.bars i{width:12px;height:30%;background:linear-gradient(#a66cff,#4732a8);animation:bars 1.4s ease-in-out infinite alternate}.bars i:nth-child(2){height:50%;animation-delay:.1s}.bars i:nth-child(3){height:75%;animation-delay:.2s}.bars i:nth-child(4){height:46%;animation-delay:.3s}.bars i:nth-child(5){height:90%;animation-delay:.4s}
.tool { position:absolute; z-index:10; width:62px; height:62px; border-radius:15px; display:grid; place-items:center; background:rgba(8,11,18,.88); border:2px solid; box-shadow:0 12px 35px rgba(0,0,0,.5); font:700 25px "Manrope"; backdrop-filter:blur(12px); }
.tool-ai { color:#ff9a30; border-color:#ff7a00; right:24%; bottom:19%; animation:toolA 4.3s ease-in-out infinite; box-shadow:0 0 24px rgba(255,122,0,.2); }
.tool-ps { color:#42cfff; border-color:#00a8ff; right:-1%; bottom:22%; animation:toolB 4.8s ease-in-out infinite; box-shadow:0 0 24px rgba(0,168,255,.2); }

.output-stream { position:absolute; z-index:12; left:15%; bottom:32%; width:190px; height:160px; pointer-events:none; }
.output-word { position:absolute; left:0; bottom:0; display:inline-flex; align-items:center; gap:7px; padding:7px 10px; border:1px solid rgba(125,234,255,.35); border-radius:6px; background:rgba(6,12,19,.86); color:#dffbff; font:700 9px/1 "Manrope",sans-serif; letter-spacing:.13em; white-space:nowrap; box-shadow:0 0 18px rgba(34,211,238,.12); animation:wordRise 2.2s cubic-bezier(.2,.65,.25,1) forwards; }
.output-word::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--cyan); box-shadow:0 0 7px var(--cyan); }
.typing-hand,.typing-hand i,.typing-ui span,.key-flash { animation-play-state:paused; }
.character-wrap.is-typing .typing-hand,.character-wrap.is-typing .typing-hand i,.character-wrap.is-typing .typing-ui span,.character-wrap.is-typing .key-flash { animation-play-state:running; }
.character-wrap:not(.is-typing) .typing-ui { opacity:.35; }
.hero-footer { height:68px; position:absolute; z-index:15; bottom:0; left:50%; transform:translateX(-50%); border-top:1px solid var(--line); display:flex; align-items:center; gap:18px; color:#777580; text-transform:uppercase; font-size:8px; letter-spacing:.13em; }
.hero-footer i { width:3px; height:3px; background:#4f4d56; border-radius:50%; }
.sound-toggle { margin-left:auto; min-height:44px; border:1px solid var(--line); color:#a3a0aa; background:rgba(13,14,20,.68); padding:0 13px; display:flex; align-items:center; gap:8px; cursor:pointer; touch-action:manipulation; text-transform:uppercase; font-size:8px; letter-spacing:.1em; transition:background-color .18s ease,border-color .18s ease,color .18s ease; }
.sound-toggle:hover { background:rgba(255,255,255,.07); }
.sound-toggle svg { width:15px;height:15px;fill:currentColor}.sound-toggle b{color:#706e77}.sound-toggle[aria-pressed="true"]{color:#fff;border-color:rgba(83,230,157,.4)}.sound-toggle[aria-pressed="true"] b{color:#53e69d}
.portfolio-showcase { position:relative; z-index:3; color:#141318; background:linear-gradient(180deg,#06070a 0 88px,#f1efe9 88px 100%); }
.portfolio-shell { padding:clamp(170px,15vw,240px) 0 clamp(90px,10vw,160px); }
.portfolio-heading { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr); gap:8vw; align-items:end; padding-bottom:clamp(52px,6vw,88px); border-bottom:1px solid rgba(20,19,24,.18); }
.section-kicker { margin:0 0 24px; display:flex; align-items:center; gap:14px; text-transform:uppercase; letter-spacing:.14em; font-size:10px; }
.section-kicker span { color:#5e5a65; }.section-kicker b{padding:7px 9px;background:#141318;color:#fff;font-size:9px;}
.portfolio-heading h2 { max-width:950px; margin:0; font:750 clamp(3.6rem,7vw,7.7rem)/.88 "Manrope",sans-serif; letter-spacing:-.075em; }
.portfolio-heading h2 em { display:block; font-family:"Playfair Display",serif; font-weight:600; color:#7156d9; letter-spacing:-.045em; }
.portfolio-intro { max-width:420px; margin:0 0 8px; color:#605d65; font-size:clamp(1rem,1.25vw,1.2rem); line-height:1.65; }
.portfolio-runway { display:grid; grid-template-columns:minmax(220px,.7fr) minmax(520px,2fr) minmax(180px,.55fr); gap:clamp(22px,3vw,48px); padding-top:clamp(48px,6vw,86px); align-items:start; }
.project-index { display:grid; border-top:1px solid #b9b5b0; }
.project-item { position:relative; min-height:112px; padding:20px 14px 20px 50px; border:0; border-bottom:1px solid #c9c5bf; background:transparent; color:#19181d; cursor:pointer; text-align:left; transition:background-color .25s ease,padding-left .25s ease; }
.project-item:hover,.project-item:focus-visible,.project-item.is-active { background:#e4e0d8; padding-left:57px; }
.project-item::after { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:#7156d9; transform:scaleY(0); transform-origin:bottom; transition:transform .25s ease; }
.project-item.is-active::after { transform:scaleY(1); }
.project-item span { position:absolute; left:13px; top:23px; color:#88838d; font:600 10px "Manrope"; }
.project-item b { display:block; font:700 clamp(1.05rem,1.3vw,1.28rem)/1.05 "Manrope"; letter-spacing:-.035em; }
.project-item small { display:block; margin-top:9px; color:#77727c; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.featured-project { --project-hue:0deg; min-width:0; }
.featured-frame { position:relative; min-height:clamp(480px,51vw,690px); overflow:hidden; border-radius:2px; isolation:isolate; background:radial-gradient(circle at 55% 45%,#2b1943,#0a0b12 68%); box-shadow:0 35px 80px rgba(31,24,54,.2); }
.featured-frame::before { content:""; position:absolute; inset:14px; z-index:4; border:1px solid rgba(255,255,255,.16); pointer-events:none; }
.featured-frame img { position:absolute; z-index:2; width:92%; height:90%; left:50%; bottom:-2%; object-fit:contain; transform:translateX(-50%); filter:hue-rotate(var(--project-hue)) drop-shadow(0 30px 40px rgba(0,0,0,.48)); transition:filter .45s ease,transform .55s cubic-bezier(.2,.7,.2,1); }
.featured-project.is-changing .featured-frame img { animation:projectChange .55s ease; }
.frame-label,.frame-number { position:absolute; z-index:6; top:32px; color:#ded9e7; text-transform:uppercase; letter-spacing:.14em; font-size:9px; }
.frame-label { left:34px; }.frame-number{right:35px}.frame-number b{font-size:17px;color:#fff;}
.frame-orbit { position:absolute; z-index:1; left:50%; top:53%; width:70%; aspect-ratio:1; border:1px solid rgba(186,135,255,.27); border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 0 80px rgba(139,92,246,.16),inset 0 0 80px rgba(34,211,238,.06); animation:portfolioOrbit 12s linear infinite; }
.project-monogram { position:absolute; z-index:1; left:5%; bottom:-13%; color:rgba(255,255,255,.035); font:800 clamp(15rem,30vw,34rem)/1 "Manrope"; letter-spacing:-.1em; }
.frame-scan { position:absolute; z-index:5; left:0; right:0; height:1px; top:20%; background:linear-gradient(90deg,transparent,#58e8ff,transparent); opacity:.35; animation:scan 5s ease-in-out infinite; }
.featured-info { display:grid; grid-template-columns:1fr auto auto; gap:28px; align-items:end; padding:27px 0 0; }
.featured-info p { margin:0 0 8px; color:#6f6a73; text-transform:uppercase; letter-spacing:.12em; font-size:9px; }
.featured-info h3 { margin:0; font:750 clamp(2.2rem,4vw,4.2rem)/.9 "Manrope"; letter-spacing:-.06em; }
.project-spec { display:grid; gap:8px; padding-bottom:4px; color:#706b74; font-size:11px; }.project-spec b{color:#1a191d;}
.featured-info>a { display:flex; align-items:center; justify-content:space-between; gap:28px; min-height:52px; padding:0 17px; color:white; background:#141318; text-decoration:none; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.archive-note { position:sticky; top:30px; border-top:1px solid #aaa5ae; padding-top:20px; }
.archive-note>span { color:#746f78; text-transform:uppercase; letter-spacing:.13em; font-size:9px; }
.archive-note strong { display:block; margin:19px 0 23px; font:700 clamp(2.4rem,4.5vw,4.8rem)/1 "Manrope"; letter-spacing:-.06em; }
.archive-note p { color:#706b74; line-height:1.65; font-size:12px; }
.archive-meter { height:3px; margin:28px 0; background:#d1cdc6; }.archive-meter i{display:block;width:28%;height:100%;background:#7156d9;animation:archiveMeter 4s ease-in-out infinite alternate;}
.archive-note a { color:#17161a; text-decoration:none; text-transform:uppercase; letter-spacing:.08em; font-size:9px; display:flex; justify-content:space-between; padding:14px 0; border-bottom:1px solid #aaa5ae; }

@keyframes projectChange{0%{opacity:.35;transform:translateX(-50%) scale(.95)}100%{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes portfolioOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes scan{0%,100%{top:18%;opacity:0}20%{opacity:.4}80%{opacity:.4}100%{top:88%;opacity:0}}
@keyframes archiveMeter{to{width:76%}}

@keyframes characterFloat{0%,100%{transform:translate3d(0,0,0) rotate(-.3deg)}50%{transform:translate3d(0,-10px,0) rotate(.4deg)}}
@keyframes pulse{50%{opacity:.7;transform:translateX(-50%) scale(1.08)}}@keyframes ambient{to{transform:translate(8%,10%) scale(1.12)}}
@keyframes panelFloatA{0%,100%{transform:rotate(-9deg) translateY(0)}50%{transform:rotate(-6deg) translate(7px,-18px)}}
@keyframes panelFloatB{0%,100%{transform:rotate(6deg) translateY(0)}50%{transform:rotate(3deg) translate(-8px,17px)}}
@keyframes panelFloatC{0%,100%{transform:rotate(10deg) translateY(0)}50%{transform:rotate(7deg) translate(8px,-14px)}}
@keyframes panelFloatD{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(-4deg) translate(-7px,14px)}}
@keyframes toolA{50%{transform:translate(10px,-16px) rotate(7deg)}}@keyframes toolB{50%{transform:translate(-8px,-19px) rotate(-7deg)}}
@keyframes codeLine{50%{transform:scaleX(.72);filter:brightness(1.4)}}@keyframes progress{0%{transform:translateX(-100%)}50%{transform:translateX(100%)}100%{transform:translateX(245%)}}
@keyframes shapeShift{50%{transform:rotate(12deg) scale(.86)}}@keyframes bars{to{height:95%;filter:brightness(1.5)}}
@keyframes keyBars{to{height:4px;opacity:.4}}@keyframes typingFloat{50%{transform:translateY(-5px)}}
@keyframes keyPop{0%,70%{opacity:0;transform:translateY(0) scale(.8)}76%{opacity:1}100%{opacity:0;transform:translateY(-34px) scale(1.1)}}@keyframes arrow{50%{transform:translateY(4px)}}
@keyframes handShift{0%,100%{transform:rotate(13deg) translateY(0)}50%{transform:rotate(11deg) translate(3px,4px)}}
@keyframes fingerTap{from{transform:rotate(2deg) translateY(-3px)}to{transform:rotate(12deg) translateY(4px)}}
@keyframes wordRise{0%{opacity:0;transform:translate3d(0,5px,0) scale(.88)}15%{opacity:1}72%{opacity:1}100%{opacity:0;transform:translate3d(55px,-145px,0) scale(1.04)}}
@keyframes screenBreathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

@media (max-width:1180px){
  .hero-grid{grid-template-columns:1fr 1.3fr}.screen-sequence{position:absolute;right:0;width:240px;padding-bottom:82px}.hero-copy{align-self:start;padding-top:12vh}.hero-stage{min-height:600px}.hero-copy h1{font-size:clamp(3rem,5.3vw,5rem);max-width:54vw}.hero-copy .intro{max-width:380px}
}
@media (max-width:780px){
  .shell{width:min(100% - 32px,1500px)}.nav{height:74px}.nav-links{display:none}.nav-links.is-open{display:flex;position:absolute;z-index:30;top:64px;right:0;flex-direction:column;align-items:stretch;gap:0;width:min(220px,calc(100vw - 32px));padding:10px;background:rgba(10,11,16,.96);border:1px solid var(--line);box-shadow:0 22px 50px rgba(0,0,0,.5);backdrop-filter:blur(18px)}.nav-links.is-open a{min-height:48px;display:flex;align-items:center;padding:0 15px}.menu-button{display:block;cursor:pointer;touch-action:manipulation}.hero{min-height:auto}.hero-grid{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:64px 0 0;width:100%;}.hero-copy h1{font-size:clamp(2.35rem,11.7vw,5rem);max-width:100%;width:auto}.hero-copy h1>span{white-space:nowrap}.intro{max-width:500px}.availability{display:none}.hero-stage{order:2;width:100%;height:650px;min-height:650px;margin-top:-20px}.screen-sequence{position:relative;order:3;right:auto;width:100%;padding:0 0 110px;grid-template-columns:1fr 1fr;gap:10px}.screen-sequence .ui-panel{height:132px}.character-wrap{transform:translateX(-11%)}.character{width:min(100%,620px)}.typing-hand{left:15%;bottom:27%;transform:scale(.8) rotate(13deg)}.output-stream{left:10%;bottom:32%}.hero-footer{height:72px}.hero-footer>span,.hero-footer>i{display:none}.sound-toggle{margin-left:0;width:100%;justify-content:center}.tool-ai{left:auto;right:20%}.tool-ps{right:-1%}
}
@media (max-width:470px){
  .hero-copy{padding-top:48px}.hero-copy h1{font-size:clamp(2.25rem,11.4vw,3.35rem);margin-top:18px}.intro{font-size:1rem}.hero-stage{height:510px;min-height:510px;margin-top:5px}.tool{width:50px;height:50px;border-radius:12px;font-size:20px}.tool-ai{right:19%;bottom:17%}.tool-ps{right:-2%;bottom:21%}.typing-ui{left:8%;bottom:4%;}.typing-hand{left:11%;bottom:27%;transform:scale(.7) rotate(13deg)}.output-stream{left:5%;bottom:31%;width:170px}.screen-sequence{grid-template-columns:1fr;padding-bottom:95px}.screen-sequence .ui-panel{height:125px}.logo-grid i{height:42px}.stats div+div{padding-left:10px}.stats strong{font-size:.88rem}.intro-mark{font-size:.82rem;letter-spacing:.055em}
}

@media (max-width:900px){
  .portfolio-heading{grid-template-columns:1fr;gap:28px}.portfolio-intro{max-width:620px}.portfolio-runway{grid-template-columns:1fr}.project-index{grid-template-columns:1fr 1fr}.project-item{min-height:98px}.featured-project{order:2}.archive-note{order:3;position:relative;top:auto;display:grid;grid-template-columns:1fr auto;gap:0 28px}.archive-note strong{grid-column:2;grid-row:1/3;margin:0}.archive-note p{max-width:450px}.archive-meter,.archive-note a{grid-column:1/-1}.featured-frame{min-height:620px}
}

@media (max-width:780px){
  .nav{height:118px;padding:18px 0;align-items:flex-start}.intro-mark{max-width:310px;flex-wrap:wrap;white-space:normal;font-size:clamp(1.7rem,8vw,2.2rem);line-height:.92;letter-spacing:-.05em;row-gap:.12em}.hero-grid{min-height:0}.portfolio-showcase{background:linear-gradient(180deg,#06070a 0 58px,#f1efe9 58px 100%)}.portfolio-shell{padding:125px 0 95px}.portfolio-heading h2{font-size:clamp(3.2rem,14vw,5.8rem)}.featured-frame{min-height:500px}.featured-info{grid-template-columns:1fr auto}.featured-info>a{grid-column:1/-1}.project-index{grid-template-columns:1fr 1fr}.project-item{padding-left:43px}.project-item:hover,.project-item:focus-visible,.project-item.is-active{padding-left:48px}
}

@media (max-width:470px){
  .portfolio-shell{padding-top:110px}.portfolio-heading{padding-bottom:48px}.portfolio-heading h2{font-size:clamp(2.9rem,13vw,4.2rem)}.portfolio-runway{padding-top:40px}.project-index{grid-template-columns:1fr}.project-item{min-height:88px}.featured-frame{min-height:410px}.featured-frame img{width:110%;height:87%}.featured-info{grid-template-columns:1fr}.project-spec{grid-template-columns:1fr 1fr}.archive-note{grid-template-columns:1fr}.archive-note strong{grid-column:1;grid-row:auto;margin:18px 0}.intro-mark{font-size:clamp(1.65rem,8.2vw,2rem)}.nav-links.is-open{top:106px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.key-flash{display:none}
}

/* Dark identity-cover archive */
.hero::before { height:76px; }
.character-wrap { bottom:-42px; }
.portfolio-showcase { background:#06070a; color:#f7f5f0; }
.portfolio-shell { padding:clamp(86px,8vw,125px) 0 clamp(90px,9vw,145px); }
.portfolio-heading { padding-bottom:clamp(46px,5vw,72px); border-color:rgba(255,255,255,.14); }
.section-kicker span { color:#aaa6b0; }
.section-kicker b { background:#f3f0e8; color:#0b0b0d; }
.portfolio-heading h2 { max-width:900px; font-size:clamp(3.3rem,6.2vw,6.8rem); color:#f7f5f0; }
.portfolio-heading h2 em { color:#b08cff; }
.portfolio-intro { color:#a29eaa; }
.cover-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(13px,1.4vw,22px); padding-top:clamp(45px,5vw,72px); }
.cover-card { min-width:0; }
.project-cover { --cover-bg:#101118; --cover-ink:#fff; --cover-muted:rgba(255,255,255,.58); --cover-accent:#8b5cf6; position:relative; aspect-ratio:4/5; overflow:hidden; isolation:isolate; padding:18px; color:var(--cover-ink); background:var(--cover-bg); border:1px solid rgba(255,255,255,.13); transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease; }
.project-cover:hover { transform:translateY(-8px); border-color:color-mix(in srgb,var(--cover-accent) 60%,white); box-shadow:0 25px 55px rgba(0,0,0,.42),0 0 35px color-mix(in srgb,var(--cover-accent) 18%,transparent); }
.project-cover::before { content:""; position:absolute; z-index:-2; width:72%; aspect-ratio:1; right:-23%; top:14%; border-radius:50%; background:var(--cover-accent); opacity:.19; filter:blur(22px); }
.project-cover::after { content:""; position:absolute; z-index:-1; inset:0; opacity:.14; background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(to bottom,transparent 8%,#000 50%,transparent 96%); }
.cover-top,.cover-foot { position:absolute; z-index:4; left:18px; right:18px; display:flex; align-items:center; justify-content:space-between; text-transform:uppercase; letter-spacing:.12em; font-size:7px; color:var(--cover-muted); }
.cover-top { top:18px; }.cover-foot{bottom:18px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--cover-ink) 17%,transparent)}
.cover-top b,.cover-foot b { color:var(--cover-ink); font-size:8px; }
.cover-symbol { position:absolute; z-index:1; right:-2%; top:12%; color:var(--cover-accent); font:800 clamp(7rem,11vw,12rem)/1 "Manrope",sans-serif; letter-spacing:-.12em; opacity:.92; transform:rotate(-8deg); text-shadow:0 0 38px color-mix(in srgb,var(--cover-accent) 45%,transparent); }
.cover-symbol::after { content:""; position:absolute; left:12%; top:15%; width:72%; aspect-ratio:1; border:1px solid currentColor; border-radius:50%; opacity:.33; transform:scale(1.25); }
.cover-copy { position:absolute; z-index:3; left:18px; right:14px; bottom:48px; }
.cover-copy p { margin:0 0 9px; color:var(--cover-muted); text-transform:uppercase; letter-spacing:.11em; font-size:7px; }
.cover-copy h3 { margin:0; color:var(--cover-ink); font:800 clamp(1.65rem,2.6vw,3rem)/.88 "Manrope",sans-serif; letter-spacing:-.07em; text-transform:uppercase; }
.cover-copy small { display:block; margin-top:11px; color:var(--cover-muted); font-size:9px; }
.cover-voyatic .project-cover { --cover-bg:radial-gradient(circle at 70% 25%,#153042,#070d12 58%);--cover-accent:#57e4ff; }
.cover-kudu .project-cover { --cover-bg:radial-gradient(circle at 72% 28%,#71352d,#2c0d0d 62%);--cover-accent:#f2b66f; }
.cover-kudu .cover-symbol { font-family:"Playfair Display",serif;font-style:italic; }
.cover-atlanta .project-cover { --cover-bg:radial-gradient(circle at 70% 24%,#194e3d,#071e18 64%);--cover-accent:#dfbc61; }
.cover-atlanta .cover-symbol { width:145px;height:145px;display:grid;place-items:center;border:2px solid currentColor;border-radius:50%;font-size:7rem;right:8%;top:18%; }
.cover-americanflat .project-cover { --cover-bg:#ece8df;--cover-ink:#18171b;--cover-muted:rgba(24,23,27,.58);--cover-accent:#ef543f;border-color:rgba(255,255,255,.45); }
.cover-americanflat .project-cover::after { background-image:linear-gradient(rgba(20,20,20,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(20,20,20,.2) 1px,transparent 1px); }
.cover-fourpoints .project-cover { --cover-bg:radial-gradient(circle at 70% 23%,#493020,#101011 60%);--cover-accent:#ff742b; }
.cover-fourpoints .cover-symbol::after { border-radius:0;transform:rotate(45deg) scale(.75); }
.cover-douglas .project-cover { --cover-bg:linear-gradient(150deg,#102b49,#060b12 68%);--cover-accent:#d7e0eb; }
.cover-douglas .cover-symbol { font-family:"Playfair Display",serif;font-style:italic; }
.cover-vers .project-cover { --cover-bg:radial-gradient(circle at 68% 25%,#3e247f,#110b27 64%);--cover-accent:#55e8ff; }
.cover-vers .cover-symbol { font-size:clamp(5rem,8vw,8rem);top:25%;right:8%;transform:perspective(300px) rotateY(-24deg) rotateZ(-5deg); }
.cover-vers .cover-symbol::after { border-radius:0;transform:rotate(45deg) scale(.85); }
.cover-ai .project-cover { --cover-bg:radial-gradient(circle at 68% 20%,#0c4770,#071521 65%);--cover-accent:#98ff5a; }
.cover-ai .cover-symbol { font-size:clamp(5.5rem,9vw,9rem);top:23%; }

@media (max-width:1050px){.cover-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:780px){
  .character-wrap{bottom:-22px}.portfolio-showcase{background:#06070a}.portfolio-shell{padding:72px 0 100px}.portfolio-heading{grid-template-columns:1fr}.portfolio-heading h2{font-size:clamp(3rem,13.5vw,5rem)}.portfolio-intro{color:#aaa6b0}.cover-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:46px}.project-cover{padding:14px}.cover-top,.cover-foot{left:14px;right:14px}.cover-top{top:14px}.cover-foot{bottom:14px}.cover-copy{left:14px;bottom:43px}.cover-copy h3{font-size:clamp(1.4rem,6vw,2rem)}.cover-symbol{font-size:clamp(6rem,28vw,9rem)}
}
@media (max-width:470px){
  .portfolio-shell{padding-top:62px}.cover-grid{grid-template-columns:1fr;gap:16px}.project-cover{aspect-ratio:4/4.7}.cover-copy h3{font-size:clamp(2.2rem,11vw,3.4rem)}.cover-symbol{font-size:clamp(8rem,45vw,12rem)}.cover-atlanta .cover-symbol{width:135px;height:135px;font-size:6rem}.hero::before{height:48px}.character-wrap{bottom:-15px}
}

/* Interactive portfolio archive */
.portfolio-showcase{overflow:hidden;background:radial-gradient(circle at 6% 32%,rgba(255,91,28,.08),transparent 28%),radial-gradient(circle at 96% 82%,rgba(79,50,255,.09),transparent 30%),#09090d;color:#f5f2ed}
.portfolio-shell{width:min(96vw,1500px);padding:clamp(76px,7vw,112px) 0 34px}
.archive-heading{padding-bottom:24px}
.archive-kicker{display:flex;align-items:center;gap:11px;margin:0 0 13px;font:700 .68rem/1.1 "IBM Plex Mono",monospace;letter-spacing:.19em;text-transform:uppercase;color:#ff7b32}
.archive-kicker i{width:28px;height:1px;background:#ff7b32;box-shadow:0 0 12px #ff7b32}
.archive-kicker b{margin-left:8px;color:#57545c}
.archive-heading-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,27%);gap:28px;align-items:end}
.archive-heading-row>*{min-width:0}
.archive-heading h2{max-width:980px;margin:0;overflow:hidden;font-size:clamp(3.6rem,6.2vw,7.2rem);line-height:.84;letter-spacing:-.068em;font-weight:750;white-space:nowrap}
.archive-heading h2 em{color:#625f63;font-style:normal}
.archive-heading-row>p{max-width:440px;margin:0 0 5px;color:#aaa6ad;font-size:clamp(.82rem,1vw,1rem);line-height:1.55}
.archive-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:0 0 15px;padding:6px;border:1px solid #25242b;border-radius:999px;background:rgba(10,9,14,.78)}
.archive-tabs button{min-height:36px;border:1px solid transparent;border-radius:999px;background:transparent;color:#77737c;font:600 .62rem/1 "IBM Plex Mono",monospace;letter-spacing:.03em;cursor:pointer;transition:.25s ease}
.archive-tabs button small{margin-left:5px;color:#4c4950;font-size:.52rem}
.archive-tabs button:hover{color:#fff}.archive-tabs button.is-active{border-color:#a64d20;background:linear-gradient(90deg,rgba(255,103,36,.16),rgba(255,103,36,.06));color:#fff;box-shadow:inset 0 0 22px rgba(255,105,38,.08)}
.archive-tabs button.is-active small{color:#ff8a48}
.archive-stage{display:grid;grid-template-columns:250px minmax(420px,1fr) 250px;gap:14px;height:clamp(440px,36vw,560px)}
.collection-panel{display:flex;flex-direction:column;padding:28px 24px;border:1px solid #29272e;border-radius:22px;background:linear-gradient(145deg,rgba(21,17,21,.96),rgba(10,9,13,.96));overflow:hidden}
.collection-panel strong{color:#ff7d34;font-size:clamp(2.3rem,3vw,3.55rem);line-height:1;letter-spacing:-.06em}
.collection-panel>p,.reel-heading>span{margin:22px 0 10px;color:#6b676e;font:700 .58rem/1 "IBM Plex Mono",monospace;letter-spacing:.15em;text-transform:uppercase}
.collection-panel h3{margin:0;color:#f4f1ec;font-size:clamp(1.55rem,2vw,2.15rem);line-height:.92;letter-spacing:-.045em}
.collection-panel>span{display:block;margin-top:18px;color:#969199;font-size:.82rem;line-height:1.55}
.collection-controls{display:flex;gap:10px;margin-top:auto}
.collection-controls button{display:grid;place-items:center;width:42px;height:42px;border:1px solid #3b3840;border-radius:50%;background:#111015;color:#fff;font-size:1rem;cursor:pointer;transition:.25s ease}
.collection-controls button:hover{border-color:#ff7d34;color:#ff7d34;transform:translateY(-2px)}
.archive-feature{position:relative;min-width:0;border:1px solid #29272e;border-radius:22px;overflow:hidden;background:#151319;isolation:isolate}
.archive-feature .project-cover{width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0;padding:clamp(24px,3vw,42px);animation:none}
.archive-feature .project-cover::before{content:"";position:absolute;z-index:4;inset:-50% -10%;background:linear-gradient(110deg,transparent 43%,rgba(255,255,255,.13) 49%,transparent 55%);transform:translateX(-75%);animation:archiveSheen 7s ease-in-out infinite;pointer-events:none}
.archive-feature.is-changing .project-cover{animation:coverSwap .55s cubic-bezier(.2,.8,.2,1)}
.archive-feature .cover-copy{bottom:clamp(58px,6vw,84px)}
.archive-feature .cover-copy h3{font-size:clamp(3.1rem,6vw,6.5rem)}
.archive-feature .cover-symbol{font-size:clamp(9rem,18vw,19rem);opacity:.48}
.view-next{position:absolute;z-index:6;right:20px;bottom:20px;padding:12px 16px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(9,8,11,.7);backdrop-filter:blur(12px);color:#fff;font:700 .57rem/1 "IBM Plex Mono",monospace;letter-spacing:.09em;text-transform:uppercase;cursor:pointer;transition:.25s ease}
.view-next:hover{background:#f5f1eb;color:#101014;transform:translateY(-2px)}
.next-stack{display:grid;grid-template-rows:repeat(3,1fr);gap:10px}
.next-project{position:relative;overflow:hidden;padding:16px;border:1px solid #2b2930;border-radius:18px;background:var(--thumb-bg,#15131a);color:#fff;text-align:left;cursor:pointer;isolation:isolate;transition:.3s cubic-bezier(.2,.8,.2,1)}
.next-project::before{content:attr(data-symbol);position:absolute;right:10px;top:50%;transform:translateY(-52%) rotate(-8deg);color:var(--thumb-accent,#fff);font-size:clamp(3.6rem,5.2vw,6.2rem);font-weight:800;letter-spacing:-.12em;opacity:.28}
.next-project::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 55%,rgba(255,255,255,.08));pointer-events:none}
.next-project:hover{border-color:var(--thumb-accent,#ff7d34);transform:translateX(-5px)}
.next-project small,.next-project span{position:relative;z-index:2;display:block}.next-project small{color:#b6b1ba;font:600 .52rem/1 "IBM Plex Mono",monospace;letter-spacing:.1em}.next-project span{max-width:75%;margin-top:12px;font-size:1.15rem;font-weight:750;line-height:.95;letter-spacing:-.04em}
.reel-heading{display:flex;justify-content:space-between;align-items:center;margin-top:15px}.reel-heading>span{margin:0}
.reel-actions{display:flex;align-items:center;gap:9px}.view-collection{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border:1px solid #ff7b32;border-radius:999px;color:#ff9a61;font:700 .54rem/1 "IBM Plex Mono",monospace;letter-spacing:.07em;text-decoration:none;text-transform:uppercase;transition:.2s ease}.view-collection:hover{background:#ff7b32;color:#100b09;transform:translateY(-2px)}
.pause-reel{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #2b2930;border-radius:999px;background:#111016;color:#88838c;font:700 .54rem/1 "IBM Plex Mono",monospace;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.pause-reel i{width:6px;height:6px;border-radius:50%;background:#ff742d;box-shadow:0 0 9px #ff742d}.pause-reel[aria-pressed="true"] i{background:#777;box-shadow:none}
.archive-reel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(145px,1fr);gap:9px;margin-top:11px;padding-bottom:8px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#3a363d transparent}
.reel-project{position:relative;height:104px;overflow:hidden;padding:12px;border:1px solid #26242b;border-radius:12px;background:var(--thumb-bg,#17141a);color:#fff;text-align:left;cursor:pointer;transition:.25s ease}
.reel-project::after{content:attr(data-symbol);position:absolute;right:8px;bottom:-12px;color:var(--thumb-accent,#fff);font-size:4.6rem;font-weight:800;letter-spacing:-.12em;opacity:.25;transform:rotate(-7deg)}
.reel-project small,.reel-project span{position:relative;z-index:2;display:block}.reel-project small{color:#817d84;font:600 .5rem/1 "IBM Plex Mono",monospace}.reel-project span{max-width:76%;margin-top:8px;font-size:.9rem;font-weight:700;line-height:.95}.reel-project:hover,.reel-project.is-active{border-color:var(--thumb-accent,#ff7d34);transform:translateY(-3px)}
@keyframes coverSwap{0%{opacity:.18;transform:scale(1.035) translateX(16px)}100%{opacity:1;transform:none}}
@keyframes archiveSheen{0%,55%{transform:translateX(-75%)}75%,100%{transform:translateX(75%)}}

@media (max-width:1100px){
  .archive-heading h2{white-space:normal}.archive-stage{grid-template-columns:220px minmax(0,1fr);height:510px}.next-stack{display:none}.archive-heading-row{grid-template-columns:1fr 300px}
}
@media (max-width:760px){
  .portfolio-shell{width:min(92vw,620px);padding-top:70px}.archive-heading-row{display:block}.archive-heading h2{font-size:clamp(3.25rem,15vw,5.5rem)}.archive-heading-row>p{margin-top:22px}.archive-tabs{display:flex;overflow-x:auto;border-radius:18px}.archive-tabs button{flex:0 0 auto;padding:0 18px}.archive-stage{display:flex;height:auto;flex-direction:column}.collection-panel{min-height:250px}.archive-feature{height:470px}.next-stack{display:grid;grid-template-columns:repeat(3,minmax(155px,1fr));grid-template-rows:130px;overflow-x:auto}.archive-feature .cover-copy h3{font-size:clamp(2.6rem,12vw,4.6rem)}.archive-feature .cover-symbol{font-size:clamp(8rem,38vw,13rem)}
}
@media (max-width:470px){
  .portfolio-shell{padding-top:64px}.archive-kicker b{margin-left:auto}.archive-heading h2{font-size:clamp(3rem,15.5vw,4.5rem);line-height:.88}.archive-feature{height:430px}.archive-feature .project-cover{padding:20px}.archive-feature .cover-top,.archive-feature .cover-foot{left:20px;right:20px}.archive-feature .cover-copy{left:20px;bottom:64px}.archive-feature .cover-copy h3{font-size:2.7rem}.archive-feature .cover-symbol{font-size:9rem}.view-next{right:14px;bottom:14px}.archive-reel{grid-auto-columns:142px}.reel-heading{align-items:flex-start;gap:14px}.reel-actions{align-items:flex-end;flex-direction:column}.view-collection{min-height:40px}
}
@media (prefers-reduced-motion:reduce){.archive-feature .project-cover::before{animation:none}.archive-feature.is-changing .project-cover{animation:none}.next-project,.reel-project{transition:none}}

/* Full Branddone library controls + original project covers */
.typed-archive-text{color:#f5f2ed}.archive-cursor{display:inline-block;width:.08em;height:.78em;margin-left:.05em;background:#ff7b32;vertical-align:-.02em;animation:cursorBlink .8s steps(1) infinite}
.archive-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,25%);gap:12px;margin-bottom:10px}
.archive-tools .archive-tabs{grid-template-columns:repeat(2,minmax(0,1fr));margin:0}
.archive-search{display:flex;align-items:center;gap:9px;min-width:0;padding:0 16px;border:1px solid #25242b;border-radius:999px;background:rgba(10,9,14,.78);color:#716d75}
.archive-search>svg{flex:0 0 17px;width:17px;fill:none;stroke:currentColor;stroke-width:1.6}.archive-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#eeeaf0;font:500 .7rem/1 "IBM Plex Mono",monospace}.archive-search input::placeholder{color:#67636b}
.archive-industries{display:flex;gap:7px;margin-bottom:15px;padding:2px 0 6px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#39353d transparent}
.archive-industries button{flex:0 0 auto;min-height:32px;padding:0 13px;border:1px solid #2d2a32;border-radius:999px;background:#0d0c11;color:#7f7a83;font:600 .55rem/1 "IBM Plex Mono",monospace;cursor:pointer;transition:.2s ease}.archive-industries button:hover{color:#fff;border-color:#5a535e}.archive-industries button.is-active{border-color:#ff7b32;background:#ff7b32;color:#130d0a}
.archive-feature>img{display:block;width:100%;height:100%;object-fit:contain;background:#0b0a0e;transition:opacity .2s ease,transform .55s cubic-bezier(.2,.8,.2,1)}
.archive-feature::before{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(5,5,8,.08),transparent 45%,rgba(5,5,8,.4));pointer-events:none}
.archive-feature.is-changing>img{opacity:.25;transform:scale(1.035) translateX(12px)}
.feature-cover-meta{position:absolute;z-index:4;top:18px;left:18px;right:18px;display:flex;justify-content:space-between;color:#fff;text-shadow:0 1px 12px #000;font:700 .55rem/1 "IBM Plex Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.next-project img,.reel-project img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.next-project::before{display:none}.next-project::after{background:linear-gradient(90deg,rgba(5,5,8,.84),rgba(5,5,8,.06))}.next-project:hover img,.reel-project:hover img{transform:scale(1.06)}
.reel-project::after{content:"";inset:0;right:0;bottom:0;transform:none;background:linear-gradient(90deg,rgba(5,5,8,.82),rgba(5,5,8,.08));opacity:1}
@keyframes cursorBlink{0%,48%{opacity:1}49%,100%{opacity:0}}
@media (max-width:760px){.archive-tools{grid-template-columns:1fr}.archive-tools .archive-tabs{display:flex}.archive-tabs button{min-height:44px}.archive-search{min-height:46px}.archive-industries button{min-height:40px}}
@media (prefers-reduced-motion:reduce){.archive-cursor{animation:none}.archive-feature>img,.next-project img,.reel-project img{transition:none}}
.archive-stage{height:auto;align-items:stretch}.archive-feature{height:auto;min-height:0;aspect-ratio:var(--feature-ratio,4/3)}.archive-feature>img{width:100%;height:100%;object-fit:cover;background:transparent}

/* Portfolio disciplines and services */
.archive-heading h2{max-width:none;overflow:visible;white-space:normal;text-wrap:balance}
.archive-fields{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));margin:0 0 10px;border:1px solid #242229;border-radius:999px;overflow:hidden;background:#0b0a0f}
.archive-fields button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 10px;border:0;border-right:1px solid #242229;background:transparent;color:#8a858e;font:600 .54rem/1 "IBM Plex Mono",monospace;white-space:nowrap;cursor:pointer;transition:.2s ease}.archive-fields button:last-child{border-right:0}.archive-fields button small{flex:0 0 auto;margin:0;color:#4f4b53;font-size:.48rem}.archive-fields button:hover,.archive-fields button.is-active{background:rgba(255,123,50,.1);color:#fff}.archive-fields button.is-active small{color:#ff7b32}
.services-showcase{position:relative;z-index:3;overflow:hidden;background:radial-gradient(circle at 45% 95%,rgba(89,57,208,.1),transparent 34%),#09090d;color:#f5f2ed;border-top:1px solid #1e1c23}
.services-showcase::before{content:"SERVICES";position:absolute;left:-2vw;right:0;top:150px;color:rgba(255,255,255,.022);font-size:26vw;font-weight:800;line-height:.65;letter-spacing:-.1em;pointer-events:none}
.services-shell{position:relative;width:min(96vw,1500px);padding:clamp(90px,8vw,130px) 0 clamp(105px,9vw,145px)}
.services-heading{display:grid;grid-template-columns:minmax(0,78%) minmax(230px,22%);gap:32px;align-items:end;margin-bottom:42px}
.services-heading h2{max-width:none;margin:0;font-size:clamp(3.25rem,4.45vw,5.15rem);line-height:.9;letter-spacing:-.07em;white-space:nowrap;text-wrap:nowrap}.services-heading h2 em{color:#656169;font-style:normal}.services-heading>p{max-width:400px;margin:0 0 4px;color:#aaa5ae;font-size:.9rem;line-height:1.55}
.services-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;align-items:start}
.service-card{--service-accent:#ff7b32;position:relative;display:flex;min-height:390px;flex-direction:column;padding:20px 18px 18px;border:1px solid #3a373f;border-radius:24px;background:linear-gradient(180deg,rgba(34,33,40,.78),rgba(15,14,19,.96));box-shadow:inset 0 -70px 90px color-mix(in srgb,var(--service-accent) 10%,transparent);overflow:hidden;transition:.4s cubic-bezier(.2,.8,.2,1)}
.service-card:nth-child(even){margin-top:-16px}.service-card:hover{border-color:color-mix(in srgb,var(--service-accent) 55%,#39353e);transform:translateY(-10px)}.service-card>i{position:absolute;top:23px;right:18px;width:5px;height:5px;border-radius:50%;background:var(--service-accent);box-shadow:0 0 12px var(--service-accent)}
.service-number{color:#69656e;font:700 .58rem/1 "IBM Plex Mono",monospace}.service-icon{display:grid;place-items:center;width:50px;height:50px;margin-top:48px;border:1px solid color-mix(in srgb,var(--service-accent) 50%,transparent);border-radius:15px;background:color-mix(in srgb,var(--service-accent) 9%,transparent);color:var(--service-accent)}.service-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.service-card h3{margin:24px 0 0;font-size:clamp(1.05rem,1.35vw,1.45rem);line-height:.94;letter-spacing:-.045em}.service-card p{margin:40px 0 0;color:#aaa5ad;font-size:.72rem;line-height:1.55}.service-card small{margin-top:auto;padding-top:18px;border-top:1px solid #39363e;color:var(--service-accent);font:700 .48rem/1.4 "IBM Plex Mono",monospace;letter-spacing:.06em}
.service-violet{--service-accent:#8e67ff}.service-blue{--service-accent:#48a8ff}.service-green{--service-accent:#68cf72}.service-gold{--service-accent:#e6a92f}.service-pink{--service-accent:#e9588d}
@media (max-width:1150px){.archive-fields{grid-template-columns:repeat(4,1fr);border-radius:18px}.archive-fields button:nth-child(4){border-right:0}.archive-fields button:nth-child(-n+4){border-bottom:1px solid #242229}.services-grid{grid-template-columns:repeat(3,1fr)}.service-card:nth-child(even){margin-top:0}.services-heading{grid-template-columns:1fr}.services-heading h2{font-size:clamp(3.2rem,7.2vw,5.4rem)}.services-heading>p{margin-top:20px}}
@media (max-width:760px){.archive-fields{display:flex;overflow-x:auto}.archive-fields button{flex:0 0 auto;min-height:44px;padding:0 18px;border-bottom:0!important}.services-shell{width:min(92vw,620px);padding:78px 0 100px}.services-heading{display:block}.services-heading h2{font-size:clamp(3.2rem,15vw,5.4rem);white-space:normal;text-wrap:balance}.services-heading>p{margin-top:24px}.services-grid{grid-template-columns:1fr 1fr}.service-card{min-height:360px}}
@media (max-width:470px){.services-grid{grid-template-columns:1fr}.service-card{min-height:330px}.service-card p{margin-top:28px}.service-icon{margin-top:32px}}
@media (prefers-reduced-motion:reduce){.service-card{transition:none}}

/* Continuous reel + single-line archive + service motion */
.archive-heading-row{grid-template-columns:minmax(0,74%) minmax(250px,24%)}
.archive-heading h2{font-size:clamp(2.9rem,4.65vw,6rem);line-height:.9;white-space:nowrap;text-wrap:nowrap}
.services-heading h2 .service-cursor{display:inline-block;width:.075em;height:.78em;margin-left:.05em;background:#ff7b32;vertical-align:-.02em;animation:cursorBlink .8s steps(1) infinite}
.service-card::after{content:"";position:absolute;inset:-80% -40%;background:linear-gradient(115deg,transparent 44%,color-mix(in srgb,var(--service-accent) 13%,transparent) 50%,transparent 56%);transform:translateX(-45%) rotate(8deg);animation:serviceSheen 7s ease-in-out infinite;pointer-events:none}
.service-card:nth-child(2)::after{animation-delay:-1.1s}.service-card:nth-child(3)::after{animation-delay:-2.2s}.service-card:nth-child(4)::after{animation-delay:-3.3s}.service-card:nth-child(5)::after{animation-delay:-4.4s}.service-card:nth-child(6)::after{animation-delay:-5.5s}
.service-icon{position:relative;z-index:2;animation:serviceIconFloat 4.8s ease-in-out infinite}.service-card:nth-child(even) .service-icon{animation-delay:-2.4s}
.service-card:hover{z-index:8;border-color:var(--service-accent);transform:translateY(-24px) scale(1.07);box-shadow:0 28px 70px rgba(0,0,0,.52),inset 0 -80px 110px color-mix(in srgb,var(--service-accent) 16%,transparent)}
@keyframes serviceSheen{0%,56%{transform:translateX(-45%) rotate(8deg)}76%,100%{transform:translateX(45%) rotate(8deg)}}
@keyframes serviceIconFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(3deg)}}
@media (max-width:1100px){.archive-heading-row{grid-template-columns:1fr}.archive-heading-row>p{margin-top:18px}.archive-heading h2{font-size:clamp(2.4rem,6.4vw,4.6rem)}}
@media (max-width:760px){.archive-heading h2{font-size:clamp(1.45rem,7.1vw,3rem);letter-spacing:-.055em}.services-heading h2{min-height:2.6em}}
@media (prefers-reduced-motion:reduce){.service-card::after,.service-icon,.service-cursor{animation:none}.service-card:hover{transform:none}}

/* Food & beverage logo archive */
.logo-portfolio{margin-top:clamp(90px,9vw,150px);padding-top:clamp(72px,7vw,112px);border-top:1px solid #302d34}.logo-portfolio-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,370px);gap:40px;align-items:end;margin-bottom:42px}.logo-portfolio-heading h3{margin:0;font-size:clamp(3.8rem,6.4vw,7.4rem);line-height:.84;letter-spacing:-.075em}.logo-portfolio-heading h3 em{display:block;color:#68646c;font-style:normal}.logo-portfolio-heading>p{margin:0 0 6px;color:#aaa5ad;font-size:.88rem;line-height:1.65}.logo-niche-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.logo-niche-card{--logo-accent:#ff7b32;position:relative;min-width:0;overflow:hidden;border:1px solid #36333b;border-radius:22px;background:#111016;color:#fff;text-decoration:none;transition:.3s cubic-bezier(.2,.8,.2,1)}.logo-niche-visual{position:relative;display:block;aspect-ratio:1.18/1;overflow:hidden;background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--logo-accent) 18%,transparent),transparent 62%),#0d0c11}.logo-niche-visual::before{content:"";position:absolute;left:50%;top:50%;width:76%;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--logo-accent) 30%,transparent);border-radius:50%;transform:translate(-50%,-50%)}.logo-niche-visual img{position:absolute;left:50%;top:50%;width:70%;height:57%;object-fit:cover;border:3px solid #e4e4e7;border-radius:9px;background:#fff;box-shadow:0 18px 35px rgba(0,0,0,.55);transform:translate(-50%,-50%) translate(calc((var(--image-index) - 1) * 12px),calc((var(--image-index) - 1) * 8px)) rotate(calc((var(--image-index) - 1) * 6deg));transition:.42s cubic-bezier(.2,.8,.2,1)}.logo-niche-visual img:nth-child(1){z-index:3}.logo-niche-visual img:nth-child(2){z-index:2;opacity:.78}.logo-niche-visual img:nth-child(3){z-index:1;opacity:.55}.logo-niche-meta{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;min-height:76px;padding:0 17px;border-top:1px solid #36333b}.logo-niche-meta small{color:var(--logo-accent);font:700 .52rem/1 "IBM Plex Mono",monospace}.logo-niche-meta strong{min-width:0;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.logo-niche-meta b{color:#77727b;font:700 .48rem/1 "IBM Plex Mono",monospace;text-transform:uppercase}.logo-niche-meta i{color:#77727b;font-style:normal;transition:.25s ease}.logo-niche-card:hover{z-index:3;border-color:var(--logo-accent);transform:translateY(-8px);box-shadow:0 24px 50px rgba(0,0,0,.34)}.logo-niche-card:hover .logo-niche-visual img:nth-child(1){transform:translate(-50%,-53%) rotate(-2deg) scale(1.03)}.logo-niche-card:hover .logo-niche-meta i{color:var(--logo-accent);transform:translate(3px,-3px)}.logo-niche-card:focus-visible{outline:3px solid var(--logo-accent);outline-offset:3px}
@media(max-width:1120px){.logo-niche-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.logo-portfolio{margin-top:80px;padding-top:68px}.logo-portfolio-heading{grid-template-columns:1fr}.logo-portfolio-heading h3{font-size:clamp(3.4rem,14vw,5.4rem)}.logo-niche-grid{grid-template-columns:1fr}.logo-niche-visual{aspect-ratio:1.5/1}.logo-niche-meta{min-height:68px}.logo-niche-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.logo-niche-card,.logo-niche-visual img,.logo-niche-meta i{transition:none}.logo-niche-card:hover,.logo-niche-card:hover .logo-niche-visual img:nth-child(1){transform:none}}

.logo-industry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.logo-industry-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;min-height:64px;padding:0 17px;border:1px solid #343139;border-radius:999px;background:#0f0e13;color:#8f8a93;text-decoration:none}.logo-industry-item small{color:#5f5a63;font:700 .5rem/1 "IBM Plex Mono",monospace}.logo-industry-item strong{min-width:0;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.logo-industry-item b{color:#57525b;font:700 .46rem/1 "IBM Plex Mono",monospace;text-transform:uppercase}.logo-industry-item i{font-style:normal}.logo-industry-item.is-live{border-color:#ff7b32;background:linear-gradient(90deg,rgba(255,123,50,.16),rgba(255,123,50,.035));color:#fff;cursor:pointer;transition:.24s ease}.logo-industry-item.is-live small,.logo-industry-item.is-live b,.logo-industry-item.is-live i{color:#ff7b32}.logo-industry-item.is-live:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(0,0,0,.35)}.logo-industry-item.is-upcoming{cursor:default}.logo-industry-item:focus-visible{outline:3px solid #ff7b32;outline-offset:3px}@media(max-width:1100px){.logo-industry-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.logo-industry-grid{grid-template-columns:1fr 1fr}.logo-industry-item{min-height:58px;border-radius:18px}.logo-industry-item b{display:none}}@media(max-width:470px){.logo-industry-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.logo-industry-item.is-live{transition:none}.logo-industry-item.is-live:hover{transform:none}}

/* Search across logo industries and style collections. */
.logo-field-search{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);gap:24px;align-items:center;margin:0 0 24px}.logo-field-search label{color:#bbb6c0;font:700 .62rem/1 "IBM Plex Mono",monospace;letter-spacing:.11em;text-transform:uppercase}.logo-field-search-control{position:relative}.logo-field-search input{width:100%;min-height:52px;padding:0 150px 0 20px;border:1px solid #343139;border-radius:999px;background:#0f0e13;color:#fff;font:650 .78rem/1 "Manrope",sans-serif;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.logo-field-search input::placeholder{color:#69646e}.logo-field-search input:focus-visible{border-color:#ff7b32;box-shadow:0 0 0 3px rgba(255,123,50,.18)}.logo-field-search-control span{position:absolute;right:18px;top:50%;color:#77717c;font:700 .52rem/1 "IBM Plex Mono",monospace;text-transform:uppercase;transform:translateY(-50%);pointer-events:none}.logo-field-empty{margin:0 0 24px;padding:30px;border:1px solid #343139;border-radius:18px;color:#aaa5ae;text-align:center}.logo-industry-item[hidden]{display:none}@media(max-width:700px){.logo-field-search{grid-template-columns:1fr;gap:10px}.logo-field-search input{padding-right:20px}.logo-field-search-control span{position:static;display:block;margin:9px 0 0 16px;transform:none}}

/* Testimonials, contact CTA and footer */
.testimonials-showcase{position:relative;z-index:3;overflow:hidden;border-top:1px solid #1f1d24;background:radial-gradient(circle at 88% 22%,rgba(146,103,255,.09),transparent 31%),#09090d;color:#f5f2ed}
.testimonials-showcase::before{content:"TRUST";position:absolute;left:18%;top:17%;color:rgba(255,255,255,.018);font-size:25vw;font-weight:800;line-height:1;letter-spacing:-.1em;pointer-events:none}
.testimonials-shell{position:relative;width:min(96vw,1500px);padding:clamp(90px,8vw,125px) 0 clamp(100px,9vw,145px)}
.reviews-heading{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:40px;align-items:end;margin-bottom:64px}
.reviews-heading h2{position:relative;margin:0;font-size:clamp(4rem,6.2vw,7.2rem);line-height:.87;letter-spacing:-.07em;transform-origin:12% 55%;animation:reviewHeadingBuzz 5.2s steps(1,end) infinite}.reviews-heading h2 em{color:#68646c;font-style:normal}
.reviews-heading h2::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 13%,rgba(185,255,50,.12) 13% 13.3%,transparent 13.3% 100%);mix-blend-mode:screen;opacity:0;pointer-events:none;animation:reviewHeadingScan 5.2s linear infinite}
.upwork-score{display:flex;flex-direction:column;gap:10px;padding:24px 0;border-top:1px solid #4b4750;border-bottom:1px solid #4b4750;text-decoration:none;transition:.25s ease}.upwork-score strong{color:#b9ff32;font-size:2.15rem;line-height:1}.upwork-score span{color:#aaa5ad;font-size:.72rem}.upwork-score:hover{padding-left:10px;border-color:#b9ff32}
.review-stage{position:relative;display:grid;grid-template-columns:86px minmax(0,1fr) 245px;min-height:310px;border-top:1px solid #3b3840;border-bottom:1px solid #3b3840;background:linear-gradient(90deg,rgba(255,255,255,.015),transparent 65%)}
.review-quote-mark{padding-top:34px;color:#b9ff32;font:800 5.5rem/.75 Georgia,serif;animation:quoteFloat 3.8s ease-in-out infinite}.review-copy{display:flex;flex-direction:column;padding:44px 50px 34px 18px;transition:.48s cubic-bezier(.2,.8,.2,1)}.review-copy.is-changing{opacity:0;transform:translateY(22px)}
.review-copy blockquote{max-width:1000px;margin:0;font-size:clamp(2.4rem,4.1vw,5rem);line-height:1.03;letter-spacing:-.055em}.review-person{display:flex;gap:14px;align-items:center;margin-top:auto;padding-top:32px}.review-person strong{font-size:.86rem}.review-person span{color:#817d85;font:600 .6rem/1 "IBM Plex Mono",monospace;letter-spacing:.05em;text-transform:uppercase}
.review-side{display:flex;flex-direction:column;padding:38px 0 26px 28px;border-left:1px solid #3b3840}.review-stars{color:#b9ff32;letter-spacing:.2em}.review-progress{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:auto;color:#79757d;font:700 .55rem/1 "IBM Plex Mono",monospace}.review-progress>i{height:1px;background:#302d34}.review-progress b{display:block;width:33.333%;height:1px;background:#b9ff32;transition:width .45s ease}
.review-controls{display:flex;gap:8px;margin-top:22px}.review-controls button{display:grid;place-items:center;width:48px;height:48px;border:1px solid #49454d;background:#0d0c11;color:#fff;cursor:pointer;transition:.2s ease}.review-controls button:hover{border-color:#b9ff32;color:#b9ff32;transform:translateY(-3px)}
@keyframes quoteFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(-3deg)}}
@keyframes reviewHeadingBuzz{0%,72%,77%,100%{transform:translate3d(0,0,0) skewX(0)}73%{transform:translate3d(-5px,1px,0) skewX(-1deg)}74%{transform:translate3d(7px,-1px,0) skewX(1.4deg)}75%{transform:translate3d(-3px,0,0) skewX(-.6deg)}76%{transform:translate3d(2px,0,0) skewX(.3deg)}}
@keyframes reviewHeadingScan{0%,70%{opacity:0;transform:translateX(-22%)}72%{opacity:1}77%{opacity:0;transform:translateX(105%)}100%{opacity:0}}
.contact-showcase{--contact-x:0px;--contact-y:0px;--contact-copy-x:0px;--contact-copy-y:0px;position:relative;z-index:3;min-height:620px;overflow:hidden;border-top:1px solid #1f1d24;background:radial-gradient(circle at 78% 52%,rgba(185,255,50,.08),transparent 28%),#0a0a0d;color:#f5f2ed}
.contact-showcase::before{content:"";position:absolute;inset:-35%;background:conic-gradient(from 210deg at 72% 52%,transparent 0 43%,rgba(185,255,50,.055) 48%,transparent 53% 100%);animation:contactSweep 11s linear infinite;pointer-events:none}
.contact-showcase::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 118px,rgba(255,255,255,.018) 119px 120px);mask-image:linear-gradient(90deg,transparent,#000 38%,#000 82%,transparent);animation:contactGrid 14s linear infinite;pointer-events:none}
.contact-shell{position:relative;z-index:2;width:min(96vw,1500px);padding:clamp(100px,10vw,155px) 0;transform:translate3d(var(--contact-copy-x),var(--contact-copy-y),0);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.contact-shell h2{max-width:1120px;margin:0;font-size:clamp(4rem,7vw,8rem);line-height:.85;letter-spacing:-.075em}.contact-shell h2 em{color:#6a666d;font-style:normal}
.contact-link{display:inline-flex;align-items:center;gap:32px;margin-top:58px;padding:0 0 12px;border-bottom:2px solid #b9ff32;color:#b9ff32;font-weight:700;text-decoration:none;transition:.25s ease}.contact-link b{font-size:1.2rem;transition:.25s ease}.contact-link:hover{gap:46px;color:#fff;border-color:#fff}.contact-link:hover b{transform:translate(4px,-4px)}
.contact-orbit{position:absolute;right:-7vw;top:50%;width:min(58vw,800px);aspect-ratio:1;transform:translate3d(var(--contact-x),calc(-50% + var(--contact-y)),0);opacity:.5;transition:transform .65s cubic-bezier(.2,.8,.2,1)}.contact-orbit i{position:absolute;inset:10%;border:1px solid rgba(185,255,50,.18);border-radius:50%;animation:orbitPulse 6s ease-in-out infinite,orbitRotate 18s linear infinite}.contact-orbit i::after{content:"";position:absolute;left:50%;top:-5px;width:9px;height:9px;border-radius:50%;background:#b9ff32;box-shadow:0 0 18px #b9ff32}.contact-orbit i:nth-child(2){inset:25%;animation-delay:-2s,-6s;animation-direction:normal,reverse}.contact-orbit i:nth-child(3){inset:40%;animation-delay:-4s,-12s}.contact-orbit::after{content:"↗";position:absolute;left:50%;top:50%;color:rgba(185,255,50,.24);font-size:11rem;transform:translate(-50%,-50%);filter:drop-shadow(0 0 24px rgba(185,255,50,.2));animation:contactArrow 2.8s ease-in-out infinite}
@keyframes orbitPulse{0%,100%{scale:.92;opacity:.22}50%{scale:1.04;opacity:.85}}
@keyframes orbitRotate{to{rotate:360deg}}
@keyframes contactArrow{0%,100%{translate:0 0;opacity:.18}50%{translate:12px -12px;opacity:.42}}
@keyframes contactSweep{to{transform:rotate(360deg)}}
@keyframes contactGrid{to{transform:translateX(120px)}}
.site-footer{position:relative;z-index:3;display:grid;grid-template-columns:1fr auto auto;gap:70px;align-items:end;padding:38px max(2vw,24px);border-top:1px solid #302d34;background:#0a0a0d;color:#b2adb6}.site-footer a{text-decoration:none}.footer-brand{display:flex;flex-direction:column;gap:6px;color:#fff}.footer-brand small{color:#80e8ff;font:700 .58rem/1 "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase}.footer-brand strong{font-size:1rem;line-height:1}.site-footer p{margin:0;font-size:.72rem}
@media (max-width:900px){.reviews-heading{grid-template-columns:1fr}.upwork-score{max-width:230px}.review-stage{grid-template-columns:64px 1fr}.review-side{grid-column:1/-1;display:grid;grid-template-columns:1fr auto auto;gap:20px;align-items:center;padding:20px 0;border-top:1px solid #3b3840;border-left:0}.review-progress,.review-controls{margin:0}.site-footer{grid-template-columns:1fr 1fr}.site-footer p:last-child{text-align:right}.site-footer p:nth-child(2){grid-column:1/-1;grid-row:2}}
@media (max-width:600px){.testimonials-shell,.contact-shell{width:min(92vw,620px)}.reviews-heading h2,.contact-shell h2{font-size:clamp(3.1rem,15vw,5rem)}.review-stage{grid-template-columns:42px 1fr}.review-quote-mark{font-size:3.7rem}.review-copy{padding:34px 0 28px 8px}.review-copy blockquote{font-size:clamp(2rem,9vw,3.2rem)}.review-person{align-items:flex-start;flex-direction:column;gap:6px}.review-side{grid-template-columns:1fr}.review-progress{width:100%}.review-controls button{width:46px;height:46px}.contact-showcase{min-height:540px}.contact-orbit{width:100vw;right:-42vw}.site-footer{grid-template-columns:1fr;gap:24px;padding:32px 20px}.site-footer p:nth-child(2){grid-column:auto;grid-row:auto}.site-footer p:last-child{text-align:left}}
@media (prefers-reduced-motion:reduce){.review-quote-mark,.reviews-heading h2,.reviews-heading h2::after,.contact-showcase::before,.contact-showcase::after,.contact-orbit i,.contact-orbit::after{animation:none}.review-copy,.upwork-score,.review-controls button,.contact-link,.contact-link b,.contact-shell,.contact-orbit{transition:none}.contact-shell,.contact-orbit{transform:none}}