/*
Theme Name:     Bracon 3D
Theme URI:      https://bracon3d.cz
Template:       kadence
Author:         Bracon 3D
Author URI:     https://bracon3d.cz
Description:    Child theme pro web Bracon 3D (services)
Version:        1.1.0
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/

/* ==========================================================================
   1) DESIGN TOKENS — neutrální paleta 70-20-10, kontrasty dle WCAG AA
   --------------------------------------------------------------------------
   70 %  neutrální plochy      #ffffff / #f6f7f9
   20 %  tmavý sekundár        #16212e (text, hero, tmavé pásy)
   10 %  akcent                #c62f47 (5,39:1 na bílé = AA pro text)
   Ověřené kontrastní poměry (build/contrast.py, WCAG 2.1):
     text #3f4753 / bílá ................ 9,39 : 1  AAA
     tlumený #626b7a / bílá ............. 5,38 : 1  AA
     tlumený #626b7a / #eef0f4 ......... 4,72 : 1  AA
     nadpis #16212e / bílá ............. 16,27 : 1  AAA
     bílá / tmavá #16212e .............. 16,27 : 1  AAA
     #c2cad6 / #16212e .................. 9,85 : 1  AAA
     akcent #c62f47 / bílá .............. 5,39 : 1  AA  (text i tlačítka)
     akcent #c62f47 / #f6f7f9 ........... 5,02 : 1  AA
     bílá / akcent-hover #a81f33 ........ 7,22 : 1  AAA
     akcent-warm #f78361 / #16212e ...... 6,49 : 1  AA  (jen na tmavém)
     hranice #868fa0 / bílá ............. 3,26 : 1  (UI prvek, min. 3:1)
     hranice #868fa0 / #f6f7f9 .......... 3,04 : 1  (UI prvek, min. 3:1)
   Prohlášení: stránka používá barvu vždy spolu s tvarem/pozicí, nikdy jako jediný nositel významu.
   ========================================================================== */
