/* ==========================================================================
   Escape Luxury Lodge — styles for the native Elementor Header and Home page.
   Each class here is added in Elementor under Advanced → CSS Classes.
   Colours and fonts come from Site Settings (global colours / global fonts).
   ========================================================================== */

/* ---- general ---- */
.elementor-widget-text-editor .hero-badge,.ell-tc-body .elementor-widget-text-editor p:last-child,.ell-card .elementor-widget-text-editor p:last-child{margin-bottom:0}
.ell-push{margin-top:auto!important;padding-top:8px}
.ell-hero .hero-badge{color:var(--white)}
.elementor-widget-heading .elementor-heading-title a{color:inherit}
.elementor-widget-image img{display:inline-block}
.e-con.ell-media{position:relative;overflow:hidden}

/* Amsterdam script titles need head-room for their tall capitals */
.ell-h2 .elementor-heading-title{padding:.85em 0 .28em}
.ell-shead-h2{margin-top:-.3em}
.ell-lhead-h2{margin-top:.15em}
.ell-faq-h2{margin-top:.55em}
.ell-banner-h2 .elementor-heading-title{padding-top:.6em}
.ell-cta-h2{margin-top:.1em}

/* image ratios (Image widget → Advanced → CSS Classes) */
.ell-ratio{overflow:hidden;background:var(--sand)}
.ell-ratio img{width:100%!important;height:100%!important;object-fit:cover;display:block;transition:transform 1.2s var(--ease)}
.ell-ratio a{display:block}
.ell-ratio-2-1 img{aspect-ratio:2/1}
.ell-ratio-3-2 img{aspect-ratio:3/2}
.ell-ratio-4-3 img,.ell-ratio-4-3 .ph{aspect-ratio:4/3}
.ell-ratio-6-5 img,.ell-ratio-6-5 .ph{aspect-ratio:6/5;min-height:0}
.ell-thumb img{width:100%;aspect-ratio:2.7/1;object-fit:cover;transition:opacity .25s}
.ell-thumb a:hover img{opacity:.82}
.ell-tent-card:hover .ell-ratio-2-1 img,.ell-card:hover .ell-ratio img,.ell-xp:hover .ell-ratio img,.ell-ratio-4-3 a:hover img{transform:scale(1.035)}

/* ---- Header (topbar + transparent bar that turns cream on scroll) ---- */
.ell-topbar{position:relative;z-index:51}
.ell-topbar .tb-info{display:flex;gap:26px;flex-wrap:wrap;letter-spacing:.08em}
.ell-topbar a:hover{text-decoration:underline;text-underline-offset:3px}
.ell-social .elementor-social-icon{background:transparent!important;opacity:.9}
.ell-social .elementor-social-icon:hover{opacity:1}
.ell-social .elementor-social-icon i{color:var(--cream)!important}
.ell-social .elementor-social-icon svg{fill:var(--cream)!important}

.elementor-location-header .e-con.ell-header{position:absolute;left:0;right:0;top:38px;z-index:50;color:var(--white);background:transparent;
  transition:background .4s var(--ease),color .4s var(--ease),box-shadow .4s,top .3s}
