@font-face { font-family: "Gloock"; src: url("/fonts/gloock.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("/fonts/instrument.woff2") format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-style: normal; font-display: swap; }

:root {
  --ie: #c8323a;
  --ie-d: #9e2530;
  --ink: #1f1a17;
  --ink-2: #4a413b;
  --ink-3: #6f655d;
  --paper: #f7f3ec;
  --paper-2: #efe9df;
  --stone: #e4ded3;
  --card: #fffdf9;
  --clay: #a65a40;
  --roof: #d4703f;
  --pool: #28b8c0;
  --pool-d: #12808e;
  --hill: #3d6b4a;
  --wa: #11803f;
  --wa-d: #0c6a33;
  --r: 22px;
  --wrap: 1200px;
  --gut: clamp(16px, 4vw, 40px);
  --f-d: "Gloock", "Georgia", serif;
  --f-b: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --shadow: 0 1px 2px rgba(31, 26, 23, .06), 0 12px 32px -12px rgba(31, 26, 23, .22);
  --ease: cubic-bezier(.2, .8, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body {
  margin: 0;
  font-family: var(--f-b);
  font-size: clamp(16px, 1.05vw + 11px, 18px);
  line-height: 1.6;
  color: var(--ink);
  background-color: var(--paper);
  background-image: radial-gradient(rgba(200, 50, 58, .07) 1px, transparent 1.2px);
  background-size: 14px 14px;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--ie); outline-offset: 3px; border-radius: 6px; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--ink); color: var(--paper); padding: 10px 16px; border-radius: 10px; text-decoration: none; }
.skip:focus { top: 12px; }
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gut); }
section { position: relative; }

/* ---------- tipografie */
.h2 { font-family: var(--f-d); font-weight: 400; font-size: clamp(34px, 4.6vw, 64px); line-height: 1.04; letter-spacing: -.01em; margin: 0 0 22px; text-wrap: balance; }
.h3 { font-family: var(--f-d); font-weight: 400; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.1; margin: 0 0 14px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ie); font-stretch: 85%; }
.eyebrow::before { content: ""; width: 34px; height: 10px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10'%3E%3Cpath d='M2 1l8 8M10 1L2 9' stroke='%23c8323a' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") repeat-x left center / 12px 10px; }
.sec-head { max-width: 760px; margin-bottom: clamp(32px, 5vw, 60px); }
.sec-head p:not(.eyebrow) { color: var(--ink-2); }
.split .w-o { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.split .w-i { display: inline-block; }

/* ---------- butoane */
.btn { --bg: var(--ink); --fg: var(--paper); position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 24px; border-radius: 999px; background: var(--bg); color: var(--fg); font-weight: 600; text-decoration: none; letter-spacing: .01em; border: 0; cursor: pointer; transition: background-color .25s, transform .25s var(--ease), box-shadow .25s; will-change: transform; }
.btn svg { width: 22px; height: 22px; flex: none; }
.btn::after { content: ""; position: absolute; inset: 5px; border-radius: inherit; border: 1.5px dashed rgba(255, 255, 255, .45); pointer-events: none; }
.btn-wa { --bg: var(--wa); --fg: #fff; box-shadow: 0 10px 24px -10px rgba(17, 128, 63, .8); }
.btn-wa:hover { --bg: var(--wa-d); }
.btn-dark:hover { --bg: #000; }
.btn-ghost { --bg: transparent; --fg: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); }
.btn-ghost::after { border-color: rgba(31, 26, 23, .25); }
.btn-ghost:hover { --bg: var(--ink); --fg: var(--paper); }
.btn-ghost:hover::after { border-color: rgba(255, 255, 255, .35); }
.btn-ghost svg { transition: transform .3s var(--ease); }
.btn-ghost:hover svg { transform: translateX(4px); }
.btn-sm { min-height: 42px; padding: 0 18px; font-size: 15px; }
.btn-sm svg { width: 19px; height: 19px; }
.btn-xl { min-height: 68px; padding: 0 36px; font-size: clamp(18px, 2vw, 22px); }
.btn-xl svg { width: 28px; height: 28px; }

/* ---------- fir roșu care coase pagina */
.thread { position: absolute; left: 0; top: 0; width: 160px; height: 0; pointer-events: none; z-index: 30; display: none; }
.thread-clip { position: absolute; left: 0; top: 0; width: 160px; height: 0; overflow: hidden; contain: strict; }
.thread-svg { position: absolute; left: 0; top: 0; width: 160px; will-change: transform; }
.needle svg { width: 100%; height: 100%; }
.needle { position: absolute; left: 0; top: 0; width: 14px; height: 42px; margin: -40px 0 0 -7px; transform-origin: 50% 95%; opacity: 0; will-change: transform; }
@media (min-width: 1360px) { .thread { display: block; } }

/* ---------- antet */
.top { position: fixed; z-index: 40; top: 12px; left: 50%; transform: translateX(-50%); width: min(calc(100% - 24px), 1240px); display: flex; align-items: center; gap: 18px; padding: 8px 8px 8px 16px; border-radius: 999px; background: rgba(255, 253, 249, .95); box-shadow: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 8px 30px -14px rgba(31, 26, 23, .35); transition: transform .45s var(--ease); }
.top.is-hidden { transform: translate(-50%, -130%); }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-mark { width: 34px; height: 34px; }
.brand-txt { display: flex; flex-direction: column; line-height: 1; }
.brand-txt b { font-family: var(--f-d); font-weight: 400; font-size: 22px; }
.brand-txt small { white-space: nowrap; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-top: 3px; }
.nav { display: none; margin-left: auto; gap: 4px; }
.nav a { position: relative; padding: 8px 12px; border-radius: 999px; text-decoration: none; font-size: 15px; font-weight: 500; color: var(--ink-2); transition: color .2s, background-color .2s; }
.nav a:hover { color: var(--ink); background: rgba(200, 50, 58, .08); }
.nav a.is-on { color: var(--ie); }
.nav a.is-on::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 6px; height: 6px; margin-left: -3px; background: var(--ie); transform: rotate(45deg); }
.top .btn { margin-left: auto; }
@media (min-width: 1040px) { .nav { display: flex; } .top .btn { margin-left: 8px; } }

/* ---------- hero */
.hero { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 110px 0 40px; overflow: hidden; isolation: isolate; }
.hero-sky { position: absolute; inset: 0; z-index: -1; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; will-change: transform; }
.hero-sky::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(ellipse 55% 60% at 18% 62%, rgba(247, 243, 236, .82), rgba(247, 243, 236, 0) 70%); }
.hero-sky::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; background: linear-gradient(to bottom, rgba(247, 243, 236, 0), var(--paper)); }
.hero-in { width: 100%; max-width: 1360px; margin: 0 auto; padding-inline: var(--gut); display: grid; gap: 8px; align-items: center; }
.hero-txt { position: relative; z-index: 2; max-width: 560px; }
.kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 7px 14px 7px 10px; border-radius: 999px; background: rgba(255, 253, 249, .85); font-size: 14px; font-weight: 600; color: var(--ink-2); }
.kicker svg { width: 18px; height: 18px; color: var(--ie); }
.hero-title { margin: 0; font-weight: 400; line-height: .9; }
.ht-small { display: block; font-family: var(--f-b); font-size: clamp(16px, 1.6vw, 20px); font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--ie); margin: 0 0 6px 4px; }
.ht-big { display: block; font-family: var(--f-d); font-size: clamp(76px, 12vw, 168px); letter-spacing: -.035em; }
.ht-big .w { display: inline-block; }
.ht-big .ch { display: inline-block; will-change: transform; }
.hero-stitch { width: min(380px, 80%); height: 18px; margin: 6px 0 18px; overflow: visible; }
.lead { font-size: clamp(17px, 1.3vw + 6px, 21px); line-height: 1.55; color: var(--ink-2); margin: 0 0 26px; max-width: 30em; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 22px; }
.score-chip { display: inline-flex; align-items: center; gap: 12px; padding: 6px 16px 6px 6px; border-radius: 16px; background: var(--card); box-shadow: var(--shadow); text-decoration: none; font-size: 14px; color: var(--ink-2); }
.score-chip b { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px 12px 12px 3px; background: var(--ink); color: #fff; font-size: 17px; }
.score-chip strong { color: var(--ink); }
.hero-art { position: relative; z-index: 1; margin: 0 -8% -6%; }
.hero-svg { width: 100%; height: auto; overflow: visible; will-change: transform; }
.hero-fx { position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; pointer-events: none; will-change: transform; }
.tag { position: absolute; display: none; padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--card); box-shadow: var(--shadow); white-space: nowrap; }
.tag::before { content: ""; position: absolute; width: 10px; height: 10px; background: inherit; transform: rotate(45deg); }
.tag-1 { left: 60%; top: 47%; } .tag-1::before { left: 14px; bottom: -4px; }
.tag-2 { right: 76%; top: 27%; } .tag-2::before { right: 14px; bottom: -4px; }
.tag-3 { left: 54%; top: 70%; } .tag-3::before { left: 16px; top: -4px; }
.scroll-cue { position: absolute; left: 50%; bottom: 18px; width: 26px; height: 42px; margin-left: -13px; border-radius: 14px; border: 2px solid rgba(31, 26, 23, .45); }
.scroll-cue span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: var(--ie); animation: cue 1.8s var(--ease) infinite; }
@keyframes cue { 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(14px); opacity: 0; } 100% { opacity: 0; } }
@media (min-width: 900px) {
  .hero-in { grid-template-columns: minmax(420px, 5fr) 7fr; }
  .hero-art { margin: 0 -4% 0 -6%; }
  .tag { display: block; }
}
@media (max-width: 899px) {
  .hero { padding-top: 96px; }
  .hero-art { margin-top: -10px; }
}

