/* Stone & Structure: premium architectural construction concept.
   Identity: warm ivory, charcoal, architectural gray, muted bronze.
   Type: Archivo (expanded capitals for display, normal width for text) + Newsreader italic accents. */
@font-face { font-family: "SS Archivo"; src: url("fonts/Archivo-VF-latin.woff2") format("woff2"); font-weight: 300 700; font-stretch: 88% 125%; font-display: swap; }
@font-face { font-family: "SS Newsreader"; src: url("fonts/Newsreader-Italic-VF-latin.woff2") format("woff2"); font-weight: 300 500; font-style: italic; font-display: swap; }

:root {
  --ivory: #F3EEE6;
  --ivory-2: #E9E2D6;
  --paper: #FAF7F2;
  --charcoal: #191918;
  --graphite: #232524;
  --gray: #3B3E40;
  --muted: #5E5A53;
  --muted-dark: #ABA59B;
  --line: rgba(25, 25, 24, .16);
  --line-dark: rgba(243, 238, 230, .16);
  --bronze: #A47A4C;
  --bronze-ink: #7B5A35;
  --bronze-soft: #C8A57C;
  --error: #9B2C1F;
  --sans: "SS Archivo", "Helvetica Neue", Arial, sans-serif;
  --serif: "SS Newsreader", Georgia, "Times New Roman", serif;
  --ease: cubic-bezier(.2, .7, .1, 1);

  --f-gutter: clamp(20px, 4vw, 56px);
  --f-max: 1360px;
  --f-ease: var(--ease);
  --f-focus: var(--bronze);
  --f-bg: var(--ivory);
  --f-ink: var(--charcoal);
  --f-scroll-pad: 84px;
  --f-lb-bg: #121211;
  --f-lb-ink: var(--ivory);
  --f-lb-muted: var(--muted-dark);
  --f-lb-font: var(--sans);
}

body { background: var(--ivory); color: var(--charcoal); font-family: var(--sans); font-size: 17px; line-height: 1.65; font-stretch: 100%; }
::selection { background: var(--bronze); color: var(--charcoal); }
a { color: inherit; }

/* Shared type ------------------------------------------------------------- */
.ss-kicker { font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.ss-label { display: flex; align-items: center; gap: 14px; margin-bottom: clamp(22px, 3vw, 36px); font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--bronze-ink); }
.ss-label__num { display: inline-flex; align-items: center; gap: 14px; font-variant-numeric: tabular-nums; }
.ss-label__num::after { content: ""; width: 34px; height: 1px; background: currentColor; opacity: .6; }
.ss-label--light, .ss-services .ss-label { color: var(--bronze-soft); }
.ss-heading { font-stretch: 125%; font-weight: 520; text-transform: uppercase; font-size: clamp(30px, 4.4vw, 68px); line-height: .98; letter-spacing: -.02em; }
.ss-heading span { display: block; font-family: var(--serif); font-style: italic; font-weight: 300; text-transform: none; letter-spacing: -.01em; font-stretch: 100%; color: var(--bronze-ink); margin-top: .08em; font-size: 1.04em; }
.ss-services .ss-heading span { color: var(--bronze-soft); }
.ss-statement { font-weight: 400; font-size: clamp(30px, 4vw, 60px); line-height: 1.08; letter-spacing: -.025em; max-width: 20ch; }
.ss-statement em { font-family: var(--serif); font-style: italic; font-weight: 300; letter-spacing: -.01em; color: var(--bronze-ink); }
.ss-note { font-size: 13px; color: var(--muted); }
.ss-caption { margin-top: 14px; font-size: 12px; letter-spacing: .06em; color: var(--muted); }

