/* =========================================================
   AAC Services section — "Our Services In Agriculture…"
   ========================================================= */
.aac-services {
  --sv-green: #007d45;
  --sv-deep: #063a33;
  --sv-deeper: #04291f;
  --sv-gold: #ffcd00;
  --sv-ink: #10210f;
  --sv-ease: cubic-bezier(.22, 1, .36, 1);
  --sv-scroll: 0;

  position: relative;
  overflow: hidden;
  padding: clamp(80px, 9vw, 130px) 0;
  background: #fff;
}

/* Giant outlined words drifting with scroll */
.aac-services__ghost {
  position: absolute;
  top: clamp(30px, 4vw, 60px);
  left: 0;
  white-space: nowrap;
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-weight: 800;
  font-size: clamp(5rem, 13vw, 11rem);
  line-height: 1;
  letter-spacing: -.03em;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(0, 125, 69, .09);
  transform: translate3d(calc(-8% - var(--sv-scroll) * 22%), 0, 0);
  pointer-events: none;
  user-select: none;
}

/* ---------- Header ---------- */
.aac-services__head {
  position: relative;
  max-width: 900px;
  margin: 0 auto clamp(44px, 6vw, 70px);
  text-align: center;
}

.aac-services__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  padding: 7px 16px;
  border-radius: 999px;
  background: rgba(0, 125, 69, .1);
  color: var(--sv-green);
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.aac-services__eyebrow-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--sv-green);
  animation: aacSvPulse 2s ease-out infinite;
}

@keyframes aacSvPulse {
  0%   { box-shadow: 0 0 0 0 rgba(0, 125, 69, .55); }
  100% { box-shadow: 0 0 0 12px rgba(0, 125, 69, 0); }
}

.aac-services__title {
  margin: 0 0 20px;
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-weight: 700;
  font-size: clamp(2rem, 4.2vw, 3.4rem);
  line-height: 1.12;
  letter-spacing: -.02em;
  color: var(--sv-ink);
}

/* Shimmering green → gold accent words */
.aac-services:not(.is-ready) .aac-services__accent,
.aac-services.is-ready .aac-services__accent .w-in {
  background: linear-gradient(100deg, var(--sv-green) 0%, var(--sv-green) 35%, #36b37e 45%, var(--sv-gold) 50%, #36b37e 55%, var(--sv-green) 65%, var(--sv-green) 100%);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: aacSvShimmer 6s ease-in-out infinite;
}

@keyframes aacSvShimmer {
  0%, 20% { background-position: 100% 0; }
  60%, 100% { background-position: 0 0; }
}

.aac-services__intro {
  margin: 0 auto;
  max-width: 760px;
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-size: clamp(1rem, 1.3vw, 1.15rem);
  font-weight: 300;
  line-height: 1.75;
  color: #3c4a3b;
}

/* ---------- Grid ---------- */
.aac-services__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2.2vw, 30px);
}

/* ---------- Card ---------- */
.aac-svc {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  background: var(--sv-deep);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 20px 45px -30px rgba(4, 41, 31, .7);
  transition: transform .6s var(--sv-ease), box-shadow .6s var(--sv-ease);
}

/* gold glow ring on hover */
.aac-svc::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px;
  background: linear-gradient(140deg, var(--sv-gold), transparent 40%, transparent 60%, var(--sv-green));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity .6s var(--sv-ease);
  z-index: 3;
  pointer-events: none;
}

/* rising light from the bottom of the body */
.aac-svc::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 70%;
  background: radial-gradient(ellipse 80% 70% at 50% 110%, rgba(255, 205, 0, .18), transparent 70%);
  opacity: 0;
  transition: opacity .6s var(--sv-ease);
  z-index: 0;
  pointer-events: none;
}

.aac-svc:hover {
  transform: translateY(-10px);
  box-shadow: 0 40px 70px -35px rgba(4, 41, 31, .85);
}
.aac-svc:hover::before,
.aac-svc:hover::after { opacity: 1; }

/* whole-card click target */
.aac-svc__link {
  position: absolute;
  inset: 0;
  z-index: 4;
  border-radius: inherit;
}
.aac-svc__link:focus-visible { outline: 3px solid var(--sv-gold); outline-offset: 4px; }

/* Media */
.aac-svc__media {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.aac-svc__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02) translate3d(var(--px, 0), var(--py, 0), 0);
  transition: transform 1s var(--sv-ease), filter .8s var(--sv-ease);
}

.aac-svc:hover .aac-svc__media img {
  transform: scale(1.1) translate3d(var(--px, 0), var(--py, 0), 0);
  filter: saturate(1.15);
}

