/* ============================================================
   VZ DESIGN — theme
   Převzato ze schváleného návrhu (navrh/index.html).
   Paleta: Luxury/Premium Brand (stone) · Písma: Bodoni Moda + Jost (lokálně, fonts.css)
   ============================================================ */

:root{
  --bg:        #FAFAF9;
  --ink:       #0C0A09;
  --ink-900:   #1C1917;
  --ink-800:   #292524;   /* běžný text odstavců */
  --ink-700:   #3A3633;   /* doprovodný text (perexy, odpovědi) — dřív #44403C, ztmaveno kvůli čitelnosti */
  --ink-500:   #78716C;
  --line:      #D6D3D1;
  --line-soft: #E7E5E4;
  --band:      #F2F0EC;   /* tónovaný pás pod kartou formuláře */
  --card:      #FFFFFF;
  --brass:     #CA8A04;   /* pouze linky a hover — nikdy jako text (kontrast 2,9 : 1) */
  --ok:        #166534;
  --err:       #B91C1C;

  --shell: 1560px;
  --gutter: clamp(1.25rem, 5vw, 5rem);
  --sec: clamp(5.5rem, 11vw, 10.5rem);
  --nav-h: 5.5rem;

  --serif: "Bodoni Moda", "Times New Roman", serif;
  /* Bodoni — optická osa (opsz) a řez na jednom místě. Nízké opsz = pevnější
     vlasové tahy (připomínka klienta 4. 10. 2026: tenké linky se špatně četly;
     odladěno v navrh/pisma-matrix.html). Velké nadpisy / střední texty / drobné. */
  --serif-opsz-display: 12;  --serif-wght-display: 400;
  --serif-opsz-mid:     9;   --serif-wght-mid:     500;
  --serif-opsz-small:   7;   --serif-wght-small:   500;
  --sans:  "Jost", "Helvetica Neue", Arial, sans-serif;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:var(--nav-h); }
body{
  margin:0; background:var(--bg); color:var(--ink-800);
  /* Jost 400 — řez 300 byl ve světle šedé na hraně čitelnosti (připomínka klienta) */
  font-family:var(--sans); font-weight:400; font-size:1.0625rem; line-height:1.75;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; }

:focus-visible{ outline:2px solid var(--ink); outline-offset:3px; }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip{
  position:absolute; left:var(--gutter); top:-100px; z-index:100;
  background:var(--ink); color:var(--bg); padding:.75rem 1.25rem; font-size:.85rem;
}
.skip:focus{ top:1rem; }

/* ---------- typografie ----------
   Bodoni je didone. `font-optical-sizing:auto` vytáhne osu ve velkém
   nadpisu skoro na 96, kde jsou vlásečnice kreslené pro plakát a česká
   diakritika mizí — proto osu zamykáme nízko (hodnoty v --serif-opsz-*). */
h1,h2,h3{
  font-family:var(--serif); color:var(--ink);
  letter-spacing:-.015em; line-height:1.02; margin:0;
  font-optical-sizing:none;
}
h1{
  font-size:clamp(2.75rem, 7.4vw, 7rem);
  font-weight:var(--serif-wght-display); font-variation-settings:"opsz" var(--serif-opsz-display);
}
h2{
  font-size:clamp(2rem, 4.6vw, 4.25rem); line-height:1.06;
  font-weight:var(--serif-wght-display); font-variation-settings:"opsz" var(--serif-opsz-display);
}
h3{
  font-size:clamp(1.35rem, 1.9vw, 1.75rem); line-height:1.15;
  font-weight:var(--serif-wght-mid); font-variation-settings:"opsz" var(--serif-opsz-mid);
}
p{ margin:0 0 1.15em; max-width:62ch; }

.eyebrow{
  font-family:var(--sans); font-weight:500; font-size:.7rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500);
  margin:0 0 1.75rem;
}
.num{
  font-family:var(--serif); font-size:.95rem; color:var(--ink-500);
  letter-spacing:.06em; font-variant-numeric:lining-nums;
  font-weight:var(--serif-wght-small); font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-small);
}

/* ---------- layout ---------- */
.shell{ max-width:var(--shell); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:var(--sec); }
.section--flush{ padding-top:0; }
.grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter); }

/* ---------- odkaz se šipkou ---------- */
.arrow{
  display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--sans); font-weight:400; font-size:.875rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink);
  padding:.85rem 0; min-height:44px; cursor:pointer;
  border-bottom:1px solid var(--line);
  transition:border-color .25s var(--ease), color .25s var(--ease);
}
.arrow svg{ width:22px; height:8px; transition:transform .3s var(--ease); }
.arrow:hover{ border-bottom-color:var(--brass); }
.arrow:hover svg{ transform:translateX(7px); }

/* ============================================================
   NAVIGACE
   ============================================================ */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  gap:2rem; padding:1.5rem var(--gutter);
  color:var(--ink);
  transition:background-color .4s var(--ease), padding .4s var(--ease), box-shadow .4s var(--ease);
}
.nav.is-solid{
  background:var(--bg); padding-block:1rem;
  box-shadow:0 1px 0 var(--line);
}
.brand{ display:inline-flex; align-items:center; flex:none; position:relative; }
/* Malé textové odkazy: dotyková plocha aspoň ~44 px, vzhled beze změny */
.brand::after, .contact__info dd a::after, .case__facts dd a::after, .faqp__tel::after{
  content:""; position:absolute; inset:-.7rem -.35rem;
}
.contact__info dd a, .case__facts dd a, .faqp__tel{ position:relative; }
.brand__mark{ display:block; height:32px; width:auto; flex:none; }
.brand__type{
  font-family:var(--serif); font-size:1.4rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:var(--serif-wght-small); font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-small);
}
.nav-links{
  display:flex; gap:2.25rem; list-style:none; margin:0; padding:0;
  font-size:.8rem; letter-spacing:.17em; text-transform:uppercase; font-weight:400;
}
.nav-links a{ position:relative; display:block; padding:.6rem 0; white-space:nowrap; }
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:.35rem; height:1px; width:0;
  background:currentColor; transition:width .3s var(--ease);
}
.nav-links a:hover::after,
.nav-links a[aria-current="page"]::after{ width:100%; }
.nav-tel{
  font-size:.8rem; letter-spacing:.14em; white-space:nowrap;
  border:1px solid currentColor; padding:.7rem 1.35rem; min-height:44px;
  display:inline-flex; align-items:center;
  transition:background-color .3s var(--ease), color .3s var(--ease);
}
.nav-tel:hover{ background:var(--ink); color:var(--bg); }
.nav-end{ display:flex; align-items:center; gap:1.25rem; }

/* Sociální sítě — tenké ikony, v hlavičce vlevo od telefonu a v patičce */
.social{ display:flex; list-style:none; margin:0; padding:0; }
.social a{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:44px; transition:color .3s var(--ease), opacity .3s var(--ease);
}
.social svg{ display:block; transition:transform .3s var(--ease); }
.social a:hover svg{ transform:translateY(-2px); }
.nav-social a:hover{ color:var(--brass); }
.footer__social{ margin-left:-11px; color:var(--ink-500); }
.footer__social a:hover{ color:var(--ink); }

/* Postupné rozostření pod průhlednou hlavičkou — nahoře rozmazané, směrem dolů
   se fotka zaostřuje. Linie v obrazu (rám okna) pak nesplývají s tenkým písmem
   a rámečkem telefonu, a to pro jakoukoli hero fotku.
   Dvě vrstvy: silnější blur jen nahoře + slabší, který sahá níž → plynulý přechod
   bez „schodu", který dělá jediná vrstva s maskou. */
.nav::before, .nav::after{
  content:""; position:absolute; left:0; right:0; top:0; z-index:-1; pointer-events:none;
  transition:opacity .4s var(--ease);
}
.nav::before{
  bottom:0;
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  -webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 40%, transparent 100%);
          mask-image:linear-gradient(to bottom, #000 0%, #000 40%, transparent 100%);
}
.nav::after{
  bottom:-3rem;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  -webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 55%, transparent 100%);
          mask-image:linear-gradient(to bottom, #000 0%, #000 55%, transparent 100%);
}
/* Mobil: fotka v heru je nízká (16:9, ~210 px) — rozostření jen za lištou, ne přes půl fotky */
@media (max-width:900px){
  .nav::before{
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    -webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 25%, transparent 85%);
            mask-image:linear-gradient(to bottom, #000 0%, #000 25%, transparent 85%);
  }
  .nav::after{
    bottom:-.75rem;
    -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  }
}
/* Plná hlavička (po odscrollování, vnitřní stránky) rozostření nepotřebuje */
.nav.is-solid::before, .nav.is-solid::after{ opacity:0; }
.nav-toggle{ display:none; background:none; border:0; cursor:pointer; color:inherit;
  font-size:.8rem; letter-spacing:.17em; text-transform:uppercase; padding:.75rem 0; min-height:44px; }
.nav-meta{ display:none; }

/* Vnitřní stránky: pevná hlavička je hned plná, obsah začíná pod ní */
.is-inner #obsah{ padding-top:var(--nav-h); }

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; height:100svh; min-height:600px; overflow:hidden; }
.hero--plain{ height:auto; min-height:70svh; }
.hero__img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  /* poloha z Nastavení firmy (posuvníky hero_pos_x/y), výchozí 60 % — tmavý
     obraz v rámu odjede zpod logotypu (kontrast 4,9 → 11,5 : 1) */
  object-position:var(--hero-pos, 60% 50%);
  transform:scale(1.06); animation:heroIn 2.4s var(--ease) forwards;
}
@keyframes heroIn{ to{ transform:scale(1); } }
/* Světlý závoj — nahoře kvůli navigaci, dole kvůli nadpisu (naměřeno 11–15 : 1). */
.hero:not(.hero--plain)::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(250,250,249,.75) 0%,
    rgba(250,250,249,0)  22%,
    rgba(250,250,249,0)  52%,
    rgba(250,250,249,.62) 100%);
}
.hero__body{
  position:absolute; inset:auto 0 0 0; z-index:2; color:var(--ink-700);
  padding:0 var(--gutter) clamp(2.5rem,6vh,5rem);
  max-width:var(--shell); margin-inline:auto;
  display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter);
  align-items:end;
}
.hero h1{ color:var(--ink); grid-column:1/8; }
.hero h1 em{ font-style:italic; }
.hero__side{ grid-column:9/13; padding-bottom:.6rem; }
/* perex leží přes fotku (pohovka) → tmavší než běžný text: 1024×768 naměřeno 4,1 → ~6,9 : 1 */
.hero__side p{ color:var(--ink-900); font-size:1rem; margin-bottom:1.5rem; }

