/* layouts/elegance.css — „Elegance“: centred, black and old rose, the
   system's display serif (Didot, Bodoni; Georgia elsewhere) over a light sans.
   No menu; a sticky „Objednat se“. The accent (theme.accent, default old
   rose) always meets the black --ground: as text on the page and as the
   background of black text (the buttons); the loader requires 4.5 : 1. */
:root {
  --ground: #141113; --bg: #141113; --bg-2: #1d191b; --bg-alt: #1d191b;
  --ink: #f3ece8; --muted: #b9aaa6; --line: #3a3235;
  --accent: #d9a3a6; --focus: #d9a3a6;
  --max: 1080px;
  --font: "Avenir Next", Avenir, "Segoe UI", "Helvetica Neue", system-ui, sans-serif;
  --font-display: Didot, "Bodoni 72", "Bodoni MT", "Hoefler Text", Georgia, serif;
  color-scheme: dark;
}
body { font-size: 1.0625rem; line-height: 1.7; letter-spacing: .005em; }
h1, h2, h3 { font-weight: 400; }
a { color: var(--accent); text-underline-offset: .2em; text-decoration-thickness: 1px; }
.e-h2 { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.7rem); text-align: center; margin-bottom: .5rem; }
.e-h2::after { content: ""; display: block; width: 2.5rem; height: 1px; margin: 1rem auto 0; background: var(--accent); }
.e-label { font-family: var(--font); font-size: .8rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--accent); margin: 0 0 .9rem; }
.e-lead { max-width: 36rem; margin: 1rem auto 1.5rem; text-align: center; color: var(--muted); }
.e-narrow { max-width: 42rem; text-align: center; }
.e-section { padding: 4.5rem 0; }

/* header: only the name */
.e-head { padding: 2.25rem 0 0; text-align: center; }
.e-notice { margin: 0 0 1.25rem; color: var(--accent); font-size: .9rem; letter-spacing: .06em; }
.e-brand { margin: 0; font-family: var(--font-display); font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.3rem); line-height: 1.15; letter-spacing: .02em; }
.e-brand a { display: inline-flex; align-items: center; gap: .5rem; color: var(--ink); text-decoration: none; }
.e-brand .icon { width: .8em; height: .8em; color: var(--accent); }
.e-place { margin: .35rem 0 0; font-size: .8rem; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); }

/* intro: arch photo, heading and the opening hours */
.e-intro { padding-top: 2.25rem; padding-bottom: 3.5rem; text-align: center; }
.e-arch { width: min(62vw, 300px); margin: 0 auto 2rem; padding: .5rem; border: 1px solid var(--line); border-radius: 999px 999px 6px 6px; }
.e-arch img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 999px 999px 3px 3px; }
.e-intro h1 { max-width: 15em; margin: 0 auto 1rem; font-size: clamp(2.2rem, 1.5rem + 3vw, 3.6rem); line-height: 1.1; }
.e-tagline { max-width: 34rem; margin: 0 auto 2.5rem; color: var(--muted); font-size: 1.1rem; }
@media (min-width: 900px) { .e-intro { padding-top: 1.5rem; } .e-arch { width: 230px; margin-bottom: 1.5rem; } .e-tagline { margin-bottom: 2rem; } }
.e-hours { display: inline-block; min-width: min(100%, 24rem); padding: 1.6rem 1.75rem 1.1rem; border: 1px solid var(--line); background: var(--bg-2); text-align: left; }
.e-hours .e-label { text-align: center; }
.e-hours .hours { max-width: none; }
.e-hours .hours th { font-weight: 400; color: var(--muted); }
.e-hours .hours td { text-align: right; }
.e-hours .hours tr:last-child th, .e-hours .hours tr:last-child td { border-bottom: 0; }
.e-hours .note { margin: .75rem 0 0; text-align: center; font-size: .85rem; }

/* signposts */
.e-paths { padding-bottom: 3rem; }
.e-path-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); text-align: center; }
.e-path { padding: 1.75rem 1.5rem; border: 1px solid var(--line); }
.e-path h2, .e-path h3 { font-family: var(--font-display); font-size: 1.6rem; margin-bottom: .4rem; }
.e-path p { color: var(--muted); }
.e-ring { display: inline-grid; place-items: center; width: 3.25rem; height: 3.25rem; margin-bottom: .9rem; border: 1px solid var(--accent); border-radius: 50%; color: var(--accent); }
.e-ring .icon { width: 1.4rem; height: 1.4rem; stroke-width: 1.4; }

