/* ============================================================
   Kovovýroba Muška — industriální monochrom
   ============================================================ */

/* Fonty hostované lokálně (Oswald variabilní, Barlow statický) — latin + latin-ext */
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/barlow-latin-ext-400.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: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/barlow-latin-400.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; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/barlow-latin-ext-500.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: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/barlow-latin-500.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; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/barlow-latin-ext-600.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: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/barlow-latin-600.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; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/barlow-latin-ext-700.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: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/barlow-latin-700.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; }
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(assets/fonts/oswald-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: 'Oswald'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(assets/fonts/oswald-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{
  --ink:      #0e0e10;
  --ink-2:    #17181b;
  --steel-9:  #232427;
  --steel-7:  #3a3c40;
  --steel-5:  #6b6e73;
  --steel-3:  #a7abb0;
  --steel-1:  #d9dbde;
  --paper:    #f3f3f1;
  --paper-2:  #e9e9e6;
  --white:    #ffffff;
  --line:     #d5d5d1;
  --race-blue:#0f9cd2;
  --race-red: #ef3a2c;
  --nav-h:    64px;
  --wrap:     1180px;
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; scroll-padding-top:var(--nav-h); }

body{
  font-family:'Barlow', system-ui, sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3{ font-family:'Oswald', sans-serif; font-weight:600; line-height:1.05; text-transform:uppercase; letter-spacing:.01em; }

img{ display:block; max-width:100%; }

a{ color:var(--ink); text-decoration:none; }
a:hover{ color:var(--steel-5); }
:focus-visible{ outline:2px solid var(--race-blue); outline-offset:3px; }

.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 22px; width:100%; }

/* ============ NAV ============ */
.nav{
  position:sticky; top:0; z-index:50;
  background:var(--ink);
  border-bottom:1px solid var(--steel-9);
}
.nav__inner{
  max-width:var(--wrap); margin:0 auto; padding:0 22px;
  height:var(--nav-h);
  display:flex; align-items:center; justify-content:space-between;
}
.nav__logo img{ height:36px; width:auto; }
.nav__links{ display:flex; align-items:center; gap:34px; }
.nav__links a{
  color:var(--steel-1); font-family:'Barlow',sans-serif;
  text-transform:uppercase; font-weight:600; font-size:15px; letter-spacing:.03em;
  transition:color .15s;
}
.nav__links a:hover{ color:var(--white); }
.nav__phone{
  border:1px solid var(--steel-7); border-radius:2px;
  padding:8px 16px !important; color:var(--white) !important;
}
.nav__phone:hover{ background:var(--white); color:var(--ink) !important; }

.nav__burger{
  display:none; flex-direction:column; gap:5px;
  background:none; border:0; cursor:pointer; padding:8px;
}
.nav__burger span{ width:26px; height:2px; background:var(--white); transition:.25s; }
.nav__burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__burger.open span:nth-child(2){ opacity:0; }
.nav__burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ============ HERO ============ */
.hero{ position:relative; min-height:calc(100vh - var(--nav-h)); min-height:calc(100svh - var(--nav-h)); display:flex; align-items:center; overflow:hidden; }
.hero__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero__overlay{ position:absolute; inset:0; background:linear-gradient(100deg, rgba(8,8,10,.9) 0%, rgba(8,8,10,.62) 45%, rgba(8,8,10,.3) 100%); }
.hero__content{ position:relative; max-width:var(--wrap); margin:0 auto; padding:0 22px; width:100%; color:var(--white); }
.hero__eyebrow{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.28em; font-size:14px; color:var(--steel-3); margin-bottom:18px; }
.hero__title{ font-size:clamp(52px,9vw,120px); font-weight:700; letter-spacing:.01em; }
.hero__sub{ font-size:clamp(18px,2.6vw,27px); max-width:620px; margin-top:16px; color:var(--steel-1); font-weight:400; }
.hero__cta{ display:flex; align-items:center; gap:28px; flex-wrap:wrap; margin-top:32px; }
.hero__tel{ color:var(--white); display:flex; flex-direction:column; line-height:1.2; }
.hero__tel:hover{ color:var(--race-blue); }
.hero__tel-label{ font-family:'Oswald',sans-serif; text-transform:uppercase; font-size:12px; letter-spacing:.2em; color:var(--steel-3); }
.hero__tel-num{ font-family:'Oswald',sans-serif; font-size:24px; font-weight:600; }
.hero__scroll{ position:absolute; bottom:26px; left:50%; transform:translateX(-50%); color:var(--white); font-size:26px; opacity:.7; animation:bob 2s ease-in-out infinite; }
@keyframes bob{ 0%,100%{ transform:translate(-50%,0); } 50%{ transform:translate(-50%,8px); } }

/* ============ BUTTONS ============ */
.btn{
  display:inline-block; font-family:'Oswald',sans-serif; text-transform:uppercase;
  font-weight:600; letter-spacing:.08em; font-size:16px;
  padding:15px 34px; border:2px solid var(--white); border-radius:2px;
  transition:.18s; cursor:pointer;
}
.btn--primary{ background:var(--white); color:var(--ink); }
.btn--primary:hover{ background:transparent; color:var(--white); }

/* ============ SECTIONS ============ */
.section{ padding:96px 0; }
.section--dark{ background:var(--ink); color:var(--white); }
.section__title{ font-size:clamp(34px,5vw,58px); }
.section__title--light{ color:var(--white); }

.br-mob{ display:none; }

/* ============ CARDS ============ */
.cards{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin-top:52px; }
.card{ background:var(--white); border:1px solid var(--line); padding:32px 20px; transition:.2s; text-align:center; }
.card:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(0,0,0,.1); }
.card__icon{ display:block; width:46px; height:46px; fill:none; stroke:var(--ink); stroke-width:2; stroke-linecap:square; margin:0 auto 22px; }
.card h3{ font-size:23px; letter-spacing:-.015em; margin-bottom:10px; text-wrap:balance; }
.card p{ color:var(--steel-5); font-size:15.5px; }

/* ============ GALLERY ============ */
.gallery{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; grid-auto-flow:dense; gap:12px; margin-top:12px; }
.gal{ position:relative; border:0; padding:0; cursor:pointer; overflow:hidden; background:var(--steel-1); display:block; }
.gal img{ width:100%; height:100%; object-fit:cover; transition:transform .4s, filter .3s; filter:grayscale(.15); }
.gal:hover img{ transform:scale(1.06); filter:grayscale(0); }
.gal--big{ grid-column:span 2; grid-row:span 2; }
.gal--wide{ grid-column:span 2; }
.gal--tall{ grid-row:span 2; }

/* ============ RACING ============ */
.racing{ position:relative; padding:76px 0 96px; overflow:hidden; color:var(--white); background:var(--ink); }
.racing__wrap{ position:relative; }
.racing__intro{ max-width:680px; }
.racing__title{ font-size:clamp(32px,5vw,56px); line-height:1.28; }
.racing__text{ max-width:640px; font-size:18px; color:var(--steel-1); margin-top:20px; }
.racing__text strong{ color:var(--race-blue); }
.racing__grid{ display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(15,32px); gap:14px; margin-top:40px; }
.racing__grid > .gal:nth-child(1){ grid-column:1/3; grid-row:1/11; }
.racing__grid > .gal:nth-child(2){ grid-column:3; grid-row:1/7; }
.racing__grid > .gal:nth-child(2) img{ object-position:50% 58%; }
.racing__grid > .gal:nth-child(3){ grid-column:3; grid-row:7/16; }
.racing__grid > .gal:nth-child(4){ grid-column:1; grid-row:11/16; }
.racing__grid > .gal:nth-child(5){ grid-column:2; grid-row:11/16; }
.gal--racing{ height:100%; background:#141414; border:1px solid #2a2a2a; }
.gal--flip img{ transform:scaleX(-1); }
.gal--flip:hover img{ transform:scaleX(-1) scale(1.06); }

/* ============ CONTACT ============ */
.contact{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:64px; align-items:stretch; }
.contact__col--info{ justify-content:flex-start; gap:40px; }
.contact__list{ container-type:inline-size; display:flex; flex-direction:column; gap:28px; }
.contact__col{ display:flex; flex-direction:column; gap:28px; }
.contact__big{
  font-family:'Oswald',sans-serif; font-weight:600; font-size:clamp(26px,3.6vw,40px);
  color:var(--white); line-height:1.1; overflow-wrap:anywhere;
  transition:color .15s;
}
/* e-mail se musí vejít na jeden řádek podle šířky sloupce; ve starých prohlížečích se zalomí před @ */
.contact__big--email{ font-size:min(clamp(26px,3.6vw,40px), calc(100cqi / 11.5)); }
.contact__big:hover{ color:var(--race-blue); }
.contact__big-label{ display:block; font-family:'Barlow',sans-serif; font-weight:500; text-transform:uppercase; letter-spacing:.2em; font-size:12px; color:var(--steel-3); margin-bottom:8px; }
.contact__map{ position:relative; aspect-ratio:16/10; min-height:240px; min-width:0; border:1px solid var(--steel-9); overflow:hidden; background:#1c1d20; }
.contact__map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; filter:grayscale(1) invert(.92) contrast(.9); }
.contact__nav{ align-self:flex-start; margin-top:-12px; font-family:'Barlow',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.16em; font-size:13px; color:var(--white); text-decoration:none; border-bottom:1px solid var(--steel-5); padding-bottom:4px; }
.contact__nav:hover{ color:var(--race-blue); border-color:var(--race-blue); }

/* ============ FOOTER ============ */
.footer{ background:#000; color:var(--steel-3); padding:34px 0; }
.footer__inner{ display:flex; align-items:center; justify-content:center; gap:24px; flex-wrap:wrap; }
.footer__meta{ display:flex; gap:26px; flex-wrap:wrap; font-size:14px; align-items:center; justify-content:center; text-align:center; }
.footer__meta a{ color:var(--steel-1); }
.footer__meta a:hover{ color:var(--white); }

/* ============ LIGHTBOX ============ */
.lightbox{ position:fixed; inset:0; z-index:100; background:rgba(6,6,8,.94); display:none; align-items:center; justify-content:center; }
.lightbox.open{ display:flex; }
.lightbox__img{ max-width:90vw; max-height:86vh; object-fit:contain; box-shadow:0 20px 60px rgba(0,0,0,.6); touch-action:pan-y pinch-zoom; }
.lightbox__img--flip{ transform:scaleX(-1); }
.lightbox__close{ position:absolute; top:20px; right:26px; background:none; border:0; color:#fff; font-size:44px; line-height:1; cursor:pointer; }
.lightbox__nav{ position:absolute; top:50%; transform:translateY(-50%); background:none; border:0; color:#fff; font-size:64px; cursor:pointer; padding:0 22px; opacity:.75; }
.lightbox__nav:hover{ opacity:1; }
.lightbox__prev{ left:8px; }
.lightbox__next{ right:8px; }

/* ============ REVEAL ON SCROLL ============ */
[data-reveal]{ opacity:0; transform:translateY(8px); transition:opacity .25s ease-out, transform .25s ease-out; }
[data-reveal].is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  [data-reveal]{ opacity:1; transform:none; transition:none; }
}

/* ============ RESPONSIVE ============ */
@media (max-width:1180px) and (min-width:961px){
  .card h3{ font-size:20px; }
}
@media (max-width:960px){
  .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gallery{ grid-template-columns:repeat(3,1fr); }
  .gallery > .gal:nth-child(13){ grid-column:span 1; }
  .racing__grid{ grid-template-rows:repeat(15,24px); }
}
@media (max-width:720px){
  :root{ --nav-h:56px; }
  .nav__logo img{ height:30px; }
  .nav__burger{ display:flex; }
  .nav__links{
    position:absolute; top:var(--nav-h); left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--ink); border-bottom:1px solid var(--steel-9);
    max-height:0; overflow:hidden; visibility:hidden;
    transition:max-height .3s ease, visibility 0s linear .3s;
  }
  .nav__links.open{ max-height:360px; visibility:visible; transition:max-height .3s ease; }
  .nav__links a{ padding:16px 22px; width:100%; border-top:1px solid var(--steel-9); font-size:17px; }
  .nav__links .nav__phone{ border:0; border-top:1px solid var(--steel-9); border-radius:0; padding:16px 22px !important; }
  .section{ padding:64px 0; }
  .hero__title{ line-height:1.16; }
  .br-mob{ display:inline; }
  .racing{ padding:64px 0; }
  .contact{ grid-template-columns:minmax(0,1fr); gap:32px; }
  .contact__map{ aspect-ratio:auto; height:clamp(240px,70vw,400px); }
  .racing__grid{ grid-template-columns:repeat(2,1fr); grid-template-rows:190px 190px 150px; }
  .racing__grid > .gal:nth-child(1){ grid-column:1/3; grid-row:1; }
  .racing__grid > .gal:nth-child(2){ grid-column:1; grid-row:2; }
  .racing__grid > .gal:nth-child(3){ grid-column:2; grid-row:2; }
  .racing__grid > .gal:nth-child(4){ grid-column:1; grid-row:3; }
  .racing__grid > .gal:nth-child(5){ grid-column:2; grid-row:3; }
  .gallery{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .gal--big{ grid-row:span 1; }
  .gallery > .gal:nth-child(13){ grid-column:span 2; }
}
@media (max-width:440px){
  .cards{ grid-template-columns:1fr; }
  .hero__cta{ gap:18px; }
}