.site-header { min-height: 176px; }
.notice { min-height: 32px; font-size: 12px; }
.header-utility { display: flex; align-items: center; gap: 24px; }
.header-utility a { display: inline-flex; align-items: center; gap: 8px; }
.header-utility svg { width: 14px; height: 14px; }
.shop-header-main { display: grid; grid-template-columns: 200px minmax(0, 1fr) auto; align-items: center; gap: 40px; min-height: 88px; padding-block: 16px; }
.header-search { display: flex; align-items: center; min-width: 0; height: 48px; border: 1px solid #cbd6cc; border-radius: 4px; background: #f6f8f5; }
.header-search:focus-within { outline: 2px solid var(--forest); outline-offset: 2px; }
.header-search input { flex: 1; width: 0; min-width: 0; height: 100%; border: 0; padding: 12px 16px; outline: none; background: none; font-size: 16px; }
.header-search .icon-button { flex: 0 0 44px; width: 44px; height: 44px; background: transparent; }
.shop-header-actions { display: flex; align-items: center; gap: 16px; }
.header-whatsapp { display: flex; align-items: center; gap: 12px; color: var(--forest); font-size: 14px; font-weight: 600; line-height: 20px; }
.header-whatsapp > svg { width: 28px; height: 28px; flex-shrink: 0; }
.header-whatsapp small { display: block; color: var(--muted); font-size: 12px; font-weight: 400; }
.shop-header-actions .mobile-menu-toggle { display: none; }
.shop-navigation { border-top: 1px solid var(--line); }
.shop-nav { min-height: 56px; display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; gap: 0 24px; }
.shop-nav-group { display: flex; min-width: 0; }
.shop-nav-group > button, .shop-nav-direct { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 0; min-height: 56px; border: 0; background: none; font-size: 16px; line-height: 24px; white-space: nowrap; }
.shop-nav-group > button svg, .shop-nav-direct svg { width: 16px; height: 16px; }
.shop-nav-group > button[aria-expanded="true"] { color: var(--rose-deep); box-shadow: inset 0 -2px var(--rose-deep); }
.shop-nav-group > button[aria-expanded="true"] svg { transform: rotate(180deg); }
.shop-menu-panel { position: absolute; left: 0; right: 0; top: 100%; background: white; border-top: 1px solid var(--line); box-shadow: 0 16px 24px #183c2e14; max-height: 65dvh; overflow-y: auto; }
.shop-menu-layout { display: grid; grid-template-columns: minmax(0, 1fr) 208px; gap: 64px; padding-block: 32px; }
.shop-menu-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 16px; }
.shop-menu-heading h2 { font-size: 30px; line-height: 36px; }
.shop-menu-heading > a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--forest); text-decoration: underline; text-underline-offset: 4px; }
.shop-menu-heading svg { width: 16px; height: 16px; }
.shop-menu-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
.shop-menu-links a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; min-height: 48px; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 24px; }
.shop-menu-links a:hover { color: var(--rose-deep); }
.shop-menu-links a svg { width: 16px; height: 16px; flex-shrink: 0; }
.shop-menu-feature img { width: 208px; height: 184px; object-fit: cover; }
.shop-menu-feature span { display: block; font-size: 14px; margin-top: 8px; }
.mobile-nav .mobile-nav-header { margin-bottom: 24px; }
.mobile-menu-search { margin-bottom: 24px; }
.mobile-shop-groups details, .mobile-shop-direct { border-bottom: 1px solid var(--line); }
.mobile-shop-groups summary, .mobile-shop-direct { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding-block: 12px; gap: 16px; font-size: 18px; line-height: 28px; list-style: none; cursor: pointer; }
.mobile-shop-groups summary::-webkit-details-marker { display: none; }
.mobile-shop-groups svg { width: 18px; height: 18px; flex-shrink: 0; }
.mobile-shop-groups details[open] summary > svg { transform: rotate(180deg); }
.mobile-shop-groups details > div { padding-bottom: 16px; }
.mobile-shop-groups details a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px; min-height: 48px; font-size: 16px; line-height: 24px; }
.mobile-shop-groups .mobile-group-all { font-weight: 600; color: var(--forest); }
.mobile-shop-utility { display: flex; flex-direction: column; padding-block: 24px; gap: 16px; font-size: 14px; }
.campaign-banner { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(400px, 52svh, 560px); background: #edf1ed; }
.campaign-media { position: absolute; inset: 0; z-index: -2; }
.campaign-media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--campaign-desktop-position, 68%) 50%; }
.campaign-shade { position: absolute; inset: 0; z-index: -1; background: rgb(250 252 249 / 24%); }
.campaign-content { min-height: inherit; display: flex; align-items: center; }
.campaign-image-link { position: absolute; inset: 0; z-index: 1; }
.campaign-image-link:focus-visible { outline: 3px solid var(--forest); outline-offset: -6px; }
.campaign-copy { max-width: 520px; padding-block: 32px; }
.campaign-copy .eyebrow { font-size: 12px; line-height: 16px; margin-bottom: 16px; }
.campaign-copy h1 { font-size: 72px; line-height: 1; text-wrap: balance; }
.campaign-description { font-size: 16px; line-height: 24px; margin-top: 24px; max-width: 400px; text-wrap: pretty; color: inherit; }
.campaign-copy .button { font-size: 16px; line-height: 24px; margin-top: 24px; min-height: 48px; padding: 12px 16px; }
.campaign-right .campaign-content { justify-content: flex-end; }
.campaign-art .campaign-shade { display: none; }
.campaign-art .campaign-content { align-items: flex-end; }
.campaign-banner + .care-strip .care-strip-inner { min-height: 64px; }
.home-shelf + .home-shelf { margin-top: 56px; padding-top: 48px; border-top: 1px solid var(--line); }
.home-shelf-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.home-shelf-heading h2 { font-size: 40px; line-height: 44px; text-wrap: balance; }
.home-shelf-heading > div { display: flex; align-items: center; gap: 24px; flex-shrink: 0; }
.home-shelf-heading .text-link { font-size: 14px; }
.shelf-controls { display: flex; gap: 8px; }
.shelf-controls .icon-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 4px; }
.shelf-controls .icon-button:disabled { opacity: .3; cursor: default; }
.home-shelf-grid { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 72px) / 4); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; padding-bottom: 16px; }
.home-shelf-grid .home-product { min-width: 0; scroll-snap-align: start; }
.home-shelf-grid .home-product-copy h3 { font-size: 18px; line-height: 24px; }
.home-shelf-grid .home-product-image { aspect-ratio: 4 / 5; }
.home-shelf-grid .home-product-image img { height: 100%; }
.shop-nav button, .shop-menu-links a, .mobile-shop-groups summary, .campaign-copy, .home-shelf h2 { overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .shop-header-main { gap: 24px; grid-template-columns: 184px minmax(0, 1fr) auto; }
  .header-whatsapp small { display: none; }
  .shop-nav { gap: 12px; }
  .shop-nav-group > button, .shop-nav-direct { font-size: 14px; }
}
@media (max-width: 1000px) {
  .site-header { min-height: 168px; }
  .shop-header-main { grid-template-columns: 1fr auto; gap: 12px 24px; min-height: 0; }
  .shop-header-main > .header-search { grid-column: 1 / -1; grid-row: 2; }
  .shop-header-actions .mobile-menu-toggle { display: inline-flex; }
  .shop-navigation { display: none; }
  .header-utility a:last-child { display: none; }
  .campaign-copy h1 { font-size: 60px; }
  .campaign-copy { max-width: 440px; }
  .home-shelf-grid { grid-auto-columns: calc((100% - 48px) / 3); }
}
@media (max-width: 700px) {
  .site-header { min-height: 152px; }
  .notice { min-height: 28px; font-size: 12px; }
  .notice .notice-inner { min-height: 28px; }
  .header-utility { display: none; }
  .shop-header-main { padding-block: 12px; }
  .header-whatsapp span { display: none; }
  .header-whatsapp { padding: 8px; }
  .header-whatsapp > svg { width: 24px; height: 24px; }
  .header-search { height: 44px; }
  .header-search input { padding: 8px 12px; font-size: 16px; }
  .shop-header-actions { gap: 8px; }
  .shop-header-actions .mobile-menu-toggle { width: 40px; height: 44px; }
  .campaign-banner { min-height: max(320px, min(440px, calc(100svh - 260px))); color: white; }
  .campaign-media img { object-position: 50% var(--campaign-mobile-position, 50%); }
  .campaign-shade { background: rgb(12 33 25 / 46%); }
  .campaign-copy { max-width: 100%; padding-block: 24px; }
  .campaign-copy h1 { font-size: 48px; line-height: 1; max-width: 340px; }
  .campaign-copy .eyebrow { color: white; font-size: 12px; }
  .campaign-description { margin-top: 16px; max-width: 300px; font-size: 16px; line-height: 24px; }
  .campaign-copy .button { background: white; color: var(--forest); margin-top: 24px; }
  .campaign-banner + .care-strip .care-strip-inner { flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; min-height: 48px; gap: 24px; padding-block: 12px; }
  .campaign-banner + .care-strip span { flex-shrink: 0; font-size: 12px; line-height: 16px; }
  .occasions-section { padding-top: 48px; }
  .home-shelf + .home-shelf { margin-top: 32px; padding-top: 32px; }
  .home-shelf-heading { gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
  .home-shelf-heading h2 { font-size: 32px; line-height: 36px; }
  .home-shelf-heading > div { width: 100%; justify-content: space-between; }
  .home-shelf-grid { grid-auto-columns: 72%; gap: 16px; }
  .home-shelf-grid .home-product-copy h3 { font-size: 18px; line-height: 24px; }
}
@media (max-width: 360px) {
  .campaign-copy h1 { font-size: 36px; line-height: 40px; }
  .campaign-description { font-size: 14px; line-height: 20px; }
}