/* GLOBAL SITE CSS: keep tokens, foundations, utilities, and reusable components unscoped for future shared-stylesheet extraction. */
    /* GLOBAL DESIGN TOKENS */
    :root {
      --ink: #17231d; --forest: #1d3a2a; --deep: #101c17; --deeper:#0d1612;
      --green: #92b84b; --lime: #cbe584; --paper: #f5f5ef;
      --white: #fff; --line: #cbd2c5; --muted: #526157;
      --quiet: #b7c8b3; --max: 1336px;
    }
    /* GLOBAL FOUNDATION: reset, typography, links, focus, and layout utility */
    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body { margin: 0; color: var(--ink); background: var(--paper); font: 400 17px/1.55 "IBM Plex Sans", "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
    a { color: inherit; text-decoration: none; }
    a:focus-visible, summary:focus-visible { outline: 3px solid var(--lime); outline-offset: 5px; }
    .skip { position: absolute; top: -100px; left: 20px; z-index: 30; padding: 10px 16px; background: var(--lime); color: var(--deep); }
    .skip:focus { top: 12px; }
    .wrap { width: min(calc(100% - 96px), var(--max)); margin-inline: auto; }
    /* GLOBAL COMPONENTS: shared site header, navigation, sections, rows, CTA, and footer */
    .site-header { background: var(--deeper); color: var(--white); border-bottom: 1px solid #49624e; }
    .header-inner { display: flex; align-items: center; min-height: 104px; gap: 36px; }
    .brand { display: block; flex: 0 0 auto; line-height: 0; }
    .brand img { width: clamp(264px, 28.8vw, 360px); height: auto; }
    .desktop-nav { display: flex; align-items: center; gap: clamp(16px, 2.3vw, 36px); margin-left: auto; font-size: 14px; font-weight: 600; }
    .desktop-nav a { color: #d3dfd0; transition: color .2s; }
    .desktop-nav a:hover { color: var(--lime); }
    .nav-contact { padding: 12px 17px; border: 1px solid #829c79; color: var(--white) !important; }
    .nav-contact:hover { background: var(--lime); border-color: var(--lime); color: var(--deep) !important; }
    /* GLOBAL NAV DROPDOWN: native details/summary keeps the menu keyboard-operable. */
    .site-nav__dropdown { position: relative; }
    .site-nav__dropdown summary { display: flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; list-style: none; color: #d3dfd0; font-weight: 600; white-space: nowrap; }
    .site-nav__dropdown summary::-webkit-details-marker { display: none; }
    .site-nav__dropdown summary::after { content: "⌄"; font-size: 16px; line-height: 1; }
    .site-nav__dropdown[open] summary::after { content: "⌃"; }
    .site-nav__dropdown summary:hover { color: var(--lime); }
    .site-nav__menu { position: absolute; z-index: 10; top: calc(100% + 8px); left: 0; min-width: 184px; padding: 8px; background: #252D2A; border: 1px solid #617b62; box-shadow: none; }
    .site-nav__menu a { display: block; min-height: 44px; padding: 11px 13px; color: #d3dfd0; font-weight: 600; line-height: 1.3; transition: color .2s, background .2s; }
    .site-nav__menu a:hover { color: var(--lime); background: #314f39; }
    .site-nav__menu a[aria-current="page"], .desktop-nav > a[aria-current="page"]:not(.nav-contact), .phone-nav__links > a[aria-current="page"] { color: var(--lime); }
    .phone-nav { display: none; }
    .phone-nav__links a, .phone-nav__dropdown-toggle { font-weight: 600; transition: color .2s, background .2s; }
    .phone-nav__links a:hover, .phone-nav__dropdown-toggle:hover { color: var(--lime); background: #314f39; }
    .phone-nav__dropdown .site-nav__menu[hidden] { display: none !important; }
    .phone-nav__dropdown-toggle { -webkit-appearance: none; appearance: none; display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; text-align: left; font: inherit; font-weight: 600; color: var(--white); background: transparent; background-image: none; }
    .phone-nav__chevron { display: inline-block; font-size: 16px; line-height: 1; }
    .phone-nav__dropdown-toggle[aria-expanded="true"] .phone-nav__chevron { transform: rotate(180deg); }
    .phone-nav__dropdown-toggle:focus-visible { outline: 3px solid var(--lime); outline-offset: 5px; }
    .eyebrow { margin: 0 0 22px; font-size: 12px; line-height: 1.4; letter-spacing: .17em; text-transform: uppercase; font-weight: 700; color: #537636; }
    .on-dark .eyebrow { color: var(--lime); }
    h1, h2, h3, p { margin-top: 0; }
    h1, h2, h3 { font-weight: 600; }
    h1 { font-size: clamp(52px, 6.3vw, 94px); letter-spacing: -.057em; line-height: 1.015; }
    /* Interior-page hero titles share one scale; the homepage keeps its larger hero scale. */
    .interior-title { font-size: clamp(48px, 5.5vw, 78px); }
    h2 { font-size: clamp(42px, 4.4vw, 66px); letter-spacing: -.052em; line-height: 1.08; }
    h3 { font-size: clamp(24px, 2.1vw, 31px); letter-spacing: -.035em; line-height: 1.17; }
    .accent { color: #537636; }
    .on-dark .accent { color: var(--lime); }
    .hero { position: relative; overflow: hidden; background: var(--deep); color: var(--white); }
    .hero::after { content: ""; position: absolute; width: min(52vw, 750px); aspect-ratio: 416 / 472; right: -13%; top: -5%; background: url("../images/logo-shape.png") center / contain no-repeat; opacity: .105; transform: rotate(-15deg); pointer-events: none; }
    .hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.37fr) minmax(245px, .63fr); gap: 5%; align-items: end; min-height: 650px; padding-block: clamp(78px, 9vw, 132px) 68px; }
    .hero-main { max-width: 920px; }
    .hero h1 { margin-bottom: 33px; }
    .hero .intro { max-width: 680px; color: #d7e1d6; font-size: clamp(19px, 1.75vw, 24px); line-height: 1.43; letter-spacing: -.012em; }
    .actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px; margin-top: 38px; }
    .button { display: inline-flex; align-items: center; justify-content: space-between; gap: 35px; min-height: 55px; padding: 13px 19px; background: var(--lime); color: var(--deep); font-weight: 700; font-size: 15px; line-height: 1.2; transition: background .2s, transform .2s; }
    .button:hover { background: #e0f3a9; transform: translateY(-2px); }
    .arrow { font-size: 23px; font-weight: 400; line-height: 1; }
    /* Outlines from the actual fallback glyphs: DejaVu Sans diagonals, IBM Plex Sans up. */
    .icon-arrow { display: inline-block; flex: none; width: .838em; height: 1em; vertical-align: baseline; }
    .icon-arrow--up { width: .82em; transform: translateY(-1px); }
    .work-row a .icon-arrow, .about-link a .icon-arrow, .next-links a .icon-arrow, .pf-related-links a .icon-arrow { transform: translateY(-.12em); }
    /* Reuse the northeast SVG outline as a right-pointing arrow; its head and stroke weight are unchanged. */
    .icon-arrow--east { transform: rotate(45deg); }
    .work-row a .icon-arrow--east, .about-link a .icon-arrow--east, .next-links a .icon-arrow--east, .pf-related-links a .icon-arrow--east { transform: translateY(-.12em) rotate(45deg); }
    .text-link { display: inline-flex; align-items: center; gap: 9px; border-bottom: 1px solid currentColor; padding-block: 7px 5px; font-size: 15px; font-weight: 600; line-height: 1.3; }
    .text-link:hover { color: var(--lime); }
    .hero .text-link { color: #e3ebdf; }
    .hero .text-link:hover { color: var(--lime); }
    .hero-note { justify-self: end; width: min(100%, 294px); border-top: 3px solid var(--lime); padding-top: 22px; color: #d1ddcf; font-size: 16px; line-height: 1.46; }
    .hero-note strong { display: block; color: var(--white); margin-bottom: 8px; font-size: 18px; }
    .hero-rail { border-top: 1px solid #425947; }
    .rail-inner { display: flex; gap: 18px; justify-content: space-between; padding-block: 18px 21px; color: #bdcdb9; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
    .rail-inner span:last-child { color: var(--lime); }
    section.content { padding-block: clamp(88px, 10vw, 145px); }
    body.home-page section.content { padding-block: 90px; }
    .problem { background: var(--paper); }
    .problem-grid { display: grid; grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr); gap: 11%; }
    .problem h2 { max-width: 550px; margin-bottom: 26px; }
    .section-lead { max-width: 580px; font-size: clamp(19px, 1.8vw, 24px); line-height: 1.42; color: var(--muted); }
    .problem-list { margin: 20px 0 0; padding: 0; list-style: none; border-top: 3px solid var(--forest); }
    .problem-list li { display: grid; grid-template-columns: 42px 1fr; gap: 18px; padding: 27px 0 29px; border-bottom: 1px solid var(--line); }
    .index { color: #537636; font-size: 13px; font-weight: 700; letter-spacing: .13em; }
    .problem-list strong { display: block; margin-bottom: 5px; font-size: 20px; line-height: 1.22; }
    .problem-list p { margin-bottom: 0; color: var(--muted); font-size: 16px; }
    .work { background: var(--white); }
    .section-head { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .68fr); align-items: end; gap: 9%; margin-bottom: 60px; }
    .section-head h2 { max-width: 820px; margin-bottom: 0; }
    .section-head p:last-child { margin: 0 0 7px; color: var(--muted); font-size: 18px; line-height: 1.45; }
    .work-list { border-top: 3px solid var(--forest); }
    .work-row { display: grid; grid-template-columns: 55px minmax(230px, .66fr) minmax(0, 1fr) 45px; gap: 30px; align-items: start; padding: 32px 0 34px; border-bottom: 1px solid var(--line); }
    .work-row h3 { margin: 0; }
    .work-row p { margin: 1px 0 0; max-width: 600px; color: var(--muted); font-size: 17px; }
    .work-row > a { align-self: center; justify-self: end; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); font-size: 24px; line-height: 1; transition: background .2s, border-color .2s, color .2s; }
    #work .work-row h3 .work-row__title { color: inherit; text-decoration: none; transition: color .2s; }
    #work .work-row h3 .work-row__title:hover,
    #work .work-row h3 .work-row__title:focus-visible { color: #537636; }
    #work .work-row:has(.work-row__title:hover) > a,
    #work .work-row:has(.work-row__title:focus-visible) > a,
    #work .work-row > a:hover,
    #work .work-row > a:focus-visible { background: var(--lime); border-color: var(--lime); color: var(--deep); }
    #work .work-row h3 .work-row__title:focus-visible,
    #work .work-row > a:focus-visible { outline: 3px solid #537636; outline-offset: 4px; }
    .system { background: var(--forest); color: var(--white); }
    .system-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10%; }
    .system h2 { max-width: 600px; }
    .system .section-lead { color: #d8e3d5; }
    .system-lines { border-top: 3px solid var(--lime); }
    .system-line { display: grid; grid-template-columns: minmax(130px, .67fr) 1fr; gap: 25px; padding: 24px 0; border-bottom: 1px solid #617b62; }
    .system-line strong { font-size: 17px; }
    .system-line span { color: #d2ded0; font-size: 16px; line-height: 1.42; }
    .approach { background: var(--paper); }
    .approach h2 { max-width: 960px; margin-bottom: 22px; }
    .approach .section-lead { max-width: 760px; margin-bottom: 55px; }
    .steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 3px solid var(--forest); }
    .step { display: flex; flex-direction: column; padding: 25px 25px 10px 0; min-width: 0; }
    .step + .step { border-left: 1px solid var(--line); padding-left: 25px; }
    .step .index { display: block; margin-bottom: 30px; }
    .approach .step .index { text-transform: uppercase; }
    .step h3 { min-height: 2.34em; margin-bottom: 15px; }
    .step p { color: var(--muted); font-size: 16px; }
    .step-output { margin-top: auto; min-height: 88px; padding-top: 22px; border-top: 1px solid var(--line); color: var(--ink); font-size: 14px; line-height: 1.4; }
    .step-output strong { display: block; margin-bottom: 6px; color: var(--forest); }
    .approach-foot { margin: 32px 0 0; border-top: 1px solid var(--line); padding-top: 21px; color: var(--muted); font-size: 15px; }
    .handoff { background: var(--white); }
    .handoff-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 12%; align-items: start; }
    .handoff h2 { margin-bottom: 23px; }
    .handoff-list { margin: 20px 0 0; padding: 0; list-style: none; border-top: 3px solid var(--forest); }
    .handoff-list li { display: grid; grid-template-columns: .838em minmax(0, 1fr); column-gap: 16px; align-items: start; padding: 19px 0; border-bottom: 1px solid var(--line); font-size: 18px; line-height: 1.35; }
    .handoff-list li > .icon-arrow { margin-right: 0; color: #537636; }
    .handoff-note { margin: 22px 0 0; color: var(--muted); font-size: 14px; }
    .contact { background: var(--deep); color: var(--white); }
    .contact-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); gap: 10%; align-items: end; }
    .contact h2 { max-width: 860px; margin-bottom: 26px; }
    .contact .section-lead { color: #d6e1d4; margin-bottom: 0; }
    .contact-side { border-top: 3px solid var(--lime); padding-top: 21px; }
    .contact-side p { color: #d6e1d4; margin-bottom: 24px; }
    .contact-side .button { width: 100%; }
    .site-footer { background: var(--deeper); border-top: 1px solid #425947; color: #bacab6; }
    .footer-copyright { color: #aebfab; font-size: 12px; }
    .footer-copyright-inner { padding-block: 0 12px; text-align: center; }
    .footer-copyright-inner p { margin: 0; }
    .footer-inner { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(0, 1.65fr); gap: clamp(26px, 4vw, 58px); align-items: start; padding-block: 31px 34px; font-size: 13px; }
    .footer-identity p { margin: 10px 0 0; color: #aebfab; }
    .footer-identity img { display: block; width: 240px; height: auto; }
    .footer-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 42px); align-items: start; justify-self: end; width: min(100%, 600px); }
    .footer-group { border-top: 2px solid #526c53; padding-top: 9px; }
    .footer-tagline { margin: 0 0 6px; color: var(--lime); font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
    .footer-group-label { margin: 0 0 6px; color: var(--lime); font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
    .footer-group-list { display: grid; grid-template-columns: 1fr; }
    .footer-group-list a { display: flex; align-items: center; width: fit-content; min-height: 28px; font-size: 13px; line-height: 1.25; }
    .footer-group-list a:hover, .footer-group-list a[aria-current="page"] { color: var(--lime); }
    .footer-group-list a:hover { text-decoration: underline; text-underline-offset: 3px; }
    @media (max-width: 1100px) {
      .footer-inner { grid-template-columns: 1fr; gap: 22px; }
    }
    /* NAVIGATION: collapse before labels start wrapping at tablet widths. */
    @media (max-width: 1000px) {
      .desktop-nav { display: none; }
      .phone-nav { display: block; margin-left: auto; position: relative; }
      .phone-nav > summary { display: flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0; cursor: pointer; list-style: none; }
      .phone-nav > summary::-webkit-details-marker { display: none; }
      .phone-nav > summary::after { content: "☰"; font-size: 28.08px; line-height: 1; }
      .phone-nav[open] > summary::after { content: "×"; font-size: 40.32px; }
      .phone-nav__links { position: absolute; z-index: 5; right: 0; top: calc(100% + 15px); width: min(275px, 85vw); background: #252D2A; border: 1px solid #617b62; box-shadow: none; padding: 10px; }
      .phone-nav__links a { display: block; padding: 11px; min-height: 44px; }
      .phone-nav__dropdown-toggle { padding: 11px; color: var(--white); }
      .phone-nav__dropdown .site-nav__menu { position: static; min-width: 0; padding: 0 0 8px 12px; background: transparent; border: 0; box-shadow: none; }
      .phone-nav__dropdown .site-nav__menu a { padding: 11px; border: 0; }
    }
    /* Four stages become two columns before their copy gets cramped. */
    @media (max-width: 1100px) {
      .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .step:nth-child(3) { border-left: 0; padding-left: 0; }
      .step:nth-child(n+3) { border-top: 1px solid var(--line); padding-top: 25px; }
    }
    /* DESKTOP is the baseline above. TABLET rules apply at 900px and below; PHONE rules refine at 700px and below. */
    /* TABLET VIEW: compact navigation and layouts; phone inherits these where useful. */
    @media (max-width: 900px) {
      .wrap { width: min(calc(100% - 52px), var(--max)); }
      .header-inner { min-height: 82px; }
      .brand img { width: 331.2px; }
      .tablet-nav { gap: 14px; font-size: 13px; }
      .hero-inner { grid-template-columns: 1fr; min-height: auto; gap: 45px; }
      .hero-note { justify-self: start; width: 100%; max-width: 600px; }
      .problem-grid, .system-grid, .handoff-grid { gap: 7%; }
      .work-row { grid-template-columns: 40px minmax(170px, .7fr) 1fr 44px; gap: 15px; }
      .step { padding-right: 20px; }
      .step + .step { padding-left: 20px; }
    }
    /* Give the longer fit paragraph its own line at tablet widths. */
    @media (min-width: 701px) and (max-width: 900px) {
      .work .section-head { grid-template-columns: 1fr; align-items: start; gap: 26px; }
      .work .section-head > p { max-width: 700px; margin-bottom: 0; }
      .work .work-row { column-gap: 28px; }
    }
    /* PHONE VIEW: <=700px; rules here override the shared/global and tablet styles above. */
    @media (max-width: 700px) {
      .wrap { width: min(calc(100% - 36px), var(--max)); }
      .header-inner { min-height: 74px; gap: 10px; }
      .desktop-nav { display: none; }
      .phone-nav { display: block; margin-left: auto; position: relative; }
      .phone-nav > summary { display: flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0; cursor: pointer; list-style: none; }
      .phone-nav > summary::-webkit-details-marker { display: none; }
      .phone-nav > summary::after { content: "☰"; font-size: 28.08px; line-height: 1; }
      .phone-nav[open] > summary::after { content: "×"; font-size: 40.32px; }
      .phone-nav__links { position: absolute; z-index: 5; right: 0; top: calc(100% + 15px); width: min(275px, 85vw); background: #252D2A; border: 1px solid #617b62; box-shadow: none; padding: 10px; }
      .phone-nav__links a { display: block; padding: 11px; min-height: 44px; }
      .phone-nav__dropdown-toggle { padding: 11px; color: var(--white); }
      .phone-nav__dropdown .site-nav__menu { position: static; min-width: 0; padding: 0 0 8px 12px; background: transparent; border: 0; box-shadow: none; }
      .phone-nav__dropdown .site-nav__menu a { padding: 11px; border: 0; }
      h1 { font-size: clamp(43px, 11vw, 64px); }
      .interior-title { font-size: clamp(43px, 11vw, 62px); }
      h2 { font-size: clamp(37px, 9vw, 52px); }
      section.content { padding-block: 74px; }
      body.home-page section.content { padding-block: 74px; }
      .hero-inner { padding-block: 75px 52px; gap: 48px; }
      .hero::after { width: 75vw; right: -32%; top: 12%; opacity: .075; }
      .hero h1 { margin-bottom: 23px; }
      .hero .intro { font-size: 18px; }
      .rail-inner { display: block; line-height: 1.7; }
      .rail-inner span { display: block; }
      .problem-grid, .section-head, .system-grid, .handoff-grid, .contact-grid { grid-template-columns: 1fr; gap: 35px; }
      .problem-list { margin-top: 0; }
      .section-head { margin-bottom: 38px; }
      .work-row { grid-template-columns: 34px 1fr 44px; gap: 10px 15px; padding-block: 24px; }
      .work-row h3 { font-size: 24px; }
      .work-row p { grid-column: 2 / 3; font-size: 16px; }
      .work-row > a { grid-column: 3; grid-row: 1 / 3; }
      .system-line { grid-template-columns: 1fr; gap: 3px; }
      .approach .section-lead { margin-bottom: 36px; }
      .steps { grid-template-columns: 1fr; }
      .step, .step + .step, .step:nth-child(n+3) { min-height: 0; padding: 23px 0 18px; border-left: 0; border-top: 0; border-bottom: 1px solid var(--line); }
      .step .index { margin-bottom: 20px; }
      .step h3 { min-height: 0; }
      .step-output { min-height: 0; }
      .footer-inner { grid-template-columns: 1fr; gap: 16px; padding-block: 24px 25px; }
      .footer-links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
      .footer-group-list { grid-template-columns: 1fr; }
      .footer-group-list a { min-height: 44px; }
    }
    /* INTERMEDIATE LOGO SIZE: 361px through 899px. */
    @media (min-width: 361px) and (max-width: 899px) {
      .brand img { width: min(331.2px, calc(100vw - 90px)); }
    }
    /* EXTRA-NARROW PHONE: preserve the 44px menu target while keeping the larger logo in bounds. */
    @media (max-width: 360px) {
      .wrap { width: min(calc(100% - 16px), var(--max)); }
      .header-inner { gap: 8px; }
      .brand img { width: min(257px, calc(100vw - 84px)); }
      .phone-nav > summary { width: 44px; }
      
    }
    @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .button, .desktop-nav a, .site-nav__menu a, .phone-nav__links a, .phone-nav__dropdown-toggle, .work-row a { transition: none; } }

.desktop-nav > a[aria-current="page"] { border-bottom: 2px solid var(--lime); padding-bottom: 5px; }
/* Shared breadcrumb treatment; page styles set their own top spacing. */
.about-breadcrumb, .contact-breadcrumb, .pf-breadcrumb { position: relative; z-index: 1; color: var(--muted); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.about-breadcrumb a, .contact-breadcrumb a, .pf-breadcrumb a { text-decoration: underline; text-underline-offset: 3px; }
.about-breadcrumb span, .contact-breadcrumb span, .pf-breadcrumb span { margin: 0 10px; color: #879487; }

/* SHARED TECHNICAL-DEPTH PAGE FAMILY */
/* Header, navigation, and footer styling comes from the global shared rules. */
body.technical-page .breadcrumb, .pf-hero .pf-breadcrumb {padding:24px 0 18px;border-bottom:1px solid var(--line);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
body.technical-page .breadcrumb a {text-decoration:underline;text-underline-offset:3px}
body.technical-page .breadcrumb span {margin:0 10px;color:#839385}
body.technical-page .eyebrow {margin:0 0 18px;font-size:12px;font-weight:700;letter-spacing:.17em;line-height:1.4;text-transform:uppercase;color:#537636}
body.technical-page h1 {letter-spacing:-.055em;line-height:1.04}
body.technical-page h2 {font-size:clamp(38px,4.1vw,62px);letter-spacing:-.05em;line-height:1.09}
body.technical-page h3 {font-size:clamp(23px,2vw,29px);letter-spacing:-.03em;line-height:1.18}
body.technical-page .lead {font-size:clamp(20px,1.9vw,26px);letter-spacing:-.015em;line-height:1.4}
body.technical-page .page-hero {position:relative;overflow:hidden;background:var(--paper)}
body.technical-page .page-hero .breadcrumb {position:relative;z-index:1}
body.technical-page .page-hero::after {content:"";position:absolute;right:-8%;top:12%;width:min(38vw,540px);aspect-ratio:416/472;background:url("../images/logo-shape.png") center/contain no-repeat;opacity:.07;transform:rotate(-15deg);pointer-events:none}
body.technical-page .hero-grid {position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);gap:8%;align-items:center;padding-block:clamp(70px,7vw,104px) clamp(85px,8vw,120px)}
body.technical-page .hero-copy {max-width:800px}
/* Hero accents and decision panels are shared with Prototypes & Feasibility. */
body.technical-page .hero-copy::before, .pf-hero-copy::before {content:"";display:block;width:58px;height:4px;margin-bottom:32px;background:var(--green)}
body.technical-page .hero-copy h1, .pf-hero-copy h1 {margin-bottom:28px;text-wrap:balance}
.hero-title-emphasis {color:#537636}
body.technical-page .hero-copy .lead {max-width:690px;margin:0;color:var(--muted)}
.hero-explore {display:inline-flex;align-items:center;gap:20px;min-height:44px;margin-top:33px;border-bottom:2px solid var(--forest);font-size:15px;font-weight:700;line-height:1.25}
.hero-explore:hover {color:#537636;border-color:#537636}
.hero-explore span {font-size:23px;line-height:1;font-weight:400}
body.technical-page .hero-aside, .pf-question {align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-width:0;padding:clamp(26px,3.3vw,48px);border:1px solid var(--line);border-top:4px solid var(--forest);background:var(--white)}
body.technical-page .hero-aside .small-title, .pf-question .small-title {display:block;margin-bottom:22px;font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#537636}
body.technical-page .hero-aside p, .pf-question p {margin-bottom:32px;font-size:clamp(18px,1.48vw,21px);font-weight:500;line-height:1.43}
body.technical-page .hero-aside ul, .pf-question ul {display:grid;counter-reset:focus;list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
body.technical-page .hero-aside li, .pf-question li {display:flex;gap:13px;counter-increment:focus;border-bottom:1px solid var(--line);padding:10px 0;font-size:14px;font-weight:600;line-height:1.3}
body.technical-page .hero-aside li::before, .pf-question li::before {content:counter(focus, decimal-leading-zero);color:#537636;font-size:11px;font-weight:700;letter-spacing:.06em;line-height:1.6}
body.technical-page .section-index, .pf-rail {background:var(--forest);color:#e3eddf;border-block:1px solid #547056}
body.technical-page .section-index .wrap, .pf-rail .wrap {display:flex;justify-content:space-between;gap:20px;padding-block:17px;font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
body.technical-page .section-index span:last-child, .pf-rail span:last-child {color:var(--lime)}
body.technical-page .content {padding-block:clamp(82px,9vw,130px)}
body.technical-page .technical {background:var(--white)}
body.technical-page .technical .heading {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.75fr);gap:10%;align-items:end;margin-bottom:54px}
body.technical-page .technical .heading--single {grid-template-columns:1fr}
body.technical-page .heading h2 {max-width:780px;margin-bottom:0}
body.technical-page .technical .heading .mechanical-section-title {max-width:none}
body.technical-page .heading p:last-child {margin:0 0 5px;color:var(--muted);font-size:18px;line-height:1.45}
body.technical-page .table {border-top:3px solid var(--forest)}
body.technical-page .table-head, body.technical-page .table-row {display:grid;grid-template-columns:minmax(190px,.8fr) minmax(0,1.2fr) minmax(0,.9fr);gap:5%}
body.technical-page .table-head {padding:14px 0;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#537636}
body.technical-page .table-row {padding:28px 0 31px;border-bottom:1px solid var(--line)}
body.technical-page .table-row h3 {margin:0;max-width:280px}
body.technical-page .table-row p {margin:1px 0 0;color:var(--muted);font-size:16px;line-height:1.48}
body.technical-page .table-row p:last-child {color:var(--ink)}
body.technical-page .interface {background:var(--forest);color:var(--white)}
body.technical-page .interface-grid {display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:11%}
body.technical-page .interface .eyebrow {color:var(--lime)}
body.technical-page .interface h2 {max-width:680px}
body.technical-page .interface .lead {color:#d8e3d5;max-width:650px;margin-bottom:0}
body.technical-page .interface-list {border-top:3px solid var(--lime)}
body.technical-page .interface-list div {display:grid;grid-template-columns:minmax(120px,.72fr) 1fr;gap:22px;padding:25px 0;border-bottom:1px solid #617b62}
body.technical-page .interface-list strong {font-size:17px}
body.technical-page .interface-list span {color:#d6e2d3;font-size:16px;line-height:1.42}
body.technical-page .brief {background:var(--paper)}
body.technical-page .brief h2 {max-width:850px;margin-bottom:50px}
body.technical-page .brief-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:3px solid var(--forest)}
body.technical-page .brief-cell {padding:25px 33px 0 0}
body.technical-page .brief-cell+.brief-cell {border-left:1px solid var(--line);padding-left:33px}
body.technical-page .brief-cell .num {display:block;margin-bottom:36px;color:#537636;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
body.technical-page .brief-cell h3 {margin-bottom:15px}
body.technical-page .brief-cell p {color:var(--muted);font-size:16px}
body.technical-page .brief-foot {margin:32px 0 0;color:var(--muted);font-size:14px;border-top:1px solid var(--line);padding-top:18px}
body.technical-page .contact {background:var(--deep);color:var(--white)}
body.technical-page .contact-grid {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.7fr);align-items:end;gap:12%}
body.technical-page .contact .eyebrow {color:var(--lime)}
body.technical-page .contact h2 {max-width:720px;margin-bottom:23px}
body.technical-page .contact .lead {max-width:740px;margin:0;color:#d5e0d2}
body.technical-page .contact-side {border-top:3px solid var(--lime);padding-top:20px}
body.technical-page .contact-side p {color:#d5e0d2;margin-bottom:24px}
body.technical-page .button {display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:55px;padding:13px 18px;background:var(--lime);color:var(--deep);font-size:15px;line-height:1.25;font-weight:700;transition:background .2s,transform .2s}
body.technical-page .button:hover {background:#e0f3a9;transform:translateY(-2px)}
body.technical-page .button span {font-size:23px;font-weight:400;line-height:1}
/* Editorial sibling navigation shared by all four technical-depth pages. */
body.technical-page .next-pages, .pf-related {background:var(--paper);border-top:1px solid var(--line);padding-block:clamp(72px,8vw,110px)}
body.technical-page .next-grid, .pf-related-grid {display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);align-items:start;gap:10%}
.adjacent-intro {position:relative;padding-top:27px}
.adjacent-intro::before {content:"";position:absolute;top:0;left:0;width:58px;height:4px;background:var(--green)}
body.technical-page .adjacent-intro .eyebrow, .pf-related .adjacent-intro .eyebrow {margin:0 0 20px}
body.technical-page .adjacent-intro h2, .pf-related .adjacent-intro h2 {max-width:430px;margin:0;font-size:clamp(36px,4vw,58px);line-height:1.08;letter-spacing:-.052em}
body.technical-page .next-links, .pf-related-links {display:grid;grid-template-columns:1fr;counter-reset:adjacent;border-top:2px solid var(--forest)}
body.technical-page .next-links a, .pf-related-links a {display:grid;grid-template-columns:32px minmax(0,1fr) 42px;gap:clamp(12px,1.8vw,23px);align-items:center;counter-increment:adjacent;min-height:96px;padding:16px 0;border-bottom:1px solid var(--line);font-size:clamp(23px,2.2vw,29px);font-weight:600;letter-spacing:-.03em;line-height:1.16}
body.technical-page .next-links a::before, .pf-related-links a::before {content:counter(adjacent,decimal-leading-zero);color:#537636;font-size:12px;font-weight:700;letter-spacing:.1em;line-height:1.3}
body.technical-page .next-links a span, .pf-related-links a span {display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);font-size:25px;font-weight:400;line-height:1;transition:background .2s,border-color .2s,color .2s}
body.technical-page .next-links a:hover, .pf-related-links a:hover {color:#537636}
body.technical-page .next-links a:hover span, .pf-related-links a:hover span {background:var(--lime);border-color:var(--lime);color:var(--deep)}
body.technical-page .next-links a:focus-visible, .pf-related-links a:focus-visible {outline:3px solid #537636;outline-offset:4px}
@media (max-width:1100px) {
body.technical-page .hero-grid, .pf-hero .pf-hero-grid {grid-template-columns:1fr;gap:46px}
body.technical-page .hero-aside, .pf-question {max-width:720px}
}
@media (max-width:900px) {
body.technical-page .table-head, body.technical-page .table-row {grid-template-columns:minmax(150px,.8fr) minmax(0,1.1fr) minmax(0,.9fr);gap:3%}
body.technical-page .brief-cell {padding-right:19px}
body.technical-page .brief-cell+.brief-cell {padding-left:19px}
}
@media (max-width:700px) {
body.technical-page h2 {font-size:clamp(36px,9vw,50px)}
body.technical-page .content {padding-block:73px}
body.technical-page .hero-grid, body.technical-page .technical .heading, body.technical-page .interface-grid, body.technical-page .contact-grid, body.technical-page .next-grid {grid-template-columns:1fr;gap:36px}
body.technical-page .hero-grid {padding-block:62px 74px}
body.technical-page .page-hero::after {width:73vw;right:-30%;top:12%;opacity:.05}
body.technical-page .hero-copy::before, .pf-hero-copy::before {margin-bottom:27px}
body.technical-page .hero-aside {max-width:590px}
body.technical-page .section-index .wrap, .pf-rail .wrap {display:block}
body.technical-page .section-index span, .pf-rail span {display:block}
body.technical-page .table-head {display:none}
body.technical-page .table-row {display:block;padding:24px 0 26px}
body.technical-page .table-row h3 {margin-bottom:15px}
body.technical-page .table-row p {margin:0 0 12px}
body.technical-page .table-row p:last-child {margin:0}
body.technical-page .table-row p::before {content:"Design focus";display:block;margin-bottom:4px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#537636}
body.technical-page .table-row p:last-child::before {content:"Engineering objective"}
body.technical-page .interface-list div {grid-template-columns:1fr;gap:4px}
body.technical-page .brief h2 {margin-bottom:34px}
body.technical-page .brief-grid {grid-template-columns:1fr}
body.technical-page .brief-cell, body.technical-page .brief-cell+.brief-cell {padding:22px 0 18px;border-left:0;border-bottom:1px solid var(--line)}
body.technical-page .brief-cell .num {margin-bottom:18px}
body.technical-page .next-grid, .pf-related-grid {grid-template-columns:1fr;gap:35px}
body.technical-page .next-links a, .pf-related-links a {grid-template-columns:26px minmax(0,1fr) 40px;gap:12px;min-height:84px;font-size:clamp(21px,5.8vw,26px)}
body.technical-page .next-links a span, .pf-related-links a span {width:40px;height:40px}
}
/* END SHARED TECHNICAL-DEPTH PAGE FAMILY */