/* ==========================================================

   Modern Art Hotel — Design System

   Quiet Luxury: ivory base, Ysabeau Infant, oklch palette

   ========================================================== */



/* ── 1. Font-face: Ysabeau Infant self-hosted ──────────────── */

@font-face {

  font-family: "Ysabeau Infant";

  font-style: normal;

  font-weight: 400;

  font-display: swap;

  src: url("fonts/ysabeau-infant-v4-cyrillic_latin_latin-ext-regular.woff2") format("woff2");

}

@font-face {

  font-family: "Ysabeau Infant";

  font-style: italic;

  font-weight: 400;

  font-display: swap;

  src: url("fonts/ysabeau-infant-v4-cyrillic_latin_latin-ext-italic.woff2") format("woff2");

}

@font-face {

  font-family: "Ysabeau Infant";

  font-style: normal;

  font-weight: 500;

  font-display: swap;

  src: url("fonts/ysabeau-infant-v4-cyrillic_latin_latin-ext-500.woff2") format("woff2");

}

@font-face {

  font-family: "Ysabeau Infant";

  font-style: italic;

  font-weight: 500;

  font-display: swap;

  src: url("fonts/ysabeau-infant-v4-cyrillic_latin_latin-ext-500italic.woff2") format("woff2");

}





/* ── NUCLEAR FONT OVERRIDE: kill any Inter from SR theme ─────── */

html, body, body *,

h1, h2, h3, h4, h5, h6,

p, a, span, li, div, nav, header, footer, section, article,

.mah-header, .mah-footer, .mah-hero {

  font-family: "Ysabeau Infant", ui-sans-serif, system-ui, sans-serif !important;

}

/* Re-apply correct weights for UI elements */

body { font-weight: 400 !important; }

h1, h2, h3, h4 { font-weight: 500 !important; }



/* ── 2. Design Tokens ──────────────────────────────────────── */

:root {

  /* Surfaces */

  --ivory:    oklch(0.975 0.008 80);     /* warm off-white */

  --pebble:   oklch(0.945 0.006 80);     /* soft pebble grey */

  --graphite: oklch(0.215 0.005 270);    /* deep graphite */

  --ink:      oklch(0.18 0.008 60);      /* near-black warm */



  --background: var(--ivory);

  --foreground:  var(--ink);



  /* Accents */

  --coffee:     oklch(0.38 0.045 55);    /* warm deep coffee */

  --terracotta: oklch(0.55 0.105 45);    /* muted terracotta */

  --archive:    oklch(0.42 0.055 145);   /* archive green */

  --wine:       oklch(0.36 0.095 20);    /* deep wine */

  --brass:      oklch(0.66 0.085 85);    /* muted brass */



  /* UI */

  --hairline:   oklch(0.82 0.008 70);

  --border:     var(--hairline);

  --muted-fg:   oklch(0.48 0.012 60);



  /* Typography */

  --font-main: "Ysabeau Infant", ui-sans-serif, system-ui, sans-serif;



  /* Layout */

  --max-w:   1280px;

  --max-w-xl: 1440px;

  --px:      1.5rem;      /* 24px */

  --px-lg:   2.5rem;      /* 40px */



  /* Radius: 0 — geometric brand language */

  --radius: 0px;

}



/* ── 3. Reset & Base ───────────────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; }



html { scroll-behavior: smooth; }



/* IMPORTANT: explicit white/ivory background — not relying on browser default */

html, body {

  background-color: var(--ivory) !important;

  color: var(--ink);

  font-family: var(--font-main);

  font-size: 16px;

  line-height: 1.6;

  -webkit-font-smoothing: antialiased;

  text-rendering: optimizeLegibility;

  overflow-x: hidden;

}



/* GeneratePress overrides — neutralise defaults */

.site-content, #page, .entry-content, .inside-article {

  background: transparent !important;

  padding: 0 !important;

  margin: 0 !important;

  max-width: none !important;

}

.site-header, .nav-primary, .site-footer,

#generate-sidebar, .sidebar-widgets { display: none !important; }

.hentry { margin: 0 !important; }

body.page .site-main { background: transparent; }



/* Remove GeneratePress body class padding for fixed header */

.mah-has-header { padding-top: 0 !important; }



img { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }

ul { list-style: none; margin: 0; padding: 0; }

p { margin: 0 0 1em; }

p:last-child { margin-bottom: 0; }



/* ── 4. Typography ─────────────────────────────────────────── */

h1, h2, h3, h4, h5, h6 {

  font-family: var(--font-main);

  font-weight: 500;

  letter-spacing: -0.01em;

  line-height: 1.05;

  margin: 0;

}



.eyebrow {

  font-family: var(--font-main);

  font-size: 11px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: var(--coffee);

}

.eyebrow-brass { color: var(--brass); }

.eyebrow-ivory { color: rgba(255,255,255,0.7); }



.font-serif { font-family: var(--font-main); }



/* ── 5. Layout helpers ─────────────────────────────────────── */

.mah-container {

  max-width: var(--max-w);

  margin-inline: auto;

  padding-inline: var(--px);

}

@media (min-width: 1024px) {

  .mah-container { padding-inline: var(--px-lg); }

}

.mah-container-xl { max-width: var(--max-w-xl); margin-inline: auto; padding-inline: var(--px); }

@media (min-width: 1024px) { .mah-container-xl { padding-inline: var(--px-lg); } }



.hairline {

  height: 1px;

  background-color: var(--hairline);

  border: none;

}

.hairline-ivory { background-color: rgba(255,255,255,0.15); }



/* ── 6. Underline hover effect ─────────────────────────────── */

.underline-grow {

  background-image: linear-gradient(currentColor, currentColor);

  background-size: 0% 1px;

  background-position: 50% 100%;

  background-repeat: no-repeat;

  transition: background-size 0.5s cubic-bezier(0.2,0.7,0.2,1);

}

.underline-grow:hover { background-size: 100% 1px; }



/* ── 7. Reveal animations (IntersectionObserver adds .in-view) */

.reveal {

  opacity: 0;

  transform: translateY(24px);

  transition: opacity 1s cubic-bezier(0.2,0.7,0.2,1),

              transform 1s cubic-bezier(0.2,0.7,0.2,1);

  will-change: opacity, transform;

}

.reveal.in-view { opacity: 1; transform: none; }



.reveal-left {

  opacity: 0; transform: translateX(-32px);

  transition: opacity 1s cubic-bezier(0.2,0.7,0.2,1), transform 1s cubic-bezier(0.2,0.7,0.2,1);

}

.reveal-left.in-view { opacity: 1; transform: none; }



.reveal-right {

  opacity: 0; transform: translateX(32px);

  transition: opacity 1s cubic-bezier(0.2,0.7,0.2,1), transform 1s cubic-bezier(0.2,0.7,0.2,1);

}

.reveal-right.in-view { opacity: 1; transform: none; }



.reveal-delay-1 { transition-delay: 0.08s; }

.reveal-delay-2 { transition-delay: 0.18s; }

.reveal-delay-3 { transition-delay: 0.30s; }

.reveal-delay-4 { transition-delay: 0.42s; }



/* Hero elements load immediately (no scroll needed) */

.reveal-now {

  opacity: 0;

  transform: translateY(24px);

  animation: mah-reveal-in 1s cubic-bezier(0.2,0.7,0.2,1) forwards;

}

@keyframes mah-reveal-in { to { opacity: 1; transform: none; } }



/* ── 8. Ken Burns ──────────────────────────────────────────── */

.ken-burns {

  animation: mah-ken-burns 22s ease-out forwards;

  transform-origin: 60% 40%;

}

@keyframes mah-ken-burns {

  from { transform: scale(1.0); }

  to   { transform: scale(1.12); }

}



/* ── 9. Parallax ───────────────────────────────────────────── */

.parallax { will-change: transform; }



/* ── 10. Reduced motion ────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {

  .reveal, .reveal-left, .reveal-right {

    opacity: 1 !important; transform: none !important; transition: none !important;

  }

  .ken-burns { animation: none !important; }

  .reveal-now {

    opacity: 1 !important; transform: none !important; animation: none !important;

  }

}



/* ═══════════════════════════════════════════════════════════

   HEADER

   ═══════════════════════════════════════════════════════════ */

.mah-header {

  position: fixed;

  top: 0; left: 0; right: 0;

  z-index: 50;

  background: rgba(250, 247, 242, 0.95); /* ivory/95 */

  backdrop-filter: blur(12px);

  -webkit-backdrop-filter: blur(12px);

  border-bottom: 1px solid var(--hairline);

  transition: box-shadow 0.5s ease, border-color 0.5s ease;

}

.mah-header.scrolled {

  box-shadow: 0 1px 0 rgba(0,0,0,0.02);

}

.mah-header__inner {

  max-width: var(--max-w-xl);

  margin-inline: auto;

  padding-inline: var(--px);

  height: 80px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 1.5rem;

}

@media (min-width: 1024px) {

  .mah-header__inner {

    padding-inline: var(--px-lg);

    height: 96px;

  }

}



.mah-logo {

  display: flex;

  align-items: center;

  gap: 0.75rem;

  flex-shrink: 0;

  text-decoration: none;

  color: inherit;

}

.mah-logo__img { height: 56px; width: auto; }

@media (min-width: 1024px) { .mah-logo__img { height: 64px; } }

.mah-logo__text { display: none; flex-direction: column; line-height: 1.2; }

@media (min-width: 640px) { .mah-logo__text { display: flex; } }

.mah-logo__name {

  font-family: var(--font-main);

  font-size: 1.25rem;

  letter-spacing: -0.01em;

  color: var(--ink);

}

@media (min-width: 1024px) { .mah-logo__name { font-size: 1.5rem; } }

.mah-logo__sub {

  font-size: 9px;

  letter-spacing: 0.3em;

  text-transform: uppercase;

  color: var(--coffee);

}



.mah-nav {

  display: none;

  align-items: center;

  gap: 2rem;

}

@media (min-width: 1024px) { .mah-nav { display: flex; } }

/* wp_nav_menu wraps items in <ul> — make it flex to apply gap between <a> children.
   GP resets: list-style/margin/padding already 0 from computed styles — explicit anyway. */
.mah-nav > ul {

  display: flex !important;

  align-items: center;

  gap: 1.25rem;

  list-style: none;

  margin: 0;

  padding: 0;

}

.mah-nav a {

  font-size: 0.875rem;

  letter-spacing: 0.05em;

  color: rgba(24,17,8,0.8);

  text-decoration: none;

  white-space: nowrap;

  text-align: center;

}

.mah-nav a:hover { color: var(--ink); }



.mah-header__actions {

  display: flex;

  align-items: center;

  gap: 1rem;

}

@media (min-width: 1024px) { .mah-header__actions { gap: 1.5rem; } }



.mah-header__phone {

  display: none;

  align-items: center;

  gap: 0.375rem;

  font-size: 0.875rem;

  color: rgba(24,17,8,0.6);

  white-space: nowrap;

}

.mah-header__phone a { white-space: nowrap; }

@media (min-width: 768px) { .mah-header__phone { display: flex; } }

/* tablet: shrink phone so +38 (080) 033 76 38 never wraps in the squeezed header */
@media (min-width: 768px) and (max-width: 1023px) { .mah-header__phone { font-size: 0.8125rem; gap: 0.3rem; } }

.mah-header__phone svg { width: 14px; height: 14px; stroke-width: 1.5; }



.mah-lang {

  display: flex;

  align-items: center;

  font-size: 11px;

  letter-spacing: 0.2em;

  text-transform: uppercase;

}

/* D14: min tap target 44px (WCAG 2.5.5) */
.mah-lang a,
.mah-lang span.current {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  min-width: 44px;
  justify-content: center;
}

.mah-lang a, .mah-lang span.sep { color: rgba(24,17,8,0.4); }

.mah-lang a.current { color: var(--ink); }

.mah-lang .sep { margin-inline: 0.375rem; }



.mah-btn-book {

  display: none;

  align-items: center;

  justify-content: center;

  padding: 0.625rem 1.25rem;

  border: 1px solid var(--ink);

  color: var(--ink);

  font-size: 12px;

  letter-spacing: 0.2em;

  text-transform: uppercase;

  min-width: 170px;

  transition: background-color 0.3s ease, color 0.3s ease;

  text-decoration: none;

}

.mah-btn-book:hover { background: var(--ink); color: var(--ivory); }

@media (min-width: 640px) { .mah-btn-book { display: inline-flex; } }



/* Mobile hamburger */

.mah-hamburger {

  display: flex;

  flex-direction: column;

  gap: 5px;

  cursor: pointer;

  padding: 6px;

  background: none;

  border: none;

}

@media (min-width: 1024px) { .mah-hamburger { display: none; } }

.mah-hamburger span {

  display: block;

  width: 24px;

  height: 1px;

  background: var(--ink);

  transition: transform 0.3s ease, opacity 0.3s ease;

}



/* Mobile menu */

.mah-mobile-menu {

  display: none;

  position: fixed;

  inset: 0;

  z-index: 49;

  background: var(--ivory);

  padding: 100px var(--px) var(--px);

  flex-direction: column;

  gap: 0;

}

.mah-mobile-menu.is-open { display: flex; }

.mah-mobile-menu a {

  display: block;

  padding: 1rem 0;

  font-family: var(--font-main);

  font-size: 1.5rem;

  border-bottom: 1px solid var(--hairline);

  color: var(--ink);

}



/* ═══════════════════════════════════════════════════════════

   FOOTER

   ═══════════════════════════════════════════════════════════ */

.mah-footer {

  background: var(--ivory);

  border-top: 1px solid var(--hairline);

  padding: 3.5rem var(--px);

}

@media (min-width: 1024px) { .mah-footer { padding-inline: var(--px-lg); padding-block: 3.5rem; } }

.mah-footer__grid {

  max-width: var(--max-w);

  margin-inline: auto;

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 2.5rem;

}

@media (min-width: 1024px) {

  .mah-footer__grid { grid-template-columns: 2fr 1fr 1fr; }

}

/* Brand block: full width on mobile (span 2 cols), natural 2fr on desktop */
.mah-footer__brand { grid-column: 1 / -1; }

@media (min-width: 1024px) { .mah-footer__brand { grid-column: auto; } }

.mah-footer__brand-name { font-family: var(--font-main); font-size: 1.5rem; }

.mah-footer__brand-sub {

  font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase;

  color: var(--coffee); margin-top: 0.25rem;

}

.mah-footer__brand-desc {

  font-size: 0.875rem;

  color: rgba(24,17,8,0.6);

  margin-top: 1rem;

  max-width: 20rem;

  line-height: 1.6;

}

.mah-footer__col-title {

  font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase;

  color: var(--coffee); margin-bottom: 0.75rem;

}

.mah-footer__col ul { display: flex; flex-direction: column; gap: 0.5rem; }

.mah-footer__col ul a { font-size: 0.875rem; }

.mah-footer__maestro {

  display: flex; align-items: center; gap: 0.5rem;

  font-size: 0.75rem; color: rgba(24,17,8,0.5);

  margin-top: 1rem;

}

/* old single-inline maestro (kept for compat, unused now) */
.mah-footer__maestro img { height: 20px; width: auto; }

/* ── Footer bottom wrapper: flex-col items-center (matches reference) ── */
.mah-footer__bottom-wrap {
  max-width: var(--max-w);
  margin-inline: auto;
  margin-top: 3.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--hairline);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

/* Maestro link: centered block */
.mah-footer__maestro-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  opacity: 0.7;
  transition: opacity 0.2s;
}
.mah-footer__maestro-link:hover { opacity: 1; }

.mah-footer__maestro-label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(24,17,8,0.45);
}

/* Лого Maestro: пропорції 13.4:1 (2486x185), тому висота нижча за стару —
   так ширина лишається ~як раніше (~340-380px), а не 590px.
   object-fit:contain страхує від спотворення, якщо max-width стисне ширину. */
.mah-footer__maestro-logo {
  height: 1.5rem;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  color: var(--ink);     /* для SVG-fallback з fill="currentColor" */
}

@media (min-width: 1024px) { .mah-footer__maestro-logo { height: 1.75rem; } }
@media (max-width: 480px)  { .mah-footer__maestro-logo { height: 1.25rem; } }

