/* additional styles appended for re-built sections */

/* hero refinement — exact doc heading is long; let it breathe */
.hero-headline{
  font-size:clamp(30px, 3.4vw, 54px) !important;
  line-height:1.08 !important;
  max-width:24ch !important;
  letter-spacing:-0.018em !important;
  font-weight:400;
}
.hero-headline em{
  font-style:italic;
  color:#F4B5C3;
}
.hero-headline .tail{
  display:block;
  font-style:italic;
  opacity:0.78;
  margin-top:14px;
  font-size:0.62em;
  line-height:1.25;
  color:#F4B5C3;
}
.hero-inner{
  justify-content: center !important;
  align-items: flex-end !important;
  padding-top: 98px !important;   /* зсув на висоту хедера — щоб центрування йшло у вільній зоні під хедером */
  padding-bottom: 0 !important;
  padding-right: 0 !important;
}

/* ════════════════════════════════════════
   HERO — entrance animations
   ════════════════════════════════════════ */

/* Панель з'їжджає з правого краю + проявляється */
@keyframes heroPanelIn {
  0%   { transform: translateX(90px) scale(0.97); opacity: 0; }
  55%  { opacity: 1; }
  100% { transform: translateX(0)    scale(1);    opacity: 1; }
}

/* Кожне слово заголовка вистрибує знизу (clip-reveal) */
@keyframes hwReveal {
  0%   { transform: translateY(110%); opacity: 0; }
  100% { transform: translateY(0);    opacity: 1; }
}

/* Рядок .tail — фейд + лёгке розмиття */
@keyframes tailFadeIn {
  0%   { opacity: 0;    transform: translateY(8px);  filter: blur(6px); }
  100% { opacity: 0.78; transform: translateY(0);    filter: blur(0);   }
}

.hero-panel {
  animation: heroPanelIn 1.15s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both;
}

