:root{
  --bg:#f4f3ef;
  --surface:#ffffff;
  --surface-2:#ebe9e2;
  --text:#1d2925;
  --muted:#69736e;
  --accent:#365f55;
  --accent-dark:#28483f;
  --accent-soft:#dce8e3;
  --line:#dddcd5;
  --shadow:0 16px 40px rgba(28,42,36,.09);
  --radius:24px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.55}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(var(--max),calc(100% - 40px));margin:0 auto}
.header{position:sticky;top:0;z-index:30;background:rgba(244,243,239,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(221,220,213,.8)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:-.02em}.brand-mark{width:40px;height:40px;border-radius:14px;background:var(--accent);color:white;display:grid;place-items:center;font-size:20px}.brand small{display:block;font-weight:500;color:var(--muted);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.nav-links{display:flex;align-items:center;gap:28px;font-size:14px}.nav-links a:hover{color:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:14px;border:1px solid transparent;font-weight:700;cursor:pointer;transition:.2s ease}.btn-primary{background:var(--accent);color:white}.btn-primary:hover{background:var(--accent-dark);transform:translateY(-1px)}.btn-light{background:white;border-color:var(--line)}.btn-light:hover{border-color:#b8c3be}.btn-sm{min-height:42px;padding:0 16px;border-radius:12px}
.menu-btn{display:none;border:0;background:transparent;font-size:26px}
.hero{padding:76px 0 44px}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:38px;align-items:stretch}.hero-copy{padding:38px 0}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.hero h1{font-size:clamp(42px,6vw,78px);line-height:.98;letter-spacing:-.055em;margin:20px 0 24px;max-width:800px}.hero p{font-size:19px;color:var(--muted);max-width:690px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}.hero-card{background:linear-gradient(160deg,#355e54 0%,#27443d 100%);color:white;border-radius:32px;padding:28px;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:space-between;min-height:430px;position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;inset:auto -70px -70px auto;width:250px;height:250px;border-radius:50%;background:rgba(255,255,255,.08)}.hero-card h3{font-size:28px;margin:0 0 8px}.hero-card p{color:rgba(255,255,255,.74);font-size:15px}.feature-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:28px}.feature{padding:16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.1);border-radius:18px}.feature strong{display:block;font-size:22px}.feature span{font-size:12px;color:rgba(255,255,255,.7)}
.booking{margin-top:28px;background:white;border-radius:24px;padding:22px;box-shadow:var(--shadow)}.booking-grid{display:grid;grid-template-columns:1.2fr repeat(3,.8fr) auto;gap:12px;align-items:end}.field label{display:block;font-size:12px;font-weight:800;color:var(--muted);margin:0 0 7px;text-transform:uppercase;letter-spacing:.05em}.field input,.field select{width:100%;height:48px;border:1px solid var(--line);border-radius:12px;background:#fafafa;padding:0 13px;font:inherit;color:var(--text)}
.section{padding:76px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}.section-head h2{font-size:clamp(30px,4vw,48px);line-height:1.05;letter-spacing:-.04em;margin:0}.section-head p{max-width:520px;color:var(--muted);margin:0}
.hotel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.hotel-card{background:white;border-radius:22px;overflow:hidden;border:1px solid #e8e7e0;transition:.25s;display:flex;flex-direction:column}.hotel-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.hotel-photo{aspect-ratio:16/10;background:#ddd;overflow:hidden}.hotel-photo img{width:100%;height:100%;object-fit:cover;image-rendering:auto;transform:scale(1.01)}.hotel-body{padding:20px;display:flex;flex-direction:column;gap:14px;flex:1}.hotel-body h3{margin:0;font-size:23px;letter-spacing:-.025em}.meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:13px}.pill{background:var(--surface-2);padding:6px 9px;border-radius:999px}.address{color:var(--muted);font-size:14px;min-height:44px}.card-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:8px}.price{font-weight:800}.price small{font-weight:500;color:var(--muted)}
.advantages{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.adv{background:white;border-radius:20px;padding:24px;border:1px solid #e8e7e0}.adv .icon{width:46px;height:46px;border-radius:14px;background:var(--accent-soft);display:grid;place-items:center;font-size:22px;margin-bottom:18px}.adv h3{margin:0 0 8px}.adv p{margin:0;color:var(--muted);font-size:14px}
.cta{background:#1e332d;color:white;border-radius:30px;padding:42px;display:flex;justify-content:space-between;align-items:center;gap:28px}.cta h2{font-size:clamp(30px,4vw,48px);line-height:1.05;margin:0 0 12px}.cta p{color:rgba(255,255,255,.7);margin:0;max-width:620px}
.footer{padding:54px 0 28px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(2,1fr);gap:30px;padding-bottom:34px;border-bottom:1px solid var(--line)}.footer h4{margin:0 0 12px}.footer p,.footer a{color:var(--muted);font-size:14px}.footer-links{display:grid;gap:8px}.copyright{display:flex;justify-content:space-between;gap:16px;padding-top:22px;color:var(--muted);font-size:13px}
/* hotel page */
.subhero{padding:56px 0 36px}.breadcrumbs{font-size:13px;color:var(--muted);margin-bottom:18px}.subhero h1{font-size:clamp(38px,6vw,70px);line-height:1;letter-spacing:-.05em;margin:0 0 18px}.hotel-lead{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted)}.hotel-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:34px}.gallery{display:grid;grid-template-columns:1.5fr .5fr;gap:12px}.gallery-main,.gallery-side div{overflow:hidden;border-radius:22px;background:#ddd}.gallery-main{min-height:430px}.gallery-side{display:grid;gap:12px}.gallery img{width:100%;height:100%;object-fit:cover}.info-card{background:white;border:1px solid #e7e5de;border-radius:24px;padding:24px;position:sticky;top:100px;height:max-content}.info-card h3{margin:0 0 18px;font-size:24px}.info-list{display:grid;gap:14px}.info-item{padding-bottom:14px;border-bottom:1px solid var(--line)}.info-item:last-child{border:0}.info-item small{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:800;letter-spacing:.05em;margin-bottom:4px}.content-card{background:white;border-radius:24px;padding:30px;border:1px solid #e7e5de;margin-top:20px}.content-card h2{font-size:30px;margin:0 0 16px}.amenities{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.amenity{padding:14px 16px;border-radius:14px;background:var(--surface-2)}.rooms{width:100%;border-collapse:collapse}.rooms th,.rooms td{text-align:left;padding:14px 10px;border-bottom:1px solid var(--line)}.rooms th{font-size:12px;text-transform:uppercase;color:var(--muted);letter-spacing:.05em}.map-frame{width:100%;height:380px;border:0;border-radius:20px}
@media(max-width:980px){.nav-links{display:none}.menu-btn{display:block}.hero-grid,.hotel-layout{grid-template-columns:1fr}.hero{padding-top:42px}.hero-card{min-height:320px}.booking-grid{grid-template-columns:1fr 1fr}.booking-grid .field:first-child{grid-column:1/-1}.hotel-grid{grid-template-columns:repeat(2,1fr)}.advantages{grid-template-columns:repeat(2,1fr)}.info-card{position:static}.gallery{grid-template-columns:1fr}.gallery-side{grid-template-columns:1fr 1fr}.gallery-main{min-height:360px}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}
@media(max-width:640px){.container{width:min(100% - 24px,var(--max))}.nav{height:68px}.brand small{display:none}.hero{padding:34px 0 20px}.hero-copy{padding:10px 0}.hero h1{font-size:44px}.hero p{font-size:17px}.hero-card{border-radius:24px}.feature-row{grid-template-columns:1fr 1fr}.booking{padding:16px;border-radius:20px}.booking-grid{grid-template-columns:1fr}.booking-grid .field:first-child{grid-column:auto}.booking-grid .btn{width:100%}.section{padding:54px 0}.section-head{display:block}.section-head p{margin-top:12px}.hotel-grid,.advantages{grid-template-columns:1fr}.cta{padding:28px;border-radius:24px;display:block}.cta .btn{margin-top:22px;width:100%}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.copyright{display:block}.copyright span{display:block;margin-top:8px}.gallery-main{min-height:260px}.gallery-side{grid-template-columns:1fr 1fr}.content-card{padding:22px}.amenities{grid-template-columns:1fr}.rooms{font-size:14px}}

/* ===== Design variant 2: warm terracotta + home-page carousel ===== */
:root{
  --bg:#f6f0e8;
  --surface:#fffaf4;
  --surface-2:#eee1d4;
  --text:#352824;
  --muted:#776964;
  --accent:#9a4f3d;
  --accent-dark:#78392d;
  --accent-soft:#ead5cc;
  --line:#e2d6ca;
  --shadow:0 18px 46px rgba(73,45,34,.11);
}
.header{background:rgba(246,240,232,.9);border-bottom-color:rgba(226,214,202,.9)}
.brand-mark{background:linear-gradient(145deg,#a85a46,#7f3f31)}
.hotel-card,.adv,.booking,.info-card,.content-card{background:var(--surface);border-color:#eadfd4}
.pill{background:#efe4d9}
.cta{background:linear-gradient(135deg,#5b332c 0%,#7e483a 100%)}
.hero-v2{padding-top:58px}
.hero-grid-v2{grid-template-columns:.88fr 1.12fr;align-items:center;gap:44px}
.hero-grid-v2 .hero-copy{padding:28px 0}
.hero-grid-v2 .hero-copy h1{font-size:clamp(44px,5.4vw,74px);max-width:720px}
.hero-stats{display:flex;gap:20px;flex-wrap:wrap;margin-top:34px;color:var(--muted);font-size:13px}
.hero-stats span{display:flex;align-items:baseline;gap:6px;padding-right:20px;border-right:1px solid var(--line)}
.hero-stats span:last-child{border-right:0}.hero-stats strong{color:var(--text);font-size:18px}
.carousel{position:relative;min-height:500px;border-radius:32px;overflow:hidden;background:#d6c5b8;box-shadow:0 26px 70px rgba(84,49,37,.18)}
.carousel-track{position:absolute;inset:0}
.carousel-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .55s ease,visibility .55s ease;overflow:hidden}
.carousel-slide.is-active{opacity:1;visibility:visible}
.carousel-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(39,24,19,.04) 30%,rgba(39,24,19,.78) 100%)}
.carousel-slide img{width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(.98);transform:scale(1.025)}
.carousel-overlay{position:absolute;left:30px;right:100px;bottom:30px;z-index:2;color:#fff}
.carousel-overlay span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.72);font-weight:800}
.carousel-overlay h3{font-size:32px;line-height:1.08;margin:7px 0 8px;letter-spacing:-.03em}
.carousel-overlay a{font-size:14px;font-weight:800;color:#fff}
.carousel-btn{position:absolute;z-index:3;bottom:28px;width:46px;height:46px;border:1px solid rgba(255,255,255,.38);border-radius:50%;background:rgba(38,22,18,.28);backdrop-filter:blur(8px);color:#fff;font-size:20px;cursor:pointer;transition:.2s}
.carousel-btn:hover{background:rgba(38,22,18,.5)}
.carousel-prev{right:84px}.carousel-next{right:30px}
.carousel-dots{position:absolute;z-index:3;left:30px;top:28px;display:flex;gap:7px}
.carousel-dot{width:8px;height:8px;border-radius:99px;border:0;padding:0;background:rgba(255,255,255,.5);cursor:pointer;transition:.25s}
.carousel-dot.is-active{width:28px;background:#fff}
.booking-v2{margin-top:34px;border:1px solid rgba(154,79,61,.08)}
@media(max-width:980px){.hero-grid-v2{grid-template-columns:1fr}.carousel{min-height:470px}.hero-grid-v2 .hero-copy{padding-bottom:0}}
@media(max-width:640px){.hero-v2{padding-top:28px}.hero-grid-v2{gap:26px}.hero-grid-v2 .hero-copy h1{font-size:42px}.hero-stats{gap:10px 14px;margin-top:24px}.hero-stats span{border:0;padding:0}.carousel{min-height:380px;border-radius:24px}.carousel-overlay{left:22px;right:75px;bottom:22px}.carousel-overlay h3{font-size:25px}.carousel-btn{bottom:20px;width:42px;height:42px}.carousel-prev{right:68px}.carousel-next{right:20px}.carousel-dots{left:22px;top:20px}}

/* ===== Local hotel photo galleries ===== */
.hotel-gallery{display:grid;gap:12px}.gallery-stage{position:relative;overflow:hidden;border-radius:24px;background:#ded4ca;aspect-ratio:16/9}.gallery-open{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in}.gallery-open img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.gallery-open:hover img{transform:scale(1.015)}.gallery-count{position:absolute;right:18px;bottom:18px;padding:8px 12px;border-radius:999px;background:rgba(39,24,19,.66);backdrop-filter:blur(8px);color:#fff;font-size:13px;font-weight:800}.gallery-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.gallery-thumb{aspect-ratio:4/3;border:2px solid transparent;border-radius:14px;overflow:hidden;padding:0;background:#ddd;cursor:pointer;opacity:.72;transition:.2s}.gallery-thumb:hover,.gallery-thumb.is-active{opacity:1}.gallery-thumb.is-active{border-color:var(--accent)}.gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}.gallery-lightbox{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:32px;background:rgba(24,16,13,.9);backdrop-filter:blur(10px)}.gallery-lightbox.is-open{display:flex}.gallery-lightbox img{max-width:min(1180px,92vw);max-height:86vh;border-radius:18px;box-shadow:0 28px 90px rgba(0,0,0,.42)}.lightbox-close,.lightbox-nav{position:absolute;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.11);color:#fff;backdrop-filter:blur(8px);cursor:pointer}.lightbox-close{top:22px;right:22px;width:48px;height:48px;border-radius:50%;font-size:26px}.lightbox-nav{top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;font-size:25px}.lightbox-prev{left:24px}.lightbox-next{right:24px}.photo-note{font-size:13px;color:var(--muted)}
@media(max-width:640px){.gallery-stage{border-radius:18px;aspect-ratio:4/3}.gallery-thumbs{grid-template-columns:repeat(5,78px);overflow-x:auto;padding-bottom:4px}.gallery-thumb{border-radius:11px}.lightbox-nav{width:46px;height:46px}.lightbox-prev{left:10px}.lightbox-next{right:10px}}

/* ===== Variant 4: full-width home carousel ===== */
.hero-full{position:relative;padding-bottom:78px;background:var(--surface)}.carousel-full{min-height:clamp(580px,74vh,790px);border-radius:0;box-shadow:none}.carousel-full .carousel-slide:after{display:none}.full-hero-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(32,18,14,.76) 0%,rgba(32,18,14,.48) 46%,rgba(32,18,14,.12) 76%),linear-gradient(0deg,rgba(32,18,14,.4),transparent 48%)}.full-hero-content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;color:#fff;padding-top:70px;padding-bottom:120px}.full-hero-content h2{max-width:850px;font-size:clamp(52px,7.6vw,104px);line-height:.92;letter-spacing:-.055em;margin:12px 0 22px;color:#fff}.full-hero-content p{max-width:660px;font-size:20px;line-height:1.55;color:rgba(255,255,255,.86);margin:0 0 30px}.hero-eyebrow{color:#f3c7b5}.btn-glass{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.34);color:#fff;backdrop-filter:blur(10px)}.btn-glass:hover{background:rgba(255,255,255,.22)}.carousel-full .carousel-dots{left:max(30px,calc((100vw - var(--max))/2));top:auto;bottom:38px}.carousel-full .carousel-btn{bottom:32px}.carousel-full .carousel-prev{right:84px}.carousel-full .carousel-next{right:30px}.full-booking-wrap{position:relative;z-index:8;margin-top:-56px}.booking-overlap{box-shadow:0 24px 70px rgba(68,37,29,.22);border-color:rgba(255,255,255,.8)}
@media(max-width:640px){.hero-full{padding-bottom:56px}.carousel-full{min-height:650px}.full-hero-shade{background:linear-gradient(0deg,rgba(32,18,14,.76) 0%,rgba(32,18,14,.38) 75%,rgba(32,18,14,.22) 100%)}.full-hero-content{justify-content:flex-end;padding-top:90px;padding-bottom:120px}.full-hero-content h2{font-size:48px}.full-hero-content p{font-size:17px}.carousel-full .carousel-dots{left:20px;bottom:24px}.carousel-full .carousel-btn{bottom:18px}.full-booking-wrap{margin-top:-28px}}

/* ===== Variant 5: centered readable hero captions ===== */
.full-hero-content{
  justify-content:center;
  align-items:center;
  text-align:center;
  padding-top:64px;
  padding-bottom:190px;
}
.hero-caption-panel{
  width:min(820px,calc(100% - 40px));
  padding:28px 34px 30px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:28px;
  background:linear-gradient(145deg,rgba(34,20,16,.52),rgba(34,20,16,.30));
  box-shadow:0 18px 60px rgba(18,10,8,.28);
  backdrop-filter:blur(10px) saturate(.9);
  -webkit-backdrop-filter:blur(10px) saturate(.9);
}
.hero-caption-panel .hero-eyebrow{
  justify-content:center;
  color:#f6d8cb;
}
.hero-caption-panel h2{
  margin:12px auto 18px;
  max-width:760px;
  font-size:clamp(46px,6.2vw,86px);
}
.hero-caption-panel p{
  margin:0 auto 24px;
  max-width:650px;
  color:rgba(255,255,255,.94);
}
.hero-caption-panel .hero-actions{
  justify-content:center;
  margin-top:24px;
}
/* Keep controls below the caption but above the booking card. */
.carousel-full .carousel-dots{bottom:102px}
.carousel-full .carousel-btn{bottom:92px}

@media(max-width:980px){
  .full-hero-content{padding-bottom:180px}
  .hero-caption-panel{width:min(760px,calc(100% - 32px));padding:26px 28px}
  .hero-caption-panel h2{font-size:clamp(44px,8vw,70px)}
}

@media(max-width:640px){
  .hero-full{padding-bottom:48px}
  .carousel-full{min-height:700px}
  .full-hero-content{
    justify-content:center;
    align-items:center;
    padding-top:34px;
    padding-bottom:205px;
  }
  .hero-caption-panel{
    width:calc(100% - 24px);
    padding:20px 18px 22px;
    border-radius:22px;
    background:linear-gradient(145deg,rgba(34,20,16,.64),rgba(34,20,16,.43));
    box-shadow:0 14px 44px rgba(18,10,8,.34);
    backdrop-filter:blur(9px);
    -webkit-backdrop-filter:blur(9px);
  }
  .hero-caption-panel .hero-eyebrow{
    font-size:10px;
    line-height:1.35;
    letter-spacing:.10em;
  }
  .hero-caption-panel h2{
    font-size:clamp(34px,10vw,46px);
    line-height:1;
    margin:9px auto 13px;
    letter-spacing:-.045em;
  }
  .hero-caption-panel p{
    font-size:15px;
    line-height:1.42;
    margin-bottom:18px;
  }
  .hero-caption-panel .hero-actions{
    gap:9px;
    margin-top:16px;
  }
  .hero-caption-panel .btn{
    min-height:44px;
    padding:0 14px;
    font-size:13px;
  }
  .carousel-full .carousel-dots{
    left:50%;
    transform:translateX(-50%);
    bottom:118px;
  }
  .carousel-full .carousel-btn{
    bottom:106px;
  }
  .carousel-full .carousel-prev{right:72px}
  .carousel-full .carousel-next{right:20px}
  .full-booking-wrap{margin-top:-72px}
}

@media(max-width:420px){
  .carousel-full{min-height:735px}
  .full-hero-content{padding-bottom:210px}
  .hero-caption-panel p{font-size:14px}
  .hero-caption-panel .hero-actions{flex-direction:column}
  .hero-caption-panel .btn{width:100%}
  .carousel-full .carousel-dots{bottom:126px}
  .carousel-full .carousel-btn{bottom:112px}
}

/* ===== Variant 6: marketing promo label on each home carousel slide ===== */
.hero-promo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:min(720px,calc(100% - 40px));
  margin:0 auto 16px;
  padding:10px 18px 11px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(31,18,14,.58);
  box-shadow:0 10px 32px rgba(18,10,8,.24);
  backdrop-filter:blur(10px) saturate(.9);
  -webkit-backdrop-filter:blur(10px) saturate(.9);
  color:#fff;
  font-size:15px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.015em;
  text-align:center;
  text-shadow:0 1px 8px rgba(0,0,0,.22);
}

@media(max-width:640px){
  .hero-promo{
    max-width:calc(100% - 32px);
    margin-bottom:12px;
    padding:8px 14px 9px;
    font-size:13px;
    line-height:1.25;
    background:rgba(31,18,14,.70);
  }
}

@media(max-width:420px){
  .hero-promo{
    max-width:calc(100% - 24px);
    padding:8px 12px;
    font-size:12px;
  }
}

/* ===== Variant 7: FIX hero layers so captions/promo are always visible ===== */
.carousel-full .carousel-slide > img{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.carousel-full .full-hero-shade{
  z-index:1;
}
.carousel-full .full-hero-content{
  position:absolute;
  inset:0;
  z-index:2;
  width:min(var(--max),calc(100% - 40px));
  height:auto;
  margin:0 auto;
  pointer-events:none;
}
.carousel-full .full-hero-content .hero-promo,
.carousel-full .full-hero-content .hero-caption-panel{
  pointer-events:auto;
}

/* Promo message is visually separate from the hotel caption. */
.carousel-full .hero-promo{
  position:relative;
  z-index:4;
  margin-bottom:14px;
  padding:11px 20px 12px;
  background:rgba(54,31,24,.72);
  border:1px solid rgba(255,255,255,.32);
  box-shadow:0 10px 34px rgba(18,10,8,.30);
  backdrop-filter:blur(11px) saturate(.95);
  -webkit-backdrop-filter:blur(11px) saturate(.95);
}

@media(max-width:640px){
  .carousel-full .full-hero-content{
    width:calc(100% - 24px);
    padding-top:24px;
    padding-bottom:210px;
  }
  .carousel-full .hero-promo{
    margin-bottom:10px;
    padding:9px 14px 10px;
    font-size:13px;
    background:rgba(54,31,24,.80);
  }
}

@media(max-width:420px){
  .carousel-full .full-hero-content{
    padding-bottom:218px;
  }
  .carousel-full .hero-promo{
    font-size:12px;
    padding:8px 12px 9px;
  }
}


/* ===== Variant 8: lightweight promo sentence on hero image ===== */
.carousel-full .full-hero-content {
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  padding-top: 24px;
  padding-bottom: 92px;
}

.carousel-full .hero-promo {
  max-width: min(640px, calc(100% - 48px));
  margin: 0;
  padding: 9px 15px 10px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 12px;
  background: rgba(35, 21, 17, 0.48);
  box-shadow: 0 6px 20px rgba(18, 10, 8, 0.18);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  color: #fff;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: 0;
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.28);
}

.carousel-full .carousel-dots {
  bottom: 34px;
}

.carousel-full .carousel-btn {
  bottom: 24px;
}

@media (max-width: 640px) {
  .carousel-full {
    min-height: 610px;
  }

  .carousel-full .full-hero-content {
    width: calc(100% - 24px);
    padding-top: 20px;
    padding-bottom: 108px;
  }

  .carousel-full .hero-promo {
    max-width: calc(100% - 20px);
    padding: 8px 12px 9px;
    border-radius: 10px;
    background: rgba(35, 21, 17, 0.58);
    font-size: 14px;
  }

  .carousel-full .carousel-dots {
    left: 20px;
    transform: none;
    bottom: 30px;
  }

  .carousel-full .carousel-btn {
    bottom: 20px;
  }

  .full-booking-wrap {
    margin-top: -52px;
  }
}

@media (max-width: 420px) {
  .carousel-full {
    min-height: 580px;
  }

  .carousel-full .full-hero-content {
    padding-bottom: 104px;
  }

  .carousel-full .hero-promo {
    max-width: calc(100% - 12px);
    font-size: 13px;
  }
}

/* ===== Responsive carousel images ===== */
.carousel-full .carousel-slide > .carousel-picture {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.carousel-full .carousel-slide > .carousel-picture > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ===== Phone popup ===== */
.phone-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(22, 18, 16, 0.58);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.phone-modal.is-open {
  display: flex;
}

.phone-modal-card {
  position: relative;
  width: min(620px, 100%);
  max-height: min(760px, calc(100vh - 40px));
  overflow: auto;
  padding: 30px;
  border-radius: 28px;
  background: var(--surface);
  box-shadow: 0 26px 80px rgba(25, 18, 15, 0.28);
}

.phone-modal-head {
  padding-right: 48px;
  margin-bottom: 20px;
}

.phone-modal-head h2 {
  margin: 0 0 8px;
  font-size: 28px;
}

.phone-modal-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.phone-modal-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: var(--surface-2);
  color: var(--text);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.phone-modal-list {
  display: grid;
  gap: 10px;
}

.phone-modal-hotel {
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.phone-modal-hotel-name {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--text);
  font-weight: 800;
  text-decoration: none;
}

.phone-modal-numbers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.phone-number-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 14px;
  font-weight: 750;
  text-decoration: none;
}

.phone-number-link:hover,
.phone-modal-hotel-name:hover {
  color: var(--accent);
}

.footer-phone-button {
  width: fit-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.footer-phone-button:hover {
  color: var(--accent);
}

/* ===== Contacts page ===== */
.contact-hero {
  padding: 76px 0 42px;
  background: linear-gradient(180deg, #f7f1eb 0%, var(--bg) 100%);
}

.contact-hero h1 {
  max-width: 820px;
  margin: 10px 0 14px;
  font-size: clamp(40px, 6vw, 72px);
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.contact-hero p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.6;
}

.contact-section {
  padding-top: 32px;
}

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
  gap: 28px;
  align-items: start;
}

.contact-map-card {
  position: sticky;
  top: 92px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.contact-map {
  display: block;
  width: 100%;
  height: 450px;
  border: 0;
}

.map-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}

.map-note a {
  color: var(--accent-dark);
  font-weight: 700;
  text-decoration: none;
}

.contact-list {
  display: grid;
  gap: 14px;
}

.contact-hotel {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--surface);
  box-shadow: 0 10px 28px rgba(28, 42, 36, 0.05);
}

.contact-hotel h2 {
  margin: 0 0 7px;
  font-size: 21px;
}

.contact-hotel p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.contact-phone,
.contact-map-link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 9px 12px;
  border-radius: 12px;
  text-decoration: none;
  font-size: 14px;
  font-weight: 750;
}

.contact-phone {
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.contact-map-link {
  background: var(--surface-2);
  color: var(--text);
}

@media (max-width: 980px) {
  .contact-layout {
    grid-template-columns: 1fr;
  }

  .contact-map-card {
    position: static;
  }

  .contact-map {
    height: 450px;
  }
}

@media (max-width: 640px) {
  .phone-modal {
    align-items: flex-end;
    padding: 10px;
  }

  .phone-modal-card {
    width: 100%;
    max-height: 86vh;
    padding: 24px 18px 18px;
    border-radius: 24px;
  }

  .phone-modal-head h2 {
    font-size: 24px;
  }

  .phone-modal-hotel {
    padding: 14px;
  }

  .phone-modal-numbers {
    flex-direction: column;
  }

  .phone-number-link {
    width: 100%;
  }

  .contact-hero {
    padding: 52px 0 28px;
  }

  .contact-hero p {
    font-size: 16px;
  }

  .contact-map {
    height: 350px;
  }

  .map-note {
    align-items: flex-start;
    flex-direction: column;
  }

  .contact-hotel {
    padding: 18px;
  }

  .contact-actions {
    flex-direction: column;
  }

  .contact-phone,
  .contact-map-link {
    width: 100%;
  }
}


/* ===== About the hotel network ===== */
.about-section {
  background: var(--surface);
}

.about-card {
  padding: 42px 44px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgba(255, 250, 244, 0.72);
}

.about-heading {
  max-width: 900px;
  margin-bottom: 28px;
}

.about-heading h2 {
  margin: 12px 0 0;
  max-width: 860px;
  font-size: clamp(30px, 4vw, 46px);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.about-copy {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
}

.about-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 15.5px;
  line-height: 1.75;
}

.about-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 34px;
  padding-top: 26px;
  border-top: 1px solid var(--line);
}

.about-fact {
  padding: 17px 18px;
  border-radius: 18px;
  background: var(--surface-2);
}

.about-fact strong {
  display: block;
  margin-bottom: 5px;
  color: var(--text);
  font-size: 16px;
}

.about-fact span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .about-copy {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .about-facts {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .about-card {
    padding: 28px 22px;
    border-radius: 22px;
  }

  .about-heading {
    margin-bottom: 22px;
  }

  .about-copy p {
    font-size: 15px;
    line-height: 1.68;
  }
}

/* ===== Mobile phone popup reliability fix ===== */
html.phone-modal-open,
body.phone-modal-open {
  overflow: hidden;
  overscroll-behavior: none;
}

.phone-modal {
  z-index: 100000;
  display: flex;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
  touch-action: manipulation;
}

.phone-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.phone-modal-card,
.phone-modal-card a,
.phone-modal-card button {
  pointer-events: auto;
}

[data-phone-modal] {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

@media (max-width: 980px) {
  .nav-links[data-open="1"] {
    z-index: 1001;
  }

  .nav-links [data-phone-modal] {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .phone-modal {
    min-height: 100vh;
    min-height: 100dvh;
    align-items: flex-end;
    padding: 8px;
  }

  .phone-modal-card {
    width: 100%;
    max-height: calc(100vh - 16px);
    max-height: calc(100dvh - 16px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 22px 16px 18px;
    border-radius: 24px 24px 18px 18px;
  }

  .phone-modal-close {
    width: 44px;
    height: 44px;
  }

  .phone-modal-hotel-name,
  .phone-number-link {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
}

/* TravelLine: supplier container; keep calendars and dropdowns unclipped. */
#block-search, #block-search * { box-sizing: border-box; }
#block-search { background: #eee1d4; border: 1px solid #c3b19e; width: 100%; border-radius: 15px; max-width: 1182px; margin: 0 auto; }
.tl-container { margin: 0 auto; padding: 0 25px; min-height: 104px; }
.booking-section { padding: 20px 0; }
.booking-loading { padding: 20px 0; margin: 0; }
.booking-phone { font: inherit; color: var(--primary, #984f3b); text-decoration: underline; background: none; border: 0; padding: 0; cursor: pointer; }
@media (max-width: 640px) { .tl-container { padding: 0 12px; } }

/* Home search: restore the original booking card around the live TL form. */
#block-search.home-booking {
  background: var(--surface);
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(68,37,29,.22);
}
.home-booking > .tl-container { padding: 0 22px; }
@media (max-width:640px) {
  #block-search.home-booking { border-radius: 20px; }
  .home-booking > .tl-container { padding: 0 16px; }
}

/* Keep the hotel name and its message together inside each carousel slide. */
.carousel-full .hero-promo .hero-hotel { display: block; font-size: 1.1em; font-weight: 800; }
.carousel-full .hero-promo .hero-tagline { display: block; margin-top: 4px; font-weight: 500; }
.carousel-full .hero-promo { flex-direction: column; align-items: center; }