.rezervace-page { overflow: hidden; }
.rezervace-page :focus-visible { outline-color: var(--color-burgundy); }
.rezervace-hero { position: relative; min-height: 37.5rem; display: grid; overflow: hidden; background: var(--color-walnut); color: var(--color-cream); }
.rezervace-hero__image, .rezervace-hero__overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.rezervace-hero__image { object-fit: cover; object-position: center; }
.rezervace-hero__overlay { background: linear-gradient(90deg, rgb(36 24 20 / 82%) 0%, rgb(36 24 20 / 61%) 48%, rgb(36 24 20 / 30%) 100%); }
.rezervace-hero__container { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); align-items: center; }
.rezervace-hero__content { grid-column: 1 / span 1; width: 100%; min-width: 0; max-width: 36.25rem; display: flex; flex-direction: column; gap: var(--space-5); }
.rezervace-hero__content :is(h1, p) { margin: 0; }
.rezervace-hero__content h1 { font-size: clamp(3.2rem, 6vw, 4.25rem); }
.rezervace-hero__content > .intro { max-width: 34rem; }
.rezervace-hero__actions { display: flex; min-width: 0; }
.rezervace-hero__note { border-top: 1px solid rgb(242 233 216 / 45%); padding-top: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); }
.rezervace-hero__note p { color: var(--color-cream-warm); font-size: var(--text-label); line-height: var(--leading-label); }
.rezervace-hero__note a { color: var(--color-cream); }
.rezervace-types__intro { width: 41.666%; min-width: 0; }
.rezervace-types__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-8); }
.rezervace-type { min-width: 0; display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: var(--space-3); border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); padding: var(--space-5) 0; transition: background-color var(--transition-fast), border-color var(--transition-fast); }
.rezervace-type:hover, .rezervace-type.is-selected { border-color: var(--color-emerald); background: var(--color-cream-warm); }
.rezervace-type--poker { border-bottom: 3px solid var(--color-emerald); }
.rezervace-type__number { color: var(--color-burgundy); font-family: var(--font-heading); font-size: 2.5rem; line-height: 1; }
.rezervace-type__body { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.rezervace-type__body :is(h3, p) { margin: 0; }
.rezervace-type__link { min-height: 2.75rem; border: 0; border-bottom: 1px solid currentcolor; background: transparent; padding: 0; color: var(--color-emerald); font-size: var(--text-label); font-weight: 700; text-align: left; }
.rezervace-request__heading { width: 58.333%; min-width: 0; }
.rezervace-request__layout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; gap: var(--space-5); margin-top: var(--space-7); }
.rezervace-form { min-width: 0; border: 1px solid var(--color-line); background: var(--color-cream-warm); padding: var(--space-6); }
.rezervace-form__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-5); }
.rezervace-form__fields > .field { min-width: 0; margin: 0; }
.rezervace-form__field--wide { grid-column: 1 / -1; }
.rezervace-form input, .rezervace-form select, .rezervace-form textarea { min-height: 3rem; padding: .8rem 1rem; }
.rezervace-form__consent { margin: var(--space-5) 0; }
.rezervace-form__check { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); align-items: start; gap: var(--space-3); margin: 0; font-weight: 400; }
.rezervace-form__check input { width: 1.125rem; min-height: 1.125rem; margin-top: .2rem; }
.rezervace-form__error { min-height: 1.25rem; margin: 0; color: var(--color-burgundy); font-size: var(--text-label); line-height: var(--leading-label); }
.rezervace-form [aria-invalid="true"] { border-color: var(--color-burgundy); }
.rezervace-form__summary { display: none; margin-bottom: var(--space-4); border-left: 2px solid var(--color-burgundy); padding: var(--space-3) var(--space-4); color: var(--color-burgundy); font-size: var(--text-label); font-weight: 700; }
.rezervace-form__summary.is-visible { display: block; }
.rezervace-form__success { display: flex; flex-direction: column; gap: var(--space-4); border-left: 2px solid var(--color-emerald); padding-left: var(--space-4); }
.rezervace-form__success :is(h3, p) { margin: 0; }
.rezervace-confirmation { min-width: 0; background: var(--color-walnut-soft); color: var(--color-cream); padding: var(--space-6); }
.rezervace-confirmation :is(h3, p, ol) { margin: 0; }
.rezervace-confirmation__steps { display: flex; flex-direction: column; gap: var(--space-5); list-style: none; padding: 0; margin-top: var(--space-5); }
.rezervace-confirmation__steps li { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; }
.rezervace-confirmation__steps li > span { color: var(--color-cream-warm); font-family: var(--font-heading); font-size: 1.5rem; line-height: 1; }
.rezervace-confirmation__steps li div { min-width: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.rezervace-confirmation__steps p, .rezervace-confirmation__contact { color: var(--color-cream-warm); font-size: var(--text-label); line-height: var(--leading-label); }
.rezervace-confirmation__contact { border-top: 1px solid rgb(242 233 216 / 30%); padding-top: var(--space-4); margin-top: var(--space-5); }
.rezervace-poker__intro { width: 50%; min-width: 0; }
.rezervace-poker__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--space-7); }
.rezervace-poker__item { min-width: 0; padding: 0 var(--space-5); border-left: 1px solid rgb(242 233 216 / 35%); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.rezervace-poker__item:first-child { border-left: 0; padding-left: 0; }
.rezervace-poker__item :is(h3, p) { margin: 0; }
.rezervace-poker__item p { color: var(--color-cream-warm); }
.rezervace-poker__item a { margin-top: auto; color: var(--color-cream); }
.rezervace-poker__statement { margin: var(--space-7) 0 0; border-top: 1px solid rgb(242 233 216 / 35%); padding-top: var(--space-5); color: var(--color-cream-warm); font-size: var(--text-intro); line-height: var(--leading-intro); }
.rezervace-process__intro { width: 41.666%; min-width: 0; }
.rezervace-process__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-7); border-top: 1px solid var(--color-line); }
.rezervace-process__step { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-3); padding-top: var(--space-5); }
.rezervace-process__step > span { color: var(--color-burgundy); font-family: var(--font-heading); font-size: 3rem; line-height: 1; }
.rezervace-process__step > div { min-width: 0; }
.rezervace-process__step :is(h3, p) { margin: 0; }
.rezervace-process__step div { display: flex; flex-direction: column; gap: var(--space-3); }
.rezervace-location__layout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; gap: var(--space-5); }
.rezervace-location__media { min-width: 0; margin: 0; }
.rezervace-location__media img { width: 100%; max-width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.rezervace-location__content { min-width: 0; max-width: 30rem; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.rezervace-location__content :is(h2, p) { margin: 0; }
.rezervace-location__address { width: 100%; border-block: 1px solid var(--color-line); padding: var(--space-4) 0; display: flex; flex-direction: column; gap: var(--space-2); }
.rezervace-location__address address { margin: 0; font-size: var(--text-intro); line-height: var(--leading-intro); }
.rezervace-location__contact { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); border-top: 1px solid var(--color-line); padding-top: var(--space-4); }
.rezervace-location__contact span { min-width: 0; display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--text-label); }
.rezervace-location__contact b { font-size: var(--text-meta); letter-spacing: .1em; text-transform: uppercase; }
.rezervace-editorial { background: var(--color-walnut); }
.rezervace-editorial__layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); min-height: 31.25rem; }
.rezervace-editorial__content { min-width: 0; padding: clamp(3rem, 7vw, 7.5rem) max(var(--container-padding), calc((100vw - var(--container-max)) / 2)); padding-right: var(--space-8); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.rezervace-editorial__content :is(h2, p, blockquote) { margin: 0; }
.rezervace-editorial__content > p { max-width: 30rem; color: var(--color-cream-warm); }
.rezervace-editorial__content blockquote { max-width: 23rem; color: var(--color-cream); }
.rezervace-editorial__link { min-height: 2.75rem; display: inline-flex; align-items: center; color: var(--color-cream); font-weight: 700; }
.rezervace-editorial__media { min-width: 0; background: linear-gradient(rgb(36 24 20 / 20%), rgb(36 24 20 / 20%)), url('/src/media/rezervace-vecerni-salon.webp') center / cover no-repeat; transition: transform var(--transition-base); }
@media (hover: hover) { .rezervace-editorial__media:hover { transform: scale(1.02); } }
.rezervace-faq__heading { width: 50%; min-width: 0; }
.rezervace-faq__accordion, .rezervace-faq__cta { width: 75%; min-width: 0; }
.rezervace-faq__accordion { margin-top: var(--space-7); border-top: 1px solid var(--color-line); }
.rezervace-faq__item { border-bottom: 1px solid var(--color-line); }
.rezervace-faq__item h3 { margin: 0; }
.rezervace-faq__item button { width: 100%; min-width: 0; min-height: 3.5rem; display: grid; grid-template-columns: minmax(0, 1fr) 1.5rem; align-items: center; gap: var(--space-4); border: 0; background: transparent; padding: var(--space-4) 0; color: var(--color-ink); font-family: var(--font-heading); font-size: var(--text-h3); font-weight: 600; line-height: var(--leading-heading); text-align: left; }
.rezervace-faq__item button span { font-family: var(--font-body); font-size: 1.5rem; font-weight: 400; text-align: right; }
.rezervace-faq__item [role="region"] { max-width: 42rem; padding-bottom: var(--space-5); }
.rezervace-faq__item [role="region"] p { margin: 0; }
.rezervace-faq__cta { margin-top: var(--space-5); display: flex; justify-content: space-between; align-items: center; gap: var(--space-5); background: var(--color-emerald); color: var(--color-cream); padding: var(--space-5); }
.rezervace-faq__cta p { margin: 0; }
.rezervace-page .surface-emerald :focus-visible, .rezervace-page .surface-walnut :focus-visible { outline-color: var(--color-cream); }
@media (max-width: 61.24rem) { .rezervace-hero { min-height: 34rem; } .rezervace-hero__container { grid-template-columns: minmax(0, 7fr) minmax(0, 1fr); } .rezervace-hero__content { grid-column: 1; } .rezervace-request__layout { grid-template-columns: minmax(0, 1fr); } .rezervace-request__layout > * { width: 100%; min-width: 0; } .rezervace-location__layout { grid-template-columns: minmax(0, 1fr); } .rezervace-location__media { width: 100%; } .rezervace-location__media img { aspect-ratio: 3 / 2; } .rezervace-location__content { width: 75%; max-width: none; } }
@media (max-width: 56.24rem) { .rezervace-types__intro, .rezervace-request__heading, .rezervace-poker__intro, .rezervace-process__intro, .rezervace-faq__heading { width: 75%; } .rezervace-types__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rezervace-types__grid > :nth-child(3) { grid-column: 1 / -1; } .rezervace-poker__grid { grid-template-columns: minmax(0, 1fr); border-top: 1px solid rgb(242 233 216 / 35%); } .rezervace-poker__item, .rezervace-poker__item:first-child { width: 100%; padding: var(--space-5) 0; border-left: 0; border-bottom: 1px solid rgb(242 233 216 / 35%); } .rezervace-process__steps { grid-template-columns: minmax(0, 1fr); gap: 0; border-left: 1px solid var(--color-line); border-top: 0; padding-left: var(--space-5); } .rezervace-process__step { grid-template-columns: 3rem minmax(0, 1fr); padding: var(--space-5) 0; border-bottom: 1px solid var(--color-line); } .rezervace-editorial__layout { grid-template-columns: minmax(0, 1fr); } .rezervace-editorial__media { min-height: 20rem; order: -1; } .rezervace-editorial__content { padding: var(--space-8) var(--container-padding); } .rezervace-faq__accordion, .rezervace-faq__cta { width: 100%; } }
@media (max-width: 47.99rem) { .rezervace-hero { min-height: 31.25rem; } .rezervace-hero__overlay { background: linear-gradient(180deg, rgb(36 24 20 / 18%) 0%, rgb(36 24 20 / 86%) 78%); } .rezervace-hero__container { grid-template-columns: minmax(0, 1fr); align-items: end; padding-bottom: var(--space-5); } .rezervace-hero__content { max-width: none; background: rgb(36 24 20 / 82%); padding: var(--space-5); gap: var(--space-4); } .rezervace-hero__content h1 { font-size: clamp(2.875rem, 12vw, 3.125rem); } .rezervace-hero__content > .intro { max-width: 100%; font-size: 1.0625rem; } .rezervace-types__intro, .rezervace-request__heading, .rezervace-poker__intro, .rezervace-process__intro, .rezervace-location__content, .rezervace-faq__heading { width: 100%; } .rezervace-types__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-6); } .rezervace-types__grid > :nth-child(3) { grid-column: auto; } .rezervace-type { width: 100%; padding: var(--space-5); } .rezervace-form, .rezervace-confirmation { padding: var(--space-5); } .rezervace-form__fields { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); } .rezervace-form__field--wide { grid-column: auto; } .rezervace-poker__statement { font-size: var(--text-body); } .rezervace-location__contact { grid-template-columns: minmax(0, 1fr); } .rezervace-editorial__media { min-height: 16rem; } .rezervace-editorial__content { padding: var(--space-6) var(--container-padding); } .rezervace-faq__cta { width: 100%; flex-direction: column; align-items: stretch; gap: var(--space-4); } .rezervace-faq__cta .button { width: 100%; } }