/* Buttons and links ---------------------------------------------------------- */
.ss-btn { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 54px; padding: 0 28px; border: 1px solid transparent; background: var(--charcoal); color: var(--ivory); font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; transition: background-color .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease); }
.ss-btn span { transition: transform .35s var(--ease); }
.ss-btn:hover { background: var(--bronze); color: var(--charcoal); }
.ss-btn:hover span { transform: translateX(4px); }
.ss-btn--light { background: var(--ivory); color: var(--charcoal); }
.ss-btn--light:hover { background: var(--bronze-soft); }
.ss-btn--bronze { background: var(--bronze); color: var(--charcoal); }
.ss-btn--bronze:hover { background: var(--ivory); color: var(--charcoal); }
.ss-btn--small { min-height: 44px; padding: 0 20px; font-size: 12px; }
.ss-link { display: inline-flex; align-items: center; gap: 10px; padding: 0 0 6px; border: 0; background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat; color: inherit; font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; transition: background-size .45s var(--ease), color .3s; }
.ss-link:hover { color: var(--bronze-ink); background-size: 40% 1px; }
.ss-link--light { color: var(--ivory); }
.ss-link--light:hover { color: var(--bronze-soft); }

/* Concept disclosure and header ------------------------------------------- */
.ss-top { position: absolute; inset: 0 0 auto; z-index: 50; }
.ss-concept { background: #0E0E0D; color: #D8D1C5; font-size: 12px; line-height: 1.5; }
.ss-concept__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-block: 9px; }
.ss-concept strong { color: var(--ivory); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; font-size: 11px; }
.ss-concept__sep { margin: 0 10px; opacity: .45; }
.ss-concept a { flex: none; color: var(--ivory); text-underline-offset: 3px; }

