/* =========================================================

   ROOT / ZÁKLADNÍ VARS

========================================================= */



:root {

    --bg: #0f0f10;

    --text: #f5f1ea;

    --muted: #c6bbac;

    --muted-2: #9b9185;

    --accent: #d6c3a1;

    --accent-strong: #e7d6b7;

    --line: rgba(255, 255, 255, 0.08);

    --container: 1280px;

}



.homepage-lunch-section {

    padding: 80px 0 48px;

    background: #111113;

}



.special-menu-section {

    padding: 48px 0 90px;

    background: #111113;

}



.special-menu-section .homepage-lunch-preview {

    padding-top: 48px;

    border-top: 1px solid rgba(255, 255, 255, 0.08);

}



.wines-subheader {

    margin-top: 15px;

    padding-top: 15px;

}



/* =========================================================

   RESET / ZÁKLAD

========================================================= */



* {

    box-sizing: border-box;

    margin: 0;

    padding: 0;

}



html,

body {

    width: 100%;

    max-width: 100%;

    overflow-x: hidden;

    background: #0f0f10;

}



body {

    font-family: "Inter", sans-serif;

    background: radial-gradient(circle at top left, rgba(214, 195, 161, 0.05), transparent 24%), linear-gradient(180deg, #0d0d0e 0%, #111113 100%);

    color: var(--text);

}



a {

    color: inherit;

    text-decoration: none;

}



.container {

    width: min(calc(100% - 40px), var(--container));

    margin: 0 auto;

}



.muted {

    color: var(--muted);

    font-size: 1rem;

    line-height: 1.8;

}



.section-label {

    color: var(--accent);

    text-transform: uppercase;

    letter-spacing: 0.22em;

    font-size: 0.72rem;

    margin-bottom: 14px;

}



/* =========================================================

   LENIS / SMOOTH SCROLL

========================================================= */



html.lenis,

html.lenis body {

    height: auto;

}



.lenis.lenis-smooth {

    scroll-behavior: auto !important;

}



.lenis.lenis-smooth iframe {

    pointer-events: none;

}



.lenis.lenis-stopped {

    overflow: hidden;

}



/* =========================================================

   TLAČÍTKA

========================================================= */



.btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-height: 48px;

    padding: 0 20px;

    border-radius: 0;

    font-size: 0.9rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.08em;

    white-space: nowrap;

}



.btn-primary {

    background: #a52a1d;

    color: white;

    transition: background 0.25s ease, transform 0.25s ease;

}



.btn-primary:hover {

    background: #bf3324;

}



.btn-secondary {

    background: rgba(255, 255, 255, 0.02);

    border: 1px solid rgba(255, 255, 255, 0.12);

    color: var(--text);

    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;

}



.btn-secondary:hover {

    background: rgba(255, 255, 255, 0.045);

    border-color: rgba(214, 195, 161, 0.34);

    color: var(--accent);

    transform: translateY(-2px);

    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(214, 195, 161, 0.06);

}



/* =========================================================

   NAVBAR – DESKTOP

========================================================= */



.topbar {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    z-index: 100;

    background: rgba(8, 8, 10, 0.42);

    backdrop-filter: blur(14px);

    border-bottom: 1px solid rgba(255, 255, 255, 0.05);

}



.nav {

    min-height: 92px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 24px;

    flex-wrap: nowrap;

}



.brand strong {

    font-family: "Cormorant Garamond", serif;

    font-size: 2rem;

    font-weight: 600;

    letter-spacing: 0.04em;

}



.brand-logo {

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    line-height: 1;

}



.brand-top {

    font-family: "Crimson Text", serif;

    font-size: 0.9rem;

    font-weight: 600;

    letter-spacing: 0.22em;

    text-transform: uppercase;

    color: rgba(255, 255, 255, 0.88);

    line-height: 1.1;

}



.brand-bottom {

    font-family: "Alex Brush", cursive;

    font-size: 2.45rem;

    font-weight: 400;

    color: white;

    line-height: 0.85;

    margin-top: 2px;

}



.nav-links {

    display: flex;

    align-items: center;

    gap: 30px;

    flex-wrap: nowrap;

    flex: 0 1 auto;

    min-width: 0;

    justify-content: center;

}



.nav-links a {

    position: relative;

    font-size: 0.95rem;

    font-weight: 600;

    color: rgba(255, 255, 255, 0.88);

    padding: 8px 0;

    white-space: nowrap;

    transition: color 0.25s ease;

}



.nav-links a::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -6px;

    width: 0;

    height: 1px;

    background: var(--accent);

    transition: width 0.28s ease;

}



.nav-links a:hover {

    color: white;

}



.nav-links a:hover::after {

    width: 100%;

}



.nav-actions {

    display: flex;

    align-items: center;

    flex-direction: row;

    gap: 12px;

    flex-wrap: nowrap;

    flex-shrink: 0;

}



.nav-links a.active,

.nav-dropdown-link.active {

    color: var(--accent);

}



/* =========================================================

   NAVBAR DROPDOWN MENU

========================================================= */



.nav-dropdown {

    position: relative;

    display: flex;

    align-items: center;

}



.nav-dropdown::after {

    content: "";

    position: absolute;

    top: 100%;

    left: 0;

    width: 100%;

    height: 14px;

}



.nav-dropdown-link {

    position: relative;

    font-size: 0.95rem;

    font-weight: 600;

    color: rgba(255, 255, 255, 0.88);

    padding: 8px 0;

    transition: color 0.25s ease;

}



.nav-dropdown-link::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -6px;

    width: 0;

    height: 1px;

    background: var(--accent);

    transition: width 0.28s ease;

}



.dropdown-menu {

    position: absolute;

    top: calc(100% + 8px);

    left: 50%;

    min-width: 260px;

    width: max-content;

    max-width: 320px;

    transform: translateX(-50%) translateY(10px);

    padding: 14px 0;

    background: rgba(14, 14, 16, 0.96);

    backdrop-filter: blur(18px);

    border: 1px solid rgba(255, 255, 255, 0.08);

    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;

    z-index: 150;

}



.dropdown-menu a {

    display: block;

    padding: 12px 20px;

    color: var(--text);

    font-size: 0.92rem;

    transition: background 0.25s ease, color 0.25s ease, padding-left 0.25s ease;

}



.dropdown-menu a:hover {

    background: rgba(255, 255, 255, 0.04);

    color: var(--accent);

    padding-left: 26px;

}



.nav-dropdown:hover .nav-dropdown-link,

.nav-dropdown:focus-within .nav-dropdown-link {

    color: white;

}



.nav-dropdown:hover .nav-dropdown-link::after,

.nav-dropdown:focus-within .nav-dropdown-link::after {

    width: 100%;

}



.nav-dropdown:hover .dropdown-menu,

.nav-dropdown:focus-within .dropdown-menu {

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

    transform: translateX(-50%) translateY(0);

}



/* =========================================================

   HERO – VIDEO POZADÍ

========================================================= */



.hero-fullscreen {

    position: relative;

    min-height: 100vh;

    background: #0f0f10 url("images/introHero.jpg") center center / cover no-repeat;

    display: flex;

    align-items: center;

    overflow: hidden;

}





.hero-video {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    object-fit: cover;

    z-index: 0;

    pointer-events: none;

}



