:root {
  --paper: #F3F1EC;
  --surface: #FFFFFF;
  --surface-tint: #EAF0EF;
  --ink: #19262D;
  --ink-2: #4D5B61;
  --ink-3: #657176;
  --rule: #D4D1C8;
  --rule-soft: #E7E3DA;
  --accent: #173F4B;
  --warm: #A94B18;
  --display: "Aptos Display", "Segoe UI Variable Display", "Segoe UI", Arial, sans-serif;
  --sans: "Aptos", "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace;
  --col: 1160px;
  --prose: 66ch;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 16.5px; line-height: 1.68;
  letter-spacing: 0.002em; -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p, figure, ol, ul, dl, dd { margin: 0; }
h1, h2, h3 { font-family: var(--display); }
img { display: block; max-width: 100%; }
a { color: var(--accent); text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid var(--warm); outline-offset: 3px;
}
::selection { background: #F2CFB5; color: var(--ink); }
.wrap { width: min(100%, var(--col)); margin-inline: auto; padding-inline: 28px; }
.skip-link {
  position: fixed; top: 10px; left: 10px; z-index: 100;
  transform: translateY(-160%); padding: 9px 13px;
  background: var(--surface); color: var(--ink); border: 1px solid var(--rule);
}
.skip-link:focus { transform: translateY(0); }

.masthead {
  position: sticky; top: 0; z-index: 20;
  background: var(--surface); border-bottom: 1px solid var(--rule);
  box-shadow: 0 4px 18px rgba(25, 38, 45, 0.045);
}
.masthead .wrap {
  min-height: 70px; display: flex; align-items: center;
  justify-content: space-between; gap: 24px;
}
.brand { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.brand-mark {
  width: 38px; height: 38px; display: grid; place-items: center;
  background: var(--warm); color: #FFF; border-radius: 2px;
  font-family: var(--display); font-weight: 750;
}
.brand-name { display: flex; flex-direction: column; line-height: 1.22; }
.brand-name strong { font-family: var(--display); font-size: 16.5px; letter-spacing: -0.015em; }
.brand-name span {
  color: var(--ink-3); font-size: 10.5px; font-weight: 650;
  letter-spacing: 0.1em; text-transform: uppercase;
}
.top-nav { display: flex; align-items: center; gap: 20px; }
.top-nav a {
  padding-block: 8px; color: var(--ink-2); text-decoration: none;
  font-size: 14.5px; font-weight: 620;
}
.top-nav a:hover, .top-nav a[aria-current="page"] { color: var(--warm); }
.nav-menu { position: relative; }
.nav-menu summary {
  list-style: none; cursor: pointer; padding-block: 8px; color: var(--ink-2);
  font-size: 14.5px; font-weight: 620;
}
.nav-menu summary::-webkit-details-marker { display: none; }
.nav-menu summary::after { content: " +"; color: var(--warm); }
.nav-menu[open] summary::after { content: " -"; }
.nav-menu[open] summary, .nav-menu summary:hover,
.nav-menu:has(a[aria-current="page"]) summary { color: var(--warm); }
.nav-menu > div {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 30;
  min-width: 270px; display: grid; padding: 8px;
  background: var(--surface); border: 1px solid var(--rule);
  box-shadow: 0 16px 40px rgba(5, 18, 22, 0.16);
}
.top-nav .nav-menu a {
  display: block; padding: 9px 10px; color: var(--ink-2);
  font-size: 14px; font-weight: 620;
}
.top-nav .nav-menu a:hover { background: var(--paper); color: var(--ink); }
.mobile-nav { display: none; position: relative; }
.mobile-nav summary {
  cursor: pointer; list-style: none; padding: 7px 11px;
  border: 1px solid var(--rule); font-size: 12px; font-weight: 700;
  letter-spacing: 0.07em; text-transform: uppercase;
}
.mobile-nav summary::-webkit-details-marker { display: none; }
.mobile-nav summary::after { content: " +"; color: var(--warm); }
.mobile-nav[open] summary::after { content: " -"; }
.mobile-nav nav {
  position: absolute; right: 0; top: calc(100% + 10px); min-width: 230px;
  display: flex; flex-direction: column; padding: 8px;
  background: var(--surface); border: 1px solid var(--rule);
  box-shadow: 0 16px 40px rgba(5, 18, 22, 0.16);
}
.mobile-nav nav a { padding: 9px 10px; color: var(--ink-2); text-decoration: none; font-size: 14px; }
.mobile-nav nav a:hover { background: var(--paper); color: var(--ink); }

.page-hero { background: var(--accent); color: #FFF; }
.page-hero .wrap {
  display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(320px, 0.78fr);
  gap: clamp(38px, 7vw, 84px); align-items: center; padding-block: 62px;
}
.breadcrumbs { margin-bottom: 26px; }
.breadcrumbs ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.breadcrumbs li { color: #B7C6C9; font-size: 12px; }
.breadcrumbs li + li::before { content: "/"; margin-right: 8px; color: #718C92; }
.breadcrumbs a { color: #DCE6E8; }
.eyebrow {
  margin-bottom: 14px; color: #F1B98F; font-family: var(--mono);
  font-size: 11px; font-weight: 700; letter-spacing: 0.11em; text-transform: uppercase;
}
h1 {
  max-width: 17ch; font-size: clamp(38px, 5vw, 58px); line-height: 1.04;
  letter-spacing: -0.038em; font-weight: 760; text-wrap: balance;
}
.hero-lede { max-width: 58ch; margin-top: 22px; color: #DCE6E8; font-size: 18px; line-height: 1.62; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.button {
  min-height: 46px; display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 17px; border: 1px solid var(--warm); border-radius: 2px;
  background: var(--warm); color: #FFF; text-decoration: none;
  font-family: inherit; font-size: 14.5px; font-weight: 720; line-height: 1.2;
  cursor: pointer;
  transition: filter 160ms ease, transform 160ms ease;
}
.button:hover { filter: brightness(1.12); transform: translateY(-1px); }
.button.secondary { background: rgba(7, 20, 24, 0.28); border-color: rgba(255,255,255,0.45); }
.hero-figure { border: 1px solid rgba(255,255,255,0.22); background: #0E2F38; }
.hero-figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(0.86) contrast(1.04); }
.hero-figure figcaption { padding: 11px 13px; color: #B7C6C9; font-size: 10.5px; line-height: 1.45; }

.guide-hero .wrap { grid-template-columns: minmax(0, 1.04fr) minmax(330px, 0.74fr); }
.brief-card {
  padding: clamp(24px, 3vw, 34px); border: 1px solid rgba(255,255,255,0.25);
  background: #0E2F38; box-shadow: 16px 16px 0 rgba(5, 18, 22, 0.18);
}
.brief-kicker {
  color: var(--warm); font-family: var(--mono); font-size: 10.5px;
  font-weight: 750; letter-spacing: 0.1em; text-transform: uppercase;
}
.brief-card .brief-kicker { color: #F1B98F; }
.brief-card h2 {
  max-width: 17ch; margin-top: 8px; color: #FFF; font-size: clamp(25px, 2.8vw, 33px);
  line-height: 1.15; letter-spacing: -0.025em;
}
.brief-list { list-style: none; padding: 0; margin-top: 22px; border-top: 1px solid rgba(255,255,255,0.2); }
.brief-list li {
  display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px;
  padding-block: 10px; border-bottom: 1px solid rgba(255,255,255,0.14);
  color: #E7EFF0; font-size: 14px; line-height: 1.4;
}
.brief-list span { color: #F1B98F; font-family: var(--mono); font-size: 10.5px; font-weight: 700; }
.brief-note { margin-top: 14px; color: #B7C6C9; font-size: 12.5px; }

.facts { background: var(--surface); border-bottom: 1px solid var(--rule); }
.facts dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fact { min-height: 88px; padding: 18px 24px; border-left: 1px solid var(--rule-soft); }
.fact:last-child { border-right: 1px solid var(--rule-soft); }
.fact dt {
  color: var(--warm); font-family: var(--mono); font-size: 10.5px;
  font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
}
.fact dd { margin-top: 3px; font-family: var(--display); font-size: 17px; line-height: 1.35; font-weight: 700; }

section { border-bottom: 1px solid var(--rule-soft); }
section > .wrap { padding-block: 72px; }
.surface { background: var(--surface); }
.section-head { display: flex; align-items: center; gap: 18px; margin-bottom: 20px; }
.section-head h2 {
  font-size: clamp(27px, 3vw, 34px); line-height: 1.2;
  letter-spacing: -0.026em; font-weight: 740;
}
.section-head::after { content: ""; width: 54px; height: 3px; background: var(--warm); }
.section-intro { max-width: var(--prose); color: var(--ink-2); font-size: 17px; }
.notice {
  max-width: var(--prose); margin-top: 22px; padding: 14px 17px;
  border: 1px solid #B9CCC8; border-left: 3px solid var(--accent);
  background: var(--surface-tint); color: var(--ink-2); font-size: 14.5px;
}
.notice strong { color: var(--ink); }

.scope-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px; margin-top: 30px;
}
.scope-card { padding: 24px; background: var(--surface); border: 1px solid var(--rule); }
.scope-no {
  display: block; margin-bottom: 12px; color: var(--warm);
  font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
}
.scope-card h3 { font-size: 20px; line-height: 1.3; letter-spacing: -0.015em; }
.scope-card p { margin-top: 8px; color: var(--ink-2); font-size: 14.5px; line-height: 1.58; }

.three-pair-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.reference-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px; margin-top: 30px;
}
.three-reference-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.reference-card { padding: 25px; border: 1px solid var(--rule); background: var(--paper); }
.reference-card h3 { margin-top: 8px; font-size: 20px; line-height: 1.3; }
.reference-card p:not(.brief-kicker) { margin-top: 9px; color: var(--ink-2); font-size: 14.5px; line-height: 1.58; }
.reference-card a { display: inline-block; margin-top: 15px; font-size: 14px; font-weight: 700; }

.planning-grid {
  display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(36px, 7vw, 84px); align-items: start;
}
.planning-statement { border-left: 4px solid var(--warm); padding-left: 24px; }
.planning-statement .eyebrow { color: var(--warm); }
.planning-statement h2 {
  max-width: 16ch; font-size: clamp(29px, 3.5vw, 40px); line-height: 1.15;
  letter-spacing: -0.03em; text-wrap: balance;
}
.factor-list { list-style: none; padding: 0; border-top: 1px solid var(--rule); }
.factor-list li {
  display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px;
  padding-block: 17px; border-bottom: 1px solid var(--rule-soft);
}
.factor-list span { color: var(--warm); font-family: var(--mono); font-size: 11px; font-weight: 700; }
.factor-list strong { display: block; font-family: var(--display); font-size: 17px; line-height: 1.35; }
.factor-list p { margin-top: 3px; color: var(--ink-2); font-size: 14px; line-height: 1.5; }

.steps { list-style: none; padding: 0; margin-top: 30px; display: grid; grid-template-columns: repeat(3, 1fr); }
.steps li { min-height: 190px; padding: 23px; background: var(--surface); border: 1px solid var(--rule); border-right: 0; }
.steps li:last-child { border-right: 1px solid var(--rule); }
.steps span { color: var(--warm); font-family: var(--mono); font-size: 11px; font-weight: 700; }
.steps h3 { margin-top: 14px; font-size: 19px; line-height: 1.3; }
.steps p { margin-top: 8px; color: var(--ink-2); font-size: 14px; line-height: 1.55; }

.enquiry { background: var(--accent); color: #FFF; }
.enquiry .wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 0.82fr); gap: 64px; }
.enquiry .section-head::after { background: #F1B98F; }
.enquiry-intro { max-width: 58ch; color: #DCE6E8; }
.enquiry .button { margin-top: 24px; }
.checklist { list-style: none; padding: 0; border-top: 1px solid rgba(255,255,255,0.2); }
.checklist li {
  position: relative; padding: 12px 0 12px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.16); color: #E7EFF0; font-size: 14.5px;
}
.checklist li::before { content: ""; position: absolute; left: 0; top: 1.25em; width: 6px; height: 6px; background: #F1B98F; }
.enquiry-note { margin-top: 13px; color: #B7C6C9; font-size: 13.5px; }

.brief-sheet { border: 1px solid var(--rule); background: var(--surface); }
.brief-sheet-head {
  display: flex; align-items: end; justify-content: space-between; gap: 28px;
  padding: 28px; border-bottom: 1px solid var(--rule);
}
.brief-sheet-head h2 { margin-top: 7px; font-size: clamp(27px, 3vw, 34px); line-height: 1.2; letter-spacing: -0.026em; }
.brief-sheet-head p:not(.brief-kicker) { margin-top: 8px; color: var(--ink-2); font-size: 14.5px; }
.print-actions { flex: 0 0 auto; }
.brief-sheet-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.brief-sheet-grid section { padding: 26px 28px; border-right: 1px solid var(--rule-soft); border-bottom: 1px solid var(--rule-soft); }
.brief-sheet-grid section:nth-child(2n) { border-right: 0; }
.brief-sheet-grid section:nth-last-child(-n + 2) { border-bottom: 0; }
.brief-sheet-grid h3 { font-size: 18px; line-height: 1.3; }
.checklist-light { list-style: none; padding: 0; margin-top: 13px; }
.checklist-light li {
  position: relative; padding: 7px 0 7px 22px; color: var(--ink-2);
  font-size: 14px; line-height: 1.45;
}
.checklist-light li::before {
  content: ""; position: absolute; left: 0; top: 0.78em;
  width: 10px; height: 10px; border: 1px solid var(--ink-3); background: var(--surface);
}

.record-schedule {
  margin-top: 30px; overflow-x: auto; border: 1px solid var(--rule);
  background: var(--surface); scrollbar-color: var(--warm) var(--rule-soft);
}
.record-schedule:focus-visible { outline: 3px solid var(--warm); outline-offset: 3px; }
.record-schedule table { width: 100%; min-width: 760px; border-collapse: collapse; }
.record-schedule caption {
  padding: 18px 20px; color: var(--ink); text-align: left;
  font-family: var(--display); font-size: 19px; font-weight: 720;
}
.record-schedule th, .record-schedule td {
  padding: 14px 18px; border-top: 1px solid var(--rule-soft);
  text-align: left; vertical-align: top; font-size: 14px; line-height: 1.5;
}
.record-schedule thead th {
  background: var(--surface-tint); color: var(--ink); font-family: var(--mono);
  font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase;
}
.record-schedule tbody th { width: 21%; color: var(--ink); font-family: var(--display); font-size: 15px; }
.record-schedule td { color: var(--ink-2); }

.danger-notice { border-color: #D8B39D; border-left-color: var(--warm); background: #FBF1EA; }
.decision-grid {
  list-style: none; padding: 0; margin-top: 30px;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
}
.decision-card {
  min-height: 220px; padding: 24px; background: var(--surface);
  border: 1px solid var(--rule); border-top: 4px solid var(--accent);
}
.decision-card.pause { border-top-color: #B77A20; }
.decision-card.escalate { border-top-color: var(--warm); }
.decision-label {
  color: var(--warm); font-family: var(--mono); font-size: 10.5px;
  font-weight: 750; letter-spacing: 0.08em; text-transform: uppercase;
}
.decision-card h3 { margin-top: 12px; font-size: 20px; line-height: 1.3; }
.decision-card p:not(.decision-label) { margin-top: 9px; color: var(--ink-2); font-size: 14.5px; line-height: 1.58; }

.related { background: var(--surface); }
.related-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.related-links a {
  padding: 9px 13px; border: 1px solid var(--rule); color: var(--ink);
  text-decoration: none; font-size: 14px; font-weight: 650;
}
.related-links a:hover { border-color: var(--warm); color: var(--warm); }

footer { background: #102F38; color: #D8E3E5; }
footer .wrap { padding-block: 26px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 12px; font-weight: 650; }
footer a { color: #D8E3E5; }

@media (max-width: 1180px) {
  .top-nav { display: none; }
  .mobile-nav { display: block; }
}

@media (max-width: 760px) {
  html { scroll-padding-top: 78px; }
  body { font-size: 16px; }
  .wrap { padding-inline: 20px; }
  .page-hero .wrap { grid-template-columns: 1fr; gap: 32px; padding-block: 42px; }
  .hero-lede { font-size: 17px; }
  .hero-actions .button { width: 100%; }
  .hero-figure { max-width: 520px; }
  .facts dl { grid-template-columns: 1fr; padding-inline: 20px; }
  .fact {
    min-height: 0; display: grid; grid-template-columns: 92px minmax(0, 1fr);
    gap: 14px; align-items: center; padding: 14px 16px;
    border-right: 1px solid var(--rule-soft); border-bottom: 1px solid var(--rule-soft);
  }
  .fact:last-child { border-bottom: 0; }
  .fact dd { margin-top: 0; font-size: 15.5px; }
  section > .wrap { padding-block: 46px; }
  .scope-grid, .planning-grid, .steps, .enquiry .wrap, .reference-grid,
  .brief-sheet-grid, .decision-grid { grid-template-columns: 1fr; }
  .scope-card { padding: 20px; }
  .planning-grid, .enquiry .wrap { gap: 30px; }
  .planning-statement { padding-left: 18px; }
  .steps li { min-height: 0; border-right: 1px solid var(--rule); border-bottom: 0; }
  .steps li:last-child { border-bottom: 1px solid var(--rule); }
  .brief-card { box-shadow: 10px 10px 0 rgba(5, 18, 22, 0.18); }
  .brief-sheet-head { align-items: stretch; flex-direction: column; padding: 22px 20px; }
  .print-actions .button { width: 100%; }
  .brief-sheet-grid section, .brief-sheet-grid section:nth-child(2n),
  .brief-sheet-grid section:nth-last-child(-n + 2) {
    padding: 22px 20px; border-right: 0; border-bottom: 1px solid var(--rule-soft);
  }
  .brief-sheet-grid section:last-child { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button { transition: none; }
}

@media print {
  body { background: #FFF; color: #000; font-size: 11pt; }
  .masthead, .page-hero, .facts, main > section:not(#checklist):not(#handover-review):not(#monsoon-review):not(#logistics-review):not(#scope-review):not(#inspection-review), footer,
  .print-actions, .skip-link { display: none !important; }
  #checklist, #checklist > .wrap, #handover-review, #handover-review > .wrap,
  #monsoon-review, #monsoon-review > .wrap,
  #logistics-review, #logistics-review > .wrap,
  #scope-review, #scope-review > .wrap,
  #inspection-review, #inspection-review > .wrap { border: 0; padding: 0; }
  .brief-sheet { border: 0; }
  .brief-sheet-head { padding: 0 0 16pt; }
  .brief-sheet-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brief-sheet-grid section { break-inside: avoid; padding: 14pt; }
  .checklist-light li { color: #222; }
}