.elementor-43 .elementor-element.elementor-element-3d9dfc9{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:5px 5px;--row-gap:5px;--column-gap:5px;--flex-wrap:nowrap;--overlay-opacity:0.5;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:#D9D2C614;--border-color:#D9D2C614;--margin-top:-100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--z-index:999;}.elementor-43 .elementor-element.elementor-element-3d9dfc9::before, .elementor-43 .elementor-element.elementor-element-3d9dfc9 > .elementor-background-video-container::before, .elementor-43 .elementor-element.elementor-element-3d9dfc9 > .e-con-inner > .elementor-background-video-container::before, .elementor-43 .elementor-element.elementor-element-3d9dfc9 > .elementor-background-slideshow::before, .elementor-43 .elementor-element.elementor-element-3d9dfc9 > .e-con-inner > .elementor-background-slideshow::before, .elementor-43 .elementor-element.elementor-element-3d9dfc9 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-43 .elementor-element.elementor-element-05912aa{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-43 .elementor-element.elementor-element-f76bf0f{text-align:start;}.elementor-43 .elementor-element.elementor-element-f76bf0f img{width:80%;}.elementor-43 .elementor-element.elementor-element-30d65e3{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu .elementor-item{font-family:"Jost", Sans-serif;font-size:12px;font-weight:500;text-transform:uppercase;}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--main .elementor-item{color:#F7F4EF;fill:#F7F4EF;padding-left:12px;padding-right:12px;padding-top:8px;padding-bottom:8px;}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a:hover,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a:focus,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a.elementor-item-active,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a.highlighted,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-menu-toggle:hover,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-menu-toggle:focus{color:var( --e-global-color-primary );}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a:hover,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a:focus,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a.elementor-item-active,
					.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a.highlighted{background-color:var( --e-global-color-3982115 );}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a.elementor-item-active{color:var( --e-global-color-primary );}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--dropdown a{padding-left:40px;padding-right:40px;}.elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-43 .elementor-element.elementor-element-d5d9d96 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:5px !important;}.elementor-43 .elementor-element.elementor-element-c8d559b{--display:flex;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-43 .elementor-element.elementor-element-6b6f844 .elementor-icon-wrapper{text-align:center;}.elementor-43 .elementor-element.elementor-element-6b6f844.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-accent );}.elementor-43 .elementor-element.elementor-element-6b6f844.elementor-view-framed .elementor-icon, .elementor-43 .elementor-element.elementor-element-6b6f844.elementor-view-default .elementor-icon{color:var( --e-global-color-accent );border-color:var( --e-global-color-accent );}.elementor-43 .elementor-element.elementor-element-6b6f844.elementor-view-framed .elementor-icon, .elementor-43 .elementor-element.elementor-element-6b6f844.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-accent );}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-43 .elementor-element.elementor-element-8aa5409 .elementor-button{background-color:#A98B5D00;font-family:"Jost", Sans-serif;font-size:12px;font-weight:500;fill:#F7F4EF;color:#F7F4EF;transition-duration:0.5s;border-style:solid;border-width:1px 1px 1px 1px;border-color:#F7F4EF73;padding:20px 32px 20px 32px;}.elementor-43 .elementor-element.elementor-element-8aa5409 .elementor-button:hover, .elementor-43 .elementor-element.elementor-element-8aa5409 .elementor-button:focus{background-color:var( --e-global-color-accent );}.elementor-43 .elementor-element.elementor-element-2dc240e .e-off-canvas__content{background-color:var( --e-global-color-3982115 );}.elementor-43 .elementor-element.elementor-element-2dc240e .e-off-canvas__overlay{background-color:rgba(0,0,0,.8);}.elementor-43 .elementor-element.elementor-element-2dc240e{--e-off-canvas-height:100vh;--e-off-canvas-content-overflow:auto;--e-off-canvas-overlay-opacity:1;}.elementor-43 .elementor-element.elementor-element-0c7a607{--display:flex;}.elementor-43 .elementor-element.elementor-element-ca0f8d1{--display:flex;}body:not(.rtl) .elementor-43 .elementor-element.elementor-element-2d67712{right:0px;}body.rtl .elementor-43 .elementor-element.elementor-element-2d67712{left:0px;}.elementor-43 .elementor-element.elementor-element-2d67712{top:0px;}.elementor-43 .elementor-element.elementor-element-2d67712 .elementor-icon-wrapper{text-align:center;}.elementor-43 .elementor-element.elementor-element-c7deab3{--display:flex;}.elementor-43 .elementor-element.elementor-element-a526ed9 .elementor-nav-menu--dropdown{background-color:#02010100;}.elementor-43 .elementor-element.elementor-element-0437358 .elementor-button{background-color:#A98B5D00;font-family:"Jost", Sans-serif;font-size:12px;font-weight:500;fill:#F7F4EF;color:#F7F4EF;transition-duration:0.5s;border-style:solid;border-width:1px 1px 1px 1px;border-color:#F7F4EF73;padding:20px 32px 20px 32px;}.elementor-43 .elementor-element.elementor-element-0437358 .elementor-button:hover, .elementor-43 .elementor-element.elementor-element-0437358 .elementor-button:focus{background-color:var( --e-global-color-accent );}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-43 .elementor-element.elementor-element-05912aa{--width:20%;}.elementor-43 .elementor-element.elementor-element-30d65e3{--width:60%;}.elementor-43 .elementor-element.elementor-element-c8d559b{--width:15%;}}@media(max-width:1024px) and (min-width:768px){.elementor-43 .elementor-element.elementor-element-05912aa{--width:50%;}.elementor-43 .elementor-element.elementor-element-c8d559b{--width:50%;}}@media(max-width:1024px){.elementor-43 .elementor-element.elementor-element-f76bf0f img{width:62%;}.elementor-43 .elementor-element.elementor-element-6b6f844 .elementor-icon{font-size:35px;}.elementor-43 .elementor-element.elementor-element-6b6f844 .elementor-icon svg{height:35px;}.elementor-43 .elementor-element.elementor-element-ca0f8d1{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-43 .elementor-element.elementor-element-2d67712 .elementor-icon{font-size:32px;}.elementor-43 .elementor-element.elementor-element-2d67712 .elementor-icon svg{height:32px;}.elementor-43 .elementor-element.elementor-element-a526ed9 .elementor-nav-menu--dropdown a{padding-left:0px;padding-right:0px;}.elementor-43 .elementor-element.elementor-element-0437358 .elementor-button{font-size:15px;}}@media(max-width:767px){.elementor-43 .elementor-element.elementor-element-f76bf0f img{width:100%;}.elementor-43 .elementor-element.elementor-element-6b6f844 .elementor-icon{font-size:55px;}.elementor-43 .elementor-element.elementor-element-6b6f844 .elementor-icon svg{height:55px;}}/* Start custom CSS for nav-menu, class: .elementor-element-d5d9d96 *//* ============================================================================
   MAISON AURELLE — DESKTOP NAV MENU
   Elementor Pro "Nav Menu" widget
   ----------------------------------------------------------------------------
   WHERE:  Header template → Nav Menu widget → Advanced → CSS Classes → ma-nav
           Then paste this into Site Settings → Custom CSS
   ============================================================================ */


/* ============================================================
   0. TOKENS
   ============================================================ */

:root{
  --ma-ink:#1E2621;
  --ma-slate:#3C4742;
  --ma-stone:#55605A;
  --ma-brass:#A98B5D;
  --ma-brass-dark:#7E6339;
  --ma-alabaster:#F7F4EF;
  --ma-mist:#EAE4DA;
  --ma-ivory:#FFFDF9;
  --ma-line:#D9D2C6;
  --ma-ease:cubic-bezier(.19,1,.22,1);

  --ma-nav-pad-x:12px;   /* horizontal padding per item  */
  --ma-nav-pad-y:10px;   /* vertical padding per item    */
}


/* ============================================================
   1. RESET ELEMENTOR DEFAULTS
   The widget ships a pointer effect, a divider and its own
   transitions. Clear them so ours are the only ones running.

   ONLY :before is reset here. The brass hairline in section 3 is
   built on :after — resetting that too would cancel it out.
   Set the widget's Pointer to "None" and nothing else is needed.
   ============================================================ */

.ma-nav .elementor-nav-menu--main .elementor-item:before{
  content:none !important;
}

.ma-nav .elementor-nav-menu--main .elementor-nav-menu > li{
  position:relative;   /* anchor for the hairline + submenu */
}

.ma-nav .elementor-nav-menu--main .elementor-nav-menu,
.ma-nav .elementor-nav-menu--main .elementor-nav-menu li{
  border:0;
}


/* ============================================================
   2. TOP-LEVEL ITEMS
   ============================================================ */

.ma-nav .elementor-nav-menu--main .elementor-item{
  position:relative;
  display:block;
  padding:var(--ma-nav-pad-y) var(--ma-nav-pad-x);

  font-family:"Jost",system-ui,sans-serif;
  font-size:11px;
  font-weight:500;
  letter-spacing:.18em;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;

  color:var(--ma-alabaster);
  fill:var(--ma-alabaster);

  transition:color .4s var(--ma-ease);
}

.ma-nav .elementor-nav-menu--main .elementor-item:hover,
.ma-nav .elementor-nav-menu--main .elementor-item:focus,
.ma-nav .elementor-nav-menu--main .elementor-item.highlighted{
  color:var(--ma-brass);
  background:transparent;   /* kill any widget background state */
}


/* ============================================================
   3. BRASS HAIRLINE
   Draws in from the left, retracts to the right.
   Only on top-level items — never inside a dropdown.
   ============================================================ */

.ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::after{
  content:"" !important;
  position:absolute;
  left:var(--ma-nav-pad-x);
  right:var(--ma-nav-pad-x);
  bottom:2px;
  height:1px;
  background:var(--ma-brass);
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .5s var(--ma-ease);
}

.ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item:hover::after,
.ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item.highlighted::after,
.ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item-active::after{
  transform:scaleX(1);
  transform-origin:left center;
}


/* ============================================================
   4. CURRENT PAGE
   ============================================================ */

.ma-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{
  color:var(--ma-brass);
}


/* ============================================================
   5. DROPDOWN CARET
   ============================================================ */

.ma-nav .elementor-nav-menu--main .sub-arrow{
  margin-left:5px;
  padding:0;
  display:inline-flex;
  align-items:center;
  transition:transform .4s var(--ma-ease);
}

.ma-nav .elementor-nav-menu--main .sub-arrow i{
  font-size:8px;
  line-height:1;
  opacity:.65;
}

.ma-nav .elementor-nav-menu--main .elementor-item.highlighted .sub-arrow,
.ma-nav .elementor-nav-menu--main li:hover > .elementor-item .sub-arrow{
  transform:rotate(180deg);
}


/* ============================================================
   6. DROPDOWN PANEL
   ----------------------------------------------------------------
   NOTE: Elementor drives these submenus with SmartMenus, which sets
   display:none / display:block inline. A CSS *transition* therefore
   never fires. A CSS *animation* does — it replays every time the
   element is shown. That is why this uses @keyframes.
   Do NOT set left/top here — SmartMenus owns the positioning.
   ============================================================ */

.ma-nav .elementor-nav-menu--main .sub-menu{
  margin-top:10px;
  padding:8px 0;
  min-width:214px;

  background-color:var(--ma-ivory);
  border:0;
  border-radius:0;
  box-shadow:0 20px 50px rgba(20,26,24,.10);

  animation:maDropIn .4s var(--ma-ease) both;
}

@keyframes maDropIn{
  from{ opacity:0; transform:translateY(-8px); }
  to  { opacity:1; transform:none; }
}

/* Hairline above the panel — reads as a brass seam, not a border */
.ma-nav .elementor-nav-menu--main .sub-menu::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background:var(--ma-brass);
  opacity:.55;
}


