.it-field {
  --it-field-accent: var(--it-oxide);
  color: var(--it-basalt);
  background:
    linear-gradient(90deg, transparent 0 31px, rgba(32, 40, 37, .032) 31px 32px),
    var(--it-travertine);
}

.it-field[data-it-structure='rail-to-street-braid'] { --it-field-accent: var(--it-rail); }
.it-field[data-it-structure='lagoon-waterline'] { --it-field-accent: var(--it-lagoon); }
.it-field[data-it-structure='hill-town-section'] { --it-field-accent: var(--it-ochre); }
.it-field[data-it-structure='ztl-threshold-ring'] { --it-field-accent: var(--it-oxide); }
.it-field[data-it-structure='excavation-traverse'] { --it-field-accent: #8d5a3d; }
.it-field[data-it-structure='coast-capacity-braid'] { --it-field-accent: var(--it-lagoon); }
.it-field[data-it-structure='island-return-billet'] { --it-field-accent: var(--it-rail); }
.it-field[data-it-structure='summit-operating-stack'] { --it-field-accent: var(--it-olive); }
.it-field[data-it-structure='two-shore-clock'] { --it-field-accent: var(--it-lagoon); }
.it-field[data-it-structure='piazza-circuit'] { --it-field-accent: var(--it-oxide); }
.it-field[data-it-structure='collection-attention-spread'] { --it-field-accent: var(--it-rail); }
.it-field[data-it-structure='market-daypart-table'] { --it-field-accent: var(--it-ochre); }
.it-field[data-it-structure='living-sacred-threshold'] { --it-field-accent: var(--it-oxide); }
.it-field[data-it-structure='volcano-status-board'] { --it-field-accent: #904f3e; }
.it-field[data-it-structure='road-stage-folio'] { --it-field-accent: var(--it-olive); }

.it-field * { box-sizing: border-box; }
.it-field section { scroll-margin-top: 88px; }
.it-field h1,
.it-field h2,
.it-field h3 { color: var(--it-basalt); font-family: var(--it-display); overflow-wrap: anywhere; }

.it-field :where(a, button, summary):focus-visible {
  outline: 3px solid var(--it-ochre);
  outline-offset: 4px;
}

.it-field .button.primary { color: #fff; border-color: var(--it-lagoon); background: var(--it-lagoon); box-shadow: 0 10px 24px rgba(32, 40, 37, .14); }
.it-field .button.primary:hover { background: #28595b; }
.it-field .button.secondary { color: var(--it-basalt); border-color: var(--it-line-strong); background: rgba(250, 247, 240, .94); }

.it-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .7rem;
  align-items: center;
  padding: 1.2rem clamp(1rem, 5vw, 5rem);
  color: #53605a;
  border-bottom: 1px solid var(--it-line);
  background: var(--it-plaster);
  font-size: .78rem;
}
.it-breadcrumb a { color: #275b5d; text-decoration: none; }
.it-breadcrumb strong { color: var(--it-basalt); }

.it-field .it-kicker,
.it-decision-instrument > header > span,
.it-threshold-board article > span,
.it-regional-strata > header > span,
.it-route-folio > header > span,
.it-live-desk span,
.it-fallback span,
.it-breakpoints > header > span,
.it-related > header > span,
.it-faq > header > span {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  color: var(--it-field-accent);
  font: 800 .71rem/1.25 var(--it-label);
  font-variant-caps: all-small-caps;
  letter-spacing: .12em;
}

.it-field .it-kicker::before,
.it-decision-instrument > header > span::before,
.it-regional-strata > header > span::before,
.it-route-folio > header > span::before,
.it-live-desk span::before,
.it-fallback span::before,
.it-breakpoints > header > span::before,
.it-related > header > span::before,
.it-faq > header > span::before {
  content: '';
  width: 1.55rem;
  height: 2px;
  background: currentColor;
}

/* Field hero: indexed slab plus offset photograph, never a symmetrical half-screen. */
.it-field-hero {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: minmax(710px, auto);
  gap: 1rem;
  min-height: 760px;
  padding: 2rem clamp(1.2rem, 4vw, 4rem) 3.5rem;
  overflow: hidden;
  isolation: isolate;
  border-bottom: 1px solid var(--it-line);
  background:
    linear-gradient(90deg, transparent 0 58%, rgba(32, 40, 37, .07) 58% 58.15%, transparent 58.15%),
    repeating-linear-gradient(0deg, transparent 0 67px, rgba(32, 40, 37, .045) 67px 68px),
    var(--it-plaster);
}

.it-field-index {
  z-index: 4;
  grid-column: 1 / 2;
  grid-row: 1;
  align-self: start;
  display: grid;
  gap: .65rem;
  justify-items: start;
  min-width: 0;
  padding: 1rem .7rem;
  border-top: 4px solid var(--it-field-accent);
}
.it-field-index span { writing-mode: vertical-rl; color: #4e5a55; font: 800 .68rem/1.2 var(--it-label); letter-spacing: .09em; }
.it-field-index b { color: var(--it-field-accent); font: 800 1.35rem/1 ui-monospace, SFMono-Regular, Consolas, monospace; }

.it-field-copy {
  z-index: 3;
  grid-column: 2 / 8;
  grid-row: 1;
  align-self: center;
  min-width: 0;
  padding: clamp(2rem, 4.8vw, 4.7rem) clamp(1rem, 3.3vw, 3.3rem);
}
.it-field-copy h1 {
  margin: .8rem 0 1.2rem;
  max-width: 14ch;
  font-size: clamp(3.5rem, 6.2vw, 7rem);
  font-weight: 500;
  line-height: .82;
  letter-spacing: -.06em;
  overflow-wrap: anywhere;
  hyphens: auto;
}
.it-field-copy > p { max-width: 42rem; font-size: 1.06rem; line-height: 1.78; }

.it-purpose {
  max-width: 44rem;
  margin: 1.5rem 0;
  padding: 1.25rem 1.35rem;
  border-left: 6px solid var(--it-field-accent);
  border-radius: 0 .35rem .35rem 0;
  background: rgba(239, 231, 216, .72);
}
.it-purpose small,
.it-purpose strong { display: block; }
.it-purpose small { color: #44524c; font: 800 .66rem/1.25 var(--it-label); font-variant-caps: all-small-caps; letter-spacing: .1em; }
.it-purpose strong { margin-top: .6rem; font: 600 1.05rem/1.55 var(--it-display); }

.it-field-hero figure {
  position: relative;
  z-index: 1;
  grid-column: 8 / 13;
  grid-row: 1;
  min-width: 0;
  min-height: 650px;
  margin: 3.5rem 0 1.5rem;
  overflow: hidden;
  border: 1px solid var(--it-line-strong);
  border-radius: .45rem;
  background: var(--it-basalt);
  box-shadow: 0 24px 46px rgba(32, 40, 37, .18);
}
.it-field-hero figure::before { content: ''; position: absolute; z-index: 2; inset: 1rem; border: 1px solid rgba(250, 247, 240, .72); pointer-events: none; }
.it-field-hero img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.86) contrast(1.04); }
.it-field-hero figcaption { position: absolute; z-index: 3; top: 1rem; right: 1rem; bottom: auto; left: 1rem; padding: .55rem .7rem; color: #fff; background: rgba(21, 28, 26, .84); font-size: .68rem; line-height: 1.35; overflow-wrap: anywhere; }

.it-instrument-tab {
  z-index: 5;
  grid-column: 7 / 11;
  grid-row: 1;
  align-self: end;
  justify-self: start;
  display: grid;
  gap: .32rem;
  min-width: 280px;
  margin-bottom: .35rem;
  padding: 1rem 1.2rem;
  color: #fff;
  border-radius: .3rem;
  background: var(--it-basalt);
  box-shadow: 0 14px 28px rgba(21, 28, 26, .24);
}
.it-instrument-tab small { color: #edca89; font: 800 .64rem/1.3 var(--it-label); letter-spacing: .06em; overflow-wrap: anywhere; }
.it-instrument-tab strong { font: 600 1.08rem/1.25 var(--it-display); }
.it-instrument-tab span { color: #d5ded8; font-size: .64rem; }

.it-decision-instrument,
.it-threshold-board,
.it-regional-strata,
.it-route-folio,
.it-live-desk,
.it-fallback,
.it-breakpoints,
.it-related,
.it-faq {
  padding: clamp(4rem, 7vw, 7rem) clamp(1.2rem, 5vw, 5rem);
}

.it-decision-instrument > header,
.it-regional-strata > header,
.it-route-folio > header,
.it-breakpoints > header,
.it-related > header,
.it-faq > header {
  max-width: 1080px;
  margin: 0 auto 2.6rem;
}
.it-decision-instrument > header h2,
.it-regional-strata > header h2,
.it-route-folio > header h2,
.it-breakpoints > header h2,
.it-related > header h2,
.it-faq > header h2 {
  max-width: 18ch;
  margin: .7rem 0 .85rem;
  font-size: clamp(2.25rem, 4.6vw, 4.65rem);
  font-weight: 500;
  line-height: .93;
  letter-spacing: -.04em;
}
.it-decision-instrument > header p,
.it-regional-strata > header p,
.it-route-folio > header p { max-width: 58rem; line-height: 1.72; }

.it-decision-instrument { overflow: hidden; background: var(--it-travertine); }
.it-decision-instrument article { min-width: 0; }
.it-decision-instrument article > b { color: var(--it-field-accent); font: 800 1rem/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.it-decision-instrument article h3 { margin: .65rem 0 .65rem; font-size: 1.45rem; line-height: 1.06; }
.it-decision-instrument article p { margin: 0; line-height: 1.66; }

/* 01 — booked door: sequential reservation docket. */
.it-scoreboard {
  counter-reset: it-door;
  display: grid;
  gap: .75rem;
  max-width: 1040px;
  margin: 0 auto;
  padding: 1rem;
  list-style: none;
  border: 1px solid var(--it-line-strong);
  border-radius: .35rem;
  background: var(--it-basalt);
}
.it-scoreboard li {
  counter-increment: it-door;
  position: relative;
  display: grid;
  grid-template-columns: 115px 1fr;
  align-items: stretch;
  background: var(--it-plaster);
}
.it-scoreboard li::before { content: 'SLOT ' counter(it-door, decimal-leading-zero); display: grid; place-items: center; color: #fff; background: var(--it-field-accent); font: 800 .72rem/1 var(--it-label); letter-spacing: .1em; }
.it-scoreboard article { padding: 1.6rem 1.8rem; border-left: 1px dashed var(--it-line-strong); }
.it-scoreboard article > b { float: right; }

/* 02 — rail braid: three staggered lanes joined by one track. */
.it-braid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(150px, auto));
  gap: .7rem;
  max-width: 1120px;
  margin: 0 auto;
  padding: 1.4rem 0;
}
.it-braid > i { position: absolute; z-index: 0; top: 50%; right: 6%; left: 4%; height: 5px; transform: rotate(-4deg); background: var(--it-rail); }
.it-braid article { z-index: 1; padding: 1.5rem; border: 1px solid var(--it-line); border-left: 7px solid var(--it-rail); border-radius: .25rem; background: var(--it-plaster); box-shadow: 0 12px 25px rgba(32, 40, 37, .08); }
.it-braid article[data-lane='1'] { grid-column: 1 / 7; grid-row: 1; }
.it-braid article[data-lane='2'] { grid-column: 4 / 10; grid-row: 2; }
.it-braid article[data-lane='3'] { grid-column: 7 / 13; grid-row: 3; }
.it-braid > aside { z-index: 2; grid-column: 1 / 5; grid-row: 3; align-self: end; padding: .9rem 1rem; color: #fff; border-radius: .25rem; background: var(--it-basalt); font: 700 .75rem/1.45 var(--it-label); }

/* 03 — lagoon: one outward waterline feeding two island rooms and a return quay. */
.it-waterline {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 1rem;
  max-width: 1080px;
  margin: 0 auto;
  padding: 1.2rem;
  border: 1px solid rgba(50, 106, 108, .45);
  border-radius: .4rem;
  background:
    repeating-linear-gradient(0deg, rgba(50, 106, 108, .08) 0 2px, transparent 2px 24px),
    #dfe9e5;
}
.it-water-out { display: grid; align-content: center; min-height: 390px; padding: 2rem; color: #fff; background: var(--it-lagoon); }
.it-water-out > span,
.it-shore-clock section > span { color: #fff0c5; font: 800 .68rem/1.25 var(--it-label); letter-spacing: .1em; }
.it-water-out article h3,
.it-water-out article p { color: #fff; }
.it-water-out article > b,
.it-shore-clock > section article > b,
.it-collection-spread > section article > b,
.it-summit-stack li:nth-child(3) article > b,
.it-daypart-table [role='cell']:nth-child(3) article > b,
.it-status-board > section[data-status='CLOSED-DAY'] article > b { color: #fff0c5; }
.it-water-islands { display: grid; gap: 1rem; }
.it-water-islands article { padding: 1.6rem; border: 1px solid rgba(50, 106, 108, .32); background: var(--it-plaster); }
.it-waterline > aside { grid-column: 1 / -1; padding: .85rem 1rem; color: #fff; background: var(--it-rail); font: 700 .75rem/1.4 var(--it-label); text-align: center; }

/* 04 — hill town: the choices visibly climb. */
.it-hill-steps { display: grid; gap: 0; max-width: 1080px; margin: 0 auto; padding: 0; list-style: none; }
.it-hill-steps li { width: calc(100% - var(--step) * 10%); margin-left: calc(var(--step) * 10%); border-left: 5px solid var(--it-ochre); border-bottom: 1px solid var(--it-line); background: var(--it-plaster); }
.it-hill-steps li::before { content: ''; display: block; width: calc(3rem + var(--step) * 2rem); height: .6rem; background: color-mix(in srgb, var(--it-ochre) 45%, var(--it-travertine)); }
.it-hill-steps article { display: grid; grid-template-columns: 65px minmax(190px, .45fr) 1fr; gap: 1rem; align-items: start; padding: 1.5rem 1.7rem; }
.it-hill-steps article h3,
.it-hill-steps article p { margin-top: 0; }

/* 05 — ZTL: nested legal and walking thresholds, not a fake street map. */
.it-rings { position: relative; display: grid; justify-items: center; gap: .55rem; max-width: 1080px; margin: 0 auto; padding: 1rem 0 4.5rem; }
.it-ring { padding: 1.45rem; border: 2px solid var(--it-field-accent); border-radius: 1.25rem; background: rgba(250, 247, 240, .92); }
.it-ring-1 { width: 100%; border-style: dashed; }
.it-ring-2 { width: 82%; border-color: var(--it-ochre); }
.it-ring-3 { width: 64%; border-color: var(--it-olive); border-width: 5px; }
.it-ring article { display: grid; grid-template-columns: 55px minmax(190px, .42fr) 1fr; gap: 1rem; }
.it-ring article h3,
.it-ring article p { margin-top: 0; }
.it-ring-core { position: absolute; bottom: .8rem; padding: .75rem 1rem; color: #fff; border-radius: 999px; background: var(--it-basalt); font: 800 .7rem/1 var(--it-label); letter-spacing: .1em; }

/* 06 — excavation: a horizontal datum with offset evidence strata. */
.it-traverse {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  max-width: 1120px;
  min-height: 430px;
  margin: 0 auto;
  padding: 4rem 1rem 1rem;
  border-bottom: 12px solid #8d5a3d;
  background: linear-gradient(180deg, #f6f0e5 0 35%, #e7d8c3 35% 62%, #cdb397 62% 100%);
}
.it-datum { position: absolute; top: 1rem; right: 1rem; left: 1rem; padding-bottom: .55rem; border-bottom: 2px solid var(--it-basalt); font: 800 .68rem/1 var(--it-label); letter-spacing: .12em; }
.it-traverse article { align-self: start; padding: 1.5rem; border: 1px solid var(--it-line-strong); background: rgba(250, 247, 240, .94); box-shadow: 0 12px 25px rgba(83, 58, 39, .08); }
.it-traverse article[data-stratum='2'] { margin-top: 3.2rem; }
.it-traverse article[data-stratum='3'] { margin-top: 6.4rem; }

/* 07 — coast: parallel capacity modes with a protected return column. */
.it-coast-braid { display: grid; grid-template-columns: 1fr minmax(180px, .28fr); gap: .7rem; max-width: 1100px; margin: 0 auto; }
.it-coast-braid > section { grid-column: 1; display: grid; grid-template-columns: 95px 1fr; align-items: stretch; border: 1px solid rgba(50, 106, 108, .3); background: var(--it-plaster); }
.it-coast-braid > section > span { display: grid; place-items: center; padding: .8rem; color: #fff; background: var(--it-lagoon); font: 800 .68rem/1.25 var(--it-label); letter-spacing: .08em; writing-mode: vertical-rl; }
.it-coast-braid > section:nth-child(2) > span { background: var(--it-rail); }
.it-coast-braid > section:nth-child(3) > span { background: var(--it-olive); }
.it-coast-braid article { padding: 1.35rem 1.55rem; }
.it-coast-braid > aside { grid-column: 2; grid-row: 1 / 4; display: grid; place-items: center; padding: 1.2rem; color: #fff; border-radius: .25rem; background: var(--it-basalt); font: 700 .82rem/1.5 var(--it-label); text-align: center; }

/* 08 — island: outward and return columns enclosing the three landing choices. */
.it-billet { display: grid; grid-template-columns: minmax(120px, .22fr) 1fr minmax(120px, .22fr); max-width: 1120px; margin: 0 auto; border: 2px solid var(--it-rail); border-radius: .35rem; background: var(--it-plaster); }
.it-billet > aside { display: grid; align-content: center; justify-items: center; gap: .65rem; padding: 1.2rem; color: #fff; background: var(--it-rail); text-align: center; }
.it-billet > aside:last-child { background: var(--it-basalt); }
.it-billet > aside strong { font: 800 1.6rem/1 var(--it-label); letter-spacing: .1em; }
.it-billet > aside span { font-size: .68rem; line-height: 1.35; }
.it-billet > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.it-billet article { padding: 1.6rem; border-right: 1px dashed var(--it-line-strong); }
.it-billet article:last-child { border-right: 0; }

/* 09 — summit: narrowing operating levels. */
.it-summit-stack { display: grid; justify-items: center; gap: .65rem; max-width: 1080px; margin: 0 auto; padding: 0; list-style: none; }
.it-summit-stack li { width: 100%; display: grid; grid-template-columns: 135px 1fr; color: var(--it-basalt); border: 1px solid var(--it-line); background: var(--it-plaster); }
.it-summit-stack li:nth-child(2) { width: 82%; }
.it-summit-stack li:nth-child(3) { width: 64%; color: #fff; background: var(--it-basalt); }
.it-summit-stack li > span { display: grid; place-items: center; padding: 1rem; color: #fff; background: var(--it-olive); font: 800 .7rem/1.2 var(--it-label); letter-spacing: .1em; text-align: center; }
.it-summit-stack li:nth-child(2) > span { background: var(--it-ochre); }
.it-summit-stack li:nth-child(3) > span { background: var(--it-oxide); }
.it-summit-stack article { padding: 1.5rem 1.7rem; }
.it-summit-stack li:nth-child(3) h3 { color: #fff; }

/* 10 — lake: paired shores above a lower-risk return face. */
.it-shore-clock { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: 1080px; margin: 0 auto; padding: 1.2rem; border: 1px solid rgba(50, 106, 108, .35); border-radius: 1.8rem; background: #dfe9e5; }
.it-shore-clock::before { content: '↻'; position: absolute; z-index: 3; top: 50%; left: 50%; display: grid; place-items: center; width: 4.2rem; height: 4.2rem; transform: translate(-50%, -50%); color: #fff; border: 8px solid #dfe9e5; border-radius: 50%; background: var(--it-lagoon); font: 700 1.4rem/1 var(--it-display); }
.it-shore-clock > section { min-height: 310px; padding: 1.8rem; color: #fff; background: var(--it-lagoon); }
.it-shore-clock > section:nth-child(2) { background: var(--it-rail); }
.it-shore-clock > section h3 { color: #fff; }
.it-shore-clock > aside { grid-column: 1 / -1; padding: 1.5rem 2rem; border-top: 5px solid var(--it-ochre); background: var(--it-plaster); }

/* 11 — piazza: a three-sided loop with explicit direction. */
.it-piazza-circuit { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.2rem; max-width: 1100px; margin: 0 auto; padding: 3rem 1rem; list-style: none; }
.it-piazza-circuit::before { content: ''; position: absolute; inset: 12% 9%; border: 4px solid rgba(164, 71, 52, .3); border-radius: 50%; pointer-events: none; }
.it-piazza-circuit li { position: relative; z-index: 1; min-height: 300px; padding: 1.6rem; border: 1px solid var(--it-line); border-radius: .35rem; background: var(--it-plaster); }
.it-piazza-circuit li:nth-child(2) { margin-top: -2.5rem; }
.it-piazza-circuit li > i { position: absolute; right: -1.75rem; top: 50%; display: grid; place-items: center; width: 2.3rem; height: 2.3rem; color: #fff; border-radius: 50%; background: var(--it-oxide); font-style: normal; }
.it-piazza-circuit li:last-child > i { right: 50%; top: auto; bottom: -2rem; }

/* 12 — collection: one dominant attention commitment beside two smaller alternatives. */
.it-collection-spread { display: grid; grid-template-columns: 1.35fr .65fr; gap: 1rem; max-width: 1100px; margin: 0 auto; }
.it-collection-spread > main,
.it-collection-spread > section { display: grid; align-content: center; min-height: 440px; padding: 2.5rem; color: #fff; border-top: 8px solid var(--it-ochre); background: var(--it-basalt); }
.it-collection-spread > main h3,
.it-collection-spread > section h3 { color: #fff; font-size: clamp(2rem, 3.3vw, 3.2rem); }
.it-collection-spread > aside { display: grid; gap: 1rem; }
.it-collection-spread > aside article { padding: 1.65rem; border: 1px solid var(--it-line); background: var(--it-plaster); }

/* 13 — market: explicit dayparts in a semantic table. */
.it-daypart-table { position: relative; max-width: 1120px; margin: 0 auto; border: 1px solid var(--it-line-strong); border-radius: .35rem; background: var(--it-line-strong); }
.it-daypart-table [role='row'] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; }
.it-daypart-table [role='columnheader'] { padding: .9rem 1rem; color: #fff; background: var(--it-basalt); font: 800 .72rem/1.2 var(--it-label); letter-spacing: .1em; text-align: center; }
.it-daypart-table [role='cell'] { min-width: 0; background: var(--it-plaster); }
.it-daypart-table [role='cell']:nth-child(2) { background: #eadfcd; }
.it-daypart-table [role='cell']:nth-child(3) { color: #fff; background: var(--it-lagoon); }
.it-mobile-daypart { display: none; }
.it-daypart-table article { min-height: 330px; padding: 1.8rem; }
.it-daypart-table [role='cell']:nth-child(3) h3 { color: #fff; }

/* 14 — sacred: visibly nested public, controlled and quiet thresholds. */
.it-sacred-thresholds { display: grid; grid-template-columns: .72fr 1.28fr; gap: 1rem; max-width: 1080px; margin: 0 auto; }
.it-sacred-thresholds > section { min-width: 0; margin: 0; padding: 1.7rem; border: 2px solid var(--it-oxide); border-radius: .35rem; background: rgba(250, 247, 240, .92); }
.it-sacred-thresholds > section:first-child { align-self: center; border-style: dashed; }
.it-sacred-thresholds > section:nth-child(2) { display: grid; gap: 1.3rem; padding: 2.1rem; border-width: 5px; }
.it-sacred-thresholds > section:nth-child(3) { grid-column: 2; margin: -.45rem 1.2rem 0 2.5rem; border-color: var(--it-olive); background: #e8e7da; }
.it-threshold-label { margin: 0; padding: 0 .55rem; color: var(--it-oxide); font: 800 .68rem/1.2 var(--it-label); letter-spacing: .1em; }

/* 15 — volcano: three named operating states, never color alone. */
.it-status-board { display: grid; grid-template-columns: 1.15fr 1fr .85fr; gap: .8rem; max-width: 1120px; margin: 0 auto; }
.it-status-board > section { min-height: 370px; padding: 1.8rem; border: 2px solid var(--it-line-strong); border-top: 10px solid var(--it-olive); background: var(--it-plaster); }
.it-status-board > section[data-status='PARTIAL'] { margin-top: 2rem; border-top-color: var(--it-ochre); border-right-style: dashed; border-left-style: dashed; }
.it-status-board > section[data-status='CLOSED-DAY'] { margin-top: 4rem; color: #fff; border-top-color: var(--it-oxide); background: var(--it-basalt); }
.it-status-board > section > span { font: 800 .7rem/1.2 var(--it-label); letter-spacing: .1em; }
.it-status-board > section[data-status='CLOSED-DAY'] h3 { color: #fff; }

/* 16 — road: three independently operable stage sheets. */
.it-road-folio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; max-width: 1120px; margin: 0 auto; align-items: start; }
.it-road-folio > section { display: grid; grid-template-rows: auto 1fr auto; min-height: 390px; padding: 1.5rem; border: 1px solid var(--it-line); border-radius: .35rem; background: var(--it-plaster); box-shadow: 0 14px 28px rgba(32, 40, 37, .07); }
.it-road-folio > section:nth-child(2) { margin-top: 2.5rem; }
.it-road-folio > section:nth-child(3) { margin-top: 5rem; }
.it-road-folio > section > small { color: var(--it-olive); font: 800 .7rem/1.2 var(--it-label); letter-spacing: .1em; }
.it-road-folio article { padding: 1.15rem 0; }
.it-road-folio footer { padding-top: .8rem; border-top: 1px dashed var(--it-line-strong); color: #4f5a54; font: 700 .68rem/1.3 var(--it-label); }

/* Shared field sections retain the same editorial system without repeating the decision geometry. */
.it-threshold-board {
  display: grid;
  grid-template-columns: 1fr 1fr .72fr;
  gap: 1rem;
  background: var(--it-plaster);
}
.it-threshold-board > article,
.it-threshold-board > aside { min-width: 0; padding: 2rem; border: 1px solid var(--it-line); background: #fffdf8; }
.it-threshold-board > article:first-child { border-top: 6px solid var(--it-rail); }
.it-threshold-board > article:nth-child(2) { border-top: 6px solid var(--it-oxide); }
.it-threshold-board article h2 { margin: .8rem 0; font-size: clamp(1.65rem, 2.8vw, 2.55rem); font-weight: 500; line-height: 1; }
.it-threshold-board article p { line-height: 1.7; }
.it-threshold-board > aside { display: grid; align-content: center; gap: 1.2rem; color: #fff; border: 0; background: var(--it-basalt); }
.it-threshold-board aside div { padding-bottom: 1.1rem; border-bottom: 1px solid rgba(255, 255, 255, .22); }
.it-threshold-board aside div:last-child { padding-bottom: 0; border-bottom: 0; }
.it-threshold-board aside small { color: #f0cc8a; font: 800 .66rem/1.2 var(--it-label); letter-spacing: .09em; }
.it-threshold-board aside p { margin: .55rem 0 0; line-height: 1.62; }

.it-regional-strata { background: #e5dccd; }
.it-regional-strata > div { display: grid; grid-template-columns: 1.2fr .8fr .8fr 1.2fr; gap: 1px; max-width: 1120px; margin: 0 auto; border: 1px solid var(--it-line); background: var(--it-line); }
.it-regional-strata article { min-height: 230px; padding: 1.6rem; background: var(--it-plaster); }
.it-regional-strata article:nth-child(2),
.it-regional-strata article:nth-child(3) { background: #efe7d8; }
.it-regional-strata small,
.it-regional-strata article > h3 { margin: 0; color: var(--it-field-accent); font: 800 .67rem/1.2 var(--it-label); letter-spacing: .1em; }
.it-regional-strata p { line-height: 1.65; }

.it-route-folio { color: #fff; background: var(--it-basalt); }
.it-route-folio h2,
.it-route-folio h3 { color: #fff; }
.it-route-folio > header > span { color: #efcb89; }
.it-route-folio > header p { color: #dce4df; }
.it-route-folio ol {
  position: relative;
  display: grid;
  gap: .7rem;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 0 0 3.4rem;
  list-style: none;
}
.it-route-folio ol::before { content: ''; position: absolute; top: 1.5rem; bottom: 1.5rem; left: 1.55rem; width: 4px; background: var(--it-field-accent); }
.it-route-folio li {
  position: relative;
  display: grid;
  grid-template-columns: 130px minmax(190px, .55fr) 1fr;
  gap: 1rem;
  align-items: start;
  padding: 1.3rem 1.5rem;
  border-left: 5px solid var(--it-field-accent);
  background: rgba(255, 255, 255, .07);
}
.it-route-folio li:nth-child(even) { margin-left: 3rem; background: rgba(255, 255, 255, .11); }
.it-route-folio li > b { position: absolute; left: -5rem; display: grid; place-items: center; width: 3.2rem; height: 3.2rem; color: #fff; border: 6px solid var(--it-basalt); border-radius: 50%; background: var(--it-field-accent); font: 800 .85rem/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.it-route-folio li small { padding-top: .35rem; color: #efcb89; font: 800 .67rem/1.25 var(--it-label); letter-spacing: .08em; }
.it-route-folio li h3 { margin: 0; font-size: 1.35rem; line-height: 1.05; }
.it-route-folio li p { margin: 0; color: #e2e8e4; line-height: 1.62; }

.it-live-desk {
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  gap: 3rem;
  color: #fff;
  background: var(--it-lagoon);
}
.it-live-desk span { color: #fff0c5; }
.it-live-desk h2 { margin: .7rem 0; color: #fff; font-size: clamp(2.2rem, 4.2vw, 4rem); font-weight: 500; line-height: .95; }
.it-live-desk p { line-height: 1.72; }
.it-live-desk ul { display: grid; align-content: center; gap: .65rem; margin: 0; padding: 0; list-style: none; }
.it-live-desk li { padding: .8rem 1rem; border-left: 4px solid #f0cf8e; background: rgba(255, 255, 255, .1); }
.it-live-desk a { color: #fff; }

.it-fallback { display: grid; grid-template-columns: 1.15fr .85fr; gap: 2rem; background: #e3d8c6; }
.it-fallback h2 { max-width: 15ch; margin: .7rem 0; font-size: clamp(2.2rem, 4vw, 3.9rem); font-weight: 500; line-height: .94; }
.it-fallback p { max-width: 50rem; line-height: 1.72; }
.it-fallback blockquote { align-self: center; margin: 0; padding: 2rem; border: 1px solid var(--it-line); border-left: 7px solid var(--it-field-accent); border-radius: .3rem; background: var(--it-plaster); font: 600 1.05rem/1.62 var(--it-display); }

.it-breakpoints { color: #fff; background: var(--it-basalt-deep); }
.it-breakpoints h2,
.it-breakpoints h3 { color: #fff; }
.it-breakpoints > header > span { color: #efc984; }
.it-breakpoints > div { display: grid; grid-template-columns: .85fr 1.3fr .85fr; gap: 1rem; max-width: 1080px; margin: 0 auto; }
.it-breakpoints article { min-height: 270px; padding: 1.8rem; border-top: 6px solid var(--it-field-accent); background: rgba(255, 255, 255, .07); }
.it-breakpoints article:nth-child(2) { margin-top: 2rem; }
.it-breakpoints article:nth-child(3) { margin-top: 4rem; }
.it-breakpoints b { color: #efc984; font: 800 1rem/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.it-breakpoints h3 { margin: 1rem 0 .75rem; font-size: 1.55rem; line-height: 1.06; }
.it-breakpoints p { color: #dce4df; line-height: 1.66; }

.it-related { background: var(--it-plaster); }
.it-related > div { display: grid; grid-template-columns: 1.25fr .75fr; gap: 1rem; max-width: 1100px; margin: 0 auto; }
.it-related a { display: grid; grid-template-columns: .8fr 1.2fr; overflow: hidden; color: inherit; text-decoration: none; border: 1px solid var(--it-line); border-radius: .4rem; background: #fffdf8; }
.it-related a:nth-child(2) { grid-template-columns: 1fr; }
.it-related a:nth-child(2) img { height: 220px; }
.it-related img { width: 100%; height: 100%; min-height: 260px; object-fit: cover; filter: saturate(.84); }
.it-related a > div { min-width: 0; padding: 1.6rem; }
.it-related small { color: var(--it-rail); font: 800 .66rem/1.35 var(--it-label); letter-spacing: .05em; }
.it-related h3 { margin: .65rem 0; font-size: 1.6rem; line-height: 1.04; }
.it-related p { line-height: 1.62; }
.it-related strong { color: var(--it-lagoon); }

.it-faq { display: grid; grid-template-columns: .65fr 1.35fr; gap: 3rem; align-items: start; background: var(--it-travertine); }
.it-faq > header { margin: 0; }
.it-faq > header h2 { overflow-wrap: anywhere; }

.it-field > .sources {
  border-top: 7px solid var(--it-field-accent);
  border-radius: 0;
  background: #fffdf8;
}
.it-field > .sources h2 { font: 500 clamp(2rem, 3.6vw, 3.5rem)/1 var(--it-display); }
.it-field > .sources a { color: #24585a; }

@media (max-width: 1440px) {
  .it-field-hero { min-height: 720px; padding-right: 2rem; padding-left: 2rem; }
  .it-field-copy h1 { font-size: clamp(3.35rem, 5.8vw, 6.3rem); }
  .it-field-hero figure { min-height: 610px; }
}

@media (max-width: 1100px) {
  .it-field-hero { grid-template-columns: repeat(10, minmax(0, 1fr)); grid-template-rows: minmax(650px, auto); }
  .it-field-index { grid-column: 1 / 2; }
  .it-field-copy { grid-column: 2 / 7; padding-right: 1.2rem; padding-left: 1.2rem; }
  .it-field-hero figure { grid-column: 7 / 11; min-height: 560px; }
  .it-instrument-tab { grid-column: 6 / 10; min-width: 230px; }
  .it-threshold-board { grid-template-columns: 1fr 1fr; }
  .it-threshold-board > aside { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .it-regional-strata > div { grid-template-columns: repeat(2, 1fr); }
  .it-route-folio li { grid-template-columns: 110px minmax(170px, .55fr) 1fr; }
  .it-billet { grid-template-columns: 95px 1fr 95px; }
  .it-billet > div { grid-template-columns: 1fr; }
  .it-billet article { border-right: 0; border-bottom: 1px dashed var(--it-line-strong); }
  .it-billet article:last-child { border-bottom: 0; }
  .it-road-folio { grid-template-columns: 1fr 1fr; }
  .it-road-folio > section:nth-child(3) { grid-column: 1 / -1; margin-top: 0; }
  .it-comparison-slab article { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .it-field { background: var(--it-travertine); }
  .it-breadcrumb { padding: 1rem; white-space: normal; }
  .it-field-hero {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 1rem 0 0;
    background: var(--it-plaster);
  }
  .it-field-index { order: 1; display: flex; justify-content: space-between; align-items: center; margin: 0 1rem; padding: .8rem 1rem; }
  .it-field-index span { writing-mode: horizontal-tb; }
  .it-field-copy { order: 4; padding: 2rem 1.25rem; }
  .it-field-copy h1 { max-width: 100%; font-size: clamp(3rem, 15vw, 5.3rem); line-height: .86; }
  .it-purpose { padding: 1.1rem; }
  .it-field-hero figure { order: 2; width: auto; min-height: 330px; height: 330px; margin: 0 1rem; }
  .it-instrument-tab { order: 3; align-self: stretch; min-width: 0; margin: -1.7rem 1.8rem 1.5rem; }
  .it-decision-instrument,
  .it-threshold-board,
  .it-regional-strata,
  .it-route-folio,
  .it-live-desk,
  .it-fallback,
  .it-breakpoints,
  .it-related,
  .it-faq { padding: 3.5rem 1rem; }
  .it-decision-instrument > header h2,
  .it-regional-strata > header h2,
  .it-route-folio > header h2,
  .it-breakpoints > header h2,
  .it-related > header h2,
  .it-faq > header h2 { font-size: clamp(2.15rem, 11vw, 3.55rem); }

  .it-scoreboard { padding: .65rem; }
  .it-scoreboard li { grid-template-columns: 1fr; }
  .it-scoreboard li::before { place-items: start; padding: .7rem 1rem; }
  .it-scoreboard article { border-top: 1px dashed var(--it-line-strong); border-left: 0; }
  .it-braid { display: grid; grid-template-columns: 1fr; grid-template-rows: auto; padding-left: 1.3rem; border-left: 5px solid var(--it-rail); }
  .it-braid > i { display: none; }
  .it-braid article[data-lane],
  .it-braid > aside { grid-column: 1; grid-row: auto; }
  .it-waterline { grid-template-columns: 1fr; }
  .it-water-out { min-height: 0; }
  .it-waterline > aside { grid-column: 1; }
  .it-hill-steps li { width: calc(100% - var(--step) * 4%); margin-left: calc(var(--step) * 4%); }
  .it-hill-steps article,
  .it-ring article { display: block; }
  .it-ring-1,
  .it-ring-2,
  .it-ring-3 { width: calc(100% - (var(--ring-inset, 0) * 1%)); }
  .it-ring-2 { width: 92%; }
  .it-ring-3 { width: 84%; }
  .it-traverse { grid-template-columns: 1fr; min-height: 0; }
  .it-traverse article[data-stratum] { margin-top: 0; }
  .it-coast-braid { grid-template-columns: 1fr; }
  .it-coast-braid > section { grid-template-columns: 65px 1fr; }
  .it-coast-braid > aside { grid-column: 1; grid-row: auto; }
  .it-billet { grid-template-columns: 1fr; }
  .it-billet > aside { min-height: 90px; }
  .it-summit-stack li,
  .it-summit-stack li:nth-child(2),
  .it-summit-stack li:nth-child(3) { width: 100%; grid-template-columns: 92px 1fr; }
  .it-shore-clock { grid-template-columns: 1fr; border-radius: .6rem; }
  .it-shore-clock::before { display: none; }
  .it-shore-clock > aside { grid-column: 1; }
  .it-piazza-circuit { grid-template-columns: 1fr; gap: 1rem; padding: 1rem 0; }
  .it-piazza-circuit::before,
  .it-piazza-circuit li > i { display: none; }
  .it-piazza-circuit li:nth-child(2) { margin-top: 0; }
  .it-collection-spread { grid-template-columns: 1fr; }
  .it-collection-spread > main,
  .it-collection-spread > section { min-height: 0; padding: 1.8rem; }
  .it-daypart-table [role='row'] { grid-template-columns: 1fr; }
  .it-daypart-table [role='row']:first-child {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
  .it-mobile-daypart { display: block; padding: .75rem 1rem; color: #fff; background: var(--it-basalt); font: 800 .7rem/1.2 var(--it-label); letter-spacing: .1em; }
  .it-daypart-table article { min-height: 0; }
  .it-sacred-thresholds { grid-template-columns: 1fr; }
  .it-sacred-thresholds > section:nth-child(3) { grid-column: 1; margin: 0 .75rem; }
  .it-status-board { grid-template-columns: 1fr; }
  .it-status-board > section[data-status] { min-height: 0; margin-top: 0; }
  .it-road-folio { grid-template-columns: 1fr; }
  .it-road-folio > section:nth-child(n) { grid-column: auto; min-height: 0; margin-top: 0; }

  .it-threshold-board,
  .it-regional-strata > div,
  .it-live-desk,
  .it-fallback,
  .it-breakpoints > div,
  .it-related > div,
  .it-faq { grid-template-columns: 1fr; }
  .it-threshold-board > aside { grid-column: 1; grid-template-columns: 1fr; }
  .it-regional-strata article { min-height: 0; }
  .it-route-folio ol { padding-left: 2.5rem; }
  .it-route-folio ol::before { left: .9rem; }
  .it-route-folio li,
  .it-route-folio li:nth-child(even) { display: block; margin-left: 0; padding: 1.35rem; }
  .it-route-folio li > b { left: -3rem; width: 2.5rem; height: 2.5rem; }
  .it-route-folio li h3 { margin: .65rem 0; }
  .it-live-desk { gap: 2rem; }
  .it-fallback { gap: 1.3rem; }
  .it-breakpoints article:nth-child(n) { min-height: 0; margin-top: 0; }
  .it-related a,
  .it-related a:nth-child(2) { grid-template-columns: 1fr; }
  .it-related img,
  .it-related a:nth-child(2) img { height: 230px; min-height: 230px; }
  .it-faq > header { margin-bottom: 1rem; }
}

@media (max-width: 360px) {
  .it-field-copy h1 { font-size: clamp(2.65rem, 14vw, 4rem); line-height: .9; }
  .it-field-copy > p { font-size: .98rem; line-height: 1.7; }
  .it-field-hero figure { min-height: 285px; height: 285px; }
  .it-instrument-tab { margin-right: 1.2rem; margin-left: 1.2rem; }
  .it-decision-instrument article h3 { font-size: 1.28rem; }
  .it-coast-braid > section { grid-template-columns: 52px 1fr; }
  .it-coast-braid > section > span { padding: .5rem; }
  .it-summit-stack li,
  .it-summit-stack li:nth-child(2),
  .it-summit-stack li:nth-child(3) { grid-template-columns: 72px 1fr; }
  .it-summit-stack article { padding: 1.2rem; }
  .it-threshold-board > article,
  .it-threshold-board > aside { padding: 1.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  .it-field * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}