/* Services overview: extends the existing Varn's theme. */
html:has(.varns-services-page) { scroll-behavior: auto; }
/* Overlay the hero at the top; retain the shared solid header after scrolling. */
body:has(.varns-services-page) .varns-site-header:not(.is-scrolled) { background: transparent; box-shadow: none; }
.varns-services-page { padding-block-start: 0; }
.varns-services-hero { --varns-services-hero-space: clamp(3.5rem, 6vw, 6rem); position: relative; isolation: isolate; padding-block: calc(var(--varns-header-height) + var(--varns-services-hero-space)) var(--varns-services-hero-space); color: var(--varns-white); background: var(--varns-forest-900); }
.varns-services-hero__image { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 59%; }
.varns-services-hero::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(10, 17, 11, .94), rgba(10, 17, 11, .78) 40%, rgba(10, 17, 11, .14) 82%); }
.varns-services-hero::after { content: ''; position: absolute; inset-inline: 0; bottom: 0; height: 5px; background: linear-gradient(90deg, var(--varns-orange-500) 65%, var(--varns-green-600) 65%); }
.varns-services-hero h1 { font-size: clamp(3rem, 5.7vw, 5.7rem); text-transform: uppercase; line-height: .98; max-width: 16ch; }
.varns-services-hero h1 span { display: block; color: var(--varns-green-500); }
.varns-services-hero__lead { max-width: 43ch; margin-block: 1.4rem 1.8rem; color: rgba(255,255,255,.88); font-size: var(--varns-text-lead); }
.varns-service-index { background: var(--varns-forest-900); color: var(--varns-white); }
.varns-service-index > div { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); }
.varns-service-index a { display: flex; align-items: center; gap: .8rem; padding: 1.4rem 1.5rem; color: inherit; text-decoration: none; font-family: var(--varns-font-display); font-size: 1.25rem; text-transform: uppercase; font-weight: 700; border-inline-end: 1px solid rgba(255,255,255,.15); }
.varns-service-index a:first-child { padding-inline-start: 0; }
.varns-service-index a:last-child { border: 0; }
.varns-service-index a:hover { color: var(--varns-orange-500); }
.varns-service-index svg { width: 1.8rem; height: 1.8rem; flex-shrink: 0; color: var(--varns-orange-500); }
.varns-service-index svg:last-child { width: 1.1rem; height: 1.1rem; margin-inline-start: auto; transform: rotate(90deg); }
.varns-services-overview { padding-block: clamp(3rem,5vw,5rem); }
.varns-services-overview__heading { display: grid; grid-template-columns: 1.2fr 1fr; gap: 3rem; align-items: end; margin-block-end: 2.5rem; }
.varns-services-overview__heading h2 { font-size: clamp(2.4rem,4vw,4rem); text-transform: uppercase; }
.varns-services-overview__heading h2 span { display: block; color: var(--varns-green-700); }
.varns-services-overview__heading > p { max-width: 49ch; justify-self: end; color: var(--varns-muted-600); }
.varns-services-panels { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem; }
.varns-service-panel { scroll-margin-top: calc(var(--varns-header-height) + 1.25rem); background: var(--varns-cream-50); border: 1px solid var(--varns-border-200); display: flex; flex-direction: column; }
.varns-service-panel__photo { position: relative; overflow: hidden; margin: 0; aspect-ratio: 2.1 / 1; border-bottom: 4px solid var(--varns-orange-600); }
.varns-service-panel__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 58%; }
#bush-hogging .varns-service-panel__photo img { object-position: center 64%; }
#fence-services .varns-service-panel__photo img { object-position: center 36%; }
.varns-service-panel__photo figcaption { position: absolute; bottom: 0; inset-inline: 0; padding: 1.5rem 1.4rem .65rem; color: white; background: linear-gradient(transparent,rgba(0,0,0,.8)); font-size: .85rem; }
.varns-service-panel__body { padding: clamp(1.3rem,2.3vw,2.2rem); flex: 1; display: flex; flex-direction: column; }
.varns-service-panel h3 { font-size: clamp(2rem,2.7vw,2.8rem); text-transform: uppercase; }
.varns-service-panel__body > p { margin-block: .9rem 1.2rem; color: var(--varns-muted-600); }
.varns-service-panel__benefits { list-style: none; display: grid; gap: .45rem; padding: 0; margin: 0 0 1.5rem; font-size: var(--varns-text-sm); }
.varns-service-panel__benefits li { display: flex; gap: .65rem; align-items: start; }
.varns-service-panel__benefits svg { width: 1.1rem; height: 1.1rem; flex-shrink: 0; margin-top: .25rem; color: var(--varns-green-700); }
.varns-service-panel .varns-text-link { margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--varns-border-200); justify-content: space-between; }
.varns-services-overview__foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding-top: 1.8rem; }
.varns-services-overview__foot p { color: var(--varns-muted-600); }
.varns-services-scope { padding-block: clamp(3rem,5vw,5rem); }
.varns-services-scope .varns-eyebrow--orange { color: var(--varns-orange-500); }
.varns-services-scope__layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,7vw,7rem); align-items: center; }
.varns-services-scope h2 { text-transform: uppercase; font-size: clamp(2.8rem,4.7vw,4.8rem); margin-bottom: 1.5rem; }
.varns-services-scope h2 span { display: block; color: var(--varns-green-500); }
.varns-services-scope__layout > div > p:last-child { max-width: 49ch; }
.varns-services-scope__details { margin: 0; }
.varns-services-scope__details > div { padding-block: 1.2rem; border-bottom: 1px solid var(--varns-border-dark); }
.varns-services-scope__details > div:first-child { padding-top: 0; }
.varns-services-scope__details dt { font-family: var(--varns-font-display); font-size: 1.5rem; font-weight: 700; text-transform: uppercase; }
.varns-services-scope__details dd { margin: .35rem 0 0; color: rgba(255,255,255,.75); }
.varns-services-page .varns-process-section { padding-block: clamp(3rem,5vw,5rem); }
.varns-services-page .varns-process-section h2 { font-size: clamp(2.3rem,3.6vw,3.5rem); }
.varns-services-page .varns-quote-cta { background: var(--varns-forest-900) url('../../images/about/forest-banner.webp') center 65% / cover no-repeat; }
.varns-services-page .varns-quote-cta::after { display: none; }
@media (max-width: 63.99rem) {
  .varns-service-index a { padding-inline: .75rem; font-size: 1.08rem; gap: .4rem; }
  .varns-service-index svg:last-child { display: none; }
  .varns-services-overview__heading { gap: 2rem; }
  .varns-services-panels { gap: 1.25rem; }
}
@media (max-width: 47.99rem) {
  .varns-services-hero { --varns-services-hero-space: 3rem; }
  .varns-services-hero::before { background: rgba(10,17,11,.78); }
  .varns-services-hero h1 { font-size: clamp(2.7rem,10.8vw,4.5rem); }
  .varns-service-index > div { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .varns-service-index a { padding: 1rem .5rem; font-size: 1.1rem; border-bottom: 1px solid rgba(255,255,255,.15); }
  .varns-service-index a:nth-child(even) { border-inline-end: 0; }
  .varns-service-index a:nth-child(odd) { padding-inline-start: 0; }
  .varns-services-overview__heading, .varns-services-panels, .varns-services-scope__layout { grid-template-columns: minmax(0,1fr); }
  .varns-services-overview__heading { gap: 1rem; }
  .varns-services-overview__heading > p { justify-self: start; }
  .varns-service-panel__photo { aspect-ratio: 1.65 / 1; }
  .varns-services-overview__foot { gap: 1.2rem; }
}