/* Responsive layouts share the existing forest, ivory, and serif design. */
.pdp-grid > *,
.cart-page-grid > *,
.contact-grid > * {
  min-width: 0;
}

.contact-form {
  background: #fff;
  border: 1px solid var(--color-sand-border);
  padding: 2.5rem;
  border-radius: var(--radius-sm);
}

.cart-page-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 3rem;
  align-items: start;
}

.cart-page-item {
  display: flex;
  gap: 1.5rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--color-sand-border);
  align-items: center;
}

.cart-page-item > div { min-width: 0; }
.cart-page-item-total { font-weight: 700; font-size: 1.1rem; text-align: right; }
.cart-page-remove { color: var(--text-secondary); padding: 0.5rem; min-width: 44px; min-height: 44px; }
.cart-page-summary { background: var(--color-sand-light); padding: 2rem; border-radius: var(--radius-sm); border: 1px solid var(--color-sand-border); }
.cart-page-summary > div { gap: 1rem; }

/* A scrollable, modal mobile menu, including short landscape screens. */
.mobile-nav-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10010;
  background: rgba(22, 40, 33, 0.45);
  visibility: hidden;
  opacity: 0;
  transition: opacity 180ms ease, visibility 180ms ease;
}

body.mobile-nav-open { overflow: hidden; }
body.mobile-nav-open .mobile-nav-backdrop { visibility: visible; opacity: 1; }
#mobileNavDrawer {
  z-index: 10020;
  width: min(88vw, 360px);
  max-width: 360px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: max(1rem, env(safe-area-inset-top)) 1.25rem max(1.5rem, env(safe-area-inset-bottom));
}
#mobileNavDrawer .mobile-drawer-header { flex-shrink: 0; margin-bottom: 1rem; }
#mobileNavDrawer .mobile-drawer-header button { width: 44px; height: 44px; }
#mobileNavDrawer .mobile-nav-links { gap: 0; margin-bottom: 1rem; }
#mobileNavDrawer .mobile-nav-link { padding: 0.75rem 0; min-height: 44px; font-size: 1.1rem; line-height: 1.4; }
body.mobile-nav-open .skin-concierge-widget,
body:has(.quick-view-overlay.open, .search-modal-overlay.open) .skin-concierge-widget { visibility: hidden; pointer-events: none; }

/* Notifications must not cover the controls of an open panel. */
body.cart-open .toast-notice,
body.mobile-nav-open .toast-notice,
body:has(.quick-view-overlay.open, .search-modal-overlay.open, .concierge-window.open) .toast-notice { visibility: hidden; }

@media (max-width: 1100px) {
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
}

@media (max-width: 992px) {
  .header-nav { display: none; }
  .header-right { gap: 0; }
  .pdp-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .pdp-media-wrap { max-width: 620px; width: 100%; margin-inline: auto; }
  .pdp-reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cart-page-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .story-badge-floating { right: 8px; }
}

@media (max-width: 860px) {
  /* The desktop motion rule makes the sidebar relative but leaves top: 120px. */
  .shop-sidebar, .motion-page-shop .shop-sidebar { position: static; top: auto; box-shadow: none; }
  .shop-body { padding-top: 1.5rem; }
  .shop-layout { gap: 1rem; }
  .shop-filters-toggle { width: 100%; min-height: 48px; text-align: left; }
  .shop-filters-toggle > span:first-child { flex: 1; }
  .shop-filters-chevron { flex-shrink: 0; transition: transform 180ms ease; }
  .shop-filters-toggle[aria-expanded="true"] .shop-filters-chevron { transform: rotate(180deg); }
  .shop-sort select { min-height: 48px; }
  .shop-facet-more, .shop-clear { min-height: 44px; }
}

