/* ============================================================
   TEXRO — servis nářadí a techniky
   ============================================================ */

/* ---------- TOKENY ---------- */
:root{
  /* barva zadaná klientem — "energy green" / elektrická limetka */
  --lime:      #BFE04F;
  --lime-hi:   #D4F26B;
  --lime-lo:   #A6C93A;
  --lime-ink:  #10140A;

  --ink:   #0C0E0A;
  --ink-2: #12150E;
  --ink-3: #1A1E14;
  --ink-4: #242A1D;

  --paper:   #F5F6F1;
  --paper-2: #EBEDE4;

  --txt:      #E9ECE3;
  --txt-dim:  #9CA391;
  --txt-dark: #14170F;
  --txt-dark-dim: #5C6353;

  --line:      rgba(255,255,255,.09);
  --line-lime: rgba(191,224,79,.22);
  --line-dark: rgba(20,23,15,.12);

  --r-s: 6px;
  --r-m: 12px;
  --r-l: 20px;

  --pad: clamp(1.25rem, 5vw, 3rem);
  --sec: clamp(4.5rem, 10vw, 9rem);

  --f-disp: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* síla fotky v hero — jediné číslo, kterým se ladí, jak moc je pozadí vidět */
  --hero-media: .30;

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- RESET ---------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  font-family:var(--f-body);
  font-size:clamp(1rem,.96rem + .2vw,1.075rem);
  line-height:1.65;
  color:var(--txt);
  background:var(--ink);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
h1,h2,h3{ font-family:var(--f-disp); font-weight:800; line-height:1.02; letter-spacing:-.028em; }
::selection{ background:var(--lime); color:var(--lime-ink); }

:focus-visible{ outline:3px solid var(--lime); outline-offset:3px; border-radius:2px; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip{
  position:absolute; left:1rem; top:-100px; z-index:200;
  background:var(--lime); color:var(--lime-ink);
  padding:.7rem 1.1rem; border-radius:var(--r-s); font-weight:600;
  transition:top .2s;
}
.skip:focus{ top:1rem; }

/* ---------- LAYOUT ---------- */
.wrap{ width:100%; max-width:1220px; margin-inline:auto; padding-inline:var(--pad); }
.wrap--narrow{ max-width:820px; }
.sec{ padding-block:var(--sec); position:relative; }
/* fixní hlavička nesmí překrýt cíl kotvy při načtení s #hash */
section[id]{ scroll-margin-top:88px; }
.sec--tight{ padding-top:clamp(2rem,5vw,4rem); }

.sec__head{ max-width:44rem; margin-bottom:clamp(2.5rem,5vw,4rem); }
.sec__head--center{ margin-inline:auto; text-align:center; }
.sec__head--center .sec__lead{ margin-inline:auto; }
.sec__lead{ margin-top:1.1rem; color:var(--txt-dim); font-size:1.08em; }
.sec__lead--dark{ color:var(--txt-dark-dim); }

.kicker{
  font-family:var(--f-disp); font-weight:700; font-size:.78rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--lime);
  display:flex; align-items:center; gap:.7rem; margin-bottom:1.1rem;
}
.kicker::before{ content:""; width:26px; height:2px; background:var(--lime); flex:none; }
.kicker--dark{ color:var(--lime-ink); opacity:.65; }
.kicker--dark::before{ background:currentColor; }
.kicker--center{ justify-content:center; }

.h2{ font-size:clamp(2.05rem,1.3rem + 3.4vw,3.55rem); }
.h2--dark{ color:var(--txt-dark); }

.eyebrow{
  font-family:var(--f-disp); font-weight:600; font-size:.82rem;
  letter-spacing:.15em; text-transform:uppercase; color:var(--txt-dim);
  margin-bottom:1.4rem;
}

/* ---------- TLAČÍTKA ---------- */
.btn{
  --bg:var(--lime); --fg:var(--lime-ink);
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  background:var(--bg); color:var(--fg);
  font-family:var(--f-disp); font-weight:700; font-size:.98rem;
  letter-spacing:.005em;
  padding:1.05rem 1.9rem; border:2px solid var(--bg); border-radius:var(--r-s);
  cursor:pointer; white-space:nowrap;
  transition:transform .18s var(--ease), background .18s, border-color .18s, color .18s, box-shadow .25s;
}
.btn--lime:hover{ background:var(--lime-hi); border-color:var(--lime-hi); transform:translateY(-2px);
  box-shadow:0 12px 30px -12px rgba(191,224,79,.65); }
.btn--ghost{ --bg:transparent; --fg:var(--txt); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--lime); color:var(--lime); transform:translateY(-2px); }
.btn--dark{ --bg:var(--lime-ink); --fg:var(--lime); }
.btn--dark:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -14px rgba(16,20,10,.7); }
.btn--sm{ padding:.62rem 1.05rem; font-size:.9rem; }
.btn--full{ width:100%; }
.ico{ width:1.05em; height:1.05em; fill:currentColor; flex:none; }