@media (max-width: 1280px) {

    .hero-fullscreen {

        min-height: auto !important;

        height: auto;

        padding: 100px 0 0;

        background: #0f0f10 !important;

        display: block;

    }



    .hero-fullscreen .hero-inner {

        min-height: 0 !important;

        height: auto !important;

        padding: 0 !important;

        display: block !important;

    }



    .hero-overlay {

        display: none;

    }



    .hero-video {

        position: relative;

        width: 100%;

        height: 50vh;

        object-fit: cover;

        display: block;

        background: transparent;

    }



    .scroll-down {

        display: none;

    }



    .intro-section {

        padding: 40px 0 60px;

    }

}



.hero-fullscreen .hero-overlay {

    z-index: 1;

}



.hero-fullscreen .hero-inner {

    position: relative;

    z-index: 2;

}



.hero-actions {

    display: flex;

    justify-content: center;

    gap: 14px;

    flex-wrap: wrap;

    margin-top: 28px;

}



.hero-actions .btn {

    min-height: 52px;

    padding: 0 28px;

}



/* =========================================================

   MODAL 3D PROHLÍDKA

========================================================= */



.tour-modal {

    position: fixed;

    inset: 0;

    display: none;

    z-index: 9999;

    padding: 24px;

}



.tour-modal.is-open {

    display: block;

}



.tour-modal-backdrop {

    position: fixed;

    inset: 0;

    background: rgba(6, 6, 8, 0.85);

    backdrop-filter: blur(8px);

    cursor: pointer;

}



.tour-modal-dialog {

    position: relative;

    z-index: 2;

    width: min(96vw, 1400px);

    height: calc(100vh - 48px);

    margin: 0 auto;

    border-radius: 24px;

    overflow: hidden;

    background: #141417;

    border: 1px solid rgba(255, 255, 255, 0.08);

    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);

}



.tour-modal-close {

    position: absolute;

    top: 16px;

    right: 16px;

    width: 48px;

    height: 48px;

    border: none;

    border-radius: 50%;

    background: rgba(10, 10, 12, 0.78);

    color: white;

    font-size: 1.6rem;

    line-height: 1;

    cursor: pointer;

    z-index: 3;

    transition: background 0.25s ease, transform 0.25s ease;

}



.tour-modal-close:hover {

    background: rgba(20, 20, 22, 0.95);

    transform: rotate(90deg);

}



.tour-modal-frame {

    width: 100%;

    height: 100%;

}



.tour-modal-frame iframe {

    width: 100%;

    height: 100%;

    border: 0;

    display: block;

}



/* =========================================================

   HERO – OBSAH

========================================================= */



.hero-overlay {

    position: absolute;

    inset: 0;

    background: linear-gradient(180deg, rgba(0, 0, 0, 0.26), rgba(0, 0, 0, 0.37)), linear-gradient(90deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0.07));

}



.hero-inner {

    position: relative;

    z-index: 1;

    min-height: 100vh;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

}



.hero-center {

    text-align: center;

    max-width: 680px;

}



.hero-subtitle {

    font-family: "Crimson Text", serif;

    color: rgba(255, 255, 255, 0.82);

    text-transform: uppercase;

    letter-spacing: 0.32em;

    font-size: clamp(0.95rem, 1.4vw, 1.25rem);

    font-weight: 600;

    margin-bottom: 18px;

}



.hero-center h1 {

    font-family: "Cormorant Garamond", serif;

    font-size: clamp(4rem, 9vw, 7.5rem);

    font-weight: 600;

    letter-spacing: 0.04em;

    line-height: 0.95;

    margin-bottom: 18px;

}



.hero-logo {

    display: flex;

    flex-direction: column;

    align-items: center;

    margin-bottom: 18px;

    line-height: 1;

}



.hero-logo-top {

    font-family: "Crimson Text", serif;

    font-size: clamp(1rem, 1.8vw, 1.45rem);

    font-weight: 600;

    letter-spacing: 0.35em;

    text-transform: uppercase;

    color: rgba(255, 255, 255, 0.84);

    margin-bottom: 12px;

    line-height: 1.1;

}



.hero-logo-bottom {

    font-family: "Alex Brush", cursive;

    font-size: clamp(5rem, 11vw, 8.8rem);

    font-weight: 400;

    line-height: 0.82;

    color: white;

}



.hero-logo-top,

.hero-logo-bottom {

    text-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);

}



.hero-center h1,

.hero-description {

    text-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);

}



.hero-description {

    font-size: 1.05rem;

    color: rgba(255, 255, 255, 0.82);

    max-width: 56ch;

    margin: 0 auto;

}



.scroll-down {

    position: absolute;

    bottom: 36px;

    left: 50%;

    transform: translateX(-50%);

    width: 42px;

    height: 42px;

    display: grid;

    place-items: center;

}



.scroll-down span {

    display: block;

    width: 22px;

    height: 22px;

    border-bottom: 2px solid white;

    border-right: 2px solid white;

    transform: rotate(45deg);

    animation: scrollArrow 1.6s infinite;

}



@keyframes scrollArrow {

    0% {

        transform: rotate(45deg) translate(-4px, -4px);

        opacity: 0;

    }

    50% {

        opacity: 1;

    }

    100% {

        transform: rotate(45deg) translate(6px, 6px);

        opacity: 0;

    }

}



/* =========================================================

   INTRO SEKCE

========================================================= */



.intro-section {

    padding: 110px 0;

    background: #111113;

}



.intro-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 40px;

    align-items: start;

}



.intro-grid h2 {

    font-family: "Cormorant Garamond", serif;

    font-size: clamp(2.2rem, 4vw, 3.4rem);

    line-height: 1.02;

}



/* =========================================================

   ABOUT PREVIEW

========================================================= */



.about-preview {

    padding: 120px 0;

    background: #131315;

}



.about-grid {

    display: grid;

    grid-template-columns: 1.05fr 0.95fr;

    gap: 40px;

    align-items: center;

}



.about-image {

    border-radius: 24px;

    overflow: hidden;

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);

    border: 1px solid rgba(255, 255, 255, 0.06);

}



.about-image img {

    width: 100%;

    height: 620px;

    object-fit: cover;

    filter: brightness(0.85);

}



.about-content h2 {

    margin-bottom: 22px;

}



.about-content .muted {

    margin-bottom: 18px;

}



/* =========================================================

   FEATURES SEKCE

========================================================= */



.features-section {

    position: relative;

    padding: 110px 0;

    background: url("images/atmosferaRestaurace.jpg") center center / cover no-repeat fixed;

}



.features-section .container {

    position: relative;

    z-index: 1;

}



.features-section::before {

    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(180deg, rgba(15, 15, 18, 0.9) 0%, rgba(15, 15, 18, 0.75) 40%, rgba(15, 15, 18, 0.85) 100%);

    z-index: 0;

}



.section-heading-center {

    text-align: center;

    max-width: 780px;

    margin: 0 auto 54px;

}



.section-text-center {

    max-width: 60ch;

    margin: 18px auto 0;

}



.features-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 22px;

    align-items: stretch;

}



.feature-box {

    height: 100%;

    padding: 34px 28px;

    border-radius: 22px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.015));

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);

}



.feature-box h3 {

    margin-bottom: 14px;

}



/* =========================================================

   MENU PREVIEW

========================================================= */



.menu-preview {

    padding: 120px 0;

    background: #141416;

}



.menu-preview-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 22px;

    margin-top: 20px;

    align-items: stretch;

}



.menu-preview-card {

    height: 100%;

    padding: 30px;

    border-radius: 22px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.015));

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);

}



.menu-category {

    display: inline-block;

    color: var(--accent);

    text-transform: uppercase;

    letter-spacing: 0.18em;

    font-size: 0.72rem;

    margin-bottom: 16px;

}



