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

:root {
  --bg: #f6f0e5;
  --bg-soft: #efe4d0;
  --surface: rgba(255, 250, 243, 0.85);
  --line: rgba(84, 55, 28, 0.17);
  --text: #2e2218;
  --muted: #705f50;
  --primary: #1f3d63;
  --primary-contrast: #f2f7ff;
  --accent: #c86c2e;
  --ok: #1f6a4c;
  --danger: #a0442e;
  --radius-xl: 26px;
  --radius-lg: 18px;
  --radius-md: 12px;
  --shadow-soft: 0 16px 42px rgba(44, 30, 17, 0.14);
  --max-width: 1160px;
  --search-intent-margin-bottom: 26px;
}

body {
  min-height: 100vh;
  font-family: "Space Grotesk", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 12% -8%, rgba(200, 108, 46, 0.24), transparent 32%),
    radial-gradient(circle at 82% 15%, rgba(31, 61, 99, 0.25), transparent 30%),
    linear-gradient(152deg, var(--bg) 0%, var(--bg-soft) 58%, #e5d7bf 100%);
  background-attachment: fixed;
  overflow-x: hidden;
  line-height: 1.55;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0.2;
  background-image:
    linear-gradient(rgba(40, 24, 12, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(40, 24, 12, 0.09) 1px, transparent 1px);
  background-size: 46px 46px;
  z-index: -1;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 1000;
  transform: translateY(-160%);
  border-radius: 999px;
  background: var(--primary);
  color: var(--primary-contrast);
  padding: 10px 14px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: var(--shadow-soft);
  transition: transform 160ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(31, 61, 99, 0.55);
  outline-offset: 3px;
}

.hero {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: 20px;
  margin-bottom: 26px;
}

.hero-main,
.hero-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  animation: fadeUp 600ms ease both;
}

.hero-main {
  padding: 40px 34px 30px;
  position: relative;
}

.hero-main::before {
  content: "";
  position: absolute;
  right: -48px;
  top: -52px;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200, 108, 46, 0.24), transparent 70%);
  pointer-events: none;
}

.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--primary);
  font-weight: 700;
  border: 1px solid rgba(31, 61, 99, 0.22);
  border-radius: 999px;
  background: rgba(31, 61, 99, 0.1);
  padding: 7px 12px;
  margin-bottom: 14px;
}

.hero h2 {
  font-family: "Fraunces", serif;
  font-size: clamp(2rem, 4.3vw, 3.2rem);
  line-height: 1.08;
  margin-bottom: 12px;
  max-width: 14ch;
}

.hero-copy {
  color: var(--muted);
  font-size: 1.02rem;
  max-width: 56ch;
  margin-bottom: 22px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}


.stats {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.stat {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.58);
  padding: 10px;
}

.stat strong {
  display: block;
  color: var(--primary);
  font-size: 1rem;
  margin-bottom: 1px;
}

.stat span {
  color: var(--muted);
  font-size: 0.74rem;
}

.hero-side {
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  animation-delay: 120ms;
}

