:root {
  --blue: #073763;
  --teal: #00a7a7;
  --orange: #ff9e00;
  --pink: #ef3e7b;
  --green: #7bbf4b;
  --purple: #7c3aed;
  --ink: #0f172a;
  --muted: #667085;
  --paper: #ffffff;
  --soft: #f5f9fc;
  --line: #dfeaf2;
  --shadow: 0 24px 80px rgba(7, 55, 99, .15);
}

* { box-sizing: border-box; }
html { background: #dfe8ef; }
body {
  margin: 0;
  color: var(--ink);
  font-family: "DM Sans", sans-serif;
  background:
    radial-gradient(circle at 12% 4%, rgba(0,167,167,.22), transparent 28rem),
    radial-gradient(circle at 88% 10%, rgba(239,62,123,.18), transparent 22rem),
    #e8f0f6;
}

.screen-toolbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 22px;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(7,55,99,.12);
  box-shadow: 0 8px 30px rgba(7,55,99,.08);
}
.screen-toolbar strong { color: var(--blue); font-weight: 900; }
.screen-toolbar span { color: var(--muted); font-size: 14px; }
.screen-toolbar button,
.screen-toolbar .print-button {
  margin-left: auto;
  border: 0;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 800;
  color: #fff;
  background: var(--teal);
  cursor: pointer;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.screen-toolbar button:hover,
.screen-toolbar .print-button:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(0,167,167,.25); }

.media-kit {
  width: min(100%, 980px);
  margin: 32px auto 80px;
  display: grid;
  gap: 32px;
}

.sheet {
  width: 210mm;
  min-height: 297mm;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background: var(--paper);
  box-shadow: var(--shadow);
  padding: 17mm;
  isolation: isolate;
}

