@import url('./fonts/fonts.css');

:root {
  --cream: #ebe4d4;
  --olive: #4a5343;
  --ink: #212725;
  --gray: #4c4e50;
  --heading-size: 50.52px;
  --small-heading: 21.33px;
  color: #333;
  font: 500 16px/1.8em 'Manrope', sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
button, input, textarea { font: inherit; }
button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
a:hover { color: #f2ad5c; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid #f2ad5c; outline-offset: 4px; }
h1, h2, h3, p, figure, blockquote { margin: 0; }
h1, h2, h3 { font-family: 'Marcellus', sans-serif; font-weight: 400; }
h1, h2 { color: var(--ink); font-size: var(--heading-size); line-height: 1.2em; }
h3 { font-size: var(--small-heading); line-height: 1.5em; }
img, svg { vertical-align: middle; }
[hidden] { display: none !important; }

/* Shared accessibility and progressive enhancement. */
.mobile-only, .button.mobile-only { display: none; }
.visually-hidden, .skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; z-index: 2000; background: white; padding: 10px 20px; }
.lucide { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; }
.quote-controls { display: contents; }
.quote-carousel:not(.is-enhanced) .quote-track { display: grid; transform: none; }
.quote-carousel:not(.is-enhanced) .quote-controls { display: none; }

/* Small-screen composition, built from the approved brand and content. */
@media (max-width: 1024px) {
  :root { --page-gutter: 20px; --heading-size: 1.875rem; --small-heading: 1.375rem; --morph-ease: cubic-bezier(.22,.8,.25,1); line-height: 1.65; }
  .desktop-copy, .top-strip, .site-logo, .appointment, .hero-space, .portrait-image, .intro-copy > hr, .biography > h3, .section-rule, .eyebrow, .contact-caption, .footer-divider, .footer-menu-toggle { display: none; }
  .mobile-copy { display: inline; }
  .mobile-only { display: block; }
  .button.mobile-only { display: flex; }
  .site-header .appointment { display: none; }
  h1, h2, h3 { text-wrap: balance; overflow-wrap: break-word; hyphens: auto; }
  p { text-wrap: pretty; overflow-wrap: break-word; hyphens: auto; }
  .hero-phrase { display: block; }
  button, a { touch-action: manipulation; }
  button:focus-visible, a:focus-visible, summary:focus-visible, .quote-carousel:focus-visible { outline: 2px solid var(--olive); outline-offset: 4px; }
  .button { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; padding: 13px 20px; border: 0; border-radius: 6px; background: var(--olive); color: white; font-size: 1rem; font-weight: 700; line-height: 1.5; text-align: center; transition: background .18s; }
  .button:active { background: #394334; }
  .button:hover, .button:focus-visible { color: white; }
  .site-header { position: relative; padding: 20px var(--page-gutter); }
  .header-inner { max-width: 720px; margin: auto; }
  .brand { display: inline-flex; align-items: center; min-height: 48px; }
  .wordmark { display: block; width: 114px; height: 38px; background: var(--olive); mask: url('./images/logo.png') left top / 114px auto no-repeat; }
  .homepage .site-header { position: absolute; z-index: 5; inset: 0 0 auto; background: transparent; }
  .homepage .wordmark { background: #fff; }
  .homepage .brand:focus-visible { outline-color: #fff; }
  .hero { position: relative; isolation: isolate; overflow: hidden; background: #303131; border-radius: 0 0 24px; padding: 0 var(--page-gutter); }
  .hero-photo-mobile { position: absolute; z-index: -2; top: 0; left: calc(50% - 1980px); width: 3072px; height: 1024px; max-width: none; object-fit: contain; }
  .hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgb(20 23 21 / .04) 0, rgb(20 23 21 / .04) 210px, rgb(20 23 21 / .65) 350px, rgb(20 23 21 / .94) 600px, #202522 1024px); }
  .hero-inner { max-width: 560px; margin: auto; min-height: min(780px, 100svh); display: flex; align-items: flex-end; }
  .hero-copy { width: 100%; padding: 310px 0 32px; display: flex; flex-direction: column; gap: 24px; }
  .hero h1 { margin: 0 0 16px; color: #fff; font-size: clamp(2rem, 8.5vw, 2.5rem); line-height: 1.14; letter-spacing: -.018em; }
  .hero p { max-width: 34em; color: #f3f3ed; font-size: 1rem; font-weight: 400; line-height: 1.6; hyphens: none; }
  .hero-actions { display: block; }
  .hero-contact:focus-visible { outline-color: var(--cream); }
  .introduction, .benefits, .contact { padding: 56px var(--page-gutter); }
  .intro-inner, .benefits-inner, .contact-inner, .footer-banner-inner, .footer-bottom-inner { max-width: 720px; margin: auto; }
  .intro-inner { display: grid; gap: 28px; }
  .portrait { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; }
  .portrait-mobile { display: block; width: 88px; height: 110px; flex: 0 0 88px; object-fit: cover; object-position: center top; border-radius: 6px 6px 20px 6px; }
  .portrait-caption { display: flex; flex: 1 1 10rem; flex-direction: column; gap: 4px; min-width: 0; overflow-wrap: break-word; }
  .portrait-caption strong { font: 400 1.25rem/1.35 'Marcellus', sans-serif; color: var(--olive); }
  .portrait-caption span { font-size: .875rem; color: var(--gray); }
  .intro-copy { min-width: 0; display: flex; flex-direction: column; gap: 24px; }
  .intro-message h2 { margin-bottom: 24px; font-size: 1.875rem; line-height: 1.25; letter-spacing: -.012em; }
  .intro-message p, .bio-text { color: var(--gray); font-size: 1rem; font-weight: 400; line-height: 1.65; }
  .biography { background: #f4f3ed; border-radius: 8px; }
  .bio-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 16px; min-height: 56px; border: 0; background: transparent; color: var(--olive); font: 600 .9375rem/1.5 'Manrope', sans-serif; text-align: left; }
  .bio-plus, .benefit-plus { position: relative; display: block; width: 20px; height: 20px; flex: 0 0 20px; }
  .bio-plus::before, .bio-plus::after, .benefit-plus::before, .benefit-plus::after { content: ''; position: absolute; top: 9px; left: 3px; height: 1.5px; width: 14px; background: currentColor; transition: transform .25s var(--morph-ease); }
  .bio-plus::after, .benefit-plus::after { transform: rotate(90deg); }
  [aria-expanded='true'] .bio-plus::after, .benefit[open] .benefit-plus::after { transform: rotate(0); }
  .bio-text { padding: 0 16px 12px; overflow: hidden; }
  .bio-text p { margin-bottom: 16px; }
  .bio-text p:last-child { margin-bottom: 0; }
  .offers { padding: 48px var(--page-gutter); background: var(--olive); border-radius: 0 24px 0 0; }
  .offer-scene { display: none; }
  .section-heading { max-width: 720px; margin: 0 auto 28px; text-align: left; }
  .section-heading h2 { font-size: 2rem; line-height: 1.2; letter-spacing: -.015em; }
  .offers h2 { color: #fff; }
  .offer-grid { max-width: 720px; margin: auto; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .offer-card { min-width: 0; padding: 24px; background: #fafaf7; border-radius: 8px; }
  .offer-icon { color: var(--olive); margin-bottom: 16px; }
  .offer-icon .lucide { width: 32px; height: 32px; display: block; }
  .offer-text h3 { font-size: 1.375rem; line-height: 1.3; margin-bottom: 12px; color: var(--ink); }
  .offer-text p { color: var(--gray); font-size: 1rem; font-weight: 400; line-height: 1.6; }
  .offer-contact { max-width: 720px; margin: 24px auto 0; border: 1px solid #c6cbbf; }
  .offers :focus-visible { outline-color: var(--cream); }
  .benefit-grid { display: grid; gap: 12px; }
  .benefit { min-width: 0; background: #f4f3ed; border-radius: 8px; color: var(--olive); transition: background-color .25s, border-radius .3s var(--morph-ease); }
  .benefit[open] { background: var(--olive); color: #fff; border-radius: 8px 16px 8px 8px; }
  .benefit:nth-child(even)[open] { border-radius: 16px 8px 8px 8px; }
  .benefit summary { display: flex; align-items: center; gap: 12px; padding: 18px 16px; min-height: 64px; list-style: none; cursor: pointer; font-size: .9375rem; font-weight: 600; line-height: 1.5; touch-action: manipulation; }
  .benefit summary::-webkit-details-marker { display: none; }
  .benefit summary > .lucide { width: 24px; height: 24px; flex: 0 0 24px; }
  .benefit summary > span:not(.benefit-plus) { flex: 1; min-width: 0; }
  .benefit[open] summary:focus-visible { outline-color: var(--cream); }
  .benefit-detail { padding: 0 16px 24px; }
  .benefit-statement { font: 400 1.375rem/1.4 'Marcellus', sans-serif; color: white; hyphens: auto; }
  .benefit-detail p + p { margin-top: 12px; color: #e7e5da; font-size: 1rem; font-weight: 400; line-height: 1.6; }
  .quotes { padding: 40px var(--page-gutter) 32px; background: var(--olive); border-radius: 0 0 0 24px; }
  .quotes-inner { max-width: 720px; margin: auto; }
  .quote-mark { width: 44px; height: 44px; margin: 0 auto 24px; mask: url('./images/quote-mark.png') center / contain no-repeat; background: linear-gradient(125deg,#8c6931 3%,#d8b668 22%,#fff0b9 31%,#b98d40 43%,#f2d99b 54%,#9c7234 66%,#e7c779 79%,#fff0b9 89%,#b48839); }
  .quote-window { overflow: hidden; }
  .quote-track { display: flex; align-items: stretch; transition: transform .3s var(--morph-ease); }
  .quote-slide { flex: 0 0 100%; min-width: 0; text-align: center; display: flex; flex-direction: column; justify-content: space-between; gap: 20px; padding: 0 0 24px; }
  .quote-slide blockquote { font: 400 1.625rem/1.4 'Marcellus', sans-serif; color: var(--cream); text-wrap: balance; }
  .quote-slide figcaption { font-size: .875rem; color: white; }
  .quote-controls { display: flex; gap: 8px; justify-content: center; align-items: center; }
  .quote-arrow, .quote-dots button { display: grid; place-items: center; position: relative; width: 48px; height: 48px; padding: 0; border: 0; background: transparent; color: white; border-radius: 6px; }
  .quote-arrow:active, .quote-dots button:active { background: #ffffff1a; }
  .quote-arrow svg { width: 12px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
  .quote-previous { order: 0; }
  .quote-next { order: 2; }
  .quote-dots { order: 1; display: flex; gap: 8px; }
  .quote-dots button::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #ffffff66; }
  .quote-dots button[aria-pressed='true']::before { background: white; }
  .quotes :focus-visible { outline-color: var(--cream); }
  .contact { scroll-margin-top: 24px; }
  .contact-inner { display: flex; flex-direction: column; gap: 32px; }
  .contact-copy { order: -1; }
  .contact-message h2 { font-size: 2rem; line-height: 1.2; margin-bottom: 16px; }
  .contact-message p { color: var(--gray); font-size: 1rem; font-weight: 400; }
  .contact-details { list-style: none; margin: 24px 0 0; padding: 0; color: var(--olive); font-size: .9375rem; font-weight: 500; }
  .contact-details li { min-height: 48px; display: flex; align-items: center; gap: 12px; }
  .contact-details svg { width: 22px; height: 22px; flex: 0 0 22px; }
  .contact-details a { min-height: 48px; display: inline-flex; align-items: center; text-decoration: underline; text-underline-offset: 4px; }
  .contact-details a:hover { color: var(--olive); }
  #contact-form { display: grid; gap: 20px; }
  .form-field { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
  .form-field label { position: static; clip-path: none; width: auto; height: auto; overflow: visible; white-space: normal; color: var(--gray); font-size: .875rem; font-weight: 600; }
  #contact-form input, #contact-form textarea { width: 100%; min-width: 0; border: 1px solid #a8ad9e; border-radius: 6px; background: #fafaf7; color: var(--ink); padding: 13px 16px; font-size: 1rem; line-height: 1.5; }
  #contact-form input { min-height: 52px; }
  #contact-form textarea { min-height: 160px; height: 160px; resize: vertical; }
  #contact-form ::placeholder { color: transparent; }
  #contact-form input:focus, #contact-form textarea:focus { outline: 2px solid var(--olive); outline-offset: 2px; background: white; }
  .form-notice { color: var(--olive); font-size: .9375rem; }
  .footer-banner { padding: 36px var(--page-gutter); background: var(--olive); border-radius: 0 24px 0 0; }
  .footer-banner h2 { color: white; font-size: 1.625rem; line-height: 1.35; max-width: 27em; }
  .footer-bottom { padding: 20px var(--page-gutter) max(24px, env(safe-area-inset-bottom)); background: var(--cream); }
  .footer-links { display: flex; flex-wrap: wrap; gap: 0 20px; }
  .footer-links a { display: inline-flex; align-items: center; min-height: 48px; color: var(--olive); font-size: .875rem; }
  .copyright { color: var(--gray); font-size: .8125rem; margin-top: 16px; }
  .legal-content { max-width: 784px; margin: auto; padding: 16px var(--page-gutter) 48px; color: var(--gray); overflow-wrap: anywhere; font-size: 1rem; font-weight: 400; }
  .legal-content h1 { font-size: 2rem; margin-bottom: 24px; }
  .legal-content h2 { font-size: 1.75rem; margin: 32px 0 16px; }
  .legal-content h3 { font-size: 1.25rem; margin: 24px 0 12px; }
  .legal-content p { margin-bottom: 16px; }
  .legal-content ul, .legal-content ol { padding-left: 24px; }
  .legal-content [id] { scroll-margin-top: 24px; }
  .legal-content a { text-decoration: underline; text-underline-offset: 3px; }
  @media (max-width: 359px) {
    :root { --page-gutter: 16px; }
    .hero-copy { padding-top: 290px; }
    .offer-card { padding: 20px; }
    .benefit summary { padding-inline: 12px; gap: 8px; }
  }
  @media (min-width: 600px) {
    :root { --page-gutter: 32px; }
    .hero-photo-mobile { left: calc(65% - 1980px); }
    .hero-copy { padding-top: 350px; }
    .hero h1 { max-width: 560px; }
    .hero-contact { max-width: 360px; }
    .offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .introduction, .benefits, .contact { padding-block: 64px; }
    .section-heading h2 { font-size: 2rem; }
    .offer-contact { max-width: 360px; }
    .benefit-detail { padding-left: 52px; }
  }
  @media (min-width: 768px) {
    .hero-inner { max-width: 720px; min-height: 760px; }
    .hero-copy { max-width: 560px; padding-top: 360px; }
    .hero-photo-mobile { left: calc(78% - 1980px); }
    .hero::after { background: linear-gradient(90deg, rgb(20 23 21 / .5), transparent 95%), linear-gradient(180deg, transparent 180px, rgb(20 23 21 / .65) 360px, rgb(20 23 21 / .9) 750px); }
    .hero h1 { font-size: 2.5rem; }
    .footer-bottom-inner { display: flex; flex-wrap: wrap; gap: 8px 32px; align-items: center; justify-content: space-between; }
    .copyright { margin: 0; }
  }

}

/* Desktop structural base: kept isolated from the mobile composition. */
@media (min-width: 1025px) {
.desktop-copy, .wordmark { display: none; }
.hero-actions, .form-field { display: contents; }
.visually-hidden, .skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; z-index: 2000; background: white; padding: 10px 20px; }
.button { display: inline-block; padding: 20px 40px; border: 0; border-radius: 0; background: var(--olive); color: white; font-size: 15px; font-weight: 700; line-height: 27px; text-align: center; transition: background .3s; }
.button:hover, .button:focus-visible { color: white; background: #064237; }
.top-strip { height: 20px; background: var(--olive); }
.site-header { position: sticky; top: 0; z-index: 999; background: white; border-bottom: 1px solid var(--cream); padding: 8px 0 4px; }
.header-inner { max-width: 1280px; margin: auto; padding: 10px; display: flex; align-items: center; justify-content: space-between; }
.site-logo { display: block; height: 70px; width: auto; }
.appointment { background: transparent; color: var(--olive); border: 2px solid var(--olive); padding: 15px 30px; }
.hero { background: url('./images/hero-background.png') center top / cover no-repeat; min-height: 80vh; border-radius: 0 0 10em 0; padding: 0 40px; overflow: hidden; }
.hero-inner { max-width: 1200px; margin: auto; min-height: 80vh; display: flex; align-items: center; gap: 80px; }
.hero-copy { width: 50%; min-width: 0; flex-shrink: 1; margin: 90px 30px 90px 0; display: flex; flex-direction: column; gap: 48px; }
.hero-space { width: 49.922%; min-width: 0; flex-shrink: 1; }
.hero-message { margin-bottom: 10px; }
.hero h1 { margin: 8px 0 24px; color: white; }
.hero p { color: white; font-size: 18px; font-weight: 400; line-height: 1.8em; }
.introduction { padding: 0 40px; }
.intro-inner { max-width: 1200px; margin: auto; padding: 80px 0; display: flex; align-items: flex-end; gap: 80px; }
.portrait { width: 40%; flex-shrink: 1; align-self: stretch; min-height: 560px; display: flex; flex-direction: column; justify-content: flex-end; }
.portrait::before { content: ''; position: sticky; bottom: 200px; display: block; flex: 0 0 560px; background: url('./images/violetta-portrait.jpg') center top no-repeat; }
.intro-copy { width: 60%; flex-shrink: 1; display: flex; flex-direction: column; gap: 24px; }
.intro-message { padding-top: 10px; }
.intro-message h2 { margin: 8px 0 15px; }
.intro-message p { color: var(--gray); font-size: 18px; font-weight: 400; line-height: 1.8em; }
.intro-copy hr { width: 100%; margin: 0; border: 0; border-top: 1px solid var(--gray); }
.biography h3 { color: var(--gray); }
.bio-toggle { display: flex; align-items: center; gap: 0; margin-top: 20px; padding: 0; border: 0; color: #000; background: transparent; font: 700 18px/1 'Marcellus', sans-serif; text-align: left; }
.bio-caret { height: 18px; width: 14px; fill: currentColor; padding-right: 7px; }
.bio-toggle[aria-expanded='true'] { color: var(--olive); }
.bio-toggle[aria-expanded='true'] .bio-caret { transform: rotate(-90deg); }
.bio-text { padding-top: 24px; font-size: 18px; font-weight: 400; line-height: 1.8em; }
.bio-text p { margin-bottom: 14.4px; }
.section-rule { height: 32px; padding: 15px 0; }
.section-rule::before { content: ''; display: block; width: 50px; height: 2px; margin: auto; background: var(--olive); }
.section-heading { text-align: center; padding-top: 8px; }
.eyebrow { font-size: 17px; font-style: italic; font-weight: 500; line-height: 1.8em; }
.section-heading h2 { margin-top: 15px; }
.offers { position: relative; isolation: isolate; min-height: 80vh; padding: 0 40px; display: flex; flex-direction: column; gap: 24px; background: url('./images/offer-background.png') center / 100% 100% no-repeat; }
.offers > :not(.offer-scene) { position: relative; z-index: 1; }
.offer-scene { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity .35s ease; }
.offer-scene canvas { display: block; width: 100%; height: 100%; }
.offers.has-offer-scene .offer-scene { opacity: 1; }
@media (max-width: 1024px), (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .offer-scene { display: none; }
}
.offers .section-rule::before { background: white; }
.offers .section-heading { color: var(--gray); }
.offers h2, .offers h3 { color: var(--gray); }
.offer-grid { width: 100%; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 48px; }
.offer-card { padding: 24px; background: #ffffff4d; backdrop-filter: blur(20px); }
.offer-icon { position: relative; width: 50px; height: 50px; margin: 0 auto 20px; }
.offer-icon::before { content: ''; position: absolute; top: 6px; left: 30px; width: 30px; height: 30px; border-radius: 50%; background: var(--cream); }
.icon-mask { display: block; position: relative; width: 50px; height: 50px; background: var(--gray); mask: var(--icon) center / contain no-repeat; }
.offer-text h3 { margin: 0 0 16px; }
.offer-text p { color: #4c4e50ad; }
.benefits { padding: 60px 20px 30px; }
.benefits-inner { max-width: 1280px; margin: auto; }
.benefits .section-rule { margin-bottom: 20px; }
.benefits .eyebrow { color: var(--olive); }
.benefit-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 20px 0 0; }
.benefit { margin: 20px; padding: 40px 20px 30px; text-align: center; }
.benefit-icon { width: 80px; height: 80px; background: var(--cream); border-radius: 50%; margin: -15px auto 20px; display: grid; place-items: center; }
.benefit p { margin-bottom: 14.4px; }
.benefit-icon .icon-mask { background: var(--olive); }
.quotes { padding: 60px 20px; background: var(--olive); border-radius: 0 0 0 100px; }
.quotes-inner { max-width: 1000px; margin: auto; }
.quote-mark { width: 50px; height: 50px; margin: 0 auto 20px; background: linear-gradient(180deg,#a67c00,#ffcf40); mask: url('./images/quote-mark.png') center / contain no-repeat; }
.quote-carousel { position: relative; }
.quote-window { overflow: hidden; margin: 0 20px; }
.quote-track { display: flex; align-items: flex-start; transition: transform 500ms ease; }
.quote-slide { flex: 0 0 100%; padding: 20px; text-align: center; }
.quote-slide blockquote { color: var(--cream); font: 400 28.43px/1.4em 'Marcellus', sans-serif; }
.quote-slide figcaption { color: white; font-size: 18px; line-height: 1.8em; font-weight: 400; margin-top: 25px; }
.quote-arrow { position: absolute; top: calc(50% - 32px); display: grid; place-items: center; padding: 0; height: 24px; width: 24px; border: 0; background: transparent; color: #ffffffb3; }
.quote-arrow svg { width: 12px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.5; }
.quote-previous { left: 10px; }.quote-next { right: 10px; }
.quote-dots { display: flex; align-items: center; justify-content: center; height: 40px; gap: 12px; }
.quote-dots button { width: 6px; height: 6px; border-radius: 50%; border: 0; padding: 0; background: white; }
.quote-dots button[aria-pressed='true'] { background: var(--cream); }
.contact { padding: 120px 20px; scroll-margin-top: 103px; }
.contact-inner { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); max-width: 1280px; margin: auto; }
.contact-form-column { padding: 10px; }
#contact-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
#contact-form input, #contact-form textarea { color: #333; border: 1px solid var(--gray); padding: 7px 20px; min-width: 0; width: 100%; background: white; border-radius: 0; }
#contact-form input { min-height: 59px; }
#contact-form textarea { grid-column: 1/-1; resize: vertical; }
#contact-form ::placeholder { color: #333; opacity: .6; }
.form-send { grid-column: 1/-1; padding: 0 20px; min-height: 40px; margin-top: 1px; }
.form-notice { grid-column: 1/-1; color: var(--olive); padding-top: 8px; }
.contact-copy { margin-left: 60px; padding: 10px; display: flex; flex-direction: column; justify-content: center; }
.contact-caption { display: flex; align-items: center; flex-wrap: wrap; gap: 0; }
.contact-caption .eyebrow { margin-right: 15px; color: var(--olive); }
.contact-caption span { display: block; width: 50px; height: 32px; padding: 15px 0; }
.contact-caption span::before { content: ''; display: block; height: 2px; background: var(--olive); }
.contact-message h2 { margin: 8px 0 10px; }
.contact-message { display: flow-root; padding-bottom: 10px; }
.contact-details { list-style: none; margin: 20px 0 0; padding: 0; color: #064237; font-size: 15px; line-height: 27px; font-weight: 700; }
.contact-details li { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.contact-details li:first-child { margin-top: 0; }
.contact-details svg { width: 18px; height: 18px; flex: 0 0 18px; margin-right: 9px; fill: var(--olive); }
.contact-details li:first-child svg { width: 13.5px; flex-basis: 13.5px; margin-right: 13.5px; }
.footer-banner { padding: 60px 20px; background: var(--olive); border-radius: 0 100px 0 0; }
.footer-banner-inner { max-width: 1280px; margin: auto; padding: 10px; }
.footer-banner h2 { color: white; font-size: 37.9px; line-height: 1.3; width: 65%; margin: 8px 0 16px; }
.footer-bottom { background: var(--cream); padding: 0 20px 30px; }
.footer-bottom-inner { max-width: 1280px; padding: 30px 10px 10px; margin: auto; }
.footer-divider { border: 0; border-top: 1px solid var(--gray); margin: 15px 0 35px; }
.footer-nav { display: flex; justify-content: center; flex-wrap: wrap; margin-bottom: 20px; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: center; }
.footer-menu-toggle { display: none; }
.footer-nav a { padding: 13px 20px; color: #000; font-size: 10px; line-height: 20px; }
.copyright { text-align: center; font-size: 14px; font-weight: 400; line-height: 1.8em; }
.legal-content { max-width: 1300px; margin: auto; padding: 10px; overflow-wrap: anywhere; }
.legal-content p { margin: 0 0 14.4px; }
.legal-content ul, .legal-content ol { margin: 0; padding-left: 40px; }
.legal-content [id] { scroll-margin-top: 120px; }

  .benefit summary { list-style: none; color: var(--olive); }
  .benefit summary::-webkit-details-marker { display: none; }
  .benefit summary .lucide { width: 40px; height: 40px; display: block; margin: 0 auto 16px; }
  .benefit-detail { margin-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Contact delivery: shared across the approved mobile and desktop layouts. */
#contact-form .form-consent { grid-column: 1/-1; display: flex; align-items: flex-start; gap: 12px; min-height: 48px; font-size: .875rem; line-height: 1.65; color: var(--gray); }
#contact-form .form-consent input { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; padding: 0; margin: 3px 0 0; accent-color: var(--olive); }
#contact-form .form-consent span { min-width: 0; }
#contact-form .form-consent a, #contact-form .form-notice a, .contact-thanks a { text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
#contact-form .form-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#contact-form .form-notice { grid-column: 1/-1; padding: 18px; border: 1px solid #c6c8bd; background: #fafaf7; color: var(--ink); line-height: 1.65; overflow-wrap: anywhere; }
#contact-form .form-notice h3 { margin-bottom: 8px; font-size: 1.35rem; }
#contact-form .form-notice p + p { margin-top: 12px; }
#contact-form .form-notice[hidden] { display: none; }
#contact-form:not([data-submitted]) .form-error:target { display: block !important; }
#contact-form [aria-invalid="true"] { border-color: #9d322c; }
#contact-form .form-send:disabled { cursor: wait; opacity: .7; }
.contact-thanks { min-height: 45vh; max-width: 850px; padding: 64px 24px; margin: auto; }
.contact-thanks h1 { font-size: clamp(2rem, 6vw, 3rem); margin-bottom: 24px; }
.contact-thanks p + p { margin-top: 24px; }