/* ================================================================
   SOILSAGE — HOME PAGE STYLES
   ================================================================ */

/* ── HERO ── */
.hero{
  min-height:calc(100vh - 68px);display:flex;align-items:center;
  padding-block:var(--s-20);position:relative;overflow:hidden;
  background:var(--bg);
}
.hero::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 60% 50% at 70% 30%,rgba(109,190,71,0.07) 0%,transparent 60%),
    radial-gradient(ellipse 40% 40% at 20% 70%,rgba(212,133,74,0.05) 0%,transparent 60%);
  pointer-events:none;
}
.hero__grid-lines{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(109,190,71,0.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(109,190,71,0.04) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 80% at 60% 40%,#000 0%,transparent 70%);
}
.hero__inner{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s-16);align-items:center;
  position:relative;z-index:1;
}
.hero__label{
  display:inline-flex;align-items:center;gap:var(--s-2);
  background:var(--green-dim);border:1px solid var(--green-border);
  border-radius:var(--r-full);padding:5px 14px;
  font-size:var(--t-xs);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--green-light);margin-bottom:var(--s-6);
}
.hero__dot{width:6px;height:6px;background:var(--green);border-radius:50%;box-shadow:0 0 8px var(--green);}
.hero__title{
  font-family:var(--font-display);
  font-size:clamp(3.5rem,7vw,var(--t-6xl));
  font-weight:700;line-height:0.94;letter-spacing:-0.04em;color:var(--text);
  margin-bottom:var(--s-6);
}
.hero__title-em{
  font-style:italic;
  background:var(--grad-green);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  display:block;
}
.hero__desc{font-size:var(--t-md);color:var(--text-2);max-width:460px;line-height:1.65;margin-bottom:var(--s-8);}
.hero__ctas{display:flex;gap:var(--s-4);flex-wrap:wrap;margin-bottom:var(--s-8);}
.hero__trust{display:flex;align-items:center;gap:var(--s-5);flex-wrap:wrap;}
.hero__trust-item{
  display:flex;align-items:center;gap:var(--s-2);
  font-size:var(--t-xs);font-weight:600;color:var(--text-3);
}
.hero__trust-check{
  width:18px;height:18px;background:var(--green-dim);border:1px solid var(--green-border);
  border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  font-size:9px;color:var(--green-light);
}

/* Hero visual */
.hero__visual{position:relative;}
.hero__vis-main{
  background:var(--bg-card);border:1px solid var(--border-2);border-radius:var(--r-2xl);
  padding:var(--s-8);aspect-ratio:1;
  display:flex;flex-direction:column;justify-content:flex-end;gap:var(--s-4);
  position:relative;overflow:hidden;
}
.hero__vis-main::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 40% 30%,rgba(109,190,71,0.08) 0%,transparent 60%);
}
.hero__vis-ico{font-size:6rem;position:absolute;top:var(--s-8);right:var(--s-8);opacity:0.4;line-height:1;}
.hero__vis-num{
  font-family:var(--font-display);font-size:clamp(4rem,10vw,7rem);font-weight:700;
  background:var(--grad-green);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  line-height:1;position:relative;z-index:1;
}
.hero__vis-label{
  font-size:var(--t-xs);font-weight:700;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--text-3);position:relative;z-index:1;line-height:1.4;
}
.hero__badge{
  position:absolute;background:var(--bg-2);border:1px solid var(--border-2);
  border-radius:var(--r-lg);padding:var(--s-3) var(--s-4);
  display:flex;align-items:center;gap:var(--s-2);
  font-size:var(--t-xs);font-weight:700;color:var(--text);
  animation:badgeFloat 3s ease-in-out infinite;z-index:2;
}
.hero__badge--1{top:-18px;left:-18px;animation-delay:.4s;}
.hero__badge--2{bottom:20px;right:-18px;animation-delay:1.1s;}
.hero__badge-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
@keyframes badgeFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}

/* ── MARQUEE ── */
.marquee-band{
  background:var(--bg-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  padding-block:var(--s-3);overflow:hidden;position:relative;z-index:1;
}
.marquee-track{display:flex;animation:marqueeScroll 30s linear infinite;width:max-content;}
.marquee-item{
  display:flex;align-items:center;gap:var(--s-4);padding-inline:var(--s-8);
  font-size:var(--t-xs);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--text-3);white-space:nowrap;
}
.marquee-diamond{width:4px;height:4px;background:var(--green-dark);transform:rotate(45deg);flex-shrink:0;}
@keyframes marqueeScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ── ABOUT STRIP ── */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-16);align-items:center;}
.about-vis{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-2xl);
  aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
}
.about-vis::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,rgba(109,190,71,0.07) 0%,transparent 65%);}
.about-vis__num{font-family:var(--font-display);font-size:clamp(5rem,12vw,9rem);font-weight:700;line-height:1;background:var(--grad-green);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;z-index:1;}
.about-vis__label{font-size:var(--t-xs);font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-3);position:relative;z-index:1;text-align:center;margin-top:var(--s-3);}
.about-vis__badge{
  position:absolute;bottom:-14px;right:-14px;
  background:var(--bg-2);border:1px solid var(--green-border);border-radius:var(--r-lg);
  padding:var(--s-4) var(--s-5);display:flex;align-items:center;gap:var(--s-3);z-index:2;
}

/* ── VALS STRIP ── */
.vals-strip{
  background:var(--bg-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  padding-block:0;
}
.vals-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:var(--border);}
.val-block{
  background:var(--bg-2);padding:var(--s-8);
  border-top:2px solid transparent;transition:border-color var(--dur-mid);
}
.val-block:hover{border-color:var(--green);}
.val-ico{font-size:1.8rem;margin-bottom:var(--s-4);}
.val-title{font-family:var(--font-display);font-size:var(--t-lg);font-weight:600;color:var(--text);margin-bottom:var(--s-3);}
.val-text{font-size:var(--t-sm);color:var(--text-2);line-height:1.7;}

/* ── CTA BAND ── */
.cta-band{
  background:var(--grad-green);padding-block:var(--s-24);position:relative;overflow:hidden;
}
.cta-band::before{
  content:'';position:absolute;inset:0;
  background:repeating-linear-gradient(-55deg,transparent,transparent 40px,rgba(10,15,10,0.04) 40px,rgba(10,15,10,0.04) 41px);
}
.cta-band__inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s-12);flex-wrap:wrap;position:relative;z-index:1;
}

/* ── RESPONSIVE ── */
@media(max-width:1024px){.about-grid{gap:var(--s-10);}}
@media(max-width:768px){
  .hero__inner{grid-template-columns:1fr;gap:var(--s-10);}
  .hero{min-height:auto;padding-block:var(--s-16);}
  .hero__visual{display:none;}
  .about-grid{grid-template-columns:1fr;}
  .about-vis{display:none;}
  .vals-inner{grid-template-columns:1fr;}
  .cta-band__inner{flex-direction:column;}
}