:root {
      --c-deep:    #0A3D45;
      --c-mid:     #175F6B;
      --c-light:   #3A96A7;
      --c-sand:    #F2E8D5;
      --c-sand2:   #E3D3B8;
      --c-gold:    #C8963E;
      --c-goldlt:  #E4BF72;
      --c-ink:     #111A1C;
      --c-inklt:   #2E3E42;
      --c-muted:   #6B7E82;
      --c-fog:     #F7F4EF;
      --c-white:   #FFFFFF;
      --f-display: 'Cormorant Garant', Georgia, serif;
      --f-body:    'Noto Sans', 'Noto Sans Georgian', system-ui, sans-serif;
      --r-sm:  6px; --r-md: 14px; --r-lg: 24px; --r-xl: 36px;
      --sh-card:  0 2px 20px rgba(10,61,69,.08);
      --sh-hover: 0 8px 40px rgba(10,61,69,.16);
      --ease: cubic-bezier(.4,0,.2,1);
      --t: .28s var(--ease);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
    body { font-family: var(--f-body); background: var(--c-fog); color: var(--c-ink); line-height: 1.65; overflow-x: hidden; }
    img { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }
    button { cursor: pointer; font-family: inherit; }
    :focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; }
    @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

    /* ═══ NAV ═══ */
    .nav { position: fixed; top: 0; left: 0; right: 0; z-index: 200; display: flex; align-items: center; justify-content: space-between; padding: 1rem 2rem; background: rgba(10,61,69,.93); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(200,150,62,.18); transition: box-shadow var(--t); }
    .nav.scrolled { box-shadow: 0 4px 24px rgba(10,61,69,.35); }
    .nav-logo { font-family: var(--f-display); font-size: 1.2rem; font-weight: 600; color: var(--c-sand); line-height: 1.15; }
    .nav-logo small { display: block; font-family: var(--f-body); font-size: .62rem; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; color: var(--c-goldlt); opacity: .75; }
    .nav-right { display: flex; align-items: center; gap: .875rem; }
    .lang-switcher { display: flex; gap: 2px; background: rgba(255,255,255,.09); border-radius: 20px; padding: 3px; }
    .lang-btn { background: transparent; border: none; color: rgba(242,232,213,.65); font-size: .7rem; font-weight: 600; letter-spacing: .1em; padding: 4px 11px; border-radius: 17px; transition: var(--t); }
    .lang-btn.active { background: var(--c-gold); color: var(--c-ink); }
    .lang-btn:hover:not(.active) { color: var(--c-sand); }
    .nav-book { display: inline-flex; align-items: center; gap: .4rem; background: var(--c-gold); color: var(--c-ink); font-size: .78rem; font-weight: 600; letter-spacing: .05em; padding: 8px 18px; border-radius: 22px; border: none; transition: var(--t); white-space: nowrap; }
    .nav-book:hover { background: var(--c-goldlt); transform: translateY(-1px); }

    /* ═══ HERO ═══ */
    .hero { min-height: 100svh; position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 7rem 1.5rem 5rem; background: linear-gradient(165deg, #04222A 0%, #0A3D45 45%, #175F6B 80%, #092D35 100%); }
    /* фото-фон подставляется через JS в .hero-bg */
    .hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.2s var(--ease); z-index: 0; }
    .hero-bg.on { opacity: .38; }
    .hero-overlay { position: absolute; inset: 0; z-index: 0; background: linear-gradient(165deg, rgba(4,34,42,.82) 0%, rgba(10,61,69,.72) 45%, rgba(9,45,53,.86) 100%); }
    .hero-rings { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 1; }
    .ring { position: absolute; border-radius: 50%; border: 1px solid rgba(200,150,62,.13); }
    .ring-1 { width: 420px; height: 420px; animation: pulse 5s var(--ease) infinite; }
    .ring-2 { width: 680px; height: 680px; animation: pulse 5s var(--ease) infinite .8s; }
    .ring-3 { width: 940px; height: 940px; animation: pulse 5s var(--ease) infinite 1.6s; }
    @keyframes pulse { 0%,100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.035); opacity: .45; } }
    .hero-inner { position: relative; z-index: 2; max-width: 760px; }
    .hero-eyebrow { font-size: .68rem; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--c-goldlt); margin-bottom: 1.1rem; }
    .hero-title { font-family: var(--f-display); font-size: clamp(3rem, 9vw, 6.8rem); font-weight: 600; line-height: 1.02; color: var(--c-sand); letter-spacing: -.01em; margin-bottom: .6rem; }
    .hero-title em { font-style: italic; color: var(--c-goldlt); }
    .hero-tagline { font-family: var(--f-display); font-size: clamp(1.1rem, 2.8vw, 1.55rem); font-style: italic; font-weight: 400; color: rgba(242,232,213,.72); margin-bottom: 1.5rem; }
    .hero-desc { font-size: .95rem; line-height: 1.75; color: rgba(242,232,213,.62); max-width: 520px; margin: 0 auto 2.25rem; }
    .hero-pills { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; margin-bottom: 2.5rem; }
    .pill { display: flex; align-items: center; gap: .45rem; background: rgba(255,255,255,.07); border: 1px solid rgba(200,150,62,.22); border-radius: 20px; padding: 6px 14px; font-size: .78rem; color: var(--c-sand); }
    .hero-ctas { display: flex; flex-wrap: wrap; gap: .875rem; justify-content: center; }
    .btn-gold { display: inline-flex; align-items: center; gap: .45rem; background: var(--c-gold); color: var(--c-ink); font-weight: 700; font-size: .88rem; letter-spacing: .04em; padding: 13px 28px; border-radius: 30px; border: none; transition: var(--t); }
    .btn-gold:hover { background: var(--c-goldlt); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(200,150,62,.38); }
    .btn-ghost { display: inline-flex; align-items: center; gap: .45rem; background: transparent; color: var(--c-sand); font-weight: 500; font-size: .88rem; letter-spacing: .04em; padding: 12px 28px; border-radius: 30px; border: 1px solid rgba(242,232,213,.28); transition: var(--t); }
    .btn-ghost:hover { background: rgba(242,232,213,.09); border-color: rgba(242,232,213,.5); }
    .hero-scroll { position: absolute; bottom: 1.75rem; left: 50%; transform: translateX(-50%); z-index: 2; color: rgba(242,232,213,.3); font-size: 1.35rem; animation: scrollBounce 2.2s ease-in-out infinite; }
    @keyframes scrollBounce { 0%,100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(9px); } }

    /* ═══ WAVES ═══ */
    .wave { display: block; width: 100%; overflow: hidden; line-height: 0; }
    .wave svg { display: block; width: 100%; }

    /* ═══ SECTIONS ═══ */
    .section { padding: 5.5rem 0; }
    .container { max-width: 1100px; margin: 0 auto; padding: 0 2rem; }
    .sec-label { font-size: .67rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: var(--c-gold); margin-bottom: .65rem; }
    .sec-title { font-family: var(--f-display); font-size: clamp(1.9rem, 4vw, 3rem); font-weight: 600; line-height: 1.12; color: var(--c-deep); margin-bottom: 1.1rem; }
    .sec-body { font-size: .97rem; line-height: 1.78; color: var(--c-muted); max-width: 560px; }

    /* ═══ ABOUT ═══ */
    .about { background: var(--c-fog); }
    .about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
    .stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    .stat { background: var(--c-white); border: 1px solid var(--c-sand2); border-radius: var(--r-md); padding: 1.5rem 1.25rem; text-align: center; box-shadow: var(--sh-card); transition: var(--t); }
    .stat:hover { transform: translateY(-3px); box-shadow: var(--sh-hover); }
    .stat-n { font-family: var(--f-display); font-size: 2.6rem; font-weight: 700; color: var(--c-deep); line-height: 1; margin-bottom: .3rem; }
    .stat-n sup { font-size: 1.3rem; }
    .stat-lbl { font-size: .75rem; color: var(--c-muted); letter-spacing: .04em; }

    /* ═══ GALLERY ═══ */
    .gallery { background: var(--c-white); }
    .gal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .875rem; margin-top: 3rem; }
    .gal-item { position: relative; aspect-ratio: 4/3; overflow: hidden; border-radius: var(--r-md); cursor: pointer; background: var(--c-sand); box-shadow: var(--sh-card); }
    .gal-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
    .gal-item:hover img { transform: scale(1.07); }
    .gal-item::after { content: '⛶'; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) scale(.7); color: #fff; font-size: 1.5rem; opacity: 0; transition: var(--t); text-shadow: 0 2px 8px rgba(0,0,0,.5); pointer-events: none; }
    .gal-item:hover::after { opacity: .95; transform: translate(-50%,-50%) scale(1); }
    /* первое фото крупнее на десктопе */
    .gal-grid .gal-item:first-child { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
    .gal-empty { margin-top: 2.5rem; padding: 3.5rem 2rem; text-align: center; border: 2px dashed var(--c-sand2); border-radius: var(--r-lg); color: var(--c-muted); font-size: .92rem; line-height: 1.7; }
    .gal-empty code { background: var(--c-fog); padding: 2px 8px; border-radius: 5px; color: var(--c-mid); font-size: .85rem; }

    /* ═══ LIGHTBOX ═══ */
    .lb { position: fixed; inset: 0; z-index: 999; background: rgba(4,13,15,.94); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); display: none; align-items: center; justify-content: center; }
    .lb.open { display: flex; }
    .lb-img { max-width: 92vw; max-height: 84vh; border-radius: var(--r-md); box-shadow: 0 20px 80px rgba(0,0,0,.6); animation: lbIn .3s var(--ease); }
    @keyframes lbIn { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: scale(1); } }
    .lb-close { position: absolute; top: 1.25rem; right: 1.5rem; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.12); border: none; color: #fff; font-size: 1.5rem; line-height: 1; transition: var(--t); }
    .lb-close:hover { background: var(--c-gold); color: var(--c-ink); }
    .lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.1); border: none; color: #fff; font-size: 1.6rem; transition: var(--t); }
    .lb-nav:hover { background: var(--c-gold); color: var(--c-ink); }
    .lb-prev { left: 1.25rem; }
    .lb-next { right: 1.25rem; }
    .lb-count { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,.7); font-size: .82rem; letter-spacing: .08em; background: rgba(0,0,0,.35); padding: 5px 14px; border-radius: 20px; }
    @media (max-width: 640px) { .lb-nav { width: 44px; height: 44px; font-size: 1.3rem; } .lb-prev { left: .5rem; } .lb-next { right: .5rem; } }

    /* ═══ DISTANCES ═══ */
    .dist-section { background: var(--c-deep); padding: 5rem 0; }
    .dist-section .sec-title { color: var(--c-sand); }
    .dist-section .sec-label { color: var(--c-goldlt); }
    .dist-section .sec-body { color: rgba(242,232,213,.58); }
    .dist-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.1rem; margin-top: 2.75rem; }
    .dist-card { background: rgba(255,255,255,.055); border: 1px solid rgba(200,150,62,.18); border-radius: var(--r-md); padding: 1.5rem 1rem; text-align: center; transition: var(--t); }
    .dist-card:hover { background: rgba(255,255,255,.1); border-color: rgba(200,150,62,.4); transform: translateY(-3px); }
    .dist-icon { font-size: 1.9rem; margin-bottom: .6rem; }
    .dist-val { font-family: var(--f-display); font-size: 1.75rem; font-weight: 600; color: var(--c-goldlt); margin-bottom: .25rem; }
    .dist-nm { font-size: .8rem; color: rgba(242,232,213,.65); line-height: 1.4; }

    /* ═══ ROOMS ═══ */
    .rooms { background: var(--c-fog); }
    .rooms-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; margin-top: 3rem; }
    .room-card { background: var(--c-white); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-card); border: 1px solid var(--c-sand2); transition: var(--t); }
    .room-card:hover { transform: translateY(-5px); box-shadow: var(--sh-hover); }
    .room-head { background: linear-gradient(140deg, var(--c-deep), var(--c-mid)); padding: 2rem; text-align: center; }
    .room-no { font-size: .65rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--c-goldlt); margin-bottom: .5rem; }
    .room-nm { font-family: var(--f-display); font-size: 1.7rem; font-weight: 600; color: var(--c-sand); }
    .room-body { padding: 1.75rem; }
    .bed-list { display: flex; flex-direction: column; gap: .7rem; }
    .bed-row { display: flex; align-items: flex-start; gap: .7rem; font-size: .9rem; color: var(--c-inklt); line-height: 1.45; }
    .bed-ico { font-size: 1.2rem; flex-shrink: 0; }

    /* ═══ AMENITIES ═══ */
    .amenities { background: var(--c-sand); }
    .ami-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; margin-top: 3rem; }
    .ami-cat { background: var(--c-white); border-radius: var(--r-md); padding: 1.75rem; box-shadow: var(--sh-card); }
    .ami-head { font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--c-mid); margin-bottom: 1.1rem; padding-bottom: .75rem; border-bottom: 2px solid var(--c-sand); }
    .ami-list { list-style: none; display: flex; flex-direction: column; gap: .55rem; }
    .ami-item { display: flex; align-items: flex-start; gap: .55rem; font-size: .875rem; color: var(--c-inklt); line-height: 1.45; }
    .ami-item::before { content: '✓'; color: var(--c-gold); font-weight: 700; flex-shrink: 0; }
    .ami-sub { font-size: .78rem; color: var(--c-muted); margin-top: .1rem; }

    /* ═══ LOCATION ═══ */
    .location { background: var(--c-fog); }
    .loc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; margin-top: 3rem; }
    .map-wrap { border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-hover); height: 400px; }
    .map-wrap iframe { width: 100%; height: 100%; border: none; }
    .loc-cards { display: flex; flex-direction: column; gap: 1rem; }
    .loc-card { display: flex; align-items: flex-start; gap: 1rem; background: var(--c-white); border: 1px solid var(--c-sand2); border-radius: var(--r-md); padding: 1.2rem 1.25rem; }
    .loc-ico { font-size: 1.45rem; flex-shrink: 0; margin-top: 2px; }
    .loc-lbl { font-size: .67rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--c-mid); margin-bottom: .25rem; }
    .loc-val { font-size: .9rem; color: var(--c-inklt); line-height: 1.5; }
    .loc-val a { color: var(--c-mid); font-weight: 600; }
    .loc-val a:hover { color: var(--c-deep); }

    /* ═══ BOOKING ═══ */
    .booking { background: linear-gradient(150deg, #04222A 0%, var(--c-deep) 50%, #062E38 100%); padding: 6.5rem 0; text-align: center; }
    .booking .sec-label { color: var(--c-goldlt); }
    .booking .sec-title { color: var(--c-sand); margin: 0 auto 1rem; max-width: 640px; }
    .booking .sec-body { color: rgba(242,232,213,.58); margin: 0 auto 2.5rem; max-width: 480px; }
    .phone-big { display: block; font-family: var(--f-display); font-size: clamp(2.2rem, 6vw, 4rem); font-weight: 600; color: var(--c-goldlt); margin-bottom: 2.25rem; letter-spacing: .02em; }
    .phone-big a { color: inherit; transition: var(--t); }
    .phone-big a:hover { color: var(--c-white); }
    .book-ctas { display: flex; gap: .875rem; justify-content: center; flex-wrap: wrap; }

    /* ═══ FOOTER ═══ */
    footer { background: #040D0F; color: rgba(242,232,213,.42); font-size: .82rem; padding: 3.5rem 0 2rem; }
    .ft-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2.5rem; margin-bottom: 2.5rem; }
    .ft-logo { font-family: var(--f-display); font-size: 1.45rem; font-weight: 600; color: var(--c-sand); margin-bottom: .75rem; }
    .ft-desc { font-size: .8rem; line-height: 1.65; color: rgba(242,232,213,.35); }
    .ft-head { font-size: .65rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--c-gold); margin-bottom: 1rem; }
    .ft-list { list-style: none; display: flex; flex-direction: column; gap: .5rem; }
    .ft-list a { color: rgba(242,232,213,.42); transition: var(--t); }
    .ft-list a:hover { color: var(--c-sand); }
    .ft-bar { border-top: 1px solid rgba(242,232,213,.07); padding-top: 1.5rem; text-align: center; font-size: .73rem; }
    .seo-footer { background: #040D0F; padding: 0 2rem 1.5rem; font-size: .72rem; line-height: 1.7; color: rgba(242,232,213,.15); text-align: center; }

    /* ═══ RESPONSIVE ═══ */
    @media (max-width: 820px) {
      .about-grid { grid-template-columns: 1fr; gap: 2.75rem; }
      .loc-grid { grid-template-columns: 1fr; }
      .ft-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 640px) {
      .nav { padding: .875rem 1.25rem; }
      .nav-logo small { display: none; }
      .nav-book .nav-book-txt { display: none; }
      .stat-grid { gap: .75rem; }
      .dist-grid { grid-template-columns: 1fr 1fr; }
      .section { padding: 3.75rem 0; }
      .container { padding: 0 1.25rem; }
      .hero { padding: 6.5rem 1.25rem 4.5rem; }
      .hero-pills { gap: .45rem; }
      .pill { font-size: .74rem; padding: 5px 11px; }
      .ft-grid { grid-template-columns: 1fr; gap: 1.75rem; }
      .map-wrap { height: 300px; }
      .gal-grid { grid-template-columns: repeat(2, 1fr); }
      .gal-grid .gal-item:first-child { grid-column: span 2; grid-row: auto; aspect-ratio: 4/3; }
    }
    @media (max-width: 400px) {
      .rooms-grid { grid-template-columns: 1fr; }
      .ami-grid { grid-template-columns: 1fr; }
      .ring-3 { display: none; }
    }