/* ==========================================================================
   Svetluška v piáne – spoločný štýl pre všetky stránky
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. Písma a premenné
   -------------------------------------------------------------------------- */

/* Písma sú priamo na webe (žiadne Google Fonts), iba znaky pre slovenčinu a strednú Európu.
   Vivaldi = písmo loga (nadpisy), Montserrat = variabilné písmo textu (hrúbky 300 – 700). */
@font-face {
    font-family: "Vivaldi Web";
    src: local("Vivaldi"), url("../fonts/vivaldi.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Montserrat";
    src: url("../fonts/montserrat-latin.woff2") format("woff2");
    font-weight: 300 700;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Montserrat";
    src: url("../fonts/montserrat-latin-ext.woff2") format("woff2");
    font-weight: 300 700;
    font-display: swap;
    unicode-range: U+0100-017F, U+0218-021B;
}

:root {
    --gold: #C9A55C;
    --gold-light: #D9BC80;
    --gold-text: #8A6A2A;
    --dark: #1E1619;
    --chalk: #2C2C2A;
    --text: #2B2A28;
    --muted: #55534E;
    --muted-light: #6B6862;
    --line: #E2DED6;
    --linen: #EEECE7;
    --yellow: #EED582;
    --white: #FFFFFF;

    --font-script: "Vivaldi Web", "Vivaldi", cursive;
    --font-sans: "Montserrat", system-ui, sans-serif;

    --shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
    --shadow-strong: 0 30px 70px rgba(0, 0, 0, 0.4);
}


/* --------------------------------------------------------------------------
   2. Základ
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

body {
    margin: 0;
    font-family: var(--font-sans);
    font-size: 16px;
    line-height: 1.6;
    color: var(--text);
    /* plátenná textúra ako na súčasnom webe */
    background-color: var(--linen);
    background-image:
        repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.018) 0 1px, transparent 1px 3px),
        repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.018) 0 1px, transparent 1px 3px);
}

h1,
h2,
h3,
p {
    margin: 0;
}

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

a {
    color: var(--text);
}

a:hover {
    color: var(--gold-text);
}

.container {
    max-width: 1240px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

.container--narrow {
    max-width: 1000px;
}


/* --------------------------------------------------------------------------
   3. Typografia a ozdoby
   -------------------------------------------------------------------------- */

.script {
    font-family: var(--font-script);
    font-weight: 400;
    line-height: 1.05;
}

.eyebrow {
    font-size: 13px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold);
}

.eyebrow--dark {
    color: var(--gold-text);
}

.text-muted {
    color: var(--muted);
}

.small-note {
    font-size: 13px;
    color: var(--muted-light);
}

.text-center {
    text-align: center;
}

/* zlatý kosoštvorec */
.diamond {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: var(--gold);
    transform: rotate(45deg);
}

/* linka – kosoštvorec – linka */
.ornament {
    display: flex;
    align-items: center;
    gap: 14px;
}

.ornament::before,
.ornament::after {
    content: "";
    width: 80px;
    height: 1px;
    background: var(--gold);
}

/* krátka zlatá linka pod nadpisom */
.rule {
    display: block;
    width: 40px;
    height: 1px;
    background: var(--gold);
}

.section-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 32px;
    text-align: center;
}

.section-title h2 {
    font-size: 60px;
}


/* --------------------------------------------------------------------------
   4. Tlačidlá
   -------------------------------------------------------------------------- */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 28px;
    border: 1px solid transparent;
    border-radius: 999px;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
}

.btn--gold {
    background: var(--gold);
    color: var(--dark);
}

.btn--gold:hover {
    background: var(--gold-light);
    color: var(--dark);
}

.btn--dark {
    background: var(--dark);
    color: var(--gold);
}

.btn--dark:hover {
    color: var(--gold-light);
}

.btn--outline {
    border-color: var(--dark);
    background: transparent;
    color: var(--dark);
}

.btn--block {
    width: 100%;
}

.btn-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

/* okrúhle tlačidlo so šípkou */
.round-btn {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border: 1px solid var(--gold);
    border-radius: 50%;
    background: transparent;
    color: var(--gold);
    cursor: pointer;
}

.round-btn--filled {
    background: var(--gold);
    color: var(--dark);
}


/* --------------------------------------------------------------------------
   5. Hlavička, navigácia, úvod
   -------------------------------------------------------------------------- */

.site-header {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 440px;
    overflow: hidden;
    background: var(--dark);
    color: var(--white);
}

.site-header--home {
    min-height: 820px;
}

.site-header__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 75%;
    opacity: 0.55;
}

.site-header--home .site-header__bg {
    opacity: 0.7;
}

/* stmavenie fotky do strán */
.site-header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: radial-gradient(ellipse at 50% 45%, rgba(30, 22, 25, 0.35) 0%, rgba(30, 22, 25, 0.92) 80%);
}

.header-bar {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 32px;
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
}

.site-header--home .header-bar {
    justify-content: center;
    padding-top: 28px;
}

.header-bar__logo img {
    width: 110px;
    height: 110px;
}

.site-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 28px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.site-nav a {
    padding: 8px 4px;
    border-bottom: 1px solid transparent;
    color: var(--white);
    text-decoration: none;
}

.site-nav a:hover {
    color: var(--gold);
}

.site-nav a.is-active {
    border-bottom-color: var(--gold);
    color: var(--gold);
}

.hero {
    position: relative;
    z-index: 2;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 24px 140px;
    text-align: center;
}

.site-header--home .hero {
    padding-bottom: 260px;
}