.ss-header { position: relative; z-index: 2; color: var(--ivory); }
.ss-header__inner { display: flex; align-items: center; gap: 28px; min-height: 84px; }
.ss-header.is-scrolled { position: fixed; top: 0; left: 0; right: 0; background: var(--ivory); color: var(--charcoal); border-bottom: 1px solid var(--line); animation: ss-drop .55s var(--ease) both; }
.ss-header.is-scrolled .ss-header__inner { min-height: 68px; }
@keyframes ss-drop { from { transform: translateY(-100%); } to { transform: none; } }
.ss-logo { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 12px; margin-right: auto; text-decoration: none; }
.ss-logo__mark { flex: none; width: 26px; height: 26px; color: var(--bronze-soft); }
.ss-header.is-scrolled .ss-logo__mark { color: var(--bronze); }
.ss-logo__word { font-stretch: 125%; font-weight: 620; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.ss-logo__amp { font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 1.3em; letter-spacing: 0; text-transform: none; color: var(--bronze-soft); }
.ss-header.is-scrolled .ss-logo__amp { color: var(--bronze-ink); }
.ss-nav__list { display: flex; gap: clamp(20px, 2.4vw, 40px); }
.ss-nav__list a { position: relative; display: inline-flex; align-items: baseline; gap: 6px; padding: 10px 0; font-size: 13px; font-weight: 550; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; }
.ss-nav__list a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .45s var(--ease); }
.ss-nav__list a:hover::after { transform: scaleX(1); transform-origin: left; }
.ss-nav__num { font-size: 10px; letter-spacing: .08em; color: var(--bronze-soft); }
.ss-header.is-scrolled .ss-nav__num { color: var(--bronze-ink); }
.ss-nav__extra { display: none; }
.ss-header .ss-header__cta { background: transparent; border-color: rgba(243, 238, 230, .55); color: var(--ivory); }
.ss-header .ss-header__cta:hover { background: var(--ivory); color: var(--charcoal); }
.ss-header.is-scrolled .ss-header__cta { background: var(--charcoal); border-color: var(--charcoal); color: var(--ivory); }
.ss-header.is-scrolled .ss-header__cta:hover { background: var(--bronze); border-color: var(--bronze); color: var(--charcoal); }
.ss-menu { position: relative; z-index: 2; display: none; align-items: center; gap: 12px; min-height: 44px; padding: 0 2px; border: 0; background: none; color: inherit; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.ss-menu__icon { display: grid; gap: 6px; width: 26px; }
.ss-menu__icon i { display: block; height: 1.5px; background: currentColor; transition: transform .4s var(--ease); }
.ss-header.is-open .ss-menu__icon i:first-child { transform: translateY(3.75px) rotate(45deg); }
.ss-header.is-open .ss-menu__icon i:last-child { transform: translateY(-3.75px) rotate(-45deg); }

@media (max-width: 1023px) {
  .ss-menu { display: inline-flex; }
  .ss-nav { position: fixed; inset: 0; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; padding: 172px var(--f-gutter) 40px; background: var(--charcoal); color: var(--ivory); overflow-y: auto; visibility: hidden; opacity: 0; transition: opacity .45s var(--ease), visibility 0s linear .45s; }
  .ss-nav.is-open { visibility: visible; opacity: 1; transition: opacity .45s var(--ease); }
  .ss-nav__list { flex-direction: column; gap: 4px; }
  .ss-nav__list a { gap: 16px; padding: 10px 0; font-stretch: 125%; font-size: clamp(34px, 9vw, 64px); font-weight: 520; letter-spacing: -.01em; line-height: 1.05; }
  .ss-nav__list a::after { display: none; }
  .ss-nav__num { font-size: 13px; color: var(--bronze-soft) !important; }
  .ss-nav.is-open .ss-nav__list li { animation: ss-rise .8s var(--ease) both; }
  .ss-nav.is-open .ss-nav__list li:nth-child(2) { animation-delay: .06s; }
  .ss-nav.is-open .ss-nav__list li:nth-child(3) { animation-delay: .12s; }
  .ss-nav.is-open .ss-nav__list li:nth-child(4) { animation-delay: .18s; }
  .ss-nav__extra { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 24px; padding-top: 32px; border-top: 1px solid var(--line-dark); color: var(--muted-dark); font-size: 15px; }
  .ss-header.is-open { color: var(--ivory); }
  .ss-header.is-open .ss-logo__mark { color: var(--bronze-soft); }
  .ss-header.is-open .ss-logo__amp { color: var(--bronze-soft); }
}
@media (max-width: 379px) {
  .ss-menu [data-nav-label] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .ss-menu { padding: 0 6px; }
}
@media (max-width: 640px) {
  .ss-header__cta { display: none !important; }
  .ss-header__inner { gap: 16px; min-height: 72px; }
  .ss-logo { gap: 10px; }
  .ss-logo__mark { width: 22px; height: 22px; }
  .ss-logo__word { font-size: 12px; letter-spacing: .08em; }
  .ss-hero__kicker { font-size: 11px; letter-spacing: .16em; }
  .ss-concept__inner { font-size: 11px; }
  .ss-concept__inner p { flex: 1; }
}

/* Hero --------------------------------------------------------------------- */
.ss-hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: max(640px, 100svh); max-height: 1100px; padding: 170px 0 clamp(36px, 6vw, 72px); overflow: hidden; background: #1E1C19; color: var(--ivory); isolation: isolate; }
.ss-hero__media { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.ss-hero__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 14, 13, .66) 0%, rgba(14, 14, 13, 0) 30%), linear-gradient(90deg, rgba(14, 14, 13, .5) 0%, rgba(14, 14, 13, 0) 62%), linear-gradient(0deg, rgba(14, 14, 13, .88) 0%, rgba(14, 14, 13, .5) 40%, rgba(14, 14, 13, .1) 72%); }
.ss-hero__picture { width: 100%; height: 100%; animation: ss-settle 2.6s var(--ease) both; }
.ss-hero__picture img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; --f-pscale: 1.1; }
@keyframes ss-settle { from { transform: scale(1.08); } to { transform: none; } }
.ss-hero__kicker { margin-bottom: clamp(18px, 2.4vw, 28px); color: #EDE6DA; animation: ss-fade 1.2s .2s var(--ease) both; }
.ss-hero__kicker::before { content: ""; display: inline-block; width: 28px; height: 1px; margin: 0 14px 4px 0; background: var(--bronze-soft); vertical-align: middle; }
.ss-hero__title { font-stretch: 125%; font-weight: 540; text-transform: uppercase; font-size: clamp(32px, 9.6vw, 146px); line-height: .9; letter-spacing: -.03em; }
.ss-line { display: block; overflow: hidden; padding-bottom: .04em; }
.ss-line > span { display: inline-block; animation: ss-rise 1.2s var(--ease) both; }
.ss-line + .ss-line > span { animation-delay: .12s; }
@keyframes ss-rise { from { transform: translateY(105%); } to { transform: none; } }
@keyframes ss-fade { from { opacity: 0; } to { opacity: 1; } }
.ss-hero__foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px 48px; margin-top: clamp(24px, 3.4vw, 44px); padding-top: clamp(22px, 3vw, 32px); border-top: 1px solid rgba(243, 238, 230, .28); animation: ss-fade 1.2s .45s var(--ease) both; }
.ss-hero__lede { max-width: 30ch; font-family: var(--serif); font-style: italic; font-weight: 300; font-size: clamp(21px, 2.1vw, 30px); line-height: 1.3; color: #EDE6DA; }
.ss-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; }
.ss-hero__scroll { position: absolute; right: var(--f-gutter); bottom: clamp(36px, 6vw, 72px); display: none; }
@media (min-width: 1280px) {
  .ss-hero__foot { margin-right: 90px; }
  .ss-hero__scroll { display: grid; justify-items: center; gap: 12px; color: var(--ivory); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; text-decoration: none; writing-mode: vertical-rl; }
  .ss-hero__scroll i { display: block; width: 1px; height: 64px; background: linear-gradient(var(--ivory), var(--ivory)) top / 1px 40% no-repeat, rgba(243, 238, 230, .25); animation: ss-scroll 2.4s var(--ease) infinite; }
}
@keyframes ss-scroll { 0% { background-position: 0 -40%; } 100% { background-position: 0 160%; } }
@media (max-width: 700px) {
  .ss-hero { padding-top: 150px; }
  .ss-hero__foot { grid-template-columns: 1fr; }
  .ss-hero__actions .ss-btn { width: 100%; }
}

