/* Městská – noční holírna ve městě (návrh Gemini: docs/zadani-gemini/kadernictvi-barber-mesto-navrh.jpg).
   Podpis šablony: stránka jako sled panelů zasazených v rámu (okraj od kraje okna jako výloha, mezi panely je vidět
   rám stránky, panely mají jemnou hranu), oranžová značka „čárka a tečka“ před nadpisy a kondenzované verzálky.
   Panely úvodu se střídají tmavé a světlé (volba šablony Panely): tmavá paleta má světlé panely „naopak“ (barvy
   z textu), světlá paleta tmavé. Rám je odvozený z palety (volba Rám kolem panelů). Jen proměnné --c-*, černá a bílá
   jen jako průhlednost (clony na fotkách, hrany). */

:root {
  --wrap: 1180px;
  --ms-in: 0px;   /* panely od kraje ke kraji okna – okraj rámu kolem stránky pryč (zadavatel 2. 11. 2026: „šablona je super, ale ten okraj ne“), zůstávají jen spáry mezi panely */
  --ms-gap: clamp(8px, calc(.95 * var(--vw, 1vw)), 14px);  /* mezera mezi panely */
  --ms-r: min(var(--r-sm, 2px), 6px);                       /* rohy panelů: drží tvar výlohy */
  --section: calc(clamp(64px, calc(8.6 * var(--vw, 1vw)), 128px) * var(--space));
  --fs-hero: clamp(3rem, calc(6.9 * var(--vw, 1vw)), 6.5rem);
  --fs-h1: clamp(2.4rem, calc(4.8 * var(--vw, 1vw)), 4.3rem);
  --fs-h2: clamp(2.1rem, calc(4 * var(--vw, 1vw)), 3.6rem);
  --head-weight: 600;
  --head-tracking: 0;
  --head-transform: uppercase;
  --head-line: 1.15;
  /* verzálky s háčky a čárkami potřebují nad sebou místo: v Oswaldu sahá čárka nad Í do 1,06 em a čárka za slovem i J pod účaří –
     při těsnějším řádkování se diakritika srazila s řádkem nad (kontrola 19 vzhledů 31. 10. 2026) */
  --btn-h: 46px;
  --btn-weight: 600;
  --btn-tracking: .01em;
  --header-h: 84px;
  --ms-ann-h: 34px;
  --mh-h: var(--header-h);
  /* barvy palety z kořene – pro panely „naopak“ (text ↔ pozadí); uvnitř panelu se --c-* přepíšou, tyhle ne */
  --ms-b0: var(--c-bg);
  --ms-t0: var(--c-text);
  --ms-b0-rgb: var(--c-bg-rgb);
  --ms-t0-rgb: var(--c-text-rgb);
}
/* značka čárka a tečka (šířka 7,5× výšky): čárka 5×, mezera 1,5×, tečka 1× výšky – v každé sekci z její barvy značky */
:root, .home-sec {
  --ms-mark: linear-gradient(var(--c-accent), var(--c-accent)) left center / 66.67% 100% no-repeat,
             linear-gradient(var(--c-accent), var(--c-accent)) right center / 13.34% 100% no-repeat;
}
:root:has(.mh > .announce) { --mh-h: calc(var(--header-h) + var(--ms-ann-h)); }

/* rám stránky: světlý beton / tmavý asfalt podle palety, nebo doplňková barva */
:root[data-scheme="dark"] { --ms-frame: color-mix(in srgb, var(--c-text) 85%, var(--c-bg)); }
:root[data-scheme="light"] { --ms-frame: color-mix(in srgb, var(--c-text) 17%, var(--c-bg)); }
:root[data-scheme="dark"][data-o-frame="asfalt"] { --ms-frame: color-mix(in srgb, var(--c-text) 11%, var(--c-bg)); }
:root[data-scheme="light"][data-o-frame="asfalt"] { --ms-frame: color-mix(in srgb, var(--c-text) 82%, var(--c-bg)); }
:root[data-o-frame="cihla"] { --ms-frame: var(--c-accent2); }
body { background-color: var(--ms-frame); }
/* „Zrno“ je na rámu beton: na světlém rámu tmavé zrno, na tmavém světlé */
:root[data-scheme="dark"]:not([data-o-frame="asfalt"], [data-o-frame="cihla"])[data-s-background="grain"] body::before { filter: none; opacity: .16; }
:root[data-scheme="light"][data-o-frame="asfalt"][data-s-background="grain"] body::before { filter: invert(1); opacity: .08; }