.menu-preview-card h3 {

    margin-bottom: 10px;

}



.menu-preview-card .price {

    display: inline-block;

    margin-top: 18px;

    color: var(--accent);

    font-weight: 700;

}



.center-button {

    display: flex;

    justify-content: center;

    margin-top: 34px;

}



/* =========================================================

   MAPA

========================================================= */



.location-section {

    padding: 120px 0 0;

    background: #111113;

}



.location-heading {

    text-align: center;

    margin-bottom: 34px;

}



.location-heading h2 {

    font-size: clamp(2.4rem, 4vw, 3.8rem);

    line-height: 1.02;

}



.location-map {

    position: relative;

    width: 100%;

    height: 520px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, 0.08);

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);

}



.location-map iframe {

    width: 100%;

    height: 100%;

    border: 0;

    display: block;

    filter: contrast(1.02) brightness(1) saturate(0.75);

}



.location-map::before {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 2;

    background: linear-gradient(180deg, rgba(17, 17, 19, 0.92) 0%, rgba(17, 17, 19, 0.18) 16%, rgba(17, 17, 19, 0.08) 50%, rgba(17, 17, 19, 0.18) 84%, rgba(17, 17, 19, 0.92) 100%);

}



/* =========================================================

   FOOTER

========================================================= */





.site-footer {

    background: #111113;

    padding: 40px 0 36px;

    border-top: 1px solid rgba(255, 255, 255, 0.06);

}



.site-footer .footer-bar {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 18px;

    border-top: none;

    padding-top: 0;

}



.site-footer .footer-bar p {

    margin: 0;

    color: rgba(245, 241, 234, 0.92);

    font-size: 0.95rem;

    letter-spacing: 0.04em;

}



.footer-links {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 14px 28px;

}



.footer-links a {

    color: rgba(198, 187, 172, 0.85);

    font-size: 0.9rem;

    letter-spacing: 0.03em;

    transition: color 0.25s ease;

    position: relative;

}



.footer-links a::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -4px;

    width: 0;

    height: 1px;

    background: var(--accent);

    transition: width 0.28s ease;

}



.footer-links a:hover {

    color: var(--accent);

}



.footer-links a:hover::after {

    width: 100%;

}



@media (max-width: 640px) {

    .site-footer {

        padding: 32px 0 28px;

    }



    .footer-links {

        gap: 12px 20px;

    }



    .footer-links a {

        font-size: 0.85rem;

    }

}

/* =========================================================

   HOVER EFEKTY

========================================================= */



.feature-box,

.menu-preview-card,

.about-image {

    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;

}



.feature-box:hover,

.menu-preview-card:hover,

.about-image:hover {

    transform: translateY(-4px);

    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);

    border-color: rgba(214, 195, 161, 0.18);

}



.about-content h2,

.section-heading-center h2,

.location-heading h2,

.intro-grid h2 {

    line-height: 1.08;

}



/* =========================================================

   SCROLL TO TOP

========================================================= */



.scroll-to-top {

    position: fixed;

    right: 28px;

    bottom: 28px;

    width: 56px;

    height: 56px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    border-radius: 50%;

    background: rgba(10, 10, 12, 0.72);

    color: rgba(245, 241, 234, 0.88);

    backdrop-filter: blur(14px);

    -webkit-backdrop-filter: blur(14px);

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);

    cursor: pointer;

    z-index: 200;

    display: flex;

    align-items: center;

    justify-content: center;

    opacity: 0;

    visibility: hidden;

    transform: translateY(12px) scale(0.96);

    transition: opacity 0.28s ease, visibility 0.28s ease, transform 0.28s ease, border-color 0.28s ease, color 0.28s ease, background 0.28s ease, box-shadow 0.28s ease;

}



.scroll-to-top:hover {

    border-color: rgba(214, 195, 161, 0.32);

    color: var(--accent);

    background: rgba(18, 18, 20, 0.9);

    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(214, 195, 161, 0.06);

}



.scroll-to-top.show {

    opacity: 1;

    visibility: visible;

    transform: translateY(0) scale(1);

}



.scroll-to-top span {

    font-size: 1.1rem;

    line-height: 1;

    transform: translateY(-1px);

}



/* =========================================================

   PODSTRÁNKY – HERO

========================================================= */



.page-hero {

    position: relative;

    min-height: 100vh;

    display: flex;

    align-items: center;

    background-size: cover;

    background-position: center center;

    background-repeat: no-repeat;

    overflow: hidden;

}



.page-hero-about {

    background-image: url("images/aboutHero.webp");

}



.page-hero-events {

    background-image: url("images/eventsHero.webp");

}



.page-hero-gallery {

    background-image: url("images/galleryHero.webp");

}



.page-hero-contact {

    background-image: url("images/contactHero.webp");

}



.page-hero-reservation {

    background-image: url("images/contactHero.webp");

}



.page-hero-menu-food {

    background-image: url("images/menuHero.webp");

}



.page-hero-menu-alcohol {

    background-image: url("images/alcoholHero.webp");

}



.page-hero-menu-soft {

    background-image: url("images/nealkoHero.webp");

}



.page-hero .hero-inner {

    position: relative;

    z-index: 1;

    min-height: 100vh;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

}



.page-hero .hero-center {

    text-align: center;

    max-width: 1200px;

    margin: 0 auto;

    width: 100%;

}



.page-hero .hero-center h1 {

    font-family: "Cormorant Garamond", serif;

    font-size: clamp(2.8rem, 6.2vw, 7rem);

    font-weight: 600;

    letter-spacing: 0.04em;

    line-height: 0.95;

    margin-bottom: 18px;

    white-space: normal;

}



.hero-fullscreen .hero-center h1:not(.hero-logo) {

    white-space: nowrap;

}



.page-hero-menu-food .hero-center h1,

.page-hero-menu-alcohol .hero-center h1,

.page-hero-menu-soft .hero-center h1 {

    white-space: nowrap;

    font-size: clamp(2.4rem, 5.5vw, 6rem);

}



/* =========================================================

   ABOUT / STORY / VALUES / CTA SEKCE

========================================================= */



.story-section,

.values-section,

.experience-section,

.about-cta-section {

    padding: 110px 0;

}



.story-grid,

.experience-grid {

    display: grid;

    grid-template-columns: 1.05fr 0.95fr;

    gap: 56px;

    align-items: center;

}



.story-text h2,

.experience-content h2 {

    font-size: clamp(2rem, 4vw, 3.3rem);

    line-height: 1.08;

    margin-bottom: 24px;

}



.story-image img,

.experience-image img {

    width: 100%;

    height: 620px;

    object-fit: cover;

    border-radius: 28px;

    display: block;

}



.values-section {

    background: rgba(255, 255, 255, 0.02);

}



.values-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 24px;

    margin-top: 48px;

}



.value-card {

    padding: 32px 28px;

    border-radius: 24px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

    transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;

}



.value-card:hover {

    transform: translateY(-4px);

    border-color: rgba(214, 195, 161, 0.28);

    background: rgba(255, 255, 255, 0.045);

}



.value-card h3 {

    margin-bottom: 14px;

    font-size: 1.25rem;

}



.about-cta-box {

    text-align: center;

    max-width: 850px;

    margin: 0 auto;

    padding: 56px 36px;

    border-radius: 30px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.about-cta-box h2 {

    font-size: clamp(2rem, 4vw, 3rem);

    margin-bottom: 18px;

}



.about-cta-buttons {

    display: flex;

    justify-content: center;

    gap: 16px;

    margin-top: 28px;

    flex-wrap: wrap;

}



/* =========================================================

   GALERIE

========================================================= */



.gallery-intro {

    padding: 110px 0 30px;

}



.gallery-section {

    padding: 30px 0 110px;

}



.gallery-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 22px;

}



