/* styles/hero.css */
:root{
  --verdant-ink:#17582B; /* deep green for text */
  --verdant-accent:#1f7a55; /* medium green */
  --verdant-bg:#f4f1e9; /* warm paper beige */
  --cta-bg:#1e6b4a;
  --cta-bg-hover:#17533a;
  --radius-lg:18px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--verdant-ink);
  background:var(--verdant-bg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
}

.hero-verdant{
    /* 
    background-image: url(verdant-bg2.jpg);
    background-size: cover;
    background-position: center; 
    background-repeat: no-repeat;
    background-attachment: fixed;
    */
    background: #f4f1e9;
}
.hero-verdant__inner{
  max-width:1200px; margin-inline:auto;
  padding:clamp(1.25rem,3vw,2rem);
  display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(1rem,3vw,2rem);
  align-items:center; min-height:min(82vh,820px);
}
.hero-verdant__copy .brand{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem;font-size:clamp(.95rem,1.2vw,1.05rem);letter-spacing:.02em}
.brand__mark{inline-size:36px;block-size:36px;display:grid;place-items:center;background:#e5efe9;color:var(--verdant-accent);border-radius:50%;font-size:18px}
.brand__name strong{font-weight:800;letter-spacing:.05em}
.brand__name span{opacity:.8;margin-left:.25rem;font-weight:500}
.hero-verdant h1{font-family:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;font-weight:750;line-height:1.05;font-size:clamp(2rem,4vw + .5rem,3.5rem);margin:.25rem 0 1.25rem;color: #66433B; position:relative; top: -50px;}
.button-primary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--cta-bg);color:#fff;border-radius:999px;padding:.9rem 1.25rem;font-weight:700;letter-spacing:.02em;text-decoration:none;box-shadow:0 6px 24px rgba(16,71,52,.18);transition:background .2s ease, transform .15s ease, box-shadow .2s ease}
.button-primary:hover{background:var(--cta-bg-hover);transform:translateY(-1px)}
.button-primary:active{transform:translateY(0);box-shadow:0 4px 18px rgba(16,71,52,.18)}

#vlogo { position:relative; top: -75px;}

@media (max-width:980px){
  .hero-verdant__inner{grid-template-columns:1fr}
  .hero-verdant__art{order:-1;aspect-ratio:16/10.5}
  #vlogo {
    position: relative;
    top: -85px;
    left: 40px;
  }
  .hero-verdant h1 {
    margin: 0.25rem 0 -0.75rem;
    position: relative;
    top: -90px;
    left: 56px;
}
  .button-primary {
    position: relative;
    left: 100px;
    top: -51px;
  }
  .lottie-hero {
    padding-bottom: 0px;
    bottom: 229px;
    left: -42px;
  }
  .hero-verdant {
    padding-top: 25px;
    padding-bottom: 35px;
  }
}


/* Accessibility */
@media (prefers-reduced-motion:reduce){
  .hero-verdant__plant{animation:none !important;opacity:1;transform:none}
  .button-primary{transition:none}
}