@font-face{
  font-family:"Fraunces";
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("../fonts/fraunces-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Fraunces";
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/fraunces-italic-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Figtree";
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("../fonts/figtree-latin.woff2") format("woff2");
}

:root{
  --bone:#F4EDE3;
  --bone-2:#E8DFD1;
  --paper:#FBF7F1;
  --ink:#13241C;
  --ink-soft:#3A4E44;
  --forest:#1A3C2E;
  --forest-deep:#0F241B;
  --persimmon:#E24E1B;
  --persimmon-deep:#C43D12;
  --tangerine:#F07A2A;
  --chartreuse:#C8E14A;
  --line:rgba(19,36,28,.12);
  --shadow:0 18px 40px rgba(15,36,27,.12);
  --r:18px;
  --ease:cubic-bezier(.22,.8,.24,1);
  --h:"Fraunces", "Iowan Old Style", Palatino, "Palatino Linotype", serif;
  --b:"Figtree", "Avenir Next", "Segoe UI", sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px;background:var(--bone)}
img,svg{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
a{color:var(--persimmon);text-underline-offset:3px}
::selection{background:var(--chartreuse);color:var(--forest-deep)}

body{
  color:var(--ink);
  font-family:var(--b);
  font-size:16.5px;
  line-height:1.55;
  background:
    radial-gradient(900px 520px at 108% -8%, rgba(200,225,74,.38), transparent 58%),
    radial-gradient(700px 480px at -12% 12%, rgba(226,78,27,.10), transparent 52%),
    radial-gradient(800px 500px at 50% 120%, rgba(26,60,46,.06), transparent 50%),
    var(--bone);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";
  pointer-events:none;
  position:fixed;inset:0;z-index:80;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
}

.skip{
  position:absolute;left:-999px;top:8px;z-index:100;
  background:var(--forest);color:var(--paper);padding:10px 14px;border-radius:8px;font-weight:600;
}
.skip:focus{left:12px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{width:min(1180px, calc(100% - 32px));margin:0 auto}
@media (min-width:800px){.wrap{width:min(1180px, calc(100% - 64px))}}

/* type */
.kicker{
  font-family:var(--b);font-size:12px;font-weight:650;letter-spacing:.16em;
  text-transform:uppercase;color:var(--persimmon);margin-bottom:12px;
}
h1,h2,h3{
  font-family:var(--h);
  font-optical-sizing:auto;
  font-variation-settings:"SOFT" 40, "WONK" 1;
  font-weight:560;
  letter-spacing:-.025em;
  line-height:.98;
  color:var(--forest-deep);
}
h1{font-size:clamp(2.35rem, 7.2vw, 5.4rem);text-wrap:balance}
h1 em{
  font-style:italic;font-weight:450;
  font-variation-settings:"SOFT" 70, "WONK" 1;
  background:linear-gradient(180deg, transparent 64%, rgba(200,225,74,.85) 64% 92%, transparent 92%);
}
h2{font-size:clamp(2rem, 4.2vw, 3.35rem);text-wrap:balance}
h3{font-size:1.28rem;line-height:1.15;letter-spacing:-.02em}
.lead,.sec-lead{
  color:var(--ink-soft);font-size:clamp(1.02rem, 1.6vw, 1.2rem);line-height:1.55;
  max-width:38em;text-wrap:pretty;
}
.sec-head{max-width:720px;margin:0 auto 40px;text-align:center}
.sec-head .sec-lead{margin:16px auto 0}
.sec-head h2{margin-top:4px}

/* header */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(251,247,241,.86);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);
  backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid var(--line);
}
.topbar .in{
  width:min(1180px, calc(100% - 24px));
  margin:0 auto;height:68px;
  display:flex;align-items:center;gap:18px;
}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--forest-deep);margin-right:auto;min-width:0}
.brand .mark{width:34px;height:34px;color:var(--forest);flex:none;border-radius:7px}
.brand span{font-family:var(--h);font-size:1.12rem;font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.nav{display:none;gap:22px}
.nav a{
  color:var(--forest);text-decoration:none;font-weight:550;font-size:.95rem;
  padding:8px 0;border-bottom:2px solid transparent;
}
.nav a:hover{color:var(--persimmon);border-bottom-color:var(--chartreuse)}
.burger{
  display:flex;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;padding:10px;background:none;border:0;cursor:pointer;flex:none;
}
.burger i{display:block;height:2px;background:var(--forest);border-radius:2px;transition:transform .25s var(--ease),opacity .2s}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.menu{
  display:flex;flex-direction:column;padding:8px 20px 20px;border-top:1px solid var(--line);
  background:var(--paper);
}
.menu[hidden]{display:none}
.menu a{
  padding:14px 2px;color:var(--forest);text-decoration:none;font-weight:600;
  border-bottom:1px solid var(--line);
}
.menu a:last-child{border:0;color:var(--persimmon)}
.topbar .in > .btn{display:none}
@media (min-width:960px){
  .nav{display:flex}
  .burger,.menu{display:none!important}
  .topbar .in > .btn{display:inline-flex}
  .topbar .in{width:min(1180px, calc(100% - 64px))}
}

/* buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:50px;padding:0 22px;border-radius:12px;
  background:var(--persimmon);color:var(--paper);font-weight:650;
  text-decoration:none;border:1px solid var(--persimmon-deep);
  box-shadow:0 10px 22px rgba(226,78,27,.22);
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s;
  white-space:nowrap;
}
.btn:hover{background:var(--persimmon-deep);transform:translateY(-2px);box-shadow:0 16px 28px rgba(226,78,27,.28);color:var(--paper)}
.btn-sm{min-height:42px;padding:0 16px;font-size:.92rem}
.btn-lg{min-height:56px;padding:0 28px;font-size:1.05rem}
.btn.ghost{
  background:transparent;color:var(--forest);border:1.5px solid var(--forest);
  box-shadow:none;
}
.btn.ghost:hover{background:var(--forest);color:var(--paper)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* hero */
.hero{padding:36px 0 64px}
.hero-grid{display:grid;gap:40px}
.hero-copy .lead{margin-top:20px}
@media (min-width:1020px){
  .hero{padding:56px 0 96px}
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:64px;align-items:start}
  .hero-copy{padding-top:18px}
}

