@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&family=Inter:wght@400;500;600&display=swap');

:root{
  --white:#FFFFFF;
  --forest:#315C45;
  --forest-dark:#254634;
  --sage:#7C9478;
  --terracotta:#B56D54;
  --sand:#EAE1D2;
  --light-gray:#F7F9F7;
  --text:#26312B;
  --text-light:#5B6B62;
  --border:#E1E5DE;
  --radius:10px;
  --radius-lg:16px;
  --shadow:0 4px 18px rgba(38,49,43,0.08);
  --font-heading:'Poppins', sans-serif;
  --font-body:'Inter', sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--text);
  background:var(--white);
  line-height:1.6;
  font-size:16px;
}
img{max-width:100%;display:block;border-radius:var(--radius);}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
h1,h2,h3,h4{font-family:var(--font-heading);color:var(--forest-dark);line-height:1.25;}
h1{font-size:2.4rem;}
h2{font-size:1.9rem;margin-bottom:1rem;}
h3{font-size:1.35rem;margin-bottom:.6rem;}
p{margin-bottom:1rem;color:var(--text-light);}
.container{max-width:1220px;margin:0 auto;padding:0 24px;}
.section{padding:64px 0;}
.section-alt{background:var(--light-gray);}
.text-center{text-align:center;}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 26px;border-radius:8px;font-weight:600;font-size:.95rem;
  border:1px solid transparent;cursor:pointer;transition:all .2s ease;font-family:var(--font-body);
}
.btn-primary{background:var(--forest);color:var(--white);}
.btn-primary:hover{background:var(--forest-dark);}
.btn-outline{background:transparent;color:var(--forest);border-color:var(--forest);}
.btn-outline:hover{background:var(--forest);color:var(--white);}
.btn-terracotta{background:var(--terracotta);color:var(--white);}
.btn-terracotta:hover{background:#9a5a44;}
.btn-sm{padding:9px 16px;font-size:.85rem;}
.btn-block{width:100%;}

/* Top utility bar */
.topbar{background:var(--forest-dark);color:var(--sand);font-size:.82rem;}
.topbar .container{display:flex;justify-content:space-between;align-items:center;padding:8px 24px;flex-wrap:wrap;gap:6px;}
.topbar a{color:var(--sand);}
.topbar-links{display:flex;gap:18px;}

/* Header */
header.site-header{background:var(--white);border-bottom:1px solid var(--border);position:relative;z-index:50;}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;gap:24px;}
.logo{font-family:var(--font-heading);font-weight:700;font-size:1.55rem;color:var(--forest);}
.logo span{color:var(--terracotta);}
nav.main-nav{display:flex;gap:26px;align-items:center;}
nav.main-nav > ul{display:flex;gap:26px;align-items:center;}
nav.main-nav > ul > li{position:relative;}
nav.main-nav > ul > li > a{font-weight:500;font-size:.95rem;padding:8px 0;display:inline-block;}
nav.main-nav > ul > li > a:hover{color:var(--forest);}
.has-dropdown > .dropdown{
  display:none;position:absolute;top:100%;left:0;background:var(--white);
  border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);
  min-width:280px;padding:10px;grid-template-columns:1fr 1fr;gap:2px;z-index:60;
}
.has-dropdown.open > .dropdown{display:grid;}
.dropdown a{display:block;padding:9px 12px;border-radius:8px;font-size:.88rem;}
.dropdown a:hover{background:var(--light-gray);color:var(--forest);}
.header-actions{display:flex;align-items:center;gap:16px;}
.icon-link{position:relative;font-size:.85rem;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--text);}
.icon-count{position:absolute;top:-6px;right:-10px;background:var(--terracotta);color:var(--white);font-size:.65rem;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center;}
.menu-toggle{display:none;background:none;border:none;font-size:1.6rem;cursor:pointer;color:var(--forest);}

/* Breadcrumb */
.breadcrumb{background:var(--light-gray);padding:14px 0;font-size:.85rem;color:var(--text-light);}
.breadcrumb a{color:var(--sage);}
.breadcrumb span{margin:0 6px;}

/* Hero (no badges/promo blocks) */
.hero{padding:64px 0 56px;background:var(--light-gray);}
.hero-grid{display:flex;align-items:center;gap:56px;}
.hero-text{flex:1;min-width:300px;}
.hero-text p.lead{font-size:1.12rem;max-width:520px;}
.hero-image{flex:1;min-width:300px;}
.hero-actions{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap;}

/* Category hero (page-level, simpler) */
.page-hero{padding:48px 0;background:var(--light-gray);}
.page-hero h1{margin-bottom:12px;}
.page-hero-grid{display:flex;gap:40px;align-items:center;flex-wrap:wrap;}
.page-hero-text{flex:2;min-width:280px;}
.page-hero-image{flex:1;min-width:260px;}