.hero__logo {
    width: 260px;
    height: 260px;
    filter: drop-shadow(0 8px 30px rgba(0, 0, 0, 0.5));
}

.hero__title {
    font-size: clamp(60px, 7vw, 96px);
    line-height: 1.1;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.5);
}

.hero__claim {
    font-size: clamp(44px, 5vw, 72px);
    line-height: 1.15;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.5);
}

.hero__meta {
    font-size: 13px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
}

/* obsah, ktorý zasahuje do hlavičky */
.overlap {
    position: relative;
    z-index: 3;
    margin-top: -110px;
}

.overlap--home {
    margin-top: -240px;
}

.overlap--small {
    margin-top: -48px;
}


/* --------------------------------------------------------------------------
   6. Rozloženie do stĺpcov
   -------------------------------------------------------------------------- */

.columns {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 32px;
}

.columns--top {
    align-items: flex-start;
}

.columns__main {
    flex: 999 1 560px;
    min-width: 0;
}

.columns__side {
    flex: 1 1 340px;
    min-width: 0;
}

.stack {
    display: flex;
    flex-direction: column;
    gap: 20px;
}


/* --------------------------------------------------------------------------
   7. Tabuľa s menu
   -------------------------------------------------------------------------- */

.board {
    position: relative;
    display: flex;
    padding: 26px;
    background-color: var(--chalk);
    background-image:
        radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, 0.07), transparent 60%),
        radial-gradient(ellipse at 80% 90%, rgba(255, 255, 255, 0.05), transparent 55%);
    box-shadow: var(--shadow-strong);
    color: #F4F4F2;
}

/* zlaté kosoštvorce v rohoch tabule */
.board__corner {
    position: absolute;
    width: 9px;
    height: 9px;
    background: var(--gold);
    transform: rotate(45deg);
}

.board__corner--tl { left: 9px; top: 9px; }
.board__corner--tr { right: 9px; top: 9px; }
.board__corner--bl { left: 9px; bottom: 9px; }
.board__corner--br { right: 9px; bottom: 9px; }

.board__inner {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 32px 40px;
    border: 1px solid var(--gold);
}

.board__inner--list {
    gap: 0;
    padding: 16px 32px;
}

.board__inner--center {
    align-items: center;
    gap: 24px;
    padding: 40px 24px 28px;
}

/* jeden deň menu */
.menu-day {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.menu-day__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.menu-day__name {
    font-size: 60px;
}

.menu-day__date {
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #BDBDB8;
}

.menu-day__soup {
    padding-bottom: 16px;
    border-bottom: 1px dashed #6E6E6A;
    font-size: 18px;
    font-weight: 600;
}

/* jedno jedlo */
.course {
    display: flex;
    gap: 16px;
}

.course__num {
    flex-shrink: 0;
    width: 36px;
    font-weight: 700;
    color: var(--gold);
}

.course__name {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;
}

.course__alg {
    font-size: 14px;
    font-weight: 400;
    color: #BDBDB8;
}

.course__desc {
    font-size: 15px;
    color: #CFCFCA;
}


/* --------------------------------------------------------------------------
   8. Karty a ceny
   -------------------------------------------------------------------------- */

.card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 28px;
    border-top: 3px solid var(--gold);
    background: var(--white);
    box-shadow: var(--shadow);
}

.card--plain {
    border-top: 0;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
}

.card--dark {
    border-top: 0;
    background: var(--dark);
    color: var(--white);
}

.card__title {
    font-size: 40px;
}

.card__title--small {
    font-size: 34px;
}

.price-line {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.price-line--muted {
    color: var(--muted);
}

.price-line__price {
    font-weight: 700;
    white-space: nowrap;
}

.price-total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.price-total--top {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 12px;
    border-top: 0;
    border-bottom: 1px solid var(--line);
}

.price-total__amount {
    font-family: var(--font-script);
    font-size: 52px;
    line-height: 0.9;
}


/* --------------------------------------------------------------------------
   9. Výber dňa dole na tabuli
   -------------------------------------------------------------------------- */

.day-tabs {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid rgba(201, 165, 92, 0.35);
}

.day-tab {
    flex: 1 1 0;
    min-width: 0;
    max-width: 64px;
    padding: 9px 0;
    border: 1px solid rgba(201, 165, 92, 0.4);
    border-radius: 4px;
    background: none;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(244, 244, 242, 0.8);
    cursor: pointer;
    transition: color 0.2s, border-color 0.2s, background-color 0.2s;
}

.day-tab:hover,
.day-tab:focus-visible {
    border-color: var(--gold);
    color: #F4F4F2;
}

.day-tab:focus-visible {
    outline: 1px solid var(--gold);
    outline-offset: 2px;
}

/* deň bez menu (víkend) */
.day-tab.is-closed {
    opacity: 0.55;
}

.day-tab.is-closed.is-active {
    opacity: 1;
}

/* mobil: 7 dní v jednom riadku */
@media (max-width: 480px) {
    .day-tabs {
        gap: 4px;
    }

    .day-tab {
        font-size: 13px;
        letter-spacing: 0.06em;
    }
}

/* vybraný deň: zlatý */
.day-tab.is-active {
    border-color: var(--gold);
    background: var(--gold);
    color: var(--dark);
}


/* --------------------------------------------------------------------------
   10. Otváracie hodiny
   -------------------------------------------------------------------------- */

.hours {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 26px 28px;
    background: var(--dark);
    color: var(--white);
    box-shadow: var(--shadow);
}

.hours__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.hours__title {
    font-size: 36px;
}

.badge {
    padding: 4px 10px;
    border: 1px solid var(--gold);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--gold);
}