@media (max-width: 767px) {
  :root { --header-height: 68px; }
  html { scroll-padding-top: 84px; }
  .container, .container-narrow, .page-content-area .container { padding-left: 16px; padding-right: 16px; }
  .section-padding, .page-content-area { padding-top: 3rem; padding-bottom: 3rem; }
  .page-header { padding: 2.5rem 0 2rem; }
  .page-header h1 { font-size: clamp(1.9rem, 7.5vw, 2.6rem); }
  .page-header .lead-text, .lead-text { font-size: 0.95rem; line-height: 1.65; }
  .page-header p, .contact-card a, .jv-footer-contact a, .legal-card, .prose, .article-body-content { overflow-wrap: anywhere; }
  .btn { white-space: normal; line-height: 1.4; padding: 0.8rem 1.1rem; }
  input:not([type="range"]), select, textarea { font-size: 16px; }
  .announcement-bar { font-size: 0.7rem; padding: 7px 0; }
  .header-container, .site-header.scrolled .header-container { height: 68px; padding: 0 12px; gap: 8px; }
  .header-left { gap: 8px; min-width: 0; }
  .brand-logo-img { height: 40px; max-width: 116px; }
  .header-actions-group { gap: 0; }
  .header-action-btn { width: 44px; height: 44px; }
  .menu-toggle { flex-shrink: 0; }

  /* Preserve the complete landscape film instead of cropping a portrait slot. */
  .hero-video-section, .hero-video-section[class] { height: auto; aspect-ratio: 16 / 9; }
  .hero-sound-toggle { right: 10px; bottom: 10px; }
  .hero-shop-btn, .hero-video-section.is-ended .hero-shop-btn {
    top: auto;
    bottom: 10px;
    left: 16px;
    transform: none;
    min-height: 44px;
    padding: 8px 14px;
    font-size: 0.68rem;
    letter-spacing: 0.05em;
  }
  .trust-strip { padding: 1.25rem 0; }
  .trust-items-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .trust-item { justify-content: flex-start; align-items: flex-start; gap: 8px; }
  .trust-icon { width: 20px; height: 20px; flex-shrink: 0; }
  .trust-text h5 { font-size: 0.72rem; line-height: 1.4; }
  .trust-text p { font-size: 0.65rem; line-height: 1.5; }

  .product-grid, .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 12px; }
  .product-card { min-width: 0; border-radius: 8px; }
  .product-card-body { padding: 0.8rem; }
  .product-card-title, .shop-grid .product-card-title { font-size: 0.98rem !important; line-height: 1.35 !important; overflow-wrap: break-word; }
  .product-card .product-rating { flex-wrap: wrap; gap: 4px; }
  .product-price-row { gap: 4px; }
  .product-price .currency { font-size: 0.65rem; }
  .shop-toolbar { flex-wrap: wrap; align-items: center; gap: 12px; }
  .shop-sort { min-width: 0; max-width: 100%; }
  .shop-sort select { min-width: 0; width: 100%; max-width: 100%; }
  .shop-filters { padding: 1rem; }
  .shop-facet-option { min-height: 44px; }
  .story-grid { gap: 2rem; }
  .story-badge-floating { right: 8px; top: 8px; width: 88px; height: 88px; }
  .story-content h2 { font-size: 1.85rem; }
  .story-pillars { gap: 1rem; }
  .story-pillar p { font-size: 0.8rem; }
  .story-content .btn { width: 100%; }
  .reviews-section { padding: 3rem 0; }
  .reviews-heading h2 { font-size: 2rem; }
  .reviews-summary { flex-wrap: wrap; justify-content: center; }
  .reviews-carousel-wrap { padding-inline: 36px; }
  .reviews-carousel .review-card { min-width: 100%; flex-basis: 100%; padding: 1.6rem 1.25rem; }
  .reviews-arrow { width: 44px; height: 44px; }

  .journal-card-body { padding: 1.25rem; }
  .journal-featured-body { padding: 1.5rem; }
  .journal-pagination { gap: 1rem; }
  .journal-pages { flex-wrap: wrap; justify-content: center; }
  .newsletter-section { padding: 3rem 0; }
  .newsletter-section::after { opacity: 0.08; }
  .newsletter-box h2 { font-size: 1.9rem; }
  .newsletter-form { width: 100%; }
  .newsletter-input { min-width: 0; }

  .breadcrumb { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 1.25rem; font-size: 0.75rem; overflow-wrap: anywhere; }
  .pdp-grid { gap: 1.5rem; }
  .pdp-main-image { padding: 1.25rem; }
  .pdp-title { font-size: 1.85rem; }
  .pdp-thumb { width: 68px; height: 68px; }
  .pdp-review-summary, .pdp-price-wrap, .pdp-rating-large { flex-wrap: wrap; }
  .pdp-price { font-size: 1.5rem; }
  .page-content-area.pdp-page { padding-top: 1.5rem; }
  .pdp-page .pdp-breadcrumb { margin-bottom: 1.5rem; font-size: 0.75rem; }
  .pdp-info-wrap { --pdp-detail-gap: 1.25rem; }
  .pdp-confidence-grid { grid-template-columns: minmax(0, 1fr); }
  .pdp-confidence-item { padding: 0.85rem 1rem; text-align: left; border-right: 0; border-bottom: 1px solid var(--color-sand-border); }
  .pdp-confidence-item:last-child { border-bottom: 0; }
  .pdp-confidence-item strong { font-size: 0.8rem; }
  .pdp-confidence-item span { font-size: 0.75rem; }
  .pdp-shipping-badge { padding: 1rem; }
  .pdp-reviews-section { margin-top: 3rem; padding: 2rem 1rem; }
  .pdp-reviews-grid { grid-template-columns: minmax(0, 1fr); }
  .pdp-jump-links button { min-height: 44px; }
  .pdp-closing-cta { gap: 1rem; padding: 1.25rem; }
  .pdp-closing-copy { min-width: 0; }
  .pdp-ingredient-grid { grid-template-columns: minmax(0, 1fr); }

  .gift-feature-visual { order: -1; min-height: 280px; padding: 1.5rem; }
  .gift-image-frame img { height: 230px; }
  .gift-feature-content { padding: 1.5rem; }
  .gift-feature-content h2 { font-size: 1.85rem; }
  .gift-cta { width: 100%; }
  .contact-grid { gap: 1.5rem; }
  .contact-card, .contact-form { padding: 1.25rem; }
  .contact-form .form-control { min-height: 48px; }
  .accordion-trigger { gap: 1rem; line-height: 1.5; }
  .accordion-icon { flex-shrink: 0; }

  .cart-page-item { display: grid; grid-template-columns: 64px minmax(0, 1fr) 44px; gap: 12px; }
  .cart-page-item > img { width: 64px !important; height: 64px !important; }
  .cart-page-item > div:nth-child(2) { grid-column: 2; }
  .cart-page-item h4 { font-size: 1rem !important; }
  .cart-page-item .pdp-qty-control { grid-column: 1 / 3; justify-self: start; }
  .cart-page-item-total { grid-column: 2 / 4; grid-row: 2; justify-self: end; align-self: center; }
  .cart-page-remove { grid-column: 3; grid-row: 1; }
  .cart-page-summary { padding: 1.25rem; }
  .cart-page-summary > div { font-size: 0.9rem; }
  .cart-page-summary > div > :last-child { text-align: right; }
  .cart-drawer { max-width: 100%; height: 100dvh; }
  .cart-drawer-header, .cart-drawer-footer { padding: 1rem; }
  .cart-drawer-footer { padding-bottom: max(1rem, env(safe-area-inset-bottom)); }
  .cart-items-list { min-height: 0; padding: 1rem; }
  .cart-item { gap: 12px; }
  .cart-item-img { width: 64px; height: 64px; flex-shrink: 0; }
  .cart-item-details { min-width: 0; }
  .cart-item-controls { flex-wrap: wrap; gap: 8px; }
  .cart-item-controls .pdp-qty-control { transform: none !important; flex-shrink: 0; }
  .cart-item-remove { min-height: 44px; min-width: 44px; }
  .cart-drawer-footer .btn { font-size: 0.7rem; padding-inline: 10px; }
  .cart-close-btn, .modal-close-btn, .search-close-btn { min-width: 44px; min-height: 44px; flex-shrink: 0; }
  .quick-view-overlay { padding: 12px; }
  .quick-view-overlay .quick-view-modal { padding: 3.5rem 1.25rem 1.25rem; max-height: calc(100dvh - 24px); }
  .quick-view-actions { flex-wrap: wrap; }
  .quick-view-actions .btn { flex: 1 1 100% !important; }
  .search-modal-overlay { padding: 12px; }
  .search-box { padding: 1.25rem; width: 100%; max-height: calc(100dvh - 24px); overflow-y: auto; }
  .search-input { min-width: 0; }
  .toast-notice { padding: 1rem; }
  .jv-footer { padding: 3rem 0 1.5rem; }
  .jv-footer-grid { gap: 2rem 1rem; }
  .jv-footer-col a { min-height: 36px; display: inline-flex; align-items: center; }

  .skin-concierge-widget { --launcher-size: 52px; --launcher-bottom: max(16px, env(safe-area-inset-bottom)); --chat-gap: 12px; right: 16px; bottom: var(--launcher-bottom); }
  .concierge-launcher-wrap, .concierge-launcher-btn { width: var(--launcher-size); height: var(--launcher-size); }
  .launcher-flower-logo { width: 32px; height: 32px; }
  .launcher-floating-label { display: none; }
  .concierge-window { left: 8px; right: 8px; bottom: var(--chat-bottom); width: auto; height: 640px; max-height: calc(100dvh - var(--chat-bottom) - max(16px, env(safe-area-inset-top))); border-radius: 12px; }
  .concierge-header { gap: 8px; flex-shrink: 0; }
  .concierge-header-brand { min-width: 0; gap: 8px; }
  .concierge-header-brand > div:last-child { min-width: 0; }
  .concierge-subtitle { white-space: normal; }
  .concierge-header-actions { flex-shrink: 0; }
  .concierge-header-btn { min-width: 44px; min-height: 44px; justify-content: center; }
  .concierge-send-btn { min-width: 44px; min-height: 44px; }
  .concierge-mode-tabs button, .concierge-chip-btn { min-height: 44px; }
}

