@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@400;500;600&display=swap');

:root {
  --claret: #6b1d2a;
  --claret-deep: #4d121d;
  --ink: #171513;
  --navy: #111827;
  --ivory: #f6f3ec;
  --warm: #e8dfd0;
  --gold: #b9965c;
  --muted: #665f58;
  --line: rgba(23, 21, 19, 0.16);
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Inter', Arial, sans-serif;
}

* { box-sizing: border-box; }

html { background: #d8d3ca; }

body {
  margin: 0;
  color: var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }

.toolbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 12px max(24px, calc((100vw - 210mm) / 2));
  background: rgba(17, 24, 39, 0.96);
  color: #fff;
  font-size: 0.76rem;
}

.toolbar-actions { display: flex; gap: 10px; }

.toolbar a,
.toolbar button {
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  background: transparent;
  padding: 8px 14px;
  color: #fff;
  font: 500 0.7rem var(--sans);
  letter-spacing: 0.05em;
  text-decoration: none;
  cursor: pointer;
}

.toolbar .primary { border-color: #d8c199; background: #d8c199; color: var(--ink); }

.document { padding: 24px 0 48px; }

.sheet {
  position: relative;
  width: 210mm;
  min-height: 297mm;
  margin: 0 auto 24px;
  overflow: hidden;
  background: var(--ivory);
  box-shadow: 0 18px 50px rgba(24, 20, 16, 0.16);
  page-break-after: always;
}

.sheet:last-child { page-break-after: auto; }

.page-inner { padding: 19mm 18mm 17mm; }

.page-number {
  position: absolute;
  right: 18mm;
  bottom: 9mm;
  color: #777069;
  font-size: 7.5pt;
}

.brand {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18mm;
}

.brand img { display: block; width: 28mm; height: auto; }

.brand-tag {
  color: var(--muted);
  font-size: 7pt;
  font-weight: 600;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

.eyebrow {
  margin: 0 0 5mm;
  color: var(--claret);
  font-size: 7.5pt;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p { margin-top: 0; }

h1 {
  max-width: 155mm;
  margin-bottom: 7mm;
  font: 500 35pt/0.98 var(--serif);
  letter-spacing: -0.02em;
}

h2 {
  margin-bottom: 5mm;
  font: 500 24pt/1.04 var(--serif);
  letter-spacing: -0.01em;
}

h3 { font: 500 16pt/1.15 var(--serif); }

.lead {
  max-width: 142mm;
  margin-bottom: 11mm;
  color: var(--muted);
  font: 11pt/1.6 var(--sans);
}

.accent-rule { width: 24mm; height: 1px; margin: 0 0 10mm; background: var(--gold); }

.model {
  display: grid;
  grid-template-columns: 1fr 11mm 1fr;
  align-items: stretch;
  margin-top: 10mm;
}

.model-card {
  padding: 9mm;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.56);
}

.model-card.dark { border-color: var(--navy); background: var(--navy); color: #fff; }

.model-plus { display: grid; place-items: center; color: var(--claret); font: 500 23pt var(--serif); }

.model-label,
.metric-label {
  display: block;
  margin-bottom: 3mm;
  color: var(--gold);
  font-size: 6.5pt;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.model-value { display: block; margin-bottom: 4mm; font: 500 24pt/1 var(--serif); }

.model-card p { margin: 0; color: var(--muted); font-size: 8pt; line-height: 1.55; }
.model-card.dark p { color: rgba(255, 255, 255, 0.68); }

.service-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 9mm;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.service-strip div { padding: 5mm 4mm; border-left: 1px solid var(--line); }
.service-strip div:first-child { border-left: 0; }
.service-strip strong { display: block; margin-bottom: 2mm; font: 500 10.5pt var(--serif); }
.service-strip span { color: var(--muted); font-size: 6.7pt; line-height: 1.4; }

.page-dark { background: var(--navy); color: #fff; }
.page-dark .brand-tag,
.page-dark .lead { color: rgba(255, 255, 255, 0.62); }
.page-dark .eyebrow { color: #d8c199; }

.budget-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5mm; }

.budget-card {
  position: relative;
  min-height: 185mm;
  padding: 8mm 6mm;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.035);
}

.budget-card.featured { border-color: #d8c199; background: rgba(216, 193, 153, 0.08); }
.budget-card .model-label { font-size: 11pt; line-height: 1.25; letter-spacing: 0.08em; }
.budget-total { display: block; margin: 2mm 0 1mm; font: 500 29pt/1 var(--serif); }
.budget-name { display: block; min-height: 11mm; color: #d8c199; font: 500 12pt/1.2 var(--serif); }

.budget-split { margin: 7mm 0; padding: 4mm 0; border-top: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); }
.budget-split div { display: flex; justify-content: space-between; gap: 3mm; padding: 1.3mm 0; font-size: 7pt; }
.budget-split span { color: rgba(255, 255, 255, 0.56); }
.budget-split strong { font-weight: 500; }

.budget-card h3 { margin-bottom: 4mm; color: #fff; font-size: 13pt; }
.budget-card ul { margin: 0; padding: 0; list-style: none; }
.budget-card li { position: relative; margin-top: 3.5mm; padding-left: 4mm; color: rgba(255,255,255,.7); font-size: 7pt; line-height: 1.5; }
.budget-card li::before { content: ''; position: absolute; left: 0; top: 1.3mm; width: 1.5mm; height: 1px; background: #d8c199; }
.budget-card li strong { color: #fff; font-weight: 600; }
.budget-note { position: absolute; left: 6mm; right: 6mm; bottom: 7mm; color: rgba(255,255,255,.42); font-size: 6pt; line-height: 1.4; }

.sheet--calculator .brand { margin-bottom: 10mm; }
.sheet--calculator h2 { margin-bottom: 3mm; }
.sheet--calculator .lead { margin-bottom: 5mm; }

.calculator-table-wrap { border: 1px solid rgba(255, 255, 255, 0.18); }

.calculator-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.calculator-table th {
  padding: 3mm;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  color: #d8c199;
  font-size: 6pt;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-align: left;
  text-transform: uppercase;
}

.calculator-table th:first-child { width: 43%; }
.calculator-table th:nth-child(2) { width: 19%; }
.calculator-table th:nth-child(3) { width: 18%; }
.calculator-table th:last-child { width: 20%; text-align: right; }

.calculator-table td {
  height: 13mm;
  padding: 2.2mm 3mm;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.68);
  font-size: 6.8pt;
  vertical-align: middle;
}

.calculator-table tbody tr:last-child td { border-bottom: 0; }
.calculator-table td:last-child { color: #fff; font-weight: 500; text-align: right; }
.calculator-table td strong { display: block; margin-bottom: 0.5mm; color: #fff; font-size: 7.2pt; font-weight: 500; }
.calculator-table td span { display: block; color: rgba(255, 255, 255, 0.42); font-size: 5.8pt; line-height: 1.3; }

.calculator-table input {
  width: 20mm;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 2px;
  outline: none;
  background: rgba(255, 255, 255, 0.06);
  padding: 2mm;
  color: #fff;
  font: 500 8pt var(--sans);
  text-align: center;
}

.calculator-table input:focus { border-color: #d8c199; }
.calculator-table input::placeholder { color: rgba(255, 255, 255, 0.34); }

.currency-input { position: relative; display: inline-flex !important; align-items: center; }
.currency-input > span { position: absolute; left: 2mm; z-index: 1; color: rgba(255,255,255,.6) !important; font-size: 7pt !important; }
.currency-input input { width: 25mm; padding-left: 5mm; }

.calculator-fee-row { background: rgba(216, 193, 153, 0.08); }

.calculator-result {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 4mm 8mm;
  margin-top: 5mm;
  padding: 5mm;
  border: 1px solid #d8c199;
  background: rgba(216, 193, 153, 0.08);
}

.calculator-result strong { display: block; font: 500 18pt/1.05 var(--serif); }
.calculator-result p { grid-column: 1 / -1; margin: 0; color: rgba(255,255,255,.56); font-size: 6.5pt; }

.programme-scale { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2mm; margin-top: 4mm; }
.programme-scale div { padding: 3mm; border: 1px solid rgba(255,255,255,.14); }
.programme-scale strong { display: block; color: rgba(255,255,255,.66); font: 500 10pt var(--serif); }
.programme-scale span { display: block; margin-top: 1mm; color: rgba(255,255,255,.36); font-size: 5.5pt; }
.programme-scale .is-recommended { border-color: #d8c199; background: #d8c199; }
.programme-scale .is-recommended strong { color: var(--ink); }
.programme-scale .is-recommended span { color: rgba(23,21,19,.62); }

.calculator-disclaimer { margin: 3mm 0 0; color: rgba(255,255,255,.38); font-size: 5.8pt; }

.use-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5mm; margin-top: 9mm; }

.use-card { padding: 6mm; border-top: 2px solid var(--claret); background: #fff; }
.use-card.wide { grid-column: 1 / -1; display: grid; grid-template-columns: 41mm 1fr; gap: 8mm; }
.use-num { color: var(--gold); font: 500 21pt var(--serif); }
.use-card h3 { margin: 1mm 0 3mm; }
.use-card p { margin: 0; color: var(--muted); font-size: 7.3pt; line-height: 1.55; }

.decision-table { width: 100%; margin-top: 8mm; border-collapse: collapse; }
.decision-table th { padding: 3mm; background: var(--navy); color: #fff; font-size: 6.5pt; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.decision-table td { padding: 3mm; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 7pt; line-height: 1.4; vertical-align: top; }
.decision-table td:first-child { color: var(--ink); font-weight: 600; }

.cta-band {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8mm;
  align-items: center;
  margin-top: 10mm;
  padding: 7mm;
  background: var(--claret);
  color: #fff;
}
.cta-band h3 { margin: 0 0 1mm; color: #fff; }
.cta-band p { margin: 0; color: rgba(255,255,255,.7); font-size: 7pt; }
.cta-band a { border-bottom: 1px solid rgba(255,255,255,.5); font-size: 7.5pt; font-weight: 500; text-decoration: none; }

/* Worksheet */
.worksheet .page-inner { padding-top: 15mm; }
.worksheet h1 { font-size: 29pt; }
.worksheet h2 { font-size: 22pt; }
.worksheet .brand { margin-bottom: 12mm; }
.worksheet .lead { margin-bottom: 7mm; font-size: 9pt; }

.field-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5mm; margin: 8mm 0; }
.field-grid.three { grid-template-columns: repeat(3, 1fr); }
.field { display: grid; gap: 2mm; }
.field label,
.section-label { color: var(--muted); font-size: 6.3pt; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.field input,
.field textarea {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #938b82;
  border-radius: 0;
  outline: none;
  background: transparent;
  padding: 2mm 0;
  color: var(--ink);
  font: 8pt var(--sans);
}
.field textarea { min-height: 18mm; resize: vertical; border: 1px solid var(--line); padding: 3mm; }

.objective-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; margin: 4mm 0 8mm; }
.check { display: flex; gap: 2mm; align-items: flex-start; color: var(--muted); font-size: 7pt; line-height: 1.35; }
.check input { width: 3.5mm; height: 3.5mm; margin: 0; accent-color: var(--claret); }

.allocation-table,
.account-table { width: 100%; border-collapse: collapse; }
.allocation-table { margin-top: 4mm; }
.allocation-table th,
.account-table th { padding: 2.8mm 2mm; background: var(--navy); color: #fff; font-size: 5.8pt; font-weight: 600; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
.allocation-table td { height: 12mm; padding: 2mm; border: 1px solid var(--line); font-size: 7pt; vertical-align: top; }
.allocation-table td:first-child { width: 39mm; font-weight: 600; }
.allocation-table input,
.account-table input,
.account-table textarea { width: 100%; height: 100%; border: 0; outline: 0; background: transparent; font: 6.5pt var(--sans); resize: none; }

.account-table { table-layout: fixed; margin-top: 6mm; }
.account-table th:nth-child(1) { width: 8mm; }
.account-table th:nth-child(2) { width: 31mm; }
.account-table th:nth-child(3) { width: 24mm; }
.account-table th:nth-child(4) { width: 33mm; }
.account-table th:nth-child(5) { width: 34mm; }
.account-table td { height: 17mm; padding: 2mm; border: 1px solid var(--line); font-size: 6.5pt; vertical-align: top; }
.account-table td:first-child { color: var(--gold); font-weight: 600; text-align: center; }

.key { display: flex; flex-wrap: wrap; gap: 4mm; margin-top: 6mm; color: var(--muted); font-size: 6.5pt; }
.key strong { color: var(--ink); }

.brief-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5mm; margin-top: 6mm; }
.brief-box { min-height: 34mm; padding: 4mm; border: 1px solid var(--line); background: rgba(255,255,255,.44); }
.brief-box.wide { grid-column: 1 / -1; }
.brief-box h3 { margin: 0 0 3mm; color: var(--claret); font: 600 7pt var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.brief-box textarea { width: 100%; min-height: 22mm; border: 0; outline: 0; background: transparent; font: 7.5pt var(--sans); resize: none; }

.follow-up { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 0; margin-top: 6mm; border: 1px solid var(--line); }
.follow-up .field { min-height: 19mm; padding: 3mm; border-left: 1px solid var(--line); }
.follow-up .field:first-child { border-left: 0; }

.footer-note { position: absolute; left: 18mm; bottom: 8mm; color: #756e67; font-size: 6.5pt; }

.sheet--mix .brand { margin-bottom: 11mm; }
.sheet--mix .lead { margin-bottom: 5mm; }
.sheet--mix .use-grid { gap: 3.5mm; margin-top: 5mm; }
.sheet--mix .use-card { padding: 4.5mm; }
.sheet--mix .decision-table { margin-top: 5mm; }
.sheet--mix .decision-table th,
.sheet--mix .decision-table td { padding: 2.2mm; }
.sheet--mix .cta-band { margin-top: 5mm; padding: 4.5mm 6mm; }

.worksheet-overview .brand { margin-bottom: 8mm; }
.worksheet-overview h1 { margin-bottom: 5mm; }
.worksheet-overview .lead { margin-bottom: 5mm; }
.worksheet-overview .field-grid { margin: 5mm 0; }
.worksheet-overview .objective-grid { margin-bottom: 5mm; }
.worksheet-overview .allocation-table td { height: 10mm; }
.worksheet-overview .field textarea { min-height: 13mm; }

@media (max-width: 850px) {
  .toolbar { padding: 10px 14px; }
  .toolbar > span { display: none; }
  .document { padding: 0; }
  .sheet { width: 100%; min-height: auto; margin: 0; box-shadow: none; }
  .page-inner { padding: 40px 24px 58px; }
  .brand { margin-bottom: 48px; }
  .model,
  .budget-grid,
  .use-grid,
  .field-grid,
  .field-grid.three,
  .objective-grid,
  .brief-grid { grid-template-columns: 1fr; }
  .model-plus { min-height: 50px; }
  .service-strip { grid-template-columns: 1fr 1fr; }
  .service-strip div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .service-strip div:nth-child(4) { border-top: 1px solid var(--line); }
  .budget-card { min-height: auto; padding-bottom: 70px; }
  .use-card.wide { grid-column: auto; grid-template-columns: 1fr; }
  .account-table { min-width: 720px; }
  .calculator-table { min-width: 680px; }
  .calculator-table-wrap { overflow-x: auto; }
  .calculator-result { grid-template-columns: 1fr; }
  .calculator-result p { grid-column: auto; }
  .programme-scale { grid-template-columns: 1fr 1fr; }
  .table-scroll { overflow-x: auto; }
  .page-number,
  .footer-note { display: none; }
}

@media print {
  @page { size: A4 portrait; margin: 0; }
  html,
  body { background: #fff; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .toolbar { display: none; }
  .document { padding: 0; }
  .sheet { width: 210mm; height: 297mm; min-height: 297mm; margin: 0; box-shadow: none; }
  .page-inner { padding: 19mm 18mm 17mm; }
  .worksheet .page-inner { padding-top: 15mm; }
  .brand { margin-bottom: 18mm; }
  .worksheet .brand { margin-bottom: 12mm; }
  .model { grid-template-columns: 1fr 11mm 1fr; }
  .model-plus { min-height: 0; }
  .service-strip { grid-template-columns: repeat(4, 1fr); }
  .service-strip div:nth-child(3),
  .service-strip div:nth-child(4) { border-top: 0; }
  .service-strip div:nth-child(3) { border-left: 1px solid var(--line); }
  .budget-grid { grid-template-columns: repeat(3, 1fr); }
  .budget-card { min-height: 185mm; padding-bottom: 8mm; }
  .use-grid { grid-template-columns: repeat(2, 1fr); }
  .use-card.wide { grid-column: 1 / -1; grid-template-columns: 41mm 1fr; }
  .field-grid { grid-template-columns: repeat(2, 1fr); }
  .field-grid.three,
  .objective-grid { grid-template-columns: repeat(3, 1fr); }
  .brief-grid { grid-template-columns: 1fr 1fr; }
  .brief-box.wide { grid-column: 1 / -1; }
  .calculator-table { min-width: 0; }
  .calculator-result { grid-template-columns: 0.8fr 1.2fr; }
  .calculator-result p { grid-column: 1 / -1; }
  .programme-scale { grid-template-columns: repeat(4, 1fr); }
  .page-number,
  .footer-note { display: block; }
  input,
  textarea { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}