.badge.is-closed {
    border-color: #A99FA3;
    color: #A99FA3;
}

.hours__days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hours__day {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    border-radius: 4px;
    background: rgba(201, 165, 92, 0.16);
    font-size: 13px;
    font-weight: 600;
    color: var(--gold);
}

.hours__day.is-closed {
    background: rgba(255, 255, 255, 0.05);
    color: #8A8085;
    text-decoration: line-through;
}

.hours__time {
    display: block;
    font-size: 30px;
    font-weight: 300;
    letter-spacing: 0.02em;
}

.hours__note {
    display: block;
    font-size: 14px;
    color: #B9AFB3;
}


/* --------------------------------------------------------------------------
   11. Piliere (tri kaligrafické bloky)
   -------------------------------------------------------------------------- */

.pillars {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 40px;
    padding-top: 96px;
    padding-bottom: 64px;
    text-align: center;
}

.pillar {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.pillar__title {
    font-size: 46px;
    line-height: 1;
}

.pillar p {
    color: var(--muted);
}


/* --------------------------------------------------------------------------
   12. Príbeh (tmavá sekcia s fotkou v oblúku)
   -------------------------------------------------------------------------- */

.story {
    background: var(--dark);
    color: var(--white);
}

.story__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 48px;
    padding-top: 88px;
    padding-bottom: 88px;
}

.story__image {
    flex: 1 1 380px;
    min-width: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 200px 200px 16px 16px;
    outline: 1px solid var(--gold);
    outline-offset: 10px;
}