/* configurator */
.studio{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:24px;
  padding:18px 16px 16px;
  box-shadow:var(--shadow);
}
@media (min-width:600px){.studio{padding:22px 22px 20px}}
.studio-kicker{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--persimmon)}
.studio-title{font-size:1.55rem;margin:.2em 0 .35em}
.studio-lead{color:var(--ink-soft);font-size:.95rem;margin-bottom:14px}
.controls{display:grid;gap:12px;margin-bottom:16px}
.controls fieldset{border:0}
.controls legend{
  font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft);margin-bottom:7px;
}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{
  min-height:38px;padding:0 12px;border-radius:999px;cursor:pointer;
  background:transparent;border:1px solid var(--line);color:var(--forest);font-weight:550;font-size:.86rem;
  transition:background .18s, border-color .18s, color .18s;
}
.chip:hover{border-color:var(--forest)}
.chip.is-on{background:var(--forest);color:var(--paper);border-color:var(--forest)}
.swatches{display:flex;gap:10px;align-items:center;min-height:38px}
.swatch{
  width:34px;height:34px;border-radius:50%;cursor:pointer;padding:0;
  background:linear-gradient(135deg, var(--sw) 50%, var(--sw2) 50%);
  border:2px solid rgba(19,36,28,.18);
  box-shadow:inset 0 0 0 2px var(--paper);
  transition:transform .18s var(--ease), box-shadow .18s;
}
.swatch:hover{transform:scale(1.08)}
.swatch.is-on{box-shadow:inset 0 0 0 2px var(--paper), 0 0 0 2px var(--forest)}