.pulse{flex:0 0 140px;min-height:140px;border-radius:var(--radius-md);border:1px solid rgba(216,196,154,.28);background:radial-gradient(circle at 82% 18%,rgba(184,138,56,.26),transparent 26%),linear-gradient(145deg,#102f4f 0%,#173658 52%,#0b1f36 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 30px rgba(16,47,79,.22);position:relative;overflow:hidden}

.pulse-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;filter:drop-shadow(0 0 5px rgba(243,251,255,.48))}

.pulse-trace-main,.pulse-trace-accent{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100}
.pulse-trace-main{stroke:#f3fbff;stroke-width:1.35}
.pulse-trace-accent{stroke:#f0c36a;stroke-width:.86;opacity:.82}

.pulse-dot-core{fill:#fff8ef;filter:drop-shadow(0 0 7px rgba(240,195,106,.88))}
.pulse-dot-halo{fill:rgba(240,195,106,.34);filter:blur(.7px)}

.pulse-meta{position:absolute;left:10px;right:10px;top:8px;display:flex;justify-content:space-between;align-items:center;font-size:.62rem;letter-spacing:.08em;color:rgba(243,251,255,.66);text-transform:uppercase;pointer-events:none}
.pulse-meta strong{font-weight:700;color:#fff8ef}

.pulse-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  flex: 1;
  align-content: stretch;
}

.pulse-list li {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.88), rgba(244, 249, 255, 0.74));
  padding: 11px 11px 11px 36px;
  font-size: 0.84rem;
  color: #2f3f53;
  display: grid;
  gap: 4px;
  position: relative;
  box-shadow: 0 8px 18px rgba(20, 35, 53, 0.08);
  min-height: 0;
}

.pulse-list li::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 14px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: radial-gradient(circle, #d98b54 30%, #1f3d63 75%);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.65);
}

.pulse-list li strong {
  font-size: 0.82rem;
  color: #173658;
  line-height: 1.2;
}

.pulse-list li span {
  color: #526479;
  line-height: 1.35;
}

.cta-center {
  text-align: center;
  margin-top: 28px;
}

.btn-large {
  font-size: 1rem;
  padding: 14px 24px;
  display: inline-flex;
}

.section{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-soft);padding:26px;margin-bottom:22px;animation:fadeUp 560ms ease both}.section h3{font-family:"Fraunces",serif;font-size:clamp(1.38rem,2.5vw,2rem);margin-bottom:14px}.section-intro{color:var(--muted);max-width:70ch;margin-bottom:16px}.features-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.feature{border:1px solid var(--line);border-radius:var(--radius-md);background:rgba(255,255,255,.68);padding:14px;transition:transform 180ms ease,box-shadow 180ms ease}.feature:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(41,28,16,.12)}.feature-icon{font-size:1.45rem;margin-bottom:8px;display:inline-block}.feature h4{color:var(--primary);margin-bottom:5px;font-size:.95rem}.feature p{color:var(--muted);font-size:.85rem}

.premium-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.premium-item{border:1px solid rgba(31,61,99,.26);border-radius:var(--radius-md);background:rgba(31,61,99,.08);padding:14px}.premium-item strong{display:block;margin-bottom:5px;color:#183a61}.premium-item p{color:#385877;font-size:.87rem}.download-card{border:1px solid var(--line);border-radius:var(--radius-md);background:rgba(255,255,255,.68);padding:12px;display:grid;gap:7px}.download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.download-card small{color:var(--muted);font-size:.8rem}

.toast-container {
  position: fixed;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1100;
  display: grid;
  gap: 8px;
}

.toast {
  border-radius: 10px;
  background: var(--primary);
  color: var(--primary-contrast);
  padding: 10px 15px;
  font-size: 0.85rem;
  box-shadow: 0 10px 24px rgba(36, 27, 20, 0.2);
  animation: fadeUp 220ms ease;
}

footer {
  text-align: center;
  color: var(--muted);
  font-size: 0.82rem;
  padding: 24px 0 34px;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr;
  }

  .features-grid,
  .download-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .hero-main {
    padding: 30px 20px 22px;
  }

  .hero h2 {
    max-width: 100%;
  }

  .pulse-list {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    flex: initial;
  }

  .stats,
  .features-grid,
  .premium-grid,
  .download-grid {
    grid-template-columns: 1fr;
  }

  .section {
    padding: 20px 14px;
  }
}

@media (max-width: 520px) {
  .stats {
    grid-template-columns: 1fr;
  }

  .hero-actions .btn {
    width: 100%;
  }

  .toast-container {
    width: calc(100% - 20px);
  }

  .toast {
    width: 100%;
  }
}

@media (max-width: 980px) {
  .hero-main,.hero-side,.section{border-radius:18px}
  .hero-main{padding:24px 16px 18px}
  .hero-copy{font-size:.95rem}
  .pulse-list li{padding:10px 10px 10px 34px}

.search-intent,.stats .stat:nth-child(n+3),#features .section-intro,#features .feature:nth-child(n+3),#premium .section-intro,#premium .premium-item:nth-child(n+3),.feature-icon{display:none}.hero{gap:12px;margin-bottom:14px}.hero-side{padding:14px}.pulse{min-height:110px;flex-basis:110px}.pulse-list{grid-template-columns:1fr;grid-template-rows:none}.pulse-list li:nth-child(n+3){display:none}#download{display:block}.section{padding:16px 14px;margin-bottom:14px}.features-grid,.premium-grid,.download-grid{grid-template-columns:1fr}.feature,.premium-item,.download-card{padding:12px}
}