/* ---------- panely v rámu ---------- */
.mh, .footer, body:not(.page-home) > .main, .page-home .main > .home-sec, .page-home .main > .wrap:has(> .flash) {
  position: relative; margin-inline: var(--ms-in); background: var(--c-bg); color: var(--c-text); border-radius: var(--ms-r);
  box-shadow: 0 0 0 1px rgb(0 0 0 / .07), 0 1px 0 rgb(0 0 0 / .1);
}
/* jemná hrana panelu: tenká linka v barvě textu a světlý odlesk na horní hraně (výloha) */
:is(.mh, .footer, body:not(.page-home) > .main, .page-home .main > .home-sec)::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  box-shadow: inset 0 0 0 1px rgb(var(--c-text-rgb) / .09), inset 0 1px 0 rgb(255 255 255 / .05);
}
.main { margin-bottom: var(--ms-gap); }
body:not(.page-home) > .main { margin-top: var(--ms-gap); padding-bottom: calc(var(--section) * .3); }
.page-home .main > .home-sec + .home-sec, .page-home .main > .wrap + .home-sec { margin-top: var(--ms-gap); }
.page-home .main > .home-sec:first-child { margin-top: var(--ms-gap); }
.page-home .main > .wrap:has(> .flash) { max-width: none; width: auto; margin-top: var(--ms-gap); padding-block: 2px; }
.page-home .main > .wrap:has(> .flash) .flash { margin: 10px 0; border-bottom: 0; }
.page-home .main > .home-sec > :not(.sec-tools, .sec-add, .sec-panel) { margin-block: 0; }
.page-home .main > .home-sec > .section { padding-block: calc(var(--section) * .5); }
.page-home .main > .home-sec > .newsletter { background: none; }
.footer { margin: 0 var(--ms-in) var(--ms-in); }

/* panely „naopak“: tmavé panely ve světlé paletě (hlavička, patička, úvod a každý lichý panel úvodu), světlé panely
   v tmavé paletě (každý sudý panel úvodu) – barvy z palety prohozené, popisky a linky dopočítané */
:root[data-scheme="light"] :is(.mh, .footer, .page-home .main > .home-sec[data-sec="hero"]),
:root[data-scheme="light"]:not([data-o-panels="same"]) .page-home .main > .home-sec:not([data-sec-bg], [data-sec="banners"]):nth-child(odd of .home-sec:not([data-sec="banners"])),
:root[data-scheme="dark"]:not([data-o-panels="same"]) .page-home .main > .home-sec:not([data-sec-bg], [data-sec="banners"], [data-sec="hero"]):nth-child(even of .home-sec:not([data-sec="banners"])) {
  --c-bg: var(--ms-t0); --c-bg-rgb: var(--ms-t0-rgb);
  --c-text: var(--ms-b0); --c-text-rgb: var(--ms-b0-rgb);
  --c-surface: color-mix(in srgb, var(--ms-t0) 93%, var(--ms-b0));
  --c-surface-2: color-mix(in srgb, var(--ms-t0) 88%, var(--ms-b0));
  --c-muted: color-mix(in srgb, var(--ms-b0) 70%, var(--ms-t0));
  --c-line: color-mix(in srgb, var(--ms-t0) 85%, var(--ms-b0));
  --c-line-strong: color-mix(in srgb, var(--ms-t0) 70%, var(--ms-b0));
  --c-accent-ink: color-mix(in srgb, var(--c-accent) 50%, var(--ms-b0)); /* 50 %: i světlá barva značky (jantar) má na světlém panelu 4,5 : 1 – audit 1. 11. 2026 */
  --c-accent-soft: color-mix(in srgb, var(--ms-t0) 86%, var(--c-accent));
  --media-bg: color-mix(in srgb, var(--ms-t0) 88%, var(--ms-b0));
}

