/* Panoramic hero. Original copy and font declarations are preserved. */
.hero {
  display: grid; grid-template-columns: 1fr; isolation: isolate;
  width: 100%; max-width: none; padding: 0; margin: 78px 0 0;
  min-height: clamp(680px, 56.28vw, 900px); overflow: hidden;
  background: #ecdbcc;
}
.hero .hero-image-col {
  position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0;
  max-height: none; margin: 0; border-radius: 0; z-index: -1;
  opacity: 1; transform: none; animation: none;
}
.hero-image-col picture { display: block; width: 100%; height: 100%; }
.hero .hero-image-col img {
  width: 100%; height: 100%; object-fit: cover; object-position: center;
  filter: none; transform-origin: 76% 52%;
  animation: panorama-arrive 4.8s cubic-bezier(.16, 1, .3, 1) both;
}
@keyframes panorama-arrive {
  from { transform: scale(1.035) translateX(-.35%); }
  to { transform: scale(1) translateX(0); }
}
.hero .hero-overlay { display: none; }
.hero .hero-text-col {
  grid-column: 1; grid-row: 1; width: 48%; padding: 52px 0 52px clamp(28px, 6vw, 110px);
  min-height: 0; height: auto; background: transparent; align-items: center;
}
.hero .hero-text-inner { width: 100%; max-width: 520px; }
.hero .hero-tag, .hero .hero-subtitle, .hero h1 em, .hero .hero-care-kicker { color: #795b3c; }
.hero .hero-desc, .hero .hero-care-note p { color: #453b33; }
.hero .hero-care-note { border-left: 0; padding-left: 0; border-top-color: #b89b80; }
.hero .hero-image-badge { bottom: 25px; right: 30px; }
.hero-tag, .hero-text-col h1, .hero-subtitle, .hero-desc, .hero-cta-group, .hero-expertise, .hero-image-badge {
  animation: none; opacity: 1; transform: none;
}
/* Content remains readable when remote scripts are unavailable. */
.reveal { opacity: 1; transform: none; }
section[id], div[id].faq-section { scroll-margin-top: 90px; }
:where(a, button, input, select, textarea):focus-visible { outline: 2px solid #795b3c; outline-offset: 4px; }
@media (max-width: 1120px) {
  #navbar .menu-toggle { display: inline-flex; border-radius: 8px; box-shadow: none; }
  #navbar .nav-links {
    position: fixed; top: 0; right: -100%; width: min(88vw, 360px);
    height: 100dvh; padding: 86px 22px 26px; display: flex; flex-direction: column;
    align-items: stretch; justify-content: flex-start; gap: 8px; overflow-y: auto;
    background: #fff; transition: right .25s ease; z-index: 1000;
  }
  #navbar .nav-links.active { right: 0; }
  #navbar .nav-links li { display: flex; width: 100%; }
  #navbar .nav-links a, #navbar .nav-links button {
    display: flex !important; align-items: center; justify-content: flex-start;
    width: 100%; min-height: 48px; padding: 0 14px;
  }
  body.menu-open { overflow: hidden; }
  .hero .hero-text-col { width: 48%; padding-left: 28px; padding-right: 14px; }
}
@media (max-width: 760px) {
  .hero { display: flex; flex-direction: column; min-height: 0; }
  .hero .hero-image-col {
    position: relative; inset: auto; order: 0; z-index: 0;
    height: auto; aspect-ratio: 1672 / 941; width: 100%; flex: none;
  }
  .hero .hero-image-col img { object-fit: cover; }
  .hero .hero-text-col {
    order: 1; width: 100%; padding: 30px 24px 36px;
    background: #f7eee5;
  }
  .hero .hero-text-inner { max-width: 580px; margin: 0 auto; }
  .hero .hero-image-badge { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero .hero-image-col img { animation: none; transform: none; }
  #navbar .nav-links { transition: none; }
}

.hero .hero-image-col { grid-column: auto; grid-row: auto; }
.faq-answer-wrapper { overflow: hidden; }
.faq-answer-wrapper > .faq-answer { min-height: 0; }
.faq-item:not(.active) .faq-answer-wrapper { visibility: hidden; }
.faq-item.active .faq-answer-wrapper { visibility: visible; }
.faq-answer-wrapper > .faq-answer { padding-bottom: 0; }
