@page{
  size:A4 portrait;
  margin:0;
}

:root{
  --blue:#0c5aa8;
  --green:#0d8a6d;
  --gold:#f3bf1a;
  --ink:#17324a;
  --muted:#58718a;
  --line:#d9e4ec;
  --soft:#edf4fa;
  --paper:#ffffff;
  --bg:#eef4f8;
  --radius:8px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}

img{display:block;max-width:100%}
h1,h2,h3,h4,p{margin:0}
a{text-decoration:none;color:inherit}

.brochure{
  padding:10mm 0;
}

.page{
  position:relative;
  width:210mm;
  height:297mm;
  margin:0 auto 10mm;
  padding:11mm 11mm 9mm;
  background:var(--paper);
  overflow:hidden;
  box-shadow:0 24px 60px rgba(18,42,63,.14);
  break-after:page;
  page-break-after:always;
}

.page:last-child{
  margin-bottom:0;
  break-after:auto;
  page-break-after:auto;
}

.page::before,
.page::after{
  content:"";
  position:absolute;
  border-radius:999px;
  pointer-events:none;
}

.page::before{
  width:108mm;
  height:108mm;
  left:-24mm;
  top:36mm;
  background:rgba(12,90,168,.08);
}

.page::after{
  width:54mm;
  height:54mm;
  right:-12mm;
  bottom:18mm;
  background:rgba(243,191,26,.14);
}

.header{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8mm;
}

.brand-row{
  display:grid;
  grid-template-columns:40mm 1fr;
  gap:6mm;
  align-items:start;
  flex:1;
}

.brand-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:22mm;
  border-radius:11mm;
  background:var(--blue);
  color:#fff;
  font-size:18mm;
  line-height:1;
  letter-spacing:.4mm;
}

.title h1{
  color:var(--blue);
  font-size:13.5mm;
  line-height:1.02;
  font-weight:400;
}

.nowrap{
  white-space:nowrap;
}

.title-line{
  width:100%;
  height:1mm;
  margin-top:3mm;
  background:var(--gold);
}

.logo{
  width:12mm;
  height:12mm;
  object-fit:contain;
  margin-top:1mm;
}

.intro{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:16mm 1fr;
  gap:4mm;
  align-items:start;
  margin-top:5mm;
}

.intro-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:16mm;
  height:16mm;
  border-radius:3mm;
  background:var(--blue);
  color:var(--gold);
  font-size:5.6mm;
  font-weight:700;
}

.intro p{
  color:var(--blue);
  font-size:4.7mm;
  line-height:1.24;
}

.hero{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:5mm;
  align-items:start;
  margin-top:5mm;
}

.photo-card,
.summary-card,
.panel,
.section-card,
.scenario{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.96);
}

.photo-card{
  padding:3mm;
}

.photo-card img{
  width:100%;
  height:66mm;
  object-fit:contain;
}

.summary{
  display:grid;
  gap:3mm;
}

.summary-card{
  padding:3mm 3.4mm;
}

.summary-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20mm;
  height:8mm;
  margin-bottom:2mm;
  padding:0 4mm;
  border-radius:4mm;
  background:var(--blue);
  color:#fff;
  font-size:4.4mm;
}

.summary-text{
  color:var(--blue);
  font-size:3.9mm;
  line-height:1.22;
}

.callout-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5mm 3mm;
}

.callout{
  display:grid;
  grid-template-columns:8mm 1fr;
  gap:2.5mm;
  align-items:center;
}

.callout-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:8mm;
  height:8mm;
  border-radius:50%;
  border:1px solid var(--gold);
  color:var(--blue);
  font-size:2.8mm;
  font-weight:700;
}

.callout strong{
  color:var(--blue);
  font-size:3.5mm;
  line-height:1.14;
  font-weight:400;
}

.two-col{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5mm;
  margin-top:5mm;
}

.panel{
  padding:3mm 3.5mm 3.5mm;
}

.panel h2,
.scenario h2{
  color:var(--blue);
  font-size:8mm;
  line-height:.94;
  font-weight:700;
}

.title-tight{
  white-space:nowrap;
  font-size:6.7mm !important;
}

.title-tight-long{
  white-space:nowrap;
  font-size:6.2mm !important;
}

.lead{
  margin-top:2mm;
  padding-bottom:2mm;
  border-bottom:1mm solid var(--gold);
  color:var(--blue);
  font-size:3.8mm;
  line-height:1.2;
}

.feature-list{
  display:grid;
  gap:2mm;
  margin:2.5mm 0 0;
  padding:0;
  list-style:none;
}

.feature-list li{
  display:grid;
  gap:1mm;
}

.feature-list strong{
  color:var(--blue);
  font-size:3.6mm;
}

.feature-list span{
  color:var(--ink);
  font-size:3.25mm;
  line-height:1.18;
}

.scenario{
  position:relative;
  z-index:2;
  margin-top:4mm;
  padding:3mm 3.5mm 3.8mm;
}

.scenario-line{
  width:100%;
  height:1mm;
  margin-top:2mm;
  background:var(--gold);
}

.scenario p{
  margin-top:2mm;
  color:var(--blue);
  font-size:3.5mm;
  line-height:1.2;
}

.page-tag{
  position:absolute;
  right:11mm;
  bottom:7mm;
  color:var(--muted);
  font-size:3.1mm;
}

.content-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:5mm;
  margin-top:5mm;
}

.stack{
  display:grid;
  gap:4mm;
}

.section-card{
  padding:3mm 3.5mm;
}

.section-card h2{
  margin-bottom:2mm;
  color:var(--blue);
  font-size:5.8mm;
  line-height:1;
}

.detail-list{
  display:grid;
  gap:1.4mm;
}

.detail{
  padding-top:1.4mm;
  border-top:1px solid var(--line);
}

.detail:first-child{
  padding-top:0;
  border-top:none;
}

.detail strong{
  display:block;
  margin-bottom:.5mm;
  color:var(--blue);
  font-size:3.4mm;
}

.detail p{
  color:var(--ink);
  font-size:3.05mm;
  line-height:1.16;
}

.mini-photo{
  padding:3mm;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fafcfe;
}

.mini-photo img{
  width:100%;
  height:46mm;
  object-fit:contain;
}

.metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2mm;
  margin-top:2.5mm;
}

.metric{
  padding:2mm;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}

.metric strong{
  display:block;
  color:var(--blue);
  font-size:3.3mm;
  margin-bottom:.4mm;
}

.metric span{
  display:block;
  color:var(--ink);
  font-size:2.9mm;
  line-height:1.12;
}

.footer-note{
  margin-top:2.5mm;
  color:var(--muted);
  font-size:2.7mm;
  line-height:1.14;
}

@media print{
  html,body{
    width:210mm;
    height:auto;
    background:#fff;
  }

  .brochure{
    padding:0;
  }

  .page{
    height:297mm;
    margin:0;
    box-shadow:none;
  }
}