/* SVG: animații continue */
.cloud { animation: drift 38s linear infinite alternate; }
.cloud.c2 { animation-duration: 52s; animation-delay: -12s; }
.cloud.c3 { animation-duration: 30s; animation-delay: -6s; }
@keyframes drift { from { transform: translateX(-40px); } to { transform: translateX(60px); } }
.bird { transform-box: fill-box; transform-origin: center; animation: flap .9s ease-in-out infinite alternate; }
.bird:nth-child(2) { animation-delay: -.3s; } .bird:nth-child(3) { animation-delay: -.6s; }
@keyframes flap { to { transform: scaleY(.45); } }
.h-birds { animation: fly 26s linear infinite; }
@keyframes fly { from { transform: translate(-200px, 40px); } to { transform: translate(1100px, -60px); } }
.smoke circle { transform-box: fill-box; transform-origin: center; opacity: 0; animation: smoke 4.2s ease-out infinite; }
.smoke circle:nth-child(2) { animation-delay: 1.4s; } .smoke circle:nth-child(3) { animation-delay: 2.8s; }
@keyframes smoke { 0% { opacity: 0; transform: translate(0, 0) scale(.4); } 15% { opacity: .75; } 100% { opacity: 0; transform: translate(26px, -70px) scale(2.4); } }
.h-caustic path { animation: caustic 3.4s ease-in-out infinite alternate; }
.h-caustic path:nth-child(odd) { animation-delay: -1.7s; }
@keyframes caustic { from { transform: translate(-4px, 1px); opacity: .35; } to { transform: translate(5px, -1px); opacity: .9; } }
@keyframes sway { from { transform: rotate(-2deg); } to { transform: rotate(2deg); } }
.sway { animation: sway 4s ease-in-out infinite alternate; }
.swing { animation: swing 2.6s ease-in-out infinite alternate; }
@keyframes swing { from { transform: rotate(-16deg); } to { transform: rotate(16deg); } }
.anim .hero-art { opacity: 0; }
.anim .hx { animation: hx .9s var(--ease) both; animation-delay: calc(.2s + var(--i, 0) * .08s); }
@keyframes hx { from { opacity: 0; transform: translateY(18px); } }
.anim .ht-big .w { animation: hw 1s cubic-bezier(.2, .9, .3, 1.25) both .25s; }
.anim .ht-big .w + .w { animation-delay: .38s; }
@keyframes hw { from { opacity: 0; transform: translateY(45%) rotate(5deg); } }
.anim .hero-stitch { transform-origin: left center; animation: hs 1.1s cubic-bezier(.65, 0, .35, 1) both .6s; }
@keyframes hs { from { transform: scaleX(0); } }

