/* ===========================================================
   KAMELIA HOTEL · v2 — Cycladic Luxury (Enalion-inspired)
   Warm linen + clay + muted Aegean · GFS Didot + Commissioner
   =========================================================== */

:root{
  --bg:#F7F2EA;        /* warm linen */
  --surface:#EFE7D8;   /* sand */
  --surface-deep:#E3D8C5;
  --ink:#2A2620;       /* warm charcoal */
  --muted:#8C8373;     /* taupe */
  --line:rgba(42,38,32,.14);
  --clay:#B0825C;      /* warm accent */
  --clay-deep:#946a45;
  --sea:#2F5A57;       /* muted Aegean */
  --sea-deep:#244946;
  --serif:"GFS Didot", Georgia, serif;
  --sans:"Commissioner", system-ui, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-weight:300; font-size:16px; line-height:1.7;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

/* ---- type ---- */
h1,h2,h3,h4{ font-family:var(--serif); font-weight:400; line-height:1.1; letter-spacing:.01em; }
h1{ font-size:clamp(1.8rem, 4.5vw, 3.2rem); }
h2{ font-size:clamp(1.6rem, 4vw, 2.5rem); }
h3{ font-size:clamp(1.35rem, 2.6vw, 1.85rem); }
p{ text-wrap:pretty; }
.eyebrow{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.34em; text-transform:uppercase; color:var(--clay);
}
.eyebrow.sea{ color:var(--sea); }
.eyebrow.light{ color:rgba(255,255,255,.82); }
.lead{ font-size:clamp(1.05rem,1.5vw,1.22rem); line-height:1.8; font-weight:300;
  color:color-mix(in oklab,var(--ink) 88%, transparent); }

/* ---- layout ---- */
.wrap{ width:min(100%,1920px); margin-inline:auto; padding-inline:clamp(1.2rem, 4vw, 3rem); }
.wrap-narrow{ width:min(90%,860px); margin-inline:auto; }
.section{ padding-block:clamp(3.5rem,8vw,8rem); }
.center{ text-align:center; }
.rule{ width:54px; height:1px; background:var(--clay); border:0; margin:1.6rem auto; }
.rule.left{ margin-inline:0; }

/* reveal */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); transition-delay:var(--kam-delay,0ms); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1 !important; transform:none !important; transition-delay:0ms !important; } }

/* ---- buttons ---- */
.btn{ display:inline-flex; align-items:center; gap:.7em; cursor:pointer;
  font-family:var(--sans); font-size:.72rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  padding:1.05em 2.2em; border:1px solid var(--ink); background:transparent; color:var(--ink);
  transition:background .45s ease, color .45s ease, border-color .45s ease; }
