/* Version 2.2: photographs at their correct proportions and shared quote forms. */
.service-hero-image {height:auto; min-width:0; width:100%; aspect-ratio:4/3; overflow:hidden; background:#eeeae1}
.service-hero-image img {display:block; width:100%; height:100%; object-fit:cover; object-position:50% 45%; image-rendering:auto}
.service-image img, .story-image img, .hero-backdrop img {image-rendering:auto}
.quote-section {background:#f3f2ec; margin-top:32px; scroll-margin-top:130px}
.quote-grid {display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:70px; align-items:start}
.quote-intro {padding-top:28px}
.quote-intro h2 {font-family:var(--serif,Georgia,serif); font-size:clamp(34px,4vw,54px); line-height:1.1; margin:18px 0 24px}
.quote-intro p {font-size:16px; line-height:1.8; max-width:420px; margin-bottom:24px}
.quote-intro .text-link {font-size:20px}
.quote-form-panel {background:#fff; padding:36px; border:1px solid #e2e3dc}
.contact-message {scroll-margin-top:130px}
.contact-form .form-grid {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 20px}
.contact-form .form-field {min-width:0; margin-bottom:17px}
.contact-form .form-grid .form-field {margin-bottom:0}
.contact-form .form-grid {margin-bottom:17px}
.contact-form .form-field>label {display:block; margin:0 0 7px; font-size:13px; font-weight:600}
.contact-form .form-field input:not([type=checkbox]),.contact-form .form-field select,.contact-form .form-field textarea {width:100%; min-width:0; box-sizing:border-box; border:1px solid #c9cec8; border-radius:3px; background:#fff; padding:12px 13px; color:#23352a; font:inherit; font-size:16px; line-height:1.45; margin:0}
.contact-form .form-field textarea {resize:vertical; min-height:136px}
.contact-form .form-field input:focus,.contact-form .form-field select:focus,.contact-form .form-field textarea:focus {outline:2px solid #16482f; outline-offset:2px; border-color:#16482f}
.contact-form .form-field [aria-invalid=true] {border-color:#ad342c}
.contact-form .form-field>label.privacy-check {display:flex; gap:10px; align-items:flex-start; margin-top:16px; font-weight:400; font-size:12px; line-height:1.7}
.contact-form .privacy-check input {width:18px; height:18px; flex:0 0 18px; margin:2px 0 0; accent-color:#16482f}
.contact-form .privacy-check a {text-decoration:underline; text-underline-offset:3px; color:#16482f}
.contact-form .field-error {display:block; margin-top:6px; font-size:12px; line-height:1.4; color:#9b2921}
.contact-form [hidden] {display:none!important}
.contact-form .vt-submit {width:100%; display:flex; align-items:center; justify-content:center; gap:12px; min-height:50px; cursor:pointer}
.contact-form .vt-submit:disabled {opacity:.75; cursor:wait}
.vt-button-spinner {display:none; width:17px; height:17px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%}
.is-submitting .vt-button-spinner {display:inline-block; animation:vt-spin .75s linear infinite}
.is-submitting .vt-submit>svg {display:none}
.contact-form .form-result {margin:18px 0 0; padding:15px 17px; font-size:14px; line-height:1.65; border:1px solid transparent; border-radius:4px}
.contact-form .form-result.success {color:#15452b; border-color:#a8cdb6; background:#edf7f0}
.contact-form .form-result.error {color:#80261f; border-color:#dbb4ad; background:#fff3f1}
.contact-form .form-result:focus {outline:2px solid currentColor; outline-offset:2px}
.contact-form .form-help {font-size:11px; line-height:1.6; color:#566459; margin-top:12px}
.contact-form .contact-privacy-note {font-size:12px; line-height:1.65; padding:12px 0; border-top:1px solid #dfe2dc; border-bottom:1px solid #dfe2dc}
.contact-privacy-note summary {cursor:pointer; font-weight:600; color:#16482f}
.contact-privacy-note p {font-size:12px; line-height:1.7; margin:12px 0 0}
@keyframes vt-spin {to {transform:rotate(360deg)}}
@media(max-width:1000px) {.quote-grid {gap:30px; grid-template-columns:1fr 1.2fr}.quote-form-panel {padding:26px}.quote-intro h2 {font-size:39px}}
@media(max-width:680px) {.service-hero-image {height:auto; aspect-ratio:4/3}.quote-grid {grid-template-columns:1fr; gap:24px}.quote-intro {padding-top:0}.quote-intro h2 {font-size:36px}.quote-intro p {font-size:14px}.quote-form-panel {padding:23px 18px}.contact-form .form-grid {grid-template-columns:1fr; gap:17px}.quote-section {margin-top:0; scroll-margin-top:100px}.contact-message {scroll-margin-top:100px}.contact-form .form-result {font-size:13px}}
@media(prefers-reduced-motion:reduce) {.vt-button-spinner {animation:none}}

/* 2.3 — continuous pointer path from the main item to the product panel. */
@media (min-width:1001px) {
  .site-header .header-inner {align-items:stretch; position:relative}
  .site-header .header-inner>.brand {align-self:center}
  .site-header .site-navigation {align-items:stretch}
  .site-navigation>.menu {align-items:stretch; align-self:stretch; margin-block:0}
  .site-navigation>.header-cta {align-self:center}
  .site-navigation .menu>li {align-items:center; align-self:stretch; position:static}
  .site-navigation .menu>li>.sub-menu {
    top:calc(100% - 1px); right:0; left:auto;
    width:700px; max-width:calc(100vw - 40px);
    max-height:var(--vt-submenu-space,calc(100dvh - 160px));
    overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable;
    padding:22px; gap:8px 16px;
  }
  .site-navigation .menu .sub-menu a {min-height:85px; gap:14px}
  .site-navigation .menu .sub-menu .menu-product-image {width:72px!important; height:72px!important}
  .site-navigation .menu .sub-menu strong {font-size:13px}
  .site-navigation .menu .sub-menu small {font-size:11px}
}
@media (max-width:1000px) {
  .site-header .site-navigation {max-height:var(--vt-mobile-menu-space,calc(100dvh - 180px)); overscroll-behavior:contain}
  .site-navigation .menu .sub-menu {max-height:none; overflow:visible}
}
/* An explicit state makes Escape / the arrow button work even while hovered. */
.js .site-navigation .menu>li>.sub-menu {display:none}
.js .site-navigation .menu>li.is-expanded>.sub-menu {display:grid}
.submenu-toggle {cursor:pointer; touch-action:manipulation}
.submenu-toggle:focus-visible,.nav-toggle:focus-visible {outline:2px solid var(--forest); outline-offset:4px}
/* Full native photographs are selected through srcset, not enlarged menu crops. */
.service-hero-image {aspect-ratio:3/2}
.service-hero-image img {object-position:50% 50%}
.related-products .service-image {height:auto; aspect-ratio:3/2}
.inspiration-grid img {object-fit:cover; object-position:center}
@media(max-width:680px) {
  .service-hero-image {aspect-ratio:3/2}
  .related-products .service-image {aspect-ratio:3/2}
}