@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

:root{
  --ink: #1B211D;
  --paper: #E8E4D9;
  --paper-2: #DFDACC;
  --steel: #45524F;
  --steel-light: #6C7976;
  --rule: #BFB9A6;
  --safety: #B8420A;
  --safety-dark: #8F3308;
  --brass: #8A7239;
  --max: 1080px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.brand,.nav a,.btn,.eyebrow,.plate-label,.figure-num{
  font-family:'Oswald', sans-serif;
}

h1,h2,h3{
  margin:0 0 .5em 0;
  font-weight:600;
  letter-spacing:.01em;
  color:var(--ink);
}
h1{font-size:clamp(2.1rem, 5vw, 3.4rem); line-height:1.08; font-weight:700;}
h2{font-size:clamp(1.5rem, 3vw, 2.05rem); line-height:1.15;}
h3{font-size:1.15rem; font-weight:600;}

p{margin:0 0 1em 0; max-width:62ch;}
a{color:inherit;}

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

/* Header */
header.site{
  position:sticky; top:0; z-index:40;
  background-color:#F3F5F6;
  background-image:url('logo-header.png');
  background-repeat:no-repeat;
  background-position:center;
  background-size:auto 350px;
  border-bottom:1px solid var(--rule);
}
.header-row{
  position:relative;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; row-gap:14px;
  padding:14px 0;
  gap:24px;
  min-height:380px;
}
.brand{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:640px; height:350px;
  z-index:1;
}

nav.nav{display:flex; align-items:center; gap:28px; position:relative; z-index:2;}
.nav a{
  text-decoration:none; color:var(--ink);
  font-size:.95rem; letter-spacing:.03em; font-weight:600;
  padding:4px 2px; border-bottom:2px solid transparent;
  transition:border-color .15s ease, color .15s ease;
}
.nav a:hover, .nav a[aria-current="page"]{color:var(--safety-dark); border-color:var(--safety);}

.header-actions{display:flex; align-items:center; gap:18px; position:relative; z-index:2;}
.phone-link{
  display:flex; align-items:center; gap:8px;
  font-size:.95rem; font-weight:600; text-decoration:none; color:var(--ink);
  white-space:nowrap;
}
.phone-link svg{flex:none;}

.btn{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--safety); color:#F4EFE4;
  padding:11px 20px; border-radius:2px;
  text-decoration:none; font-size:.92rem; font-weight:600;
  letter-spacing:.03em; border:1px solid var(--safety-dark);
  transition:background .15s ease;
}
.btn:hover{background:var(--safety-dark);}
.btn.ghost{
  background:transparent; color:var(--ink); border:1px solid var(--steel);
}
.btn.ghost:hover{border-color:var(--ink);}

.nav-toggle{display:none; background:none; border:1px solid var(--steel); padding:8px 10px; border-radius:2px; position:relative; z-index:2;}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:''; display:block; width:20px; height:2px; background:var(--ink); position:relative; margin:5px 0;
}

/* Hero */
.hero{
  padding:76px 0 60px;
  border-bottom:1px solid var(--rule);
  background-image:
    linear-gradient(var(--rule) 1px, transparent 1px),
    linear-gradient(90deg, var(--rule) 1px, transparent 1px);
  background-size:44px 44px;
  background-position:center;
  background-color:var(--paper);
  position:relative;
}
.hero::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 60% 30%, rgba(232,228,217,.35), var(--paper) 70%);
}
.hero .wrap{position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center;}
.eyebrow{
  color:var(--steel); font-size:.82rem; font-weight:500; letter-spacing:.04em;
  margin-bottom:14px; display:block;
}
.hero p.lead{font-size:1.1rem; color:var(--steel); max-width:46ch;}
.hero .cta-row{display:flex; gap:14px; margin-top:26px; flex-wrap:wrap;}

.gauge-wrap{display:flex; justify-content:center;}

/* Sections */
section{padding:64px 0;}
section.alt{background:var(--paper-2); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:36px; flex-wrap:wrap;}
.section-head p{margin:0; color:var(--steel);}

/* Spec list (services) */
.spec-list{border-top:1px solid var(--rule);}
.spec-row{
  display:grid; grid-template-columns:64px 1fr 1.3fr; gap:28px;
  padding:28px 0; border-bottom:1px solid var(--rule);
  align-items:start;
}
.spec-num{font-family:'Oswald'; font-size:.85rem; color:var(--brass); font-weight:600; padding-top:4px;}
.spec-row h3{margin-bottom:8px;}
.spec-row p{color:var(--steel); margin-bottom:0;}
a.more{
  display:inline-block; margin-top:10px; font-size:.88rem; font-weight:600; color:var(--safety);
  text-decoration:none; border-bottom:1px solid var(--safety);
}