:root {
  /* neutrály */
  --b3-bg: #ffffff;
  --b3-bg-soft: #f6f7f9;
  --b3-bg-sink: #eef0f4;
  --b3-line: #e4e7ec;
  --b3-line-strong: #868fa0;   /* hranice interaktivních prvků — 3,26:1 na bílé (WCAG 1.4.11) */
  --b3-text: #3f4753;          /* 8,9:1 na bílé */
  --b3-text-soft: #626b7a;     /* 5,1:1 na bílé */
  --b3-heading: #16212e;       /* 16,3:1 na bílé */

  /* tmavý sekundár */
  --b3-dark: #16212e;
  --b3-dark-2: #1e2b3a;
  --b3-on-dark: #ffffff;
  --b3-on-dark-soft: #c2cad6;  /* 9,9:1 na tmavé */

  /* akcent (10 %) — signature značky je PŘECHOD dvou barev.
     Oba stop mají s bílým textem ≥ 4,5:1, takže gradient je použitelný i na tlačítkách:
       #c62f47 = 5,39:1 · #c2410c = 5,18:1  (hover: #a81f33 7,22:1 · #9a3a0a 8,05:1) */
  --b3-grad-a: #c62f47;
  --b3-grad-b: #c2410c;
  --b3-accent: #c62f47;        /* plná varianta pro text a odkazy */
  --b3-accent-hover: #a81f33;  /* 7,2:1 */
  --b3-grad: linear-gradient(135deg, var(--b3-grad-a) 0%, var(--b3-grad-b) 100%);
  --b3-grad-hover: linear-gradient(135deg, #a81f33 0%, #9a3a0a 100%);
  --b3-grad-warm: linear-gradient(135deg, #f78361 0%, #ffb199 100%); /* na tmavém podkladu */
  --b3-accent-warm: #f78361;   /* POUZE na tmavém podkladu (6,5:1) */
  --b3-accent-wash: #fdf2f4;   /* jemné podbarvení ploch */

  /* rozměry a spacing */
  --b3-radius: 14px;
  --b3-radius-sm: 10px;
  --b3-radius-pill: 999px;
  --b3-shadow-sm: 0 1px 2px rgba(22, 33, 46, .06);
  --b3-shadow: 0 6px 20px rgba(22, 33, 46, .07);
  --b3-shadow-lg: 0 14px 40px rgba(22, 33, 46, .11);
  --b3-wrap: 1160px;
  --b3-gutter: 24px;

  /* vertikální rytmus */
  --b3-space-1: 8px;
  --b3-space-2: 12px;
  --b3-space-3: 16px;
  --b3-space-4: 24px;
  --b3-space-5: 32px;
  --b3-space-6: 44px;
  --b3-space-7: 64px;
  --b3-space-8: 88px;

  --b3-gap: var(--b3-gap, 28px);
  --b3-section-y: 64px;
}

/* ==========================================================================
   2) LAYOUT A SPACING
   ========================================================================== */
.b3-wrap { max-width: var(--b3-wrap); margin-inline: auto; padding-inline: var(--b3-gutter); }
.b3-section { background: var(--b3-bg); padding-block: var(--b3-section-y); }
/* Kadence dává každé .wp-block-group v obsahu margin-bottom: 2rem (--global-md-spacing).
   Mezi dvěma barevnými pásy tak prosvítalo bílé tělo stránky jako „pruh světlé
   mezi sekcemi" (ověřeno v pixelovém sloupci screenshotu: 32 px #ffffff mezi
   dvěma #f6f7f9 pásy na /3d-patche/). Selektor musí být specifičtější než
   .single-content .wp-block-group. */
.single-content .b3-section, .entry-content .b3-section,
.single-content .b3-section + .b3-section, .b3-section + .b3-section { margin-block: 0; }

/* pozadí webu = neutrální bílá (Kadence má v exportu tmavou palette9 — tu přebíjíme) */
body, .content-bg, body.content-style-unboxed .site { background: var(--b3-bg); }
.b3-section--light { background: var(--b3-bg-soft); }
.b3-section--white { background: var(--b3-bg); }
.b3-section--dark { background: var(--b3-dark); color: var(--b3-on-dark-soft); }
.b3-section--dark h1, .b3-section--dark h2, .b3-section--dark h3, .b3-section--dark h4 { color: var(--b3-on-dark); }
.b3-section--dark .b3-lead { color: var(--b3-on-dark-soft); }
.b3-center { text-align: center; }

/* hlavička sekce — jednotný rytmus */
.b3-eyebrow {
  display: inline-block; margin: 0 0 var(--b3-space-2);
  font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--b3-accent);
  background-image: var(--b3-grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.b3-section--dark .b3-eyebrow, .b3-spotlight .b3-eyebrow,
.b3-hero .b3-eyebrow {
  color: var(--b3-accent-warm);
  background-image: var(--b3-grad-warm);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.b3-h2 {
  font-size: clamp(1.55rem, 1.2rem + 1.5vw, 2.25rem); line-height: 1.22; letter-spacing: -.01em;
  margin: 0 0 var(--b3-space-3); color: var(--b3-heading); font-weight: 800;
}
.b3-lead { font-size: 1.05rem; line-height: 1.75; color: var(--b3-text-soft); max-width: 68ch; margin: 0 auto var(--b3-space-6); }
.b3-lead--left { margin-inline: 0; }
h1 + .b3-lead, h2 + .b3-lead { margin-top: var(--b3-space-2); }

/* ==========================================================================
   2b) BARVY NADPISŮ V OBSAHU
   Kadence má v exportu child theme nastaveno h1–h3 = palette3 (#f4f6ff) a h4 = palette4
   (#dadff2) — na bílém pozadí jsou tato nastavení nečitelná. Přebíjíme je vlastními
   barvami; :where() drží nízkou specificitu, takže tmavé sekce se dají přebít níž.
   ========================================================================== */
.entry-content :where(h1, h2, h3, h4, h5, h6),
.b3-wrap :where(h1, h2, h3, h4, h5, h6),
.b3-card :where(h1, h2, h3, h4),
.b3-step :where(h1, h2, h3, h4),
.b3-grid-2 :where(h1, h2, h3, h4) { color: var(--b3-heading); }

.b3-hero :where(h1, h2, h3, h4),
.b3-section--dark :where(h1, h2, h3, h4),
.b3-section--dark :where(h1, h2, h3, h4) a,
.b3-spotlight :where(h1, h2, h3, h4) { color: var(--b3-on-dark); }

/* ==========================================================================
   2c) ZÁKLADNÍ TEXT, HLAVIČKA A PATIČKA
   Kadence má v exportu světlé barvy (body a h1–h3 = palette3/4, tedy #f4f6ff/#dadff2),
   což je na bílém pozadí nečitelné (body text vycházel 1,33 : 1). Přebíjíme je.
   ========================================================================== */
body, input, select, textarea, optgroup, .entry-content { color: var(--b3-text); }

/* navigace v hlavičce (Kadence nastavuje --kb-nav-top-link-color: palette4) */
.wp-block-kadence-header, .wp-block-kadence-navigation, .site-header, #masthead, .kb-off-canvas {
  --kb-nav-top-link-color: var(--b3-heading);
  --kb-nav-top-link-color-hover: var(--b3-accent);
  --kb-nav-top-link-color-active: var(--b3-accent);
  --kb-nav-dropdown-link-color: var(--b3-heading);
  --kb-nav-dropdown-link-color-hover: var(--b3-accent);
}
.wp-block-kadence-navigation a.kb-nav-link-content,
.wp-block-kadence-navigation .kb-nav-link-content,
.kb-off-canvas a.kb-nav-link-content,
header .kb-nav-link-content { color: var(--b3-heading); }
.wp-block-kadence-navigation a.kb-nav-link-content:hover,
.kb-off-canvas a.kb-nav-link-content:hover,
header .kb-nav-link-content:hover { color: var(--b3-accent); }

/* Hlavička je nad hero PRŮHLEDNÁ (třída header-desktop-transparent, kontejner
   position: absolute, není sticky) a logo je světlé (#f4f6ff). Tmavé odkazy
   z bloku výše měly na hero #16212e kontrast 1,00 : 1 — tedy doslova neviditelné.
   Na stránkách, které začínají hero pásem (všechny obsahové), proto odkazy zbělají;
   hover a aktivní položka teplým akcentem (6,49:1 na #16212e). */
body:has(.b3-hero) .wp-block-kadence-header.header-desktop-transparent {
  --kb-nav-top-link-color: #ffffff;
  --kb-nav-top-link-color-hover: var(--b3-accent-warm);
  --kb-nav-top-link-color-active: var(--b3-accent-warm);
}
body:has(.b3-hero) .wp-block-kadence-header.header-desktop-transparent .kb-nav-link-content,
body:has(.b3-hero) .wp-block-kadence-header.header-desktop-transparent .kb-nav-link-content:visited {
  color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .38);
}
body:has(.b3-hero) .wp-block-kadence-header.header-desktop-transparent .kb-nav-link-content:hover,
body:has(.b3-hero) .wp-block-kadence-header.header-desktop-transparent .kb-nav-link-content:focus,
body:has(.b3-hero) .wp-block-kadence-header.header-desktop-transparent .current-menu-item > .kb-nav-link-content {
  color: var(--b3-accent-warm); text-shadow: none;
}
/* stránky bez hero (kdyby přibyla) si drží tmavý text — tam je hlavička nad bílou */
body:not(:has(.b3-hero)) .wp-block-kadence-header.header-desktop-transparent .kb-nav-link-content { color: var(--b3-heading); }

/* Tlačítka Kadence (hlavička „Poptat tisk“ i další): původní gradient #e54b64→#f78361
   dává s bílým textem 3,8:1 (na oranžovém konci jen 2,5:1) → přebíjíme akcentem #c62f47 (5,39:1). */
.wp-block-kadence-header .kb-button, header .kb-button, .kb-buttons-wrap .kb-button {
  background-image: var(--b3-grad) !important;
  background-color: var(--b3-grad-a) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.wp-block-kadence-header .kb-button .kt-btn-inner-text, header .kb-button .kt-btn-inner-text,
.kb-buttons-wrap .kb-button .kt-btn-inner-text { color: #fff !important; }
.wp-block-kadence-header .kb-button:hover, header .kb-button:hover, .kb-buttons-wrap .kb-button:hover {
  background-image: var(--b3-grad-hover) !important;
  background-color: var(--b3-accent-hover) !important;
}
.wp-block-kadence-header .kb-button:focus-visible, header .kb-button:focus-visible {
  outline: 3px solid var(--b3-dark); outline-offset: 2px;
}

/* patička */
.site-footer, #colophon, .site-footer p, .site-footer span, .site-footer div { color: var(--b3-text-soft); }
.site-footer :where(a, a:visited) { color: var(--b3-accent); text-decoration: none; }
.site-footer :where(a:hover, a:focus) { color: var(--b3-accent-hover); text-decoration: underline; }

/* ==========================================================================
   3) HERO
   ========================================================================== */
.b3-hero { position: relative; background: var(--b3-dark); color: var(--b3-on-dark); overflow: hidden; padding-block: var(--b3-space-8) var(--b3-space-7); }
.b3-hero:before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(900px 420px at 8% -20%, rgba(198, 47, 71, .28), transparent 62%),
              radial-gradient(700px 380px at 100% 0%, rgba(247, 131, 97, .16), transparent 64%);
}
.b3-hero__inner { position: relative; z-index: 2; }
.b3-hero h1 { font-size: clamp(1.95rem, 1.35rem + 2.4vw, 3.15rem); line-height: 1.14; letter-spacing: -.02em; font-weight: 800; color: var(--b3-on-dark); margin: 0 0 var(--b3-space-3); max-width: 22ch; }
.b3-hero__lead { font-size: clamp(1rem, .96rem + .3vw, 1.15rem); line-height: 1.8; color: var(--b3-on-dark-soft); max-width: 62ch; margin: 0 0 var(--b3-space-5); }
.b3-hero .b3-eyebrow { color: var(--b3-accent-warm); }
.b3-hero__actions { display: flex; flex-wrap: wrap; gap: var(--b3-space-3); align-items: center; margin: 0; }
.b3-hero__actions:not(:last-child) { margin-bottom: var(--b3-space-6); }

/* ==========================================================================
   4) STATISTIKY
   ========================================================================== */
.b3-stats { --b3-cols: 4; --b3-mrizka-gap: var(--b3-space-3); margin-top: var(--b3-space-6); }
.b3-stats--3 { --b3-cols: 3; }
/* výchozí = světlý podklad (karta s tmavým textem) */
.b3-stat {
  background: var(--b3-bg); border: 1px solid var(--b3-line);
  border-radius: var(--b3-radius-sm); padding: var(--b3-space-4) var(--b3-space-4);
  box-shadow: var(--b3-shadow-sm);
}
.b3-stat p { margin: 0; }
.b3-stat__num { display: block; font-size: 1.3rem; font-weight: 800; color: var(--b3-heading); line-height: 1.25; letter-spacing: -.01em; }
.b3-stat__label { display: block; font-size: .85rem; line-height: 1.5; color: var(--b3-text-soft); margin-top: var(--b3-space-1); }

/* na tmavém podkladu (hero, tmavé sekce, spotlight) prosklená varianta */
.b3-hero .b3-stat, .b3-section--dark .b3-stat, .b3-spotlight .b3-stat {
  background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .14); box-shadow: none;
}
.b3-hero .b3-stat__num, .b3-section--dark .b3-stat__num, .b3-spotlight .b3-stat__num { color: var(--b3-on-dark); }
.b3-hero .b3-stat__label, .b3-section--dark .b3-stat__label, .b3-spotlight .b3-stat__label { color: var(--b3-on-dark-soft); }

/* ==========================================================================
   5) KARTY
   ========================================================================== */
.b3-cards { --b3-cols: 3; --b3-mrizka-gap: var(--b3-gap); }
.b3-cards--2 { --b3-cols: 2; }
.b3-card {
  background: var(--b3-bg); border: 1px solid var(--b3-line); border-radius: var(--b3-radius);
  padding: var(--b3-space-5); box-shadow: var(--b3-shadow-sm);
  display: flex; flex-direction: column; gap: var(--b3-space-3);
  transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}
.b3-card { position: relative; overflow: hidden; }
.b3-card:before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background-image: var(--b3-grad); opacity: 0; transition: opacity .18s ease;
}
.b3-card:hover { box-shadow: var(--b3-shadow); border-color: var(--b3-line-strong); transform: translateY(-2px); }
.b3-card:hover:before, .b3-card:focus-within:before { opacity: 1; }
.b3-card > p, .b3-card > ul { margin: 0; }
.b3-card__icon-wrap { margin: 0 !important; line-height: 1; }
.b3-card__title { font-size: 1.1rem; font-weight: 800; color: var(--b3-heading); margin: 0; letter-spacing: -.01em; }
.b3-card p:not(.b3-card__icon-wrap) { color: var(--b3-text-soft); line-height: 1.7; font-size: .97rem; }
.b3-card__more { margin-top: auto; font-weight: 700; color: var(--b3-accent); text-decoration: none; font-size: .95rem; }
.b3-card__more:hover, .b3-card__more:focus { color: var(--b3-accent-hover); text-decoration: underline; text-underline-offset: 3px; }

/* ==========================================================================
   6) IKONY (vlastní SVG ze shortcode [b3icon])
   ========================================================================== */
.b3-ico { display: inline-flex; align-items: center; justify-content: center; }
.b3-ico svg {
  width: 30px; height: 30px; display: block;
  fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.b3-card__icon-wrap .b3-ico { color: var(--b3-accent); }
/* tah ikony = přechod (dvě barvy), na tmavém podkladu světlejší dvojice */
.b3-ico stop.b3-stop-a { stop-color: var(--b3-grad-a); }
.b3-ico stop.b3-stop-b { stop-color: var(--b3-grad-b); }
.b3-section--dark .b3-ico stop.b3-stop-a, .b3-spotlight .b3-ico stop.b3-stop-a,
.b3-hero .b3-ico stop.b3-stop-a { stop-color: #f78361; }
.b3-section--dark .b3-ico stop.b3-stop-b, .b3-spotlight .b3-ico stop.b3-stop-b,
.b3-hero .b3-ico stop.b3-stop-b { stop-color: #ffb199; }
.b3-ico--box { width: 46px; height: 46px; border-radius: var(--b3-radius-sm); background: var(--b3-accent-wash); }
.b3-section--dark .b3-card__icon-wrap .b3-ico, .b3-spotlight .b3-card__icon-wrap .b3-ico { color: var(--b3-accent-warm); }

/* ==========================================================================
   7) KROKY
   ========================================================================== */
.b3-steps { --b3-cols: 4; --b3-mrizka-gap: var(--b3-gap); }
.b3-step { background: var(--b3-bg); border: 1px solid var(--b3-line); border-radius: var(--b3-radius); padding: var(--b3-space-5); box-shadow: var(--b3-shadow-sm); }
.b3-step__num {
  width: 38px; height: 38px; border-radius: var(--b3-radius-pill);
  background-image: var(--b3-grad); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .95rem;
  margin: 0 0 var(--b3-space-4);
}
.b3-step h3 { font-size: 1.02rem; margin: 0 0 var(--b3-space-2); color: var(--b3-heading); font-weight: 800; }
.b3-step p:not(.b3-step__num) { margin: 0; color: var(--b3-text-soft); line-height: 1.7; font-size: .95rem; }

/* ==========================================================================
   8) SPOTLIGHT
   ========================================================================== */
.b3-spotlight { background: var(--b3-dark); color: var(--b3-on-dark-soft); border-radius: var(--b3-radius); padding: var(--b3-space-7) var(--b3-space-6); position: relative; overflow: hidden; }
.b3-spotlight:before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(680px 320px at 100% 0%, rgba(198, 47, 71, .26), transparent 62%); }
.b3-spotlight > * { position: relative; z-index: 2; }
.b3-spotlight h2 { color: var(--b3-on-dark); font-size: clamp(1.45rem, 1.15rem + 1.1vw, 2rem); margin: 0 0 var(--b3-space-3); font-weight: 800; }
.b3-spotlight p { color: var(--b3-on-dark-soft); line-height: 1.8; }
.b3-spotlight .b3-lead { color: var(--b3-on-dark-soft); margin-bottom: var(--b3-space-5); }
.b3-spotlight .b3-hero__actions { margin-bottom: 0; }
.b3-grid-2 { --b3-cols: 2; --b3-mrizka-gap: var(--b3-space-7); }
.b3-grid-2 + .b3-table-wrap, .b3-grid-2 + .wp-block-table { margin-top: var(--b3-space-6); }
.b3-grid-2 h3 { margin-top: 0; }

/* ==========================================================================
   9) CHECKLISTY
   ========================================================================== */
/* Kadence má .single-content ul { padding-left: 2em } → každý seznam byl odsazený
   o 32 px proti nadpisu („divné odsazení seznamu"). Specificita musí přebít
   .single-content ul. */
ul.b3-checks, .single-content ul.b3-checks, .entry-content ul.b3-checks {
  list-style: none; margin: 0; padding-left: 0; padding-right: 0;
}
.b3-checks li { position: relative; padding: 0 0 var(--b3-space-3) 30px; line-height: 1.65; color: var(--b3-text-soft); }
.b3-checks li:last-child { padding-bottom: 0; }
.b3-checks li:before {
  content: ""; position: absolute; left: 0; top: .3em; width: 18px; height: 18px;
  border-radius: 5px; background-image: var(--b3-grad);
}
.b3-checks li:after {
  content: ""; position: absolute; left: 5px; top: .62em; width: 8px; height: 4px;
  border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg);
}
.b3-section--dark .b3-checks li, .b3-spotlight .b3-checks li { color: var(--b3-on-dark-soft); }
.b3-section--dark .b3-checks li:before, .b3-spotlight .b3-checks li:before { background-image: var(--b3-grad-warm); }

/* ==========================================================================
   10) TABULKY
   ========================================================================== */
.b3-table-wrap, .b3-table { margin: 0; }
.wp-block-table.b3-table { overflow-x: auto; }
.b3-table table { width: 100%; border-collapse: collapse; border: 1px solid var(--b3-line); border-radius: var(--b3-radius); background: var(--b3-bg); overflow: hidden; }
.b3-table th, .b3-table td { padding: var(--b3-space-3) var(--b3-space-4); text-align: left; border-bottom: 1px solid var(--b3-line); vertical-align: top; line-height: 1.65; }
.b3-table th { background: var(--b3-dark); color: var(--b3-on-dark); font-weight: 700; font-size: .9rem; }
.b3-table td { color: var(--b3-text-soft); }
.b3-table tbody tr:last-child td { border-bottom: 0; }
.b3-table tbody tr:nth-child(even) { background: var(--b3-bg-soft); }
.b3-table td strong { color: var(--b3-heading); }

/* ==========================================================================
   10b) TABULKY NA MOBILU — řádky jako bloky (tabulka se vejde na displej)
   ========================================================================== */
@media (max-width: 720px) {
  .b3-table { overflow: visible; }
  .b3-table table { display: block; width: 100%; min-width: 0; border: 0; background: transparent; }
  .b3-table thead { display: none; }
  .b3-table tbody { display: block; }
  .b3-table tr {
    display: block; background: var(--b3-bg); border: 1px solid var(--b3-line);
    border-radius: var(--b3-radius-sm); padding: var(--b3-space-3) var(--b3-space-4);
    margin-bottom: var(--b3-space-3);
  }
  .b3-table tbody tr:nth-child(even) { background: var(--b3-bg); }
  .b3-table td { display: block; border: 0; padding: 2px 0; }
  .b3-table td:first-child { font-weight: 800; color: var(--b3-heading); font-size: 1.02rem; padding-bottom: 4px; }
  .b3-table td:last-child { padding-bottom: 0; }
  /* doplnění popisků sloupců tam, kde by se kontext ztratil */
  .b3-table--materials td:nth-child(2)::before { content: "Kde dává smysl: "; font-weight: 600; color: var(--b3-heading); }
  .b3-table--materials td:nth-child(3)::before { content: "Vlastnosti: "; font-weight: 600; color: var(--b3-heading); }
  .b3-table--materials td:nth-child(4)::before { content: "Dostupnost: "; font-weight: 600; color: var(--b3-heading); }
}

/* ==========================================================================
   11) FAQ
   ========================================================================== */
.b3-faq { display: grid; gap: var(--b3-space-2); max-width: 860px; margin-inline: auto; }
.b3-faq details, .b3-faq__item { background: var(--b3-bg); border: 1px solid var(--b3-line); border-radius: var(--b3-radius-sm); box-shadow: none; }
.b3-faq summary { cursor: pointer; padding: var(--b3-space-4) var(--b3-space-5); font-weight: 700; color: var(--b3-heading); list-style: none; display: flex; justify-content: space-between; align-items: center; gap: var(--b3-space-3); }
.b3-faq summary::-webkit-details-marker { display: none; }
.b3-faq summary:after {
  content: "+"; font-size: 1.35rem; line-height: 1; font-weight: 700; flex: none;
  background-image: var(--b3-grad); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.b3-faq details[open] summary:after { content: "–"; }
.b3-faq .b3-faq__body { padding: 0 var(--b3-space-5) var(--b3-space-4); color: var(--b3-text-soft); line-height: 1.8; }
.b3-faq summary:hover { color: var(--b3-accent); }
.b3-faq summary:focus-visible { outline: 3px solid var(--b3-accent); outline-offset: 2px; }

/* ==========================================================================
   12) CTA — závěrečný pás na konci každé stránky
   Dřív měl stejný akcentní gradient jako zbytek webu a tlačítko dostalo přes
   .wp-block-button:not(.is-style-outline) (specificita 0,3,0) tentýž gradient —
   na podkladu tedy zmizelo (naměřeno 1,00 : 1, tlačítko splývalo s pásem).
   Teď je pás tmavý (#16212e, stejná rodina jako hero a spotlight) a primární
   tlačítko bílé s tmavým textem = 16,3 : 1; outline varianta bílý text/rámeček.
   ========================================================================== */
.b3-cta {
  position: relative; overflow: hidden; isolation: isolate;
  background-image: none; background-color: var(--b3-dark);
  border: 0; border-radius: var(--b3-radius); padding: var(--b3-space-7) var(--b3-space-6); text-align: center;
}
.b3-cta > * { position: relative; z-index: 2; }
.b3-cta h2 { color: #fff; margin: 0 0 var(--b3-space-3); font-size: clamp(1.45rem, 1.15rem + 1.1vw, 2rem); font-weight: 800; }
.b3-cta p { color: var(--b3-on-dark-soft); max-width: 60ch; margin: 0 auto var(--b3-space-5); line-height: 1.8; }
.b3-cta .wp-block-buttons { justify-content: center; }
/* primární tlačítko: bílá plocha, tmavý text (selektor záměrně přebíjí 0,3,0) */
.b3-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background-image: none; background-color: #fff; color: var(--b3-dark);
  border: 2px solid #fff; box-shadow: var(--b3-shadow-sm);
}
.b3-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.b3-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus {
  /* BACKGROUND-IMAGE: NONE je tu nezbytné — obecné pravidlo pro hover
     (.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, spec. 0,4,0)
     nastavuje background-image: var(--b3-grad-hover). Ten se vykreslí NAD bílou
     plochou a tmavě červený text (#a81f33) na něm měl kontrast 1,00 : 1. */
  background-image: none; background-color: #fff; color: var(--b3-accent-hover);
  border-color: #fff; box-shadow: var(--b3-shadow);
}
.b3-cta a:focus-visible { outline-color: #fff; }
/* sekundární (outline) tlačítko na tmavém pásu: bílý text i rámeček */
.b3-cta .wp-block-button.is-style-outline .wp-block-button__link {
  background-image: none; background-color: transparent; color: #fff;
  border: 2px solid rgba(255, 255, 255, .75);
}
.b3-cta .wp-block-button.is-style-outline .wp-block-button__link:hover,
.b3-cta .wp-block-button.is-style-outline .wp-block-button__link:focus {
  background-color: rgba(255, 255, 255, .14); color: #fff; border-color: #fff;
}

/* ==========================================================================
   13) TLAČÍTKA (core button) — AA kontrast, focus stavy
   ========================================================================== */
.wp-block-button__link, .kb-button {
  border-radius: var(--b3-radius-pill); padding: .85em 1.6em; font-weight: 700; font-size: 1rem;
  text-decoration: none; transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background-image: var(--b3-grad); background-color: var(--b3-grad-a); color: #fff; box-shadow: var(--b3-shadow-sm);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:focus {
  background-image: var(--b3-grad-hover); background-color: var(--b3-accent-hover); color: #fff;
}
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--b3-heading); border: 1.5px solid var(--b3-line-strong); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--b3-dark); color: var(--b3-dark); }
.b3-hero .wp-block-button.is-style-outline .wp-block-button__link { color: var(--b3-on-dark); border-color: rgba(255, 255, 255, .45); }
.b3-hero .wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }
/* stejné chování pro outline tlačítka na tmavé kartě (dřív na hoveru nic nedělala) */
.b3-spotlight .wp-block-button.is-style-outline .wp-block-button__link { color: var(--b3-on-dark); border-color: rgba(255, 255, 255, .45); }
.b3-spotlight .wp-block-button.is-style-outline .wp-block-button__link:hover,
.b3-spotlight .wp-block-button.is-style-outline .wp-block-button__link:focus { border-color: #fff; background: rgba(255, 255, 255, .08); }
.wp-block-button__link:focus-visible, .kb-button:focus-visible, a:focus-visible, summary:focus-visible {
  outline: 3px solid var(--b3-accent); outline-offset: 2px; border-radius: var(--b3-radius-sm);
}
.b3-hero .wp-block-button__link:focus-visible { outline-color: var(--b3-accent-warm); }

/* ==========================================================================
   14) DOPLŇKY
   ========================================================================== */
.b3-badges { display: flex; flex-wrap: wrap; gap: var(--b3-space-2); margin: 0 0 var(--b3-space-5); }
.b3-badges p { margin: 0; }
.b3-badge {
  display: inline-block; background-image: var(--b3-grad); color: #fff; border: 0;
  border-radius: var(--b3-radius-pill); padding: 7px 15px; font-size: .84rem; font-weight: 700;
}
.b3-spotlight .b3-badge, .b3-section--dark .b3-badge, .b3-hero .b3-badge {
  background-image: none; background-color: rgba(255, 255, 255, .14); color: #fff; border: 1px solid rgba(255, 255, 255, .35);
}
.b3-note { font-size: .92rem; color: var(--b3-text-soft); font-style: italic; }
/* „Hraniční" karta — druhá kolona sekcí o limitech (světlá akcentní plocha s linkou vlevo) */
.b3-callout {
  background: var(--b3-accent-wash); border: 1px solid #f0d8dd; border-left: 4px solid var(--b3-accent);
  border-radius: var(--b3-radius-sm); padding: var(--b3-space-4) var(--b3-space-5);
  color: var(--b3-text); line-height: 1.75; font-size: .97rem;
}
.b3-callout strong { color: var(--b3-heading); }
.b3-placeholder {
  background: var(--b3-bg-sink); border: 1px dashed var(--b3-line-strong); border-radius: var(--b3-radius);
  min-height: 200px; display: flex; align-items: center; justify-content: center;
  color: var(--b3-text-soft); font-size: .92rem; text-align: center; padding: var(--b3-space-5);
}
.b3-anchor { scroll-margin-top: 130px; }
.b3-help { padding-block: var(--b3-space-7); border-top: 1px solid var(--b3-line); }
.b3-help:first-child { border-top: 0; padding-top: 0; }
.b3-help + .b3-help { margin-top: 0; }

/* ===== HAMBURGER (off-canvas trigger) na mobilu =====
   Kadence mu dává tmavý čtverec (#121e2c), který na gradientovém hero působí jako flek.
   Řešení: plně průhledné pozadí + světlá ikona (hlavička je transparentní nad tmavým hero). */
@media (max-width: 1024px) {
  .wp-block-kadence-off-canvas-trigger,
  [class*="off-canvas-trigger"],
  .kt-blocks-off-canvas-trigger {
    background-color: transparent !important;
    background-image: none !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: var(--b3-radius-pill) !important;
    transition: background-color .18s ease;
  }
  .wp-block-kadence-off-canvas-trigger:hover,
  .wp-block-kadence-off-canvas-trigger:focus,
  [class*="off-canvas-trigger"]:hover,
  [class*="off-canvas-trigger"]:focus {
    background-color: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
  }
  .wp-block-kadence-off-canvas-trigger:focus-visible,
  [class*="off-canvas-trigger"]:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
  .wp-block-kadence-off-canvas-trigger svg,
  [class*="off-canvas-trigger"] svg {
    stroke: currentColor !important; fill: none !important;
    width: 26px; height: 26px;
  }
  .kb-off-canvas-inner-wrap, .kb-off-canvas { --kb-nav-top-link-color: var(--b3-heading); }
}


/* ==========================================================================
   10c) MŘÍŽKY — POZOR na inner-container
   Kadence obaluje obsah skupiny do .wp-block-group__inner-container. Mřížka
   proto patří na vnitřní obal; kdyby zůstala na vnějším, stal by se z něj
   jeden „sloupec" a karty by se skládaly pod sebe (jednostránkový layout).
   Počet sloupců řídí token --b3-cols, responzivita ho jen přepisuje.
   ========================================================================== */
.b3-stats:not(:has(> .wp-block-group__inner-container)),
.b3-cards:not(:has(> .wp-block-group__inner-container)),
.b3-steps:not(:has(> .wp-block-group__inner-container)),
.b3-grid-2:not(:has(> .wp-block-group__inner-container)) {
  display: grid;
  grid-template-columns: repeat(var(--b3-cols, 3), minmax(0, 1fr));
  gap: var(--b3-mrizka-gap, var(--b3-gap));
  align-items: start;
}
.b3-stats:has(> .wp-block-group__inner-container),
.b3-cards:has(> .wp-block-group__inner-container),
.b3-steps:has(> .wp-block-group__inner-container),
.b3-grid-2:has(> .wp-block-group__inner-container) { display: block; }

.b3-stats > .wp-block-group__inner-container,
.b3-cards > .wp-block-group__inner-container,
.b3-steps > .wp-block-group__inner-container,
.b3-grid-2 > .wp-block-group__inner-container {
  display: grid;
  grid-template-columns: repeat(var(--b3-cols, 3), minmax(0, 1fr));
  gap: var(--b3-mrizka-gap, var(--b3-gap));
  align-items: start;
}

/* ==========================================================================
   10d) KARTY A KROKY: STEJNÁ VÝŠKA V ŘADĚ
   Karty se roztáhnou na výšku nejvyššího obsahu v řadě a obsah se rozloží tak,
   aby odkaz „Detail služby“ zůstal u spodní hrany.
   Pozor: obsah skupiny je v .wp-block-group__inner-container, takže flex musí
   být i na něm — jinak margin-top: auto nemá na čem fungovat.
   ========================================================================== */
.b3-cards > .wp-block-group__inner-container,
.b3-steps > .wp-block-group__inner-container { align-items: stretch; }

/* WP/Kadence dává položkám ve „flow“ layoutu margin-block-end (32 px), což stretch
   srazí o tu marži — karta pak byla o 32 px nižší než nejvyšší v řadě.
   Selektor musí být specifičtější než pravidlo layoutu, jinak nevyhraje. */
.b3-cards > .wp-block-group__inner-container > *,
.b3-steps > .wp-block-group__inner-container > *,
.b3-stats > .wp-block-group__inner-container > * { margin-block: 0; }

.b3-card > .wp-block-group__inner-container {
  display: flex; flex-direction: column; flex: 1;
}
.b3-card > .wp-block-group__inner-container > p:last-child { margin-top: auto; }

/* ==========================================================================
   10e) TMAVÁ KARTA „PRO E-SHOPY“ — VYSTŘEDĚNÁ
   ========================================================================== */
.b3-spotlight { text-align: center; }
.b3-spotlight h2 { max-width: 26ch; margin-inline: auto; }
.b3-spotlight .b3-lead { margin-inline: auto; }
.b3-spotlight .b3-eyebrow { margin-inline: auto; }
.b3-spotlight .b3-hero__actions { justify-content: center; }
/* seznam zůstává čitelný vlevo, ale jako blok je na středu */
.b3-spotlight .b3-checks { max-width: 720px; margin-inline: auto; text-align: left; }

/* skip link (zobrazí se při ovládání klávesnicí) — 16,3:1 místo původních 3,8:1 */
.skip-link.screen-reader-text, a.skip-link { background-color: var(--b3-dark); color: #fff; }
.skip-link.screen-reader-text:focus, a.skip-link:focus {
  background-color: var(--b3-dark); color: #fff; padding: 12px 20px;
  border-radius: var(--b3-radius-sm); z-index: 100000; box-shadow: var(--b3-shadow);
  clip: auto; clip-path: none; width: auto; height: auto; overflow: visible;
}

/* odkazy v textu musí být rozlišitelné i bez barvy */
.b3-card p a, .b3-lead a, .b3-faq__body a, .b3-checks a { color: var(--b3-accent); text-decoration: underline; text-underline-offset: 3px; }
.b3-card p a:hover, .b3-lead a:hover, .b3-faq__body a:hover, .b3-checks a:hover { color: var(--b3-accent-hover); }

/* ==========================================================================
   15) RESPONSIVITA
   ========================================================================== */
@media (max-width: 1100px) {
  :root { --b3-section-y: 56px; }
  /* na tabletu/mobilu animovaná vrstva neběží (viz 16b) */
  .b3-cards, .b3-cards--2, .b3-steps { --b3-cols: 2; }
  .b3-hero h1 { max-width: 26ch; }
}
@media (max-width: 860px) {
  :root { --b3-section-y: 44px; --b3-gutter: 20px; --b3-gap: 20px; }
  .b3-grid-2 { --b3-cols: 1; --b3-mrizka-gap: var(--b3-space-5); }
  .b3-spotlight, .b3-cta { padding: var(--b3-space-5) var(--b3-space-4); }
  .b3-hero { padding-block: var(--b3-space-7) var(--b3-space-6); }
  .b3-hero__lead { font-size: 1rem; }
}
@media (max-width: 640px) {
  :root { --b3-section-y: 36px; }
  .b3-cards, .b3-cards--2, .b3-steps, .b3-stats { --b3-cols: 1; }
  .b3-card, .b3-step { padding: var(--b3-space-4); }
  .b3-h2 { margin-bottom: var(--b3-space-2); }
  .b3-lead { margin-bottom: var(--b3-space-5); }

  /* tlačítka: na mobilu vycentrovaná na střed (přirozená šířka, slušný tap target) */
  .wp-block-buttons { justify-content: center; gap: var(--b3-space-3); }
  .b3-hero__actions { flex-direction: column; align-items: center; }
  .b3-hero__actions .wp-block-buttons, .b3-cta .wp-block-buttons, .b3-spotlight .wp-block-buttons { justify-content: center; width: auto; }
  .b3-hero__actions .wp-block-button, .b3-cta .wp-block-button, .b3-spotlight .wp-block-button { width: auto; margin: 0; }
  .b3-hero__actions .wp-block-button__link, .b3-cta .wp-block-button__link, .b3-spotlight .wp-block-button__link {
    width: auto; min-width: 220px; max-width: 100%; text-align: center;
  }
}

/* tlačítka obecně: rozestupy a zarovnání */
.wp-block-buttons { gap: var(--b3-space-3); }
.b3-hero__actions .wp-block-buttons, .b3-cta .wp-block-buttons, .b3-spotlight .wp-block-buttons { margin: 0; }

/* ==========================================================================
   16b) POZADOVÁNÍ ANIMACE — jemná „aurora" v tmavých pásech
   Jen na tmavých plochách (hero, spotlight, CTA), jen na desktopu (≥1025 px)
   a jen když uživatel nemá zapnuté omezení pohybu. Animuje se výhradně
   transform (kompozitor, žádné reflow/layout) — vrstva je o 12 % větší, aby
   při posunu neodkrývala okraj; drží se 3 vrstvy na stránku.
   Na mobilu a při prefers-reduced-motion se vrstva vůbec nevykreslí.
   ========================================================================== */
.b3-hero:after, .b3-spotlight:after, .b3-cta:after {
  content: ""; position: absolute; inset: -12%; z-index: 1; display: none;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .07) 1px, transparent 1.7px),
    radial-gradient(closest-side, rgba(198, 47, 71, .30), transparent 72%),
    radial-gradient(closest-side, rgba(247, 131, 97, .22), transparent 72%);
  background-size: 26px 26px, 58% 58%, 46% 46%;
  background-position: 0 0, 14% 20%, 86% 80%;
  background-repeat: repeat, no-repeat, no-repeat;
}
@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
  .b3-hero:after {
    display: block; will-change: transform;
    animation: b3-aurora-a 64s ease-in-out infinite alternate;
  }
  .b3-spotlight:after {
    display: block; will-change: transform;
    animation: b3-aurora-b 78s ease-in-out infinite alternate;
  }
  .b3-cta:after {
    display: block; will-change: transform;
    animation: b3-aurora-a 70s ease-in-out infinite alternate;
  }
  @keyframes b3-aurora-a {
    from { transform: translate3d(-3%, -2%, 0) scale(1.02); }
    to   { transform: translate3d(3%, 2%, 0) scale(1.09); }
  }
  @keyframes b3-aurora-b {
    from { transform: translate3d(2.5%, 1.5%, 0) scale(1.07); }
    to   { transform: translate3d(-2.5%, -2%, 0) scale(1); }
  }
}

