/* Pneuservis Bürger — generováno tools/build.py z návrhu v2; ruční úpravy dělej v build.py */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/space-grotesk-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/space-grotesk-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root{--accent:#F59E0B;--radius:14px}
  *{box-sizing:border-box}
  html,body{margin:0;padding:0;font-family:"Space Grotesk",system-ui,-apple-system,sans-serif;color:#15181e;background:#fff;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
  a{color:inherit}
  h1,h2,h3{text-wrap:balance}
  p{text-wrap:pretty}
  section[id]{scroll-margin-top:80px}
  @media (max-width: 640px){
    #root section, #root footer{padding-left:20px !important;padding-right:20px !important}
    #root section{padding-top:64px !important;padding-bottom:64px !important}
    #root nav > div{padding:12px 20px !important}
    #root .svc-row{grid-template-columns:36px 1fr !important;gap:12px !important}
    #root .svc-row > span:last-child{grid-column:2}
    
    #root footer svg{width:56px !important;height:56px !important}
    #root footer .lockup-sub{white-space:normal !important;letter-spacing:0.12em !important;line-height:1.4}
  }
@media (max-width: 820px){
    #root .v2-hero,#root .v2-sp{grid-template-columns:minmax(0,1fr) !important}
    #root .v2-steps{grid-template-columns:minmax(0,1fr) !important;gap:20px !important}
    #root .v2-gal{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
    #root .v2-hero-img{max-width:420px}
  }
  @media (max-width: 520px){ #root .v2-facts{grid-template-columns:minmax(0,1fr) !important} }
.s1{position: sticky; top: 0px; z-index: 50; background: rgb(21, 24, 30); backdrop-filter: none; color: rgb(255, 255, 255); transition: background 0.2s; border-bottom: 1.5px solid rgb(21, 24, 30)}
.s2{max-width: 1400px; margin: 0px auto; padding: 16px 48px; display: flex; align-items: center; justify-content: space-between; gap: 16px}
.s3{display: flex; align-items: center; gap: 12px}
.s4{flex-shrink: 0}
.s5{display: flex; flex-direction: column; gap: 4px}
.s6{font-weight: 700; letter-spacing: -0.03em; line-height: 1; font-size: 22px; color: rgb(255, 255, 255)}
.s7{position: relative; display: inline-block}
.s8{position: absolute; left: 50%; top: 0.02em; transform: translateX(-50%); display: flex; gap: 0.12em}
.s9{width: 0.14em; height: 0.14em; border-radius: 50%; background: var(--accent,#f5b400); display: block}
.s10{height: 2px; background: var(--accent,#f5b400); width: 100%}
.s11{font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600; color: var(--accent,#f5b400); white-space: nowrap}
.s12{display: flex; gap: 24px; align-items: center}
.s13{color: rgb(255, 255, 255); text-decoration: none; font-size: 14px; font-weight: 500; opacity: 0.85; white-space: nowrap}
.s14{background: var(--accent,#ff6a00); color: rgb(17, 17, 17); padding: 10px 16px; font-weight: 700; font-size: 14px; text-decoration: none; border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); white-space: nowrap}
.s15{background: rgb(21, 24, 30); color: rgb(255, 255, 255); padding: 72px 48px 64px; position: relative; overflow: hidden}
.s16{max-width: 1100px; margin: 0px auto; display: grid; grid-template-columns: minmax(0px, 1.25fr) minmax(0px, 1fr); gap: 48px; align-items: center}
.s17{font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent,#f5b400)}
.s18{font-size: clamp(42px, 6.5vw, 84px); line-height: 0.95; letter-spacing: -0.03em; font-weight: 700; margin: 18px 0px 22px}
.s19{color: var(--accent,#f5b400)}
.s20{font-size: 18px; line-height: 1.5; color: rgba(255, 255, 255, 0.82); max-width: 500px; margin: 0px 0px 28px}
.s21{display: flex; flex-direction: column; gap: 14px; max-width: 560px}
.s22{display: grid; grid-template-columns: 1fr 1fr; gap: 12px}
.s23{display: inline-flex; align-items: center; gap: 10px; background: var(--accent,#ff6a00); color: rgb(17, 17, 17); text-decoration: none; padding: 14px 18px; font-weight: 700; font-size: 16px; border: 2px solid rgb(21, 24, 30); border-radius: var(--radius,0px)}
.s24{display: flex; flex-direction: column; gap: 2px; line-height: 1.15}
.s25{font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.75}
.s26{font-size: 17px; white-space: nowrap}
.s27{display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; color: #fff; text-decoration: none; font-size: 15px; font-weight: 600}
.s28{color: var(--accent,#f5b400); text-decoration: underline; text-underline-offset: 3px}
.s29{position: relative}
.s30{display: block; width: 100%; height: auto; object-fit: cover; object-position: center center; aspect-ratio: 4 / 5; border: 2px solid var(--accent,#f5b400); border-radius: var(--radius,0px)}
.s31{position: absolute; bottom: -14px; left: -14px; background: var(--accent,#f5b400); color: rgb(17, 17, 17); padding: 8px 14px; font-family: ui-monospace, Menlo, monospace; font-size: 12px; letter-spacing: 0.08em; font-weight: 700; border: 2px solid rgb(21, 24, 30); border-radius: var(--radius,0px)}
.s32{background: rgb(245, 245, 243); padding: 88px 48px; border-bottom: 1.5px solid rgb(21, 24, 30)}
.s33{max-width: 1100px; margin: 0px auto}
.s34{font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(107, 110, 117)}
.s35{font-size: clamp(30px, 4.2vw, 52px); letter-spacing: -0.02em; font-weight: 700; line-height: 1.05; margin: 14px 0px 0px}
.s36{display: grid; grid-template-columns: minmax(0px, 1.1fr) minmax(0px, 1fr); gap: 32px; margin-top: 40px; align-items: start}
.s37{background: rgb(255, 255, 255); border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); overflow: hidden; scroll-margin-top: 90px}
.s38{padding: 20px 20px 16px}
.s39{font-size: 21px; font-weight: 700; margin: 0px}
.s40{margin: 6px 0px 0px; font-size: 14px; color: rgb(107, 110, 117); line-height: 1.5}
.s41{width: 100%; border-collapse: collapse; font-size: 16px}
.s42{background: rgb(21, 24, 30); color: rgb(255, 255, 255); text-align: left}
.s43{padding: 13px 16px; border-bottom: 0px; font-variant-numeric: tabular-nums; font-weight: 600; font-size: 13px}
.s44{padding: 13px 16px; border-bottom: 0px; font-variant-numeric: tabular-nums; font-weight: 600; font-size: 13px; text-align: right}
.s45{padding: 13px 16px; border-bottom: 1px solid rgb(217, 216, 211); font-variant-numeric: tabular-nums; font-weight: 600}
.s46{padding: 13px 16px; border-bottom: 1px solid rgb(217, 216, 211); font-variant-numeric: tabular-nums; text-align: right; font-weight: 700}
.s47{margin: 0px; padding: 14px 20px; font-size: 13px; color: rgb(107, 110, 117)}
.s48{display: flex; flex-direction: column; gap: 12px}
.s49{background: rgb(255, 255, 255); border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); padding: 18px 20px; display: flex; justify-content: space-between; gap: 16px; align-items: baseline; flex-wrap: wrap}
.s50{flex: 1 1 220px}
.s51{font-size: 18px; font-weight: 700; margin: 0px 0px 4px}
.s52{margin: 0px; font-size: 14px; color: rgb(107, 110, 117); line-height: 1.5}
.s53{font-weight: 700; font-size: 16px; white-space: nowrap}
.s54{background: rgb(255, 255, 255); padding: 96px 48px; border-bottom: 1.5px solid rgb(21, 24, 30)}
.s55{max-width: 1000px; margin: 0px auto}
.s56{font-size: clamp(32px, 4.5vw, 56px); letter-spacing: -0.02em; font-weight: 700; line-height: 1.05; margin: 16px 0px 32px; max-width: 760px}
.s57{display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start}
.s58{font-size: 18px; line-height: 1.55; color: rgb(43, 47, 57); margin: 0px 0px 24px}
.s59{font-weight: 700; font-style: italic; font-size: 15px; margin-top: 24px}
.s60{display: block; width: 100%; height: auto; object-fit: cover; object-position: center top; aspect-ratio: 3 / 4; border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px)}
.s61{font-weight: 700; font-size: 16px; margin-top: 10px}
.s62{font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(107, 110, 117); margin-top: 2px}
.s63{background: rgb(255, 255, 255); padding: 88px 48px; border-bottom: 1.5px solid rgb(21, 24, 30)}
.s64{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 12px; margin-top: 32px}
.s65{display: block; width: 100%; height: auto; object-fit: cover; object-position: center center; aspect-ratio: 3 / 4; border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px)}
.s66{background: rgb(245, 245, 243); padding: 96px 48px; border-bottom: 1.5px solid rgb(21, 24, 30)}
.s67{max-width: 1200px; margin: 0px auto}
.s68{font-size: clamp(32px, 4.5vw, 56px); letter-spacing: -0.02em; font-weight: 700; line-height: 1.05; margin: 16px 0px 40px; max-width: 760px}
.s69{display: flex; flex-direction: column; gap: 56px}
.s70{display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; order: 2}
.s71{text-decoration: none; color: inherit}
.s72{background: rgb(255, 255, 255); border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; text-decoration: none; color: inherit; transition: background 0.15s}
.s73{font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(107, 110, 117); margin-bottom: 4px}
.s74{font-weight: 700; font-size: 24px; letter-spacing: -0.02em}
.s75{width: 44px; height: 44px; background: var(--accent,#ff6a00); border: 2px solid rgb(21, 24, 30); border-radius: var(--radius,0px); display: flex; align-items: center; justify-content: center; flex-shrink: 0}
.s76{background: rgb(255, 255, 255); border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; text-decoration: none; color: inherit; transition: background 0.15s}
.s77{font-weight: 700; font-size: 17px; letter-spacing: 0px}
.s78{margin-top: 10px; border-collapse: collapse; font-size: 15px; width: 100%; max-width: 360px}
.s79{border-top: 1px solid rgb(217, 216, 211)}
.s80{padding: 8px 0px; font-weight: 500}
.s81{padding: 8px 0px; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap}
.s82{margin-top: 8px; font-size: 14px; line-height: 1.5; font-weight: 500; color: rgba(21, 24, 30, 0.65)}
.s83{display: flex; flex-direction: column; gap: 8px; scroll-margin-top: 100px}
.s84{position: relative; min-height: 320px; border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); overflow: hidden; background: rgb(245, 245, 243)}
.s85{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover}
.s86{position: absolute; inset: 0px; background: transparent; border: 0px; cursor: pointer; padding: 0px}
.s87{position: absolute; inset: 0; background: rgba(21,24,30,0.72); display: flex; align-items: center; justify-content: center; padding: 20px}
.s88{background: #fff; border: 1.5px solid #15181e; border-radius: var(--radius,0px); padding: 20px; width: 100%; max-width: 320px; display: flex; flex-direction: column; gap: 10px}
.s89{font-weight: 700; font-size: 17px}
.s90{flex: 1 1 0%; text-align: center; background: var(--accent,#f5b400); color: rgb(17, 17, 17); border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); padding: 12px 16px; font-weight: 700; font-size: 14px; text-decoration: none; white-space: nowrap}
.s91{background: transparent; border: 0; color: #6b6e75; font-family: inherit; font-size: 14px; cursor: pointer; padding: 6px}
.s92{display: flex; gap: 8px; flex-wrap: wrap}
.s93{flex: 1 1 0%; text-align: center; background: rgb(255, 255, 255); color: rgb(17, 17, 17); border: 1.5px solid rgb(21, 24, 30); border-radius: var(--radius,0px); padding: 12px 16px; font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; cursor: pointer; font-family: inherit}
.s94{background: rgb(21, 24, 30); color: rgb(255, 255, 255); padding: 80px 48px 40px}
.s95{margin-bottom: 40px}
.s96{display: flex; align-items: center; gap: 22px}
.s97{display: flex; flex-direction: column; gap: 8px}
.s98{font-weight: 700; letter-spacing: -0.03em; line-height: 1; font-size: 40px; color: rgb(255, 255, 255)}
.s99{font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600; color: var(--accent,#f5b400); white-space: nowrap}
.s100{display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-bottom: 48px}
.s101{display: flex; flex-direction: column; gap: 10px; font-size: 20px; font-weight: 600}
.s102{color: rgb(255, 255, 255); text-decoration: none}
.s103{color: rgba(255, 255, 255, 0.85); text-decoration: none; font-size: 17px; font-weight: 500}
.s104{font-size: 18px; line-height: 1.5; font-weight: 500}
.s105{color: rgba(255, 255, 255, 0.6); font-size: 15px}
.s106{border-top: 1.5px solid rgba(255, 255, 255, 0.15); padding: 20px 0px; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, 0.7)}
.s107{cursor: pointer; font-weight: 600; color: rgb(255, 255, 255)}
.s108{display: flex; flex-direction: column; gap: 10px; margin-top: 14px; max-width: 680px}
.s109{margin: 0px}
.s110{border-top: 1.5px solid rgba(255, 255, 255, 0.15); padding-top: 24px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; font-size: 12px; color: rgba(255, 255, 255, 0.4); font-family: ui-monospace, Menlo, monospace; letter-spacing: 0.06em}
.s111{color: inherit; text-decoration: none}
@media (max-width: 720px){
          .nav-links a:not(:last-child){ display:none }
        }
@media (max-width: 520px){ .cta-grid{ grid-template-columns: 1fr !important } }
.v2-row:hover{background:#fff8e6}
@media (max-width: 820px){ .about-grid{ grid-template-columns: 1fr !important } }
@media (max-width: 820px){ .contact-grid{ grid-template-columns: 1fr !important } .info-grid{ grid-template-columns: 1fr !important } }
        @media (max-width: 520px){ .namephone{ grid-template-columns: 1fr !important } }
        @media (max-width: 400px){ .datetime{ grid-template-columns: 1fr !important } }
@media (max-width: 820px){ .footer-grid{ grid-template-columns: 1fr !important; gap: 32px !important } }

html{-webkit-text-size-adjust:100%}
img{max-width:100%}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
#nav.scrolled{background:rgba(21,24,30,0.96)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;border-bottom-color:rgba(255,255,255,0.1)!important}
#nav.scrolled .nav-wheel g[stroke]{stroke:#181b22}
#nav.scrolled .nav-wheel circle[fill="#15181e"]{fill:#181b22}
.contact-card:hover>div{background:#fff8f0!important}
.map-pin{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-30px 0 0 -15px;background:var(--accent);border:2.5px solid #15181e;border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 2px 6px rgba(0,0,0,.35);pointer-events:none}
.map-pin::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;background:#15181e;border-radius:50%}
.map-attr{position:absolute;right:0;bottom:0;z-index:2;background:rgba(255,255,255,.85);font-size:11px;padding:2px 6px;color:#333}
.map-attr a{color:#333}
#map-chooser{z-index:3}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#map-chooser[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){html,body{scroll-behavior:auto}}