.story__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.story__text {
    flex: 1 1 420px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.story__title {
    font-size: 52px;
    line-height: 1.1;
}

.story__lead {
    color: #D9D1D4;
}

.story__link {
    align-self: flex-start;
    color: var(--gold);
}

.story__link:hover {
    color: var(--gold-light);
}


/* --------------------------------------------------------------------------
   13. Navštívte nás + mapa
   -------------------------------------------------------------------------- */

.visit {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 48px;
    padding-top: 88px;
    padding-bottom: 88px;
}

.visit__info {
    flex: 1 1 320px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.visit__title {
    font-size: 60px;
    line-height: 1;
}

.visit__address {
    font-size: 18px;
}

.map {
    flex: 2 1 480px;
    min-width: 0;
    min-height: 320px;
    border: 1px solid #CFCBC2;
    background: #E2DFD8;
}

.map iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 320px;
    border: 0;
    filter: grayscale(0.4) sepia(0.15);
}

.map--large {
    position: relative;
    min-height: 460px;
    border: 0;
    outline: 1px solid var(--gold);
    outline-offset: 10px;
}

.map--large iframe {
    min-height: 460px;
}

.map__button {
    position: absolute;
    left: 24px;
    bottom: 24px;
}


/* --------------------------------------------------------------------------
   14. Odber menu e-mailom
   -------------------------------------------------------------------------- */

.newsletter {
    position: relative;
    overflow: hidden;
    background: var(--yellow);
}

/* veľké jemné slovo "Menu" v pozadí */
.newsletter::before {
    content: "Menu";
    position: absolute;
    right: -40px;
    top: -60px;
    font-family: var(--font-script);
    font-size: 320px;
    line-height: 1;
    color: rgba(255, 255, 255, 0.28);
    pointer-events: none;
}

.newsletter__inner {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 32px 56px;
    padding-top: 64px;
    padding-bottom: 64px;
}

.newsletter__text,
.newsletter__form {
    flex: 1 1 420px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tag-line {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.tag-line::before {
    content: "";
    width: 48px;
    height: 1px;
    background: var(--dark);
}

.tag-line .diamond {
    width: 7px;
    height: 7px;
    background: var(--dark);
}

.newsletter__label {
    font-family: var(--font-script);
    font-size: 58px;
    line-height: 1.05;
}

.newsletter__text p {
    color: #4A4232;
}

.subscribe {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px;
    border-radius: 999px;
    background: var(--white);
    box-shadow: 0 12px 30px rgba(120, 95, 20, 0.18);
}

.subscribe input {
    flex: 1 1 200px;
    min-width: 0;
    min-height: 52px;
    padding: 0 22px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    font: inherit;
    color: var(--text);
}

.subscribe .btn {
    min-height: 52px;
}

.newsletter__note {
    padding-left: 22px;
    font-size: 13px;
    color: #6A5E3E;
}


/* --------------------------------------------------------------------------
   15. Ozdobná klaviatúra nad pätičkou
   -------------------------------------------------------------------------- */

.piano-strip {
    height: 90px;
    border-top: 4px solid var(--gold);
    background-color: var(--white);
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='238' height='90'><rect width='238' height='90' fill='%23ffffff'/><rect y='70' width='238' height='20' fill='%23ECE9E3'/><g stroke='%231E1619'><line x1='33.5' y1='0' x2='33.5' y2='90'/><line x1='67.5' y1='0' x2='67.5' y2='90'/><line x1='101.5' y1='0' x2='101.5' y2='90'/><line x1='135.5' y1='0' x2='135.5' y2='90'/><line x1='169.5' y1='0' x2='169.5' y2='90'/><line x1='203.5' y1='0' x2='203.5' y2='90'/><line x1='237.5' y1='0' x2='237.5' y2='90'/></g><g fill='%231E1619'><rect x='23' y='-4' width='22' height='58' rx='3'/><rect x='57' y='-4' width='22' height='58' rx='3'/><rect x='125' y='-4' width='22' height='58' rx='3'/><rect x='159' y='-4' width='22' height='58' rx='3'/><rect x='193' y='-4' width='22' height='58' rx='3'/></g></svg>");
    background-repeat: repeat-x;
    background-size: 238px 90px;
}


/* --------------------------------------------------------------------------
   16. Pätička
   -------------------------------------------------------------------------- */

.site-footer {
    background: var(--dark);
    font-size: 15px;
    color: #D9D1D4;
}

.site-footer a {
    color: var(--white);
    text-decoration: none;
}

.site-footer a:hover {
    color: var(--gold);
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 40px;
    padding-top: 64px;
    padding-bottom: 40px;
}

.footer-col {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.footer-col__title {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold);
}

.footer-col__strong {
    color: var(--white);
}

.footer-brand {
    gap: 12px;
}

.footer-brand img {
    width: 140px;
    height: 140px;
}

.footer-brand__claim {
    font-family: var(--font-script);
    font-size: 26px;
    line-height: 1.2;
    color: var(--white);
}

.footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 0 28px;
    border-top: 1px solid rgba(201, 165, 92, 0.35);
    font-size: 13px;
    color: #A99FA3;
}

.site-footer .footer-social {
    padding: 6px 16px;
    border: 1px solid var(--gold);
    border-radius: 999px;
    color: var(--gold);
}


/* --------------------------------------------------------------------------
   17. Stránka Obedné menu
   -------------------------------------------------------------------------- */

.week-day {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 28px;
    padding: 24px 16px;
    border-bottom: 1px dashed #6E6E6A;
}

.week-day:last-child {
    border-bottom: 0;
}

.week-day.is-today {
    background: rgba(201, 165, 92, 0.12);
}

.week-day__head {
    flex: 0 0 170px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.week-day__name {
    font-size: 44px;
    line-height: 1;
}

.week-day__badge {
    display: none;
    align-self: flex-start;
    margin-top: 6px;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--gold);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--dark);
}

.week-day.is-today .week-day__badge {
    display: inline-block;
}

.week-day__body {
    flex: 1 1 360px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.week-day__soup {
    font-weight: 600;
}

.week-day .course__num {
    width: 30px;
}

.week-day .course__name {
    font-size: 16px;
}

.allergens {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 16px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
    color: #D9D1D4;
}

.allergens strong {
    display: inline-block;
    min-width: 22px;
    color: var(--gold);
}

.diet-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px 40px;
    padding: 28px 36px;
    background: var(--white);
}

.diet-strip__title {
    flex: 1 1 360px;
    font-size: 36px;
    line-height: 1.15;
}

.diet-strip__note {
    flex: 1 1 100%;
    font-size: 14px;
    color: var(--muted);
}

.chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.chip {
    padding: 8px 18px;
    border: 1px solid var(--gold);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
}

.archive {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
}

.archive-item {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px;
    background: var(--white);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
    text-decoration: none;
}

.archive-item__num {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    background: var(--dark);
    font-size: 18px;
    font-weight: 700;
    color: var(--gold);
}

.archive-item__text {
    display: flex;
    flex-direction: column;
}

.archive-item__range {
    font-size: 14px;
    color: var(--muted-light);
}

.archive-item__more {
    margin-left: auto;
    font-size: 13px;
    font-weight: 600;
    color: var(--gold-text);
}


/* --------------------------------------------------------------------------
   18. Stránka A la carte
   -------------------------------------------------------------------------- */

.carte-book__stage {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    width: 100%;
}

.carte-book__pages {
    width: 420px;
    max-width: 100%;
    aspect-ratio: 400 / 565;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
}

.carte-page {
    width: 100%;
    height: 100%;
}

.carte-page--cover {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px;
    border: 6px solid #2E2926;
    background: #1E1A18;
    text-align: center;
}

.carte-page--cover .script {
    font-size: 56px;
    color: var(--white);
}

.carte-page--cover img {
    width: 240px;
    height: 240px;
}

.carte-page--inner {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 36px 32px;
    background: #FBFAF6;
    color: var(--text);
}

/* skutočný sken strany – obrázok na celú plochu */
.carte-page__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.carte-page__title {
    font-size: 40px;
    text-align: center;
}

.carte-page .rule {
    align-self: center;
}

.carte-page__scan {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    border: 1px dashed #CFCBC2;
    font-size: 14px;
    text-align: center;
    color: #8A857C;
}

.carte-book__counter {
    font-size: 14px;
    letter-spacing: 0.2em;
    color: #BDBDB8;
}

.carte-thumbs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.carte-thumbs button {
    width: 40px;
    height: 44px;
    border: 1px solid #5E5A56;
    border-radius: 4px;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: #D0CFCA;
    cursor: pointer;
}

.carte-thumbs button.is-active {
    border-color: var(--gold);
    background: var(--gold);
    color: var(--dark);
}

.chapter-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.chapter-list button {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    font: inherit;
    text-align: left;
    color: var(--text);
    cursor: pointer;
}

.chapter-list button:hover {
    color: var(--gold-text);
}

.chapter-list__page {
    font-size: 14px;
    color: var(--gold-text);
}


/* --------------------------------------------------------------------------
   19. Stránka Galéria
   -------------------------------------------------------------------------- */

.gallery-wrap {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.gallery-filter {
    align-self: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    padding: 6px;
    border-top: 3px solid var(--gold);
    background: var(--white);
    box-shadow: var(--shadow);
}

.gallery-filter button {
    min-height: 44px;
    padding: 0 22px;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text);
    cursor: pointer;
}

.gallery-filter button.is-active {
    background: var(--dark);
    color: var(--gold);
}

.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    grid-auto-rows: 220px;
    gap: 16px;
}