/* fade the image into the card body */
.aac-svc__media::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 45%;
  background: linear-gradient(to top, var(--sv-deep), transparent);
  pointer-events: none;
}

.aac-svc__shine {
  position: absolute;
  top: 0; left: -75%;
  width: 50%; height: 100%;
  background: linear-gradient(110deg, transparent, rgba(255, 255, 255, .12), transparent);
  transform: skewX(-20deg);
  z-index: 1;
  pointer-events: none;
}
.aac-svc:hover .aac-svc__shine { animation: aacSvShine 1s var(--sv-ease); }

@keyframes aacSvShine {
  from { left: -75%; }
  to   { left: 130%; }
}

.aac-svc__num {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  padding: 6px 13px;
  border-radius: 999px;
  background: rgba(4, 41, 31, .55);
  border: 1px solid rgba(255, 255, 255, .25);
  backdrop-filter: blur(8px);
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .08em;
  color: #fff;
  transition: background-color .5s, color .5s, border-color .5s;
}
.aac-svc:hover .aac-svc__num { background: var(--sv-gold); color: var(--sv-ink); border-color: var(--sv-gold); }

/* Body */
.aac-svc__body {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 6px clamp(22px, 2vw, 28px) clamp(24px, 2.2vw, 30px);
}

.aac-svc__title {
  position: relative;
  margin: 0 0 12px;
  padding-bottom: 14px;
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-size: clamp(1.1rem, 1.35vw, 1.3rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--sv-gold);
}

.aac-svc__title::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 36px; height: 3px;
  border-radius: 3px;
  background: var(--sv-gold);
  transition: width .6s var(--sv-ease);
}
.aac-svc:hover .aac-svc__title::after { width: 90px; }

.aac-svc__text {
  margin: 0 0 22px;
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-size: .93rem;
  font-weight: 300;
  line-height: 1.7;
  color: rgba(255, 255, 255, .82);
}

.aac-svc__more {
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .3);
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-size: .88rem;
  font-weight: 500;
  color: #fff;
  transition: background-color .5s var(--sv-ease), color .5s, border-color .5s, gap .5s var(--sv-ease);
}
.aac-svc__more i { transition: transform .5s var(--sv-ease); }
.aac-svc:hover .aac-svc__more { background: var(--sv-gold); border-color: var(--sv-gold); color: var(--sv-ink); gap: 14px; }
.aac-svc:hover .aac-svc__more i { transform: translateX(3px); }

/* ---------- CTA ---------- */
.aac-services__cta {
  margin-top: clamp(40px, 5vw, 60px);
  text-align: center;
}

.aac-services__btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 32px;
  border-radius: 999px;
  background: var(--sv-deep);
  color: #fff !important;
  font-family: var(--font-secondary, "Poppins", sans-serif);
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 16px 36px -18px rgba(4, 41, 31, .8);
  transition: transform .45s var(--sv-ease), background-color .45s, color .45s, box-shadow .45s;
}
.aac-services__btn i { transition: transform .45s var(--sv-ease); }
.aac-services__btn:hover {
  transform: translateY(-3px);
  background: var(--sv-gold);
  color: var(--sv-ink) !important;
  box-shadow: 0 20px 40px -18px rgba(255, 205, 0, .8);
}
.aac-services__btn:hover i { transform: rotate(45deg); }

/* ---------- Scroll-in choreography (JS adds .is-ready / .is-visible) ---------- */
.aac-services.is-ready .aac-sv-reveal {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition: opacity .9s var(--sv-ease), transform .9s var(--sv-ease);
}
.aac-services.is-ready .aac-services__title .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.aac-services.is-ready .aac-services__title .w-in { display: inline-block; transform: translate3d(0, 105%, 0); transition: transform .9s var(--sv-ease); }

.aac-services.head-in .aac-services__eyebrow     { opacity: 1; transform: none; }
.aac-services.head-in .aac-services__title .w-in { transform: none; transition-delay: calc(.1s + var(--i) * 50ms); }
.aac-services.head-in .aac-services__intro       { opacity: 1; transform: none; transition-delay: .6s; }

/* cards: rise + image wipe */
.aac-services.is-ready .aac-svc {
  opacity: 0;
  transform: translate3d(0, 60px, 0);
  transition: opacity 1s var(--sv-ease), transform 1s var(--sv-ease), box-shadow .6s var(--sv-ease);
}
.aac-services.is-ready .aac-svc__media { clip-path: inset(0 0 100% 0); transition: clip-path 1.1s var(--sv-ease); }
.aac-services.is-ready .aac-svc__body > * { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity .7s var(--sv-ease), transform .7s var(--sv-ease); }

