/* Services page only. Shared elements remain in tokens.css, base.css and components.css. */
.service-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.service-icon-sprite symbol, .service-icon-sprite path, .service-icon-sprite circle { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.services-hero {
  position: relative;
  min-height: 100svh;
  padding: calc(var(--header-height) + clamp(3.5rem, 6vw, 6.5rem)) 0 clamp(5rem, 8vw, 8rem);
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 10%, rgba(119,189,56,.13), transparent 30%),
    linear-gradient(135deg, #fbfdf9 0%, #f0f6ef 58%, #e5efe6 100%);
}
.services-hero::after {
  content: "";
  position: absolute;
  right: -210px;
  bottom: -280px;
  width: 650px;
  aspect-ratio: 1;
  border: 1px solid rgba(24,115,52,.14);
  border-radius: 50%;
  box-shadow: 0 0 0 80px rgba(255,255,255,.26), 0 0 0 160px rgba(24,115,52,.035);
  pointer-events: none;
}
.services-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,.86fr) minmax(520px,1.14fr); gap: clamp(3rem,6vw,7rem); align-items: center; }
.services-hero__copy h1 { max-width: 720px; margin-bottom: 1.6rem; font-size: clamp(3.3rem,6.3vw,6.7rem); }
.services-hero__copy h1 em { display: block; color: var(--green-700); font-style: normal; }
.services-hero__lead { max-width: 650px; margin-bottom: 2rem; font-size: clamp(1.05rem,1.45vw,1.25rem); }
.services-hero__actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-bottom: 2.2rem; }
.services-hero__proof { display: flex; flex-wrap: wrap; gap: .8rem 1.2rem; }
.services-hero__proof span { display: inline-flex; align-items: center; gap: .48rem; color: var(--ink); font-size: .82rem; font-weight: 700; }
.services-hero__proof svg { width: 1.15rem; height: 1.15rem; padding: .16rem; border-radius: 50%; background: rgba(119,189,56,.18); color: var(--green-700); fill: none; stroke: currentColor; stroke-width: 2.5; }

.services-hero__visual { position: relative; min-height: 670px; }
.services-hero__main-image { position: absolute; inset: 0 7% 8% 0; overflow: hidden; border-radius: 42px 18px 42px 42px; box-shadow: var(--shadow-lg); }
.services-hero__main-image::after { content: ""; position: absolute; inset: 42% 0 0; background: linear-gradient(transparent, rgba(5,28,15,.78)); }
.services-hero__main-image img { width: 100%; height: 100%; object-fit: cover; }
.services-hero__main-image figcaption { position: absolute; z-index: 2; right: 2rem; bottom: 2rem; left: 2rem; display: grid; gap: .42rem; color: var(--white); }
.services-hero__main-image small { color: var(--leaf-300); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.services-hero__main-image strong { max-width: 520px; font-family: var(--font-display); font-size: clamp(1.45rem,2.5vw,2.35rem); line-height: 1.08; letter-spacing: -.035em; }
.services-hero__small-image { position: absolute; z-index: 3; overflow: hidden; border: 8px solid rgba(255,255,255,.92); border-radius: 26px; background: var(--white); box-shadow: var(--shadow-md); }
.services-hero__small-image img { width: 100%; height: 100%; object-fit: cover; }
.services-hero__small-image figcaption { position: absolute; right: .65rem; bottom: .65rem; padding: .45rem .68rem; border-radius: 999px; background: rgba(8,45,24,.82); color: var(--white); font-size: .72rem; font-weight: 800; backdrop-filter: blur(8px); }
.services-hero__small-image--survey { right: 0; top: 7%; width: 36%; aspect-ratio: 1.05; }
.services-hero__small-image--agriculture { right: 2%; bottom: 0; width: 42%; aspect-ratio: 1.35; }
.services-hero__shape { position: absolute; z-index: -1; left: -6%; bottom: 0; width: 40%; aspect-ratio: 1; border-radius: 50%; background: var(--leaf-500); opacity: .18; }

.service-directory { position: sticky; top: var(--header-height); z-index: 900; border-block: 1px solid rgba(13,66,34,.08); background: rgba(255,255,255,.95); box-shadow: 0 10px 32px rgba(8,45,24,.06); backdrop-filter: blur(16px); }
.service-directory__inner { display: grid; grid-template-columns: repeat(8,minmax(116px,1fr)); overflow-x: auto; scrollbar-width: none; }
.service-directory__inner::-webkit-scrollbar { display: none; }
.service-directory a { min-width: 116px; min-height: 82px; display: grid; place-items: center; align-content: center; gap: .45rem; padding: .7rem .45rem; border-right: 1px solid var(--line); color: var(--muted); font-size: .72rem; font-weight: 800; text-align: center; text-decoration: none; transition: color var(--transition), background var(--transition); }
.service-directory a:first-child { border-left: 1px solid var(--line); }
.service-directory a:hover, .service-directory a.is-active { background: var(--green-700); color: var(--white); }
.service-directory svg { width: 1.55rem; height: 1.55rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.services-intro { background: var(--white); }
.services-intro__grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.72fr); gap: clamp(3rem,8vw,8rem); align-items: start; }
.services-intro h2 { max-width: 850px; margin-bottom: 0; }
.services-intro__copy p { font-size: 1.06rem; }
.services-intro__copy p:last-child { margin-bottom: 0; }

