/* ÇONA sunum — premium card deck. 16:9 slides scale with the viewport (cqw) and print 1:1 to PDF. */
:root {
  --forest: #0c2a1b;
  --forest-2: #134a2e;
  --green: #1f6b35;
  --leaf: #9fd07a;
  --gold: #d9a441;
  --gold-2: #f0cf86;
  --ivory: #faf7f0;
  --sand: #f1e9d8;
  --ink: #142019;
  --muted: #5a675f;
  --line: rgba(12, 42, 27, 0.1);
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { background: #08170f; }
body { font-family: var(--sans); color: var(--ink); -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }

.bar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; background: rgba(8, 23, 15, 0.86); backdrop-filter: blur(8px); color: #fff; }
.brand { display: flex; align-items: center; gap: 8px; color: #fff; font-family: var(--serif); font-weight: 700; font-size: 20px; text-decoration: none; }
.brand img { background: #fff; border-radius: 8px; padding: 3px; }
.bar nav { display: flex; align-items: center; gap: 14px; font-size: 14px; }
.count { color: rgba(255, 255, 255, 0.7); font-variant-numeric: tabular-nums; }
.btn { background: var(--gold); color: #1d1606; font-weight: 700; padding: 8px 16px; border-radius: 999px; text-decoration: none; }

#deck { display: flex; flex-direction: column; align-items: center; gap: 28px; padding: 28px 16px 60px; }
.slide { position: relative; width: min(100%, 1280px); aspect-ratio: 16 / 9; overflow: hidden; border-radius: 18px; container-type: inline-size; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.7); }
.slide .in { position: relative; z-index: 1; height: 100%; padding: 5cqw 5.6cqw 6.2cqw; display: flex; flex-direction: column; }

/* surfaces */
.ivory { background: var(--ivory); }
.ivory::before, .sand::before { content: ''; position: absolute; inset: 0; background: radial-gradient(60cqw 40cqw at 100% 0%, rgba(217, 164, 65, 0.1), transparent 70%); }
.sand { background: var(--sand); }
.forest { background: radial-gradient(90cqw 60cqw at 100% 0%, #1d5a37 0%, var(--forest) 55%, #071a10 100%); color: #fff; }
.forest::after { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px); background-size: 4cqw 4cqw; mask-image: linear-gradient(180deg, transparent, #000 40%, transparent); }

/* type */
.eyebrow { display: inline-flex; align-items: center; gap: 0.8cqw; font-size: 1.02cqw; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: var(--green); margin-bottom: 1.2cqw; }
.eyebrow::before { content: ''; width: 2.4cqw; height: 0.14cqw; background: currentColor; }
.eyebrow.gold { color: var(--gold-2); }
h1 { font-family: var(--serif); font-weight: 700; font-size: 10cqw; line-height: 1; letter-spacing: -0.02em; color: #fff; padding-bottom: 1.2cqw; }
h2 { font-family: var(--serif); font-weight: 600; font-size: 3.5cqw; line-height: 1.06; letter-spacing: -0.015em; color: var(--forest); margin-bottom: 2.4cqw; max-width: 80cqw; }
h2 em { font-style: italic; font-weight: 500; color: var(--green); }
h2.on-dark { color: #fff; }
h2.on-dark em { color: var(--gold-2); }
h3 { font-size: 1.36cqw; font-weight: 700; color: var(--forest); margin-bottom: 0.5cqw; line-height: 1.25; }
p { font-size: 1.14cqw; line-height: 1.5; color: var(--muted); }
.lead { font-size: 1.85cqw; line-height: 1.4; color: rgba(255, 255, 255, 0.9); max-width: 60cqw; }
.src { margin-top: auto; font-size: 0.9cqw; color: var(--muted); }
.src.on-dark { color: rgba(255, 255, 255, 0.55); }

/* page footer */
.pf { position: absolute; z-index: 1; left: 5.6cqw; right: 5.6cqw; bottom: 2.2cqw; display: flex; justify-content: space-between; font-size: 0.85cqw; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(12, 42, 27, 0.45); border-top: 1px solid var(--line); padding-top: 0.9cqw; }
.pf span:last-child { font-family: var(--serif); font-size: 1.1cqw; letter-spacing: 0; color: var(--gold); font-weight: 600; }
.pf.dark { color: rgba(255, 255, 255, 0.45); border-top-color: rgba(255, 255, 255, 0.12); }

/* grids & cards */
.g1, .g2, .g3, .g4 { display: grid; gap: 1.3cqw; }
.g2 { grid-template-columns: repeat(2, 1fr); }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }
.card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 1.3cqw; padding: 1.6cqw 1.7cqw; box-shadow: 0 1.2cqw 2.4cqw -1.6cqw rgba(12, 42, 27, 0.25); }
.card::after { content: ''; position: absolute; left: 1.7cqw; top: 0; width: 3cqw; height: 0.22cqw; border-radius: 0 0 4px 4px; background: linear-gradient(90deg, var(--gold), var(--gold-2)); }
.dark-card { background: linear-gradient(160deg, var(--forest-2), var(--forest)); border-color: transparent; }
.dark-card h3, .dark-card .num, .dark-card .when { color: var(--gold-2) !important; }
.dark-card p { color: rgba(255, 255, 255, 0.78); }
.gold-card { background: linear-gradient(160deg, #fff6e2, #f6e3b8); }
.glass { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.14); box-shadow: none; backdrop-filter: blur(4px); }
.glass h3 { color: #fff; }
.glass p { color: rgba(255, 255, 255, 0.74); }
.ic { width: 2.4cqw; height: 2.4cqw; fill: none; stroke: var(--green); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ic.sm { width: 1.5cqw; height: 1.5cqw; }
.icon-card .ic, .mod .ic, .rev .ic { margin-bottom: 1cqw; padding: 0.5cqw; box-sizing: content-box; border-radius: 0.9cqw; background: rgba(31, 107, 53, 0.08); }

/* cover */
.cover { background: #08170f; }
.cover .bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cover .shade { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(5, 18, 11, 0.94) 0%, rgba(5, 18, 11, 0.62) 55%, rgba(5, 18, 11, 0.2) 100%); }
.cover .in { justify-content: center; }
.mark { width: 5cqw; height: 5cqw; background: #fff; border-radius: 1.2cqw; padding: 0.7cqw; margin-bottom: 2.2cqw; }
.cover-chips { display: flex; gap: 0.8cqw; margin-top: 2.6cqw; }
.cover-chips span { border: 1px solid rgba(240, 207, 134, 0.5); color: var(--gold-2); border-radius: 99px; padding: 0.5cqw 1.3cqw; font-size: 1cqw; font-weight: 600; letter-spacing: 0.04em; }
.cover-foot { position: absolute; z-index: 1; left: 5.6cqw; bottom: 3cqw; color: rgba(255, 255, 255, 0.6); font-size: 1cqw; letter-spacing: 0.1em; text-transform: uppercase; }
.end .big { font-size: 5.6cqw; color: #fff; }
.end .big em { color: var(--gold-2); }
.end .url { margin-top: 2.6cqw; font-size: 1.7cqw; font-weight: 700; color: var(--gold-2); }

/* 02 exec */
.exec { flex: 1; align-items: stretch; margin-bottom: 1cqw; }
.tall { display: flex; flex-direction: column; justify-content: flex-start; padding: 9cqw 2.2cqw 2.2cqw; }
.tall h3 { font-family: var(--serif); font-size: 2.3cqw; font-weight: 600; margin-bottom: 1cqw; }
.tall p { font-size: 1.24cqw; }
.num { position: absolute; top: 1.8cqw; left: 2.2cqw; font-family: var(--serif); font-size: 4.2cqw; line-height: 1; color: rgba(31, 107, 53, 0.14); font-weight: 600; }

/* 03 */
.quote { margin-top: auto; margin-bottom: 1cqw; padding: 1.8cqw 2.2cqw; border-left: 0.35cqw solid var(--gold); background: rgba(255, 255, 255, 0.6); border-radius: 0 1.2cqw 1.2cqw 0; font-family: var(--serif); font-size: 1.75cqw; font-style: italic; color: var(--forest); line-height: 1.35; }
.quote cite { display: block; margin-top: 0.8cqw; font-family: var(--sans); font-style: normal; font-size: 0.95cqw; color: var(--muted); letter-spacing: 0.04em; }

/* stats */
.stats { margin-top: 1.5cqw; }
.stat { border-top: 0.18cqw solid var(--gold); padding-top: 1.6cqw; }
.stat b { display: flex; align-items: baseline; gap: 0.6cqw; font-family: var(--serif); font-size: 4.6cqw; line-height: 1; color: #fff; font-weight: 600; margin-bottom: 1cqw; }
.stat b small { font-family: var(--sans); font-size: 1.2cqw; font-weight: 600; color: var(--gold-2); letter-spacing: 0.02em; }
.stat p { color: rgba(255, 255, 255, 0.72); font-size: 1.18cqw; }

/* 05 modules */
.mods .card { padding: 1.4cqw 1.5cqw; }
.mods p { font-size: 1.05cqw; }
.strip { margin-top: auto; margin-bottom: 1cqw; display: flex; flex-wrap: wrap; gap: 1cqw; }
.strip span { display: inline-flex; align-items: center; gap: 0.6cqw; background: var(--forest); color: #fff; border-radius: 99px; padding: 0.6cqw 1.3cqw; font-size: 1cqw; font-weight: 600; }
.strip .ic { stroke: var(--gold-2); }

/* 06 day */
.day .card { padding: 1.3cqw 1.5cqw; }
.day p { font-size: 1.04cqw; }
.time { display: block; font-family: var(--serif); font-size: 2cqw; color: var(--gold); font-weight: 600; line-height: 1; margin-bottom: 0.6cqw; }
.phones { display: grid; grid-template-columns: repeat(4, 12.6cqw); justify-content: space-around; margin-top: 2cqw; }
.phones img, .phone-one img { width: 100%; aspect-ratio: 9 / 16; object-fit: cover; object-position: top; border-radius: 1.6cqw; border: 0.45cqw solid #0b1a12; background: #fff; box-shadow: 0 1.6cqw 2.4cqw -1.2cqw rgba(0, 0, 0, 0.45); }

/* split with phone */
.split { display: grid !important; grid-template-columns: 1.55fr 1fr; gap: 4cqw; align-items: center; }
.small-cards .card { padding: 1.3cqw 1.4cqw; }
.small-cards p { font-size: 1.04cqw; }
.phone-one { width: 21cqw; justify-self: center; }
.phone-one img { aspect-ratio: 9 / 19; border-radius: 2.4cqw; border-width: 0.55cqw; }

/* 08 assistant */
.two { display: grid !important; grid-template-columns: 1fr 1.1fr; gap: 4cqw; align-items: center; }
.dark-list { gap: 1cqw; }
.dark-list .card { padding: 1.2cqw 1.5cqw; }
.chat { position: relative; z-index: 1; background: #fff; border-radius: 1.8cqw; padding: 2cqw; display: grid; gap: 1.1cqw; box-shadow: 0 2.4cqw 4cqw -2cqw rgba(0, 0, 0, 0.6); }
.chat .q { justify-self: end; max-width: 80%; background: var(--green); color: #fff; padding: 0.9cqw 1.3cqw; border-radius: 1.3cqw 1.3cqw 0.3cqw 1.3cqw; font-size: 1.12cqw; }
.chat .a { background: var(--ivory); color: #2a382f; padding: 1.1cqw 1.3cqw; border-radius: 1.3cqw 1.3cqw 1.3cqw 0.3cqw; font-size: 1.12cqw; }
.chat .a b { color: var(--forest); }

/* 09 photo split */
.photo-split { display: grid; grid-template-columns: 0.82fr 1.18fr; background: var(--ivory); }
.photo-split .side { width: 100%; height: 100%; object-fit: cover; }
.photo-split .in { padding: 4.4cqw 4.6cqw 6.2cqw; }
.photo-split .pf { left: calc(41% + 4.6cqw); }
.photo-split h2 { font-size: 3.1cqw; }
.benefits .card { padding: 1.2cqw 1.4cqw; }
.benefits b { display: block; font-family: var(--serif); font-size: 1.7cqw; color: var(--green); font-weight: 600; margin-bottom: 0.3cqw; }
.benefits p { font-size: 1.04cqw; }

/* 10 institutions */
.inst .card { display: grid; grid-template-columns: auto 1fr; column-gap: 1.3cqw; align-content: start; padding: 1.9cqw 1.8cqw; }
.inst .card p { grid-column: 1 / -1; margin-top: 1cqw; font-size: 1.14cqw; }
.inst h3 { align-self: center; margin: 0; font-size: 1.36cqw; }
.seal { width: 4.4cqw; height: 4.4cqw; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 700; font-size: 1.05cqw; letter-spacing: 0.04em; color: var(--gold-2); background: radial-gradient(circle at 30% 30%, var(--forest-2), var(--forest)); box-shadow: inset 0 0 0 0.18cqw rgba(240, 207, 134, 0.55), inset 0 0 0 0.45cqw var(--forest); }

/* 11 programmes */
.prog .card { padding: 1.3cqw 1.5cqw; }
.by { display: block; font-size: 0.85cqw; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.5cqw; }
.prog h3 { font-size: 1.22cqw; }
.fig { font-family: var(--serif); font-size: 2cqw !important; font-weight: 600; color: var(--green) !important; line-height: 1.1 !important; margin: 0.4cqw 0 0.5cqw; }
.prog p:not(.fig) { font-size: 0.98cqw; }

/* 12 revenue */
.rev .card { display: flex; flex-direction: column; padding: 1.6cqw; }
.tag { align-self: flex-start; font-size: 0.85cqw; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--forest); background: var(--gold-2); padding: 0.3cqw 0.9cqw; border-radius: 99px; margin-bottom: 0.8cqw; }
.rev h3 { font-size: 1.4cqw; }

/* 14 roadmap */
.road { position: relative; margin-top: 2cqw; }
.road::before { content: ''; position: absolute; left: 0; right: 0; top: -1.2cqw; height: 0.2cqw; background: linear-gradient(90deg, var(--gold), var(--green)); border-radius: 9px; }
.road .card { padding: 2cqw 1.6cqw 1.8cqw; }
.road .card::before { content: ''; position: absolute; top: -1.75cqw; left: 1.6cqw; width: 1.3cqw; height: 1.3cqw; border-radius: 50%; background: var(--ivory); border: 0.3cqw solid var(--green); }
.when { display: block; font-size: 0.95cqw; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 0.6cqw; }
.road h3 { font-family: var(--serif); font-size: 1.9cqw; font-weight: 600; }

/* 15 ask */
.ask .card { padding: 2cqw; }
.who { display: block; font-size: 0.95cqw; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-2); margin-bottom: 0.8cqw; }
.ask h3 { font-family: var(--serif); font-size: 2.1cqw; font-weight: 600; margin-bottom: 1cqw; }
.ask p { font-size: 1.2cqw; }

@media (max-width: 640px) {
  #deck { padding: 16px 0 40px; gap: 16px; }
  .slide { border-radius: 10px; }
}

@page { size: 1600px 900px; margin: 0; }
@media print {
  html, body { background: #fff; }
  .bar { display: none; }
  #deck { display: block; padding: 0; }
  .slide { width: 1600px; height: 900px; border-radius: 0; box-shadow: none; break-after: page; page-break-after: always; }
}
