/* =========================================================
   PRO LIFE HEALTH CARE — MAIN STYLESHEET
   Nurturing Life
   Design language: editorial serif headings (Lora) + clean
   sans body/UI (Public Sans), a root/vein line motif drawn
   from the brand mark, generous white space, restrained
   green + brown accents.
   ========================================================= */
:root {
  /* Premium Sage Green Brand Palette */
  --primary-green: #87986A;      /* Deeper Sage - Main brand color */
  --secondary-green: #A8B89A;    /* Soft Sage */
  --light-green: #D8E2D0;        /* Light Sage backgrounds */
  --dark-green: #66755A;         /* Dark Sage */
  
  /* Neutral / Earthy Colors */
  --tree-brown: #5A4A3D;         /* Soft earthy brown */
  --dark-text: #2F352D;          /* Deep charcoal with natural tone */
  --light-text: #697068;         /* Muted grey-green */
  
  --white: #FFFFFF;
  --off-white: #F7F7F2;          /* Warm off-white */
  
  /* UI Colors */
  --border-soft: #D9DED4;
  --shadow-soft: 0 6px 24px rgba(102, 117, 90, 0.10);
  --shadow-card: 0 2px 10px rgba(47, 53, 45, 0.06);

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  /* Typography */
  --font-display: 'Lora', 'Georgia', serif;
  --font-body: 'Public Sans', 'Segoe UI', Helvetica, Arial, sans-serif;

  --container-width: 1200px;
  --header-height: 84px;
}

/* ---------- Reset & base ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--dark-text);
  background:var(--white);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;transition:color .2s ease;}
ul{list-style:none;margin:0;padding:0;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--dark-green);
  line-height:1.25;
  margin:0 0 16px;
  font-weight:600;
}
h1{font-size:3rem;}
h2{font-size:2.25rem;}
h3{font-size:1.4rem;}
p{margin:0 0 16px;color:var(--light-text);}
.container{
  width:100%;
  max-width:var(--container-width);
  margin:0 auto;
  padding:0 24px;
}
.main-nav .nav-cta{display:none;}
.hero-slider{position:relative;overflow:hidden;background:var(--dark-green);padding:0;}
section{padding:88px 0;}
.section-off{background:var(--off-white);}
.section-light-green{background:var(--light-green);}

:focus-visible{outline:2px solid var(--primary-green);outline-offset:3px;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important;}
}
/* The "Explore Products" button inside .main-nav is a mobile-only CTA
   (shown inside the slide-out panel). It must stay hidden by default —
   the visible desktop CTA lives in .header-actions instead. */
.main-nav .nav-cta{display:none;}

/* ---------- Products dropdown ---------- */
.main-nav li.has-dropdown{position:relative;}
.main-nav li.has-dropdown > a{display:flex;align-items:center;gap:5px;}
.dropdown-caret{font-size:.65rem;transition:transform .2s ease;}
.main-nav li.has-dropdown:hover .dropdown-caret,
.main-nav li.has-dropdown:focus-within .dropdown-caret{transform:rotate(180deg);}

.main-nav .dropdown-menu{
  display:block; 
  /* .main-nav ul{display:flex} would otherwise match this nested <ul> too */
  .main-nav ul{flex-direction:column;align-items:stretch;gap:0;}
  position:absolute;top:100%;left:0;margin-top:10px;min-width:230px;
  background:var(--white);border:1px solid var(--border-soft);border-radius:var(--radius-md);
  box-shadow:var(--shadow-soft);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
  z-index:30;
}
.main-nav li.has-dropdown:hover .dropdown-menu,
.main-nav li.has-dropdown:focus-within .dropdown-menu{
  opacity:1;visibility:visible;transform:translateY(0);
}
.main-nav .dropdown-menu li{border:none;}
.main-nav .dropdown-menu a{
  display:flex;align-items:center;gap:10px;padding:10px 12px;
  font-size:.88rem;font-weight:500;border-radius:6px;color:var(--dark-text);
}
.main-nav .dropdown-menu a:hover{background:var(--light-green);color:var(--primary-green);}
.main-nav .dropdown-menu a::after{display:none;}
.main-nav .dropdown-menu i{color:var(--primary-green);font-size:.95rem;}
/* ---------- Section heading kit ---------- */
.section-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--primary-green);
  font-weight:600;
  margin-bottom:14px;
}
.section-eyebrow::before{
  content:"";
  width:22px;height:1px;
  background:var(--secondary-green);
  display:inline-block;
}
.section-head{max-width:680px;margin:0 0 48px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head p{font-size:1.05rem;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 30px;
  border-radius:var(--radius-sm);
  font-weight:600;
  font-size:.95rem;
  border:1px solid transparent;
  transition:all .25s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--primary-green);color:var(--white);}