/* ============================================================
   PŘÍSTUP (manifest)
   ============================================================ */
.manifest .eyebrow{ grid-column:1/4; }
.manifest__h{ grid-column:4/11; }
.manifest__h h2{ margin-bottom:2.5rem; }
.manifest__cols{ grid-column:4/11; display:grid; grid-template-columns:1fr 1fr; gap:var(--gutter); }

/* ============================================================
   REALIZACE
   ============================================================ */
.work__head{ align-items:end; margin-bottom:clamp(3rem,6vw,6rem); }
.work__head h2{ grid-column:1/8; }
.work__head .work__note{ grid-column:9/13; }
.work__note .eyebrow{ margin-bottom:.75rem; }
.work__note p:last-child{ font-size:.98rem; }

/* „Rytmus" (výběr 8. 10. 2026): v každé řadě stejně vysoké fotky, střídá se široká a úzká
   (8+4, 4+8, 6+6). Řada se natáhne podle nejdelšího názvu → linky pod realizacemi drží
   v jedné výšce, i když se jeden název zalomí. Výběr a pořadí: admin → Reference. */
.work__list{
  display:grid; grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(1rem,2vw,1.75rem); row-gap:clamp(2.75rem,5vw,4.5rem);
}
.item{ display:flex; flex-direction:column; cursor:pointer; }
.item__frame{ position:relative; overflow:hidden; background:var(--line-soft); height:clamp(15rem,31vw,33rem); }
.item__frame img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .9s var(--ease);
}
.item:hover .item__frame img{ transform:scale(1.04); }
.item__meta{ display:flex; gap:1rem; align-items:baseline; margin:1.1rem 0; }
.item__meta h3{ transition:color .25s var(--ease); text-wrap:balance; }
.item:hover h3{ color:var(--ink-700); }
.item__sub{
  font-size:.78rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-500); margin:.55rem 0 0;
}
.item__line{ height:1px; background:var(--line); margin-top:auto; transition:background-color .35s var(--ease); }
.item:hover .item__line{ background:var(--brass); }

.item--a{ grid-column:1/9; }
.item--b{ grid-column:9/13; }
.item--c{ grid-column:1/5; }
.item--d{ grid-column:5/13; }
.item--e{ grid-column:1/7; }
.item--f{ grid-column:7/13; }
/* lichý počet vybraných → poslední přes celou šířku, ať řada nezůstane poloprázdná */
.item:last-child:nth-child(odd){ grid-column:1/13; }

/* výzva: štítek „Zobrazit realizaci" vyjede z fotky + šipka u názvu (viditelná i na dotyku) */
.item__cta{
  position:absolute; left:0; bottom:0; z-index:2; display:inline-flex; align-items:center; gap:.7rem;
  padding:.85rem 1.1rem; background:var(--bg); color:var(--ink);
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  transform:translateY(101%); transition:transform .45s var(--ease);
}
.item__cta svg{ width:22px; height:8px; }
.item:hover .item__cta, .item:focus-visible .item__cta{ transform:none; }
.item__go{ margin-left:auto; flex:none; color:var(--ink-500); transition:transform .35s var(--ease), color .25s var(--ease); }
.item__go svg{ width:22px; height:8px; display:block; }
.item:hover .item__go{ transform:translateX(5px); color:var(--ink); }

.work__more{ margin-top:clamp(4rem,8vw,7rem); display:flex; justify-content:center; }
.work__count{ font-family:var(--serif); letter-spacing:.04em; color:var(--ink-500); font-variation-settings:"opsz" var(--serif-opsz-small); }

@media (max-width:900px){
  .work__list{ grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:.9rem; row-gap:2.25rem; }
  .item__meta h3{ overflow-wrap:break-word; hyphens:auto; }
  /* mobil: první přes celou šířku, pak dvojice; při sudém počtu zbyde poslední → také přes celou šířku */
  .work__list .item, .work__list .item:last-child:nth-child(odd){ grid-column:auto; }
  .work__list .item--a, .work__list .item:last-child:nth-child(even){ grid-column:1/3; }
  .item__frame{ height:auto; aspect-ratio:4/5; }
  .item--a .item__frame, .item:last-child:nth-child(even) .item__frame{ aspect-ratio:3/2; }
  .item__meta .num{ display:none; }
  .item__meta h3{ font-size:1.02rem; line-height:1.25; }
  .item--a .item__meta h3, .item:last-child:nth-child(even) .item__meta h3{ font-size:1.2rem; }
  .item__sub{ font-size:.7rem; letter-spacing:.08em; }
  .item__cta{ display:none; }
}

/* ============================================================
   PÁS S TEXTUROU
   ============================================================ */
.band{ position:relative; min-height:60svh; display:grid; place-items:center; overflow:hidden; }
.band img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.band::after{ content:""; position:absolute; inset:0; background:rgba(12,10,9,.5); }
.band__quote{
  position:relative; z-index:2; color:#fff; text-align:center; margin:0;
  padding:clamp(4rem,10vw,8rem) var(--gutter); max-width:22ch;
  /* kurzíva na fotce — o stupínek robustnější než nadpisy na bílé */
  font-family:var(--serif); font-style:italic; font-weight:calc(var(--serif-wght-display) + 50);
  font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-display);
  font-size:clamp(1.6rem,3.6vw,3.25rem); line-height:1.18; letter-spacing:-.01em;
}

/* ============================================================
   MATERIÁLY
   ============================================================ */
.mat__head h2{ grid-column:1/7; }
.mat__head p{ grid-column:8/13; align-self:end; }
.mat__grid{ margin-top:clamp(3rem,6vw,5.5rem); display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gutter); }
.mat__card{ display:flex; flex-direction:column; align-items:flex-start; }
.mat__card:nth-child(2){ margin-top:clamp(0rem,4vw,4rem); }
.mat__card:nth-child(3){ margin-top:clamp(0rem,8vw,8rem); }
.mat__frame{ display:block; width:100%; overflow:hidden; background:var(--line-soft); aspect-ratio:4/5; }
.mat__frame img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.mat__card:hover .mat__frame img{ transform:scale(1.04); }
.mat__card h3{ margin:1.75rem 0 .85rem; }
.mat__card p{ font-size:.98rem; margin-bottom:1.25rem; }
.mat__spec{
  list-style:none; margin:0 0 1.5rem; padding:0; width:100%;
  font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-500);
}
.mat__spec li{ padding:.6rem 0; border-top:1px solid var(--line-soft); }
.mat__card .arrow{ margin-top:auto; }

/* ============================================================
   POSTUP
   ============================================================ */
.steps{ background:var(--ink); color:rgba(250,250,249,.72); }
.steps h2{ color:var(--bg); grid-column:1/7; }
.steps__eyebrow{ grid-column:1/13; color:rgba(250,250,249,.5); margin-bottom:0; }
.steps__intro{ grid-column:8/13; align-self:end; }
.steps__list{ list-style:none; padding:0; margin:clamp(3rem,6vw,5rem) 0 0; border-top:1px solid rgba(250,250,249,.16); }
.step{
  display:grid; grid-template-columns:5rem 1fr 1.2fr; gap:var(--gutter);
  padding:clamp(1.75rem,3vw,2.5rem) 0; border-bottom:1px solid rgba(250,250,249,.16);
  align-items:baseline;
}
.step .num{ color:rgba(250,250,249,.55); }
.step h3{ color:var(--bg); font-size:clamp(1.2rem,1.7vw,1.6rem); }
.step p{ margin:0; font-size:.98rem; }
/* Dokumenty k zakázce — dovětek pod kroky, záměrně bez čísla (připomínka klienta) */
.steps__docs{
  display:grid; grid-template-columns:5rem 1fr 1.2fr; gap:var(--gutter);
  padding-top:clamp(1.75rem,3vw,2.5rem); align-items:baseline;
}
.steps__docs-label{
  grid-column:2/3; margin:0;
  font-family:var(--sans); font-weight:500; font-size:.7rem;
  letter-spacing:.24em; text-transform:uppercase; color:rgba(250,250,249,.5);
}
.steps__docs ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.4rem 0; }
.steps__docs li{
  font-family:var(--serif); font-style:italic; font-size:clamp(1.05rem,1.3vw,1.2rem); color:var(--bg);
  font-weight:var(--serif-wght-mid); font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-mid);
}
.steps__docs li + li::before{ content:""; display:inline-block; width:1px; height:.9em; margin:0 1.1rem; vertical-align:-.1em; background:rgba(250,250,249,.3); }

/* ============================================================
   ČASTÉ DOTAZY (theme/partials/faq.php — homepage i stránka /caste-dotazy)
   Nativní <details>: funguje bez JS, klávesnicí i odečítačem.
   ============================================================ */
.faq-sec__head{ grid-column:1/5; align-self:start; position:sticky; top:calc(var(--nav-h) + 2rem); }
.faq-sec__head h2{ margin-bottom:1.75rem; }
.faq-sec__head p{ font-size:.98rem; }
.faq-sec__list{ grid-column:6/13; }