/* ── Bottom copyright bar ── */
.mah-footer__bottom {
  width: 100%;
  padding-top: 1.5rem;
  border-top: 1px solid var(--hairline);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(24,17,8,0.5);
}



/* ═══════════════════════════════════════════════════════════

   MOBILE BAR

   ═══════════════════════════════════════════════════════════ */

.mah-mobile-bar {

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  position: fixed;

  bottom: 0; left: 0; right: 0;

  z-index: 50;

  background: rgba(250,247,242,0.95);

  backdrop-filter: blur(12px);

  -webkit-backdrop-filter: blur(12px);

  border-top: 1px solid var(--hairline);

  font-size: 10px;

  letter-spacing: 0.18em;

  text-transform: uppercase;

}

@media (min-width: 1024px) { .mah-mobile-bar { display: none; } }

.mah-mobile-bar a {

  display: flex; flex-direction: column; align-items: center;

  gap: 0.25rem; padding: 0.75rem 0;

  color: var(--ink);

}

.mah-mobile-bar a:nth-child(2) {

  border-left: 1px solid var(--hairline);

  border-right: 1px solid var(--hairline);

}

.mah-mobile-bar svg { width: 16px; height: 16px; color: var(--coffee); stroke-width: 1.5; }

/* Spacer so content isn't hidden behind mobile bar */

.mah-mobile-spacer { height: 64px; }

@media (min-width: 1024px) { .mah-mobile-spacer { display: none; } }



/* ═══════════════════════════════════════════════════════════

   HERO SECTION

   ═══════════════════════════════════════════════════════════ */

.mah-hero {

  position: relative;

  height: 100svh;

  min-height: 640px;

  width: 100%;

  overflow: hidden;

}

.mah-hero__img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 120%;

  top: -10%;

  object-fit: cover;

  object-position: center;

}

.mah-hero__overlay-t {

  position: absolute; inset: 0;

  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.35) 50%, rgba(0,0,0,0.15) 100%);

}

.mah-hero__overlay-l {

  position: absolute; inset: 0;

  background: linear-gradient(to right, rgba(0,0,0,0.55) 0%, transparent 60%);

}

.mah-hero__content {

  position: relative;

  height: 100%;

  max-width: var(--max-w-xl);

  margin-inline: auto;

  padding-inline: var(--px);

  display: flex;

  flex-direction: column;

  justify-content: flex-start;

  padding-top: 6rem;

  padding-bottom: 7rem;

  color: var(--ivory);

}

@media (min-width: 1024px) {

  .mah-hero__content { padding-inline: var(--px-lg); padding-top: 7.5rem; padding-bottom: 9rem; }

}

@media (max-height: 700px) {

  .mah-hero__content { padding-bottom: 3rem; }

}

.mah-hero__inner { max-width: 48rem; margin-top: auto; }

.mah-hero__eyebrow { color: rgba(255,255,255,0.7); margin-bottom: 1.5rem; }

/* H1 exact Tailwind breakpoints from reference:

   text-5xl(3rem) sm:text-6xl(3.75rem) lg:text-7xl(4.5rem) xl:text-8xl(6rem)

   leading-[1.02] tracking-tight(-0.025em) */

.mah-hero__h1 {

  font-family: var(--font-main);

  font-weight: 500;

  font-size: 3rem;          /* text-5xl */

  line-height: 1.02;

  letter-spacing: -0.025em; /* tracking-tight */

  text-shadow: 0 2px 24px rgba(0,0,0,0.45);

  color: var(--ivory);

}

@media (min-width: 640px)  { .mah-hero__h1 { font-size: 3.75rem; } }  /* text-6xl */

@media (min-width: 1024px) { .mah-hero__h1 { font-size: 4.5rem;  } }  /* text-7xl */

@media (min-width: 1280px) { .mah-hero__h1 { font-size: 6rem;    } }  /* text-8xl */

.mah-hero__h1 em { font-style: italic; color: rgba(255,255,255,0.85); }

/* Subtitle: text-base(1rem) lg:text-lg(1.125rem), mt-6 lg:mt-8, max-w-xl(36rem) */

.mah-hero__subtitle {

  margin-top: 1.5rem;        /* mt-6 */

  max-width: 36rem;          /* max-w-xl */

  font-size: 1rem;           /* text-base */

  color: rgba(255,255,255,0.9);

  text-shadow: 0 1px 12px rgba(0,0,0,0.5);

  line-height: 1.6;

}

@media (min-width: 1024px) {

  .mah-hero__subtitle { font-size: 1.125rem; margin-top: 2rem; } /* text-lg, mt-8 */

}

/* mt-10 = 2.5rem exactly as in reference */

.mah-hero__btns {

  margin-top: 2.5rem;

  display: flex;

  flex-wrap: wrap;

  gap: 0.75rem;

}

.mah-btn-primary {

  display: inline-flex;

  align-items: center;

  padding: 0.875rem 1.75rem;

  background: var(--ivory);

  color: var(--ink);

  font-size: 12px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  transition: background-color 0.3s ease;

  text-decoration: none;

}

.mah-btn-primary:hover { background: rgba(250,247,242,0.9); }

.mah-btn-outline {

  display: inline-flex;

  align-items: center;

  padding: 0.875rem 1.75rem;

  border: 1px solid rgba(255,255,255,0.7);

  color: var(--ivory);

  font-size: 12px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  transition: background-color 0.3s ease, color 0.3s ease;

  text-decoration: none;

}

.mah-btn-outline:hover { background: var(--ivory); color: var(--ink); }

.mah-hero__scroll {

  position: absolute;

  bottom: 1.5rem;

  left: 50%;

  transform: translateX(-50%);

  color: rgba(255,255,255,0.6);

  font-size: 10px;

  letter-spacing: 0.3em;

  text-transform: uppercase;

}



/* ═══════════════════════════════════════════════════════════

   SECTION PATTERNS

   ═══════════════════════════════════════════════════════════ */

.mah-section { padding-block: 4rem; padding-inline: var(--px); }

@media (min-width: 1024px) { .mah-section { padding-block: 6rem; padding-inline: var(--px-lg); } }

.mah-section--pebble { background: var(--pebble); }

.mah-section--graphite { background: var(--graphite); color: var(--ivory); }

.mah-section--ink { background: var(--ink); color: var(--ivory); }



.mah-section__eyebrow { margin-bottom: 1rem; }

.mah-section__h2 { font-size: clamp(2rem, 4vw, 3rem); }

.mah-section__h2--large { font-size: clamp(2.5rem, 5vw, 4.5rem); }

.mah-section__header { max-width: 40rem; margin-bottom: 4rem; }

@media (min-width: 1024px) { .mah-section__header { margin-bottom: 5rem; } }



/* ── Grid: hairline separator grid ── */

.mah-grid-hairline {

  display: grid;

  grid-template-columns: 1fr;

  gap: 0;

  background: var(--hairline);

  border-top: 1px solid var(--hairline);

  border-bottom: 1px solid var(--hairline);

}

@media (min-width: 640px) { .mah-grid-hairline { grid-template-columns: 1fr 1fr; } }

@media (min-width: 1024px) { .mah-grid-hairline { grid-template-columns: 1fr 1fr 1fr; } }

.mah-grid-hairline > * {

  background: var(--background);

  padding: 2.5rem 0.5rem;

}

@media (min-width: 1024px) { .mah-grid-hairline > * { padding: 3rem 2rem; } }



/* ── Rooms grid ── */

.mah-rooms-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 2.5rem;

}

@media (min-width: 1024px) { .mah-rooms-grid { grid-template-columns: 1fr 1fr; gap: 3.5rem; } }



.mah-room-card { display: flex; flex-direction: column; }

.mah-room-card__img-wrap {

  position: relative;

  aspect-ratio: 4/3;

  overflow: hidden;

  background: var(--pebble);

}

.mah-room-card__img {

  position: absolute; inset: 0;

  width: 100%; height: 100%;

  object-fit: cover;

  transition: transform 1.4s ease-out;

}

.mah-room-card:hover .mah-room-card__img { transform: scale(1.07); }

.mah-room-card__head {

  padding-top: 1.5rem;

  display: flex;

  align-items: baseline;

  justify-content: space-between;

  gap: 1rem;

  border-bottom: 1px solid var(--hairline);

  padding-bottom: 1rem;

  min-height: 92px;

}

.mah-room-card__name { font-family: var(--font-main); font-size: clamp(1.75rem, 3vw, 2.25rem); line-height: 1.1; }

.mah-room-card__specs {

  margin-top: 1rem;

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  gap: 1rem;

  font-size: 0.875rem;

}

.mah-room-card__spec dt { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); }

.mah-room-card__spec dd { font-family: var(--font-main); font-size: 1.125rem; margin: 0.125rem 0 0; }

.mah-room-card__amenities {

  margin-top: 1.25rem;

  display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem;

  font-size: 0.75rem; color: rgba(24,17,8,0.65);

}

.mah-room-card__amenities li::before { content: "—"; margin-right: 0.5rem; color: var(--coffee); }

.mah-room-card__actions {

  margin-top: auto;

  padding-top: 1.75rem;

  display: flex; gap: 0.75rem;

}

.mah-btn-sm {

  display: inline-flex; align-items: center;

  padding: 0.75rem 1.25rem;

  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;

  transition: background-color 0.3s ease, color 0.3s ease;

  text-decoration: none;

}

.mah-btn-sm--outline { border: 1px solid var(--ink); color: var(--ink); }

.mah-btn-sm--outline:hover { background: var(--ink); color: var(--ivory); }

.mah-btn-sm--solid { background: var(--ink); color: var(--ivory); }

.mah-btn-sm--solid:hover { background: var(--coffee); }



/* ── Reviews grid ── */

.mah-reviews-grid {

  display: grid;

  grid-template-columns: 1fr;

  border-top: 1px solid var(--hairline);

}

@media (min-width: 768px) { .mah-reviews-grid { grid-template-columns: 1fr 1fr 1fr; } }

.mah-review {

  padding: 2rem;

  border-bottom: 1px solid var(--hairline);

  display: flex; flex-direction: column;

}

@media (min-width: 768px) {

  .mah-review {

    border-bottom: none;

    border-right: 1px solid var(--hairline);

    padding: 2.5rem;

  }

  .mah-review:last-child { border-right: none; }

}

.mah-review blockquote {

  font-family: var(--font-main);

  font-size: clamp(1.1rem, 2vw, 1.4rem);

  line-height: 1.35;

  flex: 1;

}

.mah-review__quote-mark { color: var(--coffee); margin-right: 0.25rem; }

.mah-review figcaption {

  margin-top: 2rem; padding-top: 1rem;

  border-top: 1px solid var(--hairline);

}

.mah-review__author { font-family: var(--font-main); font-size: 1rem; }

.mah-review__role { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); margin-top: 0.25rem; }



/* ── Restaurant section (graphite bg) ── */

.mah-restaurant__grid {

  max-width: var(--max-w);

  margin-inline: auto;

  display: grid;

  grid-template-columns: 1fr;

  gap: 2.5rem;

  align-items: center;

}

@media (min-width: 1024px) {

  .mah-restaurant__grid { grid-template-columns: 7fr 5fr; gap: 4rem; }

}

.mah-restaurant__img { width: 100%; aspect-ratio: 5/4; object-fit: cover; }

.mah-restaurant__stats { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.5rem; margin-top: 2.5rem; }

.mah-restaurant__stat-val { font-family: var(--font-main); font-size: 1.875rem; color: var(--ivory); }

.mah-restaurant__stat-label { font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--brass); margin-top: 0.25rem; }



/* ── History section ── */

.mah-history__grid {

  max-width: var(--max-w);

  margin-inline: auto;

  display: grid;

  grid-template-columns: 1fr;

  gap: 2.5rem;

  align-items: center;

}

@media (min-width: 1024px) {

  .mah-history__grid { grid-template-columns: 5fr 7fr; gap: 4rem; }

}

.mah-history__img { width: 100%; aspect-ratio: 3/4; object-fit: cover; filter: sepia(0.2); }

.mah-history__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 2.5rem; margin-top: 3rem; max-width: 36rem; }

.mah-history__fact { border-top: 1px solid var(--hairline); padding-top: 0.75rem; }

.mah-history__fact dt { font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--coffee); margin-bottom: 0.25rem; }

.mah-history__fact dd { font-family: var(--font-main); font-size: 1.25rem; margin: 0; }



/* ── Conferences 2-col grid (5fr + 7fr on desktop) ── */

.mah-conf-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }

@media (min-width: 1024px) { .mah-conf-grid { grid-template-columns: 5fr 7fr; gap: 4rem; align-items: start; } }



/* ── Location 2-col grid (5fr + 7fr on desktop) ── */

/* Location: stretch both cols to same row-height so map fills the column */
.mah-location-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }

@media (min-width: 1024px) {
  .mah-location-grid { grid-template-columns: 5fr 7fr; gap: 4rem; align-items: stretch; }
  /* Right col is a flex column so map wrapper can grow to fill it */
  .mah-location-grid .mah-location-map-col { display: flex; flex-direction: column; }
}



/* ── Map wrapper: aspect-ratio 4/3 mobile → flex-grow on desktop ── */

.mah-map-wrap { aspect-ratio: 4/3; border: 1px solid var(--hairline); overflow: hidden; }

@media (min-width: 1024px) { .mah-map-wrap { aspect-ratio: auto; flex: 1; min-height: 480px; } }

.mah-map-wrap iframe { width: 100%; height: 100%; min-height: 480px; border: none; display: block; filter: grayscale(0.3) contrast(1.1); }



/* ── Final CTA ── */

.mah-cta { text-align: center; max-width: 68rem; margin-inline: auto; }

.mah-cta__eyebrow { font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--brass); margin-bottom: 2rem; }

.mah-cta__h2 { font-size: clamp(2.5rem, 6vw, 5rem); line-height: 1.02; color: var(--ivory); }

.mah-cta__h2 em { font-style: italic; color: rgba(255,255,255,0.7); }

.mah-cta__btns { margin-top: 3rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; }



/* ── Page Hero (inner pages) ── */

.mah-page-hero {

  position: relative;

  height: clamp(380px, 50vw, 560px);

  overflow: hidden;

  background: var(--graphite);

}

.mah-page-hero__img {

  position: absolute; inset: 0;

  width: 100%; height: 100%;

  object-fit: cover; opacity: 0.6;

}

.mah-page-hero__overlay {

  position: absolute; inset: 0;

  background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.2) 100%);

}

.mah-page-hero__content {

  position: relative; height: 100%;

  max-width: var(--max-w-xl); margin-inline: auto;

  padding-inline: var(--px);

  display: flex; flex-direction: column; justify-content: flex-end;

  padding-bottom: 3rem; color: var(--ivory);

}

@media (min-width: 1024px) { .mah-page-hero__content { padding-inline: var(--px-lg); padding-bottom: 4rem; } }

.mah-page-hero__h1 { font-size: clamp(2.25rem, 5vw, 4rem); text-shadow: 0 2px 16px rgba(0,0,0,0.4); }

.mah-page-hero__subtitle { margin-top: 0.75rem; font-size: 1.0625rem; color: rgba(255,255,255,0.8); }



/* ── Breadcrumb ── */

.mah-breadcrumb {

  padding: 1rem var(--px);

  border-bottom: 1px solid var(--hairline);

  font-size: 0.75rem;

  letter-spacing: 0.12em;

  color: rgba(24,17,8,0.5);

}

@media (min-width: 1024px) { .mah-breadcrumb { padding-inline: var(--px-lg); } }

.mah-breadcrumb a { color: var(--coffee); }

.mah-breadcrumb span { margin-inline: 0.5rem; }



/* ── Single room page ── */

/* ── Room photos — Booking-style grid ───────────────────────────
   1 велике фото зліва + сітка 2×2 мініатюр справа. На місці старого
   слайдера .mah-room-gallery (видалено разом з його CSS/JS).
   Клік по будь-якій комірці → спільний lightbox (main.js §8b). */

.mah-room-booking { width: 100%; margin: 0 0 2.5rem; }

.mah-room-booking__grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 8px;

}

.mah-room-booking__thumbs {

  display: grid;

  grid-template-columns: 1fr 1fr;

  grid-template-rows: 1fr 1fr;

  gap: 8px;

  min-height: 0;

}