.paper-mark { position: absolute; z-index: -1; border-radius: 999px; filter: blur(.1px); }
.paper-mark-a { width: 120mm; height: 120mm; right: -35mm; top: -28mm; background: #e2fbfb; }
.paper-mark-b { width: 72mm; height: 72mm; left: -32mm; bottom: 28mm; background: #fff0f6; }

.brand-logo { width: 55mm; height: auto; display: block; }
.brand-logo.small { width: 44mm; }
.network-strip {
  position: absolute;
  left: 17mm;
  right: 17mm;
  bottom: 66mm;
  z-index: 8;
  min-height: 12mm;
  display: grid;
  grid-template-columns: 34mm minmax(0, 1fr);
  align-items: center;
  gap: 5mm;
  padding: 2mm 4mm;
  border: 1px solid rgba(7,55,99,.10);
  border-radius: 12px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 8px 20px rgba(7,55,99,.06);
}
.network-strip > strong {
  display: block;
  color: var(--blue);
  font-size: 8px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.network-logos {
  display: grid;
  grid-template-columns: 15mm 14mm repeat(4, 1fr);
  gap: 1.2mm;
  align-items: center;
  width: 91mm;
  height: 8mm;
}
.network-strip .network-logos {
  width: 100%;
  grid-template-columns: 18mm 17mm repeat(4, 1fr);
}
.network-logos img {
  display: block;
  width: 100%;
  height: 5.5mm;
  object-fit: contain;
  filter: drop-shadow(0 2px 3px rgba(7,55,99,.08));
}
.network-logos img.featured { height: 7.5mm; }
.network-logos img.dys {
  padding: .8mm 1mm;
  border-radius: 5px;
  background: #fff;
}
.cover-header {
  position: relative;
  min-height: 72mm;
}
.hero-visual {
  position: absolute;
  right: -18mm;
  top: -18mm;
  width: 116mm;
  height: 82mm;
  border-radius: 0 0 0 82mm;
  overflow: hidden;
  border: 0;
  box-shadow: none;
  transform: none;
}
.hero-visual::after {
  content: "";
  position: absolute;
  right: -16mm;
  bottom: -14mm;
  width: 42mm;
  height: 42mm;
  border-radius: 50%;
  background: var(--teal);
}
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

.eyebrow {
  margin: 0 0 4px;
  color: var(--teal);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 900;
  font-size: 12px;
}
h1, h2, h3, p { margin-top: 0; }
h1 {
  margin-bottom: 8px;
  color: var(--blue);
  font-family: "DM Sans", sans-serif;
  font-size: 36px;
  line-height: 1.12;
  letter-spacing: -.03em;
}
.intro-block { margin-top: -22mm; max-width: 105mm; position: relative; z-index: 2; }
.intro-block h1 .accent-teal { color: var(--teal); }
.intro-block h1 .accent-pink { color: var(--pink); }
.lead { max-width: 96mm; font-size: 15.5px; line-height: 1.35; color: #344054; }

.kpi-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 12mm;
  padding: 0 0 6mm;
  border-bottom: 1px solid rgba(7,55,99,.08);
}
.audience-stat {
  position: relative;
  min-height: 20mm;
  display: grid;
  grid-template-columns: 14mm 1fr;
  column-gap: 8px;
  align-items: center;
  padding: 0 9px;
}
.audience-stat:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 3mm;
  bottom: 3mm;
  width: 1px;
  background: #d5dde5;
}
.audience-stat .stat-icon {
  grid-row: span 2;
  width: 13mm;
  height: 13mm;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  padding: 3.1mm;
}
.audience-stat .stat-icon svg { width: 100%; height: 100%; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.audience-stat .stat-icon svg circle { fill: none; }
.audience-stat.teal .stat-icon { background: var(--teal); }
.audience-stat.orange .stat-icon { background: var(--orange); }
.audience-stat.pink .stat-icon { background: var(--pink); }
.audience-stat.green .stat-icon { background: var(--green); }
.audience-stat strong { display:block; font-size: 18px; line-height: 1; font-weight: 900; letter-spacing: -.04em; white-space: nowrap; }
.audience-stat span { display:block; margin-top: 3px; color:#344054; font-size: 11px; line-height: 1.18; }
.kpi-card, .mini-kpis article {
  border: 1px solid #e8eef5;
  border-radius: 16px;
  background: #fff;
  padding: 12px 13px;
  box-shadow: 0 10px 24px rgba(7,55,99,.06);
}
.kpi-card strong, .mini-kpis strong {
  display: block;
  font-size: 29px;
  line-height: 1;
  letter-spacing: -.04em;
  font-weight: 900;
}
.kpi-card span, .mini-kpis span { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.15; }
.teal strong, .teal h3, .mini-kpis article:nth-child(1) strong { color: var(--teal); }
.orange strong, .orange h3, .mini-kpis article:nth-child(2) strong { color: var(--orange); }
.pink strong, .pink h3, .mini-kpis article:nth-child(3) strong { color: var(--pink); }
.green strong, .green h3, .mini-kpis article:nth-child(4) strong { color: var(--green); }
.purple strong, .purple h3, .mini-kpis article:nth-child(5) strong { color: var(--purple); }
.mini-kpis article:nth-child(6) strong { color: var(--blue); }

.formats-section { margin-top: 10mm; }
.formats-section h2, .panel h2 {
  color: var(--blue);
  font-family: "Fraunces", serif;
  font-size: 24px;
  line-height: 1.05;
  letter-spacing: -.02em;
}
.formats-section h2 { text-align: center; margin-bottom: 6mm; text-transform: uppercase; font-family: "DM Sans", sans-serif; font-size: 17px; letter-spacing: .06em; }
.format-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3mm;
}
.format-card {
  min-height: 32mm;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  padding: 9px 10px 8px;
  box-shadow: 0 10px 25px rgba(7,55,99,.055);
  transition: transform .22s ease, box-shadow .22s ease;
}
.format-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px rgba(7,55,99,.12); }
.format-card h3 {
  display: inline-block;
  margin-bottom: 6px;
  padding: 5px 8px;
  border-radius: 999px;
  color: #fff;
  font-size: 9.5px;
  line-height: 1;
  text-transform: uppercase;
}
.format-card.teal h3 { background: var(--teal); }
.format-card.orange h3 { background: var(--orange); }
.format-card.pink h3 { background: var(--pink); }
.format-card.green h3 { background: var(--green); }
.format-card.purple h3 { background: var(--purple); }
.format-card p { font-size: 10.6px; line-height: 1.22; color: #344054; margin-bottom: 6px; }
.format-card ul { margin: 0; padding-left: 14px; color: var(--muted); font-size: 9.8px; line-height: 1.35; }
.format-card li::marker { color: currentColor; }

.sales-row {
  position: absolute;
  left: 17mm;
  right: 17mm;
  bottom: 20mm;
  display: grid;
  grid-template-columns: 42mm 1fr;
  gap: 6mm;
  align-items: stretch;
}
.price-box, .promise-box {
  border-radius: 18px;
  border: 1px solid var(--line);
  background: #fff;
  padding: 12px;
}
.price-box { border-color: rgba(239,62,123,.45); text-align: center; }
.price-box strong { display: block; color: var(--pink); font-size: 38px; line-height: .95; }
.price-box span { display: block; margin-top: 5px; color: var(--blue); font-weight: 900; }
.price-box small { color: var(--muted); font-size: 10px; }
.promise-box {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 10px;
  align-items: center;
  background: #eaf9f9;
  border-color: #cbeeee;
}
.promise-box div { text-align: center; }
.promise-box b {
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  margin: 0 auto 7px;
  border-radius: 50%;
  color: #fff;
  background: var(--teal);
}
.promise-box div:nth-child(2) b { background: var(--orange); }
.promise-box div:nth-child(3) b { background: var(--pink); }
.promise-box div:nth-child(4) b { background: var(--green); }
.promise-box span { display: block; color: var(--blue); font-size: 11px; font-weight: 900; }

.cta-bar {
  position: absolute;
  left: 17mm;
  right: 17mm;
  bottom: 6mm;
  min-height: 10mm;
  border-radius: 999px;
  background: var(--teal);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 16px;
  font-size: 12px;
}
.cta-bar.technical { bottom: 13mm; min-height: 14mm; border-radius: 18px; align-items: center; }
.cta-bar span { font-size: 11px; }

.page-data { background: linear-gradient(#f1f7ff 0 50mm, #fff 50mm); }
.data-header {
  display: grid;
  grid-template-columns: 48mm 1fr;
  gap: 14mm;
  align-items: start;
  margin-bottom: 15mm;
}
.data-header h1 { font-size: 34px; margin-bottom: 6px; }
.partner-badge {
  display: inline-grid;
  grid-template-columns: auto 32mm;
  align-items: center;
  gap: 3mm;
  margin-top: 3mm;
  padding: 2mm 3mm;
  border: 1px solid rgba(0,167,167,.2);
  border-radius: 10px;
  background: rgba(234,249,249,.82);
}
.partner-badge span {
  color: var(--blue);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.partner-badge img { display:block; width:32mm; height:10mm; object-fit:contain; }
.data-header p:not(.eyebrow) { color: var(--muted); font-size: 12px; line-height: 1.35; }
.data-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7mm;
}
.panel {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 12px 30px rgba(7,55,99,.06);
}
.panel h2 { margin-bottom: 12px; font-size: 20px; }
.panel p { color: #344054; font-size: 13px; line-height: 1.42; }
.mini-kpis { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.mini-kpis article { padding: 10px; box-shadow: none; }
.mini-kpis strong { font-size: 24px; }

.device-bars { display: grid; gap: 13px; margin-top: 14px; }
.device-bars div {
  display: grid;
  grid-template-columns: 70px 1fr 45px;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: var(--muted);
}
.device-bars div::before {
  content: "";
  grid-column: 2;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--teal) calc(var(--value) * 1%), #e8eef5 0);
}
.device-bars span { grid-column: 1; grid-row: 1; }
.device-bars b { grid-column: 3; grid-row: 1; color: var(--ink); text-align: right; }
.device-bars div:nth-child(2)::before { background: linear-gradient(90deg, var(--orange) calc(var(--value) * 1%), #e8eef5 0); }
.device-bars div:nth-child(3)::before { background: linear-gradient(90deg, var(--pink) calc(var(--value) * 1%), #e8eef5 0); }

table { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: 12px; font-size: 12px; }
th, td { padding: 8px 9px; border-bottom: 1px solid var(--line); text-align: left; }
th { color: var(--blue); background: #eaf2ff; font-weight: 900; }
tbody tr:nth-child(even) { background: #fafcfe; }
td:last-child, th:last-child { text-align: right; }

.quality-note {
  margin-top: 7mm;
  border: 1px solid #ffe1a6;
  border-radius: 18px;
  background: #fff9ea;
  padding: 14px 16px;
}
.quality-note strong { display: block; color: var(--orange); margin-bottom: 4px; }
.quality-note p { margin: 0; color: #4b5563; font-size: 12px; line-height: 1.35; }


/* Reprise visuelle plus proche de la brochure originale */
.page-cover::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 116mm;
  bottom: 0;
  z-index: -2;
  background: linear-gradient(180deg, #fff7ea 0%, #fffaf1 62%, #fff 100%);
}
.page-cover::after {
  content: "";
  position: absolute;
  left: 16mm;
  top: 118mm;
  width: 178mm;
  height: 8mm;
  z-index: -1;
  background:
    radial-gradient(circle at 8% 30%, rgba(0,167,167,.28) 0 2px, transparent 3px),
    radial-gradient(circle at 90% 35%, rgba(255,158,0,.35) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent 0 38%, rgba(0,167,167,.38) 38% 39%, transparent 39% 43%, rgba(255,158,0,.42) 43% 44%, transparent 44% 100%);
  opacity: .9;
}
.cover-header::before {
  content: "✎";
  position: absolute;
  right: 71mm;
  top: 4mm;
  z-index: 3;
  color: #ff9e00;
  font-size: 26px;
  transform: rotate(-26deg);
  opacity: .75;
}
.cover-header::after {
  content: "〰";
  position: absolute;
  right: -11mm;
  top: 23mm;
  z-index: 3;
  color: #ff9e00;
  font-size: 30px;
  transform: rotate(12deg);
}
.formats-section h2::before,
.formats-section h2::after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 0 10px -4px;
  background: repeating-linear-gradient(90deg, transparent 0 6px, currentColor 6px 9px, transparent 9px 14px);
  color: var(--orange);
  transform: rotate(-28deg);
  opacity: .7;
}
.formats-section h2::before { color: var(--teal); transform: rotate(28deg); }
.format-card {
  position: relative;
  min-height: 46mm;
  background: rgba(255,255,255,.96);
  box-shadow: 0 10px 28px rgba(7,55,99,.09);
}
.format-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(255,255,255,0));
  pointer-events: none;
}
.format-card > * { position: relative; z-index: 1; }
.mockup {
  position: relative;
  width: 28mm;
  height: 26mm;
  float: left;
  margin: 0 9px 4px 0;
  border: 1px solid #dbe7ee;
  border-radius: 5px;
  background: #fff;
  box-shadow: inset 0 0 0 2px #f6fafc;
  overflow: hidden;
}
.mockup::before { content:""; position:absolute; left:4px; top:4px; width:17px; height:7px; border-radius:4px; background: linear-gradient(90deg,#ff5630,#00a7a7,#ef3e7b); }
.mockup i { display:block; height:3px; margin:4px 5px; border-radius:99px; background:#d7e2ea; }
.mockup i:first-child { margin-top:16px; width:72%; }
.mockup i:nth-child(2) { width:56%; }
.mockup i:nth-child(3) { width:84%; }
.mockup b { position:absolute; right:5px; bottom:6px; width:10mm; height:14mm; border-radius:3px; background: var(--teal); }
.mockup-banner b { left:5px; right:5px; top:15px; width:auto; height:8mm; background: var(--orange); }
.mockup-news b { left:5px; right:5px; bottom:5px; width:auto; height:9mm; background: var(--pink); }
.mockup-footer b { left:0; right:0; bottom:0; width:auto; height:9mm; border-radius:0; background: var(--green); }
.mockup-article b { left:5px; top:18px; width:14mm; height:9mm; background: url('assets/hero-education.png') center/cover; }
.custom-illustration { float:left; width:28mm; height:26mm; margin:0 9px 4px 0; position:relative; }
.custom-illustration::before { content:""; position:absolute; inset:3mm 6mm; border:3px solid var(--teal); border-radius:5px 5px 16px 5px; }
.custom-illustration::after { content:""; position:absolute; left:17mm; top:12mm; width:17mm; height:4px; background:var(--teal); transform:rotate(-45deg); border-radius:99px; box-shadow:0 7px 0 var(--teal); }


/* Fit A4 after mockup enrichment */
.format-card { min-height: 38mm; padding: 8px 9px 7px; }
.format-card h3 { font-size: 8.5px; padding: 4px 7px; margin-bottom: 5px; }
.format-card p { font-size: 9.3px; line-height: 1.16; margin-bottom: 4px; }
.format-card ul { font-size: 8.2px; line-height: 1.25; padding-left: 12px; }
.mockup { width: 22mm; height: 19mm; margin: 0 7px 3px 0; }
.mockup b { width: 8mm; height: 10mm; }
.mockup-banner b { height: 6mm; }
.mockup-news b { height: 7mm; }
.mockup-footer b { height: 7mm; }
.mockup-article b { width: 11mm; height: 7mm; }
.custom-illustration { width: 22mm; height: 19mm; margin: 0 7px 3px 0; }
.custom-illustration::after { left: 13mm; top: 9mm; width: 13mm; }
.sales-row { bottom: 18mm; }


/* Alex spacing pass: logo/text/KPIs/support cards */
.page-cover .brand-logo {
  margin-top: 6mm;
}
.intro-block {
  margin-top: -27mm;
}
.kpi-strip {
  gap: 4mm;
  margin-top: 9mm;
  padding: 0;
  border-bottom: 0;
}
.audience-stat {
  min-height: 30mm;
  grid-template-columns: 1fr;
  grid-template-rows: 13mm auto auto;
  justify-items: center;
  align-items: start;
  gap: 4px;
  padding: 4.5mm 3mm 3.8mm;
  border: 1px solid rgba(7,55,99,.08);
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 22px rgba(7,55,99,.07);
  text-align: center;
}
.audience-stat:not(:last-child)::after { display: none; }
.audience-stat .stat-icon {
  grid-row: auto;
  width: 13mm;
  height: 13mm;
  margin-bottom: 1mm;
}
.audience-stat strong {
  font-size: 17px;
  line-height: 1.02;
  letter-spacing: -.045em;
}
.audience-stat span {
  margin-top: 1px;
  font-size: 10px;
  line-height: 1.15;
  color: #405064;
}
.audience-stat span small {
  display: block;
  margin-top: 3px;
  color: var(--blue);
  font-size: 6.5px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .045em;
  text-transform: uppercase;
}
.formats-section { margin-top: 8mm; }
.formats-section h2 { margin-bottom: 4mm; }
.format-grid { gap: 4mm; }
.format-card {
  min-height: 32mm;
  display: grid;
  grid-template-columns: 18mm 1fr;
  grid-template-areas:
    "title title"
    "mock text"
    "mock list";
  column-gap: 8px;
  row-gap: 3px;
  padding: 8px 9px 7px;
  overflow: hidden;
}
.format-card h3 { grid-area: title; margin-bottom: 1px; width: max-content; max-width: 100%; }
.format-card p { grid-area: text; margin: 0; font-size: 8.9px; line-height: 1.16; }
.format-card ul { grid-area: list; font-size: 7.9px; line-height: 1.2; padding-left: 11px; align-self: end; }
.mockup,
.custom-illustration {
  grid-area: mock;
  float: none;
  width: 18mm;
  height: 20mm;
  margin: 1px 0 0;
  align-self: start;
}
.mockup b { width: 7mm; height: 10mm; }
.mockup-banner b { height: 6mm; }
.mockup-news b { height: 7mm; }
.mockup-footer b { height: 7mm; }
.mockup-article b { width: 10mm; height: 7mm; }
.custom-illustration::before { inset: 2.5mm 4.5mm; }
.custom-illustration::after { left: 11mm; top: 9mm; width: 12mm; }
.sales-row { bottom: 17mm; }


/* Logo safe fix: slight down, never overlapped/covered */
.page-cover .brand-logo {
  position: relative;
  z-index: 8;
  margin-top: 2.5mm;
  margin-left: 0;
  width: 55mm;
  display: block;
}
.page-cover .hero-visual {
  z-index: 1;
  top: -14mm;
  right: -18mm;
}
.cover-header::before,
.cover-header::after {
  z-index: 6;
  pointer-events: none;
}
.intro-block {
  margin-top: -25mm;
}


/* Page 2 cleanup requested by Alex */
.page-data {
  background:
    radial-gradient(circle at 92% 4%, rgba(0,167,167,.16), transparent 34mm),
    radial-gradient(circle at 5% 8%, rgba(255,158,0,.14), transparent 30mm),
    #ffffff;
}
.data-header {
  margin-bottom: 10mm;
  padding: 9mm 10mm;
  border: 1px solid rgba(7,55,99,.10);
  border-radius: 24px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 16px 34px rgba(7,55,99,.07);
  position: relative;
  overflow: hidden;
}
.data-header::after {
  content: "";
  position: absolute;
  left: 10mm;
  right: 10mm;
  bottom: 0;
  height: 4px;
  border-radius: 999px 999px 0 0;
  background: linear-gradient(90deg, var(--teal), var(--orange), var(--pink));
}
.data-header .eyebrow {
  color: var(--teal);
  margin-bottom: 5px;
}
.data-header h1 {
  font-size: 31px;
  margin-bottom: 4px;
}
.data-header p:not(.eyebrow) {
  max-width: 92mm;
  color: #405064;
}
.mini-kpis {
  grid-template-columns: repeat(2, 1fr);
  gap: 11px;
}
.mini-kpis article {
  min-height: 25mm;
  display: flex;
  flex-direction: column;
  justify-content: center;
}


/* Alex final pass: supplied logo + raise intro block */
.page-cover .brand-logo {
  width: 72mm;
  margin-top: 1mm;
  z-index: 9;
}
.intro-block {
  margin-top: -31mm;
}
.brand-logo.small {
  width: 58mm;
}


/* Page 2 fit after restoring all audience data */
.data-header {
  margin-bottom: 7mm;
  padding: 7mm 9mm;
}
.data-header h1 { font-size: 29px; }
.data-layout { gap: 5mm; }
.panel { padding: 11px; border-radius: 16px; }
.panel h2 { font-size: 18px; margin-bottom: 9px; }
.panel p { font-size: 12px; line-height: 1.32; }
.mini-kpis { gap: 8px; }
.mini-kpis article { min-height: 20mm; padding: 8px; }
.mini-kpis strong { font-size: 22px; }
th, td { padding: 7px 8px; }
.cta-bar.technical { bottom: 7mm; min-height: 11mm; border-radius: 16px; }


/* Alex pass: stronger title, PDF visuals, original choice/CTA blocks */
.intro-block h1 {
  font-weight: 950;
  font-size: 38px;
  line-height: 1.08;
}
.lead {
  font-size: 17px;
  line-height: 1.32;
  font-weight: 500;
  color: #1f2f46;
}
.formats-section h2 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-weight: 950;
}
.formats-section h2::before,
.formats-section h2::after {
  content: "";
  width: 30px;
  height: 22px;
  display: inline-block;
  margin: 0;
  background:
    linear-gradient(currentColor 0 0) 50% 2px/28px 3px no-repeat,
    linear-gradient(currentColor 0 0) 50% 10px/22px 3px no-repeat,
    linear-gradient(currentColor 0 0) 50% 18px/28px 3px no-repeat;
  color: var(--teal);
  border-radius: 99px;
  opacity: .9;
}
.formats-section h2::after { color: var(--orange); }
.format-card {
  grid-template-columns: 1fr;
  grid-template-areas: "title" "mock" "text" "list";
  justify-items: center;
  align-content: start;
  text-align: center;
  min-height: 39mm;
  padding: 7px 9px 8px;
}
.format-card h3 {
  justify-self: center;
  text-align: center;
  margin-bottom: 3px;
}
.format-card p {
  text-align: center;
  max-width: 95%;
  font-size: 8.8px;
  line-height: 1.14;
}
.format-card ul {
  list-style: none;
  padding: 0;
  margin: 2px 0 0;
  text-align: center;
  font-size: 7.7px;
  line-height: 1.18;
}
.format-card li { margin: 1px 0; }
.format-photo {
  grid-area: mock;
  display: block;
  width: 36mm;
  height: 22mm;
  object-fit: contain;
  margin: 0 auto 3px;
  border-radius: 8px;
  filter: drop-shadow(0 8px 10px rgba(7,55,99,.11));
}
.custom-photo {
  width: 25mm;
  height: 22mm;
  object-fit: contain;
}
.sales-row {
  grid-template-columns: 42mm 1fr;
  bottom: 18mm;
}
.promise-box {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: auto 1fr;
  gap: 7px;
  align-items: center;
  padding: 10px 11px 9px;
  background: linear-gradient(90deg, rgba(232,251,251,.96), rgba(246,253,250,.96));
}
.promise-box h3 {
  grid-column: 1 / -1;
  margin: 0 0 2px;
  color: var(--blue);
  text-align: center;
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: .06em;
  font-weight: 950;
}
.promise-box div {
  min-height: 23mm;
  display: grid;
  align-content: center;
  justify-items: center;
  border-left: 1px solid rgba(7,55,99,.18);
}
.promise-box div:first-of-type { border-left: 0; }
.promise-box b {
  width: 26px;
  height: 26px;
  margin-bottom: 5px;
}
.promise-box span {
  font-size: 8.7px;
  line-height: 1.18;
  text-align: center;
}
.cta-bar {
  min-height: 17mm;
  border-radius: 20px;
  background: linear-gradient(90deg, var(--teal), #00b5b2);
  display: grid;
  grid-template-columns: auto 1fr 75mm;
  column-gap: 12px;
  align-items: center;
  padding: 0 14px;
}
.cta-bar::before {
  content: "✉";
  width: 13mm;
  height: 13mm;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  color: var(--teal);
  font-size: 22px;
  font-weight: 900;
}
.cta-bar strong {
  font-size: 14px;
  line-height: 1.05;
  text-transform: uppercase;
}
.cta-bar span {
  font-size: 11.5px;
  line-height: 1.15;
  font-weight: 700;
}
.cta-bar em {
  justify-self: end;
  background: #fff;
  color: var(--blue);
  border-radius: 999px;
  padding: 8px 15px;
  font-style: normal;
  font-weight: 800;
  font-size: 11px;
  white-space: nowrap;
}
.data-header p:not(.eyebrow) { display: none; }


/* Fit page 1 after PDF image cards */
.kpi-strip { margin-top: 6mm; }
.audience-stat { min-height: 25mm; padding: 3.2mm 2.5mm 3mm; }
.audience-stat .stat-icon { width: 11mm; height: 11mm; }
.audience-stat strong { font-size: 15px; }
.audience-stat span { font-size: 8.8px; }
.formats-section { margin-top: 5mm; }
.formats-section h2 { margin-bottom: 3mm; font-size: 15px; }
.format-grid { gap: 3mm; }
.format-card {
  min-height: 29mm;
  padding: 6px 7px 6px;
  border-radius: 12px;
}
.format-card h3 { font-size: 6.9px; padding: 3px 6px; margin-bottom: 1px; }
.format-photo {
  width: 27mm;
  height: 15mm;
  margin-bottom: 2px;
}
.custom-photo { width: 20mm; height: 15mm; }
.format-card p { font-size: 7.1px; line-height: 1.08; max-width: 98%; }
.format-card ul { font-size: 6.3px; line-height: 1.08; margin-top: 1px; }
.sales-row {
  bottom: 23mm;
  grid-template-columns: 35mm 1fr;
  gap: 4mm;
}
.price-box, .promise-box { border-radius: 14px; }
.price-box { padding: 8px; }
.price-box strong { font-size: 32px; }
.price-box span { font-size: 10px; }
.price-box small { font-size: 8px; }
.promise-box { padding: 7px 8px 6px; gap: 4px; }
.promise-box h3 { font-size: 8.5px; }
.promise-box div { min-height: 17mm; }
.promise-box b { width: 21px; height: 21px; margin-bottom: 3px; font-size: 10px; }
.promise-box span { font-size: 7.3px; line-height: 1.08; }
.cta-bar {
  bottom: 5mm;
  min-height: 14mm;
  grid-template-columns: auto 1fr 68mm;
  padding: 0 12px;
}
.cta-bar::before { width: 10mm; height: 10mm; font-size: 17px; }
.cta-bar strong { font-size: 11px; }
.cta-bar span { font-size: 9.4px; }
.cta-bar em { font-size: 8.8px; padding: 7px 11px; }


/* CTA overlap fix: scoped to cover page */
.page-cover .sales-row {
  bottom: 31mm;
  align-items: stretch;
}
.page-cover .price-box {
  padding: 7px 8px;
  display: grid;
  align-content: center;
}
.page-cover .promise-box {
  padding: 6px 8px 5px;
  gap: 3px 4px;
}
.page-cover .promise-box h3 { font-size: 8px; margin-bottom: 0; }
.page-cover .promise-box div { min-height: 13mm; }
.page-cover .promise-box b { width: 18px; height: 18px; margin-bottom: 2px; }
.page-cover .promise-box span { font-size: 6.7px; line-height: 1.05; }
.page-cover .cta-bar {
  left: 17mm;
  right: 17mm;
  bottom: 6mm;
  min-height: 18mm;
  border-radius: 18px;
  display: grid;
  grid-template-columns: 11mm minmax(0, 1fr) 68mm;
  grid-template-rows: auto auto;
  grid-template-areas:
    "icon title contact"
    "icon text contact";
  column-gap: 10px;
  row-gap: 2px;
  align-items: center;
  padding: 6px 10px;
  overflow: hidden;
}
.page-cover .cta-bar::before {
  grid-area: icon;
  width: 10mm;
  height: 10mm;
}
.page-cover .cta-bar strong {
  grid-area: title;
  font-size: 11px;
  line-height: 1.05;
  align-self: end;
}
.page-cover .cta-bar span {
  grid-area: text;
  font-size: 8.8px;
  line-height: 1.08;
  align-self: start;
}
.page-cover .cta-bar em {
  grid-area: contact;
  justify-self: end;
  max-width: 68mm;
  white-space: normal;
  text-align: center;
  font-size: 8.2px;
  line-height: 1.1;
  padding: 6px 9px;
}
.page-data .cta-bar.technical {
  display: grid;
  grid-template-columns: 11mm 1fr 58mm;
  min-height: 13mm;
  bottom: 7mm;
}


/* 12-month visitor average table */
.monthly-panel {
  padding: 10px 11px;
}
.monthly-panel h2 {
  margin-bottom: 7px;
}
.avg-box {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 9px;
  margin-bottom: 7px;
  padding: 8px 10px;
  border-radius: 13px;
  background: linear-gradient(90deg, rgba(0,167,167,.13), rgba(255,158,0,.12));
  border: 1px solid rgba(0,167,167,.20);
}
.avg-box strong {
  color: var(--teal);
  font-size: 28px;
  line-height: .9;
  letter-spacing: -.04em;
  font-weight: 950;
}
.avg-box span {
  color: var(--blue);
  font-size: 11px;
  line-height: 1.12;
  font-weight: 850;
}
.monthly-table {
  font-size: 10.4px;
  border-radius: 10px;
}
.monthly-table th,
.monthly-table td {
  padding: 4.8px 7px;
}
.monthly-table td:last-child,
.monthly-table th:last-child {
  text-align: right;
  font-weight: 850;
  color: var(--blue);
}


/* Alex layout final: header, support cards, CTA contact stack, page2 fill */
.page-cover .brand-logo {
  width: 55mm;
  margin-top: -2mm;
  margin-left: -1mm;
}
.intro-block {
  margin-top: -30mm;
}
.intro-block h1 {
  font-size: 34px;
  line-height: 1.08;
  font-weight: 950;
  max-width: 100mm;
}
.lead {
  font-size: 17.5px;
  line-height: 1.3;
}
.audience-stat span {
  font-size: 10px;
  line-height: 1.15;
  font-weight: 750;
}
.format-card {
  grid-template-columns: 23mm minmax(0, 1fr);
  grid-template-areas:
    "mock title"
    "mock text"
    "mock list";
  justify-items: stretch;
  align-items: center;
  text-align: left;
  min-height: 31mm;
  padding: 7px 8px;
  column-gap: 8px;
}
.format-card h3 {
  justify-self: start;
  text-align: left;
  margin: 0 0 2px;
  white-space: normal;
  line-height: 1.05;
}
.format-card p {
  text-align: left;
  max-width: none;
  font-size: 8.2px;
  line-height: 1.12;
}
.format-card ul {
  text-align: left;
  list-style: disc;
  padding-left: 10px;
  font-size: 6.9px;
  line-height: 1.1;
}
.format-photo {
  width: 22mm;
  height: 24mm;
  margin: 0;
  align-self: center;
  justify-self: center;
  object-fit: contain;
}
.custom-photo { width: 19mm; height: 22mm; }
.page-cover .price-box small {
  font-size: 7px;
  line-height: 1.1;
}
.page-cover .price-box span {
  font-size: 9.2px;
  line-height: 1.05;
}
.page-cover .cta-bar em {
  display: grid;
  gap: 2px;
  white-space: normal;
  text-align: left;
  justify-self: stretch;
  font-size: 8.4px;
  line-height: 1.12;
}
.page-cover .cta-bar em i {
  display: inline-grid;
  place-items: center;
  width: 13px;
  height: 13px;
  margin-right: 4px;
  border-radius: 50%;
  background: var(--teal);
  color: #fff;
  font-size: 8px;
  font-style: normal;
}
.media-takeaways {
  position: absolute;
  left: 17mm;
  right: 17mm;
  bottom: 22mm;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4mm;
}
.media-takeaways article {
  min-height: 26mm;
  border: 1px solid rgba(0,167,167,.18);
  border-radius: 15px;
  background: linear-gradient(135deg, #ffffff, #f0fbfb);
  padding: 9px 10px;
  box-shadow: 0 10px 22px rgba(7,55,99,.055);
}
.media-takeaways strong {
  display: block;
  color: var(--teal);
  font-size: 16px;
  line-height: 1.02;
  font-weight: 950;
  margin-bottom: 5px;
}
.media-takeaways span {
  display: block;
  color: #405064;
  font-size: 9.2px;
  line-height: 1.22;
  font-weight: 700;
}
.page-data .cta-bar.technical {
  bottom: 6mm;
  min-height: 12mm;
}


/* Alex tweak: bigger sales proof block + aligned contact lines */
.page-cover .sales-row {
  grid-template-columns: 39mm 1fr;
  gap: 4.5mm;
}
.page-cover .price-box {
  padding: 8px 8px;
}
.page-cover .price-box strong {
  font-size: 38px;
  line-height: .9;
}
.page-cover .price-box span {
  font-size: 10.8px;
  line-height: 1.05;
  margin-top: 4px;
}
.page-cover .price-box small {
  font-size: 7.7px;
  line-height: 1.12;
}
.page-cover .promise-box {
  padding: 8px 10px 7px;
  gap: 4px 5px;
}
.page-cover .promise-box h3 {
  font-size: 10px;
  margin-bottom: 1px;
  letter-spacing: .055em;
}
.page-cover .promise-box div {
  min-height: 16mm;
}
.page-cover .promise-box b {
  width: 21px;
  height: 21px;
  margin-bottom: 3px;
  font-size: 11px;
}
.page-cover .promise-box span {
  font-size: 7.7px;
  line-height: 1.1;
}
.page-cover .cta-bar em {
  width: 66mm;
  max-width: 66mm;
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: stretch;
  text-align: left;
  padding: 6px 10px;
}
.page-cover .cta-bar em span {
  grid-area: auto;
  display: grid;
  grid-template-columns: 15px 1fr;
  align-items: center;
  column-gap: 5px;
  font-size: 8.7px;
  line-height: 1.05;
  font-weight: 850;
  white-space: nowrap;
}
.page-cover .cta-bar em i {
  margin-right: 0;
  justify-self: center;
}

/* RS network correction pass: compact brand rail and collision-free page 2 */
.page-cover .cover-header { min-height: 62mm; }
.page-cover .intro-block { margin-top: -31mm; }
.partner-line {
  display: flex;
  align-items: center;
  gap: 3mm;
  margin-top: 2mm;
}
.partner-line span {
  color: var(--teal);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.partner-line img { display:block; width:25mm; height:7mm; object-fit:contain; }
.network-traffic-table td strong { display:block; color:var(--teal); font-size:15px; line-height:1; }
.network-traffic-table td small { display:block; margin-top:3px; color:var(--muted); font-size:8px; line-height:1.1; }
.page-data .data-header {
  grid-template-columns: 39mm minmax(0, 1fr);
  gap: 8mm;
  align-items: center;
  min-height: 35mm;
  padding: 6mm 8mm;
}
.page-data .brand-logo.small { width: 38mm; max-width: 100%; }
.page-data .data-header h1 { max-width: 112mm; font-size: 24px; line-height: 1.08; margin: 0; }
.page-data .data-header .eyebrow { font-size: 9px; }
.page-data .data-layout { margin-top: 0; }

/* Alex final branding/layout pass */
.page-cover .brand-logo {
  width: 68mm;
}
.kpi-strip { position: relative; }
.partner-ribbon {
  position: absolute;
  left: -15mm;
  top: 0;
  bottom: 0;
  width: 12mm;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 3mm 2mm;
  border-radius: 0 12px 12px 0;
  background: linear-gradient(180deg, var(--teal), #008f95);
  color: #fff;
  box-shadow: 0 8px 22px rgba(0,167,167,.18);
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-align: center;
  z-index: 3;
}
.partner-ribbon span { font-size: 6.5px; line-height: 1; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.partner-ribbon strong { color:#fff; font-size:8px; line-height:1; font-weight:950; letter-spacing:.05em; text-transform:uppercase; }
.network-strip {
  min-height: 20mm;
  padding: 2mm 4mm;
  bottom: 66mm;
}
.network-strip .network-logos {
  width: 100%;
  height: 16mm;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 9mm 6mm;
  gap: 1mm;
}
.network-featured,
.network-secondary {
  display: grid;
  align-items: center;
  justify-content: center;
}
.network-featured { grid-template-columns: 34mm 30mm; gap: 7mm; }
.network-secondary { grid-template-columns: repeat(4, minmax(20mm, 1fr)); gap: 3mm; }
.network-strip .network-featured img { width:100%; height:9mm; object-fit:contain; }
.network-strip .network-featured img.dys { height:8.5mm; padding:.5mm 1mm; }
.network-strip .network-secondary img { width:100%; height:5.5mm; object-fit:contain; }
.page-data .data-header {
  grid-template-columns: 55mm minmax(0, 1fr);
  gap: 7mm;
}
.page-data .brand-logo.small { width: 53mm; max-width:100%; }
.page-data .partner-line img { width: 35mm; height: 10mm; }
.page-data .media-takeaways {
  bottom: 40mm;
}
.page-data .media-takeaways article {
  min-height: 18mm;
  padding: 7px 9px;
}
.page-data .media-takeaways strong { font-size: 14px; margin-bottom: 3px; }
.page-data .media-takeaways span { font-size: 7.8px; line-height: 1.15; }
.page-data > .network-traffic-panel {
  position: absolute;
  left: 17mm;
  right: 17mm;
  bottom: 19mm;
  min-height: 18mm;
  display: grid;
  grid-template-columns: 49mm minmax(0, 1fr);
  align-items: center;
  gap: 4mm;
  padding: 6px 10px;
  border-radius: 14px;
}
.page-data > .network-traffic-panel h2 { margin:0; font-size:16px; line-height:1.05; }
.page-data > .network-traffic-panel .network-traffic-table thead { display:none; }
.page-data > .network-traffic-panel .network-traffic-table tbody {
  display:grid;
  grid-template-columns:repeat(3,1fr);
}
.page-data > .network-traffic-panel .network-traffic-table tr {
  display:grid;
  grid-template-columns:1fr;
  justify-items:center;
  padding:0 2mm;
  border-left:1px solid var(--line);
  background:transparent;
}
.page-data > .network-traffic-panel .network-traffic-table td {
  display:block;
  width:100%;
  padding:1px 0;
  border:0;
  text-align:center;
  font-size:9px;
}
.page-data > .network-traffic-panel .network-traffic-table td strong { font-size:13px; }
.page-data > .network-traffic-panel .network-traffic-table td small { margin-top:1px; font-size:6.5px; }

/* KPI partner band: explicit scope, no side rail */
.page-cover .kpi-strip {
  grid-template-columns: repeat(4, 1fr);
  gap: 2.5mm;
  margin-top: 6mm;
  padding: 3mm;
  border: 1px solid rgba(0,167,167,.20);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(234,249,249,.96), rgba(255,255,255,.98));
  box-shadow: 0 12px 28px rgba(7,55,99,.07);
}
.kpi-heading {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 36mm minmax(0, 1fr);
  align-items: center;
  gap: 4mm;
  min-height: 8mm;
  padding: 0 1mm 2mm;
  border-bottom: 1px solid rgba(0,167,167,.16);
}
.kpi-heading img {
  display: block;
  width: 35mm;
  height: 9mm;
  object-fit: contain;
}
.kpi-heading div { display: grid; gap: 1px; }
.kpi-heading span {
  color: var(--teal);
  font-size: 6.5px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.kpi-heading strong {
  color: var(--blue);
  font-size: 14px;
  line-height: 1.05;
  font-weight: 950;
  letter-spacing: -.01em;
}
.page-cover .kpi-strip .audience-stat {
  min-height: 21mm;
  padding: 2mm 2mm 2.2mm;
  border-radius: 14px;
  box-shadow: 0 7px 16px rgba(7,55,99,.055);
}
.page-cover .kpi-strip .audience-stat .stat-icon { width: 9.5mm; height: 9.5mm; padding: 2.4mm; }
.page-cover .kpi-strip .audience-stat strong { font-size: 14px; }
.page-cover .kpi-strip .audience-stat span { font-size: 8.2px; }
.page-cover .formats-section { margin-top: 3mm; }

/* Network media rail: one line with dot separators */
.page-cover .network-strip {
  min-height: 14mm;
  bottom: 60mm;
  grid-template-columns: 43mm minmax(0, 1fr);
  gap: 4mm;
  padding: 2mm 4mm;
}
.page-cover .network-strip > strong {
  font-size: 10.5px;
  line-height: 1.05;
  letter-spacing: .045em;
}
.page-cover .network-strip .network-logos {
  width: 100%;
  height: 8mm;
  display: grid;
  grid-template-columns: 22mm 1.5mm 20mm 1.5mm 18mm 1.5mm 18mm 1.5mm 18mm 1.5mm minmax(20mm, 1fr);
  grid-template-rows: 8mm;
  gap: 0;
  align-items: center;
}
.page-cover .network-strip .network-logos img {
  width: 100%;
  height: 6mm;
  padding: 0 .7mm;
  object-fit: contain;
}
.page-cover .network-strip .network-logos img:first-child { height: 7mm; }
.page-cover .network-strip .network-logos img.dys { height: 6.5mm; padding: .5mm 1mm; }
.page-cover .network-strip .network-logos i {
  display: block;
  width: 3px;
  height: 3px;
  margin: auto;
  border-radius: 50%;
  background: var(--teal);
  opacity: .72;
}

@media screen and (max-width: 860px) {
  .screen-toolbar { flex-wrap: wrap; }
  .screen-toolbar button, .screen-toolbar .print-button { margin-left: 0; }
  .media-kit { width: 100%; margin: 16px 0 40px; }
  .sheet { width: 100%; min-height: auto; padding: 22px; }
  .cover-header, .data-header, .data-layout, .sales-row { grid-template-columns: 1fr; }
  .hero-visual { height: 220px; }
  .network-strip { position: static; grid-template-columns: 1fr; gap: 10px; margin-top: 22px; }
  .network-logos { grid-template-columns: repeat(4, 1fr); height: auto; row-gap: 8px; }
  .page-data .data-header { grid-template-columns: 1fr; gap: 14px; }
  .page-data .data-header h1 { font-size: 30px; max-width: none; }
  .kpi-strip, .format-grid, .promise-box { grid-template-columns: 1fr 1fr; }
  h1 { font-size: 42px; }
  .sales-row, .cta-bar { position: static; margin-top: 22px; }
  .cta-bar { border-radius: 18px; padding: 13px; flex-direction: column; align-items: flex-start; }
}

@media screen and (max-width: 860px) {
  .partner-ribbon {
    position: static;
    grid-column: 1 / -1;
    width: 100%;
    min-height: 28px;
    flex-direction: row;
    padding: 7px 10px;
    border-radius: 10px;
    writing-mode: horizontal-tb;
    transform: none;
  }
  .partner-ribbon span,
  .partner-ribbon strong { font-size: 9px; }
}

@page { size: A4; margin: 0; }
@media print {
  html, body { background: #fff; }
  .screen-toolbar { display: none; }
  .media-kit { display: block; width: auto; margin: 0; }
  .sheet {
    width: 210mm;
    height: 297mm;
    min-height: 297mm;
    margin: 0;
    box-shadow: none;
    page-break-after: always;
    break-after: page;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .sheet:last-child { page-break-after: auto; break-after: auto; }
  .format-card:hover, .screen-toolbar button:hover, .screen-toolbar .print-button:hover { transform: none; box-shadow: none; }
}