.gallery-item {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 0;
    border: 0;
    background: #DAD5CC;
    font: inherit;
    cursor: pointer;
}

.gallery-item--tall {
    grid-row: span 2;
}

.gallery-item img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.gallery-item:hover img {
    transform: scale(1.04);
}

.gallery-item__placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #8A857C;
}

.gallery-item__caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    padding: 40px 18px 14px;
    background: linear-gradient(180deg, rgba(30, 22, 25, 0) 0%, rgba(30, 22, 25, 0.8) 100%);
    text-align: left;
    color: var(--white);
}

.gallery-item__cat {
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
}

.gallery-item__title {
    font-family: var(--font-script);
    font-size: 28px;
    line-height: 1.1;
}

.lightbox {
    width: min(960px, calc(100% - 48px));
    max-width: none;
    padding: 12px;
    border: 0;
    background: transparent;
    color: var(--white);
}

.lightbox::backdrop {
    background: rgba(20, 15, 17, 0.92);
}

.lightbox__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.lightbox__title {
    font-size: 40px;
}

.lightbox__frame {
    position: relative;
    aspect-ratio: 16 / 10;
    background: #3A3436;
    outline: 1px solid var(--gold);
    outline-offset: 8px;
}

.lightbox__frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lightbox__placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #A99FA3;
}


/* --------------------------------------------------------------------------
   20. Stránka O nás
   -------------------------------------------------------------------------- */

.intro-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    padding: 56px clamp(24px, 6vw, 72px);
    border-top: 3px solid var(--gold);
    background: var(--white);
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.22);
    text-align: center;
}

.intro-card__text {
    max-width: 720px;
    font-size: 18px;
}

.intro-card__quote {
    max-width: 720px;
    font-size: 38px;
    line-height: 1.25;
}

.split {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 56px;
    padding-top: 96px;
    padding-bottom: 96px;
}

.split--top {
    align-items: flex-start;
}

.split__col {
    flex: 1 1 440px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.split__title {
    font-size: 64px;
    line-height: 1;
}

.split__title--small {
    font-size: 52px;
}

.arch-image {
    flex: 1 1 380px;
    min-width: 0;
    aspect-ratio: 4 / 5;
    max-height: 560px;
    overflow: hidden;
    border-radius: 240px 240px 0 0;
    outline: 1px solid var(--gold);
    outline-offset: 10px;
    background: #2B2A26;
}

.arch-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chalk-section {
    background-color: var(--chalk);
    background-image:
        radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, 0.07), transparent 60%),
        radial-gradient(ellipse at 80% 90%, rgba(255, 255, 255, 0.05), transparent 55%);
    color: #F4F4F2;
}

.chalk-section__inner {
    display: flex;
    flex-wrap: wrap;
    gap: 48px;
    padding-top: 96px;
    padding-bottom: 96px;
}

.chalk-section__inner .section-title {
    flex: 1 1 100%;
    margin-bottom: 0;
}

.chalk-section__col {
    flex: 1 1 440px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: #DCDCD8;
}

.chalk-section__quote {
    font-family: var(--font-script);
    font-size: 30px;
    line-height: 1.3;
    color: var(--white);
}

.stats {
    flex: 1 1 440px;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.stat {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 28px 24px;
    background: var(--white);
}

.stat__value {
    font-family: var(--font-script);
    font-size: 56px;
    line-height: 1;
    color: var(--gold-text);
}

.stat__label {
    font-size: 14px;
}

.motto {
    background: var(--dark);
    color: var(--white);
}

.motto__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    max-width: 960px;
    margin: 0 auto;
    padding: 104px 24px;
    text-align: center;
}

.motto__latin {
    font-family: var(--font-script);
    font-size: clamp(44px, 5vw, 68px);
    line-height: 1.1;
}

.motto__translation {
    font-weight: 600;
    color: var(--gold);
}

.motto__note {
    margin-top: 12px;
    font-size: 18px;
    color: #D9D1D4;
}

.invite {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    max-width: 960px;
    margin: 0 auto;
    padding: 96px 24px;
    text-align: center;
}

.invite__title {
    font-size: 44px;
    line-height: 1.2;
}

.invite__text {
    max-width: 680px;
    color: var(--muted);
}

.invite__signature {
    margin-top: 16px;
    font-family: var(--font-script);
    font-size: 28px;
    color: var(--gold-text);
}


/* --------------------------------------------------------------------------
   21. Stránka Kontakt
   -------------------------------------------------------------------------- */

.contact-item {
    display: flex;
    align-items: center;
    gap: 16px;
    text-decoration: none;
}

.contact-item__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--dark);
    color: var(--gold);
}

.contact-item__label {
    display: block;
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--muted-light);
}

.contact-item__value {
    display: block;
    font-size: 18px;
    font-weight: 700;
}

