/* ============================================================
   Proactive Sustainable Bonds — Investor Deck
   Refined brand-match design system
   ============================================================ */

:root {
  --green:      #1E6A53;
  --green-dk:   #163B42;
  --green-deep: #0F3D30;
  --teal:       #1F525C;
  --sage:       #E3EAE6;
  --sage-2:     #D5E3DD;
  --sage-3:     #F1F5F3;
  --orange:     #FA9C26;
  --ink:        #1C2421;
  --ink-soft:   #4A574F;
  --paper:      #FFFDFA;
  --line:       #DCE5E0;

  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --shadow: 0 24px 60px -20px rgba(15, 61, 48, .35), 0 4px 14px rgba(15, 61, 48, .12);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  height: 100%;
  background: #0c211b;
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  color: var(--ink);
}

/* ---------- Scroll shell ---------- */
.deck {
  height: 100vh;
  height: 100dvh;
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scroll-behavior: smooth;
  background:
    radial-gradient(900px 600px at 80% -10%, #1d5644 0%, transparent 60%),
    radial-gradient(700px 500px at 0% 110%, #1b4a3c 0%, transparent 55%),
    #0c211b;
}
.deck::-webkit-scrollbar { width: 0; }

.slide {
  min-height: 100vh;
  min-height: 100dvh;
  scroll-snap-align: start;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3.2vh 4vw;
}

/* ---------- The 16:9 canvas ---------- */
.canvas {
  position: relative;
  width: min(94vw, calc((100vh - 6.4vh) * 16 / 9));
  aspect-ratio: 16 / 9;
  container-type: inline-size;
  background: var(--paper);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow);
  font-size: 1.45cqw;
  line-height: 1.5;
  color: var(--ink);
}

/* page number */
.pageno {
  position: absolute;
  right: 2.4cqw; bottom: 1.9cqw;
  font-size: 1.15cqw; font-weight: 600;
  color: var(--ink-soft); opacity: .55;
  letter-spacing: .03em;
}
.pageno.on-dark { color: #fff; opacity: .6; }

.footer-id {
  position: absolute;
  left: 2.8cqw; bottom: 2cqw;
  font-size: 1cqw; letter-spacing: .04em;
  color: var(--ink-soft); opacity: .6;
}
.footer-id.on-dark { color: #cfe0d8; opacity: .7; }
.footer-id sup { font-size: .68em; }

/* ---------- Shared interior layout ---------- */
.pad { position: absolute; inset: 0; padding: 4.6cqw 4.4cqw; display: flex; flex-direction: column; }

.kicker {
  font-size: 1.18cqw; font-weight: 700; letter-spacing: .19em;
  text-transform: uppercase; color: var(--green);
  display: flex; align-items: center; gap: .8cqw;
}
.kicker::before {
  content: ""; width: 2.6cqw; height: .26cqw;
  background: var(--orange); border-radius: 2px;
}
.s-title {
  font-size: 3.5cqw; font-weight: 800; letter-spacing: -.018em;
  color: var(--green-dk); line-height: 1.08; margin-top: 1.5cqw;
}
.s-sub {
  font-size: 1.62cqw; color: var(--ink-soft); font-weight: 500;
  margin-top: 1.1cqw; max-width: 72cqw;
}
.tm { font-size: .54em; vertical-align: .55em; font-weight: 700; }

/* ---------- Cards & primitives ---------- */
.card {
  background: #fff; border: 1px solid var(--line);
  border-radius: 12px; padding: 2.4cqw 2.6cqw;
}
.card-tint { background: var(--sage-3); border-color: transparent; }

.eyebrow {
  font-size: 1.28cqw; font-weight: 800; letter-spacing: .04em;
  color: var(--green); text-transform: uppercase;
}

.stat-num {
  font-size: 5.4cqw; font-weight: 800; letter-spacing: -.03em;
  color: var(--teal); line-height: 1;
}
.stat-label {
  font-size: 1.5cqw; font-weight: 600; color: var(--ink-soft);
  margin-top: .7cqw;
}

a.linkpill, .linkpill {
  display: inline-flex; align-items: center; gap: .8cqw;
  background: var(--green); color: #fff; text-decoration: none;
  border-radius: 100px; padding: .85cqw 1.5cqw .85cqw 1cqw;
  font-weight: 700; font-size: 1.12cqw; line-height: 1.2;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  box-shadow: 0 6px 16px -6px rgba(30,106,83,.6);
}
a.linkpill:hover { transform: translateY(-2px); background: #185b47; box-shadow: 0 12px 22px -8px rgba(30,106,83,.7); }
.linkpill .ico {
  width: 2cqw; height: 2cqw; flex: none;
  background: rgba(255,255,255,.18); border-radius: 50%;
  display: grid; place-items: center; font-size: 1.05cqw;
}

/* ============================================================
   SLIDE 1 — Founder letter
   ============================================================ */
.s-cover { background: var(--paper); }
.s-cover .pad { padding: 0; flex-direction: row; }
.cover-rail {
  width: 7cqw; flex: none;
  background: linear-gradient(180deg, var(--green) 0%, var(--green-deep) 100%);
  display: flex; align-items: flex-end; justify-content: center;
  padding-bottom: 3cqw;
}
.cover-rail span {
  writing-mode: vertical-rl; transform: rotate(180deg);
  color: #cfe5dc; font-size: 1.05cqw; letter-spacing: .26em;
  text-transform: uppercase; font-weight: 700;
}
.cover-body { padding: 4.4cqw 5cqw; display: flex; flex-direction: column; }
.cover-body .kicker { margin-bottom: 1.4cqw; }
.cover-head {
  font-size: 2.7cqw; font-weight: 800; color: var(--green-dk);
  letter-spacing: -.02em; line-height: 1.12;
}
.letter { margin-top: 1.7cqw; }
.letter p {
  font-size: 1.27cqw; line-height: 1.62; color: var(--ink);
  margin-bottom: .85cqw;
}
.letter p.lead::first-letter { }
.letter b { color: var(--green-dk); }
.sign { margin-top: auto; padding-top: 1.2cqw; }
.sign .sigwrap { width: 19cqw; height: 6cqw; position: relative; margin-bottom: .1cqw; }
.sign .sigwrap img {
  position: absolute; left: 50%; top: 50%; width: 5.4cqw;
  transform: translate(-50%, -50%) rotate(-90deg);
}
.sign .nm { font-size: 1.5cqw; font-weight: 800; color: var(--green-dk); }
.sign .rl { font-size: 1.12cqw; color: var(--ink-soft); }

/* ============================================================
   SLIDE 2 — Title
   ============================================================ */
.s-title-slide {
  background:
    radial-gradient(700px 480px at 78% 12%, #2a7d63 0%, transparent 62%),
    linear-gradient(160deg, #1f6a54 0%, #134235 70%, #0e3528 100%);
}
.s-title-slide .pad { justify-content: center; }
.title-logo { height: 9.5cqw; margin-bottom: 4.4cqw; }
.title-tag {
  font-size: 4.4cqw; font-weight: 800; color: #fff;
  letter-spacing: -.02em; line-height: 1.16;
}
.title-tag .dot { color: var(--orange); }
.title-rule { width: 9cqw; height: .42cqw; background: var(--orange); border-radius: 3px; margin: 3cqw 0; }
.title-contact { display: flex; flex-direction: column; gap: .5cqw; }
.title-contact .web { font-size: 1.95cqw; font-weight: 800; color: #fff; }
.title-contact .row { font-size: 1.4cqw; font-weight: 600; color: #bcd6cc; }
.title-foot {
  position: absolute; left: 4.4cqw; bottom: 3.4cqw;
  font-size: 1.16cqw; color: #cfe5dc;
}
.title-foot b { color: #fff; }
.title-badge {
  position: absolute; right: 4.4cqw; bottom: 3.4cqw;
  border: 1px solid rgba(255,255,255,.35); color: #fff;
  font-size: 1.04cqw; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; padding: .85cqw 1.5cqw; border-radius: 100px;
}

/* ============================================================
   SLIDE 3 — Disclosures
   ============================================================ */
.disc-grid {
  margin-top: 2.4cqw; columns: 2; column-gap: 3.2cqw;
  font-size: 1.04cqw; line-height: 1.5; color: var(--ink-soft);
}
.disc-grid p { margin-bottom: .95cqw; break-inside: avoid; }
.disc-grid p::before {
  content: ""; display: inline-block; width: 1.1cqw; height: 1.1cqw;
  background: var(--sage-2); border-radius: 3px; margin-right: .7cqw;
  vertical-align: -.05cqw;
}
.disc-grid b { color: var(--green-dk); }

/* ============================================================
   SLIDE 4 — Returns / impact
   ============================================================ */
.metric-row { display: grid; grid-template-columns: 1fr 1fr; gap: 2.2cqw; margin-top: 2.6cqw; }
.metric-row .card { padding: 2.2cqw 2.4cqw; }
.metric-row .eyebrow { margin-bottom: 1cqw; }
.metric-row li { list-style: none; font-size: 1.28cqw; margin-bottom: .7cqw; display: flex; gap: .8cqw; }
.metric-row li::before { content: "▸"; color: var(--orange); font-size: 1.1cqw; }
.metric-row .big { font-size: 1.6cqw; }
.metric-row .big b { color: var(--green-dk); }

.partners {
  margin-top: auto; margin-bottom: 2.6cqw;
  border-top: 1px solid var(--line); padding-top: 1.8cqw;
  display: flex; align-items: center; gap: 2.4cqw;
}
.partners .plabel { font-size: 1.3cqw; font-weight: 800; color: var(--green); max-width: 16cqw; line-height: 1.25; }
.partners .logos { display: flex; align-items: center; gap: 2.4cqw; }
.partners .logos img { height: 4.4cqw; width: auto; object-fit: contain; }
.partners .logos img.wide { height: 3.2cqw; }

/* ============================================================
   SLIDE 5 — Structural imbalance
   ============================================================ */
.s5-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 2.6cqw; margin-top: 1.3cqw; flex: 1; }
.s5-stat {
  background: linear-gradient(150deg, var(--sage) 0%, var(--sage-2) 100%);
  border-radius: 12px; padding: 1.4cqw 1.8cqw; margin-bottom: 1.1cqw;
}
.s5-stat .n { font-size: 3.5cqw; font-weight: 800; color: var(--green-dk); letter-spacing: -.03em; }
.s5-stat .l { font-size: 1.32cqw; font-weight: 600; color: var(--teal); }
.s5-points .pt { margin-bottom: .8cqw; }
.s5-points h4 { font-size: 1.35cqw; color: var(--green); font-weight: 800; margin-bottom: .1cqw; }
.s5-points p { font-size: 1.08cqw; color: var(--ink-soft); line-height: 1.4; }
.s5-photo { border-radius: 12px; overflow: hidden; }
.s5-photo img { width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   SLIDE 6 — Residents (video grid)
   ============================================================ */
.s-dark { background: linear-gradient(160deg, #1f6a54 0%, #123f32 100%); }
.s-dark .kicker { color: #8fd0bb; }
.s-dark .kicker::before { background: var(--orange); }
.s-dark .s-title { color: #fff; }
.s-dark .s-sub { color: #bdd8cd; }

.vid-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.4cqw; margin-top: 1.8cqw; }
.vid {
  position: relative; display: block; border-radius: 11px; overflow: hidden;
  flex: 0 0 calc(25% - 1.05cqw);
  aspect-ratio: 16 / 9; text-decoration: none;
  background: #0e3327; box-shadow: 0 10px 22px -12px rgba(0,0,0,.6);
  transition: transform .16s ease;
}
.vid:hover { transform: translateY(-3px) scale(1.012); }
.vid img { width: 100%; height: 100%; object-fit: cover; }
.vid .play {
  position: absolute; inset: 0; margin: auto;
  width: 4.4cqw; height: 4.4cqw; border-radius: 50%;
  background: rgba(250,156,38,.95); display: grid; place-items: center;
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
}
.vid .play::after {
  content: ""; border-style: solid; border-width: 1.1cqw 0 1.1cqw 1.9cqw;
  border-color: transparent transparent transparent #fff; margin-left: .45cqw;
}
.vid .tag { font-size: .98cqw; padding: 2.4cqw 1.1cqw .9cqw; }
.vid .tag {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(transparent, rgba(7,30,23,.92));
  color: #fff; font-size: 1.12cqw; font-weight: 700;
  padding: 2.6cqw 1.4cqw 1.1cqw;
}
.vid.feature { grid-column: span 1; }
.s6-note { margin-top: auto; padding-top: 1.2cqw; font-size: 1.04cqw; color: #9fc4b8; }
.s6-note b { color: #cfe5dc; }

/* ============================================================
   SLIDE 7 — Track record
   ============================================================ */
.tr-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 2cqw; margin-top: 2.6cqw; }
.tr-stats .card { text-align: center; padding: 2.6cqw 1.6cqw; }
.tr-stats .stat-num { font-size: 4.8cqw; }
.tr-desc { font-size: 1.12cqw; color: var(--ink-soft); margin-top: .8cqw; }
.covid {
  margin-top: 2.4cqw; background: linear-gradient(150deg, var(--green) 0%, var(--green-deep) 100%);
  border-radius: 14px; padding: 2.6cqw 3cqw; display: grid;
  grid-template-columns: 1.4fr 1fr 1fr; gap: 2.6cqw; align-items: center; flex: 1;
}
.covid h3 { color: #fff; font-size: 2.15cqw; font-weight: 800; line-height: 1.15; }
.covid p { color: #bdd8cd; font-size: 1.16cqw; margin-top: .8cqw; }
.covid .cstat { text-align: center; border-left: 1px solid rgba(255,255,255,.2); }
.covid .cstat .n { font-size: 5cqw; font-weight: 800; color: var(--orange); letter-spacing: -.03em; }
.covid .cstat .l { font-size: 1.32cqw; font-weight: 600; color: #fff; margin-top: .3cqw; }

/* ============================================================
   SLIDE 8 — Bond tiers table
   ============================================================ */
.tier-wrap { margin-top: 2.2cqw; flex: 1; }
.tier-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 1.16cqw; }
.tier-table th, .tier-table td { padding: 1.15cqw 1.3cqw; text-align: center; }
.tier-table thead th {
  font-size: 1.5cqw; font-weight: 800; color: #fff; background: var(--green);
}
.tier-table thead th:first-child { background: var(--green-dk); border-top-left-radius: 10px; }
.tier-table thead th:last-child { border-top-right-radius: 10px; }
.tier-table .rowlabel {
  text-align: left; font-weight: 700; color: var(--green-dk);
  background: var(--sage-3);
}
.tier-table td { background: #fff; border-bottom: 1px solid var(--line); }
.tier-table tbody tr:nth-child(even) td:not(.rowlabel) { background: #fbfcfb; }
.tier-table .hi { color: var(--green); font-weight: 800; }
.tier-table .accent { background: var(--sage); font-weight: 700; color: var(--green-dk); }
.tier-table sup { color: var(--orange); font-weight: 800; }
.s8-notes { display: flex; justify-content: space-between; gap: 3cqw; margin-top: 1.5cqw; }
.s8-notes p { font-size: .98cqw; color: var(--ink-soft); line-height: 1.45; }
.s8-notes b { color: var(--green-dk); }

/* ============================================================
   SLIDE 9 — Use of Proceeds (SVG)
   ============================================================ */
.s9 .flow-wrap { margin-top: 1.2cqw; flex: 1; display: flex; align-items: center; }
.s9 svg { width: 100%; height: auto; }
.s9-foot {
  margin-top: auto; padding-top: 1cqw; font-size: 1cqw; color: var(--ink-soft);
  display: flex; gap: 2.2cqw; flex-wrap: wrap;
}
.s9-foot span { display: flex; align-items: center; gap: .6cqw; }
.s9-foot i { width: 1.1cqw; height: 1.1cqw; border-radius: 3px; display: inline-block; }

/* ============================================================
   SLIDES 10 — Why choose (testimonial)
   ============================================================ */
.s10-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.2cqw; margin-top: 2.4cqw; flex: 1; align-items: stretch; }
.s10-video {
  position: relative; border-radius: 14px; overflow: hidden;
  text-decoration: none; display: block; box-shadow: var(--shadow);
}
.s10-video img { width: 100%; height: 100%; object-fit: cover; }
.s10-video .play {
  position: absolute; inset: 0; margin: auto; width: 7cqw; height: 7cqw;
  border-radius: 50%; background: rgba(250,156,38,.95); display: grid; place-items: center;
}
.s10-video .play::after {
  content: ""; border-style: solid; border-width: 1.7cqw 0 1.7cqw 3cqw;
  border-color: transparent transparent transparent #fff; margin-left: .6cqw;
}
.s10-right { display: flex; flex-direction: column; }
.s10-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 1.8cqw; }
.s10-metrics .card { text-align: center; }
.quote {
  margin-top: 1.6cqw; flex: 1; background: var(--sage-3);
  border-left: .5cqw solid var(--orange); border-radius: 0 12px 12px 0;
  padding: 1.8cqw 2cqw; display: flex; flex-direction: column; justify-content: center;
}
.quote p { font-size: 1.3cqw; font-style: italic; color: var(--green-dk); line-height: 1.48; }
.quote p + p { margin-top: .8cqw; }
.quote .by { margin-top: 1.1cqw; font-style: normal; }
.quote .by .nm { font-size: 1.3cqw; font-weight: 800; color: var(--green-dk); }
.quote .by .rl { font-size: 1.06cqw; color: var(--ink-soft); }

/* ============================================================
   SLIDES 11/12 — Case studies
   ============================================================ */
.cs-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 3cqw; margin-top: 2.2cqw; flex: 1; }
.cs-photo { border-radius: 14px; overflow: hidden; position: relative; }
.cs-photo img { width: 100%; height: 100%; object-fit: cover; }
.cs-photo .badge {
  position: absolute; left: 1.4cqw; top: 1.4cqw; background: rgba(15,61,48,.92);
  color: #fff; font-size: 1.04cqw; font-weight: 700; padding: .7cqw 1.2cqw;
  border-radius: 8px;
}
.cs-flow { display: flex; flex-direction: column; }
.cs-step { display: flex; gap: 1.6cqw; position: relative; padding-bottom: 1.6cqw; }
.cs-step:not(:last-child)::before {
  content: ""; position: absolute; left: 1.85cqw; top: 4cqw; bottom: -.4cqw;
  width: .28cqw; background: var(--sage-2);
}
.cs-dot {
  width: 3.7cqw; height: 3.7cqw; flex: none; border-radius: 50%;
  display: grid; place-items: center; font-weight: 800; color: #fff; font-size: 1.5cqw;
}
.cs-dot.a { background: var(--teal); }
.cs-dot.b { background: var(--orange); }
.cs-dot.c { background: var(--green); }
.cs-step .body h4 { font-size: 1.6cqw; color: var(--green-dk); font-weight: 800; }
.cs-step .body .when { font-size: 1.12cqw; color: var(--ink-soft); font-weight: 600; }
.cs-step .body p { font-size: 1.18cqw; color: var(--ink-soft); margin-top: .3cqw; }
.cs-step .body .val { font-size: 1.55cqw; font-weight: 800; color: var(--green); }
.cs-result {
  margin-top: auto; background: linear-gradient(150deg, var(--green) 0%, var(--green-deep) 100%);
  border-radius: 12px; padding: 1.7cqw 2.2cqw; color: #fff;
  display: flex; align-items: baseline; gap: 1cqw;
}
.cs-result .lbl { font-size: 1.4cqw; font-weight: 600; color: #bdd8cd; }
.cs-result .pct { font-size: 2.6cqw; font-weight: 800; color: var(--orange); }
.cs-result .lbl b { color: #fff; font-weight: 700; }
.cs-disclaim { position: absolute; right: 2.6cqw; bottom: 1.9cqw; font-size: .92cqw; color: var(--ink-soft); opacity: .7; }

/* ============================================================
   SLIDE 13 — Portfolio snapshot
   ============================================================ */
.s13-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 3cqw; margin-top: 2.4cqw; flex: 1; align-items: center; }
.s13-stats { display: flex; flex-direction: column; gap: 1.8cqw; }
.s13-stat { border-left: .5cqw solid var(--orange); padding-left: 1.6cqw; }
.s13-stat .n { font-size: 5.6cqw; font-weight: 800; color: var(--teal); letter-spacing: -.03em; line-height: 1; }
.s13-stat .l { font-size: 1.55cqw; font-weight: 600; color: var(--ink-soft); }
.s13-map { position: relative; }
.s13-map svg { width: 100%; height: auto; }
.s13-pin { fill: var(--orange); stroke: #fff; stroke-width: 2; }
.us-land { fill: var(--sage); stroke: #fff; stroke-width: 2.5; }

/* ============================================================
   SLIDE 14 — Allocation framework
   ============================================================ */
.alloc-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2.4cqw; margin-top: 2.6cqw; flex: 1; }
.alloc {
  border-radius: 14px; overflow: hidden; display: flex; flex-direction: column;
  border: 1px solid var(--line); background: #fff;
}
.alloc .ph { aspect-ratio: 16/11; overflow: hidden; }
.alloc .ph img { width: 100%; height: 100%; object-fit: cover; }
.alloc .cap { padding: 1.7cqw 1.8cqw; flex: 1; display: flex; flex-direction: column; gap: .5cqw; }
.alloc .cap .idx { font-size: 1.15cqw; font-weight: 800; color: var(--orange); }
.alloc .cap h4 { font-size: 1.5cqw; font-weight: 800; color: var(--green-dk); line-height: 1.2; }
.alloc .cap p { font-size: 1.04cqw; color: var(--ink-soft); line-height: 1.42; margin-top: .15cqw; }

/* ============================================================
   SLIDE 15 — Leadership
   ============================================================ */
.team-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 1.5cqw; margin-top: 2.4cqw; flex: 1; }
.member { display: flex; flex-direction: column; }
.member .ph {
  width: 100%; aspect-ratio: 4/5; border-radius: 10px; overflow: hidden;
  background: var(--sage); margin-bottom: .8cqw;
}
.member .ph img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.member .nm { font-size: 1.18cqw; font-weight: 800; color: var(--green-dk); line-height: 1.18; }
.member .rl { font-size: .95cqw; font-weight: 700; color: var(--green); margin: .15cqw 0 .4cqw; }
.member .bio { font-size: .82cqw; color: var(--ink-soft); line-height: 1.42; }

/* ============================================================
   SLIDE 16 — Closing
   ============================================================ */
.s16-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 2.6cqw; margin-top: 1.5cqw; flex: 1; }
.s16-left { display: flex; flex-direction: column; }
.s16-lead { font-size: 1.42cqw; color: var(--green-dk); font-weight: 600; line-height: 1.38; }
.s16-body { font-size: 1.08cqw; color: var(--ink-soft); margin-top: .7cqw; line-height: 1.46; }
.recap {
  margin-top: 1.2cqw; background: var(--sage-3); border-radius: 12px;
  overflow: hidden; flex: none;
}
.recap .rh {
  background: var(--green-dk); color: #fff; font-weight: 800;
  font-size: 1.08cqw; letter-spacing: .12em; padding: .85cqw 1.4cqw;
}
.recap ul { padding: 1.1cqw 1.4cqw; }
.recap li { list-style: none; font-size: 1.06cqw; color: var(--ink); margin-bottom: .6cqw; display: flex; gap: .7cqw; line-height: 1.4; }
.recap li:last-child { margin-bottom: 0; }
.recap li::before { content: "✓"; color: var(--green); font-weight: 800; }
.s16-right {
  background: linear-gradient(155deg, var(--green) 0%, var(--green-deep) 100%);
  border-radius: 16px; padding: 2.1cqw; display: flex; flex-direction: column;
  overflow: hidden;
}
.s16-right .photo { border-radius: 11px; overflow: hidden; height: 30%; margin-bottom: 1.3cqw; flex: none; }
.s16-right .photo img { width: 100%; height: 100%; object-fit: cover; }
.s16-right h3 { color: #fff; font-size: 1.58cqw; font-weight: 800; line-height: 1.22; }
.s16-contact { margin-top: auto; display: flex; flex-direction: column; gap: .25cqw; }
.s16-contact .c { color: #fff; font-size: 1.2cqw; font-weight: 700; }
.s16-contact .c.lg { font-size: 1.42cqw; }
.dataroom-link { margin-top: 1.2cqw; }
.s16-disc {
  position: absolute; left: 4.4cqw; bottom: 2.6cqw; width: 48cqw;
  font-size: .9cqw; color: var(--ink-soft); opacity: .7; line-height: 1.4;
}

/* ============================================================
   SLIDE 17 — Final contact
   ============================================================ */
.s-final {
  background:
    radial-gradient(600px 420px at 50% 0%, #2a7d63 0%, transparent 60%),
    linear-gradient(165deg, #1f6a54 0%, #0e3528 100%);
}
.s-final .pad { align-items: center; justify-content: center; text-align: center; }
.s-final .final-logo { height: 22cqw; margin-bottom: 3cqw; }
.s-final .thanks { font-size: 2.6cqw; font-weight: 800; color: #fff; letter-spacing: -.02em; }
.s-final .final-rule { width: 7cqw; height: .4cqw; background: var(--orange); border-radius: 3px; margin: 2.4cqw auto; }
.s-final .web { font-size: 2.1cqw; font-weight: 800; color: #fff; }
.s-final .row { font-size: 1.42cqw; color: #bdd8cd; font-weight: 600; margin-top: .5cqw; }

/* ============================================================
   Navigation chrome
   ============================================================ */
.progress {
  position: fixed; top: 0; left: 0; height: 4px; z-index: 50;
  background: linear-gradient(90deg, var(--orange), #ffd089);
  width: 0; transition: width .2s ease;
}
.nav-dots {
  position: fixed; right: 1.6vw; top: 50%; transform: translateY(-50%);
  z-index: 50; display: flex; flex-direction: column; gap: 11px;
}
.nav-dots button {
  width: 11px; height: 11px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255,255,255,.28); padding: 0; transition: all .18s ease;
}
.nav-dots button:hover { background: rgba(255,255,255,.6); transform: scale(1.2); }
.nav-dots button.active { background: var(--orange); height: 26px; border-radius: 6px; }

.deck-nav-arrow {
  position: fixed; left: 50%; transform: translateX(-50%);
  bottom: 16px; z-index: 50; width: 42px; height: 42px; border-radius: 50%;
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.3);
  color: #fff; cursor: pointer; display: grid; place-items: center;
  font-size: 18px; transition: all .18s ease;
}
.deck-nav-arrow:hover { background: rgba(255,255,255,.25); }
.deck-nav-arrow.hidden { opacity: 0; pointer-events: none; }

.hint {
  position: fixed; left: 50%; bottom: 64px; transform: translateX(-50%);
  z-index: 50; color: #cfe5dc; font-size: 12px; letter-spacing: .08em;
  font-family: var(--font); text-transform: uppercase;
  transition: opacity .4s ease;
}

@media (max-width: 680px) {
  .canvas { font-size: 2.6cqw; }
  .nav-dots { right: 8px; }
}