/* ---------- značka čárka a tečka ---------- */
.ms-mark { --mk: 8px; display: inline-block; flex: none; width: calc(var(--mk) * 7.5); height: var(--mk); background: var(--ms-mark); }
.ms-mark--sm { --mk: 4px; margin-right: 12px; vertical-align: .18em; }
:is(.section-title, .page-title, .footer-top .logo)::before {
  content: ""; --mk: .11em; display: block; width: calc(var(--mk) * 7.5); height: var(--mk); margin: 0 0 .36em; background: var(--ms-mark);
}
.home-sec:is([data-sec-align="center"], [data-sec-layout="center"]) .section-title::before { margin-inline: auto; }

/* ---------- typografie ---------- */
body { letter-spacing: .003em; }
h1, h2, h3, .section-title, .page-title, .pd-title { text-wrap: balance; }
.section-title { font-size: var(--fs-h2); }
.section-head { margin-bottom: calc(var(--gap) * 1.2); }
.section-link { color: var(--c-muted); text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; }
.section-link:hover { color: var(--c-text); }
.eyebrow { font-size: .92rem; letter-spacing: .02em; color: var(--c-muted); }
.prose p, .prose li { line-height: 1.72; }
.link { text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; }
.tag { border-radius: var(--r-sm); font-weight: 600; letter-spacing: .02em; background: var(--c-text); color: var(--c-bg); }
.tag-sale { background: var(--c-accent); color: var(--c-on-accent); }
.chip { border-bottom-color: var(--c-line-strong); }
.chip:hover, .chip.is-on { border-color: var(--c-accent); }

/* tlačítka: plná oranžová, písmo textu, jemné rohy; pod myší jen jiný odstín */
.btn { font-family: var(--font-body); font-size: .94rem; }
.btn-lg { min-height: 54px; padding: 0 30px; font-size: 1rem; }

/* ---------- hlavička: tmavý panel v rámu, menu oddělené tečkami ---------- */
.mh { position: sticky; top: 0; z-index: 40; margin-top: var(--ms-in); border-bottom: 0; transition: background-color .35s var(--ease), box-shadow .35s var(--ease), border-radius .35s; }
:root[data-s-header-sticky="off"] .mh { position: relative; }
.mh.is-scrolled { border-radius: 0 0 var(--ms-r) var(--ms-r); box-shadow: 0 0 0 1px rgb(0 0 0 / .07), 0 14px 30px -20px rgb(0 0 0 / .6); }
.mh .announce { height: var(--ms-ann-h); display: flex; align-items: center; justify-content: center; background: transparent; color: var(--c-muted);
  border-bottom: 1px solid rgb(var(--c-text-rgb) / .1); font-size: .8rem; letter-spacing: .02em; }