.faq{ border-top:1px solid var(--line); }
.faq__item{ border-bottom:1px solid var(--line); }
.faq__q{
  list-style:none; cursor:pointer;
  display:flex; justify-content:space-between; align-items:baseline; gap:2rem;
  padding:1.6rem 0; min-height:44px;
  font-family:var(--serif); color:var(--ink); line-height:1.3;
  font-size:clamp(1.15rem,1.6vw,1.45rem); font-weight:var(--serif-wght-mid);
  font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-mid);
}
.faq__q::-webkit-details-marker{ display:none; }
.faq__q:focus-visible{ outline-offset:6px; }
/* plus → mínus: dvě linky, svislá se při otevření sklopí */
.faq__icon{ position:relative; flex:none; width:14px; height:14px; top:-.1em; }
.faq__icon::before, .faq__icon::after{
  content:""; position:absolute; left:0; top:50%; width:100%; height:1px; background:currentColor;
  transition:transform .35s var(--ease), background-color .25s var(--ease);
}
.faq__icon::after{ transform:rotate(90deg); }
.faq__item[open] .faq__icon::after{ transform:rotate(0deg); }
.faq__q:hover .faq__icon::before, .faq__q:hover .faq__icon::after{ background:var(--brass); }
.faq__a{ padding:0 3rem 1.9rem 0; color:var(--ink-700); }
.faq__a p{ margin:0 0 1em; }
.faq__a ul{ margin:0 0 1em; padding-left:1.1rem; }
.faq__a li{ margin:.25rem 0; }
.faq__a > :last-child{ margin-bottom:0; }
.faq__a strong{ font-weight:500; color:var(--ink); }
.faq__a a{ color:var(--ink); border-bottom:1px solid var(--line); transition:border-color .25s var(--ease); }
.faq__a a:hover{ border-bottom-color:var(--brass); }
.faq__link{
  display:inline-flex; align-items:center; gap:.5rem; margin-top:.6rem; padding:.75rem 0; min-height:44px;
  background:none; border:0; cursor:pointer;
  font:inherit; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-500);
  transition:color .25s var(--ease);
}
.faq__link::before{
  content:""; width:14px; height:14px; flex:none; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M10 14a4 4 0 0 0 5.66 0l3-3a4 4 0 0 0-5.66-5.66l-1 1M14 10a4 4 0 0 0-5.66 0l-3 3a4 4 0 0 0 5.66 5.66l1-1'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M10 14a4 4 0 0 0 5.66 0l3-3a4 4 0 0 0-5.66-5.66l-1 1M14 10a4 4 0 0 0-5.66 0l-3 3a4 4 0 0 0 5.66 5.66l1-1'/%3E%3C/svg%3E") center/contain no-repeat;
}
.faq__link:hover, .faq__link.is-done{ color:var(--ink); }

/* ---------- Stránka /faq — vlevo úvod, témata a dotaz, vpravo hledání a otázky ---------- */
.faqp{
  display:grid; grid-template-columns:repeat(12,1fr); gap:0 var(--gutter); align-items:start;
  padding-block:clamp(3.5rem,7vw,6.5rem) var(--sec);
}
.faqp__side{ grid-column:1/5; }
/* levý sloupec drží při čtení jen tam, kde se celý vejde na výšku */
@media (min-height:820px){ .faqp__side{ position:sticky; top:calc(var(--nav-h) + 2rem); } }
.faqp__head h1{ font-size:clamp(2.6rem,5vw,4.5rem); }
.faqp__intro{ margin-top:1.5rem; font-size:.98rem; color:var(--ink-700); }
.faqp__intro p{ margin:0 0 .8em; }
.faqp__intro a{ color:var(--ink); border-bottom:1px solid var(--line); }
.faqp__intro a:hover{ border-bottom-color:var(--brass); }
.faqp__topics{ display:flex; flex-direction:column; margin-top:2.25rem; border-top:1px solid var(--line); }
.faqp__topics a{
  display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  padding:.8rem 0; border-bottom:1px solid var(--line-soft);
  font-size:.95rem; color:var(--ink-700); transition:color .25s var(--ease), padding .3s var(--ease);
}
.faqp__topics small{ font-size:.75rem; color:var(--ink-500); font-variant-numeric:tabular-nums; }
.faqp__topics a:hover{ color:var(--ink); }
.faqp__topics a.is-current{ color:var(--ink); padding-left:.9rem; box-shadow:inset 2px 0 0 var(--brass); }
.faqp__topics a.is-empty{ opacity:.35; pointer-events:none; }
.faqp__ask{ margin-top:2.5rem; padding:1.6rem 1.5rem; background:var(--line-soft); }
.faqp__ask .eyebrow{ margin-bottom:.75rem; }
.faqp__ask p{ margin:0 0 1.25rem; font-size:.95rem; color:var(--ink-700); }
.faqp__ask-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1.5rem; }
.faqp__tel{ font-size:.95rem; border-bottom:1px solid var(--line); }
.faqp__tel:hover{ border-bottom-color:var(--brass); }

.faqp__main{ grid-column:6/13; }
.faqp__search{
  position:relative; display:flex; align-items:center; gap:.85rem;
  border-bottom:1px solid var(--ink); color:var(--ink-500);
}
.faqp__search svg{ flex:none; }
.faqp__search input{
  flex:1; min-width:0; padding:1rem 0; min-height:52px; border:0; background:transparent;
  font:400 1.0625rem/1.4 var(--sans); color:var(--ink); -webkit-appearance:none; appearance:none;
}
.faqp__search input::placeholder{ color:var(--ink-500); opacity:.75; }
.faqp__search input:focus{ outline:none; }
.faqp__search:focus-within{ color:var(--ink); box-shadow:0 1px 0 var(--ink); }
.faqp__search input::-webkit-search-cancel-button{ cursor:pointer; }
.faqp__count{ min-height:1.5rem; margin:.75rem 0 0; font-size:.8rem; color:var(--ink-500); }
.faqp__group{ margin-top:clamp(2rem,4vw,3rem); scroll-margin-top:calc(var(--nav-h) + 1.5rem); }
.faqp__group:first-of-type{ margin-top:1.25rem; }
.faqp__topic{
  margin:0 0 .25rem; font-family:var(--sans); font-weight:400;
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500);
}
.faqp__main .faq__item{ scroll-margin-top:calc(var(--nav-h) + 1.5rem); }
.faqp__main .faq__item.is-target .faq__q span:first-child{ box-shadow:inset 0 -1px 0 var(--brass); }
.faqp__empty{ margin-top:2.5rem; padding:2rem 0; border-top:1px solid var(--line); }
.faqp__empty p{ margin:0 0 1.25rem; color:var(--ink-700); }

@media (max-width:1024px){
  /* pod sebou: nadpis + úvod, témata jako štítky, hledání, otázky, na konec dotaz */
  .faqp{ display:flex; flex-direction:column; }
  .faqp__side{ display:contents; }
  .faqp__head{ order:1; }
  .faqp__topics{
    order:2; flex-direction:row; flex-wrap:wrap; gap:.5rem; margin-top:1.75rem; border:0;
  }
  .faqp__topics a{
    padding:.6rem .95rem; min-height:44px; border:1px solid var(--line); font-size:.85rem; gap:.5rem; color:var(--ink-800);
  }
  .faqp__topics a.is-current{ padding-left:.9rem; box-shadow:none; border-color:var(--ink); }
  .faqp__main{ order:3; width:100%; margin-top:2rem; }
  .faqp__ask{ order:4; margin-top:3rem; }
}
/* plynulé rozbalení tam, kde to prohlížeč umí (Chrome 131+); jinde se jen otevře */
@supports selector(::details-content){
  :root{ interpolate-size:allow-keywords; }
  .faq__item::details-content{ height:0; overflow:hidden; transition:height .45s var(--ease), content-visibility .45s allow-discrete; }
  .faq__item[open]::details-content{ height:auto; }
}

/* ============================================================
   KONTAKT
   ============================================================ */
.contact h2{ grid-column:1/6; }
.contact__info{ grid-column:1/6; margin-top:2.5rem; }
.contact__info dl{ margin:0; }
.contact__info dt{
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500);
  padding-top:1.5rem; border-top:1px solid var(--line-soft); margin-top:1.5rem;
}
.contact__info dt:first-child{ margin-top:0; }
.contact__info dd{ margin:.5rem 0 0; font-size:1.15rem; color:var(--ink); }
.contact__info dd a{ border-bottom:1px solid var(--line); padding-bottom:2px; transition:border-color .25s var(--ease); }
.contact__info dd a:hover{ border-bottom-color:var(--brass); }
.contact__form{ grid-column:7/13; grid-row:1 / span 2; align-self:start; }

/* ---------- formulář z jádra (App\ContactForm) ----------
   Značky generuje skeleton — tady je jen vzhled podle návrhu. */
