/* Mobile navigation: ivory folio, two distinct journeys, native modal behavior. */
body.atelier dialog.abika-mobile-navigation:not([open]) { display: none; }
@media (max-width: 760px) {
 body.atelier .atelier-menu.has-mobile-navigation {
  display: inline-flex; align-items: center; justify-content: center; gap: 11px;
  width: 88px; min-width: 88px; height: 44px; min-height: 44px; padding: 0 12px;
  border: 1px solid #c9c49b66; border-radius: 24px; color: #ede9df;
  background: transparent; font: 500 11px/1.4 Manrope, Arial, sans-serif;
 }
 body.atelier .atelier-menu.has-mobile-navigation > span {
  display: block; width: auto; height: auto; margin: 0; background: none;
  transform: none; transition: none;
 }
 body.atelier .mobile-nav-trigger-label { letter-spacing: .015em; }
 body.atelier .atelier-menu.has-mobile-navigation > svg { width: 17px; height: 17px; color: #c9c49b; }
 body.atelier dialog.abika-mobile-navigation {
  --nav-paper: #f0ede4; --nav-ink: #17372e; --nav-gold: #d2c89e;
  position: fixed; inset: 0; width: 100%; max-width: 100%;
  height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh;
  margin: 0; border: 0; border-radius: 0; padding: 0;
  overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch; background: #10271f; color: var(--nav-paper);
  animation: none; box-shadow: none;
 }
 body.atelier dialog.abika-mobile-navigation::backdrop { background: #10271f; backdrop-filter: none; }
 body.atelier dialog.abika-mobile-navigation[open] { display: block; animation: none; }
 body.atelier .mobile-nav-shell {
  display: flex; flex-direction: column; min-height: 100%; gap: 0;
  padding: max(10px, env(safe-area-inset-top)) 10px max(14px, env(safe-area-inset-bottom));
  transform-origin: 85% 0;
 }
 body.atelier .mobile-nav-canvas {
  display: flex; flex: 1 0 auto; flex-direction: column; min-width: 0;
  border-radius: 19px; padding: 0 23px; background: var(--nav-paper); color: var(--nav-ink);
 }
 body.atelier .mobile-nav-header {
  display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 1; background: var(--nav-paper);
  min-height: 85px; gap: 20px;
 }
 body.atelier .mobile-nav-brand { display: flex; align-items: center; width: 131px; min-height: 44px; }
 body.atelier .mobile-nav-brand img { width: 100%; height: auto; }
 body.atelier .mobile-nav-close {
  display: flex; align-items: center; justify-content: center; flex: 0 0 44px;
  width: 44px; min-width: 44px; min-height: 44px; padding: 0;
  border: 1px solid #17372e42; border-radius: 50%; background: transparent;
  color: var(--nav-ink); font: 400 12px/1 Manrope, Arial, sans-serif;
 }
 body.atelier .mobile-nav-close svg { width: 20px; height: 20px; }
 body.atelier .mobile-nav-content { padding-top: clamp(18px, 4dvh, 40px); }
 body.atelier .mobile-nav-context {
  margin: 0 0 13px; color: #496055; font: 500 10px/1.5 Manrope, Arial, sans-serif;
  letter-spacing: .12em; text-transform: uppercase;
 }
 body.atelier .mobile-nav-links { display: block; }
 body.atelier .mobile-nav-primary { display: flex; flex-direction: column; }
 body.atelier .mobile-nav-primary a { text-decoration: none; -webkit-tap-highlight-color: transparent; }
 body.atelier .mobile-nav-product {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  min-height: 122px; padding: 0 0 24px; border-bottom: 1px solid #17372e3d;
 }
 body.atelier .mobile-nav-product > span {
  font: 500 clamp(55px, 20vw, 106px)/1.05 Manrope, Arial, sans-serif;
  letter-spacing: -.07em;
 }
 body.atelier .mobile-nav-product > svg {
  flex: 0 0 46px; width: 46px; height: 46px; padding: 12px;
  border-radius: 50%; background: var(--nav-ink); color: var(--nav-paper);
 }
 body.atelier .mobile-nav-blend {
  position: relative; display: grid; grid-template-columns: 94px minmax(0, 1fr) 20px;
  align-items: center; gap: 15px; margin-top: 23px; min-height: 166px;
  padding: 23px 19px 23px 13px; border-radius: 11px;
  background: var(--nav-ink); color: var(--nav-paper); overflow: hidden;
 }
 body.atelier .mobile-nav-blend-mark { width: 94px; height: 94px; color: var(--nav-gold); }
 body.atelier .mobile-nav-blend > span {
  max-width: 160px; font: 400 clamp(36px, 10.5vw, 58px)/.95 'Cormorant Garamond', Georgia, serif;
  letter-spacing: -.025em;
 }
 body.atelier .mobile-nav-blend > svg:last-child { width: 20px; height: 20px; align-self: end; color: var(--nav-gold); }
 body.atelier .mobile-nav-secondary {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0;
  margin-top: 22px; padding-block: 3px;
 }
 body.atelier .mobile-nav-secondary a {
  display: flex; align-items: center; justify-content: center; min-height: 48px;
  color: var(--nav-ink); font: 500 12px/1.5 Manrope, Arial, sans-serif; text-decoration: none;
 }
 body.atelier .mobile-nav-secondary a + a { border-left: 1px solid #17372e29; }
 body.atelier .mobile-nav-secondary a:first-child { justify-content: flex-start; }
 body.atelier .mobile-nav-secondary a:last-child { justify-content: flex-end; }
 body.atelier .mobile-nav-links a[aria-current="page"] > span {
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 7px;
 }
 body.atelier dialog.abika-mobile-navigation .mobile-nav-sector-return {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 66px;
  margin: auto 0 0; padding: 15px 0 14px; border-top: 1px solid #17372e30;
  color: #496055; font: 500 11px/1.5 Manrope, Arial, sans-serif; text-decoration: none;
 }
 body.atelier .mobile-nav-sector-return > svg { flex: 0 0 17px; width: 17px; height: 17px; }
 body.atelier .mobile-nav-sector-return > svg:last-child { margin-left: auto; width: 15px; height: 15px; }
 body.atelier .mobile-nav-footer { flex: 0 0 auto; padding: 10px 15px 0; }
 body.atelier .mobile-nav-contact { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
 body.atelier .mobile-nav-contact a {
  display: inline-flex; align-items: center; gap: 9px; min-height: 44px;
  color: var(--nav-paper); font: 400 13px/1.5 Manrope, Arial, sans-serif; text-decoration: none;
 }
 body.atelier .mobile-nav-contact a:last-child { font-size: 11px; color: #c5cec2; }
 body.atelier .mobile-nav-request {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  width: 100%; min-height: 52px; margin-top: 5px; padding: 10px 5px 10px 19px;
  border: 1px solid var(--nav-gold); border-radius: 30px; background: var(--nav-gold);
  color: #10271f !important; font: 600 13px/1.5 Manrope, Arial, sans-serif;
 }
 body.atelier .mobile-nav-request > svg { flex: 0 0 39px; width: 39px; height: 32px; padding: 7px; border-left: 1px solid #10271f38; }
 body.atelier dialog.abika-mobile-navigation :is(a, button):focus-visible { outline: 2px solid #5a806f; outline-offset: 4px; }
 body.atelier .mobile-nav-footer :is(a, button):focus-visible { outline-color: var(--nav-paper); }
 @media (hover: hover) {
  body.atelier .mobile-nav-product:hover > svg { background: #35634f; }
  body.atelier .mobile-nav-blend:hover { background: #234c3d; }
  body.atelier .mobile-nav-secondary a:hover > span { text-decoration: underline; text-underline-offset: 6px; }
 }
}
@media (max-width: 360px) {
 body.atelier .mobile-nav-canvas { padding-inline: 19px; }
 body.atelier .mobile-nav-product > span { font-size: 54px; }
 body.atelier .mobile-nav-blend { grid-template-columns: 70px minmax(0, 1fr) 18px; gap: 12px; padding-inline: 10px 15px; }
 body.atelier .mobile-nav-blend-mark { width: 70px; height: 70px; }
 body.atelier .mobile-nav-blend > span { font-size: 35px; }
 body.atelier .mobile-nav-secondary a { font-size: 11px; }
}
@media (max-width: 760px) and (max-height: 680px) {
 body.atelier .mobile-nav-header { min-height: 72px; }
 body.atelier .mobile-nav-content { padding-top: 13px; }
 body.atelier .mobile-nav-product { min-height: 89px; padding-bottom: 16px; }
 body.atelier .mobile-nav-blend { margin-top: 17px; min-height: 130px; padding-block: 17px; }
 body.atelier .mobile-nav-secondary { margin-top: 14px; }
 body.atelier dialog.abika-mobile-navigation .mobile-nav-sector-return { min-height: 58px; }
}