/* Комірка — <button>, тому глушимо глобальні стилі кнопок теми */

.mah-room-booking__cell {

  position: relative;

  display: block;

  padding: 0;

  margin: 0;

  border: 0;

  border-radius: 0;

  background: #f5f3ef;

  overflow: hidden;

  cursor: zoom-in;

  width: 100%;

  min-width: 0;

}

.mah-room-booking__main { aspect-ratio: 4/3; }

.mah-room-booking__thumb { height: 100%; min-height: 0; }

/* absolute — щоб мініатюри НЕ додавали власної intrinsic-висоти:
   висоту ряду задає лише .__main через aspect-ratio, інакше колонка
   мініатюр розтягує сітку і під великим фото лишається щілина */

.mah-room-booking__cell img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

  transition: transform 0.45s var(--ease-out, cubic-bezier(0.16,1,0.3,1));

}

.mah-room-booking__cell:hover img { transform: scale(1.04); }

.mah-room-booking__cell:focus-visible { outline: 2px solid var(--coffee); outline-offset: 2px; }

/* «+N фото» на останній мініатюрі */

.mah-room-booking__more {

  position: absolute;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  background: rgba(0,0,0,0.5);

  color: #fff;

  font-size: 1rem;

  letter-spacing: 0.04em;

  text-align: center;

  padding: 0.5rem;

  transition: background 0.2s;

}

.mah-room-booking__cell:hover .mah-room-booking__more { background: rgba(0,0,0,0.6); }

/* Планшет: велике зверху на всю ширину + 4 мініатюри в ряд */

@media (max-width: 768px) {

  .mah-room-booking__grid { grid-template-columns: 1fr; }

  .mah-room-booking__thumbs { grid-template-columns: repeat(4, 1fr); grid-template-rows: auto; }

  .mah-room-booking__thumb { height: auto; aspect-ratio: 4/3; }

}

/* Мобільний: велике фото + горизонтальний скрол мініатюр */

@media (max-width: 480px) {

  .mah-room-booking__thumbs {

    display: flex;

    overflow-x: auto;

    scroll-snap-type: x mandatory;

    scrollbar-width: none;

    -ms-overflow-style: none;

  }

  .mah-room-booking__thumbs::-webkit-scrollbar { display: none; }

  .mah-room-booking__thumb { flex: 0 0 38%; scroll-snap-align: start; }

}

.mah-room-meta {

  display: grid; grid-template-columns: 1fr 1fr;

  gap: 2rem; margin-top: 2rem;

}

@media (min-width: 768px) { .mah-room-meta { grid-template-columns: repeat(4, 1fr); } }

.mah-room-meta__item dt { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); }

.mah-room-meta__item dd { font-family: var(--font-main); font-size: 1.25rem; margin-top: 0.25rem; }

.mah-room-highlights { list-style: none; padding: 0; }

.mah-room-highlights li {

  padding: 0.75rem 0; border-bottom: 1px solid var(--hairline);

  display: flex; gap: 0.75rem; align-items: baseline;

}

.mah-room-highlights li::before { content: "—"; color: var(--coffee); flex-shrink: 0; }

.mah-room-amenities { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }

.mah-room-amenities li { font-size: 0.875rem; }

.mah-room-amenities li::before { content: "✓ "; color: var(--coffee); }

.mah-faq { border-top: 1px solid var(--hairline); }

.mah-faq-item { border-bottom: 1px solid var(--hairline); }

.mah-faq-item summary {

  display: flex; justify-content: space-between; align-items: center;

  padding: 1.25rem 0; cursor: pointer; list-style: none;

  font-family: var(--font-main); font-size: 1.0625rem;

}

.mah-faq-item summary::after {

  content: "+"; font-size: 1.25rem; color: var(--coffee); transition: transform 0.3s;

  flex-shrink: 0; margin-left: 1rem;

}

.mah-faq-item[open] summary::after { transform: rotate(45deg); }

.mah-faq-item .mah-faq-answer { padding-bottom: 1.25rem; color: rgba(24,17,8,0.75); line-height: 1.7; }



/* ════════════════════════════════════════════════════════════
   Journal / Blog — archive-article.php
   Prefix: mah-journal-* and mah-article-card__*
   Rule 6.5: grep confirmed 0 conflicts before writing
   ════════════════════════════════════════════════════════════ */

/* ── Hero (42vh — matches ref h-[42vh] min-h-[320px]) ────── */
.mah-journal-page { background: #fff; padding-top: 5rem; }
@media (min-width: 1024px) { .mah-journal-page { padding-top: 6rem; } }

.mah-journal-hero {
    position: relative;
    height: 42vh;
    min-height: 320px;
    overflow: hidden;
}
.mah-journal-hero__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mah-journal-hero__overlay {
    position: absolute;
    inset: 0;
    background: rgba(24,17,8,0.45);
}
.mah-journal-hero__gradient-x {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(24,17,8,0.85) 0%, rgba(24,17,8,0.55) 45%, transparent 100%);
}
.mah-journal-hero__gradient-y {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(24,17,8,0.60) 0%, transparent 60%);
}
.mah-journal-hero__inner {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: var(--ivory);
    text-shadow: 0 1px 24px rgba(0,0,0,0.35);
}
.mah-journal-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--pebble);
    margin-bottom: 1rem;
}
.mah-journal-breadcrumb a { color: var(--pebble); transition: color 0.2s; }
.mah-journal-breadcrumb a:hover { color: var(--ivory); }

.mah-journal-h1 {
    font-family: var(--font-main);
    font-size: clamp(2rem, 5vw, 3.75rem);
    line-height: 1.05;
    color: var(--ivory);
}
.mah-journal-intro {
    margin-top: 1rem;
    max-width: 36rem;
    color: rgba(247,243,237,0.9);
    font-size: 1rem;
    line-height: 1.65;
}

/* ── Grid section ─────────────────────────────────────────── */
.mah-journal-section {
    padding-top: 4rem;
    padding-bottom: 6rem;
}
@media (min-width: 1024px) {
    .mah-journal-section { padding-top: 6rem; padding-bottom: 8rem; }
}

/* Grid: 1 → 2 → 3 cols; gap-x: 2rem, gap-y: 3.5rem (ref gap-x-8 gap-y-14) */
.mah-journal-grid {
    display: grid;
    grid-template-columns: 1fr;
    column-gap: 2rem;
    row-gap: 3.5rem;
}
@media (min-width: 640px)  { .mah-journal-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .mah-journal-grid { grid-template-columns: 1fr 1fr 1fr; } }

/* ── Article card ─────────────────────────────────────────── */
.mah-article-card {
    display: flex;
    flex-direction: column;
}

/* Image link (block overflow-hidden with aspect 4:3) */
.mah-article-card__img-link {
    display: block;
    overflow: hidden;
    margin-bottom: 1.25rem;
    aspect-ratio: 4/3;
    background: var(--pebble);  /* placeholder bg while loading */
}
.mah-article-card__img-placeholder {
    width: 100%;
    height: 100%;
    background: var(--pebble);
}
.mah-article-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}
.mah-article-card:hover .mah-article-card__img {
    transform: scale(1.05);
}

/* Meta row: category · date */
.mah-article-card__meta-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--coffee);
    margin-bottom: 0.75rem;
}
.mah-article-card__cat  { color: var(--coffee); }
.mah-article-card__dot  { opacity: 0.4; }
.mah-article-card__date { color: rgba(24,17,8,0.5); }

/* Title */
.mah-article-card__title {
    font-family: var(--font-main);
    font-size: clamp(1.125rem, 1.8vw, 1.5rem);
    line-height: 1.25;
    margin-bottom: 0.75rem;
}
.mah-article-card__title a { color: var(--ink); }
.mah-article-card__title a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Excerpt */
.mah-article-card__excerpt {
    font-size: 0.875rem;
    color: rgba(24,17,8,0.65);
    line-height: 1.65;
    margin-bottom: 1rem;
}

/* "Читати" link */
.mah-article-card__read {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.mah-article-card__read-icon {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0;
}

/* Empty state */
.mah-journal-empty {
    text-align: center;
    color: rgba(24,17,8,0.45);
    padding: 4rem 0;
}

/* ── Pagination ───────────────────────────────────────────── */
.mah-journal-pagination {
    margin-top: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
@media (min-width: 1024px) { .mah-journal-pagination { margin-top: 5rem; } }

.mah-journal-page-nav {
    padding: 0.5rem 0.75rem;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink);
    transition: opacity 0.2s;
}
a.mah-journal-page-nav:hover { opacity: 0.6; }
.mah-journal-page-nav--disabled {
    color: rgba(24,17,8,0.3);
    cursor: not-allowed;
    pointer-events: none;
}
.mah-journal-page-btn {
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-main);
    font-size: 1.125rem;
    color: rgba(24,17,8,0.35);
    transition: background 0.2s, color 0.2s;
}
a.mah-journal-page-btn:hover {
    background: var(--pebble);
    color: var(--ink);
}
.mah-journal-page-btn--active {
    background: var(--ink);
    color: var(--ivory) !important;
    cursor: default;
    pointer-events: none;
}

/* Legacy compat (old classes from initial stub — keep for archive-room reuse) */
.mah-article-card__body  { padding-top: 0; }
.mah-article-card__meta  { font-size: 11px; color: rgba(24,17,8,0.4); margin-top: 0.75rem; }



/* ── Services tiles (Турбота) — Ref: Services.tsx 4-col grid ── */
/* grid cols: 1→sm:2→lg:3→xl:4, hairline bg separator, min-height 200px */
/* Services grid: table-border trick — border on every tile + left/top on grid
   creates hairline separators between ALL cells (vertical + horizontal) */
.mah-services-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top:  1px solid var(--hairline);
  border-left: 1px solid var(--hairline);
}
@media (min-width: 640px)  { .mah-services-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .mah-services-grid { grid-template-columns: 1fr 1fr 1fr; } }
@media (min-width: 1280px) { .mah-services-grid { grid-template-columns: 1fr 1fr 1fr 1fr; } }

.mah-service-tile {
  background: var(--ivory);
  padding: 1.75rem;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  transition: background-color 0.3s ease;
  will-change: auto;  /* prevent GPU compositing layer that breaks 1px borders */
  /* table-border: right + bottom on each tile + grid border-top/left = full hairline grid */
  border-right:  1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
@media (min-width: 1024px) { .mah-service-tile { padding: 2.25rem; } }
.mah-service-tile:hover { background: var(--pebble); }
/* Equal-height service titles so note blocks start on the same baseline across cards.
   4em covers the longest title (up to 3 lines at the 4-col desktop width). Only applied
   when cards sit side by side (>=640px); single-column mobile needs no reservation. */
.mah-service-tile__title { line-height: 1.3; }
@media (min-width: 640px) { .mah-service-tile__title { min-height: 4em; } }

/* Location grid — 2 columns on desktop */
@media (min-width: 1024px) {
  #contacts .mah-container > div { grid-template-columns: 5fr 7fr !important; }
}

/* Conferences — two-col on desktop */
@media (min-width: 1024px) {
  #conferences .mah-container > div { grid-template-columns: 5fr 7fr !important; }
}

/* ── Contacts ── */

.mah-contacts-grid {

  display: grid; grid-template-columns: 1fr;

  gap: 3rem;

}

@media (min-width: 1024px) { .mah-contacts-grid { grid-template-columns: 5fr 7fr; } }

.mah-contacts-info dt { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); margin-bottom: 0.25rem; }

.mah-contacts-info dd { font-size: 1rem; margin-bottom: 1.5rem; }

.mah-map iframe { width: 100%; height: 400px; border: none; display: block; }

/* ── Contacts page — mah-contacts-* (Rule 6.5: unique prefix) ── */

.mah-contacts-items { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }

@media (min-width: 640px) { .mah-contacts-items { grid-template-columns: repeat(2, 1fr); } }

@media (min-width: 1024px) { .mah-contacts-items { grid-template-columns: repeat(4, 1fr); } }

.mah-contacts-item { border-top: 1px solid var(--hairline); padding-top: 1.25rem; }

.mah-contacts-item__label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); margin-bottom: 0.5rem; }

.mah-contacts-item__value { font-family: var(--font-main); font-size: 1.125rem; line-height: 1.3; }

.mah-contacts-item__value a { color: inherit; text-decoration: none; }

.mah-contacts-messengers { display: flex; flex-wrap: wrap; gap: 1rem; }

.mah-contacts-msg-btn {

  display: inline-flex; align-items: center; gap: 0.5rem;

  padding: 0.75rem 1.5rem;

  border: 1px solid var(--ink);

  font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;

  text-decoration: none; color: var(--ink);

  transition: background 0.2s, color 0.2s;

}

.mah-contacts-msg-btn:hover { background: var(--ink); color: var(--ivory); }

.mah-contacts-map iframe { display: block; width: 100%; height: 460px; border: 0; }

.mah-contacts-dir__grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }

@media (min-width: 768px) { .mah-contacts-dir__grid { grid-template-columns: repeat(3, 1fr); } }

.mah-contacts-dir__item { border-top: 1px solid rgba(24,17,8,0.2); padding-top: 1.25rem; }

.mah-contacts-dir__from { font-family: var(--font-main); font-size: clamp(1.25rem, 2.5vw, 1.5rem); margin-bottom: 0.75rem; }

.mah-contacts-dir__how { color: rgba(24,17,8,0.7); line-height: 1.7; }

.mah-contacts-form-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }

@media (min-width: 1024px) { .mah-contacts-form-grid { grid-template-columns: 5fr 7fr; gap: 4rem; } }

.mah-contacts-form { display: grid; grid-template-columns: 1fr; gap: 1.75rem; }

@media (min-width: 640px) { .mah-contacts-form { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }

.mah-contacts-field--full { grid-column: 1 / -1; }

.mah-contacts-field__label { display: block; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); margin-bottom: 0.5rem; }

.mah-contacts-field input,
.mah-contacts-field textarea {

  width: 100%;

  background: transparent;

  border: none !important;

  border-bottom: 1px solid var(--hairline) !important;

  border-radius: 0 !important;

  box-shadow: none !important;

  padding: 0.5rem 0 !important;

  font-family: var(--font-main);

  font-size: 1.125rem; color: var(--ink);

  outline: none; resize: none;

}

.mah-contacts-field input:focus,
.mah-contacts-field textarea:focus { border-bottom-color: var(--coffee) !important; box-shadow: none !important; }


/* ── Utility ── */

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

.mt-0 { margin-top: 0; }

.text-coffee { color: var(--coffee); }

.text-brass  { color: var(--brass); }

.text-ivory  { color: var(--ivory); }



/* ═══════════════════════════════════════════════════════════

   SINGLE ROOM PAGE
   Ref: _reference-src/src/routes/room.$slug.tsx

   ═══════════════════════════════════════════════════════════ */

/* ── 1. HERO ───────────────────────────────────────────────── */

.mah-room-hero {

  position: relative;

  height: 68vh;

  min-height: 460px;

  overflow: hidden;

  width: 100%;

}

.mah-room-hero__img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.mah-room-hero__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(

    to top,

    rgba(0,0,0,0.82) 0%,

    rgba(0,0,0,0.58) 35%,

    rgba(0,0,0,0.22) 62%,

    rgba(0,0,0,0.28) 100%

  );

}

.mah-room-hero__content {

  position: relative;

  height: 100%;

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-bottom: 3rem;

  display: flex;

  flex-direction: column;

  justify-content: flex-end;

  color: #fefcf8;

}

@media (min-width: 1024px) {

  .mah-room-hero__content {

    padding-inline: 2.5rem;

    padding-bottom: 4rem;

  }

}

.mah-room-hero__back {

  position: absolute;

  top: 7rem;

  left: 1.5rem;

  display: inline-flex;

  align-items: center;

  gap: 0.5rem;

  font-size: 0.875rem;

  color: rgba(254,252,248,0.85);

  text-decoration: none;

  transition: color 0.2s;

}

