/* Slow & Steady — responsive styles */
:root {
  --site-primary: #4b6b45;
  --site-secondary: #d9e8c8;
  --site-background: #f5f4e9;
  --site-on-primary: #ffffff;
  --site-on-secondary: #263d25;
  --site-on-background: #233324;
  --site-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-font-heading: Georgia, "Times New Roman", serif;
  --site-heading-scale: 1;
  --site-spacing-scale: 1;
  --site-radius-scale: 1;
  --site-decoration-opacity: 1;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--site-on-background); font-family: var(--site-font-body); background: var(--site-background); }
#app { min-height: 100vh; width: 100%; border-radius: 0; overflow: hidden; background-color: var(--site-background); color: var(--site-on-background); position: relative; }
.decor { position:absolute; pointer-events:none; opacity:var(--site-decoration-opacity); z-index:0; }
.decor.one { width:320px;height:320px;right:-110px;top:210px;border-radius:50%;background:radial-gradient(circle,rgba(188,211,154,.42),transparent 70%); }
.decor.two { width:230px;height:230px;left:-90px;top:650px;border-radius:50%;background:radial-gradient(circle,rgba(221,184,125,.22),transparent 70%); }
nav, main, footer { position:relative; z-index:1; }
nav { display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:auto;padding:24px 28px; }
.brand { display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.04em;font-size:19px; }
.brand-mark { width:38px;height:38px;display:grid;place-items:center;border-radius:14px;background:var(--site-primary);color:white;font-size:21px; }
.amp { color:#7f9b70; }
.nav-links { display:flex;gap:26px;align-items:center;font-size:13px;font-weight:650; }
a { color:inherit;text-decoration:none; }
.nav-links a:hover { color:var(--site-primary); }
.nav-cta,.primary-btn { display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--site-primary);color:var(--site-on-primary);padding:12px 18px;border-radius:999px;font-size:13px;font-weight:750;border:0;cursor:pointer;transition:transform .2s,filter .2s; }
.nav-cta:hover,.primary-btn:hover { transform:translateY(-2px);filter:brightness(1.08); }
.hero { max-width:1180px;margin:auto;padding:60px 28px 72px;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center; }
.eyebrow { display:inline-flex;align-items:center;gap:8px;background:#e5eddb;border:1px solid #d3e0c6;color:#41623c;padding:8px 12px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase; }
h1,h2,h3 { font-family:var(--site-font-heading);font-weight:500;letter-spacing:-.045em; }
h1 { font-size:clamp(48px,6.4vw,80px);line-height:.99;margin:22px 0 20px;max-width:650px; }
h1 em { color:var(--site-primary);font-weight:500; }
.hero-copy { font-size:17px;line-height:1.75;color:#637061;max-width:520px; }
.hero-actions { display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:28px; }
.secondary-btn { display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border:1px solid #d5dccc;border-radius:999px;font-weight:750;font-size:13px;background:rgba(255,255,255,.45); }
.trust { display:flex;align-items:center;gap:11px;margin-top:28px;color:#778273;font-size:12px; }
.avatars { display:flex; }
.avatars span { width:27px;height:27px;border-radius:50%;display:grid;place-items:center;margin-left:-5px;border:2px solid var(--site-background);background:#d8b99a;font-size:13px; }
.avatars span:first-child { margin-left:0;background:#e6c4a7; }.avatars span:nth-child(2){background:#c3d5b5}.avatars span:nth-child(3){background:#d9c4e4}
.visual { min-height:440px;position:relative;display:grid;place-items:center; }
.sun-disc { position:absolute;width:min(390px,85%);aspect-ratio:1;border-radius:50%;background:#e6eddb;top:25px; }
.sloth-card { width:min(420px,100%);position:relative;background:#fffdf6;border:1px solid #e4e5d8;border-radius:30px;padding:20px;box-shadow:0 24px 80px rgba(49,73,41,.12);transform:rotate(2deg); }
.card-top { display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#7c8778;font-weight:700; }
.status-pill { border-radius:999px;background:#e6efdf;color:#4b6b45;padding:7px 10px;font-size:10px; }
.sloth-art { display:grid;place-items:center;height:230px;position:relative;overflow:hidden;background:linear-gradient(160deg,#eff3e6,#dfe9d4);border-radius:22px;margin:15px 0; }
.sloth-art:before,.sloth-art:after { content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.5);width:130px;height:130px;top:-50px;right:-20px; }
.sloth-art:after { width:70px;height:70px;top:auto;bottom:-25px;right:auto;left:25px; }
.sloth-emoji { font-size:142px;filter:drop-shadow(0 12px 8px rgba(59,74,49,.15));animation:float 5s ease-in-out infinite;position:relative;z-index:1; }
@keyframes float { 0%,100%{transform:translateY(3px) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)} }
.task-line { display:flex;gap:11px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0e7;font-size:12px; }
.task-line:last-child{border:0}.check { width:19px;height:19px;border-radius:6px;background:#dce9d1;color:#42643a;display:grid;place-items:center;font-size:12px;flex-shrink:0; }.task-line strong{display:block;font-size:12px}.task-line small{color:#899184;display:block;margin-top:3px}.task-line .done{margin-left:auto;color:#63805a;font-size:10px;font-weight:800}.sun-check{background:#f4e8d3;color:#997345}
.floating-note { position:absolute;right:-10px;bottom:34px;background:#fffdf6;padding:14px 17px;border:1px solid #e4e5d8;border-radius:17px;box-shadow:0 14px 40px #3b4d3018;font-size:12px;transform:rotate(-3deg); }.floating-note strong{display:block;font-size:18px;margin-bottom:2px;color:#4b6b45}
.section { padding:78px 28px; }
.section-inner { max-width:1100px;margin:auto; }
.section-heading { text-align:center;max-width:650px;margin:0 auto 38px; }
.section-heading .eyebrow { margin-bottom:14px; }
h2 { font-size:clamp(34px,4.2vw,52px);line-height:1.08;margin:0 0 14px; }
.section-heading p { color:#6b7768;line-height:1.7;margin:0; }
.tools-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:17px; }
.tool-card { border:1px solid #e0e4d8;background:#fffdf7;border-radius:calc(22px * var(--site-radius-scale));padding:25px;min-height:235px;transition:transform .2s,box-shadow .2s; }
.tool-card:hover { transform:translateY(-4px);box-shadow:0 18px 45px #35482a12; }
.tool-icon { width:46px;height:46px;border-radius:15px;display:grid;place-items:center;font-size:23px;background:#e8efdf;margin-bottom:20px; }
.tool-card:nth-child(2) .tool-icon{background:#f7e9d3}.tool-card:nth-child(3) .tool-icon{background:#e9e1f1}
.tool-card h3 { font-size:24px;margin:0 0 10px; }.tool-card p{color:#748070;font-size:13px;line-height:1.7;margin:0 0 17px}.text-link{font-size:12px;font-weight:800;color:var(--site-primary);cursor:pointer;background:none;border:0;padding:0}
.demo-section { background:#e9efdf; }
.demo-layout { display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start; }
.demo-intro h2 { margin-top:14px; }.demo-intro p{line-height:1.8;color:#64735f;font-size:14px}.privacy-note{display:flex;gap:10px;margin-top:22px;padding:14px;border-radius:14px;background:#f8faf3;border:1px solid #dce5d1;font-size:12px;line-height:1.6;color:#61715c}
.demo-box { background:#fffdf7;border:1px solid #dfe5d5;border-radius:24px;padding:25px;box-shadow:0 16px 45px #35482a0b; }
.tabs { display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px; }.tab{border:1px solid #dce2d5;border-radius:999px;background:transparent;padding:9px 13px;font-size:11px;font-weight:800;color:#64715e;cursor:pointer}.tab.active{background:var(--site-primary);color:#fff;border-color:var(--site-primary)}
label { display:block;font-size:12px;font-weight:800;margin-bottom:8px; }.field{width:100%;border:1px solid #dce2d5;border-radius:12px;background:#fffefb;padding:13px 14px;font:inherit;font-size:13px;color:#293729;outline:none}.field:focus{border-color:#719269;box-shadow:0 0 0 3px #78966b20}textarea.field{resize:vertical;min-height:112px;line-height:1.6}.field-wrap{margin-bottom:16px}.demo-actions{display:flex;align-items:center;gap:13px;flex-wrap:wrap}.subtle{font-size:11px;color:#8a9384}.result{display:none;margin-top:20px;padding:18px;background:#f0f4e9;border:1px solid #dce7d1;border-radius:15px;font-size:13px;line-height:1.7;white-space:pre-wrap}.result.show{display:block}.result h3{font-size:21px;margin:0 0 8px}.result p{margin:0}
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:steps}.step{padding:25px 24px;border-top:1px solid #dce2d5;counter-increment:steps}.step-number{font-family:var(--site-font-heading);font-size:34px;color:#8da681}.step h3{font-size:23px;margin:12px 0 8px}.step p{font-size:13px;line-height:1.75;color:#758071;margin:0}
.open-card{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;background:#243b2b;color:#f7f5e9;border-radius:28px;padding:clamp(28px,5vw,55px);overflow:hidden;position:relative}.open-card:after{content:"";position:absolute;right:-80px;top:-100px;width:300px;height:300px;border:1px solid #8aa67b55;border-radius:50%;box-shadow:0 0 0 35px #8aa67b15,0 0 0 75px #8aa67b10;pointer-events:none}.open-card h2{margin:14px 0 15px}.open-card p{color:#c4d0bc;font-size:14px;line-height:1.8}.open-em{color:#b9d5a7}.open-card .eyebrow{background:#354f3b;color:#dcebd1;border-color:#47634b}.open-points{display:grid;gap:15px;position:relative;z-index:1}.open-point{display:flex;gap:13px;align-items:flex-start;padding:15px;border:1px solid #ffffff1a;border-radius:15px;background:#ffffff08}.open-point b{display:block;font-size:13px;margin-bottom:4px}.open-point span{display:block;color:#c4d0bc;font-size:12px;line-height:1.6}.open-point i{font-style:normal;font-size:20px}
.cta{text-align:center;padding:85px 25px}.cta h2{max-width:620px;margin:15px auto}.cta p{color:#6d7868;line-height:1.8;max-width:520px;margin:0 auto 24px}.footer{border-top:1px solid #e0e4d8;max-width:1180px;margin:auto;padding:25px 28px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:11px;color:#7b8677}.footer strong{color:#445a40}.footer-brand{font-size:14px}.footer-brand .brand-mark{width:28px;height:28px;border-radius:10px;font-size:16px}
@media(max-width:850px){.hero{grid-template-columns:1fr;padding-top:40px}.hero-copy{max-width:650px}.visual{min-height:390px}.tools-grid{grid-template-columns:1fr 1fr}.demo-layout{grid-template-columns:1fr;gap:28px}.open-card{grid-template-columns:1fr;gap:20px}.nav-links{gap:14px}}
@media(max-width:560px){nav{padding:18px}.nav-links a:not(.nav-cta){display:none}.nav-cta{padding:10px 13px}.hero{padding:35px 20px 45px;gap:15px}h1{font-size:52px}.hero-copy{font-size:15px}.visual{min-height:360px}.sloth-card{padding:14px}.sloth-art{height:185px}.sloth-emoji{font-size:115px}.floating-note{right:-3px;bottom:15px}.section{padding:58px 20px}.tools-grid,.how-grid{grid-template-columns:1fr}.tool-card{min-height:0}.demo-box{padding:18px}.open-card{border-radius:22px}.footer{padding:22px 20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

.result-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:15px; }