/* =============================================================
   Naďa Hoštová Vizážistka — Design System v2
   Luxury Atelier · Editorial · Animated
   ============================================================= */

/* ── CUSTOM PROPERTIES ────────────────────────────────────── */
:root {
  --c-bg:          #faf8f5;
  --c-bg-2:        #f2ece3;
  --c-surface:     #ffffff;
  --c-text:        #2d2420;
  --c-text-muted:  #7a6d66;
  --c-text-dim:    #b8aea7;

  /* Tmavé sekce — svěží slate/indigo místo černohnědé */
  --c-dark:        #2c3545;
  --c-dark-2:      #232b3a;

  --c-rose:        #c4725a;
  --c-rose-light:  #e49e88;
  --c-rose-dim:    #ead8d2;
  --c-rose-glow:   rgba(196,114,90,.07);

  --c-line:        rgba(196,114,90,.12);
  --c-line-dark:   rgba(44,53,69,.08);

  --f-serif:    'Cormorant Garant', Georgia, serif;
  --f-sans:     'Jost', system-ui, sans-serif;
  --f-display:  'Playfair Display', Georgia, serif;

  --s-xs:  .4rem;
  --s-sm:  .75rem;
  --s-md:  1.5rem;
  --s-lg:  3rem;
  --s-xl:  6rem;
  --s-2xl: 10rem;

  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-io:  cubic-bezier(.65,0,.35,1);
  --dur:      .8s;

  --max-w:    1280px;
  --nav-h:    72px;
}

/* ── RESET ────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-size: 18px;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
}

body {
  background: var(--c-bg);
  color: var(--c-text);
  font-family: var(--f-sans);
  font-size: clamp(.85rem, 1vw, 1rem);
  font-weight: 300;
  line-height: 1.8;
  overflow-x: hidden;
}

img { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

ul { list-style: none; }

address { font-style: normal; }

/* ── UTILITY ──────────────────────────────────────────────── */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.container {
  width: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: clamp(1.5rem, 6vw, 4rem);
}

/* ── PRELOADER ────────────────────────────────────────────── */
.preloader {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: var(--c-bg);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  transition: opacity .6s var(--ease-out), visibility .6s;
}

.preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Layout overlay — skryje skok při přepnutí animace ↔ no-stack */
#layout-overlay {
  position: fixed;
  inset: 0;
  z-index: 9997;
  background: var(--c-bg);
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s var(--ease-out);
}
#layout-overlay.is-visible {
  opacity: 1;
  pointer-events: auto;
  transition: none; /* okamžitý nástup, jen odchod má transition */
}

.preloader__logo {
  font-family: var(--f-serif);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: .12em;
  color: var(--c-text);
  opacity: 0;
  animation: pl-fade .5s .1s var(--ease-out) forwards;
}

.preloader__bar-wrap {
  width: 160px;
  height: 1px;
  background: var(--c-rose-dim);
  overflow: hidden;
}

.preloader__bar {
  height: 100%;
  width: 0%;
  background: var(--c-rose);
  transition: width .05s linear;
}

@keyframes pl-fade {
  to { opacity: 1; }
}

/* ── CURSOR DOT ───────────────────────────────────────────── */
.cursor-dot {
  position: fixed;
  width: 6px; height: 6px;
  background: var(--c-rose);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9997;
  transform: translate(-50%, -50%);
  transition: transform .1s, opacity .3s, width .3s, height .3s;
  opacity: 0;
}

body:hover .cursor-dot { opacity: 1; }

/* Na hero — bílý dot */
.hero:hover ~ * .cursor-dot,
.hero .cursor-dot { background: #fff; }

/* ── MARQUEE BAND ─────────────────────────────────────────── */
.marquee-band {
  overflow: hidden;
  background: var(--c-dark);
  padding: 1rem 0;
  white-space: nowrap;
}

.marquee-track {
  display: inline-flex;
  animation: marquee 20s linear infinite;
}

.marquee-track span {
  display: inline-flex;
  align-items: center;
  gap: 2rem;
  padding-right: 2rem;
  font-size: .62rem;
  font-weight: 400;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
}

.marquee-track span em {
  font-style: normal;
  color: var(--c-rose-light);
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ── SCROLL PROGRESS ──────────────────────────────────────── */
.scroll-progress {
  position: fixed;
  top: 0; left: 0;
  height: 1px;
  width: 0%;
  background: var(--c-rose);
  z-index: 9999;
  transition: width .1s linear;
}

/* ── NAVIGATION — vždy světlá, jako loiseau ──────────────── */
.site-nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  height: var(--nav-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: clamp(1.5rem, 6vw, 4rem);
  background: var(--c-bg);
  border-bottom: 1px solid var(--c-line-dark);
  transition: box-shadow .3s;
}

.site-nav.is-scrolled {
  box-shadow: 0 2px 20px rgba(26,20,16,.06);
}

/* Logo */
.nav__logo {
  font-family: var(--f-serif);
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: .06em;
  color: var(--c-text);
  transition: color .25s;
  line-height: 1;
}

.nav__logo:hover { color: var(--c-rose); }

.nav__logo-text {
  font-family: var(--f-serif);
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: .06em;
}

/* Nav links */
.nav__links {
  display: flex;
  gap: 2.5rem;
  align-items: center;
}

.nav__link {
  font-size: .65rem;
  font-weight: 400;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-text-muted);
  position: relative;
  padding-bottom: 2px;
  transition: color .25s;
}

.nav__link::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 0;
  width: 0; height: 1px;
  background: var(--c-rose);
  transition: width .35s var(--ease-out);
}

.nav__link:hover,
.nav__link.is-active { color: var(--c-text); }
.nav__link:hover::after,
.nav__link.is-active::after { width: 100%; }

/* Hamburger */
.nav__burger {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: .5rem;
  z-index: 110;
}

.nav__burger span {
  display: block;
  width: 22px; height: 1px;
  background: var(--c-text);
  transition: transform .35s var(--ease-out), opacity .25s;
  transform-origin: center;
}

.nav__burger.is-active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav__burger.is-active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav__burger.is-active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Mobilní menu */
.mobile-nav {
  position: fixed;
  inset: 0;
  z-index: 99;
  background: var(--c-bg);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--s-md);
  opacity: 0;
  pointer-events: none;
  transition: opacity .4s var(--ease-out);
}

.mobile-nav.is-open { opacity: 1; pointer-events: auto; }