.btn:hover{ background:var(--ink); color:var(--bg); }
.btn.sea{ border-color:var(--sea); background:var(--sea); color:#fff; }
.btn.sea:hover{ background:var(--sea-deep); border-color:var(--sea-deep); }
.btn.clay{ border-color:var(--clay); background:var(--clay); color:#fff; }
.btn.clay:hover{ background:var(--clay-deep); border-color:var(--clay-deep); }
.btn.light{ border-color:rgba(255,255,255,.65); color:#fff; }
.btn.light:hover{ background:#fff; color:var(--ink); border-color:#fff; }
.tlink{ font-size:.72rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:var(--clay); display:inline-flex; align-items:center; gap:.6em; transition:gap .35s, color .35s; }
.tlink:hover{ gap:1em; color:var(--clay-deep); }

/* image fade-in */
.imgfade{ opacity:0; transition:opacity 1s ease; }
.imgfade.loaded{ opacity:1; }

/* =====================  TOP BAR  ===================== */
.bar{ position:fixed; inset:0 0 auto 0; z-index:90; display:flex; align-items:center; justify-content:space-between;
  padding:1.6rem clamp(1.2rem,4vw,3rem); color:#fff; transition:background .5s, color .5s, padding .5s, box-shadow .5s; height: 150px;}
.bar.solid{ background:color-mix(in oklab,var(--bg) 92%, transparent); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  color:var(--ink); padding-block:1.05rem; box-shadow:0 1px 0 var(--line); height: 120px;padding-top: 40px;}
/* WordPress admin bar offset — desktop 32px, mobile 46px */
.admin-bar .bar { top:32px; }
.admin-bar .menu { top:32px; }
@media screen and (max-width:782px){
  .admin-bar .bar { top:46px; }
  .admin-bar .menu { top:46px; }
}
.bar__logo{ font-family:var(--serif); font-size:1.7rem; letter-spacing:.16em; line-height:1; }
.bar__logo small{ display:block; font-family:var(--sans); font-size:.5rem; font-weight:500; letter-spacing:.5em; opacity:.75; margin-top:3px; padding-left:.18em; }
.bar__right{ display:flex; align-items:center; gap:clamp(1rem,2.4vw,2rem); }
.bar__email{ font-size:.78rem; letter-spacing:.04em; opacity:.92; }
.bar__lang{ display:flex; align-items:center; gap:.45rem; font-size:.72rem; letter-spacing:.1em; }
.bar__lang button,.bar__lang a{ background:none; border:0; color:inherit; cursor:pointer; font:inherit; font-size:.72rem; letter-spacing:.1em; opacity:.5; padding:2px; text-decoration:none; }
.bar__lang button.active,.bar__lang a.active{ opacity:1; font-weight:600; }
.bar__lang span{ opacity:.4; }
.bar__book{ font-size:.72rem; font-weight:500; letter-spacing:.18em; text-transform:uppercase; border:1px solid currentColor; padding:.7em 1.3em; transition:background .4s, color .4s; }
.bar.solid .bar__book:hover{ background:var(--sea); border-color:var(--sea); color:#fff; }
.bar:not(.solid) .bar__book:hover{ background:#fff; color:var(--ink); }
.menu-toggle{ display:flex; align-items:center; gap:.7rem; background:none; border:0; color:inherit; cursor:pointer;
  font-family:var(--sans); font-size:.72rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase; padding:6px 0; }
.menu-toggle .bars{ display:flex; flex-direction:column; gap:4px; }
.menu-toggle .bars span{ width:24px; height:1.5px; background:currentColor; transition:.3s; }

/* full-screen menu */
.menu{ position:fixed; inset:0; z-index:120; background:var(--sea-deep); color:#fff;
  display:grid; grid-template-columns:1.1fr .9fr; opacity:0; pointer-events:none; transition:opacity .5s ease; }
.menu.open{ opacity:1; pointer-events:auto; }
.menu__close{ position:absolute; top:2.6rem; right:clamp(1.2rem,4vw,3rem); z-index:2; background:none; border:0; color:#fff; cursor:pointer;
  font-family:var(--sans); font-size:.72rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase; display:flex; align-items:center; gap:.6rem; }
.menu__close .x{ font-size:1.4rem; line-height:1; }
.menu__nav{ display:flex; flex-direction:column; justify-content:center; padding:clamp(2rem,6vw,5rem); gap:.2rem;overflow-y: hidden!important; }
.menu__nav a{ font-family:var(--serif); font-size:clamp(1rem,2.4vw,2.4rem); line-height:1.45; opacity:.62; transition:opacity .35s, padding-left .4s; width:max-content; }
.menu__nav a:hover{ opacity:1; padding-left:.5rem; }
.menu__nav a .n{ font-family:var(--sans); font-size:.6rem; font-weight:500; letter-spacing:.2em; vertical-align:super; opacity:.6; margin-right:.6rem; }
.menu__aside{ position:relative; overflow:hidden; }
.menu__aside img{ width:100%; height:100%; object-fit:cover;margin-top:0; }
.menu__aside .cap{ position:absolute; left:0; right:0; bottom:0; padding:2rem; background:linear-gradient(transparent, rgba(20,30,28,.7));
  font-size:.78rem; letter-spacing:.04em; }
.menu__contact{ margin-top:2.5rem; font-size:.82rem; letter-spacing:.04em; opacity:.8; line-height:2; }

/* =====================  HERO  ===================== */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; overflow:hidden; }
.hero__slides{ position:absolute; inset:0; z-index:0; }
.hero__slides .s{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.6s ease; transform:scale(1.06); }
.hero__slides .s.active{ opacity:1; animation:kenburns 8s ease-out forwards; }
@keyframes kenburns{ from{ transform:scale(1.1); } to{ transform:scale(1.0); } }
.hero__veil{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(20,28,26,.45), rgba(20,28,26,.28) 40%, rgba(20,28,26,.55)); }
.hero__inner{ position:relative; z-index:2; padding:0 1.4rem; max-width:1000px; }
.hero__inner .eyebrow{ display:block; margin-bottom:1.6rem; }
.hero h1{ font-weight:400; }
.hero__tag{ margin-top:1.8rem; font-family:var(--serif); font-style:italic; font-size:clamp(1.15rem,2vw,1.6rem); color:rgba(255,255,255,.92); }
.hero__sub{ margin:1.4rem auto 0; max-width:54ch; font-size:1.05rem; font-weight:300; color:rgba(255,255,255,.88); }
.hero__actions{ margin-top:2.6rem; display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.hero__dots{ position:absolute; z-index:3; bottom:2rem; left:50%; transform:translateX(-50%); display:flex; gap:10px; }
.hero__dots button{ width:8px; height:8px; border-radius:50%; border:1px solid rgba(255,255,255,.8); background:transparent; cursor:pointer; padding:0; transition:.3s; }
.hero__dots button.active{ background:#fff; }

/* hero text entrance — children stagger in on page load */
@keyframes kamelia-rise{
  from{ opacity:0; transform:translateY(24px); }
  to  { opacity:1; transform:none; }
}
.hero__inner > *{ animation:kamelia-rise .85s cubic-bezier(.16,1,.3,1) both; }
.hero__inner > :nth-child(1){ animation-delay:.28s; }
.hero__inner > :nth-child(2){ animation-delay:.46s; }
.hero__inner > :nth-child(3){ animation-delay:.62s; }
.hero__inner > :nth-child(4){ animation-delay:.76s; }
.hero__inner > :nth-child(5){ animation-delay:.88s; }
@media (prefers-reduced-motion:reduce){ .hero__inner > *{ animation:none; } }

/* experience parallax — JS sets transform directly on .experience__bg */
.experience__bg{ will-change:transform; }

/* =====================  ABOUT  ===================== */
.about__intro{ text-align:center; max-width:64ch; margin-inline:auto; }
.about__intro .eyebrow{ display:block; margin-bottom:1.5rem; }
.about__intro h2{ margin-bottom:1.2rem; }
.about__pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(2rem,5vw,4rem); margin-top:clamp(3.5rem,7vw,6rem); }
.pillar{ text-align:center; }
.pillar .mk{ width:44px; height:44px; margin:0 auto 1.4rem; border:1px solid var(--clay); border-radius:50%; display:grid; place-items:center; color:var(--clay); }
.pillar h3{ font-size:1.4rem; margin-bottom:.7rem; }
.pillar p{ font-size:.96rem; color:color-mix(in oklab,var(--ink) 80%, transparent); }
.about__media{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(.8rem,1.6vw,1.4rem); margin-top:clamp(4rem,8vw,7rem); }
.about__media .m1{ grid-column:1/7; aspect-ratio:4/3; }
.about__media .m2{ grid-column:7/10; aspect-ratio:3/4; align-self:end; }
.about__media .m3{ grid-column:10/13; aspect-ratio:3/4; }
.about__media .mph{ overflow:hidden; background:var(--surface); }
.about__media .mph img{ width:100%; height:100%; object-fit:cover; }

/* facilities strip */
.facilities{ background:var(--surface); }
.facilities__head{ text-align:center; max-width:50ch; margin:0 auto clamp(3rem,6vw,4.5rem); }
.facilities__head .eyebrow{ display:block; margin-bottom:1.2rem; }
.facilities__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.facility{ background:var(--surface); padding:clamp(1.8rem,3vw,2.6rem) clamp(1.2rem,2vw,1.8rem); text-align:center; }
.facility .ic{ height:30px; margin-bottom:1.1rem; color:var(--sea); display:flex; justify-content:center; }
.facility .ic svg{ width:250px;}
.facility h4{ font-family:var(--sans); font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); }
.facility p{ font-size:.86rem; color:var(--muted); margin-top:.4rem; }

/* =====================  ACCOMMODATION  ===================== */
.rooms__intro{ text-align:center; max-width:60ch; margin:0 auto clamp(4rem,8vw,6.5rem); }
.rooms__intro .eyebrow{ display:block; margin-bottom:1.5rem; }
.rooms__intro h2{ margin-bottom:1.2rem; }
.room-rows{ display:flex; flex-direction:column; gap:clamp(4.5rem,9vw,8rem); }
.room-row{ display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2.5rem,5vw,5rem); align-items:center; }
.room-row:nth-child(even){ grid-template-columns:.85fr 1.15fr; }
.room-row:nth-child(even) .room-row__media{ order:2; }
.room-row__media{ position:relative; overflow:hidden; }
.room-row__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.room-row__media .tag{ position:absolute; top:1.2rem; left:1.2rem; background:var(--bg); color:var(--ink);
  font-size:.64rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; padding:.55em 1em; }
.room-row__body .num{ font-family:var(--serif); font-size:1rem; color:var(--clay); letter-spacing:.1em; }
.room-row__body h3{ margin:.6rem 0 1.2rem; font-size:clamp(1.8rem,3.2vw,2.7rem); }
.room-row__body p{ color:color-mix(in oklab,var(--ink) 80%, transparent); margin-bottom:1.6rem; }
.room-row__specs{ display:flex; flex-wrap:wrap; gap:.5rem .5rem; margin-bottom:2rem; }
.room-row__specs span{ font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
  border:1px solid var(--line); padding:.5em 1em; }
.room-row__foot{ display:flex; align-items:center; gap:1.8rem; }
.room-row__foot .price{ font-family:var(--serif); font-size:1.5rem; color:var(--sea); }
.room-row__foot .price small{ font-family:var(--sans); font-size:.62rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }

/* ---- room photo slider ---- */
.room-slider{ position:relative; overflow:hidden; aspect-ratio:4/3; background:var(--surface); }

/* Override the generic .room-row__media img rule for slider images */
.room-slider img{ width:100%; height:100%; aspect-ratio:unset; object-fit:cover; display:block; }

.room-slider__slide{
  position:absolute; inset:0;
  opacity:0;
  transition:opacity .6s ease;
}
.room-slider__slide.is-active{ opacity:1; }

/* Arrows — hidden until hover */
.room-slider__btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:38px; height:52px;
  background:rgba(20,28,26,.32);
  border:none; cursor:pointer; padding:0;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .3s ease, background .3s ease;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.room-slider:hover .room-slider__btn{ opacity:1; }
.room-slider__btn:hover{ background:rgba(20,28,26,.58); }
.room-slider__btn--prev{ left:0; }
.room-slider__btn--next{ right:0; }

/* CSS chevron arrows — no font dependency */
.room-slider__btn::before{
  content:'';
  display:block;
  width:9px; height:9px;
  border-color:#fff;
  border-style:solid;
}
.room-slider__btn--prev::before{
  border-width:0 0 1.5px 1.5px;
  transform:rotate(45deg) translate(2px,-2px);
}
.room-slider__btn--next::before{
  border-width:1.5px 1.5px 0 0;
  transform:rotate(45deg) translate(-2px,2px);
}

/* Counter: "1 / n" bottom-right */
.room-slider__count{
  position:absolute; bottom:.85rem; right:.9rem; z-index:2;
  font-family:var(--sans); font-size:.6rem; font-weight:500;
  letter-spacing:.14em; color:rgba(255,255,255,.92);
  background:rgba(20,28,26,.38);
  padding:.28em .65em;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  pointer-events:none;
}

/* Tag badge: ensure it layers above slides */
.room-slider .tag{ z-index:2; }

/* =====================  LOCATION  ===================== */
.location{ background:var(--sea); color:#fff; }
.location__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,6vw,5.5rem); align-items:center; }
.location__copy .eyebrow{ display:block; margin-bottom:1.4rem; }
.location__copy h2{ margin-bottom:1.6rem; }
.location__copy p{ color:rgba(255,255,255,.85); }
.location__list{ list-style:none; margin-top:2.2rem; }
.location__list li{ display:flex; gap:1rem; padding:1.05rem 0; border-top:1px solid rgba(255,255,255,.18); align-items:baseline; }
.location__list li:last-child{ border-bottom:1px solid rgba(255,255,255,.18); }
.location__list .d{ font-family:var(--serif); color:var(--clay); font-size:1.1rem; min-width:3.4rem; }
.location__discover{ margin-top:2.4rem; }
.location__discover .eyebrow{ color:rgba(255,255,255,.7); }
.location__media{ display:grid; grid-template-rows:1.3fr 1fr; gap:clamp(.8rem,1.6vw,1.2rem); height:100%; }
.location__media .lph{ overflow:hidden; background:var(--sea-deep); }
.location__media .lph img{ width:100%; height:100%; object-fit:cover; }

@media (min-width: 1024px) {
  .location__grid {
    align-items: start;
  }
  .location__copy {
    position: -webkit-sticky;
    position: sticky;
    top: 150px;
    align-self: start;
  }
  .location__media {
    display: flex;
    flex-direction: column;
    gap: clamp(1rem, 2vw, 2rem);
    height: auto;
  }
  .location__media .lph {
    height: auto;
    aspect-ratio: 4/3;
  }
}

/* =====================  EXPERIENCE (full-bleed)  ===================== */
.experience{ position:relative; min-height:78svh; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; overflow:hidden; }
.experience__bg{ position:absolute; inset:0; z-index:0; background-size:cover; background-position:center; }
.experience__veil{ position:absolute; inset:0; z-index:1; background:rgba(20,28,26,.5); }
.experience__inner{ position:relative; z-index:2; max-width:760px; padding:4rem 1.4rem; }
.experience .eyebrow{ display:block; margin-bottom:1.5rem; }
.experience h2{ margin-bottom:1.6rem; }
.experience p{ font-size:1.1rem; font-weight:300; color:rgba(255,255,255,.9); line-height:1.9; }

/* =====================  REVIEWS  ===================== */
.reviews{ background:var(--surface); text-align:center; }
.reviews .eyebrow{ display:block; margin-bottom:2rem; }
.reviews__stars{ color:var(--clay); letter-spacing:.3em; font-size:1rem; margin-bottom:1.6rem; }
.review-q{ font-family:var(--serif); font-size:clamp(1.7rem,3.4vw,2.7rem); line-height:1.35; max-width:44ch; margin:0 auto; font-style:italic; }
.review-attr{ margin-top:2rem; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.review-attr strong{ color:var(--ink); font-weight:600; }
.reviews__nav{ display:flex; justify-content:center; gap:.6rem; margin-top:2.8rem; }
.reviews__nav button{ width:9px; height:9px; border-radius:50%; border:1px solid var(--muted); background:transparent; cursor:pointer; padding:0; transition:.3s; }
.reviews__nav button.active{ background:var(--sea); border-color:var(--sea); }
.reviews__sources{ display:flex; justify-content:center; gap:clamp(2rem,5vw,4rem); margin-top:3rem; flex-wrap:wrap; }
.reviews__sources .score{ font-family:var(--serif); font-size:1.9rem; color:var(--sea); }
.reviews__sources .l{ font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }

/* =====================  GALLERY  ===================== */
.gallery__head{ text-align:center; max-width:50ch; margin:0 auto clamp(3rem,6vw,4.5rem); }
.gallery__head .eyebrow{ display:block; margin-bottom:1.2rem; }
.gallery__grid{ columns:4; column-gap:12px; }
.gallery__grid figure{ break-inside:avoid; margin:0 0 12px; position:relative; overflow:hidden; cursor:pointer; background:var(--surface); }
.gallery__grid img{ width:100%; display:block; transition:transform 1s cubic-bezier(.16,1,.3,1); }
.gallery__grid figure::after{ content:""; position:absolute; inset:0; background:rgba(47,90,87,0); transition:background .4s; }
.gallery__grid figure:hover::after{ background:rgba(47,90,87,.22); }
.gallery__grid figure:hover img{ transform:scale(1.05); }
.gallery__grid figure .pl{ position:absolute; inset:0; z-index:2; display:grid; place-items:center; opacity:0; transition:opacity .4s; color:#fff; }
.gallery__grid figure:hover .pl{ opacity:1; }
.gallery__grid figure .pl span{ width:46px; height:46px; border:1px solid #fff; border-radius:50%; display:grid; place-items:center; font-size:1.2rem; }

/* lightbox */
.lightbox{ position:fixed; inset:0; z-index:1000; background:rgba(20,26,24,.95); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .35s; }
.lightbox.open{ opacity:1; pointer-events:auto; }
.lightbox img{ max-width:88vw; max-height:84vh; object-fit:contain; box-shadow:0 30px 90px rgba(0,0,0,.5); }
.lightbox__btn{ position:absolute; background:none; border:0; color:#fff; cursor:pointer; font-family:var(--serif); font-size:2.4rem; opacity:.75; transition:opacity .3s; padding:14px; }
.lightbox__btn:hover{ opacity:1; }
.lb-prev{ left:2vw; top:50%; transform:translateY(-50%); }
.lb-next{ right:2vw; top:50%; transform:translateY(-50%); }
.lb-close{ top:14px; right:20px; font-size:1.8rem; }
.lb-count{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.7); font-size:.72rem; letter-spacing:.16em; }

/* =====================  CONTACT + MAP  ===================== */
.contact{ background:var(--surface); }
.contact__grid{ display:grid; grid-template-columns:1fr 1fr; }
.contact__form-wrap{ padding:clamp(3rem,6vw,5.5rem) clamp(1.6rem,4vw,4rem); }
.contact__form-wrap .eyebrow{ display:block; margin-bottom:1.3rem; }
.contact__form-wrap h2{ margin-bottom:.8rem; }
.contact__form-wrap > p{ color:var(--muted); margin-bottom:2.4rem; max-width:42ch; }
.cform{ display:grid; gap:1.5rem; }
.cfield{ display:flex; flex-direction:column; gap:.5rem; }
.cfield.two{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.cfield label{ font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.cfield input, .cfield textarea{ font-family:var(--sans); font-size:1rem; font-weight:300; color:var(--ink);
  background:transparent; border:0; border-bottom:1px solid var(--line); padding:.6rem 0; transition:border-color .3s; }
.cfield input:focus, .cfield textarea:focus{ outline:0; border-color:var(--sea); }
.contact__map{ position:relative; min-height:420px; background:var(--surface-deep); }
.contact__map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; filter:grayscale(.35) sepia(.08); }
.contact__details{ display:flex; gap:clamp(1.6rem,4vw,3.5rem); flex-wrap:wrap; margin-top:2.6rem; padding-top:2rem; border-top:1px solid var(--line); }
.contact__details .d{ font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:.35rem; }
.contact__details .v{ font-size:1rem; }

/* =====================  FOOTER  ===================== */
.footer{ background:var(--ink); color:rgba(255,255,255,.72); padding-block:clamp(3.5rem,7vw,5rem) 2rem; }
.footer__top{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.footer__logo{ font-family:var(--serif); font-size:1.9rem; letter-spacing:.16em; color:#fff; }
.footer__logo small{ display:block; font-family:var(--sans); font-size:.5rem; font-weight:500; letter-spacing:.5em; opacity:.7; margin-top:4px; padding-left:.2em; }
.footer__top p{ font-size:.9rem; line-height:1.9; margin-top:1.2rem; max-width:34ch; }
.footer h4{ font-family:var(--sans); font-size:.64rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--clay); margin-bottom:1.2rem; }
.footer ul{ list-style:none; }
.footer li{ margin-bottom:.6rem; }
.footer a:hover{ color:#fff; }
.footer__bottom{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
  margin-top:clamp(3rem,5vw,4rem); padding-top:1.6rem; border-top:1px solid rgba(255,255,255,.14); font-size:.74rem; color:rgba(255,255,255,.5); }
.footer__social{ display:flex; gap:1.4rem; }
.footer__left{ display:flex; flex-direction:row; gap:1.5em; align-items:center; }
.footer__credit{ display:flex; gap:.5em; align-items:center; }
.footer__credit-logo{ width:50px; display:inline-flex; align-items:center; }
.footer__credit-logo img{ width:100%; height:auto; opacity:.7; transition:opacity .3s; }
.footer__credit-logo:hover img{ opacity:1; }

/* =====================  RESPONSIVE  ===================== */
@media (max-width:1023px){
  .bar{ height: 90px; padding-block: 0; }
  .bar.solid{ height: 75px; padding-top: 0; padding-block: 0; }
  .menu{ grid-template-columns:1fr; }
  .menu__aside{ display:none; }
  .menu__nav{ overflow-y: auto !important; }
  .menu__nav a{ font-size: clamp(1.4rem, 5.5vw, 2.2rem); padding-block: 0.35rem; }
  .room-slider__btn{ opacity: 1 !important; }
  .about__pillars{ grid-template-columns:repeat(3,1fr); gap:1.5rem; }
  .facilities__grid{ grid-template-columns:repeat(2,1fr); }
  .location__grid{ grid-template-columns:1fr; gap: 2.2rem; }
  .location__media{ height:auto; grid-template-rows:none; grid-template-columns:1fr 1fr; }
  .location__media .lph{ aspect-ratio:4/3; }
  .gallery__grid{ display:grid; grid-template-columns:repeat(3,1fr); }
  .gallery__grid figure{ margin:0 !important; aspect-ratio:1/1; }
  .gallery__grid img{ width:100%; height:100%; object-fit:cover; }
  .room-row{ grid-template-columns:1fr !important; gap:2.5rem; }
  .room-row:nth-child(even) .room-row__media{ order:0; }
  .contact__grid{ grid-template-columns:1fr; }
  .contact__map{ min-height:360px; }
  .footer__top{ grid-template-columns:1fr 1fr; }
}
@media (max-width:767px){
  .bar{ height: 75px; padding-block: 0; }
  .bar.solid{ height: 60px; padding-top: 0; padding-block: 0; }
  .bar__email, .bar__lang{ display:none; }
  .about__pillars{ grid-template-columns:1fr; max-width:420px; margin-inline:auto; gap:2.2rem; }
  .about__media{ grid-template-columns:1fr 1fr; }
  .about__media .m1{ grid-column:1/3; }
  .about__media .m2{ grid-column:1/2; }
  .about__media .m3{ grid-column:2/3; }
  .facilities__grid{ grid-template-columns:1fr; }
  .facility{ padding:1.5rem 1.2rem; }
  .facility .ic{ height:24px; margin-bottom:0.7rem; }
  .facility .ic svg{ width:24px; height:24px; }
  .room-row{ gap:1.8rem; }
  .gallery__grid{ grid-template-columns:repeat(2,1fr); }
  .location__media{ grid-template-columns:1fr; }
  .cfield.two{ grid-template-columns:1fr; }
  .contact__form-wrap{ padding:2.2rem 1.4rem; }
  .contact__form-wrap > p{ margin-bottom:1.6rem; }
  .cform{ gap:1.1rem; }
  .footer__top{ grid-template-columns:1fr; }
  .hero__actions .btn{ padding-inline:1.6em; }
}

/* ===========================================================
   ELEMENTOR BUILD ADDITIONS
   The reviews widget renders ALL quotes server-side (editable) and
   shows one at a time; JS toggles .active. Hero slides already use the
   .s / .s.active pattern which works the same way.
   =========================================================== */
.reviews__item{ display:none; }
.reviews__item.active{ display:block; }

/* Let our full-bleed sections ignore Elementor's default content width so the
   header bar, hero and photo bands span edge-to-edge. Scope to our widgets. */
.elementor-widget-kamelia-header .elementor-widget-container,
.elementor-widget-kamelia-hero .elementor-widget-container,
.elementor-widget-kamelia-experience .elementor-widget-container,
.elementor-widget-kamelia-footer .elementor-widget-container{ max-width:none; }

/* contact form feedback message */
.cform__msg{ margin-top:1.2rem; font-size:.86rem; line-height:1.5; min-height:1.2em; }

#hero-heading{
  font-size: clamp(2rem, 5vw, 4rem);
  color: #fff;
}
#location-heading{
  color: #fff;
}
#experience-heading{
  color: #fff;
}
.e-con.e-flex > .e-con-inner{ padding:0; }

.footer__left {
  display: flex;
  flex-direction: row;
  gap: 1.5em;
}
.footer__credit {
  display: flex;
  gap: 0.5em;
  align-items: anchor-center;
}
.footer__credit-logo {
  width: 50px;
}