/* ==========================================================================
   pages/index.css: bloki wyłącznie strony głównej (prefiks .index-*)
   ========================================================================== */

/* 3. Obietnica miejsca: manifest typograficzny */
.index-promise{padding-top:calc(var(--section) * .9)}
.index-promise__title{max-width:24ch;margin-inline:auto;text-align:center;font-size:clamp(1.875rem, 1.2rem + 2.9vw, 3.75rem)}
.index-promise__facts{margin-top:var(--s-9)}
.index-promise__facts .fact__num{font-size:clamp(3.5rem, 2rem + 6vw, 7rem)}
.index-promise__summary{margin:var(--s-8) auto 0;font-size:var(--t-body);color:var(--ink-2)}
.index-promise__summary strong{color:var(--ink)}
@media (min-width:1024px){ .index-promise__summary{margin-left:calc((100% - var(--gap) * 2) / 3 + var(--gap))} }

/* 4. Noclegi */
.index-stays .section__head .t-lead{max-width:48ch}
.index-stays__apt{margin-top:var(--s-8)}
.index-stays__apt .stay-card__price{margin:0}
.index-stays .ptable__foot{margin-top:var(--s-4)}
.index-stays__wczasy{display:grid;gap:var(--s-6);margin-top:var(--s-9)}
.index-stays__wczasy-body{display:grid;gap:var(--s-4);justify-items:start}
.index-stays__from{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-3);margin-top:var(--s-2)}
.index-stays__wczasy .cluster{margin-top:var(--s-3)}
@media (min-width:1024px){
  .index-stays__wczasy{grid-template-columns:7fr 5fr;align-items:center;gap:var(--gap)}
  .index-stays__wczasy-media.frame--pano{aspect-ratio:16/7}
  .index-stays__wczasy-body{padding-left:var(--s-6)}
}
.index-stays[data-mode="wczasy"] .stay-card__price .t-price{color:var(--ink)}

/* 5. Dzień w Rejsie */
.index-day .frame-fig{margin-bottom:var(--s-8)}
.index-day__rail .rail__item{flex-basis:min(78vw, 360px)}
@media (min-width:1024px){ .index-day__rail .rail__item{flex-basis:calc((min(100vw, var(--wrap)) - 2 * var(--gutter) - 3 * var(--gap)) / 3.4)} }
.index-day__rail .rail__nav{margin-top:var(--s-6)}

/* 6. Wesela */
.index-wedding{padding-bottom:var(--section)}
.index-wedding__intro{display:grid;gap:var(--s-8)}
.index-wedding .facts .fact__num{color:var(--on-night)}
.index-scenes{margin-top:var(--s-9)}
.index-scenes .scenes__head{margin-bottom:var(--s-6)}
.index-scenes__hint{color:var(--on-night-2)}
@media (max-width:767px){ .index-scenes__hint{display:none} }
.index-wedding__offer{display:grid;gap:var(--s-8);margin-top:var(--s-9)}
@media (min-width:1024px){
  .index-wedding__offer{grid-template-columns:6fr 6fr;gap:var(--gap);align-items:start}
  .index-wedding__prices{padding-right:var(--s-8)}
}
.index-wedding__prices{display:grid;gap:var(--s-5);align-content:start}
.index-tiers{display:grid;list-style:none;margin:0;padding:0}
.index-tiers li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-4);padding:var(--s-4) 0;border-bottom:1px solid var(--line-dark);max-width:none}
.index-tiers li:first-child{border-top:1px solid var(--line-dark)}
.index-tiers__who{color:var(--on-night-2);font-weight:500}
.index-tiers .t-price{color:var(--on-night)}
.index-wedding .contact-line__name{color:var(--on-night)}
.index-wedding .contact-line a{color:var(--on-night)}
.index-wedding .calc .cluster{gap:var(--s-4) var(--s-5)}

/* 7. Przyjęcia i firmy */
.index-events .tile__title{font-size:clamp(1.25rem, 1.05rem + .8vw, 1.75rem)}

/* 8. Opinie */
.index-reviews .quote blockquote{max-width:28ch}
.index-reviews .t-quote{font-size:clamp(1.625rem, 1.2rem + 1.8vw, 2.75rem);line-height:1.2}

