:root{
  --bg:#fdf6ef; --surface:#ffffff; --surface2:#fbeee4; --line:#f0e2d6;
  --ink:#241a15; --dim:#6f6157; --faint:#a2917f;
  --orange:#f7941e; --pink:#ec1e5b; --pink-deep:#c9294f; --wine:#4a2036;
  --pink-soft:#fce3e6;
  --grad:linear-gradient(135deg,#f7941e,#ec1e5b);
  --shadow-sm:0 1px 2px rgba(36,26,21,.05),0 8px 22px rgba(36,26,21,.06);
  --shadow-lg:0 26px 64px rgba(74,32,54,.16);
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
:root[data-theme="dark"]{
  --bg:#1a0f12; --surface:#251920; --surface2:#32232b; --line:#3e2d35;
  --ink:#f7ece6; --dim:#c6ada3; --faint:#93807a;
  --orange:#ffab45; --pink:#ff5c81; --pink-deep:#ff789a; --wine:#5c2a44;
  --pink-soft:#3a2026;
  --grad:linear-gradient(135deg,#ffab45,#ff5c81);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.34);
  --shadow-lg:0 26px 64px rgba(0,0,0,.5);
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--pink);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

/* header */
header{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:22px;height:76px}
.logo-img{height:42px;width:auto;display:block}
.menu{display:flex;gap:22px;font-size:14.5px;font-weight:600;color:var(--dim);margin-left:6px}
.menu a{color:var(--dim)}
.menu a:hover{color:var(--ink);text-decoration:none}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.theme-toggle{width:40px;height:40px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);display:flex;align-items:center;justify-content:center;font-size:17px;line-height:1;transition:border-color .15s,transform .15s}
.theme-toggle:hover{border-color:var(--pink);transform:translateY(-1px)}
.nav-cta{background:var(--grad);color:#fff;font-weight:700;font-size:14px;padding:10px 18px;border-radius:999px;transition:transform .15s,filter .15s}
.nav-cta:hover{transform:translateY(-1px);filter:brightness(1.05);text-decoration:none}

/* article */
.article{max-width:720px;margin:0 auto;padding:52px 24px 24px}
.eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--pink);background:var(--pink-soft);padding:6px 12px;border-radius:999px;margin-bottom:18px}
.article h1{font-size:clamp(30px,5vw,46px);line-height:1.08;letter-spacing:-.03em;font-weight:800;margin:0 0 14px;text-wrap:balance}
.article .meta{color:var(--faint);font-size:14px;font-weight:600;margin-bottom:8px}
.prose{font-size:18px;color:var(--ink)}
.prose p{margin:0 0 20px}
.prose h2{font-size:clamp(22px,3vw,28px);font-weight:800;letter-spacing:-.02em;margin:38px 0 14px}
.prose h3{font-size:20px;font-weight:700;margin:28px 0 10px}
.prose ul,.prose ol{margin:0 0 20px;padding-left:22px}
.prose li{margin:0 0 9px}
.prose strong{font-weight:700;color:var(--ink)}
.prose em{font-style:italic}
.prose a{color:var(--pink);font-weight:600}
.prose hr{border:none;border-top:1px solid var(--line);margin:34px 0}
.prose blockquote{margin:0 0 20px;padding:4px 18px;border-left:3px solid var(--pink);color:var(--dim)}

/* capture */
.capture{max-width:720px;margin:20px auto 0;background:linear-gradient(135deg,var(--surface2),var(--pink-soft));border:1px solid var(--line);border-radius:24px;padding:clamp(26px,4vw,40px);text-align:center}
.capture h3{font-size:clamp(20px,2.6vw,26px);font-weight:800;letter-spacing:-.02em;margin:0 0 8px}
.capture p{color:var(--dim);font-size:15px;margin:0 auto 20px;max-width:44ch}
.capture form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;max-width:440px;margin:0 auto}
.capture input[type=email]{flex:1;min-width:200px;background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:14px 18px;color:var(--ink);font-size:14.5px}
.capture input[type=email]:focus{outline:none;border-color:var(--pink)}
.capture button{background:var(--grad);color:#fff;font-weight:700;padding:14px 22px;border-radius:999px;font-size:14.5px;transition:transform .15s,filter .15s}
.capture button:hover{transform:translateY(-1px);filter:brightness(1.05)}
.capture .hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.capture .cf-turnstile{display:flex;justify-content:center;margin-top:14px}
.capture .err{display:none;color:#c0392b;font-size:13.5px;font-weight:600;margin-top:12px}
.capture .done{font-weight:700;color:#2f9e6b;font-size:16px}

/* blog index */
.index-head{max-width:1120px;margin:0 auto;padding:56px 24px 8px;text-align:center}
.index-head h1{font-size:clamp(30px,5vw,46px);font-weight:800;letter-spacing:-.03em;margin:0 0 10px}
.index-head h1 .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.index-head p{color:var(--dim);font-size:17px;max-width:52ch;margin:0 auto}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1120px;margin:36px auto 0;padding:0 24px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.card .cover{height:130px}
.card .cb{padding:20px;display:flex;flex-direction:column;flex:1}
.card .kicker{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--pink)}
.card h2{margin:8px 0 8px;font-size:18px;font-weight:700;line-height:1.32}
.card h2 a{color:var(--ink)}
.card h2 a:hover{color:var(--pink);text-decoration:none}
.card .excerpt{font-size:14px;color:var(--dim);margin:0 0 14px;flex:1}
.card .more{font-size:13.5px;font-weight:700;color:var(--pink)}
.cov1{background:linear-gradient(135deg,#ffbf6b,#ec6a5a)}
.cov2{background:linear-gradient(135deg,#ff8fa8,#b83a63)}
.cov3{background:linear-gradient(135deg,#ffce85,#e0603e)}
.cov4{background:linear-gradient(135deg,#ff9ec0,#7e2f55)}
.cov5{background:linear-gradient(135deg,#ffb14c,#ec1e5b)}
.cov6{background:linear-gradient(135deg,#ffa6be,#a83a5c)}

/* footer */
footer{border-top:1px solid var(--line);margin-top:48px;padding:34px 0 46px}
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--faint)}
.foot-logo{height:30px;opacity:.85}
.age{border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-weight:700}

@media (max-width:840px){.menu{display:none}.posts{grid-template-columns:1fr}}