.mobile-nav__close {
  position: absolute;
  top: 1.5rem; right: 1.5rem;
  background: none; border: none;
  font-size: 1.5rem; color: var(--c-text-muted);
  cursor: pointer; padding: .5rem;
}

.mobile-nav__links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}

.mobile-nav__link {
  font-family: var(--f-serif);
  font-size: clamp(2rem, 6vw, 3rem);
  font-weight: 400;
  color: var(--c-text);
  letter-spacing: .04em;
  transition: color .25s;
}

.mobile-nav__link:hover { color: var(--c-rose); }

/* ── HERO — loiseau style ─────────────────────────────────── */
.hero {
  /* Sticky = hero zůstane stát a karta "O mně" ho přejede stejně
     jako se skládají ostatní karty (hero je základní vrstva, z-index 1 < karty 2+) */
  position: sticky;
  top: 0;
  z-index: 1;
  height: 100svh;
  min-height: 600px;
  overflow: hidden;
}

/* Fotografie — absolutní podklad */
.hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 20%;
  background-repeat: no-repeat;
  will-change: transform;
}

.hero__bg--empty {
  background: linear-gradient(160deg, #e8d5ce 0%, #d4b5a8 40%, #c09080 100%);
}

/* Gradient — jen dole pro čitelnost jména, foto nahoře čisté */
.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(26,20,16,.82) 0%, transparent 52%);
}

/* Accent rotátor — animované fráze vpravo nahoře */
.hero__accent {
  position: absolute;
  top: calc(var(--nav-h) + 2.5rem);
  right: clamp(1.5rem, 6vw, 4rem);
  z-index: 3;
  font-family: var(--f-serif);
  font-style: italic;
  font-size: clamp(.9rem, 1.25vw, 1.15rem);
  font-weight: 300;
  letter-spacing: .03em;
  color: rgba(255, 246, 238, .82);
  text-align: right;
  line-height: 2;
  min-height: 6em;
  padding: .9rem 1.3rem;
  isolation: isolate;
}

/* Poloprůhledná dlaždice — pulsuje současně s textem.
   Opacity animuje GSAP (0 → 0.5), z-index: -1 drží za textem. */
.hero__accent-bg {
  position: absolute;
  inset: 0;
  border-radius: 10px;
  background: rgba(14, 10, 18, 1);
  opacity: 0;
  pointer-events: none;
  z-index: -1;
}

/* Vnitřní wrapper — loiseau: flex column, obsah dole */
.hero__inner {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: calc(var(--nav-h) + 3rem) clamp(1.5rem, 6vw, 4rem) clamp(1.5rem, 2.5vw, 2.5rem);
  gap: clamp(1.2rem, 2.5vw, 2.5rem);
}

/* Kategorie + ikonky — jeden řádek s dashed linkou pod ním */
.hero__cats-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px dashed rgba(255,255,255,.28);
  padding-bottom: 1rem;
}

/* Tři kategorie */
.hero__cats {
  display: flex;
  align-items: center;
  gap: clamp(1.5rem, 3vw, 3rem);
}

.hero__cat {
  font-size: .6rem;
  font-weight: 400;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,.65);
  white-space: nowrap;
  transition: color .3s;
  display: inline-block;
}
.hero__cat:hover { color: rgba(255,255,255,.92); }

/* Pravá část — ikonky + scroll */
.hero__cats-right {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  flex-shrink: 0;
}

.hero__cat-icon {
  color: rgba(255,255,255,.4);
  display: flex;
  align-items: center;
  transition: color .25s;
}

.hero__cat-icon:hover { color: rgba(255,255,255,.85); }

.hero__scroll-btn {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .58rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
  transition: color .25s;
  text-decoration: none;
  white-space: nowrap;
}

.hero__scroll-btn:hover { color: rgba(255,255,255,.8); }

/* OBROVSKÉ jméno — fill-width efekt (JS fitText) */
.hero__name {
  font-family: var(--f-display);
  font-size: clamp(2rem, 6.5vw, 9rem);
  font-weight: 400;
  letter-spacing: .04em;
  color: #fff;
  line-height: .92;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  /* Vzduch po stranách — fitText padding započítá do scrollWidth a písmo zmenší */
  padding-inline: clamp(1rem, 2.5vw, 2.5rem);
  text-align: center;
  margin: 0;
  margin-bottom: -.03em;
  display: block;
  width: 100%;
}

/* ── CARD STACKING — loiseau efekt "karty z balíčku" ─────── */
/*
 * .card = sticky wrapper kolem každé sekce.
 * Každá karta vyjede zespoda a překryje předchozí.
 * Hero zůstává v normálním toku jako základní karta.
 */
.cards-root {
  /* Žádný overflow — karty musí přesahovat přes hero */
}

.card {
  position: sticky;
  top: 0;
  min-height: 100svh;
  border-radius: 20px 20px 0 0;
  overflow: hidden;
  /* Top-edge highlight — jako odlesk světla na hraně fyzické karty */
  box-shadow:
    0 -2px 0 rgba(255,255,255,.10),
    0 -16px 70px rgba(0,0,0,.50);
  will-change: filter, transform;
}

/* card::before — gradient záměrně odstraněn, na tmavých foto hero byl viditelný jako pruh */

/* ── Selektivní z-index pro stacking pořadí ───────────────────
   Všechny karty zůstávají sticky (překrývají se správně bez mezer).
   Z-index řídí kdo je "nahoře" a zajišťuje že About neproblikne
   skrz Gallery/Services/Wedding/Pricelist/Courses při scrollu.
   Overflow guard kontroluje jen About + Contact — viz checkStackOverflow(). */
.card--about   { z-index: 2; }

.card--gallery,
.card--services,
.card--wedding,
.card--pricelist,
.card--courses { z-index: 3; }

.card--contact { z-index: 5; }

/* Sekce uvnitř karty — centrální správa paddingu a výšky */
.card > .section {
  min-height: 100svh;
  border-radius: 0;
  /* Nav-aware padding: obsah začíná těsně pod nav barem */
  padding-top: calc(var(--nav-h) + clamp(1.5rem, 3vh, 3rem));
  padding-bottom: clamp(2.5rem, 5vh, 4rem);
}

/* Galerie má vlastní padding — nepřepisovat */
.card > .nh-gallery {
  min-height: auto;
  border-radius: 0;
  padding-top: var(--s-xl);
  padding-bottom: var(--s-md);
}

/* Marquee pod galerií nepotřebuje min-height */
.card > .nh-gallery ~ * {
  min-height: auto;
}