.admin-bar .elementor-location-header .e-con.ell-header{top:70px}
.elementor-location-header .e-con.ell-header.is-solid{position:fixed;top:0;background:rgba(252,247,235,.97);color:var(--brown);
  box-shadow:0 1px 0 var(--line),0 12px 30px rgba(40,22,10,.06);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.admin-bar .elementor-location-header .e-con.ell-header.is-solid{top:32px}
@media (max-width:782px){.admin-bar .elementor-location-header .e-con.ell-header{top:84px}.admin-bar .elementor-location-header .e-con.ell-header.is-solid{top:46px}}
@media (max-width:600px){.admin-bar .elementor-location-header .e-con.ell-header.is-solid{top:0}}
.ell-header > .e-con-inner{transition:min-height .3s var(--ease)}
.elementor-location-header .e-con.ell-header.is-solid{--min-height:74px}
.ell-header.is-solid > .e-con-inner{min-height:74px}
.ell-header .ell-brand{position:relative;flex:none}
.ell-header .ell-brand img{width:clamp(96px,7vw,128px)!important;transition:width .3s var(--ease),opacity .3s}
.ell-header.is-solid .ell-brand img{width:clamp(84px,5.6vw,100px)!important}
.ell-header .ell-brand .logo-dark{position:absolute;left:0;top:0;opacity:0}
.ell-header.is-solid .ell-brand .logo-light img{opacity:0}
.ell-header.is-solid .ell-brand .logo-dark{opacity:1}

/* menu over the photo = white; solid bar = brown */
.ell-nav .elementor-nav-menu--main .elementor-item,.ell-nav .elementor-nav-menu--main .elementor-item:hover,
.ell-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{color:inherit!important}
.ell-nav .elementor-nav-menu--main{justify-content:center}
.ell-nav .elementor-nav-menu--main .elementor-nav-menu{justify-content:center}
.ell-nav .elementor-nav-menu--main .elementor-item:after{background-color:var(--gold)!important;height:1px!important}
.ell-nav .elementor-nav-menu--dropdown.elementor-nav-menu__container{border-top:1px solid var(--gold);box-shadow:0 18px 40px rgba(40,22,10,.12)}
.ell-nav .elementor-nav-menu--main .sub-menu{border-top:1px solid var(--gold);box-shadow:0 18px 40px rgba(40,22,10,.12);padding:12px 0;min-width:220px}
.ell-nav .elementor-nav-menu--main .sub-menu a{padding:10px 26px!important;letter-spacing:.04em}
.ell-nav .elementor-menu-toggle{color:inherit!important;background:transparent!important;font-size:26px}
.ell-nav .elementor-menu-toggle svg{fill:currentColor}
.ell-nav .elementor-nav-menu--dropdown{background:var(--cream)}
.ell-nav .elementor-nav-menu--dropdown a{font-family:var(--f-serif)!important;font-style:italic;font-size:21px!important;color:var(--brown)!important;justify-content:center;padding:12px 24px!important}
.ell-nav .elementor-nav-menu--dropdown .sub-menu a{font-family:var(--f-body)!important;font-style:normal;font-size:15px!important;color:var(--brown-soft)!important;border-left:0!important}
.ell-nav .elementor-nav-menu--dropdown a:hover,.ell-nav .elementor-nav-menu--dropdown a.elementor-item-active{background:var(--sand)!important}
.ell-nav .elementor-nav-menu--main .elementor-nav-menu > li{margin:0!important}
.ell-nav .elementor-nav-menu--main .elementor-nav-menu > li > .elementor-item{margin:0 clamp(9px,1vw,20px)!important}
@media (max-width:1560px) and (min-width:1281px){.ell-nav .elementor-nav-menu--main .elementor-nav-menu > li > .elementor-item{margin:0 9px!important;font-size:14px!important}}

.ell-header-cta .elementor-button{display:inline-flex;align-items:center;min-height:44px;padding:10px 24px!important;background:transparent!important;border:1px solid rgba(255,255,255,.75)!important;color:var(--white)!important;
  transition:background .25s,color .25s,border-color .25s}
.ell-header-cta .elementor-button:hover{background:var(--white)!important;color:var(--brown)!important;border-color:var(--white)!important}
.ell-header.is-solid .ell-header-cta .elementor-button{background:var(--brown)!important;border-color:var(--brown)!important;color:var(--cream)!important}
.ell-header.is-solid .ell-header-cta .elementor-button:hover{background:var(--brown-dk)!important}
.ell-header:after{content:"";position:absolute;left:var(--gutter);right:var(--gutter);bottom:0;height:1px;background:rgba(255,255,255,.22);transition:opacity .3s}
.ell-header.is-solid:after{opacity:0}

/* ---- Home: hero ---- */
.e-con.ell-hero{isolation:isolate}
.e-con.ell-hero:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(30,16,6,.55) 0%,rgba(30,16,6,.12) 32%,rgba(30,16,6,.08) 52%,rgba(30,16,6,.6) 100%)}
.ell-hero > .e-con{position:relative;z-index:1}
.ell-hero-title .elementor-heading-title{margin-left:-.02em}
.ell-hero-name{display:block;font-family:var(--f-serif);font-weight:700;font-size:clamp(34px,3.4vw,64px);line-height:1.05;letter-spacing:.02em;margin-top:.22em}
@media (max-width:720px){.ell-hero-name{margin-top:.55em}}
.ell-booking{position:relative;z-index:5}