/* ==========================================================================
   16c) TISKOVÁ LINKA (toolpath) — malý dekorativní detail v rohu sekce
   Náhled dílu jako v sliceru (obrys šestiúhelníku + výplň + otvor) o velikosti
   ~300 × 265 px v pravém horním rohu sekce. Cesty se „tisknou" pořád dokola:
   24 s smyčka = kreslení (každá cesta s 2 s odstupem) → pauza → zmizení → znovu.
   Je to časová animace (ne scrollová), takže je vidět, i když se nehýbe myš…
   Vrstva má z-index: -1 uvnitř stacking contextu sekce → leží nad pozadím sekce,
   ale pod veškerým obsahem; okraje rozpouští radiální maska.
   Jen na desktopu ≥1025 px a při preferenci pohybu — na mobilu se nevykresluje
   vůbec (žádné velké linky přes celou obrazovku).
   ========================================================================== */
.b3-section:has(.b3-toolpath) { position: relative; z-index: 0; }
/* POZOR: overflow: hidden tu být NESMÍ u scrollových variant — prvek s overflow
   je scroll container a to rozbíjí animace vázané na scroll. */
.b3-toolpath {
  display: none; position: absolute; top: var(--b3-space-5); right: var(--b3-space-5);
  width: 300px; height: 264px; z-index: -1; pointer-events: none;
  -webkit-mask-image: radial-gradient(closest-side at 50% 50%, #000 50%, transparent 100%);
  mask-image: radial-gradient(closest-side at 50% 50%, #000 50%, transparent 100%);
}
.b3-toolpath svg { display: block; width: 100%; height: 100%; }
.b3-toolpath path {
  fill: none; stroke: var(--b3-line-strong); stroke-width: 1.15; opacity: .46;
  stroke-linecap: round; stroke-linejoin: round;
}
.b3-toolpath path.b3-tp-piece { stroke: var(--b3-accent); opacity: .32; }
@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
  /* Animace tiskové linky je na přání klienta vypnutá (26. 9. 2026).
     Markup polí zůstává v obsahu, stačí tady vrátit display: block a animaci. */
  .b3-toolpath { display: none; }
  .b3-toolpath path { stroke-dasharray: 1000; animation: b3-tp-line 24s linear infinite; }
  /* výplň a otvor kreslíme s odstupem — vypadá to jako postupné tisknutí vrstev */
  .b3-toolpath path:nth-child(2) { animation-delay: 2s; }
  .b3-toolpath path:nth-child(3) { animation-delay: 4s; }
}
/* kreslení: 0–62 % cyklu (≈15 s), pak drží dokresleno do konce */
@keyframes b3-tp-line {
  0% { stroke-dashoffset: 1000; }
  62% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 0; }
}
/* obálka: nahoře se objeví, po dokreslení zmizí — takže reset cest není vidět */
@keyframes b3-tp-envelope {
  0% { opacity: 0; }
  5% { opacity: 1; }
  84% { opacity: 1; }
  96% { opacity: 0; }
  100% { opacity: 0; }
}