.mh .announce-track { padding: 0; }
:where(:root:not([data-marquee="on"])) .mh .announce-track { padding: 5px 0; line-height: 1.3; }
.mh-inner { display: flex; align-items: center; gap: clamp(20px, calc(2.6 * var(--vw, 1vw)), 40px); min-height: var(--header-h); }
.mh-logo .logo-text { font-family: var(--font-head); text-transform: uppercase; font-weight: 600; font-size: 1.5rem; letter-spacing: .015em; line-height: 1.22; } /* malý název na dva řádky: čárky nad Á nesmí sednout na řádek nad */
.mh-nav { flex: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 0; min-width: 0; }
.mh-nav > a { font-size: .95rem; color: color-mix(in srgb, var(--c-text) 80%, transparent); transition: color .2s; }
.mh-nav > a + a { margin-left: 27px; }
.mh-nav > a + a::before { content: ""; position: absolute; left: -15px; top: 50%; width: 3px; height: 3px; margin-top: -1.5px; border-radius: 50%; background: currentColor; opacity: .55; pointer-events: none; }
.mh-nav > a:hover { color: var(--c-text); }
.mh-nav > a::after { background: var(--c-accent); height: 2px; }
.mh-actions { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.mh-cta { min-height: 40px; padding: 0 18px; margin-left: 10px; font-size: .9rem; }
/* úvod s fotkou přes celou šířku jako první panel: hlavička leží přes jeho horní hranu (fotka pokračuje pod menu),
   po posunutí stránky se z ní stane tmavý pruh */
body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh:not(.is-scrolled) { background: transparent; box-shadow: none; }
body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh:not(.is-scrolled)::after { box-shadow: none; }
body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh:not(.is-scrolled) .announce { color: rgb(255 255 255 / .92); border-bottom-color: rgb(255 255 255 / .14); text-shadow: 0 1px 10px rgb(0 0 0 / .55); } /* nad světlým místem fotky (výloha, lampy) – audit 1. 11. 2026 */
body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh:not(.is-scrolled) :is(.mh-logo, .mh-nav > a, .mh-actions > .icon-btn) { color: #fff; }
body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .main { margin-top: calc(-1 * var(--mh-h)); }
body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .main > .home-sec:first-child { margin-top: 0; }
/* okno širší než 1440 px: úvod se zvětší jako celek (--hero-k, layout.php) – menu nad ním drží stejné okraje jako text úvodu */
@media (min-width: 1441px) {
  body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh > .mh-inner { max-width: calc((var(--wrap) + 2 * var(--gutter)) * var(--hero-k, 1)); padding-inline: calc(var(--gutter) * var(--hero-k, 1)); }
}

/* ---------- úvod: fotka v panelu, nad nadpisem značka, nadpis končí oranžovou tečkou ---------- */
.home-sec[data-sec="hero"] > .hero { border-radius: inherit; }
.hero { overflow: hidden; }
.ms-kicker { display: flex; align-items: center; gap: 16px; margin-bottom: clamp(18px, calc(2 * var(--vw, 1vw)), 28px); }
.ms-kicker .eyebrow { margin: 0; }
.hero-title { font-size: var(--fs-hero); line-height: 1.15; max-width: 12ch; margin-bottom: clamp(20px, calc(2 * var(--vw, 1vw)), 30px); }
.hero-title.ms-dot::after { content: "."; color: var(--c-accent); }   /* nadpis bez interpunkce končí oranžovou tečkou */
.hero-text { font-size: 1.1rem; line-height: 1.6; max-width: 31em; }
.hero--full:not(.hero--on-light) .hero-text { color: rgb(255 255 255 / .84); }
.hero--full:not(.hero--on-light) .eyebrow { color: rgb(255 255 255 / .76); }
.hero--full .hero-actions { gap: 16px 30px; }
@media (min-width: 861px) {
  .hero--full .hero-content { max-width: min(48rem, 62%); }
  .hero--full > .hero-inner { padding-top: calc(var(--mh-h) + 28px); padding-bottom: clamp(36px, calc(4 * var(--vw, 1vw)), 64px); }
  .hero:not(.hero--full) { padding-top: calc(var(--section) * .6); }
}
.hero-media { border-radius: var(--r); }

/* ---------- výhody: tři sloupce, nadpis kondenzovaně ---------- */
.page-home .main > .home-sec > .usp { padding-block: calc(var(--section) * .38); }
.usp-list { border-top: 0; }
.usp-item { padding-top: 6px; }
.usp-item + .usp-item { border-left-color: var(--c-line); }
.usp-icon { color: var(--c-accent-ink); }
.usp-item strong { font-family: var(--font-head); font-weight: 500; text-transform: uppercase; font-size: 1.28rem; letter-spacing: .01em; line-height: 1.1; margin-bottom: 6px; }

/* ---------- služby: ceník vlevo, fotka vpravo podle služby pod myší (views/home/block-services.php, theme.js) ---------- */
.ms-svc { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(32px, calc(5.6 * var(--vw, 1vw)), 90px); align-items: center; }
.ms-svc-list { display: grid; grid-template-columns: minmax(0, max-content) auto; column-gap: clamp(26px, calc(3.4 * var(--vw, 1vw)), 54px); max-width: 38rem; }
.ms-svc-list > .svc { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; padding: 16px 0 18px; border-top: 1px solid var(--c-line); }
.ms-svc-list .svc-body { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; column-gap: inherit; align-items: baseline; }
.ms-svc-list .svc-name { grid-column: 1; text-transform: none; font-weight: 500; font-size: clamp(1.45rem, calc(2.15 * var(--vw, 1vw)), 2.05rem); line-height: 1.08; transition: color .25s; }
.ms-svc-list .svc-price { grid-column: 2; font-family: var(--font-head); font-weight: 500; font-size: clamp(1.45rem, calc(2.15 * var(--vw, 1vw)), 2.05rem); line-height: 1.08; color: var(--c-text); transition: color .25s; }
.ms-svc-list .svc-desc { grid-column: 1 / -1; max-width: 40ch; margin-top: 8px; font-size: .95rem; }
.ms-svc-list > .svc.is-on :is(.svc-name, .svc-price) { color: var(--c-accent-ink); }
.ms-svc-photos { position: relative; aspect-ratio: 16 / 11; overflow: hidden; border-radius: var(--r); background: var(--media-bg); }
.ms-svc-photos > .ms-svc-photo { position: absolute; inset: 0; margin: 0; aspect-ratio: auto; border-radius: 0; opacity: 0; visibility: hidden; transition: opacity .55s var(--ease), visibility 0s linear .55s; }
.ms-svc-photos > .ms-svc-photo.is-on { opacity: 1; visibility: visible; transition: opacity .55s var(--ease), visibility 0s; }
/* sekce jádra (karty se službami nebo ceník bez fotek) */
.block-services--cards .svc-media { border-radius: var(--r); }
.block-services:not(.block-services--menu) .svc-name { text-transform: none; font-weight: 500; font-size: 1.45rem; }
.block-services--list .svc-body::after { border-bottom-color: var(--c-line-strong); }

/* ---------- tým: jména přes spodní okraj fotky ---------- */
.team-list { gap: calc(var(--gap) * .7); }
.team-member { position: relative; }
.team-media { aspect-ratio: 4 / 4.5; margin: 0; border-radius: var(--r); }
.team-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgb(0 0 0 / .72), rgb(0 0 0 / .28) 30%, rgb(0 0 0 / 0) 52%); }
.team-media:has(.ph)::after { display: none; }
.team-member:has(.team-media img) .team-body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: clamp(16px, calc(1.8 * var(--vw, 1vw)), 26px); color: #fff; }
.team-name { text-transform: none; font-weight: 500; font-size: clamp(1.4rem, calc(2.05 * var(--vw, 1vw)), 1.95rem); line-height: 1.05; }
.team-member:has(.team-media img) .team-role { color: rgb(255 255 255 / .78); }
.team-role { margin-top: 6px; font-size: .92rem; }
.team-member:not(:has(.team-media img)) .team-body { padding-top: 14px; }

