:root{--dark:#252524;--cream:#ddd3c4;--off:#f4f0e9;--white:#f6f2eb;--red:#993331;--orange:#db6842;--sans:"Inter",Arial,sans-serif;--serif:"Iowan Old Style","Baskerville","Times New Roman",serif;--pad:clamp(22px,4vw,58px);--body:16px;--lh:19px;--nav:48px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--dark);font:400 var(--body)/var(--lh) var(--sans);-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}a{color:inherit;text-underline-offset:.2em;transition:color .2s}a:hover{color:var(--orange)}img{display:block;max-width:100%}.global-nav{position:fixed;top:0;left:0;right:0;height:var(--nav);z-index:400;background:var(--cream)}.global-nav-inner{height:100%;display:flex;align-items:center;justify-content:center;gap:clamp(24px,3vw,50px);font-size:14px}.global-nav a{text-decoration:none}.site-header{position:fixed;top:var(--nav);left:0;right:0;z-index:500;height:0;color:#fff;mix-blend-mode:exclusion}.menu-toggle,.site-logo,.header-note{position:absolute;top:24px;pointer-events:auto}.menu-toggle{left:32px;width:28px;height:18px;border:0;background:transparent;cursor:pointer}.menu-toggle:before,.menu-toggle:after{content:"";position:absolute;left:0;width:100%;height:1px;background:#fff}.menu-toggle:before{top:3px}.menu-toggle:after{bottom:3px}body.menu-open .menu-toggle:before{top:50%;transform:rotate(45deg)}body.menu-open .menu-toggle:after{top:50%;bottom:auto;transform:rotate(-45deg)}body.menu-open .site-header{mix-blend-mode:normal}.site-logo{left:50%;width:min(230px,42vw);transform:translateX(-50%)}.site-logo img{filter:brightness(0) invert(1)}.header-note{right:32px;width:90px;font-size:14px;line-height:16px;text-decoration:underline}.menu-overlay{position:fixed;inset:0;z-index:450;display:flex;align-items:center;justify-content:center;padding:120px var(--pad) 60px;background:rgba(153,51,49,.96);color:#fff;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s}.menu-overlay.dark{background:rgba(37,37,36,.97)}body.menu-open .menu-overlay{opacity:1;visibility:visible;pointer-events:auto}.menu-overlay-inner{width:min(100%,580px);text-align:center}.menu-overlay-group{margin-bottom:24px}.menu-overlay a,.menu-detail{display:block;margin:5px 0;text-decoration:none}.menu-contact-gap{margin-top:19px}.address-link{text-decoration:none}.hero,.split{display:grid;grid-template-columns:1fr 1fr;min-height:650px}.hero{min-height:calc(100svh - var(--nav))}.copy{display:flex;align-items:center;padding:clamp(80px,10vw,150px) clamp(38px,8vw,125px)}.copy>div{width:min(100%,470px);margin:auto}.media{min-height:650px;background:#8f8c87;position:relative}.hero .media{min-height:calc(100svh - var(--nav))}.media:after{content:attr(data-label);position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);font-size:12px;color:rgba(255,255,255,.75);text-transform:uppercase;text-align:center}.cream{background:var(--cream)}.off{background:var(--off)}.red{background:var(--red);color:var(--white)}.orange{background:#c7653e;color:var(--white)}.darkbg{background:var(--dark);color:var(--white)}h2{font:400 31px/37px var(--serif);letter-spacing:-1px;margin:0 0 25px}.intro{font-size:19px;line-height:23px}.menu-list a{display:block;width:fit-content;margin:0 0 14px}.menu-note,.small-note{font-size:13px;line-height:16px;opacity:.52}.muted-body{font-size:var(--body);line-height:var(--lh);opacity:.52}.rooms{padding:clamp(100px,12vw,175px) var(--pad)}.rooms-inner{width:min(100%,1050px);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:60px}.visit{padding:clamp(100px,11vw,165px) var(--pad);background:var(--off)}.visit-grid{width:min(100%,1050px);margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(40px,7vw,100px)}.visit h3{font:400 31px/37px var(--serif);letter-spacing:-1px;margin:0 0 28px}.signup-placeholder{padding:90px var(--pad);background:var(--cream);color:var(--red);text-align:center}.footer{padding:60px var(--pad);background:var(--dark);color:#fff;font-size:13px;line-height:18px}.footer-grid{width:min(100%,1050px);margin:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:35px}.footer a{display:block;text-decoration:none;margin:0 0 6px}.footer-legal{width:min(100%,1050px);margin:65px auto 0;opacity:.62}.full-image{height:min(calc(100svh - var(--nav)),900px);background:#666;position:relative}.full-image:after{content:attr(data-label);position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);color:#fff;font-size:12px;text-transform:uppercase}@media(max-width:700px){.global-nav{display:none}.site-header{top:0}.header-note{display:none}.hero,.split,.rooms-inner,.visit-grid{grid-template-columns:1fr}.hero,.hero .media,.media{min-height:auto}.media{aspect-ratio:1}.copy{padding:100px var(--pad)}.hero .copy{padding-top:145px}.footer-grid{grid-template-columns:1fr 1fr}.full-image{height:auto;aspect-ratio:4/5}}

/* ===== Canonical homepage signup + footer reinstatement ===== */
.signup {
  padding: clamp(65px, 7vw, 105px) var(--pad, var(--page-pad, 22px)) clamp(80px, 8vw, 125px);
  background: var(--cream, var(--signup-cream, #ddd3c4));
  color: var(--red, var(--jose-red, #993331));
}
.signup-inner { width:min(100%,720px); margin:0 auto; }
.signup-title { margin:0 0 45px; font-family:var(--sans); font-size:20px; font-weight:400; line-height:24px; letter-spacing:0; }
.form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-bottom:9px; }
.form-field { width:100%; padding:8px 0; color:inherit; background:transparent; border:0; border-bottom:1px solid currentColor; border-radius:0; font-family:var(--sans); font-size:16px; font-weight:400; line-height:19px; outline:none; }
.form-field::placeholder { color:currentColor; opacity:1; }
.email-row { margin-bottom:11px; }
.signup-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px 20px; margin:13px 0 28px; font-family:var(--sans); font-size:13px; line-height:16px; }
.signup-options label { display:flex; align-items:flex-start; gap:7px; cursor:pointer; }
.signup-options input[type="checkbox"] { appearance:none; -webkit-appearance:none; position:relative; flex:0 0 auto; width:15px; height:15px; margin:1px 0 0; border:1px solid var(--red, #993331); border-radius:2px; background:var(--cream, #ddd3c4); }
.signup-options input[type="checkbox"]:checked { background:var(--red, #993331); }
.signup-options input[type="checkbox"]:checked::after { content:""; position:absolute; left:4px; top:1px; width:4px; height:8px; border:solid var(--white, #f6f2eb); border-width:0 2px 2px 0; transform:rotate(45deg); }
.subscribe-button { padding:0; color:inherit; background:transparent; border:0; border-bottom:1px solid currentColor; font-family:var(--sans); font-size:20px; font-weight:400; line-height:24px; cursor:pointer; }
.contacta-compatibility { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.signup control-messages { display:block; min-height:0; margin-top:4px; font-size:12px; line-height:15px; }
.signup .submission-message { margin-top:20px; color:var(--red, #993331) !important; }
.site-footer { padding:clamp(52px,5vw,65px) var(--pad, var(--page-pad,22px)) 65px; background:var(--dark,#252524); color:var(--white,#f6f2eb); font-family:var(--sans); font-size:13px; line-height:1.6; }
.footer-inner { width:min(100%,1050px); margin:0 auto; }
.site-footer .footer-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:25px 50px; width:auto; margin:0; }
.footer-column a,.footer-column span { display:block; margin-bottom:6px; }
.footer-column a { text-decoration:none; }
.footer-column-last { position:relative; padding-right:34px; }
.footer-instagram { position:absolute; top:0; right:0; width:18px; height:18px; }
.footer-instagram a { display:block; width:18px; height:18px; margin:0; }
.footer-instagram img { width:18px; height:18px; object-fit:contain; }
.site-footer .footer-legal { width:auto; margin:40px 0 0; opacity:.68; }
.footer-column.inc { padding-top:27px; }
@media (max-width:900px) { .site-footer .footer-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:700px) {
  .signup { padding:100px var(--pad, var(--page-pad,22px)); }
  .form-row { grid-template-columns:1fr; gap:8px; }
  .signup-options { grid-template-columns:1fr 1fr; }
  .site-footer { padding:60px var(--pad, var(--page-pad,22px)); }
  .site-footer .footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
  .footer-column-last { padding-right:0; }
  .footer-instagram { left:calc(100% + 28px); right:auto; }
  .footer-column.inc { padding-top:0; }
}
@media (max-width:430px) { .signup-options { grid-template-columns:1fr; } }


/* ===== Shared scrolling header update ===== */
:root {
  --shared-global-nav-height: var(--global-nav-height, var(--nav, 48px));
  --shared-header-y: var(--header-pad-y, 24px);
}
.global-nav {
  transform:translateY(0);
  transition:transform 320ms ease;
  will-change:transform;
}
body.global-nav-hidden .global-nav { transform:translateY(-100%); }
.site-header { position:absolute !important; }
.site-header .site-logo { position:absolute !important; }
.site-header .menu-toggle,
.site-header .header-note {
  position:fixed !important;
  top:calc(var(--shared-global-nav-height) + var(--shared-header-y)) !important;
  z-index:510;
  pointer-events:auto;
  transition:top 320ms ease;
  mix-blend-mode:exclusion;
}
body.global-nav-hidden .site-header .menu-toggle,
body.global-nav-hidden .site-header .header-note { top:var(--shared-header-y) !important; }
body.menu-open .site-header,
body.menu-open .site-header .menu-toggle,
body.menu-open .site-header .header-note { mix-blend-mode:normal; }
body.menu-open .global-nav { z-index:700 !important; }
@media (max-width:700px) {
  .site-header .menu-toggle,
  .site-header .header-note,
  body.global-nav-hidden .site-header .menu-toggle,
  body.global-nav-hidden .site-header .header-note { top:var(--shared-header-y) !important; }
}
@media (prefers-reduced-motion:reduce) {
  .global-nav,
  .site-header .menu-toggle,
  .site-header .header-note { transition:none !important; }
}


/* ===== Static scrolling logo: native artwork, no blend mode =====
   Hamburger / Reservations retain exclusion blending.
   Iris is intentionally excluded because its logo overlays the video hero.
*/
.site-header {
  mix-blend-mode: normal !important;
}
.site-header .site-logo {
  mix-blend-mode: normal !important;
}
.site-header .site-logo img {
  filter: none !important;
}



/* =========================================================
   V12 — FIXED CONTROL EXCLUSION
   Logo scrolls normally. Only fixed hamburger / header note
   use exclusion blending over page content.
   ========================================================= */
.site-header {
  mix-blend-mode: normal !important;
}

.site-logo,
.site-logo img {
  mix-blend-mode: normal !important;
}

.menu-toggle,
.menu-toggle span,
.header-note,
.header-note a {
  mix-blend-mode: exclusion !important;
}

body.menu-open .menu-toggle,
body.menu-open .menu-toggle span,
body.menu-open .header-note,
body.menu-open .header-note a {
  mix-blend-mode: normal !important;
}


/* =========================================================
   V13 — TRUE FIXED-CONTROL EXCLUSION
   The fixed controls are DOM siblings of the scrolling logo
   header so their blend backdrop is the page, not the header's
   isolated stacking context.
   ========================================================= */

.menu-toggle.fixed-page-control,
.header-note.fixed-page-control {
  position: fixed !important;
  top: calc(
    var(--shared-global-nav-height, var(--global-nav-height, var(--nav, 48px)))
    + var(--shared-header-y, var(--header-pad-y, 24px))
  ) !important;
  z-index: 510 !important;
  pointer-events: auto;
  mix-blend-mode: exclusion !important;
  transition: top 320ms ease;
}

.menu-toggle.fixed-page-control {
  left: var(--header-pad-x, 32px);
}

.header-note.fixed-page-control {
  right: var(--header-pad-x, 32px);
}

body.global-nav-hidden .menu-toggle.fixed-page-control,
body.global-nav-hidden .header-note.fixed-page-control {
  top: var(--shared-header-y, var(--header-pad-y, 24px)) !important;
}

body.menu-open .menu-toggle.fixed-page-control,
body.menu-open .header-note.fixed-page-control {
  mix-blend-mode: normal !important;
}

@media (max-width: 700px) {
  .menu-toggle.fixed-page-control,
  .header-note.fixed-page-control,
  body.global-nav-hidden .menu-toggle.fixed-page-control,
  body.global-nav-hidden .header-note.fixed-page-control {
    top: var(--shared-header-y, var(--header-pad-y, 24px)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .menu-toggle.fixed-page-control,
  .header-note.fixed-page-control {
    transition: none !important;
  }
}
  

/* ===== Shared September rollout: nav, Reservations, footer social ===== */
:root {
  --lolo-off: #f4f0e9;
  --reservations-red-rgb: 153, 51, 49;
  --reservations-red-current: rgba(var(--reservations-red-rgb), .96);
  --reservations-width: 226px;
}
.global-nav { background: var(--lolo-off) !important; }

/* Reservations trigger is isolated from the wrapper so exclusion blends
   against the actual page beneath; dropdown remains normal blend. */
.reservations-control.fixed-page-control {
  position: static !important;
  width: 0 !important;
  height: 0 !important;
  z-index: auto !important;
  color: inherit !important;
}
.reservations-trigger {
  position: fixed !important;
  top: calc(var(--shared-global-nav-height,var(--global-nav-height,var(--nav,48px))) + var(--shared-header-y,var(--header-pad-y,24px))) !important;
  right: var(--header-pad-x,32px) !important;
  width: var(--reservations-width) !important;
  z-index: 520 !important;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff !important;
  font: inherit;
  font-size: 14px;
  line-height: 16px;
  text-align: right;
  text-decoration: underline;
  text-underline-offset: .2em;
  cursor: pointer;
  mix-blend-mode: exclusion !important;
  transition: top 320ms ease !important;
}
.reservations-dropdown {
  position: fixed !important;
  top: calc(var(--shared-global-nav-height,var(--global-nav-height,var(--nav,48px))) + var(--shared-header-y,var(--header-pad-y,24px)) + 26px) !important;
  right: var(--header-pad-x,32px) !important;
  width: var(--reservations-width) !important;
  z-index: 519 !important;
  max-height: 0;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
  mix-blend-mode: normal !important;
  transition: max-height 760ms ease, opacity 620ms ease, transform 660ms ease, visibility 0s linear 760ms;
}
@media (hover:hover) and (pointer:fine) {
  .reservations-control:hover .reservations-dropdown,
  .reservations-control:focus-within .reservations-dropdown {
    max-height: 360px;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    transition: max-height 700ms ease, opacity 700ms ease, transform 700ms ease, visibility 0s;
  }
}
.reservations-control.is-open .reservations-dropdown {
  max-height: 360px;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
  transition: max-height 700ms ease, opacity 700ms ease, transform 700ms ease, visibility 0s;
}
.reservations-dropdown a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 41px;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.72);
  border-bottom: 0;
  background: var(--lolo-off,#f4f0e9);
  color: var(--red,#993331);
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  text-decoration: none;
  transition: background-color 180ms ease, color 180ms ease;
}
.reservations-dropdown a:last-child { border-bottom: 1px solid rgba(255,255,255,.72); }
.reservations-dropdown a:hover,
.reservations-dropdown a:focus-visible {
  background: rgba(var(--reservations-red-rgb),.96);
  color: #fff;
  outline: none;
}
.reservations-dropdown a.is-current {
  background: var(--reservations-red-current);
  color: #fff;
}
body.global-nav-hidden .reservations-trigger {
  top: var(--shared-header-y,var(--header-pad-y,24px)) !important;
}
body.global-nav-hidden .reservations-dropdown {
  top: calc(var(--shared-header-y,var(--header-pad-y,24px)) + 26px) !important;
}
body.menu-open .reservations-trigger { mix-blend-mode: normal !important; }

/* Footer social stack: Instagram + LinkedIn */
.footer-social .footer-instagram,
.footer-social .footer-linkedin {
  position: static;
  top: auto;
  right: auto;
  left: auto;
}
.footer-social {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 18px;
}
.footer-instagram,
.footer-linkedin,
.footer-social a {
  display: block;
  width: 18px;
  height: auto;
  margin: 0;
}
.footer-social img,
.footer-social svg {
  display: block;
  width: 18px;
  height: 18px;
  object-fit: contain;
}
@media (max-width:700px) {
  :root { --reservations-width: 50vw; }
  .reservations-trigger {
    top: var(--shared-header-y,var(--header-pad-y,24px)) !important;
    right: var(--header-pad-x,32px) !important;
    width: 50vw !important;
  }
  .reservations-dropdown,
  body.global-nav-hidden .reservations-dropdown {
    top: calc(var(--shared-header-y,var(--header-pad-y,24px)) + 66px) !important;
    right: var(--header-pad-x,32px) !important;
    width: 50vw !important;
  }
  .footer-social {
    left: calc(100% + 28px);
    right: auto;
  }
}
@media (prefers-reduced-motion:reduce) {
  .reservations-trigger,
  .reservations-dropdown,
  .reservations-dropdown a { transition: none !important; }
}


/* =========================================================
   V26 SHARED HEADER ALIGNMENT PASS
   Homepage is the source of truth for ALL shared header geometry.
   ========================================================= */

.global-nav-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(28px, 3.2vw, 52px) !important;
  width: min(
    calc(100% - (var(--page-pad, 40px) * 2)),
    1200px
  ) !important;
  height: 100% !important;
  margin: 0 auto !important;
}

.site-logo {
  top:
    calc(
      var(--header-pad-y, 24px)
      -
      12px
    ) !important;
  width: min(190px, 34vw) !important;
}

@media (max-width: 900px) and (min-width: 701px) {
  .global-nav-inner {
    gap: clamp(18px, 2.4vw, 30px) !important;
  }
}

@media (max-width: 700px) {
  .site-logo {
    top:
      calc(
        var(--header-pad-y, 24px)
        -
        7px
      ) !important;
    width: min(170px, 42vw) !important;
  }
}


/* =========================================================
   RESERVATIONS DESKTOP HOVER BRIDGE

   Match the working homepage trigger geometry: the 10px
   bottom padding extends the trigger's hoverable box down to
   the dropdown's fixed top position (+26px), so moving from
   Reservations into the first menu item never crosses a dead
   hover gap.
   ========================================================= */

@media (hover:hover) and (pointer:fine) and (min-width:701px) {
  .reservations-trigger {
    padding-bottom:10px !important;
  }
}

/* Mobile/touch remains click/tap driven. */
@media (max-width:700px) {
  .reservations-trigger {
    padding-bottom:0 !important;
  }
}


/* =========================================================
   UNIVERSAL IMAGE AREA / CAROUSEL
   Every principal image area can hold one or many slides.
   A single image behaves exactly like a filled static image.
   ========================================================= */

.site-image-carousel {
  position:relative !important;
  overflow:hidden !important;
}

.site-image-carousel > img,
.site-image-carousel > picture {
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  opacity:0;
  transition:opacity 1s ease;
  pointer-events:none;
}

.site-image-carousel > picture > img,
.site-image-carousel > img {
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center !important;
}

.site-image-carousel > img:first-of-type,
.site-image-carousel > picture:first-of-type,
.site-image-carousel > .is-active {
  opacity:1;
}

.site-image-carousel > picture.is-active,
.site-image-carousel > img.is-active {
  opacity:1;
}

@media (prefers-reduced-motion:reduce) {
  .site-image-carousel > img,
  .site-image-carousel > picture {
    transition:none !important;
  }
}

.menu-overlay{background:rgba(37,37,36,.97)}.menu-overlay-inner{display:flex;flex-direction:column;align-items:center;gap:22px}.menu-overlay-group{text-align:center;margin:0}.menu-overlay-group a{display:block;margin:5px}.menu-detail{margin-bottom:8px}.menu-contact-gap{margin-top:12px}.muted{opacity:.5}.reservations-trigger{line-height:19px}