/* ============================================================
   7. DROPDOWN ITEMS
   ============================================================ */

.ma-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item{
  padding:12px 24px;

  font-family:"Jost",system-ui,sans-serif;
  font-size:10px;
  font-weight:400;
  letter-spacing:.14em;
  line-height:1.4;
  text-transform:uppercase;
  white-space:nowrap;

  color:var(--ma-stone);
  background:transparent;
  border:0;

  transition:color .3s var(--ma-ease),
             background-color .3s var(--ma-ease),
             padding-left .3s var(--ma-ease);
}

.ma-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item:hover,
.ma-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item:focus,
.ma-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item.highlighted,
.ma-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item.elementor-item-active{
  color:var(--ma-ink);
  background-color:var(--ma-mist);
  padding-left:29px;   /* small brass-less nudge on hover */
}


/* ============================================================
   8. SCROLLED HEADER — flip to ink
   Elementor adds .elementor-sticky--effects to the sticky
   container once it passes the scroll offset.
   ============================================================ */

.elementor-sticky--effects .ma-nav .elementor-nav-menu--main .elementor-item{
  color:var(--ma-slate);
  fill:var(--ma-slate);
}

.elementor-sticky--effects .ma-nav .elementor-nav-menu--main .elementor-item:hover,
.elementor-sticky--effects .ma-nav .elementor-nav-menu--main .elementor-item:focus,
.elementor-sticky--effects .ma-nav .elementor-nav-menu--main .elementor-item.highlighted,
.elementor-sticky--effects .ma-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{
  color:var(--ma-brass-dark);
}