/* ---- Home: tent cards ---- */
.ell-tent-card{min-width:0}
.ell-tc-foot{margin-top:auto}
.ell-tc-link .elementor-button{padding:12px 0!important;background:transparent!important;border:0!important}
.ell-tc-link .elementor-button-icon{transition:transform .3s var(--ease)}
.ell-tent-card:hover .ell-tc-link .elementor-button-icon{transform:translateX(4px)}

/* ---- Home: experience tiles ---- */
.ell-xp{color:inherit;min-width:0}
.ell-xp .ph{height:100%}
.ell-xp-body{position:relative;padding-right:64px!important}
.ell-xp-body:after{content:"";position:absolute;right:clamp(24px,2.4vw,44px);bottom:clamp(30px,2.6vw,40px);width:24px;height:24px;background:var(--brown);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .3s var(--ease)}
.ell-xp:hover .ell-xp-body:after{transform:translateX(5px)}
.ell-xp:hover .elementor-heading-title{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:6px;text-decoration-thickness:1px}
.ell-xp-text p{max-width:290px;line-height:1.6}

/* ---- Home: banner ---- */
.e-con.ell-banner{isolation:isolate}
.e-con.ell-banner:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(30,16,6,0) 40%,rgba(30,16,6,.5) 100%)}
.ell-banner > .e-con{position:relative;z-index:1}
@media (max-width:720px){.ell-banner-h2 .elementor-heading-title{font-size:34px!important;line-height:1.45!important}}

/* ---- Home: CTA band ---- */
.e-con > .ell-cta-bar{width:100%;max-width:1180px}
.ell-cta-bar .booking-bar{margin:0 auto}
.ell-cta-intro p{color:rgba(252,247,235,.9)}
.ell-contact-line p,.ell-contact-line a{color:rgba(252,247,235,.88)}
.ell-contact-line a{border-bottom:1px solid rgba(252,247,235,.5)}

/* gold text links */
.e-con .more{display:inline-flex;align-items:center;gap:12px;font-size:var(--fs-btn);letter-spacing:var(--ls-btn);text-transform:uppercase;color:var(--brown);padding:12px 0}

/* Nav Menu: collapse to the burger at ≤1280px (Elementor Pro only ships mobile/tablet rules) */
@media (max-width:1280px){
  .ell-nav.elementor-nav-menu--dropdown-laptop .elementor-nav-menu--main{display:none!important}
  .ell-nav.elementor-nav-menu--dropdown-laptop .elementor-menu-toggle{display:flex!important}
}
@media (min-width:1281px){
  .ell-nav.elementor-nav-menu--dropdown-laptop .elementor-menu-toggle,
  .ell-nav.elementor-nav-menu--dropdown-laptop .elementor-nav-menu--dropdown{display:none!important}
}
.ell-header .ell-nav{flex:1 1 0%!important;min-width:0}
.ell-header-cta{flex:none}
.ell-faq-copy{max-width:820px;margin-left:auto}
@media (max-width:1024px){.ell-faq-copy{max-width:none}}