/* Shared shell. Only pages opting in to site-shell-root/site-shell-page use it. */
html.site-shell-root {
  --header-height: 84px;
  --shell-ink: #2b1d17;
  --shell-cream: #faf6ef;
  --shell-focus: #805441;
  --shell-title: "Playfair Display", Georgia, serif;
  --shell-body: "Lato", Arial, sans-serif;
  scroll-padding-top: calc(var(--header-height) + 24px);
}

body.site-shell-page { min-width: 0; padding-top: var(--header-height); }

.site-shell-page :is(a, button, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--shell-focus);
  outline-offset: 5px;
}

.yui-header, .yui-footer, .yui-menu-backdrop, .yui-skip-link,
.yui-header *, .yui-footer * { box-sizing: border-box; }

.yui-header [hidden], .yui-menu-backdrop[hidden] { display: none !important; }

.yui-shell-container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }

.yui-skip-link {
  position: fixed;
  top: 12px;
  left: 20px;
  z-index: 1100;
  padding: 12px 18px;
  border-radius: 8px;
  background: var(--shell-ink);
  color: #fff;
  font: 700 .9rem var(--shell-body);
  transform: translateY(-180%);
}
.yui-skip-link:focus { transform: none; }

.yui-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  color: var(--shell-ink);
  font-family: var(--shell-body);
}
.yui-header--light {
  background: rgba(250, 246, 239, .93);
  border-bottom: 1px solid rgba(43, 29, 23, .08);
  box-shadow: 0 4px 22px rgba(43, 29, 23, .035);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.yui-header__inner {
  min-height: calc(var(--header-height) - 1px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.yui-brand { display: inline-flex; flex: 0 0 auto; flex-direction: column; gap: 8px; text-decoration: none; color: inherit; }
.yui-brand__name { font: 600 1.65rem/1 var(--shell-title); letter-spacing: -.035em; white-space: nowrap; }
.yui-brand__tagline { font: 700 .57rem/1.4 var(--shell-body); letter-spacing: .17em; color: #6b705c; white-space: nowrap; }
.yui-desktop-nav { margin-left: auto; }
.yui-nav-list, .yui-submenu, .yui-mobile-nav ul, .yui-footer ul { margin: 0; padding: 0; list-style: none; }
.yui-nav-list { display: flex; align-items: center; gap: 4px; }
.yui-nav-link, .yui-dropdown > summary, .yui-language {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 10px 9px;
  border-radius: 6px;
  color: inherit;
  text-decoration: none;
  font-size: .87rem;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.yui-nav-link:hover, .yui-dropdown > summary:hover, .yui-language:hover { background: rgba(107, 112, 92, .08); }
.yui-nav-link[aria-current="page"] { text-decoration: underline; text-decoration-color: #9e8060; text-underline-offset: 7px; text-decoration-thickness: 1px; }
.yui-dropdown { position: relative; }
.yui-dropdown > summary { list-style: none; cursor: pointer; }
.yui-dropdown > summary::-webkit-details-marker { display: none; }
.yui-chevron { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.5; transition: transform 180ms ease; }
.yui-dropdown[open] .yui-chevron { transform: rotate(180deg); }
.yui-submenu {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  min-width: 220px;
  padding: 8px;
  border: 1px solid rgba(43, 29, 23, .1);
  border-radius: 12px;
  background: var(--shell-cream);
  box-shadow: 0 16px 36px rgba(43, 29, 23, .1);
}
.yui-submenu a { display: block; padding: 13px 12px; color: inherit; text-decoration: none; border-radius: 6px; font-size: .9rem; line-height: 1.5; }
.yui-submenu a:hover { background: rgba(107, 112, 92, .09); }
.yui-header__actions { display: flex; align-items: center; gap: 12px; }
.yui-instagram { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 9px 15px; border: 1px solid rgba(43, 29, 23, .22); border-radius: 999px; color: inherit; text-decoration: none; font-size: .83rem; font-weight: 700; line-height: 1.5; }
.yui-instagram:hover { background: rgba(107, 112, 92, .08); border-color: #6b705c; }
.yui-menu-toggle, .yui-mobile-nav, .yui-menu-backdrop { display: none; }

.yui-footer {
  --shell-focus: #d8bd82;
  margin-top: 26px;
  padding: 64px 0 28px;
  color: #f2e8dc;
  background: #171310;
  font: 400 .9rem/1.6 var(--shell-body);
}
.yui-footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 56px; }
.yui-footer__brand { display: inline-block; color: #f2e8dc; text-decoration: none; font: 600 2rem/1.2 var(--shell-title); }
.yui-footer__tagline { margin: 10px 0 0; color: #c9ae79; font: italic 1.08rem/1.6 var(--shell-title); }
.yui-footer__heading { margin: 0 0 18px; color: #c9ae79; font: 700 .78rem/1.5 var(--shell-body); letter-spacing: .12em; text-transform: uppercase; }
.yui-footer li + li { margin-top: 3px; }
.yui-footer nav a { display: inline-block; padding-block: 8px; color: #d4c8bb; text-decoration: none; overflow-wrap: anywhere; }
.yui-footer nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
.yui-footer__bottom { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-top: 46px; padding-top: 24px; border-top: 1px solid rgba(242, 232, 220, .14); }
.yui-footer__bottom small { color: #b9ac9e; font: 400 .77rem/1.8 var(--shell-body); }

html.site-shell-menu-open { overflow: hidden; }
body.site-shell-menu-open { position: fixed; top: var(--shell-scroll-top); left: 0; right: 0; width: 100%; overflow: hidden; }

@media (max-width: 999px) {
  html.site-shell-root { --header-height: 76px; }
  .yui-shell-container { width: calc(100% - 40px); }
  .yui-header__inner { gap: 16px; }
  .yui-desktop-nav, .yui-header__actions { display: none; }
  .yui-header[data-shell-ready] .yui-menu-toggle {
    display: inline-flex;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 11px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(43, 29, 23, .15);
    border-radius: 50%;
    color: var(--shell-ink);
    background: transparent;
    cursor: pointer;
  }
  .yui-menu-toggle:hover { background: rgba(107, 112, 92, .08); }
  .yui-menu-toggle svg { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.5; fill: none; }
  .yui-menu-toggle[aria-expanded="false"] .yui-menu-close,
  .yui-menu-toggle[aria-expanded="true"] .yui-menu-bars { display: none; }
  .yui-mobile-nav {
    display: block;
    padding: 12px 24px 20px;
    padding-bottom: max(20px, env(safe-area-inset-bottom));
    border-top: 1px solid rgba(43, 29, 23, .08);
    background: #faf6ef;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .yui-header[data-shell-ready] .yui-mobile-nav {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: calc(100vh - var(--header-height) - 16px);
    max-height: calc(100dvh - var(--header-height) - 16px);
    box-shadow: 0 16px 30px rgba(43, 29, 23, .1);
  }
  .yui-mobile-nav a { display: block; padding: 13px 8px; min-height: 46px; border-radius: 6px; color: var(--shell-ink); text-decoration: none; font-size: .94rem; line-height: 1.5; }
  .yui-mobile-nav a:hover, .yui-mobile-nav a[aria-current="page"] { background: rgba(107, 112, 92, .08); }
  .yui-mobile-nav__secondary { margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(43, 29, 23, .12); }
  .yui-menu-backdrop { display: block; position: fixed; inset: var(--header-height) 0 0; z-index: 999; background: rgba(43, 29, 23, .24); }
  /* Before enhancement (or without JS), all navigation stays usable in flow. */
  .yui-header:not([data-shell-ready]) { position: static; }
  .site-shell-page:has(.yui-header:not([data-shell-ready])) { padding-top: 0; }
  .yui-footer__grid { grid-template-columns: 1fr 1fr; gap: 34px; }
  .yui-footer__identity { grid-column: 1 / -1; }
  .yui-footer__bottom { flex-direction: column; gap: 10px; }
}

@media (max-width: 560px) {
  .yui-shell-container { width: calc(100% - 32px); }
  .yui-brand__name { font-size: 1.45rem; }
  .yui-brand__tagline { font-size: .55rem; letter-spacing: .13em; }
  .yui-mobile-nav { padding-inline: 16px; }
  .yui-footer { padding-top: 48px; }
  .yui-footer__grid { grid-template-columns: 1fr; gap: 32px; }
  .yui-footer__identity { grid-column: auto; }
  .yui-footer__heading { margin-bottom: 10px; }
  .yui-footer__bottom { margin-top: 32px; }
}

@media (prefers-reduced-motion: reduce) {
  html.site-shell-root { scroll-behavior: auto; }
  .yui-chevron { transition: none; }
}

/* Opt-in dark palette: shared dimensions, layout and interactions stay unchanged. */
.site-shell--dark { --shell-focus: #d8bd82; }
.site-shell--dark .yui-skip-link { background: #faf6ef; color: #2b1d17; }
.yui-header--dark {
  --shell-ink: #f2e8dc;
  --shell-focus: #d8bd82;
  background: rgba(15, 14, 12, .93);
  border-bottom: 1px solid rgba(184, 155, 94, .24);
  box-shadow: 0 4px 22px rgba(0, 0, 0, .12);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.yui-header--dark .yui-brand__tagline { color: #d8bd82; }
.yui-header--dark .yui-submenu,
.yui-header--dark .yui-mobile-nav {
  background: #171310;
  border-color: rgba(184, 155, 94, .3);
}
.yui-header--dark .yui-instagram,
.yui-header--dark[data-shell-ready] .yui-menu-toggle { border-color: rgba(216, 189, 130, .5); }
.yui-header--dark .yui-mobile-nav__secondary { border-color: rgba(184, 155, 94, .3); }
.yui-header--dark :is(.yui-nav-link, .yui-language, .yui-instagram, .yui-menu-toggle):hover,
.yui-header--dark .yui-dropdown > summary:hover,
.yui-header--dark :is(.yui-submenu, .yui-mobile-nav) a:hover,
.yui-header--dark :is(.yui-submenu, .yui-mobile-nav) a[aria-current="page"] {
  background: rgba(216, 189, 130, .12);
}
.yui-header--dark .yui-dropdown--current > summary,
.yui-header--dark a[aria-current="page"] {
  text-decoration: underline;
  text-decoration-color: #d8bd82;
  text-underline-offset: 7px;
  text-decoration-thickness: 1px;
}
