/* ==========================================================================
   Sweet Pea Nursery — Plant Range hub + category pages (scoped .spn-cat-page)
   ========================================================================== */
/* NB: no overflow-x:clip here — this wrapper sits inside the theme's .col-full
   (max-width:1440), so clipping would crop the full-bleed .spn-banner at wide
   viewports. Page-level horizontal scroll is already prevented by body/.site. */
.spn-cat-page{font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--spn-ink)}
.spn-cat-page *{box-sizing:border-box}
.spn-cat-page img{max-width:100%;height:auto;display:block}
.spn-cat-page h1,.spn-cat-page h2,.spn-cat-page h3{font-family:var(--spn-head);letter-spacing:-.02em;color:var(--spn-green-dark);margin:0}
.spn-cp-container{max-width:1240px;margin:0 auto;padding:0 24px}

/* hero band — full-bleed even inside the theme's constrained content column */
.spn-cp-hero{background:
   radial-gradient(110% 120% at 90% -10%,rgba(106,166,54,.16),transparent 55%),
   linear-gradient(180deg,var(--spn-cream) 0%,#fff 100%);
   padding:54px 0 46px;border-bottom:1px solid var(--spn-line);
   margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.spn-cp-crumb{font-size:13.5px;color:var(--spn-muted);margin:0 0 14px}
.spn-cp-crumb a{color:var(--spn-green-mid);text-decoration:none}
.spn-cp-crumb a:hover{text-decoration:underline}
.spn-cp-hero h1{font-size:clamp(30px,4vw,48px);line-height:1.08}
.spn-cp-hero p{margin:14px 0 0;max-width:720px;color:var(--spn-muted);font-size:17px;line-height:1.6}
/* margin: pull up to balance the 56px section padding above, and add a clear gap
   below so the pill isn't glued to the first plant card. */
.spn-cp-note{display:inline-flex;align-items:center;gap:9px;margin:-12px 0 30px;background:#fff;border:1px solid var(--spn-line);
  border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:600;color:var(--spn-green-dark);box-shadow:var(--spn-shadow-sm)}
.spn-cp-note svg{width:17px;height:17px;color:var(--spn-green-mid)}

/* section wrap */
.spn-cp-sec{padding:56px 0 72px}

/* category cards (hub) — reuse home .spn-cat look */
.spn-cp-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.spn-cp-card{display:flex;background:#fff;border:1px solid var(--spn-line);border-radius:var(--spn-radius);overflow:hidden;
  text-decoration:none;color:inherit;transition:transform .22s ease,box-shadow .22s ease}
.spn-cp-card:hover{transform:translateY(-5px);box-shadow:var(--spn-shadow)}
.spn-cp-card__media{flex:0 0 42%;overflow:hidden}
.spn-cp-card__media img{width:100%;height:100%;object-fit:cover;min-height:190px;transition:transform .5s ease}
.spn-cp-card:hover .spn-cp-card__media img{transform:scale(1.06)}
.spn-cp-card__body{padding:28px 30px;display:flex;flex-direction:column}
.spn-cp-card__body h3{font-size:22px;line-height:1.14;margin:0 0 10px}
.spn-cp-card__body p{margin:0 0 20px;font-size:14.5px;color:var(--spn-muted);line-height:1.62;flex:1}
.spn-cp-card__link{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--spn-green-mid)}
.spn-cp-card__link svg{width:16px;height:16px;transition:transform .2s}
.spn-cp-card:hover .spn-cp-card__link svg{transform:translateX(4px)}
.spn-cp-card__count{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;font-size:11px;color:var(--spn-green-mid);
  font-weight:700;margin-bottom:14px;text-transform:uppercase;letter-spacing:.08em;background:var(--spn-soft);padding:5px 12px;border-radius:999px}
.spn-cp-card__count::before{content:"";width:12px;height:12px;flex:0 0 auto;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%235b9a2e' d='M11 20A7 7 0 0 1 4 13c0-5 4-9 16-9 0 9-4 13-9 13Z'/%3E%3C/svg%3E") center/contain no-repeat}

/* plant grid (category) */
.spn-plant-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.spn-plant{background:#fff;border:1px solid var(--spn-line);border-radius:var(--spn-radius);overflow:hidden;display:flex;
  flex-direction:column;scroll-margin-top:100px;transition:transform .22s ease,box-shadow .22s ease}
.spn-plant:hover{transform:translateY(-5px);box-shadow:var(--spn-shadow)}
.spn-plant__media{position:relative;overflow:hidden;aspect-ratio:4/3.2}
.spn-plant__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.spn-plant:hover .spn-plant__media img{transform:scale(1.06)}
.spn-plant__badge{position:absolute;top:13px;left:13px;background:linear-gradient(135deg,var(--spn-gold-soft),var(--spn-gold));
  color:#3a2d05;font-size:11px;font-weight:800;padding:5px 11px;border-radius:999px;display:inline-flex;align-items:center;gap:5px}
.spn-plant__badge svg{width:12px;height:12px}
.spn-plant__badge--ind{background:var(--spn-soft);color:var(--spn-green-dark)}
.spn-plant__body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.spn-plant__body h3{font-size:20px;margin:0 0 2px}
.spn-plant__bot{font-style:italic;color:var(--spn-green-mid);font-size:13.5px;margin:0 0 10px}
.spn-card-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}
.spn-card-sku{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--spn-muted);background:var(--spn-cream-2);border:1px solid var(--spn-line);padding:3px 9px;border-radius:999px}
.spn-plant__blurb{font-size:14px;color:var(--spn-muted);line-height:1.55;margin:0 0 16px}
.spn-plant__facts{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:7px;border-top:1px solid var(--spn-line);padding-top:14px}
.spn-plant__facts li{display:flex;gap:10px;font-size:13.5px;line-height:1.4}
.spn-plant__facts .k{flex:0 0 78px;color:var(--spn-muted);font-weight:600}
.spn-plant__facts .v{color:var(--spn-ink)}
.spn-plant__prices{margin:0 0 18px;border:1px solid var(--spn-line);border-radius:12px;overflow:hidden}
.spn-plant__prices .ph{display:flex;justify-content:space-between;align-items:center;background:var(--spn-soft);
  padding:8px 14px;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--spn-green-dark)}
