/* Portfolio rebuild: editorial visual system layered over the original site. */
:root {
  --paper: #f3f0ea;
  --paper-bright: #faf8f4;
  --ink: #191d1d;
  --muted: #626866;
  --line: rgba(25, 29, 29, 0.16);
  --rust: #b75335;
  --rust-dark: #8e3d28;
  --amber: #e3a647;
  --midnight: #121716;
  --acid: #d8ed98;
  --blue: #315fdb;
  --violet: #7659c9;
  --radius: 22px;
  --page: min(1280px, calc(100vw - 64px));
}

html { scroll-behavior: smooth; }
body.portfolio-v2 { background: var(--paper); color: var(--ink); }
.portfolio-v2 a:focus-visible,
.portfolio-v2 button:focus-visible,
.portfolio-v2 input:focus-visible,
.portfolio-v2 summary:focus-visible { outline: 3px solid var(--amber); outline-offset: 4px; }
.skip-link { position: fixed; top: 10px; left: 12px; z-index: 9999; padding: 10px 16px; color: white; background: var(--ink); border-radius: 99px; transform: translateY(-150%); transition: transform .2s ease; }
.skip-link:focus { transform: none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.v2-nav.navbar { border: 0; border-bottom: 1px solid transparent; background: rgba(243, 240, 234, .77); backdrop-filter: blur(18px); transition: border-color .25s ease, background .25s ease; }
.v2-nav .nav-container { max-width: 1360px; padding: 18px 32px; }
.v2-nav .nav-links { align-items: center; gap: 26px; }
.v2-nav .nav-item { color: var(--ink); font-size: .87rem; font-weight: 520; letter-spacing: .02em; }
.v2-nav .nav-item:hover { color: var(--rust); }
.v2-nav .nav-item[aria-current="page"] { color: var(--rust); }
.v2-nav .signature { font-size: 2.15rem; color: var(--ink); }

.v2-hero { min-height: 100svh; position: relative; display: grid; place-items: center; overflow: hidden; background: var(--paper); isolation: isolate; }
.hero-contours { position: absolute; inset: 0; z-index: -3; background: url("../assets/topographical_map_art_bg.svg") center bottom / cover no-repeat; transform: scale(-1); opacity: .56; }
.v2-hero::after { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 50% 42%, rgba(243,240,234,.2) 0 15%, rgba(243,240,234,.82) 65%, var(--paper) 92%); }
.hero-orbit { position: absolute; border: 1px solid rgba(25,29,29,.12); border-radius: 50%; pointer-events: none; }
.orbit-one { width: min(72vw, 980px); aspect-ratio: 1; top: 48%; left: 50%; transform: translate(-50%,-50%); animation: orbit-drift 16s ease-in-out infinite alternate; }
.orbit-two { width: min(52vw, 700px); aspect-ratio: 1; top: 48%; left: 50%; transform: translate(-50%,-50%); border-style: dashed; animation: orbit-drift 12s ease-in-out infinite alternate-reverse; }
@keyframes orbit-drift { to { transform: translate(-50%,-50%) rotate(5deg) scale(1.025); } }