/* ---------- příběh: fotka až k hraně panelu, text vedle ---------- */
.page-home .main > .home-sec:not([data-sec-space]) > .story:not(.story--text) { padding-block: 0; }
.story:not(.story--text) > .wrap { max-width: none; padding: 0; }
.story:not(.story--text) .story-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; align-items: stretch; }
.story:not(.story--text) .story-media { aspect-ratio: auto; height: 100%; min-height: clamp(420px, calc(44 * var(--vw, 1vw)), 640px); border-radius: var(--ms-r) 0 0 var(--ms-r); }
.story:not(.story--text) .story-text { align-self: center; max-width: calc(var(--wrap) / 2); padding: calc(var(--section) * .5) clamp(28px, calc(6 * var(--vw, 1vw)), 96px); }
.home-sec[data-sec-side="right"] .story:not(.story--text) .story-media { border-radius: 0 var(--ms-r) var(--ms-r) 0; }
.story-text .section-title { margin-bottom: 26px; }

/* ---------- časté dotazy, výzva, text, galerie ---------- */
.faq-item summary { font-weight: 500; font-size: clamp(1.18rem, calc(1.5 * var(--vw, 1vw)), 1.42rem); letter-spacing: .005em; }
.faq-item[open] summary { color: var(--c-accent-ink); }
.faq-ico { color: var(--c-accent-ink); }
.block-cta-inner { border-top: 0; border-bottom: 0; padding-block: 0; }
.block-cta-inner .section-title { font-size: clamp(2rem, calc(3.6 * var(--vw, 1vw)), 3.3rem); }
.gallery-item, .block-media-photo { border-radius: var(--r); }
.contact-col > .i, .stores-contact .i { color: var(--c-accent-ink); }
.store-name { font-family: var(--font-head); text-transform: uppercase; font-weight: 500; letter-spacing: .01em; font-size: 1.3rem; }
.map-box { border-radius: var(--r); }
.map-pin { color: var(--c-accent); }

/* ---------- novinky ---------- */
.newsletter-inner { gap: clamp(28px, calc(5 * var(--vw, 1vw)), 80px); }
.newsletter-inner p { max-width: 38ch; margin-top: 18px; }