.gallery-item {

    position: relative;

    padding: 0;

    border: none;

    background: transparent;

    cursor: pointer;

    overflow: hidden;

    border-radius: 24px;

    min-height: 280px;

    display: block;

}



.gallery-item-large {

    grid-column: span 2;

    grid-row: span 2;

    min-height: 580px;

}



.gallery-item-wide {

    grid-column: span 2;

}



.gallery-item img {

    width: 100%;

    height: 100%;

    min-height: inherit;

    object-fit: cover;

    display: block;

    transition: transform 0.6s ease, filter 0.4s ease;

}



.gallery-item::after {

    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(to top, rgba(8, 8, 10, 0.28), rgba(8, 8, 10, 0.02));

    opacity: 0;

    transition: opacity 0.35s ease;

}



.gallery-item:hover img {

    transform: scale(1.06);

    filter: brightness(1.05);

}



.gallery-item:hover::after {

    opacity: 1;

}



.gallery-cta-section {

    padding: 0 0 110px;

}



.gallery-cta-box {

    text-align: center;

    max-width: 850px;

    margin: 0 auto;

    padding: 56px 36px;

    border-radius: 30px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.gallery-cta-box h2 {

    font-size: clamp(2rem, 4vw, 3rem);

    margin-bottom: 18px;

}



.lightbox {

    position: fixed;

    inset: 0;

    background: rgba(0, 0, 0, 0.92);

    display: flex;

    justify-content: center;

    align-items: center;

    padding: 40px 24px;

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    transition: opacity 0.3s ease, visibility 0.3s ease;

    z-index: 9999;

}



.lightbox.open {

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

}



.lightbox img {

    max-width: min(1200px, 92vw);

    max-height: 88vh;

    border-radius: 20px;

    object-fit: contain;

    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);

}



.lightbox-close {

    position: absolute;

    top: 24px;

    right: 28px;

    width: 52px;

    height: 52px;

    border: none;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.08);

    color: white;

    font-size: 2rem;

    line-height: 1;

    cursor: pointer;

    transition: background 0.25s ease, transform 0.25s ease;

}



.lightbox-close:hover {

    background: rgba(255, 255, 255, 0.16);

    transform: scale(1.05);

}



body.lightbox-open {

    overflow: hidden;

}



/* =========================================================

   KONTAKT / FORMULÁŘE

========================================================= */



.contact-card {

    padding: 26px 24px;

    border-radius: 22px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.contact-card-label {

    display: block;

    font-size: 0.82rem;

    letter-spacing: 0.12em;

    text-transform: uppercase;

    color: var(--accent);

    margin-bottom: 10px;

}



.contact-card a,

.contact-card p {

    margin: 0;

    font-size: 1.05rem;

    color: var(--text);

    text-decoration: none;

}



.contact-card a:hover {

    color: var(--accent);

}



.opening-hours {

    margin-top: 10px;

    padding: 30px 28px;

    border-radius: 24px;

    background: rgba(255, 255, 255, 0.025);

    border: 1px solid rgba(255, 255, 255, 0.07);

}



.opening-hours h3 {

    margin-bottom: 20px;

    font-size: 1.4rem;

}



.opening-hours-list {

    display: grid;

    gap: 0;

    margin-top: 10px;

}



.opening-row {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 16px;

    padding: 18px 0;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);

}



.opening-row:first-child {

    padding-top: 10px;

}



.opening-row:last-child {

    border-bottom: none;

    padding-bottom: 0;

}



.opening-row span:first-child {

    color: var(--text);

    font-weight: 500;

}



.opening-row span:last-child {

    color: var(--text);

    font-weight: 600;

    white-space: nowrap;

}



.form-row {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 18px;

}



.form-group {

    display: flex;

    flex-direction: column;

    margin-bottom: 18px;

}



.form-group label {

    margin-bottom: 10px;

    font-size: 0.95rem;

    color: var(--text);

}



.form-group input,

.form-group textarea {

    width: 100%;

    padding: 15px 16px;

    border-radius: 16px;

    border: 1px solid rgba(255, 255, 255, 0.1);

    background: rgba(255, 255, 255, 0.035);

    color: var(--text);

    font-family: inherit;

    font-size: 0.98rem;

    outline: none;

    transition: border-color 0.25s ease, background 0.25s ease;

}



.form-group input::placeholder,

.form-group textarea::placeholder {

    color: rgba(255, 255, 255, 0.42);

}



.form-group input:focus,

.form-group textarea:focus {

    border-color: rgba(214, 195, 161, 0.45);

    background: rgba(255, 255, 255, 0.05);

}



.form-group textarea {

    resize: vertical;

    min-height: 150px;

}



.form-submit {

    margin-top: 10px;

}



.contact-map-section {

    padding: 0 0 110px;

}



.contact-section {

    padding: 110px 0;

}



.contact-page-intro {

    max-width: 760px;

    margin: 0 auto 52px;

    text-align: center;

}



.contact-page-intro h2 {

    font-size: clamp(2rem, 4vw, 3.15rem);

    line-height: 1.08;

    letter-spacing: -0.02em;

    margin-bottom: 16px;

}



.contact-page-intro .muted {

    line-height: 1.8;

}



.contact-main-cards {

    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 22px;

    margin-bottom: 34px;

}



.contact-main-card,

.contact-detail-card {

    border-radius: 26px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.018));

    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.18);

}



.contact-main-card {

    padding: 30px 28px;

    transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;

}



.contact-main-card:hover {

    transform: translateY(-3px);

    border-color: rgba(214, 195, 161, 0.22);

    background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.022));

    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.24);

}



.contact-main-card a {

    display: inline-block;

    margin-bottom: 12px;

    font-size: 1.02rem;

    font-weight: 600;

    color: var(--text);

    text-decoration: none;

    line-height: 1.35;

    transition: color 0.2s ease;

}



.contact-main-card a:hover {

    color: var(--accent);

}



.contact-main-value {

    margin: 0;

    font-size: 1.02rem;

    font-weight: 600;

    color: var(--text);

    line-height: 1.45;

}



.contact-main-value+.contact-main-value {

    margin-top: 2px;

}



.contact-main-card .muted {

    margin-top: 2px;

    line-height: 1.65;

}



.contact-detail-grid {

    display: grid;

    grid-template-columns: 0.95fr 1.05fr;

    gap: 22px;

    align-items: start;

}



.contact-detail-card {

    padding: 38px 34px;

}



.contact-detail-card h2 {

    font-size: clamp(1.9rem, 2.8vw, 2.75rem);

    line-height: 1.05;

    letter-spacing: -0.03em;

    margin-bottom: 18px;

}



.contact-reservation-card {

    display: flex;

    flex-direction: column;

    gap: 24px;

    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));

}



.contact-reservation-content {

    max-width: 58ch;

}



.contact-cta-text {

    line-height: 1.8;

    max-width: 58ch;

}



.contact-action-buttons {

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 4px;

}



.contact-action-buttons .btn {

    min-height: 52px;

    padding: 0 22px;

    font-size: 0.92rem;

    letter-spacing: 0.05em;

    white-space: nowrap;

}



/* =========================================================

   MENU STRÁNKY

========================================================= */



.menu-page-intro {

    padding: 110px 0 40px;

}



.menu-page-tabs {

    display: flex;

    justify-content: center;

    gap: 14px;

    flex-wrap: wrap;

    margin-top: 36px;

}



