:root{
  --sp-green:#A2C617;
  --sp-green-dark:#829f11;
  --sp-green-soft:#EDF5D2;
  --sp-black:#0D0F0E;
  --sp-grey:#ECECE8;
  --sp-grey-2:#F6F6F2;
  --sp-line:#D8D8D1;
  --font-display:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --font-body:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --color-background:var(--sp-grey);
  --color-surface:#F7F7F4;
  --color-surface-2:#EFEFEA;
  --color-text:var(--sp-black);
  --color-muted:#5F625B;
  --color-border:var(--sp-line);
  --color-accent:var(--sp-green);
  --color-accent-hover:var(--sp-green-dark);
  --color-accent-contrast:#0D0F0E;
  --color-accent-soft:var(--sp-green-soft);
  --radius-small:8px;
  --radius-card:16px;
  --shadow-card:none;
  --maxw:1240px;
}
body{background:var(--color-background);color:var(--color-text);}
a{color:var(--color-text)}
a:hover{text-decoration:none}
.btn{border-radius:4px;border-color:var(--sp-green);background:var(--sp-green);color:var(--sp-black);font-weight:700;box-shadow:none}
.btn:hover{background:var(--sp-green-dark);border-color:var(--sp-green-dark);color:#fff}
.btn--ghost{background:transparent;color:var(--sp-black);border-color:var(--sp-black)}
.btn--ghost:hover{background:var(--sp-black);border-color:var(--sp-black);color:#fff}
.btn--muted{background:#fff;border-color:var(--color-border);color:var(--sp-black)}
.btn--muted:hover{background:var(--color-surface-2)}
.site-header{background:rgba(247,247,244,.95);backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid var(--color-border)}
.site-header .container{min-height:74px}
.brand{position:relative;display:inline-flex;flex-direction:column;gap:0;font-size:1.05rem;letter-spacing:-.02em;line-height:1;font-weight:800;text-transform:none;color:var(--sp-black)}
.brand span{color:inherit}
.brand::after{content:'by spumajo';font-size:.56rem;font-weight:700;letter-spacing:.03em;color:var(--color-muted);margin-top:3px}
.nav a{font-size:.95rem;font-weight:600;color:var(--sp-black);opacity:.84}
.nav a:hover,.nav a[aria-current="page"]{opacity:1}
.nav .btn,.nav a.btn{margin-left:.35rem}
.hero{background:linear-gradient(180deg,#F7F7F4 0%, #F3F3EE 100%);border-bottom:1px solid var(--color-border)}
.hero .container{padding-top:clamp(3rem,8vw,5.2rem);padding-bottom:clamp(2.6rem,6vw,4.2rem)}
.km-home-hero{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:2.4rem;align-items:center}
.km-home-kicker,.km-page-kicker{display:flex;align-items:center;gap:.7rem;margin:0 0 1rem;font-size:.82rem;font-weight:750;letter-spacing:.16em;text-transform:uppercase;color:var(--color-muted)}
.km-home-kicker::before,.km-page-kicker::before{content:'';display:inline-block;width:34px;height:4px;background:var(--sp-green)}
.hero h1{font-size:clamp(2.8rem,6vw,4.35rem);line-height:1.02;letter-spacing:-.04em;max-width:11ch;margin-bottom:1rem}
.hero p.lead{font-size:clamp(1.12rem,2.2vw,1.35rem);line-height:1.55;color:#4f554d;max-width:40ch;margin-bottom:1.2rem}
.hero-actions{margin-top:1rem}
.hero-secondary{display:flex;gap:1.5rem;row-gap:.4rem;margin-top:.9rem;font-size:.98rem}
.hero-secondary a{font-weight:700;color:#155c72}
.hero-visual{position:relative;min-height:380px;border:1px solid var(--color-border);border-radius:20px;overflow:hidden;background:#E9ECE4}
.hero-visual::after{content:'';position:absolute;inset:auto 18px 18px auto;width:120px;height:120px;border-radius:50%;background:rgba(162,198,23,.22);filter:blur(4px)}
.hero-visual img{display:block;width:100%;height:100%;object-fit:cover}
.hero-visual-badge{position:absolute;left:18px;top:18px;display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .7rem;border-radius:999px;background:rgba(247,247,244,.95);border:1px solid rgba(13,15,14,.08);font-size:.82rem;font-weight:700;color:var(--sp-black)}
.searchbar{position:relative;z-index:2;background:#fff;border:1px solid rgba(13,15,14,.08);border-radius:18px;box-shadow:0 10px 30px rgba(13,15,14,.06);padding:1.15rem 1.2rem 1.05rem;margin-top:2rem}
.searchbar .grid{gap:.8rem;align-items:end}
.searchbar .field label,.field label{font-size:.82rem;font-weight:700;letter-spacing:.02em;color:var(--color-muted)}
.searchbar input,.searchbar select,.filters input[type="text"],.filters select,.field input,.field select,.field textarea{border-radius:10px;border:1px solid #d6d6cf;background:#fff;min-height:48px}
.section{padding:4.5rem 0}
.section > .container > h2{font-size:clamp(2rem,4vw,2.8rem);letter-spacing:-.03em}
.section > .container > p.muted{font-size:1.03rem;color:#5b6059}
.grid-cards{gap:1rem}
.card{padding:0;border-radius:18px;border:1px solid rgba(13,15,14,.08);overflow:hidden;background:#F8F8F5}
.card > *{padding-left:1.1rem;padding-right:1.1rem}
.card > div:first-child{padding-top:1rem}
.card h3{font-size:1.18rem;letter-spacing:-.02em}
.card .chips{margin-top:0}
.card .card-foot{padding-bottom:1rem;background:#fff;border-top:1px solid var(--color-border);margin-top:0.6rem}
.badge{border-radius:999px;padding:.28rem .6rem;font-weight:700}
.chip-tag{background:#ECEDE8;color:#4b5049;border-radius:999px;padding:.26rem .54rem}
.price-line{font-size:1rem;letter-spacing:-.01em}
.teasers{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.teaser{position:relative;padding:1.25rem 1.15rem 1.15rem;border-radius:0;background:#F8F8F5;border:1px solid var(--color-border);border-top:3px solid var(--sp-black)}
.teaser::before{content:'';display:block;width:36px;height:4px;background:var(--sp-green);margin-bottom:1rem}
.teaser[data-icon] .teaser-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--sp-green-soft);color:var(--sp-black);margin-bottom:.75rem}
.teaser h3{font-size:1.45rem;letter-spacing:-.03em}
.teaser p{margin:0;color:#535851}
.site-footer{background:#F7F7F4;border-top:1px solid var(--color-border);margin-top:4rem}
.site-footer h4{font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;color:var(--color-muted);margin-bottom:.95rem}
.site-footer a{margin-bottom:.55rem;color:var(--sp-black)}
.footer-legal{padding-top:1rem;padding-bottom:1rem}
.footer-legal p{font-size:.8rem;color:var(--color-muted)}
.filters,.detail-side,.teaser,.searchbar,.card,.compare-table,.callout,.placeholder-embed{box-shadow:none}
.filters,.detail-side,.compare-table,.teaser,.card,.callout,.searchbar,.placeholder-embed{border-color:rgba(13,15,14,.08)}
.callout{background:#fff;border-left:4px solid var(--sp-green)}
.km-privacy{width:42px;height:42px;background:#fff;color:var(--sp-black)}
.km-privacy:hover{background:var(--sp-green-soft)}
.km-float-cta{position:fixed;right:0;top:46%;z-index:63;display:flex;align-items:center;gap:.35rem;padding:14px 12px;border:0;background:var(--sp-green);color:var(--sp-black);box-shadow:0 12px 28px rgba(0,0,0,.16);writing-mode:vertical-rl;transform:rotate(180deg);font:700 .82rem var(--font-body);text-decoration:none}
.km-float-cta:hover{background:var(--sp-green-dark);color:#fff;text-decoration:none}
.km-icon-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.5rem}
.km-icon-item{border:1px solid var(--color-border);background:#F8F8F5;padding:1.2rem;border-top:3px solid var(--sp-black)}
.km-icon-item .icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--sp-green-soft);margin-bottom:.8rem}
.km-icon-item h3{font-size:1.1rem;margin:0 0 .45rem}
.km-icon-item p{margin:0;color:var(--color-muted);font-size:.95rem}
/* page headings */
main > .section:first-of-type h1, .detail-main h1{font-size:clamp(2.2rem,4.8vw,3.6rem);letter-spacing:-.035em}
/* logo color fix only */
.brand span{color:inherit!important}
@media(max-width:1100px){.km-home-hero{grid-template-columns:1fr}.hero h1{max-width:12ch}.hero-visual{min-height:260px;order:-1}}
@media(max-width:900px){.teasers,.km-icon-list{grid-template-columns:1fr}.km-float-cta{display:none}}
@media(max-width:760px){.site-header .container{min-height:68px}.hero .container{padding-top:2.4rem}.hero h1{font-size:clamp(2.25rem,10vw,3rem)}.searchbar{padding:1rem}.hero-secondary{flex-direction:column;gap:.25rem}.nav.open{background:#F7F7F4;padding:1rem 1.25rem}.brand::after{margin-top:2px}}