/* Обгортка слова — ховає вихід за нижній край */
.hw-outer {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  line-height: inherit;
}
.hw-inner {
  display: inline-block;
  animation: hwReveal 0.65s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.hero-headline .tail {
  animation: tailFadeIn 0.9s ease both;
}

/* ── hero panel — рожева плашка праворуч ── */
.hero-panel{
  max-width: min(780px, 65%);   /* +30% від попередніх min(600px,50%) */
  text-align: right;
  background: rgba(244, 181, 195, 0.18);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  border: 1px solid rgba(244, 181, 195, 0.25);
  border-right: none;
  padding: clamp(36px, 3.5vw, 60px) clamp(28px, 5vw, 96px) clamp(36px, 3.5vw, 60px) clamp(36px, 3.5vw, 64px);
  border-radius: 20px 0 0 20px;
  margin-right: 0;
}
.hero-foot{ grid-template-columns: 1fr auto 1fr; }
.hero-subtitle{
  font-family:var(--sans);
  font-size:clamp(14px, 1.05vw, 17px);
  line-height:1.65;
  color:rgba(255,255,255,0.85);
  max-width:54ch;
  margin-top:28px;
  border-top:1px solid rgba(255,255,255,0.2);
  padding-top:22px;
}

/* benefits — single editorial paragraph (per doc), with 1px outline icon row */
.bens{
  background:var(--bg);
  padding: clamp(40px, 4.5vw, 70px) clamp(24px, 5vw, 96px) 0;
}
.bens .wrap{
  display:grid; grid-template-columns: 1fr; gap: 60px;
}
.bens .lead-quote{
  font-family:var(--serif);
  font-size:clamp(28px, 3.6vw, 56px);
  line-height:1.15;
  font-style:italic;
  font-weight:400;
  color:var(--ink);
  max-width:26ch;
  margin: 0;
  letter-spacing:-0.015em;
}
.bens .lead-quote::before{ content:'„'; color:var(--burgundy); }
.bens .lead-quote::after{ content:'“'; color:var(--burgundy); }
.bens .features{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  border-top:1px solid var(--line);
  margin-top:20px;
}
.bens .feat{
  padding: 32px 32px;
  display:flex; flex-direction:column; gap:18px;
  border-right:1px solid var(--line);
}
.bens .feat:first-child{ padding-left: 0; }
.bens .feat:last-child{ border-right:0; padding-right: 0; }
.bens .feat svg{ width:30px; height:30px; stroke:var(--burgundy); fill:none; stroke-width:1.25; }
.bens .feat img{ width:72px; height:72px; object-fit:contain; }

/* ── signoff: прибираємо зайвий padding після видалення qt + wordmark ── */
.signoff{
  padding-top: 0 !important;
}
.signoff .micro{
  margin-top: 0 !important;
  border-top: 1px solid var(--line);
}

/* ── kontakt-stamp → лого білим кольором ── */
.kontakt-stamp{
  border: none !important;
  border-radius: 0 !important;
  width: 180px !important;
  height: auto !important;
  background: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.kontakt-logo{
  width: 180px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

/* ── kitchen li: синхронізація висоти рядків з price-row ── */
.apt-detail .kitchen li {
  padding-top: 19px;
  padding-bottom: 19px;
}
.apt-detail .kitchen li::before {
  top: 29px;
}

/* ── erlebnis-list: вужча .ds, ширша .ar (max-content щоб не переносилось) ── */
.erlebnis-list li{
  grid-template-columns: 40px 1fr 1.5fr max-content;
}


/* ── apt-detail: kitchen + prices — рівні колонки 50/50 ── */
.apt-detail .kitchen{ grid-column: 1 / span 6; }
.apt-detail .prices { grid-column: 7 / span 6; padding-left: 80px; }

/* ── conditions / calendar / cta — приховані ── */
.apt-detail .conditions{ display: none; }
.apt-detail .calendar  { display: none; }
.apt-detail .apt-cta   { display: none; }
.bens .feat .nm{
  font-family:var(--serif); font-size:20px; line-height:1.15; color:var(--ink);
}
@media (max-width:1000px){
  .bens .features{ grid-template-columns: repeat(2, 1fr); }
  .bens .feat{ border-right:0; border-bottom:1px solid var(--line); }
}

/* CTA closer for Section 1 — full-width burgundy band but not heavy footer */
.willkommen-cta{
  background:var(--bg);
  padding: clamp(40px, 4.5vw, 70px) clamp(24px, 5vw, 96px) 0;
  border-top:1px solid var(--line);
}
.willkommen-cta .wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap: 48px; flex-wrap:wrap;
}
.willkommen-cta .q{
  font-family:var(--serif); font-style:italic;
  font-size:clamp(36px, 5vw, 78px);
  line-height:1.0;
  letter-spacing:-0.02em;
  color:var(--ink);
  max-width:14ch;
}
.willkommen-cta .q em{ color:var(--burgundy); }
.willkommen-cta .actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* ── рівномірні відступи між усіма секціями ── */
/* Кожна секція дає відступ тільки ЗВЕРХУ (знизу = 0).
   Пробіл між секціями = paddingTop наступної. */
.bens,
.willkommen,
.willkommen-cta,
.appartements,
.season,
.erlebnis,
.preise {
  padding-top:    clamp(40px, 4.5vw, 70px) !important;
  padding-bottom: 0 !important;
}
.erlebnis {
  margin-top: clamp(120px, 13.5vw, 210px) !important;
}

/* ── apt-detail: замінюємо великий внутрішній padding-top (204px) на стандартний ── */
.apt-detail {
  padding-top: clamp(40px, 4.5vw, 70px) !important;
}
/* між блоками Appartement 1/2/3 — відступ втричі більший ── */
.apt-detail + .apt-detail {
  padding-top: clamp(120px, 13.5vw, 210px) !important;
}
/* перед секцією Sommer/Winter — відступ втричі більший ── */
.season {
  padding-top:    clamp(120px, 13.5vw, 210px) !important;
}
/* після блоку Sommer — відступ перед Erlebniswelten ── */
.season.sommer {
  padding-bottom: clamp(120px, 13.5vw, 210px) !important;
}
/* під чорною секцією Winter — відступ знизу ── */
.season.winter {
  padding-bottom: clamp(120px, 13.5vw, 210px) !important;
}
/* перед Preise — більший відступ ── */
.preise {
  padding-top: clamp(120px, 13.5vw, 210px) !important;
}

/* перед секцією Drei Appartements (заголовок + картки) — більший відступ ── */
.appartements:not(#appartements) {
  padding-top: clamp(200px, 22vw, 340px) !important;
}
/* секція з деталями апартаментів — звичайний відступ ── */
#appartements {
  padding-top: clamp(40px, 4.5vw, 70px) !important;
}

/* ── season: приховати нумерацію — i. / — ii. над картками ── */
.season .act .ix { display: none; }

/* ══════════════════════════════════════
   SCROLL REVEAL
   ══════════════════════════════════════ */
@media (prefers-reduced-motion: no-preference) {
  .sr {
    opacity: 0;
    transition:
      opacity  0.85s cubic-bezier(0.16, 1, 0.3, 1),
      transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: var(--sr-d, 0s);
  }
  .sr-up    { transform: translateY(56px); }
  .sr-left  { transform: translateX(-56px); }
  .sr-right { transform: translateX(56px); }
  .sr-scale { transform: scale(0.88); }
  .sr-blur  { filter: blur(8px) translateY(24px); transform: translateY(24px); }

  .sr.in-view {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/* ── willkommen-cta: лінії зверху і знизу на 50% відступу ── */
.willkommen-cta {
  border-top: none !important;
  position: relative;
  padding-bottom: clamp(40px, 4.5vw, 70px) !important;
}
.willkommen-cta::before,
.willkommen-cta::after {
  content: '';
  display: block;
  position: absolute;
  left: clamp(24px, 5vw, 96px);
  right: 0;
  height: 1px;
  background: var(--line);
}
.willkommen-cta::before {
  top: clamp(30px, 3.5vw, 50px); /* 50% від padding-top */
}
.willkommen-cta::after {
  bottom: clamp(30px, 3.5vw, 50px); /* 50% від padding-bottom */
}