/*
 Theme Name: PLAZMA Landing Standalone
 Theme URI: https://hotelplazma.example
 Description: One-page standalone theme for Hotel PLAZMA (Lviv). Keeps aesthetics; UA/RU/EN/PL switch; sliders; placeholders.
 Author: ChatGPT
Version: 1.0.44
 Text Domain: plazma-child
*/

/* Basic resets */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#efe6d7;color:#2b2b2b;font-family:'Lora', serif;line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;height:auto}
.container{width:min(1160px, 92%);margin:0 auto}
.section{padding:56px 0}
.section--tight{padding:32px 0}

/* Header */
.header{position:sticky;top:0;z-index:1000;background:#efe6d7cc;backdrop-filter:saturate(1.1) blur(6px);border-bottom:1px solid #e1d8c8}
.header__inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.logo{font-family:'Cormorant Garamond', serif;font-size:20px;letter-spacing:1px}

.nav a{margin:0 10px;font-size:14px}
.lang{display:flex;gap:6px;align-items:center}
.lang a{padding:4px 7px;border-radius:4px;border:1px solid transparent;font-size:12px}
.lang a.active{border-color:#b59b6a}

/* Hero */
.hero{min-height:58vh;display:grid;place-items:center;background:#e9ddc9 center/cover no-repeat}
.hero__wrap{padding:60px 0;text-align:left}
.hero h1{font-family:'Cormorant Garamond', serif;font-weight:600;font-size:clamp(32px,4.6vw,52px);margin:0 0 10px}
.hero p{max-width:720px;font-size:clamp(15px,1.8vw,18px);opacity:.9;margin:0 0 22px}
.btn{display:inline-block;padding:10px 18px;border:1px solid #b59b6a;border-radius:4px;background:#fff0;cursor:pointer}
.btn:hover{background:#f4ead9}
.btn[aria-disabled="true"]{opacity:.65;cursor:default;pointer-events:none}

/* Rooms */
.rooms{}
.room-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.room{background:#f6efe2;border:1px solid #e1d8c8;border-radius:8px;overflow:hidden;display:flex;flex-direction:column}
.room__slider{position:relative}
.slider{overflow:hidden;border-radius:8px}
.slider-track{display:flex;transform:translateX(0);transition:transform .45s ease}
.slider-track>.ph{flex:0 0 100%;aspect-ratio:1/1;background:#e8dccf center/cover no-repeat;border:1px dashed #d4c6ae}
.slider-arrows{position:absolute;top:50%;left:0;right:0;display:flex;justify-content:space-between;transform:translateY(-50%);pointer-events:none;padding:0 6px}
.slider-arrows button{pointer-events:auto;border:0;background:#f2eadbcc;backdrop-filter:blur(3px);width:34px;height:34px;border-radius:50%}
.room__body{padding:14px}
.room__title{font-weight:600}
.room__meta{font-size:14px;opacity:.85;margin:6px 0 10px}
.room__cap{font-size:13px;opacity:.85}
.room__actions{margin-top:auto;display:flex;justify-content:flex-start;padding:12px 14px 16px;gap:8px}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#483e2a;background:#efe6d7;border:1px solid #e1d8c8;padding:4px 8px;border-radius:20px}
/* Amenities */
.amen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.amen{background:#f6efe2;border:1px solid #e1d8c8;border-radius:8px;padding:14px}
.amen h4{margin:0 0 6px;font-size:15px}

/* Faces */
.faces__media{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.faces__media .ph{aspect-ratio:1/1;background:#e8dcc6;border:1px dashed #d4c6ae;border-radius:6px}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.gallery .tile{background:#e8dcc6;border:1px dashed #d4c6ae;height:180px;border-radius:6px;position:relative}
.tile__cap{position:absolute;left:8px;bottom:8px;font-size:13px;background:#ffffffcc;padding:4px 8px;border-radius:4px}

/* Location */
.map{width:100%;height:320px;border:0;border-radius:8px}

/* Contacts */
.contacts-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}
.card{background:#f6efe2;border:1px solid #e1d8c8;border-radius:8px;padding:14px}
.socials{display:flex;gap:10px;margin-top:6px}
.socials a{padding:6px 10px;border:1px solid #e1d8c8;border-radius:20px;font-size:13px}


/* --- Social icon buttons --- */
.socials a, .contacts__socials a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:transparent;border:0;margin-right:8px}
.socials a:hover, .contacts__socials a:hover{ background:#f6efe2; }
.socials a .icon svg, .contacts__socials a .icon svg{ display:block }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* Footer */
.footer{padding:22px 0;border-top:1px solid #e1d8c8;font-size:13px;text-align:center;opacity:.8}

/* Responsive */
@media (max-width:1024px){
  .room-grid{grid-template-columns:repeat(2,1fr)}
  .faces__media{grid-template-columns:repeat(2,1fr)}
  .contacts-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .amen-grid{grid-template-columns:1fr}

  .room-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .hero{min-height:56vh}
  .nav{display:none}
}


/* Logo weight fix: make "Hotel" and "PLAZMA" same thickness */
.logo{font-family:'Cormorant Garamond', serif;font-weight:600;letter-spacing:1px}
.logo__hotel, .logo__plazma{font-weight:600}





/* Room meta as paragraphs */
.room__cap p{margin:0}



/* --- Hero legibility & brand scrim --- */
.hero{position:relative}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(41,31,16,.58) 0%, rgba(41,31,16,.40) 55%, rgba(41,31,16,.28) 100%);
  pointer-events:none;
  mix-blend-mode:multiply;
}
.hero .container{position:relative; z-index:1}
.hero h1, .hero p{color:#efe6d7; text-shadow:0 2px 10px rgba(0,0,0,.35)}
.hero .btn{background:#efe6d7cc; border-color:#b59b6a}
.hero .btn:hover{background:#f6efe2e6}

/* Slightly stronger scrim on small screens where text sits over busier areas */
@media (max-width:560px){
  .hero::after{
    background: linear-gradient(180deg, rgba(41,31,16,.66) 0%, rgba(41,31,16,.48) 55%, rgba(41,31,16,.34) 100%);
  }
}

/* Images present → hide dashed borders & fit */
.slider-track > .ph[style*='background-image'],
.faces__media .ph[style*='background-image'],
.gallery .tile[style*='background-image']{
  background-position:center; background-size:cover; border:none;
}

/* --- Social brand colors --- */
.socials a:hover, .contacts__socials a:hover{transform:scale(1.04)}


.socials a .logo-img, .contacts__socials a .logo-img{width:100%;height:100%;object-fit:contain;display:block;border-radius:10px}

/* === Tighten spacing for social icons (Instagram + Facebook) === */
.socials, .contacts__socials{
  display:flex;
  align-items:center;
  justify-content:flex-start !important;
  gap:6px; /* adjust to 4px or 2px if you want tighter */
}
.socials a, .contacts__socials a{
  margin-right:0; /* rely on gap */
}

/* Reviews block */
#reviews .reviews__wrap{margin-top:14px}
#reviews .trustindex-widget, #reviews .ti-widget, #reviews [class*="trustindex"]{max-width:100%}

/* Hero highlight + phone under CTA */
.hero__lead{margin:10px 0; font-size:clamp(16px,2.2vw,18px); line-height:1.5}
.hero__hl{font-weight:700;background:none!important;background-image:none!important;box-shadow:none!important;text-decoration:none!important;}
.hero__phone{margin-top:10px}
.hero__tel{font-weight:600; text-decoration:none; border-bottom:1px dotted currentColor}
.hero__tel:hover{border-bottom-style:solid}

/* Hide any RU switcher items injected by plugins */
.lang-item-ru, a[href*='lang=ru'], a[href*='language=ru'], a[data-lang='ru']{display:none!important}


/* === Topbar phone (moved from hero) === */
.topbar, .header__top, .hotbar { width:100%; }
.topbar .topbar__wrap, .header__top .container, .hotbar .container {
  display:flex; align-items:center; gap: 8px; padding:8px 0;
}
.topbar_tel {
  font-weight:600; text-decoration:none; white-space:nowrap;
}
@media (min-width: 769px){
  .topbar .topbar__wrap, .header__top .container, .hotbar .container{
    justify-content:flex-start;
  }
  .topbar_tel{ order:20; }
  .brand, .site-title{ order:30; margin-left:auto; }
}
@media (max-width: 768px){
  .topbar .topbar__wrap, .header__top .container, .hotbar .container{
    flex-wrap:wrap;
  }
  .topbar_tel{ padding:6px 0; display:inline-block; }
}
/* Hide removed hero phone if any cached */
.hero_phone, .hero_tel { display:none !important; }


/* === Topbar ordering tweak: phone BEFORE languages, phone centered === */
@media (min-width: 769px){
  .topbar .lang, .header__top .lang{ order:20; }
  .topbar_tel{ order:15; margin-left:auto; margin-right:auto; }
  .brand, .site-title{ order:30; margin-left:auto; }
}


/* Safety: hide any tel: anchors inside hero */
.hero a[href^="tel:"], .hero_phone { display:none !important; }


/* === Language burger menu === */
.lang-burger { position:relative; display:inline-flex; align-items:center; }
.lang-toggle {
  height:32px;
  border:1px solid rgba(0,0,0,0.15);
  background:#fff;
  cursor:pointer;
  display:inline-flex;
  flex-direction:row;           /* ensure caret is to the right */
  align-items:center;
  gap:8px;
  padding:0 10px;
  border-radius:6px;
  line-height:1;
  font-weight:600;
}
.lang-toggle:focus { outline:2px solid rgba(0,0,0,0.3); outline-offset:2px; }
.burger-line { display:block; height:3px; width:100%; background:currentColor; border-radius:2px; }
.lang-menu {
  position:absolute; top:110%; right:0; background:#fff; border:1px solid rgba(0,0,0,0.1);
  box-shadow:0 6px 24px rgba(0,0,0,0.12); border-radius:8px; padding:8px; min-width:120px; z-index:1000;
}
.lang-menu .lang-link {
  display:block; padding:8px 10px; text-decoration:none;
}
.lang-menu .lang-link:hover { background:rgba(0,0,0,0.05); }
/* Keep burger where languages used to be */
@media (min-width: 769px){
  .lang-burger { order:20; }
}


/* === Language button: text + caret === */
.lang-toggle {
  height:32px; border:1px solid rgba(0,0,0,0.15); background:#fff;
  cursor:pointer; display:inline-flex; align-items:center; gap:8px;
  padding:0 10px; border-radius:6px; line-height:1; font-weight:600;
}
.lang-toggle:focus { outline:2px solid rgba(0,0,0,0.3); outline-offset:2px; }
.lang-current { display:inline-block;  text-transform:uppercase;}
.caret {
  width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent;
  border-top:6px solid currentColor; display:inline-block;
}
/* Hide legacy burger bars if cached */
.burger-line { display:none !important; }

.caret{ display:inline-block; vertical-align:middle; margin-top:0; }
.lang-current{ display:inline-block; }


/* === Desktop-only: add space between logo and nav (Rooms) === */
@media (min-width: 1025px){
  .header__inner .logo{ margin-right: 18px; } /* creates a clear gap before Rooms */
}


/* === Desktop-only: move hot bar buttons (nav/phone/lang) to the right === */
@media (min-width: 1025px){
  .header__inner{ display:flex; align-items:center; }
  .header__inner .nav{ margin-left:auto; }        /* pushes Rooms (and other nav) to the right */
  .header__inner .topbar_tel{ margin-left:12px; } /* small gap between nav and phone */
  .header__inner .lang-burger{ margin-left:8px; } /* tiny gap between phone and language button */
}


/* === Desktop-only: phone centered between Contacts (last nav) and Language === */
@media (min-width: 1025px){
  .header__inner{ display:flex; align-items:center; }
  .header__inner .nav{ margin-left:auto; display:flex; gap: 0; } /* pack nav items tightly unless styled elsewhere */
  .header__inner .nav a:last-child{ margin-right: 12px; }       /* space after Contacts */
  .header__inner .topbar_tel{ margin: 0 12px; }                 /* equal spacing left/right -> centered visually */
  .header__inner .lang-burger{ margin-left: 0; }                /* no extra gap beyond phone's right margin */
}



/* === Desktop-only override: restore nav to the left, keep phone between Contacts and Language === */
@media (min-width: 1025px){
  .header__inner{ display:flex; align-items:center; }
  .header__inner .nav{ margin-left: 0; }          /* move buttons back left */
  .header__inner .nav a:last-child{ margin-right: 12px; } /* keep spacing before phone */
  .header__inner .topbar_tel{ margin: 0 12px; }   /* keep phone centered between nav and language */
  .header__inner .lang-burger{ margin-left: 0; }  /* snug to phone on the right */
}



/* === Mobile Sticky Booking Bar === */
@media (max-width: 768px){
  body{ padding-bottom:72px; }
  .mobile-sticky-bar{
    position:fixed; left:0; right:0; bottom:0; z-index:9999;
    background:#efe6d7cc; border-top:1px solid #e1d8c8;
    box-shadow:0 -8px 24px rgba(0,0,0,0.08);
  }
  .mobile-sticky-wrap{
    max-width: var(--container, 1200px);
    margin:0 auto; padding:10px 16px; display:flex; justify-content:center;
  }
  .mobile-sticky-btn{
    display:inline-flex; align-items:center; gap:10px; text-decoration:none;
    font-weight:700; line-height:1; background:#111; color:#fff;
    padding:14px 18px; border-radius:12px;
  }
  .mobile-sticky-btn .badge{
    display:inline-block; background:#fff; color:#111; font-weight:800;
    padding:6px 8px; border-radius:8px; line-height:1;
  }
}

/* === v1.0.44z13: smaller mobile sticky CTA === */
@media (max-width: 768px){
  .mobile-sticky-btn{ font-size:14px; gap:8px; }
  .mobile-sticky-btn .badge{ font-size:12px; }
}


/* === v1.0.44z16: full-bar clickable sticky CTA === */
@media (max-width: 768px){
  body{ padding-bottom:60px; } /* safe space above bar */
  .mobile-sticky-bar{
    position:fixed; left:0; right:0; bottom:0; z-index:9999;
    background:#efe6d7cc; border-top:1px solid #e1d8c8;
    box-shadow:0 -8px 24px rgba(0,0,0,0.08);
  }
  .mobile-sticky-full{
    display:flex; align-items:center; justify-content:center; gap:10px;
    width:100%; padding: 18px 16px; text-decoration:none;
    color:#000; font-weight:700; line-height:1;
  }
  .mobile-sticky-full .badge{
    display:inline-block; background:#fff; color:#111; font-weight:800;
    padding:4px 6px; border-radius:6px; border:1px solid rgba(0,0,0,0.12);
  }
  .mobile-sticky-full .label{ color:inherit; }
}


/* === v1.0.44z17: sticky bar plain text, smaller, not bold === */
@media (max-width: 768px){
  .mobile-sticky-full{
    display:flex; align-items:center; justify-content:center;
    width:100%; padding: 18px 16px; text-decoration:none;
    color:#000; font-weight:400; line-height:1.2; gap:0;
  }
  .mobile-sticky-full .label{
    font-size:14px; font-weight:400; color:inherit;
  }
}

@media (max-width: 768px){
  .mobile-sticky-full{ display:flex; align-items:center; justify-content:center; }
}

:root{ --plz-accent:#8A6B3A; }
@media (max-width:768px){
  .mobile-sticky-full .pct{
    padding:.08em .40em; border-radius:.6em;
    background:#fff; color:#111; font-weight:600;
    box-shadow:0 1px 0 rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.10) inset;
  }
}
@media (max-width:768px) and (prefers-reduced-motion:no-preference){
  .mobile-sticky-full .pct{ animation:pctPop .9s cubic-bezier(.2,.8,.2,1) 1 both; }
  @keyframes pctPop{
    0%{ transform:scale(.96); box-shadow:0 0 0 0 rgba(138,107,58,.0); }
    60%{ transform:scale(1.05); box-shadow:0 0 0 8px rgba(138,107,58,.08); }
    100%{ transform:scale(1); box-shadow:0 0 0 0 rgba(138,107,58,.0); }
  }
}


/* === v1.0.44z18-A2: chip color tweak only === */
@media (max-width: 768px){
  .mobile-sticky-full .pct{
    background:#726457 !important;  /* new box color */
    color:#E1D8C8 !important;       /* beige text */
  }
}



/* === v1.0.44z18-A3: 25% chip text white === */
@media (max-width: 768px){
  .mobile-sticky-full .pct{ color:#ffffff !important; }
}