/*
Theme Name:  Bitcoin Casino CZ
Theme URI:   https://bitcoin-cz-casino.cz/
Description: Tmavá burza jako dětské téma Astry: obchodní terminál po setmění, panely nad grafitovým podkladem, jantarová akcentace, číslice v JetBrains Mono. Prvním zapnutím se nastaví Customizer Astry (tmavý podklad, šířka sloupce 1240 px, lišta s logem vlevo a nabídkou vpravo, zásuvka na telefonu, patička s povinným varováním), do knihovny médií se uloží značka i ikona a sestaví se obě nabídky. Vše, co se při tom zapíše, zůstává běžnou hodnotou Customizeru a jde kdykoli změnit.
Author:      Bitcoin Casino CZ
Template:    astra
Version:     1.1.0
Requires at least: 6.0
Requires PHP: 7.4
License:     GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: burza
*/

/* ==========================================================================
   Tokens. The guides plugin and the board read these same names.
   The eleven in the first group are the design tokens pinned in the build
   specification and are written here exactly as they stand there.
   ========================================================================== */
:root {
  --kp-bg: #0D1117;        /* page */
  --kp-panel: #161B22;     /* raised surface */
  --kp-panel-2: #1C232C;   /* inset surface */
  --kp-line: #2A3441;      /* rules */
  --kp-ink: #E6EDF3;       /* text */
  --kp-ink-2: #9DAAB8;     /* secondary text */
  --kp-amber: #F7931A;     /* the accent, CTAs, the brand */
  --kp-amber-2: #FFB454;   /* amber for small text on dark */
  --kp-green: #3FB950;     /* good, published, available */
  --kp-red: #F8614A;       /* missing, blocked, not published */
  --kp-violet: #A371F7;    /* crypto figures */

  /* Derived. --kp-line is a hairline between surfaces and carries no meaning, so its 1.50:1
     against the page is right for it. The edge of a control a reader has to find -- a field,
     a select, the box round the statutory warning -- has to be seen, so it uses --kp-line-2,
     which measures 3.62:1 on the page, 3.31:1 on a panel and 3.03:1 on an inset surface. */
  --kp-line-2: #5E6E80;
  --kp-radius: 10px;
  --kp-radius-s: 6px;

  --kp-head-face: "Space Grotesk", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --kp-body-face: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --kp-mono-face: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* A panel lifted off the page: no light source on a trading desk, so the lift is a rule
     plus a shadow deeper than the page rather than a highlight. */
  --kp-lift: 0 18px 40px -22px rgba(0, 0, 0, 0.85), 0 2px 6px rgba(0, 0, 0, 0.35);
  --wp--custom--ast-content-width-size: 1240px;
}

/* Scrollbars, form controls and the browser's own furniture are told the site is dark, so
   nothing arrives in a light default over the page. */
:root { color-scheme: dark; }

/* ==========================================================================
   Global: the desk, text, links, buttons, focus
   ========================================================================== */
body {
  background-color: var(--kp-bg);
  color: var(--kp-ink);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Said again after Astra's own rule so running text and form controls keep the face whatever
   string the Customizer ends up holding for it. */
body,
button,
input,
select,
textarea {
  font-family: var(--kp-body-face);
}
h1, h2, h3, h4, h5, h6,
.site-title,
.entry-title {
  font-family: var(--kp-head-face);
  color: var(--kp-ink);
}

/* Figures are read down a column and compared, so they are lined and tabular everywhere. */
h1, h2, h3, h4, h5, h6 { font-variant-numeric: lining-nums tabular-nums; }
code, kbd, samp, pre { font-family: var(--kp-mono-face); }

::selection { background: var(--kp-amber); color: var(--kp-bg); }

a { color: var(--kp-amber-2); text-underline-offset: 0.16em; text-decoration-thickness: 1px; }
a:hover { color: var(--kp-amber); text-decoration-thickness: 2px; }

/* Fields: Astra leaves these to the theme, and on a dark page an unstyled one arrives white. */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="date"],
select,
textarea {
  background-color: var(--kp-panel-2);
  border: 1px solid var(--kp-line-2);
  border-radius: var(--kp-radius-s);
  color: var(--kp-ink);
}
input::placeholder,
textarea::placeholder { color: var(--kp-ink-2); opacity: 1; }

