/*
 * Editorial Product Design Portfolio
 * Plain CSS; no framework, downloaded fonts, images, or animation library.
 * Add project screenshots to assets/images/ using IMAGE-PLACEMENTS.json.
 */
:root {
  --paper: #f6f6f2;
  --paper-soft: #efefea;
  --ink: #24312b;
  --muted: #65716b;
  --soft-muted: #848d86;
  --forest: #27372f;
  --forest-light: #35473b;
  --line: #d6dbd4;
  --line-strong: #b8c0b9;
  --accent: #627b68;
  --sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --serif: 'Iowan Old Style', 'Baskerville', 'Palatino Linotype', Georgia, serif;
  --gutter: clamp(23px, 5.1vw, 90px);
  --header-height: 88px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { max-width: 100%; }
:focus-visible { outline: 3px solid #70977b; outline-offset: 5px; }
::selection { color: #fff; background: var(--forest); }
.container-wide { max-width: 1600px; padding-left: var(--gutter); padding-right: var(--gutter); margin-left: auto; margin-right: auto; }
.visually-hidden { clip: rect(0,0,0,0); position: absolute; width: 1px; height: 1px; white-space: nowrap; overflow: hidden; clip-path: inset(50%); }
.skip-link { background: var(--forest); color: #fff; position: fixed; z-index: 100; left: 20px; top: -80px; padding: 15px 20px; }
.skip-link:focus { top: 15px; }
.eyebrow, .hero-issue, .small-overline, .chapter-rail, .column-label, .case-facts span, .page-breadcrumb, .case-breadcrumb, .hero-small-callout, .side-note, .section-boundary, .project-category, .draft-label, .resume-meta, .cap-index, .archive-place-label, .slot-top, .slot-bottom, .slot-note, .footer-bottom, .draft-banner { font-size: 11px; font-weight: 650; letter-spacing: .13em; line-height: 1.6; }
.eyebrow { text-transform: uppercase; margin: 0; }
.eyebrow-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); margin-right: 9px; vertical-align: 1px; }
.eyebrow.inverse { color: #d3dfd5; }
.separator-slash { margin-inline: 7px; color: #9fa7a0; }
.fine-rule { display: inline-block; width: 45px; height: 1px; background: currentColor; vertical-align: 4px; margin-inline: 9px; opacity: .45; }
.copy-prose p { font-size: clamp(17px, 1.3vw, 19px); font-weight: 400; line-height: 1.75; letter-spacing: -.014em; margin: 0 0 1.1em; }
.copy-prose p:last-child { margin-bottom: 0; }
.copy-prose strong { font-weight: 700; }
.text-link { display: inline-flex; align-items: center; gap: 27px; color: var(--ink); font-size: 13px; font-weight: 650; letter-spacing: -.015em; padding: 5px 0 9px; border-bottom: 1px solid var(--ink); transition: gap .2s ease; }
.text-link:hover { gap: 37px; }
.text-link span { font-size: 19px; line-height: .6; }

/* Header */
.site-header { height: var(--header-height); width: 100%; position: sticky; top: 0; z-index: 50; background: rgba(246, 246, 242, .965); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.header-inner { display: flex; justify-content: space-between; align-items: center; height: 100%; gap: 25px; }
.wordmark { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; white-space: nowrap; gap: 12px; }
.wordmark-photo { display: block; width: 56px; height: 56px; object-fit: cover; border-radius: 50%; flex: 0 0 auto; }
.wordmark-text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 5px; min-width: 0; }
.wordmark-name { font-size: 20px; font-weight: 750; letter-spacing: -.07em; line-height: 1; }
.wordmark-sub { font-size: 8px; font-weight: 700; letter-spacing: .18em; color: var(--muted); }
.primary-nav { display: flex; align-items: center; gap: clamp(20px, 2.4vw, 40px); height: 100%; }
.primary-nav a { align-self: stretch; display: inline-flex; align-items: center; position: relative; font-size: 13px; font-weight: 600; color: #67746b; transition: color .15s ease; }
.primary-nav a:hover, .primary-nav a[aria-current] { color: var(--ink); }
.primary-nav a[aria-current]:after { content: ''; position: absolute; height: 2px; bottom: -1px; left: 0; right: 0; background: var(--forest); }
.mobile-menu-toggle { display: none; }

/* Home hero */
.home-hero { padding-top: clamp(76px, 9vw, 146px); padding-bottom: 75px; }
.hero-topline { display: flex; align-items: center; justify-content: space-between; color: var(--muted); gap: 20px; }
.hero-issue { white-space: nowrap; }
.home-hero h1 { font-size: clamp(58px, 8.3vw, 132px); line-height: .99; letter-spacing: -.081em; font-weight: 650; margin: clamp(49px, 6.2vw, 102px) 0 67px; max-width: 1430px; }
.home-hero h1 .hero-title-secondary { white-space: nowrap; }
.home-hero em, .standard-hero em, .statement-grid em, .footer-lead em, .outcome-layout em { font-family: var(--serif); font-weight: 400; letter-spacing: -.077em; }
.home-hero em { color: var(--accent); }
.home-hero-bottom { display: grid; grid-template-columns: 1.1fr .9fr; gap: 65px; align-items: end; }
.hero-small-callout { color: var(--muted); display: flex; align-items: center; gap: 16px; }
.callout-plus { font-size: 27px; font-weight: 400; color: var(--accent); }
.hero-summary { max-width: 490px; }
.hero-summary p { font-size: clamp(18px, 1.7vw, 23px); line-height: 1.52; letter-spacing: -.025em; margin: 0 0 30px; }
.section-boundary { justify-content: flex-end; border-top: 1px solid var(--line-strong); padding-top: 21px; padding-bottom: 61px; display: flex; justify-content: space-between; color: var(--muted); }

/* Screenshot placeholders, never mockups or fabricated UI */
.image-slot { width: 100%; position: relative; margin: 0; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid rgba(35,49,43,.07); color: #4b5b51; background: #e9eae5; isolation: isolate; }
.image-slot:after { content: ''; position: absolute; inset: 18px; border: 1px solid rgba(62,78,65,.13); pointer-events: none; z-index: 0; }
.tone-sage { background: #e1e7e0; }
.tone-slate { background: #e3e7e7; }
.tone-clay { background: #ece5df; }
.tone-cream { background: #ecebe4; }
.slot-top, .slot-bottom { position: relative; z-index: 1; display: flex; justify-content: space-between; padding: 36px 40px; font-size: 10px; letter-spacing: .14em; color: rgba(43,61,48,.56); }
.slot-bottom { padding-top: 0; }
.slot-bottom span:last-child { font-size: 18px; font-weight: 400; letter-spacing: 0; }
.slot-center { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; margin: auto; padding: 30px; gap: 13px; }
.slot-mark { width: 35px; height: 29px; border: 1.5px solid #819285; display: inline-block; position: relative; margin-bottom: 6px; }
.slot-mark:after { content: ''; position: absolute; width: 8px; height: 8px; right: -5px; top: -5px; background: currentColor; opacity: .3; }
.slot-title { display: block; font-size: clamp(14px, 1.4vw, 18px); letter-spacing: -.02em; line-height: 1.3; font-weight: 600; max-width: 320px; }
.slot-note { display: block; font-size: 9px; letter-spacing: .1em; opacity: .8; text-transform: uppercase; }
.image-slot img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; z-index: 2; display: block; }
.image-slot.has-image:after, .image-slot.has-image .slot-top, .image-slot.has-image .slot-bottom, .image-slot.has-image .slot-center { display: none; }
.image-slot.has-image { background: transparent; }
.feature-media-link { display: block; min-width: 0; overflow: hidden; }
.feature-media-link .image-slot { transition: background-color .2s ease; }
.feature-media-link:hover .image-slot { background-color: #d9e0d8; }
.feature-media-link:hover .tone-clay { background-color: #e7dad1; }
.feature-media-link:hover .tone-slate { background-color: #d8dedf; }

/* Selected projects */
.featured-work { padding-bottom: 85px; }
.featured-project { display: grid; grid-template-columns: minmax(0, 1.19fr) minmax(0, .81fr); gap: clamp(45px, 6.3vw, 105px); align-items: stretch; padding-bottom: clamp(100px, 11vw, 168px); }
.featured-project.featured-reverse { grid-template-columns: minmax(0,.81fr) minmax(0, 1.19fr); }
.featured-reverse .feature-media-link { order: 2; }
.featured-reverse .featured-copy { order: 1; }
.feature-slot { aspect-ratio: 1.16; min-height: 530px; }
.featured-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: 19px 0 13px; min-width: 0; }
.project-category { color: #77847a; margin: 0 0 21px; text-transform: uppercase; }
.project-category span { font-size: 13px; padding: 0 4px; }
.featured-copy h3 { font-size: clamp(45px, 4.9vw, 76px); line-height: 1.035; letter-spacing: -.068em; font-weight: 620; margin: 0 0 27px; }
.heading-period { color: #000; }
.project-description { font-size: clamp(16px, 1.24vw, 19px); line-height: 1.66; letter-spacing: -.02em; color: #5f6c63; max-width: 420px; margin: 0; }
.draft-inline { color: #7a766f; font-size: 11px; letter-spacing: .09em; text-transform: uppercase; margin: 18px 0 0; }
.arrow-link { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 30px; border-top: 1px solid var(--line-strong); padding-top: 22px; font-size: 14px; font-weight: 650; }
.arrow-link span { font-size: 27px; font-weight: 350; line-height: 1; transition: transform .2s ease; }
.arrow-link:hover span { transform: translate(4px, -4px); }
.statement-section { background: #e8ede6; padding: clamp(82px, 10vw, 148px) 0; }
.statement-grid { display: grid; grid-template-columns: .24fr .76fr; gap: 65px; }
.statement-grid .eyebrow { padding-top: 14px; }
.statement-grid > p:last-child { font-size: clamp(35px, 4.5vw, 68px); line-height: 1.18; letter-spacing: -.055em; max-width: 980px; margin: 0; font-weight: 570; }
.statement-grid em { color: var(--accent); }
.older-preview { padding-top: 120px; padding-bottom: 145px; }
.section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 45px; }
.section-heading-row h2 { font-size: clamp(38px, 4.5vw, 68px); letter-spacing: -.063em; line-height: 1.1; margin: 24px 0 0; font-weight: 600; }
.older-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 23px; }
.archive-slot { aspect-ratio: 1.23; }
.archive-slot .slot-top, .archive-slot .slot-bottom, .gallery-slot .slot-top, .gallery-slot .slot-bottom { padding: 25px; }
.archive-slot .slot-bottom, .gallery-slot .slot-bottom { padding-top: 0; }
.archive-slot:after, .gallery-slot:after { inset: 13px; }
.archive-slot .slot-note, .gallery-slot .slot-note { display: none; }
.archive-teaser-label { border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding-top: 16px; padding-bottom: 18px; font-size: 14px; font-weight: 600; }
.archive-teaser-label span { font-size: 19px; transition: transform .2s ease; }
.archive-teaser:hover .archive-teaser-label span { transform: translate(3px,-3px); }

/* Case studies */
.case-hero { padding-top: 54px; padding-bottom: 72px; }
.case-breadcrumb, .page-breadcrumb { color: var(--soft-muted); display: flex; align-items: center; gap: 13px; letter-spacing: .045em; font-size: 12px; font-weight: 550; margin-bottom: 75px; }
.case-breadcrumb a:hover, .page-breadcrumb a:hover { color: var(--ink); text-decoration: underline; }
.case-hero > .eyebrow { margin-bottom: 35px; }
/* Company identifier directly beneath the case-study label, matching homepage scale. */
.case-hero > .eyebrow.case-hero-label { margin-bottom: 9px; }
.case-hero > .case-company { font-size: clamp(22px, 2.35vw, 31px); font-weight: 610; letter-spacing: -.047em; line-height: 1.15; margin: 0 0 35px; }
.case-hero h1 { max-width: 1320px; font-size: clamp(52px, 6.55vw, 100px); line-height: 1.07; font-weight: 620; letter-spacing: -.069em; margin: 0 0 22px; text-wrap: balance; }
.case-subtitle { color: var(--muted); font-size: clamp(15px, 1.4vw, 18px); line-height: 1.45; font-weight: 500; letter-spacing: -.012em; margin: 0; max-width: 60ch; }
.case-intro-grid { margin-top: clamp(65px, 7vw, 100px); display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(255px,.55fr); gap: clamp(60px, 11vw, 190px); }
.case-intro-copy { max-width: 750px; }
.case-intro-copy p { font-size: clamp(17px, 1.3vw, 19px); line-height: 1.75; }
.case-facts { align-self: start; border-top: 1px solid var(--line-strong); }
.case-facts > div { border-bottom: 1px solid var(--line); padding: 14px 0 19px; display: grid; grid-template-columns: .34fr .66fr; gap: 11px; }
.case-facts span { color: #7c897e; padding-top: 3px; font-size: 10px; }
.case-facts strong { font-size: 13px; line-height: 1.6; font-weight: 600; }
.case-hero-media { padding-bottom: 135px; }
.case-cover { aspect-ratio: 2.01; min-height: 430px; }
.case-cover .slot-center { padding: 50px; }
.case-chapter { display: grid; grid-template-columns: minmax(145px,.24fr) minmax(0,.76fr); gap: 65px; padding-top: 50px; padding-bottom: 155px; border-top: 1px solid var(--line-strong); }
.chapter-rail { display: flex; flex-direction: column; align-items: flex-start; gap: 26px; color: var(--muted); font-size: 10px; }
.chapter-rail .rail-number { color: var(--ink); }
.chapter-rail .rail-line { height: 35px; width: 1px; background: var(--line-strong); }
.chapter-content { min-width: 0; }
.chapter-content > .eyebrow { margin-bottom: 22px; color: var(--accent); letter-spacing: .075em; font-size: 13px; text-transform: none; }
.chapter-content h2, .split-intro h2, .leadership-layout h2 { font-size: clamp(40px, 4.3vw, 67px); font-weight: 600; line-height: 1.1; letter-spacing: -.059em; margin: 0 0 36px; max-width: 890px; text-wrap: balance; }
.chapter-kicker { font-size: 14px; color: var(--accent); font-weight: 550; letter-spacing: -.015em; margin: -11px 0 31px; }
.chapter-subhead { font-size: clamp(23px, 2.6vw, 34px); letter-spacing: -.04em; line-height: 1.25; margin: 0 0 31px; font-weight: 550; }
.narrow-copy { max-width: 750px; }
.approach-wrap { margin-top: 81px; }
.approach-wrap > h3 { margin: 0 0 33px; font-size: 24px; letter-spacing: -.04em; font-weight: 600; }
.approach-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 36px; border-top: 1px solid var(--line-strong); }
.approach-item { border-bottom: 1px solid var(--line); padding: 32px 0 35px; }
.approach-item h4 { font-size: 15px; line-height: 1.55; font-weight: 650; letter-spacing: -.025em; margin: 0 0 19px; }
.approach-item p { font-size: 15px; line-height: 1.75; color: #626f66; margin: 0; }
.small-overline { display: flex; align-items: center; gap: 22px; color: var(--muted); padding-bottom: 35px; border-bottom: 1px solid var(--line-strong); }
.small-overline span:first-child { color: var(--ink); }
.product-story-section { background: #efefeb; padding-top: 65px; padding-bottom: 70px; }
.product-story { display: grid; grid-template-columns: minmax(0,.79fr) minmax(0,1.21fr); gap: clamp(50px, 8vw, 132px); align-items: center; min-height: 760px; padding-top: 132px; padding-bottom: 140px; border-bottom: 1px solid #d3d7d1; }
.product-story.reverse-story { grid-template-columns: minmax(0,1.21fr) minmax(0,.79fr); }
.product-story.reverse-story .product-story-copy { order: 2; }
.product-story.reverse-story .product-story-media { order: 1; }
.product-story.last-story { border-bottom: 0; }
.product-story-copy { min-width: 0; }
.product-story-copy .eyebrow { color: var(--muted); margin-bottom: 21px; }
.product-story-copy h2 { font-size: clamp(55px, 6vw, 95px); letter-spacing: -.075em; font-weight: 600; margin: 0 0 18px; line-height: 1; }
.product-story-copy h3 { font-size: clamp(24px, 2.5vw, 37px); font-weight: 500; letter-spacing: -.047em; line-height: 1.23; margin: 0 0 37px; }
.product-story-copy .copy-prose p { font-size: 16px; line-height: 1.78; }
.product-story-media { position: relative; min-width: 0; padding-bottom: 76px; }
.product-large { aspect-ratio: 1.24; min-height: 360px; }
.product-detail { aspect-ratio: 1.45; position: absolute; width: 49%; max-height: 250px; left: -10%; bottom: 0; box-shadow: 0 20px 35px rgba(39,55,47,.09); }
.reverse-story .product-detail { left: auto; right: -8%; }
.product-detail .slot-top, .product-detail .slot-bottom { padding: 18px 22px; font-size: 8px; }
.product-detail .slot-bottom { padding-top: 0; }
.product-detail .slot-mark, .product-detail .slot-note { display: none; }
.product-detail .slot-title { font-size: 12px; }
.product-detail:after { inset: 11px; }
.leadership-story { padding-top: 100px; padding-bottom: 135px; }
.leadership-layout { display: grid; grid-template-columns: .93fr 1.07fr; gap: 110px; padding-top: 85px; padding-bottom: 65px; }
.leadership-layout .eyebrow { margin-bottom: 25px; }
.leadership-media { aspect-ratio: 2.06; min-height: 380px; }
.outcome-story { background: var(--paper); color: var(--ink); padding-top: 93px; padding-bottom: 132px; }
.small-overline.inverse { border-bottom-color: #617064; color: #c0cac0; }
.small-overline.inverse span:first-child { color: #fff; }
.outcome-layout { display: grid; grid-template-columns: .93fr 1.07fr; gap: 110px; padding-top: 85px; }
.outcome-layout h2 { font-size: clamp(40px, 4.3vw, 67px); line-height: 1.1; letter-spacing: -.059em; font-weight: 600; margin: 0; }
.outcome-layout em { color: inherit; font-family: inherit; font-weight: inherit; }
.outcome-layout .copy-prose p { color: var(--ink); }
.next-case { padding-top: 90px; padding-bottom: 125px; }
.next-case > .eyebrow { color: var(--muted); }
.next-case > a { display: flex; align-items: center; justify-content: space-between; gap: 30px; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); margin-top: 21px; padding: 38px 0 42px; font-size: clamp(53px, 6vw, 92px); font-weight: 570; letter-spacing: -.067em; line-height: 1.1; }
.next-case > a span:last-child { font-size: 53px; font-weight: 350; transition: transform .2s ease; }
.next-case > a:hover span:last-child { transform: translate(5px,-5px); }

/* Enviance & Segistics visual section variants */
.chapter-image-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 75px; }
.chapter-side-slot { aspect-ratio: 1.22; min-height: 270px; }
.chapter-side-slot .slot-top, .chapter-side-slot .slot-bottom { padding: 25px; }
.chapter-side-slot .slot-bottom { padding-top: 0; }
.chapter-side-slot:after { inset: 14px; }
.full-width-chapter { padding-top: 86px; padding-bottom: 150px; background: #eeefeb; }
.split-intro { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(50px, 9.5vw, 150px); align-items: start; padding-top: 83px; padding-bottom: 60px; }
.split-intro h2 { margin: 0; }
.wide-showcase { aspect-ratio: 2.03; min-height: 420px; }
.two-visuals { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 22px; }
.showcase-detail { aspect-ratio: 1.59; min-height: 280px; }
.process-chapter { background: var(--paper); color: var(--ink); padding-top: 84px; padding-bottom: 122px; }
.process-intro { padding-top: 90px; padding-bottom: 79px; }
.process-intro .copy-prose p { color: var(--ink); }
.process-media-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.process-slot { aspect-ratio: .97; min-height: 320px; }
.process-slot .slot-bottom, .process-slot .slot-top { padding: 25px; }
.process-slot .slot-bottom { padding-top: 0; }
.draft-banner { padding: 13px 17px; border: 1px solid #c5cfc1; display: flex; gap: 20px; align-items: center; background: #e9eee7; margin-bottom: 30px; max-width: fit-content; letter-spacing: .07em; }
.draft-banner strong { font-size: 10px; white-space: nowrap; }
.draft-banner span { color: #526357; font-size: 11px; letter-spacing: .01em; font-weight: 450; }
.draft-label { display: inline-block; font-size: 9px; background: #e6ebdf; border: 1px solid #c9d4c7; color: #4c6050; padding: 5px 9px; margin: 0 0 16px; letter-spacing: .08em; vertical-align: middle; }
.draft-label.light-label { background: transparent; color: #e6eee6; border-color: #74877a; }
.case-intro-copy .draft-label { display: inline; line-height: 2.5; }

/* Archive and résumé */
.standard-hero { padding-top: 55px; padding-bottom: 119px; }
.standard-hero .eyebrow { margin-bottom: 42px; }
.standard-hero h1 { margin: 0; font-size: clamp(63px, 8.3vw, 132px); font-weight: 600; letter-spacing: -.079em; line-height: 1.02; }
.standard-hero h1 em { color: var(--accent); }
.intro-trailer { border-top: 1px solid var(--line-strong); margin-top: 91px; padding-top: 28px; display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.intro-trailer > p { font-size: clamp(19px, 2.2vw, 31px); letter-spacing: -.038em; line-height: 1.42; margin: 0; max-width: 660px; }
.side-note { white-space: nowrap; color: var(--muted); padding-top: 11px; }
.standard-section { border-top: 1px solid var(--line-strong); display: grid; grid-template-columns: .26fr .74fr; gap: 65px; padding-top: 62px; padding-bottom: 160px; }
.column-label { color: var(--muted); }
.readable-content { max-width: 830px; }
.readable-content h2 { font-size: clamp(43px, 4.6vw, 70px); letter-spacing: -.06em; font-weight: 600; line-height: 1.09; margin: 0 0 45px; }
.readable-content .copy-prose { max-width: 770px; }
.capabilities-section { padding: 110px 0 130px; background: #eaece7; }
.capabilities-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; border-top: 1px solid #cbd2c9; margin-top: 50px; }
.capabilities-grid article { padding-top: 29px; }
.cap-index { color: #6a7a6d; }
.capabilities-grid h3 { font-size: clamp(22px, 2.2vw, 31px); letter-spacing: -.049em; font-weight: 600; line-height: 1.23; margin: 42px 0 21px; }
.capabilities-grid p { font-size: 15px; color: #5f6d61; line-height: 1.73; margin: 0; }
.about-end { padding-bottom: 150px; }
.timeline-list { border-top: 1px solid var(--line-strong); margin-bottom: 45px; }
.timeline-list a { display: grid; grid-template-columns: .48fr .45fr .07fr; padding: 28px 0; border-bottom: 1px solid var(--line); align-items: center; gap: 15px; }
.timeline-list a span:first-child { font-size: 23px; font-weight: 600; letter-spacing: -.04em; }
.timeline-list a span:nth-child(2) { font-size: 14px; color: var(--muted); }
.timeline-list a span:last-child { justify-self: end; font-size: 23px; }
.timeline-list a:hover span:first-child { color: var(--accent); }
.archive-hero, .resume-hero, .contact-hero { padding-bottom: 110px; }
.archive-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 26px; row-gap: 100px; padding-bottom: 160px; }
.archive-tile { min-width: 0; scroll-margin-top: 110px; }
.gallery-slot { aspect-ratio: 1.45; min-height: 340px; }
.archive-tile-foot { display: flex; gap: 30px; justify-content: space-between; align-items: start; padding-top: 21px; border-top: 1px solid var(--line-strong); margin-top: 17px; }
.archive-tile h2 { font-size: 23px; letter-spacing: -.04em; font-weight: 600; margin: 0 0 10px; }
.archive-tile p { font-size: 14px; color: var(--muted); margin: 0; }
.archive-place-label { white-space: nowrap; color: var(--soft-muted); font-size: 9px; }
/* Résumé: same editorial language, substantive information from approved PDF */
.resume-hero { padding-bottom: 102px; }
.resume-hero .intro-trailer { align-items: end; }
.resume-download { white-space: nowrap; flex: 0 0 auto; }
.resume-content { padding-bottom: 120px; }
.resume-column-head { border-top: 1px solid var(--line-strong); padding-top: 25px; padding-bottom: 39px; display: flex; justify-content: space-between; align-items: baseline; gap: 35px; }
.resume-column-head .eyebrow { color: var(--muted); }
.resume-profile { max-width: 1010px; font-size: clamp(19px, 1.75vw, 26px); line-height: 1.57; letter-spacing: -.028em; margin: 0 0 90px; }
.resume-subheading { padding-bottom: 25px; margin-top: 70px; }
.resume-content > .resume-subheading:first-child { margin-top: 0; }
.resume-caption { color: var(--muted); font-size: 12px; }
.resume-item { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: clamp(40px,8vw,130px); padding: 38px 0 42px; border-bottom: 1px solid var(--line); }
.resume-role h3 { font-size: clamp(27px, 2.9vw, 43px); letter-spacing: -.054em; font-weight: 600; line-height: 1.12; margin: 0 0 13px; }
.resume-company { font-size: 18px; font-weight: 600; margin: 0 0 10px; }
.resume-meta { color: var(--muted); font-size: 11px; margin: 0; }
.resume-highlights { padding: 3px 0 0 19px; margin: 0; color: #556259; }
.resume-highlights li { padding-left: 5px; font-size: 15px; line-height: 1.69; margin-bottom: 12px; }
.resume-highlights li:last-child { margin-bottom: 0; }
.resume-skills { display: flex; flex-wrap: wrap; gap: 11px; max-width: 1060px; }
.resume-skills span { font-size: 14px; padding: 13px 19px; border: 1px solid var(--line-strong); }
.resume-education { display: grid; grid-template-columns: repeat(2,1fr); gap: 35px; }
.resume-education > div { border-bottom: 1px solid var(--line); padding: 12px 0 35px; }
.resume-education h3 { font-size: 22px; letter-spacing: -.035em; margin: 0 0 12px; font-weight: 600; }
.resume-education p { color: var(--muted); font-size: 16px; margin: 0; }
.resume-contact { border-top: 1px solid var(--line-strong); padding-top: 70px; padding-bottom: 140px; display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(40px,8vw,130px); scroll-margin-top: 110px; }
.resume-contact h2 { font-size: clamp(41px, 5vw, 70px); letter-spacing: -.06em; font-weight: 600; margin: 20px 0 0; }
.resume-contact-info { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; font-size: 17px; }
.resume-contact-info .resume-email { font-size: clamp(19px,2.2vw,29px); letter-spacing: -.035em; overflow-wrap: anywhere; border-bottom: 1px solid var(--line-strong); padding-bottom: 8px; margin-bottom: 8px; }
.resume-contact-info a:hover { text-decoration: underline; }
.resume-contact-info > span { color: var(--muted); }
.contact-content { border-top: 1px solid var(--line-strong); display: grid; grid-template-columns: 1.2fr .8fr; gap: 110px; padding-top: 75px; padding-bottom: 190px; }
.contact-primary > .eyebrow, .contact-aside > .eyebrow { color: var(--muted); margin-bottom: 37px; }
.contact-missing { font-size: clamp(30px, 4vw, 59px); line-height: 1.14; letter-spacing: -.053em; margin: 0 0 27px; }
.contact-help { font-size: 15px; line-height: 1.8; max-width: 490px; color: var(--muted); }
.contact-help code { font-size: 13px; background: #e8ebe5; padding: 2px 4px; }
.contact-email-link { font-size: clamp(28px, 3.5vw, 55px); letter-spacing: -.06em; padding-bottom: 10px; border-bottom: 1px solid var(--ink); overflow-wrap: anywhere; }
.contact-email-link span { font-size: 34px; }
.contact-email-link[hidden], [data-contact-state][hidden] { display: none; }
.contact-aside a { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); font-size: 20px; letter-spacing: -.035em; padding: 20px 0; }
.contact-aside a:last-child { border-bottom: 1px solid var(--line); }
.contact-aside a span { font-size: 23px; }

/* Footer */
.site-footer { background: var(--forest); color: #f4f6f1; padding: 88px 0 40px; }
.footer-lead { display: flex; justify-content: space-between; align-items: end; gap: 55px; padding-bottom: 120px; }
.footer-lead h2 { font-size: clamp(53px, 6.5vw, 102px); font-weight: 550; line-height: 1.02; letter-spacing: -.071em; margin: 32px 0 0; }
.footer-lead em { color: #b0c5ae; }
.circle-link { width: clamp(82px, 9vw, 135px); height: clamp(82px, 9vw, 135px); flex: 0 0 auto; border: 1px solid rgba(255,255,255,.57); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 56px; font-weight: 250; transition: background .18s ease, color .18s ease; }
.circle-link:hover { background: #f0f4eb; color: var(--forest); }
.footer-bottom { border-top: 1px solid #657367; padding-top: 30px; display: flex; justify-content: space-between; align-items: center; gap: 20px; color: #b7c3b7; font-size: 10px; font-weight: 500; letter-spacing: .055em; }
.footer-bottom > div { display: flex; gap: 25px; }
.footer-bottom a:hover { color: #fff; text-decoration: underline; }

/* Tablet and smaller laptops */
@media (max-width: 1100px) {
 :root { --gutter: clamp(26px, 4vw, 45px); }
 .home-hero h1 { font-size: clamp(57px, 8.7vw, 100px); }
 .featured-project { gap: 45px; }
 .featured-copy h3 { font-size: clamp(44px, 5vw, 63px); }
 .feature-slot { min-height: 440px; }
 .case-intro-grid { gap: 55px; }
 .case-chapter { grid-template-columns: 140px 1fr; gap: 38px; }
 .product-story, .product-story.reverse-story { gap: 60px; }
 .product-story { min-height: 690px; }
 .product-large { min-height: 300px; }
 .leadership-layout, .outcome-layout { gap: 65px; }
 .split-intro { gap: 55px; }
 .process-slot { min-height: 240px; }
 .capabilities-grid { grid-template-columns: repeat(2,1fr); row-gap: 40px; }
}
@media (max-width: 820px) {
 :root { --header-height: 76px; }
 html { scroll-padding-top: 83px; }
 .wordmark-photo { width: 48px; height: 48px; }
 .wordmark { gap: 10px; }
 .wordmark-name { font-size: 19px; }
 .mobile-menu-toggle { display: flex; flex-direction: column; justify-content: center; gap: 7px; background: transparent; border: 0; padding: 10px; width: 44px; height: 44px; cursor: pointer; z-index: 55; }
 .mobile-menu-toggle span { display: block; width: 24px; height: 1.5px; background: var(--ink); transition: transform .15s ease; }
 .mobile-menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4.25px) rotate(45deg); }
 .mobile-menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4.25px) rotate(-45deg); }
 .primary-nav { display: none; position: fixed; left: 0; right: 0; top: var(--header-height); bottom: 0; height: calc(100dvh - var(--header-height)); padding: 43px var(--gutter) 80px; flex-direction: column; gap: 0; align-items: stretch; background: var(--paper); border-top: 1px solid var(--line); overflow-y: auto; }
 .primary-nav.is-open { display: flex; }
 .primary-nav a { flex: 0 0 auto; align-self: stretch; padding: 17px 0; font-size: 31px; letter-spacing: -.055em; border-bottom: 1px solid var(--line); }
 .primary-nav a[aria-current]:after { display: none; }
 .home-hero { padding-top: 80px; }
 .home-hero h1 { margin-top: 95px; font-size: clamp(50px, 9.2vw, 82px); }
 .home-hero-bottom { grid-template-columns: 1fr 1fr; gap: 30px; }
 .feature-slot { min-height: 390px; }
 .featured-project, .featured-project.featured-reverse { grid-template-columns: 1fr; gap: 30px; padding-bottom: 110px; }
 .featured-reverse .feature-media-link, .featured-reverse .featured-copy { order: initial; }
 .featured-copy { display: grid; grid-template-columns: .30fr .7fr; column-gap: 25px; row-gap: 26px; }
 .featured-copy > .eyebrow { grid-row: 1 / span 1; }
 .featured-copy > div { grid-column: 2; grid-row: 1 / span 2; }
 .featured-copy > .arrow-link { grid-column: 2; }
 .featured-copy h3 { font-size: clamp(49px, 8.8vw, 73px); }
 .featured-copy .project-description { max-width: 600px; }
 .statement-grid { grid-template-columns: 1fr; gap: 29px; }
 .older-preview { padding-top: 100px; padding-bottom: 110px; }
 .older-preview-grid { gap: 14px; }
 .archive-slot .slot-bottom { display: none; }
 .slot-title { font-size: 15px; }
 .case-hero h1 { font-size: clamp(51px, 8.3vw, 77px); }
 .case-intro-grid { grid-template-columns: 1fr; }
 .case-facts { display: grid; grid-template-columns: repeat(2,1fr); gap: 0 28px; }
 .case-chapter { grid-template-columns: 1fr; gap: 37px; padding-bottom: 110px; }
 .chapter-rail { flex-direction: row; align-items: center; }
 .chapter-rail .rail-line { height: 1px; width: 35px; }
 .product-story, .product-story.reverse-story { grid-template-columns: 1fr; gap: 60px; padding-top: 85px; padding-bottom: 110px; min-height: 0; }
 .product-story.reverse-story .product-story-copy, .product-story.reverse-story .product-story-media { order: initial; }
 .product-story-copy { max-width: 620px; }
 .product-story-copy h2 { font-size: 72px; }
 .product-story-media { max-width: 750px; margin: 0 0 0 5%; }
 .reverse-story .product-detail { right: 0; }
 .leadership-layout, .outcome-layout, .split-intro { grid-template-columns: 1fr; gap: 35px; }
 .leadership-story { padding-top: 90px; }
 .outcome-layout { padding-top: 70px; }
 .outcome-layout h2 { margin-bottom: 12px; }
 .standard-section { grid-template-columns: 1fr; gap: 28px; padding-bottom: 100px; }
 .readable-content { max-width: none; }
 .process-media-grid { gap: 12px; }
 .process-slot .slot-bottom { display: none; }
 .contact-content { gap: 50px; }
}
@media (max-width: 600px) {
 :root { --gutter: 22px; }
 .wordmark-photo { width: 44px; height: 44px; }
 .eyebrow, .hero-issue, .side-note, .section-boundary { font-size: 9px; }
 .hero-issue { display: none; }
 .home-hero { padding-top: 69px; padding-bottom: 68px; }
 .home-hero h1 { font-size: clamp(43px, 10.3vw, 65px); letter-spacing: -.076em; line-height: 1.05; margin: 73px 0 52px; }
 .home-hero h1 .hero-title-secondary { white-space: normal; }
 .home-hero-bottom { grid-template-columns: 1fr; gap: 33px; }
 .hero-small-callout { order: 2; }
 .hero-summary p { font-size: 18px; }
 .section-boundary { padding-bottom: 34px; }
 .feature-slot { min-height: 350px; aspect-ratio: .96; }
 .slot-top, .slot-bottom { padding: 24px; font-size: 8px; }
 .slot-bottom { padding-top: 0; }
 .image-slot:after { inset: 12px; }
 .slot-center { padding: 23px; }
 .slot-title { font-size: 14px; }
 .slot-note { font-size: 8px; }
 .featured-project, .featured-project.featured-reverse { padding-bottom: 95px; }
 .featured-copy { grid-template-columns: 1fr; row-gap: 27px; }
 .featured-copy > div, .featured-copy > .arrow-link { grid-column: 1; grid-row: auto; }
 .featured-copy h3 { font-size: clamp(45px, 11.5vw, 68px); }
 .project-description { font-size: 16px; }
 .statement-section { padding: 80px 0; }
 .statement-grid > p:last-child { font-size: clamp(35px, 9vw, 53px); }
 .section-heading-row { display: block; }
 .section-heading-row h2 { margin-bottom: 24px; }
 .older-preview { padding-top: 83px; padding-bottom: 100px; }
 .older-preview-grid { grid-template-columns: 1fr; gap: 35px; }
 .archive-slot { aspect-ratio: 1.42; }
 .archive-slot .slot-bottom { display: flex; }
 .case-hero { padding-top: 27px; padding-bottom: 45px; }
 .case-breadcrumb, .page-breadcrumb { margin-bottom: 55px; }
 .case-hero > .eyebrow { margin-bottom: 25px; }
 .case-hero h1 { font-size: clamp(43px, 10vw, 65px); margin-bottom: 19px; }
 .case-intro-grid { margin-top: 47px; }
 .case-intro-copy p { font-size: 16px; }
 .case-facts { grid-template-columns: 1fr; }
 .case-facts > div { grid-template-columns: 110px 1fr; }
 .case-hero-media { padding-bottom: 85px; }
 .case-cover { min-height: 340px; aspect-ratio: 1.08; }
 .case-chapter { padding-top: 32px; padding-bottom: 89px; }
 .chapter-rail { font-size: 9px; }
 .chapter-content h2, .split-intro h2, .leadership-layout h2 { font-size: clamp(36px, 9vw, 54px); margin-bottom: 29px; }
 .chapter-kicker { font-size: 14px; color: var(--accent); font-weight: 550; letter-spacing: -.015em; margin: -11px 0 31px; }
.chapter-subhead { font-size: 25px; }
 .copy-prose p { font-size: 16px; }
 .approach-wrap { margin-top: 65px; }
 .approach-grid { grid-template-columns: 1fr; }
 .approach-item { padding: 25px 0; }
 .product-story-section { padding-top: 39px; }
 .product-story { padding-top: 75px; padding-bottom: 90px; }
 .product-story-copy h2 { font-size: 69px; }
 .product-story-copy h3 { font-size: 28px; }
 .product-story-media { margin-left: 5%; padding-bottom: 50px; }
 .product-large { min-height: 310px; aspect-ratio: 1.02; }
 .product-detail { width: 54%; left: -5%; }
 .reverse-story .product-detail { right: -5%; }
 .product-detail .slot-bottom, .product-detail .slot-top { display: none; }
 .product-detail .slot-title { font-size: 10px; }
 .leadership-story { padding-top: 80px; padding-bottom: 80px; }
 .leadership-layout { padding-top: 56px; padding-bottom: 48px; }
 .leadership-media { min-height: 310px; aspect-ratio: 1.17; }
 .outcome-story { padding-top: 70px; padding-bottom: 90px; }
 .outcome-layout { padding-top: 62px; }
 .outcome-layout h2 { font-size: clamp(36px, 9vw, 54px); }
 .outcome-layout .copy-prose p { font-size: 16px; }
 .next-case { padding-top: 60px; padding-bottom: 85px; }
 .next-case > a { font-size: clamp(44px, 10vw, 68px); padding: 28px 0; }
 .next-case > a span:last-child { font-size: 40px; }
 .chapter-image-pair, .two-visuals { grid-template-columns: 1fr; gap: 14px; margin-top: 45px; }
 .chapter-side-slot { min-height: 270px; }
 .full-width-chapter { padding-top: 65px; padding-bottom: 93px; }
 .split-intro { padding-top: 60px; padding-bottom: 46px; }
 .wide-showcase { aspect-ratio: 1.05; min-height: 330px; }
 .showcase-detail { min-height: 265px; }
 .process-chapter { padding-top: 60px; padding-bottom: 83px; }
 .process-intro { padding-top: 60px; }
 .process-media-grid { grid-template-columns: 1fr; gap: 15px; }
 .process-slot { aspect-ratio: 1.31; min-height: 265px; }
 .process-slot .slot-bottom { display: flex; }
 .draft-banner { align-items: flex-start; flex-direction: column; gap: 2px; }
 .standard-hero { padding-top: 28px; padding-bottom: 80px; }
 .standard-hero h1 { font-size: clamp(53px, 11vw, 72px); }
 .intro-trailer { margin-top: 67px; padding-top: 23px; display: block; }
 .intro-trailer > p { font-size: 22px; }
 .side-note { display: block; margin-top: 25px; }
 .readable-content h2 { font-size: 42px; }
 .capabilities-section { padding-top: 85px; padding-bottom: 90px; }
 .capabilities-grid { grid-template-columns: 1fr; gap: 0; }
 .capabilities-grid article { padding: 25px 0; border-bottom: 1px solid #cbd2c9; }
 .capabilities-grid h3 { margin: 19px 0 15px; font-size: 27px; }
 .timeline-list a { grid-template-columns: 1fr auto; row-gap: 6px; }
 .timeline-list a span:nth-child(2) { grid-row: 2; grid-column: 1; }
 .timeline-list a span:last-child { grid-column: 2; grid-row: 1 / span 2; }
 .archive-gallery { grid-template-columns: 1fr; gap: 75px; padding-bottom: 110px; }
 .gallery-slot { min-height: 330px; }
 .archive-tile-foot { gap: 15px; }
 .archive-place-label { display: none; }
 .resume-content { padding-bottom: 115px; }
 .resume-column-head { display: block; }
 .resume-hero .intro-trailer { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
 .resume-content { padding-bottom: 90px; }
 .resume-profile { font-size: 19px; margin-bottom: 65px; }
 .resume-item { grid-template-columns: 1fr; gap: 21px; padding: 31px 0 39px; }
 .resume-role h3 { font-size: 32px; }
 .resume-highlights li { font-size: 15px; }
 .resume-education { grid-template-columns: 1fr; gap: 12px; }
 .resume-contact { grid-template-columns: 1fr; gap: 35px; padding-bottom: 100px; }
 .contact-content { grid-template-columns: 1fr; padding-top: 55px; padding-bottom: 110px; }
 .contact-missing { font-size: 41px; }
 .site-footer { padding-top: 75px; }
 .footer-lead { align-items: flex-start; flex-direction: column; gap: 40px; padding-bottom: 80px; }
 .footer-lead h2 { font-size: clamp(48px, 11vw, 75px); }
 .circle-link { width: 91px; height: 91px; font-size: 45px; }
 .footer-bottom { align-items: flex-start; flex-wrap: wrap; }
 .footer-bottom > div { order: 3; width: 100%; justify-content: space-between; gap: 9px; margin-top: 20px; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 *, *:before, *:after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
@media print {
 @page { margin: 18mm 19mm; }
 body { background: #fff; color: #111; }
 .site-header, .site-footer, .resume-download, .skip-link, .page-breadcrumb { display: none !important; }
 .standard-hero { padding: 0 0 28px; }
 .standard-hero h1 { font-size: 38pt; }
 .standard-hero .intro-trailer { margin-top: 30px; }
 .resume-item { break-inside: avoid; padding: 16px 0 25px; }
 .resume-role h3 { font-size: 20pt; }
 .resume-column-head { padding: 20px 0; }
 .resume-content { padding-bottom: 0; }
 .resume-skills span { padding: 7px 12px; }
 a { color: #111; }
}

/* Compact, reusable case-study gallery. Every case study uses the same layout. */
.case-hero { padding-bottom: 86px; }
.case-hero-main { display: grid; grid-template-columns: minmax(0, 1.11fr) minmax(0, .89fr); column-gap: clamp(45px, 5.3vw, 90px); align-items: center; }
.case-heading { min-width: 0; }
.case-hero .case-heading h1 { font-size: clamp(48px, 4.4vw, 72px); line-height: 1.085; letter-spacing: -.063em; margin-bottom: 24px; max-width: 830px; }
.case-heading .case-subtitle { font-size: clamp(15px, 1.18vw, 17px); line-height: 1.55; max-width: 43ch; }
.case-carousel { min-width: 0; width: 100%; }
.case-carousel-viewport { width: 100%; aspect-ratio: 1.39; background: #e5e9e4; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; }
.case-carousel-slide { height: 100%; width: 100%; }
.case-carousel-slide[hidden] { display: none !important; }
.case-carousel-image { height: 100%; border: 0; }
.case-carousel-image:after { inset: 12px; }
.case-carousel-image .slot-top { font-size: 9px; padding: 18px 20px; }
.case-carousel-image .slot-bottom { display: none; }
.case-carousel-image .slot-center { padding: 20px; }
.case-carousel-image .slot-title { font-size: 17px; }
.case-carousel-image .slot-note { font-size: 9px; }
/* Show the entire screenshot: avoid zooming/cropping real interface content. */
.case-carousel-image img { object-fit: contain; background: #f9faf8; }
.case-carousel-dots { display: flex; justify-content: center; gap: 2px; padding-top: 11px; }
.case-carousel-dot { appearance: none; border: 0; background: none; padding: 10px; width: 31px; height: 30px; cursor: pointer; display: inline-grid; place-items: center; border-radius: 50%; }
.case-carousel-dot span { display: block; width: 7px; height: 7px; background: #a8b1a9; border-radius: 50%; }
.case-carousel-dot[aria-current="true"] span { background: var(--ink); width: 8px; height: 8px; }
.case-carousel-dot:hover span { background: #566e5b; }
.case-intro-grid { margin-top: clamp(56px, 6vw, 82px); }
@media (max-width: 1050px) {
 .case-hero-main { column-gap: 37px; grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr); }
 .case-hero .case-heading h1 { font-size: clamp(43px, 4.9vw, 57px); }
}
@media (max-width: 760px) {
 .case-hero-main { grid-template-columns: 1fr; gap: 35px; }
 .case-hero .case-heading h1 { font-size: clamp(45px, 8vw, 70px); }
 .case-carousel { max-width: 650px; }
 .case-intro-grid { margin-top: 45px; }
}
@media (max-width: 600px) {
 .case-hero { padding-bottom: 62px; }
 .case-hero-main { gap: 32px; }
 .case-hero .case-heading h1 { font-size: clamp(42px, 10vw, 58px); }
 .case-carousel-viewport { aspect-ratio: 1.28; }
 .case-carousel-dots { padding-top: 7px; }
}


/* Mobilytics section: one primary interface plus three supporting previews */
.mobilytics-media { padding-bottom: 0; }
.mobilytics-gallery { display: grid; gap: 18px; }
.mobilytics-primary { aspect-ratio: 1.24; min-height: 360px; }
.mobilytics-support-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.mobilytics-support { aspect-ratio: 1.18; min-height: 132px; box-shadow: 0 16px 30px rgba(39,55,47,.08); }
.mobilytics-support img { object-fit: contain; background: #ffffff; }
.mobilytics-support .slot-top, .mobilytics-support .slot-bottom { display: none; }
.mobilytics-support .slot-center { padding: 20px; }
.mobilytics-support .slot-title { font-size: 12px; }
.mobilytics-support .slot-note { display: none; }
.mobilytics-support:after { inset: 11px; }
@media (max-width: 900px) {
  .mobilytics-support-grid { gap: 14px; }
  .mobilytics-support { min-height: 118px; }
}
@media (max-width: 680px) {
  .mobilytics-support-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .mobilytics-support { min-height: 0; }
}


/* Product gallery layout: large image with three floating support previews */
.product-gallery-media { padding-bottom: 110px; }
.product-gallery { position: relative; }
.product-primary { aspect-ratio: 1.24; min-height: 380px; }
.product-primary img {
  object-fit: contain;
  object-position: top center;
  background: #fbfbf8;
}
.product-support-grid {
  position: absolute;
  left: 5%;
  right: 5%;
  bottom: -44px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  z-index: 4;
}
.product-support {
  aspect-ratio: 1.18;
  min-height: 150px;
  box-shadow: 0 18px 34px rgba(39,55,47,.10);
  border-color: #d8ddd8;
}
.product-support img {
  object-fit: contain;
  object-position: center top;
  background: #fff;
}
.product-support .slot-top,
.product-support .slot-bottom,
.product-support .slot-mark,
.product-support .slot-note,
.product-primary .slot-mark,
.product-primary .slot-note {
  display: none;
}
.product-support .slot-title,
.product-primary .slot-title { font-size: 12px; }
.product-support .slot-center,
.product-primary .slot-center { padding: 20px; }
.product-support:after { inset: 11px; }

/* Preserve the older floating feel specifically for the Mobilytics example */
.mobilytics-media .product-support-grid { left: 4%; right: 4%; bottom: -46px; }

@media (max-width: 1180px) {
  .product-gallery-media { padding-bottom: 96px; }
  .product-support-grid { left: 3%; right: 3%; gap: 14px; }
  .product-support { min-height: 132px; }
}
@media (max-width: 900px) {
  .product-gallery-media { padding-bottom: 0; }
  .product-gallery { display: grid; gap: 16px; }
  .product-support-grid {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
  }
}
/* Keep one large lead visual and three thumbnail previews on phones,
   rather than turning all four images into equally weighted full-width cards. */
@media (max-width: 680px) {
  .product-gallery { gap: 10px; }
  .product-support-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .product-primary { min-height: 0; }
  .product-support { min-height: 0; }
  .style-guide-gallery .product-support-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* Match section support images should crop from the bottom if needed */
#match .product-primary img {
  object-fit: contain;
  object-position: top center;
}
#match .product-support img {
  object-fit: cover;
  object-position: top center;
  background: #fff;
}

/* Full-width team process collage: never crop its layered composition. */
.leadership-media.has-image { aspect-ratio: 2 / 1; min-height: 0; }
.leadership-media.has-image img { object-fit: contain; object-position: center; }

/* Simplified navigation: case studies and supporting pages have no breadcrumbs. */
.case-hero { padding-top: 85px; }
.standard-hero { padding-top: 85px; }
@media (max-width: 600px) {
  .case-hero { padding-top: 52px; }
  .standard-hero { padding-top: 56px; }
}

/* Earlier Work: original project imagery, one finished cover per project. */
.archive-cover { margin: 0; aspect-ratio: 1400 / 965; overflow: hidden; background: #e8ece7; border: 1px solid #dadfda; border-radius: 5px; }
.archive-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.archive-gallery .archive-place-label { white-space: nowrap; font-size: 9px; color: var(--muted); letter-spacing: .06em; padding-top: 5px; text-align: right; }
.archive-gallery { row-gap: 86px; }
.archive-teaser .archive-cover { width: 100%; }
@media (max-width: 650px) { .archive-gallery .archive-tile-foot { flex-wrap: wrap; } .archive-gallery .archive-place-label { margin-top: 4px; } }


/* October 2026 editorial refinements */
/* Long headline: two deliberate phrases that wrap cleanly at any viewport. */
.home-hero h1 {
  font-size: clamp(54px, 6.45vw, 97px);
  line-height: 1.045;
  letter-spacing: -.069em;
  max-width: 1380px;
  text-wrap: balance;
  margin-top: clamp(42px, 5.2vw, 78px);
  margin-bottom: clamp(48px, 5vw, 75px);
}
.home-hero h1 .hero-title-secondary {
  display: block;
  margin-top: .15em;
  white-space: normal;
}
.home-hero-bottom { grid-template-columns: minmax(190px, .65fr) minmax(0, 1.35fr); }
.hero-summary { max-width: 730px; }
.hero-summary p { font-size: clamp(17px, 1.45vw, 20px); line-height: 1.57; margin: 0 0 16px; }
.hero-summary p + p { margin-top: 14px; margin-bottom: 30px; }
/* The new Buxton heading is longer and should not crowd the copy. */
#feature-buxton { font-size: clamp(39px, 4.1vw, 65px); text-wrap: balance; }
/* Large media placeholders are consistent across Buxton, Segistics and Enviance. */
.case-hero-media .case-cover img { object-fit: contain; background: #f5f6f3; }
/* Give the final navigation the same clear meaning on all case studies. */
.next-case > a { font-size: clamp(45px, 5.35vw, 76px); }
@media (max-width: 1000px) {
  .home-hero h1 { font-size: clamp(48px, 7.7vw, 80px); }
  .home-hero-bottom { grid-template-columns: .45fr 1fr; gap: 28px; }
}
@media (max-width: 760px) {
  .home-hero h1 { font-size: clamp(41px, 8.2vw, 65px); margin-top: 55px; }
  .home-hero-bottom { grid-template-columns: 1fr; gap: 24px; }
  .hero-small-callout { order: 2; }
  .hero-summary { max-width: 100%; }
  .case-hero-media { padding-bottom: 85px; }
}
@media (max-width: 600px) {
  .home-hero h1 { font-size: clamp(39px, 9.3vw, 54px); line-height: 1.08; letter-spacing: -.063em; margin-top: 52px; }
  .hero-summary p { font-size: 17px; }
  #feature-buxton { font-size: clamp(41px, 10.3vw, 58px); }
  .next-case > a { font-size: clamp(37px, 9.5vw, 58px); }
  .footer-lead h2 { font-size: clamp(47px, 10.6vw, 70px); }
}



/* Enviance Portal follows the Buxton product composition: one primary plus three floating previews. */
.portal-product-story {
  display: grid;
  grid-template-columns: minmax(0, .79fr) minmax(0, 1.21fr);
  align-items: center;
  gap: clamp(42px, 7vw, 110px);
  padding-top: 100px;
}
.portal-story-copy { min-width: 0; }
.portal-story-copy h2 {
  font-size: clamp(40px, 4.3vw, 67px);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -.059em;
  margin: 0 0 36px;
  text-wrap: balance;
}
.portal-story-copy .copy-prose p { font-size: 16px; line-height: 1.78; }
.portal-story-media { min-width: 0; max-width: 690px; width: 100%; margin: 0; }
/* Reuses Buxton's .product-gallery, .product-primary, .product-support-grid, .product-support */
@media (max-width: 900px) {
  .portal-product-story { grid-template-columns: 1fr; gap: 45px; padding-top: 65px; }
  .portal-story-copy { max-width: 690px; }
  .portal-story-media { max-width: 750px; }
}
@media (max-width: 680px) {
  .portal-product-story { padding-top: 45px; gap: 36px; }
  .portal-story-copy h2 { font-size: clamp(36px, 9vw, 54px); margin-bottom: 27px; }
  .portal-story-media .product-primary { min-height: 0; aspect-ratio: 1.24; }
  .portal-story-media .product-support { min-height: 0; aspect-ratio: 1.4; }
}

/* Enviance: preserve the first headline phrase on one line. */
.enviance-page .case-hero-main { display: block; }
.enviance-page .case-heading h1 { max-width: none; }
.enviance-title-first, .enviance-title-second { display: block; }
.enviance-title-first { white-space: nowrap; }
/* Four small, uncropped legacy interfaces show contrasting older systems. */
.enviance-legacy-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 65px; }
.enviance-legacy-shot { margin: 0; min-width: 0; aspect-ratio: 1.65; border: 1px solid var(--line-strong); background: #fff; overflow: hidden; }
.enviance-legacy-shot img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 600px) {
  .enviance-page .case-heading h1 { font-size: clamp(25px, 7.4vw, 40px); }
  .enviance-legacy-gallery { gap: 10px; margin-top: 42px; }
}

/* Journal: a compact stream of short thoughts, not clickable cards. */
.notes-hero { padding-top: clamp(65px, 7.5vw, 105px); padding-bottom: clamp(36px, 5vw, 66px); }
.notes-hero .eyebrow { color: var(--muted); margin-bottom: 27px; }
.notes-hero h1 { max-width: 1120px; font-size: clamp(47px, 6.2vw, 89px); line-height: 1.045; letter-spacing: -.064em; font-weight: 610; margin: 0 0 30px; }
.notes-hero h1 em { font-family: var(--serif); font-weight: 400; color: var(--accent); }
.notes-lede { max-width: 780px; }
.notes-lede p { margin: 0; color: #526157; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.55; letter-spacing: -.01em; }
.notes-feed { max-width: 1450px; padding-bottom: 100px; }
.note-post { max-width: 970px; padding: 24px 0; border-top: 1px solid var(--line); }
.note-post:last-child { border-bottom: 1px solid var(--line); }
.note-post p { max-width: 910px; margin: 0; color: var(--ink); font-size: clamp(17px, 1.45vw, 20px); line-height: 1.48; letter-spacing: -.018em; }
.note-post p a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 820px) {
  .notes-hero { padding-top: 64px; padding-bottom: 42px; }
  .notes-hero h1 { font-size: clamp(44px, 8.2vw, 68px); margin-bottom: 25px; }
  .note-post { padding: 21px 0; }
}
@media (max-width: 600px) {
  .notes-hero { padding-top: 46px; padding-bottom: 34px; }
  .notes-hero .eyebrow { margin-bottom: 19px; }
  .notes-hero h1 { font-size: clamp(42px, 10.7vw, 60px); }
  .notes-feed { padding-bottom: 75px; }
  .note-post { padding: 18px 0; }
  .note-post p { font-size: 17px; line-height: 1.52; }
}


/* Enviance style-guide examples: compact top-cropped document previews. */
.enviance-style-guide {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 75px;
}
.enviance-style-guide-shot {
  margin: 0;
  min-width: 0;
  aspect-ratio: 1.42;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line-strong);
}
.enviance-style-guide-shot img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
/* Match the Buxton case study's single wide visual in Enviance section 04. */
.enviance-process-hero {
  width: 100%;
  aspect-ratio: 2.06;
  min-height: 0;
}
.enviance-process-hero.has-image img {
  object-fit: contain;
  object-position: center;
}
@media (max-width: 760px) {
  .enviance-style-guide { gap: 12px; margin-top: 44px; }
}
@media (max-width: 560px) {
  .enviance-style-guide { grid-template-columns: 1fr; }
  .enviance-style-guide-shot { aspect-ratio: 1.44; }
  .enviance-process-hero { aspect-ratio: 1.48; }
}

/* Segistics Section 01: display the two approved 4:3 compositions without cropping. */
.segistics-page .chapter-image-pair .chapter-side-slot {
  aspect-ratio: 4 / 3;
  min-height: 0;
  border-radius: 3px;
}
.segistics-page .chapter-image-pair .chapter-side-slot.has-image img {
  object-fit: contain;
  object-position: center;
}


/* Segistics section 02: mirror Buxton's text-left, gallery-right product story. */
.segistics-foundation-section { padding-top: 65px; padding-bottom: 86px; }
.segistics-foundation-layout {
  display: grid;
  grid-template-columns: minmax(0,.79fr) minmax(0,1.21fr);
  gap: clamp(50px,8vw,132px);
  align-items: center;
  padding-top: 98px;
  padding-bottom: 80px;
  min-height: 730px;
}
.segistics-foundation-copy { min-width: 0; }
.segistics-foundation-copy h2 {
  font-size: clamp(40px,4.15vw,65px);
  line-height: 1.1;
  letter-spacing: -.059em;
  font-weight: 600;
  margin: 0 0 37px;
  text-wrap: balance;
}
.segistics-foundation-copy .copy-prose p { font-size:16px; line-height:1.78; }
.segistics-foundation-media { width: 100%; min-width: 0; padding-bottom: 110px; margin: 0; }
#scalable-foundations .product-primary { aspect-ratio: 1.24; min-height: 380px; }
#scalable-foundations .product-primary img { object-fit: contain; object-position:center top; background: #fbfbf8; }
#scalable-foundations .product-support-grid { left: 4%; right: 4%; bottom: -46px; }
#scalable-foundations .product-support { aspect-ratio: 1.18; min-height: 140px; }
@media (max-width: 1180px) {
  .segistics-foundation-layout { gap: clamp(42px,5vw,74px); }
  .segistics-foundation-media { padding-bottom: 96px; }
  #scalable-foundations .product-support-grid { left: 3%; right: 3%; gap: 14px; bottom: -44px; }
  #scalable-foundations .product-support { min-height: 110px; }
}
@media (max-width: 900px) {
  .segistics-foundation-layout { grid-template-columns: 1fr; gap: 50px; padding-top: 66px; padding-bottom: 24px; min-height: 0; }
  .segistics-foundation-copy { max-width: 690px; }
  .segistics-foundation-media { max-width: 750px; padding-bottom: 0; }
  #scalable-foundations .product-primary { min-height: 280px; }
  #scalable-foundations .product-support-grid { position:static; left:auto; right:auto; bottom:auto; }
}
@media (max-width: 680px) {
  .segistics-foundation-section { padding-top: 45px; padding-bottom: 78px; }
  .segistics-foundation-layout { padding-top: 52px; gap: 35px; }
  .segistics-foundation-copy h2 { font-size: clamp(36px,9vw,54px); margin-bottom: 28px; }
  #scalable-foundations .product-primary { min-height:0; aspect-ratio: 4 / 3; }
  #scalable-foundations .product-support { min-height: 0; aspect-ratio: 1.45; }
  #scalable-foundations .product-support-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* Segistics architecture supporting visuals: non-clickable centered crops. */
#scalable-foundations .segistics-support-thumb {
  width: 100%;
  margin: 0;
  overflow: hidden;
}
#scalable-foundations .segistics-support-thumb img {
  object-fit: cover;
  background: #fff;
}
#scalable-foundations .segistics-support-thumb-one img {
  object-position: center center;
}
#scalable-foundations .segistics-support-thumb-two img {
  object-position: center 36%;
}
#scalable-foundations .segistics-support-thumb-three img {
  object-position: center 34%;
}


/* Segistics Section 03: direct image, no placeholder hydration required. */
.segistics-design-system-board {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 75px 0 0;
  padding: 0;
  background: #f2f2f0;
  border: 1px solid #d6dbd4;
  border-radius: 4px;
  overflow: hidden;
}
.segistics-design-system-board img {
  display: block;
  position: static;
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 0;
  object-fit: contain;
  visibility: visible;
  opacity: 1;
}
@media (max-width: 760px) {
  .segistics-design-system-board { margin-top: 45px; }
}

/* Segistics section 04: preserve the full offset mobile-app grid at all viewport sizes. */
.segistics-final-showcase { aspect-ratio: 2021 / 956; min-height: 0; border: 0; }
.segistics-final-showcase.has-image img { object-fit: contain; object-position: center; }


/* Rev21: show each wide homepage composition in full rather than center-cropping its interfaces. */
.feature-slot { aspect-ratio: 1.55; min-height: 390px; }
.feature-slot.has-image { background: #eceeea; }
.feature-slot.has-image img { object-fit: contain; object-position: center; }
.featured-copy { position: relative; }
.featured-company { position: absolute; left: 0; top: 56px; font-size: clamp(22px,2.35vw,31px); font-weight: 610; letter-spacing: -.047em; line-height: 1.15; margin: 0; }
/* Case-study headline and deck reverse, while keeping an editorial hierarchy. */
.case-hero-reversed h1, .case-hero-reversed .case-heading h1 { font-size: clamp(48px,5.8vw,88px); line-height: 1.095; max-width: 1290px; letter-spacing: -.068em; margin-bottom: 27px; }
.case-hero-reversed .case-subtitle, .case-hero-reversed .case-heading .case-subtitle { font-size: clamp(21px,1.9vw,27px); line-height: 1.4; letter-spacing: -.028em; font-weight: 510; color: #617166; max-width: 1100px; }
.enviance-page .case-hero-reversed .case-heading h1 { max-width: 1280px; }
.enviance-page .case-hero-reversed .case-heading .case-subtitle { max-width: 1100px; }
/* Enviance original screens are a compact, overlapping archive strip rather than showcase panels. */
.enviance-legacy-gallery { display: flex; align-items: center; justify-content: center; gap: 0; max-width: 930px; margin: 55px auto 0; padding: 16px 22px 22px; }
.enviance-legacy-gallery .enviance-legacy-shot { flex: 0 0 27%; min-width: 0; aspect-ratio: 1.44; border: 1px solid #c3cbc4; box-shadow: 0 9px 21px rgba(39,55,47,.13); background: #fff; position: relative; }
.enviance-legacy-gallery .enviance-legacy-shot + .enviance-legacy-shot { margin-left: -4%; }
.enviance-legacy-gallery .enviance-legacy-shot:nth-child(1) { transform: translateY(6px); z-index: 1; }
.enviance-legacy-gallery .enviance-legacy-shot:nth-child(2) { transform: translateY(-7px); z-index: 2; }
.enviance-legacy-gallery .enviance-legacy-shot:nth-child(3) { transform: translateY(5px); z-index: 3; }
.enviance-legacy-gallery .enviance-legacy-shot:nth-child(4) { transform: translateY(-3px); z-index: 4; }
.enviance-legacy-caption { color: #748178; font-size: 13px; line-height: 1.5; text-align: center; letter-spacing: .015em; margin: 4px 0 0; }
/* Use the same main image + three floating previews language as the Portal and Buxton layouts. */
.style-guide-gallery { width: 100%; max-width: 690px; margin: 65px 0 80px; display: grid; grid-template-columns: minmax(0,1fr); gap: 18px; padding-bottom: 82px; }
.style-guide-gallery .style-guide-cover { aspect-ratio: 1.24; min-height: 380px; border: 1px solid var(--line); }
.style-guide-gallery .style-guide-cover img { width: 100%; height: 100%; object-fit: contain; background: #f4f5f2; }
.style-guide-gallery .product-support-grid { bottom: -39px; left: 4%; right: 4%; }
.style-guide-gallery .style-guide-support { aspect-ratio: 1.18; border: 1px solid var(--line); min-height: 150px; box-shadow: 0 15px 28px rgba(39,55,47,.12); }
.style-guide-gallery .style-guide-support img { width: 100%; height: 100%; object-fit: cover; object-position: center top; background: #fff; }
/* Original site navigation and typography for the new testimonials archive. */
.testimonials-hero { padding-bottom: 76px; }
.testimonials-hero h1 { max-width: 1160px; }
.testimonials-hero .intro-trailer { margin-top: 45px; }
.testimonials-hero .intro-trailer p { max-width: 780px; }
.testimonial-list { padding-bottom: 145px; }
.testimonial-item { display: grid; grid-template-columns: minmax(110px,.24fr) minmax(0,.76fr); column-gap: 65px; padding: 62px 0 67px; border-top: 1px solid var(--line-strong); }
.testimonial-item:last-child { border-bottom: 1px solid var(--line-strong); }
.testimonial-index { font-size: 10px; font-weight: 650; letter-spacing: .12em; color: var(--muted); padding-top: 9px; }
.testimonial-body { max-width: 980px; }
.testimonial-body blockquote { margin: 0; }
.testimonial-body blockquote p { font-size: clamp(17px,1.45vw,19px); line-height: 1.68; letter-spacing: -.01em; font-weight: 400; margin: 0 0 23px; }
.testimonial-body blockquote p:last-child { margin-bottom: 0; }
.testimonial-author { display: flex; flex-wrap: wrap; gap: 7px 17px; margin: 33px 0 0; align-items: baseline; font-size: 14px; }
.testimonial-author strong { font-weight: 700; }
.testimonial-author span { color: var(--muted); }
@media (max-width: 1100px) { .feature-slot { min-height: 320px; } }
@media (max-width: 820px) {
 .featured-copy > .featured-company { grid-column: 1; grid-row: 2; position: static; font-size: 23px; margin: -14px 0 3px; }
 .featured-copy > div { grid-column: 2; grid-row: 1 / span 3; }
 .featured-copy > .arrow-link { grid-column: 2; grid-row: 4; }
 .feature-slot { min-height: 0; aspect-ratio: 1.72; }
 .testimonial-item { grid-template-columns: 100px minmax(0,1fr); gap: 26px; }
}
@media (max-width: 600px) {
 .feature-slot { aspect-ratio: 1.65; min-height: 0; }
 .featured-copy > .featured-company { grid-column: 1; grid-row: auto; margin: -19px 0 0; }
 .featured-copy > div, .featured-copy > .arrow-link { grid-column: 1; grid-row: auto; }
 .case-hero-reversed h1, .case-hero-reversed .case-heading h1, .enviance-page .case-hero-reversed .case-heading h1 { font-size: clamp(40px,9vw,57px); }
 .case-hero-reversed .case-subtitle, .case-hero-reversed .case-heading .case-subtitle { font-size: 20px; }
 .enviance-legacy-gallery { padding: 8px 9px 19px; margin-top: 34px; }
 .enviance-legacy-gallery .enviance-legacy-shot { flex-basis: 30%; aspect-ratio: 1.2; }
 .enviance-legacy-gallery .enviance-legacy-shot + .enviance-legacy-shot { margin-left: -7%; }
 .enviance-legacy-caption { font-size: 12px; }
 .style-guide-gallery { padding-bottom: 0; margin-top: 40px; margin-bottom: 54px; }
 .style-guide-gallery .style-guide-cover { min-height: 0; aspect-ratio: 1.24; }
 .style-guide-gallery .product-support-grid { position: static; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
 .style-guide-gallery .style-guide-support { min-height: 0; aspect-ratio: 1.4; }
 .testimonial-item { display: block; padding: 35px 0 44px; }
 .testimonial-index { margin-bottom: 21px; }
 .testimonial-body blockquote p { font-size: 17px; line-height: 1.67; }
 .testimonials-hero { padding-bottom: 50px; }
 .testimonial-list { padding-bottom: 85px; }
}

/* Keep the new company label separate from the project category on desktop. */
@media (min-width: 821px) {
 .featured-company { top: 40px; }
 .featured-copy > div { padding-top: 51px; }
}

/* Keep the Earlier Work heading on one natural line at desktop widths,
   matching the Testimonials page's single-line headline treatment. */
@media (min-width: 821px) {
  .archive-hero h1 { font-size: clamp(58px, 6.2vw, 94px); white-space: nowrap; }
}


/* Homepage: process-led introduction with the supplied flowchart. */
.home-hero { padding-top: clamp(39px, 3.5vw, 56px); padding-bottom: clamp(48px, 5vw, 79px); }
.home-hero-layout { display: grid; grid-template-columns: minmax(0, 1.52fr) minmax(0, .88fr); column-gap: clamp(30px, 4.3vw, 70px); align-items: stretch; margin-top: clamp(41px, 4.9vw, 73px); }
.home-hero-copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.home-hero .home-hero-copy h1 { margin: 0 0 clamp(30px, 3.3vw, 49px); font-size: clamp(55px, 5.85vw, 91px); line-height: 1.04; letter-spacing: -.074em; max-width: 920px; font-weight: 650; text-wrap: balance; }
.home-hero .home-hero-copy h1 .hero-title-secondary { display: block; margin-top: .23em; white-space: nowrap; }
.home-hero .hero-summary { max-width: 690px; }
.home-hero .hero-summary p { font-size: clamp(16px, 1.33vw, 20px); line-height: 1.48; margin-bottom: 14px; letter-spacing: -.025em; }
.home-hero .hero-summary p + p { margin-top: 13px; margin-bottom: 0; }
.home-hero .hero-small-callout { margin-top: auto; padding-top: clamp(25px, 3.1vw, 45px); }
.home-hero-visual { min-width: 0; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; }
.home-process-image { display: block; width: 100%; max-width: 530px; height: auto; object-fit: contain; }
.home-hero-visual > .text-link { margin-top: 17px; margin-bottom: 2px; white-space: nowrap; }
@media (max-width: 1100px) {
  .home-hero-layout { grid-template-columns: minmax(0, 1.5fr) minmax(0, .95fr); column-gap: 28px; }
  .home-hero .home-hero-copy h1 { font-size: clamp(49px, 5.8vw, 69px); }
  .home-hero .hero-summary p { font-size: 16px; }
}
@media (max-width: 760px) {
  .home-hero { padding-top: 36px; padding-bottom: 48px; }
  .home-hero-layout { grid-template-columns: 1fr; row-gap: 25px; margin-top: 45px; }
  .home-hero .home-hero-copy h1 { font-size: clamp(41px, 8.15vw, 62px); margin: 0 0 27px; }
  .home-hero .home-hero-copy h1 .hero-title-secondary { white-space: normal; margin-top: .17em; }
  .home-hero .hero-summary { max-width: 100%; }
  .home-hero .hero-summary p { font-size: 17px; line-height: 1.5; }
  .home-hero .hero-small-callout { padding-top: 27px; }
  .home-hero-visual { align-items: stretch; gap: 8px; }
  .home-process-image { width: min(100%, 530px); margin: 0 auto; }
  .home-hero-visual > .text-link { align-self: flex-end; margin-top: 8px; }
}
@media (max-width: 410px) {
  .home-hero-layout { margin-top: 37px; }
  .home-hero .home-hero-copy h1 { font-size: clamp(38px, 10.2vw, 43px); }
  .home-hero .hero-summary p { font-size: 16px; }
}

/* Keep a deliberate, tighter transition from Segistics to Earlier Work. */
.featured-work { padding-bottom: 0; }
.featured-work > .featured-project:last-child { padding-bottom: clamp(40px, 4.5vw, 65px); }
.older-preview { padding-top: clamp(46px, 5vw, 70px); }

/* Keep the header identity and mobile menu comfortably separated on narrow phones. */
@media (max-width: 410px) {
 .wordmark { gap: 8px; }
 .wordmark-photo { width: 42px; height: 42px; }
 .wordmark-name { font-size: 17px; }
 .wordmark-sub { font-size: 7px; }
 .header-inner { gap: 12px; }
}


/* Rev37: prominent, accessible header contact CTA. */
.primary-nav a.nav-contact {
  align-self: center; height: auto; display: inline-flex; align-items: center; justify-content: center; gap: 11px;
  padding: 12px 19px; border-radius: 999px; background: var(--forest); color: #fff;
  font-weight: 700; letter-spacing: .01em; white-space: nowrap;
  transition: background .18s ease, transform .18s ease;
}
.primary-nav a.nav-contact:hover { background: var(--forest-light); color: #fff; transform: translateY(-1px); }
.primary-nav a.nav-contact:after { content: none; }
.primary-nav a.nav-contact span { font-size: 17px; line-height: .7; font-weight: 400; }
@media (min-width: 821px) and (max-width: 1090px) {
  .primary-nav { gap: clamp(11px, 1.5vw, 20px); }
  .primary-nav a { font-size: 12px; }
  .primary-nav a.nav-contact { padding: 11px 15px; }
}
@media (max-width: 820px) {
  .primary-nav a.nav-contact { align-self: stretch; margin-top: 26px; padding: 17px 22px;
    min-height: 58px; font-size: 21px; letter-spacing: -.02em; border: 0; border-radius: 14px;
  }
}