.contact-form{ margin:0; }
.contact-form .cf-row{ display:grid; grid-template-columns:1fr 1fr; gap:0 var(--gutter); }
.contact-form label{
  display:block; margin-bottom:2rem;
  font-size:.7rem; font-weight:400; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500);
}
.contact-form input:not([type="checkbox"]),
.contact-form textarea,
.contact-form select{
  display:block; width:100%; margin-top:.6rem;
  background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0;
  padding:.85rem 0; min-height:48px;
  font:400 1.0625rem/1.5 var(--sans); letter-spacing:normal; text-transform:none; color:var(--ink);
  -webkit-appearance:none; appearance:none;
  transition:border-color .25s var(--ease);
}
.contact-form textarea{ resize:vertical; min-height:120px; line-height:1.6; }
.contact-form select{
  cursor:pointer; padding-right:1.75rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2378716C' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right .25rem center / 12px 8px;
}
/* S JS se select nahradí vlastním výběrem (site.js) a zůstane jen skrytě ve formuláři */
.contact-form select.is-enhanced{
  position:absolute; width:1px; height:1px; min-height:0; margin:0; padding:0;
  opacity:0; pointer-events:none;
}
.cselect{ position:relative; margin-top:.6rem; }
.cselect__btn{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%;
  background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0;
  padding:.85rem .25rem .85rem 0; min-height:48px; cursor:pointer; text-align:left;
  font:400 1.0625rem/1.5 var(--sans); letter-spacing:normal; text-transform:none; color:var(--ink);
  transition:border-color .25s var(--ease);
}
.cselect__btn.is-empty .cselect__val{ color:var(--ink-500); }
.cselect__btn svg{ flex:none; color:var(--ink-500); transition:transform .3s var(--ease); }
.cselect__btn:hover svg, .cselect.is-open .cselect__btn svg{ color:var(--ink); }
.cselect.is-open .cselect__btn svg{ transform:rotate(180deg); }
.cselect__btn:focus-visible, .cselect.is-open .cselect__btn{ outline:none; border-bottom-color:var(--ink); }
.cselect__btn.is-invalid{ border-bottom-color:var(--err); }
.cselect__list{
  position:absolute; z-index:30; left:0; right:0; top:100%;
  margin:0; padding:.5rem 0; list-style:none;
  background:var(--bg); border:1px solid var(--line); border-top:0;
  box-shadow:0 24px 48px -28px rgba(12,10,9,.35);
  max-height:19rem; overflow:auto; outline:none;
  animation:cselect-in .22s var(--ease);
}
@keyframes cselect-in{ from{ opacity:0; transform:translateY(-6px); } }
.cselect__list [role="option"]{
  position:relative; padding:.8rem 1.25rem; cursor:pointer;
  font:400 1rem/1.4 var(--sans); letter-spacing:normal; text-transform:none; color:var(--ink-700);
  transition:background-color .15s, color .15s;
}
.cselect__list [role="option"].is-active{ background:var(--line-soft); color:var(--ink); }
.cselect__list [role="option"][aria-selected="true"]{ color:var(--ink); font-weight:400; }
.cselect__list [role="option"][aria-selected="true"]::before{
  content:""; position:absolute; left:0; top:.55rem; bottom:.55rem; width:2px; background:var(--brass);
}
@media (prefers-reduced-motion:reduce){ .cselect__list{ animation:none; } }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus{
  outline:none; border-bottom-color:var(--ink);
}
.contact-form input::placeholder{ color:var(--ink-500); opacity:.6; }

/* Doplňková pole (theme/contact-fields.php) — jednotka za číslem (m²) */
.cf-suffix{ position:relative; display:block; }
.contact-form .cf-suffix input{ padding-right:2.5rem; }
.cf-suffix__unit{
  position:absolute; right:.25rem; bottom:calc(.85rem + 1px);
  font:400 1.0625rem/1.5 var(--sans); letter-spacing:normal; text-transform:none; color:var(--ink-500);
  pointer-events:none;
}

/* Přílohy (fotky podkladu) */
.cf-files{ margin-bottom:2rem; }
.cf-files__title{
  display:block; font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500);
}
.contact-form .cf-files__pick{ display:inline-block; position:relative; margin:1rem 0 0; }
.cf-files__input{
  position:absolute; width:1px; height:1px; opacity:0; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
}
.cf-files__btn{
  display:inline-flex; align-items:center; gap:.7rem; min-height:48px; padding:.8rem 1.4rem;
  border:1px solid var(--ink); cursor:pointer;
  font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink);
  transition:background-color .3s var(--ease), color .3s var(--ease);
}
.cf-files__btn::before{
  content:""; width:14px; height:14px; flex:none;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") center/contain no-repeat;
}
.cf-files__pick:hover .cf-files__btn{ background:var(--ink); color:var(--bg); }
.cf-files__input:focus-visible + .cf-files__btn{ outline:2px solid var(--brass); outline-offset:3px; }
.cf-files__hint{ display:block; margin-top:.8rem; font-size:.85rem; line-height:1.55; color:var(--ink-500); }
.cf-files__list{ list-style:none; margin:.75rem 0 0; padding:0; }
.cf-files__list:empty{ display:none; }
.cf-files__item{
  display:flex; align-items:baseline; gap:1rem; padding:.7rem 0; border-bottom:1px solid var(--line-soft);
  font-size:.95rem; font-weight:400; color:var(--ink);
}
.cf-files__name{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cf-files__size{ flex:none; font-size:.8rem; color:var(--ink-500); }
.cf-files__remove{
  flex:none; background:none; border:0; padding:.25rem 0; cursor:pointer;
  font:inherit; font-size:.8rem; color:var(--ink-500); text-decoration:underline; text-underline-offset:3px;
}
.cf-files__remove:hover{ color:var(--ink); }
.cf-files .cf-hint{ margin-top:.75rem; }

.contact-form .cf-consent{
  display:flex; gap:.8rem; align-items:flex-start;
  font-size:.85rem; letter-spacing:normal; text-transform:none; color:var(--ink-700); line-height:1.55;
}
.contact-form .cf-consent input{ width:20px; height:20px; margin:.15rem 0 0; flex:none; accent-color:var(--ink); }
.contact-form .cf-submit{
  display:inline-flex; align-items:center; gap:.9rem; cursor:pointer;
  background:var(--ink); color:var(--bg); border:1px solid var(--ink); border-radius:0;
  padding:1.15rem 2.25rem; min-height:52px;
  font-size:.82rem; letter-spacing:.2em; text-transform:uppercase; font-weight:400;
  transition:background-color .3s var(--ease), color .3s var(--ease);
}
.contact-form .cf-submit:hover{ background:transparent; color:var(--ink); }
.contact-form .hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
/* Počítadlo znaků zprávy (jádro ho ukáže od 80 % limitu) */
.cf-count{
  display:block; margin-top:.5rem; text-align:right;
  font-size:.8rem; letter-spacing:normal; text-transform:none; color:var(--ink-500);
  font-variant-numeric:tabular-nums;
}
.cf-count.is-full{ color:var(--err); }
.cf-count[hidden]{ display:none; }   /* display:block výš by jinak skrytí přebil */
.cf-hint{ display:block; margin-top:.5rem; font-size:.8rem; letter-spacing:normal; text-transform:none; color:var(--ink-700); }
.cf-hint.is-warn{ color:var(--err); }
.cf-fix{ background:none; border:0; padding:0; text-decoration:underline; cursor:pointer; color:var(--ink); }
.contact-note{
  display:flex; gap:.9rem; align-items:flex-start;
  padding:1.25rem 1.4rem; margin:0 0 2rem; border:1px solid currentColor;
  font-size:.95rem; line-height:1.55;
}
.contact-note .cn-ico{ flex:none; margin-top:.15rem; }
.contact-note strong{ display:block; font-weight:500; }
.contact-ok{ color:var(--ok); }
.contact-err{ color:var(--err); }

/* ============================================================
   PATIČKA
   ============================================================ */
.footer{ padding-block:clamp(3rem,5vw,4.5rem) 2rem; border-top:1px solid var(--line); }
.footer__in{ display:flex; flex-wrap:wrap; gap:2rem 3rem; justify-content:space-between; align-items:flex-start; }
.footer__brand{ display:flex; flex-direction:column; align-items:flex-start; gap:.9rem; }
.footer__place{ font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500); }
.footer small{ font-size:.78rem; letter-spacing:.1em; color:var(--ink-500); }
.footer nav{ display:flex; gap:.5rem 2rem; flex-wrap:wrap; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; }
.footer nav a{ padding:.35rem 0; }
@media (max-width:900px){ .footer nav{ gap:0 1.75rem; } .footer nav a{ padding:.8rem 0; } }
.footer nav a:hover{ color:var(--ink); }
.footer__legal{
  display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between; align-items:center;
  margin-top:clamp(2.5rem,4vw,3.5rem); padding-top:1.5rem; border-top:1px solid var(--line-soft);
}
.footer__legal small{ letter-spacing:.04em; }

/* Kredit „Webové stránky vytvořilo Printago" (Helpers::printagoCredit) */
.pg-credit{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.72rem; letter-spacing:.06em; color:var(--ink-500);
  opacity:.85; transition:opacity .2s var(--ease);
}
.pg-credit:hover{ opacity:1; }
.pg-credit img{ height:14px; width:auto; }
.pg-credit{ position:relative; }
.pg-credit::after{ content:""; position:absolute; inset:-.75rem 0; }

/* ============================================================
   COOKIE LIŠTA (App\Consent) — sjednocení se vzhledem webu.
   Jádro dává primárnímu tlačítku bílý text na akcentu → mosaz 2,9 : 1,
   proto tlačítka i odkaz přebarvujeme na inkoust.
   ============================================================ */
body .cookie-bar{ border-radius:0; border-color:var(--line); box-shadow:0 18px 50px rgba(12,10,9,.16); font-family:var(--sans); color:var(--ink-700); }
body .cookie-text strong{ font-family:var(--serif); font-weight:var(--serif-wght-mid); font-size:1.15rem; color:var(--ink); font-variation-settings:"opsz" var(--serif-opsz-mid); }
body .cookie-text p{ color:var(--ink-700); }
body .cookie-text a{ color:var(--ink) !important; text-decoration:underline; }
body .cookie-actions button{
  border-radius:0; background:transparent; border-color:var(--ink); color:var(--ink);
  font-weight:400; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; padding:.8rem 1.2rem; min-height:44px;
}
body .cookie-actions button:hover{ background:var(--line-soft); }
body .cookie-actions .cc-primary{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
body .cookie-actions .cc-primary:hover{ filter:none; background:var(--ink-900); }

/* ============================================================
   VNITŘNÍ STRÁNKY — společné: hlavička stránky, tlačítko, výzva k akci
   ============================================================ */
.page-head{ padding-block:clamp(3.5rem,7vw,6.5rem) clamp(2.5rem,4vw,3.5rem); }
.page-head h1{ font-size:clamp(2.6rem,6vw,5.5rem); max-width:18ch; }
.page-head__lead{ font-size:clamp(1.05rem,1.3vw,1.2rem); color:var(--ink-700); margin:1.75rem 0 0; max-width:60ch; }
.back{
  display:inline-flex; align-items:center; min-height:44px; margin-bottom:1.25rem;
  font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-500);
  transition:color .25s var(--ease);
}
.back:hover{ color:var(--ink); }