/* Buttons: Astra paints them amber with the page colour on top, which measures 8.24:1.
   The weight, the tracking and the motion live here. */
.ast-button,
.button,
.wp-block-button__link,
.wp-element-button,
button[type="submit"],
input[type="submit"] {
  font-family: var(--kp-body-face);
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: background-color 0.15s ease, box-shadow 0.15s ease;
}
.ast-button:hover,
.button:hover,
.wp-block-button__link:hover,
.wp-element-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  box-shadow: 0 12px 24px -14px rgba(247, 147, 26, 0.8);
}

/* One ring for the whole site. Amber reads at 8.24:1 on the page and 7.53:1 on a panel, so the
   same ring works on every surface the site has. */
:is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--kp-amber);
  outline-offset: 2px;
  border-radius: var(--kp-radius-s);
  box-shadow: none;
}
/* Astra dots a thin outline, and dots the border of a field, on plain :focus as well. The ring
   above is for the keyboard, so a pointer press is left to pass without a mark of its own. The
   selectors carry one class more than Astra's so they settle it rather than tie with it. */
.ast-menu-toggle:focus:not(:focus-visible),
.menu-toggle:focus:not(:focus-visible),
.menu-toggle-close:focus:not(:focus-visible),
.ast-header-navigation-arrow:focus:not(:focus-visible),
.ast-button:focus:not(:focus-visible),
.ast-custom-button:focus:not(:focus-visible),
#ast-scroll-top:focus:not(:focus-visible),
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
summary:focus:not(:focus-visible) {
  outline: none;
}
/* A field being typed into keeps its solid edge and takes the ring, rather than going dotted. */
input:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
select:focus,
textarea:focus,
.wp-block-search__input:focus {
  border-style: solid;
  border-width: 1px;
  border-color: var(--kp-amber);
}

/* Room under the lista and above the footer: every guide opens with its own heading. */
.ast-plain-container .site-content > .ast-container > #primary {
  margin-top: clamp(20px, 3.2vw, 36px);
  margin-bottom: clamp(44px, 5.6vw, 72px);
}

hr, .wp-block-separator { border-color: var(--kp-line); }

/* ==========================================================================
   Page width: 1240px of sheet, the same for the header row, the guides and the
   footer, so every edge lines up with the mark. Astra's own setting is written
   to 1240 on the first run; the rule below carries the same width to a site set
   up by an earlier version.
   ========================================================================== */
@media (min-width: 922px) {
  .ast-container,
  .site-footer .ast-builder-grid-row-container-inner { max-width: 1280px; }
}
@media (min-width: 1280px) and (max-width: 1460px) {
  .ast-container,
  .site-footer .ast-builder-grid-row-container-inner { padding-left: 36px; padding-right: 36px; }
}

/* Back to the top: an amber chip, the page colour on it */
#ast-scroll-top {
  width: 44px;
  height: 44px;
  border-radius: var(--kp-radius-s);
  background-color: var(--kp-amber);
  color: var(--kp-bg);
}
#ast-scroll-top:hover { background-color: var(--kp-amber-2); color: var(--kp-bg); }
#ast-scroll-top .ast-icon svg { fill: currentColor; }

.skip-link.screen-reader-text:focus {
  background: var(--kp-amber);
  color: var(--kp-bg);
  border-radius: var(--kp-radius-s);
  padding: 12px 20px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: var(--kp-lift);
}

/* ==========================================================================
   The 18+ mark: a mono tag, in the bar, in the drawer and on the strip.
   ========================================================================== */