/* decor 3D: moara, cascada, cheile */
.m-wheel { transform-box: fill-box; transform-origin: center; animation: spin 3.2s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.m-chute { animation: flow .6s linear infinite; }
.m-flow, .g-flow { animation: flow 1.6s linear infinite; }
@keyframes flow { to { stroke-dashoffset: -28; } }
.m-splash circle { animation: splash 1s ease-out infinite; }
.m-splash circle:nth-child(2) { animation-delay: .33s; } .m-splash circle:nth-child(3) { animation-delay: .66s; }
@keyframes splash { from { transform: translate(0, 0); opacity: 1; } to { transform: translate(10px, 14px); opacity: 0; } }
.f-strands path { animation: fall var(--fd, 1s) linear infinite; }
@keyframes fall { to { stroke-dashoffset: -48; } }
.f-ripples ellipse { transform-box: fill-box; transform-origin: center; animation: ripple 3s ease-out infinite; }
.f-ripples ellipse:nth-child(2) { animation-delay: 1s; } .f-ripples ellipse:nth-child(3) { animation-delay: 2s; }
@keyframes ripple { from { transform: scale(.6); opacity: .9; } to { transform: scale(1.15); opacity: 0; } }
.f-mist ellipse { animation: mist 5s ease-in-out infinite alternate; }
.f-mist ellipse:nth-child(2) { animation-delay: -2s; }
@keyframes mist { from { transform: translateX(-12px); opacity: .25; } to { transform: translateX(12px); opacity: .6; } }

/* iconițe 3D */
.ico3d { width: 100%; max-width: 120px; height: auto; overflow: visible; }
.ico-ripple path { animation: caustic 2s ease-in-out infinite alternate; }
.ico-flame path { transform-box: fill-box; transform-origin: bottom center; animation: flame .5s ease-in-out infinite alternate; }
@keyframes flame { to { transform: scale(1.2, .8); } }
.ico-steam path { animation: steam 2.2s ease-out infinite; }
.ico-steam path:nth-child(2) { animation-delay: 1.1s; }
@keyframes steam { from { transform: translateY(4px); opacity: 0; } 40% { opacity: 1; } to { transform: translateY(-8px); opacity: 0; } }
.ico-wifi path { animation: wifi 2.4s ease-in-out infinite; animation-delay: calc(var(--i) * .25s); }
@keyframes wifi { 0%, 100% { opacity: .25; } 40% { opacity: 1; } }
.ico-air path { animation: steam 2s ease-in infinite; animation-delay: calc(var(--i) * .3s); }
.hand-m { animation: spin 4s linear infinite; }
.hand-h { animation: spin 48s linear infinite; }

/* ---------- intro */
.intro { padding: clamp(70px, 10vw, 140px) 0 clamp(50px, 7vw, 90px); }
.intro-grid { display: grid; gap: 40px; align-items: start; }
.intro-txt p:not(.eyebrow) { color: var(--ink-2); max-width: 36em; }
.host { position: relative; padding: 28px; border-radius: var(--r); background: var(--card); box-shadow: var(--shadow); }
.host::after, .rv-card.stitched::after { content: ""; position: absolute; inset: 9px; border-radius: 15px; border: 1.5px dashed rgba(200, 50, 58, .35); pointer-events: none; }
.host-top { display: flex; align-items: center; gap: 14px; }
.host-av { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: var(--ie); color: #fff; font-family: var(--f-d); font-size: 22px; box-shadow: 0 0 0 4px var(--card), 0 0 0 6px var(--ie); }
.host-name { margin: 0; font-family: var(--f-d); font-size: 24px; line-height: 1.1; }
.host-role { margin: 2px 0 0; font-size: 14px; color: var(--ink-3); }
.host-score { margin: 0 0 0 auto; text-align: right; line-height: 1.1; }
.host-score b { display: block; font-family: var(--f-d); font-weight: 400; font-size: 36px; color: var(--ie); }
.host-score span { font-size: 12px; color: var(--ink-3); }
.host-q { margin: 22px 0 18px; font-family: var(--f-d); font-size: 21px; line-height: 1.35; }
.host-q cite { display: block; margin-top: 10px; font-family: var(--f-b); font-style: normal; font-size: 14px; color: var(--ink-3); }
.host-lang { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: 14px; color: var(--ink-3); }
.host-lang span { padding: 4px 12px; border-radius: 999px; background: var(--paper-2); color: var(--ink); font-weight: 600; }
.stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; margin-top: clamp(40px, 6vw, 80px); }
.stat { padding: 22px 18px; border-top: 2px dashed rgba(200, 50, 58, .35); }
.stat b { display: block; font-family: var(--f-d); font-weight: 400; font-size: clamp(48px, 6vw, 80px); line-height: 1; color: var(--ink); }
.stat span { display: block; margin-top: 8px; font-size: 15px; color: var(--ink-3); max-width: 14em; }
@media (min-width: 900px) {
  .intro-grid { grid-template-columns: 7fr 5fr; gap: 70px; }
  .host { margin-top: 40px; }
  .stats { grid-template-columns: repeat(4, 1fr); }
  .stat + .stat { border-left: 2px dashed rgba(200, 50, 58, .2); }
}

/* ---------- curtea */
.court { --curtain: var(--paper-2); padding: clamp(60px, 8vw, 120px) 0; background: linear-gradient(180deg, transparent, var(--paper-2) 18%, var(--paper-2) 82%, transparent); }
.court-grid { display: grid; gap: 40px; }
.court-sticky p:not(.eyebrow) { color: var(--ink-2); }
.motif { width: min(400px, 84vw); aspect-ratio: 164 / 120; margin: 30px auto 0; }
.motif-svg { width: 100%; height: 100%; overflow: visible; }
.court-shots { display: grid; grid-template-columns: 1fr; gap: 18px; }
.shot { position: relative; margin: 0; border-radius: var(--r); overflow: hidden; background: var(--stone); box-shadow: var(--shadow); }
.shot img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; transform-origin: center; }
.shot-tall img { aspect-ratio: 3 / 4; }
.shot figcaption { position: absolute; left: 12px; right: 12px; bottom: 12px; padding: 12px 16px; border-radius: 14px; background: rgba(255, 253, 249, .94); font-size: 14px; color: var(--ink-2); line-height: 1.45; }
.shot figcaption b { display: block; font-family: var(--f-d); font-weight: 400; font-size: 19px; color: var(--ink); }
@media (min-width: 700px) { .court-shots { grid-template-columns: 1fr 1fr; } .shot:nth-child(even) { margin-top: 60px; } }
@media (min-width: 1000px) {
  .court-grid { grid-template-columns: 5fr 7fr; gap: 70px; }
  .court-sticky { position: sticky; top: 110px; align-self: start; }
}