.mah-room-hero__back:hover { color: #fefcf8; }

@media (min-width: 1024px) { .mah-room-hero__back { left: 2.5rem; } }

.mah-room-hero__back-icon svg { width: 16px; height: 16px; vertical-align: middle; }

.mah-room-hero__eyebrow {

  font-size: 11px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: rgba(254,252,248,0.7);

  margin-bottom: 0.75rem;

  text-shadow: 0 1px 8px rgba(0,0,0,0.7);

}

.mah-room-hero__h1 {

  font-size: clamp(2.25rem, 6vw, 4.5rem);

  font-weight: 500;

  line-height: 1.03;

  text-shadow: 0 2px 20px rgba(0,0,0,0.4);

  color: #fefcf8;

  letter-spacing: -0.01em;

  margin: 0;

}

.mah-room-hero__specs {

  margin-top: 1.25rem;

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  column-gap: 2rem;

  row-gap: 0.5rem;

  font-size: 0.875rem;

  color: rgba(254,252,248,0.85);

  text-shadow: 0 1px 6px rgba(0,0,0,0.6);

}

.mah-room-hero__specs-dot { opacity: 0.4; }

.mah-room-hero__allphotos {

  margin-top: 1.75rem;

  align-self: flex-start;

  display: inline-flex;

  align-items: center;

  gap: 0.5rem;

  padding: 0.75rem 1.25rem;

  background: rgba(254,252,248,0.18);

  backdrop-filter: blur(6px);

  -webkit-backdrop-filter: blur(6px);

  border: 1.5px solid rgba(254,252,248,0.70);

  color: #fefcf8;

  font-size: 11px;

  letter-spacing: 0.2em;

  text-transform: uppercase;

  cursor: pointer;

  transition: background 0.25s, color 0.25s;

  font-family: var(--font-main);

}

.mah-room-hero__allphotos:hover { background: #fefcf8; color: var(--ink); }

.mah-room-hero__allphotos-icon svg { width: 16px; height: 16px; vertical-align: middle; }

/* ── 2. SPECS STRIP ────────────────────────────────────────── */

.mah-room-specs {

  border-bottom: 1px solid var(--hairline);

  background: #fff;

}

.mah-room-specs__inner {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-block: 1.25rem;

  display: grid;

  grid-template-columns: 1fr 1fr;

  column-gap: 2rem;

  row-gap: 2rem;

}

@media (min-width: 1024px) {

  .mah-room-specs__inner {

    padding-inline: 2.5rem;

    padding-block: 1.5rem;

    grid-template-columns: repeat(4, 1fr);

  }

}

.mah-room-spec {

  display: flex;

  flex-direction: column;

  align-items: center;

  text-align: center;

  gap: 0.5rem;

  padding-inline: 0.5rem;

}

.mah-room-spec__icon svg { width: 24px; height: 24px; color: var(--coffee); }

.mah-room-spec__label {

  font-size: 10px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: var(--coffee);

  margin-top: 0.25rem;

}

.mah-room-spec__value {

  font-size: 1rem;

  line-height: 1.3;

}

@media (min-width: 1024px) { .mah-room-spec__value { font-size: 1.125rem; } }

/* ── 3. DESCRIPTION + BOOKING ──────────────────────────────── */

.mah-room-body-wrap { background: #fff; }

.mah-room-body {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-block: 3.5rem;

  display: grid;

  grid-template-columns: 1fr;

  gap: 2.5rem;

}

@media (min-width: 1024px) {

  .mah-room-body {

    padding-inline: 2.5rem;

    padding-block: 5rem;

    grid-template-columns: 7fr 5fr;

    gap: 4rem;

  }

}

.mah-room-body__desc h2 {

  font-size: clamp(1.5rem, 2.5vw, 1.875rem);

  margin-bottom: 1.25rem;

}

.mah-room-body__text {

  color: rgba(24,18,11,0.75);

  line-height: 1.7;

  max-width: 42rem;

}

.mah-room-body__highlights {

  margin-top: 2rem;

  display: grid;

  grid-template-columns: 1fr;

  gap: 0.75rem 2.5rem;

  max-width: 42rem;

  list-style: none;

  padding: 0;

  margin-left: 0;

}

@media (min-width: 640px) {

  .mah-room-body__highlights { grid-template-columns: 1fr 1fr; }

}

.mah-room-body__hl-item {

  display: flex;

  align-items: flex-start;

  gap: 0.75rem;

  color: rgba(24,18,11,0.8);

}

.mah-room-body__hl-dot {

  display: block;

  width: 6px;

  height: 6px;

  border-radius: 50%;

  background: var(--coffee);

  flex-shrink: 0;

  margin-top: 0.45rem;

}

.mah-room-body__hl-sub { color: rgba(24,18,11,0.55); }

@media (min-width: 1024px) {

  .mah-room-body__book {

    border-left: 1px solid var(--hairline);

    padding-left: 3rem;

  }

}

.mah-room-body__book-btn {

  display: inline-flex;

  align-items: center;

  padding: 1rem 2rem;

  background: var(--ink);

  color: #fefcf8;

  font-size: 12px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  text-decoration: none;

  transition: background 0.25s;

  font-family: var(--font-main);

}

.mah-room-body__book-btn:hover { background: var(--coffee); }

.mah-room-body__price-note {

  margin-top: 1rem;

  font-size: 0.75rem;

  color: rgba(24,18,11,0.45);

  margin-bottom: 0;

}

.mah-room-body__phone {

  margin-top: 1.5rem;

  font-size: 0.875rem;

  color: rgba(24,18,11,0.55);

  margin-bottom: 0;

}

.mah-room-body__phone a { color: var(--ink); }

/* ── 4. AMENITIES ──────────────────────────────────────────── */

.mah-room-amenities {

  display: block; /* override old card rule: display:flex flex-wrap:wrap */

  padding-inline: 1.5rem;

  padding-block: 3.5rem;

  background: #fff;

}

@media (min-width: 1024px) {

  .mah-room-amenities { padding-inline: 2.5rem; padding-block: 5rem; }

}

.mah-room-amenities__inner { max-width: 1280px; margin-inline: auto; }

.mah-room-amenities h2 {

  font-size: clamp(1.5rem, 2.5vw, 1.875rem);

  margin-bottom: 2rem;

}

.mah-room-amenities__grid {

  display: grid;

  grid-template-columns: 1fr;

  column-gap: 2.5rem;

  row-gap: 0; /* visual spacing comes from pb on each item */

  list-style: none;

  padding: 0;

  margin: 0;

}

@media (min-width: 640px) { .mah-room-amenities__grid { grid-template-columns: 1fr 1fr; } }

@media (min-width: 1024px) { .mah-room-amenities__grid { grid-template-columns: 1fr 1fr 1fr; } }

.mah-room-amenity-item {

  display: flex;

  align-items: center;

  gap: 0.75rem;

  border-bottom: 1px solid var(--hairline);

  padding-bottom: 1rem;

  padding-top: 0.75rem;

  color: rgba(24,18,11,0.8);

}

.mah-room-check-icon { flex-shrink: 0; display: inline-flex; align-items: center; }

.mah-room-check-icon svg { width: 16px; height: 16px; color: var(--coffee); flex-shrink: 0; }

/* suppress the old front-page card ✓ ::before that leaks into single-room amenities */
.mah-room-amenities__grid li::before { content: none; }

/* override old card rule: .mah-room-amenities li { font-size: 0.875rem }
   same (0,1,1) specificity but later in sheet → wins                     */
.mah-room-amenities__grid li { font-size: 1rem; }

/* ── 5. CONDITIONS (dark-ink) ──────────────────────────────── */

.mah-room-conditions {

  background: var(--ink);

  color: #fefcf8;

  padding-inline: 1.5rem;

  padding-block: 3.5rem;

}

@media (min-width: 1024px) {

  .mah-room-conditions { padding-inline: 2.5rem; padding-block: 5rem; }

}

.mah-room-conditions__inner { max-width: 1280px; margin-inline: auto; }

.mah-room-conditions h2 {

  font-size: clamp(1.5rem, 2.5vw, 1.875rem);

  margin-bottom: 2.5rem;

  color: #fefcf8;

}

.mah-room-conditions__grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 2rem 2.5rem;

}

@media (min-width: 640px) { .mah-room-conditions__grid { grid-template-columns: 1fr 1fr; } }

@media (min-width: 1024px) { .mah-room-conditions__grid { grid-template-columns: repeat(4, 1fr); } }

.mah-room-condition-item {

  border-top: 1px solid rgba(255,255,255,0.15);

  padding-top: 1rem;

}

.mah-room-condition-icon svg { width: 24px; height: 24px; color: var(--brass); margin-bottom: 0.75rem; }

.mah-room-condition-title {

  font-size: 1.125rem;

  line-height: 1.3;

  color: #fefcf8;

}

@media (min-width: 1024px) { .mah-room-condition-title { font-size: 1.25rem; } }

.mah-room-condition-desc {

  font-size: 0.875rem;

  color: rgba(255,255,255,0.55);

  margin-top: 0.25rem;

}

/* ── 6. LOCATION NEARBY ────────────────────────────────────── */

.mah-room-location {

  padding-inline: 1.5rem;

  padding-block: 3.5rem;

  background: #fff;

}

@media (min-width: 1024px) {

  .mah-room-location { padding-inline: 2.5rem; padding-block: 5rem; }

}

.mah-room-location__inner {

  max-width: 1280px;

  margin-inline: auto;

  display: grid;

  grid-template-columns: 1fr;

  gap: 2.5rem;

}

@media (min-width: 1024px) {

  .mah-room-location__inner { grid-template-columns: 5fr 7fr; gap: 4rem; }

}

.mah-room-location h2 {

  font-size: clamp(1.5rem, 2.5vw, 1.875rem);

  line-height: 1.2;

  margin-top: 1rem;

}

.mah-room-location__text {

  margin-top: 1rem;

  color: rgba(24,18,11,0.7);

  max-width: 28rem;

  line-height: 1.7;

  margin-bottom: 0;

}

.mah-room-nearby-list {

  display: grid;

  grid-template-columns: 1fr 1fr;

  column-gap: 2.5rem;

  margin: 0;

}

.mah-room-nearby-item {

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-bottom: 1px solid var(--hairline);

  padding-block: 1rem;

}

.mah-room-nearby-item__place {

  display: flex;

  align-items: center;

  gap: 0.5rem;

  color: rgba(24,18,11,0.8);

  margin: 0;

}

.mah-room-mappin-icon svg { width: 16px; height: 16px; color: var(--coffee); }

.mah-room-nearby-item__dist {

  font-size: 0.875rem;

  color: rgba(24,18,11,0.55);

  margin: 0;

}

/* ── 7. FAQ ────────────────────────────────────────────────── */

.mah-room-faq {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-block: 3.5rem;

}

@media (min-width: 1024px) {

  .mah-room-faq { padding-inline: 2.5rem; padding-block: 5rem; }

}

.mah-room-faq h2 {

  font-size: clamp(1.5rem, 2.5vw, 1.875rem);

  margin-bottom: 2rem;

}

.mah-room-faq__accordion {

  max-width: 48rem;

  border-top: 1px solid var(--hairline);

  border-bottom: 1px solid var(--hairline);

}

.mah-room-faq__item {

  border-bottom: 1px solid var(--hairline);

  padding-block: 1.25rem;

}

.mah-room-faq__item:last-child { border-bottom: none; }

.mah-room-faq__summary {

  display: flex;

  align-items: center;

  justify-content: space-between;

  cursor: pointer;

  list-style: none;

  gap: 1rem;

}

.mah-room-faq__summary::-webkit-details-marker { display: none; }

.mah-room-faq__summary::marker { display: none; }

.mah-room-faq__summary .font-serif {

  font-size: 1.125rem;

  line-height: 1.3;

}

@media (min-width: 1024px) { .mah-room-faq__summary .font-serif { font-size: 1.25rem; } }

.mah-room-faq__plus {

  color: var(--coffee);

  font-size: 1.5rem;

  line-height: 1;

  transition: transform 0.3s cubic-bezier(0.2,0.7,0.2,1);

  flex-shrink: 0;

  user-select: none;

}

.mah-room-faq__item[open] .mah-room-faq__plus { transform: rotate(45deg); }

.mah-room-faq__answer {

  margin-top: 0.75rem;

  color: rgba(24,18,11,0.7);

  line-height: 1.7;

  max-width: 42rem;

  margin-bottom: 0;

}

/* ── 8. SIMILAR ROOMS ──────────────────────────────────────── */

.mah-room-similar {

  padding-inline: 1.5rem;

  padding-block: 3.5rem;

}

@media (min-width: 1024px) {

  .mah-room-similar { padding-inline: 2.5rem; padding-block: 5rem; }

}

.mah-room-similar__inner { max-width: 1280px; margin-inline: auto; }

.mah-room-similar__hdr {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  margin-bottom: 2.5rem;

}

.mah-room-similar__hdr h2 { font-size: clamp(1.5rem, 2.5vw, 1.875rem); }

.mah-room-similar__hdr a {

  font-size: 0.875rem;

  letter-spacing: 0.2em;

  text-transform: uppercase;

  color: var(--coffee);

  text-decoration: none;

}

.mah-room-similar__grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 2rem;

}

@media (min-width: 768px) { .mah-room-similar__grid { grid-template-columns: repeat(3, 1fr); } }

/* ── similar-card: single-room.php "Other rooms" section (Rule 6.5: unique prefix) ── */
.mah-similar-card { display: block; text-decoration: none; color: inherit; }

.mah-similar-card__img-wrap {

  position: relative;

  aspect-ratio: 4 / 3;

  overflow: hidden;

  background: var(--ivory);

}

.mah-similar-card__img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 1.2s ease-out;

}

.mah-similar-card:hover .mah-similar-card__img { transform: scale(1.05); }

.mah-similar-card__name { font-size: 1.25rem; margin-top: 1rem; line-height: 1.2; }

@media (min-width: 1024px) { .mah-similar-card__name { font-size: 1.5rem; } }

.mah-similar-card__meta { font-size: 0.875rem; color: rgba(24,18,11,0.55); margin-top: 0.25rem; }

/* ── 9. LIGHTBOX ───────────────────────────────────────────── */

.mah-lightbox {

  display: none;

  position: fixed;

  inset: 0;

  z-index: 100;

  background: rgba(24,18,11,0.95);

  align-items: center;

  justify-content: center;

}

.mah-lightbox.is-open { display: flex; }

.mah-lightbox__img {

  max-height: 82vh;

  max-width: 88vw;

  object-fit: contain;

  display: block;

}

.mah-lightbox__close {

  position: absolute;

  top: 1.5rem; right: 1.5rem;

  background: none;

  border: none;

  color: rgba(254,252,248,0.7);

  cursor: pointer;

  padding: 0.5rem;

  transition: color 0.2s;

  line-height: 1;

}