/* ---------- HLAVIČKA ---------- */
.hdr{
  position:fixed; inset:0 0 auto 0; z-index:100;
  transition:background .3s, border-color .3s, backdrop-filter .3s;
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  background:rgba(12,14,10,.86);
  backdrop-filter:blur(14px) saturate(1.2);
  border-bottom-color:var(--line);
}
.hdr__in{ display:flex; align-items:center; gap:2rem; height:76px; }

.brand{ display:flex; align-items:center; gap:.6rem; flex:none; }
.brand__mark{ width:34px; height:34px; flex:none; }
.brand__stack{ display:flex; flex-direction:column; line-height:1; }
.brand__txt{
  font-family:var(--f-disp); font-weight:800; font-size:1.42rem;
  letter-spacing:.02em; color:#fff;
}
/* propojení na starou/reklamní doménu, ať lidi z inzerátu vědí, že jsou správně */
.brand__alt{
  font-size:.66rem; font-weight:600; letter-spacing:.08em;
  color:var(--lime); margin-top:.22rem;
}

.nav{ display:flex; gap:1.75rem; margin-left:auto; }
.nav a{
  font-size:.94rem; font-weight:500; color:var(--txt-dim);
  position:relative; padding-block:.35rem; transition:color .2s;
}
.nav a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:2px;
  background:var(--lime); transition:width .25s var(--ease);
}
.nav a:hover{ color:var(--txt); }
.nav a:hover::after{ width:100%; }

.hdr__cta{ display:flex; align-items:center; gap:.75rem; flex:none; }

.burger{
  display:none; width:44px; height:44px; background:none; border:0;
  cursor:pointer; padding:11px 9px; flex-direction:column; justify-content:space-between;
}
.burger span{ display:block; height:2px; background:var(--txt); border-radius:2px;
  transition:transform .25s var(--ease), opacity .2s; transform-origin:center; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(9px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-9px) rotate(-45deg); }

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:min(100svh,880px);
  display:flex; align-items:center; padding-block:9rem 5rem;
  overflow:hidden; isolation:isolate;
}
.hero__bg{
  position:absolute; inset:0; z-index:-2;
  /* funguje samo o sobě; po vložení <img> se přes fotku položí ztmavení níže */
  background:
    radial-gradient(75% 60% at 80% 14%, rgba(191,224,79,.13) 0%, transparent 62%),
    radial-gradient(65% 65% at 8% 88%, rgba(191,224,79,.06) 0%, transparent 60%),
    linear-gradient(158deg, #171B12 0%, var(--ink) 58%);
}
/* Fotka je jen nehybná textura pod vrtačkou a textem.
   Sílu ladí jediná proměnná --hero-media v :root. */
.hero__bg img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  opacity:var(--hero-media); filter:grayscale(.4) contrast(1.03);
}
.hero__bg:has(img)::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(120% 90% at 15% 30%, rgba(12,14,10,.55) 0%, rgba(12,14,10,.93) 62%, var(--ink) 100%),
    linear-gradient(to top, var(--ink) 2%, transparent 45%);
}
.hero__grid{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:linear-gradient(var(--line-lime) 1px, transparent 1px),
                   linear-gradient(90deg, var(--line-lime) 1px, transparent 1px);
  background-size:78px 78px;
  mask-image:radial-gradient(90% 70% at 60% 40%, #000 0%, transparent 72%);
  opacity:.5;
}
/* ---------- ROZLOŽENÁ VRTAČKA V HERO ---------- */
.hero__anim{
  position:absolute; z-index:-1; pointer-events:none;
  right:max(-3vw, -3rem); top:50%; translate:0 -50%;
  width:min(50%, 700px);
  /* svítí, když je vrtačka celá, a pohasne, když je rozložená */
  animation:heroGlow 10s ease-in-out infinite;
}
.hero__anim svg{ width:100%; height:auto; overflow:visible; }
.hero__anim g{
  fill:rgba(191,224,79,.055); stroke:var(--lime); stroke-width:4;
  stroke-linejoin:round; stroke-linecap:round;
}
.hero__anim .d{ fill:none; stroke-width:2.4; opacity:.42; }   /* jemné detaily */
.hero__anim .f{ fill:var(--lime); stroke:none; }              /* plné tvary */
/* vnitřek těla je slabší, ať skořepina drží hlavní obrys */
.hero__anim .in{ stroke-width:3; opacity:.72; }

/* montážní osy — jako v servisním výkresu, naběhnou až v rozloženém stavu */
.axis{
  fill:none; stroke:var(--lime); stroke-width:1.5; stroke-dasharray:9 11;
  opacity:0; animation:axisFade 10s linear infinite;
}

/* Střed otáčení je u každého dílu zadaný napevno v souřadnicích viewBoxu —
   fill-box se na <g> chová napříč enginy nespolehlivě. */
.xp{
  transform-box:view-box; transform-origin:var(--o, 50% 50%);
  animation:xplode 10s infinite;
  animation-delay:var(--d, 0s);
}

/* Rozjezd po montážních osách, krátké vznášení a zpětné složení.
   Náběhy jsou po úsecích, ať to nevypadá jako lineární posun. */
@keyframes xplode{
  0%   { transform:translate(0,0) rotate(0deg);
         animation-timing-function:ease-in; }
  12%  { transform:translate(0,0) rotate(0deg);
         animation-timing-function:cubic-bezier(.16,.86,.26,1); }
  36%  { transform:translate(var(--x,0px), var(--y,0px)) rotate(var(--r,0deg));
         animation-timing-function:ease-in-out; }
  48%  { transform:translate(calc(var(--x,0px) + 4px), calc(var(--y,0px) - 5px)) rotate(var(--r,0deg));
         animation-timing-function:ease-in-out; }
  60%  { transform:translate(var(--x,0px), var(--y,0px)) rotate(var(--r,0deg));
         animation-timing-function:cubic-bezier(.55,0,.2,1); }
  84%,
  100% { transform:translate(0,0) rotate(0deg); }
}

@keyframes axisFade{
  0%, 15%   { opacity:0; }
  34%, 60%  { opacity:.28; }
  80%, 100% { opacity:0; }
}

@keyframes heroGlow{
  0%, 12%   { filter:drop-shadow(0 0 34px rgba(191,224,79,.30)); }
  38%, 60%  { filter:drop-shadow(0 0 16px rgba(191,224,79,.09)); }
  86%, 100% { filter:drop-shadow(0 0 34px rgba(191,224,79,.30)); }
}

.hero__in{ position:relative; }

.hero__h1{
  font-size:clamp(2.85rem,1.4rem + 6.6vw,6rem);
  max-width:15ch; margin-bottom:1.6rem; color:#fff;
}
.hero__h1 .hl{ color:var(--lime); }

.hero__lead{ max-width:56ch; font-size:clamp(1.06rem,1rem + .4vw,1.28rem); color:var(--txt-dim); }
.hero__lead strong{ color:var(--txt); font-weight:600; }

.hero__btns{ display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2.4rem; }

.hero__facts{
  list-style:none; padding:2.6rem 0 0; margin-top:2.8rem;
  border-top:1px solid var(--line);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); gap:1.6rem 1.2rem;
}
.hero__facts li{ display:flex; flex-direction:column; gap:.15rem; }
.hero__facts b{ font-family:var(--f-disp); font-weight:700; font-size:1.02rem; color:var(--lime); }
.hero__facts span{ font-size:.9rem; color:var(--txt-dim); }