.menu-tab {

    padding: 14px 22px;

    border-radius: 999px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    background: rgba(255, 255, 255, 0.03);

    color: var(--text);

    text-decoration: none;

    transition: all 0.25s ease;

}



.menu-tab:hover {

    border-color: rgba(214, 195, 161, 0.3);

    color: var(--accent);

    transform: translateY(-2px);

}



.menu-tab.active {

    background: rgba(214, 195, 161, 0.12);

    border-color: rgba(214, 195, 161, 0.3);

    color: var(--accent);

}



.menu-list-section {

    padding: 20px 0 110px;

}



.menu-category-block {

    margin-bottom: 88px;

}



.menu-category-block:last-child {

    margin-bottom: 0;

}



.menu-category-header {

    margin-bottom: 30px;

}



.menu-category-header h2 {

    font-size: clamp(2rem, 4vw, 3rem);

    line-height: 1.08;

}



.menu-items-grid {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 22px;

}



.menu-item-card {

    padding: 28px 26px;

    border-radius: 24px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

    transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;

}



.menu-item-card:hover {

    transform: translateY(-4px);

    border-color: rgba(214, 195, 161, 0.26);

    background: rgba(255, 255, 255, 0.045);

}



.menu-item-top {

    display: flex;

    justify-content: space-between;

    gap: 16px;

    align-items: flex-start;

    margin-bottom: 10px;

}



.menu-item-top h3 {

    margin: 0;

    font-size: 1.3rem;

    line-height: 1.2;

}



.menu-item-price {

    white-space: nowrap;

    color: var(--accent);

    font-weight: 600;

    font-size: 1rem;

}



.menu-item-card p {

    margin: 0;

}



.menu-item-card .muted {

    font-style: normal;

}



.menu-item-card .menu-item-note {

    font-style: italic;

    color: #a8a8a8;

}



.menu-item-allergens {

    margin-top: 6px;

    font-size: 0.75rem;

    color: #9a9a9a;

    line-height: 1.4;

}



.menu-note {

    margin-top: 24px;

    padding: 14px 18px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    border-radius: 14px;

    background: rgba(255, 255, 255, 0.03);

    text-align: center;

}



.menu-note p {

    margin: 0;

    font-size: 0.95rem;

    color: #cfcfcf;

    line-height: 1.6;

}



/* =========================================================

   ADMIN / LOGIN / POLEDNÍ MENU

========================================================= */



.btn-login {

    padding-inline: 20px;

}



.lunch-menu-time {

    margin-top: 10px;

}



.lunch-menu-card {

    padding: 32px 30px;

    border-radius: 28px;

    background: rgba(255, 255, 255, 0.035);

    border: 1px solid rgba(255, 255, 255, 0.08);

    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.22);

}



.lunch-menu-row+.lunch-menu-row {

    margin-top: 28px;

    padding-top: 28px;

    border-top: 1px solid rgba(255, 255, 255, 0.08);

}



.lunch-menu-label {

    display: inline-block;

    margin-bottom: 10px;

    font-size: 0.82rem;

    letter-spacing: 0.12em;

    text-transform: uppercase;

    color: var(--accent);

}



.lunch-menu-row h3 {

    margin: 0 0 10px;

    font-size: 1.6rem;

}



.lunch-menu-price {

    font-size: 1.2rem;

}



.lunch-menu-row:last-child {

    display: flex;

    justify-content: space-between;

    gap: 20px;

    align-items: flex-start;

}



.lunch-menu-items {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 22px;

}



.lunch-menu-item-card {

    padding: 28px 26px;

    border-radius: 24px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.lunch-menu-item-card .menu-item-top {

    margin-bottom: 8px;

}



.lunch-menu-description {

    margin-top: 6px;

}



.login-page,

.admin-page {

    min-height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    background: linear-gradient(to bottom, rgba(8, 8, 10, 0.9), rgba(8, 8, 10, 0.96)), #0b0b0d;

    padding: 24px;

}



.login-wrapper,

.admin-wrapper {

    width: 100%;

    max-width: 720px;

}



.login-wrapper {

    max-width: 640px;

}



.login-card,

.admin-card {

    padding: 40px 34px;

    border-radius: 28px;

    background: rgba(255, 255, 255, 0.035);

    border: 1px solid rgba(255, 255, 255, 0.08);

    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.24);

}



.login-card {

    padding: 34px 30px;

}



.login-card h1 {

    font-size: clamp(2.2rem, 4vw, 3rem);

    line-height: 1.02;

    margin-bottom: 10px;

}



.login-card .muted {

    margin-bottom: 24px;

    line-height: 1.7;

}



.login-card .form-group {

    margin-bottom: 18px;

}



.login-card .form-group label {

    margin-bottom: 8px;

    font-size: 0.95rem;

    font-weight: 600;

    color: var(--text);

}



.login-card .form-group input {

    min-height: 52px;

    padding: 0 16px;

    border-radius: 18px;

    border: 1px solid rgba(255, 255, 255, 0.1);

    background: rgba(255, 255, 255, 0.03);

    color: var(--text);

    transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;

}



.login-card .form-group input:focus {

    border-color: rgba(214, 195, 161, 0.4);

    background: rgba(255, 255, 255, 0.045);

    box-shadow: 0 0 0 4px rgba(214, 195, 161, 0.05);

    outline: none;

}



.login-card .btn {

    min-height: 50px;

    width: 100%;

}



.admin-wrapper {

    max-width: 1080px;

}



.admin-wrapper-wide {

    max-width: 1320px;

}



.admin-card-wide {

    width: 100%;

    max-width: 1280px;

}



.admin-topbar {

    display: flex;

    justify-content: space-between;

    align-items: flex-start;

    gap: 32px;

    flex-wrap: wrap;

    margin-bottom: 28px;

}



.admin-topbar>div:first-child {

    flex: 1 1 360px;

    min-width: 280px;

}



.admin-topbar-actions {

    display: flex;

    flex-wrap: wrap;

    justify-content: flex-end;

    gap: 12px;

    flex: 0 1 auto;

}



.admin-topbar-actions .btn {

    white-space: nowrap;

}



.admin-topbar-stack {

    display: flex;

    justify-content: space-between;

    align-items: flex-start;

    gap: 20px;

    flex-wrap: wrap;

}



.form-message {

    margin-bottom: 18px;

    padding: 14px 16px;

    border-radius: 14px;

    font-size: 0.95rem;

}



.success-message {

    background: rgba(60, 160, 90, 0.14);

    border: 1px solid rgba(60, 160, 90, 0.26);

    color: #d8ffe3;

}



.error-message {

    background: rgba(180, 70, 70, 0.14);

    border: 1px solid rgba(180, 70, 70, 0.26);

    color: #ffd7d7;

}



.full-width {

    width: 100%;

}



.login-actions {

    margin-top: 12px;

}



.checkbox-group {

    margin-bottom: 24px;

}



.checkbox-label {

    display: inline-flex;

    align-items: center;

    gap: 12px;

    cursor: pointer;

    font-size: 1rem;

    color: var(--text);

}



.checkbox-label input[type="checkbox"] {

    width: 18px;

    height: 18px;

    accent-color: #a52a1d;

    cursor: pointer;

}



.menu-item-admin-block {

    padding: 24px;

    border-radius: 20px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

    margin-bottom: 20px;

    transition: opacity 0.25s ease;

}



.menu-item-admin-head {

    display: flex;

    justify-content: space-between;

    gap: 16px;

    align-items: center;

    margin-bottom: 14px;

}