/* Category grid on home */
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;}
.cat-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:transform .25s ease, box-shadow .25s ease;}
.cat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.cat-card img{border-radius:0;aspect-ratio:4/3;object-fit:cover;}
.cat-card-body{padding:16px;}
.cat-card-body h3{font-size:1.02rem;margin-bottom:4px;}
.cat-card-body p{font-size:.85rem;margin-bottom:10px;}

/* Product cards */
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.product-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:transform .25s ease, box-shadow .25s ease;display:flex;flex-direction:column;}
.product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.product-card img{aspect-ratio:4/3;object-fit:cover;border-radius:0;}
.product-card-body{padding:18px;display:flex;flex-direction:column;flex:1;}
.product-card-body h3{font-size:1.05rem;}
.product-meta{font-size:.82rem;color:var(--text-light);margin-bottom:8px;}
.product-price{font-family:var(--font-heading);font-weight:600;color:var(--forest-dark);font-size:1.2rem;margin:6px 0 12px;}
.product-actions{display:flex;gap:8px;margin-top:auto;}
.icon-btn{border:1px solid var(--border);background:var(--white);border-radius:8px;padding:9px 11px;cursor:pointer;font-size:.85rem;}
.icon-btn:hover{border-color:var(--forest);color:var(--forest);}

/* Layout with sidebar filters */
.layout-with-sidebar{display:grid;grid-template-columns:270px 1fr;gap:36px;align-items:start;}
.filters-panel{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px;position:sticky;top:20px;}
.filters-panel h3{font-size:1rem;margin-bottom:14px;}
.filter-group{margin-bottom:20px;border-bottom:1px solid var(--border);padding-bottom:16px;}
.filter-group:last-child{border-bottom:none;}
.filter-group label{display:flex;align-items:center;gap:8px;font-size:.88rem;margin-bottom:8px;color:var(--text-light);cursor:pointer;}
.filter-group input[type=checkbox], .filter-group input[type=radio]{accent-color:var(--forest);}
.filter-group input[type=range]{width:100%;accent-color:var(--forest);}
.filters-panel .btn{margin-top:6px;}

/* Comparison tables */
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);margin:26px 0;}
table.compare-table{width:100%;border-collapse:collapse;min-width:760px;font-size:.9rem;}
table.compare-table th, table.compare-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--border);}
table.compare-table thead th{background:var(--forest);color:var(--white);font-family:var(--font-heading);font-weight:600;}
table.compare-table tbody tr:nth-child(even){background:var(--light-gray);}
table.compare-table td:first-child, table.compare-table th:first-child{font-weight:600;color:var(--forest-dark);}

/* Info blocks / guides */
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;}
.info-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;}
.info-card h3{color:var(--terracotta);}
.steps-list{display:flex;flex-direction:column;gap:18px;}
.step-item{display:flex;gap:16px;align-items:flex-start;border-left:3px solid var(--sage);padding-left:16px;}
.step-item h4{font-family:var(--font-heading);color:var(--forest-dark);margin-bottom:4px;}

/* FAQ accordion */
.faq-item{border-bottom:1px solid var(--border);}
.faq-question{width:100%;text-align:left;background:none;border:none;padding:18px 0;font-family:var(--font-heading);font-weight:600;font-size:1.02rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--forest-dark);}
.faq-answer{display:none;padding-bottom:18px;color:var(--text-light);}
.faq-item.open .faq-answer{display:block;}
.faq-item.open .faq-icon{transform:rotate(45deg);}
.faq-icon{transition:transform .2s ease;font-size:1.3rem;color:var(--sage);}

/* Blog */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.blog-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}
.blog-card img{aspect-ratio:16/10;object-fit:cover;border-radius:0;}
.blog-card-body{padding:18px;}
.blog-meta{font-size:.8rem;color:var(--sage);margin-bottom:8px;}
.article-content{max-width:760px;margin:0 auto;}
.article-content h2{margin-top:36px;}
.article-content img{margin:20px 0;}
.article-hero-img{aspect-ratio:16/7;object-fit:cover;}