.kp-18 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-width: 46px;
  height: 30px;
  padding: 0 9px;
  border: 1px solid var(--kp-line-2);
  border-radius: var(--kp-radius-s);
  background: var(--kp-panel-2);
  color: var(--kp-amber-2);
  font-family: var(--kp-mono-face);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.ast-header-html-1 .ast-builder-html-element { line-height: 1; }
#ast-desktop-header .ast-header-html-1 { margin-left: 16px; }

/* The name is drawn into the mark, so Astra's gap for a site title beside it is not wanted. */
.site-header .ast-logo-title-inline .site-logo-img,
.site-header .site-logo-img { padding-right: 0; }

/* ==========================================================================
   Header: the terminal bar
   ========================================================================== */
#masthead { position: relative; z-index: 99; }
#masthead .main-header-bar { border-bottom: 0; }
/* The tape under the bar: a hairline with a short amber run at the left, where the mark is. */
#masthead::after {
  content: "";
  display: block;
  height: 2px;
  background-color: var(--kp-line);
  background-image: linear-gradient(90deg, var(--kp-amber) 0 118px, var(--kp-green) 118px 160px, transparent 160px);
  background-repeat: no-repeat;
}

/* ==========================================================================
   Desktop menu and its panels (Astra switches over at 922px)
   ========================================================================== */
@media (min-width: 922px) {
  /* Astra's link box runs the full height of the bar. Leaving it that tall means a pointer
     travelling toward a panel never crosses dead space. */
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link {
    position: relative;
    padding-left: 13px;
    padding-right: 13px;
    font-weight: 600;
  }
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 3px;
    right: 3px;
    top: 50%;
    height: 36px;
    margin-top: -18px;
    border-radius: var(--kp-radius-s);
    background-color: transparent;
    transition: background-color 0.14s ease;
  }
  #ast-desktop-header .main-header-menu > .menu-item:hover > .menu-link::before,
  #ast-desktop-header .main-header-menu > .menu-item.focus > .menu-link::before {
    background-color: var(--kp-panel-2);
  }
  /* The group the open page belongs to: an amber rule along the foot of its name */
  #ast-desktop-header .main-header-menu > .current-menu-ancestor > .menu-link::after,
  #ast-desktop-header .main-header-menu > .current-menu-item > .menu-link::after {
    content: "";
    position: absolute;
    left: 13px;
    right: 13px;
    bottom: 50%;
    height: 2px;
    margin-bottom: -19px;
    border-radius: 2px;
    background: var(--kp-amber);
  }
  /* Astra holds the arrow 10px clear of the name; five groups, a mark and the 18+ tag share one
     line and that spacing is worth more to the line than to the arrow. */
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link .dropdown-menu-toggle { margin-left: 0; }
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link .dropdown-menu-toggle .ast-arrow-svg { margin-left: 4px; }

  /* The panel: a raised sheet off the desk */
  #ast-desktop-header .main-header-menu > .menu-item > .sub-menu {
    top: calc(100% - 10px);
    width: 310px;
    padding: 10px;
    border: 1px solid var(--kp-line);
    border-radius: var(--kp-radius);
    background-color: var(--kp-panel);
    box-shadow: var(--kp-lift);
  }
  /* A lip as deep as the gap, so a panel does not close mid-reach */
  #ast-desktop-header .main-header-menu > .menu-item > .sub-menu::before { height: 10px; }

  /* Past nine entries a group needs two columns to stay on one screen */
  #ast-desktop-header .main-header-menu > .kp-set--pair > .sub-menu {
    width: 614px;
    column-count: 2;
    column-gap: 10px;
  }
  #ast-desktop-header .main-header-menu > .kp-set--pair > .sub-menu > .menu-item {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
  }
  #ast-desktop-header .main-header-menu > .kp-set--pair > .sub-menu > .kp-next-col {
    break-before: column;
    -webkit-column-break-before: always;
  }

  /* Room on both sides: the opening group hangs right, the closing pair hang left, the ones
     between sit centred on their own name. No panel reaches past the window edge. */
  #ast-desktop-header .main-header-menu > .kp-set--left:hover > .sub-menu,
  #ast-desktop-header .main-header-menu > .kp-set--left.focus > .sub-menu,
  #ast-desktop-header .main-header-menu > .kp-set--left > .sub-menu.toggled-on {
    left: auto;
    right: 0;
  }
  #ast-desktop-header .main-header-menu > .kp-set--centre:hover > .sub-menu,
  #ast-desktop-header .main-header-menu > .kp-set--centre.focus > .sub-menu,
  #ast-desktop-header .main-header-menu > .kp-set--centre > .sub-menu.toggled-on {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }

  /* Entries: a quote line, flat, with the rule showing only where the pointer is */
  #ast-desktop-header .main-header-menu .sub-menu .menu-item { border: 0; }
  #ast-desktop-header .main-header-menu .sub-menu .menu-link {
    display: block;
    padding: 7px 10px 7px 12px;
    border-radius: var(--kp-radius-s);
    box-shadow: inset 2px 0 0 transparent;
    color: var(--kp-ink);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.34;
    transition: background-color 0.12s ease, box-shadow 0.12s ease;
  }
  #ast-desktop-header .main-header-menu .sub-menu .menu-link > .ast-icon { display: none; }

  /* The head of a section inside a panel: its hub, and the home page in the Krypto panel */
  #ast-desktop-header .main-header-menu .sub-menu .kp-head > .menu-link {
    font-family: var(--kp-head-face);
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: -0.012em;
  }
  #ast-desktop-header .main-header-menu .sub-menu > .kp-head:not(:first-child):not(.kp-next-col) {
    margin-top: 7px;
    padding-top: 7px;
    border-top: 1px solid var(--kp-line);
  }

  #ast-desktop-header .main-header-menu .sub-menu .menu-item:hover > .menu-link,
  #ast-desktop-header .main-header-menu .sub-menu .menu-item > .menu-link:focus-visible {
    background-color: var(--kp-panel-2);
    box-shadow: inset 2px 0 0 var(--kp-amber);
    color: var(--kp-ink);
  }
  #ast-desktop-header .main-header-menu .sub-menu .current-menu-item > .menu-link {
    background-color: var(--kp-panel-2);
    box-shadow: inset 2px 0 0 var(--kp-amber);
    font-weight: 600;
  }
}