.btn{
  display:inline-flex; align-items:center; gap:.9rem; cursor:pointer;
  background:var(--ink); color:var(--bg); border:1px solid var(--ink); border-radius:0;
  padding:1.15rem 2.25rem; min-height:52px;
  font-size:.82rem; letter-spacing:.2em; text-transform:uppercase; font-weight:400;
  transition:background-color .3s var(--ease), color .3s var(--ease);
}
.btn:hover{ background:transparent; color:var(--ink); }
.btn svg{ width:22px; height:8px; }

.cta{ border-top:1px solid var(--line); margin-top:var(--sec); }
.cta__in{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter); padding-block:clamp(4rem,8vw,7rem); align-items:end; }
.cta h2{ grid-column:1/7; }
.cta__side{ grid-column:8/13; }
.cta__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:1.25rem 2.25rem; margin-top:1.75rem; }

/* ============================================================
   REALIZACE — výpis (/reference)
   ============================================================ */
/* Filtr kategorií — hranaté „tlačítka" ve stejném jazyce jako .btn: vlasová linka, vybraná = plná
   (připomínka klienta 7. 10. 2026: textové záložky působily jako popisky, ne jako něco klikacího). */
.refs__filter{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2.75rem; }
.refs__filter a{
  display:inline-flex; align-items:center; gap:.6rem; padding:.7rem 1.15rem; min-height:46px;
  border:1px solid var(--line); background:transparent;
  font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-800);
  transition:border-color .25s var(--ease), background-color .25s var(--ease), color .25s var(--ease);
}
.refs__filter a span{
  font-family:var(--serif); font-size:.95rem; letter-spacing:.02em; line-height:1;
  font-variation-settings:"opsz" var(--serif-opsz-small); transition:color .25s var(--ease);
}
.refs__filter a:hover{ border-color:var(--ink); color:var(--ink); }
.refs__filter a[aria-current]{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
.refs__filter a[aria-current] span{ color:rgba(250,250,249,.6); }
.refs__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(2.5rem,4vw,4rem) var(--gutter); }
.refs__empty{ color:var(--ink-500); }

.card{ display:block; }
.card__frame{ aspect-ratio:4/3; overflow:hidden; background:var(--line-soft); }
.card__frame img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.card:hover .card__frame img{ transform:scale(1.04); }
.card__title{
  margin:1.25rem 0 0; font-family:var(--serif); color:var(--ink);
  font-size:clamp(1.15rem,1.5vw,1.4rem); line-height:1.25; font-weight:var(--serif-wght-mid);
  font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-mid);
  transition:color .25s var(--ease);
}
.card:hover .card__title{ color:var(--ink-700); }
.card__sub{ margin:.5rem 0 0; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-500); }

/* ============================================================
   REALIZACE — detail jako případová studie (/reference/<slug>)
   ============================================================ */
.case__head{ padding-block:clamp(3rem,6vw,5rem) clamp(2rem,4vw,3rem); }
.case__head h1{ font-size:clamp(2.3rem,5.2vw,4.75rem); max-width:20ch; }
.case__facts{ display:flex; flex-wrap:wrap; gap:1.5rem clamp(2rem,4vw,4rem); margin:2.5rem 0 0; padding-top:1.5rem; border-top:1px solid var(--line); }
.case__facts dt{ font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-500); }
.case__facts dd{ margin:.4rem 0 0; font-size:1.05rem; color:var(--ink); }
.case__facts dd a{ border-bottom:1px solid var(--line); transition:border-color .25s var(--ease); }
.case__facts dd a:hover{ border-bottom-color:var(--brass); }
.case__cover{ margin:0 auto; max-width:var(--shell); padding-inline:var(--gutter); }
.case__cover a{ display:block; cursor:zoom-in; }
.case__cover img{ width:100%; max-height:82svh; object-fit:cover; background:var(--line-soft); }
.case__story{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gutter); padding-block:clamp(3.5rem,7vw,6rem) 0; }
.case__block h2{ margin-bottom:1rem; }
.case__gallery{ padding-top:clamp(3.5rem,7vw,6rem); }
.case__gallery h2 span, .refs__filter a span{ color:var(--ink-500); }
.case__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; }
.case__grid a{ display:block; aspect-ratio:1; overflow:hidden; background:var(--line-soft); cursor:zoom-in; }
.case__grid img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.case__grid a:hover img{ transform:scale(1.05); }
.case__related{ padding-top:var(--sec); }
.case__related-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; gap:1rem 2rem; margin-bottom:clamp(2rem,4vw,3rem); }

/* ============================================================
   SLUŽBY — přehled (/sluzby) a detail (/sluzby/<slug>)
   ============================================================ */
.svcs__list{ display:flex; flex-direction:column; gap:clamp(4rem,9vw,8rem); }
.svc-row{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter); align-items:center; }
.svc-row__img{ grid-column:1/7; display:block; aspect-ratio:4/5; overflow:hidden; background:var(--line-soft); }
.svc-row__img img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.svc-row:hover .svc-row__img img{ transform:scale(1.03); }
.svc-row__text{ grid-column:8/13; }
.svc-row--flip .svc-row__img{ grid-column:7/13; grid-row:1; }
.svc-row--flip .svc-row__text{ grid-column:1/6; grid-row:1; }
.svc-row__text h2{ margin:1rem 0 1.5rem; }
.svc-row__text h2 a{ transition:color .25s var(--ease); }
.svc-row__text h2 a:hover{ color:var(--ink-700); }
.svc-row__links{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem 2rem; }
/* Služba s plným popisem (část textu před <!--more-->): fotka se při čtení „přilepí" */
.svc-row--long{ align-items:start; }
.svc-row--long .svc-row__img{ position:sticky; top:calc(var(--nav-h) + 2rem); }
.svc-row--long .svc-row__text{ grid-column:7/13; padding-top:clamp(0rem,3vw,2.5rem); }
.svc-row--long.svc-row--flip .svc-row__text{ grid-column:1/7; }
.svc-row--long.svc-row--flip .svc-row__img{ grid-column:8/13; }
.svc-row--long .svc-row__img{ grid-column:1/6; }
.svc-row__prose{ max-width:none; margin:0 0 2.25rem; font-size:1rem; }
.svc-row__prose > p:first-child{ font-size:1.08rem; color:var(--ink-800); }
.svc-row .svc-row__prose h2{
  font-size:clamp(1.25rem,1.7vw,1.55rem); line-height:1.25; margin:2.5rem 0 1rem;
  font-weight:var(--serif-wght-mid); font-variation-settings:"opsz" var(--serif-opsz-mid);
}
.prose blockquote{
  margin:2rem 0; padding:.2rem 0 .2rem 1.4rem; border-left:1px solid var(--brass);
  font-family:var(--serif); font-style:italic; font-size:clamp(1.25rem,1.8vw,1.6rem); line-height:1.35; color:var(--ink);
  font-weight:var(--serif-wght-mid); font-variation-settings:"opsz" var(--serif-opsz-mid);
}
.prose blockquote p{ margin:0; }
.svc-row__count{ font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-500); }

.svc__head{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter); align-items:end; padding-block:clamp(3rem,6vw,5rem) clamp(3rem,6vw,5rem); }
.svc__intro{ grid-column:1/7; }
.svc__intro h1{ font-size:clamp(2.5rem,5.6vw,5rem); }
.svc__specs{ margin-top:2rem; max-width:30rem; }
.svc__intro .btn{ margin-top:.5rem; }
.svc__img{ grid-column:8/13; margin:0; aspect-ratio:4/5; overflow:hidden; background:var(--line-soft); }
.svc__img img{ width:100%; height:100%; object-fit:cover; }

/* Obsah z editoru (služby, CMS stránky) */
.prose{ max-width:42rem; margin-inline:auto; }
.prose h2{ font-size:clamp(1.6rem,2.8vw,2.4rem); line-height:1.12; margin:3.5rem 0 1.25rem; }
.prose h3{ margin:2.5rem 0 1rem; }
.prose > :first-child{ margin-top:0; }
.prose p, .prose ul, .prose ol{ margin:0 0 1.2em; }
.prose ul, .prose ol{ padding-left:1.2rem; }
.prose li{ margin:.35rem 0; }
.prose strong{ font-weight:500; color:var(--ink); }
.prose a{ color:var(--ink); border-bottom:1px solid var(--line); transition:border-color .25s var(--ease); }
.prose a:hover{ border-bottom-color:var(--brass); }
.prose img{ max-width:100%; height:auto; margin:2rem 0; }
/* Rozvržení obrázku z editoru (admin: klik na obrázek → Celá šířka / Vlevo / Vpravo / Menší, na střed) */
.prose img.img-full{ display:block; width:100%; }
.prose img.img-left{ float:left; width:46%; margin:.35rem 2rem 1.25rem 0; }
.prose img.img-right{ float:right; width:46%; margin:.35rem 0 1.25rem 2rem; }
.prose img.img-center{ display:block; width:62%; margin:2.25rem auto; }
.prose::after{ content:""; display:table; clear:both; }
@media (max-width:640px){
  .prose img.img-left, .prose img.img-right, .prose img.img-center{ float:none; width:100%; margin:1.75rem 0; }
}
.prose table{ width:100%; border-collapse:collapse; margin:2rem 0; font-size:.95rem; }
.prose th, .prose td{ text-align:left; padding:.7rem .6rem; border-bottom:1px solid var(--line-soft); }