.services-list { background: #eef4ed; }
.service-detail { scroll-margin-top: calc(var(--header-height) + 95px); padding-block: clamp(5rem,8vw,8.5rem); background: #f8fbf7; }
.service-detail:nth-child(even) { background: #edf4eb; }
.service-detail--dark { background: var(--green-950) !important; color: var(--white); }
.service-detail__grid { display: grid; grid-template-columns: minmax(420px,.92fr) minmax(0,1.08fr); gap: clamp(3rem,7vw,7.5rem); align-items: center; }
.service-detail--reverse .service-detail__media { order: 2; }
.service-detail--reverse .service-detail__content { order: 1; }
.service-detail__media { position: relative; min-height: 520px; overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.service-detail__media::after { content: ""; position: absolute; inset: 55% 0 0; background: linear-gradient(transparent, rgba(5,28,15,.65)); pointer-events: none; }
.service-detail__media img { width: 100%; height: 100%; min-height: 520px; object-fit: cover; transition: transform 700ms var(--ease); }
.service-detail__media:hover img { transform: scale(1.035); }
.service-detail__media-label { position: absolute; z-index: 2; right: 1.5rem; bottom: 1.5rem; left: 1.5rem; display: flex; align-items: end; justify-content: space-between; gap: 1rem; color: var(--white); }
.service-detail__media-label span { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; font-size: .82rem; font-weight: 800; backdrop-filter: blur(8px); }
.service-detail__media-label strong { max-width: 260px; font-family: var(--font-display); font-size: 1.25rem; text-align: right; }
.service-detail__content { position: relative; }
.service-detail__icon { width: 68px; height: 68px; display: grid; place-items: center; margin-bottom: 1.6rem; border-radius: 22px; background: rgba(119,189,56,.16); color: var(--green-700); }
.service-detail__icon svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.service-detail h2 { max-width: 780px; margin-bottom: 1.35rem; font-size: clamp(2.35rem,4.5vw,4.8rem); }
.service-detail__lead { max-width: 780px; margin-bottom: 2rem; font-size: 1.08rem; }
.service-detail__columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem 2.8rem; }
.service-detail__columns ul { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.service-detail__columns li { position: relative; padding-left: 1.45rem; color: var(--ink); font-size: .92rem; }
.service-detail__columns li::before { content: ""; position: absolute; left: 0; top: .68em; width: 7px; height: 7px; border-radius: 50%; background: var(--leaf-500); box-shadow: 0 0 0 5px rgba(119,189,56,.13); }
.service-detail__output { display: grid; gap: .35rem; margin-top: 2.1rem; padding: 1.25rem 1.4rem; border-left: 4px solid var(--leaf-500); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: rgba(255,255,255,.72); }
.service-detail__output small { color: var(--green-700); font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.service-detail__output strong { color: var(--charcoal-950); font-size: .94rem; }
.service-detail--dark h2, .service-detail--dark h3 { color: var(--white); }
.service-detail--dark .service-detail__lead, .service-detail--dark .service-detail__columns li { color: rgba(255,255,255,.72); }
.service-detail--dark .service-detail__icon { background: rgba(183,223,120,.12); color: var(--leaf-300); }
.service-detail--dark .service-detail__output { background: rgba(255,255,255,.08); }
.service-detail--dark .service-detail__output small { color: var(--leaf-300); }
.service-detail--dark .service-detail__output strong { color: var(--white); }

.environment-steps { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1.9rem 0 0; }
.environment-steps span { padding: .7rem .9rem; border: 1px solid var(--line); border-radius: 999px; background: var(--white); color: var(--ink); font-size: .8rem; font-weight: 700; }

.service-combinations { background: var(--white); }
.combination-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.25rem; }
.combination-grid article { position: relative; min-height: 320px; display: flex; flex-direction: column; padding: 2rem; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: linear-gradient(145deg,#fbfdf9,#edf4eb); transition: transform var(--transition), box-shadow var(--transition); }
.combination-grid article:hover { transform: translateY(-5px); box-shadow: var(--shadow-sm); }
.combination-grid article > span { color: var(--green-700); font-size: .76rem; font-weight: 800; letter-spacing: .13em; }
.combination-grid h3 { margin: auto 0 .8rem; font-size: clamp(1.45rem,2vw,2rem); }
.combination-grid p { margin-bottom: 1.4rem; }
.combination-grid article > div { display: flex; gap: .65rem; }
.combination-grid svg { width: 42px; height: 42px; padding: .62rem; border-radius: 14px; background: var(--white); color: var(--green-700); fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; box-shadow: 0 8px 20px rgba(8,45,24,.08); }

.services-cta { position: relative; min-height: 520px; display: grid; align-items: center; overflow: hidden; background: var(--green-950); }
.services-cta__image { position: absolute; inset: 0; }
.services-cta__image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(8,45,24,.98) 0%,rgba(8,45,24,.92) 46%,rgba(8,45,24,.45) 100%); }
.services-cta__image img { width: 100%; height: 100%; object-fit: cover; }
.services-cta__inner { position: relative; z-index: 1; display: flex; align-items: end; justify-content: space-between; gap: 3rem; padding-block: 5rem; }
.services-cta h2 { max-width: 890px; margin-bottom: 0; color: var(--white); }
.services-cta .button { flex: 0 0 auto; }

@media (max-width: 1120px) {
  .services-hero__grid { grid-template-columns: minmax(0,.86fr) minmax(450px,1.14fr); gap: 3rem; }
  .services-hero__visual { min-height: 590px; }
  .service-detail__grid { grid-template-columns: minmax(350px,.85fr) minmax(0,1.15fr); gap: 3.5rem; }
  .service-detail__media, .service-detail__media img { min-height: 470px; }
}

@media (max-width: 960px) {
  .services-hero { min-height: auto; }
  .services-hero__grid { grid-template-columns: 1fr; }
  .services-hero__copy { max-width: 780px; }
  .services-hero__visual { min-height: 620px; }
  .service-directory { top: 72px; }
  .service-directory__inner { display: flex; }
  .service-directory a { flex: 0 0 124px; }
  .services-intro__grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .service-detail__grid { grid-template-columns: 1fr; }
  .service-detail--reverse .service-detail__media, .service-detail--reverse .service-detail__content { order: initial; }
  .service-detail__media, .service-detail__media img { min-height: 520px; }
  .combination-grid { grid-template-columns: 1fr; }
  .combination-grid article { min-height: 250px; }
  .services-cta__inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 680px) {
  .services-hero { padding-top: calc(var(--header-height) + 2.5rem); }
  .services-hero__copy h1 { font-size: clamp(3rem,16vw,4.7rem); }
  .services-hero__actions { display: grid; }
  .services-hero__visual { min-height: 490px; }
  .services-hero__main-image { inset: 0 0 6% 0; border-radius: 28px; }
  .services-hero__main-image figcaption { right: 1.2rem; bottom: 1.2rem; left: 1.2rem; }
  .services-hero__small-image--survey { top: 4%; right: -2%; width: 38%; }
  .services-hero__small-image--agriculture { right: 3%; bottom: 0; width: 44%; }
  .services-hero__small-image { border-width: 5px; border-radius: 18px; }
  .service-directory a { flex-basis: 108px; min-width: 108px; min-height: 76px; }
  .service-detail { scroll-margin-top: 156px; padding-block: 4.5rem; }
  .service-detail__media, .service-detail__media img { min-height: 360px; }
  .service-detail__media { border-radius: 24px; }
  .service-detail__columns { grid-template-columns: 1fr; gap: .7rem; }
  .service-detail h2 { font-size: clamp(2.3rem,12vw,3.6rem); }
  .service-detail__icon { width: 58px; height: 58px; border-radius: 18px; }
  .service-detail__icon svg { width: 29px; height: 29px; }
  .service-detail__media-label { right: 1rem; bottom: 1rem; left: 1rem; }
  .service-detail__media-label strong { font-size: 1rem; }
  .service-detail__media-label span { width: 44px; height: 44px; }
  .combination-grid article { padding: 1.5rem; }
  .services-cta { min-height: 580px; }
  .services-cta__image::after { background: linear-gradient(180deg,rgba(8,45,24,.92),rgba(8,45,24,.78)); }
}