/* Sections ------------------------------------------------------------------- */
.ss-section { padding-block: clamp(84px, 11vw, 168px); }
.ss-frame { overflow: hidden; background: var(--ivory-2); }
.ss-frame img { width: 100%; height: 100%; object-fit: cover; }
.ss-head { margin-bottom: clamp(40px, 6vw, 80px); }
.ss-head--split { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 28px 48px; }
.ss-head__aside { max-width: 38ch; color: var(--muted); }

/* Introduction */
.ss-intro__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: clamp(36px, 5vw, 64px); }
.ss-intro__label { grid-column: 1 / -1; margin: 0; }
.ss-intro__title { grid-column: 1 / -1; }
.ss-intro__body { grid-column: 1 / -1; display: grid; gap: 22px; align-content: start; max-width: 52ch; color: var(--muted); }
.ss-intro__body .ss-link { justify-self: start; margin-top: 10px; color: var(--charcoal); }
.ss-intro__media { position: relative; grid-column: 1 / -1; }
.ss-intro__main { aspect-ratio: 4 / 5; }
.ss-intro__main img { --f-pscale: 1.14; }
.ss-intro__inset { position: absolute; left: -6%; bottom: 12%; width: 42%; aspect-ratio: 1; border: 10px solid var(--ivory); }
@media (min-width: 700px) {
  .ss-intro__body { grid-column: 1 / 8; }
  .ss-intro__media { grid-column: 4 / -1; }
}
@media (min-width: 1024px) {
  .ss-intro__label { grid-column: 1 / 4; padding-top: 1.1em; }
  .ss-intro__title { grid-column: 4 / -1; }
  .ss-intro__body { grid-column: 4 / 8; padding-top: 40px; }
  .ss-intro__media { grid-column: 8 / -1; }
  .ss-intro__inset { left: -32%; bottom: 14%; width: 46%; }
}
@media (max-width: 699px) {
  .ss-intro__media { margin-left: 18%; }
  .ss-intro__inset { left: -22%; width: 48%; border-width: 8px; }
}

