/* www.servis-notebooku.eu */
@layer tokens, base, layout, components, utils;

@layer tokens {
  :root {
    color-scheme: light;
    --navy-900:#0B1220; --navy-800:#0F172A; --navy-700:#1E293B; --navy-600:#31435E;
    --ground:#EEF2F7; --surface:#FFFFFF; --surface-2:#F6F8FC; --line:#D8E0EC; --line-2:#B8C5D8;
    --ink:#0F172A; --ink-2:#334155; --ink-3:#475569;
    --accent:#2563EB; --accent-text:#1E40AF; --accent-soft:#E8EEFD; --accent-line:#BFD0F8;
    --ok:#166534; --ok-soft:#E4F2E8; --warn:#9A3412; --warn-soft:#FDEDE3; --err:#B91C1C;
    --on-navy:#E7EDF6; --on-navy-dim:#C3CFE0; --navy-line:#2C3E58;
    --r-sm:8px; --r-md:12px; --r-lg:16px;
    --shadow:0 1px 2px rgba(15,23,42,.06), 0 10px 26px -14px rgba(15,23,42,.22);
    --shadow-soft:0 1px 2px rgba(15,23,42,.05);
    --wrap:1140px;
    --sans:"Inter", ui-sans-serif, system-ui, "Segoe UI", Roboto, Arial, sans-serif;
    --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      color-scheme: dark;
      --ground:#0A101C; --surface:#111C2E; --surface-2:#16233A; --line:#25344C; --line-2:#3A4C68;
      --ink:#EAF0F9; --ink-2:#C6D2E2; --ink-3:#A7B6CB;
      --accent:#5B93F7; --accent-text:#9CC0FF; --accent-soft:#132339; --accent-line:#2C4470;
      --ok:#6EE7A0; --ok-soft:#0F2419; --warn:#FDBA74; --warn-soft:#2A1A0E; --err:#FCA5A5;
      --navy-800:#0D1626; --navy-700:#16233A; --navy-600:#2B3E59; --navy-line:#2A3B54;
      --shadow:0 1px 2px rgba(0,0,0,.45), 0 12px 30px -16px rgba(0,0,0,.8);
      --shadow-soft:0 1px 2px rgba(0,0,0,.4);
    }
  }
  :root[data-theme="dark"] {
    color-scheme: dark;
    --ground:#0A101C; --surface:#111C2E; --surface-2:#16233A; --line:#25344C; --line-2:#3A4C68;
    --ink:#EAF0F9; --ink-2:#C6D2E2; --ink-3:#A7B6CB;
    --accent:#5B93F7; --accent-text:#9CC0FF; --accent-soft:#132339; --accent-line:#2C4470;
    --ok:#6EE7A0; --ok-soft:#0F2419; --warn:#FDBA74; --warn-soft:#2A1A0E; --err:#FCA5A5;
    --navy-800:#0D1626; --navy-700:#16233A; --navy-600:#2B3E59; --navy-line:#2A3B54;
    --shadow:0 1px 2px rgba(0,0,0,.45), 0 12px 30px -16px rgba(0,0,0,.8);
    --shadow-soft:0 1px 2px rgba(0,0,0,.4);
  }
}