.aac-services .aac-svc.is-in { opacity: 1; transform: none; transition-delay: calc(var(--col, 0) * .12s); }
.aac-services .aac-svc.is-in .aac-svc__media { clip-path: inset(0 0 0 0); transition-delay: calc(var(--col, 0) * .12s + .15s); }
.aac-services .aac-svc.is-in .aac-svc__body > * { opacity: 1; transform: none; }
.aac-services .aac-svc.is-in .aac-svc__title { transition-delay: calc(var(--col, 0) * .12s + .45s); }
.aac-services .aac-svc.is-in .aac-svc__text  { transition-delay: calc(var(--col, 0) * .12s + .55s); }
.aac-services .aac-svc.is-in .aac-svc__more  { transition-delay: calc(var(--col, 0) * .12s + .65s); }

/* after entering, hover should respond instantly */
.aac-services .aac-svc.is-settled,
.aac-services .aac-svc.is-settled .aac-svc__body > * { transition-delay: 0s; }
.aac-services .aac-svc.is-settled:hover { transform: translateY(-10px); }

.aac-services.cta-in .aac-services__cta { opacity: 1; transform: none; }

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
  .aac-services__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
  .aac-services__grid { grid-template-columns: 1fr; }
  .aac-services__title br { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .aac-services *, .aac-services *::before, .aac-services *::after {
    animation: none !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
  .aac-services__ghost { transform: none; }
}

/* =========================================================
   Hover reveal (devices with a mouse): photo + title only,
   description and "Learn more" slide up on hover / focus.
   Touch devices keep the text always visible.
   ========================================================= */
.aac-svc__reveal-inner { display: flex; flex-direction: column; align-items: flex-start; }

@media (hover: hover) and (pointer: fine) {
  .aac-svc {
    height: clamp(280px, 22vw, 330px);
  }

  /* photo fills the whole card */
  .aac-svc__media {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
  }
  .aac-svc__media::after {
    height: 75%;
    background: linear-gradient(to top, var(--sv-deep) 0%, rgba(6, 58, 51, .85) 30%, rgba(6, 58, 51, 0) 100%);
    transition: height .7s var(--sv-ease), background .7s var(--sv-ease);
  }
  .aac-svc:hover .aac-svc__media::after,
  .aac-svc:focus-within .aac-svc__media::after {
    height: 100%;
    background: linear-gradient(to top, var(--sv-deep) 0%, rgba(6, 58, 51, .94) 55%, rgba(6, 58, 51, .55) 100%);
  }

  /* title sits at the bottom; the rest is folded away */
  .aac-svc__body {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    flex: none;
    padding-top: 0;
  }

  .aac-svc__title { margin-bottom: 0; transition: margin .6s var(--sv-ease); }
  .aac-svc:hover .aac-svc__title,
  .aac-svc:focus-within .aac-svc__title { margin-bottom: 12px; }

  .aac-svc__reveal {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .6s var(--sv-ease);
  }
  .aac-svc__reveal-inner {
    min-height: 0;
    overflow: hidden;
  }
  .aac-svc__reveal .aac-svc__text,
  .aac-svc__reveal .aac-svc__more {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
    transition: opacity .45s var(--sv-ease), transform .5s var(--sv-ease), background-color .5s var(--sv-ease), color .5s, border-color .5s, gap .5s var(--sv-ease);
  }

  .aac-svc:hover .aac-svc__reveal,
  .aac-svc:focus-within .aac-svc__reveal { grid-template-rows: 1fr; }

  .aac-svc:hover .aac-svc__reveal .aac-svc__text,
  .aac-svc:focus-within .aac-svc__reveal .aac-svc__text { opacity: 1; transform: none; transition-delay: .15s, .15s, 0s, 0s, 0s, 0s; }
  .aac-svc:hover .aac-svc__reveal .aac-svc__more,
  .aac-svc:focus-within .aac-svc__reveal .aac-svc__more { opacity: 1; transform: none; transition-delay: .25s, .25s, 0s, 0s, 0s, 0s; }

  /* little hint that there's more: a gold "+" that turns into × feel */
  .aac-svc__title::before {
    content: "";
    position: absolute;
    right: 0; bottom: 4px;
    width: 30px; height: 30px;
    border-radius: 50%;
    background:
      linear-gradient(var(--sv-ink), var(--sv-ink)) center / 12px 2px no-repeat,
      linear-gradient(var(--sv-ink), var(--sv-ink)) center / 2px 12px no-repeat,
      var(--sv-gold);
    transition: transform .5s var(--sv-ease), opacity .4s;
  }
  .aac-svc__title { padding-right: 44px; }
  .aac-svc:hover .aac-svc__title::before,
  .aac-svc:focus-within .aac-svc__title::before { transform: rotate(135deg) scale(.8); opacity: 0; }
}
