/* ─── Followup landing — base styles ─── */
:root{
  --bg:        oklch(0.985 0.005 80);
  --bg-2:      oklch(0.965 0.008 80);
  --bg-3:      oklch(0.94  0.012 80);
  --ink:       oklch(0.22  0.01  80);
  --ink-2:     oklch(0.42  0.01  80);
  --ink-3:     oklch(0.62  0.01  80);
  --line:      oklch(0.88  0.008 80);
  --line-2:    oklch(0.93  0.008 80);
  --clay:      oklch(0.62  0.14  35);
  --clay-2:    oklch(0.55  0.16  35);
  --clay-bg:   oklch(0.96  0.025 40);
  --sage:      oklch(0.62  0.07 150);
  --sage-bg:   oklch(0.96  0.02 150);
  --amber:     oklch(0.74  0.13  75);
  --amber-bg:  oklch(0.965 0.04  85);
  --hot:       oklch(0.58  0.17  30);
  --hot-bg:    oklch(0.96  0.04  35);

  --pad-y: 110px;
  --gap-card: 22px;
  --r-lg: 20px;
  --r-md: 14px;
  --r-sm: 10px;
}
[data-density="compact"]{ --pad-y: 72px; --gap-card: 14px; }
[data-density="airy"]{    --pad-y: 160px; --gap-card: 30px; }

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink)}
body{
  font-family:"Rubik", system-ui, -apple-system, sans-serif;
  font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern" 1, "ss01" 1;
  overflow-x:hidden;
}
::selection{background:var(--clay);color:#fff}

.serif{ font-family:"Noto Serif Hebrew","Rubik",serif; font-weight:500; letter-spacing:-0.012em; line-height:1.08; }
.mono{ font-family:"JetBrains Mono", ui-monospace, monospace; font-feature-settings:"kern" 1; }

a{color:inherit;text-decoration:none}
button{font-family:inherit}

.wrap{ max-width:1240px; margin:0 auto; padding:0 32px; }
.wrap-narrow{ max-width:920px; margin:0 auto; padding:0 32px; }

/* ─── Buttons ─── */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 20px; border-radius:999px;
  font-size:14.5px; font-weight:500;
  border:1px solid transparent; cursor:pointer; line-height:1;
  transition: transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.btn-primary{ background:var(--ink); color:var(--bg); }
.btn-primary:hover{ background:var(--clay-2); transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--ink); background:var(--bg-2); }
.btn-clay{ background:var(--clay); color:#fff; }
.btn-clay:hover{ background:var(--clay-2); transform:translateY(-1px);}
.btn-lg{ padding:15px 24px; font-size:15.5px; }

.arrow{ display:inline-block; transform:scaleX(-1); }

/* ─── Nav ─── */
nav.top{
  position:sticky; top:0; z-index:50;
  background: color-mix(in oklab, var(--bg) 82%, transparent);
  backdrop-filter:blur(14px) saturate(160%);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
  border-bottom:1px solid var(--line-2);
}
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 32px; max-width:1240px; margin:0 auto; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; letter-spacing:-0.015em; }
.brand-mark{
  width:30px; height:30px; border-radius:9px;
  background:var(--ink); color:var(--bg);
  display:grid; place-items:center; position:relative; font-weight:700; font-size:15px;
  font-family:"Noto Serif Hebrew",serif;
}
.brand-mark::after{
  content:""; position:absolute; right:5px; bottom:5px;
  width:7px; height:7px; border-radius:50%; background:var(--clay);
  box-shadow:0 0 0 2px var(--ink);
}
.nav-links{ display:flex; gap:30px; font-size:14.5px; color:var(--ink-2); }
.nav-links a:hover{ color:var(--ink); }
.nav-cta{ display:flex; gap:10px; align-items:center; }
@media(max-width:840px){ .nav-links{display:none} }

/* ─── Common section bits ─── */
section{ padding:var(--pad-y) 0; position:relative; }
.sec-eyebrow{
  font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--clay); margin-bottom:14px; display:inline-block;
}
h2.sec-h{
  font-family:"Noto Serif Hebrew",serif; font-weight:500;
  font-size:46px; line-height:1.08; letter-spacing:-0.02em;
  margin:0 0 18px; max-width:22ch; text-wrap:balance; color:var(--ink);
}
.sec-lede{
  font-size:18px; line-height:1.6; color:var(--ink-2);
  max-width:62ch; margin:0; text-wrap:pretty;
}
.sec-lede em{ font-style:normal; color:var(--ink); font-weight:500; }

/* badges + chips */
.badge{
  display:inline-flex; align-items:center; gap:5px;
  font-size:10.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:3px 8px; border-radius:999px;
  background:var(--bg-3); color:var(--ink-2);
}
.badge.hot{ background:var(--hot-bg); color:var(--hot); }
.badge.warn{ background:var(--clay-bg); color:var(--clay-2); }
.badge.cool{ background:var(--sage-bg); color:oklch(0.38 0.06 150); }

/* dotted background helper */
.dotted{
  background-image: radial-gradient(circle at 1px 1px, color-mix(in oklab, var(--ink) 10%, transparent) 1px, transparent 0);
  background-size: 22px 22px;
}

/* responsive guards */
@media(max-width:720px){
  h2.sec-h{ font-size:34px; }
  .sec-lede{ font-size:16px; }
  .wrap{ padding:0 20px; }
  section{ padding: calc(var(--pad-y) * .7) 0; }
}
@media(max-width:640px){
  .nav-inner{ padding:12px 20px; }
  .nav-cta .btn-ghost{ display:none; }
  .nav-cta .btn{ padding:10px 14px; font-size:13.5px; }
  .brand{ font-size:16.5px; }
  .brand-mark{ width:26px; height:26px; font-size:13px; }
  .btn-lg{ padding:13px 18px; font-size:14.5px; }
}