    :root{
      --c-bg-dark:#0d0d0d; --c-indigo:#4A46FF; --c-aqua:#00CFC8; --radius:14px;
      --transition:.35s cubic-bezier(.4,.2,.2,1);
    }
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
    html,body{width:100%;overscroll-behavior-x:none;touch-action:pan-y;}
    body{font-family:'Inter',sans-serif;color:#fff;background:var(--c-bg-dark);} 
    img{max-width:100%;display:block;border-radius:var(--radius);}
    a{color:inherit;text-decoration:none;}
    h1,h2,h3{font-weight:800;letter-spacing:-.02em;}
    section{padding:clamp(1.5rem,6vw,4.5rem) 6vw;}
    .btn{display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(135deg,var(--c-indigo),var(--c-aqua));color:#fff;border:none;padding:.9rem 1.4rem;font-weight:600;border-radius:var(--radius);cursor:pointer;transition:var(--transition);}
    .btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.45);}
    .btn:disabled{opacity:.35;cursor:not-allowed;}

    
    /* Hero */
    .hero{padding-top:calc(64px - 0.5rem);}
    .hero h1{font-size:clamp(2rem,9vw,3.6rem);line-height:1.1;background:linear-gradient(90deg,var(--c-indigo),var(--c-aqua));-webkit-background-clip:text;color:transparent;margin-bottom:1rem;text-align:center;}
    .hero p{text-align:center;font-size:1.05rem;color:#c0c0c0;margin-bottom:2rem;}

    /* Swiper tweaks */
    .swiper{width:100%;height:100%;}
    .swiper-slide{display:flex;align-items:center;justify-content:center;}
    .swiper-slide img{width:100%;height:100%;object-fit:cover;}
    .swiper-pagination-bullet{background:#fff;}

    /* Equipment block */
    .equip-grid{gap:1.2rem;}
    .equip-grid article{background:rgba(255,255,255,.04);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;}
    .equip-grid img{height:200px;object-fit:cover;}
    .equip-grid p{padding:1rem;font-size:.9rem;color:#c0c0c0;}
    .equip-text{padding:1rem;font-size:.9rem;color:#c0c0c0;}

    /* Команда block */
    .back-grid{gap:1.2rem;}
    .back-grid article{background:rgba(255,255,255,.04);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;}
    .back-grid img{height:200px;object-fit:cover;}
    .back-grid p{padding:1rem;font-size:.9rem;color:#c0c0c0;}
    .back-position{padding:1rem 1rem 0;font-size:.9rem;color:#c0c0c0;}
    .back-text{padding:1rem;font-size:.9rem;color:#c0c0c0;}
    .works-text{padding:1rem;font-size:.9rem;color:#c0c0c0;}

    /* Works block */
    .works-grid { gap: 1.2rem; }
    .works-grid article {
      background: rgba(255,255,255,.04);
      border-radius: var(--radius);
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    /* scroll-snap container */
    .snap-strip{
      display:flex;
      gap:1rem;
      overflow-x:auto;
      scroll-snap-type:x mandatory;
      padding-bottom:.8rem;
      -ms-overflow-style:none;
      scrollbar-width:none;
    }
    .snap-strip::-webkit-scrollbar{display:none;}
    .snap-strip > *{flex:0 0 80%;scroll-snap-align:center;}
    .snap-strip::after{
      content:'';
      position:sticky;
      right:-1px;top:0;bottom:0;width:24px;
      pointer-events:none;
      background:linear-gradient(to right,transparent 0%,var(--c-bg-dark) 100%);
    }

    /* glass cards */
    .card-glass{
      background:rgba(255,255,255,.05);
      border:1px solid rgba(255,255,255,.08);
      backdrop-filter:blur(12px);
      border-radius:var(--radius);
      overflow:hidden;
      transition:transform .35s cubic-bezier(.4,.2,.2,1);
    }
    @media(hover:hover){.card-glass:hover{transform:translateY(-4px) scale(1.03);}}
    .card-glass img{height:200px;width:100%;object-fit:cover;}

    @media(min-width:768px){
      .snap-strip{
        display:grid;
        grid-template-columns:repeat(4,1fr);
        overflow:visible;
      }
      .snap-strip::after{display:none;}
      .snap-strip > *{
        flex:initial;
        scroll-snap-align:unset;
      }
    }

    /* Rooms & booking */
    .rooms{display:grid;gap:2rem}
    .room-card{background:rgba(255,255,255,.04);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;}
    .room-info{padding:1.2rem;display:flex;flex-direction:column;gap:.65rem}

    /* Styled inputs */
    input[type="date"],input[type="tel"]{
      width:80%;padding:.8rem;border:none;border-radius:var(--radius);
      background:rgba(255,255,255,.04);color:#fff;font:inherit;
    }
    /* phone mask */
    .phone-input{
      font-family:inherit;
      letter-spacing:.02em;          /* равномерный шаг */
    }
    /* календарь‑иконка светлая */
    input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1);cursor:pointer;}

    /* === Date-button === */
    .date-btn{
      width:100%;
      background:rgba(255,255,255,.04);
      border:none;
      border-radius:var(--radius);
      padding:.8rem;
      font:inherit;
      color:#fff;
      text-align:left;
      display:flex;
      justify-content:space-between;
      align-items:center;
      cursor:pointer;
      transition:var(--transition);
    }
    .date-btn::after{
      content:"\1F4C5"; /* 📅 */
      font-size:1.1rem;
      opacity:.7;
    }
    .date-btn:hover{background:rgba(255,255,255,.07);}
    .date-hidden{
      position:absolute;
      opacity:0;
      pointer-events:none;
      width:79%;
      height:0;
    }

    /* Timeline */
    .timeline-wrap{display:none;flex-direction:column;gap:.6rem;margin-top:1rem;}
    .timeline{display:flex;overflow-x:auto;gap:4px;padding:.45rem;border-radius:var(--radius);background:rgba(255,255,255,.03);}
    .slot{flex:0 0 max(60px,7vw);padding:.34rem .2rem;text-align:center;font-size:.75rem;border-radius:var(--radius);user-select:none;white-space:nowrap;}
    .slot.free{background:#1b1b1b;cursor:pointer;}
    .slot.busy{background:#613e3e;opacity:.45;cursor:not-allowed;}
    .slot.selected{background:linear-gradient(135deg,var(--c-indigo),var(--c-aqua));color:#fff;}
    .summary{font-size:.9rem;color:#c0c0c0;}

    /* Showcase videos */
    .card-glass.yt{position:relative;padding-top:0;}
    .case-thumb{display:block;position:relative;}
    .case-thumb .play-btn{
      position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
      width:56px;height:40px;border-radius:50%;background:#ff0000;
      display:flex;align-items:center;justify-content:center;
    }
    .case-thumb .play-btn::before{
      content:'';margin-left:3px;border-style:solid;
      border-width:10px 0 10px 16px;border-color:transparent transparent transparent #fff;
    }

/* About block */
.about{max-width:820px;margin:0 auto;font-size:.9rem;line-height:1.5;color:#c0c0c0;}
.about-card{display:flex;flex-direction:column;overflow:hidden;}
.about-text{padding:1.4rem;display:flex;flex-direction:column;gap:1rem;}
.about-text h2{margin:0 0 .8rem;}
.about-text p{margin:0;}
.highlight{font-weight:600;background:linear-gradient(90deg,var(--c-aqua),var(--c-indigo));-webkit-background-clip:text;color:transparent;}

@media(min-width:768px){
  .about{max-width:none;}
  .about-card{flex-direction:column;}
  .about-text{display:flex;}
}

/* Reviews block */
.reviews{margin-top:3rem;}
.reviews-grid{display:grid;gap:1.2rem;}
blockquote{position:relative;background:rgba(255,255,255,.05);border-radius:var(--radius);padding:1.4rem;font-size:.95rem;line-height:1.45;}
blockquote cite{display:block;margin-top:.6rem;font-size:.85rem;color:#a0a0a0;}

/* More-link */
.more-link{text-align:right;margin-top:1rem;}
.more-link a{font-weight:600;background:linear-gradient(90deg,var(--c-aqua),var(--c-indigo));-webkit-background-clip:text;color:transparent;}

    /* Map */
    .map-box iframe{width:100%;height:420px;border:0;border-radius:var(--radius);}

    /* Footer */


    /* === FEATURES BLOCK === */
    .features{
      display:grid;
      gap:1.6rem;
      grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    }

    .feature{
      display:flex;
      gap:1rem;
      align-items:flex-start;
      padding:1.4rem;
      background:rgba(255,255,255,.04);
      border-radius:var(--radius);
      transition:var(--transition);
    }
    .feature:hover{
      transform:translateY(-4px);
      box-shadow:0 8px 18px rgba(0,0,0,.45);
    }

    /* круглая иконка */
    .feature-icon{
      flex:0 0 48px;
      height:48px;
      border-radius:50%;
      background:linear-gradient(135deg,var(--c-indigo),var(--c-aqua));
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1.6rem;
    }

    .feature-text h3{
      font-size:1rem;
      line-height:1.25;
      margin-bottom:.25rem;
      letter-spacing:-.01em;
    }
    .feature-text p{
      font-size:.85rem;
      color:#c0c0c0;
    }

    /* на десктопе — вертикальная «карточка» */
    @media(min-width:992px){
      .feature{
        flex-direction:column;
        align-items:flex-start;
        padding:1.8rem 1.6rem;
      }
      .feature-icon{
        margin-bottom:.9rem;
        width:56px;height:56px;
        font-size:1.9rem;
      }
    }

    /* Desktop tweaks */
@media(min-width:768px){
      .hero{text-align:left;display:flex;gap:4rem;align-items:center;}
      .hero p{text-align:left;max-width:360px;margin:0;}
      .rooms{grid-template-columns:repeat(2,1fr);}
    }

    /* === BOOKING MODAL === */
    .modal-overlay{
      position:fixed;inset:0;z-index:500;
      display:flex;align-items:center;justify-content:center;
      background:rgba(0,0,0,.55);backdrop-filter:blur(5px);
      opacity:0;pointer-events:none;transition:opacity .35s;
    }
    .modal-overlay.open{opacity:1;pointer-events:auto;}

    .modal{
      width:90vw;max-width:420px;
      background:#0d0d0d;padding:2rem 1.8rem;border-radius:var(--radius);
      display:flex;flex-direction:column;gap:1.1rem;
      animation:scaleIn .35s cubic-bezier(.4,.2,.2,1);
    }
    @keyframes scaleIn{0%{transform:scale(.9);opacity:.4}100%{transform:scale(1);opacity:1}}

    .modal-close{
      position:absolute;top:14px;right:16px;
      background:none;border:none;font-size:1.6rem;line-height:1;color:#fff;
      cursor:pointer;transition:transform .25s;
    }
    .modal-close:hover{transform:scale(1.15)}

    .summary-line{
      display:flex;justify-content:space-between;align-items:center;
      font-size:.95rem;
    }
@media(min-width:768px){
  .modal{padding:2.2rem 2.4rem}
  .modal h3{font-size:1.45rem}
}

/* FAQ block */
.faq{
  background:#0d0d0d;
  color:#fff;
  border-radius:12px;
  padding:clamp(1rem,2vw,2rem);
  max-width:800px;
  margin:3rem auto;
  font-family:"Inter",sans-serif;
}
.faq__title{
  font-size:1.75rem;
  margin:0 0 1rem;
  text-align:center;
}
.faq__item{
  border-bottom:1px solid rgba(255,255,255,.12);
  transition:padding .25s ease;
}
.faq__item:last-of-type{border-bottom:none;}
summary{
  cursor:pointer;
  user-select:none;
  padding:1rem 0;
  list-style:none;
  display:flex;
  align-items:center;
  font-weight:600;
  font-size:1.125rem;
}
summary::-webkit-details-marker{display:none;}
summary::after{
  content:"+";
  margin-left:auto;
  font-weight:400;
  transition:transform .25s ease;
}
details[open] summary::after{transform:rotate(45deg);}
details[open]{padding-bottom:.5rem;}
summary:focus-visible{
  outline:2px solid #00ffd1;
  outline-offset:4px;
}
.faq__item[open] summary{color:#00ffd1;}
.faq__item p{
  margin:.5rem 0 1rem;
  line-height:1.6;
  font-size:1rem;
}
@media(prefers-reduced-motion:reduce){
  summary::after,details[open] summary::after{transition:none;}
}