/* mini browser */
.browser{
  border-radius:16px;overflow:hidden;
  border:1px solid rgba(19,36,28,.16);
  box-shadow:0 24px 44px rgba(15,36,27,.16);
  transform:perspective(1200px) rotateX(0) rotateY(0);
  transform-style:preserve-3d;
  background:#d7cfc2;
}
.chrome{
  display:flex;align-items:center;gap:7px;
  height:40px;padding:0 12px;
  background:linear-gradient(180deg, #efe8dc, #e3dacb);
  border-bottom:1px solid rgba(19,36,28,.1);
}
.dot{width:9px;height:9px;border-radius:50%;background:#c4b8a6}
.dot:nth-child(1){background:#E24E1B}
.dot:nth-child(2){background:#F07A2A}
.dot:nth-child(3){background:#C8E14A}
.url{
  flex:1;margin-left:8px;height:22px;border-radius:6px;
  background:rgba(251,247,241,.8);color:var(--ink-soft);
  font-size:11.5px;display:flex;align-items:center;padding:0 10px;
}

.preview{
  --bg:var(--forest);
  --fg:#F4EDE3;
  --muted:rgba(244,237,227,.72);
  --accent:var(--chartreuse);
  --panel:rgba(15,36,27,.35);
  --radius:16px;
  background:var(--bg);color:var(--fg);
  transition:background .5s var(--ease), color .5s var(--ease);
}
.preview.palette-grove{--bg:#1A3C2E;--fg:#F4EDE3;--muted:rgba(244,237,227,.72);--accent:#C8E14A;--panel:rgba(8,20,15,.35)}
.preview.palette-ember{--bg:#F3E6D4;--fg:#1A2A20;--muted:#4A5A50;--accent:#E24E1B;--panel:rgba(255,255,255,.55)}
.preview.palette-ink{--bg:#12231B;--fg:#F7F1E8;--muted:rgba(247,241,232,.7);--accent:#F07A2A;--panel:rgba(0,0,0,.35)}
.preview.palette-citrus{--bg:#E8F2A8;--fg:#13241C;--muted:#3A4E44;--accent:#E24E1B;--panel:rgba(255,255,255,.45)}
.preview.corners-soft{--radius:16px}
.preview.corners-sharp{--radius:3px}
.preview.corners-pill{--radius:28px}

.mini-bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 16px;font-size:12px;
}
.mini-bar strong{font-family:var(--h);font-size:1.05rem;font-weight:600;letter-spacing:-.02em}
.mini-bar nav{display:flex;gap:12px;color:var(--muted);font-weight:550}

.mini-hero{
  display:grid;gap:0;min-height:210px;
  transition:grid-template-columns .5s var(--ease), grid-template-rows .5s var(--ease);
}
.preview.layout-stack .mini-hero{grid-template-columns:1fr;grid-template-rows:130px auto}
.preview.layout-split .mini-hero{grid-template-columns:1.05fr 1fr;grid-template-rows:220px}
.preview.layout-banner .mini-hero{grid-template-columns:1fr;grid-template-rows:230px;position:relative}

.mini-art{
  position:relative;overflow:hidden;background:var(--panel);
  min-height:100%;
  transition:border-radius .4s var(--ease), background .5s;
}
.preview.layout-stack .mini-art{border-radius:0}
.preview.layout-split .mini-art{margin:0 0 0 14px;border-radius:var(--radius)}
.preview.layout-banner .mini-art{border-radius:0}

.mini-copy{padding:16px 18px 10px;display:flex;flex-direction:column;justify-content:center;gap:8px;z-index:1}
.preview.layout-banner .mini-copy{
  position:absolute;inset:auto 0 0 0;
  background:linear-gradient(transparent, color-mix(in srgb, var(--bg) 88%, black));
  padding:36px 18px 16px;
}
.mini-tag{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.mini-copy h3{font-size:1.35rem;color:inherit;max-width:14ch;transition:color .4s}
.mini-cta{
  align-self:flex-start;margin-top:4px;
  min-height:34px;padding:0 14px;border:0;cursor:default;
  background:var(--accent);color:var(--bg);
  font-weight:700;font-size:.82rem;
  border-radius:calc(var(--radius) * .6);
  transition:background .4s, color .4s, border-radius .4s;
}
.preview.palette-ember .mini-cta,
.preview.palette-citrus .mini-cta{color:#FBF7F1}

.mini-items{
  list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
  padding:12px 14px 16px;
}
.mini-items li{
  background:var(--panel);border-radius:calc(var(--radius) * .7);
  padding:10px 8px;text-align:center;font-size:12px;font-weight:600;
  transition:border-radius .4s, background .5s;
}

/* css art in the mini visual */
.mini-art .blob,.mini-art .plank{position:absolute;display:block;transition:all .5s var(--ease)}
.blob{border-radius:50%;background:var(--accent);opacity:.9}
.blob.a{width:88px;height:88px;left:18%;top:18%}
.blob.b{width:54px;height:54px;right:18%;top:28%;background:var(--fg);opacity:.22}
.blob.c{width:34px;height:34px;left:48%;bottom:18%;background:var(--fg);opacity:.35}
.plank{height:10px;border-radius:4px;background:var(--fg);opacity:.2}
.p1{width:58%;left:16%;top:58%}
.p2{width:44%;left:16%;top:70%}
.p3{width:32%;left:16%;top:82%}

.preview.biz-bakery .blob.a{border-radius:50% 50% 46% 46%;width:100px;height:72px;left:22%;top:30%}
.preview.biz-bakery .blob.b{width:70px;height:50px;border-radius:50%;right:14%;top:22%}
.preview.biz-bakery .blob.c{width:42px;height:42px;left:18%;top:16%}
.preview.biz-bakery .p1,.preview.biz-bakery .p2,.preview.biz-bakery .p3{opacity:0;transform:scaleX(0)}

.preview.biz-boutique .blob.a{width:70px;height:110px;border-radius:40px 40px 16px 16px;left:28%;top:14%}
.preview.biz-boutique .blob.b{width:52px;height:90px;border-radius:30px 30px 12px 12px;right:16%;top:24%;opacity:.35}
.preview.biz-boutique .blob.c{width:22px;height:22px;left:46%;top:10%;opacity:.7}
.preview.biz-boutique .plank{opacity:0}

.preview.biz-clinic .blob.a{width:96px;height:96px;left:28%;top:20%;opacity:.85}
.preview.biz-clinic .blob.b{width:62px;height:62px;right:18%;bottom:16%;opacity:.3}
.preview.biz-clinic .blob.c{width:18px;height:48px;left:47%;top:32%;border-radius:6px;opacity:.95}
.preview.biz-clinic .p1{width:48px;height:18px;left:38%;top:47%;opacity:.95;background:var(--accent);border-radius:6px}
.preview.biz-clinic .p2,.preview.biz-clinic .p3{opacity:0}

/* sections */
section{padding:72px 0}
@media (min-width:800px){section{padding:96px 0}}

.plans-sec{background:linear-gradient(180deg, transparent, rgba(232,223,209,.65) 12%, rgba(232,223,209,.65) 100%)}
.plans{display:grid;gap:16px}
@media (min-width:860px){.plans{grid-template-columns:repeat(3,1fr);align-items:stretch;gap:18px}}
.plan{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:22px;
  padding:26px 22px 28px;
  display:flex;flex-direction:column;gap:10px;
  box-shadow:0 10px 24px rgba(15,36,27,.05);
}
.plan-kicker{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--persimmon)}
.plan .price{
  font-family:var(--h);font-size:2rem;font-weight:600;letter-spacing:-.03em;
  color:var(--forest-deep);margin:4px 0 6px;
}
.plan .price span{background-image:linear-gradient(rgba(200,225,74,.85),rgba(200,225,74,.85));background-repeat:no-repeat;background-size:100% .28em;background-position:0 86%}
.plan p{color:var(--ink-soft);font-size:.98rem}
.plan ul{list-style:none;margin-top:10px;display:grid;gap:8px}
.plan li{
  position:relative;padding-left:18px;color:var(--forest);font-weight:550;font-size:.95rem;
}
.plan li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--chartreuse)}
.plan-featured{
  background:var(--forest);
  color:var(--bone);
  border-color:var(--forest-deep);
  box-shadow:0 22px 40px rgba(15,36,27,.22);
  transform:none;
}
.plan-featured h3,.plan-featured .price{color:var(--paper)}
.plan-featured p,.plan-featured li{color:rgba(244,237,227,.86)}
.plan-featured .plan-kicker{color:var(--chartreuse)}
.plan-featured li::before{background:var(--chartreuse)}
@media (min-width:860px){
  .plan-featured{transform:translateY(-10px);padding-top:34px;padding-bottom:36px}
}

/* examples */
.show-sec{background:var(--forest-deep);color:var(--bone);padding-top:88px;padding-bottom:96px}
.show-sec h2,.show-sec h3{color:var(--paper)}
.show-sec .kicker{color:var(--chartreuse)}
.show-sec .sec-lead{color:rgba(244,237,227,.78)}
.examples{display:grid;gap:16px}
@media (min-width:860px){.examples{grid-template-columns:repeat(2,1fr);gap:18px}}
.example{
  background:rgba(251,247,241,.06);
  border:1px solid rgba(244,237,227,.12);
  border-radius:22px;padding:22px;
  display:flex;flex-direction:column;gap:10px;
}
.example-kicker{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--chartreuse)}
.example > p:last-child{color:rgba(244,237,227,.72);font-size:.95rem;margin-top:4px}
.toy{margin:8px 0 6px;background:rgba(0,0,0,.22);border-radius:16px;padding:16px;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}

/* bag */
.toy-bag svg{width:120px;height:112px}
.bag-body,.bag-flap{fill:#1A3C2E;transition:fill .35s var(--ease)}
.bag-flap{filter:brightness(1.15)}
.bag-handle{stroke:#1A3C2E;transition:stroke .35s var(--ease)}
.toy-bag[data-color="forest"] .bag-body,.toy-bag[data-color="forest"] .bag-flap{fill:#1A3C2E}
.toy-bag[data-color="forest"] .bag-handle{stroke:#1A3C2E}
.toy-bag[data-color="persimmon"] .bag-body,.toy-bag[data-color="persimmon"] .bag-flap{fill:#E24E1B}
.toy-bag[data-color="persimmon"] .bag-handle{stroke:#C43D12}
.toy-bag[data-color="ink"] .bag-body,.toy-bag[data-color="ink"] .bag-flap{fill:#12231B}
.toy-bag[data-color="ink"] .bag-handle{stroke:#0a1610}
.toy-bag[data-color="chartreuse"] .bag-body,.toy-bag[data-color="chartreuse"] .bag-flap{fill:#C8E14A}
.toy-bag[data-color="chartreuse"] .bag-handle{stroke:#8aa31e}
.toy-swatches{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.toy-swatches button{
  min-height:32px;cursor:pointer;border:2px solid transparent;font-size:12px;font-weight:600;color:var(--paper);
}
.toy-bag .toy-swatches button{
  width:28px;height:28px;min-height:28px;border-radius:50%;padding:0;background:var(--c);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25), 0 0 0 1.5px rgba(244,237,227,.55);
}
.toy-bag .toy-swatches button.is-on{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25), 0 0 0 2px #F4EDE3}

/* room */
.floor{
  position:relative;width:100%;height:118px;
  border:2px solid rgba(244,237,227,.25);border-radius:8px;
  background:
    linear-gradient(rgba(244,237,227,.06) 1px, transparent 1px) 0 0/20px 20px,
    linear-gradient(90deg, rgba(244,237,227,.06) 1px, transparent 1px) 0 0/20px 20px,
    rgba(244,237,227,.04);
}
.furn{position:absolute;display:block;opacity:0;transform:scale(.7);transition:opacity .3s var(--ease), transform .3s var(--ease);pointer-events:none}
.furn.is-on{opacity:1;transform:scale(1)}
.furn.table{width:54px;height:32px;left:38%;top:40%;background:#C8E14A;border-radius:4px}
.furn.chair{width:22px;height:22px;left:22%;top:48%;background:#F4EDE3;border-radius:5px 5px 3px 3px}
.furn.plant{width:16px;height:28px;right:18%;bottom:14%;background:#7cae4a;border-radius:8px 8px 3px 3px}
.furn.lamp{width:12px;height:36px;left:14%;top:12%;background:#F07A2A;border-radius:6px 6px 2px 2px}
.toy-room .toy-swatches button{
  padding:0 10px;border-radius:999px;background:transparent;border:1px solid rgba(244,237,227,.25);
}
.toy-room .toy-swatches button.is-on{background:var(--chartreuse);color:var(--forest-deep);border-color:var(--chartreuse)}

/* soundboard */
.pads{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.pads button{
  min-height:48px;border-radius:10px;border:0;cursor:pointer;
  background:rgba(244,237,227,.1);color:var(--paper);font-weight:650;letter-spacing:.02em;
  transition:transform .15s var(--ease), background .15s;
}
.pads button:nth-child(1){background:#1A3C2E}
.pads button:nth-child(2){background:#E24E1B}
.pads button:nth-child(3){background:#C8E14A;color:var(--forest-deep)}
.pads button:nth-child(4){background:#F07A2A}
.pads button:nth-child(5){background:#3A5C4A}
.pads button:nth-child(6){background:#8aa31e;color:var(--forest-deep)}
.pads button:hover{filter:brightness(1.08)}
.pads button.is-hit{transform:scale(.94);filter:brightness(1.25)}

/* included */
.feats{display:grid;grid-template-columns:1fr 1fr;gap:10px;list-style:none}
@media (min-width:980px){.feats{grid-template-columns:repeat(4,1fr);gap:16px}}
.feats li{
  background:var(--paper);border:1px solid var(--line);border-radius:18px;
  padding:16px 14px 18px;display:flex;flex-direction:column;gap:8px;
}
.feats svg{width:32px;height:32px;color:var(--persimmon);margin-bottom:4px}
.feats strong{font-family:var(--h);font-size:1.12rem;font-weight:600;letter-spacing:-.02em;color:var(--forest-deep)}
.feats span{color:var(--ink-soft);font-size:.95rem}


/* managed services */
.managed-sec{background:linear-gradient(180deg, transparent, rgba(232,223,209,.6) 10%, rgba(232,223,209,.6) 100%)}
.managed-list{display:grid;grid-template-columns:1fr;gap:12px;list-style:none}
@media (min-width:620px){.managed-list{grid-template-columns:1fr 1fr;gap:14px}}
@media (min-width:980px){
  .managed-list{grid-template-columns:repeat(6,1fr);gap:16px}
  .managed-list li{grid-column:span 2}
  .managed-list li:nth-child(4){grid-column:2 / span 2}
  .managed-list li:nth-child(5){grid-column:4 / span 2}
}
.managed-list li{
  background:var(--paper);border:1px solid var(--line);border-radius:18px;
  padding:20px 18px 22px;display:flex;flex-direction:column;gap:8px;
}
.managed-list svg{width:32px;height:32px;color:var(--persimmon);margin-bottom:4px}
.managed-list strong{font-family:var(--h);font-size:1.12rem;font-weight:600;letter-spacing:-.02em;color:var(--forest-deep)}
.managed-list span{color:var(--ink-soft);font-size:.95rem}
.managed-social{
  margin:28px auto 0;max-width:38em;text-align:center;
  font-family:var(--h);font-size:clamp(1.2rem, 2.2vw, 1.55rem);font-weight:560;
  font-style:italic;font-variation-settings:"SOFT" 70, "WONK" 1;
  letter-spacing:-.02em;color:var(--forest-deep);line-height:1.25;
  text-wrap:pretty;
}
.managed-note{
  margin:12px auto 0;max-width:40em;text-align:center;
  color:var(--ink-soft);font-size:.92rem;line-height:1.5;text-wrap:pretty;
}

/* process */
.proc-sec{padding-top:80px}
.steps{list-style:none;display:grid;gap:16px;counter-reset:none}
@media (min-width:800px){.steps{grid-template-columns:repeat(3,1fr);gap:22px}}
.steps li{
  background:var(--paper);border:1px solid var(--line);border-radius:22px;
  padding:26px 22px 28px;
}
.num{
  display:block;font-family:var(--h);font-size:2.4rem;font-weight:600;
  color:var(--chartreuse);letter-spacing:-.04em;
  -webkit-text-stroke:1.5px var(--forest);
  paint-order:stroke fill;
  margin-bottom:8px;
}
.steps p{color:var(--ink-soft);margin-top:8px}

/* cta */
.cta-sec{
  padding:0 0 100px;
}
.cta-sec .wrap{
  background:var(--forest);
  color:var(--bone);
  border-radius:28px;
  padding:48px 24px;
  text-align:center;
  box-shadow:0 24px 48px rgba(15,36,27,.18);
}
.cta-sec .kicker{color:var(--chartreuse)}
.cta-sec h2{color:var(--paper)}
.cta-sec .sec-lead{color:rgba(244,237,227,.78);margin:16px auto 28px}
.cta-sec .btn{background:var(--chartreuse);color:var(--forest-deep);border-color:#a8c22e;box-shadow:0 10px 22px rgba(200,225,74,.25)}
.cta-sec .btn:hover{background:#d7ef63;color:var(--forest-deep)}
@media (min-width:700px){.cta-sec .wrap{padding:72px 48px}}

/* footer */
.foot{padding:10px 0 48px;color:var(--ink-soft);font-size:.92rem}
.foot-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-bottom:22px}
.foot .brand{margin-right:auto}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot nav a{color:var(--forest);text-decoration:none;font-weight:550}
.foot nav a:hover{color:var(--persimmon)}
.note{max-width:46em;margin-bottom:10px}
.copy{color:rgba(19,36,28,.5)}

/* motion */
.rise{animation:rise .8s var(--ease) both}
.rise-d{animation-delay:.12s}
.rise-d2{animation-delay:.22s}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rise,.rise-d,.rise-d2{animation:none}
  .btn,.chip,.swatch,.mini-art,.preview,.bag-body,.furn,.pads button{transition:none}
}

/* focus */
a:focus-visible,button:focus-visible{
  outline:3px solid var(--tangerine);
  outline-offset:3px;
}