.v2-hero-inner { width: var(--page); margin: 0 auto; padding: 26vh 0 96px; display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.v2-hero h1 { margin: 0; font-family: "Tanker-Regular", sans-serif; font-weight: 400; font-size: clamp(2.6rem, 6.2vw, 5rem); line-height: 1.12; letter-spacing: .02em; color: var(--ink); }
.hero-name { color: transparent; -webkit-text-stroke: 2.5px var(--ink); text-decoration: none; transition: color .3s ease, -webkit-text-stroke-color .3s ease; }
.hero-name:hover { color: var(--ink); }
.v2-role-line { --hero-line: clamp(2.6rem, 6.2vw, 5rem); margin-top: 2px; display: flex; align-items: center; font-family: "Tanker-Regular", sans-serif; font-size: var(--hero-line); line-height: 1.12; letter-spacing: .02em; color: var(--ink); }
.role-prefix { flex: 0 0 auto; }
.v2-ticker-window { display: inline-block; height: calc(var(--hero-line) * 1.12); overflow: hidden; position: relative; vertical-align: bottom; min-width: 0; }
.v2-ticker-window::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: var(--ink); z-index: 2; pointer-events: none; }
.v2-ticker-window .ticker-track { display: flex; flex-direction: column; }
.v2-ticker-window .ticker-item { display: block; white-space: nowrap; height: calc(var(--hero-line) * 1.12); line-height: 1.12; text-align: left; font-size: inherit; color: inherit; }
.v2-ticker-window .ticker-item-gold { color: var(--rust); }
.hero-summary { max-width: 660px; margin: 30px 0 0; font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.65; font-weight: 350; color: var(--muted); }
.hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 12px; margin-top: 28px; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 13px 20px; border: 1px solid var(--ink); border-radius: 99px; color: var(--ink); text-decoration: none; font-size: .91rem; font-weight: 620; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-dark { color: white; background: var(--ink); }
.button-dark:hover { background: var(--rust); border-color: var(--rust); }
.button-quiet:hover { color: var(--rust); border-color: var(--rust); }
.hero-signal-row { margin-top: 42px; display: flex; flex-wrap: wrap; justify-content: flex-start; color: var(--muted); }
.hero-signal-row span { padding: 0 16px; font-size: .77rem; letter-spacing: .06em; text-transform: uppercase; border-right: 1px solid var(--line); }
.hero-signal-row span:first-child { padding-left: 0; }
.hero-signal-row span:last-child { border: 0; }
.error-page-v2 { min-height:100vh; display:flex; flex-direction:column; background:radial-gradient(circle at 18% 30%,rgba(216,237,152,.22),transparent 34%),var(--paper); }
.error-v2-main { width:var(--page); margin:0 auto; flex:1; display:flex; flex-direction:column; justify-content:center; padding:150px 0 110px; }
.error-v2-main h1 { max-width:760px; margin:14px 0 20px; color:var(--ink); font:400 clamp(4rem,9vw,8.8rem)/.88 "Tanker-Regular",sans-serif; letter-spacing:.01em; }
.error-v2-main h1 em { color:var(--rust); font-style:normal; }
.error-v2-main>p:not(.section-index) { max-width:530px; color:var(--muted); font-size:1.08rem; line-height:1.7; }
.error-v2-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.error-v2-footer { margin-top:0; }
.scroll-cue { position: absolute; bottom: 26px; left: max(32px, calc((100vw - 1280px) / 2)); display: flex; flex-direction: column; align-items: flex-start; gap: 8px; text-decoration: none; color: var(--muted); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.scroll-cue i { width: 1px; height: 32px; background: var(--ink); transform-origin: top; animation: cue 1.7s ease-in-out infinite; }
@keyframes cue { 0%,100%{transform:scaleY(.25);opacity:.4} 50%{transform:scaleY(1);opacity:1} }

.section-index { color: var(--rust); font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.statement-band { width: var(--page); margin: 0 auto; padding: 120px 0; display: grid; grid-template-columns: .65fr 2.25fr 1fr; gap: 64px; align-items: start; border-top: 1px solid var(--line); }
.statement-band h2, .section-intro h2, .process-heading h2, .credentials-section h2, .footer-main h2 { margin: 0; color: var(--ink); font-family: "Tanker-Regular", sans-serif; font-weight: 400; font-size: clamp(3rem, 6vw, 6.1rem); line-height: .94; letter-spacing: .01em; }
.statement-band h2 em, .footer-main h2 em { color: var(--rust); font-style: normal; }
.statement-band > div > p { max-width: 690px; margin-top: 24px; color: var(--muted); font-size: 1.08rem; font-weight: 350; line-height: 1.7; }
.practice-list { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.practice-list span { padding: 17px 0; border-bottom: 1px solid var(--line); color: var(--ink); font-weight: 560; }

.work-section, .applied-section { width: var(--page); margin: 0 auto; padding: 120px 0; }
.section-intro { display: grid; grid-template-columns: 1.6fr .75fr; align-items: end; gap: 60px; margin-bottom: 64px; }
.section-intro .section-index { margin-bottom: 15px; }
.section-intro > p { max-width: 440px; padding-bottom: 7px; color: var(--muted); font-size: 1rem; line-height: 1.7; }
.flagship { display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: center; padding: 72px 0; border-top: 1px solid var(--line); }
.flagship:last-child { border-bottom: 1px solid var(--line); }
.flagship-visual { position: relative; min-height: 500px; overflow: hidden; border-radius: var(--radius); background: #d9d2c8; color: white; text-decoration: none; box-shadow: 0 24px 80px rgba(25,29,29,.12); }
.flagship-count { position: absolute; top: 22px; left: 24px; z-index: 5; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; font-size: .72rem; font-weight: 700; backdrop-filter: blur(10px); }
.flagship-open { position: absolute; z-index: 5; right: 18px; bottom: 18px; display: flex; align-items: center; gap: 13px; padding: 10px 10px 10px 18px; color: white; background: rgba(15,19,18,.68); border: 1px solid rgba(255,255,255,.2); border-radius: 99px; backdrop-filter: blur(12px); font-size: .78rem; font-weight: 620; }
.flagship-open b { width: 32px; height: 32px; display: grid; place-items: center; color: var(--ink); background: white; border-radius: 50%; font-size: 1rem; }
.ir-hero-composition { position: absolute; inset: 0; }
.ir-hero-composition figure { margin: 0; position: absolute; overflow: hidden; background: #252b29; box-shadow: 0 16px 40px rgba(0,0,0,.25); transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.ir-hero-composition img { width: 100%; height: 100%; display: block; object-fit: cover; }
.ir-hero-composition figcaption { position: absolute; left: 10px; bottom: 9px; padding: 5px 9px; color: white; background: rgba(10,10,10,.62); border-radius: 99px; font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; }
.ir-room { width: 67%; height: 58%; border: 5px solid rgba(255,255,255,.9); border-radius: 14px; }
.ir-room-before { left: -4%; top: 9%; transform: rotate(-4deg); }
.ir-room-after { right: -3%; bottom: 7%; transform: rotate(3deg); }
.ir-hero-composition figure.ir-reference { width: 27%; aspect-ratio: 1; left: 12%; bottom: 8%; z-index: 2; overflow: visible; border: 4px solid var(--amber); border-radius: 50%!important; }
.ir-reference img { border-radius: 50%; }
.ir-reference figcaption { left: 50%; bottom: -12px; transform: translateX(-50%); white-space: nowrap; }
.flagship-visual:hover .ir-room-before { transform: rotate(-5deg) translate(-4px,-4px); }
.flagship-visual:hover .ir-room-after { transform: rotate(2deg) translate(4px,4px); }
.visual-route { position: absolute; left: 34%; top: 52%; z-index: 4; width: 31%; height: 2px; background: repeating-linear-gradient(90deg,white 0 5px,transparent 5px 10px); transform: rotate(-13deg); }
.flagship-copy { min-width: 0; }
.project-heading-row { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; margin-bottom: 12px; }
.project-discipline { color: var(--rust); font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.project-year { color: var(--muted); font-size: .78rem; }
.flagship-copy h3 { margin: 0 0 20px; font: 400 clamp(3.6rem, 6vw, 6.2rem)/.9 "Tanker-Regular", sans-serif; }
.flagship-copy h3 a { color: var(--ink); text-decoration: none; }
.flagship-copy > p { color: var(--muted); font-size: 1.04rem; line-height: 1.7; font-weight: 350; }
.project-facts { display: grid; grid-template-columns: repeat(3,1fr); margin: 34px 0; padding: 0; list-style: none; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.project-facts li { padding: 18px 12px 18px 0; display: flex; flex-direction: column; gap: 2px; }
.project-facts strong { color: var(--ink); font-size: 1.3rem; font-weight: 720; }
.project-facts span { color: var(--muted); font-size: .72rem; }
.text-link { display: inline-flex; gap: 12px; color: var(--ink); text-decoration: none; font-size: .9rem; font-weight: 680; border-bottom: 1px solid var(--ink); padding-bottom: 5px; }
.text-link:hover { color: var(--rust); border-color: var(--rust); }
.flagship-agentpdf .flagship-visual { background: #14202d; }
.agentpdf-screen { width: 100%; height: 100%; min-height: 500px; object-fit: contain; object-position: center; padding: 72px 26px 34px; filter: saturate(.86) contrast(1.06); transition: transform .6s ease; }
.flagship-visual:hover .agentpdf-screen { transform: scale(1.025); }
.flagship-agentpdf .flagship-visual::after { content:""; position:absolute; inset:0; background: linear-gradient(180deg,transparent 45%,rgba(10,15,20,.62)); }
.pdf-scanline { position: absolute; z-index: 2; left: 12%; right: 12%; top: 25%; height: 1px; background: #6ec6ff; box-shadow: 0 0 18px #6ec6ff; animation: scan 4s ease-in-out infinite; }
@keyframes scan { 0%,100%{top:25%;opacity:.35} 50%{top:73%;opacity:1} }
.pdf-chrome { position: absolute; inset: 0 0 auto 0; z-index: 3; height: 46px; display: flex; align-items: center; gap: 7px; padding: 0 16px; background: rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(6px); }
.pdf-chrome i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.pdf-chrome i:nth-child(2) { background: #febc2e; }
.pdf-chrome i:nth-child(3) { background: #28c840; }
.pdf-chrome span { margin-left: 9px; color: rgba(255,255,255,.55); font-size: .68rem; font-weight: 520; letter-spacing: .06em; }
.pdf-metric { position: absolute; z-index: 3; right: 22px; top: 62px; display: flex; flex-direction: column; align-items: end; color: white; }
.pdf-metric strong { font: 400 2.7rem/.9 "Tanker-Regular", sans-serif; }
.pdf-metric span { font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }

.systems-section { padding: 120px max(32px, calc((100vw - 1280px)/2)); color: white; background: var(--midnight); overflow: hidden; }
.section-intro.light h2 { color: white; }
.section-intro.light > p { color: rgba(255,255,255,.58); }
.section-intro.light .section-index { color: var(--acid); }
.system-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.system-card { min-width: 0; padding: 14px 14px 26px; color: white; text-decoration: none; border: 1px solid rgba(255,255,255,.13); border-radius: var(--radius); background: rgba(255,255,255,.035); transition: transform .3s ease, border-color .3s ease, background .3s ease; }
.system-card:hover { transform: translateY(-7px); border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.065); }
.system-visual { height: 290px; position: relative; overflow: hidden; margin-bottom: 22px; border-radius: 14px; background: #202827; }
.system-card > .card-kicker, .applied-card .card-kicker { margin: 0 8px 8px; color: var(--acid); font-size: .67rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.system-card h3 { margin: 0 8px 10px; color: white; font: 400 2.7rem/1 "Tanker-Regular", sans-serif; }
.system-card > p:not(.card-kicker) { min-height: 72px; margin: 0 8px 18px; color: rgba(255,255,255,.66); line-height: 1.55; font-size: .9rem; }
.card-signal { display: block; margin: 0 8px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.13); color: rgba(255,255,255,.62); font-size: .68rem; line-height: 1.45; }
.mace-visual { background: radial-gradient(circle at 50% 50%,#264754,#101717 66%); }
.mace-visual::before,.mace-visual::after { content:""; position:absolute; inset:50% auto auto 50%; width:210px; height:1px; background:rgba(112,226,239,.34); transform:translate(-50%,-50%) rotate(30deg); }
.mace-visual::after { transform:translate(-50%,-50%) rotate(-30deg); }
.mace-node { position:absolute; z-index:2; width:84px; height:84px; display:grid; place-items:center; border:1px solid rgba(113,230,242,.75); border-radius:50%; color:#bff8ff; background:rgba(8,20,22,.86); box-shadow:0 0 35px rgba(66,207,224,.15); font-size:.65rem; letter-spacing:.14em; }
.mace-node i { position:absolute; inset:8px; border:1px dashed rgba(113,230,242,.3); border-radius:50%; }
.node-head { left:50%; top:13%; transform:translateX(-50%); }.node-eye{left:12%;bottom:13%}.node-hand{right:12%;bottom:13%}
.event-pulse { position:absolute; width:18px; height:18px; left:50%; top:58%; transform:translate(-50%,-50%); border-radius:50%; background:#ed5a4b; box-shadow:0 0 0 0 rgba(237,90,75,.65); animation:pulse 2s infinite; }
@keyframes pulse { 70%{box-shadow:0 0 0 28px rgba(237,90,75,0)} 100%{box-shadow:0 0 0 0 rgba(237,90,75,0)} }
.kotch-visual img { width:100%; height:100%; object-fit:cover; opacity:.9; }
.card-equation { position:absolute; left:16px; right:16px; bottom:16px; padding:10px 12px; border:1px solid rgba(255,255,255,.28); border-radius:8px; color:white; background:rgba(8,39,28,.8); backdrop-filter:blur(8px); text-align:center; font:600 .82rem ui-monospace,monospace; }
.card-equation small { display:block; margin-top:5px; color:var(--acid); font:600 .62rem/1.2 var(--font-primary); letter-spacing:.06em; text-transform:uppercase; }
.moa-visual { background:radial-gradient(circle at 50% 45%,#4e397b 0,#211c36 45%,#14131c 100%); }
.moa-visual svg { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:rgba(216,178,255,.42); stroke-width:1.5; }
.moa-visual svg circle { fill:#e2b8ff; stroke:none; }
.note-card { position:absolute; z-index:2; width:86px; padding:14px 8px; text-align:center; color:#3b2f30; background:#f4e6c9; border-radius:4px; box-shadow:0 12px 30px rgba(0,0,0,.34); font:650 .72rem var(--font-primary); }
.note-a{left:11%;top:16%;transform:rotate(-5deg)}.note-b{right:10%;top:20%;transform:rotate(5deg)}.note-c{left:40%;bottom:13%;transform:rotate(1deg)}

.applied-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.applied-card { overflow:hidden; color:var(--ink); text-decoration:none; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper-bright); transition:transform .3s ease,box-shadow .3s ease; }
.applied-card:hover { transform:translateY(-6px); box-shadow:0 22px 60px rgba(25,29,29,.12); }
.applied-card > img { width:100%; height:255px; display:block; object-fit:cover; object-position:top; }
.applied-card-body { padding:24px 24px 26px; }
.applied-card .card-kicker { margin:0 0 8px;color:var(--rust); }
.applied-card h3 { margin:0 0 10px; font:400 2.5rem/1 "Tanker-Regular",sans-serif; }
.applied-card p:not(.card-kicker) { min-height:70px; color:var(--muted); font-size:.9rem; line-height:1.55; }
.applied-card-body > span { display:block; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); font-size:.78rem; font-weight:680; }
.zakkir-devices { height:255px; position:relative; overflow:hidden; background:radial-gradient(circle at 72% 30%,#d8b96a,#245d5a 74%); }
.zakkir-devices img { position:absolute; object-fit:cover; object-position:top; box-shadow:0 16px 40px rgba(0,0,0,.28); }
.device-mobile { width:30%; height:88%; left:13%; bottom:-7%; border:5px solid #222; border-radius:18px; }
.device-browser { width:62%; height:67%; right:-4%; top:17%; border:4px solid white; border-radius:10px; }
.all-work-cta { margin-top:50px; padding:28px 0; display:flex; justify-content:space-between; align-items:center; gap:24px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.all-work-cta p { color:var(--muted); }

.process-section { display:grid; grid-template-columns:.72fr 1.28fr; gap:90px; padding:130px max(32px,calc((100vw - 1280px)/2)); color:white; background:var(--rust-dark); }
.process-heading h2 { margin:18px 0 24px; color:white; }
.process-heading .section-index { color:#ffd7b1; }
.process-heading > p:last-child { max-width:430px; color:rgba(255,255,255,.64); line-height:1.7; }
.process-flow { margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.25); counter-reset:none; }
.process-flow li { position:relative; display:grid; grid-template-columns:55px 150px 1fr; align-items:baseline; gap:16px; padding:30px 0; border-bottom:1px solid rgba(255,255,255,.25); }
.process-flow li > span { color:rgba(255,255,255,.62); font-size:.72rem; }
.process-flow strong { color:white; font-size:1.12rem; }
.process-flow p { color:rgba(255,255,255,.62); line-height:1.55; font-size:.88rem; }

.credentials-section { width:var(--page); margin:0 auto; padding:120px 0; display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.credentials-section h2 { margin-top:18px; font-size:clamp(3rem,5vw,5.2rem); }
.credential-list { border-top:1px solid var(--line); }
.credential-list article { padding:24px 0; border-bottom:1px solid var(--line); }
.credential-list span { display:block; margin-bottom:7px; color:var(--rust); font-size:.68rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.credential-list strong { display:block; color:var(--ink); font-size:1.05rem; }
.credential-list p { margin-top:4px; color:var(--muted); font-size:.86rem; }
.credential-resume-link { color:inherit; text-decoration:none; transition:color .2s ease; }
.credential-resume-link:hover,.credential-resume-link:focus-visible { color:var(--rust); }

.v2-footer { padding:100px max(32px,calc((100vw - 1280px)/2)) 28px; color:white; background:var(--midnight); }
.v2-footer .footer-socials .social-link { color:rgba(255,255,255,.78); }
.footer-main .section-index { color:var(--acid); }
.footer-main h2 { margin:20px 0 45px; color:white; }
.footer-main h2 em { color:var(--acid); }
.footer-email { display:flex; justify-content:space-between; align-items:center; padding:22px 0; color:white; border-top:1px solid rgba(255,255,255,.25); border-bottom:1px solid rgba(255,255,255,.25); text-decoration:none; font-size:clamp(1.05rem,2vw,1.6rem); }
.footer-email:hover { color:var(--acid); }
.footer-bottom { margin-top:75px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; }
.footer-bottom .signature { color:white; font-size:2.5rem; }
.footer-bottom > div { display:flex; flex-wrap:wrap; justify-content:center; gap:22px; }
.footer-bottom a { color:rgba(255,255,255,.64); text-decoration:none; font-size:.78rem; }
.footer-bottom a:hover { color:white; }
.footer-bottom > p { color:rgba(255,255,255,.55); text-align:right; font-size:.72rem; }

/* All-projects index */
.projects-v2-main { padding:150px 0 110px; }
.page-hero-v2 { width:var(--page); margin:0 auto 80px; display:grid; grid-template-columns:1.4fr .6fr; gap:60px; align-items:end; }
.page-hero-v2 h1 { margin:14px 0 0; font:400 clamp(5rem,12vw,11rem)/.8 "Tanker-Regular",sans-serif; }
.page-hero-v2 > p { color:var(--muted); line-height:1.7; padding-bottom:8px; }
.project-collection { width:var(--page); margin:0 auto 90px; }
.collection-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:28px; padding-top:22px; border-top:1px solid var(--line); }
.collection-heading h2 { font:400 clamp(2.2rem,4vw,4rem)/1 "Tanker-Regular",sans-serif; }
.collection-heading p { max-width:470px; color:var(--muted); font-size:.9rem; line-height:1.55; }
.project-card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.featured-project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.project-card-v2 { min-height:430px; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; padding:26px; color:white; text-decoration:none; border-radius:var(--radius); background:#202523; isolation:isolate; }
.project-card-v2::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(0,0,0,.02) 20%,rgba(6,8,8,.87) 82%); }
.project-card-v2 > img { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.project-card-v2:hover > img { transform:scale(1.04); }
.project-card-v2 .card-no { position:absolute; top:20px; left:20px; z-index:3; padding:6px 9px; border:1px solid rgba(255,255,255,.2); border-radius:999px; color:rgba(255,255,255,.9); background:rgba(9,15,14,.68); backdrop-filter:blur(8px); font-size:.7rem; letter-spacing:.12em; }
.project-card-v2 h3 { margin:0 0 10px; font:400 2.8rem/1 "Tanker-Regular",sans-serif; }
.project-card-v2 p { margin:0; color:rgba(255,255,255,.7); font-size:.87rem; line-height:1.55; }
.project-card-v2 .card-meta { display:block; margin-top:18px; padding-top:14px; border-top:1px solid rgba(255,255,255,.25); color:rgba(255,255,255,.68); font-size:.66rem; letter-spacing:.05em; line-height:1.45; text-transform:uppercase; }
.project-card-v2.visual-css { justify-content:space-between; }
.project-card-v2.visual-css::after { background:linear-gradient(180deg,transparent 0 38%,rgba(6,8,8,.9) 78%); }
.project-card-v2.visual-css > div:last-child { margin-top:auto; }

/* Shared case-study system for research and applied pages. */
.case-page-v2 { --case-accent:var(--rust); --case-soft:#eee7df; }
.case-v2-hero { width:var(--page); margin:0 auto; padding:145px 0 72px; display:grid; grid-template-columns:.86fr 1.14fr; gap:70px; align-items:center; }
.case-v2-hero-copy .section-index { color:var(--case-accent); }
.case-v2-title { margin:14px 0 22px; font:400 clamp(4.5rem,10vw,9rem)/.82 "Tanker-Regular",sans-serif; letter-spacing:.005em; }
.portfolio-v2 .case-title { font-weight:400; letter-spacing:-.012em; }
.case-v2-lede { max-width:650px; color:var(--muted); font-size:clamp(1.02rem,1.5vw,1.22rem); line-height:1.68; font-weight:350; }
.case-pill-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.case-pill-row span { padding:7px 12px; color:var(--ink); border:1px solid color-mix(in srgb,var(--case-accent),transparent 45%); border-radius:99px; font-size:.7rem; font-weight:620; }
.case-v2-visual { min-height:480px; position:relative; overflow:hidden; border-radius:var(--radius); background:var(--midnight); box-shadow:0 22px 70px rgba(25,29,29,.15); }
.case-v2-visual > img { width:100%; height:100%; min-height:480px; display:block; object-fit:cover; }
.case-v2-visual-label { position:absolute; left:18px; top:18px; z-index:3; padding:7px 11px; color:white; background:rgba(10,13,12,.64); border:1px solid rgba(255,255,255,.2); border-radius:99px; backdrop-filter:blur(10px); font-size:.65rem; letter-spacing:.09em; text-transform:uppercase; }
.case-stat-grid { width:var(--page); margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.case-stat-grid div { min-height:110px; padding:22px 20px 20px 0; border-right:1px solid var(--line); }
.case-stat-grid div:not(:first-child) { padding-left:20px; }
.case-stat-grid div:last-child { border-right:0; }
.case-stat-grid strong { display:block; color:var(--case-accent); font-size:clamp(1.45rem,3vw,2.4rem); line-height:1; }
.case-stat-grid span { display:block; margin-top:8px; color:var(--muted); font-size:.68rem; line-height:1.4; letter-spacing:.07em; text-transform:uppercase; }
.case-stat-note { width:var(--page); margin:12px auto 0; color:var(--muted); font-size:.7rem; letter-spacing:.04em; }
.case-toc-v2 { position:sticky; top:69px; z-index:20; display:flex; gap:7px; overflow-x:auto; padding:12px max(15px,calc((100vw - 1280px)/2)); background:rgba(243,240,234,.9); border-bottom:1px solid var(--line); backdrop-filter:blur(16px); scrollbar-width:none; }
.case-toc-v2::-webkit-scrollbar { display:none; }
.case-toc-v2 a { flex:0 0 auto; padding:7px 11px; color:var(--muted); text-decoration:none; border:1px solid var(--line); border-radius:99px; font-size:.7rem; font-weight:620; }
.case-toc-v2 a:hover { color:var(--case-accent); border-color:var(--case-accent); }
.case-v2-body { width:min(1120px,calc(100vw - 48px)); margin:0 auto; padding:20px 0 100px; }
.case-section-v2 { padding-top:95px; scroll-margin-top:110px; }
.case-section-head { display:grid; grid-template-columns:.65fr 1.35fr; gap:50px; align-items:start; margin-bottom:35px; }
.case-section-head h2 { margin:0; color:var(--ink); font:400 clamp(2.8rem,5vw,5rem)/.95 "Tanker-Regular",sans-serif; }
.case-section-head > div > p:first-child { margin-bottom:14px; color:var(--case-accent); font-size:.68rem; font-weight:720; letter-spacing:.12em; text-transform:uppercase; }
.case-section-head > p { color:var(--muted); font-size:1rem; line-height:1.7; }
.case-copy-columns { display:grid; grid-template-columns:repeat(2,1fr); gap:35px; margin:28px 0; }
.case-copy-columns p,.case-v2-body>p,.case-v2-body li { color:var(--muted); font-size:.98rem; line-height:1.72; }
.case-copy-columns strong,.case-v2-body strong { color:var(--ink); }
.concept-panel { overflow:hidden; margin:30px 0; padding:34px; color:white; border-radius:var(--radius); background:var(--midnight); }
.concept-panel h3 { margin:0 0 12px; color:white; font:400 2rem/1 "Tanker-Regular",sans-serif; }
.concept-panel p { color:rgba(255,255,255,.64); line-height:1.65; }
.concept-panel strong { color:#fff; }
.case-step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:25px 0; }
.case-step { padding:22px; border:1px solid var(--line); border-radius:15px; background:var(--paper-bright); }
.case-step b { display:block; margin-bottom:8px; color:var(--case-accent); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; }
.case-step h3 { margin:0 0 8px; font-size:1rem; }
.case-step p { color:var(--muted); font-size:.84rem; line-height:1.5; }
.case-media-v2 { margin:28px 0; }
.case-media-v2 img { width:100%; height:auto; display:block; border-radius:16px; border:1px solid var(--line); }
.case-media-v2 figcaption { margin-top:10px; color:var(--muted); font-size:.8rem; line-height:1.55; }
.case-two-up { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.case-deck-link { display:inline-flex; align-items:center; gap:8px; margin-top:9px; color:var(--case-accent); text-decoration:none; font-size:.72rem; font-weight:680; }
.case-deck-link::before { content:"▤"; width:23px; height:23px; display:grid; place-items:center; border-radius:6px; color:white; background:var(--case-accent); }
.case-v2-body details { margin:22px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.case-v2-body details summary { padding:17px 2px; cursor:pointer; list-style:none; color:var(--ink); font-weight:680; }
.case-v2-body details summary::-webkit-details-marker { display:none; }
.case-v2-body details summary::after { content:"+"; float:right; color:var(--case-accent); font-size:1.2rem; }
.case-v2-body details[open] summary::after { content:"−"; }
.case-v2-body details>div { padding:0 2px 19px; }
.artifact-grid-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:25px; }
.artifact-card-v2 { min-height:140px; display:flex; flex-direction:column; justify-content:space-between; padding:20px; color:var(--ink); text-decoration:none; border:1px solid var(--line); border-radius:15px; background:var(--paper-bright); transition:transform .2s ease,border-color .2s ease; }
.artifact-card-v2:hover { transform:translateY(-3px); border-color:var(--case-accent); }
.artifact-card-v2 strong { font-size:.96rem; }.artifact-card-v2 span{color:var(--case-accent);font-size:.74rem;font-weight:680}
.case-next-v2 { width:var(--page); margin:0 auto 100px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.case-next-v2 a { padding:22px; color:var(--ink); text-decoration:none; border:1px solid var(--line); border-radius:15px; background:var(--paper-bright); }
.case-next-v2 small { display:block; margin-bottom:6px; color:var(--muted); font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; }
.case-next-v2 strong { font-size:1rem; }

@media (max-width: 980px) {
  :root { --page:min(100% - 40px,1280px); }
  .statement-band { grid-template-columns:1fr 2fr; gap:36px; }.statement-band .practice-list{grid-column:2}
  .flagship { gap:38px; }.flagship-visual{min-height:410px}.agentpdf-screen{min-height:410px}
  .system-grid,.applied-grid,.project-card-grid{grid-template-columns:repeat(2,1fr)}
  .system-card:last-child,.applied-card:last-child{grid-column:span 2;max-width:calc(50% - 10px);width:100%;justify-self:center}
  .process-section{gap:50px}.process-flow li{grid-template-columns:45px 115px 1fr}
  .case-v2-hero{grid-template-columns:1fr;gap:38px}.case-v2-visual{min-height:400px}.case-v2-visual>img{min-height:400px}.case-section-head{grid-template-columns:1fr;gap:18px}
}

@media (max-width: 720px) {
  :root { --page:calc(100% - 30px); --radius:17px; }
  .v2-nav .nav-container{padding:13px 16px}.v2-nav .signature{font-size:1.8rem}
  .v2-nav .menu-toggle{display:flex}.v2-nav .nav-links{display:none;position:absolute;top:64px;left:12px;right:12px;padding:18px;gap:0;flex-direction:column;align-items:stretch;background:rgba(250,248,244,.98);border:1px solid var(--line);border-radius:15px;box-shadow:0 18px 55px rgba(0,0,0,.12)}
  .v2-nav.active .nav-links{display:flex}.v2-nav .nav-links li{border-bottom:1px solid var(--line)}.v2-nav .nav-links li:last-child{border:0}.v2-nav .nav-item{display:block;padding:12px 4px}
  .v2-hero-inner{padding:20vh 0 90px}.hero-name{-webkit-text-stroke-width:1.6px}
  .v2-role-line{width:100%;flex-direction:column;align-items:flex-start;gap:0;--hero-line:clamp(2rem,9vw,3rem)}.v2-ticker-window{min-width:0;width:100%}.v2-ticker-window::after{height:2px}
  .hero-summary{font-size:1rem}.hero-signal-row{display:grid;grid-template-columns:1fr 1fr;gap:8px 0;margin-top:34px}.hero-signal-row span{font-size:.6rem;padding:3px 8px}.hero-signal-row span:first-child{padding-left:8px}.hero-signal-row span:nth-child(2){border:0}
  .scroll-cue{display:none}.orbit-one{width:125vw}.orbit-two{width:90vw}
  .statement-band{padding:82px 0;grid-template-columns:1fr;gap:26px}.statement-band .practice-list{grid-column:auto}.statement-band h2,.section-intro h2,.process-heading h2,.credentials-section h2,.footer-main h2{font-size:clamp(3rem,15vw,4.5rem)}
  .work-section,.applied-section{padding:84px 0}.section-intro{grid-template-columns:1fr;gap:22px;margin-bottom:42px}.section-intro>p{padding:0}
  .flagship{grid-template-columns:1fr;gap:32px;padding:52px 0}.flagship-agentpdf .flagship-copy{order:2}.flagship-agentpdf .flagship-visual{order:1}.flagship-visual{min-height:390px}.agentpdf-screen{min-height:390px}.flagship-copy h3{font-size:3.7rem}.project-facts{gap:8px}.project-facts strong{font-size:1.05rem}.project-facts span{font-size:.63rem}
  .ir-room{width:70%;height:46%}.ir-room-before{left:-5%;top:5%}.ir-room-after{right:-4%;bottom:24%}.ir-reference{width:30%;left:8%;bottom:6%}.visual-route{display:none}
  .systems-section{padding:84px 15px}.system-grid,.applied-grid,.project-card-grid,.featured-project-grid{grid-template-columns:1fr}.system-card:last-child,.applied-card:last-child{grid-column:auto;max-width:none}.system-visual{height:255px}
  .applied-card>img,.zakkir-devices{height:235px}.all-work-cta{align-items:flex-start;flex-direction:column}
  .process-section{padding:84px 15px;grid-template-columns:1fr;gap:42px}.process-flow li{grid-template-columns:35px 1fr;gap:10px 12px}.process-flow p{grid-column:2}
  .credentials-section{padding:84px 0;grid-template-columns:1fr;gap:40px}
  .v2-footer{padding:80px 15px 24px}.footer-bottom{grid-template-columns:1fr;margin-top:55px}.footer-bottom>div{justify-content:flex-start}.footer-bottom>p{text-align:left}
  .page-hero-v2{grid-template-columns:1fr;gap:24px;margin-bottom:54px}.page-hero-v2 h1{font-size:28vw}.collection-heading{align-items:flex-start;flex-direction:column}.project-card-v2{min-height:390px}
  .case-v2-hero{padding:115px 0 55px}.case-v2-title{font-size:clamp(4rem,22vw,7rem)}.case-v2-visual{min-height:330px}.case-v2-visual>img{min-height:330px}.case-stat-grid{grid-template-columns:1fr 1fr}.case-stat-grid div:nth-child(2){border-right:0}.case-stat-grid div:nth-child(-n+2){border-bottom:1px solid var(--line)}.case-toc-v2{top:63px}.case-v2-body{width:calc(100vw - 30px)}.case-section-v2{padding-top:72px}.case-section-head h2{font-size:3rem}.case-copy-columns,.case-two-up,.case-step-grid,.artifact-grid-v2{grid-template-columns:1fr}.concept-panel{padding:24px 20px}.case-next-v2{grid-template-columns:1fr;margin-bottom:70px}
  .error-v2-main{padding:120px 0 80px}.error-v2-main h1{font-size:clamp(3.8rem,17vw,6rem)}.error-v2-main>p:not(.section-index){font-size:.98rem}
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .hero-orbit,.scroll-cue i,.event-pulse,.pdf-scanline { animation:none!important; }
  .portfolio-v2 * { transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; }
}