/* ---------- bannery: každý banner je samostatný panel v rámu (sekce sama nemá podklad) ---------- */
.page-home .main > .home-sec[data-sec="banners"]:not([data-sec-bg]) { background: none; box-shadow: none; }
.page-home .main > .home-sec[data-sec="banners"]:not([data-sec-bg])::after { display: none; }
.page-home .main > .home-sec[data-sec="banners"]:not([data-sec-bg]) > .banners { padding: 0; }
.page-home .main > .home-sec[data-sec="banners"]:not([data-sec-bg]) > .banners > .wrap { max-width: none; padding: 0; }
.banners-grid { gap: var(--ms-gap); }
.banner { min-height: clamp(260px, calc(30 * var(--vw, 1vw)), 440px); border-radius: var(--ms-r); box-shadow: 0 0 0 1px rgb(0 0 0 / .07); }
.banner:has(.banner-img)::after { background: linear-gradient(to top, rgb(0 0 0 / .78), rgb(0 0 0 / .3) 46%, rgb(0 0 0 / .04) 78%), linear-gradient(to right, rgb(0 0 0 / .35), rgb(0 0 0 / 0) 55%); }
.banner:not([data-label]) .banner-body { padding: clamp(22px, calc(3 * var(--vw, 1vw)), 46px); gap: 10px; max-width: min(30em, 66%); }
.banners--2 .banner:not([data-label]) .banner-body, .banners--3 .banner:not([data-label]) .banner-body { max-width: min(24em, 58%); }
.banner-title { text-transform: uppercase; font-size: clamp(1.7rem, calc(2.9 * var(--vw, 1vw)), 2.7rem); line-height: 1.15; }
.banners--2 .banner-title, .banners--3 .banner-title { font-size: clamp(1.6rem, calc(2.4 * var(--vw, 1vw)), 2.3rem); }
.banner:not([data-label]) .banner-title::before { content: ""; --mk: 6px; display: block; width: calc(var(--mk) * 7.5); height: var(--mk); margin-bottom: 16px; background: var(--ms-mark); }
.banner-text { font-size: 1rem; max-width: 34ch; }
.banner:not([data-label]) .banner-cta { margin-top: 8px; text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; }
a.banner:hover .banner-cta { text-decoration-thickness: 3px; }

/* ---------- kategorie a zboží ---------- */
.cat-media { aspect-ratio: 4 / 5; border-radius: var(--r); }
.cat-name { font-weight: 500; text-transform: uppercase; font-size: 1.32rem; letter-spacing: .01em; line-height: 1.15; }
.cat-card:hover .cat-name { color: var(--c-accent-ink); text-decoration: none; }
.pc-media { border-radius: var(--r); }
.pc-name { font-weight: 600; font-size: 1rem; text-transform: none; letter-spacing: 0; }
.pc .price, .pd-price .price { font-family: var(--font-head); font-weight: 500; font-size: 1.32rem; letter-spacing: .01em; }
.pd-price .price { font-size: 2.1rem; }
.pc-add { color: var(--c-text); text-decoration-color: var(--c-accent); }
.pc-add:hover { color: var(--c-accent-ink); }
.pd-main, .pd-thumbs button { border-radius: var(--r); }
.pd-title { font-size: clamp(2.2rem, calc(3.8 * var(--vw, 1vw)), 3.4rem); }
.variant span { border-radius: var(--r-sm); }
.variant input:checked + span { border-color: var(--c-accent); outline: 1px solid var(--c-accent); outline-offset: -2px; box-shadow: none; }

/* ---------- vnitřní stránky: nadpis se značkou ---------- */
.page-head { padding-top: clamp(36px, calc(5.4 * var(--vw, 1vw)), 80px); }
.page-title { font-size: var(--fs-h1); }
.crumbs > * + *::before { content: ""; display: inline-block; width: 4px; height: 4px; margin: 0 10px 0 2px; vertical-align: .22em; border-radius: 50%; background: currentColor; opacity: .5; }
.summary, .cart-lines, .pay-box { border-top-color: var(--c-text); }
.co-block legend, .summary-title { text-transform: uppercase; font-weight: 500; }
.free-ship .bar i { background: var(--c-accent); }

