/* mobile.css — адаптив 390-767 (Figma Mobile 390) + tablet 768-1023 */

/* Small tweaks up to 1200 */
@media (max-width:1200px){
  :root{--gutter-x:40px;--fs-h1:52px;--fs-h2:40px;}
  .hero-title{font-size:48px;}
  .services-viewport .service-slide{flex-basis:calc((100% - 40px)/3);}
  .contacts-grid{grid-template-columns:1fr;gap:40px;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px;}
  .amenities-grid{grid-template-columns:repeat(3,1fr);}
  .nav{display:none;}
  .burger{display:grid;}
}

/* Tablet 768-1023 */
@media (max-width:1023px){
  :root{--gutter-x:24px;}
  .two-col{grid-template-columns:1fr;gap:40px;}
  .two-col.reverse .two-col-media{order:0;}
  .pools-grid,.tariff-grid,.rooms-grid{grid-template-columns:1fr;}
  .services-viewport .service-slide{flex-basis:calc((100% - 20px)/2);}
  .header-phones{display:none;}
}

/* Proportional version of the 1440 px desktop frame.
   Every measurement uses the same 1:1440 scale, so sections do not deform. */
@media (min-width:768px) and (max-width:1439px){
  /* Blocks 04-13 keep the exact 1440px Figma geometry and scale as one
     desktop canvas. This prevents fixed cards from escaping narrower
     desktop/browser panels while preserving every original proportion. */
  .about2,.pools,.tariffs,.rooms,.services,.stay,.restaurant,.faq,.contacts,.ft{
    width:1440px;
    max-width:none;
    zoom:calc(100vw / 1440px);
  }

  /* 01 Hero */
  .hero{height:59.028vw;}
  .site-header{padding:1.667vw 5.556vw 0;}
  .header-pill{padding:1.111vw;}
  .header-left{gap:8.333vw;}
  .brand{gap:.833vw;}
  .brand-logo,.brand-logo img{width:3.333vw;height:3.333vw;}
  .brand-name{font-size:1.25vw;letter-spacing:.025vw;}
  .nav{
    display:flex;width:29.236vw;height:1.181vw;gap:2.222vw;
    font-size:.972vw;
  }
  .nav a{font-size:.972vw;}
  .header-right{display:flex;gap:1.667vw;}
  .header-phones{
    display:flex;width:6.944vw;gap:.139vw;font-size:.903vw;
  }
  .burger{display:none;}
  .header-right .btn-s{
    padding:.972vw 1.389vw;border-radius:3.472vw;
    font-size:.972vw;line-height:1.25vw;
  }

  .water-shape{
    left:5.556vw;width:48.611vw;height:31.528vw;
  }
  .water-shape .ws-content{
    left:5.208vw;top:4.931vw;width:38.194vw;gap:2.778vw;
  }
  .hero-title-block{width:38.194vw;gap:.556vw;}
  .hero-text{width:38.194vw;gap:1.111vw;}
  .eyebrow-badge{
    padding:.556vw 1.111vw;border-radius:1.111vw;
    font-size:.764vw;line-height:.833vw;letter-spacing:.046vw;
  }
  .hero-title{font-size:3.472vw;line-height:4.167vw;}
  .hero-title p{line-height:4.167vw;}
  .hero-desc{font-size:1.181vw;line-height:1.736vw;}
  .hero-buttons{gap:1.111vw;}
  .hero-buttons .btn-m{
    padding:1.25vw 1.667vw;border-radius:3.472vw;
    font-size:1.111vw;line-height:1.389vw;
  }

  /* 02 Amenities */
  .amenities{margin-top:-4.089vw;}
  .am-top-wave{width:100%;height:4.089vw;}
  .am-bot-wave{width:100%;height:5.039vw;}
  .am-top-wave img,.am-bot-wave img{width:100%;height:100%;max-width:none;}
  .am-container{
    width:100%;height:25.455vw;padding:2.778vw 5.556vw;gap:2.778vw;
  }
  .am-heading{width:18.958vw;gap:1.111vw;}
  .am-eyebrow{
    font-size:.764vw;line-height:.833vw;letter-spacing:.061vw;
  }
  .am-title{font-size:2.222vw;line-height:2.639vw;}
  .am-grid{gap:1.667vw;}
  .am-card{
    height:9.722vw;padding:1.389vw 1.389vw 2.778vw;
    gap:.278vw;border-width:.104vw;border-radius:1.389vw;
  }
  .am-card .am-icon{width:2.361vw;height:2.361vw;}
  .am-card h4{
    height:1.528vw;font-size:1.111vw;line-height:1.458vw;
    white-space:nowrap;
  }
  .am-card p{font-size:.833vw;line-height:1.111vw;}

  /* 03 About */
  .about-section{
    width:100%;padding:10.417vw 5.556vw;
    justify-content:flex-start;gap:9.236vw;
  }
  .about-photo{width:43.611vw;height:30.139vw;}
  .about-text{width:36.042vw;gap:5.556vw;}
  .about-text .at-block{gap:2.778vw;}
  .about-text .at-head{gap:1.111vw;}
  .about-text .at-eyebrow{
    font-size:.764vw;line-height:.833vw;letter-spacing:.061vw;
  }
  .about-text .at-title{font-size:3.056vw;line-height:3.333vw;}
  .about-text .at-desc{font-size:1.181vw;line-height:1.736vw;}
  .about-text .at-rule{width:22.778vw;gap:1.389vw;}
  .about-text .at-rule .at-line{width:5.139vw;height:.208vw;}
  .about-text .at-rule .at-tag{font-size:1.042vw;line-height:1.528vw;}
  .about-photo .ab-play{width:5.347vw;height:5.347vw;}
}