.svc__refs{ padding-top:var(--sec); }
.svc__others{ padding-top:var(--sec); }
.svc__others-list{ border-top:1px solid var(--line); }
.svc__others-list a{
  display:flex; justify-content:space-between; align-items:center; gap:2rem;
  padding:1.5rem 0; border-bottom:1px solid var(--line);
  font-family:var(--serif); color:var(--ink); font-size:clamp(1.3rem,2.2vw,1.9rem);
  font-weight:var(--serif-wght-mid); font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-mid);
}
.svc__others-list a svg{ width:28px; height:10px; flex:none; transition:transform .3s var(--ease); }
.svc__others-list a:hover svg{ transform:translateX(8px); }

/* ============================================================
   CMS STRÁNKA, KONTAKT, 404
   ============================================================ */
.page__body{ padding-bottom:clamp(2rem,4vw,3rem); }
.page-head__lead p{ margin:0 0 .8em; }
/* ---------- Kontakty: hlavička s přímým kontaktem → pás s kartou formuláře → provozovna a mapa ---------- */
.kontakt-head{
  display:grid; grid-template-columns:repeat(12,1fr); gap:0 var(--gutter); align-items:end;
  padding-block:clamp(3.5rem,7vw,6.5rem) clamp(2.5rem,5vw,4rem);
}
.kontakt-head__main{ grid-column:1/8; }
.kontakt-head__main h1{ font-size:clamp(2.6rem,6vw,5.5rem); }
.kontakt-head__main .page-head__lead{ max-width:34rem; }
.kontakt-head__direct{ grid-column:9/13; padding:0 0 .5rem 2rem; border-left:1px solid var(--line); }
.kontakt-head__direct .eyebrow{ margin-bottom:.9rem; }
.kontakt-head__tel{
  display:block; font-family:var(--serif); color:var(--ink); line-height:1.1;
  font-size:clamp(1.7rem,2.5vw,2.35rem); white-space:nowrap;
  font-weight:var(--serif-wght-display); font-variation-settings:"opsz" var(--serif-opsz-display);
  transition:color .25s var(--ease);
}
.kontakt-head__tel:hover{ color:var(--ink-700); }
.kontakt-head__mail{ display:inline-block; margin-top:.8rem; padding:.3rem 0; border-bottom:1px solid var(--line); transition:border-color .25s var(--ease); }
.kontakt-head__mail:hover{ border-bottom-color:var(--brass); }
.contact__quick{ display:none; }

.kontakt-band{ background:var(--band); padding-block:clamp(3.5rem,7vw,6.5rem); }
.kontakt-band__in{ display:grid; grid-template-columns:repeat(12,1fr); gap:0 var(--gutter); align-items:start; }
.kontakt-band .form-card{ grid-column:6/13; grid-row:1; }
.kontakt-band__side{ grid-column:1/5; grid-row:1; position:sticky; top:calc(var(--nav-h) + 2.5rem); }
.kontakt-band .contact__process{ margin-top:0; padding-top:0; border-top:0; }
.kontakt-band .contact__process li::before{ background:var(--band); }

/* Karta formuláře — bílý papír, vlasová linka, mosazný proužek a dlouhý měkký stín.
   Na úvodní stránce i na Kontaktech, ať je poptávka všude na první pohled hlavní akce. */
.form-card{
  position:relative; background:var(--card);
  border:1px solid var(--line-soft); border-top:2px solid var(--brass);
  box-shadow:0 1px 2px rgba(12,10,9,.04), 0 28px 60px -32px rgba(12,10,9,.28);
  padding:clamp(1.6rem,3.6vw,3.25rem);
}
.form-card__head{ margin-bottom:2.25rem; padding-bottom:1.75rem; border-bottom:1px solid var(--line-soft); }
.form-card__head .eyebrow{ margin-bottom:.9rem; }
.form-card__head h2{ font-size:clamp(1.6rem,2.4vw,2.2rem); line-height:1.15; margin:0 0 .8rem; }
.form-card__head p:last-child{ margin:0; font-size:.98rem; color:var(--ink-700); }
.form-card .contact__next{ margin-top:0; padding-top:0; border-top:0; }
a[href^="tel:"]{ white-space:nowrap; }   /* telefonní číslo se nikdy neláme uprostřed */
/* Děkovací stránka po odeslání poptávky */
.form-card--thanks{ max-width:46rem; margin-inline:auto; }
.page-head--center{ text-align:center; }
.page-head--center > *{ margin-inline:auto; }   /* i odstavce s omezenou šířkou (p{max-width}) */
.form-card--thanks .contact__next > .eyebrow{ margin-top:0; }

.kontakt-place{
  display:grid; grid-template-columns:repeat(12,1fr); gap:0 var(--gutter); align-items:start;
  padding-block:clamp(3.5rem,7vw,6rem);
}
.kontakt-place .contact__info{ grid-column:1/5; margin-top:0; }
.kontakt-place__map{ grid-column:6/13; }
.btn--ghost{ background:transparent; color:var(--ink); }
.btn--ghost:hover{ background:var(--ink); color:var(--bg); }

/* Jak to probíhá */
.contact__process{ margin-top:3rem; padding-top:2rem; border-top:1px solid var(--line); }
.contact__process ol{ list-style:none; margin:1.25rem 0 0; padding:0; counter-reset:proc; }
.contact__process li{
  position:relative; padding:0 0 1.35rem 2.6rem; counter-increment:proc;
  display:flex; flex-direction:column; gap:.2rem;
}
.contact__process li::before{
  content:counter(proc); position:absolute; left:0; top:-.15rem;
  width:1.8rem; height:1.8rem; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:50%; font-size:.75rem; color:var(--brass); background:var(--bg);
}
.contact__process li:not(:last-child)::after{
  content:""; position:absolute; left:.9rem; top:1.75rem; bottom:.1rem; width:1px; background:var(--line);
}
.contact__process strong{ font-weight:400; color:var(--ink); }
.contact__process span{ font-size:.9rem; color:var(--ink-500); line-height:1.5; }
.contact__docs{ margin:.1rem 0 0; padding:1rem 0 0 2.6rem; border-top:1px solid var(--line-soft); font-size:.9rem; color:var(--ink-500); line-height:1.5; }
.contact__docs em{ font-style:normal; color:var(--ink); }

/* Po odeslání */
.contact__next{ margin-top:2.5rem; padding-top:2rem; border-top:1px solid var(--line); }
.contact__next p{ color:var(--ink-700); }
.contact__next p a{ color:var(--ink); border-bottom:1px solid var(--line); }
.contact__next-links{ display:flex; flex-wrap:wrap; gap:1rem 2.5rem; margin-top:1.5rem; }

/* ---------- Formulář po krocích (site.js) ---------- */
.cf-progress{
  display:grid; grid-template-columns:repeat(var(--steps,3),1fr); gap:.6rem;
  list-style:none; margin:0 0 2.5rem; padding:0;
}
.cf-progress li{
  padding-top:.8rem; border-top:2px solid var(--line);
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-500);
  transition:border-color .3s var(--ease), color .3s var(--ease);
}
.cf-progress li span{ display:block; margin-bottom:.2rem; font-size:.7rem; letter-spacing:.1em; color:var(--brass); }
.cf-progress li.is-done{ border-top-color:var(--ink-500); }
.cf-progress li.is-current{ border-top-color:var(--ink); color:var(--ink); }
.cf-progress button{
  all:unset; cursor:pointer; display:block; min-height:44px; box-sizing:border-box;
}
.cf-progress button:focus-visible{ outline:1px solid var(--brass); outline-offset:4px; }
.cf-step{ animation:cf-step-in .35s var(--ease); }
.cf-step[hidden]{ display:none; }
@keyframes cf-step-in{ from{ opacity:0; transform:translateY(8px); } }
.cf-step__note{ margin:-1rem 0 2rem; font-size:.9rem; color:var(--ink-500); }
.cf-nav{ display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-top:2.5rem; }
.cf-nav > :only-child{ margin-left:auto; }
.cf-back{
  background:none; border:0; padding:.75rem 0; cursor:pointer; min-height:44px;
  font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-500);
}
.cf-back:hover{ color:var(--ink); }
.contact-form .cf-nav .cf-submit{ margin-top:0; }
@media (prefers-reduced-motion:reduce){ .cf-step{ animation:none; } }

/* dlaždice místo rozbalovacího výběru (site.js) */
.contact-form .cf-field{
  display:block; margin-bottom:2rem;
  font-size:.7rem; font-weight:400; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-500);
}
.cf-tiles{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.9rem; }
.cf-tile{
  background:transparent; border:1px solid var(--line); border-radius:0; cursor:pointer;
  padding:.65rem 1.05rem; min-height:44px;
  font:400 .98rem/1.2 var(--sans); letter-spacing:normal; text-transform:none; color:var(--ink-700);
  transition:border-color .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease);
}
.cf-tile:hover{ border-color:var(--ink); color:var(--ink); }
.cf-tile[aria-checked="true"]{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
.cf-tile:focus-visible{ outline:1px solid var(--brass); outline-offset:2px; }
.cf-field.is-invalid .cf-tile{ border-color:var(--err); }
.cf-field .cf-hint{ margin-top:.75rem; }
/* „nepovinné" u popisku */
.cf-opt{ margin-left:.6rem; font-size:.7rem; letter-spacing:.1em; color:var(--ink-500); text-transform:lowercase; }
.contact__map{ padding-bottom:var(--sec); }
.contact__map iframe{ width:100%; border:0; filter:grayscale(1) contrast(.95); }
/* obal mapy z jádra (App\MapEmbed) — tlačítko „načíst mapu" v designu webu */
.contact__map .pg-map{ border-radius:0; background:var(--line-soft); }
.contact__map .pg-map-load{
  background:var(--line-soft); color:var(--ink-500); gap:.6rem;
  transition:background-color .3s var(--ease);
}
.contact__map .pg-map-load:hover{ background:#DEDBD8; }
.contact__map .pg-map-pin{
  width:44px; height:44px; background:var(--bg); color:var(--ink); box-shadow:none;
  border:1px solid var(--line);
}
.contact__map .pg-map-cta{
  font-weight:400; font-size:.8rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink);
  border-bottom:1px solid var(--brass); padding-bottom:.3rem;
}
.contact__map .pg-map-addr{ font-size:.95rem; color:var(--ink-700); }
.contact__map .pg-map-note{ font-size:.75rem; color:var(--ink-500); }
/* O nás — fotka vlevo drží při čtení, text vpravo; fakta; druhá fotka přes šířku */
.about{ padding-bottom:clamp(3rem,6vw,5rem); }
.about.has-photo{
  display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter); align-items:start;
}
.about__photo{ grid-column:1/6; margin:0; position:sticky; top:calc(var(--nav-h) + 2rem); }
.about__photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; background:var(--line-soft); }
.about.has-photo .about__text{ grid-column:7/13; max-width:none; margin:0; }
.about__facts{
  display:flex; flex-wrap:wrap; gap:1.5rem clamp(2.5rem,6vw,6rem);
  margin:0; padding-block:clamp(2rem,4vw,3rem); border-block:1px solid var(--line);
}
.about__facts dt{ font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-500); }
.about__facts dd{
  margin:.6rem 0 0; font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.4rem); line-height:1.1; color:var(--ink);
  font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-display);
}
@media (max-width:900px){
  .about.has-photo{ display:block; }
  .about__photo{ position:static; margin-bottom:2.5rem; }
  .about__photo img{ aspect-ratio:4/3; }
}