/* ---------- patička: tmavý panel, velký název kondenzovaně se značkou ---------- */
.footer { padding: clamp(46px, calc(6 * var(--vw, 1vw)), 88px) 0 24px; font-size: .94rem; }
.footer-top { border-bottom-color: var(--c-line); }
.footer-top .logo .logo-text { font-family: var(--font-head); text-transform: uppercase; font-weight: 600; letter-spacing: .01em; font-size: clamp(2.4rem, calc(4.6 * var(--vw, 1vw)), 4.2rem); line-height: 1.18; }
.footer-top .logo { flex-direction: column; align-items: flex-start; }
.footer-top .logo::before { --mk: .1em; font-size: clamp(2.4rem, calc(4.6 * var(--vw, 1vw)), 4.2rem); margin-bottom: .3em; }
.footer-top .logo:has(.logo-img)::before { display: none; }
.footer-title { font-family: var(--font-head); text-transform: uppercase; font-weight: 500; letter-spacing: .05em; font-size: .92rem; color: var(--c-muted); }
.footer-links a:hover { color: var(--c-accent-ink); text-decoration-color: var(--c-accent); }
.footer-news-title { text-transform: uppercase; font-weight: 500; font-size: 1.35rem; }
.footer-bottom { margin-top: 44px; }

/* ---------- stránka Brzy otevíráme: plakát v panelu ---------- */
body.page-coming-soon > .main { margin: var(--ms-in); padding-bottom: 0; min-height: calc(100 * var(--fvh, 1vh) - 2 * var(--ms-in)); overflow: clip; }
.poster-main .hero-title::before { content: ""; --mk: .09em; display: block; width: calc(var(--mk) * 7.5); height: var(--mk); margin: 0 0 .4em; background: var(--ms-mark); }
.page-coming-soon :is(.soon, .soon-poster) { min-height: calc(100 * var(--fvh, 1vh) - 2 * var(--ms-in)); }
.poster-top .logo .logo-text { font-family: var(--font-head); text-transform: uppercase; font-weight: 600; letter-spacing: .01em; }