/* ── SECTION DIVIDER — zachováno pro statické stránky ─────── */
.section-divider {
  width: 1px;
  height: 80px;
  background: var(--c-rose-dim);
  margin: 0 auto;
  display: none; /* v card-stacking módu skryto */
}

/* ── SECTION SHARED ───────────────────────────────────────── */
.section {
  padding-block: var(--s-2xl);
}

.section-label {
  font-size: .58rem;
  font-weight: 500;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--c-rose);
  margin-bottom: 1rem;
  display: block;
}

.section-headline {
  font-family: var(--f-serif);
  font-size: clamp(2.2rem, 4.5vw, 4rem);
  font-weight: 300;
  color: var(--c-text);
  line-height: 1.1;
  letter-spacing: .01em;
}

.section-lead {
  font-family: var(--f-serif);
  font-size: clamp(1.1rem, 1.5vw, 1.3rem);
  font-style: italic;
  color: var(--c-rose);
  line-height: 1.65;
  margin: var(--s-md) 0;
}

.section p {
  color: var(--c-text-muted);
  margin-bottom: var(--s-md);
  line-height: 1.85;
  max-width: 56ch;
}

.section p:last-child { margin-bottom: 0; }

/* ── ABOUT ────────────────────────────────────────────────── */
.section--about {
  background: var(--c-bg);
}

.section--about__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 8vw, 8rem);
  align-items: center;
  width: 100%;
}

/* Jen text (bez fotky) — celá šířka, vlevo */
.section--about__inner:not(:has(.section--about__image-wrap)) {
  grid-template-columns: 1fr;
}

/* Explicitní umístění — content vždy levý sloupec, foto pravý */
.section--about__content    { grid-column: 1; }
.section--about__image-wrap { grid-column: 2; }

/* Image — clip-path reveal */
.section--about__image-wrap {
  position: relative;
  overflow: hidden;
}

.section--about__image {
  width: 100%;
  height: clamp(300px, min(60vw, 55svh), 680px);
  object-fit: cover;
  display: block;
}

/* Dekorační rámeček */
.section--about__image-wrap::after {
  content: '';
  position: absolute;
  bottom: -1.5rem;
  right: -1.5rem;
  width: 55%;
  height: 55%;
  border: 1px solid var(--c-rose-dim);
  pointer-events: none;
  z-index: -1;
}

.section--about__content { padding-block: 2rem; }

.section--about__content .section-headline {
  margin: var(--s-sm) 0 var(--s-md);
}

.section--about__content p { font-size: .92rem; }

/* ── SERVICES ─────────────────────────────────────────────── */
.section--services {
  background: var(--c-dark);
}

.section--services .section-label { color: var(--c-rose-light); }
.section--services .section-headline { color: #fff; }

.section--services__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: var(--s-lg);
}

.section--services__header p {
  color: rgba(255,255,255,.4);
  max-width: 40ch;
  font-size: .88rem;
  margin: 0;
}

/* Services grid */
.services-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-left: 1px solid rgba(255,255,255,.06);
}

.service-card {
  border-right: 1px solid rgba(255,255,255,.06);
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 2.5rem 2rem;
  position: relative;
  transition: background .4s;
  cursor: default;
  overflow: hidden;
}

.service-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--c-rose-glow);
  opacity: 0;
  transition: opacity .4s;
}

.service-card:hover::before { opacity: 1; }


.service-card__icon {
  width: 36px; height: 36px;
  color: rgba(255,255,255,.25);
  margin-bottom: 1.5rem;
  transition: color .4s;
}

.service-card:hover .service-card__icon { color: var(--c-rose-light); }

.service-card__icon svg { width: 100%; height: 100%; }

/* Karta s fotkou — fotka přes celou šířku karty místo malého kolečka */
.service-card__icon:has(.service-card__icon-img) {
  width: 100%;
  height: auto;
}

.service-card__icon-img {
  width: 100%;
  height: clamp(160px, 14vw, 220px);
  object-fit: cover;
  object-position: top center;
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(0,0,0,.35);
  opacity: .75;
  transition: opacity .4s, transform .4s;
  display: block;
}

.service-card:hover .service-card__icon-img {
  opacity: 1;
  transform: scale(1.02);
}

.service-card__title {
  font-family: var(--f-serif);
  font-size: 1.3rem;
  font-weight: 400;
  color: rgba(255,255,255,.9);
  margin-bottom: 1.6rem;
  line-height: 1.25;
}

.service-card__text {
  font-size: .82rem;
  color: rgba(255,255,255,.35);
  line-height: 1.75;
  margin: 0 !important;
  transition: color .4s;
}

.service-card:hover .service-card__text { color: rgba(255,255,255,.6); }

/* ── FOTKY GLOBÁLNĚ — kulaté rohy + stín ─────────────────── */
.section--about__image-wrap,
.section--wedding__image-wrap,
.section--pricelist__image-wrap,
.section--courses__image-wrap,
.section--contact__image-wrap {
  border-radius: 10px;
  box-shadow: 0 14px 40px rgba(0,0,0,.20);
}

.section--about__image,
.section--wedding__image,
.section--pricelist__image,
.section--courses__image,
.section--contact__image {
  border-radius: 10px;
  object-position: top center;
}

/* Servisní fotky — tvář zůstane viditelná i při menší výšce */
.service-card__icon-img {
  object-position: top center;
}

/* ── PRICELIST ────────────────────────────────────────────── */
.section--pricelist {
  background: var(--c-bg);
}

.section--pricelist__inner {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(3rem, 8vw, 8rem);
  align-items: center;
  width: 100%;
}

.section--pricelist__image-wrap {
  position: relative;
  overflow: hidden;
}

.section--pricelist__image {
  width: 100%;
  height: clamp(280px, min(55vw, 52svh), 600px);
  object-fit: cover;
  display: block;
}

.section--pricelist__content .section-headline {
  margin: var(--s-sm) 0 var(--s-lg);
}

/* Price list */
.pricelist { margin-bottom: var(--s-md); }

.pricelist__item {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  padding: .9rem 0;
  border-bottom: 1px solid var(--c-line-dark);
  transition: padding-left .3s var(--ease-out);
}

.pricelist__item:first-child { border-top: 1px solid var(--c-line-dark); }

.pricelist__item:hover { padding-left: .5rem; }

.pricelist__name {
  font-size: .88rem;
  color: var(--c-text);
  flex-shrink: 0;
}

.pricelist__dots {
  flex: 1;
  border-bottom: 1px dotted var(--c-text-dim);
  margin-bottom: .15rem;
  min-width: 1rem;
}