/* The bar carries a mark, five group names and the 18+ tag. Below the full sheet the names
   close up a step at a time and the mark gives way, rather than any of it dropping to a second
   line. Measured at 1920, 1440, 1366, 1200, 1024 and 960: one row at every one of them. */
@media (min-width: 922px) and (max-width: 1199px) {
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link { padding-left: 10px; padding-right: 10px; }
  #ast-desktop-header .main-header-menu > .current-menu-ancestor > .menu-link::after,
  #ast-desktop-header .main-header-menu > .current-menu-item > .menu-link::after { left: 10px; right: 10px; }
  #ast-desktop-header .ast-header-html-1 { margin-left: 12px; }
}
@media (min-width: 922px) and (max-width: 1023px) {
  #ast-desktop-header .custom-logo-link img { width: 182px; max-width: 182px; }
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link { padding-left: 8px; padding-right: 8px; font-size: 15px; }
  #ast-desktop-header .main-header-menu > .current-menu-ancestor > .menu-link::after,
  #ast-desktop-header .main-header-menu > .current-menu-item > .menu-link::after { left: 8px; right: 8px; }
  #ast-desktop-header .main-header-menu > .kp-set--pair > .sub-menu { width: 578px; }
}
@media (min-width: 922px) and (max-width: 959px) {
  #ast-desktop-header .custom-logo-link img { width: 158px; max-width: 158px; }
  #ast-desktop-header .main-header-menu > .menu-item > .menu-link { padding-left: 6px; padding-right: 6px; font-size: 14.5px; }
  #ast-desktop-header .main-header-menu > .current-menu-ancestor > .menu-link::after,
  #ast-desktop-header .main-header-menu > .current-menu-item > .menu-link::after { left: 6px; right: 6px; }
  #ast-desktop-header .ast-header-html-1 { margin-left: 8px; }
  #ast-desktop-header .kp-18 { min-width: 42px; height: 28px; padding: 0 7px; font-size: 12px; }
  #ast-desktop-header .main-header-menu > .kp-set--pair > .sub-menu { width: 540px; }
}

