:root {
  --crem: #f5efe3;
  --crem-inchis: #e9dfcc;
  --verde-inchis: #1f3a2b;
  --verde-text: #22382b;
  --rosu: #8e1b24;
  --rosu-inchis: #6f141c;
  --rosu-voal: rgba(142, 27, 36, 0.86);
  --alb: #ffffff;
  --negru-voal: rgba(0, 0, 0, 0.5);
  --inaltime-bara: 76px;
  --font-titlu: Georgia, "Times New Roman", serif;
  --font-text: Georgia, "Times New Roman", serif;
  --marime-text: clamp(1.25rem, 1.1rem + .35vw, 1.35rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--inaltime-bara); }
body {
  margin: 0;
  background: var(--crem);
  color: var(--verde-text);
  font-family: var(--font-text);
  font-style: italic;
  font-size: 18px;
  line-height: 1.6;
}
img { max-width: 100%; display: block; }
button { font: inherit; color: inherit; }
a { color: var(--rosu); }
h1, h2, h3 { font-family: var(--font-titlu); font-style: italic; color: var(--verde-inchis); line-height: 1.2; }
h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0 0 .6em; }
h3 { font-size: 1.5rem; margin: 0 0 .6em; }
.cazare-text h3, .introducere h3 { margin-top: 1.4em; font-size: clamp(1.25rem, 2.4vw, 1.5rem); }
.despre-incheiere, .cazare-text p, .camera-descriere, .introducere p, .contact-date p:not(.contact-nume), .contact-date address, .harta-acord p, .pagina-simpla p {
  font-family: var(--font-titlu); font-size: var(--marime-text); font-style: italic; color: var(--verde-inchis);
}
.coperta-continut p { font-family: var(--font-titlu); font-size: var(--marime-text); font-style: italic; }
[hidden] { display: none !important; }
.ascuns-vizual { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
body.fara-derulare { overflow: hidden; }

.bara-sus {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  height: var(--inaltime-bara);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(16px, 3vw, 40px);
  background: var(--rosu-voal);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.sigla { display: flex; align-items: center; flex: none; color: var(--alb); font-family: var(--font-titlu); font-size: 1.4rem; text-decoration: none; white-space: nowrap; }
.sigla img { width: min(436px, calc(100vw - 88px)); height: auto; }
.sigla:focus-visible { outline: 2px solid var(--alb); outline-offset: 3px; border-radius: 4px; }
.meniu { display: flex; align-items: center; gap: clamp(10px, 1.6vw, 24px); }
.meniu a { color: var(--alb); text-decoration: none; font-size: 1.02rem; white-space: nowrap; }
.meniu a:hover, .meniu a:focus-visible { text-decoration: underline; }
.meniu .buton-rezerva {
  background: var(--alb); color: var(--rosu); font-weight: 700;
  padding: 8px 18px; border-radius: 4px;
}
.meniu .buton-rezerva:hover { text-decoration: none; background: var(--crem); }
.meniu .link-en { font-size: .78rem; font-weight: 700; border: 1px solid rgba(255,255,255,.7); padding: 1px 6px; border-radius: 3px; }

.buton-meniu { display: none; background: none; border: 0; padding: 10px; cursor: pointer; }
.buton-meniu span { display: block; width: 26px; height: 2px; background: var(--alb); margin: 6px 0; }

@media (max-width: 1260px) {
  .buton-meniu { display: block; }
  .meniu {
    position: fixed; top: var(--inaltime-bara); right: 0; bottom: 0;
    width: min(80vw, 320px);
    flex-direction: column; align-items: flex-start; gap: 0;
    padding: 12px 24px 24px;
    background: var(--rosu);
    backdrop-filter: none; -webkit-backdrop-filter: none;
    display: none;
  }
  .meniu.deschis { display: flex; }
  .meniu a { display: block; width: 100%; padding: 12px 0; font-size: 1.12rem; border-bottom: 1px solid rgba(255,255,255,.18); }
  .meniu .buton-rezerva { margin-top: 16px; text-align: center; border-bottom: 0; }
  .meniu .link-en { width: auto; margin-top: 16px; border: 1px solid rgba(255,255,255,.7); }
}

.buton-rosu {
  display: inline-block;
  background: var(--rosu); color: var(--alb);
  font: italic 600 1.08rem var(--font-text);
  padding: 14px 26px; border: 0; border-radius: 4px;
  text-decoration: none; cursor: pointer;
}
.buton-rosu:hover, .buton-rosu:focus-visible { background: var(--rosu-inchis); }

.js .buton-sectiune {
  opacity: 0; transform: scale(.9);
  transition: opacity .6s ease, transform .6s ease;
}
.js .buton-sectiune.vizibil { opacity: 1; transform: scale(1); }
@media (prefers-reduced-motion: reduce) {
  .js .buton-sectiune { opacity: 1; transform: none; transition: none; }
}

.coperta { position: relative; background: var(--verde-inchis); }
.coperta-apasa {
  position: relative; display: block; width: 100%; height: 100vh; height: 100svh;
  padding: 0; border: 0; margin: 0; cursor: pointer; overflow: hidden; background: #000;
}
.coperta-imagine { width: 100%; height: 100%; object-fit: cover; }
#pensiune .coperta-imagine { object-position: 68% 50%; }
.coperta-apasa picture, .coperta-sectiune > picture { position: absolute; inset: 0; }
.coperta-sectiune > picture img { width: 100%; height: 100%; object-fit: cover; }
.voal { position: absolute; inset: 0; background: var(--negru-voal); }
.coperta-text {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: var(--inaltime-bara) 20px 20px; text-align: center; color: var(--alb);
  text-shadow: 0 1px 3px rgba(0,0,0,.75), 0 0 12px rgba(0,0,0,.45);
}
.coperta-titlu { font-family: var(--font-titlu); font-size: clamp(2.6rem, 8vw, 5.5rem); line-height: 1.05; }
.coperta-indemn { margin-top: 18px; font-size: clamp(1.12rem, 2.4vw, 1.4rem); max-width: 34ch; }

.introducere { max-width: 820px; margin: 0 auto; padding: 56px 20px; background: var(--crem); }
.coperta > .introducere { max-width: none; }
.coperta > .introducere > * { max-width: 780px; margin-left: auto; margin-right: auto; }
.introducere h1 { font-size: clamp(1.7rem, 4vw, 2.4rem); margin: 0 0 .6em; }

.coperta-sectiune { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; }
.coperta-sectiune > .coperta-continut {
  position: relative; z-index: 1; color: var(--alb); text-align: center;
  max-width: 720px; padding: calc(var(--inaltime-bara) + 20px) 20px 40px;
}
.coperta-continut h2 { color: var(--alb); }
.coperta-continut { text-shadow: 0 1px 3px rgba(0,0,0,.75), 0 0 12px rgba(0,0,0,.45); }
.coperta-continut .buton-rosu { text-shadow: none; }
#evenimente { display: block; min-height: 0; }

.cazare { display: grid; grid-template-columns: 1fr 1fr; min-height: 80vh; background: var(--crem); }
.cazare-imagine picture, .cazare-imagine img { width: 100%; height: 100%; object-fit: cover; }
#cazare .cazare-imagine { overflow: hidden; }
#cazare .cazare-imagine { position: relative; }
#cazare .cazare-panza { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cazare-text { padding: clamp(32px, 6vw, 80px); align-self: center; }
.despre { background: var(--crem-inchis); }
.parc { background: var(--crem-inchis); }
.parc-poze { position: relative; overflow: hidden; background: #d9cbb1; min-height: 320px; }
.parc-poze img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.js .parc-poze img { visibility: hidden; transform: translate3d(100%, 0, 0); cursor: zoom-in; }
.js .parc-poze img.pregatit { visibility: visible; }
.js .parc-poze img.activ, .js .parc-poze img.iese { visibility: visible; transition: transform 1.1s cubic-bezier(.65, 0, .35, 1); }
.js .parc-poze img.activ { transform: translate3d(0, 0, 0); }
.js .parc-poze img.iese { transform: translate3d(-100%, 0, 0); }
.js .parc-poze img.fara-tranzitie { transition: none; }
.parc-poze img:focus-visible { outline: 3px solid var(--rosu); outline-offset: -3px; }
@media (prefers-reduced-motion: reduce) { .js .parc-poze img.activ, .js .parc-poze img.iese { transition: none; } }
@media (max-width: 800px) {
  .cazare { grid-template-columns: 1fr; }
  .despre .cazare-imagine { order: -1; }
  .cazare-imagine, .parc-poze { aspect-ratio: 4 / 3; min-height: 0; }
}

.js .camere:not(.deschis) { display: none; }
.js .camere.deschis {
  position: fixed; left: 0; right: 0; bottom: 0; top: var(--inaltime-bara); z-index: 40;
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  padding-top: 32px;
}
.camere-inchide { display: none; }
.js .camere.deschis .camere-inchide {
  display: inline-block; position: sticky; top: 0; z-index: 2;
  float: right; margin: -16px 0 0 12px;
}
.camere { padding: 64px clamp(16px, 4vw, 48px); background: var(--crem-inchis); }
.camere > h2 { text-align: center; }
.camera { max-width: 980px; margin: 0 auto 40px; }
.camera:last-child { margin-bottom: 0; }
.camera > .buton-rosu { margin-bottom: 20px; }
.galerie { position: relative; background: #000; border-radius: 4px; overflow: hidden; }
.galerie-imagine { width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 45vh; max-height: 45svh; object-fit: cover; }
.galerie-sageata {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 48px; height: 64px; border: 0; cursor: pointer;
  background: var(--rosu-voal); color: var(--alb); font-size: 2rem; line-height: 1;
}
.galerie-sageata.stanga { left: 0; border-radius: 0 4px 4px 0; }
.galerie-sageata.dreapta { right: 0; border-radius: 4px 0 0 4px; }
.galerie-contor {
  position: absolute; right: 12px; bottom: 8px; margin: 0;
  color: var(--alb); background: rgba(0,0,0,.5); padding: 0 8px; border-radius: 3px; font-size: .9rem;
}
.camera-descriere { margin-top: 18px; }
.js .galerie-imagine { cursor: zoom-in; }
.galerie-imagine:focus-visible { outline: 3px solid var(--rosu); outline-offset: -3px; }

.overlay-poza { background: rgba(0, 0, 0, .94); display: flex; align-items: center; justify-content: center; touch-action: pan-y; }
.poza-mare { max-width: 100vw; max-height: 100vh; max-height: 100svh; width: auto; height: auto; object-fit: contain; }
.overlay-poza .galerie-sageata { z-index: 2; }
.poza-contor { bottom: 16px; right: 50%; transform: translateX(50%); }

.contact { padding: 64px clamp(16px, 4vw, 48px); background: var(--crem); }
.contact > h2 { text-align: center; }
.contact-grila { display: grid; grid-template-columns: 1fr 1.4fr; gap: 32px; max-width: 1100px; margin: 0 auto; }
.contact-nume { font-family: var(--font-titlu); font-size: 1.5rem; color: var(--verde-inchis); margin: 0 0 .4em; }
address { font-style: normal; margin-bottom: 1em; }
.contact-butoane { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 1.2em; }
.contact-harta { min-height: 380px; }
.contact-harta iframe { width: 100%; height: 100%; min-height: 380px; border: 0; border-radius: 4px; }
.harta-acord {
  height: 100%; min-height: 380px; border-radius: 4px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  padding: 24px; text-align: center; background: var(--crem-inchis); border: 1px solid #d6c9b0;
}
.harta-acord p { margin: 0; max-width: 42ch; font-size: 1.02rem; }
.intrebari { max-width: 820px; margin: 48px auto 0; }
@media (max-width: 800px) { .contact-grila { grid-template-columns: 1fr; } }

.subsol { background: var(--verde-inchis); color: var(--crem); text-align: center; padding: 32px 20px; font-size: .98rem; }
.subsol nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; margin-bottom: 12px; }
.subsol a { color: var(--crem); }
.subsol p { margin: 4px 0; }

.overlay { position: fixed; inset: 0; z-index: 100; background: #000; }
.overlay-inchide {
  position: absolute; top: 12px; right: 12px; z-index: 3;
  width: 48px; height: 48px; border: 0; border-radius: 50%;
  background: var(--rosu); color: var(--alb); font-size: 2rem; line-height: 1; cursor: pointer;
}
.overlay-tur { overflow: hidden; touch-action: none; overscroll-behavior: contain; }
.tur-panza {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
}
.overlay-tur.activ .tur-panza { will-change: contents; }
.tur-incarcare {
  position: absolute; left: 0; right: 0; top: 50%; margin: 0; text-align: center;
  color: var(--crem); font-size: 1rem;
}
.derulati-bloc {
  position: absolute; left: 16px; right: 16px; bottom: 24px;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  text-align: center; color: var(--alb); pointer-events: none;
  text-shadow: 0 1px 4px rgba(0,0,0,.85), 0 0 14px rgba(0,0,0,.5);
}
.derulati {
  order: 2; margin: 0;
  font-weight: 700; letter-spacing: .14em; font-size: clamp(1.1rem, 2.2vw, 1.6rem); line-height: 1.3;
  animation: derulati 1.6s ease-in-out infinite;
}
.derulati::after { content: "↓"; display: block; font-size: 1.8rem; letter-spacing: 0; }
@keyframes derulati {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(8px); opacity: .6; }
}
.derulati.ascuns { display: none; }
.derulati-nota { order: 1; max-width: 640px; font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.4; }
.derulati.ascuns + .derulati-nota { display: none; }
.tur-rapid { order: 3; pointer-events: auto; text-shadow: none; box-shadow: 0 2px 12px rgba(0, 0, 0, .45); }
.tur-rapid.activ { background: rgba(0, 0, 0, .55); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7); }
.tur-rapid.activ:hover, .tur-rapid.activ:focus-visible { background: rgba(0, 0, 0, .75); }

.overlay-meniu { background: rgba(0, 0, 0, .7); display: flex; align-items: center; justify-content: center; padding: 20px; }
.meniu-foaie {
  background: var(--crem); max-width: 760px; width: 100%; max-height: 88vh; overflow: auto;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  padding: 40px clamp(20px, 5vw, 48px); border-radius: 4px; border-top: 6px solid var(--rosu);
}
.meniu-cuprins {
  position: sticky; top: -40px; z-index: 1; margin: 0 calc(-1 * clamp(20px, 5vw, 48px)) 8px;
  padding: 10px clamp(20px, 5vw, 48px); background: var(--crem); border-bottom: 1px solid var(--crem-inchis);
  display: flex; gap: 8px; overflow-x: auto; scrollbar-width: thin;
}
.meniu-cuprins a {
  flex: none; padding: 6px 12px; border: 1px solid var(--rosu); border-radius: 999px;
  font-size: .95rem; line-height: 1.3; text-decoration: none; white-space: nowrap;
}
.meniu-cuprins a:hover, .meniu-cuprins a:focus-visible { background: var(--rosu); color: var(--alb); }
.meniu-categorie { padding-top: 28px; scroll-margin-top: 58px; }
.meniu-poza { display: block; aspect-ratio: 16 / 4; margin: 0 0 16px; background: var(--crem-inchis); border-radius: 3px; overflow: hidden; }
.meniu-poza img { width: 100%; height: 100%; object-fit: cover; }
.meniu-categorie h3 { margin-bottom: .3em; }
.meniu-lista { list-style: none; padding: 0; margin: 0; }
.meniu-lista li {
  display: flex; flex-wrap: wrap; justify-content: space-between; column-gap: 16px;
  padding: 9px 0; border-bottom: 1px dotted var(--verde-inchis);
}
.meniu-fel { flex: 1 1 0; min-width: 0; font-weight: 600; }
.meniu-gramaj { flex: none; color: #4a5a4f; font-size: .96rem; white-space: nowrap; }
.meniu-ingrediente { flex-basis: 100%; color: #4a5a4f; font-size: .96rem; line-height: 1.45; }
.meniu-nota { margin: 28px 0 0; font-size: 1rem; }
@media (min-width: 801px) {
  .meniu-cuprins { flex-wrap: wrap; overflow: visible; }
  .meniu-categorie { scroll-margin-top: 100px; }
}

.pagina-simpla { max-width: 820px; margin: 0 auto; padding: calc(var(--inaltime-bara) + 40px) 20px 64px; }
.pagina-simpla h1 { font-size: clamp(2.25rem, 4.5vw, 2.8rem); margin: 0 0 .5em; }
.pagina-simpla h2 { font-size: clamp(1.5rem, 2.6vw, 1.9rem); margin: 1.3em 0 .5em; }

@media (max-width: 800px) {
  :root { --inaltime-bara: 64px; }
  .contact-date p a, .subsol nav a, .subsol p a {
    display: inline-block; min-height: 44px; padding: 10px 4px; line-height: 24px;
  }
  .contact-date p { margin: 4px 0; }
  .subsol nav { gap: 0 12px; }
  .contact-harta, .harta-acord, .contact-harta iframe { min-height: 300px; }
  .coperta > .introducere, .introducere { padding: 40px 20px; }
  .contact, .camere { padding-top: 48px; padding-bottom: 48px; }
  .coperta-indemn { font-size: 1.15rem; }
  .derulati-bloc { bottom: calc(16px + env(safe-area-inset-bottom)); }
}