.pricelist__price {
  font-family: var(--f-serif);
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--c-rose);
  white-space: nowrap;
  flex-shrink: 0;
}

.pricelist__note {
  font-size: .8rem;
  color: var(--c-text-muted);
  font-style: italic;
  margin-top: var(--s-md) !important;
  padding-top: var(--s-md);
  border-top: 1px solid var(--c-line-dark);
  max-width: none !important;
}

/* ── COURSES ──────────────────────────────────────────────── */
.section--courses {
  background: var(--c-bg-2);
}

.section--courses__inner {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(3rem, 8vw, 8rem);
  align-items: center;
  width: 100%;
}

.section--courses__content .section-headline {
  margin: var(--s-sm) 0 var(--s-md);
}

.section--courses__image-wrap {
  position: relative;
  overflow: hidden;
}

.section--courses__image-wrap::before {
  content: '';
  position: absolute;
  top: -1.5rem; left: -1.5rem;
  width: 55%; height: 55%;
  border: 1px solid var(--c-rose-dim);
  pointer-events: none;
  z-index: 0;
}

.section--courses__image {
  width: 100%;
  height: clamp(280px, min(55vw, 52svh), 620px);
  object-fit: cover;
  display: block;
  position: relative;
  z-index: 1;
}

/* Checklist */
.courses-checklist {
  margin: var(--s-md) 0 var(--s-lg);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.courses-checklist__item {
  display: flex;
  gap: 1rem;
  font-size: .88rem;
  color: var(--c-text-muted);
  line-height: 1.65;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--c-line-dark);
}

.courses-checklist__check {
  color: var(--c-rose);
  font-size: .9rem;
  flex-shrink: 0;
  margin-top: .1rem;
  font-weight: 500;
}

/* ── CONTACT ──────────────────────────────────────────────── */
.section--contact {
  background: var(--c-bg);
}

.section--contact__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 8vw, 8rem);
  align-items: center;
  width: 100%;
}

.section--contact__content .section-headline {
  margin: var(--s-sm) 0 var(--s-lg);
}

.section--contact__image-wrap {
  position: relative;
  overflow: hidden;
}

.section--contact__image {
  width: 100%;
  height: clamp(280px, min(55vw, 52svh), 620px);
  object-fit: cover;
  display: block;
}

/* Contact address */
.contact-address {
  margin-bottom: var(--s-lg);
}

.contact-address__name {
  font-family: var(--f-serif);
  font-size: 1.3rem;
  font-weight: 500;
  color: var(--c-text);
  margin-bottom: 1rem;
  letter-spacing: .04em;
}

.contact-address p {
  color: var(--c-text-muted) !important;
  margin: 0 0 .35rem !important;
  font-size: .9rem;
  max-width: none !important;
}

.contact-address a {
  color: var(--c-text-muted);
  transition: color .25s;
  border-bottom: 1px solid transparent;
}

.contact-address a:hover {
  color: var(--c-rose);
  border-bottom-color: var(--c-rose-dim);
}

.contact-collab {
  font-size: .82rem;
  color: var(--c-text-muted);
  font-style: italic;
  padding-top: var(--s-md);
  border-top: 1px solid var(--c-line-dark);
  margin-bottom: var(--s-lg);
}

/* Social icons */
.contact-social {
  display: flex;
  gap: .85rem;
}

.contact-social__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  border: 1px solid var(--c-line-dark);
  border-radius: 50%;
  color: var(--c-text-muted);
  transition: border-color .3s, color .3s, transform .3s;
}

.contact-social__link:hover {
  border-color: var(--c-rose);
  color: var(--c-rose);
  transform: translateY(-2px);
}

/* ── BUTTON ───────────────────────────────────────────────── */
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 2.5rem;
  background: var(--c-rose);
  color: #fff;
  font-size: .68rem;
  font-weight: 400;
  letter-spacing: .18em;
  text-transform: uppercase;
  border-radius: 1px;
  transition: background .3s, transform .25s, gap .3s;
}

.btn-primary::after {
  content: '→';
  font-size: .9rem;
  transition: transform .3s var(--ease-out);
}

.btn-primary:hover {
  background: var(--c-rose-light);
  color: #fff;
  gap: 1.1rem;
}

.btn-primary:hover::after {
  transform: translateX(3px);
}

/* ── FOOTER ───────────────────────────────────────────────── */
.site-footer {
  background: var(--c-dark);
  padding: var(--s-xl) clamp(1.5rem, 6vw, 4rem) var(--s-md);
  overflow: hidden;
}

/* Horní řádek — nav + social */
.footer__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: var(--s-lg);
}

.footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem 2.5rem;
}

.footer__nav-link {
  font-size: .6rem;
  font-weight: 400;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
  transition: color .25s;
}

.footer__nav-link:hover { color: rgba(255,255,255,.75); }

.footer__social {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-shrink: 0;
}

.footer__social a {
  color: rgba(255,255,255,.28);
  display: flex;
  align-items: center;
  transition: color .25s, transform .25s;
}

.footer__social a:hover {
  color: var(--c-rose-light);
  transform: translateY(-2px);
}

/* Dělicí čára */
.footer__divider {
  height: 1px;
  background: rgba(255,255,255,.06);
  margin-bottom: var(--s-lg);
}

/* Velké jméno — loiseau styl */
.footer__brand {
  overflow: hidden;
  margin-bottom: var(--s-md);
}

.footer__brand-name {
  display: block;
  font-family: var(--f-sans);
  font-size: clamp(2.5rem, 7vw, 7rem);
  font-weight: 200;
  letter-spacing: -.02em;
  text-transform: uppercase;
  color: rgba(255,255,255,.06);
  line-height: .9;
  white-space: nowrap;
  /* JS fitText přepíše */
}

/* Spodní část — copyright */
.footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-top: var(--s-md);
  border-top: 1px solid rgba(255,255,255,.05);
}

.footer__copy {
  font-size: .6rem;
  letter-spacing: .1em;
  color: rgba(255,255,255,.2);
}

.footer__credits {
  font-size: .6rem;
  color: rgba(255,255,255,.2);
}

.footer__credits a {
  color: rgba(255,255,255,.2);
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: color .25s, border-color .25s;
}

.footer__credits a:hover {
  color: rgba(255,255,255,.5);
  border-color: rgba(255,255,255,.25);
}

/* ── GALERIE — horizontální scroll belt (stejně jako zd-foto) ── */

/* Tmavé pozadí celé karty (gallery + marquee) */
.card:has(.nh-gallery) {
  background: var(--c-dark);
  display: flex;
  flex-direction: column;
}