.contact-form {
    gap: 18px;
    padding: 32px;
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

.field {
    flex: 1 1 200px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* vo formulári pod sebou nesmie pole rásť do výšky */
.contact-form > .field {
    flex: 0 0 auto;
}

.contact-form > .field--grow {
    flex: 1 1 auto;
}

.field input,
.field textarea {
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid #D6D2CA;
    background: #FAF9F6;
    font: inherit;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: var(--text);
}

.field textarea {
    flex: 1;
    min-height: 160px;
    padding: 12px 14px;
    resize: vertical;
}

.field input:focus,
.field textarea:focus {
    outline: 2px solid var(--gold);
    outline-offset: 1px;
}

.form-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}


/* --------------------------------------------------------------------------
   22. Mobil
   -------------------------------------------------------------------------- */

@media (max-width: 760px) {
    .site-header--home {
        min-height: 680px;
    }

    .hero__logo {
        width: 180px;
        height: 180px;
    }

    .board {
        padding: 18px;
    }

    .board__inner {
        padding: 24px 20px;
    }

    .board__inner--list {
        padding: 8px 12px;
    }

    .menu-day__name {
        font-size: 46px;
    }

    .section-title h2,
    .visit__title,
    .split__title {
        font-size: 46px;
    }

    .newsletter__label {
        font-size: 44px;
    }

    .week-day__head {
        flex-basis: 100%;
    }

    .carte-book__stage {
        gap: 10px;
    }

    .round-btn {
        width: 44px;
        height: 44px;
    }
}


/* --------------------------------------------------------------------------
   23. Redakčný systém: podmenu, správy, stránkovanie, chybová stránka,
       Pripravujeme, text z editora a farby modulov kostry
   -------------------------------------------------------------------------- */

/* podmenu (stránka s podstránkami v menu) */
.site-nav__group {
    position: relative;
}

.site-nav__sub {
    position: absolute;
    top: 100%;
    left: -16px;
    z-index: 10;
    display: none;
    flex-direction: column;
    min-width: 220px;
    padding: 10px 16px;
    background: var(--dark);
    box-shadow: var(--shadow);
}

.site-nav__group:hover .site-nav__sub,
.site-nav__group:focus-within .site-nav__sub {
    display: flex;
}

/* správy po odoslaní formulára (flash) – nad obsahom, ktorý zasahuje do hlavičky */
.flashes {
    position: relative;
    z-index: 4;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 24px;
    margin-bottom: 24px;
}

.flashes + main .overlap {
    margin-top: 0;
}

.flash {
    padding: 16px 20px;
    border-left: 4px solid var(--gold);
    background: var(--white);
    box-shadow: var(--shadow);
    font-weight: 500;
}

.flash--danger {
    border-left-color: #B3261E;
}

/* stránkovanie */
.pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 48px;
}

.pager a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--white);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.pager a.is-active {
    border-color: var(--dark);
    background: var(--dark);
    color: var(--gold);
}

/* chybová stránka 404 / 403 */
.error-card {
    align-items: center;
    margin-bottom: 88px;
    text-align: center;
}

.error-card__code {
    font-size: 96px;
    line-height: 1;
    color: var(--gold-text);
}

/* stránka Pripravujeme */
.maintenance {
    min-height: 100vh;
}

.maintenance .hero {
    padding-top: 56px;
    padding-bottom: 56px;
}

.maintenance__text {
    max-width: 560px;
    margin-bottom: 16px;
    font-size: 17px;
    color: #E6E0E2;
}

.maintenance__btn {
    border-color: var(--gold);
    color: var(--white);
}

/* text z editora (textové stránky, články) */
.content {
    font-size: 17px;
    line-height: 1.75;
}

.content > * + * {
    margin-top: 1em;
}

.content h2,
.content h3 {
    margin-top: 1.6em;
    font-family: var(--font-script);
    font-weight: 400;
    line-height: 1.1;
}

.content h2 {
    font-size: 48px;
}

.content h3 {
    font-size: 36px;
}

.content ul,
.content ol {
    padding-left: 1.3em;
}

.content a {
    color: var(--gold-text);
}

.content img {
    height: auto;
}

/* odstupy sekcií (namiesto štýlov priamo v HTML šablón) */
.section-pad {
    padding-top: 88px;
    padding-bottom: 88px;
}

.section-pad-top {
    padding-top: 56px;
}

.section-pad-bottom {
    padding-bottom: 88px;
}

.section-title--spaced {
    margin-top: 72px;
}

/* biela karta s textom stránky (textová stránka, článok, vyhľadávanie) */
.page-card {
    padding: 56px clamp(24px, 6vw, 72px);
    border-top: 3px solid var(--gold);
    background: var(--white);
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.22);
}

.page-card__grid--aside {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 48px;
}

.page-card__aside {
    font-size: 15px;
}

.page-card__button {
    margin-top: 32px;
}

.intro-card--left {
    align-items: stretch;
    text-align: left;
}

.about-content {
    margin-top: 48px;
}

.lead {
    font-size: 19px;
    font-weight: 500;
}

.link-list {
    margin-top: 32px;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line);
}

.link-list li {
    border-bottom: 1px solid var(--line);
}

.link-list a {
    display: flex;
    justify-content: space-between;
    padding: 14px 0;
    font-weight: 600;
    text-decoration: none;
}

.link-list a::after {
    content: "→";
    color: var(--gold-text);
}

.link-list--files a::after {
    content: "↓";
}

.back-link {
    margin-top: 40px;
    font-weight: 600;
}

/* mriežka fotiek (galéria textovej stránky a článku) */
.photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
}

.photo-grid img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

/* novinky */
.news-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 32px;
}

.news-card,
.news-featured {
    display: flex;
    flex-direction: column;
    background: var(--white);
    box-shadow: var(--shadow);
    text-decoration: none;
}

.news-card__image {
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
}

.news-card__body,
.news-featured__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 28px;
}

.news-card__date {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gold-text);
}

.news-card__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.35;
}

.news-card__perex {
    color: var(--muted);
}

.news-card__more {
    margin-top: auto;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold-text);
}

.news-card:hover .news-card__title,
.news-featured:hover .news-featured__title {
    color: var(--gold-text);
}