.mah-lightbox__close:hover { color: #fefcf8; }

.mah-lightbox__close svg { width: 28px; height: 28px; vertical-align: middle; }

.mah-lightbox__prev,

.mah-lightbox__next {

  position: absolute;

  top: 50%; transform: translateY(-50%);

  background: none;

  border: none;

  color: rgba(254,252,248,0.6);

  cursor: pointer;

  padding: 0.5rem;

  transition: color 0.2s;

}

.mah-lightbox__prev:hover,

.mah-lightbox__next:hover { color: #fefcf8; }

.mah-lightbox__prev { left: 1rem; }

.mah-lightbox__next { right: 1rem; }

.mah-lightbox__prev svg, .mah-lightbox__next svg { width: 36px; height: 36px; vertical-align: middle; }

@media (min-width: 1024px) {

  .mah-lightbox__prev { left: 2.5rem; }

  .mah-lightbox__next { right: 2.5rem; }

}

.mah-lightbox__counter {

  position: absolute;

  bottom: 1.5rem;

  left: 50%; transform: translateX(-50%);

  color: rgba(254,252,248,0.6);

  font-size: 0.75rem;

  letter-spacing: 0.2em;

  white-space: nowrap;

}


/* ══════════════════════════════════════════════════════════════
   ARCHIVE-ROOM — CATALOGUE  /rooms/
   Prefix: mah-catalog-*  (unique — zero conflicts)
   Ref: _reference-src/src/routes/rooms.tsx
   ══════════════════════════════════════════════════════════════ */

/* ── Page wrapper ──────────────────────────────────────────── */

.mah-catalog {

  padding-top: 5rem; /* clear fixed header ~80px */

}

@media (min-width: 1024px) { .mah-catalog { padding-top: 6rem; } }

/* ── Breadcrumb ────────────────────────────────────────────── */

.mah-catalog-breadcrumb {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-top: 2rem;

  display: flex;

  align-items: center;

  font-size: 0.75rem;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  color: var(--coffee);

}

@media (min-width: 1024px) {

  .mah-catalog-breadcrumb { padding-inline: 2.5rem; padding-top: 3rem; }

}

.mah-catalog-breadcrumb a { color: var(--coffee); }

.mah-catalog-breadcrumb__sep { margin-inline: 0.5rem; opacity: 0.4; }

.mah-catalog-breadcrumb__current { color: rgba(24,18,11,0.5); }

/* ── Intro header ──────────────────────────────────────────── */

.mah-catalog-intro {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-top: 2rem;

  padding-bottom: 2.5rem;

}

@media (min-width: 1024px) {

  .mah-catalog-intro { padding-inline: 2.5rem; padding-top: 3rem; padding-bottom: 3rem; }

}

.mah-catalog-intro .eyebrow { margin-bottom: 1rem; }

.mah-catalog-intro__h1 {

  font-size: clamp(2.25rem, 5vw, 3.75rem);

  line-height: 1.05;

  margin: 0;

}

.mah-catalog-intro__desc {

  margin-top: 1.5rem;

  max-width: 56rem;

  color: rgba(24,18,11,0.7);

  line-height: 1.7;

  font-size: 1.125rem;

}

/* ── Filter / sort bar ─────────────────────────────────────── */

.mah-catalog-filters {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-bottom: 2.5rem;

  border-bottom: 1px solid var(--hairline);

  display: flex;

  flex-direction: column;

  gap: 1.25rem;

}

@media (min-width: 640px) {

  .mah-catalog-filters { flex-direction: row; align-items: center; justify-content: space-between; }

}

@media (min-width: 1024px) { .mah-catalog-filters { padding-inline: 2.5rem; } }

.mah-catalog-filters__guests { display: flex; align-items: center; gap: 0.5rem; }

.mah-catalog-filters__label {

  font-size: 10px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: var(--coffee);

  margin-right: 0.5rem;

  flex-shrink: 0;

}

.mah-catalog-filter-btn {

  padding: 0.5rem 1rem;

  font-size: 11px;

  letter-spacing: 0.16em;

  text-transform: uppercase;

  border: 1px solid var(--hairline);

  color: rgba(24,18,11,0.7);

  background: transparent;

  cursor: pointer;

  font-family: var(--font-main);

  transition: border-color 0.2s, background 0.2s, color 0.2s;

}

.mah-catalog-filter-btn:hover { border-color: var(--ink); }

.mah-catalog-filter-btn.is-active {

  background: var(--ink);

  color: var(--ivory);

  border-color: var(--ink);

}

.mah-catalog-filters__sort-wrap {

  display: flex;

  align-items: center;

  gap: 0.75rem;

}

.mah-catalog-sort {

  background: transparent;

  border: none;

  border-bottom: 1px solid var(--hairline);

  padding-block: 0.375rem;

  padding-right: 1.5rem;

  font-family: var(--font-main);

  font-size: 1rem;

  color: var(--ink);

  cursor: pointer;

  -webkit-appearance: none;

  appearance: none;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%23a07850' stroke-width='1.5'%3E%3Cpath d='m1 1 4 4 4-4'/%3E%3C/svg%3E");

  background-repeat: no-repeat;

  background-position: right 0 center;

  background-size: 10px;

}

.mah-catalog-sort:focus { outline: none; border-bottom-color: var(--coffee); }

/* ── Rooms grid ────────────────────────────────────────────── */

.mah-catalog-grid-section {

  max-width: 1280px;

  margin-inline: auto;

  padding-inline: 1.5rem;

  padding-top: 3rem;

  padding-bottom: 5rem;

}

@media (min-width: 1024px) {

  .mah-catalog-grid-section { padding-inline: 2.5rem; padding-top: 4rem; padding-bottom: 7rem; }

}

.mah-catalog-grid {

  display: grid;

  grid-template-columns: 1fr;

  column-gap: 2rem;

  row-gap: 3.5rem;

}

@media (min-width: 768px) { .mah-catalog-grid { grid-template-columns: 1fr 1fr; } }

@media (min-width: 1024px) { .mah-catalog-grid { grid-template-columns: repeat(3, 1fr); } }

.mah-catalog-no-results {

  color: rgba(24,18,11,0.6);

  text-align: center;

  padding-block: 4rem;

  grid-column: 1 / -1;

}

/* ── Room card ─────────────────────────────────────────────── */

.mah-catalog-card {

  display: flex;

  flex-direction: column;

}

.mah-catalog-card__img-link { display: block; overflow: hidden; }

.mah-catalog-card__img-wrap {

  position: relative;

  aspect-ratio: 4 / 3;

  overflow: hidden;

  background: var(--ivory);

}

.mah-catalog-card__img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 1.2s ease-out;

}

.mah-catalog-card:hover .mah-catalog-card__img { transform: scale(1.05); }

.mah-catalog-card__head {

  padding-top: 1.25rem;

  padding-bottom: 0.75rem;

  display: flex;

  align-items: baseline;

  justify-content: space-between;

  gap: 0.75rem;

  border-bottom: 1px solid var(--hairline);

  min-height: 78px;

}

.mah-catalog-card__name {

  font-size: 1.5rem;

  line-height: 1.15;

  margin: 0;

}

@media (min-width: 1024px) { .mah-catalog-card__name { font-size: 1.875rem; } }

.mah-catalog-card__name a {

  color: inherit;

  text-decoration: none;

  transition: color 0.2s;

}

.mah-catalog-card__name a:hover { color: var(--coffee); }

.mah-catalog-card__specs {

  margin-top: 0.75rem;

  display: flex;

  flex-wrap: wrap;

  column-gap: 1.5rem;

  row-gap: 0.25rem;

  font-size: 0.875rem;

  color: rgba(24,18,11,0.6);

  list-style: none;

  padding: 0;

}

.mah-catalog-card__dot { opacity: 0.4; }

.mah-catalog-card__foot {

  margin-top: auto;

  padding-top: 1.25rem;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 0.75rem;

}

.mah-catalog-card__details {

  font-size: 11px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: var(--ink);

  text-decoration: none;

}

/* ── Comparison table ──────────────────────────────────────── */

.mah-catalog-compare {

  background: var(--pebble);

  padding-inline: 1.5rem;

  padding-block: 4rem;

}

@media (min-width: 1024px) {

  .mah-catalog-compare { padding-inline: 2.5rem; padding-block: 6rem; }

}

.mah-catalog-compare__inner { max-width: 1280px; margin-inline: auto; }

.mah-catalog-compare .eyebrow { margin-bottom: 1rem; }

.mah-catalog-compare__h2 {

  font-size: clamp(1.875rem, 3vw, 2.25rem);

  margin-top: 0;

  margin-bottom: 2.5rem;

}

.mah-catalog-compare__scroll { overflow-x: auto; }

.mah-catalog-compare__table {

  width: 100%;

  min-width: 640px;

  border-collapse: collapse;

  text-align: left;

  border: none; /* kill GP's table,td,th{border:1px} applied to table element */

}

/* High-specificity (0,1,2) kill-switch — beats any GP element selector */
.mah-catalog-compare__table td,
.mah-catalog-compare__table th { border: none; }

.mah-catalog-compare__thead-row {

  border-bottom: 1px solid rgba(24,18,11,0.2);

}

.mah-catalog-compare__th {

  padding-block: 1rem;

  padding-inline: 1rem;

  font-weight: 400;

  font-size: 10px;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  color: var(--coffee);

  border: none; /* kill GP theme's global td/th border */

}

.mah-catalog-compare__th:first-child { padding-left: 0; }

.mah-catalog-compare__row {

  border-bottom: 1px solid var(--hairline);

  transition: background 0.2s;

}

.mah-catalog-compare__row:hover { background: rgba(254,252,248,0.6); }

.mah-catalog-compare__td {

  padding-block: 1rem;

  padding-inline: 1rem;

  color: rgba(24,18,11,0.75);

  font-size: 0.9375rem;

  border: none; /* kill GP theme's global td/th border */

}

.mah-catalog-compare__td:first-child { padding-left: 0; }

.mah-catalog-compare__td--name a {

  font-family: var(--font-serif);

  font-size: 1.125rem;

  color: inherit;

  text-decoration: none;

  transition: color 0.2s;

}

.mah-catalog-compare__td--name a:hover { color: var(--coffee); }

/* ── FAQ ───────────────────────────────────────────────────── */

.mah-catalog-faq-section {

  padding-inline: 1.5rem;

  padding-block: 4rem;

}

@media (min-width: 1024px) {

  .mah-catalog-faq-section { padding-inline: 2.5rem; padding-block: 6rem; }

}

.mah-catalog-faq__inner { max-width: 1280px; margin-inline: auto; }

.mah-catalog-faq__inner .eyebrow { margin-bottom: 1rem; }

.mah-catalog-faq__h2 {

  font-size: clamp(1.875rem, 3vw, 2.25rem);

  margin-top: 0;

  margin-bottom: 2.5rem;

}

.mah-catalog-faq__accordion {

  max-width: 48rem;

  border-top: 1px solid var(--hairline);

  border-bottom: 1px solid var(--hairline);

}

.mah-catalog-faq-item {

  border-bottom: 1px solid var(--hairline);

  padding-block: 1.25rem;

}

.mah-catalog-faq-item:last-child { border-bottom: none; }

.mah-catalog-faq__summary {

  display: flex;

  align-items: center;

  justify-content: space-between;

  cursor: pointer;

  list-style: none;

  gap: 1rem;

}

.mah-catalog-faq__summary::-webkit-details-marker { display: none; }

.mah-catalog-faq__summary::marker { display: none; }

.mah-catalog-faq__summary .font-serif { font-size: 1.125rem; line-height: 1.3; }

@media (min-width: 1024px) { .mah-catalog-faq__summary .font-serif { font-size: 1.25rem; } }

.mah-catalog-faq__plus {

  color: var(--coffee);

  font-size: 1.5rem;

  line-height: 1;

  transition: transform 0.3s cubic-bezier(0.2,0.7,0.2,1);

  flex-shrink: 0;

  user-select: none;

}

.mah-catalog-faq-item[open] .mah-catalog-faq__plus { transform: rotate(45deg); }

.mah-catalog-faq__answer {

  margin-top: 0.75rem;

  color: rgba(24,18,11,0.7);

  line-height: 1.7;

  max-width: 42rem;

  margin-bottom: 0;

}

/* ── CTA dark ──────────────────────────────────────────────── */

.mah-catalog-cta {

  background: var(--ink);

  color: var(--ivory);

  padding-inline: 1.5rem;

  padding-block: 4rem;

}

@media (min-width: 1024px) {

  .mah-catalog-cta { padding-inline: 2.5rem; padding-block: 6rem; }

}

.mah-catalog-cta__inner {

  max-width: 56.25rem;

  margin-inline: auto;

  text-align: center;

}

.mah-catalog-cta__h2 {

  font-size: clamp(1.875rem, 4vw, 3.125rem);

  line-height: 1.15;

  color: var(--ivory);

  margin: 0;

}

.mah-catalog-cta__desc {

  margin-top: 1.25rem;

  color: rgba(254,252,248,0.7);

  max-width: 36rem;

  margin-inline: auto;

}

.mah-catalog-cta__btn {

  margin-top: 2.25rem;

  display: inline-flex;

  align-items: center;

  padding: 1rem 2rem;

  background: var(--ivory);

  color: var(--ink);

  font-size: 12px;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  text-decoration: none;

  transition: background 0.25s;

}

.mah-catalog-cta__btn:hover { background: rgba(254,252,248,0.9); }


/* ══════════════════════════════════════════════════════════════
   RESTAURANT PAGE  — mah-resto-*
   Prefix unique: homepage uses mah-restaurant__* (BEM double-under)
   Ref: _reference-src/src/routes/restaurant.tsx
   ══════════════════════════════════════════════════════════════ */

/* ── Page wrapper ──────────────────────────────────────────── */
.mah-resto { padding-top: 5rem; }
@media (min-width: 1024px) { .mah-resto { padding-top: 6rem; } }

/* ── 1. HERO ────────────────────────────────────────────────── */
.mah-resto-hero {
  position: relative;
  height: 78vh;
  min-height: 520px;
  width: 100%;
  overflow: hidden;
}

.mah-resto-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mah-resto-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0,0,0,0.85) 0%,
    rgba(0,0,0,0.60) 30%,
    rgba(0,0,0,0.40) 55%,
    rgba(0,0,0,0.35) 100%
  );
}

.mah-resto-hero__content {
  position: relative;
  height: 100%;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  padding-bottom: 3.5rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fefcf8;
}
@media (min-width: 1024px) {
  .mah-resto-hero__content { padding-inline: 2.5rem; padding-bottom: 5rem; }
}

.mah-resto-hero__eyebrow {
  color: var(--ivory) !important;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 6px rgba(0,0,0,0.8), 0 0 20px rgba(0,0,0,0.5);
}

.mah-resto-hero__h1 {
  font-size: clamp(2.75rem, 7vw, 4.5rem);
  line-height: 1.0;
  margin: 0;
  text-shadow: 0 2px 24px rgba(0,0,0,0.55);
  color: #fefcf8;
}

.mah-resto-hero__sub {
  margin-top: 1rem;
  font-size: clamp(1.375rem, 3vw, 1.875rem);
  color: rgba(254,252,248,0.85);
  font-style: italic;
  margin-bottom: 0;
  text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}

.mah-resto-hero__desc {
  margin-top: 1.25rem;
  max-width: 36rem;
  color: rgba(254,252,248,0.75);
  line-height: 1.65;
  text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}

.mah-resto-hero__btns {
  margin-top: 2rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.mah-resto-hero__btn {
  padding: 1rem 1.75rem;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
  font-family: var(--font-main);
}

.mah-resto-hero__btn--solid {
  background: var(--ivory);
  color: var(--ink);
}
.mah-resto-hero__btn--solid:hover { background: var(--brass); color: var(--ivory); }

.mah-resto-hero__btn--ghost {
  border: 1px solid rgba(254,252,248,0.5);
  color: #fefcf8;
}
.mah-resto-hero__btn--ghost:hover { background: var(--ivory); color: var(--ink); }

/* ── 2. ABOUT ───────────────────────────────────────────────── */
.mah-resto-about {
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  padding-block: 4rem;
}
@media (min-width: 1024px) {
  .mah-resto-about { padding-inline: 2.5rem; padding-block: 6rem; }
}

.mah-resto-about__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 1024px) {
  .mah-resto-about__inner {
    grid-template-columns: 7fr 5fr;
    gap: 4rem;
    align-items: start;
  }
}

.mah-resto-about__h2 {
  font-size: clamp(1.875rem, 3.5vw, 2.25rem);
  margin: 0 0 1.5rem;
  line-height: 1.2;
}

.mah-resto-about__desc {
  color: rgba(24,18,11,0.75);
  line-height: 1.75;
  max-width: 44rem;
}
.mah-resto-about__desc p { margin: 0; }

.mah-resto-about__ig {
  margin-top: 2rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
}

.mah-resto-about__ig-icon svg { width: 16px; height: 16px; vertical-align: middle; }

.mah-resto-about__img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

/* ── 3. FEATURES ────────────────────────────────────────────── */
.mah-resto-features {
  background: var(--pebble);
  padding-inline: 1.5rem;
  padding-block: 4rem;
}
@media (min-width: 1024px) {
  .mah-resto-features { padding-inline: 2.5rem; padding-block: 6rem; }
}

.mah-resto-features__grid {
  max-width: 1280px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 640px) {
  .mah-resto-features__grid { grid-template-columns: 1fr 1fr; gap: 2.5rem 2.5rem; }
}
@media (min-width: 1024px) {
  .mah-resto-features__grid { grid-template-columns: repeat(5, 1fr); gap: 2rem; }
}

.mah-resto-feature {
  border-top: 1px solid rgba(24,18,11,0.2);
  padding-top: 1.25rem;
}

.mah-resto-feature__icon svg {
  width: 28px;
  height: 28px;
  color: var(--coffee);
  margin-bottom: 1rem;
  display: block;
}