.btn-primary:hover{background:var(--dark-green);color:var(--white);transform:translateY(-2px);}
.btn-outline{border-color:var(--white);color:var(--white);background:transparent;}
.btn-outline:hover{background:var(--white);color:var(--dark-green);transform:translateY(-2px);}
.btn-outline-green{border-color:var(--primary-green);color:var(--primary-green);background:transparent;}
.btn-outline-green:hover{background:var(--primary-green);color:var(--white);}
.btn-sm{padding:10px 20px;font-size:.85rem;}
.btn-block{width:100%;}
.btn-whatsapp{background:#25D366;color:var(--white);}
.btn-whatsapp:hover{background:#1ea952;color:var(--white);}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:sticky;top:0;left:0;right:0;z-index:1000;
  /* Solid (not translucent+blurred) background on purpose: backdrop-filter
     creates a new containing block for fixed-position descendants, which
     would trap the fixed mobile nav panel inside the header's own box. */
  background:var(--white);
  border-bottom:1px solid var(--border-soft);
  transition:box-shadow .25s ease, padding .25s ease;
}
.site-header.is-scrolled{box-shadow:0 4px 20px rgba(13,84,35,0.08);}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:var(--header-height);
}
.brand{display:flex;align-items:center;gap:12px;}
.brand img{height:48px;width:auto;}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-text .brand-name{font-family:var(--font-display);font-weight:600;font-size:1.28rem;color:var(--dark-green);}
.brand-text .brand-tag{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--secondary-green);}

.main-nav{display:flex;align-items:center;gap:40px;}
.main-nav ul{display:flex;gap:32px;}
.main-nav a{
  font-weight:600;font-size:.95rem;color:var(--dark-text);
  position:relative;padding:6px 0;
}
.main-nav a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--primary-green);transition:width .25s ease;
}
.main-nav a:hover,.main-nav a.active{color:var(--primary-green);}
.main-nav a:hover::after,.main-nav a.active::after{width:100%;}

.header-actions{display:flex;align-items:center;gap:18px;}
.hamburger{
  display:none;flex-direction:column;gap:5px;background:none;border:none;padding:6px;
}
.hamburger span{width:26px;height:2px;background:var(--dark-green);border-radius:2px;transition:all .25s ease;}
.hamburger.is-active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.is-active span:nth-child(2){opacity:0;}
.hamburger.is-active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- Breadcrumb / page banner ---------- */
.page-banner{
  position:relative;
  padding:64px 0 56px;
  background:linear-gradient(135deg,var(--light-green) 0%,var(--off-white) 60%);
  overflow:hidden;
  border-bottom:1px solid var(--border-soft);
}
.page-banner .root-motif{position:absolute;bottom:-40px;left:0;width:100%;opacity:.5;pointer-events:none;}
.page-banner h1{margin-bottom:10px;position:relative;}
.breadcrumb{display:flex;gap:8px;align-items:center;font-size:.9rem;color:var(--light-text);position:relative;}
.breadcrumb a{color:var(--primary-green);font-weight:600;}
.breadcrumb .sep{color:var(--light-text);}
.breadcrumb .current{color:var(--dark-text);}

/* =========================================================
   HERO SLIDER
   ========================================================= */
.hero-slide{
  position:relative;
  display:none;
}
.hero-slide.is-active{display:block;}
.hero-slide img{
  width:100%;
  height:750px;
  object-fit:cover;
  display:block;
}