.news-featured {
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 40px;
    border-top: 3px solid var(--gold);
}

.news-featured__image {
    flex: 1 1 420px;
    min-width: 0;
    max-height: 420px;
    object-fit: cover;
}

.news-featured__body {
    flex: 1 1 360px;
    justify-content: center;
    padding: 40px;
}

.news-featured__title {
    font-size: 52px;
    line-height: 1.1;
}

.news-intro {
    margin-bottom: 40px;
}

.news-all {
    margin-top: 40px;
}

/* mapa: Google Mapy sa načítajú až po kliknutí */
.map--click {
    position: relative;
    display: flex;
}

.map__placeholder {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 32px 24px 96px;
    background-color: var(--chalk);
    background-image: radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, 0.07), transparent 60%);
    color: #F4F4F2;
    text-align: center;
}

.map__address {
    font-family: var(--font-script);
    font-size: 44px;
    line-height: 1.1;
}

.map__note {
    font-size: 13px;
    color: #BDBDB8;
}

.map--click iframe {
    flex: 1;
}

.map--click .map__button {
    position: absolute;
    left: 24px;
    bottom: 24px;
}

/* A la carte: strana = celý sken */
.carte-page--scan {
    background: #FBFAF6;
}

.carte-page--scan .carte-page__image {
    object-fit: contain;
}

.card__text-light {
    color: #D9D1D4;
}

.card__link-center {
    align-self: center;
}

/* kontakt */
.card--contacts {
    gap: 20px;
    padding: 32px;
}

/* vyhľadávanie */
.search-form {
    margin-bottom: 32px;
    border: 1px solid var(--line);
}

.search-result {
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
}

.search-result__title {
    margin: 6px 0;
    font-size: 20px;
}

.gallery-note {
    margin-top: 32px;
}

/* obedné menu: cena pri jedle, odkaz v tabuli */
.course__price {
    margin-left: 8px;
    font-weight: 600;
    color: var(--gold);
    white-space: nowrap;
}

.board__link {
    color: inherit;
    text-decoration: none;
}

.board__link:hover {
    color: var(--gold-light);
}

.board__back {
    padding: 24px 0 8px;
    text-align: center;
}

/* týždenný lístok (predná a zadná strana) */
.sheets {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.sheet {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.sheet img {
    width: 100%;
    aspect-ratio: 1 / 1.414;
    object-fit: cover;
    object-position: top;
    border: 1px solid var(--line);
}

.sheet__pdf {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1.414;
    border: 1px solid var(--line);
    background: var(--linen);
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--gold-text);
}

/* jedálny lístok – listovateľná kniha (StPageFlip) */
.carte-flip {
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
}

.carte-flip__page {
    background: #FBFAF6;
    overflow: hidden;
}

.carte-flip__page img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #FBFAF6;
    pointer-events: none;
    user-select: none;
}

/* bez knižnice: strany pod sebou */
.carte-flip.is-static {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 520px;
}

.carte-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px;
}

.carte-zoom {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid var(--gold);
    border-radius: 999px;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gold-light);
    cursor: pointer;
}

.carte-zoom:hover {
    background: rgba(201, 165, 92, 0.15);
}

.carte-lightbox {
    width: min(900px, calc(100% - 24px));
}

.carte-lightbox .lightbox__head {
    margin-bottom: 16px;
}

.carte-lightbox .lightbox__title {
    flex: 1;
    font-size: 32px;
}

.carte-lightbox__nav {
    display: flex;
    gap: 8px;
}

.carte-lightbox .lightbox__frame {
    aspect-ratio: auto;
    max-height: calc(100vh - 140px);
    overflow: auto;
    background: #FBFAF6;
}

.carte-lightbox .lightbox__frame img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* objednávka obeda */
.order {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 32px;
}

.order__main {
    flex: 999 1 560px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.order__side {
    flex: 1 1 320px;
    min-width: 0;
    position: sticky;
    top: 24px;
}

.order__card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 32px clamp(20px, 4vw, 40px);
}

.order__title {
    font-size: 40px;
}

.order__title--spaced {
    margin-top: 16px;
}

.order-days {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.order-day {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: none;
    font: inherit;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
}

/* polia formulára v stĺpci nerastú do výšky */
.order__card > .field,
.order__card > .form-row {
    flex: 0 0 auto;
}

.order-summary .price-line > span:last-child {
    white-space: nowrap;
}

.order-day.is-active {
    border-color: var(--dark);
    background: var(--dark);
    color: var(--gold);
}

.order-day:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}

.order-day.is-disabled {
    opacity: 0.35;
}

/* počet porcií pri záložke dňa */
.order-day__count {
    min-width: 20px;
    padding: 1px 6px;
    border-radius: 999px;
    background: var(--gold);
    font-size: 12px;
    line-height: 18px;
    color: var(--dark);
}

/* deň, na ktorý sa už nedá objednať */
.order-dishes__closed {
    padding: 18px 0 4px;
    color: var(--muted);
}

/* názov dňa v súhrne objednávky na viac dní */
.order-summary__day {
    margin-top: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold-text);
}

.order-summary__day:first-child {
    margin-top: 0;
}

.order-dishes__day {
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold-text);
}

.order-dish {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.order-dish__text {
    flex: 1;
    min-width: 0;
}

.order-dish__meta {
    display: block;
    font-size: 14px;
    color: var(--muted);
}

.order-dish.is-sold-out {
    opacity: 0.55;
}

.order-dish__sold {
    font-weight: 600;
    color: #B3261E;
}

.stepper {
    display: flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--white);
}