.menu-item-admin-head h3 {

    margin: 0;

}



.admin-actions {

    display: flex;

    gap: 14px;

    flex-wrap: wrap;

    margin-top: 8px;

}



.disabled-block {

    opacity: 0.45;

}



.disabled-button {

    opacity: 0.5;

    pointer-events: none;

}



/* =========================================================

   REZERVACE

========================================================= */



.reservation-section {

    padding: 120px 0;

    background: #131315;

}



.reservation-intro {

    text-align: center;

    max-width: 860px;

    margin: 0 auto 64px;

}



.reservation-intro h2 {

    font-size: clamp(2.2rem, 4vw, 3.4rem);

    line-height: 1.08;

    margin-bottom: 20px;

}



.reservation-intro .section-label {

    margin-bottom: 14px;

}



.reservation-intro-text {

    max-width: 64ch;

    margin: 0 auto;

    line-height: 1.8;

}



.reservation-message {

    max-width: 1100px;

    margin: 0 auto 32px;

}



.reservation-layout {

    display: grid;

    grid-template-columns: 0.95fr 1.25fr;

    gap: 42px;

    align-items: start;

}



.reservation-info-card,

.reservation-form-wrap {

    padding: 38px 36px;

    border-radius: 28px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.22);

}



.reservation-info-card {

    position: sticky;

    top: 120px;

}



.reservation-info-card h3 {

    font-size: 1.75rem;

    margin-bottom: 28px;

    line-height: 1.2;

}



.reservation-info-list {

    display: grid;

    gap: 24px;

}



.reservation-info-item {

    padding-bottom: 22px;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08);

}



.reservation-info-item:last-child {

    padding-bottom: 0;

    border-bottom: none;

}



.reservation-info-label {

    display: inline-block;

    margin-bottom: 10px;

    font-size: 0.78rem;

    letter-spacing: 0.18em;

    text-transform: uppercase;

    color: #d4af37;

    font-weight: 600;

}



.reservation-info-item .muted {

    line-height: 1.75;

    margin: 0;

}



.reservation-form-wrap .contact-form {

    margin-top: 0;

}



.reservation-form {

    display: grid;

    gap: 26px;

}



.reservation-form .form-row {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 18px;

}



.reservation-form .form-group {

    display: flex;

    flex-direction: column;

    gap: 10px;

}



.reservation-form .form-group label {

    font-weight: 600;

    line-height: 1.4;

}



.reservation-form .form-group input,

.reservation-form .form-group textarea,

.reservation-form .form-group select {

    border-radius: 18px;

    min-height: 58px;

    padding: 0 18px;

}



.reservation-form .form-group textarea {

    min-height: 170px;

    padding: 18px;

    resize: vertical;

}



.reservation-disclaimer {

    margin-top: 4px;

    padding: 16px 18px;

    border-radius: 16px;

    background: rgba(255, 255, 255, 0.025);

    border: 1px solid rgba(255, 255, 255, 0.06);

}



.reservation-disclaimer p {

    margin: 0;

    font-size: 0.92rem;

    color: #cfcfcf;

    line-height: 1.7;

}



.form-submit .btn {

    min-width: 220px;

}



/* =========================================================

   ADMIN REZERVACÍ

========================================================= */



.admin-reservation-section+.admin-reservation-section {

    margin-top: 56px;

    padding-top: 40px;

    border-top: 1px solid rgba(255, 255, 255, 0.08);

}



.admin-section-heading {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 18px;

    margin-bottom: 24px;

}



.admin-section-heading h2 {

    margin: 6px 0 0;

}



.admin-count-badge {

    min-width: 44px;

    height: 44px;

    padding: 0 14px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 999px;

    background: rgba(212, 175, 55, 0.12);

    border: 1px solid rgba(212, 175, 55, 0.3);

    color: #d4af37;

    font-weight: 700;

}



.admin-empty-state {

    padding: 24px;

    border-radius: 20px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.admin-empty-state p {

    margin: 0;

    color: #cfcfcf;

}



.admin-reservations-grid {

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 22px;

}



.admin-reservation-card {

    padding: 28px;

    border-radius: 24px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.admin-reservation-card.pending {

    border-color: rgba(212, 175, 55, 0.22);

}



.admin-reservation-card.confirmed {

    border-color: rgba(120, 200, 140, 0.22);

}



.admin-reservation-card.rejected,

.admin-reservation-card.cancelled {

    border-color: rgba(180, 70, 70, 0.22);

}



.admin-reservation-head {

    display: flex;

    justify-content: space-between;

    align-items: flex-start;

    gap: 18px;

    margin-bottom: 20px;

}



.admin-reservation-head h3 {

    margin: 10px 0 0;

    line-height: 1.2;

}



.admin-reservation-status {

    display: inline-flex;

    align-items: center;

    border-radius: 999px;

    padding: 7px 12px;

    font-size: 0.75rem;

    letter-spacing: 0.08em;

    text-transform: uppercase;

    font-weight: 700;

}



.admin-reservation-status.pending {

    background: rgba(212, 175, 55, 0.14);

    color: #d4af37;

}



.admin-reservation-status.confirmed {

    background: rgba(120, 200, 140, 0.14);

    color: #90d19f;

}



.admin-reservation-status.rejected,

.admin-reservation-status.cancelled {

    background: rgba(180, 70, 70, 0.14);

    color: #ffb1b1;

}



.admin-reservation-meta {

    display: flex;

    flex-direction: column;

    align-items: flex-end;

    gap: 6px;

    color: #d6d6d6;

    font-weight: 600;

    text-align: right;

}



.admin-reservation-details {

    display: grid;

    gap: 10px;

    margin-bottom: 18px;

}



.admin-reservation-details p {

    margin: 0;

    color: #d2d2d2;

    line-height: 1.6;

}



.admin-reservation-note {

    margin-bottom: 22px;

    padding: 16px 18px;

    border-radius: 16px;

    background: rgba(255, 255, 255, 0.025);

    border: 1px solid rgba(255, 255, 255, 0.06);

}



.admin-reservation-note strong {

    display: inline-block;

    margin-bottom: 10px;

}



.admin-reservation-note p {

    margin: 0;

    color: #d2d2d2;

    line-height: 1.7;

}



.admin-reservation-reason {

    border-color: rgba(212, 175, 55, 0.16);

}



.admin-reservation-actions {

    display: flex;

    gap: 12px;

    flex-wrap: wrap;

}



.admin-reservation-actions form {

    margin: 0;

}



.admin-reservation-section {

    margin-top: 8px;

}



.admin-tabs {

    display: flex;

    gap: 14px;

    flex-wrap: wrap;

    margin-bottom: 34px;

}



.admin-tab {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding: 14px 18px;

    border-radius: 999px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    background: rgba(255, 255, 255, 0.03);

    color: var(--text);

    text-decoration: none;

    transition: all 0.25s ease;

}



.admin-tab:hover {

    border-color: rgba(214, 195, 161, 0.28);

    color: var(--accent);

    transform: translateY(-2px);

}



.admin-tab.active {

    background: rgba(214, 195, 161, 0.12);

    border-color: rgba(214, 195, 161, 0.28);

    color: var(--accent);

}



.admin-tab-count {

    min-width: 26px;

    height: 26px;

    padding: 0 8px;

    border-radius: 999px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    background: rgba(255, 255, 255, 0.08);

    font-size: 0.82rem;

    font-weight: 700;

}



/* =========================================================

   ADMIN MODAL

========================================================= */



body.modal-open {

    overflow: hidden;

}



.admin-modal {

    position: fixed;

    inset: 0;

    display: none;

    z-index: 9999;

    overflow-y: auto;

    padding: 24px;

}



.admin-modal.is-open {

    display: block;

}



.admin-modal-backdrop {

    position: fixed;

    inset: 0;

    background: rgba(6, 6, 8, 0.72);

    backdrop-filter: blur(6px);

}



.admin-modal-dialog {

    position: relative;

    z-index: 2;

    width: min(92vw, 620px);

    max-height: calc(100vh - 48px);

    margin: 0 auto;

    padding: 34px 30px;

    border-radius: 28px;

    background: #141417;

    border: 1px solid rgba(255, 255, 255, 0.08);

    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);

    overflow-y: auto;

}



.admin-modal-close {

    position: absolute;

    top: 14px;

    right: 14px;

    width: 42px;

    height: 42px;

    border: none;

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.06);

    color: var(--text);

    font-size: 1.4rem;

    cursor: pointer;

    transition: background 0.25s ease, transform 0.25s ease;

}