.hero__scroll{
  position:absolute; left:50%; bottom:1.6rem; translate:-50% 0;
  width:26px; height:42px; border:2px solid var(--line); border-radius:14px;
  display:grid; place-items:start center; padding-top:7px;
}
.hero__scroll span{ width:3px; height:7px; border-radius:2px; background:var(--lime);
  animation:sd 1.8s var(--ease) infinite; }
@keyframes sd{ 0%,100%{ transform:translateY(0); opacity:1 } 60%{ transform:translateY(12px); opacity:0 } }

/* ---------- PÁS ---------- */
.strip{ background:var(--ink-2); border-block:1px solid var(--line); padding-block:clamp(2.5rem,5vw,4rem); }
.strip__txt{
  font-family:var(--f-disp); font-weight:600;
  font-size:clamp(1.25rem,1rem + 1.5vw,2rem); line-height:1.35;
  letter-spacing:-.02em; max-width:34ch; color:var(--txt);
}
.strip__txt em{ color:var(--lime); font-style:normal; }

/* ---------- KROKY ---------- */
.steps{
  list-style:none; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:2.4rem 2rem;
}
.step{ position:relative; padding-top:2.6rem; border-top:2px solid var(--line); }
.step::before{
  content:""; position:absolute; top:-2px; left:0; width:0; height:2px; background:var(--lime);
  transition:width .9s var(--ease) .15s;
}
.step.in::before{ width:100%; }
.step__n{
  position:absolute; top:1rem; right:0;
  font-family:var(--f-disp); font-weight:800; font-size:2.6rem;
  color:transparent; -webkit-text-stroke:1.5px var(--ink-4); line-height:1;
}
.step h3{ font-size:1.3rem; margin-bottom:.7rem; }
.step p{ color:var(--txt-dim); font-size:.98rem; }

/* ---------- KATEGORIE ---------- */
.cats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; }
.cat{
  grid-column:span 2;
  background:var(--ink-2); border:1px solid var(--line); border-radius:var(--r-l);
  overflow:hidden; display:flex; flex-direction:column;
  transition:border-color .3s, transform .3s var(--ease);
}
.cat:hover{ border-color:var(--line-lime); transform:translateY(-4px); }
.cat--wide{ grid-column:span 4; flex-direction:row; }

