/* V6: a little more warmth and depth, with Beagle's photographs still leading. */
:root {
  --v6-forest: #123d31;
  --v6-mint: #d0edda;
  --v6-honey: #edc78b;
  --v6-photo-shadow: 0 2px 5px #173f350a, 0 12px 28px #173f3512;
}

.header {
  background: #f8f7f1;
  box-shadow: 0 3px 16px #123d310b;
}
.brand img { box-shadow: 0 0 0 1px #153e3420; }
h1, .v5-section-heading h2, .sv5-section-heading h2 { font-weight: 800; }

/* High-contrast CTAs; hover changes color and depth without moving the page. */
.button {
  border-radius: 6px;
  min-height: 48px;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.button.primary {
  background: var(--v6-forest);
  border-color: var(--v6-forest);
  color: #fff;
  box-shadow: 0 3px 7px #123d3114;
}
.button.primary:hover {
  background: #245e47;
  border-color: #245e47;
  box-shadow: 0 5px 13px #123d3126;
}
.button.light {
  background: var(--v6-mint);
  border-color: #e3f4e9;
  color: #123d31;
  box-shadow: 0 4px 12px #061e2526;
}
.button.light:hover {
  background: #e4f5e9;
  border-color: #fff;
  box-shadow: 0 6px 17px #061e2538;
}
.button.secondary { border-color: #829b89; background: #ffffff52; }
.button.secondary:hover { background: #e6efdf; border-color: #456b55; }
.text-link { border-bottom-color: #7e9b83; }
.text-link:hover { color: #245e47; border-bottom-color: #9a6329; }
#main-nav > a[aria-current] { text-decoration-thickness: 2px; }

/* A small warm accent, brighter mint, and a quieter frame for real project work. */
.v5-hero { border-bottom: 3px solid #edc78b; }
.v5-hero-content .eyebrow { display: flex; align-items: center; gap: 12px; color: #dbefde; }
.v5-hero-content .eyebrow::before {
  content: '';
  width: 27px;
  height: 3px;
  flex-shrink: 0;
  background: var(--v6-honey);
  border-radius: 2px;
}
.v5-hero h1 { text-shadow: 0 2px 18px #051f2726; }
.v5-hero-project {
  background: #0c3028ed;
  border-color: #bbd2bd7a;
  box-shadow: 0 5px 17px #08231e29;
}
.v5-hero-project > span:last-child { color: var(--v6-honey); }
.v5-hero-project:hover { border-color: #edc78b; background: #103d31; }
.v5-hero-picker button { background: #0c3028ed; border-color: #a9c4ad99; }
.v5-hero-picker button[aria-pressed="true"] {
  color: #123d31;
  background: var(--v6-mint);
  border-color: #edc78b;
  box-shadow: 0 0 0 1px #edc78b;
}
.v5-hero-actions > a:not(.button), .v5-contact-banner a:not(.button) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.v5-hero-actions > a:not(.button):hover, .v5-contact-banner a:not(.button):hover {
  text-decoration: underline;
  text-decoration-color: var(--v6-honey);
  text-underline-offset: 5px;
}
.v5-photo, .v5-service-image, .sv5-photo-open,
.exp-project-media, .exp-comparison-stage, .v5-case-photo > a {
  box-shadow: var(--v6-photo-shadow), 0 0 0 1px #153e3414;
}
.v5-service-image { border-radius: 8px; }
.v5-service-image > span, .sv5-photo-badge, .exp-photo-tag {
  background: #fbf9ee;
  color: #153e34;
  box-shadow: 0 2px 8px #0c30281a;
}
.v5-service-columns h3 a:hover, .v5-work h3 a:hover {
  text-decoration: underline;
  text-decoration-color: #a86d2d;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}
.v5-transform { background: #e1ecdc; border-block: 1px solid #d1dfcb; }
.v5-project-switch button[aria-pressed="true"],
.exp-comparison-controls button[aria-pressed="true"],
.exp-filters button[aria-pressed="true"] { background: #123d31; }
.v5-project-switch button:not([aria-pressed="true"]):hover { background: #f6f8ef; border-color: #56765c; }
.v5-contact-banner {
  background: #123d31;
  box-shadow: 0 9px 27px #173f3517;
  border: 1px solid #345c47;
  border-radius: 9px;
}
.v5-contact-banner .eyebrow { color: #edc78b; }
.sv5-page .v5-contact-banner .eyebrow { color: #edc78b; }
.sv5-yard-service { border-top-color: #70977b; }
.sv5-yard-service--drainage { border-top-color: #a57032; }
.sv5-sump-feature { background: #123d31; }
.sv5-sump-copy .eyebrow { color: #edc78b; }
.sv5-page .text-link, .sv5-photo figcaption .text-link,
.sv5-related a, .sv5-enlarge, .sv5-project-rail .sv5-enlarge { min-height: 44px; }

/* The form has a clear boundary, comfortable controls, and explicit feedback. */
.project-form {
  background: #fffef9;
  border: 1px solid #b3c6b8;
  border-top: 4px solid #c8944e;
  border-radius: 9px;
  box-shadow: 0 10px 30px #173f3510;
}
.field label { color: #153e34; }
.field input, .field select, .field textarea {
  min-height: 48px;
  border-color: #7b9382;
  border-radius: 5px;
  background: #fff;
  color: #153e34;
}
.field input::placeholder, .field textarea::placeholder { color: #617168; opacity: 1; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: #456c53; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: #245e47; }
.project-form .button[type="submit"] { min-height: 50px; }
.button:disabled, .button[aria-disabled="true"] {
  cursor: wait;
  background: #496756;
  border-color: #496756;
  color: #fff;
  box-shadow: none;
}
#form-status { color: #234e3c; font-size: 14px; line-height: 1.65; margin-top: 15px; }
#form-status:empty, #form-errors:empty, .field-error:empty { display: none; }
.form-success {
  padding: 20px;
  margin-top: 22px;
  background: #e8f3e8;
  color: #163e30;
  border: 1px solid #789b7f;
  border-left: 4px solid #2d6c45;
  border-radius: 6px;
  scroll-margin-top: 110px;
}
.form-success h3 { font-size: 23px; margin-bottom: 10px; }
.form-success p { color: #234d38; font-size: 15px; }
.form-success .button { margin-top: 15px; }
#form-errors {
  padding: 14px 16px;
  margin-top: 18px;
  background: #fff2e9;
  color: #85391f;
  border: 1px solid #bb7959;
  border-left: 4px solid #9c4828;
  border-radius: 5px;
  font-size: 14px;
  line-height: 1.65;
  scroll-margin-top: 110px;
}
#form-errors p, #form-errors a, .field-error { color: #85391f; }
#form-errors ul { margin-top: 8px; padding-left: 20px; }
.field-error { font-size: 13px; line-height: 1.6; margin-top: 7px; }
.field [aria-invalid="true"] { border-color: #9c4828; box-shadow: 0 0 0 1px #9c4828; }

/* Focus rings remain distinct on cream, photographs, and forest green. */
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid #996022;
  outline-offset: 4px;
}
.utility a:focus-visible, .v5-hero a:focus-visible, .v5-hero button:focus-visible,
.v5-contact-banner a:focus-visible, .sv5-sump-feature a:focus-visible {
  outline-color: #f4d8aa;
}
.v5-photo:focus-visible, .exp-project-photo:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -6px;
  box-shadow: 0 0 0 3px #996022;
}
.mobile-contact { box-shadow: 0 -4px 18px #173f3510; }
.mobile-contact a { min-height: 44px; }
.mobile-contact a:last-child { background: #123d31; border-color: #123d31; }
.mobile-contact a:last-child:hover { background: #245e47; }
.breadcrumbs { align-items: center; }
.breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 600px) {
  .v5-hero-content .eyebrow { gap: 9px; }
  .v5-hero-content .eyebrow::before { width: 21px; }
  .v5-hero-actions { row-gap: 7px; }
  .form-success { padding: 18px; }
  .form-success h3 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .button { transition: none; }
  .v5-photo:hover > img, .sv5-photo-open:hover > img { transform: none; }
  .v5-after-crop:hover > img { transform: translateX(-50%); }
}

/* Landscaping inspiration is visibly separate from original project proof. */
.v6-landscape-stock{margin:0;min-width:0}
.v6-landscape-stock-image{position:relative;overflow:hidden;border-radius:10px;background:#dce6d8}
.v6-landscape-stock-image img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 50%}
.v6-landscape-stock-image>span{position:absolute;left:16px;bottom:16px;background:#f8f7f2;color:#173f35;font-size:12px;font-weight:750;padding:8px 12px;border-radius:4px}
.v6-landscape-stock figcaption{color:#4b685a;font-size:12px;line-height:1.65;margin-top:10px}
.v6-landscape-stock figcaption a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:3px}
.v6-yard-plan{padding:44px 0;background:#173f35;color:#fff;margin-bottom:32px}
.v6-yard-plan-heading{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end}
.sv5-page .v6-yard-plan .eyebrow{color:#cae6d0}
.v6-yard-plan-heading h2{margin-bottom:0}
.sv5-page .v6-yard-plan p:not(.eyebrow){color:#e2ece3}
.v6-yard-steps{list-style:none;padding:0;margin:32px 0 18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.v6-yard-steps li{border-top:1px solid #6d927b;padding-top:18px;min-width:0}
.v6-yard-steps li>span{display:block;color:#f4d8aa;font-size:12px;font-weight:750;margin-bottom:13px}
.v6-yard-steps h3{margin-bottom:10px}
.sv5-page .v6-yard-steps p{font-size:15px}
.sv5-page .v6-yard-plan .text-link{color:#fff;min-height:44px}
.v6-yard-plan a:focus-visible{outline-color:#f4d8aa}
@media(max-width:760px){.v6-yard-plan{padding:30px 0}.v6-yard-plan-heading{grid-template-columns:1fr;gap:18px}.v6-yard-steps{grid-template-columns:1fr;gap:20px;margin-top:26px}.v6-landscape-stock-image>span{left:12px;bottom:12px}}