.admin-modal-close:hover {

    background: rgba(255, 255, 255, 0.12);

    transform: rotate(90deg);

}



.admin-modal-content {

    display: flex;

    flex-direction: column;

    gap: 18px;

}



.admin-modal-content h2 {

    margin: 8px 0 12px;

    line-height: 1.15;

}



.admin-modal-content .muted {

    line-height: 1.7;

}



.admin-modal-form {

    margin-top: 10px;

}



.admin-modal-form select {

    width: 100%;

    padding: 15px 16px;

    border-radius: 16px;

    border: 1px solid rgba(255, 255, 255, 0.1);

    background: rgba(255, 255, 255, 0.035);

    color: var(--text);

    font-family: inherit;

    font-size: 0.98rem;

    outline: none;

    transition: border-color 0.25s ease, background 0.25s ease;

}



.admin-modal-form select:focus {

    border-color: rgba(214, 195, 161, 0.45);

    background: rgba(255, 255, 255, 0.05);

}



.modal-reason-group,

.modal-custom-reason-group {

    display: none;

}



.admin-modal-actions {

    display: flex;

    gap: 12px;

    justify-content: flex-end;

    flex-wrap: wrap;

    margin-top: 20px;

    padding: 16px 0 4px;

}



.modal-reason-options {

    display: grid;

    gap: 12px;

    margin-top: 8px;

}



.modal-reason-option {

    display: grid;

    grid-template-columns: 20px 1fr;

    align-items: start;

    column-gap: 14px;

    width: 100%;

    padding: 14px 16px;

    border-radius: 16px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    background: rgba(255, 255, 255, 0.03);

    cursor: pointer;

    transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease;

    box-sizing: border-box;

}



.modal-reason-option:hover {

    border-color: rgba(212, 175, 55, 0.28);

    background: rgba(255, 255, 255, 0.05);

    transform: translateY(-1px);

}



.modal-reason-option input[type="radio"] {

    margin: 4px 0 0 0;

    accent-color: #d4af37;

    width: 16px;

    height: 16px;

    flex-shrink: 0;

}



.modal-reason-option span {

    display: block;

    width: 100%;

    line-height: 1.6;

    color: #dddddd;

    word-break: break-word;

}



.modal-custom-reason-group {

    margin-top: 4px;

}



/* =========================================================

   RESPONSIVE – OBSAH STRÁNEK

========================================================= */



@media (max-width: 1280px) {

    .gallery-grid {

        grid-template-columns: repeat(2, 1fr);

    }



    .gallery-item-large,

    .gallery-item-wide {

        grid-column: span 2;

    }



    .gallery-item-large {

        min-height: 460px;

    }



    .reservation-layout {

        grid-template-columns: 1fr;

        gap: 28px;

    }



    .reservation-info-card {

        position: static;

    }

}



@media (max-width: 980px) {

    .story-grid,

    .experience-grid,

    .values-grid {

        grid-template-columns: 1fr;

    }



    .story-image img,

    .experience-image img {

        height: 420px;

    }



    .story-section,

    .values-section,

    .experience-section,

    .about-cta-section {

        padding: 80px 0;

    }



    .contact-section {

        padding: 80px 0;

    }



    .contact-map-section {

        padding: 0 0 80px;

    }



    .contact-main-cards {

        grid-template-columns: 1fr;

    }



    .contact-detail-grid {

        grid-template-columns: 1fr;

    }



    .contact-detail-card {

        padding: 32px 26px;

    }



    .admin-reservations-grid {

        grid-template-columns: 1fr;

    }



    .admin-reservation-head {

        flex-direction: column;

        align-items: flex-start;

    }



    .admin-reservation-meta {

        align-items: flex-start;

        text-align: left;

    }



    .reservation-section {

        padding: 90px 0;

    }



    .reservation-intro {

        margin-bottom: 46px;

    }

}



@media (max-width: 900px) {

    .intro-grid,

    .about-grid,

    .features-grid,

    .menu-preview-grid {

        grid-template-columns: 1fr;

    }



    .hero-center h1 {

        font-size: clamp(3rem, 12vw, 5rem);

        white-space: normal;

    }



    .about-image img {

        height: 420px;

    }



    .menu-page-intro {

        padding: 80px 0 28px;

    }



    .menu-list-section {

        padding: 16px 0 80px;

    }



    .menu-items-grid {

        grid-template-columns: 1fr;

    }



    .menu-category-block {

        margin-bottom: 68px;

    }



    .lunch-menu-row:last-child,

    .admin-topbar {

        flex-direction: column;

    }



    .admin-topbar-actions {

        justify-content: flex-start;

    }



    .lunch-menu-items {

        grid-template-columns: 1fr;

    }



    .menu-item-admin-head {

        flex-direction: column;

        align-items: flex-start;

    }



    .brand-top {

        font-size: 0.76rem;

        letter-spacing: 0.16em;

    }



    .brand-bottom {

        font-size: 2rem;

    }



    .hero-logo-top {

        font-size: 0.9rem;

        letter-spacing: 0.22em;

        margin-bottom: 8px;

    }



    .hero-logo-bottom {

        font-size: clamp(4rem, 18vw, 6.2rem);

    }

}



@media (max-width: 700px) {

    .gallery-intro {

        padding: 80px 0 24px;

    }



    .gallery-section {

        padding: 24px 0 80px;

    }



    .gallery-grid {

        grid-template-columns: 1fr;

        gap: 18px;

    }



    .gallery-item,

    .gallery-item-large,

    .gallery-item-wide {

        grid-column: span 1;

        grid-row: span 1;

        min-height: 260px;

        border-radius: 18px;

    }



    .gallery-cta-section {

        padding: 0 0 80px;

    }



    .gallery-cta-box {

        padding: 38px 22px;

        border-radius: 22px;

    }



    .lightbox-close {

        top: 16px;

        right: 16px;

        width: 46px;

        height: 46px;

    }

}