.notfound{ padding-block:clamp(4rem,10vw,9rem) var(--sec); }
.notfound h1{ font-size:clamp(3rem,9vw,8rem); }
.notfound h1 em{ font-style:italic; }
.notfound__links{ margin-top:clamp(2.5rem,5vw,4rem); max-width:40rem; }

/* ============================================================
   VNITŘNÍ STRÁNKY — přechodný vzhled generických šablon skeletonu
   (page, reference, sluzby). Vlastní design přijde ve fázi 3.
   ============================================================ */
.wrap{ max-width:var(--shell); margin:0 auto; padding:0 var(--gutter); }
.pub-main{ padding:clamp(3rem,6vw,5rem) 0 var(--sec); }
.pub-main > .wrap{ max-width:980px; }
.pub-main h1{ font-size:clamp(2.25rem,5vw,4rem); margin:0 0 2rem; }
.pub-main h2{ font-size:clamp(1.6rem,3vw,2.4rem); margin:2.5rem 0 1rem; }
.pub-content a{ border-bottom:1px solid var(--line); }
.pub-content a:hover{ border-bottom-color:var(--brass); }
.pub-content img{ max-width:100%; height:auto; }
.pub-content table{ border-collapse:collapse; width:100%; }
.pub-content td, .pub-content th{ border:1px solid var(--line-soft); padding:.6rem .8rem; }
.pub-hero{ max-width:980px; margin:0 auto; padding:2rem var(--gutter) 0; }
.pub-hero img{ width:100%; max-height:440px; object-fit:cover; }
.pub-404{ text-align:center; padding:6rem 0; }
.pub-404 h1{ font-size:clamp(4rem,12vw,9rem); }
.preview-bar{ background:var(--ink); color:var(--bg); text-align:center; padding:.6rem 1rem; font-size:.85rem; position:relative; z-index:70; }
.preview-bar a{ color:var(--bg); text-decoration:underline; }

.ref-lead{ font-size:1.15rem; color:var(--ink-700); }
.ref-cats{ display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1.5rem; }
.ref-cat{ padding:.5rem 1rem; border:1px solid var(--line); font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; }
.ref-cat.active{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
.ref-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:var(--gutter); margin-top:2.5rem; }
.ref-card{ display:block; }
.ref-cover{ aspect-ratio:4/3; background:var(--line-soft); position:relative; overflow:hidden; }
.ref-cover img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.ref-card:hover .ref-cover img{ transform:scale(1.04); }
.ref-badge{ position:absolute; top:.75rem; left:.75rem; font-size:.65rem; letter-spacing:.14em; text-transform:uppercase; padding:.3rem .6rem; background:var(--bg); color:var(--ink); }
.ref-badge.is-static{ position:static; display:inline-block; }
.ref-card-body{ padding:1rem 0; border-bottom:1px solid var(--line); }
.ref-card-title{ font-family:var(--serif); font-size:1.35rem; color:var(--ink); font-weight:var(--serif-wght-mid); font-variation-settings:"opsz" var(--serif-opsz-mid); }
.ref-meta{ color:var(--ink-500); font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; display:flex; gap:1rem; flex-wrap:wrap; margin-top:.35rem; }
.ref-empty{ color:var(--ink-500); padding:3rem 0; }
.ref-detail-cover{ width:100%; max-height:560px; object-fit:cover; margin:2rem 0; }
.ref-facts{ display:flex; flex-wrap:wrap; gap:1rem 2.5rem; padding:1.25rem 0; border-block:1px solid var(--line-soft); margin:2rem 0; }
.ref-fact{ font-size:1rem; color:var(--ink); }
.ref-fact b{ display:block; font-size:.7rem; font-weight:400; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-500); }
.ref-scope{ white-space:pre-line; }
.back-link{ display:inline-block; margin-bottom:1rem; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-500); }

/* Fotogalerie + lightbox (reference i shortcode [gallery:…]) */
.pg-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:.75rem; margin:2rem 0; }
.pg-gallery-item{ display:block; aspect-ratio:1/1; overflow:hidden; background:var(--line-soft); }
.pg-gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.pg-gallery-item:hover img{ transform:scale(1.05); }
.pglb-overlay{ position:fixed; inset:0; background:rgba(12,10,9,.94); display:none; align-items:center; justify-content:center; z-index:9999; flex-direction:column; }
.pglb-overlay.open{ display:flex; }
.pglb-overlay img{ max-width:92vw; max-height:82vh; }
.pglb-cap{ color:var(--bg); margin-top:1rem; font-size:.95rem; }
.pglb-x, .pglb-nav{ position:absolute; background:rgba(250,250,249,.12); color:var(--bg); border:0; cursor:pointer; width:48px; height:48px; font-size:22px; }
.pglb-x{ top:1.25rem; right:1.25rem; }
.pglb-nav{ top:50%; transform:translateY(-50%); }
.pglb-prev{ left:1.25rem; }
.pglb-next{ right:1.25rem; }

/* ============================================================
   ANIMACE PŘI SCROLLU — schovává se jen s běžícím JS (třída .js na <html>)
   ============================================================ */