/* Services */
.ss-services { padding-block: clamp(84px, 11vw, 168px); background: var(--charcoal); color: var(--ivory); }
.ss-services__grid { display: grid; gap: 48px; }
.ss-services__list { border-bottom: 1px solid var(--line-dark); counter-reset: none; }
.ss-service { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 8px 16px; padding: clamp(26px, 3vw, 38px) 0; border-top: 1px solid var(--line-dark); }
.ss-service__num { padding-top: .5em; font-size: 12px; letter-spacing: .14em; color: var(--bronze-soft); }
.ss-service h3 { font-stretch: 125%; font-weight: 500; text-transform: uppercase; font-size: clamp(22px, 2.5vw, 36px); line-height: 1.05; letter-spacing: -.01em; transition: color .5s var(--ease); }
.ss-service p { max-width: 46ch; margin-top: 12px; color: var(--muted-dark); }
.ss-service__img { grid-column: 2; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; margin-top: 18px; }
.ss-services__stage { display: none; }
@media (min-width: 1024px) {
  .ss-services__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(48px, 6vw, 96px); align-items: start; }
  .ss-service { grid-template-columns: 72px minmax(0, 1fr); cursor: default; }
  .ss-service__img { display: none; }
  .ss-service h3 { color: #8F897F; }
  .ss-service p { opacity: .6; transition: opacity .5s var(--ease); }
  .ss-service.is-active h3 { color: var(--ivory); }
  .ss-service.is-active p { opacity: 1; }
  .ss-service.is-active .ss-service__num { color: var(--bronze); }
  .ss-services__stage { position: sticky; top: 110px; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--graphite); }
  .ss-services__stage figure { position: absolute; inset: 0; opacity: 0; transform: scale(1.05); transition: opacity .8s var(--ease), transform 1.4s var(--ease); }
  .ss-services__stage figure.is-active { opacity: 1; transform: none; }
  .ss-services__stage img { width: 100%; height: 100%; object-fit: cover; }
}

/* Work gallery */
.ss-work__tools { display: grid; gap: 10px; }
.ss-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.ss-filters button { min-height: 44px; padding: 0 18px; border: 1px solid var(--line); background: transparent; color: var(--charcoal); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; transition: background-color .3s var(--ease), color .3s var(--ease), border-color .3s; }
.ss-filters button:hover { border-color: var(--charcoal); }
.ss-filters button[aria-pressed="true"] { background: var(--charcoal); border-color: var(--charcoal); color: var(--ivory); }
.ss-gallery { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(36px, 4vw, 56px) clamp(16px, 2vw, 24px); }
.ss-tile { grid-column: 1 / -1; }
.ss-tile a { display: block; text-decoration: none; }
.ss-tile__img { display: block; overflow: hidden; background: var(--ivory-2); aspect-ratio: 4 / 3; }
.ss-tile--tall .ss-tile__img { aspect-ratio: 4 / 5; }
.ss-tile__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), filter .6s var(--ease); }
.ss-tile a:hover .ss-tile__img img, .ss-tile a:focus-visible .ss-tile__img img { transform: scale(1.045); }
.ss-tile__meta { display: grid; gap: 4px; padding-top: 16px; font-size: 14px; color: var(--muted); }
.ss-tile__title { position: relative; font-stretch: 125%; font-weight: 600; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; color: var(--charcoal); }
.ss-tile__title::after { content: "\2197"; display: inline-block; margin-left: 10px; color: var(--bronze-ink); opacity: 0; transform: translate(-4px, 4px); transition: opacity .4s var(--ease), transform .4s var(--ease); }
.ss-tile a:hover .ss-tile__title::after, .ss-tile a:focus-visible .ss-tile__title::after { opacity: 1; transform: none; }
.ss-work__note { margin-top: clamp(40px, 5vw, 64px); }
@media (min-width: 700px) {
  .ss-tile { grid-column: span 6; }
  .ss-tile__img, .ss-tile--tall .ss-tile__img { aspect-ratio: auto; height: clamp(300px, 44vw, 460px); }
}
@media (min-width: 1024px) {
  .ss-tile--wide { grid-column: span 8; }
  .ss-tile--tall { grid-column: span 4; }
  .ss-tile--half { grid-column: span 6; }
  .ss-tile__img, .ss-tile--tall .ss-tile__img { height: clamp(360px, 38vw, 580px); }
  .ss-gallery:not([data-filter-active="all"]) .ss-tile { grid-column: span 4; }
  .ss-gallery:not([data-filter-active="all"]) .ss-tile__img { height: clamp(320px, 30vw, 460px); }
}

