:root {
  --navy: #0c1d36;
  --navy-2: #132b49;
  --ink: #102033;
  --muted: #586574;
  --paper: #f2f1ec;
  --white: #fbfcfa;
  --blue: #007fa8;
  --aqua: #4bc6cf;
  --line: rgba(16, 32, 51, .16);
  --display: "Plus Jakarta Sans", sans-serif;
  --body: "Manrope", sans-serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--body); }
img, svg { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { background: var(--aqua); color: var(--navy); }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 100; transform: translateY(-200%); background: white; padding: .8rem 1rem; }
.skip-link:focus { transform: none; }
:focus-visible { outline: 3px solid var(--aqua); outline-offset: 4px; }
section[id] { scroll-margin-top: 90px; }

.site-header { height: 90px; padding: 0 clamp(1.25rem, 4vw, 4.5rem); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; position: fixed; inset: 0 0 auto; z-index: 50; transition: background .3s, height .3s, box-shadow .3s; }
.site-header.scrolled { height: 72px; background: rgba(242,241,236,.88); backdrop-filter: blur(18px); box-shadow: 0 1px 0 var(--line); }
.brand { display: inline-flex; align-items: center; gap: .8rem; width: fit-content; }
.brand-mark { width: 43px; height: 43px; box-shadow: 0 8px 30px rgba(12,29,54,.12); border-radius: 13px; }
.brand-copy { display: flex; flex-direction: column; }
.brand-copy strong { font: 800 1.04rem/1 var(--display); letter-spacing: -.035em; }
.brand-copy small { margin-top: .36rem; font: 500 .49rem/1 var(--mono); letter-spacing: .13em; color: var(--muted); }
.desktop-nav { display: flex; align-items: center; gap: 2rem; font-size: .86rem; font-weight: 600; }
.desktop-nav a, footer a { position: relative; }
.desktop-nav a::after, footer div a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -.35rem; height: 1px; background: currentColor; transition: right .25s; }
.desktop-nav a:hover::after, footer div a:hover::after { right: 0; }
.header-cta { justify-self: end; padding: .78rem 1.12rem; border: 1px solid var(--ink); border-radius: 99px; font-size: .82rem; font-weight: 700; transition: background .25s, color .25s; }
.header-cta span { margin-left: .5rem; }
.header-cta:hover { background: var(--ink); color: white; }
.menu-button, .mobile-menu { display: none; }