.spn-plant__prices .pr{display:flex;justify-content:space-between;padding:9px 14px;font-size:14.5px;border-top:1px solid var(--spn-line)}
.spn-plant__prices .pr .sz{color:var(--spn-muted);font-weight:600}
.spn-plant__prices .pr .amt{color:var(--spn-ink);font-weight:700;font-variant-numeric:tabular-nums}
.spn-plant__cta{margin-top:auto}
.spn-plant__cta .spn-btn{width:100%}

/* hub CTA strip */
.spn-cp-cta{background:linear-gradient(160deg,#27521f,var(--spn-green-dark));color:#fff;border-radius:22px;
  padding:40px 44px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;margin-top:56px}
.spn-cp-cta h2{color:#fff;font-size:clamp(24px,2.6vw,32px);margin:0 0 6px}
.spn-cp-cta p{margin:0;color:rgba(255,255,255,.82);font-size:16px;max-width:520px}

/* ---- About / Contact shared (also use .spn-cat-page + .spn-cp-*) ----------*/
.spn-pg-split{display:grid;grid-template-columns:.92fr 1.08fr;gap:54px;align-items:center;margin-bottom:64px}
.spn-pg-split.rev{grid-template-columns:1.08fr .92fr}
.spn-pg-media{position:relative}
.spn-pg-media img{border-radius:22px;box-shadow:var(--spn-shadow);width:100%;aspect-ratio:1/1.02;object-fit:cover}
.spn-pg-media .spn-about__frame{position:absolute;inset:16px -16px -16px 16px;border:2px solid var(--spn-gold);border-radius:22px;z-index:-1}
.spn-pg-body h2{font-size:clamp(26px,3vw,38px);line-height:1.12;margin:0 0 16px}
.spn-pg-body p{color:var(--spn-muted);font-size:16.5px;line-height:1.7;margin:0 0 16px}
.spn-pg-body .lead{font-size:18px;color:#3c4a37}
.spn-pg-body .spn-checks{margin:22px 0 0}

.spn-values{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:8px 0 64px}
.spn-value{background:#fff;border:1px solid var(--spn-line);border-radius:16px;padding:26px 24px}
.spn-value__ic{width:50px;height:50px;border-radius:13px;background:var(--spn-soft);color:var(--spn-green);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.spn-value__ic svg{width:25px;height:25px}
.spn-value h3{font-size:18px;margin:0 0 8px}
.spn-value p{margin:0;color:var(--spn-muted);font-size:14.5px;line-height:1.6}

/* Contact */
.spn-contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:start;margin-bottom:60px}
.spn-contact-info{display:grid;gap:16px}
.spn-ci{display:flex;gap:15px;align-items:flex-start;background:#fff;border:1px solid var(--spn-line);border-radius:14px;padding:18px 20px}
.spn-ci__ic{flex:0 0 auto;width:46px;height:46px;border-radius:12px;background:var(--spn-soft);color:var(--spn-green);display:flex;align-items:center;justify-content:center}
.spn-ci__ic svg{width:22px;height:22px}
.spn-ci b{display:block;font-family:var(--spn-head);font-size:15px;color:var(--spn-green-dark);margin-bottom:3px}
.spn-ci a,.spn-ci span{color:var(--spn-muted);font-size:14.5px;line-height:1.5;text-decoration:none}
.spn-ci a:hover{color:var(--spn-green-mid)}
.spn-contact-form{background:#fff;border:1px solid var(--spn-line);border-radius:22px;box-shadow:var(--spn-shadow);overflow:hidden}
.spn-contact-note{display:flex;gap:13px;align-items:flex-start;margin-top:16px;padding:16px 20px;background:var(--spn-cream,#f6f3ea);border:1px solid var(--spn-line);border-left:3px solid var(--spn-gold,#d8a52a);border-radius:14px}
.spn-contact-note svg{width:20px;height:20px;color:var(--spn-gold,#d8a52a);flex:0 0 auto;margin-top:1px}
.spn-contact-note p{margin:0;font-size:14.5px;line-height:1.55;color:var(--spn-green-dark,#1f3d2b)}
.spn-contact-map{margin-top:16px;border-radius:16px;overflow:hidden;border:1px solid var(--spn-line);box-shadow:var(--spn-shadow-sm);line-height:0}
.spn-contact-map iframe{width:100%;height:300px;border:0;display:block;filter:saturate(.92)}
.spn-cform-head{padding:24px 24px 0}
.spn-cform-head h2{font-size:24px;margin:0 0 6px}
.spn-cform-head p{margin:0;color:var(--spn-muted);font-size:15px}
.spn-cform{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:22px 24px 24px;position:relative}
.spn-cform .full{grid-column:1/-1}
.spn-cform label{display:block;font-size:13px;font-weight:600;color:var(--spn-green-dark);margin-bottom:6px}
.spn-cform input,.spn-cform textarea{width:100%;font:inherit;font-size:15px;padding:12px 14px;border:1.5px solid var(--spn-line);border-radius:11px;background:#fbfcfa;color:var(--spn-ink)}
.spn-cform textarea{min-height:128px;resize:vertical}
.spn-cform input:focus,.spn-cform textarea:focus{outline:none;border-color:var(--spn-green-mid);background:#fff;box-shadow:0 0 0 3px rgba(91,154,46,.12)}
.spn-cform .err{border-color:#e07a6c;background:#fdf4f2}
.spn-cform .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.spn-cform-msg{grid-column:1/-1;font-size:13.5px;color:#c0392b;display:none}
.spn-cform-msg.show{display:block}
.spn-cform .spn-btn{justify-self:start}
.spn-cform-done{display:none;padding:40px 24px;text-align:center}
.spn-cform-done.show{display:block}
.spn-cform-done .tick{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--spn-green-bright),var(--spn-green));color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.spn-cform-done .tick svg{width:30px;height:30px}
.spn-cform-done b{display:block;font-family:var(--spn-head);font-size:20px;color:var(--spn-green-dark);margin-bottom:6px}
.spn-cform-done span{color:var(--spn-muted)}
@media(max-width:560px){.spn-cform{grid-template-columns:1fr}}

/* Legal / long-form + table of contents */
.spn-legal-layout{display:grid;grid-template-columns:270px 1fr;gap:48px;align-items:start}
.spn-legal-layout .spn-legal{max-width:none}
.spn-legal-toc{position:sticky;top:96px}
.spn-legal-toc__card{background:#fff;border:1px solid var(--spn-line);border-radius:16px;padding:20px;box-shadow:var(--spn-shadow-sm)}
.spn-rt{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--spn-green-dark);background:var(--spn-soft);padding:6px 12px;border-radius:999px;margin-bottom:16px}
.spn-rt svg{width:15px;height:15px;color:var(--spn-green-mid)}
.spn-legal-toc h3{font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:var(--spn-muted);margin:0 0 12px}
.spn-legal-toc ul{list-style:none;margin:0;padding:0;display:grid;gap:2px;max-height:62vh;overflow:auto}
.spn-legal-toc a{display:block;padding:6px 11px;border-radius:8px;font-size:13.5px;color:var(--spn-ink);text-decoration:none;line-height:1.35;border-left:2px solid transparent}
.spn-legal-toc a:hover{background:var(--spn-soft);color:var(--spn-green-dark)}
.spn-legal-toc a.active{background:var(--spn-soft);color:var(--spn-green-dark);border-left-color:var(--spn-green);font-weight:600}
.spn-legal h2{scroll-margin-top:96px}
@media(max-width:880px){.spn-legal-layout{grid-template-columns:1fr}.spn-legal-toc{position:static;margin-bottom:8px}.spn-legal-toc ul{max-height:none}}
.spn-legal{max-width:840px}
.spn-legal h2{font-size:24px;margin:34px 0 12px;color:var(--spn-green-dark)}
.spn-legal h3{font-size:18px;margin:24px 0 8px}
.spn-legal p,.spn-legal li{color:var(--spn-ink);font-size:15.5px;line-height:1.7}
.spn-legal ul{margin:0 0 16px;padding-left:22px}
.spn-legal li{margin-bottom:7px}
.spn-legal .spn-legal__meta{color:var(--spn-muted);font-size:14px;margin-bottom:8px}

@media(max-width:1080px){.spn-plant-grid{grid-template-columns:repeat(2,1fr)}.spn-values{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.spn-pg-split,.spn-pg-split.rev,.spn-contact-grid{grid-template-columns:1fr;gap:36px}.spn-pg-media{max-width:480px;margin:0 auto}}
@media(max-width:820px){.spn-cp-cats{grid-template-columns:1fr}.spn-cp-card{flex-direction:column}.spn-cp-card__media{flex-basis:auto}.spn-cp-card__media img{min-height:200px;aspect-ratio:16/9}.spn-values{grid-template-columns:1fr}}
@media(max-width:680px){.spn-plant-grid{grid-template-columns:1fr}.spn-cp-container{padding:0 18px}.spn-cp-cta{padding:30px 26px}}

/* ---- Single plant detail --------------------------------------------------*/
.spn-pd{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;margin-bottom:60px}
.spn-pd__media img{border-radius:20px;box-shadow:var(--spn-shadow);width:100%;aspect-ratio:4/3.4;object-fit:cover;position:sticky;top:100px}
.spn-pd__blurb{font-size:18px;line-height:1.62;color:#3c4a37;margin:0 0 4px}
.spn-pd__care{display:flex;gap:11px;align-items:flex-start;background:var(--spn-soft);border-radius:12px;padding:14px 16px;margin:20px 0 24px;font-size:14.5px;color:var(--spn-green-dark);line-height:1.5}
.spn-pd__care svg{width:18px;height:18px;flex:0 0 auto;color:var(--spn-green);margin-top:2px}
.spn-pd__cta{display:flex;gap:12px;flex-wrap:wrap}
.spn-pd .spn-plant__facts{margin-top:22px}
.spn-pd .spn-plant__prices{margin-top:22px}
.spn-rel h2{font-size:clamp(22px,2.4vw,28px);margin:0 0 24px;text-align:center}
.spn-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:8px}
.spn-rel-card{display:block;background:#fff;border:1px solid var(--spn-line);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}
.spn-rel-card:hover{transform:translateY(-4px);box-shadow:var(--spn-shadow)}
.spn-rel-card img{aspect-ratio:4/3;object-fit:cover;width:100%}
.spn-rel-card .b{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px;font-family:var(--spn-head);font-size:16px;color:var(--spn-green-dark)}
.spn-rel-card .b svg{width:16px;height:16px;color:var(--spn-green-mid)}
@media(max-width:900px){.spn-pd{grid-template-columns:1fr;gap:26px}.spn-pd__media img{position:static;aspect-ratio:16/10}.spn-rel-grid{grid-template-columns:1fr}}

/* ---- Plant page: sidebar layout ------------------------------------------*/
.spn-pd-layout{display:grid;grid-template-columns:340px 1fr;gap:42px;align-items:start;margin-bottom:24px}
.spn-pd-aside{display:flex;flex-direction:column;gap:20px;position:sticky;top:96px}
.spn-aside-card{background:#fff;border:1px solid var(--spn-line);border-radius:16px;padding:20px;box-shadow:var(--spn-shadow-sm)}
.spn-aside-card>h3{font-size:16px;margin:0 0 14px;color:var(--spn-green-dark);display:flex;align-items:center;gap:8px}
.spn-aside-card>h3 svg{width:18px;height:18px;color:var(--spn-green-mid)}
.spn-aside-quote{background:linear-gradient(180deg,var(--spn-soft),#fff 62%);border-color:#d8e6c4}
.spn-aside-quote .for{margin:-8px 0 14px;font-size:13px;color:var(--spn-muted)}
.spn-qf{display:grid;gap:10px;position:relative}
.spn-qf label{font-size:12px;font-weight:600;color:var(--spn-green-dark)}
.spn-qf input,.spn-qf select,.spn-qf textarea{font:inherit;font-size:14px;width:100%;padding:10px 12px;border:1.5px solid var(--spn-line);border-radius:10px;background:#fff;color:var(--spn-ink)}
.spn-qf textarea{min-height:72px;resize:vertical}
.spn-qf input:focus,.spn-qf select:focus,.spn-qf textarea:focus{outline:none;border-color:var(--spn-green-mid);box-shadow:0 0 0 3px rgba(91,154,46,.12)}
.spn-qf .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.spn-qf .err{border-color:#e07a6c;background:#fdf4f2}
.spn-qf .spn-btn{width:100%;margin-top:2px}
.spn-qf-msg{font-size:13px;color:#c0392b;display:none;margin:2px 0 0}
.spn-qf-msg.show{display:block}
.spn-aside-done{display:none;text-align:center;padding:14px 4px}
.spn-aside-done.show{display:block}
.spn-aside-done .tick{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,var(--spn-green-bright),var(--spn-green));color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.spn-aside-done .tick svg{width:26px;height:26px}
.spn-aside-done b{display:block;color:var(--spn-green-dark);font-family:var(--spn-head);font-size:17px;margin-bottom:5px}
.spn-aside-done span{font-size:14px;color:var(--spn-muted)}
.spn-aside-menu{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.spn-aside-menu a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-radius:9px;text-decoration:none;color:var(--spn-ink);font-size:14px;font-weight:500;transition:background .15s,color .15s}
.spn-aside-menu a:hover{background:var(--spn-soft);color:var(--spn-green-dark)}
.spn-aside-menu a.is-current{background:var(--spn-green);color:#fff}
.spn-aside-menu a svg{width:14px;height:14px;opacity:.55}
.spn-pd-main .spn-pd__media img{position:static}
.spn-share{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:26px 0 0;padding-top:22px;border-top:1px solid var(--spn-line)}
.spn-share b{font-size:13.5px;color:var(--spn-muted);font-weight:700}
.spn-share a{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--spn-soft);color:var(--spn-green-dark);transition:transform .18s,background .18s,color .18s}
.spn-share a:hover{background:var(--spn-green);color:#fff;transform:translateY(-2px)}
.spn-share a svg{width:18px;height:18px}
@media(max-width:900px){.spn-pd-layout{grid-template-columns:1fr;gap:28px}.spn-pd-aside{position:static;order:2}.spn-pd-main{order:1}}

/* ---- Plant gallery (main + thumbnails) -----------------------------------*/
.spn-gallery__main{position:relative;border-radius:20px;overflow:hidden;box-shadow:var(--spn-shadow)}
.spn-gallery__main img{width:100%;aspect-ratio:4/3.4;object-fit:cover;display:block}
.spn-gallery__thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.spn-gthumb{width:74px;height:62px;border-radius:10px;overflow:hidden;border:2px solid var(--spn-line);background:none;padding:0;cursor:pointer;transition:border-color .15s}
.spn-gthumb img{width:100%;height:100%;object-fit:cover;display:block}
.spn-gthumb.is-active,.spn-gthumb:hover{border-color:var(--spn-green-mid)}
.spn-pd-code{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;letter-spacing:.04em;
  color:var(--spn-muted);background:var(--spn-cream-2);border:1px solid var(--spn-line);padding:5px 13px;border-radius:999px;margin:0 0 14px;white-space:nowrap}
.spn-pd-code svg{width:14px;height:14px;flex:0 0 auto;color:var(--spn-green-mid)}
.spn-pd-code strong{color:var(--spn-green-dark)}
/* FAQ section block */
/* Browse-all mini cards (Plant Range hub filter) */
.spn-allplants{margin:18px 0 8px}
.spn-allplants-head{text-align:center;margin:0 0 22px}
.spn-allplants-head h2{font-size:clamp(24px,3vw,34px)}
.spn-allplants-head p{color:var(--spn-muted);margin:8px 0 0}
.spn-mini-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.spn-mini-card{background:#fff;border:1px solid var(--spn-line);border-radius:var(--spn-radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.spn-mini-card:hover{transform:translateY(-5px);box-shadow:var(--spn-shadow)}
.spn-mini-card__media{position:relative;overflow:hidden;aspect-ratio:4/3.1}
.spn-mini-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.spn-mini-card:hover .spn-mini-card__media img{transform:scale(1.06)}
.spn-mini-card__body{padding:15px 16px 16px;display:flex;flex-direction:column;flex:1}
.spn-mini-card__body h3{font-size:16px;margin:0 0 2px;line-height:1.25}
.spn-mini-card__body h3 a{color:var(--spn-green-dark);text-decoration:none}
.spn-mini-bot{font-style:italic;color:var(--spn-green-mid);font-size:12.5px;margin:0 0 10px}
.spn-mini-card .spn-card-meta{margin:0 0 12px}
.spn-mini-cta{display:flex;gap:8px;margin-top:auto}
.spn-mini-cta .spn-btn{flex:1;padding:10px 10px;font-size:13px}
@media(max-width:1080px){.spn-mini-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.spn-mini-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.spn-mini-grid{grid-template-columns:1fr}}

.spn-faq-sec{margin-top:8px}
.spn-faq-sec .spn-sec-head{text-align:center;margin:0 0 30px}
.spn-faq-sec .spn-sec-head h2{font-size:clamp(24px,3vw,34px);color:var(--spn-green-dark)}
.spn-faq-sec .spn-sec-head p{color:var(--spn-muted);margin:10px 0 0}

/* ---- Compare page table --------------------------------------------------*/
.spn-cmp-wrap{overflow-x:auto;border:1px solid var(--spn-line);border-radius:16px;background:#fff;box-shadow:var(--spn-shadow-sm);-webkit-overflow-scrolling:touch}
.spn-cmp-table{width:100%;border-collapse:collapse;font-size:14px;min-width:1280px}
/* Override the parent theme's `word-break:break-all` on cells, which was snapping
   words mid-character ("Screen ing he dge"). Break only at word boundaries. */
.spn-cmp-table th,.spn-cmp-table td{word-break:normal;overflow-wrap:break-word;hyphens:none}
/* Give the prose columns (Position, Best for) room so they wrap cleanly. */
.spn-cmp-table td:nth-child(5),.spn-cmp-table td:nth-child(6),
.spn-cmp-table th:nth-child(5),.spn-cmp-table th:nth-child(6){min-width:130px}
.spn-cmp-table .spn-compare-check{white-space:nowrap}
.spn-cmp-table td:nth-child(3){white-space:nowrap}
.spn-cmp-table th{background:var(--spn-soft);color:var(--spn-green-dark);font-family:var(--spn-head);font-size:13px;text-align:left;padding:14px 16px;white-space:nowrap;position:sticky;top:0;z-index:2}
.spn-cmp-table td{padding:14px 16px;border-top:1px solid var(--spn-line);vertical-align:middle;color:var(--spn-ink)}
.spn-cmp-table tbody tr:hover{background:#fafcf7}
.spn-cmp-plant{display:flex;align-items:center;gap:12px;min-width:240px}
.spn-cmp-plant img{width:54px;height:54px;border-radius:9px;object-fit:cover;flex:0 0 auto}
.spn-cmp-plant span{display:flex;flex-direction:column;line-height:1.3}
.spn-cmp-plant a{font-family:var(--spn-head);font-size:15px;color:var(--spn-green-dark);text-decoration:none}
.spn-cmp-plant a:hover{color:var(--spn-green-mid)}
.spn-cmp-plant em{font-size:12px;color:var(--spn-green-mid)}
.spn-cmp-plant .sku{font-size:10.5px;font-weight:700;color:var(--spn-muted);letter-spacing:.04em;margin-top:2px}
.spn-cmp-ind .yes{display:inline-flex;align-items:center;gap:5px;color:var(--spn-green);font-weight:700;white-space:nowrap}
.spn-cmp-ind .yes svg{width:15px;height:15px}
.spn-cmp-act{white-space:nowrap}
.spn-cmp-act .spn-btn{padding:8px 13px;font-size:12.5px;margin-right:6px}

/* ---- Leaf accent before product names ------------------------------------*/
.spn-plant__body h3 a::before,.spn-mini-card__body h3 a::before{content:"";display:inline-block;width:13px;height:13px;margin-right:7px;vertical-align:-1px;opacity:.8;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%235b9a2e' d='M11 20A7 7 0 0 1 4 13c0-5 4-9 16-9 0 9-4 13-9 13Z'/%3E%3C/svg%3E") center/contain no-repeat}