.slider-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:46px;height:46px;border-radius:50%;
  background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.4);
  color:var(--white);display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;transition:background .2s ease;
}
.slider-arrow:hover{background:rgba(255,255,255,0.3);}
.slider-arrow.prev{left:24px;}
.slider-arrow.next{right:24px;}
.slider-dots{
  position:absolute;bottom:26px;left:0;right:0;z-index:5;
  display:flex;justify-content:center;gap:10px;
}
.slider-dots button{
  width:10px;height:10px;border-radius:50%;border:1px solid rgba(255,255,255,.8);
  background:transparent;padding:0;
}
.slider-dots button.is-active{background:var(--white);}

/* =========================================================
   NEWS TICKER
   ========================================================= */
.news-ticker{
  background:var(--dark-green);
  color:var(--white);
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.ticker-inner{display:flex;align-items:center;height:46px;}
.ticker-label{
  flex:0 0 auto;background:var(--tree-brown);height:100%;display:flex;align-items:center;
  padding:0 22px;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  white-space:nowrap;
}
.ticker-track-wrap{overflow:hidden;flex:1;}
.ticker-track{
  display:flex;white-space:nowrap;width:max-content;
  animation:tickerScroll 32s linear infinite;
}
.news-ticker:hover .ticker-track{animation-play-state:paused;}
.ticker-track span{
  display:inline-flex;align-items:center;padding:0 28px;font-size:.85rem;color:#dff2e2;
}
.ticker-track span i{color:var(--secondary-green);margin-right:10px;}
@keyframes tickerScroll{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}

/* =========================================================
   INTRO / TWO COLUMN
   ========================================================= */
.intro-section .row-flex{display:flex;align-items:center;gap:64px;}
.intro-media{flex:0 0 44%;}
.intro-text{flex:1;}
.brand-illustration{
  position:relative;background:var(--light-green);border-radius:var(--radius-lg);
  padding:40px;display:flex;align-items:center;justify-content:center;
  aspect-ratio:4/3.4;overflow:hidden;
}
.brand-illustration img{width:62%;}
.brand-illustration::after{
  content:"";position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='340' viewBox='0 0 400 340'%3E%3Cg fill='none' stroke='%23197a32' stroke-opacity='0.12' stroke-width='2'%3E%3Cpath d='M200 340 C190 280 210 250 190 210 C175 180 150 165 120 150'/%3E%3Cpath d='M200 340 C210 280 190 250 210 210 C225 180 250 165 280 150'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:bottom;background-size:contain;
}
.intro-text ul.checklist{margin-top:20px;}
.intro-text ul.checklist li{
  display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;color:var(--dark-text);font-weight:500;
}
.intro-text ul.checklist i{color:var(--primary-green);margin-top:3px;}

/* =========================================================
   CATEGORY CARDS
   ========================================================= */
.category-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:26px;
}
.category-card{
  background:var(--white);border:1px solid var(--border-soft);border-radius:var(--radius-md);
  overflow:hidden;text-align:left;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  display:flex;flex-direction:column;height:100%;
}
.category-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-soft);border-color:var(--secondary-green);}

.category-image{aspect-ratio:4/3;overflow:hidden;background:var(--light-green);}
.category-image img{
  width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;
}
.category-card:hover .category-image img{transform:scale(1.06);}

.category-card-body{padding:26px 28px 30px;display:flex;flex-direction:column;flex:1;}
.category-card-body h3{margin-bottom:8px;}
.category-card-body p{font-size:.92rem;flex:1;}
.category-card-body .btn{margin-top:18px;align-self:flex-start;}


/* =========================================================
   WHY CHOOSE US
   ========================================================= */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.why-card{
  background:var(--white);border:1px solid var(--border-soft);border-radius:var(--radius-md);
  padding:30px;display:flex;gap:18px;align-items:flex-start;
}
.why-card .icon-box{
  flex:0 0 auto;width:48px;height:48px;border-radius:50%;background:var(--dark-green);color:var(--white);
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;
}
.why-card h4{font-family:var(--font-display);font-size:1.1rem;margin-bottom:6px;color:var(--dark-text);}
.why-card p{font-size:.9rem;margin:0;}

/* =========================================================
   PRODUCT CARDS
   ========================================================= */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}