.mah-resto-feature__title {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  line-height: 1.2;
  margin: 0 0 0.5rem;
}

.mah-resto-feature__desc {
  font-size: 0.875rem;
  color: rgba(24,18,11,0.65);
  line-height: 1.65;
  margin: 0;
}

/* ── 4. MENU PREVIEW ────────────────────────────────────────── */
.mah-resto-menu {
  background: var(--ink);
  color: var(--ivory);
  padding-inline: 1.5rem;
  padding-block: 4rem;
}
@media (min-width: 1024px) {
  .mah-resto-menu { padding-inline: 2.5rem; padding-block: 6rem; }
}

.mah-resto-menu__inner { max-width: 1280px; margin-inline: auto; }

.mah-resto-menu__hdr {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 3rem;
}

.mah-resto-menu__eyebrow {
  color: var(--brass) !important;
  margin-bottom: 1rem;
}

.mah-resto-menu__h2 {
  font-size: clamp(1.875rem, 3.5vw, 2.25rem);
  color: var(--ivory);
  margin: 0;
}

.mah-resto-menu__full-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  border: 1px solid rgba(254,252,248,0.4);
  color: var(--ivory);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}
.mah-resto-menu__full-btn:hover { background: var(--ivory); color: var(--ink); }
.mah-resto-menu__arrow svg { width: 16px; height: 16px; vertical-align: middle; }

.mah-resto-menu__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 768px) {
  .mah-resto-menu__grid { grid-template-columns: repeat(3, 1fr); gap: 3rem; }
}

.mah-resto-menu-col__cat {
  font-size: 1.5rem;
  color: var(--brass);
  margin: 0 0 1.25rem;
}

.mah-resto-menu-col__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mah-resto-menu-col__item {
  color: rgba(254,252,248,0.8);
  border-bottom: 1px solid rgba(254,252,248,0.1);
  padding-bottom: 0.75rem;
  margin-bottom: 0.75rem;
  font-size: 0.9375rem;
}
.mah-resto-menu-col__item:last-child { margin-bottom: 0; }

/* ── 5. HOURS + HALL PHOTO ──────────────────────────────────── */
.mah-resto-hours {
  padding-inline: 1.5rem;
  padding-block: 4rem;
}
@media (min-width: 1024px) {
  .mah-resto-hours { padding-inline: 2.5rem; padding-block: 5rem; }
}

.mah-resto-hours__inner {
  max-width: 1280px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 1024px) {
  .mah-resto-hours__inner { grid-template-columns: 1fr 1fr; gap: 5rem; align-items: start; }
}

.mah-resto-hours__h2 {
  font-size: clamp(1.5rem, 2.5vw, 1.875rem);
  margin: 0 0 2.5rem;
}

.mah-resto-hours__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  border-bottom: 1px solid var(--hairline);
  padding-block: 1.25rem;
}

.mah-resto-hours__label {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coffee);
}

.mah-resto-hours__val { font-size: 1.5rem; }

.mah-resto-hours__photo-wrap {
  position: relative;
  min-height: 300px;
  overflow: hidden;
  background: var(--ivory);
}

.mah-resto-hours__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ── 6. RESERVE FORM ────────────────────────────────────────── */
.mah-resto-reserve {
  background: var(--pebble);
  padding-inline: 1.5rem;
  padding-block: 4rem;
}
@media (min-width: 1024px) {
  .mah-resto-reserve { padding-inline: 2.5rem; padding-block: 6rem; }
}

.mah-resto-reserve__inner {
  max-width: 1280px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 1024px) {
  .mah-resto-reserve__inner { grid-template-columns: 5fr 7fr; gap: 4rem; align-items: start; }
}

.mah-resto-reserve__left .eyebrow { margin-bottom: 1rem; }

.mah-resto-reserve__h2 {
  font-size: clamp(1.875rem, 3.5vw, 2.25rem);
  line-height: 1.2;
  margin: 0 0 1.25rem;
}

.mah-resto-reserve__desc {
  color: rgba(24,18,11,0.7);
  line-height: 1.65;
  max-width: 30rem;
  margin: 0 0 1rem;
}

.mah-resto-reserve__phone {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--ink);
  text-decoration: none;
  margin-top: 1rem;
}
.mah-resto-reserve__phone:hover { color: var(--coffee); }
.mah-resto-reserve__phone-icon svg { width: 20px; height: 20px; color: var(--coffee); }
.mah-resto-reserve__phone .font-serif { font-size: 1.5rem; }

/* Form grid: 2 cols on sm+ */
.mah-resto-form {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 2rem;
  row-gap: 1.75rem;
}
@media (min-width: 640px) {
  .mah-resto-form { grid-template-columns: 1fr 1fr; }
  .mah-resto-form__submit { grid-column: 1 / -1; }
}

.mah-resto-form__field { display: flex; flex-direction: column; }

.mah-resto-form__label {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--coffee);
  margin-bottom: 0.5rem;
  display: block;
}

/* GP reset: inputs get border/bg/padding from theme — override all */
.mah-resto-form__input {
  width: 100%;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--hairline) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0.5rem 0 !important;
  font-family: var(--font-main);
  font-size: 1rem;
  color: var(--ink);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 0.2s;
}
.mah-resto-form__input:focus {
  border-bottom-color: var(--coffee) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* GP reset: buttons */
.mah-resto-form__btn {
  padding: 1rem 2rem;
  background: var(--ink);
  color: var(--ivory);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-family: var(--font-main);
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background 0.2s;
  -webkit-appearance: none;
  appearance: none;
}
.mah-resto-form__btn:hover { background: var(--coffee); }

.mah-resto-form-thanks,
.mah-conf-page-form-thanks {
  padding: 2rem;
  background: rgba(24,18,11,0.05);
  font-size: 1.125rem;
  color: var(--ink);
}


/* ══════════════════════════════════════════════════════════════
   CONFERENCES PAGE  — mah-conf-page-*
   Unique prefix: homepage uses mah-conf-grid (no page- segment)
   Ref: _reference-src/src/routes/conferences.tsx
   ══════════════════════════════════════════════════════════════ */

.mah-conf-page { padding-top: 5rem; }
@media (min-width:1024px) { .mah-conf-page { padding-top: 6rem; } }

/* ── 1. HERO ────────────────────────────────────────────────── */
.mah-conf-page-hero {
  position: relative;
  height: 60vh;
  min-height: 440px;
  width: 100%;
  overflow: hidden;
}
.mah-conf-page-hero__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
}
.mah-conf-page-hero__overlay {
  position: absolute; inset: 0;
  background: rgba(24,18,11,0.70);
}
.mah-conf-page-hero__content {
  position: relative; height: 100%;
  max-width: 1280px; margin-inline: auto;
  padding-inline: 1.5rem;
  display: flex; flex-direction: column; justify-content: center;
  color: var(--ivory);
}
@media (min-width:1024px) { .mah-conf-page-hero__content { padding-inline: 2.5rem; } }
.mah-conf-page-hero__wrap { max-width: 48rem; }
.mah-conf-page-hero__eyebrow { color: var(--brass) !important; margin-bottom: 1rem; }
.mah-conf-page-hero__h1 {
  font-size: clamp(2.25rem, 5.5vw, 3.75rem);
  line-height: 1.05; margin: 0;
  text-shadow: 0 2px 20px rgba(0,0,0,0.4);
}
.mah-conf-page-hero__desc {
  margin-top: 1.5rem;
  font-size: 1.125rem;
  color: rgba(254,252,248,0.85);
  line-height: 1.65; max-width: 42rem;
  text-shadow: 0 1px 8px rgba(0,0,0,0.4);
}
.mah-conf-page-hero__btns { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.75rem; }
.mah-conf-page-hero__btn {
  padding: 1rem 1.75rem;
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  text-decoration: none; font-family: var(--font-main);
  transition: background 0.2s, color 0.2s;
}
.mah-conf-page-hero__btn--solid { background: var(--ivory); color: var(--ink); }
.mah-conf-page-hero__btn--solid:hover { background: var(--brass); color: var(--ivory); }
.mah-conf-page-hero__btn--ghost { border: 1px solid rgba(254,252,248,0.5); color: var(--ivory); }
.mah-conf-page-hero__btn--ghost:hover { background: var(--ivory); color: var(--ink); }

/* ── 2. STATS BAR ───────────────────────────────────────────── */
.mah-conf-page-stats { background: var(--ink); color: var(--ivory); }
.mah-conf-page-stats__inner {
  max-width: 1280px; margin-inline: auto;
  padding-inline: 1.5rem;
  display: grid; grid-template-columns: 1fr 1fr;
  border-left: 1px solid rgba(254,252,248,0.1);
}
@media (min-width:1024px) {
  .mah-conf-page-stats__inner { grid-template-columns: repeat(4,1fr); padding-inline: 2.5rem; }
}
.mah-conf-page-stat {
  padding: 2rem 1rem;
  text-align: center;
  border-right: 1px solid rgba(254,252,248,0.1);
  border-bottom: 1px solid rgba(254,252,248,0.1);
}
@media (min-width:1024px) { .mah-conf-page-stat { padding-block: 2.5rem; border-bottom: none; } }
.mah-conf-page-stat__val { font-family: var(--font-serif); font-size: clamp(2.25rem,4vw,3rem); color: var(--brass); }
.mah-conf-page-stat__label { margin-top: 0.5rem; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(254,252,248,0.55); }