/* Process */
.ss-process { background: var(--ivory-2); }
.ss-process__grid { display: grid; gap: clamp(48px, 6vw, 96px); }
.ss-process__lede { max-width: 42ch; margin: 28px 0 36px; color: var(--muted); }
.ss-steps { position: relative; display: grid; gap: clamp(40px, 5vw, 64px); }
.ss-steps::before, .ss-steps::after { content: ""; position: absolute; left: 18px; top: 18px; bottom: 18px; width: 1px; background: var(--line); }
.ss-steps::after { width: 2px; left: 17.5px; background: var(--bronze); transform-origin: top; transform: scaleY(var(--f-progress, 0)); }
.ss-step { position: relative; padding-left: 76px; }
.ss-step__num { position: absolute; left: 0; top: 0; z-index: 1; display: grid; place-items: center; width: 37px; height: 37px; border: 1px solid var(--bronze); background: var(--ivory-2); color: var(--bronze-ink); font-size: 12px; font-weight: 600; letter-spacing: .06em; }
.ss-step h3 { padding-top: 4px; font-stretch: 125%; font-weight: 520; text-transform: uppercase; font-size: clamp(22px, 2.4vw, 32px); line-height: 1.05; }
.ss-step p { max-width: 46ch; margin-top: 12px; color: var(--muted); }
@media (min-width: 1024px) {
  .ss-process__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; }
  .ss-process__intro { position: sticky; top: 130px; }
  .ss-steps { padding-top: 12px; }
}

/* Standards and credentials */
.ss-standards { background: var(--paper); }
.ss-standards__grid { display: grid; gap: clamp(40px, 5vw, 64px); }
.ss-commitments { display: grid; gap: 0 clamp(24px, 3vw, 48px); }
.ss-commitments li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 18px; padding: 30px 0; border-top: 1px solid var(--line); }
.ss-commitments__key { font-family: var(--serif); font-style: italic; font-weight: 300; font-size: 40px; line-height: .9; color: var(--bronze-ink); }
.ss-commitments h3 { font-size: 19px; font-weight: 600; line-height: 1.3; }
.ss-commitments p { margin-top: 8px; color: var(--muted); font-size: 16px; }
.ss-credentials { align-self: start; padding: clamp(32px, 4vw, 52px); background: var(--charcoal); color: var(--ivory); }
.ss-credentials .ss-kicker { color: var(--bronze-soft); }
.ss-credentials dl { margin-top: 26px; }
.ss-credentials dl > div { display: grid; gap: 4px; padding: 18px 0; border-top: 1px solid var(--line-dark); }
.ss-credentials dt { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted-dark); }
.ss-credentials dd { font-family: var(--serif); font-style: italic; font-weight: 300; font-size: 22px; line-height: 1.3; }
.ss-credentials__note { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line-dark); font-size: 14px; line-height: 1.6; color: var(--muted-dark); }
@media (min-width: 700px) { .ss-commitments { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .ss-standards__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); align-items: start; } }

