:root{--cream:#f7efdc;--ink:#2b2a26;--mustard:#e0a526;--teal:#1f8a8a;--orange:#e2642b;--pink:#f2b5a7;--card:#fffaf0}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.55 Outfit,system-ui,sans-serif}
h1,h2,h3,.btn,.tabs a,.eyebrow,.badge,.disclosure-bar{font-family:"Josefin Sans",system-ui,sans-serif}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
.disclosure-bar{background:var(--teal);color:#fff;text-align:center;padding:8px 12px;font-size:14px;letter-spacing:.04em}
.hero{position:relative;overflow:hidden;padding:64px 0 36px;border-bottom:6px solid var(--mustard)}
.shapes span{position:absolute;display:block}
.sun{width:260px;height:260px;border-radius:50%;background:var(--mustard);right:-40px;top:-60px;opacity:.9}
.arc{width:180px;height:90px;border-radius:180px 180px 0 0;background:var(--orange);right:170px;top:120px}
.block{width:90px;height:90px;background:var(--teal);right:60px;top:170px;transform:rotate(45deg)}
.hero .wrap{position:relative}
.eyebrow{text-transform:uppercase;letter-spacing:.2em;color:var(--teal);font-weight:600;margin:0}
h1{font-size:clamp(44px,8vw,84px);line-height:1;margin:.15em 0;letter-spacing:-.01em}
.lede{font-size:19px;max-width:30em;margin:0 0 24px}
.tabs{display:flex;gap:10px;flex-wrap:wrap}.tabs a{background:var(--ink);color:var(--cream);text-decoration:none;padding:9px 18px;border-radius:999px;font-weight:600;letter-spacing:.05em}
.cat{padding:44px 0}.cat h2{display:flex;align-items:center;gap:12px;font-size:32px;margin:0}
.cat-ic{width:44px;height:44px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center}.cat-ic svg{width:24px}
.intro{margin:8px 0 28px;max-width:40em}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.card{background:var(--card);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 2px 0 var(--ink);border:2px solid var(--ink)}
.media{height:150px;display:grid;place-items:center;color:var(--cream);position:relative;overflow:hidden}
.media::after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.15);right:-30px;bottom:-40px}
.media svg{width:64px;height:64px;position:relative;z-index:1}.media img{width:100%;height:100%;object-fit:contain;background:#fff}
.mustard{background:var(--mustard)}.teal{background:var(--teal)}.orange{background:var(--orange)}
.body{padding:20px;display:flex;flex-direction:column;flex:1}.body h3{margin:0 0 8px;font-size:20px;line-height:1.25}.body p{margin:0 0 18px;flex:1}
.badge{align-self:flex-start;background:var(--pink);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:3px 10px;border-radius:999px;margin-bottom:10px}
.btn{align-self:flex-start;background:var(--ink);color:var(--cream);text-decoration:none;padding:11px 20px;border-radius:999px;font-weight:700;letter-spacing:.05em;transition:transform .15s}
.btn:hover{transform:translateY(-2px);background:var(--teal)}.btn-ref{background:var(--teal)}.btn-ref:hover{background:var(--orange)}
.footer{background:var(--ink);color:var(--cream);padding:32px 0;margin-top:20px;border-top:6px solid var(--orange)}.small{font-size:13px;opacity:.7}
@media(max-width:640px){.sun{width:160px;height:160px}.arc,.block{display:none}.hero{padding:44px 0 28px}}