/* ==========================================================================
   Phone header and the drawer
   ========================================================================== */
#ast-mobile-header .ast-header-html-1 { margin-right: 10px; padding: 0; }
#ast-mobile-header .kp-18 { min-width: 42px; height: 28px; padding: 0 7px; font-size: 12px; }
#ast-mobile-header .ast-button-wrap { flex: none; }
#ast-mobile-header .menu-toggle.main-header-menu-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 14px;
}
#ast-mobile-header .menu-toggle .mobile-menu-wrap { display: inline-flex; }
#ast-mobile-header .menu-toggle .mobile-menu-wrap .mobile-menu {
  padding: 0;
  color: var(--kp-bg);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

/* Small phones: the row keeps to one line; under 361px the button is the icon alone, and its
   name stays in the markup for anyone listening to the page. */
@media (max-width: 420px) {
  #ast-mobile-header .ast-builder-grid-row { column-gap: 10px; }
  #ast-mobile-header .custom-logo-link img { width: 158px; max-width: 158px; }
  #ast-mobile-header .ast-header-html-1 { margin-right: 8px; }
  #ast-mobile-header .menu-toggle.main-header-menu-toggle { padding: 8px 12px; }
}
@media (max-width: 360px) {
  #ast-mobile-header .custom-logo-link img { width: 132px; max-width: 132px; }
  #ast-mobile-header .kp-18 { min-width: 38px; padding: 0 5px; font-size: 11px; }
  #ast-mobile-header .menu-toggle .mobile-menu-wrap { display: none; }
}

.ast-mobile-popup-drawer .ast-mobile-popup-inner {
  max-width: min(92%, 420px);
  background-color: var(--kp-bg);
  box-shadow: -18px 0 42px -22px rgba(0, 0, 0, 0.9);
}
.ast-mobile-popup-drawer .ast-mobile-popup-header {
  align-items: center;
  justify-content: space-between;
  padding: 12px 12px 6px 18px;
}
.ast-mobile-popup-drawer .ast-mobile-popup-header::before {
  content: "Rozcestník";
  color: var(--kp-ink-2);
  font-family: var(--kp-mono-face);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.ast-mobile-popup-drawer .ast-mobile-popup-header .menu-toggle-close {
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: var(--kp-radius-s);
  background: var(--kp-panel);
  box-shadow: inset 0 0 0 1px var(--kp-line-2);
  color: var(--kp-ink);
}
/* The dotted outline Astra reaches for here is replaced by the site-wide ring */
.ast-mobile-popup-drawer.active .ast-mobile-popup-header .menu-toggle-close:focus,
#ast-scroll-top:focus { border: 0; }

/* The accordion: one panel per group, opened by its name */
#ast-hf-mobile-menu { padding: 6px 14px 4px; background: transparent; }
#ast-hf-mobile-menu > .menu-item {
  margin-bottom: 8px;
  border: 1px solid var(--kp-line);
  border-radius: var(--kp-radius);
  background: var(--kp-panel);
  overflow: hidden;
}
#ast-hf-mobile-menu > .menu-item > .menu-link {
  padding: 14px 54px 14px 16px;
  background: var(--kp-panel);
  color: var(--kp-ink);
  font-family: var(--kp-head-face);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.012em;
  line-height: 1.3;
}
#ast-hf-mobile-menu > .ast-submenu-expanded > .menu-link { background: var(--kp-panel-2); }
#ast-hf-mobile-menu > .current-menu-ancestor > .menu-link,
#ast-hf-mobile-menu > .current-menu-item > .menu-link { box-shadow: inset 3px 0 0 var(--kp-amber); }
#ast-hf-mobile-menu > .menu-item > .ast-menu-toggle {
  top: 6px;
  right: 6px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--kp-radius-s);
  background: transparent;
  box-shadow: none;
  color: var(--kp-amber-2);
}
#ast-hf-mobile-menu > .menu-item > .ast-menu-toggle .ast-icon svg { margin-top: 0; }
#ast-hf-mobile-menu .sub-menu { padding: 0 0 6px; background: var(--kp-panel); }
#ast-hf-mobile-menu .sub-menu .menu-item { border: 0; }
#ast-hf-mobile-menu .sub-menu .menu-link {
  padding: 11px 16px;
  border-top: 1px solid var(--kp-line);
  background: var(--kp-panel);
  color: var(--kp-ink);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
}
#ast-hf-mobile-menu .sub-menu .menu-link > .ast-icon { display: none; }
#ast-hf-mobile-menu .sub-menu .kp-head > .menu-link { font-weight: 600; }
#ast-hf-mobile-menu .sub-menu .current-menu-item > .menu-link {
  background: var(--kp-panel-2);
  box-shadow: inset 3px 0 0 var(--kp-amber);
  font-weight: 600;
}