/* Mobile 390-767: exact Figma frames 01, 02 and 03 */
@media (max-width:767px){
  :root{--gutter-x:16px;--fs-h1:36px;--fs-h2:32px;--fs-h3:22px;}

  body{background:#fbfeff;}
  .page{width:100%;max-width:none;min-width:320px;margin:0;background:#fbfeff;}

  /* 01 Hero, 390 × 844 */
  .hero{
    width:100%;height:844px;min-height:844px;padding:0;
    background:#f0f7ff;overflow:hidden;
  }
  .hero-photo::after{background:rgba(10,54,108,.4);}
  .hero-photo img{object-position:54% center;}

  .site-header{
    position:fixed;top:0;left:0;right:0;width:100%;max-width:none;
    transform:none;padding:16px 16px 0;z-index:100;
  }
  .header-pill{
    width:100%;height:66px;padding:12px 16px;gap:12px;
    background:rgba(255,255,255,.7);border-color:rgba(9,105,209,.25);
    position:relative;
  }
  .header-left{gap:0;position:static;}
  .brand{gap:12px;}
  .brand-logo,.brand-logo img{width:40px;height:40px;}
  .brand-name{font-size:16px;letter-spacing:.32px;}
  .nav,.header-right{display:none;}
  .nav.mobile-open{
    display:flex;position:absolute;top:calc(100% + 8px);left:0;
    width:100%;height:calc(100vh - 106px);height:calc(100dvh - 106px);max-height:none;
    padding:28px 20px 32px;gap:24px;overflow-x:hidden;overflow-y:auto;
    flex-direction:column;align-items:flex-start;justify-content:flex-start;
    background:#fff;border:1px solid rgba(9,105,209,.2);border-radius:16px;
    box-shadow:var(--sh-md);
  }
  .nav.mobile-open > a{width:100%;font-size:15px;line-height:20px;}
  .nav.mobile-open > a::after{display:none;}
  .mobile-nav-extra{
    display:flex;width:100%;margin-top:auto;padding-top:24px;border-top:1px solid rgba(9,105,209,.14);
    flex-direction:column;gap:18px;align-items:stretch;
  }
  .mobile-nav-phones{display:flex;flex-direction:column;gap:8px;}
  .mobile-nav-phones a{
    width:100%;font-size:15px;line-height:20px;font-weight:600;color:var(--text-primary);text-align:center;
  }
  .mobile-nav-phones a::after,.mobile-nav-social a::after,.mobile-nav-booking::after{display:none;}
  .mobile-nav-booking{width:100%;height:48px;padding:14px 20px;font-size:15px;color:#fff!important;}
  .mobile-nav-social{display:flex;gap:12px;align-items:center;justify-content:center;}
  .mobile-nav-social a{
    display:grid;width:42px;height:42px;place-items:center;border-radius:50%;background:var(--blue-700);
    transition:transform var(--dur-fast) var(--ease-out),background var(--dur-fast);
  }
  .mobile-nav-social a:active{transform:scale(.94);}
  .mobile-nav-social img{display:block;width:20px;height:20px;}
  body.mobile-menu-open{overflow:hidden;}
  .burger{
    display:flex;width:36px;height:36px;padding:8px;border-radius:8px;
    background:#edf9ff;align-items:center;justify-content:center;flex:0 0 36px;
  }
  .burger img{width:20px;height:20px;}

  .water-shape{
    left:16px;top:170px;transform:none;width:calc(100% - 32px);height:426px;
    padding:0;border:1px solid rgba(255,255,255,.15);border-radius:30px;
    background:rgba(255,255,255,.08);backdrop-filter:blur(12px);
    box-shadow:0 -10px 32px rgba(0,0,0,.25);
  }
  .water-shape .ws-bg,.water-shape .ws-line-1,.water-shape .ws-line-2{display:none;}
  .water-shape .ws-content{
    left:24px;top:24px;width:calc(100% - 48px);gap:24px;
  }
  .hero-title-block{width:100%;gap:16px;}
  .hero-text{width:100%;gap:12px;}
  .eyebrow-badge{
    align-self:flex-start;padding:6px 12px;border:1px solid #71c2ff;
    border-radius:100px;background:rgba(113,194,255,.2);color:#71c2ff;
  }
  .hero-title{font-size:36px;line-height:40px;color:#fff;letter-spacing:-.18px;}
  .hero-title p{line-height:40px;}
  .hero-desc{font-size:14px;line-height:22px;color:#e2edf7;}
  .hero-buttons{width:100%;flex-direction:column;gap:10px;}
  .hero-buttons .btn{width:100%;height:56px;padding:18px 24px;}

  .hero-bottom-wave{
    inset:auto;left:-665px;top:750px;width:1442px;height:217px;
  }
  .hero-bottom-wave picture,.hero-bottom-wave img{width:100%;height:100%;max-width:none;}

  /* 02 Amenities, top 824, height 797 */
  .amenities{
    width:100%;margin-top:-60px;padding:0;display:flex;position:relative;z-index:2;
  }
  .am-top-wave,.am-bot-wave{width:100%;height:60px;}
  .am-top-wave img,.am-bot-wave img{width:100%;height:60px;max-width:none;}
  .am-bot-wave img{transform:scaleY(-1);}
  .am-container{width:100%;height:677px;padding:40px 16px;gap:40px;}
  .am-heading{width:100%;height:104px;gap:16px;}
  .am-eyebrow{font-size:11px;line-height:12px;letter-spacing:.88px;}
  .am-title{width:227px;font-size:26px;line-height:38px;}
  .am-grid{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;width:100%;height:453px;align-items:stretch;
  }
  .am-card{
    width:auto;height:143px;min-width:0;padding:20px 20px 40px;gap:4px;
    border-width:1.5px;border-radius:20px;
  }
  .am-card:hover{transform:none;background:transparent;}
  .am-card .am-icon{width:34px;height:34px;}
  .am-card h4{height:22px;font-size:16px;line-height:21px;white-space:nowrap;}
  .am-card p{font-size:12px;line-height:16px;}

  /* 03 About, top 1621, height 895 */
  .about-section{
    width:100%;height:895px;padding:100px 16px;
    display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;
    gap:60px;background:#fff;
  }
  .about-text{order:1;width:100%;height:335px;gap:40px;}
  .about-text .at-block{width:100%;gap:32px;}
  .about-text .at-head{gap:16px;}
  .about-text .at-title{font-size:32px;line-height:40px;}
  .about-text .at-desc{font-size:17px;line-height:25px;}
  .about-text .at-rule{width:328px;max-width:100%;gap:20px;}
  .about-photo{order:2;width:100%;height:300px;}
  .about-photo .ab-vec-1{left:-6px;right:0;transform:translate(6px,-2px) scaleX(-1);}
  .about-photo .ab-vec-2{left:-6px;right:13.81%;transform:translateX(6px) scaleX(-1);}
  .about-photo .ab-vec-1>div{inset:-1.19% -.43%;}
  .about-photo .ab-vec-2>div{inset:-.96% -.49%;}
  .about-photo .ab-img{inset:2.3% 0 2.3% 7px;overflow:visible;border-radius:0;}
  .about-photo .ab-img img{width:100%;height:100%;object-fit:fill;transform:scaleX(-1);}
  .about-photo .ab-play{width:77px;height:77px;}

  /* 04 About 2, top 2516, height 900 */
  .about2{width:100%;height:900px;overflow:hidden;}
  .about2 .a2-top,.about2 .a2-bot{width:100%;height:60px;}
  .about2 .a2-top img{content:url('../assets/figma-rest/mobile-wave-top-a2.svg');}
  .about2 .a2-bot img{content:url('../assets/figma-rest/mobile-wave-bottom-a2.svg');transform:rotate(180deg);}
  .about2 .a2-container{height:780px;padding:60px 16px;gap:60px;flex-direction:column;align-items:flex-start;justify-content:flex-start;}
  .about2 .a2-text{width:100%;height:300px;gap:40px;}
  .about2 .a2-text .a2-block{gap:32px;}
  .about2 .a2-text .a2-title{font-size:32px;line-height:40px;}
  .about2 .a2-text .a2-desc{font-size:17px;line-height:25px;}
  .about2 .a2-photo{width:100%;height:300px;}
  .about2 .a2-photo .a2-vec-1{transform:translate(6px,-12px);}
  .about2 .a2-photo .a2-vec-2{transform:translate(6px,12px);}
  .about2 .a2-photo .a2-img{inset:2.02% 1.65% 2.76% 0;overflow:visible;border-radius:0;}
  .about2 .a2-photo .a2-img picture,.about2 .a2-photo .a2-img img{width:100%;height:100%;display:block;}
  .about2 .a2-photo .a2-img img{object-fit:fill;}

  /* 05 Pools, top 3416, height 1142 */
  .pools{width:100%;height:1142px;padding:100px 16px;gap:40px;align-items:center;overflow:hidden;}
  .pools .p-heading{width:100%;gap:24px;text-align:center;}
  .pools .p-head{width:100%;gap:16px;}
  .pools .p-title{font-size:32px;line-height:40px;}
  .pools .p-desc{font-size:17px;line-height:25px;}
  .pools .p-cards{width:100%;flex-direction:column;gap:40px;align-items:flex-start;}
  .pools .p-card{width:100%;gap:12px;}
  .pools .p-card.right{align-items:flex-end;}
  .pools .p-photo{width:100%;height:300px;}
  .pools .p-photo .p-img{border-radius:0;}
  .pools .p-info{padding-bottom:40px;}
  .pools .p-card.left .p-info{padding-left:24px;}
  .pools .p-card.right .p-info{padding-right:24px;}
  .pools .p-chip{height:36px;padding:9px 12px;}

  /* 06 Tariffs, top 4578, height 1183 */
  .tariffs{width:100%;height:1183px;margin-top:20px;overflow:hidden;}
  .tariffs .tr-top,.tariffs .tr-bot{width:100%;height:60px;}
  .tariffs .tr-top img{content:url('../assets/figma-rest/mobile-wave-top-tariffs.svg');}
  .tariffs .tr-bot img{content:url('../assets/figma-rest/mobile-wave-bottom-tariffs.svg');transform:rotate(180deg);}
  .tariffs .tr-container{height:1063px;padding:60px 16px;gap:40px;}
  .tariffs .tr-heading,.tariffs .tr-head{width:100%;align-items:center;text-align:center;}
  .tariffs .tr-title{font-size:32px;line-height:40px;}
  .tariffs .tr-desc{font-size:17px;line-height:25px;white-space:normal;text-align:center;}
  .tariffs .tr-prices{width:100%;flex-direction:column;gap:24px;}
  .tariffs .tr-card{width:100%;height:334px;padding:32px;border-radius:30px;}
  .tariffs .tr-label{height:29px;}
  .tariffs .tr-price{height:223px;}
  .tariffs .tr-rows{height:179px;}
  .tariffs .tr-list{height:153px;}
  .tariffs .tr-row{height:38px;padding:0;flex-shrink:0;}
  .tariffs .tr-row:nth-child(3){height:39px;}
  .tariffs .tr-note{height:18px;}
  .tariffs .tr-price h3{font-size:26px;line-height:32px;}
  .tariffs .tr-row .price{font-size:17px;}

  /* 07 Rooms, top 5761, height 1626 */
  .rooms{width:100%;height:1626px;padding:100px 16px;gap:40px;background:#fbfeff;overflow:hidden;}
  .rooms .rm-head-wrap,.rooms .rm-heading{width:100%;padding:0;align-items:center;text-align:center;}
  .rooms .rm-title{font-size:32px;line-height:40px;}
  .rooms .rm-desc{font-size:17px;line-height:25px;}
  .rooms .rm-desc-extra{display:none;}
  .rooms .rm-cards-wrap,.rooms .rm-cards{width:100%;padding:0;}
  .rooms .rm-cards{flex-direction:column;gap:40px;}
  .rooms .rm-card{width:100%;border:0;border-radius:30px;box-shadow:0 14px 30px rgba(41,163,186,.12);}
  .rooms .rm-photo{width:100%;height:230px;}
  .rooms .rm-photo img{width:100%;height:100%;object-fit:cover;}
  .rooms .rm-wave{left:0;right:-2px;bottom:-1px;overflow:visible;}
  .rooms .rm-wave img{width:calc(100% + 2px);max-width:none;}
  .rooms .rm-dots{bottom:27px;gap:4px;}
  .rooms .rm-dots .dot{width:10px;height:10px;}
  .rooms .rm-body{padding:20px;gap:0;}
  .rooms .rm-info{gap:0;}
  .rooms .rm-head-row{display:contents;}
  .rooms .rm-name{font-size:26px;line-height:32px;}
  .rooms .rm-price{font-size:26px;line-height:32px;margin-top:40px;}
  .rooms .rm-name{order:1;}
  .rooms .rm-descline{order:2;margin-top:8px;font-weight:500;font-size:13px;line-height:20px;}
  .rooms .rm-specs{order:3;margin-top:16px;gap:8px;}
  .rooms .rm-spec{height:36px;padding:8px 12px;background:#72bfff;color:#fff;}
  .rooms .rm-spec svg{stroke:#fff;}
  .rooms .rm-spec p{font-size:13px;line-height:20px;color:#fff;}
  .rooms .rm-amenities{order:4;margin-top:32px;gap:0;justify-content:space-between;width:100%;}
  .rooms .rm-amenity{gap:4px;}
  .rooms .rm-amenity svg{width:14px;height:14px;}
  .rooms .rm-amenity p{font-size:11px;line-height:12px;}
  .rooms .rm-price{order:5;}
  .rooms .rm-cta{height:56px;margin-top:24px;width:100%;}

  /* 08 Services, top 7387, height 770 */
  .services{width:100%;height:770px;overflow:hidden;}
  .services .sv-top,.services .sv-bot{width:100%;height:60px;}
  .services .sv-top img{content:url('../assets/figma-rest/mobile-wave-top-services.svg');}
  .services .sv-bot img{content:url('../assets/figma-rest/mobile-wave-bottom-services.svg');transform:rotate(180deg);}
  .services .sv-container{height:650px;padding:60px 16px;gap:40px;}
  .services .sv-heading{width:100%;gap:16px;}
  .services .sv-title{font-size:32px;line-height:40px;}
  .services .sv-row{
    width:100%;display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto 16px;
    column-gap:0;row-gap:24px;
    justify-content:start;align-items:center;
  }
  .services .sv-row{overflow:hidden;padding-top:8px;margin-top:-8px;}
  .services .sv-viewport{grid-column:1 / -1;grid-row:1;width:100%;padding:0;margin:0;overflow:hidden;justify-self:stretch;}
  .services .sv-cards{width:max-content;gap:12px;align-items:stretch;will-change:transform;touch-action:pan-y;}
  .services .sv-card{flex:0 0 calc((100vw - 44px) / 2);width:calc((100vw - 44px) / 2);border-radius:30px;min-width:0;}
  .services .sv-photo{height:150px;}
  .services .sv-card-salt .sv-photo>img{object-fit:contain;object-position:center;background:#c6b29f;}
  .services .sv-text{padding:12px 16px 32px;gap:8px;}
  .services .sv-text h4{font-size:20px;line-height:24px;}
  .services .sv-arrow{display:none;}
  .services .sv-arrow:disabled{opacity:.4;cursor:default;}
  .services .sv-dots{grid-column:1;grid-row:2;display:flex;align-items:center;justify-content:center;gap:8px;}
  .services .sv-dot{width:8px;height:8px;border-radius:50%;background:#b8d8f3;transition:width var(--dur-fast),background var(--dur-fast);}
  .services .sv-dot.is-active{width:22px;border-radius:100px;background:var(--blue-500);}

  .video-modal{padding:16px;}
  .video-dialog{border-radius:18px;}
  .video-close{top:8px;right:8px;width:40px;height:40px;font-size:28px;}

  .booking-modal{padding:16px;align-items:flex-end;}
  .booking-dialog{width:100%;padding:38px 24px 24px;border-radius:28px 28px 0 0;}
  .booking-close{top:12px;right:12px;}
  .booking-title,.booking-success h2{font-size:32px;line-height:38px;}
  .booking-intro{font-size:15px;line-height:22px;padding-right:12px;}
  .booking-form{margin-top:22px;gap:12px;}
  .booking-dates{display:flex;flex-direction:column;width:100%;min-width:0;gap:12px;}
  .booking-dates .booking-field,.booking-date-shell,.booking-date-shell input[type="date"]{width:100%;min-width:0;max-width:100%;}
  .booking-date-shell{height:54px;flex:0 0 54px;}
  .booking-field input{height:54px;}
  .booking-success{padding-top:8px;}

  /* 09 Stay, top 8157, height 1014 */
  .stay{width:100%;height:1014px;padding:100px 16px;gap:60px;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow:hidden;}
  .stay .st-text{order:1;width:100%;gap:40px;}
  .stay .st-block{gap:32px;}
  .stay .st-head{gap:16px;}
  .stay .st-title{font-size:32px;line-height:40px;}
  .stay .st-desc{font-size:17px;line-height:25px;margin-bottom:8px;}
  .stay .st-features{gap:12px;align-items:flex-start;}
  .stay .st-feature{gap:8px;}
  .stay .st-rule{gap:20px;}
  .stay .st-photo{order:2;width:100%;height:300px;}
  .stay .st-photo .st-vec-1,
  .stay .st-photo .st-vec-2{transform:translateX(14px);}
  .stay .st-photo .st-img{left:8px;right:-8px;border-radius:0;}

  /* 10 Restaurant, top 9171, height 960 */
  .restaurant{width:100%;height:960px;overflow:hidden;}
  .restaurant .rs-top,.restaurant .rs-bot{width:100%;height:60px;}
  .restaurant .rs-top img{content:url('../assets/figma-rest/mobile-wave-top-restaurant.svg');}
  .restaurant .rs-bot img{content:url('../assets/figma-rest/mobile-wave-bottom-restaurant.svg');transform:rotate(180deg);}
  .restaurant .rs-container{height:840px;padding:60px 16px;gap:60px;flex-direction:column;align-items:flex-start;justify-content:flex-start;}
  .restaurant .rs-text{width:100%;gap:40px;}
  .restaurant .rs-block{gap:32px;}
  .restaurant .rs-title{font-size:32px;line-height:40px;}
  .restaurant .rs-desc{font-size:17px;line-height:25px;}
  .restaurant .rs-tags{display:grid;grid-template-columns:1fr 143px;gap:16px 12px;}
  .restaurant .rs-tag.t1,.restaurant .rs-tag.t2,.restaurant .rs-tag.t3{width:auto;}
  .restaurant .rs-tag.t3{grid-column:1 / -1;justify-self:center;}
  .restaurant .rs-photo-wrap,.restaurant .rs-photo{width:100%;height:300px;}
  .restaurant .rs-photo .rs-img{border-radius:0;}

  /* 11 FAQ, top 10131, height 688 */
  .faq{width:100%;height:688px;padding:100px 16px;gap:40px;overflow:hidden;}
  .faq .fq-heading,.faq .fq-list{width:100%;}
  .faq .fq-title{font-size:32px;line-height:40px;}
  .faq .fq-list{gap:12px;}
  .faq .fq-item,.faq .fq-item[open]{border-radius:50px;box-shadow:none;}
  .faq .fq-item summary{padding:16px 24px;gap:24px;white-space:normal;}
  .faq .fq-item summary .q{font-size:17px;line-height:25px;}
  .faq:has(.fq-item[open]){height:auto;overflow:visible;}

  /* 12 Contacts, top 10819, height 905.43 */
  .contacts{width:100%;height:905.43px;overflow:hidden;}
  .contacts .ct-top{width:100%;height:60px;}
  .contacts .ct-top img{content:url('../assets/figma-rest/mobile-wave-top-contacts.svg');}
  .contacts .ct-container{height:845.43px;padding:60px 16px 100px;gap:60px;flex-direction:column;align-items:flex-start;justify-content:flex-start;}
  .contacts .ct-text{width:100%;gap:40px;}
  .contacts .ct-title{font-size:32px;line-height:40px;}
  .contacts .ct-list{width:100%;gap:32px;}
  .contacts .ct-block h5{font-size:14px;line-height:17px;}
  .contacts .ct-block .val{font-size:17px;line-height:25px;}
  .contacts .ct-map{width:100%;height:239px;border-radius:30px;}
  .contacts .ct-map .map-bg{width:358px;height:239px;}
  .contacts .ct-map .map-label{left:18px;top:14px;font-size:12px;}

  /* 13 Footer, top 11724, height 793.5 */
  .ft{width:100%;height:793.5px;margin-top:-47px;overflow:hidden;position:relative;z-index:2;}
  .ft .ft-top{width:100%;height:47px;}
  .ft .ft-top img{content:url('../assets/figma-rest/mobile-wave-footer.svg');}
  .ft .ft-container{height:747px;padding:40px 16px;gap:60px;align-items:center;}
  .ft .ft-row1{flex-direction:column;align-items:center;gap:32px;}
  .ft .ft-logo{flex-direction:column;gap:12px;text-align:center;}
  .ft .ft-logo .tx{align-items:center;}
  .ft .ft-logo .tx h4{line-height:20px;}
  .ft .ft-menu{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:60px 0;text-align:center;}
  .ft .ft-col{width:auto!important;align-items:center;gap:16px;}
  .ft .ft-col h5{font-size:16px;line-height:20px;letter-spacing:1.28px;}
  .ft .ft-col .list{gap:12px;}
  .ft .ft-col .list a{font-size:14px;line-height:17px;}
  .ft .ft-col.c-cont{grid-column:1 / -1;}
  .ft .ft-col.c-cont .phones{gap:12px;align-items:center;}
  .ft .ft-col.c-cont .phones a{font-size:14px;line-height:17px;}
  .ft .ft-social{margin-top:0;}
  .ft .ft-row2{flex-direction:column;gap:12px;align-items:center;text-align:center;}
}

/* Narrow phones: preserve the proportions of the 390 px Figma frame
   instead of stretching its shaped photos and fixed-height content. */
@media (max-width:389px){
  :root{
    --mobile-content-w:calc(100vw - 32px);
    --mobile-shaped-h:calc(var(--mobile-content-w) * 300 / 358);
    --mobile-room-photo-h:calc(var(--mobile-content-w) * 230 / 358);
  }

  .water-shape{top:calc(155px + (100vw - 320px) * .2143);height:426px;}
  .water-shape .ws-content{left:16px;top:20px;width:calc(100% - 32px);gap:20px;}
  .hero-title-block{gap:14px;}
  .hero-text{gap:10px;}
  .eyebrow-badge{padding:5px 10px;font-size:10px;}
  .hero-title,.hero-title p{font-size:32px;line-height:36px;}
  .hero-desc{font-size:13px;line-height:20px;}
  .hero-buttons{gap:8px;}

  .amenities,.am-container,.am-heading,.am-grid{height:auto;}
  .am-container{padding:40px 16px;}
  .am-grid{grid-auto-rows:minmax(143px,auto);}
  .am-card{height:auto;min-height:143px;padding:18px 16px 28px;}
  .am-card h3{height:auto;font-size:14px;line-height:19px;white-space:normal;}
  .am-card p{font-size:11px;line-height:15px;}
  .am-bot-wave img{transform:scaleY(-1);}

  .about-section{height:auto;}
  .about-text{height:auto;}
  .about-photo{height:var(--mobile-shaped-h);}

  .about2,.about2 .a2-container,.about2 .a2-text{height:auto;}
  .about2 .a2-photo{height:var(--mobile-shaped-h);}

  .pools{height:auto;}
  .pools .p-heading,.pools .p-cards{height:auto;}
  .pools .p-photo{height:var(--mobile-shaped-h);}

  .tariffs,.tariffs .tr-container,.tariffs .tr-heading{height:auto;}

  .rooms{height:auto;}
  .rooms .rm-head-wrap,.rooms .rm-heading,.rooms .rm-cards-wrap,.rooms .rm-cards{height:auto;}
  .rooms .rm-desc{font-size:16px;line-height:24px;}
  .rooms .rm-card{height:auto;}
  .rooms .rm-photo{height:var(--mobile-room-photo-h);}
  .rooms .rm-body{min-height:350px;}
  .rooms .rm-specs{gap:6px;}
  .rooms .rm-spec{height:34px;padding:7px 8px;gap:4px;}
  .rooms .rm-spec svg{width:16px;height:16px;}
  .rooms .rm-spec p{font-size:12px;line-height:18px;}
  .rooms .rm-amenity{gap:2px;min-width:0;}
  .rooms .rm-amenity svg{width:12px;height:12px;flex:0 0 12px;}
  .rooms .rm-amenity p{font-size:9px;line-height:11px;white-space:nowrap;}

  .services,.services .sv-container,.services .sv-row,.services .sv-cards,.services .sv-card{height:auto;}
  .services .sv-cards{width:max-content;}
  .services .sv-card{flex-basis:calc((var(--mobile-content-w) - 12px) / 2);width:calc((var(--mobile-content-w) - 12px) / 2);}
  .services .sv-photo{height:auto;aspect-ratio:173 / 150;}

  .stay{height:auto;}
  .stay .st-text{height:auto;}
  .stay .st-photo{height:var(--mobile-shaped-h);}
  .stay .st-tag{font-size:13px;line-height:20px;white-space:normal;}

  .restaurant,.restaurant .rs-container,.restaurant .rs-text{height:auto;}
  .restaurant .rs-photo-wrap,.restaurant .rs-photo{height:var(--mobile-shaped-h);}

  .faq{height:auto;min-height:688px;}

  .contacts,.contacts .ct-container,.contacts .ct-text{height:auto;}
  .contacts .ct-map{height:calc(var(--mobile-content-w) * 239 / 358);}

  .ft,.ft .ft-container,.ft .ft-row1{height:auto;}
}