/* Landscape phones and short browser windows need scrollable panel content. */
@media (max-height: 600px) {
  .cart-drawer { height: 100dvh; overflow-y: auto; }
  .cart-drawer-header, .free-shipping-meter, .cart-drawer-footer { flex-shrink: 0; }
  .cart-items-list { flex: 1 0 auto; overflow-y: visible; }
  .concierge-window { bottom: 8px; height: calc(100dvh - 16px); max-height: calc(100dvh - 16px); }
  .concierge-header { flex-shrink: 0; }
  .concierge-voice-panel { overflow-y: auto; overscroll-behavior: contain; }
  .concierge-conversation > * { flex-shrink: 0; }
  .concierge-text-panel .concierge-messages-body { flex: 1 0 auto; min-height: 100px; overflow-y: visible; }
  .skin-concierge-widget:has(.concierge-window.open) .concierge-launcher-wrap { visibility: hidden; }
}

/* Touch users can reach purchase actions without relying on hover. */
@media (hover: none), (pointer: coarse) {
  .product-card:hover { transform: none; }
  .product-card .product-card-media, .shop-grid .product-card-media { aspect-ratio: auto; }
  .product-card .product-card-img { height: auto; aspect-ratio: 1 / 0.9; }
  .product-card:hover .product-card-img:has(+ .product-card-img-hover) { opacity: 1; transform: none; }
  .product-card-img-hover, .product-card-media > .product-badge { display: none; }
  .product-card-actions, .shop-grid .product-card-actions {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin: 6px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .product-card-actions .btn-card-action:not(.primary) { display: block; }
  .btn-card-action { min-width: 0; min-height: 44px; padding: 8px 4px; font-size: 0.65rem; white-space: normal; line-height: 1.35; }
}

@media (max-width: 359px) {
  .header-container, .site-header.scrolled .header-container { padding-inline: 8px; }
  .header-left { gap: 0; }
  .brand-logo-img { max-width: 100px; }
  .product-grid, .shop-grid { grid-template-columns: minmax(0, 1fr); }
  .trust-items-grid, .story-pillars { grid-template-columns: minmax(0, 1fr); }
  .pdp-closing-cta { grid-template-columns: minmax(0, 1fr); }
  .pdp-closing-cta img { display: none; }
  .pdp-closing-buy { grid-column: 1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-end-card, .hero-shop-btn, .hero-video-section.is-ended .hero-shop-btn { transition: none; }
  .mobile-nav-backdrop, #mobileNavDrawer { transition: none; }
  .shop-filters-chevron { transition: none; }
}