.stepper__btn {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    font: inherit;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.stepper__btn:hover {
    background: var(--linen);
}

.stepper input {
    width: 44px;
    border: 0;
    background: transparent;
    font: inherit;
    font-weight: 600;
    text-align: center;
    -moz-appearance: textfield;
}

.stepper input::-webkit-inner-spin-button,
.stepper input::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.order .field input,
.order .field textarea {
    width: 100%;
}

.order-summary {
    gap: 12px;
}

.order-summary .btn {
    width: 100%;
}

/* tlačidlo menu a malé logo na úvodnej stránke (iba na mobile) */
.nav-toggle,
.header-bar__logo--mobile {
    display: none;
}

@media (max-width: 900px) {
    .header-bar,
    .site-header--home .header-bar {
        flex-wrap: nowrap;
        justify-content: space-between;
        padding-top: 16px;
        padding-bottom: 16px;
    }

    /* úvodná stránka na mobile: malé logo v rohu ako na podstránkach, veľké logo v strede sa skryje */
    .header-bar__logo--mobile {
        display: block;
    }

    .site-header--home .hero__logo {
        display: none;
    }

    .site-header--home {
        min-height: 560px;
    }

    .header-bar__logo img {
        width: 100px;
        height: 100px;
    }

    .nav-toggle {
        position: relative;
        z-index: 30;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        min-height: 44px;
        padding: 0 16px;
        border: 1px solid rgba(201, 165, 92, 0.6);
        border-radius: 999px;
        background: rgba(30, 22, 25, 0.55);
        font: inherit;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--white);
        cursor: pointer;
    }

    .nav-toggle__lines {
        display: flex;
        flex-direction: column;
        gap: 4px;
        width: 18px;
    }

    .nav-toggle__lines span {
        height: 1.5px;
        background: var(--gold);
        transition: transform 0.2s, opacity 0.2s;
    }

    .is-menu-open .nav-toggle__lines span:nth-child(1) {
        transform: translateY(5.5px) rotate(45deg);
    }

    .is-menu-open .nav-toggle__lines span:nth-child(2) {
        opacity: 0;
    }

    .is-menu-open .nav-toggle__lines span:nth-child(3) {
        transform: translateY(-5.5px) rotate(-45deg);
    }

    /* menu cez celú obrazovku */
    .site-nav {
        position: fixed;
        inset: 0;
        z-index: 20;
        display: none;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 96px 24px 48px;
        overflow-y: auto;
        background: var(--dark);
        font-size: 15px;
    }

    .is-menu-open .site-nav {
        display: flex;
    }

    .is-menu-open {
        overflow: hidden;
    }

    /* otvorené menu nad celou stránkou (hlavička aj obsah, ktorý do nej zasahuje) */
    .is-menu-open .site-header {
        z-index: 100;
        overflow: visible;
    }

    .is-menu-open .header-bar {
        z-index: 100;
    }

    .site-nav a {
        padding: 12px 8px;
    }

    .is-menu-open .nav-toggle {
        position: fixed;
        top: 16px;
        right: 24px;
    }
}

@media (max-width: 760px) {
    /* odber e-mailom: pole a tlačidlo pod sebou */
    .subscribe {
        flex-direction: column;
        gap: 8px;
        padding: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .subscribe input {
        flex: 0 0 auto;
        min-height: 52px;
        padding: 0 20px;
        border-radius: 999px;
        background: var(--white);
        box-shadow: 0 12px 30px rgba(120, 95, 20, 0.18);
    }

    .subscribe .btn {
        width: 100%;
    }
}

/* farby modulov kostry: lišta cookies (--cc-*), popup okno (--pp-*), obsahové bloky (--cb-*)
   cookies a popup majú vlastné CSS načítané neskôr, preto sú premenné na ich prvkoch (div.cc, dialog.pp) */
div.cc {
    --cc-bg: #FFFFFF;
    --cc-text: var(--text);
    --cc-muted: var(--muted);
    --cc-accent: var(--dark);
    --cc-accent-text: var(--gold);
    --cc-border: var(--line);
    --cc-radius: 0;
    --cc-font: var(--font-sans);
}

dialog.pp {
    --pp-bg: var(--linen);
    --pp-text: var(--text);
    --pp-accent: var(--dark);
    --pp-accent-text: var(--gold);
    --pp-backdrop: rgba(30, 22, 25, 0.7);
    --pp-radius: 0;
    --pp-font: var(--font-sans);
}

dialog.pp .pp__title {
    font-family: var(--font-script);
    font-size: 44px;
    font-weight: 400;
}

:root {
    --cb-accent: var(--gold-text);
    --cb-ink: var(--text);
    --cb-muted: var(--muted);
    --cb-soft: #F6F1E6;
    --cb-line: var(--line);
    --cb-panel: var(--white);
    --cb-dark: var(--chalk);
    --cb-on-dark: #F4F4F2;
    --cb-radius: 0;
}

@media (max-width: 900px) {
    .page-card__grid--aside {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .section-pad {
        padding-top: 56px;
        padding-bottom: 56px;
    }

    .news-featured__title {
        font-size: 40px;
    }

    .map__address {
        font-size: 34px;
    }

    .site-nav__sub {
        position: static;
        display: flex;
        min-width: 0;
        padding: 0 0 0 12px;
        background: none;
        box-shadow: none;
    }

    .content h2 {
        font-size: 40px;
    }
}


/* upozornenie na najbližšiu uzávierku pod tlačidlom Objednať online */
.order-deadline {
    margin-top: -4px;
    font-weight: 600;
    color: var(--gold-text);
}