@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --ink:#171717!important;
  --ink-soft:#454844!important;
  --slate:#6D716B!important;
  --paper:#F8F7F2!important;
  --paper-deep:#F0EEE6!important;
  --line:#E7E3D7!important;
  --amber:#FEBD02!important;
  --amber-soft:#FFF0B7!important;
  --orange:#FCA223!important;
  --pen:#A96800!important;
  --green:#176B55!important;
  --display:'Inter',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  --body:'Inter',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

body{font-family:var(--body)!important;background:var(--paper)!important;color:var(--ink)!important}
h1,h2,h3{font-family:var(--display)!important;letter-spacing:-.04em!important}
h1{font-weight:800!important}
h2,h3{font-weight:700!important}

header{background:rgba(248,247,242,.92)!important;border-color:rgba(23,23,23,.09)!important;backdrop-filter:blur(12px)!important;position:sticky;top:0;z-index:50}
header .nav,header nav{max-width:1200px!important;min-height:76px!important;height:auto!important;margin:0 auto!important;padding:12px 24px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:24px!important}
header .nav img,header nav img{height:48px!important;width:auto!important;display:block!important}
header .nav-links,header .nav nav,header nav>div{display:flex!important;align-items:center!important;gap:7px!important;list-style:none!important;flex-wrap:wrap!important}
header .nav-links a,header .nav nav a,header nav>div a{font:600 .88rem/1.2 var(--body)!important;color:#50534F!important;text-decoration:none!important;padding:10px 12px!important;border-radius:10px!important}
header .nav-links a:hover,header .nav nav a:hover,header nav>div a:hover{background:#ECEAE2!important;color:var(--ink)!important}
header .nav-links .btn,header .nav-links .nav-cta,header .nav nav .nav-cta,header nav>div .nav-cta{background:var(--amber)!important;color:var(--ink)!important;padding:12px 16px!important}

.btn,.button,.cta a{border-radius:11px!important;font-family:var(--body)!important;font-weight:750!important}
.btn-amber,.button.primary{background:var(--amber)!important;color:var(--ink)!important}
.hero{background:radial-gradient(circle at 82% 12%,rgba(254,189,2,.18),transparent 31%),var(--paper)!important}
.hero h1{line-height:1.01!important}
.eyebrow,.category,.kicker{color:var(--green)!important}
.eyebrow::before{background:var(--green)!important}
.type,.plan,.hstep,.post-card,.card,.brief,.take,.parent,.step{border-radius:18px!important}
.post-card{transition:transform .2s ease,box-shadow .2s ease!important}
.post-card:hover{transform:translateY(-5px)!important;box-shadow:0 22px 48px rgba(23,23,23,.1)!important}
input,select,textarea{border-radius:10px!important}
footer{background:#111311!important}

@media(max-width:820px){
  header .nav,header nav{padding:11px 18px!important}
  header .nav-links,header .nav nav,header nav>div{gap:2px!important;justify-content:flex-end!important}
  header .nav-links a,header .nav nav a,header nav>div a{font-size:.78rem!important;padding:8px!important}
}
@media(max-width:620px){
  header .nav img,header nav img{height:42px!important}
  header .nav-links a:not(.btn):not(.nav-cta),header .nav nav a:not(.nav-cta),header nav>div a:not(.nav-cta){display:none!important}
}