/* Ryan Contracting Company — site styles */

@font-face { font-family: "Oswald"; src: url("/assets/fonts/oswald-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Oswald"; src: url("/assets/fonts/oswald-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/barlow-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/barlow-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/barlow-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/barlow-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/barlow-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  --ink: #26225b;          /* brand navy */
  --night: #17143b;        /* deep navy for dark sections */
  --night-2: #1f1b4a;
  --orange: #f26822;       /* brand orange */
  --orange-hover: #ff7a36;
  --paper: #ffffff;
  --mylar: #f2f3f7;        /* cool off-white, like plan film */
  --rule: #d6d9e3;
  --text: #22203a;
  --muted: #565470;
  --on-night: #e9e8f3;
  --on-night-muted: #aeacc9;
  --line-night: rgba(255,255,255,.16);

  --display: "Oswald", "Arial Narrow", Impact, sans-serif;
  --body: "Barlow", "Segoe UI", system-ui, sans-serif;

  --wrap: 1200px;
  --gutter: clamp(16px, 4vw, 32px);
  --section: clamp(64px, 9vw, 120px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--body);
  font-size: 1.125rem;
  line-height: 1.6;
  color: var(--text);
  background: var(--paper);
  text-rendering: optimizeLegibility;
}
img, svg { max-width: 100%; display: block; }
a { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: #000; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
p { margin: 0 0 1em; max-width: 68ch; }

h1, h2, h3, h4 { font-family: var(--display); font-weight: 600; line-height: 1.08; margin: 0 0 .5em; color: var(--ink); letter-spacing: .002em; }
h1 { font-size: clamp(2.5rem, 6.2vw, 4.75rem); line-height: 1.02; }
h2 { font-size: clamp(2rem, 3.8vw, 3rem); }
h3 { font-size: clamp(1.4rem, 2.1vw, 1.75rem); font-weight: 500; }
h4 { font-size: 1.2rem; font-weight: 500; }
.lede { font-size: clamp(1.2rem, 1.8vw, 1.4rem); line-height: 1.5; color: var(--muted); max-width: 60ch; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.skip { position: absolute; left: -9999px; top: 0; background: var(--orange); color: var(--night); padding: 10px 16px; z-index: 100; font-weight: 600; }
.skip:focus { left: 8px; top: 8px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  font-family: var(--body); font-weight: 700; font-size: 1rem; letter-spacing: .01em;
  padding: .85em 1.4em; border-radius: 3px; border: 2px solid transparent;
  text-decoration: none; cursor: pointer; line-height: 1.1;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn-primary { background: var(--orange); color: var(--night); }
.btn-primary:hover { background: var(--orange-hover); color: var(--night); }
.btn-ink { background: var(--ink); color: #fff; }
.btn-ink:hover { background: var(--night); color: #fff; }
.btn-ghost { border-color: currentColor; color: var(--ink); background: transparent; }
.btn-ghost:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.on-night .btn-ghost { color: #fff; }
.on-night .btn-ghost:hover { background: #fff; color: var(--night); border-color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--rule); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 76px; }
.brand { display: block; flex: none; }
.brand img { width: 148px; height: auto; }
.nav { display: flex; align-items: center; gap: clamp(14px, 1.8vw, 26px); }
.nav a.nav-link { font-weight: 600; font-size: .98rem; color: var(--text); text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.nav a.nav-link:hover { color: var(--ink); border-bottom-color: var(--rule); }
.nav a.nav-link[aria-current="page"] { color: var(--ink); border-bottom-color: var(--orange); }
.nav .btn { padding: .65em 1.1em; font-size: .95rem; }
.nav-toggle { display: none; background: none; border: 0; padding: 10px; margin-right: -10px; cursor: pointer; color: var(--ink); }
.nav-toggle svg { width: 28px; height: 28px; }

@media (max-width: 1060px) {
  .nav-toggle { display: block; }
  .nav {
    position: fixed; inset: 76px 0 0 0; background: #fff; flex-direction: column; align-items: stretch;
    gap: 0; padding: 8px var(--gutter) 32px; overflow-y: auto; display: none;
  }
  .nav.open { display: flex; }
  .nav a.nav-link { font-size: 1.35rem; font-family: var(--display); font-weight: 500; padding: 16px 0; border-bottom: 1px solid var(--rule); }
  .nav a.nav-link[aria-current="page"] { border-bottom-color: var(--rule); color: var(--orange); }
  .nav .btn { margin-top: 24px; padding: 1em; font-size: 1.05rem; }
  body.nav-open { overflow: hidden; }
}

/* ---------- Sections ---------- */
.section { padding: var(--section) 0; }
.section-mylar { background: var(--mylar); }
.on-night { background: var(--night); color: var(--on-night); }
.on-night h1, .on-night h2, .on-night h3, .on-night h4 { color: #fff; }
.on-night a { color: #fff; }
.on-night .lede, .on-night .muted { color: var(--on-night-muted); }
.section-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 24px; margin-bottom: clamp(32px, 5vw, 56px); }
.section-head p { margin: 0; }
.section-head > .btn { justify-self: start; }
.section-head h2 { margin-bottom: .3em; }
@media (max-width: 720px) { .section-head { grid-template-columns: 1fr; } }
.muted { color: var(--muted); }

/* ---------- Hero ---------- */
.hero { position: relative; overflow: hidden; background: var(--night); color: var(--on-night); }
.hero .wrap { position: relative; z-index: 2; padding-top: clamp(72px, 11vw, 150px); padding-bottom: clamp(260px, 30vw, 360px); }
.hero h1 { color: #fff; max-width: 19ch; }
.hero .lede { color: var(--on-night-muted); }
.hero-drawing { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; width: 100%; min-width: 900px; height: auto; pointer-events: none; }
@media (max-width: 900px) { .hero-drawing { left: auto; right: -200px; } }

.page-hero { background: var(--night); color: var(--on-night); padding: clamp(56px, 8vw, 104px) 0 clamp(48px, 6vw, 80px); position: relative; overflow: hidden; }
.page-hero h1 { color: #fff; max-width: 20ch; font-size: clamp(2.3rem, 5vw, 3.9rem); }
.page-hero .lede { color: var(--on-night-muted); }
.page-hero .crumb { font-weight: 600; font-size: .95rem; color: var(--on-night-muted); margin-bottom: 18px; }
.page-hero .crumb a { color: var(--on-night-muted); }
.page-hero .grid-lines { position: absolute; inset: 0; opacity: .5; pointer-events: none; }

/* Draw-on animation for linework */
.draw path.line, .draw line.line, .draw polyline.line { stroke-dasharray: var(--len, 2400); stroke-dashoffset: var(--len, 2400); animation: draw 2.2s cubic-bezier(.4,.1,.2,1) forwards; }
.draw .d2 { animation-delay: .5s; } .draw .d3 { animation-delay: .9s; } .draw .d4 { animation-delay: 1.3s; }
.draw .fade { opacity: 0; animation: fade .8s ease forwards 1.6s; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes fade { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .draw path.line, .draw line.line, .draw polyline.line { animation: none; stroke-dashoffset: 0; }
  .draw .fade { animation: none; opacity: 1; }
  html { scroll-behavior: auto; }
}

/* ---------- Three doors ---------- */
.doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 -28px; }
.door { padding: 8px 28px 40px; display: flex; flex-direction: column; }
.door + .door { border-left: 1px solid var(--rule); }
.door h3 { margin-bottom: .45em; }
.door p { color: var(--muted); flex: 1; }
.door .btn { align-self: flex-start; }
.door .who { font-weight: 600; color: var(--ink); font-size: .98rem; margin-bottom: 1.2em; }
.door .marker { width: 44px; height: 4px; background: var(--orange); margin-bottom: 24px; }
@media (max-width: 860px) {
  .doors { grid-template-columns: 1fr; margin: 0; }
  .door, .door + .door { padding: 28px 0 32px; border-left: 0; border-bottom: 1px solid var(--rule); }
}

/* ---------- Services list ---------- */
.services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 56px; }
.service { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 24px; padding: 32px 0; border-top: 1px solid var(--rule); }
.service svg { width: 96px; height: 96px; }
.service h3 { margin-bottom: .35em; }
.service p { color: var(--muted); margin: 0; }
.service ul { margin: .8em 0 0; padding-left: 1.1em; color: var(--muted); }
@media (max-width: 860px) { .services { grid-template-columns: 1fr; } .service { grid-template-columns: 64px 1fr; gap: 18px; } .service svg { width: 64px; height: 64px; } }

/* ---------- Season map ---------- */
.season { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 6vw, 88px); align-items: center; }
.season-map svg { width: 100%; max-width: 520px; margin: 0 auto; }
.city-list { list-style: none; margin: 28px 0 0; padding: 0; columns: 2; column-gap: 32px; }
.city-list li { break-inside: avoid; padding: 9px 0; border-top: 1px solid var(--line-night); display: flex; justify-content: space-between; gap: 12px; }
.city-list a { text-decoration: none; font-weight: 600; }
.city-list a:hover { text-decoration: underline; }
.city-list span { color: var(--on-night-muted); font-size: .95rem; white-space: nowrap; }
@media (max-width: 860px) { .season { grid-template-columns: 1fr; } .season-map { order: -1; } }
@media (max-width: 480px) { .city-list { columns: 1; } }

.map-land { fill: var(--night-2); stroke: rgba(255,255,255,.35); stroke-width: 1.5; }
.map-light .map-land { fill: #fff; stroke: var(--ink); stroke-width: 1.5; }
.map-dot { fill: var(--orange); }
.map-dot-ring { fill: none; stroke: var(--orange); stroke-width: 1.5; opacity: .55; }
.map-office { fill: #fff; stroke: var(--night); stroke-width: 2; }
.map-light .map-office { fill: var(--ink); stroke: #fff; }
.map-label { font-family: var(--body); font-size: 21px; font-weight: 600; fill: #fff; }
.map-light .map-label { fill: var(--ink); }
.map-label.office { fill: var(--on-night-muted); font-weight: 500; }
.map-light .map-label.office { fill: var(--muted); }

/* ---------- Facts ---------- */
.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--ink); margin: 0; }
.facts div { padding: 20px 20px 4px 0; }
.facts div + div { padding-left: 20px; border-left: 1px solid var(--rule); }
.facts dt { font-family: var(--display); font-weight: 500; font-size: clamp(1.7rem, 3vw, 2.4rem); color: var(--ink); line-height: 1.1; }
.facts dd { margin: 6px 0 0; color: var(--muted); font-size: 1rem; line-height: 1.4; }
@media (max-width: 760px) { .facts { grid-template-columns: 1fr 1fr; } .facts div:nth-child(3) { padding-left: 0; border-left: 0; } .facts div { padding-bottom: 20px; } }

/* ---------- Split layouts ---------- */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 88px); align-items: start; }
.split-wide { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }
@media (max-width: 860px) { .split, .split-wide { grid-template-columns: 1fr; } }

.checklist { list-style: none; padding: 0; margin: 0; }
.checklist li { position: relative; padding: 14px 0 14px 34px; border-top: 1px solid var(--rule); }
.checklist li:last-child { border-bottom: 1px solid var(--rule); }
.checklist li::before { content: ""; position: absolute; left: 2px; top: 22px; width: 14px; height: 8px; border-left: 3px solid var(--orange); border-bottom: 3px solid var(--orange); transform: rotate(-45deg); }
.checklist strong { color: var(--ink); }
.on-night .checklist li { border-color: var(--line-night); }
.on-night .checklist strong { color: #fff; }

/* Scope table used on Private and Concrete pages */
.scope-table { width: 100%; border-collapse: collapse; font-size: 1.05rem; }
.scope-table th, .scope-table td { text-align: left; vertical-align: top; padding: 18px 16px 18px 0; border-top: 1px solid var(--rule); }
.scope-table th { font-family: var(--display); font-weight: 500; color: var(--ink); font-size: 1.3rem; width: 34%; line-height: 1.2; }
.scope-table td { color: var(--muted); }
@media (max-width: 640px) { .scope-table th, .scope-table td { display: block; width: auto; padding-right: 0; } .scope-table td { border-top: 0; padding-top: 0; } }

/* Sequenced steps (only where the content is a real sequence) */
.steps { list-style: none; counter-reset: step; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.steps li { counter-increment: step; border-top: 2px solid var(--orange); padding-top: 16px; }
.steps li::before { content: "Step " counter(step); display: block; font-weight: 700; color: var(--orange); font-size: .95rem; margin-bottom: 6px; }
.steps h4 { margin-bottom: .3em; }
.steps p { color: var(--muted); font-size: 1rem; margin: 0; }
.on-night .steps p { color: var(--on-night-muted); }
@media (max-width: 860px) { .steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .steps { grid-template-columns: 1fr; } }

/* ---------- Projects ---------- */

.year-block { margin-bottom: clamp(48px, 7vw, 80px); }
.year-block > h2 { display: flex; align-items: baseline; gap: 16px; border-bottom: 2px solid var(--ink); padding-bottom: 10px; margin-bottom: 0; }
.year-block > h2 small { font-family: var(--body); font-size: 1rem; font-weight: 600; color: var(--muted); }

.project-row { display: grid; grid-template-columns: 112px minmax(0, 1.6fr) minmax(0, 1fr) 128px; gap: 24px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--rule); text-decoration: none; color: inherit; }
.project-row:hover { background: var(--mylar); box-shadow: -12px 0 0 var(--mylar), 12px 0 0 var(--mylar); }
.project-row:hover .pr-title { text-decoration: underline; }
.pr-thumb { width: 112px; height: 84px; border-radius: 2px; overflow: hidden; background: var(--night); }
.pr-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pr-thumb svg { width: 100%; height: 100%; }
.pr-city { font-family: var(--display); font-weight: 500; font-size: 1.5rem; color: var(--ink); line-height: 1.1; }
.pr-title { font-weight: 600; color: var(--text); margin-top: 2px; }
.pr-meta { color: var(--muted); font-size: 1rem; line-height: 1.45; }
.pr-value { text-align: right; font-family: var(--display); font-weight: 500; font-size: 1.35rem; color: var(--ink); }
.status { display: inline-flex; align-items: center; gap: 7px; font-size: .92rem; font-weight: 600; color: var(--muted); margin-top: 6px; }
.status::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--rule); }
.status.in-progress::before { background: var(--orange); }
.status.complete::before { background: #2f8f5b; }
@media (max-width: 860px) {
  .project-row { grid-template-columns: 88px minmax(0, 1fr); gap: 6px 16px; align-items: start; }
  .pr-thumb { width: 88px; height: 66px; grid-row: span 3; }
  .pr-value { text-align: left; font-size: 1.15rem; }
}

/* Project detail */
.project-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0; margin: 0; border-top: 1px solid var(--line-night); }
.project-facts div { padding: 16px 16px 16px 0; border-bottom: 1px solid var(--line-night); }
.project-facts dt { font-size: .92rem; font-weight: 600; color: var(--on-night-muted); }
.project-facts dd { margin: 4px 0 0; font-weight: 600; color: #fff; font-size: 1.08rem; line-height: 1.35; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.tags li { border: 1px solid var(--rule); border-radius: 999px; padding: 4px 12px; font-size: .95rem; font-weight: 600; color: var(--ink); }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.gallery figure { margin: 0; }
.gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 2px; background: var(--mylar); }
.gallery figcaption { font-size: .95rem; color: var(--muted); padding-top: 6px; }
.gallery-empty { border: 1px dashed var(--rule); padding: 28px; color: var(--muted); border-radius: 2px; }
.locator svg { width: 100%; max-width: 360px; }
.project-nav { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--rule); padding-top: 24px; margin-top: 56px; }
.project-nav a { text-decoration: none; font-weight: 600; }
.project-nav small { display: block; color: var(--muted); font-weight: 500; }

/* ---------- Feature list on home ---------- */
.feature-projects { border-top: 2px solid var(--ink); }

/* ---------- CTA band ---------- */
.band { background: var(--orange); color: var(--night); padding: clamp(48px, 7vw, 80px) 0; }
.band h2 { color: var(--night); margin-bottom: .25em; }
.band p { color: var(--night); margin: 0; font-size: 1.15rem; }
.band .wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: center; }
.band .btn-ink:hover { background: #000; }
@media (max-width: 760px) { .band .wrap { grid-template-columns: 1fr; } }

/* ---------- People ---------- */
.people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.person { border-top: 2px solid var(--ink); padding-top: 18px; }
.person h3 { margin-bottom: .1em; }
.person .role { color: var(--orange); font-weight: 700; margin-bottom: .8em; }
@media (max-width: 640px) { .people { grid-template-columns: 1fr; } }

/* ---------- Jobs ---------- */
.jobs { border-top: 2px solid var(--ink); }
.job { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 32px; align-items: center; padding: 26px 0; border-bottom: 1px solid var(--rule); }
.job h3 { margin-bottom: .2em; }
.job p { margin: 0; color: var(--muted); }
.job .flag { display: inline-block; background: var(--orange); color: var(--night); font-weight: 700; font-size: .85rem; padding: 3px 10px; border-radius: 2px; margin-bottom: 10px; }
@media (max-width: 640px) { .job { grid-template-columns: 1fr; } }

/* ---------- Forms ---------- */
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
.form .full { grid-column: 1 / -1; }
.field label, .field legend { display: block; font-weight: 600; font-size: 1rem; margin-bottom: 6px; color: var(--text); }
.field .hint { font-weight: 400; color: var(--muted); font-size: .92rem; }
.field input, .field select, .field textarea {
  width: 100%; font: inherit; font-size: 1.05rem; color: var(--text);
  padding: 12px 14px; border: 1px solid #b9bccb; border-radius: 3px; background: #fff;
}
.field textarea { min-height: 140px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(242,104,34,.45); }
.field input[type="file"] { padding: 10px; background: var(--mylar); }
.hp { position: absolute; left: -9999px; }
.form-status { grid-column: 1 / -1; font-weight: 600; min-height: 1.6em; margin: 0; }
.form-status.ok { color: #1f7a4a; }
.form-status.err { color: #b3261e; }
.form-panel { background: #fff; border: 1px solid var(--rule); border-top: 4px solid var(--orange); padding: clamp(24px, 4vw, 40px); }
@media (max-width: 640px) { .form { grid-template-columns: 1fr; } }

/* ---------- Contact ---------- */
.offices { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.office { border-top: 2px solid var(--ink); padding-top: 16px; }
.office h3 { margin-bottom: .3em; }
.office p { margin: 0 0 .4em; }
.contact-lines { list-style: none; padding: 0; margin: 28px 0 0; }
.contact-lines li { padding: 14px 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: 170px 1fr; gap: 12px; }
.contact-lines li span { color: var(--muted); font-weight: 600; }
@media (max-width: 640px) { .offices { grid-template-columns: 1fr; } .contact-lines li { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- Long-form (job posting) ---------- */
.prose h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); margin-top: 1.6em; }
.prose h3 { margin-top: 1.4em; }
.prose ul { padding-left: 1.2em; max-width: 68ch; }
.prose li { margin-bottom: .45em; }
.posting-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0 0 32px; border-top: 1px solid var(--line-night); }
.posting-facts div { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--line-night); }
.posting-facts dt { font-size: .9rem; font-weight: 600; color: var(--on-night-muted); }
.posting-facts dd { margin: 2px 0 0; color: #fff; font-weight: 600; }
@media (max-width: 640px) { .posting-facts { grid-template-columns: 1fr 1fr; } }

/* ---------- Footer ---------- */
.site-footer { background: var(--night); color: var(--on-night-muted); padding: 64px 0 32px; font-size: 1rem; }
.site-footer a { color: var(--on-night); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 32px; }
.footer-grid h4 { color: #fff; font-size: 1.05rem; margin-bottom: .8em; }
.footer-grid ul { list-style: none; margin: 0; padding: 0; }
.footer-grid li { margin-bottom: .5em; }
.footer-logo { background: #fff; display: inline-block; padding: 10px 14px; border-radius: 3px; margin-bottom: 18px; }
.footer-logo img { width: 140px; }
.footer-base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line-night); margin-top: 48px; padding-top: 24px; font-size: .95rem; }
.socials { display: flex; gap: 12px; margin-top: 14px; }
.socials a { display: inline-flex; width: 40px; height: 40px; border: 1px solid var(--line-night); border-radius: 50%; align-items: center; justify-content: center; }
.socials a:hover { border-color: #fff; text-decoration: none; }
.socials svg { width: 18px; height: 18px; fill: currentColor; }
@media (max-width: 860px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .footer-grid { grid-template-columns: 1fr; } }

/* two-column facts */
.facts.facts-2 { grid-template-columns: 1fr 1fr; }
.facts.facts-2 div { padding: 20px 20px 20px 0; border-left: 0; border-bottom: 1px solid var(--rule); }
.facts.facts-2 div:nth-child(even) { padding-left: 20px; border-left: 1px solid var(--rule); }
.facts.facts-2 div:nth-child(3), .facts.facts-2 div:nth-child(4) { border-bottom: 0; }

/* ---------- Photography ---------- */
figure.photo { margin: 0; }
figure.photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 2px; background: var(--night-2); }
figure.photo figcaption { font-size: .95rem; color: var(--muted); padding-top: 8px; }
.on-night figure.photo figcaption { color: var(--on-night-muted); }

.hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-shade { position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, rgba(23,20,59,.95) 0%, rgba(23,20,59,.86) 34%, rgba(23,20,59,.45) 66%, rgba(23,20,59,.18) 100%),
    linear-gradient(0deg, rgba(23,20,59,.55) 0%, rgba(23,20,59,0) 30%); }
.hero.has-photo .wrap { position: relative; z-index: 2; padding-top: clamp(96px, 14vw, 200px); padding-bottom: clamp(96px, 13vw, 190px); }
.hero.has-photo { min-height: min(86vh, 820px); display: flex; align-items: center; }
.hero.has-photo .wrap { width: 100%; }
.page-hero.has-photo { padding: clamp(96px, 12vw, 168px) 0 clamp(72px, 9vw, 120px); }
.page-hero.has-drawing { padding-bottom: clamp(200px, 22vw, 300px); }
.page-hero .page-drawing { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; min-width: 900px; z-index: 1; opacity: .9; }
@media (max-width: 760px) {
  .hero-shade { background: linear-gradient(180deg, rgba(23,20,59,.6) 0%, rgba(23,20,59,.88) 55%, rgba(23,20,59,.96) 100%); }
  .hero.has-photo { min-height: 0; }
}

/* door photos */
.door-photo { margin: 0 0 24px; }
.door-photo img { aspect-ratio: 3 / 2; border-bottom: 4px solid var(--orange); border-radius: 2px 2px 0 0; }

/* service section photos */
.svc-photo img { aspect-ratio: 4 / 3; }

/* careers photo strip */
.photo-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; background: var(--night); }
.photo-strip figure.photo img { aspect-ratio: 4 / 5; border-radius: 0; }
@media (max-width: 760px) { .photo-strip { grid-template-columns: 1fr; } .photo-strip figure.photo img { aspect-ratio: 4 / 3; } }

/* concrete photo grid */
.photo-grid { display: grid; grid-template-columns: 2fr 2fr 1fr 1fr; gap: 4px; background: var(--night); }
.photo-grid figure.photo { position: relative; }
.photo-grid figure.photo img { aspect-ratio: auto; height: 100%; min-height: 360px; border-radius: 0; }
.photo-grid figure.photo figcaption { position: absolute; left: 0; bottom: 0; padding: 10px 14px; color: #fff; font-weight: 600; background: linear-gradient(0deg, rgba(23,20,59,.85), rgba(23,20,59,0)); width: 100%; }
@media (max-width: 860px) { .photo-grid { grid-template-columns: 1fr 1fr; } .photo-grid figure.photo img { min-height: 260px; } }
@media (max-width: 520px) { .photo-grid { grid-template-columns: 1fr; } }

.fleet-table { margin-top: 20px; font-size: 1rem; }
.fleet-table th { font-size: 1.1rem; width: 46%; padding: 12px 16px 12px 0; }
.fleet-table td { padding: 12px 0; }

/* ---------- Seasons & project cards ---------- */
.yr { padding-bottom: clamp(48px, 7vw, 88px); }
.yr + .yr { border-top: 2px solid var(--ink); padding-top: clamp(40px, 6vw, 72px); }
.yr-title { margin-bottom: .5em; }
.season-summary { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: clamp(24px, 5vw, 64px); align-items: center; margin-bottom: clamp(40px, 6vw, 64px); }
.season-summary-map svg { width: 100%; max-width: 360px; }
.season-cities { margin: 20px 0 0; color: var(--muted); }
.season-cities strong { color: var(--ink); }
.season-line { color: var(--muted); margin: 0 0 32px; }
.season-jump { display: flex; gap: 8px; margin-bottom: 32px; }
.season-jump a { font-weight: 700; text-decoration: none; padding: 6px 14px; border: 1px solid var(--rule); border-radius: 3px; }
.season-jump a:hover { border-color: var(--ink); }
.season-group + .season-group { margin-top: clamp(40px, 5vw, 56px); }
.group-title { display: flex; align-items: baseline; gap: 10px; font-size: 1.5rem; border-bottom: 1px solid var(--rule); padding-bottom: 10px; margin-bottom: 24px; }
.group-title span { font-family: var(--body); font-size: 1rem; font-weight: 600; color: var(--muted); }
@media (max-width: 760px) { .season-summary { grid-template-columns: 1fr; } .season-summary-map svg { max-width: 260px; } }

.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
@media (max-width: 960px) { .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .card-grid { grid-template-columns: 1fr; } }
.project-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; background: #fff; border: 1px solid var(--rule); border-radius: 3px; overflow: hidden; transition: border-color .15s ease; }
.project-card:hover { border-color: var(--ink); }
.project-card:hover .pc-city { text-decoration: underline; text-underline-offset: 4px; }
.pc-media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--night); border-bottom: 4px solid var(--orange); }
.pc-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.pc-map { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.pc-map svg { width: auto; height: 74%; }
.pc-map-label { position: absolute; left: 12px; bottom: 10px; color: var(--on-night-muted); font-size: .85rem; font-weight: 600; }
.pc-count { position: absolute; right: 10px; bottom: 10px; background: rgba(23,20,59,.85); color: #fff; font-size: .85rem; font-weight: 600; padding: 3px 9px; border-radius: 2px; }
.pc-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.pc-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.pc-top .status { margin-top: 0; }
.pc-value { font-family: var(--display); font-weight: 500; font-size: 1.2rem; color: var(--ink); }
.pc-city { font-size: 1.6rem; margin: 0 0 .15em; }
.pc-title { font-weight: 600; color: var(--text); margin: 0 0 .6em; line-height: 1.35; }
.pc-meta { color: var(--muted); font-size: .95rem; margin: auto 0 0; }
.more-cards { margin-top: 24px; }
.more-cards summary { cursor: pointer; font-weight: 700; color: var(--ink); padding: 10px 0; }
.more-cards[open] summary { margin-bottom: 20px; }

/* ---------- Hiring promotion ---------- */
.hiring-bar { background: var(--orange); color: var(--night); font-size: .98rem; }
.hiring-bar .wrap { display: flex; align-items: center; gap: 14px; min-height: 44px; padding-top: 7px; padding-bottom: 7px; }
.hiring-bar p { margin: 0; font-weight: 600; max-width: none; flex: 1; }
.hb-tag { flex: none; background: var(--night); color: #fff; font-weight: 700; font-size: .85rem; padding: 3px 10px; border-radius: 2px; }
.hb-link { flex: none; color: var(--night); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.hb-link:hover { color: #000; }
.hb-close { flex: none; background: none; border: 0; padding: 6px; margin-right: -6px; cursor: pointer; color: var(--night); display: inline-flex; }
.hb-close svg { width: 18px; height: 18px; }
.hiring-bar.is-hidden { display: none; }
@media (max-width: 760px) {
  .hiring-bar .wrap { flex-wrap: wrap; gap: 4px 10px; }
  .hiring-bar p { flex-basis: calc(100% - 40px); order: 2; font-size: .92rem; }
  .hb-tag { order: 1; } .hb-close { order: 1; margin-left: auto; } .hb-link { order: 3; font-size: .92rem; }
}

.nav-link-hiring { display: inline-flex; align-items: center; gap: 7px; }
.nav-badge { background: var(--orange); color: var(--night); font-family: var(--body); font-size: .72rem; font-weight: 700; line-height: 1; padding: 4px 7px; border-radius: 2px; letter-spacing: .02em; }
@media (max-width: 1060px) { .nav-badge { font-size: .8rem; padding: 5px 8px; } }

.hire-feature { background: var(--night); color: var(--on-night); padding: clamp(56px, 8vw, 104px) 0; border-top: 6px solid var(--orange); }
.hire-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.hire-tag { display: inline-block; background: var(--orange); color: var(--night); font-weight: 700; padding: 4px 12px; border-radius: 2px; margin-bottom: 18px; }
.hire-feature h2 { color: #fff; font-size: clamp(2.4rem, 5vw, 3.8rem); margin-bottom: .3em; }
.hire-lede { color: var(--on-night-muted); font-size: clamp(1.1rem, 1.6vw, 1.3rem); max-width: 56ch; }
.hire-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 28px 0 0; border-top: 1px solid var(--line-night); }
.hire-facts div { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--line-night); }
.hire-facts div:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--line-night); }
.hire-facts dt { color: var(--on-night-muted); font-size: .92rem; font-weight: 600; }
.hire-facts dd { margin: 2px 0 0; color: #fff; font-weight: 600; font-size: 1.12rem; line-height: 1.35; }
.hire-facts div:first-child dd { font-family: var(--display); font-weight: 500; font-size: 1.6rem; color: var(--orange); }
.hire-feature .btn-ghost { color: #fff; }
.hire-feature .btn-ghost:hover { background: #fff; color: var(--night); border-color: #fff; }
.hire-sheet svg { width: 100%; height: auto; box-shadow: 0 24px 60px rgba(0,0,0,.35); transform: rotate(-1.5deg); border-radius: 4px; }
@media (max-width: 860px) { .hire-grid { grid-template-columns: 1fr; } .hire-sheet { max-width: 480px; } }
@media (max-width: 520px) { .hire-facts { grid-template-columns: 1fr; } .hire-facts div:nth-child(even) { padding-left: 0; border-left: 0; } }
.season-intro { font-size: clamp(1.2rem, 1.8vw, 1.4rem); color: var(--ink); margin: 0; max-width: 40ch; line-height: 1.45; }
.pc-top { align-items: baseline; }
.pc-top .pc-city { margin: 0; }

/* ---------- Careers ---------- */
.why-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 36px; }
.why { border-top: 4px solid var(--orange); padding-top: 18px; }
.why h3 { margin-bottom: .4em; }
.why p { color: var(--muted); margin: 0; }
@media (max-width: 960px) { .why-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .why-grid { grid-template-columns: 1fr; gap: 28px; } }

.standard { background: var(--night); padding: clamp(64px, 9vw, 120px) 0; border-top: 6px solid var(--orange); }
.standard-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.standard-line { font-family: var(--display); font-weight: 600; color: #fff; font-size: clamp(2.6rem, 6vw, 5rem); line-height: 1.02; margin: 0; max-width: 14ch; }
.standard-list { list-style: none; margin: 0; padding: 0; }
.standard-list li { padding: 16px 0; border-top: 1px solid var(--line-night); color: var(--on-night-muted); font-size: 1.12rem; }
.standard-list li:last-child { border-bottom: 1px solid var(--line-night); }
.standard-list strong { color: #fff; display: block; font-size: 1.2rem; }
@media (max-width: 860px) { .standard-grid { grid-template-columns: 1fr; } }

.benefit-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
@media (max-width: 960px) { .benefit-cols { grid-template-columns: 1fr; } }
.refer-callout { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 32px; align-items: center; margin-top: 48px; padding: 28px 32px; background: #fff; border: 1px solid var(--rule); border-left: 6px solid var(--orange); }
.refer-callout h3 { margin-bottom: .2em; }
.refer-callout p { margin: 0; color: var(--muted); }
@media (max-width: 640px) { .refer-callout { grid-template-columns: 1fr; } }

/* About: 35-year anniversary band */
.anniversary { background: var(--night); padding: clamp(56px, 8vw, 104px) 0; border-top: 6px solid var(--orange); }
.anniversary-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
.anniversary-logo { display: block; width: 100%; max-width: 520px; height: auto; margin: 0 auto; }
.anniversary h2 { color: #fff; font-size: clamp(2.2rem, 4.6vw, 3.6rem); }
.anniversary p { color: var(--on-night-muted); font-size: 1.12rem; max-width: 56ch; }
.anniversary .eyebrow { color: var(--orange); font-weight: 700; text-transform: uppercase; letter-spacing: .12em; font-size: .9rem; margin: 0 0 .6em; }
@media (max-width: 860px) { .anniversary-grid { grid-template-columns: 1fr; } .anniversary-logo { max-width: 380px; } }

/* About: leadership team photo, uncropped */
.leadership-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 64px); align-items: center; }
figure.team-photo img { aspect-ratio: auto; }
.people-stack { grid-template-columns: 1fr; gap: 22px; margin-top: 20px; }
.people-stack .person { padding-top: 14px; }
.people-stack .person .role { margin-bottom: .3em; }
.people-stack .person p { margin-bottom: 0; }
@media (max-width: 860px) { .leadership-grid { grid-template-columns: 1fr; } }

/* Careers: equal employment opportunity statement */
.eeo-statement { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--rule); max-width: 78ch; }
.eeo-statement h3 { font-size: 1.15rem; margin-bottom: .4em; }
.eeo-statement p { color: var(--muted); font-size: .98rem; margin: 0; }