/* Closing CTA and form */
.ss-cta { padding-block: clamp(84px, 11vw, 160px); background: var(--charcoal); color: var(--ivory); }
.ss-cta__grid { display: grid; gap: clamp(48px, 6vw, 88px); }
.ss-cta__title { font-stretch: 125%; font-weight: 540; text-transform: uppercase; font-size: clamp(32px, 4.6vw, 72px); line-height: .94; letter-spacing: -.03em; }
.ss-cta__title span { display: block; color: var(--bronze-soft); }
.ss-cta__lede { max-width: 42ch; margin-top: 30px; color: var(--muted-dark); font-size: 18px; }
.ss-contact { display: grid; margin-top: 40px; border-top: 1px solid var(--line-dark); }
.ss-contact > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line-dark); }
.ss-contact dt { padding-top: 3px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted-dark); }
.ss-contact dd { overflow-wrap: anywhere; }
.ss-form-card { align-self: start; padding: clamp(28px, 4vw, 56px); background: var(--ivory); color: var(--charcoal); }
.ss-form { display: grid; gap: 24px; }
.ss-form__title { font-stretch: 125%; font-weight: 540; text-transform: uppercase; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.05; }
.ss-form__note { margin-top: -12px; font-size: 14px; color: var(--muted); }
.ss-field { display: grid; gap: 8px; }
.ss-field-row { display: grid; gap: 24px; }
.ss-field label { font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.ss-optional { font-weight: 400; letter-spacing: .04em; text-transform: none; color: var(--muted); }
.ss-field input, .ss-field select, .ss-field textarea { width: 100%; min-height: 50px; padding: 12px 0; border: 0; border-bottom: 1px solid rgba(25, 25, 24, .38); border-radius: 0; background: transparent; font-size: 17px; line-height: 1.4; transition: border-color .3s; }
.ss-field textarea { resize: vertical; min-height: 110px; }
.ss-field select { appearance: none; padding-right: 32px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23191918' stroke-width='1.6'/%3E%3C/svg%3E") right 4px center / 14px 9px no-repeat; }
.ss-field input:hover, .ss-field select:hover, .ss-field textarea:hover { border-bottom-color: var(--charcoal); }
.ss-field input:focus-visible, .ss-field select:focus-visible, .ss-field textarea:focus-visible { outline: 2px solid var(--bronze); outline-offset: 4px; border-bottom-color: var(--charcoal); }
.ss-field [aria-invalid="true"] { border-bottom: 2px solid var(--error); }
.ss-field .f-error { color: var(--error); font-weight: 500; }
.ss-field ::placeholder { color: #8A857D; }
.ss-form__submit { justify-self: start; margin-top: 6px; }
.ss-form-success { display: grid; gap: 16px; outline: none; }
.ss-form-success .ss-kicker { color: var(--bronze-ink); }
.ss-form-success h3 { font-stretch: 125%; font-weight: 540; text-transform: uppercase; font-size: clamp(28px, 3vw, 40px); line-height: 1; }
.ss-form-success p:not(.ss-kicker) { color: var(--muted); }
.ss-form-success .ss-link { justify-self: start; cursor: pointer; }
@media (min-width: 560px) { .ss-field-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 559px) { .ss-form__submit { width: 100%; padding: 0 18px; letter-spacing: .12em; } }
@media (min-width: 1024px) {
  .ss-cta__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: start; }
  .ss-form-card { position: sticky; top: 110px; }
}

/* Footer */
.ss-footer { padding: clamp(72px, 9vw, 120px) 0 32px; background: #121211; color: var(--ivory); }
.ss-footer__brand { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 20px; padding-bottom: clamp(40px, 5vw, 64px); border-bottom: 1px solid var(--line-dark); }
.ss-footer__word { font-stretch: 125%; font-weight: 540; text-transform: uppercase; font-size: clamp(34px, 7.2vw, 108px); line-height: .92; letter-spacing: -.03em; }
.ss-footer__word span { font-family: var(--serif); font-style: italic; font-weight: 300; text-transform: none; color: var(--bronze-soft); }
.ss-footer__tag { font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--muted-dark); }
.ss-footer__cols { display: grid; gap: 36px 28px; padding-block: clamp(40px, 5vw, 64px); color: var(--muted-dark); font-size: 15px; }
.ss-footer__h { margin-bottom: 14px; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ivory); }
.ss-footer__cols ul { display: grid; gap: 6px; }
.ss-footer__cols a:not(.ss-link) { text-decoration: none; }
.ss-footer__cols a:not(.ss-link):hover { color: var(--ivory); text-decoration: underline; text-underline-offset: 4px; }
.ss-footer__cols .ss-link { margin-top: 16px; }
.ss-credits { padding: 22px 0; border-top: 1px solid var(--line-dark); color: var(--muted-dark); font-size: 13px; }
.ss-credits summary { cursor: pointer; min-height: 32px; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ivory); }
.ss-credits p { margin-top: 14px; max-width: 80ch; }
.ss-credits ul { display: grid; gap: 6px 24px; margin-top: 14px; }
.ss-credits a { color: var(--ivory); text-underline-offset: 3px; }
.ss-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 22px; border-top: 1px solid var(--line-dark); color: var(--muted-dark); font-size: 13px; }
.ss-footer__bottom a { color: var(--ivory); text-decoration: none; }
@media (min-width: 700px) {
  .ss-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-credits ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .ss-footer__cols { grid-template-columns: 1fr 1fr 1.2fr 1.5fr; }
  .ss-credits ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}