:root{
    --paper:#F3F1E3;
    --paper-deep:#EAE6D3;
    --ink:#1D2B1F;
    --ink-soft:#3E4A3D;
    --sage:#4B6C4F;
    --sage-tint:#E4EADB;
    --gold:#B8862E;
    --gold-deep:#8F6720;
    --clay:#8B3A2B;
    --white:#FFFDF8;
    --line:#D9D3BC;
    --radius:14px;
    --shadow: 0 4px 20px rgba(29,43,31,0.08);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.serif{font-family:'Source Serif 4',serif;}
  h1,h2,h3{color:var(--ink);margin:0 0 .4em;font-weight:600;}
  a{color:inherit;}
  img{max-width:100%;display:block;}
  .mono{font-family:'IBM Plex Mono',monospace;}
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:.72rem;
    font-weight:600;
    color:var(--sage);
  }
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
  :focus-visible{outline:3px solid var(--gold);outline-offset:2px;}

  /* Botanical divider - signature element */
  .sprig{display:block;margin:0 auto;opacity:.55;}
  .sprig path{fill:none;stroke:var(--sage);stroke-width:1.4;stroke-linecap:round;}
  .divider{display:flex;align-items:center;gap:14px;margin:0 auto;max-width:220px;padding:36px 0;}
  .divider .l{height:1px;flex:1;background:var(--line);}

  /* Trust ribbon */
  .ribbon{background:var(--ink);color:var(--paper);font-size:.82rem;}
  .ribbon .wrap{display:flex;justify-content:space-between;align-items:center;padding:8px 24px;flex-wrap:wrap;gap:6px;}
  .ribbon ul{list-style:none;display:flex;gap:22px;margin:0;padding:0;flex-wrap:wrap;}
  .ribbon a.tel{color:var(--gold);font-weight:600;text-decoration:none;}

  /* Nav */
  header.site{position:sticky;top:0;z-index:50;background:rgba(243,241,227,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);}
  nav.wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;gap:20px;}
  .brand{display:flex;align-items:center;gap:10px;font-family:'Source Serif 4',serif;font-weight:600;font-size:1.3rem;text-decoration:none;}
  .brand img{height:34px;width:auto;}
  nav.links{display:flex;gap:26px;list-style:none;margin:0;padding:0;font-size:.92rem;font-weight:500;}
  nav.links a{text-decoration:none;}
  nav.links a:hover{color:var(--sage);}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--gold);color:var(--white);
    padding:11px 22px;border-radius:999px;
    font-weight:600;font-size:.92rem;text-decoration:none;
    border:none;cursor:pointer;transition:background .15s ease, transform .15s ease;
  }
  .btn:hover{background:var(--gold-deep);transform:translateY(-1px);}
  .btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink);}
  .btn.ghost:hover{background:var(--ink);color:var(--paper);}
  .btn.small{padding:8px 16px;font-size:.82rem;}
  .navToggle{display:none;background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--ink);}

  /* Hero */
  .hero{padding:64px 0 40px;}
  .hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
  .hero h1{font-size:clamp(2.1rem,4vw,3.1rem);line-height:1.12;margin:14px 0 18px;}
  .hero p.lead{font-size:1.08rem;color:var(--ink-soft);max-width:46ch;margin:0 0 26px;}
  .heroActions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px;}
  .statRow{display:flex;gap:36px;flex-wrap:wrap;}
  .stat b{display:block;font-family:'Source Serif 4',serif;font-size:1.5rem;}
  .stat span{font-size:.8rem;color:var(--ink-soft);}
  .heroArt{position:relative;}
  .heroArt .frame{
    background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
    padding:22px;border:1px solid var(--line);
  }
  .heroArt img{border-radius:8px;}
  .heroArt .badge{
    position:absolute;top:-16px;right:-16px;background:var(--sage);color:var(--white);
    border-radius:999px;padding:10px 16px;font-family:'IBM Plex Mono',monospace;font-size:.72rem;
    box-shadow:var(--shadow);text-align:center;line-height:1.3;
  }

  /* Category pills */
  .categories{padding:10px 0 50px;}
  .catGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .catCard{
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    padding:22px 18px;text-decoration:none;color:var(--ink);transition:transform .15s ease, box-shadow .15s ease;
  }
  .catCard:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
  .catCard .icon{width:34px;height:34px;margin-bottom:12px;}
  .catCard h3{font-size:1.02rem;margin-bottom:4px;}
  .catCard p{margin:0;font-size:.85rem;color:var(--ink-soft);}

  /* Section shell */
  section{padding:54px 0;}
  .sectionHead{text-align:center;max-width:640px;margin:0 auto 40px;}
  .sectionHead h2{font-size:clamp(1.6rem,3vw,2.1rem);}
  .sectionHead p{color:var(--ink-soft);margin:0;}

  /* Featured */
  .featureGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  .featureCard{
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;
  }
  .featureCard .imgWrap{aspect-ratio:4/3;background:var(--sage-tint);display:flex;align-items:center;justify-content:center;overflow:hidden;}
  .featureCard .imgWrap img{width:100%;height:100%;object-fit:cover;}
  .featureCard .body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1;}
  .featureCard h3{font-size:1.15rem;margin:0;}
  .featureCard p.desc{font-size:.9rem;color:var(--ink-soft);margin:0 0 6px;flex:1;}
  .priceRow{display:flex;align-items:center;justify-content:space-between;margin-top:4px;}
  .price{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:1.05rem;color:var(--clay);}
  .featureCard .actions{display:flex;gap:10px;margin-top:12px;}

  /* Catalog by category */
  .catalogSection{background:var(--paper-deep);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .catBlock{margin-bottom:42px;}
  .catBlock:last-child{margin-bottom:0;}
  .catBlockHead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:18px;flex-wrap:wrap;gap:8px;}
  .catBlockHead h3{font-size:1.3rem;margin:0;}
  .productGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .prodCard{
    background:var(--white);border:1px solid var(--line);border-radius:12px;padding:18px;
    display:flex;flex-direction:column;gap:8px;
  }
  .prodCard .thumb{aspect-ratio:1/1;border-radius:8px;background:linear-gradient(160deg,var(--sage-tint),var(--paper-deep));
    display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:6px;}
  .prodCard .thumb img{width:100%;height:100%;object-fit:cover;}
  .prodCard .thumb .mono{color:var(--sage);font-size:1.6rem;font-weight:600;}
  .prodCard h4{margin:0;font-size:1rem;font-family:'Source Serif 4',serif;font-weight:600;}
  .prodCard p{margin:0;font-size:.82rem;color:var(--ink-soft);flex:1;}
  .prodCard .priceRow{margin-top:2px;}
  .prodCard .price{font-size:.95rem;}

  /* Trust / guarantee */
  .trustGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
  .trustCard{text-align:center;padding:10px;}
  .trustCard .icon{width:38px;height:38px;margin:0 auto 14px;}
  .trustCard h3{font-size:1rem;margin-bottom:6px;}
  .trustCard p{font-size:.85rem;color:var(--ink-soft);margin:0;}

  /* Pets */
  .petBanner{
    background:var(--sage);color:var(--white);border-radius:20px;padding:44px;
    display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center;
  }
  .petBanner h2{color:var(--white);}
  .petBanner p{color:#DCE7DA;}
  .petBanner ul{margin:16px 0 26px;padding-left:18px;color:#EAF1E8;font-size:.92rem;line-height:1.7;}
  .petBanner .btn{background:var(--white);color:var(--sage);}
  .petBanner .btn:hover{background:var(--paper);}
  .petArt{background:rgba(255,255,255,.12);border-radius:14px;padding:26px;text-align:center;}

  /* FAQ */
  .faqList{max-width:820px;margin:0 auto;}
  details{
    background:var(--white);border:1px solid var(--line);border-radius:12px;
    padding:18px 20px;margin-bottom:12px;
  }
  summary{cursor:pointer;font-weight:600;font-size:1rem;list-style:none;display:flex;justify-content:space-between;align-items:center;}
  summary::-webkit-details-marker{display:none;}
  summary::after{content:'+';font-size:1.4rem;color:var(--gold);font-weight:400;}
  details[open] summary::after{content:'–';}
  details p{margin:12px 0 0;color:var(--ink-soft);font-size:.92rem;}

  /* CTA banner */
  .ctaBanner{
    background:var(--ink);color:var(--paper);border-radius:20px;padding:50px;text-align:center;
  }
  .ctaBanner h2{color:var(--white);}
  .ctaBanner p{color:#C9C6B4;max-width:52ch;margin:0 auto 26px;}

  /* Footer */
  footer{background:var(--ink);color:#C9C6B4;padding:56px 0 26px;font-size:.88rem;}
  .footGrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:36px;}
  footer h4{color:var(--paper);font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 14px;}
  footer ul{list-style:none;margin:0;padding:0;}
  footer li{margin-bottom:9px;}
  footer a{text-decoration:none;color:#C9C6B4;}
  footer a:hover{color:var(--gold);}
  .footBottom{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.78rem;color:#8B8A78;}
  .disclaimer{max-width:900px;margin:0 auto 20px;font-size:.76rem;color:#8B8A78;text-align:center;line-height:1.6;}

  @media(max-width:900px){
    nav.links, .ribbon ul{display:none;}
    .navToggle{display:block;}
    .hero .wrap{grid-template-columns:1fr;}
    .heroArt{order:-1;}
    .catGrid, .featureGrid, .productGrid, .trustGrid{grid-template-columns:repeat(2,1fr);}
    .petBanner{grid-template-columns:1fr;}
    .footGrid{grid-template-columns:1fr 1fr;}
  }
  @media(max-width:520px){
    .catGrid, .featureGrid, .productGrid, .trustGrid{grid-template-columns:1fr;}
    .footGrid{grid-template-columns:1fr;}
    .statRow{gap:24px;}
  }
/* ---------- Inner page components ---------- */
.breadcrumb{font-size:.8rem;color:var(--ink-soft);padding:18px 0 0;}
.breadcrumb a{color:var(--sage);text-decoration:none;}
.breadcrumb a:hover{text-decoration:underline;}

.productHero{padding:28px 0 20px;}
.productHero .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:flex-start;}
.productHero .imgWrap{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);}
.productHero .imgWrap img{border-radius:8px;width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--sage-tint);}
.productHero .imgWrap .placeholder{aspect-ratio:1/1;border-radius:8px;background:linear-gradient(160deg,var(--sage-tint),var(--paper-deep));display:flex;align-items:center;justify-content:center;}
.productHero .placeholder .mono{font-size:2.8rem;color:var(--sage);font-weight:600;}
.productHero h1{font-size:clamp(1.8rem,3.4vw,2.5rem);margin:10px 0 12px;}
.productHero .lead{color:var(--ink-soft);max-width:56ch;margin:0 0 20px;}
.priceBlock{display:flex;align-items:center;gap:18px;margin-bottom:22px;flex-wrap:wrap;}
.priceBlock .price{font-size:1.6rem;}
.benefitList{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px;}
.benefitList li{display:flex;gap:10px;font-size:.95rem;align-items:flex-start;}
.benefitList li svg{flex:none;margin-top:2px;}
.trustMini{display:flex;gap:22px;flex-wrap:wrap;font-size:.8rem;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:18px;margin-top:6px;}
.trustMini span{display:flex;align-items:center;gap:6px;}

.contentGrid{display:grid;grid-template-columns:1.4fr .9fr;gap:44px;align-items:start;}
.contentCard{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px 28px;box-shadow:var(--shadow);}
.contentCard h2{font-size:1.3rem;}
.contentCard h2:not(:first-child){margin-top:28px;}
.sideCard{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin-bottom:18px;}
.sideCard h3{font-size:1rem;margin-bottom:10px;}
.sideCard ul{margin:0;padding-left:18px;font-size:.88rem;color:var(--ink-soft);line-height:1.8;}

.relatedGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}

.pageHero{background:var(--paper-deep);border-bottom:1px solid var(--line);padding:38px 0;text-align:center;}
.pageHero h1{font-size:clamp(1.8rem,3.6vw,2.6rem);margin:8px 0 10px;}
.pageHero p{color:var(--ink-soft);max-width:60ch;margin:0 auto;}

.stepList{counter-reset:step;list-style:none;padding:0;margin:0;display:grid;gap:16px;}
.stepList li{position:relative;padding-left:44px;font-size:.95rem;color:var(--ink-soft);}
.stepList li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--sage-tint);color:var(--sage);font-family:'IBM Plex Mono',monospace;font-weight:600;display:flex;align-items:center;justify-content:center;font-size:.85rem;}

@media(max-width:900px){
  .productHero .wrap{grid-template-columns:1fr;}
  .contentGrid{grid-template-columns:1fr;}
  .relatedGrid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:520px){
  .relatedGrid{grid-template-columns:1fr;}
}