.cat__img{ margin:0; overflow:hidden; background:
  linear-gradient(135deg,var(--ink-3),var(--ink-4)); aspect-ratio:16/10; }
.cat--wide .cat__img{ flex:1 1 52%; aspect-ratio:auto; min-height:330px; }
.cat__img img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
/* fotka na výšku ve vodorovném rámu — posunout ořez na bateriový pack */
.cat__img--baterie img{ object-position:center 56%; }
.cat:hover .cat__img img{ transform:scale(1.05); }

.cat__body{ padding:1.7rem 1.6rem 1.9rem; display:flex; flex-direction:column; gap:.6rem; }
.cat--wide .cat__body{ flex:1 1 48%; justify-content:center; padding:clamp(1.8rem,3.5vw,3.2rem); gap:.85rem; }
.cat__tag{
  font-family:var(--f-disp); font-weight:700; font-size:.75rem;
  letter-spacing:.15em; text-transform:uppercase; color:var(--lime);
}
.cat h3{ font-size:clamp(1.22rem,1.05rem + .55vw,1.75rem); }
.cat p{ color:var(--txt-dim); font-size:.97rem; }
.cat p em{ color:var(--txt); font-style:normal; }

.chips{ list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.5rem; }
.chips li{
  font-size:.82rem; font-weight:500; padding:.35rem .8rem;
  border:1px solid var(--line-lime); border-radius:100px; color:var(--lime);
}

/* ---------- LIMETKOVÝ BLOK / DOPRAVA ---------- */
.lime{
  background:var(--lime); color:var(--lime-ink);
  padding-block:var(--sec); position:relative; overflow:hidden;
}
.lime::before{
  content:""; position:absolute; inset:0; opacity:.07; pointer-events:none;
  background-image:repeating-linear-gradient(45deg, var(--lime-ink) 0 2px, transparent 2px 16px);
}
.lime__in{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2.5rem,5vw,5rem); position:relative; }
.lime__lead{ max-width:46ch; margin-block:1.4rem 2.2rem; font-size:1.08em; color:rgba(16,20,10,.78); }
.lime__right{ display:flex; flex-direction:column; gap:1rem; }

.price-card{
  background:var(--lime-ink); color:var(--lime);
  border-radius:var(--r-m); padding:1.6rem 1.7rem;
}
.price-card__label{
  font-family:var(--f-disp); font-weight:700; font-size:.76rem;
  letter-spacing:.15em; text-transform:uppercase; opacity:.6; margin-bottom:.5rem;
}
.price-card__val{
  font-family:var(--f-disp); font-weight:800; font-size:clamp(1.8rem,1.3rem + 1.6vw,2.5rem);
  line-height:1.05; letter-spacing:-.03em;
}
.price-card__val span{ font-size:.46em; font-weight:600; opacity:.6; letter-spacing:0; }
.price-card__note{ margin-top:.6rem; font-size:.92rem; color:rgba(233,236,227,.62); }

.lime__list{ list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; }
.lime__list li{ font-weight:600; font-size:.93rem; display:flex; align-items:center; gap:.45rem; }
.lime__list li::before{
  content:""; width:7px; height:7px; border-radius:50%; background:var(--lime-ink); flex:none;
}

/* ---------- VÝKUP ---------- */
.buy__in{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,5vw,5rem); align-items:center; }
/* firemní výkup — zrcadlově, oddělené linkou */
.buy__firm{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,5vw,5rem); align-items:center;
  margin-top:clamp(3rem,6vw,5rem); padding-top:clamp(3rem,6vw,5rem);
  border-top:1px solid var(--line);
}
.h3-lg{ font-size:clamp(1.5rem,1.2rem + 1.6vw,2.3rem); margin-bottom:.2rem; }
.buy__txt > p{ color:var(--txt-dim); margin-top:1.3rem; max-width:46ch; }
.buy__txt strong{ color:var(--txt); font-weight:600; }
.buy__img{ margin:0; border-radius:var(--r-l); overflow:hidden; aspect-ratio:4/3;
  background:linear-gradient(135deg,var(--ink-3),var(--ink-4)); }
.buy__img img{ width:100%; height:100%; object-fit:cover; }

/* ---------- PRO FIRMY ---------- */
.firms{ background:var(--ink-2); border-block:1px solid var(--line); }
.firms__in{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,5vw,5rem); align-items:center; }
.firms__txt > p{ color:var(--txt-dim); margin-top:1.3rem; max-width:46ch; }
.firms__img{ margin:0; border-radius:var(--r-l); overflow:hidden; aspect-ratio:4/3;
  background:linear-gradient(135deg,var(--ink-3),var(--ink-4)); }
.firms__img img{ width:100%; height:100%; object-fit:cover; }