@media (max-width: 640px) {

    .page-hero-content {

        padding: 120px 16px 80px;

    }



    .story-image img,

    .experience-image img {

        height: 320px;

        border-radius: 20px;

    }



    .about-cta-box {

        padding: 38px 22px;

        border-radius: 22px;

    }



    .contact-form-wrap,

    .opening-hours,

    .contact-card {

        border-radius: 20px;

    }



    .contact-form-wrap {

        padding: 26px 20px;

    }



    .opening-hours {

        padding: 24px 20px;

    }



    .contact-card {

        padding: 22px 20px;

    }



    .opening-row {

        flex-direction: column;

        align-items: flex-start;

        gap: 6px;

    }



    .contact-section {

        padding: 84px 0;

    }



    .contact-page-intro {

        margin-bottom: 38px;

    }



    .contact-main-card,

    .contact-detail-card {

        border-radius: 20px;

        padding: 24px 20px;

    }



    .contact-detail-card h2 {

        font-size: clamp(1.8rem, 7vw, 2.3rem);

    }



    .contact-action-buttons .btn {

        width: 100%;

    }



    .menu-tab {

        width: 100%;

        text-align: center;

    }



    .menu-item-card {

        padding: 22px 20px;

        border-radius: 20px;

    }



    .menu-item-top {

        flex-direction: column;

        gap: 6px;

    }



    .login-card,

    .admin-card,

    .lunch-menu-card {

        padding: 26px 20px;

        border-radius: 22px;

    }



    .login-wrapper {

        max-width: 100%;

    }



    .login-card h1 {

        font-size: clamp(2rem, 8vw, 2.5rem);

    }



    .reservation-info-card,

    .reservation-form-wrap {

        padding: 26px 20px;

        border-radius: 22px;

    }



    .reservation-form .form-row {

        grid-template-columns: 1fr;

        gap: 20px;

    }



    .reservation-form {

        gap: 22px;

    }



    .admin-modal {

        padding: 14px;

    }



    .admin-modal-dialog {

        width: 100%;

        max-height: calc(100vh - 28px);

        padding: 26px 20px;

        border-radius: 22px;

        margin-top: 0;

    }



    .admin-modal-actions {

        flex-direction: column;

    }



    .admin-modal-actions .btn {

        width: 100%;

    }



    .tour-modal {

        padding: 12px;

    }



    .tour-modal-dialog {

        height: calc(100vh - 24px);

        border-radius: 18px;

    }



    .tour-modal-close {

        width: 42px;

        height: 42px;

    }

}



/* =========================================================

   NAVBAR – RESPONSIVE (jediná definice)

========================================================= */



@media (max-width: 1280px) {

    .nav {

        flex-wrap: wrap;

        align-items: center;

        gap: 12px;

        padding: 14px 0;

        min-height: auto;

    }



    .brand-logo {

        flex: 0 0 auto;

        order: 1;

    }



    .nav-actions {

        flex: 0 0 auto;

        order: 2;

        margin-left: auto;

        display: flex;

        flex-direction: row;

        flex-wrap: nowrap;

        gap: 10px;

    }



    .nav-links {

        flex: 1 1 100%;

        order: 3;

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

        gap: 12px 20px;

    }



    .brand-top {

        font-size: 1.25rem;

        letter-spacing: 0.22em;

    }



    .brand-bottom {

        font-size: 3.4rem;

        margin-top: 2px;

    }



    .nav-actions .btn {

        min-height: 60px;

        padding: 0 28px;

        font-size: 1.1rem;

        letter-spacing: 0.08em;

    }

    .nav-links a,

    .nav-dropdown-link {

        font-size: 1.25rem;

        white-space: nowrap;

    }

}

@media (max-width: 700px) {

    .brand-top {

        font-size: 0.85rem;

        letter-spacing: 0.18em;

    }



    .brand-bottom {

        font-size: 2.2rem;

    }



    .nav-actions .btn {

        min-height: 42px;

        padding: 0 16px;

        font-size: 0.78rem;

        letter-spacing: 0.06em;

    }



    .nav-links a,

    .nav-dropdown-link {

        font-size: 0.95rem;

    }



    .nav-links {

        gap: 12px 18px;

    }

}

@media (max-width: 500px) {

    .brand-top {

        font-size: 0.55rem;

        letter-spacing: 0.1em;

    }



    .brand-bottom {

        font-size: 1.3rem;

    }



    .nav-actions .btn {

        min-height: 36px;

        padding: 0 11px;

        font-size: 0.68rem;

        letter-spacing: 0.04em;

    }



    .nav-actions {

        gap: 6px;

    }



    .nav {

        gap: 8px;

        padding: 12px 0;

    }



    .nav-links {

        gap: 8px 12px;

    }



    .nav-links a,

    .nav-dropdown-link {

        font-size: 0.78rem;

    }

}

@media (max-width: 380px) {

    .brand-top {

        font-size: 0.48rem;

        letter-spacing: 0.08em;

    }



    .brand-bottom {

        font-size: 1.15rem;

    }



    .nav-actions .btn {

        min-height: 32px;

        padding: 0 8px;

        font-size: 0.6rem;

    }



    .nav-actions {

        gap: 4px;

    }



    .nav-links {

        gap: 6px 10px;

    }



    .nav-links a,

    .nav-dropdown-link {

        font-size: 0.7rem;

    }

}

@media (max-width: 900px) {

    .hero-fullscreen {

        min-height: 0 !important;

        height: auto !important;

        padding: 80px 0 0 !important;

        margin: 0 !important;

        background: #0f0f10 !important;

        display: block !important;

        font-size: 0 !important;

        line-height: 0 !important;

    }



    .hero-fullscreen .hero-inner,

    .hero-inner {

        min-height: 0 !important;

        height: auto !important;

        padding: 0 !important;

        margin: 0 !important;

        display: block !important;

    }



    .hero-fullscreen .hero-video,

    .hero-video {

        position: relative !important;

        width: 100% !important;

        height: auto !important;

        max-height: 50vh !important;

        object-fit: cover !important;

        display: block !important;

        margin: 0 !important;

        margin-bottom: 0 !important;

        vertical-align: top !important;

    }





    .hero-fullscreen .hero-overlay,

    .hero-overlay {

        display: none !important;

    }



    .scroll-down {

        display: none !important;

    }



    .intro-section {

        margin-top: 0 !important;

        padding: 0px 0 60px !important;

    }

}

.confirmed-filter {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 12px;

    margin-bottom: 28px;

    padding: 18px 20px;

    border-radius: 18px;

    background: rgba(255, 255, 255, 0.03);

    border: 1px solid rgba(255, 255, 255, 0.08);

}



.confirmed-filter .btn {

    min-height: 42px;

    padding: 0 18px;

    font-size: 0.85rem;

}



.confirmed-filter-date-form {

    position: relative;

    display: inline-flex;

    align-items: center;

    margin: 0;

}



.confirmed-filter-date-form::before {

    content: "📅";

    position: absolute;

    left: 12px;

    top: 50%;

    transform: translateY(-50%);

    font-size: 1.1rem;

    pointer-events: none;

    z-index: 1;

}



.confirmed-filter-date-input {

    min-height: 44px;

    padding: 0 14px 0 42px;

    border-radius: 12px;

    border: 1px solid rgba(255, 255, 255, 0.1);

    background: rgba(255, 255, 255, 0.04);

    color: var(--text);

    font-family: inherit;

    font-size: 0.9rem;

    cursor: pointer;

    color-scheme: dark;

    transition: border-color 0.25s ease, background 0.25s ease;

}



.confirmed-filter-date-input:hover,

.confirmed-filter-date-input:focus {

    border-color: rgba(214, 195, 161, 0.4);

    background: rgba(255, 255, 255, 0.06);

    outline: none;

}



.confirmed-filter-label {

    color: var(--accent);

    font-size: 0.9rem;

    letter-spacing: 0.04em;

}



@media (max-width: 640px) {

    .confirmed-filter {

        flex-direction: column;

        align-items: stretch;

        padding: 14px;

        gap: 10px;

    }



    .confirmed-filter-buttons .btn {

        flex: 1;

        min-height: 44px;

}