@layer base {
  * { box-sizing: border-box; }
  body {
    margin:0; background:var(--ground); color:var(--ink);
    font-family:var(--sans); font-size:17px; line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4 { text-wrap:balance; line-height:1.2; margin:0; letter-spacing:-.021em; }
  h1 { font-size:clamp(2rem,1.4rem+2.4vw,2.95rem); font-weight:800; }
  h2 { font-size:clamp(1.45rem,1.2rem+1.1vw,2rem); font-weight:800; }
  h3 { font-size:1.1rem; font-weight:700; }
  h4 { font-size:.98rem; font-weight:700; }
  p { margin:0; }
  a { color:var(--accent-text); }
  ul,ol { margin:0; padding-left:1.3em; }
  li+li { margin-top:.4em; }
  button { font:inherit; }
  :focus-visible { outline:3px solid var(--accent); outline-offset:2px; border-radius:4px; }
  table { border-collapse:collapse; width:100%; }
  code,kbd { font-family:var(--mono); font-size:.85em; }
  @media (prefers-reduced-motion: reduce) { *{animation-duration:.01ms!important;transition-duration:.01ms!important;} }
}

@layer layout {
  .wrap { width:min(100% - 32px, var(--wrap)); margin-inline:auto; }
  .stack { display:flex; flex-direction:column; }
  .prose { display:flex; flex-direction:column; gap:15px; max-width:68ch; color:var(--ink-2); }
  .prose h2 { color:var(--ink); font-size:1.4rem; margin-top:16px; }
  .prose h3 { color:var(--ink); margin-top:10px; }
  .band { padding-block:clamp(38px,5.5vw,68px); }
  .band--alt { background:var(--surface-2); border-block:1px solid var(--line); }
  .band--navy { background:var(--navy-800); color:var(--on-navy); }
  .grid { display:grid; gap:16px; }
  .cols-3 { grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); }
  .cols-4 { grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); }
  .split { display:grid; gap:34px; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); align-items:start; }
  @media (max-width:900px){ .split{grid-template-columns:1fr;} }
}