.ticks{ list-style:none; padding:0; margin:1.8rem 0 2.3rem; display:grid; gap:.85rem; }
.ticks li{ position:relative; padding-left:2rem; font-size:.99rem; }
.ticks li::before{
  content:""; position:absolute; left:0; top:.42em; width:12px; height:7px;
  border-left:2.5px solid var(--lime); border-bottom:2.5px solid var(--lime);
  transform:rotate(-45deg);
}

/* ---------- DIAGNOSTIKA ---------- */
.diag__in{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,5vw,5rem); align-items:center; }
.diag__img{ margin:0; border-radius:var(--r-l); overflow:hidden; aspect-ratio:4/5;
  background:linear-gradient(135deg,var(--ink-3),var(--ink-4)); }
.diag__img img{ width:100%; height:100%; object-fit:cover; }
.diag__txt p{ color:var(--txt-dim); margin-top:1.3rem; max-width:48ch; }
.diag__txt strong{ color:var(--txt); font-weight:600; }
.diag__box{
  margin-top:2.2rem; padding:1.4rem 1.6rem; border-left:3px solid var(--lime);
  background:var(--ink-2); border-radius:0 var(--r-m) var(--r-m) 0;
}
.diag__box-t{ font-family:var(--f-disp); font-weight:800; font-size:1.3rem; color:var(--lime); }
.diag__box p{ margin-top:.25rem; font-size:.95rem; }

/* ---------- SVĚTLÉ SEKCE ---------- */
.paper{ background:var(--paper); color:var(--txt-dark); }
.paper--b{ background:var(--paper-2); }
.paper .h2,.paper h3{ color:var(--txt-dark); }

.saves{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.1rem; }
.save{
  background:#fff; border:1px solid var(--line-dark); border-radius:var(--r-m);
  overflow:hidden; display:flex; flex-direction:column;
}
.save__img{ margin:0; aspect-ratio:4/3; overflow:hidden; background:var(--paper-2); }
.save__img img{ width:100%; height:100%; object-fit:cover; }
.save__body{ padding:1.5rem 1.7rem 1.4rem; display:flex; flex-direction:column; flex:1; }
.save h3{ font-size:1.22rem; margin-bottom:.4rem; }
.save__what{
  font-size:.86rem; line-height:1.45; color:var(--txt-dark-dim);
  margin-bottom:1.1rem; padding-bottom:.9rem; border-bottom:1px solid var(--line-dark);
}
.save dl{ display:grid; gap:.45rem; }
.save dl div{ display:flex; justify-content:space-between; align-items:baseline;
  border-bottom:1px dashed var(--line-dark); padding-bottom:.45rem; }
.save dt{ color:var(--txt-dark-dim); font-size:.93rem; }
.save dd{ font-family:var(--f-disp); font-weight:700; font-size:1.08rem; }
.save__ok{ color:var(--lime-lo); }
.save__sum{
  margin-top:auto; padding-top:0; font-family:var(--f-disp); font-weight:800; font-size:1.05rem;
  color:var(--txt-dark); background:var(--lime); align-self:flex-start;
  padding:.35rem .85rem; border-radius:var(--r-s); margin-block-start:1.1rem;
}

.pricelist{ margin-top:clamp(3rem,6vw,4.5rem); background:#fff;
  border:1px solid var(--line-dark); border-radius:var(--r-m); padding:clamp(1.5rem,3vw,2.6rem); }
.pricelist__h{ font-size:1.5rem; margin-bottom:1.4rem; }
.ptable{ width:100%; border-collapse:collapse; }
.ptable tr{ border-bottom:1px solid var(--line-dark); }
.ptable tr:last-child{ border-bottom:0; }
.ptable th,.ptable td{ text-align:left; padding:1rem .5rem; vertical-align:baseline; }
.ptable th{ font-weight:600; font-size:1rem; }
.ptable__p{ font-family:var(--f-disp); font-weight:800; font-size:1.1rem; white-space:nowrap; width:1%; padding-inline:1.5rem; }
.ptable__n{ color:var(--txt-dark-dim); font-size:.9rem; }
.pricelist__note{ margin-top:1.3rem; font-size:.88rem; color:var(--txt-dark-dim); }