/* respektuj uživatelské nastavení omezeného pohybu */
@media (prefers-reduced-motion: reduce) {
  .b3-card, .wp-block-button__link, .kb-button { transition: none; }
  .b3-card:hover { transform: none; }
}

/* ==========================================================================
   16) BLOG — seznam článků (blok Nejnovější příspěvky)
   ========================================================================== */
.b3-latest.wp-block-latest-posts {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: var(--b3-space-3);
}
.b3-latest.wp-block-latest-posts li {
  margin: 0; padding: var(--b3-space-5);
  background: var(--b3-bg); border: 1px solid var(--b3-line);
  border-radius: var(--b3-radius); box-shadow: var(--b3-shadow-sm);
  position: relative; overflow: hidden;
}
.b3-latest.wp-block-latest-posts li:before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background-image: var(--b3-grad);
}
.b3-latest .wp-block-latest-posts__post-title {
  font-size: 1.1rem; font-weight: 800; color: var(--b3-heading);
  text-decoration: none; display: inline-block; margin-bottom: var(--b3-space-1);
}
.b3-latest .wp-block-latest-posts__post-title:hover,
.b3-latest .wp-block-latest-posts__post-title:focus { color: var(--b3-accent); text-decoration: underline; text-underline-offset: 3px; }
.b3-latest .wp-block-latest-posts__post-date { display: block; color: var(--b3-text-soft); font-size: .88rem; }
.b3-latest .wp-block-latest-posts__post-excerpt { color: var(--b3-text-soft); line-height: 1.75; margin: var(--b3-space-2) 0 0; }
.b3-latest .wp-block-latest-posts__post-excerpt a { color: var(--b3-accent); }
.register-placeholder { color: var(--b3-text-soft); }