.nh-gallery {
  padding: var(--s-xl) 0 0;
  background: var(--c-dark);
  overflow: hidden;
}

.nh-gallery__header {
  padding: 0 clamp(1.5rem, 6vw, 4rem);
  max-width: var(--max-w);
  margin: 0 auto var(--s-lg);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.nh-gallery__header .section-label {
  color: var(--c-rose-light);
}

.nh-gallery__headline {
  font-family: var(--f-serif);
  font-size: clamp(2.2rem, 4.5vw, 4rem); /* stejné jako .section-headline */
  font-weight: 300;
  letter-spacing: .01em;
  color: #fff;
  line-height: 1.1;
}

.nh-gallery__count {
  font-size: .62rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,255,255,.25);
  padding-bottom: .5rem;
}

/* Horizontální pás — fade hrany vlevo/vpravo */
.nh-gallery__track-wrap {
  position: relative;
  overflow: hidden;
  cursor: grab;
  mask-image: linear-gradient(90deg, transparent 0%, black 4%, black 96%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 4%, black 96%, transparent 100%);
}

.nh-gallery__track-wrap:active { cursor: grabbing; }

.nh-gallery__track {
  display: flex;
  gap: 1.5rem;
  width: max-content;
  will-change: transform;
}

@keyframes nh-gallery-belt {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.nh-gallery__track.is-ready {
  animation: nh-gallery-belt 40s linear infinite;
}

.nh-gallery__track.is-ready:hover {
  animation-play-state: paused;
}

/* Každý item — výška fixní, šířka z poměru stran */
.nh-gallery__item {
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
  --h: clamp(260px, 36vw, 440px);
  height: var(--h);
  width: calc(var(--h) * var(--ratio, 0.75));
  border-radius: 10px;
  box-shadow: 0 8px 32px rgba(0,0,0,.55);
  transition: box-shadow .4s;
}

.nh-gallery__item--empty {
  width: calc(var(--h) * .75);
  background: rgba(255,255,255,.04);
}

.nh-gallery__item:hover {
  box-shadow: 0 16px 56px rgba(0,0,0,.75);
}

.nh-gallery__item img {
  height: 100%;
  width: auto;
  display: block;
  object-fit: cover;
  transition: transform 1s var(--ease-out);
  will-change: transform;
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

.nh-gallery__item:hover img { transform: scale(1.06); }

/* Caption při hoveru */
.nh-gallery__caption {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 3rem 1.25rem 1.25rem;
  background: linear-gradient(transparent, rgba(26,20,16,.85));
  transform: translateY(100%);
  transition: transform .5s var(--ease-out);
}

.nh-gallery__item:hover .nh-gallery__caption { transform: translateY(0); }

.nh-gallery__cap-title {
  font-family: var(--f-serif);
  font-size: .95rem;
  font-style: italic;
  color: rgba(255,255,255,.9);
}

/* Drag hint — padding přesunut do .nh-gallery__footer */
.nh-gallery__drag-hint {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.nh-gallery__drag-hint span {
  font-size: .6rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,255,255,.2);
}

.nh-gallery__drag-arrow {
  width: 40px; height: 1px;
  background: rgba(255,255,255,.2);
  position: relative;
}

.nh-gallery__drag-arrow::after {
  content: '';
  position: absolute;
  right: 0; top: -3px;
  width: 6px; height: 6px;
  border-right: 1px solid rgba(255,255,255,.2);
  border-top: 1px solid rgba(255,255,255,.2);
  transform: rotate(45deg);
}

/* Footer pod belt — drag hint + volitelný text */
.nh-gallery__footer {
  padding: var(--s-md) clamp(1.5rem, 6vw, 4rem) var(--s-lg);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.nh-gallery__drag-hint {
  padding: 0;
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-shrink: 0;
}

.nh-gallery__subtext {
  font-family: var(--f-serif);
  font-size: clamp(.9rem, 1.2vw, 1.1rem);
  font-style: italic;
  color: rgba(255,255,255,.4);
  max-width: 60ch;
  line-height: 1.7;
  text-align: right;
  margin: 0;
}

/* ── PAGE CONTENT ─────────────────────────────────────────── */
.page-content {
  padding-top: calc(var(--nav-h) + var(--s-xl));
  padding-bottom: var(--s-2xl);
}

.page-title {
  font-family: var(--f-serif);
  font-size: clamp(2.2rem, 4vw, 3.5rem);
  font-weight: 300;
  color: var(--c-text);
  margin-bottom: var(--s-lg);
}

.page-body p {
  color: var(--c-text-muted);
  margin-bottom: var(--s-md);
  line-height: 1.85;
  max-width: 65ch;
}

/* ── BACK TO TOP ──────────────────────────────────────────── */
.back-to-top {
  position: fixed;
  bottom: 2rem; right: 2rem;
  z-index: 50;
  width: 44px; height: 44px;
  background: var(--c-surface);
  border: 1px solid var(--c-line-dark);
  border-radius: 50%;
  color: var(--c-rose);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
  transition: transform .25s var(--ease-out), box-shadow .25s, border-color .25s;
}

.back-to-top:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
  border-color: var(--c-rose-dim);
}

/* ── ANIMATIONS — clip reveal ────────────────────────────── */
/* Obsah je VŽDY viditelný (jako vzor zd-foto) — reveal řeší jen GSAP přes opacity.
   Když GSAP/scroll neproběhne (Customizer, chyba načtení), obsah zůstane vidět,
   nikdy se neschová natvrdo přes CSS. */
[data-reveal] {
  visibility: visible;
}

/* Image clip-path */
.clip-wrap {
  overflow: hidden;
  display: block;
}

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 1024px) {
  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .service-card:nth-child(n+3) {
    border-top: 1px solid rgba(255,255,255,.06);
  }
}

@media (max-width: 900px) {
  :root {
    --s-xl:  4rem;
    --s-2xl: 6rem;
  }

  /* Hero mobile */
  .hero__inner {
    padding-bottom: 1.5rem;
    gap: 1rem;
  }

  .hero__cats-right .hero__scroll-btn span { display: none; }

  .nav__links { display: none; }
  .nav__burger { display: flex; }

  .section--about__inner,
  .section--wedding__intro,
  .section--pricelist__inner,
  .section--courses__inner,
  .section--contact__inner {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  /* Reset explicitních grid-column — bez toho by grid-column:2 vytvořil implicitní 2. sloupec */
  .section--about__content,
  .section--about__image-wrap,
  .section--pricelist__image-wrap,
  .section--courses__image-wrap,
  .section--contact__image-wrap {
    grid-column: auto;
  }

  .section--about__image-wrap::after,
  .section--courses__image-wrap::before { display: none; }

  .section--about__image,
  .section--wedding__image,
  .section--pricelist__image,
  .section--courses__image,
  .section--contact__image {
    height: clamp(280px, 65vw, 440px);
  }

  .section--services__header { flex-direction: column; align-items: flex-start; gap: 1rem; }

  .footer__top { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .footer__bottom { flex-direction: column; align-items: flex-start; gap: .5rem; }

}

/* ── JS overflow guard — .cards-no-stack přidá JS když obsah přesáhne viewport ──
   Stejný efekt jako telefon/čtverec: sticky off, karty pod sebe.
   Použije se automaticky při libovolné velikosti okna kde by se obsah ořízl. */
.cards-no-stack > .hero { position: relative; }

.cards-no-stack .card {
  position: static;
  min-height: auto;
  border-radius: 0;
  box-shadow: none;
  will-change: auto;
}

.cards-no-stack .card + .card { border-top: 1px solid rgba(0,0,0,.08); }

.cards-no-stack .card > .section {
  min-height: auto;
  padding-top: clamp(3.5rem, 10vh, 5rem);
  padding-bottom: clamp(3rem, 8vh, 4.5rem);
}

.cards-no-stack .card--contact .section--contact {
  padding-top: clamp(3.5rem, 10vh, 5rem);
}

/* ── Karty na telefonu — statické, bez sticky stacking efektu ── */
@media (max-width: 650px) {
  /* Karty jsou statické → hero nesmí zůstat přilepené */
  .hero { position: relative; }

  .card {
    position: static;
    min-height: auto;
    border-radius: 0;
    box-shadow: none;
    will-change: auto;
  }

  .card + .card {
    border-top: 1px solid rgba(0,0,0,.08);
  }

  .card > .section {
    min-height: auto;
    padding-top: clamp(3.5rem, 10vh, 5rem);
    padding-bottom: clamp(3rem, 8vh, 4.5rem);
  }

  .card--contact .section--contact {
    padding-top: clamp(3.5rem, 10vh, 5rem);
  }

}

@media (max-width: 600px) {
  :root { --s-xl: 3rem; --s-2xl: 4.5rem; }

  .hero__cat:nth-child(n+4) { display: none; }

  .services-grid { grid-template-columns: 1fr; }
  .service-card { border-right: none; }

  .section-divider { height: 60px; }

  /* Hero name — nesmí přetéct */
  .hero__name { white-space: normal; word-break: break-word; }

  /* Ceník — dlouhé názvy přetékaly přes pravý okraj.
     Zalomíme: název zabere celý řádek, cena je pod ním zarovnaná doprava. */
  .pricelist__item  { flex-wrap: wrap; row-gap: .15rem; }
  .pricelist__name  { flex-shrink: 1; flex-basis: 100%; }
  .pricelist__dots  { display: none; }
  .pricelist__price { margin-left: auto; font-size: 1rem; }

  /* Gallery height mobile */
  .nh-gallery__item { --h: clamp(200px, 55vw, 300px); }

  /* Gallery footer — pod sebou místo vedle sebe */
  .nh-gallery__footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
  .nh-gallery__subtext {
    text-align: left;
    font-size: .85rem;
    max-width: 100%;
  }

  /* Cards mobile — menší padding */
  .card > .section {
    padding-top: calc(var(--nav-h) + 2rem);
    padding-bottom: 2.5rem;
  }

  /* Karty bez zaoblení na mobilu */
  .card { border-radius: 12px 12px 0 0; }
}

/* ── Čtvercový / těsný portrétový viewport ────────────────────────
   Šířka ≤ 900px + výška ≤ 900px + portrait = prohlížeč stažený na čtverec
   nebo okno někde mezi tabletem a desktopem.
   1-sloupcový layout by byl vyšší než 100svh → sticky karty by přetékaly.
   Landscape je ošetřen zvlášť (výše); čtverec CSS považuje za portrait.  */
@media (max-width: 900px) and (min-width: 651px) and (max-height: 900px) and (orientation: portrait) {
  .hero { position: relative; }

  .card {
    position: relative;
    min-height: auto;
    will-change: auto;
  }

  .card + .card {
    border-top: 1px solid rgba(0,0,0,.08);
  }

  .card > .section {
    min-height: auto;
    padding-top: clamp(3rem, 8vh, 5rem);
    padding-bottom: clamp(2.5rem, 6vh, 4rem);
  }

  .card--contact .section--contact {
    padding-top: clamp(3rem, 8vh, 5rem);
  }
}

/* ── Landscape tablet — kratší viewport, vše musí sedět do výšky ── */
@media (orientation: landscape) and (max-height: 900px) {
  /* Méně paddingu */
  .card > .section {
    padding-top: calc(var(--nav-h) + 1rem);
    padding-bottom: 1.2rem;
  }

  /* Menší fonty — text zabere méně výšky */
  .section-label    { font-size: .55rem; margin-bottom: .6rem; }
  .section-headline { font-size: clamp(1.6rem, 4svh, 2.8rem); margin-bottom: .6rem; }
  .section-lead     { font-size: clamp(.85rem, 1.8svh, 1.05rem); margin-bottom: .8rem; }
  .section p        { font-size: clamp(.8rem, 1.6svh, .95rem); line-height: 1.5; margin-bottom: .5rem; }

  /* Vždy 2 sloupce vedle sebe (text + foto) — foto nepřidává výšku */
  .section--about__inner,
  .section--wedding__intro,
  .section--pricelist__inner,
  .section--courses__inner,
  .section--contact__inner {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 2rem;
  }

  /* Obrázky — výška podle viewportu */
  .section--about__image,
  .section--pricelist__image,
  .section--courses__image,
  .section--contact__image {
    height: clamp(180px, 62svh, 420px);
  }

  /* Galerie */
  .nh-gallery__item { --h: clamp(160px, 52svh, 320px); }

  /* Ceník — menší řádky */
  .pricelist__item  { padding: .4rem 0; font-size: .85rem; }

  /* Services — obrázky menší + méně paddingu v kartách → grid se vejde do výšky
     Vyšší specificita (.section--services .service-card) přežije override z max-width: 1024px. */
  .section--services .service-card__icon-img  { height: clamp(90px, 16svh, 150px); }
  .section--services .service-card            { padding: 1.4rem 1.4rem; }
  .service-card__icon                         { margin-bottom: .7rem; }
  .section--services .service-card__title     { font-size: 1.05rem; margin-bottom: .7rem; }
  .section--services .section--services__header { margin-bottom: .8rem; gap: 1rem; }

  /* Courses — checklist kompaktní */
  .courses-checklist        { gap: .5rem; margin: .6rem 0 .8rem; }
  .courses-checklist__item  { padding-bottom: .5rem; font-size: .8rem; line-height: 1.5; }

  /* Wedding — agresivní zhustění aby karta vešla do 100svh na MacBooku ── */
  .section--wedding__image { height: clamp(140px, 32svh, 260px); }
  .section--wedding__intro { margin-bottom: 1.8rem; gap: 2rem; }
  .wedding-packages        { gap: .8rem; margin-bottom: 1.4rem; }
  .wedding-pkg             { padding: .9rem 1.1rem; gap: .5rem; }
  .wedding-pkg__desc       { font-size: .74rem; line-height: 1.55; }
  .wedding-pkg__footer     { padding-top: .6rem; }
  .wedding-pkg__price      { font-size: 1.15rem; }
  .wedding-pkg--featured .wedding-pkg__price { font-size: 1.25rem; }
  .wedding-info            { padding-top: 1.2rem; gap: 1.2rem; }
  .wedding-info__item p    { font-size: .7rem; line-height: 1.5; }
}

/* ── Services portrait 2-sloupcový layout ─────────────────────────────
   PLATÍ POUZE: portrait + 601–1024px (tablet portrait, desktop zúžený).
   Landscape (všechny šířky): řeší landscape-compact blok výše.
   Mobil ≤ 600px: 1 sloupec → základní CSS (width:100%) je správné.

   Přesný výpočet kritického bodu iPad 768 × 1024 (portrait):
     top padding  = nav 72 + clamp(27,31,54) = 103 px
     header blok  = label+headline+p + margin s-sm = 147 + 14 = 161 px
     bottom pad   = clamp(45,51,72) = 51 px
     grid dostane: 1024 − 103 − 161 − 51 = 709 px
     karta (3 ř. textu): 25 + 36 + (135+16) + 78 + 25 = 315 px
     2 řady: 630 px  <  709 px  →  79 px rezerva ✓
     karta (4 ř. textu): 341 px → 682 px  < 709 px ✓                   */
@media (max-width: 1024px) and (min-width: 601px) and (orientation: portrait) {
  .service-card__icon-img {
    height:       clamp(100px, 14svh, 135px);
    width:        auto;
    aspect-ratio: 1 / 1;
    margin:       0 auto;
  }
  .service-card__icon        { margin-bottom: .9rem; }
  .service-card              { padding: 1.4rem 1.2rem; text-align: center; }
  .service-card__title       { font-size: 1.05rem; margin-bottom: .7rem; }
  .section--services__header { margin-bottom: var(--s-sm); }
}

/* ── Střední výška viewportu 901–1100px ────────────────────────
   Agresivní landscape compact platí jen do 900px. V pásmu 901–1100px
   je wedding karta stále na hraně — mírně zmenšíme foto + packages
   aby se karta vešla a animace mohla bez problémů běžet.          */
@media (min-height: 901px) and (max-height: 1100px) {
  .section--wedding__image   { height: clamp(200px, 33svh, 380px); }
  .section--wedding__intro   { margin-bottom: clamp(1.2rem, 3vh, 2.5rem); }
  .wedding-packages          { gap: 1rem; margin-bottom: 1.8rem; }
  .wedding-pkg               { padding: 1.2rem 1.4rem; }
  .wedding-pkg__desc         { font-size: .8rem; line-height: 1.6; }
}

/* ═══════════════════════════════════════════════════════════════
   PER-CARD BAREVNÉ TÉMA — každá karta má jiný charakter
   ═══════════════════════════════════════════════════════════════ */

/* ── About — teplá slonová kost ─────────────────────────────── */
.card--about { background: #fdf9f5; }
.card--about .section--about { background: transparent; }

/* ── Gallery — slate indigo (zachováno, uživatel ✓) ─────────── */
.card--gallery { background: var(--c-dark); }

/* ── Services — dusty plum / fialová ─────────────────────────── */
.card--services { background: #3e2850; }
.card--services .section--services { background: transparent; }
/* Přebíjí globální .section--services barvu */

/* ══════════════════════════════════════════════════════════════
   WEDDING SECTION — Pro nevěsty
   ══════════════════════════════════════════════════════════════ */

.section--wedding {
  padding-bottom: var(--s-xl);
}

/* Intro — 2 sloupce: text vlevo, foto vpravo */
.section--wedding__intro {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(3rem, 8vw, 8rem);
  align-items: center;
  width: 100%;
  margin-bottom: clamp(1.8rem, 3.5vw, 3.5rem);
}

.section--wedding__content .section-headline {
  margin: var(--s-sm) 0 var(--s-md);
}

.section--wedding__image-wrap {
  overflow: hidden;
}

.section--wedding__image {
  width: 100%;
  height: clamp(240px, min(46vw, 43svh), 480px);
  object-fit: cover;
  display: block;
}

/* Packages — 3 sloupce */
.wedding-packages {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.wedding-pkg {
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: clamp(1.5rem, 3vw, 2.2rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  transition: border-color .3s;
}

.wedding-pkg:hover {
  border-color: rgba(255,255,255,.22);
}

.wedding-pkg--featured {
  border-color: var(--c-rose-light);
}

.wedding-pkg--featured:hover {
  border-color: var(--c-rose);
}

.wedding-pkg__badge {
  position: absolute;
  top: -0.65rem;
  left: 1.5rem;
  background: var(--c-rose-light);
  color: #fff;
  font-size: .6rem;
  font-weight: 400;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: .22rem .7rem;
  border-radius: 20px;
}

.wedding-pkg__title {
  font-family: var(--f-serif);
  font-size: 1.05rem;
  font-weight: 400;
  color: rgba(255,255,255,.9);
  line-height: 1.3;
  margin: 0;
}

.wedding-pkg--featured .wedding-pkg__title {
  color: #fff;
}

.wedding-pkg__desc {
  font-size: .8rem;
  color: rgba(255,255,255,.42);
  line-height: 1.75;
  margin: 0;
  flex: 1;
}

.wedding-pkg__footer {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,.08);
  display: flex;
  flex-direction: column;
  gap: .3rem;
}

.wedding-pkg__price {
  font-family: var(--f-serif);
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--c-rose-light);
  letter-spacing: .02em;
}

.wedding-pkg--featured .wedding-pkg__price {
  font-size: 1.55rem;
}

.wedding-pkg__price-alt {
  font-size: .72rem;
  color: rgba(255,255,255,.3);
  letter-spacing: .04em;
}

/* Info bar — doprava, záloha, bonus */
.wedding-info {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  padding-top: clamp(2rem, 4vw, 3rem);
  border-top: 1px solid rgba(255,255,255,.08);
}

.wedding-info__item {
  display: flex;
  gap: .8rem;
  align-items: flex-start;
}

.wedding-info__icon {
  color: var(--c-rose-light);
  flex-shrink: 0;
  margin-top: .15rem;
}

.wedding-info__item p {
  font-size: .76rem;
  color: rgba(255,255,255,.38);
  line-height: 1.7;
  margin: 0;
}

/* Mobile — 1 sloupec */
@media (max-width: 900px) {
  .section--wedding__intro {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .section--wedding__image-wrap { grid-column: auto; }
  .wedding-packages { grid-template-columns: 1fr; }
  .wedding-info { grid-template-columns: 1fr; gap: 1.5rem; }
}

@media (max-width: 600px) {
  .wedding-pkg__price { font-size: 1.2rem; }
}

/* ── Wedding — deep burgundy rose / pro nevěsty ──────────────── */
.card--wedding { background: #2c1520; }
.card--wedding .section--wedding { background: transparent; }
.card--wedding .section-label    { color: var(--c-rose-light); }
.card--wedding .section-headline { color: #fff; }
.card--wedding .section-lead     { color: rgba(255,255,255,.7); }
.card--wedding .section p        { color: rgba(255,255,255,.5); }

/* Pricelist — tmavá námořnická modrá ──────────────────────── */
.card--pricelist { background: #082040; }
.card--pricelist .section--pricelist   { background: transparent; }
.card--pricelist .section-label        { color: #7ab0e0; }
.card--pricelist .section-headline     { color: #fff; }
.card--pricelist .section-lead         { color: rgba(255,255,255,.7); }
.card--pricelist .section p            { color: rgba(255,255,255,.5); }
.card--pricelist .pricelist__name      { color: rgba(255,255,255,.85); }
.card--pricelist .pricelist__dots      { border-bottom-color: rgba(255,255,255,.18); }
.card--pricelist .pricelist__item      { border-bottom-color: rgba(255,255,255,.1); }
.card--pricelist .pricelist__item:first-child { border-top-color: rgba(255,255,255,.1); }
.card--pricelist .pricelist__note      { color: rgba(255,255,255,.42); border-top-color: rgba(255,255,255,.1); }

/* ── Courses — deep forest sage / zelená ─────────────────────── */
.card--courses { background: #26342a; }
.card--courses .section--courses { background: transparent; }

/* Tmavá karta — přepsat texty na světlé */
.card--courses .section-label { color: var(--c-rose-light); }
.card--courses .section-headline { color: #fff; }
.card--courses .section-lead { color: rgba(255,255,255,.65); }
.card--courses .section p { color: rgba(255,255,255,.55); }
.card--courses .courses-checklist__item { color: rgba(255,255,255,.6); border-bottom-color: rgba(255,255,255,.1); }
.card--courses .courses-checklist__check { color: var(--c-rose-light); }
.card--courses .btn-primary {
  background: var(--c-rose-light);
  color: #fff;
  border-color: var(--c-rose-light);
}
.card--courses .btn-primary:hover { background: var(--c-rose); border-color: var(--c-rose); }

/* ── Contact + Footer — deep terracotta / cihlová ────────────── */
.card--contact {
  background: #3c2818;
  display: flex;
  flex-direction: column;
}
.card--contact .section--contact { background: transparent; }

/* Tmavá karta — texty na světlé */
.card--contact .section-label { color: var(--c-rose-light); }
.card--contact .section-headline { color: #fff; }
.card--contact .section p { color: rgba(255,255,255,.55); }
.card--contact .contact-address { color: rgba(255,255,255,.6); }
.card--contact .contact-address__name { color: rgba(255,255,255,.9) !important; font-weight: 400; }
.card--contact .contact-address p { color: rgba(255,255,255,.6) !important; }
.card--contact .contact-address a { color: rgba(255,255,255,.75) !important; }
.card--contact .contact-address a:hover { color: var(--c-rose-light) !important; }
.card--contact .contact-social__link { color: rgba(255,255,255,.4); border-color: rgba(255,255,255,.15); }
.card--contact .contact-social__link:hover { color: var(--c-rose-light); border-color: var(--c-rose-light); }

/* Contact sekce v poslední kartě — přirozená výška, neroztahuje se na celou obrazovku */
.card--contact .section--contact {
  min-height: auto;
  padding-top: calc(var(--nav-h) + clamp(1.5rem, 3vh, 3rem));
  padding-bottom: 2rem;
}

/* Foto v contact kartě — menší, aby se vešel i footer */
.card--contact .section--contact__image {
  height: clamp(200px, 28vw, 340px);
}

/* Footer v kartě — teplé espresso, jemně tmavší než kontakt sekce (#3c2818) */
.card--contact .site-footer {
  background: #2d1c10;
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 2.5rem clamp(1.5rem, 6vw, 4rem) 2rem;
  border-top: 1px solid rgba(228,158,136,.14);
}

/* Divider v kartě — bez bottom marginu, tagline navazuje */
.card--contact .footer__divider {
  margin-bottom: 0;
  background: rgba(228,158,136,.12);
}

/* Tagline — teplý, osobní text v patičce */
.card--contact .footer__tagline {
  font-family: var(--f-serif);
  font-size: clamp(1.1rem, 2vw, 1.65rem);
  font-style: italic;
  font-weight: 300;
  line-height: 1.55;
  color: rgba(255,245,238,.82);
  max-width: 30ch;
  margin: 2rem 0 0;
}

/* Vodoznak — velké jméno jako dekorace, teplý zlatavý tón (viditelný) */
.card--contact .footer__brand {
  display: flex;
  align-items: center;
  flex: 1;
  overflow: hidden;
  margin: 0;
  padding: 1rem 0 .5rem;
}

.card--contact .footer__brand-name {
  font-size: clamp(2.5rem, 7vw, 7rem) !important;
  color: var(--c-rose-light);
  opacity: .16;
  letter-spacing: -.01em;
}

/* Marquee v gallery kartě — background navazuje na galerii */
.card--gallery .marquee-band { background: var(--c-dark-2); }