/* 8b. Okolica */
.index-area__grid{display:grid;gap:var(--s-9)}
.index-area__map{margin-bottom:var(--s-6)}
.index-area__map{position:relative;order:2;width:min(44vw, 190px);aspect-ratio:424/1197.7;margin-inline:auto;color:var(--ink)}
.index-area__map .shoreline{position:absolute;inset:0;width:100%;height:100%;color:var(--sky-ink)}
.index-area__map .shoreline path{fill:var(--foam)}
.index-area__dot{position:absolute;left:65.5%;top:86.6%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--accent)}
.index-area__dot::after{content:"";position:absolute;inset:-8px;border:1px solid var(--accent);border-radius:50%;opacity:.5}
.index-area__pin{position:absolute;left:calc(65.5% + 18px);top:86.6%;transform:translateY(-50%);font-size:var(--t-label);font-stretch:var(--w-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.index-area__lake{position:absolute;left:50%;top:100%;transform:translate(-50%,14px);white-space:nowrap;font-style:italic;font-weight:300;font-stretch:var(--w-wide);color:var(--ink-2);font-size:.9375rem}
.index-area__body{display:grid;gap:var(--s-5);justify-items:start}
.index-area__list{display:grid;gap:var(--s-5);list-style:none;margin:var(--s-4) 0 var(--s-3);padding:0}
.index-area__list li{display:grid;grid-template-columns:28px 1fr;gap:var(--s-4);align-items:start;max-width:52ch}
.index-area__list .i{color:var(--ink)}
.index-area__list p + p{margin-top:2px}
@media (min-width:1024px){
  .index-area__grid{grid-template-columns:5fr 7fr;align-items:center;gap:var(--gap)}
  .index-area__map{order:0;width:auto;height:min(78vh, 760px);max-width:100%}
}

/* 9. Plan ośrodka */
.index-map{padding-bottom:calc(var(--section) * .6)}
.index-map + .inquiry{padding-top:calc(var(--section) * .6);border-top:1px solid var(--line)}
@media (hover:hover) and (pointer:fine){
  .map-teaser__art{transition:border-color var(--d-ui) var(--ease-ui)}
  .map-teaser__art:hover{border-color:var(--ink-3)}
  .map-teaser__art:hover .mt-plate rect:first-child{fill:var(--accent)}
  .map-teaser__art:hover .mt-plate text{fill:var(--on-accent)}
  .map-teaser__art .mt-plate text{transition:fill var(--d-ui) var(--ease-ui)}
  .map-teaser__art .mt-plate rect:first-child{transition:fill var(--d-ui) var(--ease-ui)}
}

/* 11. FAQ */
.index-faq{padding-bottom:calc(var(--section) * 1.1)}

/* ==========================================================================
   1b. Hero-pokaz: 5 kadrów z przenikaniem i powolnym najazdem (Ken Burns).
   Kolorowe zdjęcia mają grać od progu, więc scrim trzyma tylko strefę tekstu
   (lewy dół), zamiast przyciemniać cały kadr.
   ========================================================================== */
.hero--show{flex-direction:column;justify-content:flex-end;align-items:stretch;--show-dur:6.5s}
.hero--show .hero__content{padding-bottom:var(--s-6)}
.show__slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.4s var(--ease-io)}
.show__slide.is-active{opacity:1;z-index:1}
.show__slide.is-leaving{z-index:0}
.show__slide picture{display:block;width:100%;height:100%;transform-origin:60% 45%;will-change:transform}
.show__slide img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
.show__slide.is-active picture,.show__slide.is-leaving picture{animation:show-kb calc(var(--show-dur) + 1.6s) linear both}
.show__slide:nth-child(even) picture{transform-origin:35% 60%}
@keyframes show-kb{from{transform:scale(1.02)}to{transform:scale(1.13)}}
.hero--show.is-paused .show__slide picture{animation-play-state:paused}

.hero__scrim--show{background:linear-gradient(to top, rgb(20 12 60 / .82) 0%, rgb(20 12 60 / .5) 28%, rgb(20 12 60 / .12) 55%, rgb(20 12 60 / 0) 70%)}
.hero__scrim--show::after{background:linear-gradient(to right, rgb(20 12 60 / .5) 0%, rgb(20 12 60 / .22) 40%, rgb(20 12 60 / 0) 62%)}
.hero--show .hero__title{text-shadow:0 2px 28px rgb(20 12 60 / .45)}
.hero--show .hero__lead{color:#fff;text-shadow:0 1px 16px rgb(20 12 60 / .55)}
@media (max-width:767px){
  .hero__scrim--show{background:linear-gradient(to top, rgb(20 12 60 / .9) 0%, rgb(20 12 60 / .66) 38%, rgb(20 12 60 / .2) 62%, rgb(20 12 60 / 0) 78%)}
  .hero__scrim--show::after{display:none}
}

/* pasek slajdów: numer + podpis + tor postępu */
.show__nav{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--s-4);padding-bottom:calc(48px + var(--s-5))}
.show__dots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-3);margin:0;padding:0;list-style:none}
.show__dot{display:grid;gap:6px;width:100%;padding:var(--s-2) 0;border:0;background:none;color:rgb(238 240 250 / .7);font:inherit;text-align:left;cursor:pointer;transition:color .3s var(--ease-ui)}
.show__dot:hover,.show__dot.is-active{color:#fff}
.show__num{font-size:var(--t-label);font-stretch:var(--w-cond);font-weight:600;letter-spacing:.08em;font-variant-numeric:tabular-nums}
.show__label{font-size:var(--t-small);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.show__track{position:relative;display:block;height:2px;background:rgb(238 240 250 / .3);overflow:hidden}
.show__track span{position:absolute;inset:0;background:var(--accent);transform:scaleX(0);transform-origin:left}
.show__dot.is-active .show__track span{animation:show-fill var(--show-dur) linear forwards}
.hero--show.is-paused .show__dot.is-active .show__track span{animation-play-state:paused}
@keyframes show-fill{to{transform:scaleX(1)}}
.show__pause{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgb(238 240 250 / .45);border-radius:var(--r-pill);background:rgb(20 12 60 / .3);color:#fff;cursor:pointer;backdrop-filter:blur(6px);transition:background .25s var(--ease-ui),border-color .25s var(--ease-ui)}
.show__pause:hover{background:rgb(20 12 60 / .55);border-color:#fff}
.show__pause svg{width:14px;height:14px;fill:currentColor}
.show__play-tri{display:none}
.show__pause[aria-pressed="true"] .show__pause-bars{display:none}
.show__pause[aria-pressed="true"] .show__play-tri{display:inline}
@media (max-width:767px){
  .show__dots{gap:var(--s-2)}
  .show__label{display:none}
}
/* bez JS pokaz nie rusza: jeden kadr, bez paska */
html:not(.js) .show__nav{display:none}
@media (prefers-reduced-motion: reduce){
  .show__slide picture{animation:none !important}
  .show__slide{transition-duration:.01ms}
}

/* ==========================================================================
   2b. Czworo drzwi do oferty: pełne zdjęcia z podpisem, zaraz pod hero
   ========================================================================== */
.doors{padding-top:var(--s-8)}
.doors__grid{display:grid;grid-auto-flow:column;grid-auto-columns:min(78vw, 320px);gap:var(--s-4);margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter) var(--s-2);list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none}
.doors__grid::-webkit-scrollbar{display:none}
.door{scroll-snap-align:start}
.door__link{position:relative;display:block;aspect-ratio:4 / 5;overflow:hidden;border-radius:var(--r-0);color:#fff;text-decoration:none;background:var(--night);isolation:isolate}
.door__media,.door__media img{position:absolute;inset:0;width:100%;height:100%}
.door__media img{object-fit:cover;transition:transform 1.1s var(--ease-horizon)}
.door__link::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(to top, rgb(20 12 60 / .88) 0%, rgb(20 12 60 / .45) 38%, rgb(20 12 60 / 0) 62%);pointer-events:none}
.door__body{position:absolute;inset:auto 0 0 0;z-index:1;display:grid;gap:var(--s-2);padding:var(--s-5)}
.door__title{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);font-size:var(--t-h3);font-stretch:var(--w-wide);font-weight:500;line-height:1.1}
.door__arrow{flex:none;width:1.1em;height:1.1em;transition:transform .5s var(--ease-horizon)}
.door__desc{font-size:var(--t-small);color:rgb(238 240 250 / .9);max-width:30ch}
.door__meta{justify-self:start;margin-top:var(--s-1);padding:4px 10px;border-radius:var(--r-pill);background:var(--accent);color:var(--on-accent);font-size:var(--t-label);font-weight:600;letter-spacing:.02em}
.door__link:hover .door__media img,.door__link:focus-visible .door__media img{transform:scale(1.06)}
.door__link:hover .door__arrow,.door__link:focus-visible .door__arrow{transform:translate(3px,-3px)}
.door__link:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media (min-width:640px){
  .doors__grid{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:0;overflow:visible}
}
@media (min-width:1024px){
  .doors__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .door__link{aspect-ratio:3 / 4}
}