.product-card{
  background:var(--white);border:1px solid var(--border-soft);border-radius:var(--radius-md);
  overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .25s ease,transform .25s ease;
}
.product-card:hover{box-shadow:var(--shadow-soft);transform:translateY(-4px);}
.product-thumb{aspect-ratio: 1/1;
 display:flex;align-items:center;justify-content:center; overflow: hidden;
  background:linear-gradient(160deg,var(--light-green) 0%,#dff0e2 100%);position:relative;
}
.product-thumb img{width:100%;height:100%;object-fit:cover;display:contain;transition:transform .4s ease;aspect-ratio: 1/1;} 
.product-card:hover .product-thumb img{transform:scale(1.06);}
.product-thumb .cat-tag{
  position:absolute;top:12px;left:12px;background:var(--white);color:var(--dark-green);
  font-size:.68rem;font-weight:700;letter-spacing:.04em;padding:4px 10px;border-radius:20px;
  border:1px solid var(--border-soft)
}
.product-body{padding:20px;display:flex;flex-direction:column;flex:1;}
.product-body h3{font-size:1.05rem;margin-bottom:6px;}
.product-body .product-cat{font-size:.78rem;color:var(--secondary-green);font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;}
.product-body p{font-size:.88rem;flex:1;margin-bottom:16px;}

.products-toolbar{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;margin-bottom:36px;}
.search-box{position:relative;flex:1;min-width:240px;max-width:420px;}
.search-box input{
  width:100%;padding:13px 16px 13px 42px;border-radius:30px;border:1px solid var(--border-soft);
  background:var(--off-white);font-size:.92rem;color:var(--dark-text);
}
.search-box i{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--light-text);}
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;}
.filter-btn{
  padding:10px 20px;border-radius:30px;border:1px solid var(--border-soft);background:var(--white);
  font-size:.85rem;font-weight:600;color:var(--dark-text);transition:all .2s ease;
}
.filter-btn.is-active,.filter-btn:hover{background:var(--primary-green);border-color:var(--primary-green);color:var(--white);}
.no-results{display:none;text-align:center;padding:60px 20px;color:var(--light-text);}
.no-results.is-visible{display:block;}

/* =========================================================
   TIMELINE
   ========================================================= */
/* =========================================================
   OUR JOURNEY — TIMELINE
========================================================= */

.timeline {
  position: relative;
  max-width: 950px;
  margin: 0 auto;
}

/* Vertical timeline line */
.timeline::before {
  content: "";
  position: absolute;
  left: 24px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--border-soft);
}

/* Each timeline row */
.timeline-item {
  position: relative;

  /* Space for timeline line + dot */
  padding: 0 0 48px 68px;

  /* LEFT CONTENT | RIGHT CONTENT */
  display: grid;
  grid-template-columns: 165px minmax(0, 1fr);
  column-gap: 18px;

  align-items: start;
}

/* Last item */
.timeline-item:last-child {
  padding-bottom: 0;
}

/* Timeline dot */
.timeline-dot {
  position: absolute;
  left: 14px;
  top: 2px;

  width: 22px;
  height: 22px;

  border-radius: 50%;

  background: var(--primary-green);
  border: 4px solid var(--light-green);

  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 2;
}

/* =========================================================
   LEFT SIDE — YEAR + TITLE
========================================================= */

.timeline-heading {
  min-width: 0;
}
.timeline-year {
  display: block;

  font-family: var(--font-display);
  color: var(--primary-green);
  font-weight: 700;

  font-size: 1.25rem;
  line-height: 1.3;

  letter-spacing: 0.04em;

  margin-bottom: 6px;
}

.timeline-item h4 {
  margin: 0;

  font-size: 1.15rem;
  line-height: 1.3;

  color: var(--dark-text);
}

/* =========================================================
   RIGHT SIDE — ALL PARAGRAPHS
========================================================= */

.timeline-content {
  min-width: 0;
}

.timeline-item p {
  margin: 0 0 14px;

  font-size: 0.93rem;
  line-height: 1.6;

  color: var(--dark-text);
}

.timeline-item p:last-child {
  margin-bottom: 0;
}

/* Bold category text */
.timeline-item p strong {
  font-weight: 700;
}


/* =========================================================
   RESPONSIVE — TABLET
========================================================= */

@media (max-width: 768px) {
  .timeline-item {
    grid-template-columns: 140px minmax(0, 1fr);
    column-gap: 16px;
    padding-left: 60px;
  }
}