.js .reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.js .reveal.is-in{ opacity:1; transform:none; }
.js .reveal[data-d="1"]{ transition-delay:.09s; }
.js .reveal[data-d="2"]{ transition-delay:.18s; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* Menu: 4 položky + telefon se pod ~1100 px do řádku nevejdou (logo 173 px,
   odkazy ~520 px, telefon ~190 px, mezery a okraje) → mobilní menu už tady. */
/* Ikony sítí se k menu a telefonu vejdou až od ~1240 px; pod tím zůstanou
   v patičce a v otevřeném mobilním menu. */
@media (max-width:1240px){
  .nav-social{ display:none; }
}
/* ── Mobilní menu ────────────────────────────────────────────────
   Panel se vysune shora (clip-path), položky naběhnou postupně, logo
   a tlačítko zůstávají na svém místě nad panelem (žádné poskočení).
   Položky jsou nahoře pod hlavičkou — s číslem, linkou a šipkou;
   dole telefon, sítě, e-mail a místo. */
@media (max-width:1100px){
  .nav-toggle{ display:inline-flex; align-items:center; gap:.75rem; position:relative; z-index:2; }
  .nav-toggle:focus{ outline:none; }
  .nav-toggle:focus-visible{ outline:1px solid var(--brass); outline-offset:6px; }
  .nav-toggle__icon{ position:relative; width:22px; height:10px; display:block; }
  .nav-toggle__icon i{
    position:absolute; left:0; right:0; height:1px; background:currentColor;
    transition:transform .45s var(--ease), top .45s var(--ease), width .45s var(--ease);
  }
  .nav-toggle__icon i:first-child{ top:0; }
  .nav-toggle__icon i:last-child{ top:9px; width:15px; left:auto; }
  .nav.is-open .nav-toggle__icon i{ top:4.5px; width:22px; }
  .nav.is-open .nav-toggle__icon i:first-child{ transform:rotate(45deg); }
  .nav.is-open .nav-toggle__icon i:last-child{ transform:rotate(-45deg); }

  .brand{ position:relative; z-index:2; }

  /* panel s položkami */
  .nav-links{
    position:fixed; inset:0; z-index:1;
    display:flex; flex-direction:column; justify-content:flex-start; gap:0;
    padding:calc(var(--nav-h) + clamp(1.5rem,6vh,3.5rem)) var(--gutter) 11rem;
    overflow-y:auto; overscroll-behavior:contain;
    background:var(--bg); color:var(--ink);
    counter-reset:navitem;
    clip-path:inset(0 0 100% 0); visibility:hidden;
    transition:clip-path .6s var(--ease), visibility 0s linear .6s;
  }
  .nav.is-open .nav-links{
    clip-path:inset(0 0 0 0); visibility:visible;
    transition:clip-path .6s var(--ease), visibility 0s;
  }
  .nav-links li{
    border-bottom:1px solid var(--line-soft);
    opacity:0; transform:translateY(14px);
    transition:opacity .4s var(--ease), transform .5s var(--ease);
  }
  .nav.is-open .nav-links li{ opacity:1; transform:none; transition-delay:calc(.15s + var(--i, 0) * 60ms); }
  .nav-links li:nth-child(1){ --i:0; } .nav-links li:nth-child(2){ --i:1; } .nav-links li:nth-child(3){ --i:2; }
  .nav-links li:nth-child(4){ --i:3; } .nav-links li:nth-child(5){ --i:4; } .nav-links li:nth-child(6){ --i:5; }
  .nav-links li:nth-child(7){ --i:6; } .nav-links li:nth-child(8){ --i:7; }
  .nav-links a{
    display:flex; align-items:baseline; gap:1rem; padding:1.05rem 0;
    font-family:var(--serif); font-weight:var(--serif-wght-mid); font-size:clamp(1.6rem,7vw,2.1rem); line-height:1.15;
    letter-spacing:.01em; text-transform:none; white-space:normal;
    font-optical-sizing:none; font-variation-settings:"opsz" var(--serif-opsz-mid);
  }
  .nav-links a::before{
    counter-increment:navitem; content:counter(navitem, decimal-leading-zero);
    flex:none; width:1.6rem; font-family:var(--sans); font-size:.7rem; font-weight:400;
    letter-spacing:.12em; color:var(--brass);
  }
  /* šipka vpravo místo podtržení z desktopu */
  .nav-links a::after{
    position:static; content:"→"; width:auto; height:auto; background:none;
    margin-left:auto; align-self:center;
    font-family:var(--sans); font-size:1.1rem; font-weight:400; color:var(--ink-500);
    transform:translateX(-6px); opacity:.0; transition:opacity .3s var(--ease), transform .3s var(--ease);
  }
  /* width:auto — jinak by sem dosáhlo desktopové podtržení (width:100%) a šipka
     by se roztáhla přes řádek a zalomila text */
  .nav-links a:hover::after, .nav-links a:focus-visible::after{ width:auto; opacity:1; transform:none; }
  .nav-links a[aria-current="page"]{ font-style:italic; }
  .nav-links a[aria-current="page"]::after{ content:""; width:6px; height:6px; border-radius:50%; background:var(--brass); opacity:1; transform:none; }
  .nav-links a:focus-visible{ outline:none; }

  /* spodek panelu: e-mail a místo, pod tím telefon + sítě */
  .nav-end, .nav-meta{
    position:fixed; z-index:2; left:var(--gutter); right:var(--gutter);
    opacity:0; visibility:hidden; transform:translateY(8px);
    transition:opacity .3s var(--ease), transform .4s var(--ease), visibility 0s linear .3s;
  }
  .nav-end{ bottom:calc(var(--gutter) + .25rem); display:flex; justify-content:space-between; align-items:center; gap:1rem; }
  .nav-end .nav-tel{ order:1; }
  .nav-end .nav-social{ order:2; display:flex; margin-right:-11px; }
  .nav-meta{
    bottom:calc(var(--gutter) + 4.75rem); display:flex; flex-wrap:wrap; justify-content:space-between; gap:.35rem 1.5rem;
    margin:0; padding-top:1.1rem; border-top:1px solid var(--line);
    font-size:.85rem; color:var(--ink-500);
  }
  .nav-meta a{ color:var(--ink); }
  .nav.is-open .nav-end, .nav.is-open .nav-meta{
    opacity:1; visibility:visible; transform:none;
    transition:opacity .4s var(--ease) .45s, transform .5s var(--ease) .45s, visibility 0s;
  }
  .nav:not(.is-open) .nav-end{ pointer-events:none; }
}
@media (max-width:1100px) and (max-height:560px){
  /* telefon na šířku: spodek by překryl položky → jen telefon a sítě */
  .nav-meta{ display:none !important; }
  .nav-links{ padding-bottom:6rem; }
}
@media (max-width:1100px) and (prefers-reduced-motion:reduce){
  .nav-links, .nav-links li, .nav-end, .nav-meta, .nav-toggle__icon i{ transition:none !important; }
}
@media (max-width:1024px){
  /* hero drží dvousloupcové rozložení z desktopu — když perex spadne pod nadpis,
     textový blok vyroste a vyjede přes krb a stolek (tmavý text na tmavém) */
  .hero h1{ grid-column:1/9; }
  .hero__side{ grid-column:9/13; }
  .manifest .eyebrow, .manifest__h, .manifest__cols{ grid-column:1/13; }
  .work__head h2, .work__head .work__note{ grid-column:1/13; }
  .work__head .work__note{ margin-top:1.5rem; }
  .mat__head h2, .mat__head p{ grid-column:1/13; }
  .mat__grid{ grid-template-columns:1fr 1fr; }
  .mat__card:nth-child(2),.mat__card:nth-child(3){ margin-top:0; }
  .steps h2, .steps__intro{ grid-column:1/13; }
  .steps__intro{ margin-top:1.5rem; }
  .step{ grid-template-columns:3.5rem 1fr; }
  .step p{ grid-column:2/3; margin-top:.5rem; }
  .steps__docs{ grid-template-columns:3.5rem 1fr; row-gap:.75rem; }
  .steps__docs ul{ grid-column:2/3; }
  .faq-sec__head, .faq-sec__list{ grid-column:1/13; position:static; }
  .refs__grid{ grid-template-columns:1fr 1fr; }
  .case__story{ grid-template-columns:1fr; gap:2.5rem; }
  .case__grid{ grid-template-columns:repeat(3,1fr); }
  .cta h2, .cta__side{ grid-column:1/13; }
  .svc-row__img, .svc-row--flip .svc-row__img{ grid-column:1/13; grid-row:auto; aspect-ratio:4/3; }
  .svc-row__text, .svc-row--flip .svc-row__text{ grid-column:1/13; grid-row:auto; }
  .svc-row--long .svc-row__img, .svc-row--long.svc-row--flip .svc-row__img{ grid-column:1/13; position:static; }
  .svc-row--long .svc-row__text, .svc-row--long.svc-row--flip .svc-row__text{ grid-column:1/13; padding-top:0; }
  .svc__intro, .svc__img{ grid-column:1/13; }
  .svc__img{ aspect-ratio:4/3; order:-1; }
  .faq-sec__list{ margin-top:1rem; }
  .contact h2, .contact__info, .contact__form{ grid-column:1/13; grid-row:auto; }
  .contact__form{ margin-top:3.5rem; }
}
@media (max-width:900px){
  /* Hero: pod 900 px by text přes fotku zakryl předměty v interiéru a zdroj je
     široký 2,33:1 — cover by z něj udělal svislý proužek. Místo toho pás
     s fotkou a text pod ním (stejně jako na mobilu). */
  .hero h1, .hero__side{ grid-column:1/13; }
  .hero__side{ margin-top:1.5rem; }
  .hero{ height:auto; min-height:0; }
  .hero__img{
    position:relative; height:auto; aspect-ratio:16/9;
    object-position:68% 50%; transform:none; animation:none;
  }
  .hero:not(.hero--plain)::after{
    inset:0 0 auto 0; height:20%;
    background:linear-gradient(180deg, rgba(250,250,249,.75), rgba(250,250,249,0));
  }
  .hero__body{
    position:static; padding:clamp(2rem,7vw,3rem) var(--gutter) clamp(2.5rem,8vw,4rem);
  }
  .hero--plain .hero__body{ padding-top:calc(var(--nav-h) + 2rem); }
}
@media (max-width:768px){
  :root{ --nav-h:4.5rem; }
  h1{ font-size:clamp(2.5rem, 10.5vw, 3.6rem); line-height:1.08; }
  h2{ line-height:1.1; }
  .arrow{ font-size:.78rem; letter-spacing:.12em; }
  .hero__side p{ font-size:.95rem; }
  .hero__img{ aspect-ratio:4/3; }
  .brand__mark{ height:24px; }
  .mat__grid{ grid-template-columns:1fr; }
  .contact-form .cf-row{ grid-template-columns:1fr; }
  .faq__a{ padding-right:0; }
  .refs__filter{ gap:.5rem; }
  .refs__filter a{ padding:.6rem .9rem; letter-spacing:.12em; }
  .case__grid{ grid-template-columns:1fr 1fr; }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .js .reveal{ opacity:1; transform:none; }
  .hero__img{ transform:none; }
}

/* Kontakty na tabletu a mobilu: karta s formulářem hned pod nadpisem, pak průběh, provozovna a mapa */
@media (max-width:1024px){
  /* 12sloupcová mřížka s mezerami je na úzkém displeji širší než obrazovka → obyčejné bloky */
  .kontakt-head, .kontakt-band__in, .kontakt-place{ display:block; }
  .kontakt-head__direct{ margin-top:2rem; padding:1.5rem 0 0; border-left:0; border-top:1px solid var(--line); }
  .kontakt-band__side{ position:static; margin-top:clamp(3rem,8vw,4rem); }
  .kontakt-place__map{ margin-top:2.5rem; }
}
@media (max-width:900px){
  .kontakt-head__direct{ display:none; }   /* na mobilu stačí tlačítka Zavolat / Napsat e-mail */
  .kontakt-band{ padding-block:2rem 3.5rem; }
  .form-card{ padding:1.5rem 1.15rem 1.75rem; }
}
@media (max-width:900px){
  .contact__quick{ display:flex; gap:.75rem; margin-top:1.75rem; }
  .contact__quick .btn{ flex:1; justify-content:center; padding-inline:1rem; }
}
@media (max-width:600px){
  .cf-progress li{ letter-spacing:.08em; font-size:.7rem; line-height:1.35; }
  /* úvodní text „Lité podlahy…": dva sloupce po ~150 px se špatně čtou → pod sebou */
  .manifest__cols{ grid-template-columns:1fr; gap:1.25rem; }
  /* realizace na mobilu po dvou — 75 karet pod sebou bylo ~30 000 px scrollování */
  .refs__grid{ grid-template-columns:1fr 1fr; gap:2.25rem .9rem; }
  .refs__grid .card__frame{ aspect-ratio:4/5; }
  .refs__grid .card__title{ margin-top:.75rem; font-size:1.02rem; line-height:1.25; }
  .refs__grid .card__sub{ margin-top:.35rem; font-size:.7rem; letter-spacing:.08em; line-height:1.45; }
  .steps__docs ul{ flex-direction:column; }
  .steps__docs li + li::before{ display:none; }
}