.elementor-sticky--effects .ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::after{
  background:var(--ma-brass-dark);
}


/* ============================================================
   9. INNER PAGES — header is solid from the start
   ============================================================ */

body:not(.home) .ma-nav .elementor-nav-menu--main .elementor-item{
  color:var(--ma-slate);
  fill:var(--ma-slate);
}

body:not(.home) .ma-nav .elementor-nav-menu--main .elementor-item:hover,
body:not(.home) .ma-nav .elementor-nav-menu--main .elementor-item:focus,
body:not(.home) .ma-nav .elementor-nav-menu--main .elementor-item.highlighted,
body:not(.home) .ma-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{
  color:var(--ma-brass-dark);
}

body:not(.home) .ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::after{
  background:var(--ma-brass-dark);
}


/* ============================================================
   10. KEYBOARD FOCUS
   Dropdowns must survive tabbing, not just hovering.
   ============================================================ */

.ma-nav .elementor-nav-menu--main .elementor-item:focus-visible,
.ma-nav .elementor-nav-menu--main .elementor-sub-item:focus-visible{
  outline:2px solid var(--ma-brass);
  outline-offset:2px;
}

.ma-nav .elementor-nav-menu--main li:focus-within > .sub-menu{
  display:block !important;
}


/* ============================================================
   11. TIGHTER SPACING ON NARROW LAPTOPS
   Keeps 9 items + logo + button on one line down to ~1150px.
   ============================================================ */