/* =========================================================
   RESPONSIVE — MOBILE
========================================================= */

@media (max-width: 600px) {
  .timeline::before {
    left: 16px;
  }

  .timeline-item {
    display: block;
    padding-left: 48px;
    padding-bottom: 36px;
  }

  .timeline-dot {
    left: 6px;
    width: 20px;
    height: 20px;
  }

  .timeline-heading {
    margin-bottom: 12px;
  }

  .timeline-year {
    font-size: 0.85rem;
  }

  .timeline-item h4 {
    font-size: 1.05rem;
  }

  .timeline-item p {
    font-size: 0.9rem;
    line-height: 1.55;
  }
}

/* =========================================================
   VISION / MISSION
   ========================================================= */
.vm-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
.vm-card{
  padding:44px;border-radius:var(--radius-lg);position:relative;overflow:hidden;
}
.vm-card.vision{background:#e4f3e6;color:var(--white);}
.vm-card.mission{background:var(--light-green);color:var(--dark-text);}
.vm-card .vm-icon{font-size:1.8rem;margin-bottom:18px;display:inline-block;}
.vm-card.vision .vm-icon{color:#a9e0b7;}
.vm-card.mission .vm-icon{color:var(--primary-green);}
.vm-card h3{color:inherit;}
.vm-card.vision h3{color:var(--white);}
.vm-card p{margin:0;font-size:.98rem;}
.vm-card.vision p{color:#dcefe0;}
.vm-card.mission p{color:var(--light-text);}

/* =========================================================
   CTA BAND
   ========================================================= */
.cta-band{
  background:linear-gradient(120deg,var(--dark-green),var(--primary-green));
  color:var(--white);text-align:center;position:relative;overflow:hidden;
}
.cta-band h2{color:var(--white);}
.cta-band p{color:#dcefe0;max-width:560px;margin:0 auto 32px;}
.cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* =========================================================
   WHAT DRIVES US (about page)
   ========================================================= */
.drives-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.drives-card{
  text-align:center;padding:36px 24px;border:1px solid var(--border-soft);border-radius:var(--radius-md);
  background:var(--white);
}
.drives-card .icon-circle{
  width:64px;height:64px;border-radius:50%;background:var(--light-green);color:var(--primary-green);
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin:0 auto 18px;
}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{background:white;color:black;position:relative;}
.footer-top{padding:72px 0 40px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1.3fr 1fr;gap:40px;}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.footer-brand img{height:44px;filter:brightness(0) invert(1);}
.footer-brand .brand-name{font-family:var(--font-display);font-size:1.2rem;color:black;}
.footer-brand .brand-tag{font-size:.68rem;letter-spacing:.11em;text-transform:uppercase;color:black;}
.site-footer p{color:black;font-size:.9rem;}
.site-footer h5{color:black;font-family:var(--font-display);font-size:1.05rem;margin-bottom:20px;}
.footer-links li{margin-bottom:12px;}
.footer-links a{color:black;font-size:.9rem;}
.footer-links a:hover{color:black;}
.footer-contact li{display:flex;gap:12px;margin-bottom:16px;font-size:.9rem;color:black;align-items:flex-start;}
.footer-contact i{color:var(--secondary-green);margin-top:3px;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);padding:22px 0;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
}
.footer-bottom p{margin:0;font-size:.82rem;color:#a79f9a;}
.footer-legal{display:flex;gap:20px;}
.footer-legal a{font-size:.82rem;color:#a79f9a;}
.footer-legal a:hover{color:var(--white);}

/* ---------- Floating WhatsApp button ---------- */
.whatsapp-float{
  position:fixed;bottom:26px;right:26px;z-index:999;
  width:58px;height:58px;border-radius:50%;background:#25D366;
  display:flex;align-items:center;justify-content:center;color:var(--white);font-size:1.6rem;
  box-shadow:0 8px 24px rgba(0,0,0,.22);transition:transform .2s ease;
}
.whatsapp-float:hover{transform:scale(1.08);color:var(--white);}

/* =========================================================
   ABOUT PAGE — story split
   ========================================================= */
.story-grid{display:flex;gap:64px;align-items:center;}
.story-grid .intro-media{flex:0 0 42%;}

/* =========================================================
   CONTACT PAGE
   ========================================================= */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;}
.contact-info-card{background:var(--dark-green);color:var(--white);border-radius:var(--radius-lg);padding:44px;}
.contact-info-card h3{color:var(--white);}
.contact-info-card p{color:#dcefe0;}
.contact-info-list li{display:flex;gap:16px;margin-bottom:26px;align-items:flex-start;}
.contact-info-list .icon-box{
  flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;color:var(--white);
}
.contact-info-list h5{color:var(--white);margin:0 0 4px;font-size:.95rem;font-family:var(--font-body);font-weight:700;}
.contact-info-list p{margin:0;font-size:.9rem;color:#dcefe0;}
.contact-form-card{background:var(--white);border:1px solid var(--border-soft);border-radius:var(--radius-lg);padding:44px;box-shadow:var(--shadow-card);}
.form-group{margin-bottom:20px;}
.form-group label{display:block;font-size:.85rem;font-weight:600;color:var(--dark-text);margin-bottom:8px;}
.form-control{
  width:100%;padding:13px 16px;border:1px solid var(--border-soft);border-radius:var(--radius-sm);
  font-size:.94rem;color:var(--dark-text);background:var(--off-white);font-family:inherit;
}
.form-control:focus{outline:none;border-color:var(--primary-green);background:var(--white);}
textarea.form-control{resize:vertical;min-height:130px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.field-error{color:#b3261e;font-size:.78rem;margin-top:6px;display:none;}
.form-group.has-error .form-control{border-color:#b3261e;}
.form-group.has-error .field-error{display:block;}
.form-success{
  display:none;background:var(--light-green);border:1px solid var(--secondary-green);color:var(--dark-green);
  padding:18px 20px;border-radius:var(--radius-sm);margin-bottom:22px;font-size:.92rem;align-items:center;gap:10px;
}
.form-success.is-visible{display:flex;}
.map-wrap{margin-top:32px;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-soft);}
.map-wrap iframe{width:100%;height:320px;border:0;display:block;}

/* =========================================================
   PRODUCT DETAILS PAGE
   ========================================================= */
.pd-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;}
.pd-gallery-main{
  aspect-ratio:1/1;border-radius:var(--radius-lg);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.pd-gallery-main i{font-size:5rem;color:var(--primary-green);opacity:.85;}
.pd-thumbs{display:flex;gap:12px;margin-top:14px;}
.pd-thumb{
  width:72px;height:72px;border-radius:var(--radius-sm);background:var(--light-green);
  display:flex;align-items:center;justify-content:center;border:2px solid transparent;color:var(--primary-green);
}
.pd-thumb.is-active{border-color:var(--primary-green);}
.pd-cat-tag{
  display:inline-block;background:var(--light-green);color:var(--dark-green);font-size:.75rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;padding:5px 14px;border-radius:20px;margin-bottom:14px;
}
.pd-info h1{font-size:2.1rem;margin-bottom:6px;}
.pd-meta-table{width:100%;border-collapse:collapse;margin:22px 0;}
.pd-meta-table tr{border-bottom:1px solid var(--border-soft);}
.pd-meta-table td{padding:12px 0;font-size:.92rem;}
.pd-meta-table td:first-child{color:var(--light-text);width:190px;font-weight:600;}
.pd-meta-table td:last-child{color:var(--dark-text);}
.pd-actions{display:flex;gap:14px;flex-wrap:wrap;margin:26px 0;}
.pd-note{
  background:var(--off-white);border-left:3px solid var(--secondary-green);padding:16px 18px;
  font-size:.85rem;color:var(--light-text);border-radius:0 6px 6px 0;
}
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}

/* =========================================================
   LEGAL PAGES
   ========================================================= */
.legal-content{max-width:820px;margin:0 auto;}
.legal-content h2{margin-top:40px;}
.legal-content h2:first-child{margin-top:0;}
.legal-content p, .legal-content li{color:var(--light-text);font-size:.98rem;}
.legal-content ul{margin:0 0 16px;padding-left:20px;list-style:disc;}
.legal-content .updated-note{
  background:var(--light-green);padding:14px 18px;border-radius:var(--radius-sm);color:var(--dark-green);
  font-size:.88rem;margin-bottom:36px;
}