/* ── 3. INTRO ───────────────────────────────────────────────── */
.mah-conf-page-intro {
  max-width: 1280px; margin-inline: auto;
  padding-inline: 1.5rem; padding-block: 4rem;
}
@media (min-width:1024px) { .mah-conf-page-intro { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-intro__inner {
  display: grid; grid-template-columns: 1fr; gap: 2.5rem; align-items: start;
}
@media (min-width:1024px) { .mah-conf-page-intro__inner { grid-template-columns: 7fr 5fr; gap: 4rem; } }
.mah-conf-page-intro .eyebrow { margin-bottom: 1rem; }
.mah-conf-page-intro__h2 { font-size: clamp(1.875rem,3.5vw,2.25rem); margin: 0 0 1.5rem; line-height: 1.2; }
.mah-conf-page-intro__p { color: rgba(24,18,11,0.75); line-height: 1.75; margin: 0 0 1rem; }
.mah-conf-page-intro__img { width: 100%; min-height: 320px; object-fit: cover; display: block; }

/* ── 4. HALLS ───────────────────────────────────────────────── */
.mah-conf-page-halls { background: var(--pebble); padding-inline: 1.5rem; padding-block: 4rem; }
@media (min-width:1024px) { .mah-conf-page-halls { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-halls__inner { max-width: 1280px; margin-inline: auto; }
.mah-conf-page-halls .eyebrow { margin-bottom: 1rem; }
.mah-conf-page-halls__h2 { font-size: clamp(1.875rem,3.5vw,2.25rem); margin: 0 0 3rem; }
.mah-conf-page-halls__grid {
  display: grid; grid-template-columns: 1fr; gap: 2rem;
}
@media (min-width:768px) { .mah-conf-page-halls__grid { grid-template-columns: repeat(3,1fr); } }

.mah-conf-page-hall { background: #fff; display: flex; flex-direction: column; }
.mah-conf-page-hall__img-wrap { position: relative; aspect-ratio: 4/3; overflow: hidden; }
.mah-conf-page-hall__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mah-conf-page-hall__badge {
  position: absolute; top: 1rem; left: 1rem;
  background: rgba(24,18,11,0.85); color: var(--ivory);
  font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
  padding: 0.375rem 0.75rem;
  display: inline-flex; align-items: center; gap: 0.5rem;
}
.mah-conf-page-hall__badge-icon svg { width: 14px; height: 14px; color: var(--brass); }

/* ── Hall photo slider ──────────────────────────────────────────
   Живе всередині .mah-conf-page-hall__img-wrap і повторює геометрію
   одиночного .mah-conf-page-hall__img (absolute + inset:0), тому
   розміри картки, aspect-ratio 4/3 і бейдж не змінюються.
   Атрибут data-photos, НЕ data-count (main.js §5 затирає [data-count]). */

.mah-hall-gallery { position: absolute; inset: 0; }

.mah-hall-gallery__track {

  display: flex;

  height: 100%;

  overflow-x: auto;

  scroll-snap-type: x mandatory;

  scrollbar-width: none;

  -ms-overflow-style: none;

}

.mah-hall-gallery__track::-webkit-scrollbar { display: none; }

.mah-hall-gallery__slide { flex: 0 0 100%; height: 100%; scroll-snap-align: start; }

.mah-hall-gallery__slide img {

  width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in;

}

.mah-hall-gallery__btn {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  background: rgba(0,0,0,0.55);

  border: none;

  padding: 0;   /* глушить глобальний button{padding:10px 20px} теми */

  width: 36px;

  height: 36px;

  border-radius: 50%;

  cursor: pointer;

  font-size: 1rem;

  line-height: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  box-shadow: 0 2px 8px rgba(0,0,0,0.4);

  transition: background 0.2s;

}

/* Стрілка — завжди біла, на будь-якому фото. !important глушить
   успадкування кольору від глобальних button / button:hover теми. */

.mah-hall-gallery__btn,

.mah-hall-gallery__btn:hover,

.mah-hall-gallery__btn:focus,

.mah-hall-gallery__btn:active { color: #fff !important; }

.mah-hall-gallery__btn:hover,

.mah-hall-gallery__btn:focus { background: rgba(0,0,0,0.75); }

.mah-hall-gallery__btn--prev { left: 10px; }

.mah-hall-gallery__btn--next { right: 10px; }

.mah-hall-gallery__counter {

  position: absolute;

  bottom: 10px;

  right: 12px;

  background: rgba(0,0,0,0.45);

  color: #fff;

  font-size: 0.75rem;

  padding: 2px 9px;

  border-radius: 20px;

  letter-spacing: 0.05em;

}

/* Бейдж «до X осіб» лишається над слайдами та стрілками за порядком у DOM
   (він — останній абсолютний нащадок .__img-wrap). z-index навмисно НЕ
   ставимо: він створив би stacking context і перемкнув субпіксельне
   згладжування тексту бейджа → мікрозміна рендера картки. */

/* Клік по фото відкриває lightbox */

.mah-conf-page-hall__img { cursor: zoom-in; }
.mah-conf-page-hall__body { padding: 1.75rem; display: flex; flex-direction: column; flex: 1; }
.mah-conf-page-hall__head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 0.75rem; }
.mah-conf-page-hall__name { font-family: var(--font-serif); font-size: clamp(1.5rem,2vw,1.875rem); margin: 0; }
.mah-conf-page-hall__area { font-family: var(--font-serif); font-size: 1.125rem; color: var(--coffee); }
.mah-conf-page-hall__desc { font-size: 0.875rem; color: rgba(24,18,11,0.65); line-height: 1.65; margin: 0; }

/* ── 5. EVENT TYPES ─────────────────────────────────────────── */
.mah-conf-page-events { max-width: 1280px; margin-inline: auto; padding-inline: 1.5rem; padding-block: 4rem; }
@media (min-width:1024px) { .mah-conf-page-events { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-events .eyebrow { margin-bottom: 1rem; }
.mah-conf-page-events__h2 { font-size: clamp(1.875rem,3.5vw,2.25rem); margin: 0 0 3rem; }
.mah-conf-page-events__grid {
  display: grid; grid-template-columns: 1fr; gap: 3rem;
}
@media (min-width:640px) { .mah-conf-page-events__grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; } }
@media (min-width:1024px) { .mah-conf-page-events__grid { grid-template-columns: repeat(4,1fr); } }
.mah-conf-page-event { border-top: 1px solid var(--hairline); padding-top: 1.25rem; }
.mah-conf-page-event__icon svg { width: 28px; height: 28px; color: var(--coffee); margin-bottom: 1rem; display: block; }
.mah-conf-page-event__title { font-size: clamp(1.25rem,2vw,1.5rem); line-height: 1.2; margin: 0 0 0.5rem; }
.mah-conf-page-event__desc { font-size: 0.875rem; color: rgba(24,18,11,0.65); line-height: 1.65; margin: 0; }

/* ── 6. CAPACITY TABLE (bg-ink) ─────────────────────────────── */
.mah-conf-page-capacity { background: var(--ink); color: var(--ivory); padding-inline: 1.5rem; padding-block: 4rem; }
@media (min-width:1024px) { .mah-conf-page-capacity { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-capacity__inner { max-width: 1280px; margin-inline: auto; }
.mah-conf-page-capacity__eyebrow { color: var(--brass) !important; margin-bottom: 1rem; }
.mah-conf-page-capacity__h2 { font-size: clamp(1.875rem,3.5vw,2.25rem); color: var(--ivory); margin: 0 0 2.5rem; }
.mah-conf-page-capacity__scroll { overflow-x: auto; }
.mah-conf-page-capacity__note { margin-top: 1.5rem; font-size: 0.875rem; color: rgba(254,252,248,0.45); }
.mah-conf-page-cap-table {
  width: 100%; min-width: 560px; border-collapse: collapse; text-align: left;
  border: none;
}
/* GP kill-switch (0,1,2) — same approach as catalog comparison table */
.mah-conf-page-cap-table td,
.mah-conf-page-cap-table th { border: none; }
.mah-conf-page-cap-thead-row { border-bottom: 1px solid rgba(254,252,248,0.2); }
.mah-conf-page-cap-th {
  padding-block: 1rem; padding-inline: 1rem;
  font-weight: 400; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--brass); text-align: right; border: none;
}
.mah-conf-page-cap-th--layout { text-align: left; padding-left: 0; }
.mah-conf-page-cap-row { border-bottom: 1px solid rgba(254,252,248,0.1); }
.mah-conf-page-cap-td {
  padding-block: 1rem; padding-inline: 1rem;
  color: rgba(254,252,248,0.8); font-size: 0.9375rem;
  text-align: right; border: none;
}
.mah-conf-page-cap-td--layout {
  font-family: var(--font-serif); font-size: 1.125rem;
  color: var(--ivory); text-align: left; padding-left: 0;
}

/* ── 7. EQUIPMENT ───────────────────────────────────────────── */
.mah-conf-page-equip { max-width: 1280px; margin-inline: auto; padding-inline: 1.5rem; padding-block: 4rem; }
@media (min-width:1024px) { .mah-conf-page-equip { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-equip__inner { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: start; }
@media (min-width:1024px) { .mah-conf-page-equip__inner { grid-template-columns: 1fr 1fr; gap: 4rem; } }
.mah-conf-page-equip .eyebrow { margin-bottom: 1rem; }
.mah-conf-page-equip__h2 { font-size: clamp(1.5rem,2.5vw,1.875rem); margin: 0 0 2rem; }
.mah-conf-page-equip__list { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.mah-conf-page-equip-item {
  display: flex; align-items: center; gap: 1rem;
  border-bottom: 1px solid var(--hairline); padding-block: 1rem;
}
.mah-conf-page-equip-item__icon svg { width: 24px; height: 24px; color: var(--coffee); flex-shrink: 0; }
.mah-conf-page-equip-item__label { color: rgba(24,18,11,0.8); font-size: 0.9375rem; }
.mah-conf-page-equip-item:last-child,
.mah-conf-page-equip-item--full { grid-column: 1 / -1; }
.mah-conf-page-equip__img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.mah-conf-video { background: var(--ink); }

/* ── 8. FAQ ─────────────────────────────────────────────────── */
.mah-conf-page-faq-section { background: var(--pebble); padding-inline: 1.5rem; padding-block: 4rem; }
@media (min-width:1024px) { .mah-conf-page-faq-section { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-faq__inner { max-width: 1280px; margin-inline: auto; }
.mah-conf-page-faq__inner .eyebrow { margin-bottom: 1rem; }
.mah-conf-page-faq__h2 { font-size: clamp(1.875rem,3.5vw,2.25rem); margin: 0 0 2.5rem; }
.mah-conf-page-faq__accordion {
  max-width: 48rem;
  border-top: 1px solid rgba(24,18,11,0.15);
  border-bottom: 1px solid rgba(24,18,11,0.15);
}
.mah-conf-page-faq-item { border-bottom: 1px solid rgba(24,18,11,0.15); padding-block: 1.25rem; }
.mah-conf-page-faq-item:last-child { border-bottom: none; }
.mah-conf-page-faq__summary {
  display: flex; align-items: center; justify-content: space-between;
  cursor: pointer; list-style: none; gap: 1rem;
}
.mah-conf-page-faq__summary::-webkit-details-marker { display: none; }
.mah-conf-page-faq__summary::marker { display: none; }
.mah-conf-page-faq__summary .font-serif { font-size: 1.125rem; line-height: 1.3; }
@media (min-width:1024px) { .mah-conf-page-faq__summary .font-serif { font-size: 1.25rem; } }
.mah-conf-page-faq__plus {
  color: var(--coffee); font-size: 1.5rem; line-height: 1;
  transition: transform 0.3s cubic-bezier(0.2,0.7,0.2,1);
  flex-shrink: 0; user-select: none;
}
.mah-conf-page-faq-item[open] .mah-conf-page-faq__plus { transform: rotate(45deg); }
.mah-conf-page-faq__answer { margin-top: 0.75rem; color: rgba(24,18,11,0.7); line-height: 1.7; max-width: 42rem; margin-bottom: 0; }

/* ── 9. REQUEST FORM ────────────────────────────────────────── */
.mah-conf-page-request { max-width: 1280px; margin-inline: auto; padding-inline: 1.5rem; padding-block: 4rem; }
@media (min-width:1024px) { .mah-conf-page-request { padding-inline: 2.5rem; padding-block: 6rem; } }
.mah-conf-page-request__inner { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: start; }
@media (min-width:1024px) { .mah-conf-page-request__inner { grid-template-columns: 5fr 7fr; gap: 4rem; } }
.mah-conf-page-request .eyebrow { margin-bottom: 1rem; }
.mah-conf-page-request__h2 { font-size: clamp(1.875rem,3.5vw,2.25rem); margin: 0 0 1.25rem; line-height: 1.2; }
.mah-conf-page-request__desc { color: rgba(24,18,11,0.7); line-height: 1.65; max-width: 30rem; margin: 0 0 1rem; }
.mah-conf-page-request__phone { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--ink); text-decoration: none; margin-top: 1rem; }
.mah-conf-page-request__phone:hover { color: var(--coffee); }
.mah-conf-page-request__phone-icon svg { width: 20px; height: 20px; color: var(--coffee); }
.mah-conf-page-request__phone .font-serif { font-size: 1.5rem; }
/* Form grid */
.mah-conf-page-form { display: grid; grid-template-columns: 1fr; column-gap: 2rem; row-gap: 1.75rem; }
@media (min-width:640px) { .mah-conf-page-form { grid-template-columns: 1fr 1fr; } }
.mah-conf-page-form__field { display: flex; flex-direction: column; }
.mah-conf-page-form__field--full { grid-column: 1 / -1; }
.mah-conf-page-form__label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--coffee); margin-bottom: 0.5rem; display: block; }
/* GP reset for inputs — same pattern as restaurant */
.mah-conf-page-form__input {
  width: 100%; background: transparent !important;
  border: none !important; border-bottom: 1px solid var(--hairline) !important;
  border-radius: 0 !important; box-shadow: none !important;
  padding: 0.5rem 0 !important;
  font-family: var(--font-main); font-size: 1rem; color: var(--ink);
  outline: none; -webkit-appearance: none; appearance: none;
  transition: border-color 0.2s;
}
.mah-conf-page-form__input:focus { border-bottom-color: var(--coffee) !important; outline: none !important; box-shadow: none !important; }
.mah-conf-page-form__textarea { resize: none; }
.mah-conf-page-form__btn {
  padding: 1rem 2rem; background: var(--ink); color: var(--ivory);
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  font-family: var(--font-main);
  border: none !important; border-radius: 0 !important; box-shadow: none !important;
  cursor: pointer; transition: background 0.2s;
  -webkit-appearance: none; appearance: none;
}
.mah-conf-page-form__btn:hover { background: var(--coffee); }

/* -- CTA section ---------------------------------------- */
.mah-conf-page-cta {
    background: var(--ink);
    color: var(--ivory);
    padding: 5rem 1.5rem;
    text-align: center;
}
@media (min-width:1024px) { .mah-conf-page-cta { padding: 7rem 2.5rem; } }
.mah-conf-page-cta__inner {
    max-width: 40rem;
    margin: 0 auto;
}
.mah-conf-page-cta__h2 {
    font-size: clamp(1.875rem, 3.5vw, 2.5rem);
    color: var(--ivory);
    margin: 0 0 1rem;
    line-height: 1.2;
}
.mah-conf-page-cta__sub {
    font-size: 1rem;
    color: rgba(254,252,248,.7);
    line-height: 1.65;
    margin: 0 0 2rem;
}
.mah-conf-page-cta__btn {
    display: inline-block;
    padding: 0.875rem 2.5rem;
    background: var(--brass);
    color: var(--ink);
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.2s;
}
.mah-conf-page-cta__btn:hover { background: var(--ivory); }



/* ════════════════════════════════════════════════════════════
   Single Article — single-article.php
   Prefix: mah-article-* and mah-related-*
   Rule 6.5: grep confirmed 0 conflicts before writing
   ════════════════════════════════════════════════════════════ */

/* Page wrapper */
.mah-article-page {
    background: #fff;
    padding-top: 5rem;
}
@media (min-width: 1024px) { .mah-article-page { padding-top: 6rem; } }

/* ── Hero (52vh — ref h-[52vh] min-h-[380px]) ───────────── */
.mah-article-hero {
    position: relative;
    height: 52vh;
    min-height: 380px;
    overflow: hidden;
}
.mah-article-hero__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mah-article-hero__overlay {
    position: absolute;
    inset: 0;
    background: rgba(24,17,8,0.45);
}
/* Bottom-heavy gradient (ref: from-ink/90 via-ink/40 to-ink/30) */
.mah-article-hero__gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(24,17,8,0.90) 0%,
        rgba(24,17,8,0.40) 55%,
        rgba(24,17,8,0.30) 100%
    );
}
/* Inner: max-w-820px, text at bottom (justify-end pb-12) */
.mah-article-hero__inner {
    position: relative;
    height: 100%;
    max-width: 820px;
    margin-inline: auto;
    padding-inline: 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: 3rem;
    color: var(--ivory);
    text-shadow: 0 1px 24px rgba(0,0,0,0.4);
}
@media (min-width: 1024px) { .mah-article-hero__inner { padding-inline: 2.5rem; } }

/* Breadcrumb */
.mah-article-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--pebble);
    margin-bottom: 1rem;
}
.mah-article-breadcrumb a { color: var(--pebble); transition: color 0.2s; }
.mah-article-breadcrumb a:hover { color: var(--ivory); }

/* Meta row: cat · date · read-time */
.mah-article-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--pebble);
    margin-bottom: 1rem;
}
.mah-article-meta__dot { opacity: 0.4; }

/* H1 */
.mah-article-h1 {
    font-family: var(--font-main);
    font-size: clamp(1.75rem, 4vw, 3rem);
    line-height: 1.08;
    color: var(--ivory);
}

/* ── Article content wrapper (max-w-720px) ──────────────── */
.mah-article-content {
    max-width: 720px;
    margin-inline: auto;
    padding: 3.5rem 1.5rem 5rem;
}
@media (min-width: 1024px) { .mah-article-content { padding: 5rem 0; } }

/* Lead paragraph (larger serif, ref text-lg lg:text-xl font-serif) */
.mah-article-lead {
    font-family: var(--font-main);
    font-size: clamp(1.0625rem, 2vw, 1.25rem);
    color: rgba(24,17,8,0.80);
    line-height: 1.65;
    margin-bottom: 2.5rem;
}

/* Body blocks container */
.mah-article-body {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Paragraph */
.mah-article-p p,
.mah-article-p {
    color: rgba(24,17,8,0.80);
    line-height: 1.75;
    font-size: 1.0625rem;
}

/* FAQ Q&A pair spacing: extra top margin before each Q (paragraph with only a bold child) */
.mah-article-p p + p:has(> strong) {
    margin-top: 1.75rem;
}

/* ── Article FAQ accordion (details/summary) ─────────────── */
.mah-article-faq {
    border-bottom: 1px solid var(--hairline);
    padding-block: 0;
}
.mah-article-faq:first-of-type {
    border-top: 1px solid var(--hairline);
}
.mah-article-faq__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-block: 1rem;
    cursor: pointer;
    list-style: none;
    font-family: var(--font-main);
    font-size: 1rem;
    color: var(--ink);
    line-height: 1.45;
    user-select: none;
}
.mah-article-faq__q::-webkit-details-marker { display: none; }
.mah-article-faq__arr {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--coffee);
    transition: transform 0.25s ease;
    font-style: normal;
}
.mah-article-faq__arr::before { content: "▸"; }
.mah-article-faq[open] .mah-article-faq__arr {
    transform: rotate(90deg);
}
.mah-article-faq__a {
    padding-bottom: 1rem;
    padding-left: 0.25rem;
}
.mah-article-faq__a p {
    color: rgba(24,17,8,0.75);
    line-height: 1.7;
    font-size: 0.9375rem;
    margin: 0;
}

/* H2 heading */
.mah-article-h2 {
    font-family: var(--font-main);
    font-size: clamp(1.375rem, 3vw, 1.875rem);
    line-height: 1.2;
    padding-top: 1rem;
    color: var(--ink);
}

/* Bleed figure (ref: -mx-6 lg:-mx-20) */
.mah-article-figure {
    margin-block: 2.5rem;
    margin-inline: -1.5rem;
}
@media (min-width: 1024px) { .mah-article-figure { margin-inline: -5rem; } }

.mah-article-figure__img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    display: block;
}
.mah-article-figcaption {
    margin-top: 0.75rem;
    padding-inline: 1.5rem;
    font-size: 13px;
    color: rgba(24,17,8,0.50);
    font-style: italic;
}
@media (min-width: 1024px) { .mah-article-figcaption { padding-inline: 5rem; } }

/* List (dash style) */
.mah-article-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.mah-article-list__item {
    display: flex;
    gap: 0.75rem;
    color: rgba(24,17,8,0.80);
    line-height: 1.65;
}
.mah-article-dash {
    color: var(--coffee);
    margin-top: 0.375rem;
    flex-shrink: 0;
}

/* ── Bottom bar ─────────────────────────────────────────── */
.mah-article-footer {
    margin-top: 3.5rem;
    padding-top: 2rem;
    border-top: 1px solid var(--hairline);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.mah-article-back {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: opacity 0.2s;
}
.mah-article-back:hover { opacity: 0.6; }
.mah-article-back__icon { width: 14px !important; height: 14px !important; }

.mah-article-book {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--ink);
    color: var(--ivory) !important;
    padding: 0.75rem 1.5rem;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    transition: background 0.25s;
}
.mah-article-book:hover { background: var(--coffee); }
.mah-article-book__icon { width: 14px !important; height: 14px !important; }

/* ── Related articles section ────────────────────────────── */
.mah-related {
    background: var(--ivory);
    border-top: 1px solid var(--hairline);
    padding: 4rem 1.5rem;
}
@media (min-width: 1024px) { .mah-related { padding: 5rem 2.5rem; } }

.mah-related__inner { max-width: var(--max-w); margin-inline: auto; }
.mah-related__eyebrow { margin-bottom: 2rem; }

/* 2-col grid on md+ */
.mah-related__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}
@media (min-width: 640px) { .mah-related__grid { grid-template-columns: 1fr 1fr; } }

/* Horizontal card */
.mah-related__card {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}
@media (min-width: 480px) {
    .mah-related__card { flex-direction: row; gap: 1.25rem; }
}

/* Image */
.mah-related__img-wrap {
    display: block;
    flex-shrink: 0;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 4/3;
}
@media (min-width: 480px) {
    .mah-related__img-wrap { width: 10rem; height: 10rem; aspect-ratio: unset; }
}
.mah-related__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}
.mah-related__card:hover .mah-related__img { transform: scale(1.05); }