@media (max-width:1360px){
  :root{ --ma-nav-pad-x:9px; }
  .ma-nav .elementor-nav-menu--main .elementor-item{
    font-size:10.5px;
    letter-spacing:.15em;
  }
}


/* ============================================================
   12. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion:reduce){
  .ma-nav .elementor-nav-menu--main .elementor-item,
  .ma-nav .elementor-nav-menu--main .elementor-item::after,
  .ma-nav .elementor-nav-menu--main .sub-arrow,
  .ma-nav .elementor-nav-menu--main .elementor-sub-item{
    transition-duration:.01ms !important;
  }
  .ma-nav .elementor-nav-menu--main .sub-menu{
    animation-duration:.01ms !important;
  }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-8aa5409 *//* ============ BOOK A STAY ============ */

.ma-book-btn .elementor-button{
  font-family:"Jost",sans-serif !important;
  font-size:12px !important;
  font-weight:500 !important;
  letter-spacing:.24em !important;
  text-transform:uppercase !important;
  line-height:1 !important;
  padding:20px 32px !important;

  color:#F7F4EF !important;
  background-color:transparent !important;
  border:1px solid rgba(247,244,239,.45) !important;
  border-radius:0 !important;
  box-shadow:none !important;

  transition:color .45s cubic-bezier(.19,1,.22,1),
             background-color .45s cubic-bezier(.19,1,.22,1),
             border-color .45s cubic-bezier(.19,1,.22,1) !important;
}

.ma-book-btn .elementor-button:hover,
.ma-book-btn .elementor-button:focus-visible{
  color:#1E2621 !important;
  background-color:#A98B5D !important;
  border-color:#A98B5D !important;
}

/* --- Scrolled + inner pages: solid brass --- */
.elementor-sticky--effects .ma-book-btn .elementor-button,
body:not(.home) .ma-book-btn .elementor-button{
  color:#1E2621 !important;
  background-color:#A98B5D !important;
  border-color:#A98B5D !important;
}

.elementor-sticky--effects .ma-book-btn .elementor-button:hover,
.elementor-sticky--effects .ma-book-btn .elementor-button:focus-visible,
body:not(.home) .ma-book-btn .elementor-button:hover,
body:not(.home) .ma-book-btn .elementor-button:focus-visible{
  color:#F7F4EF !important;
  background-color:#1E2621 !important;
  border-color:#1E2621 !important;
}

.ma-book-btn .elementor-button:focus-visible{
  outline:2px solid #A98B5D;
  outline-offset:3px;
}