/* ==========================================================================
   18) POPTÁVKOVÝ FORMULÁŘ (Kadence Advanced Form)
   Kadence si nosí vlastní styly — přebíjíme je, aby formulář sedl do
   design systému (stejné rádiusy, rámečky, akcentní tlačítko a focus).
   ========================================================================== */
.b3-form-card {
  background: var(--b3-bg); border: 1px solid var(--b3-line); border-radius: var(--b3-radius);
  box-shadow: var(--b3-shadow-sm);
  padding: var(--b3-space-7) var(--b3-space-7);
  max-width: 820px; margin-inline: auto;
}
.kb-advanced-form .kb-adv-form-field { margin: 0 0 var(--b3-space-5); }
.kb-advanced-form .kb-adv-form-label {
  display: block; font-weight: 700; color: var(--b3-heading);
  font-size: .95rem; line-height: 1.4; margin-bottom: 6px;
}
.kb-advanced-form .kb-adv-form-required { color: var(--b3-accent); margin-left: 3px; }
.kb-advanced-form .kb-adv-form-help {
  font-size: .85rem; color: var(--b3-text-soft); line-height: 1.6;
  margin-top: 6px; max-width: 60ch;
}
.kb-advanced-form input[type=text], .kb-advanced-form input[type=email],
.kb-advanced-form input[type=tel], .kb-advanced-form input[type=number],
.kb-advanced-form input[type=date], .kb-advanced-form input[type=file],
.kb-advanced-form select, .kb-advanced-form textarea {
  width: 100%; max-width: 100%; padding: 12px 14px;
  font: inherit; font-size: 1rem; color: var(--b3-text);
  background-color: var(--b3-bg);
  border: 1.5px solid var(--b3-line-strong); border-radius: var(--b3-radius-sm);
  box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
.kb-advanced-form textarea { min-height: 150px; resize: vertical; }
.kb-advanced-form select { appearance: auto; }
.kb-advanced-form input:focus, .kb-advanced-form select:focus, .kb-advanced-form textarea:focus {
  outline: 3px solid var(--b3-accent); outline-offset: 2px; border-color: var(--b3-accent);
}
/* zaškrtávací souhlas (GDPR) */
.kb-advanced-form .kb-adv-form-checkbox-field input[type=checkbox],
.kb-advanced-form input[type=checkbox] {
  width: 20px; height: 20px; min-width: 20px; margin: 2px 10px 0 0;
  accent-color: var(--b3-accent); border: 1.5px solid var(--b3-line-strong);
}
.kb-advanced-form .kb-adv-form-checkbox-field { display: flex; align-items: flex-start; }
.kb-advanced-form .kb-adv-form-checkbox-field label {
  font-weight: 400; color: var(--b3-text); font-size: .95rem; line-height: 1.6; margin: 0;
}
/* rámeček kolem nahrání souboru */
.kb-advanced-form input[type=file] { padding: 10px 12px; font-size: .92rem; cursor: pointer; }
/* tlačítko — stejná podoba jako ostatní primární tlačítka na webu */
.kb-advanced-form .kb-adv-form-submit, .kb-advanced-form button[type=submit],
.kb-advanced-form input[type=submit], .kb-advanced-form .kb-button {
  background-image: var(--b3-grad); background-color: var(--b3-grad-a); color: #fff;
  border: 0; border-radius: var(--b3-radius-pill);
  padding: .9em 2.2em; font: inherit; font-weight: 700; font-size: 1rem;
  cursor: pointer; box-shadow: var(--b3-shadow-sm);
  transition: background-color .18s ease, box-shadow .18s ease;
}
.kb-advanced-form .kb-adv-form-submit:hover, .kb-advanced-form button[type=submit]:hover,
.kb-advanced-form input[type=submit]:hover, .kb-advanced-form .kb-button:hover {
  background-image: var(--b3-grad-hover); background-color: var(--b3-accent-hover);
  color: #fff; box-shadow: var(--b3-shadow);
}
/* zprávy po odeslání */
.kb-advanced-form .kb-adv-form-message {
  border-radius: var(--b3-radius-sm); padding: var(--b3-space-4) var(--b3-space-5);
  font-weight: 600; margin: 0 0 var(--b3-space-4);
}
.kb-adv-form-success { background: #edf7ef; border: 1px solid #b6ddc0; color: #17532c; }
.kb-adv-form-warning, .kb-adv-form-error { background: #fdf2f4; border: 1px solid #f0d3d8; color: #8a1c2b; }
/* chybové hlášky u polí */
.kb-advanced-form .kb-adv-form-error-message, .kb-advanced-form .kb-adv-field-error {
  color: #8a1c2b; font-size: .88rem; margin-top: 6px; font-weight: 600;
}
@media (max-width: 860px) {
  .b3-form-card { padding: var(--b3-space-5) var(--b3-space-4); }
}
/* popisky a doplňkové texty ve formuláři — Kadence je barví světle (kontrast 1,8:1) */
form.kb-advanced-form label, form.kb-advanced-form .kb-adv-form-label,
form.kb-advanced-form legend { color: var(--b3-heading); }
form.kb-advanced-form .kb-adv-form-help, form.kb-advanced-form .kb-adv-form-description,
form.kb-advanced-form .kb-adv-form-checkbox-field label, form.kb-advanced-form .kb-adv-form-infield-type-input label {
  color: var(--b3-text); font-weight: 400;
}
form.kb-advanced-form .kb-adv-form-help, form.kb-advanced-form .kb-adv-form-description {
  color: var(--b3-text-soft); font-size: .88rem;
}
/* odkazy v poznámkách pod sekcemi musí mít akcentní barvu (jinak 3,6:1) */
.b3-note a, .b3-note a:visited { color: var(--b3-accent); text-decoration: underline; text-underline-offset: 3px; }
.b3-note a:hover, .b3-note a:focus { color: var(--b3-accent-hover); }
.b3-todo { color: var(--b3-accent); font-style: normal; font-weight: 700; }
/* zaškrtávací souhlas: legend + popisek u checkboxu (Kadence je barví světle) */
form.kb-advanced-form fieldset.kb-radio-check-item-wrap { border: 0; margin: 0; padding: 0; }
form.kb-advanced-form legend.kb-adv-form-label { color: var(--b3-heading); font-weight: 700; font-size: .95rem; padding: 0 0 8px; }
form.kb-advanced-form .kb-radio-check-item { display: flex; align-items: flex-start; gap: 10px; }
form.kb-advanced-form .kb-radio-check-item label { color: var(--b3-text); font-weight: 400; font-size: .95rem; line-height: 1.6; margin: 0; }
form.kb-advanced-form .kb-radio-check-item input[type=checkbox] { margin: 3px 0 0; flex: none; }
/* stav našeptávání z ARESu u pole IČO */
form.kb-advanced-form .b3-ares { font-size: .85rem; color: var(--b3-text-soft); margin-top: 6px; line-height: 1.5; }
form.kb-advanced-form .b3-ares--ok { color: #17532c; font-weight: 600; }
form.kb-advanced-form .b3-ares--chyba { color: #8a1c2b; }

/* ==========================================================================
   19) MOBILNÍ A TABLETOVÁ NAVIGACE (≤1024 px)
   Původně vodorovná navigace v tablet/mobilním kontejneru hlavičky. Skládáme ji
   na sloupec, dáváme jí vlastní tmavé pozadí a bílé odkazy, aby byl kontrast
   jednoznačný (bílá na #16212e = 14,8 : 1) nezávisle na pozadí řádku hlavičky.
   ========================================================================== */
@media (max-width: 1024px) {
  .wp-block-kadence-navigation51-cpt-id {
    width: 100% !important;
    max-width: 100%;
    background: var(--b3-dark, #16212e);
    border-top: 1px solid rgba(255, 255, 255, .12);
  }
  .wp-block-kadence-navigation51-cpt-id .menu-container { width: 100%; }
  .wp-block-kadence-navigation51-cpt-id .kb-navigation {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
  }
  .wp-block-kadence-navigation51-cpt-id .kb-navigation > li {
    width: 100% !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
  }
  .wp-block-kadence-navigation51-cpt-id .kb-navigation > li:last-child { border-bottom: 0; }
  .wp-block-kadence-navigation51-cpt-id .kb-link-wrap { width: 100%; }
  .wp-block-kadence-navigation51-cpt-id .kb-nav-link-content {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100% !important;
    min-height: 46px;
    padding: 11px 20px !important;
    color: #ffffff !important;
    background: transparent !important;
    font-size: 1rem !important;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none !important;
    box-shadow: inset 0 0 0 0 transparent;
  }
  /* šipka u položek, které mají podmenu */
  .wp-block-kadence-navigation51-cpt-id li > .kb-link-wrap > .kb-nav-link-content::after {
    content: ""; display: none;
  }
  .wp-block-kadence-navigation51-cpt-id .kb-nav-link-content:hover,
  .wp-block-kadence-navigation51-cpt-id .kb-nav-link-content:focus-visible {
    color: #ffffff !important;
    background: rgba(255, 255, 255, .13) !important;
    text-decoration: none !important;
  }
  /* aktuální stránka – akcentní proužek vlevo */
  .wp-block-kadence-navigation51-cpt-id .current-menu-item > .kb-link-wrap > .kb-nav-link-content,
  .wp-block-kadence-navigation51-cpt-id .kb-nav-link-content[aria-current="page"] {
    box-shadow: inset 3px 0 0 0 var(--b3-accent, #a81f33);
  }
}

/* 19b) OFF-CANVAS PANEL (mobilní menu) — tmavý jako zbytek webu + bílé ikony */
@media (max-width: 1024px) {
  .kb-off-canvas-inner-wrap {
    background: var(--b3-dark, #16212e) !important;
    color: #ffffff;
  }
  .kb-off-canvas-inner-wrap .wp-block-kadence-navigation51-cpt-id {
    background: transparent !important;
    border-top: 0 !important;
  }
  .kb-off-canvas-close {
    color: #ffffff !important;
  }
  .kb-off-canvas-close:hover,
  .kb-off-canvas-close:focus-visible {
    color: #ffffff !important;
    background: rgba(255, 255, 255, .14) !important;
    border-radius: 6px;
  }
  /* jemný oddělovač nad položkami a odsazení panelu */
  .kb-off-canvas-inner .kb-nav-link-content:first-child { border-top: 0; }
}