/* Process steps */
.steps{counter-reset:step; border-top:1px solid var(--rule);}
.step{
  counter-increment:step;
  display:grid; grid-template-columns:56px 1fr; gap:20px;
  padding:22px 0; border-bottom:1px solid var(--rule);
}
.step::before{
  content:counter(step, decimal-leading-zero);
  font-family:'Oswald'; font-weight:600; color:var(--steel-light); font-size:1rem;
  grid-column:1; grid-row:1;
}
.step-body{grid-column:2; grid-row:1;}
.step h3{margin-bottom:4px;}
.step p{color:var(--steel); margin-bottom:0;}

/* Coverage band */
.coverage{
  display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;
}
.coverage .stat{font-family:'Oswald'; font-size:3.2rem; font-weight:700; color:var(--safety); line-height:1;}
.coverage .stat-label{color:var(--steel); font-size:.95rem; margin-top:8px;}

/* Nameplate (contact) */
.nameplate{
  border:1px solid var(--steel); background:var(--paper-2);
  padding:36px; position:relative;
}
.nameplate::before, .nameplate::after,
.nameplate .rivet{
  content:''; position:absolute; width:8px; height:8px; border-radius:50%;
  background:var(--steel-light); box-shadow:inset 0 0 0 1px var(--paper-2);
}
.nameplate::before{top:12px; left:12px;}
.nameplate::after{top:12px; right:12px;}
.nameplate .rivet.bl{bottom:12px; left:12px;}
.nameplate .rivet.br{bottom:12px; right:12px;}
.plate-label{
  font-size:.75rem; letter-spacing:.05em; color:var(--steel); display:block; margin-bottom:2px;
}
.plate-row{padding:12px 0; border-bottom:1px dashed var(--rule);}
.plate-row:last-child{border-bottom:none;}
.plate-row .val{font-size:1.15rem; font-weight:500;}
.plate-row a{text-decoration:none;}

/* Footer */
footer.site{border-top:1px solid var(--rule); padding:36px 0; background:var(--ink); color:var(--paper);}
footer.site .wrap{display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; align-items:flex-start;}
footer.site .foot-brand{font-family:'Oswald'; font-weight:600; letter-spacing:.02em;}
footer.site .foot-meta{color:#B7B2A2; font-size:.88rem; line-height:1.8;}
footer.site a{color:#EFE9D8; text-decoration:none;}
footer.site .copyright{
  margin-top:24px; padding-top:20px; border-top:1px solid #3A3F35;
  font-size:.82rem; color:#94907F;
}

/* Callout - klíčové zdůraznění */
.callout{
  border:1px solid var(--safety); border-left:6px solid var(--safety);
  background:var(--paper-2); padding:26px 28px; display:flex; gap:18px; align-items:flex-start;
}
.callout svg{flex:none; margin-top:2px;}
.callout p{margin:0; color:var(--ink); font-size:1.02rem;}
.callout strong{color:var(--safety-dark);}

/* Page hero (secondary pages) */
.page-head{padding:52px 0 40px; border-bottom:1px solid var(--rule);
  background-image:linear-gradient(var(--rule) 1px, transparent 1px), linear-gradient(90deg, var(--rule) 1px, transparent 1px);
  background-size:44px 44px;}
.page-head .eyebrow{margin-bottom:10px;}
.page-head p.lead{color:var(--steel); max-width:60ch;}

.two-col{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start;}
.values{border-top:1px solid var(--rule); margin-top:8px;}
.value-row{padding:20px 0; border-bottom:1px solid var(--rule);}
.value-row h3{font-size:1rem; margin-bottom:4px;}
.value-row p{color:var(--steel); margin-bottom:0; font-size:.95rem;}

@media (max-width: 860px){
  nav.nav{
    position:absolute; top:100%; left:0; right:0; background:var(--paper);
    flex-direction:column; align-items:flex-start; gap:0; border-bottom:1px solid var(--rule);
    display:none; padding:8px 28px 18px;
  }
  nav.nav.open{display:flex;}
  nav.nav a{padding:10px 0; width:100%; border-bottom:1px solid var(--rule); color:var(--steel); filter:none;}
  nav.nav a:hover, nav.nav a[aria-current="page"]{color:var(--ink);}
  .nav-toggle{display:block;}
  .header-actions .phone-link span{display:none;}
  header.site{background-size:auto 252px; background-position:center 8px;}
  .brand{width:462px; height:252px; top:8px; transform:translateX(-50%);}
  .header-row{min-height:320px; align-items:flex-end; padding-bottom:14px;}
  .header-row{flex-wrap:wrap; row-gap:10px;}
  .hero .wrap{grid-template-columns:1fr;}
  .gauge-wrap{order:-1;}
  .two-col{grid-template-columns:1fr;}
  .coverage{grid-template-columns:1fr;}
  .spec-row{grid-template-columns:40px 1fr; }
  .spec-row > p, .spec-row > .spec-desc{grid-column:2;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .needle{transition:none !important;}
}