@media (max-width:1100px){
  .ma-book-btn .elementor-button{
    padding:13px 24px !important;
    font-size:9px !important;
    letter-spacing:.2em !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .ma-book-btn .elementor-button{ transition-duration:.01ms !important; }
}/* End custom CSS */
/* Start custom CSS for icon, class: .elementor-element-2d67712 *//* ============================================================================
   MAISON AURELLE — BURGER + CLOSE MARKS
   Two Elementor Icon widgets, drawn in CSS as 1px hairlines
   ----------------------------------------------------------------------------
   NEEDS:  header Icon widget    → Advanced → CSS Classes → ma-burger
           Off-Canvas Icon widget → Advanced → CSS Classes → ma-close
   WHERE:  Site Settings → Custom CSS
   ----------------------------------------------------------------------------
   WHY NOT AN ICON FONT
   Font Awesome and eicons draw at 2–3px stroke. Next to a 300-weight
   Cormorant wordmark that reads heavy and cheap. These are drawn from
   1px rules instead, so they match the hairline dividers and the brass
   rule under the logo.

   Both marks sit in a 44px box — the touch-target floor — while the
   visible rules stay 26px wide.
   ============================================================================ */


/* ============================================================
   1. SHARED — kill the glyph, keep the box
   ============================================================ */

.ma-burger .elementor-icon,
.ma-close .elementor-icon{
  position:relative;
  display:block;
  width:44px;
  height:44px;
  padding:0 !important;
  background-color:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  -webkit-tap-highlight-color:transparent;
}

.ma-burger .elementor-icon svg,
.ma-burger .elementor-icon i,
.ma-close .elementor-icon svg,
.ma-close .elementor-icon i{
  display:none !important;
}

.ma-burger .elementor-icon::before,
.ma-burger .elementor-icon::after,
.ma-close .elementor-icon::before,
.ma-close .elementor-icon::after{
  content:"";
  position:absolute;
  left:50%;
  width:26px;
  height:1px;
  margin-left:-13px;
  background:currentColor;
}


/* ============================================================
   2. BURGER — three rules
   The middle rule is the icon's own background-image, so only
   two pseudo-elements are needed for the outer two.
   ============================================================ */

.ma-burger .elementor-icon{
  color:#F7F4EF;

  background-image:linear-gradient(currentColor,currentColor) !important;
  background-size:26px 1px !important;
  background-position:center !important;
  background-repeat:no-repeat !important;

  transition:color .5s cubic-bezier(.19,1,.22,1);
}

.ma-burger .elementor-icon::before{ top:15px; }
.ma-burger .elementor-icon::after{ bottom:15px; }

.ma-burger .elementor-icon::before,
.ma-burger .elementor-icon::after{
  transition:transform .45s cubic-bezier(.19,1,.22,1);
}

/* Outer rules ease apart on hover */
@media (hover:hover) and (pointer:fine){
  .ma-burger:hover .elementor-icon{ color:#A98B5D; }
  .ma-burger:hover .elementor-icon::before{ transform:translateY(-2px); }
  .ma-burger:hover .elementor-icon::after{ transform:translateY(2px); }
}

/* Scrolled + inner pages → ink */
.elementor-sticky--effects .ma-burger .elementor-icon,
body:not(.home) .ma-burger .elementor-icon{
  color:#1E2621;
}

@media (hover:hover) and (pointer:fine){
  .elementor-sticky--effects .ma-burger:hover .elementor-icon,
  body:not(.home) .ma-burger:hover .elementor-icon{
    color:#7E6339;
  }
}


/* ============================================================
   3. CLOSE — two rules crossed
   Sits on the alabaster panel, so it starts ink.
   ============================================================ */

.ma-close .elementor-icon{
  color:#1E2621;
  transition:color .35s cubic-bezier(.19,1,.22,1);
}

.ma-close .elementor-icon::before,
.ma-close .elementor-icon::after{
  top:50%;
  margin-top:-.5px;
  transition:transform .5s cubic-bezier(.19,1,.22,1);
}

.ma-close .elementor-icon::before{ transform:rotate(45deg); }
.ma-close .elementor-icon::after{ transform:rotate(-45deg); }

/* The cross turns a quarter on hover */
@media (hover:hover) and (pointer:fine){
  .ma-close:hover .elementor-icon{ color:#7E6339; }
  .ma-close:hover .elementor-icon::before{ transform:rotate(135deg); }
  .ma-close:hover .elementor-icon::after{ transform:rotate(45deg); }
}

.ma-close .elementor-icon:active{ color:#7E6339; }


/* ============================================================
   4. FOCUS
   ============================================================ */

.ma-burger .elementor-icon:focus-visible,
.ma-close .elementor-icon:focus-visible,
.ma-burger a:focus-visible,
.ma-close a:focus-visible{
  outline:2px solid #A98B5D;
  outline-offset:2px;
}


/* ============================================================
   5. SMALL PHONES — tighter box, same rule length
   ============================================================ */

@media (max-width:380px){
  .ma-burger .elementor-icon,
  .ma-close .elementor-icon{
    width:40px;
    height:40px;
  }
  .ma-burger .elementor-icon::before{ top:13px; }
  .ma-burger .elementor-icon::after{ bottom:13px; }
}


/* ============================================================
   6. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion:reduce){
  .ma-burger .elementor-icon,
  .ma-burger .elementor-icon::before,
  .ma-burger .elementor-icon::after,
  .ma-close .elementor-icon,
  .ma-close .elementor-icon::before,
  .ma-close .elementor-icon::after{
    transition-duration:.01ms !important;
  }
}/* End custom CSS */
/* Start custom CSS for nav-menu, class: .elementor-element-a526ed9 *//* ============================================================================
   MAISON AURELLE — MENU INSIDE OFF-CANVAS  (v3)
   Elementor Pro "WordPress Menu" widget placed inside an Off-Canvas widget
   ----------------------------------------------------------------------------
   NEEDS:  the menu widget → Advanced → CSS Classes → ma-nav
           the menu widget → Content → Layout → Dropdown
   WHERE:  Site Settings → Custom CSS
   ----------------------------------------------------------------------------
   The Off-Canvas widget IS the panel. It owns the overlay, the slide-in,
   the close button and the scroll lock. This file styles ONLY the list —
   no position, no background, no height, no z-index. Adding those is what
   buried the close icon and the booking button.
   ============================================================================ */


/* ============================================================
   1. NEUTRALISE THE WIDGET SHELL
   Sit flat inside the Off-Canvas container.
   ============================================================ */

.ma-nav nav.elementor-nav-menu--dropdown{
  position:static !important;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;

  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}


/* ============================================================
   2. LIST + HAIRLINE DIVIDERS
   ============================================================ */

.ma-nav nav.elementor-nav-menu--dropdown .elementor-nav-menu{
  display:block;
  margin:0;
  padding:0;
  border:0;
}

.ma-nav nav.elementor-nav-menu--dropdown .elementor-nav-menu > li{
  display:block;
  border:0;
  border-bottom:1px solid #D9D2C6;
}

.ma-nav nav.elementor-nav-menu--dropdown .elementor-nav-menu > li:last-child{
  border-bottom:0;
}


/* ============================================================
   3. TOP-LEVEL ITEMS — Cormorant, sentence case
   ============================================================ */

.ma-nav nav.elementor-nav-menu--dropdown .elementor-item{
  display:block;
  padding:15px 0 !important;

  font-family:"Cormorant Garamond",Georgia,serif !important;
  font-size:27px !important;
  font-weight:300 !important;
  letter-spacing:0 !important;
  line-height:1.2 !important;
  text-transform:none !important;

  color:#1E2621 !important;
  background:transparent !important;
  border:0 !important;

  transition:color .35s cubic-bezier(.19,1,.22,1);
}

.ma-nav nav.elementor-nav-menu--dropdown .elementor-item:hover,
.ma-nav nav.elementor-nav-menu--dropdown .elementor-item:focus,
.ma-nav nav.elementor-nav-menu--dropdown .elementor-item.elementor-item-active{
  color:#7E6339 !important;
  background:transparent !important;
}

.ma-nav nav.elementor-nav-menu--dropdown .elementor-item::after,
.ma-nav nav.elementor-nav-menu--dropdown .elementor-item::before{
  content:none !important;
}


/* ============================================================
   4. SUBMENUS — always open, no tap needed
   ============================================================ */

.ma-nav nav.elementor-nav-menu--dropdown .sub-arrow{
  display:none !important;
}

.ma-nav nav.elementor-nav-menu--dropdown .sub-menu{
  display:block !important;
  position:static !important;
  height:auto !important;
  width:auto !important;
  min-width:0 !important;

  margin:0 !important;
  padding:0 0 14px 18px !important;

  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  animation:none !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

.ma-nav nav.elementor-nav-menu--dropdown .sub-menu::before{ content:none !important; }

.ma-nav nav.elementor-nav-menu--dropdown .sub-menu li{
  border:0 !important;
}

.ma-nav nav.elementor-nav-menu--dropdown .elementor-sub-item{
  display:block;
  padding:6px 0 !important;

  font-family:"Jost",system-ui,sans-serif !important;
  font-size:11px !important;
  font-weight:500 !important;
  letter-spacing:.16em !important;
  line-height:1.6 !important;
  text-transform:uppercase !important;

  color:#6E7A6B !important;
  background:transparent !important;

  transition:color .3s cubic-bezier(.19,1,.22,1);
}

.ma-nav nav.elementor-nav-menu--dropdown .elementor-sub-item:hover,
.ma-nav nav.elementor-nav-menu--dropdown .elementor-sub-item:focus,
.ma-nav nav.elementor-nav-menu--dropdown .elementor-sub-item.elementor-item-active{
  color:#7E6339 !important;
  background:transparent !important;
}


/* ============================================================
   5. FOCUS
   ============================================================ */

.ma-nav nav.elementor-nav-menu--dropdown .elementor-item:focus-visible,
.ma-nav nav.elementor-nav-menu--dropdown .elementor-sub-item:focus-visible{
  outline:2px solid #A98B5D;
  outline-offset:3px;
}


/* ============================================================================
   6. PHONE
   ============================================================================ */

@media (max-width:600px){
  .ma-nav nav.elementor-nav-menu--dropdown .elementor-item{
    font-size:23px !important;
    padding:12px 0 !important;
  }
  .ma-nav nav.elementor-nav-menu--dropdown .sub-menu{
    padding-left:14px !important;
  }
}


/* ============================================================================
   7. SHORT LANDSCAPE PHONES
   ============================================================================ */

@media (max-height:520px){
  .ma-nav nav.elementor-nav-menu--dropdown .elementor-item{
    font-size:19px !important;
    padding:9px 0 !important;
  }
}


/* ============================================================================
   8. REDUCED MOTION
   ============================================================================ */

@media (prefers-reduced-motion:reduce){
  .ma-nav nav.elementor-nav-menu--dropdown .elementor-item,
  .ma-nav nav.elementor-nav-menu--dropdown .elementor-sub-item{
    transition-duration:.01ms !important;
  }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-0437358 *//* ============================================================================
   MAISON AURELLE — MOBILE BOOKING BUTTON
   Elementor Button widget inside the Off-Canvas panel
   ----------------------------------------------------------------------------
   NEEDS:  Button widget → Advanced → CSS Classes → ma-book-mobile
           Button widget → Content → Alignment → Justified
   WHERE:  Site Settings → Custom CSS
   ============================================================================ */


/* ============================================================
   1. SEPARATION FROM THE MENU LIST
   The menu's last item has no bottom rule, so the hairline
   belongs to the button block instead.
   ============================================================ */

.ma-book-mobile{
  margin-top:26px !important;
  padding-top:26px !important;
  border-top:1px solid #D9D2C6;
}

.ma-book-mobile .elementor-button-wrapper{
  width:100%;
}


/* ============================================================
   2. THE BUTTON
   min-height 52px — comfortably above the 44px touch target
   floor, and it reads as a considered block rather than a chip.
   ============================================================ */

.ma-book-mobile .elementor-button{
  display:flex !important;
  align-items:center;
  justify-content:center;

  width:100% !important;
  min-height:52px;
  padding:17px 24px !important;

  font-family:"Jost",system-ui,sans-serif !important;
  font-size:10px !important;
  font-weight:500 !important;
  letter-spacing:.24em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  text-align:center !important;

  color:#1E2621 !important;
  background-color:#A98B5D !important;
  border:1px solid #A98B5D !important;
  border-radius:0 !important;
  box-shadow:none !important;

  -webkit-tap-highlight-color:transparent;

  transition:color .45s cubic-bezier(.19,1,.22,1),
             background-color .45s cubic-bezier(.19,1,.22,1),
             border-color .45s cubic-bezier(.19,1,.22,1),
             transform .18s cubic-bezier(.19,1,.22,1) !important;
}


/* ============================================================
   3. HOVER — pointer devices only
   ----------------------------------------------------------------
   On a phone, :hover sticks after a tap: the button keeps its
   hover colours until you touch somewhere else. Gating it behind
   (hover:hover) means touch screens never enter that state.
   ============================================================ */

@media (hover:hover) and (pointer:fine){
  .ma-book-mobile .elementor-button:hover{
    color:#F7F4EF !important;
    background-color:#1E2621 !important;
    border-color:#1E2621 !important;
  }
}


/* ============================================================
   4. PRESSED — the feedback touch actually gets
   ============================================================ */

.ma-book-mobile .elementor-button:active{
  color:#F7F4EF !important;
  background-color:#1E2621 !important;
  border-color:#1E2621 !important;
  transform:scale(.985);
}


/* ============================================================
   5. FOCUS
   ============================================================ */

.ma-book-mobile .elementor-button:focus-visible{
  outline:2px solid #1E2621;
  outline-offset:3px;
}


/* ============================================================
   6. SMALL PHONES
   ============================================================ */

@media (max-width:380px){
  .ma-book-mobile .elementor-button{
    font-size:9.5px !important;
    letter-spacing:.2em !important;
    padding:16px 18px !important;
  }
}


/* ============================================================
   7. SHORT LANDSCAPE
   ============================================================ */

@media (max-height:520px){
  .ma-book-mobile{
    margin-top:18px !important;
    padding-top:18px !important;
  }
  .ma-book-mobile .elementor-button{
    min-height:46px;
    padding:14px 24px !important;
  }
}


/* ============================================================
   8. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion:reduce){
  .ma-book-mobile .elementor-button{
    transition-duration:.01ms !important;
  }
  .ma-book-mobile .elementor-button:active{
    transform:none;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3d9dfc9 *//* ============================================================================
   MAISON AURELLE — HEADER STATES  v2
   ----------------------------------------------------------------------------
   REPLACES every earlier header background/colour block, including v1.

   WHY NOT elementor-sticky--effects
   In this install Elementor puts that class on the container at scroll 0,
   even with sticky_effects_offset set to 60 — the DOM shows it sitting
   there alongside elementor-sticky--active before any scrolling. So the
   scrolled state is driven by our own body.ma-scrolled class instead,
   added by the snippet in Elementor → Custom Code (Body – End).

   Elementor's Sticky stays ON: it supplies position:fixed and the spacer
   that stops the page jumping. Only its --effects class is ignored.

   Three states, mutually exclusive, order in the file does not matter:
     A  home, not scrolled ....... transparent, alabaster text
     B  inner page, not scrolled . alabaster bar, ink text
     C  scrolled, any page ....... #1E2621 bar, alabaster text

   NEEDS
     header container → CSS Classes  ma-header
     header container → Style → Background → Type: None
     header container → Motion Effects → Sticky: Top
     the Custom Code snippet
   ============================================================================ */


/* ============================================================
   BASE
   ============================================================ */

.ma-header{
  transition:background-color .5s cubic-bezier(.19,1,.22,1),
             padding .5s cubic-bezier(.19,1,.22,1),
             box-shadow .5s cubic-bezier(.19,1,.22,1);
}

.ma-header .ma-logo,
.ma-header .ma-logo *,
.ma-header .ma-nav .elementor-nav-menu--main .elementor-item,
.ma-header .ma-lang,
.ma-header .ma-lang .elementor-icon-box-title,
.ma-header .ma-burger .elementor-icon,
.ma-header .ma-book-btn .elementor-button{
  transition:color .5s cubic-bezier(.19,1,.22,1),
             background-color .45s cubic-bezier(.19,1,.22,1),
             border-color .45s cubic-bezier(.19,1,.22,1);
}


/* ============================================================
   B — INNER PAGE, NOT SCROLLED   (also the fallback)
   Unqualified by page, so a missing .home body class leaves a
   legible bar rather than an invisible one.
   ============================================================ */

body:not(.ma-scrolled) .ma-header{
  background-color:rgba(247,244,239,.96) !important;
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 1px 0 rgba(217,210,198,.9) !important;
}

body:not(.ma-scrolled) .ma-header .ma-logo,
body:not(.ma-scrolled) .ma-header .ma-logo *,
body:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main .elementor-item,
body:not(.ma-scrolled) .ma-header .ma-lang,
body:not(.ma-scrolled) .ma-header .ma-lang .elementor-icon-box-title,
body:not(.ma-scrolled) .ma-header .ma-burger .elementor-icon{
  color:#3C4742 !important;
  fill:#3C4742 !important;
}

body:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main .elementor-item:hover,
body:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{
  color:#7E6339 !important;
}

body:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::after{
  background:#7E6339 !important;
}

body:not(.ma-scrolled) .ma-header .ma-book-btn .elementor-button{
  color:#1E2621 !important;
  background-color:#A98B5D !important;
  border-color:#A98B5D !important;
}
body:not(.ma-scrolled) .ma-header .ma-book-btn .elementor-button:hover{
  color:#A98B5D !important;
  background-color:transparent !important;
  border-color:#A98B5D !important;
}


/* ============================================================
   A — HOME, NOT SCROLLED
   ============================================================ */

body.home:not(.ma-scrolled) .ma-header{
  background-color:transparent !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  box-shadow:none !important;
}

body.home:not(.ma-scrolled) .ma-header .ma-logo,
body.home:not(.ma-scrolled) .ma-header .ma-logo *,
body.home:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main .elementor-item,
body.home:not(.ma-scrolled) .ma-header .ma-lang,
body.home:not(.ma-scrolled) .ma-header .ma-lang .elementor-icon-box-title,
body.home:not(.ma-scrolled) .ma-header .ma-burger .elementor-icon{
  color:#F7F4EF !important;
  fill:#F7F4EF !important;
}

body.home:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main .elementor-item:hover,
body.home:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{
  color:#A98B5D !important;
}

body.home:not(.ma-scrolled) .ma-header .ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::after{
  background:#A98B5D !important;
}

body.home:not(.ma-scrolled) .ma-header .ma-book-btn .elementor-button{
  color:#F7F4EF !important;
  background-color:transparent !important;
  border-color:rgba(247,244,239,.45) !important;
}
body.home:not(.ma-scrolled) .ma-header .ma-book-btn .elementor-button:hover{
  color:#1E2621 !important;
  background-color:#A98B5D !important;
  border-color:#A98B5D !important;
}


/* ============================================================
   C — SCROLLED, ANY PAGE
   ============================================================ */

body.ma-scrolled .ma-header{
  background-color:#1E2621 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  box-shadow:0 1px 0 rgba(169,139,93,.28) !important;
}

body.ma-scrolled .ma-header .ma-logo,
body.ma-scrolled .ma-header .ma-logo *,
body.ma-scrolled .ma-header .ma-nav .elementor-nav-menu--main .elementor-item,
body.ma-scrolled .ma-header .ma-lang,
body.ma-scrolled .ma-header .ma-lang .elementor-icon-box-title,
body.ma-scrolled .ma-header .ma-burger .elementor-icon{
  color:#F7F4EF !important;
  fill:#F7F4EF !important;
}

body.ma-scrolled .ma-header .ma-nav .elementor-nav-menu--main .elementor-item:hover,
body.ma-scrolled .ma-header .ma-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{
  color:#A98B5D !important;
}

body.ma-scrolled .ma-header .ma-nav .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::after{
  background:#A98B5D !important;
}

body.ma-scrolled .ma-header .ma-book-btn .elementor-button{
  color:#1E2621 !important;
  background-color:#A98B5D !important;
  border-color:#A98B5D !important;
}
body.ma-scrolled .ma-header .ma-book-btn .elementor-button:hover{
  color:#A98B5D !important;
  background-color:transparent !important;
  border-color:#A98B5D !important;
}


/* ============================================================
   STICKY SPACER
   Elementor clones the container to hold its place in the flow.
   The clone carries ma-header as well, so it is neutralised here
   in case anything ever makes it visible.
   ============================================================ */

.elementor-sticky__spacer,
.elementor-sticky__spacer.ma-header{
  background:none !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion:reduce){
  .ma-header,
  .ma-header *{
    transition-duration:.01ms !important;
  }
}/* End custom CSS */