:root {
  --bg: #f6f3ee;
  --card: #ffffff;
  --ink: #1f2933;
  --accent: #0f766e;
  --accent-dark: #134e4a;
  --accent-soft: #dff5f1;
  --gold-soft: #fff7e6;
  --gold-border: #fde6b8;
  --border: #e5e0d8;
  --shadow: rgba(31, 41, 51, 0.07);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.62;
  font-size: 22px;
}
.page { width: min(100%, 980px); margin: 0 auto; padding: 20px; }
.hero {
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: white;
  border-radius: 26px;
  padding: 34px 26px;
  margin-bottom: 22px;
  box-shadow: 0 18px 45px rgba(15, 118, 110, 0.22);
}
h1 { font-size: clamp(2.2rem, 8vw, 4.15rem); line-height: 1.04; margin: 0 0 16px; letter-spacing: -0.045em; }
.hero p { font-size: clamp(1.25rem, 4.6vw, 1.62rem); margin: 0; color: rgba(255,255,255,0.93); max-width: 820px; }
section {
  background: var(--card); border: 1px solid var(--border); border-radius: 24px;
  padding: 28px; margin: 18px 0; box-shadow: 0 8px 25px var(--shadow);
}
h2 { font-size: clamp(1.72rem, 5.6vw, 2.42rem); line-height: 1.12; margin: 0 0 14px; letter-spacing: -0.025em; color: #123b38; }
h3 { font-size: 1.32rem; margin: 22px 0 8px; color: var(--accent); line-height: 1.2; }
p { margin: 0 0 16px; }
.lead { font-size: 1.3rem; color: #26323f; }
.big-idea {
  background: var(--accent-soft); border-left: 8px solid var(--accent);
  padding: 20px; border-radius: 18px; font-size: 1.32rem; font-weight: 800; margin: 20px 0;
}
.quote {
  font-size: 1.48rem; line-height: 1.35; font-weight: 850; color: #123b38;
  padding: 22px; border-radius: 20px; background: var(--gold-soft); border: 1px solid var(--gold-border); margin: 20px 0;
}
.grid { display: grid; gap: 16px; margin-top: 18px; }
.card { border-radius: 20px; padding: 20px; border: 1px solid var(--border); background: #fbfaf8; }
.card h3 { margin-top: 0; }
.flow { display: grid; gap: 12px; margin-top: 18px; }
.step { background: #fbfaf8; border: 1px solid var(--border); border-radius: 18px; padding: 18px; }
.step strong { color: var(--accent); display: block; font-size: 1.12rem; margin-bottom: 4px; }
ul { padding-left: 1.25em; margin: 10px 0 0; }
li { margin: 8px 0; }
.atomic { counter-reset: idea; display: grid; gap: 12px; margin-top: 18px; }
.atomic-item {
  position: relative; background: #fbfaf8; border: 1px solid var(--border);
  border-radius: 18px; padding: 18px 18px 18px 64px;
}
.atomic-item::before {
  counter-increment: idea; content: counter(idea);
  position: absolute; left: 18px; top: 18px; width: 32px; height: 32px;
  border-radius: 999px; background: var(--accent); color: white;
  display: grid; place-items: center; font-weight: 800; font-size: 0.95rem;
}
.atomic-item strong { display: block; color: #123b38; margin-bottom: 4px; }
.tagline { text-align: center; font-size: 1.5rem; font-weight: 900; color: var(--accent); padding: 28px 12px 10px; line-height: 1.35; }
@media (min-width: 760px) {
  body { font-size: 20px; }
  .page { padding: 34px; }
  section { padding: 34px; }
  .grid.two { grid-template-columns: 1fr 1fr; }
  .grid.three { grid-template-columns: repeat(3, 1fr); }
}
@media print {
  body { background: white; font-size: 16px; }
  .page { max-width: none; padding: 0; }
  .hero, section { box-shadow: none; break-inside: avoid; }
}