/* Forms */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-group{margin-bottom:18px;display:flex;flex-direction:column;gap:6px;}
.form-group.full{grid-column:1 / -1;}
label{font-size:.88rem;font-weight:600;color:var(--forest-dark);}
input,textarea,select{
  padding:12px 14px;border:1px solid var(--border);border-radius:8px;font-family:var(--font-body);font-size:.95rem;background:var(--white);
}
input:focus,textarea:focus,select:focus{outline:2px solid var(--sage);border-color:var(--sage);}
textarea{resize:vertical;min-height:130px;}
.form-success{display:none;background:#EAF4EC;border:1px solid var(--forest);color:var(--forest-dark);padding:16px 18px;border-radius:10px;margin-bottom:20px;font-weight:600;}
.form-success.show{display:block;}

/* Contact info cards */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
.contact-info-list{display:flex;flex-direction:column;gap:20px;margin-top:24px;}
.contact-info-item{display:flex;gap:14px;}
.contact-info-item strong{display:block;color:var(--forest-dark);font-family:var(--font-heading);}

/* Legal pages */
.legal-content{max-width:820px;margin:0 auto;}
.legal-content h2{margin-top:34px;font-size:1.4rem;}
.legal-content h3{margin-top:20px;font-size:1.1rem;color:var(--forest);}
.legal-content ul{padding-left:22px;margin-bottom:16px;}
.legal-content li{list-style:disc;margin-bottom:6px;color:var(--text-light);}
.legal-updated{font-size:.85rem;color:var(--sage);margin-bottom:30px;display:inline-block;background:var(--light-gray);padding:6px 12px;border-radius:6px;}

/* Text-only page hero (legal / info pages, no image) */
.page-hero-textonly{padding:48px 0;background:var(--light-gray);}
.page-hero-textonly h1{margin-bottom:10px;max-width:820px;}
.page-hero-textonly p{max-width:760px;font-size:1.05rem;}

/* Product detail page */
.product-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;}
.product-detail-grid img{aspect-ratio:4/3;object-fit:cover;}
.product-detail-price{font-family:var(--font-heading);font-weight:700;color:var(--forest-dark);font-size:2rem;margin:14px 0 18px;}
.product-detail-actions{display:flex;gap:12px;margin-bottom:28px;flex-wrap:wrap;}
.specs-list{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;margin-top:10px;}
.specs-row{display:flex;justify-content:space-between;padding:13px 18px;border-bottom:1px solid var(--border);font-size:.92rem;}
.specs-row:last-child{border-bottom:none;}
.specs-row:nth-child(even){background:var(--light-gray);}
.specs-row span:first-child{color:var(--text-light);}
.specs-row span:last-child{font-weight:600;color:var(--forest-dark);}

/* Sitemap */
.sitemap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;}
.sitemap-col h3{color:var(--terracotta);border-bottom:2px solid var(--sand);padding-bottom:8px;}
.sitemap-col li{padding:6px 0;font-size:.92rem;}
.sitemap-col a:hover{color:var(--forest);}

/* Newsletter / CTA band */
.cta-band{background:var(--forest);color:var(--white);padding:52px 0;text-align:center;}
.cta-band h2{color:var(--white);}
.cta-band p{color:var(--sand);}

/* Footer */
footer.site-footer{background:var(--forest-dark);color:var(--sand);padding:60px 0 24px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1.3fr;gap:32px;margin-bottom:36px;}
.footer-col h4{color:var(--white);font-size:1rem;margin-bottom:16px;}
.footer-col li{padding:5px 0;font-size:.88rem;}
.footer-col a{color:var(--sand);opacity:.85;}
.footer-col a:hover{opacity:1;color:var(--white);}
.footer-logo{font-family:var(--font-heading);font-weight:700;font-size:1.4rem;color:var(--white);margin-bottom:14px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.8rem;color:#B9C6BC;}

/* Utility badges removed from hero per guidelines; small tag used only inside body content, not hero */
.tag{display:inline-block;background:var(--sand);color:var(--forest-dark);font-size:.75rem;padding:4px 10px;border-radius:6px;margin-right:6px;}

/* Recently viewed / recommended strip */
.strip-scroll{display:flex;gap:20px;overflow-x:auto;padding-bottom:10px;}
.strip-scroll .product-card{min-width:240px;}

/* Empty states (favorites / compare) */
.empty-state{text-align:center;padding:60px 20px;background:var(--light-gray);border:1px solid var(--border);border-radius:var(--radius-lg);}
.empty-state p{font-size:1.02rem;margin-bottom:20px;}

/* Compare bar */
.compare-bar{position:fixed;bottom:0;left:0;right:0;background:var(--forest-dark);color:var(--white);padding:14px 24px;display:none;align-items:center;justify-content:space-between;z-index:80;}
.compare-bar.show{display:flex;}
.compare-bar a{color:var(--sand);text-decoration:underline;}

@media(max-width:980px){
  .cat-grid{grid-template-columns:repeat(3,1fr);}
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:repeat(2,1fr);}
  .layout-with-sidebar{grid-template-columns:1fr;}
  .filters-panel{position:static;}
  .info-grid,.sitemap-grid,.contact-grid,.form-grid{grid-template-columns:1fr;}
}
@media(max-width:720px){
  nav.main-nav{position:fixed;top:70px;left:0;right:0;bottom:0;background:var(--white);flex-direction:column;padding:20px;transform:translateX(-100%);transition:transform .25s ease;overflow-y:auto;}
  nav.main-nav.open{transform:translateX(0);}
  nav.main-nav>ul{flex-direction:column;align-items:flex-start;width:100%;}
  .has-dropdown>.dropdown{position:static;display:none;box-shadow:none;grid-template-columns:1fr;width:100%;}
  .has-dropdown.open>.dropdown{display:grid;}
  .menu-toggle{display:block;}
  .header-actions{gap:10px;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .product-grid{grid-template-columns:1fr;}
  .blog-grid{grid-template-columns:1fr;}
  h1{font-size:1.85rem;}
  .hero-grid,.page-hero-grid{flex-direction:column;}
}