/* Text */
.mah-related__body { display: flex; flex-direction: column; }
.mah-related__cat {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--coffee);
    margin-bottom: 0.5rem;
}
.mah-related__title {
    font-family: var(--font-main);
    font-size: clamp(1rem, 1.8vw, 1.125rem);
    line-height: 1.3;
    margin-bottom: 0.5rem;
}
.mah-related__title a { color: var(--ink); }
.mah-related__title a:hover { text-decoration: underline; text-underline-offset: 3px; }
.mah-related__excerpt {
    font-size: 0.875rem;
    color: rgba(24,17,8,0.60);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* GP override: prevent GeneratePress from re-styling article element */
.mah-article-content.mah-article-content {
    background: transparent !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}
@media (min-width: 1024px) {
    .mah-article-content.mah-article-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}


/* ══════════════════════════════════════════════════════
   RESTAURANT — CONTACTS (mah-rest-contacts)
   ══════════════════════════════════════════════════════ */
.mah-rest-contacts {
    padding: 4rem 1rem;
    background: #fff;
}
.mah-rest-contacts__inner {
    max-width: 1280px;
    margin: 0 auto;
}
.mah-rest-contacts__h2 {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    color: var(--ink);
    margin: 0.5rem 0 2.5rem;
}
.mah-rest-contacts__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 2rem;
}
.mah-rest-contacts__item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}
.mah-rest-contacts__ico {
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    color: var(--coffee);
    margin-top: 0.1em;
}
.mah-rest-contacts__ico svg {
    width: 100%;
    height: 100%;
}
.mah-rest-contacts__lbl {
    font-size: 0.625rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--coffee);
    margin-bottom: 0.25rem;
}
.mah-rest-contacts__val {
    font-size: 0.9375rem;
    color: var(--ink);
    line-height: 1.4;
}
.mah-rest-contacts__link {
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}
.mah-rest-contacts__link:hover {
    border-color: var(--coffee);
}

/* =============================================================
   OFFERS PAGE  mah-offers-*
   ============================================================= */

/* --- Hero --- */
.mah-offers-hero{position:relative;height:78vh;min-height:480px;display:flex;align-items:flex-end;overflow:hidden;}
.mah-offers-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;}
.mah-offers-hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,15,10,.72) 0%,rgba(20,15,10,.18) 60%,transparent 100%);z-index:1;}
.mah-offers-hero__body{position:relative;z-index:2;padding:3rem 2rem 3.5rem;max-width:860px;}
.mah-offers-hero__eyebrow{color:var(--ivory);text-shadow:0 1px 4px rgba(0,0,0,.55);}
.mah-offers-hero__title{font-size:clamp(2.2rem,5vw,4rem);color:var(--ivory);margin:0.5rem 0 1rem;line-height:1.1;}
.mah-offers-hero__sub{font-size:1.05rem;color:rgba(255,255,255,.78);margin:0;max-width:520px;}

/* --- List --- */
.mah-offers-list{background:var(--ivory);padding:5rem 2rem;}
.mah-offers-list__inner{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:5rem;}

/* --- Card --- */
.mah-offers-card{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;}
.mah-offers-card--reverse{direction:rtl;}
.mah-offers-card--reverse>*{direction:ltr;}
.mah-offers-card__photo{width:100%;aspect-ratio:4/3;border-radius:4px;box-shadow:0 8px 32px rgba(80,55,30,.13);overflow:hidden;}
.mah-offers-card__img{width:100%;height:100%;object-fit:cover;display:block;}
.mah-offers-card__body{display:flex;flex-direction:column;gap:1.1rem;}
.mah-offers-card__title{font-size:clamp(1.5rem,2.5vw,2rem);color:var(--ink);margin:0;line-height:1.2;}
.mah-offers-card__desc{font-size:1rem;color:var(--graphite);margin:0;line-height:1.65;}
.mah-offers-card__includes-label{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--coffee);font-weight:600;margin:0;}
.mah-offers-card__includes{list-style:none;margin:.4rem 0 0;padding:0;display:flex;flex-direction:column;gap:.45rem;}
.mah-offers-card__includes li{font-size:.95rem;color:var(--ink);padding-left:1.4rem;position:relative;}
.mah-offers-card__includes li::before{content:'';position:absolute;left:0;top:.45em;width:6px;height:6px;border-radius:50%;background:var(--brass);}
.mah-offers-card__condition{font-size:.875rem;color:var(--graphite);border-left:2px solid var(--brass);padding-left:.9rem;margin:0;font-style:italic;}
.mah-offers-card__btn{display:inline-flex;align-items:center;gap:.55rem;background:var(--ink);color:var(--ivory);font-family:inherit;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;padding:.75rem 1.75rem;border:none;cursor:pointer;text-decoration:none;border-radius:2px;align-self:flex-start;transition:background .2s;}
.mah-offers-card__btn:hover{background:var(--coffee);color:var(--ivory);}

/* --- Empty state --- */
.mah-offers-empty{text-align:center;padding:4rem 2rem;color:var(--graphite);font-size:1rem;}

/* --- CTA --- */
.mah-offers-cta{background:var(--ink);padding:5rem 2rem;text-align:center;}
.mah-offers-cta__inner{max-width:640px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:1.25rem;}
.mah-offers-cta__eyebrow{color:var(--brass);}
.mah-offers-cta__title{font-size:clamp(1.6rem,3vw,2.4rem);color:var(--ivory);margin:0;line-height:1.2;}
.mah-offers-cta__phone{display:inline-flex;align-items:center;gap:.7rem;color:var(--brass);text-decoration:none;font-size:clamp(1.5rem,3vw,2rem);transition:opacity .2s;}
.mah-offers-cta__phone:hover{opacity:.8;}
.mah-offers-cta__phone-icon svg{width:1.4em;height:1.4em;stroke:var(--brass);fill:none;}
.mah-offers-cta__note{font-size:.875rem;color:rgba(255,255,255,.55);margin:0;}

/* --- Responsive --- */
@media(max-width:768px){
  .mah-offers-card,.mah-offers-card--reverse{grid-template-columns:1fr;direction:ltr;gap:1.5rem;}
  .mah-offers-list{padding:3rem 1.25rem;}
  .mah-offers-list__inner{gap:3.5rem;}
  .mah-offers-hero__body{padding:2rem 1.25rem 2.5rem;}
}

/* ═══════════════════════════════════════════════════════════
   STATS — 4 facts bar
   ═══════════════════════════════════════════════════════════ */
.mah-stats{background:var(--ink);padding:3rem 2rem;}
.mah-stats__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0;max-width:860px;margin:0 auto;list-style:none;padding:0;}
.mah-stats__item{padding:2rem 1.5rem;border-right:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12);}
.mah-stats__item:nth-child(2n){border-right:none;}
.mah-stats__item:nth-last-child(-n+2){border-bottom:none;}
.mah-stats__num{font-size:clamp(2.2rem,6vw,3.5rem);color:var(--ivory);line-height:1;margin:0 0 .5rem;}
.mah-stats__label{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);margin:0;}
@media(min-width:640px){
  .mah-stats__grid{grid-template-columns:repeat(4,1fr);}
  .mah-stats__item{border-right:1px solid rgba(255,255,255,.12);border-bottom:none;}
  .mah-stats__item:last-child{border-right:none;}
}

/* ═══════════════════════════════════════════════════════════
   ABOUT PAGE — page-pro-hotel.php
   ═══════════════════════════════════════════════════════════ */
.mah-about-hero{min-height:70vh;}
.mah-about-intro{max-width:54rem;margin-inline:auto;padding-inline:var(--px);}
@media(min-width:1024px){.mah-about-intro{padding-inline:var(--px-lg);}}
.mah-about-intro__text{font-family:var(--font-main);font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.75;color:var(--ink);text-align:center;}
.mah-about-history__grid{display:grid;gap:3rem 5rem;align-items:start;}
@media(min-width:1024px){.mah-about-history__grid{grid-template-columns:7fr 5fr;}}
.mah-about-history__img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;}
.mah-about-philosophy__inner{max-width:46rem;margin-inline:auto;padding-inline:var(--px);}
@media(min-width:1024px){.mah-about-philosophy__inner{padding-inline:var(--px-lg);}}
.mah-about-cta__btns{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:2.5rem;}

/* ═══════════════════════════════════════════════════════════
   CONFERENCES TEASER — mini promo block
   ═══════════════════════════════════════════════════════════ */
.mah-conf-teaser{background:var(--pebble,#f2ede6);padding:5rem 2rem;}
.mah-conf-teaser__grid{display:grid;grid-template-columns:1fr;gap:2.5rem;max-width:1100px;margin:0 auto;align-items:center;}
.mah-conf-teaser__img-wrap{border-radius:2px;overflow:hidden;aspect-ratio:16/9;}
.mah-conf-teaser__img{width:100%;height:100%;object-fit:cover;}
.mah-conf-teaser__title{font-size:clamp(1.8rem,4vw,3rem);color:var(--ink);margin:.75rem 0 1rem;line-height:1.15;}
.mah-conf-teaser__text{font-size:1rem;color:rgba(24,17,8,.65);max-width:480px;margin:0 0 2rem;line-height:1.65;}
@media(min-width:768px){
  .mah-conf-teaser__grid{grid-template-columns:1fr 1fr;gap:4rem;}
}

/* reviews CTA row */
.mah-reviews-cta{text-align:center;margin-top:3rem;}

/* adv section h2 -- no wrap on tablet+ */
#adv-h { white-space: nowrap; }
@media (max-width: 639px) { #adv-h { white-space: normal; } }

/* ══════════════════════════════════════════════════════════════
   POPUP — timed promo modal
   Prefix: mah-popup-*  (unique — zero conflicts)
   ══════════════════════════════════════════════════════════════ */

/* ── Overlay ──────────────────────────────────────────────── */
.mah-popup-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(18, 16, 14, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  pointer-events: none;        /* hidden by default — no interaction until is-visible */
  transition: opacity 0.35s ease;
}

/* CSS display:flex overrides browser's [hidden] → force it back */
.mah-popup-overlay[hidden] { display: none !important; }

.mah-popup-overlay.is-visible { opacity: 1; pointer-events: auto; }
.mah-popup-overlay.is-hiding  { opacity: 0; pointer-events: none; }

/* ── Popup box ────────────────────────────────────────────── */
.mah-popup {
  position: relative;
  width: 100%;
  max-width: 480px;
  background: var(--ivory, #fefcf8);
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(18, 16, 14, 0.32);
  transform: translateY(20px) scale(0.98);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease;
  opacity: 0;
}

.mah-popup-overlay.is-visible .mah-popup {
  transform: translateY(0) scale(1);
  opacity: 1;
}

.mah-popup-overlay.is-hiding .mah-popup {
  transform: translateY(10px) scale(0.99);
  opacity: 0;
}

/* ── Image block (top) ────────────────────────────────────── */
.mah-popup__img-wrap {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--pebble, #e8e4de);
}

.mah-popup__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

/* ── White body (bottom) ──────────────────────────────────── */
.mah-popup__body {
  padding: 2rem 2rem 2.25rem;
  text-align: center;
  position: relative;
}

/* ── Close button ─────────────────────────────────────────── */
.mah-popup__close {
  position: absolute;
  top: 0.875rem;
  right: 0.875rem;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--graphite, #6b6560);
  border-radius: 50%;
  transition: background 0.2s ease, color 0.2s ease;
  padding: 0;
  line-height: 1;
}

.mah-popup__close:hover {
  background: rgba(18, 16, 14, 0.08);
  color: var(--ink, #1a1714);
}

.mah-popup__close:focus-visible {
  outline: 2px solid var(--brass, #b59a6a);
  outline-offset: 2px;
}

/* ── Typography ───────────────────────────────────────────── */
.mah-popup__subtitle {
  font-family: var(--font-body, 'Ysabeau Infant', sans-serif);
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--graphite, #6b6560);
  margin: 0 0 0.75rem;
}

.mah-popup__title {
  font-family: var(--font-display, 'Fraunces', serif);
  font-size: clamp(1.5rem, 5vw, 2.125rem);
  font-weight: 300;
  color: var(--ink, #1a1714);
  line-height: 1.15;
  margin: 0 0 1rem;
}

.mah-popup__desc {
  font-family: var(--font-body, 'Ysabeau Infant', sans-serif);
  font-size: 0.9rem;
  color: var(--graphite, #6b6560);
  line-height: 1.6;
  margin: 0 0 1.5rem;
}

/* ── CTA button ───────────────────────────────────────────── */
.mah-popup__cta { display: flex; justify-content: center; }

.mah-popup__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  background: var(--ink, #1a1714);
  color: var(--ivory, #fefcf8);
  font-family: var(--font-body, 'Ysabeau Infant', sans-serif);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.25s ease;
}

.mah-popup__btn:hover { background: var(--coffee, #5c4a3a); }
.mah-popup__btn--disabled { opacity: 0.45; cursor: default; }
.mah-popup__btn--disabled:hover { background: var(--ink, #1a1714); }

/* ── Scroll lock ──────────────────────────────────────────── */
body.mah-popup-open { overflow: hidden; }

/* ── Mobile ───────────────────────────────────────────────── */
@media (max-width: 480px) {
  .mah-popup { max-width: 100%; }
  .mah-popup__img-wrap { aspect-ratio: 4 / 3; }
  .mah-popup__body { padding: 1.5rem 1.25rem 1.75rem; }
  .mah-popup__title { font-size: 1.5rem; }
}


/* ── Legal documents (template-legal.php) — mah-legal-* ───────────────── */
.mah-legal { background: var(--ivory); padding-top: 6rem; padding-bottom: clamp(3rem,6vw,6rem); }
.mah-legal__inner { max-width: 56rem; margin: 0 auto; padding-inline: var(--px); }
.mah-legal__back { display: inline-block; margin-bottom: 1.5rem; font-size: 0.9rem; color: var(--coffee); text-decoration: none; opacity: 0.8; transition: opacity .2s; }
.mah-legal__back:hover { opacity: 1; }
.mah-legal__title { font-size: clamp(1.9rem, 1.2rem + 2.6vw, 3rem); line-height: 1.15; color: var(--ink); margin-bottom: 2rem; }
.mah-legal-doc { color: var(--ink); font-size: 1rem; line-height: 1.7; }
.mah-legal-doc__subtitle { font-size: 1.05rem; color: var(--coffee); margin: 0 0 1.5rem; }
.mah-legal-doc__disclaimer { background: rgba(24,17,8,0.04); border-left: 3px solid var(--brass); padding: 0.9rem 1.1rem; margin: 0 0 2rem; font-size: 0.92rem; color: rgba(24,17,8,0.75); }
.mah-legal-doc__p { margin: 0 0 1rem; }
.mah-legal-doc ol { list-style: none; counter-reset: item; margin: 0; padding-left: 0; }
.mah-legal-doc ol ol { margin-top: 0.6rem; }
.mah-legal-doc li { counter-increment: item; position: relative; padding-left: 2.8rem; margin: 0.55rem 0; }
.mah-legal-doc li::before { content: counters(item, '.') '.'; position: absolute; left: 0; top: 0; min-width: 2.4rem; color: var(--coffee); font-variant-numeric: tabular-nums; }
.mah-legal-doc__list > li { margin-top: 1.6rem; }
.mah-legal-doc__list > li > .txt { font-weight: 600; color: var(--ink); }
.mah-legal-doc__list > li::before { font-weight: 600; color: var(--ink); }
@media (max-width: 640px){ .mah-legal-doc li { padding-left: 2.2rem; } }


/* ── Footer legal / policy links row (footer.php) ─────────────────────── */
.mah-footer__legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.35rem 0.65rem; width: 100%; margin-top: 1.25rem; }
.mah-footer__legal a { font-size: 0.8rem; color: rgba(24,17,8,0.55); text-decoration: none; }
.mah-footer__legal a:hover { color: var(--coffee); }
.mah-footer__legal-sep { color: rgba(24,17,8,0.3); font-size: 0.8rem; }


/* ── AJAX form states (Naryad #3, 2026-09-10) — mah_form_thanks/error ── */
.mah-form-thanks { padding: 1.5rem 0; font-family: var(--font-main); font-size: 1.125rem; color: var(--ink); }
.mah-form-error { margin-bottom: 1.25rem; padding: 0.75rem 1rem; border: 1px solid rgba(178,34,34,0.35); background: rgba(178,34,34,0.06); color: #8a1f1f; font-family: var(--font-main); font-size: 0.9375rem; border-radius: 2px; }