@layer components {
  /* header */
  .site-head { position:sticky; top:0; z-index:40; background:var(--surface); border-bottom:1px solid var(--line); }
  .site-head__top { display:flex; align-items:center; gap:16px; min-height:64px; }
  .brand { display:inline-flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); }
  .brand__mark { width:34px; height:34px; border-radius:10px; background:var(--navy-800); color:#fff; display:grid; place-items:center; flex:none; }
  .brand__mark svg { width:19px; height:19px; }
  .brand__name { font-weight:800; letter-spacing:-.02em; font-size:1.06rem; line-height:1.2; display:block; }
  .brand__firm { display:block; min-height:16px; font-size:.72rem; color:var(--ink-3); font-weight:500; letter-spacing:.01em; }
  .head__contact { margin-left:auto; display:flex; align-items:center; gap:14px; }
  .head__phones { display:flex; flex-direction:column; align-items:flex-end; min-width:148px; min-height:38px; justify-content:center; }
  .head__phones a { font-weight:700; text-decoration:none; font-size:1rem; letter-spacing:.01em; white-space:nowrap; }
  .head__hours { font-size:.74rem; color:var(--ink-3); min-height:15px; }
  .site-head__nav { display:flex; gap:2px; padding-bottom:8px; flex-wrap:wrap; }
  .site-head__nav a {
    text-decoration:none; font-size:.93rem; font-weight:600; color:var(--ink-2);
    padding:8px 11px; border-radius:var(--r-sm);
  }
  .site-head__nav a:hover { background:var(--surface-2); color:var(--ink); }
  .site-head__nav a[aria-current="page"] { color:var(--accent-text); background:var(--accent-soft); box-shadow:inset 0 -2px 0 var(--accent); }
  @media (max-width:960px){
    .head__contact { gap:10px; }
    .head__phones { min-width:0; }
    .head__phones a:nth-child(2), .head__hours { display:none; }
    .site-head__nav { overflow-x:auto; flex-wrap:nowrap; }
    .site-head__nav a { white-space:nowrap; }
    .head-cta { display:none; }
  }

  /* contact slots */
  .cslot { display:inline-block; min-height:1em; }
  .cslot:empty::after {
    content:""; display:inline-block; width:var(--w,120px); height:1em;
    border-radius:4px; background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 12px);
    vertical-align:-.15em;
  }

  /* buttons */
  .btn {
    display:inline-flex; align-items:center; justify-content:center; gap:9px;
    min-height:48px; padding:0 20px; border-radius:var(--r-md); font-weight:700;
    text-decoration:none; cursor:pointer; border:1px solid transparent; font-size:1rem;
    transition:transform .12s ease, background-color .12s ease;
  }
  .btn:active { transform:translateY(1px); }
  .btn--primary { background:var(--accent); color:#fff; border-color:var(--accent); }
  .btn--primary:hover { background:#1D4ED8; }
  .btn--ghost { background:var(--surface); color:var(--ink); border-color:var(--line-2); }
  .btn--ghost:hover { background:var(--surface-2); }
  .btn--onnavy { background:transparent; color:#fff; border-color:var(--navy-line); }
  .btn--onnavy:hover { background:rgba(255,255,255,.08); }
  .btn--sm { min-height:40px; padding:0 15px; font-size:.9rem; }
  .btn svg { width:17px; height:17px; flex:none; }

  /* hero */
  .hero { background:var(--navy-800); color:var(--on-navy); position:relative; overflow:hidden; }
  .hero::after {
    content:""; position:absolute; inset:auto -20% -70% 45%; height:380px;
    background:radial-gradient(closest-side, rgba(37,99,235,.28), transparent 72%); pointer-events:none;
  }
  .hero__in { position:relative; z-index:1; padding-block:clamp(36px,5.5vw,64px); display:grid; gap:34px;
              grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); align-items:start; }
  @media (max-width:900px){ .hero__in{grid-template-columns:1fr;} }
  .hero h1 { color:#fff; }
  .hero__lead { color:var(--on-navy-dim); font-size:1.12rem; max-width:55ch; margin-top:16px; }
  .hero__cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
  .eyebrow { font-family:var(--mono); font-size:.74rem; letter-spacing:.13em; text-transform:uppercase; color:#93B4FB; font-weight:500; }
  .trust { display:flex; flex-wrap:wrap; gap:9px 22px; margin-top:26px; padding-top:20px;
           border-top:1px solid var(--navy-line); font-size:.92rem; color:var(--on-navy-dim); }
  .trust span { display:inline-flex; align-items:center; gap:8px; }
  .trust svg { width:16px; height:16px; color:#93B4FB; flex:none; }

  .herocard { background:var(--navy-700); border:1px solid var(--navy-line); border-radius:var(--r-lg); padding:22px; display:flex; flex-direction:column; gap:14px; }
  .herocard h2 { font-size:1.1rem; color:#fff; }
  .herocard p { font-size:.93rem; color:var(--on-navy-dim); }
  .flow { display:flex; flex-direction:column; }
  .flow__row { display:grid; grid-template-columns:28px 1fr auto; gap:12px; align-items:start; padding:11px 0; }
  .flow__row+.flow__row { border-top:1px dashed var(--navy-line); }
  .flow__n { width:26px; height:26px; border-radius:50%; display:grid; place-items:center; font-family:var(--mono); font-size:.76rem; background:var(--navy-600); color:#fff; }
  .flow__t { font-size:.95rem; color:#fff; font-weight:600; }
  .flow__s { display:block; font-size:.82rem; color:var(--on-navy-dim); font-weight:400; margin-top:2px; }
  .flow__when { font-family:var(--mono); font-size:.76rem; color:var(--on-navy-dim); white-space:nowrap; }

  .sec-head { display:flex; flex-direction:column; gap:10px; margin-bottom:26px; max-width:70ch; }
  .sec-head p { color:var(--ink-3); }
  .band--navy .sec-head p { color:var(--on-navy-dim); }

  /* steps */
  .steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
  .step { padding:22px 24px 22px 0; display:flex; flex-direction:column; gap:9px; }
  .step+.step { border-left:1px solid var(--line); padding-left:24px; }
  @media (max-width:780px){ .step+.step{border-left:0;border-top:1px solid var(--line);padding-left:0;} }
  .step__n { font-family:var(--mono); font-size:.78rem; color:var(--accent-text); letter-spacing:.1em; }
  .step p { color:var(--ink-2); font-size:.97rem; }
  .step__time { font-family:var(--mono); font-size:.8rem; color:var(--ink-3); margin-top:auto; padding-top:10px; }

  /* fault cards */
  .fault {
    display:flex; flex-direction:column; gap:10px; background:var(--surface); border:1px solid var(--line);
    border-radius:var(--r-md); padding:19px; text-decoration:none; color:var(--ink); box-shadow:var(--shadow-soft);
    transition:border-color .12s ease, transform .12s ease;
  }
  a.fault:hover { border-color:var(--accent); transform:translateY(-2px); }
  .fault__ico { width:27px; height:27px; color:var(--accent); }
  .fault h3 { font-size:1.02rem; }
  .fault p { font-size:.92rem; color:var(--ink-3); }
  .fault__meta { margin-top:auto; padding-top:13px; border-top:1px dashed var(--line); display:flex; justify-content:space-between; gap:10px;
                 font-family:var(--mono); font-size:.8rem; color:var(--ink-2); font-variant-numeric:tabular-nums; }

  /* brands */
  .brands { display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
  .brands a { display:grid; place-items:center; min-height:64px; text-decoration:none; border:1px solid var(--line);
              border-radius:var(--r-md); background:var(--surface); font-weight:600; font-size:.97rem; color:var(--ink-2); }
  .brands a:hover { color:var(--ink); border-color:var(--line-2); background:var(--surface-2); }

  /* city picker */
  .tiers { display:grid; gap:22px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
  .tier h3 { margin-bottom:12px; }
  .chips { display:flex; flex-wrap:wrap; gap:8px; }
  .chips a { text-decoration:none; font-size:.92rem; padding:7px 13px; border-radius:999px;
             border:1px solid var(--navy-line); color:#fff; }
  .chips a:hover { border-color:#93B4FB; color:#93B4FB; }
  .chips--light a { border-color:var(--line-2); color:var(--ink-2); background:var(--surface); }
  .chips--light a:hover { border-color:var(--accent); color:var(--accent-text); }
  .obce { font-size:.93rem; color:var(--ink-3); max-width:75ch; }

  /* map */
  .mapwrap { display:grid; gap:26px; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); align-items:center; }
  @media (max-width:860px){ .mapwrap{grid-template-columns:1fr;} }
  .cz { width:100%; height:auto; display:block; }
  .cz__land { fill:#152238; stroke:#31435E; stroke-width:2; }
  .cz__dot { fill:#5B93F7; }
  .cz__dot--sm { fill:#8AAEF9; }
  .cz__dot--hi { fill:#fff; stroke:#5B93F7; stroke-width:3; }
  .cz__label { fill:#E7EDF6; font-family:var(--sans); font-size:15px; font-weight:600; }
  .cz__label--hi { fill:#fff; }

  /* price table */
  .pricetable { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; }
  .pricetable th, .pricetable td { text-align:left; padding:13px 16px; border-bottom:1px solid var(--line); }
  .pricetable thead th { background:var(--surface-2); font-family:var(--mono); font-weight:500; font-size:.74rem;
                         letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); }
  .pricetable tbody tr:last-child td { border-bottom:0; }
  .pricetable td.num { font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap; font-weight:500; }
  .pricetable td.note { color:var(--ink-3); font-size:.9rem; }
  .pricetable tr.group td { background:var(--surface-2); font-weight:700; font-size:.86rem; letter-spacing:.02em; }
  @media (max-width:720px){
    .pricetable thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
    .pricetable tr { display:grid; gap:4px; padding:14px 16px; border-bottom:1px solid var(--line); }
    .pricetable tr.group { padding:10px 16px; }
    .pricetable td { border:0; padding:0; display:flex; justify-content:space-between; gap:16px; }
    .pricetable td::before { content:attr(data-l); color:var(--ink-3); font-size:.84rem; font-family:var(--mono); }
    .pricetable td:first-child { font-weight:700; margin-bottom:2px; }
    .pricetable td:first-child::before { content:none; }
    .pricetable tr.group td { background:transparent; }
  }
  .freebox { display:grid; gap:14px 20px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
             background:var(--ok-soft); border:1px solid var(--ok); border-radius:var(--r-md); padding:18px; }
  .freebox__i { display:flex; gap:9px; align-items:flex-start; }
  .freebox svg { width:17px; height:17px; color:var(--ok); flex:none; margin-top:3px; }
  .freebox__t { display:block; min-width:0; }
  .freebox__t b { display:block; color:var(--ink); line-height:1.3; }
  .freebox__t span { display:block; font-size:.88rem; color:var(--ink-2); margin-top:3px; line-height:1.4; }

  /* faq */
  .faq { border-top:1px solid var(--line); }
  .faq details { border-bottom:1px solid var(--line); }
  .faq summary { cursor:pointer; padding:15px 0; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center; }
  .faq summary::-webkit-details-marker { display:none; }
  .faq summary::after { content:"+"; font-family:var(--mono); color:var(--accent-text); font-size:1.25rem; line-height:1; }
  .faq details[open] summary::after { content:"–"; }
  .faq .faq__a { padding:0 0 16px; color:var(--ink-2); max-width:68ch; font-size:.97rem; }

  /* callouts */
  .callout { border-left:3px solid var(--accent); background:var(--accent-soft); padding:15px 17px;
             border-radius:0 var(--r-sm) var(--r-sm) 0; font-size:.94rem; color:var(--ink-2);
             display:flex; flex-direction:column; gap:6px; }
  .callout b { color:var(--ink); }
  .callout--todo { border-left-color:var(--ink-3); background:var(--surface-2); font-family:var(--mono); font-size:.84rem; }
  .callout--warn { border-left-color:var(--warn); background:var(--warn-soft); }

  /* forms */
  .formcard { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
              padding:clamp(18px,3vw,28px); box-shadow:var(--shadow); }
  .field { display:flex; flex-direction:column; gap:6px; }
  .field label { font-size:.9rem; font-weight:600; }
  .field .hint { font-size:.82rem; color:var(--ink-3); }
  .field input, .field select, .field textarea {
    font:inherit; font-size:1rem; color:var(--ink); background:var(--surface-2);
    border:1px solid var(--line-2); border-radius:var(--r-sm); padding:11px 12px; min-height:48px; width:100%;
  }
  .field textarea { min-height:118px; resize:vertical; }
  .field input:focus, .field select:focus, .field textarea:focus { border-color:var(--accent); }
  .formgrid { display:grid; gap:15px; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); }
  .formgrid .full { grid-column:1/-1; }
  .consent { display:flex; gap:11px; align-items:flex-start; font-size:.92rem; color:var(--ink-2); }
  .consent input { width:22px; height:22px; min-height:0; flex:none; margin-top:2px; accent-color:var(--accent); }
  .hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
  .formresult { margin-top:18px; border:1px solid var(--ok); background:var(--ok-soft); border-radius:var(--r-md);
                padding:17px; display:flex; flex-direction:column; gap:10px; }
  .formresult--err { border-color:var(--err); background:var(--warn-soft); }
  .formresult p { font-size:.94rem; color:var(--ink-2); }
  .payload { font-family:var(--mono); font-size:.74rem; line-height:1.55; background:var(--navy-900); color:#CFE0F5;
             border-radius:var(--r-sm); padding:14px; overflow-x:auto; margin:0; white-space:pre; }

  /* breadcrumbs + page head */
  .crumbs { display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:.82rem; color:var(--ink-3);
            padding-top:18px; font-family:var(--mono); }
  .crumbs a { text-decoration:none; color:var(--ink-3); }
  .crumbs a:hover { color:var(--accent-text); }
  .crumbs span[aria-hidden] { opacity:.5; }
  .pagehead { border-bottom:1px solid var(--line); background:var(--surface); }
  .pagehead__in { padding-block:24px 30px; display:flex; flex-direction:column; gap:15px; }
  .pagehead h1 { font-size:clamp(1.7rem,1.25rem+1.7vw,2.45rem); }
  .pagehead p { color:var(--ink-2); max-width:66ch; }

  .linkrows { display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
  .linkrows a { display:flex; justify-content:space-between; gap:12px; align-items:center; text-decoration:none;
                padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface);
                font-size:.94rem; font-weight:600; color:var(--ink); }
  .linkrows a:hover { border-color:var(--accent); }
  .linkrows a::after { content:"→"; color:var(--accent-text); font-family:var(--mono); }

  /* sticky mobile CTA */
  .stickycta { position:fixed; left:0; right:0; bottom:0; z-index:50; display:flex; gap:10px;
               padding:10px 16px calc(10px + env(safe-area-inset-bottom));
               background:color-mix(in srgb, var(--surface) 95%, transparent); backdrop-filter:blur(8px);
               border-top:1px solid var(--line); transform:translateY(130%); transition:transform .2s ease; }
  .stickycta.is-on { transform:translateY(0); }
  .stickycta .btn { flex:1; }
  .stickycta .btn--ghost[hidden] { display:none; }
  @media (min-width:901px){ .stickycta{display:none;} }

  /* footer */
  .site-foot { background:var(--navy-900); color:var(--on-navy-dim); font-size:.92rem; }
  .site-foot__in { padding-block:40px 26px; display:grid; gap:28px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
  .site-foot h3 { font-size:.74rem; font-family:var(--mono); letter-spacing:.12em; text-transform:uppercase;
                  color:#fff; font-weight:500; margin-bottom:11px; }
  .site-foot ul { list-style:none; padding:0; display:flex; flex-direction:column; gap:7px; }
  .site-foot a { text-decoration:none; color:var(--on-navy-dim); }
  .site-foot a:hover { color:#93B4FB; }
  .site-foot__firm { display:flex; flex-direction:column; gap:5px; min-height:96px; }
  .site-foot__firm .cslot { color:#fff; }
  .site-foot__legal { border-top:1px solid var(--navy-line); padding-block:16px 36px; font-size:.84rem;
                      display:flex; flex-wrap:wrap; gap:8px 20px; }

}

@layer utils {
  .skip { position:absolute; left:8px; top:-60px; z-index:100; background:var(--accent); color:#fff;
          padding:11px 17px; border-radius:var(--r-sm); text-decoration:none; font-weight:700; transition:top .15s ease; }
  .skip:focus { top:8px; }
  .muted { color:var(--ink-3); }
  .small { font-size:.88rem; }
  .mono { font-family:var(--mono); }
  .mt-16 { margin-top:16px; } .mt-24 { margin-top:24px; } .mt-32 { margin-top:32px; }
  .gap-16 { gap:16px; } .gap-24 { gap:24px; }
  .row { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
  main { padding-bottom:86px; }
  @media (min-width:901px){ main{padding-bottom:0;} }
}

@layer components {
  /* výčtové dlaždice bez vlastní stránky */
  .brands span { display:grid; place-items:center; min-height:64px; border:1px solid var(--line);
                 border-radius:var(--r-md); background:var(--surface); color:var(--ink-3);
                 font-weight:600; font-size:.97rem; text-align:center; padding:8px; }
  .chips span { display:inline-block; font-size:.92rem; padding:7px 13px; border-radius:999px;
                border:1px solid var(--navy-line); color:var(--on-navy-dim); }
  .chips--light span { border-color:var(--line); color:var(--ink-3); background:var(--surface); }
  .tablewrap { overflow-x:auto; }
  .obce { font-size:.95rem; color:var(--ink-3); }
  .contactlist { gap:11px; margin-top:14px; }
  .fault__lay { font-size:.82rem; color:var(--ink-3); font-style:italic; }

  /* off-canvas menu (§3) */
  .navtoggle { display:none; align-items:center; gap:9px; background:var(--surface);
               border:1px solid var(--line-2); border-radius:var(--r-sm); padding:9px 13px;
               font-weight:700; cursor:pointer; color:var(--ink); min-height:44px; }
  .navtoggle svg { width:18px; height:18px; }
  .drawer { position:fixed; inset:0 0 0 auto; width:min(340px,88vw); z-index:70;
            background:var(--surface); border-left:1px solid var(--line);
            transform:translateX(101%); transition:transform .2s ease;
            display:flex; flex-direction:column; padding:16px; gap:8px; overflow-y:auto; }
  .drawer.is-on { transform:translateX(0); }
  .drawer__head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
  .drawer__close { background:transparent; border:1px solid var(--line-2); border-radius:var(--r-sm);
                   width:44px; height:44px; cursor:pointer; color:var(--ink); font-size:1.1rem; }
  .drawer a.navlink { display:block; padding:13px 12px; border-radius:var(--r-sm); text-decoration:none;
                      color:var(--ink); font-weight:600; border-bottom:1px solid var(--line); }
  .drawer a.navlink:hover { background:var(--surface-2); }
  .drawer__scrim { position:fixed; inset:0; z-index:65; background:rgba(8,14,26,.5);
                   opacity:0; pointer-events:none; transition:opacity .2s ease; }
  .drawer__scrim.is-on { opacity:1; pointer-events:auto; }
  @media (max-width:960px) {
    .navtoggle { display:inline-flex; }
    .site-head__nav { display:none; }
    /* vyšší specificita — .btn a .cslot jsou v CSS níž a přebíjely by display:none */
    .head__contact .head-cta { display:none; }
    .head__phones .head__hours { display:none; }
  }
  /* menu má sedm položek — sevřenější rozestupy, ať se vejde na jeden řádek */
  .site-head__nav { gap:0; }
  .site-head__nav a { padding:8px 8px; font-size:.9rem; }
  @media (max-width:1180px) { .site-head__nav a { padding:8px 7px; font-size:.86rem; } }

  /* dvojice telefonních čísel v hlavičce */
  .head__nums { display:flex; gap:12px; align-items:baseline; }
  .head__nums .cslot a { font-weight:700; text-decoration:none; white-space:nowrap; }
  @media (max-width:1100px) { .head__nums { gap:8px; } }

  /* na úzkém displeji hlavička zalomí: značka na první řádek, telefon a Menu na druhý */
  @media (max-width:760px) {
    .site-head__top { flex-wrap:wrap; row-gap:8px; padding-block:8px; min-height:0; }
    .head__contact { width:100%; margin-left:0; justify-content:space-between; }
    .brand__name { font-size:1rem; }
    .brand__firm { font-size:.68rem; }
    .head__phones { align-items:flex-start; }
    .head__nums { flex-direction:column; gap:1px; align-items:flex-start; }
    .head__nums .cslot a { font-size:.95rem; }
  }

  /* interní vyhledávání (§19.5) */
  .sitesearch { display:flex; flex-direction:column; gap:8px; max-width:620px; }
  .sitesearch label { font-weight:600; font-size:.92rem; }
  .sitesearch input { font:inherit; font-size:1rem; padding:12px 14px; min-height:48px;
                      border:1px solid var(--line-2); border-radius:var(--r-md);
                      background:var(--surface); color:var(--ink); }
  .sitesearch input:focus { border-color:var(--accent); }
  .sitesearch__out { display:flex; flex-direction:column; gap:6px; }
  .sitesearch__out a { display:flex; justify-content:space-between; gap:12px; padding:11px 14px;
                       border:1px solid var(--line); border-radius:var(--r-sm);
                       background:var(--surface); text-decoration:none; color:var(--ink);
                       font-weight:600; font-size:.94rem; }
  .sitesearch__out a:hover { border-color:var(--accent); }
  .sitesearch__out a span { color:var(--ink-3); font-weight:400; font-size:.86rem; }
  .sitesearch__none { color:var(--ink-3); font-size:.92rem; }

  /* karty článků poradny */
  .artcard { display:flex; flex-direction:column; gap:9px; background:var(--surface);
             border:1px solid var(--line); border-radius:var(--r-md); padding:20px;
             text-decoration:none; color:var(--ink); box-shadow:var(--shadow-soft); }
  .artcard:hover { border-color:var(--accent); }
  .artcard p { color:var(--ink-3); font-size:.93rem; }
  .artcard span { color:var(--accent-text); font-family:var(--mono); font-size:.82rem; margin-top:auto; }
  .cols-2 { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
  .updated { font-size:.82rem; color:var(--ink-3); font-family:var(--mono); }
}