/* What sits under the groups once the drawer is open */
.kp-drawer-note {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 6px 0 18px;
  color: var(--kp-ink-2);
  font-size: 14px;
  line-height: 1.55;
}
.kp-drawer-note a { color: var(--kp-amber-2); font-weight: 600; }
.kp-drawer-note .kp-tel { white-space: nowrap; }
.ast-mobile-popup-content .ast-header-html-2 { padding: 4px 18px 0; }

/* ==========================================================================
   Footer: the panel, its three columns, and the strip that closes the page
   ========================================================================== */
.site-footer { color: var(--kp-ink-2); }
.site-footer .ast-builder-grid-row-container-inner { padding-left: 20px; padding-right: 20px; }
.site-footer .site-primary-footer-wrap { padding-top: 52px; padding-bottom: 40px; }
.site-footer .site-primary-footer-wrap .ast-builder-grid-row { gap: 36px 52px; }
.site-footer .ast-builder-html-element { color: var(--kp-ink-2); font-size: 15px; line-height: 1.62; }
.site-footer .ast-builder-html-element a { color: var(--kp-amber-2); text-decoration: underline; text-underline-offset: 0.16em; }
.site-footer .ast-builder-html-element a:hover { color: var(--kp-amber); }

.kp-foot-logo { margin: 0 0 16px; }
.kp-foot-logo img { display: block; width: 196px; max-width: 100%; height: auto; }
.kp-foot-logo--plain { color: var(--kp-ink); font-family: var(--kp-head-face); font-size: 23px; font-weight: 700; }
.kp-foot-blurb { max-width: 32em; margin: 0; }

.kp-foot-head,
.site-footer .footer-nav-wrap::before {
  display: block;
  margin: 2px 0 14px;
  color: var(--kp-amber-2);
  font-family: var(--kp-mono-face);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.2;
  text-transform: uppercase;
}
.site-footer .footer-nav-wrap::before { content: "Stránky webu"; margin-top: 0; }
.site-footer .ast-builder-html-element .kp-foot-head { margin-top: 0; }

