:root { --ink: #252333; }
.font-display { font-family: 'Space Grotesk', sans-serif; }
.prose h2 { margin: 2.25rem 0 .7rem; color: #252333; font-family: 'Space Grotesk', sans-serif; font-size: 1.35rem; font-weight: 700; }
.prose p { margin: .75rem 0; line-height: 1.8; }
.prose a { color: #16a36d; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; }
.eyebrow { color: #16a36d; font-size: .68rem; font-weight: 700; letter-spacing: .18em; }
.blob { position: absolute; border-radius: 999px; filter: blur(1px); pointer-events: none; }
.blob-one { width: 22rem; height: 22rem; left: -12rem; top: 10rem; background: #e7dcff; opacity: .55; }
.blob-two { width: 17rem; height: 17rem; right: -8rem; top: 4rem; background: #dff5ec; opacity: .9; }
.platform-pill { display: inline-flex; align-items: center; gap: .55rem; border: 1px solid #e9e7e3; border-radius: 999px; background: rgba(255,255,255,.85); padding: .7rem 1rem; box-shadow: 0 5px 18px rgba(37,35,51,.06); font-size: .88rem; font-weight: 600; }
.platform-pill b { font-size: 1.2rem; line-height: 1; }.instagram { color: #d94673; }.tiktok { color: #111827; }.youtube { color: #ef4444; font-size: .8rem !important; }.facebook { color: #1877f2; }
.button-primary { display: inline-flex; align-items: center; gap: .8rem; border-radius: 999px; background: #16a36d; padding: .95rem 1.4rem; color: white; font-size: .9rem; font-weight: 700; box-shadow: 0 9px 20px rgba(22,163,109,.22); transition: transform .2s, background .2s; }.button-primary:hover { background: #128b5c; transform: translateY(-2px); }.button-primary.light { background: white; color: #16a36d; box-shadow: none; }.button-quiet { padding: .95rem 1.2rem; font-size: .9rem; font-weight: 700; color: #25233399; }
.dashboard-window { overflow: hidden; border: 1px solid #e9e7e3; border-radius: 1.4rem; background: white; }.dashboard-window i { display: block; width: .45rem; height: .45rem; border-radius: 50%; background: #ddd9d3; }.dashboard-window .mini-icon, .social-mark { display: inline-flex; align-items: center; justify-content: center; border-radius: .7rem; font-weight: 700; }.mini-icon { width: 2rem; height: 2rem; font-size: 1rem; }.schedule-row { display: flex; align-items: center; gap: .55rem; font-size: .75rem; }.schedule-row time { margin-left: auto; color: #85818c; }.dot { width: .45rem; height: .45rem; border-radius: 50%; }
.feature-card { position: relative; overflow: hidden; min-height: 17rem; border: 1px solid #eceae6; border-radius: 1.5rem; background: #fbfaf8; padding: 2rem; }.feature-card h3 { margin: 1rem 0 .7rem; font-family: 'Space Grotesk', sans-serif; font-size: 1.45rem; font-weight: 700; }.feature-card p { max-width: 28rem; color: #25233399; font-size: .95rem; line-height: 1.7; }.number { color: #16a36d; font-size: .7rem; font-weight: 700; letter-spacing: .12em; }.post-stack { position: absolute; bottom: 1.8rem; right: 2rem; width: 38%; }.post-line { display: flex; align-items: center; gap: .65rem; margin-top: .5rem; border: 1px solid #e9e7e3; border-radius: .8rem; background: white; padding: .65rem; box-shadow: 0 5px 15px #2523330b; font-size: .76rem; }.post-line.offset { transform: translateX(-1rem); }.post-line.offset-two { transform: translateX(-2rem); }.social-mark { width: 1.7rem; height: 1.7rem; }.status { margin-left: auto; color: #16a36d; font-size: .68rem; }.time-card { margin-top: 1.5rem; border-radius: 1rem; background: #252333; padding: 1rem; color: white; }.time-card span, .time-card strong { display: block; font-size: .7rem; color: #ffffff99; }.time-card strong { margin-top: .5rem; color: white; }.time-card b { display: block; margin-top: .2rem; font: 700 1.45rem 'Space Grotesk'; }.time-bar { height: .3rem; margin-top: .8rem; border-radius: 1rem; background: #ffffff22; }.time-bar i { display: block; width: 65%; height: 100%; border-radius: inherit; background: #53d1a0; }.control-list { display: grid; gap: .6rem; margin-top: 1.6rem; color: #252333b3; font-size: .8rem; font-weight: 600; }.accent-card { display: flex; align-items: center; justify-content: space-between; background: #16a36d; color: white; }.accent-card p, .accent-card .number { color: #ffffffaa; }.spark { margin-right: 8%; color: #8ce0bf; font-size: 8rem; transform: rotate(15deg); }
@media (max-width: 640px) { .feature-card { min-height: auto; padding: 1.5rem; }.post-stack { position: relative; right: auto; bottom: auto; width: 92%; margin: 1.5rem 0 0 auto; }.accent-card { min-height: 18rem; }.spark { position: absolute; right: -1rem; bottom: -1rem; font-size: 7rem; } }