/* ---------- piscina */
.pool { padding-bottom: clamp(60px, 8vw, 110px); }
.pool-media { position: relative; height: clamp(420px, 82vh, 820px); overflow: hidden; }
.pool-img { position: absolute; inset: -12% 0; }
.pool-img img { width: 100%; height: 100%; object-fit: cover; }
.pool-waves { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: clamp(50px, 8vw, 110px); }
.wv1 { fill: rgba(247, 243, 236, .55); animation: wave 9s ease-in-out infinite alternate; }
.wv2 { fill: var(--paper); animation: wave 7s ease-in-out infinite alternate-reverse; }
@keyframes wave { from { transform: translateX(-30px); } to { transform: translateX(30px); } }
.pool-waves path { transform-box: view-box; }
.pool-card-wrap { position: relative; margin-top: clamp(-260px, -18vw, -120px); }
.pool-card { position: relative; max-width: 620px; padding: clamp(26px, 4vw, 44px); border-radius: var(--r); background: var(--card); box-shadow: 0 30px 60px -30px rgba(18, 128, 142, .55); }
.pool-card::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 3px; background: linear-gradient(135deg, var(--pool), transparent 50%, var(--pool-d)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.pool-card p:not(.eyebrow) { color: var(--ink-2); }
.pool-card .eyebrow { color: var(--pool-d); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.chips li { padding: 6px 14px; border-radius: 999px; background: #e3f6f6; color: var(--pool-d); font-weight: 600; font-size: 14px; }
.pool-inset { display: none; margin: 0; }
@media (min-width: 900px) {
  .pool-inset { display: block; position: absolute; right: -260px; bottom: 30px; width: 280px; border-radius: 18px; overflow: hidden; border: 6px solid var(--card); box-shadow: var(--shadow); transform: rotate(3deg); }
  .pool-inset img { aspect-ratio: 4 / 3; object-fit: cover; }
}

/* ---------- camere */
.rooms { padding: clamp(60px, 8vw, 120px) 0; }
.room { position: relative; display: grid; gap: 0; margin-bottom: clamp(30px, 5vw, 60px); border-radius: calc(var(--r) + 6px); background: var(--card); box-shadow: var(--shadow); overflow: hidden; }
.room-gal { position: relative; }
.room-main { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--stone); }
.room-main img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .7s var(--ease), transform 1.4s var(--ease); }
.room-main img.is-on { opacity: 1; transform: none; }
.room-thumbs { position: absolute; left: 12px; bottom: 12px; display: flex; gap: 8px; }
.room-thumbs button { width: 58px; height: 44px; padding: 0; border: 0; border-radius: 9px; overflow: hidden; cursor: pointer; opacity: .7; box-shadow: 0 0 0 2px rgba(255, 255, 255, .7); transition: opacity .2s, transform .25s var(--ease), box-shadow .2s; }
.room-thumbs button[aria-selected="true"] { opacity: 1; transform: translateY(-4px); box-shadow: 0 0 0 3px var(--ie); }
.room-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.room-info { position: relative; padding: clamp(26px, 4vw, 48px); }
.room-info .h3 { position: relative; padding-right: clamp(70px, 9vw, 120px); }
.room-no { position: absolute; right: clamp(20px, 3vw, 40px); top: 10px; margin: 0; font-family: var(--f-d); font-size: clamp(70px, 8vw, 120px); line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(200, 50, 58, .35); }
.specs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 6px 0 20px; }
.specs div { padding: 12px 14px; border-radius: 14px; background: var(--paper); }
.specs dt { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.specs dd { margin: 2px 0 0; font-weight: 700; font-size: 16px; }
.beds { margin: -6px 0 16px; font-size: 15px; color: var(--ink-3); }
.ticks { display: grid; gap: 8px; margin: 0 0 26px; padding: 0; list-style: none; }
.ticks li { display: flex; gap: 10px; align-items: center; color: var(--ink-2); }
.ticks svg { width: 20px; height: 20px; flex: none; padding: 3px; border-radius: 50%; background: rgba(200, 50, 58, .1); color: var(--ie); }
@media (min-width: 960px) {
  .room { grid-template-columns: 7fr 5fr; }
  .room-main { aspect-ratio: auto; height: 100%; min-height: 520px; }
  .room-rev .room-gal { order: 2; }
}
@media (max-width: 520px) { .specs { grid-template-columns: 1fr 1fr; } .specs div:last-child { grid-column: span 2; } }

/* ---------- spații comune */
.common { padding: clamp(40px, 6vw, 90px) 0 clamp(60px, 8vw, 120px); }
.bento { display: grid; gap: 16px; grid-template-columns: 1fr; }
.b { position: relative; margin: 0; border-radius: var(--r); overflow: hidden; background: var(--card); box-shadow: var(--shadow); }
.b img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; transition: transform 1.2s var(--ease); }
.b:hover img { transform: scale(1.05); }
.b figcaption { position: absolute; inset: auto 0 0 0; padding: 60px 20px 18px; background: linear-gradient(transparent, rgba(20, 16, 14, .78)); color: #fff; }
.b figcaption b { display: block; font-family: var(--f-d); font-weight: 400; font-size: 24px; }
.b figcaption span { font-size: 15px; opacity: .9; }
.b-note { display: flex; flex-direction: column; justify-content: center; padding: 30px; background: var(--ie); color: #fff; }
.b-note::after { content: ""; position: absolute; inset: 9px; border-radius: 15px; border: 1.5px dashed rgba(255, 255, 255, .5); }
.note-big { margin: 0; font-family: var(--f-d); font-size: clamp(24px, 2.4vw, 32px); line-height: 1.2; }
.note-by { margin: 14px 0 0; font-size: 14px; opacity: .85; }
.b-deliv { display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 26px; }
.b-deliv p { margin: 0; color: var(--ink-2); }
.b-deliv b { color: var(--ink); }
.deliv-svg { width: 150px; height: auto; overflow: visible; }
.scooter { animation: bump .35s ease-in-out infinite alternate; }
@keyframes bump { to { transform: translateY(-2px); } }
.speed line { animation: speed .8s linear infinite; }
.speed line:nth-child(2) { animation-delay: .25s; } .speed line:nth-child(3) { animation-delay: .5s; }
@keyframes speed { from { transform: translateX(10px); opacity: 0; } 50% { opacity: 1; } to { transform: translateX(-14px); opacity: 0; } }
@media (min-width: 760px) {
  .bento { grid-template-columns: repeat(6, 1fr); grid-auto-rows: minmax(150px, auto); }
  .b-bar { grid-column: span 4; grid-row: span 2; }
  .b-kit { grid-column: span 2; grid-row: span 2; }
  .b-note { grid-column: span 2; }
  .b-hol { grid-column: span 2; grid-row: span 2; }
  .b-deliv { grid-column: span 2; }
  .b-bar img, .b-kit img, .b-hol img { aspect-ratio: auto; position: absolute; inset: 0; }
  .b-bar, .b-kit, .b-hol { min-height: 320px; }
}
@media (min-width: 1100px) {
  .b-kit { grid-column: span 2; }
  .b-note { grid-column: 1 / span 2; }
  .b-hol { grid-column: 3 / span 2; grid-row: 3 / span 2; }
  .b-deliv { grid-column: 5 / span 2; grid-row: 3 / span 2; }
  .b-note { grid-row: 3 / span 2; }
}

/* ---------- facilități */
.fac { padding: clamp(60px, 8vw, 120px) 0; background: var(--ink); color: var(--paper); overflow: hidden; }
.fac::before { content: ""; position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M20 4l4 4 4-4M20 44l4-4 4 4M4 20l4 4-4 4M44 20l-4 4 4 4' fill='none' stroke='%23c8323a' stroke-width='1.6' opacity='.35'/%3E%3C/svg%3E"); opacity: .7; pointer-events: none; }
.fac .eyebrow { color: #ff8a8f; }
.fac .eyebrow::before { filter: brightness(1.6); }
.fac-grid { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; perspective: 900px; }
.fac-i { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 22px 14px 20px; border-radius: 20px; background: rgba(255, 253, 249, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); transform-style: preserve-3d; transition: background-color .3s, box-shadow .3s; }
.fac-i:hover { background: rgba(255, 253, 249, .1); box-shadow: inset 0 0 0 1px rgba(200, 50, 58, .6); }
.fac-i .ico3d { width: 96px; margin-bottom: 6px; transform: translateZ(30px); }
.fac-i b { font-weight: 700; font-size: 16px; line-height: 1.25; transform: translateZ(20px); }
.fac-i span { font-size: 14px; color: rgba(247, 243, 236, .65); line-height: 1.35; }
@media (min-width: 700px) { .fac-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; } }
@media (min-width: 1040px) { .fac-grid { grid-template-columns: repeat(4, 1fr); } .fac-i .ico3d { width: 110px; } }

/* ---------- evaluări */
.rev { padding: clamp(60px, 8vw, 120px) 0 clamp(50px, 6vw, 90px); overflow: hidden; }
.rev-grid { display: grid; gap: 40px; align-items: center; }
.ring { position: relative; width: min(280px, 70vw); aspect-ratio: 1; }
.ring svg { width: 100%; height: 100%; }
.ring p { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0; text-align: center; }
.ring b { font-family: var(--f-d); font-weight: 400; font-size: clamp(64px, 8vw, 92px); line-height: 1; }
.ring span { font-size: 14px; color: var(--ink-3); margin-top: 4px; }
.bars { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.bar { display: grid; grid-template-columns: minmax(110px, 1fr) auto 36px; gap: 14px; align-items: center; }
.bar-n { font-weight: 600; font-size: 15px; }
.bar b { font-family: var(--f-d); font-weight: 400; font-size: 21px; text-align: right; }
.bar-c { display: grid; grid-template-columns: repeat(10, 1fr); gap: 4px; width: clamp(150px, 26vw, 300px); }
.bar-c i { position: relative; aspect-ratio: 1; border-radius: 3px; background: var(--stone); overflow: hidden; }
.bar-c i::before { content: ""; position: absolute; inset: 0; right: auto; width: calc(var(--f) * 100%); background: var(--ie) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.5 2.5l5 5M7.5 2.5l-5 5' stroke='%23fff' stroke-width='1.3' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E") left center / auto 100% no-repeat; }
.anim .bar-c i::before { transform: scale(0); transition: transform .4s var(--ease); }
.anim .bar.in .bar-c i::before { transform: none; }
@media (min-width: 900px) { .rev-grid { grid-template-columns: 5fr 7fr; gap: 70px; } }
@media (max-width: 480px) { .bar { grid-template-columns: 1fr 36px; } .bar-c { grid-column: 1 / -1; grid-row: 2; width: 100%; } }
.marquee { margin-top: clamp(50px, 7vw, 90px); display: grid; gap: 18px; -webkit-mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.mq-row { display: flex; gap: 18px; width: max-content; margin: 0; padding: 0; list-style: none; animation: mq 70s linear infinite; }
.mq-b { animation-direction: reverse; animation-duration: 60s; }
.marquee:hover .mq-row { animation-play-state: paused; }
@keyframes mq { to { transform: translateX(calc(-50% - 9px)); } }
.rc { width: min(360px, 78vw); padding: 22px 24px; border-radius: 20px; background: var(--card); box-shadow: var(--shadow); }
.rc-q { margin: 0; font-family: var(--f-d); font-size: 19px; line-height: 1.35; }
.rc-tr { display: block; margin-top: 8px; font-size: 14px; color: var(--ink-3); font-style: italic; }
.rc-by { margin: 12px 0 0; font-size: 14px; color: var(--ink-3); }
.rc-by b { color: var(--ie); }

/* ---------- galerie */
.gal { padding: clamp(60px, 8vw, 110px) 0; background: var(--paper-2); }
.gal-pin { overflow: hidden; }
.gal-head { margin-bottom: 30px; }
.gal-hint { color: var(--ink-3); margin: 0; }
.gal-track { display: flex; gap: 16px; padding: 10px var(--gut) 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.g-item { position: relative; flex: none; width: min(78vw, 520px); padding: 0; border: 0; border-radius: var(--r); overflow: hidden; background: var(--stone); cursor: zoom-in; scroll-snap-align: center; box-shadow: var(--shadow); }
.g-item.is-tall { width: min(58vw, 340px); }
.g-item img { width: 100%; height: clamp(300px, 52vh, 520px); object-fit: cover; transition: transform 1s var(--ease); }
.g-item:hover img { transform: scale(1.06); }
.g-cap { position: absolute; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px 8px 8px; border-radius: 12px; background: rgba(255, 253, 249, .92); font-size: 14px; font-weight: 600; text-align: left; }
.g-cap i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--ie); color: #fff; font-style: normal; font-size: 12px; }
@media (min-width: 1000px) {
  .js-pin .gal { padding: 0; }
  .js-pin .gal-pin { height: 100vh; display: flex; flex-direction: column; justify-content: center; }
  .js-pin .gal-track { overflow: visible; width: max-content; padding-left: max(var(--gut), calc((100vw - var(--wrap)) / 2 + var(--gut))); padding-right: 12vw; }
}

/* ---------- împrejurimi */
.near { padding: clamp(60px, 8vw, 120px) 0; }
.near-list { display: grid; gap: clamp(26px, 4vw, 40px); }
.spot { position: relative; display: grid; gap: 0; border-radius: calc(var(--r) + 6px); background: var(--card); box-shadow: var(--shadow); overflow: hidden; }
.spot-art { position: relative; padding: 20px; background: radial-gradient(120% 90% at 50% 100%, #e3efe0, #f3efe5 70%); }
.spot-art .deco-svg { width: 100%; max-width: 520px; height: auto; margin: 0 auto; overflow: visible; }
.spot-txt { padding: clamp(24px, 4vw, 48px); align-self: center; }
.spot-txt p:not(.km) { color: var(--ink-2); margin: 0; }
.km { margin: 0 0 8px; font-weight: 700; color: var(--ie); font-size: 18px; }
.km b { font-family: var(--f-d); font-weight: 400; font-size: clamp(54px, 6vw, 80px); line-height: 1; color: var(--ink); }
@media (min-width: 900px) {
  .spot { grid-template-columns: 6fr 5fr; }
  .spot-rev .spot-art { order: 2; }
}

/* ---------- locație */
.loc { --curtain: var(--paper-2); padding: clamp(60px, 8vw, 120px) 0; background: linear-gradient(180deg, transparent, var(--paper-2)); }
.loc-grid { display: grid; gap: 40px; align-items: start; }
.addr { display: flex; gap: 14px; margin: 0 0 18px; font-style: normal; font-size: 18px; line-height: 1.5; }
.addr svg { width: 28px; height: 28px; flex: none; color: var(--ie); margin-top: 4px; }
.addr b { display: block; font-family: var(--f-d); font-weight: 400; font-size: 24px; }
.loc-txt > p { color: var(--ink-2); }
.loc-btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 30px; }
.drone { display: flex; align-items: center; gap: 16px; margin: 0; }
.drone img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; border: 5px solid var(--card); box-shadow: var(--shadow); }
.drone figcaption { font-size: 14px; color: var(--ink-3); max-width: 16em; }
.map { position: relative; }
.map-frame { position: relative; border-radius: calc(var(--r) + 6px); overflow: hidden; padding: 10px; background: var(--card); box-shadow: var(--shadow); }
.map-frame::after { content: ""; position: absolute; inset: 5px; border-radius: calc(var(--r) + 2px); border: 1.5px dashed rgba(200, 50, 58, .45); pointer-events: none; }
.map iframe { display: block; width: 100%; height: clamp(360px, 52vh, 520px); border: 0; border-radius: var(--r); background: var(--stone); }
.map-pin { position: absolute; top: -34px; left: 28px; width: 54px; height: auto; filter: drop-shadow(0 10px 8px rgba(0, 0, 0, .25)); will-change: transform; animation: bob 2.2s ease-in-out infinite alternate; }
@keyframes bob { to { transform: translateY(-10px); } }
@media (min-width: 960px) { .loc-grid { grid-template-columns: 5fr 7fr; gap: 60px; } }

/* ---------- reguli */
.rules { padding: clamp(50px, 7vw, 100px) 0; }
.rule-list { display: grid; gap: 14px; grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none; }
.rule { position: relative; padding: 22px 22px 22px 58px; border-radius: 18px; background: var(--card); box-shadow: var(--shadow); }
.rule::before { content: ""; position: absolute; left: 20px; top: 24px; width: 22px; height: 22px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='%23c8323a'%3E%3Crect x='17' y='2' width='6' height='6'/%3E%3Crect x='11' y='8' width='6' height='6'/%3E%3Crect x='23' y='8' width='6' height='6'/%3E%3Crect x='5' y='14' width='6' height='12'/%3E%3Crect x='29' y='14' width='6' height='12'/%3E%3Crect x='11' y='26' width='6' height='6'/%3E%3Crect x='23' y='26' width='6' height='6'/%3E%3Crect x='17' y='32' width='6' height='6'/%3E%3C/g%3E%3Crect x='17' y='17' width='6' height='6' fill='%231f1a17'/%3E%3C/svg%3E") center / contain no-repeat; }
.rule b { display: block; font-size: 17px; margin-bottom: 2px; }
.rule span { color: var(--ink-2); font-size: 15px; }
@media (min-width: 700px) { .rule-list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .rule-list { grid-template-columns: repeat(3, 1fr); } }

/* ---------- final */
.final { padding: clamp(80px, 11vw, 160px) 0; color: var(--paper); text-align: center; overflow: hidden; background: var(--ie-d); }
.final-bg { position: absolute; inset: -20% 0; background-color: var(--ie); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' opacity='.16'%3E%3Cpath d='M28 6l22 22-22 22L6 28z'/%3E%3Cpath d='M24 24l8 8M32 24l-8 8'/%3E%3C/g%3E%3C/svg%3E"); }
.final-in { position: relative; display: flex; flex-direction: column; align-items: center; }
.final-mark { width: 64px; height: 64px; margin-bottom: 20px; filter: brightness(0) invert(1); }
.final .h2 { max-width: 15em; }
.final p { max-width: 34em; margin: 0 0 30px; font-size: 19px; opacity: .92; }
.final .btn-wa { --bg: #fff; --fg: var(--wa); box-shadow: 0 20px 40px -16px rgba(0, 0, 0, .45); }
.final .btn-wa::after { border-color: rgba(17, 128, 63, .35); }
.final .btn-wa:hover { --bg: #f0fff5; }
.tel { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; font-weight: 600; text-decoration: none; opacity: .9; border-bottom: 1.5px dashed rgba(255, 255, 255, .5); padding-bottom: 2px; }
.tel svg { width: 18px; height: 18px; }

/* ---------- subsol */
.foot { padding: 50px 0 120px; background: var(--ink); color: rgba(247, 243, 236, .8); font-size: 15px; }
.foot-in { display: grid; gap: 20px; }
.foot .brand-txt small { color: rgba(247, 243, 236, .55); }
.foot p { margin: 0; }
.foot a { color: #fff; }
.foot-small { font-size: 13px; color: rgba(247, 243, 236, .5); }
@media (min-width: 800px) { .foot { padding-bottom: 50px; } .foot-in { grid-template-columns: auto 1fr auto; align-items: center; gap: 40px; } }

/* ---------- WhatsApp plutitor + bara de mobil */
.wa-float { position: fixed; right: 22px; bottom: 22px; z-index: 45; display: none; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--wa); color: #fff; box-shadow: 0 14px 30px -10px rgba(17, 128, 63, .85); text-decoration: none; }
.wa-float svg { width: 34px; height: 34px; }
.wa-float::before, .wa-float::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--wa); animation: pulse 2.6s ease-out infinite; }
.wa-float::after { animation-delay: 1.3s; }
@keyframes pulse { from { transform: scale(1); opacity: .8; } to { transform: scale(1.8); opacity: 0; } }
.wa-tip { position: absolute; right: 78px; padding: 8px 14px; border-radius: 12px; background: var(--ink); color: #fff; font-size: 14px; font-weight: 600; white-space: nowrap; opacity: 0; transform: translateX(8px); transition: opacity .25s, transform .25s var(--ease); pointer-events: none; }
.wa-float:hover .wa-tip, .wa-float:focus-visible .wa-tip { opacity: 1; transform: none; }
.mbar { position: fixed; left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); z-index: 45; display: grid; grid-template-columns: 2fr 1fr; gap: 8px; padding: 6px; border-radius: 20px; background: rgba(31, 26, 23, .96); box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .5); }
.mbar a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; border-radius: 15px; font-weight: 700; text-decoration: none; color: #fff; }
.mbar svg { width: 22px; height: 22px; }
.mbar-wa { background: var(--wa); }
.mbar-tel { background: rgba(255, 255, 255, .12); }
@media (min-width: 800px) { .wa-float { display: grid; } .mbar { display: none; } }

/* ---------- lightbox */
.lb { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(20, 16, 14, .94); color: #fff; }
.lb[open] { display: grid; place-items: center; }
.lb::backdrop { background: transparent; }
.lb figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 60px 16px; }
.lb img { max-width: min(92vw, 1200px); max-height: 78vh; width: auto; height: auto; border-radius: 14px; }
.lb figcaption { font-family: var(--f-d); font-size: 22px; text-align: center; }
.lb button { position: absolute; display: grid; place-items: center; width: 52px; height: 52px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer; transition: background-color .2s; }
.lb button:hover { background: var(--ie); }
.lb button svg { width: 24px; height: 24px; }
.lb-x { top: 16px; right: 16px; }
.lb-prev { left: 16px; top: 50%; margin-top: -26px; }
.lb-next { right: 16px; top: 50%; margin-top: -26px; }
.lb-n { position: absolute; top: 26px; left: 0; right: 0; margin: 0; text-align: center; font-size: 14px; opacity: .7; }
@media (max-width: 700px) { .lb-prev, .lb-next { top: auto; bottom: 20px; margin: 0; } }

/* ---------- stări inițiale pentru animații (doar cu JS și fără reduced-motion) */
.anim .rv, .anim .rv-card, .anim .fac-i, .anim [data-count] { opacity: 0; translate: 0 34px; transition: opacity .9s var(--ease), translate .9s var(--ease); transition-delay: calc(var(--i, 0) * 80ms); }
.anim .rv-card { translate: 0 60px; transition-duration: 1.1s; }
.anim .rv.in, .anim .rv-card.in, .anim .fac-i.in, .anim [data-count].in { opacity: 1; translate: none; }
.rv-img { position: relative; }
.anim .rv-img::before { content: ""; position: absolute; inset: -1px; z-index: 3; background: var(--curtain, var(--paper)); transform-origin: 50% 0; transition: transform 1.2s cubic-bezier(.77, 0, .18, 1); transition-delay: calc(var(--i, 0) * 90ms); pointer-events: none; }
.anim .rv-img.in::before { transform: scaleY(0); }
.anim .rv-img:not(.in) img { transform: scale(1.25); }
.rv-img img { transition: transform 1.6s var(--ease); }
.anim .split { visibility: hidden; }
.anim .split.is-split { visibility: visible; }
.anim .split .w-i { transform: translateY(110%) rotate(4deg); transition: transform 1s cubic-bezier(.16, 1, .3, 1); transition-delay: calc(var(--w, 0) * 50ms); }
.anim .split.in .w-i { transform: none; }
.anim .ring .ring-p { stroke-dashoffset: 527.8; transition: stroke-dashoffset 2s cubic-bezier(.65, 0, .35, 1) .2s; }
.anim .ring.in .ring-p { stroke-dashoffset: 47.5; }
.anim .motif .cube { opacity: 0; transform: translateY(-60px); transition: opacity .5s, transform .7s cubic-bezier(.34, 1.56, .64, 1); transition-delay: calc(var(--k) * 70ms); }
.anim .motif.in .cube { opacity: 1; transform: none; }
.off :is(.cloud, .bird, .h-birds, .smoke circle, .h-caustic path, .swing, .m-wheel, .m-chute, .m-flow, .g-flow, .m-splash circle, .f-strands path, .f-ripples ellipse, .f-mist ellipse, .ico-ripple path, .ico-flame path, .ico-steam path, .ico-wifi path, .ico-air path, .hand-m, .hand-h, .scooter, .speed line, .wv1, .wv2, .mq-row, .map-pin, .scroll-cue span) { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .mq-row { animation: none !important; flex-wrap: wrap; width: auto; }
  .rc[aria-hidden] { display: none; }
  .marquee { -webkit-mask: none; mask: none; padding-inline: var(--gut); }
}

/* ---------- performanță pe mobil: secțiunile din afara ecranului nu se așază până nu te apropii de ele */
@media (max-width: 999px) {
  .court, .pool, .rooms, .common, .fac, .rev, .gal, .near, .loc, .rules, .final, .foot { content-visibility: auto; }
  .court { contain-intrinsic-size: auto 1726px; }
  .pool { contain-intrinsic-size: auto 914px; }
  .rooms { contain-intrinsic-size: auto 2340px; }
  .common { contain-intrinsic-size: auto 1014px; }
  .fac { contain-intrinsic-size: auto 1023px; }
  .rev { contain-intrinsic-size: auto 1373px; }
  .gal { contain-intrinsic-size: auto 753px; }
  .near { contain-intrinsic-size: auto 2526px; }
  .loc { contain-intrinsic-size: auto 1081px; }
  .rules { contain-intrinsic-size: auto 642px; }
  .final { contain-intrinsic-size: auto 559px; }
  .foot { contain-intrinsic-size: auto 315px; }
}
@media (max-width: 699px) {
  .court { contain-intrinsic-size: auto 2224px; }
  .pool { contain-intrinsic-size: auto 1002px; }
  .rooms { contain-intrinsic-size: auto 2084px; }
  .common { contain-intrinsic-size: auto 1516px; }
  .fac { contain-intrinsic-size: auto 1544px; }
  .rev { contain-intrinsic-size: auto 1729px; }
  .gal { contain-intrinsic-size: auto 779px; }
  .near { contain-intrinsic-size: auto 2129px; }
  .loc { contain-intrinsic-size: auto 1161px; }
  .rules { contain-intrinsic-size: auto 980px; }
  .final { contain-intrinsic-size: auto 574px; }
  .foot { contain-intrinsic-size: auto 339px; }
}