/* the menu card of prices: two columns from 700 px */
.e-menu { max-width: 52rem; margin: 0 auto; padding: 2.75rem clamp(1.25rem, 4vw, 3.5rem) 2rem; border: 1px solid var(--line); outline: 1px solid var(--line); outline-offset: -8px; background: var(--bg-2); }
.e-menu-cols { margin-top: 2rem; }
.e-menu-group { break-inside: avoid; padding-bottom: 1.5rem; }
.e-menu-group .e-label { text-align: center; }
.e-menu dl { margin: 0; }
.e-menu dl div { display: flex; align-items: baseline; gap: .5rem; padding: .45rem 0; }
.e-menu dl div::after { content: ""; order: 1; flex: 1 1 1rem; min-width: 1rem; border-bottom: 1px dotted #6d5f61; transform: translateY(-.3em); }
.e-menu dt { order: 0; max-width: 72%; }
.e-menu dt span { display: block; font-size: .85rem; color: var(--muted); font-style: italic; }
.e-menu dd { order: 2; margin: 0; white-space: nowrap; color: var(--accent); }
.e-menu .e-hl dt { color: var(--accent); }
.e-menu-note { margin: .5rem 0 0; text-align: center; color: var(--muted); font-size: .9rem; }
@media (min-width: 700px) { .e-menu-cols { columns: 2; column-gap: 3.5rem; } }

/* the strip of photos */
.e-gallery { padding-bottom: 0; }
.e-strip { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 4px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.e-strip figure { position: relative; margin: 0; }
.e-strip img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.e-strip figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.5rem .75rem .6rem; background: linear-gradient(transparent, rgba(20, 17, 19, .9)); font-size: .85rem; letter-spacing: .04em; }
@media (min-width: 900px) { .e-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* services, steps, story */
.e-services { list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 2.5rem 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); text-align: center; }
.e-services h3 { font-family: var(--font-display); font-size: 1.6rem; margin-bottom: .4rem; }
.e-services p { margin: 0 auto; max-width: 20rem; color: var(--muted); }
.e-service-img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 1rem; }
.e-steps { list-style: none; counter-reset: e-step; padding: 0; margin: 2.5rem 0 0; }
.e-steps li { counter-increment: e-step; padding: 0 0 2rem; }
.e-steps li::before { content: counter(e-step, upper-roman); display: block; margin-bottom: .35rem; font-family: var(--font-display); font-size: 1.4rem; color: var(--accent); }
.e-steps h3 { font-family: var(--font-display); font-size: 1.5rem; margin-bottom: .3rem; }
.e-steps p { margin: 0; color: var(--muted); }
.e-step-img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; margin-bottom: 1rem; }
.e-story p { color: #ddd3ce; }
.e-story-img { margin-top: 2.5rem; }
.e-story-img img { display: block; width: 100%; aspect-ratio: 21 / 9; object-fit: cover; border-radius: 4px; }
.e-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 3rem; margin: 2rem 0 0; }
.e-facts div { display: flex; flex-direction: column-reverse; }
.e-facts dt { font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.e-facts dd { margin: 0; font-family: var(--font-display); font-size: 2rem; color: var(--accent); }
.faq summary { font-family: var(--font-display); font-size: 1.3rem; font-weight: 400; text-align: left; }
.faq details p { text-align: left; }
.faq summary::after { color: var(--accent); }

/* contact and the sticky button */
.e-contact { background: var(--bg-2); border-top: 1px solid var(--line); padding-bottom: 6.5rem; }
.e-phone { margin: 0 0 1rem; font-family: var(--font-display); font-size: clamp(1.9rem, 1.3rem + 3vw, 3rem); line-height: 1.2; }
.e-phone a { color: var(--ink); text-decoration: none; white-space: nowrap; }
.e-phone a:hover { color: var(--accent); }
.e-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin: 0 0 2.5rem; }
.e-btn { display: inline-block; min-width: 9rem; padding: .8rem 1.5rem; border-radius: 999px; background: var(--accent); color: var(--ground); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .85rem; text-decoration: none; }
.e-btn:hover { filter: brightness(1.08); }
.e-btn-line { background: transparent; color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.e-btn-line:hover { background: rgba(217, 163, 166, .1); filter: none; }
.e-company { font-family: var(--font-display); font-size: 1.5rem; margin: 0 0 .5rem; }
.e-contact .contact-list .label { min-width: 0; margin-right: .5rem; text-transform: uppercase; letter-spacing: .14em; font-size: .75rem; }
.e-contact address { margin-bottom: 1rem; }
.e-contact .note { max-width: 32rem; margin-left: auto; margin-right: auto; }
.e-contact .contact-form { margin-top: 2.5rem; text-align: left; }
.e-contact .contact-form:not(.demo-form) { padding: 1.75rem; border: 1px solid var(--line); background: var(--bg); }
.e-contact .demo-form { text-align: center; background: var(--bg); border-color: #6d5f61; }
.e-contact .demo-form p { color: var(--muted); }
.e-book-wrap { position: sticky; bottom: 0; z-index: 20; display: flex; justify-content: center; margin-top: -5.5rem; padding: 1rem var(--gutter) calc(1rem + env(safe-area-inset-bottom)); pointer-events: none; } /* at rest it sits in the contact's bottom padding */
.e-book { pointer-events: auto; padding: .9rem 2.25rem; border-radius: 999px; background: var(--accent); color: var(--ground); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: .85rem; text-decoration: none; box-shadow: 0 12px 30px -8px rgba(0, 0, 0, .7), 0 0 0 4px var(--bg); }
.e-book:hover { filter: brightness(1.08); }
@media (min-width: 900px) { .e-book-wrap { justify-content: flex-end; } }

.e-foot { padding: 1.5rem 0 2rem; text-align: center; color: var(--muted); font-size: .85rem; border-top: 1px solid var(--line); }
.e-foot p { margin: 0; }
.e-foot a { color: var(--ink); }