/* ---------- telefon ---------- */
@media (max-width: 860px) {
  :root { --header-h: 60px; --ms-ann-h: 30px; }
  .mh-inner { gap: 6px; }
  .mh .nav-toggle { margin-left: -8px; }
  /* dlouhý název webu se zalomí – nevytlačí hledání a košík za okraj (2.6.2: „Barbershop a pánská péče“ přetékal o 40 px) */
  .mh-logo { min-width: 0; flex: 0 1 auto; }
  .mh-logo .logo-text { font-size: clamp(1.05rem, calc(5.2 * var(--vw, 1vw)), 1.32rem); line-height: 1.22; overflow-wrap: normal; }
  .header .mh-logo .logo-text { line-height: 1.22; } /* silnější než .header .logo .logo-text jádra (řádkování 1,05 – čárky nad Á seděly na řádku nad) */
  .mh-cta { min-height: 36px; padding: 0 13px; margin-left: 4px; font-size: .84rem; }
  .mh-cta--shop { display: none; }
  .mh .announce { font-size: .75rem; }
  /* menu v rámu: od spodku hlavičky ke spodnímu okraji rámu */
  .mh-nav { flex-wrap: nowrap; align-items: stretch; gap: 0; inset: calc(var(--nav-top, var(--header-h)) + var(--ms-gap)) var(--ms-in) var(--ms-in); border-radius: var(--ms-r); padding-top: 18px;
    box-shadow: 0 0 0 1px rgb(var(--c-text-rgb) / .1); transform: translateY(-14px); opacity: 0; visibility: hidden; transition: transform .35s var(--ease), opacity .25s, visibility 0s .35s; }
  .mh-nav.is-open { transform: none; opacity: 1; visibility: visible; transition: transform .35s var(--ease), opacity .25s, visibility 0s; }
  .mh:has(.mh-nav.is-open) { background: var(--c-bg) !important; }
  body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh:has(.mh-nav.is-open) :is(.mh-logo, .mh-actions > .icon-btn) { color: var(--c-text); }
  .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
  .cat-body { flex-direction: column; align-items: flex-start; gap: 2px; }
  .cat-name { font-size: 1.12rem; }
  .mh-nav > a { font-size: 1.7rem; text-transform: uppercase; font-weight: 500; color: var(--c-text); }
  .mh-nav > a + a { margin-left: 0; }
  .mh-nav > a + a::before { display: none; }
  body:has(> .main > .home-sec:first-child[data-sec="hero"] > .hero--full) > .mh:not(.is-scrolled) .mh-nav > a { color: var(--c-text); }
  /* úvod: fotka za textem v panelu, text dole (výchozí), nebo fotka nad textem na tmavém pásu panelu */
  .hero-title { font-size: clamp(2.7rem, calc(13 * var(--vw, 1vw)), 4rem); max-width: none; }
  .hero-text { font-size: 1.02rem; }
  .ms-kicker { gap: 12px; margin-bottom: 18px; }
  .ms-kicker .ms-mark { --mk: 6px; }
  .ms-kicker .eyebrow { font-size: .84rem; }
  [data-s-hero-mobile="behind"] .home-sec[data-sec="hero"] .hero--full > .hero-inner { padding-top: calc(var(--mh-h) + 20px); padding-bottom: 26px; }
  :root .home-sec[data-sec="hero"] .hero.hero--full:not(.hero--on-light) { background: var(--c-bg); }
  :root:not([data-s-hero-mobile="behind"]) .home-sec[data-sec="hero"] .hero--full:not(.hero--on-light) .hero-bg::after { background: linear-gradient(to bottom, rgb(var(--c-bg-rgb) / .35), rgb(var(--c-bg-rgb) / 0) 30%, rgb(var(--c-bg-rgb) / 0) 55%, rgb(var(--c-bg-rgb))); }
  [data-s-hero-mobile="behind"] .home-sec[data-sec="hero"] .hero--full:not(.hero--on-light) .hero-bg::after { background: linear-gradient(to bottom, rgb(0 0 0 / .5), rgb(0 0 0 / .34) 22%, rgb(0 0 0 / .52) 44%, rgb(0 0 0 / .86) 74%); } /* text leží od čtvrtiny výšky – i přes postavu na fotce musí být čitelný (audit 1. 11. 2026) */
  .hero .hero-actions .btn { flex: 1 1 auto; }
  /* služby: fotka nahoře, ceník pod ní */
  .ms-svc { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .ms-svc-photos { order: -1; aspect-ratio: 4 / 3; }
  .ms-svc-list { max-width: none; }
  .ms-svc-list .svc-name, .ms-svc-list .svc-price { font-size: 1.42rem; }
  /* tým: dva vedle sebe, lichý poslední přes celou šířku na šířku */
  .team-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .team-list > .team-member:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .team-list > .team-member:last-child:nth-child(odd) .team-media { aspect-ratio: 16 / 11; }
  .team-name { font-size: 1.22rem; }
  .team-role { font-size: .84rem; margin-top: 3px; }
  .team-member:has(.team-media img) .team-body { padding: 14px; }
  /* v úzké kartě zabere jméno s rolí skoro polovinu fotky – clona musí sahat výš (audit 1. 11. 2026: role přes postavu) */
  .team-media::after { background: linear-gradient(to top, rgb(0 0 0 / .86), rgb(0 0 0 / .62) 34%, rgb(0 0 0 / 0) 66%); }
  .team-member:has(.team-media img) .team-role { color: rgb(255 255 255 / .9); }
  /* příběh: fotka nahoře přes celou šířku panelu */
  .story:not(.story--text) .story-inner { grid-template-columns: minmax(0, 1fr); }
  .story:not(.story--text) .story-media { min-height: 0; height: auto; aspect-ratio: 4 / 3.4; border-radius: var(--ms-r) var(--ms-r) 0 0; }
  .home-sec[data-sec-side="right"] .story:not(.story--text) .story-media { border-radius: var(--ms-r) var(--ms-r) 0 0; }
  .story:not(.story--text) .story-text { max-width: none; padding: 34px var(--gutter) calc(var(--section) * .5); }
  .banner { min-height: 300px; }
  .banners .banner:not([data-label]) .banner-body { max-width: none; }
  .usp-item strong { font-size: 1.15rem; }
  .footer-top .logo .logo-text, .footer-top .logo::before { font-size: clamp(2rem, calc(10 * var(--vw, 1vw)), 2.6rem); }
  body.page-coming-soon > .main { margin: var(--ms-in); }
}

@media (prefers-reduced-motion: reduce) {
  .ms-svc-photos > .ms-svc-photo, .mh, .mh-nav { transition: none; }
}