/* ---------- FAQ ---------- */
.faq{ display:grid; gap:.6rem; }
.faq__i{ background:#fff; border:1px solid var(--line-dark); border-radius:var(--r-m); overflow:hidden; }
.faq__i summary{
  cursor:pointer; list-style:none; padding:1.15rem 3.2rem 1.15rem 1.4rem;
  font-family:var(--f-disp); font-weight:700; font-size:1.05rem; color:var(--txt-dark);
  position:relative; transition:color .2s;
}
.faq__i summary::-webkit-details-marker{ display:none; }
.faq__i summary::after{
  content:""; position:absolute; right:1.4rem; top:50%; width:11px; height:11px;
  border-right:2.5px solid var(--lime-lo); border-bottom:2.5px solid var(--lime-lo);
  translate:0 -70%; rotate:45deg; transition:rotate .28s var(--ease);
}
.faq__i[open] summary::after{ rotate:225deg; translate:0 -25%; }
.faq__i[open] summary{ color:var(--lime-lo); }
.faq__a{ padding:0 1.4rem 1.35rem; color:var(--txt-dark-dim); font-size:.98rem; max-width:62ch; }

/* ---------- ZNAČKY / KOLOTOČ ---------- */
.brands{ background:var(--ink-2); border-block:1px solid var(--line); overflow:hidden; }
.brands .sec__head{ margin-bottom:clamp(2rem,4vw,3rem); }

.marquee{ display:grid; gap:.4rem; }
.marquee__row{
  display:flex; width:100%; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.marquee__track{
  display:flex; align-items:center; list-style:none; padding:0; margin:0;
  flex:0 0 auto; animation:mq 52s linear infinite;
}
.marquee__row--rev .marquee__track{ animation-direction:reverse; }
.marquee__row:hover .marquee__track,
.marquee__row:focus-within .marquee__track{ animation-play-state:paused; }

.marquee__track li{
  display:flex; align-items:center; gap:clamp(1rem,2.2vw,2rem);
  padding-inline:clamp(.9rem,2vw,1.7rem);
  font-family:var(--f-disp); font-weight:700;
  font-size:clamp(1.05rem,.9rem + .8vw,1.7rem); letter-spacing:-.015em;
  color:var(--txt-dim); white-space:nowrap; transition:color .3s;
}
.marquee__track li::after{
  content:""; width:5px; height:5px; border-radius:50%;
  background:var(--lime); opacity:.5; flex:none;
}
.marquee__row:hover .marquee__track li{ color:var(--txt); }

@keyframes mq{ from{ transform:translateX(0) } to{ transform:translateX(-100%) } }

.brands__note{
  margin-top:clamp(2rem,4vw,3rem); text-align:center;
  font-size:.82rem; color:var(--txt-dim); max-width:62ch; margin-inline:auto;
}

/* ---------- KONTAKT ---------- */
.contact{ background:var(--ink); }
/* stretch = obě karty stejně vysoké bez ohledu na délku popisu */
.contact__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; align-items:stretch; }

.ccard{
  background:var(--ink-2); border:1px solid var(--line); border-radius:var(--r-l);
  padding:clamp(1.6rem,3vw,2.2rem); display:flex; flex-direction:column; gap:.35rem;
}
.ccard--accent{ border-color:var(--line-lime); background:linear-gradient(160deg,var(--ink-3),var(--ink-2)); }
.ccard__role{
  font-family:var(--f-disp); font-weight:700; font-size:.76rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--lime); margin-bottom:.5rem;
}
.ccard__name{ font-size:1.85rem; color:#fff; }
.ccard__desc{ color:var(--txt-dim); font-size:.95rem; margin-bottom:1.2rem; }
.ccard__tel{
  font-family:var(--f-disp); font-weight:800;
  font-size:clamp(1.45rem,1.2rem + 1vw,1.95rem); letter-spacing:-.02em;
  color:var(--lime); transition:color .2s;
}
.ccard__tel:hover{ color:var(--lime-hi); }
.ccard__mail{ color:var(--txt); font-size:.98rem; border-bottom:1px solid var(--line-lime);
  align-self:flex-start; transition:color .2s,border-color .2s; }
.ccard__mail:hover{ color:var(--lime); border-color:var(--lime); }
/* auto přisadí adresu na spodek karty, ať linka sedí v obou ve stejné výšce */
.ccard__addr{ margin-top:auto; padding-top:1.3rem; border-top:1px solid var(--line);
  color:var(--txt-dim); font-size:.93rem; }

/* ---------- FORMULÁŘ ---------- */
.form{
  grid-column:span 2;
  background:var(--ink-2); border:1px solid var(--line); border-radius:var(--r-l);
  padding:clamp(1.6rem,3vw,2.4rem); display:grid; gap:1rem; margin-top:.6rem;
}
.form__h{ font-size:1.55rem; color:#fff; margin-bottom:.4rem; }
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.fld{ display:grid; gap:.4rem; }
.fld > span{ font-size:.85rem; font-weight:500; color:var(--txt-dim); }
.fld i{ color:var(--lime); font-style:normal; }
.fld input,.fld select,.fld textarea{
  background:var(--ink); border:1px solid var(--line); border-radius:var(--r-s);
  padding:.85rem 1rem; width:100%; transition:border-color .2s, background .2s;
}
.fld textarea{ resize:vertical; min-height:110px; }
.fld input::placeholder,.fld textarea::placeholder{ color:#5C6353; }
.fld input:focus,.fld select:focus,.fld textarea:focus{ border-color:var(--lime); outline:none; background:var(--ink-3); }
.fld input[aria-invalid="true"],.fld select[aria-invalid="true"]{ border-color:#E4643C; }
.fld select{ appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23BFE04F' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center; background-size:11px; padding-right:2.5rem; }

.check{ display:flex; gap:.7rem; align-items:flex-start; font-size:.88rem; color:var(--txt-dim); }
.check input{ margin-top:.25rem; width:18px; height:18px; accent-color:var(--lime); flex:none; cursor:pointer; }
.check a{ color:var(--lime); text-decoration:underline; text-underline-offset:2px; }

.form__msg{ font-size:.92rem; min-height:1.2em; }
.form__msg.ok{ color:var(--lime); }
.form__msg.err{ color:#F08A64; }

/* ---------- PATIČKA ---------- */
.foot{ background:var(--ink-2); border-top:1px solid var(--line); padding-top:clamp(3rem,6vw,4.5rem); }
.foot__in{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2.5rem; padding-bottom:3rem; }
.foot__brand{ display:flex; flex-direction:column; gap:1rem; }
.foot__claim{ color:var(--txt-dim); font-size:.95rem; }
.foot__alt{
  margin-top:.5rem; font-family:var(--f-disp); font-weight:700;
  font-size:.95rem; color:var(--lime); letter-spacing:.01em;
}
.foot__alt span{
  display:block; margin-top:.2rem; font-family:var(--f-body); font-weight:400;
  font-size:.85rem; color:var(--txt-dim); letter-spacing:0;
}
.foot__nav{ display:grid; gap:.6rem; align-content:start; }
.foot__nav a{ color:var(--txt-dim); font-size:.94rem; transition:color .2s; }
.foot__nav a:hover{ color:var(--lime); }
.foot__contact{ display:grid; gap:.4rem; align-content:start; font-size:.94rem; }
.foot__lbl{
  font-family:var(--f-disp); font-weight:700; font-size:.72rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--lime);
  margin-top:1.1rem;
}
.foot__lbl:first-child{ margin-top:0; }
.foot__contact a{ color:var(--txt); transition:color .2s; }
.foot__contact a:hover{ color:var(--lime); }
.foot__contact p{ color:var(--txt-dim); }
.foot__bot{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.6rem;
  padding-block:1.4rem; border-top:1px solid var(--line);
  font-size:.85rem; color:var(--txt-dim);
}
.foot__bot a{ transition:color .2s; }
.foot__bot a:hover{ color:var(--lime); }

/* ---------- MOBILNÍ LIŠTA ---------- */
.mbar{ display:none; }

/* ---------- PRÁVNÍ STRÁNKA ---------- */
.legal h2{
  font-family:var(--f-disp); font-weight:700; font-size:1.35rem;
  color:var(--lime); margin-top:2.6rem; margin-bottom:.7rem;
}
.legal p,.legal ul{ color:var(--txt-dim); max-width:66ch; }
.legal p + p{ margin-top:.9rem; }
.legal ul{ padding-left:1.2rem; display:grid; gap:.5rem; margin-top:.5rem; }
.legal strong{ color:var(--txt); }
.legal a{ color:var(--lime); text-decoration:underline; text-underline-offset:2px; }
.legal__date{ margin-top:3rem; padding-top:1.4rem; border-top:1px solid var(--line); font-size:.88rem; }

/* ---------- REVEAL ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .hero__scroll span{ animation:none; }
  .step::before{ transition:none; width:100%; }
  /* kolotoč se zastaví a přeteče do klidného zalomeného seznamu */
  .marquee__track{ animation:none; flex-wrap:wrap; justify-content:center; }
  .marquee__row{ -webkit-mask-image:none; mask-image:none; }
  .marquee__track[aria-hidden="true"]{ display:none; }
  /* vrtačka zůstane složená a nehýbe se */
  .xp,.axis,.hero__anim{ animation:none; }
  .axis{ opacity:0; }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* --- 1200: uvolnit místo v hlavičce dřív, než začne přetékat --- */
@media (max-width:1200px){
  .nav{ gap:1.35rem; }
  .nav a{ font-size:.9rem; }
}

/* --- 1080: hlavička se šesti položkami + telefonem už nevyjde --- */
@media (max-width:1080px){
  .nav{
    position:fixed; inset:76px 0 auto 0;
    flex-direction:column; gap:0;
    background:rgba(12,14,10,.97); backdrop-filter:blur(16px);
    border-bottom:1px solid var(--line);
    padding:1rem var(--pad) 2rem;
    clip-path:inset(0 0 100% 0); opacity:0; pointer-events:none;
    transition:clip-path .4s var(--ease), opacity .3s;
    max-height:calc(100svh - 76px); overflow-y:auto;
  }
  .nav.is-open{ clip-path:inset(0 0 0 0); opacity:1; pointer-events:auto; }
  .nav a{ padding:.95rem 0; border-bottom:1px solid var(--line); font-size:1.05rem; color:var(--txt); }
  .nav a::after{ display:none; }
  .burger{ display:flex; }

  .cats{ grid-template-columns:repeat(2,1fr); }
  .cat{ grid-column:span 1; }
  .cat--wide{ grid-column:span 2; }
}

/* --- 900: dvousloupcové sekce na sebe --- */
@media (max-width:900px){
  .lime__in,.firms__in,.diag__in,.buy__in,.buy__firm{ grid-template-columns:1fr; gap:2.5rem; }
  .diag__img{ aspect-ratio:16/10; order:2; }
  .buy__firm .buy__img{ order:2; }
  .buy__img,.firms__img{ aspect-ratio:16/10; }
  .cat--wide{ flex-direction:column; }
  .cat--wide .cat__img{ min-height:0; aspect-ratio:16/9; }
  .cat__img--baterie img{ object-position:center 52%; }
  .contact__grid{ grid-template-columns:1fr; }
  .form{ grid-column:span 1; }
  .foot__in{ grid-template-columns:1fr 1fr; }
  .foot__brand{ grid-column:span 2; }
  .hero__h1{ max-width:none; }
  /* na užších displejích už vedle textu není místo — animace jde pod něj jako textura */
  .hero__anim{
    width:min(115%, 640px); right:auto; left:50%; top:46%;
    translate:-50% -50%; opacity:.22;
  }
}

/* --- 640: telefon --- */
@media (max-width:640px){
  .hdr__cta .btn--ghost{ display:none; }
  .hdr__in{ height:70px; }
  .nav{ inset-block-start:70px; max-height:calc(100svh - 70px); }
  .hero{ min-height:0; padding-block:7.5rem 4.5rem; }
  .hero__scroll{ display:none; }
  .hero__facts{ grid-template-columns:1fr 1fr; gap:1.3rem 1rem; padding-top:2rem; margin-top:2.2rem; }
  .cats{ grid-template-columns:1fr; }
  .cat--wide{ grid-column:span 1; }
  .steps{ gap:2rem 1.5rem; }
  .step{ padding-top:2.2rem; }
  .step__n{ font-size:2.1rem; top:.7rem; }
  .saves{ grid-template-columns:1fr; }
  .save__img{ aspect-ratio:16/9; }
  .form__row{ grid-template-columns:1fr; }
  .pricelist{ padding-inline:1.2rem; }
  .ptable th,.ptable td{ display:block; padding:.2rem .1rem; }
  .ptable tr{ padding-block:1rem; }
  .ptable th{ font-size:1.02rem; }
  .ptable__p{ width:auto; padding-inline:.1rem; color:var(--lime-lo); font-size:1.25rem; margin-block:.15rem; }
  .ptable__n{ font-size:.88rem; }
  .marquee__track li{ gap:1rem; padding-inline:.8rem; }
  .faq__i summary{ padding:1rem 2.8rem 1rem 1.1rem; font-size:1rem; }
  .faq__a{ padding:0 1.1rem 1.2rem; }
  .diag__box{ padding:1.2rem 1.2rem; }
  .foot__in{ grid-template-columns:1fr; gap:2rem; }
  .foot__brand{ grid-column:span 1; }
  .foot__bot{ flex-direction:column; gap:.4rem; }

  body{ padding-bottom:66px; }
  .mbar{
    display:grid; grid-template-columns:auto 1fr; gap:.6rem;
    position:fixed; inset:auto 0 0 0; z-index:99;
    padding:.6rem var(--pad) calc(.6rem + env(safe-area-inset-bottom));
    background:rgba(12,14,10,.94); backdrop-filter:blur(14px);
    border-top:1px solid var(--line);
  }
  .mbar a{
    display:flex; align-items:center; justify-content:center; gap:.45rem;
    font-family:var(--f-disp); font-weight:700; font-size:.95rem;
    padding:.85rem 1.1rem; border-radius:var(--r-s);
    border:1px solid var(--line); color:var(--txt);
  }
  .mbar__b{ background:var(--lime); color:var(--lime-ink); border-color:var(--lime); }
}

/* --- 400: úzké telefony --- */
@media (max-width:400px){
  .brand__txt{ font-size:1.28rem; }
  .brand__alt{ font-size:.6rem; }
  .hero__btns .btn{ width:100%; }
  .hero__facts{ grid-template-columns:1fr; gap:1rem; }
  .chips li{ font-size:.78rem; padding:.3rem .65rem; }
}

/* ---------- TISK ---------- */
@media print{
  .hdr,.mbar,.hero__scroll,.hero__grid,.hero__anim,.form,.marquee,.brands__note{ display:none !important; }
  body{ background:#fff; color:#000; padding:0; }
  .reveal{ opacity:1; transform:none; }
  .sec{ padding-block:1.5rem; }
}