.kp-foot-help { margin: 0; padding: 0; list-style: none; }
.kp-foot-help li { margin: 0; padding: 9px 0; border-top: 1px solid var(--kp-line); }
.kp-foot-help li:first-child { padding-top: 0; border-top: 0; }
.kp-foot-help strong { color: var(--kp-ink); font-weight: 600; }
.kp-tel {
  font-family: var(--kp-mono-face);
  font-weight: 700;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.site-footer #astra-footer-menu { gap: 2px; }
.site-footer #astra-footer-menu .menu-item { margin: 0; }
.site-footer #astra-footer-menu .menu-link {
  display: inline-block;
  padding: 5px 0;
  color: var(--kp-ink);
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
}
.site-footer #astra-footer-menu .menu-link:hover,
.site-footer #astra-footer-menu .current-menu-item > .menu-link {
  color: var(--kp-amber-2);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

/* ---- The compliance strip --------------------------------------------------
   The warning is prescribed word for word by § 5j(3) of zákon č. 40/1995 Sb.
   The Act asks only that it be visible and clear and sets no size, no share of
   the area and no position, so what it gets here is a box of its own against
   the inset surface, an amber edge at 3.62:1, and the site's body size rather
   than a footnote size. Its text measures 16.02:1 on that surface.
   --------------------------------------------------------------------------- */
.site-footer .site-below-footer-wrap[data-section="section-below-footer-builder"] {
  position: relative;
  padding-top: 22px;
  padding-bottom: 24px;
  background-color: var(--kp-bg);
  border-top: 1px solid var(--kp-line);
}
/* Astra runs the copyright field through wpautop(), so the strip arrives as spans inside one
   paragraph. That paragraph is the row. */
.ast-footer-copyright p {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 14px 20px;
  margin: 0;
  color: var(--kp-ink-2);
}
.ast-footer-copyright a { color: var(--kp-amber-2); text-decoration: underline; text-underline-offset: 0.16em; }
.ast-footer-copyright a:hover { color: var(--kp-amber); }

.kp-varovani {
  display: flex;
  flex: 1 1 100%;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--kp-line-2);
  border-left: 3px solid var(--kp-amber);
  border-radius: var(--kp-radius-s);
  background: var(--kp-panel-2);
}
.kp-varovani .kp-18 { margin-top: 1px; }
.kp-varovani-text { display: block; color: var(--kp-ink); font-size: 15px; line-height: 1.55; }
.kp-varovani-zakon {
  display: block;
  margin-top: 5px;
  color: var(--kp-ink-2);
  font-size: 13.5px;
  line-height: 1.5;
}
.kp-strip-pece {
  display: block;
  flex: 1 1 30em;
  font-size: 14px;
  line-height: 1.6;
}
.kp-strip-mala {
  display: block;
  flex: 1 1 100%;
  font-size: 13px;
  line-height: 1.6;
}

@media (max-width: 921px) {
  .site-footer .site-primary-footer-wrap { padding-top: 40px; padding-bottom: 28px; }
  .site-footer .site-primary-footer-wrap .ast-builder-grid-row { gap: 30px 28px; }
}
@media (max-width: 544px) {
  .site-footer .site-primary-footer-wrap .site-footer-section { margin-bottom: 0; }
  .site-footer #astra-footer-menu { grid-template-columns: 1fr 1fr; column-gap: 16px; }
  .kp-varovani { flex-wrap: wrap; }
}

/* ==========================================================================
   Print: no bar furniture, no drawer, no footer columns. The warning stays:
   a printed page carrying the site is still carrying the advertisement.
   ========================================================================== */
@media print {
  #masthead::after,
  .ast-header-html-1,
  .ast-mobile-popup-drawer,
  .site-footer .site-primary-footer-wrap { display: none !important; }
  body, .site-footer .site-below-footer-wrap[data-section="section-below-footer-builder"] { background: #FFFFFF; }
  body, .kp-varovani-text, .kp-strip-pece, .kp-strip-mala, .ast-footer-copyright a { color: #000000; }
  .kp-varovani { border-color: #000000; background: none; }
  .kp-18 { border-color: #000000; background: none; color: #000000; }
}

/* Nothing animates for a reader who has asked their system for stillness */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}