.hero { min-height: 100svh; padding: 10rem clamp(1.25rem, 4vw, 4.5rem) 4rem; position: relative; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; }
.hero::before { content: ""; position: absolute; width: 46vw; height: 46vw; min-width: 520px; min-height: 520px; border: 1px solid rgba(4,155,197,.17); border-radius: 50%; right: -7vw; top: 12vh; }
.hero-intro, .hero-bottom { position: relative; z-index: 2; }
.hero-intro { width: min(58vw, 930px); }
.section-index { font: 500 .68rem/1.2 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
h1, h2 { margin: 0; font-family: var(--display); letter-spacing: -.066em; }
h1 { max-width: 930px; margin-top: clamp(2rem, 5vh, 4rem); font-size: clamp(3.9rem, 7.2vw, 7.6rem); line-height: .88; font-weight: 700; }
h1 em, h2 em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; color: var(--blue); }
.hero-bottom { display: flex; align-items: end; justify-content: space-between; margin-top: 4rem; }
.hero-bottom > p { max-width: 430px; margin: 0 0 .6rem; font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.65; color: var(--muted); }
.circle-link { width: 120px; height: 120px; border: 1px solid var(--ink); border-radius: 50%; padding: 1.4rem; display: flex; align-items: center; justify-content: space-between; font-size: .72rem; font-weight: 700; transition: transform .35s, background .35s, color .35s; }
.circle-link svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.circle-link:hover { background: var(--ink); color: white; transform: rotate(7deg); }
.flow-stage { position: absolute; width: min(42vw, 620px); height: min(36vw, 520px); right: clamp(3rem, 8vw, 10rem); top: 25%; z-index: 1; opacity: .94; }
.flow-symbol { position: absolute; width: 63%; left: 19%; top: 22%; filter: drop-shadow(0 30px 40px rgba(12,29,54,.08)); }
.flow-line { fill: none; stroke-width: 17; stroke-linecap: round; stroke-dasharray: 220; stroke-dashoffset: 220; animation: draw 1.4s cubic-bezier(.2,.8,.2,1) forwards; }
.line-muted { stroke: #9ba6b4; animation-delay: .2s; }.line-blue { stroke: var(--blue); animation-delay: .4s; }.line-aqua { stroke: var(--aqua); animation-delay: .6s; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.flow-orbit { position: absolute; border: 1px solid rgba(16,32,51,.12); border-radius: 50%; }
.orbit-one { inset: 3%; }.orbit-two { inset: 16%; border-style: dashed; animation: spin 40s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.flow-card { position: absolute; display: flex; gap: .5rem; background: rgba(251,252,250,.78); backdrop-filter: blur(10px); border: 1px solid white; box-shadow: 0 12px 35px rgba(12,29,54,.1); border-radius: 99px; padding: .6rem .85rem; font: 500 .65rem var(--mono); text-transform: uppercase; letter-spacing: .08em; animation: float 6s ease-in-out infinite; }
.flow-card-one { left: 0; top: 15%; }.flow-card-two { right: 0; top: 27%; animation-delay: -2s; }.flow-card-three { left: 8%; bottom: 17%; animation-delay: -4s; }.flow-card-four { right: 6%; bottom: 8%; animation-delay: -1s; }
@keyframes float { 50% { transform: translateY(-9px); } }

.section-pad { padding: clamp(5rem, 10vw, 10rem) clamp(1.25rem, 6vw, 7rem); }
.section-index { color: var(--muted); white-space: nowrap; }
.section-index.light { color: #8da2bb; }
.statement { display: grid; grid-template-columns: minmax(120px, .45fr) 1.55fr; gap: 3rem; background: var(--white); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.statement h2, .section-heading h2, .services h2, .about h2, .contact h2 { font-size: clamp(3rem, 6.2vw, 7rem); line-height: .96; font-weight: 600; }
.statement > div > p { max-width: 620px; margin: 2.2rem 0 0 auto; font-size: 1.15rem; line-height: 1.7; color: var(--muted); }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 4rem; margin-bottom: 5rem; }
.section-heading .section-index { margin-bottom: 2rem; }
.section-heading > p { max-width: 390px; margin: 0; line-height: 1.65; color: var(--muted); }
.project { margin-bottom: 8rem; }
.project-visual { height: min(64vw, 720px); position: relative; overflow: hidden; display: grid; place-items: center; }
.project-travel { background: #e8c7a3; }.project-commerce { background: #cbd8e8; }
.project-image { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.project-image-contain { object-fit: contain; padding: clamp(1.5rem, 5vw, 5rem); }
.project:hover .project-image { transform: scale(1.025); }
.browser-shell { width: 81%; background: var(--white); border-radius: 12px; box-shadow: 0 35px 80px rgba(38,42,46,.22); overflow: hidden; transform: rotate(-2deg); transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.project:hover .browser-shell { transform: rotate(0) scale(1.015); }
.browser-bar { height: 32px; background: #edf0ef; display: flex; align-items: center; gap: 5px; padding: 0 12px; }
.browser-bar i { width: 7px; height: 7px; border-radius: 50%; background: #cad1d1; }
.browser-bar span { margin: auto; font: .5rem var(--mono); color: #7c898b; }
.travel-ui { height: min(38vw, 440px); background: linear-gradient(#b5d5dc 0 54%, #dcb783 54%); position: relative; overflow: hidden; padding: 4%; }
.travel-nav { position: relative; z-index: 4; display: flex; justify-content: space-between; color: white; font: 700 clamp(.4rem, .8vw, .7rem) var(--display); letter-spacing: .06em; }
.travel-nav span { font-weight: 500; }.travel-copy { position: relative; z-index: 4; margin-top: 10%; color: white; display: flex; flex-direction: column; align-items: start; }
.travel-copy small { font: 500 clamp(.35rem, .65vw, .58rem) var(--mono); letter-spacing: .14em; }.travel-copy strong { margin: 2% 0 4%; font: 600 clamp(1.6rem, 4.5vw, 4.5rem)/.9 var(--display); letter-spacing: -.05em; }.travel-copy button, .commerce-ui button { border: 0; border-radius: 99px; padding: .65em 1em; font-size: clamp(.4rem, .7vw, .68rem); background: white; }
.travel-copy b, .commerce-ui b { display: inline-block; border-radius: 99px; padding: .65em 1em; font: 600 clamp(.4rem, .7vw, .68rem) var(--body); background: white; }
.commerce-ui b { background: #17243a; color: white; }
.sun { position: absolute; right: 14%; top: 15%; width: 14%; aspect-ratio: 1; border-radius: 50%; background: #f3d58d; }.hill { position: absolute; border-radius: 50% 50% 0 0; bottom: -35%; transform: rotate(9deg); }.hill-back { right: -8%; width: 70%; height: 78%; background: #718c6b; }.hill-front { right: 16%; width: 47%; height: 55%; background: #425e4d; }
.project-info { display: grid; grid-template-columns: 1fr 1fr auto; gap: 4rem; align-items: end; padding: 2rem 0; border-bottom: 1px solid var(--line); }
.project-type { margin: 0 0 .8rem; font: 500 .64rem var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }.project-info h3 { margin: 0; font: 600 clamp(1.8rem, 3.2vw, 3.3rem) var(--display); letter-spacing: -.045em; }.project-info > p { max-width: 480px; margin: 0; font-size: .93rem; line-height: 1.7; color: var(--muted); }.project-info > a { font-size: .78rem; font-weight: 700; white-space: nowrap; }.project-info > a span { margin-left: .4rem; color: var(--blue); }
.project-reverse { margin-left: 12%; }.project-commerce { min-height: 620px; }.phone-shell { width: min(28%, 280px); min-width: 210px; padding: 9px; border-radius: 35px; background: #101722; box-shadow: 0 30px 70px rgba(24,45,72,.24); transform: rotate(5deg); transition: transform .6s; z-index: 2; }.project:hover .phone-shell { transform: rotate(1deg) translateY(-5px); }.phone-camera { width: 32%; height: 13px; background: #101722; border-radius: 0 0 10px 10px; position: absolute; left: 34%; z-index: 3; }.commerce-ui { min-height: 490px; background: #f5f7fb; border-radius: 27px; overflow: hidden; padding: 18px; color: #17243a; }.commerce-nav { display: flex; justify-content: space-between; font: 800 .48rem var(--display); letter-spacing: -.02em; }.device-art { height: 210px; margin: 25px -18px 20px; position: relative; background: linear-gradient(145deg, #dce5f0, #9fb8d4); overflow: hidden; }.device-art i { position: absolute; width: 82px; height: 164px; top: 23px; border: 5px solid #1a2330; border-radius: 19px; background: linear-gradient(155deg, #8ec5e8, #253d67); box-shadow: 0 14px 25px rgba(20,35,55,.2); }.device-art i::before { content: ""; position: absolute; width: 24px; height: 24px; top: 8px; left: 8px; border-radius: 50%; background: #141b27; box-shadow: 20px 0 #141b27; }.device-art i:nth-child(1) { left: 14px; transform: rotate(-11deg); }.device-art i:nth-child(2) { left: calc(50% - 41px); z-index: 2; }.device-art i:nth-child(3) { right: 14px; transform: rotate(11deg); }.commerce-ui small { font: .45rem var(--mono); letter-spacing: .14em; }.commerce-ui strong { display: block; margin: 9px 0 16px; font: 700 1.75rem/.95 var(--display); letter-spacing: -.05em; }.finance-card { position: absolute; right: 13%; bottom: 15%; width: 230px; display: flex; flex-direction: column; gap: .55rem; padding: 1.2rem; background: rgba(255,255,255,.9); backdrop-filter: blur(15px); border-radius: 14px; box-shadow: 0 20px 50px rgba(24,45,72,.18); transform: rotate(-4deg); }.finance-card span { font: .55rem var(--mono); color: var(--muted); }.finance-card strong { font-size: .9rem; }.finance-card small { color: var(--muted); }
.portfolio-bridge { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 2rem 0; display: flex; justify-content: space-between; font-size: .9rem; }.portfolio-bridge p { margin: 0; color: var(--muted); }.portfolio-bridge a { font-weight: 700; }.portfolio-bridge span { color: var(--blue); margin-left: .5rem; }

.services { background: var(--navy); color: white; display: grid; grid-template-columns: .85fr 1.15fr; gap: 8vw; }
.services-intro { position: sticky; top: 120px; height: fit-content; }.services-intro h2 { margin-top: 2rem; }.services-intro h2 em, .about h2 em { color: var(--aqua); }.services-intro > p:last-child { max-width: 420px; margin-top: 2rem; line-height: 1.7; color: #9dafc2; }
.service { min-height: 180px; display: grid; grid-template-columns: 1fr 1.15fr 25px; gap: 1.5rem; align-items: center; border-top: 1px solid rgba(255,255,255,.16); transition: padding .3s, color .3s; }.service:last-child { border-bottom: 1px solid rgba(255,255,255,.16); }.service:hover { padding: 0 1rem; color: var(--aqua); }.service h3 { font: 600 clamp(1.25rem, 2vw, 2rem) var(--display); letter-spacing: -.035em; }.service p { font-size: .85rem; line-height: 1.65; color: #9dafc2; }.service i { font-style: normal; }

.process { background: var(--white); }.process-track { list-style: none; display: grid; grid-template-columns: repeat(4,1fr); margin: 0; padding: 0; border-top: 1px solid var(--line); }.process-track li { min-height: 280px; padding: 2rem 1.5rem; border-right: 1px solid var(--line); display: flex; flex-direction: column; }.process-track li:last-child { border: 0; }.process-track strong { margin: auto 0 1rem; font: 600 1.5rem var(--display); }.process-track p { min-height: 4.5em; margin: 0; font-size: .85rem; line-height: 1.65; color: var(--muted); }
.about { min-height: 820px; background: #0d203a; color: white; display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: center; position: relative; overflow: hidden; }.about-mark { height: 520px; position: relative; }.about-mark::before, .about-mark::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(75,198,207,.16); }.about-mark::before { inset: 2%; }.about-mark::after { inset: 15%; border-style: dashed; }.about-mark span { position: absolute; height: 34px; border-radius: 99px; left: 15%; box-shadow: 0 25px 70px rgba(0,0,0,.2); }.about-mark span:nth-child(1) { width: 48%; top: 28%; background: #aab3bf; }.about-mark span:nth-child(2) { width: 60%; top: 46%; left: 24%; background: var(--blue); }.about-mark span:nth-child(3) { width: 54%; top: 64%; left: 34%; background: var(--aqua); }.about-copy .section-index { margin-bottom: 2rem; }.about-copy > p:not(.section-index) { max-width: 600px; margin: 2rem 0; font-size: 1.05rem; line-height: 1.8; color: #a7b7c9; }.about-copy a { display: inline-block; border-bottom: 1px solid #62768c; padding-bottom: .5rem; font-size: .82rem; font-weight: 700; }.about-copy a span { color: var(--aqua); margin-left: .5rem; }
.contact { min-height: 760px; display: flex; flex-direction: column; justify-content: space-between; }.contact-top { display: flex; justify-content: space-between; gap: 3rem; }.contact-top > p:last-child { max-width: 480px; margin: 0; line-height: 1.7; color: var(--muted); }.contact-main h2 { max-width: 1150px; }.contact-actions { margin-top: 4rem; display: flex; gap: 2rem; align-items: center; }.contact-actions a { font-size: .88rem; font-weight: 700; }.contact-actions a span { margin-left: .5rem; }.contact-primary { background: var(--blue); color: white; border-radius: 99px; padding: 1.2rem 1.6rem; transition: transform .25s, background .25s; }.contact-primary:hover { transform: translateY(-3px); background: var(--navy); }
footer { min-height: 140px; padding: 2rem clamp(1.25rem, 4vw, 4.5rem); border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 2rem; }.footer-brand .brand-mark { width: 38px; height: 38px; }.footer-brand .brand-copy small { display: none; } footer > p { color: var(--muted); font-size: .72rem; } footer > div { display: flex; gap: 1.5rem; font-size: .72rem; font-weight: 700; }

.legal-page { min-height: 100svh; padding: 9rem clamp(1.25rem, 8vw, 9rem) 6rem; }
.legal-shell { width: min(100%, 820px); margin: 0 auto; }
.legal-shell h1 { margin: 1.5rem 0 2rem; font-size: clamp(3rem, 7vw, 6rem); }
.legal-shell h2 { margin: 2.75rem 0 1rem; font-size: clamp(1.5rem, 3vw, 2.2rem); letter-spacing: -.04em; }
.legal-shell p, .legal-shell li { color: var(--muted); line-height: 1.75; }
.legal-shell a:not(.contact-primary) { color: var(--blue); text-decoration: underline; text-underline-offset: .2em; }
.legal-shell .contact-primary { color: white; text-decoration: none; }
.legal-shell ul { padding-left: 1.25rem; }
.legal-back { display: inline-flex; min-height: 44px; align-items: center; font-weight: 700; }

.page-header { background: rgba(242,241,236,.92); backdrop-filter: blur(18px); border-bottom: 1px solid var(--line); }
.desktop-nav [aria-current="page"]::after { right: 0; }
.page-hero { min-height: 720px; padding-top: clamp(11rem, 17vw, 15rem); display: flex; flex-direction: column; justify-content: flex-end; gap: 2rem; }
.page-hero h1, .case-hero h1 { max-width: 1100px; font-size: clamp(3.8rem, 8.5vw, 9rem); line-height: .9; font-weight: 650; }
.page-hero > p:last-child { max-width: 620px; margin: 0 0 0 auto; color: var(--muted); font-size: clamp(1rem, 1.6vw, 1.3rem); line-height: 1.75; }
.page-hero-dark { background: var(--navy); color: white; }
.page-hero-dark h1 em, .cta-band h2 em { color: var(--aqua); }
.page-hero-dark > p:last-child { color: #a7b7c9; }
.surface { background: var(--white); border-block: 1px solid var(--line); }
.editorial-section, .case-summary { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 8vw, 9rem); }
.editorial-lead h2, .case-summary h2, .cta-band h2 { margin-top: 2rem; font-size: clamp(2.8rem, 5.5vw, 6rem); line-height: .96; font-weight: 600; }
.prose-stack { max-width: 660px; padding-top: 3rem; }
.prose-stack p { margin: 0 0 1.5rem; color: var(--muted); font-size: 1.05rem; line-height: 1.85; }
.discipline-grid, .case-columns { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); }
.discipline-grid article, .case-columns article { min-height: 300px; padding: 2rem 1.5rem; border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.discipline-grid article:last-child, .case-columns article:last-child { border-right: 0; }
.discipline-grid span, .case-columns span { font: .65rem var(--mono); color: var(--blue); }
.discipline-grid h3, .case-columns h3 { margin: auto 0 1rem; font: 600 1.45rem var(--display); letter-spacing: -.03em; }
.discipline-grid p, .case-columns p { margin: 0; color: var(--muted); font-size: .85rem; line-height: 1.7; }
.cta-band { background: var(--navy); color: white; }
.cta-band .contact-primary { display: inline-block; margin-top: 3rem; background: var(--aqua); color: var(--navy); }
.service-detail-list > article { display: grid; grid-template-columns: .3fr 1.7fr; gap: 3rem; padding: clamp(3rem, 7vw, 6rem) 0; border-top: 1px solid var(--line); }
.service-detail-list > article:last-child { border-bottom: 1px solid var(--line); }
.service-number { margin: .5rem 0; font: .7rem var(--mono); color: var(--blue); }
.service-detail-list h2 { font-size: clamp(2.5rem, 5vw, 5.5rem); line-height: 1; }
.service-detail-list article > div > p { max-width: 720px; color: var(--muted); font-size: 1.05rem; line-height: 1.8; }
.service-detail-list ul { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; max-width: 720px; margin: 2rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.service-detail-list li { padding: 1rem 0; border-bottom: 1px solid var(--line); font-size: .88rem; }
.work-page { padding-top: 2rem; }
.work-page .project-info h2 { margin: 0; font: 600 clamp(1.8rem, 3.2vw, 3.3rem) var(--display); letter-spacing: -.045em; }
.contact-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(4rem, 10vw, 10rem); }
.contact-aside h2 { max-width: 420px; margin: 2rem 0; font-size: clamp(2rem, 4vw, 4rem); line-height: 1; }
.contact-aside a { display: block; width: fit-content; margin: 1.2rem 0; padding-bottom: .35rem; border-bottom: 1px solid var(--line); font-weight: 700; }
.contact-aside > p:last-child { max-width: 330px; margin-top: 3rem; color: var(--muted); line-height: 1.7; }
.project-form { display: grid; gap: 1.5rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.project-form label { display: grid; gap: .6rem; font-size: .78rem; font-weight: 700; }
.project-form input, .project-form select, .project-form textarea { width: 100%; border: 1px solid var(--line); border-radius: 0; background: var(--paper); color: var(--ink); padding: 1rem; font: 400 1rem var(--body); }
.project-form textarea { resize: vertical; min-height: 170px; }
.project-form .contact-primary { width: fit-content; border: 0; cursor: pointer; }
.form-note { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.6; }
.case-hero { min-height: 760px; padding-top: 12rem; display: flex; flex-direction: column; justify-content: flex-end; }
.case-hero .project-type { margin-top: auto; }
.case-hero > p:not(.project-type) { max-width: 660px; margin: 2rem 0; color: var(--muted); font-size: 1.08rem; line-height: 1.8; }
.case-hero > a:last-child, .eyebrow-link { width: fit-content; padding-bottom: .35rem; border-bottom: 1px solid var(--line); font-size: .82rem; font-weight: 700; }
.eyebrow-link { margin-bottom: 5rem; }
.case-image-wrap { margin: 0; padding: 0 clamp(1.25rem, 6vw, 7rem); }
.case-image-wrap img { display: block; width: 100%; max-height: 840px; object-fit: cover; background: #e8c7a3; }
.case-image-commerce img { object-fit: contain; padding: clamp(2rem, 7vw, 7rem); background: #cbd8e8; }
.case-image-wrap figcaption { padding-top: .75rem; color: var(--muted); font: .65rem var(--mono); }

@media (max-width: 980px) {
  .discipline-grid, .case-columns { grid-template-columns: repeat(2,1fr); }
  .discipline-grid article:nth-child(2), .case-columns article:nth-child(2) { border-right: 0; }
  .discipline-grid article:nth-child(-n+2), .case-columns article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .contact-layout { grid-template-columns: 1fr; }
}

.reveal { opacity: 0; transform: translateY(30px); transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); }.reveal.visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .desktop-nav, .header-cta { display: none; }.site-header { grid-template-columns: 1fr auto; }.menu-button { display: flex; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: transparent; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }.menu-button span { width: 17px; height: 1px; background: var(--ink); transition: transform .25s; }.menu-button[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }.menu-button[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }.mobile-menu { position: absolute; display: flex; flex-direction: column; top: 72px; left: 0; right: 0; padding: 1rem 1.5rem 2rem; background: rgba(242,241,236,.97); border-bottom: 1px solid var(--line); font: 600 1.4rem var(--display); }.mobile-menu[hidden] { display: none; }.mobile-menu a { padding: .75rem 0; min-height: 44px; }
  .hero-intro { width: min(68vw, 660px); }.flow-stage { opacity: .4; right: -10%; top: 33%; width: 60vw; height: 52vw; }.hero-intro, .hero-bottom { z-index: 3; }.statement { grid-template-columns: 1fr; }.statement > div > p { margin-left: 0; }.project-info { grid-template-columns: 1fr 1fr; }.project-info > a { grid-column: 2; }.project-reverse { margin-left: 0; }.services { grid-template-columns: 1fr; }.services-intro { position: static; }.process-track { grid-template-columns: repeat(2,1fr); }.process-track li:nth-child(2) { border-right: 0; }.process-track li:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.about { grid-template-columns: .8fr 1.2fr; }.about-mark { height: 420px; }
}

@media (max-width: 650px) {
  .site-header { height: 72px; padding-inline: 1.1rem; }.brand-mark { width: 38px; height: 38px; }.brand-copy strong { font-size: .9rem; }.brand-copy small { font-size: .42rem; }
  .hero { min-height: 850px; padding-top: 8.5rem; padding-bottom: 2rem; }.hero::before { min-width: 390px; min-height: 390px; right: -55%; top: 37%; }.hero-intro { width: 100%; }.hero h1 { font-size: clamp(3.25rem, 15vw, 5rem); }.hero-bottom { align-items: end; }.hero-bottom > p { max-width: 245px; font-size: .92rem; }.circle-link { width: 88px; height: 88px; padding: 1rem; font-size: .58rem; }.circle-link svg { width: 16px; }.flow-stage { width: 90vw; height: 72vw; top: 54%; right: -28%; }.flow-card { display: none; }
  .section-pad { padding: 5.5rem 1.25rem; }.statement h2, .section-heading h2, .services h2, .about h2, .contact h2 { font-size: clamp(2.8rem, 13vw, 4.4rem); }.section-heading { display: block; margin-bottom: 3rem; }.section-heading > p { margin-top: 2rem; }.project { margin-bottom: 5rem; }.project-visual { height: 88vw; min-height: 380px; }.browser-shell { width: 92%; }.travel-ui { height: 56vw; min-height: 250px; }.travel-nav span { display: none; }.project-info { grid-template-columns: 1fr; gap: 1.5rem; }.project-info > a { grid-column: auto; }.project-commerce { min-height: 520px; }.phone-shell { min-width: 180px; width: 50%; transform: rotate(4deg) translateX(-30px); }.commerce-ui { min-height: 390px; }.device-art { height: 155px; }.finance-card { right: 4%; bottom: 9%; width: 180px; }.portfolio-bridge { align-items: start; gap: 1rem; flex-direction: column; }.service { grid-template-columns: 1fr 20px; padding: 1.5rem 0; }.service p { grid-column: 1; margin: -.5rem 0 0; }.service i { grid-column: 2; grid-row: 1; }.process-track { grid-template-columns: 1fr; }.process-track li { min-height: 210px; border-right: 0; border-bottom: 1px solid var(--line); }.process-track li:nth-child(3) { border-bottom: 1px solid var(--line); }.about { grid-template-columns: 1fr; min-height: auto; }.about-mark { height: 280px; order: 2; }.about-copy { order: 1; }.contact { min-height: 690px; }.contact-top { flex-direction: column; }.contact-actions { flex-direction: column; align-items: flex-start; gap: 1.5rem; } footer { flex-direction: column; align-items: flex-start; padding-block: 3rem; } footer > div { flex-wrap: wrap; }
  .page-hero { min-height: 650px; padding-top: 10rem; }.page-hero h1, .case-hero h1 { font-size: clamp(3.2rem, 16vw, 5.5rem); }.page-hero > p:last-child { margin-left: 0; }.editorial-section, .case-summary { grid-template-columns: 1fr; gap: 1rem; }.prose-stack { padding-top: 1rem; }.discipline-grid, .case-columns { grid-template-columns: 1fr; }.discipline-grid article, .case-columns article { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--line); }.discipline-grid article:nth-child(3), .case-columns article:nth-child(3) { border-bottom: 1px solid var(--line); }.service-detail-list > article { grid-template-columns: 1fr; gap: 1rem; }.service-detail-list ul { grid-template-columns: 1fr; }.field-row { grid-template-columns: 1fr; }.case-hero { min-height: 690px; padding-top: 9rem; }.eyebrow-link { margin-bottom: 4rem; }.case-image-wrap { padding-inline: 1.25rem; }.project-image-contain { padding: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }.reveal { opacity: 1; transform: none; }
}