/* Navždy spolu — modernizace 14. 10. 2026 · v5
   Sdílené komponenty a vylepšení. Originální design jednotlivých stránek zůstává zachován. */
:root { --navigation-height: 62px; }
html { scroll-padding-top: calc(var(--navigation-height) + 22px); }
body { font-feature-settings: "kern" 1; }
main { isolation: isolate; }
:where(a,button,summary):focus-visible { outline: 2px solid var(--ink, #171611); outline-offset: 5px; }
:where(p,li) { text-wrap: pretty; }
.skip-link {
  position: fixed; top: -120px; left: 12px; z-index: 1001;
  padding: 14px 20px; background: #171611; color: #fff !important;
  font: 500 13px/1.4 "Inter",sans-serif; text-decoration: none;
  transition: top .18s ease;
}
.skip-link:focus { top: 12px; }
.global-bar {
  position: sticky; top: 0; z-index: 100;
  border-bottom: 1px solid var(--line, rgba(21,20,16,.15));
  background: var(--paper, #f7f4ee);
  background: color-mix(in srgb, var(--paper, #f7f4ee) 92%, transparent);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
}
.global-bar__inner {
  width: min(91vw, 1480px); margin-inline: auto;
  min-height: var(--navigation-height); display: flex;
  align-items: center; justify-content: space-between; gap: 24px;
}
.global-bar__brand {
  color: var(--ink, #171611); text-decoration: none;
  font: 400 clamp(15px,1.3vw,18px)/1.2 "Cinzel",serif;
  white-space: nowrap; letter-spacing: -.025em;
}
.global-bar__brand:hover { opacity: .63; }
.global-bar__links { display: flex; align-items: center; gap: clamp(15px,2.6vw,40px); }
.global-bar__links a, .global-mobile-menu summary, .global-mobile-menu a {
  color: var(--muted, #555); text-decoration: none;
  font: 500 11px/1.45 "Inter",sans-serif; letter-spacing: .115em; text-transform: uppercase;
}
.global-bar__links a { display: inline-flex; min-height: 44px; align-items: center; white-space: nowrap; }
.global-bar__links a:hover, .global-bar__links a[aria-current="page"] { color: var(--ink, #171611); }
.global-bar__links a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 7px; }
.global-mobile-menu { display: none; position: relative; }
.global-mobile-menu summary {
  min-height: 44px; display: flex; gap: 13px; align-items: center; justify-content: center;
  padding: 5px 0 5px 15px; color: var(--ink, #171611); cursor: pointer; list-style: none;
}
.global-mobile-menu summary::-webkit-details-marker { display: none; }
.global-mobile-menu summary::after { content: "+"; font: 300 22px/1 "Inter",sans-serif; }
.global-mobile-menu[open] summary::after { content: "−"; }
.global-mobile-menu nav {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 101;
  display: grid; min-width: min(76vw,260px); padding: 12px;
  background: var(--paper,#f7f4ee); border: 1px solid var(--line,rgba(21,20,16,.2));
  box-shadow: 0 22px 60px rgba(0,0,0,.10);
}
.global-mobile-menu nav a { display: block; padding: 15px 13px; border-bottom: 1px solid var(--line,rgba(21,20,16,.15)); }
.global-mobile-menu nav a:last-child { border-bottom: none; }
.global-mobile-menu nav a[aria-current="page"] { color: var(--ink,#171611); font-weight: 600; }
/* Rozcestník: přímá viditelnost služby Instax */
body.home-page .page { grid-template-rows: auto 1fr auto; gap: clamp(30px,4.2vw,58px); }
body.home-page .division { min-height: clamp(205px,19vw,300px); }
body.home-page .hero { min-height: clamp(150px,22svh,280px); }
.home-instax {
  grid-column: 1 / -1;
  position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto;
  gap: 22px 40px; align-items: end; padding: clamp(30px,4vw,58px);
  border: 1px solid #171611; background: #171611; color: #f7f4ee;
  text-decoration: none; overflow: hidden; transition: background .35s ease, transform .35s ease;
}
.home-instax::after {
  content: "WIDE"; position: absolute; top: -38px; right: 24%;
  color: rgba(247,244,238,.052); font: 400 clamp(110px,18vw,270px)/1 "Cinzel",serif;
  letter-spacing: -.06em; pointer-events: none;
}
.home-instax:hover { background: #2b2924; transform: translateY(-2px); }
.home-instax__copy { position: relative; z-index: 1; }
.home-instax__eyebrow { display: block; color: rgba(247,244,238,.65); font-size: 9px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }
.home-instax__title { margin: 19px 0 0; max-width: 16ch; font: 400 clamp(30px,4vw,60px)/1.02 "Cinzel",serif; letter-spacing: -.04em; }
.home-instax__text { max-width: 59ch; margin: 19px 0 0; color: rgba(247,244,238,.76); font: 300 clamp(13px,.98vw,15px)/1.7 "Inter",sans-serif; }
.home-instax__side { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; text-align: right; }
.home-instax__side strong { font: 400 clamp(28px,3.6vw,52px)/1 "Cinzel",serif; white-space: nowrap; }
.home-instax__side small { color: rgba(247,244,238,.7); font: 500 10px/1.5 "Inter",sans-serif; letter-spacing: .1em; }
.home-instax__side span { border-bottom: 1px solid rgba(247,244,238,.8); padding-bottom: 8px; font: 500 10px/1.4 "Inter",sans-serif; letter-spacing: .18em; text-transform: uppercase; }
/* Svatebni balicky: cena zustava dominantni, pocty jen v rozkliknutych detailech. */
body.wedding-page .price-card { min-height: 360px; }
body.wedding-page .price-desc { display: block; margin: 18px 0 0; color: var(--muted); font-size: 13px; line-height: 1.75; }
body.wedding-page .price-team { margin: 12px 0 0; color: var(--muted); font: 500 11px/1.5 "Inter", sans-serif; letter-spacing: .04em; }
body.wedding-page .price-bottom { margin-top: auto; padding-top: 36px; }
body.wedding-page .package-details { margin-top: 24px; border-top: 1px solid var(--line); }
body.wedding-page .package-details summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 48px; list-style: none; cursor: pointer;
  color: var(--ink); font: 500 9px/1.5 "Inter",sans-serif;
  letter-spacing: .12em; text-transform: uppercase;
}
body.wedding-page .package-details summary::-webkit-details-marker,
body.wedding-page .addon-expand summary::-webkit-details-marker { display: none; }
body.wedding-page .package-details summary::after,
body.wedding-page .addon-expand summary::after { content: "+"; font: 300 22px/1 "Inter",sans-serif; }
body.wedding-page .package-details[open] summary::after,
body.wedding-page .addon-expand[open] summary::after { content: "−"; }
body.wedding-page .package-details .card-details,
body.wedding-page .addon-expand .card-details { display: block; margin: 0; padding: 14px 0 5px; border: 0; }
body.wedding-page .package-details .card-details p { font-size: 13px; padding-bottom: 7px; }
body.wedding-page .addon-expand { margin-top: 26px; border-top: 1px solid var(--line); }
body.wedding-page .addon-expand summary { padding-block: 20px; cursor: pointer; list-style: none; font: 500 11px/1.5 "Inter",sans-serif; }
body.wedding-page .addon-expand summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
body.wedding-page .addon-expand .card-details { padding-top: 8px; }
/* Doplňková služba: prodejní most mezi svatebním focením a Instaxem */
.wedding-instax {
  display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end;
  gap: 30px; margin: clamp(55px,7vw,100px) 0 0;
  padding: clamp(28px,4.3vw,68px); background: var(--ink,#171611);
  border: 1px solid var(--ink,#171611); color: var(--paper,#f7f4ee);
  text-decoration: none; transition: transform .28s ease, background .28s ease;
}
.wedding-instax:hover { transform: translateY(-2px); background: #302e27; }
.wedding-instax__eyebrow { display: block; margin-bottom: 22px; color: rgba(247,244,238,.65); font-size: 10px; letter-spacing: .17em; text-transform: uppercase; }
.wedding-instax h2 { margin: 0; font: 400 clamp(34px,4.6vw,72px)/1.05 "Cinzel",serif; letter-spacing: -.046em; }
.wedding-instax p { max-width: 70ch; margin: 20px 0 0; color: rgba(247,244,238,.75); font: 300 14px/1.75 "Inter",sans-serif; }
.wedding-instax__side { display: grid; gap: 19px; justify-items: end; }
.wedding-instax__side strong { font: 400 clamp(29px,3vw,48px)/1 "Cinzel",serif; white-space: nowrap; }
.wedding-instax__side span { padding-bottom: 7px; border-bottom: 1px solid rgba(247,244,238,.75); font: 500 10px/1.5 "Inter",sans-serif; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
/* Více užitečné nabídky nad přehybem stránky, přitom zachovat čistý hero. */
body.love-page .hero { min-height: min(78svh,830px); }
body.instax-page .hero { min-height: min(72svh,780px); }
body.voucher-page .hero { min-height: min(68svh,740px); }
body.voucher-page .voucher-frame img { max-width: 100%; height: auto; }
/* Hustší vertikální rytmus: prémiová vzdušnost, ale méně zbytečného scrollování. */
body.instax-page { --section: clamp(70px,7.5vw,116px); }
body.love-page { --section: clamp(76px,8vw,128px); }
body.voucher-page { --section: clamp(80px,9vw,140px); }
body.instax-page .email-link { display: inline-block; max-width: 100%; overflow-wrap: anywhere; font-size: clamp(20px,2.5vw,36px); }
body.love-page .reservation a[href^="mailto:"] { max-width: 100%; overflow-wrap: anywhere; font-size: clamp(20px,2.5vw,36px)!important; }
/* Zamezit horizontálnímu přetékání na úzkých obrazovkách. */
@media(max-width:850px){
  .global-bar__inner { width: min(90vw,1420px); }
  .global-bar__links { gap: 15px; }
  .global-bar__links a { font-size: 10px; }
}
@media(max-width:700px){
  :root { --navigation-height: 56px; }
  .global-bar__links { display: none; }
  .global-mobile-menu { display: block; }
  body.home-page .page { grid-template-rows: auto 1fr auto; gap: 26px; }
  .home-instax, .wedding-instax { grid-template-columns: 1fr; padding: 30px 25px; }
  .home-instax__side { align-items: flex-start; text-align: left; }
  .wedding-instax__side { justify-items: start; }
  .home-instax__side strong { font-size: 35px; }
  .wedding-instax__side strong { font-size: 35px; }
  body.wedding-page .hero { padding-top: 50px; }
  body.wedding-page .price-card { min-height: 0; }
  body.wedding-page .price-bottom { padding-top: 25px; }
  body.wedding-page .hero h1 { font-size: clamp(34px, 10vw, 58px); }
  body.instax-page .hero { min-height: 75svh; }
  body.love-page .hero,body.voucher-page .hero { min-height: 75svh; }
}
@media(prefers-reduced-motion:reduce){
  html { scroll-behavior: auto; }
  .global-bar *, .home-instax, .wedding-instax { transition: none!important; }
  html.js .reveal { opacity: 1!important; transform: none!important; }
  .wordmark,.hero-subtitle,.hero-copy,.hero-cta { animation: none!important; opacity: 1!important; transform: none!important; }
}

/* v5 | Svatby: dve urovne navigace ve spojene sticky hlavicce. */
body.wedding-page .wedding-header { position: sticky; top: 0; z-index: 200; }
body.wedding-page .wedding-header .global-bar__inner { width: var(--page); gap: clamp(16px, 1.6vw, 28px); }
body.wedding-page .wedding-header .global-bar__links { gap: clamp(12px, 1.55vw, 25px); margin-left: auto; }
body.wedding-page .wedding-header .global-bar__links a { font-size: 10px; letter-spacing: .045em; }
.wedding-subnav { display: flex; align-items: center; flex: 0 0 auto; gap: clamp(13px, 1.5vw, 26px); padding-left: clamp(14px, 1.8vw, 29px); border-left: 1px solid var(--line); }
.wedding-subnav a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; color: var(--muted); font: 500 11px/1.4 "Inter",sans-serif; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.wedding-subnav a:hover, .wedding-subnav a:focus-visible { color: var(--ink); }
.wedding-subnav .wedding-subnav__cta { min-height: 38px; padding: 0 12px; border: 1px solid var(--ink); color: var(--ink); transition: color .2s ease, background .2s ease; }
@media (hover:hover) { .wedding-subnav__cta:hover { background: var(--ink); color: var(--paper)!important; } }
html:has(body.wedding-page) { scroll-padding-top: 0; }
body.wedding-page section[id] { scroll-margin-top: 90px; }
body.wedding-page .hero { min-height: clamp(450px, 69svh, 780px); }
@media (max-width: 1100px) {
  body.wedding-page .wedding-header .global-bar__links { display: none; }
  body.wedding-page .wedding-header .global-mobile-menu { display: block; order: 3; }
  body.wedding-page .wedding-header .wedding-subnav { margin-left: auto; order: 2; }
}
@media (max-width: 700px) {
  body.wedding-page .wedding-header .global-bar__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 12px; min-height: 0; padding-top: 0; }
  body.wedding-page .wedding-header .global-bar__brand { grid-column: 1; grid-row: 1; align-self: center; }
  body.wedding-page .wedding-header .global-mobile-menu { grid-column: 2; grid-row: 1; justify-self: end; }
  body.wedding-page .wedding-header .wedding-subnav { grid-column: 1 / -1; grid-row: 2; display: grid; grid-template-columns: .75fr .75fr 1.5fr; gap: 0; margin: 0; padding: 0; width: 100%; border-left: 0; border-top: 1px solid var(--line); }
  body.wedding-page .wedding-header .wedding-subnav a { min-height: 48px; font-size: 11px; letter-spacing: .04em; }
  body.wedding-page .wedding-header .wedding-subnav a + a { border-left: 1px solid var(--line); }
  body.wedding-page .wedding-header .wedding-subnav__cta { border: 0; padding: 0 4px; min-height: 48px; }
  body.wedding-page section[id] { scroll-margin-top: 120px; }
  body.wedding-page .hero { min-height: 0; padding-top: 34px; }
  body.wedding-page .price-card { min-height: 0; }
}
@media (prefers-reduced-motion:reduce) { .wedding-subnav__cta { transition: none; } }