:root {
  --green: #1455a3;
  --dark: #092447;
  --lime: #d9eaff;
  --cream: #f2f7fc;
  --text: #172b45;
  --muted: #61738a;
  --border: #dce6f1;
  --max-width: 1180px;
  --radius: 16px;
  --shadow: 0 15px 40px #17251e12;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 95px;
}

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  line-height: 1.7;
  background: white;
}

img {
  display: block;
  width: 100%;
  object-fit: cover;
}

a { color: inherit; text-decoration: none; }

button, input, textarea, select { font: inherit; }

h1, h2, h3 {
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.15;
  letter-spacing: -.035em;
}

h1 { font-size: clamp(2.7rem, 6vw, 5.2rem); }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
h3 { font-size: 1.3rem; }

p { color: var(--muted); }

.container {
  width: min(var(--max-width), calc(100% - 40px));
  margin-inline: auto;
}

.section { padding: 90px 0; }
.section-soft { background: var(--cream); }
.section-dark { background: var(--dark); color: white; }

.header {
  position: sticky;
  z-index: 100;
  top: 0;
  background: #fffffffa;
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(12px);
}

.nav {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-weight: 800;
  line-height: 1.2;
  flex-shrink: 0;
}

.brand small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: .68rem;
  font-weight: 400;
  letter-spacing: .06em;
}

.brand-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  color: var(--lime);
  background: var(--green);
  border-radius: 7px;
  font-size: 1.5rem;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 22px;
}

.nav-links > a:not(.button) {
  font-size: .88rem;
  font-weight: 600;
}

.nav-links > a:hover { color: #2673cf; }

.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 7px;
  background: var(--cream);
  font-size: 1.5rem;
  cursor: pointer;
}

.button {
  min-height: 51px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 13px 23px;
  border: 1px solid var(--green);
  border-radius: 6px;
  background: var(--green);
  color: white;
  font-weight: 700;
  cursor: pointer;
  transition: .2s ease;
}

.button:hover {
  transform: translateY(-2px);
  background: #35543e;
}

.button-small { min-height: 43px; padding: 9px 15px; }
.button-outline { color: white; background: transparent; border-color: #ffffff85; }
.button-outline:hover { background: white; color: var(--green); }
.button-light { color: var(--dark); background: var(--lime); border-color: var(--lime); }

.hero {
  min-height: 630px;
  display: flex;
  align-items: center;
  color: white;
  background:
    linear-gradient(90deg, #092447f2 0%, #1455a3b8 42%, #1455a322 100%),
    url("https://www.dobre-strechy.cz/cz/reference/ostatni-drevene-konstrukce/Obytce/most-Obytce-01.jpg")
    center / cover;
}

.hero.bridge-hero {
  background:
    linear-gradient(90deg, rgba(5, 31, 57, .88) 0%, rgba(5, 31, 57, .58) 42%, rgba(5, 31, 57, .08) 100%),
    url("../images/most-ai-hero.jpg") center / cover;
}

.hero-content {
  max-width: 790px;
  padding-block: 90px;
}

.eyebrow {
  display: inline-block;
  color: #6c8953;
  font-size: .77rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.hero .eyebrow { color: var(--lime); }
.hero h1 { margin: 23px 0; }
.hero h1 span { color: var(--lime); }
.hero p { max-width: 610px; font-size: 1.08rem; }
.hero-content > p { color: #e0e8df; }

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 13px;
  margin-top: 30px;
}

.section-heading { max-width: 700px; margin-bottom: 38px; }
.section-heading h2 { margin: 13px 0; }
.section-heading p { max-width: 600px; }

.cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 23px;
}

.card {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: white;
  transition: transform .2s, box-shadow .2s;
}

.card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.card > img { height: 230px; }
.card-content { padding: 24px; }
.card-content h3 { margin: 0 0 10px; }
.card-content p { min-height: 76px; font-size: .94rem; }

.text-link { color: var(--green); font-weight: 700; }
.text-link:hover { text-decoration: underline; }

.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.split h2 { margin: 15px 0; }
.split p { color: #cbd5ca; }
.split-image { height: 430px; border-radius: var(--radius); }
.section-dark .eyebrow { color: var(--lime); }

.check-list { padding: 0; margin: 24px 0; list-style: none; }
.check-list li { padding: 7px 0 7px 28px; position: relative; }
.check-list li::before {
  content: "?";
  position: absolute;
  left: 0;
  color: #8cae70;
  font-weight: 800;
}

.gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.gallery a {
  overflow: hidden;
  border-radius: var(--radius);
}

.gallery img { height: 290px; transition: transform .35s; }
.gallery a:hover img { transform: scale(1.05); }
.notice { font-size: .82rem; }

.cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: 42px;
  background: #e6eddc;
  border-radius: var(--radius);
}

.cta h2 { margin: 12px 0; }
.cta p { margin-bottom: 0; }

.footer {
  padding: 55px 0 20px;
  background: var(--dark);
  color: white;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 45px;
  padding-bottom: 35px;
}

.brand-footer small { color: #c4d0c4; }
.footer p, .footer a { color: #c4d0c4; font-size: .9rem; }
.footer a:hover { color: var(--lime); }
.footer-grid > div:not(:first-child) > a { display: block; margin: 8px 0; }
.footer h3 { font-size: 1rem; }

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding-top: 18px;
  border-top: 1px solid #ffffff26;
}

.footer-bottom p { margin: 0; font-size: .8rem; }

@media (max-width: 1000px) {
  .nav-links { gap: 12px; }
  .nav-links > a:not(.button) { font-size: .8rem; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split { gap: 35px; }
}

@media (max-width: 780px) {
  .section { padding: 65px 0; }

  .nav { min-height: 72px; }
  .menu-toggle { display: block; }

  .nav-links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: 15px 22px 23px;
    background: white;
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow);
    align-items: stretch;
    flex-direction: column;
    gap: 0;
  }

  .nav-links.open { display: flex; }
  .nav-links > a:not(.button) { padding: 11px 0; font-size: .95rem; }
  .nav-links .button { margin-top: 12px; }

  .hero { min-height: 550px; }
  .hero-content { padding-block: 70px; }
  .split { grid-template-columns: 1fr; }
  .split-image { height: 330px; }
  .cta { align-items: flex-start; flex-direction: column; padding: 28px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .footer-grid > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 540px) {
  .container { width: calc(100% - 32px); }
  .section { padding: 53px 0; }
  .hero { min-height: 520px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .cards, .gallery { grid-template-columns: 1fr; }
  .card > img { height: 240px; }
  .gallery img { height: 260px; }
  .split-image { height: 270px; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-grid > div:first-child { grid-column: auto; }
  .footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* Kontaktn� str�nka a popt�vkov� formul�r */
.contact-layout {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 55px;
  align-items: start;
}

.contact-item {
  margin-top: 28px;
}

.contact-item > span {
  display: block;
  color: var(--muted);
  font-size: .85rem;
}

.contact-item > a {
  color: var(--green);
  font-size: 1.15rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.contact-form {
  padding: 30px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  background: white;
}

.contact-form h2 {
  margin-top: 0;
  font-size: 1.8rem;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}

.field label {
  font-size: .87rem;
  font-weight: 700;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px;
  border: 1px solid #dfe3da;
  border-radius: 6px;
  background: #fbfbf9;
  color: var(--text);
}

.field textarea {
  min-height: 135px;
  resize: vertical;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: 2px solid #789367;
  outline-offset: 1px;
}

.field-full {
  grid-column: 1 / -1;
}

.privacy {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 22px 0;
  font-size: .82rem;
  color: var(--muted);
}

.privacy input {
  margin-top: 5px;
  flex-shrink: 0;
}

.form-note,
.form-status {
  font-size: .8rem;
  overflow-wrap: anywhere;
}

@media (max-width: 780px) {
  .contact-layout {
    grid-template-columns: 1fr;
    gap: 35px;
  }
}

@media (max-width: 540px) {
  .contact-form { padding: 20px; }
  .form-grid { grid-template-columns: 1fr; }
  .field-full { grid-column: auto; }
}

/* SEO/mobile refinements */
.nav-phone { flex-shrink: 0; color: var(--green); font-weight: 800; white-space: nowrap; font-size: .98rem; }
.nav-phone:hover { text-decoration: underline; }
.reference-card { overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.reference-card img { height: 225px; object-fit: cover; }
.reference-card .card-content { padding: 18px; }
.reference-card h3 { margin: 0 0 5px; font-size: 1.06rem; }
.reference-card p { margin: 0; color: var(--muted); font-size: .92rem; }
.reference-category { margin: 38px 0 18px; color: var(--green); }
@media (max-width: 1000px) { .nav { gap: 12px; } .nav-phone { font-size: .86rem; } }
@media (max-width: 780px) { .nav { flex-wrap: wrap; gap: 10px; } .nav-phone { margin-left: auto; font-size: .88rem; } .menu-toggle { order: 3; } .nav-links { z-index: 10; } }
@media (max-width: 430px) { .brand small { font-size: .58rem; } .brand-icon { width: 38px; height: 38px; } .nav-phone { font-size: .8rem; } }


/* Thematic hero photography by service */
.hero.bridge-hero, .hero.construction-hero {
  background: linear-gradient(90deg, #092447f2 0%, #1455a3c9 48%, #1455a333 100%),
    url("https://www.dobre-strechy.cz/cz/reference/ostatni-drevene-konstrukce/Obytce/most-Obytce-01.jpg") center 48% / cover;
}
.hero.cnc-hero {
  background: linear-gradient(90deg, #092447f2 0%, #1455a3c9 48%, #1455a333 100%),
    url("https://www.dobre-strechy.cz/cz/reference/cnc-krovy/Bezdekov_1/krov-Bezdekov-01.jpg") center / cover;
}
.hero.timber-hero {
  background: linear-gradient(90deg, #092447f2 0%, #1455a3c9 48%, #1455a333 100%),
    url("https://www.dobre-strechy.cz/cz/reference/drevostavby/drevostavba-patrova/drevostavba-patrova-00.jpg") center / cover;
}
.hero.roof-hero {
  background: linear-gradient(90deg, #092447f2 0%, #1455a3c9 48%, #1455a333 100%),
    url("https://www.dobre-strechy.cz/cz/reference/cnc-krovy/Lhota/krov-Lhota-01.jpg") center / cover;
}
.hero.crane-hero {
  background: linear-gradient(90deg, #092447f2 0%, #1455a3c9 48%, #1455a333 100%),
    url("https://www.dobre-strechy.cz/images/jerabove%20prace%20Demag%20AC40%20City.jpg") center / cover;
}


/* Titulní strana – rozložení inspirované schváleným grafickým návrhem */
.brand-icon { color: #0b477d; font-size: 2.2rem; border: 0; background: transparent; }
.bridge-hero {
  min-height: 560px;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  background-image: linear-gradient(90deg, rgba(3,31,54,.90) 0%, rgba(3,31,54,.68) 32%, rgba(3,31,54,.06) 68%), url('../images/most-ai-hero.jpg');
  background-size: cover;
  background-position: center 48%;
}
.bridge-hero:after {
  content: "";
  position: absolute;
  pointer-events: none;
  left: -3%; right: -3%; bottom: -1px;
  height: 64px;
  background: white;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
  opacity: .98;
}
.bridge-hero .hero-content { position: relative; z-index: 1; padding-top: 30px; padding-bottom: 70px; }
.bridge-hero h1 { max-width: 620px; color: white; font-size: clamp(2.5rem, 5vw, 4rem); }
.bridge-hero p { color: #f0f6fc; max-width: 470px; font-size: 1.15rem; }
.bridge-hero .eyebrow { color: #fff; letter-spacing: .28em; text-transform: uppercase; }
.graphic-brand-band {
  text-align: center; padding: 30px 20px 18px; background: #fff; color: #0b477d;
  margin-top: -2px;
}
.graphic-brand-mark { font-size: 2.8rem; line-height: 1; transform: scaleX(1.7); }
.graphic-brand-name { font-size: clamp(2rem, 5vw, 3.8rem); font-weight: 800; letter-spacing: -.04em; line-height: 1.1; }
.graphic-brand-sub { font-size: clamp(.85rem, 2vw, 1.35rem); font-weight: 700; letter-spacing: .035em; }
.service-strip {
  display: grid; grid-template-columns: repeat(6, minmax(0,1fr));
  padding: 16px max(20px, calc((100% - 1320px)/2)) 22px; background: #fff; color: #0b477d;
}
.service-strip a { display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px; padding: 8px 12px; border-right:1px solid #b8cce0; }
.service-strip a:last-child { border-right:0; }
.service-symbol { font-size:2.1rem; line-height:1.3; font-weight:300; }
.service-strip strong { font-size:.98rem; }
.service-strip small { color:#486788; font-size:.8rem; line-height:1.4; }
.footer { background: #0a355b; }
@media (max-width: 900px) {
  .service-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .service-strip a:nth-child(3) { border-right:0; }
  .service-strip a:nth-child(-n+3) { border-bottom:1px solid #b8cce0; }
}
@media (max-width: 600px) {
  .bridge-hero { min-height: 520px; background-position: 58% center; }
  .bridge-hero:after { height: 30px; }
  .bridge-hero .hero-content { padding-top: 10px; padding-bottom: 55px; }
  .bridge-hero h1 { font-size: clamp(2.15rem, 10vw, 3rem); }
  .graphic-brand-band { padding-top: 22px; }
  .service-strip { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 12px; }
  .service-strip a { border-bottom:1px solid #b8cce0; }
  .service-strip a:nth-child(odd) { border-right:1px solid #b8cce0; }
  .service-strip a:nth-child(even) { border-right:0; }
  .service-strip a:nth-last-child(-n+2) { border-bottom:0; }
}

/* Full homepage composition matching the supplied reference image */
.home-design { margin:0; color:#0b477d; background:#fff; font-family:Arial,Helvetica,sans-serif; }
.home-header { position:relative; z-index:10; background:#fff; box-shadow:0 1px 0 rgba(8,44,77,.08); }
.home-header-inner { min-height:126px; max-width:1800px; margin:auto; padding:10px 3.8%; display:flex; align-items:center; justify-content:space-between; gap:22px; }
.logo-lockup { display:flex; flex:0 0 285px; flex-direction:column; align-items:center; text-decoration:none; color:#0b477d; line-height:1; }
.roof-logo { width:205px; height:48px; }
.logo-title { font-size:29px; font-weight:800; letter-spacing:.025em; white-space:nowrap; }
.logo-sub { display:flex; align-items:center; gap:9px; margin-top:7px; font-size:12px; font-weight:700; white-space:nowrap; }
.logo-sub i,.big-brand-sub i { display:inline-block; width:27px; height:2px; background:#0b477d; }
.home-nav { display:flex; align-items:center; justify-content:center; gap:clamp(12px,2.1vw,34px); flex:1; }
.home-nav a { color:#152f49; text-decoration:none; font-size:13px; white-space:nowrap; padding:12px 0; border-bottom:2px solid transparent; }
.home-nav a:hover,.home-nav a.active { border-color:#0b477d; color:#0b477d; }
.home-phone { display:flex; align-items:center; gap:12px; flex:0 0 auto; text-decoration:none; color:#0b477d; font-size:19px; white-space:nowrap; }
.home-phone svg { width:28px; height:28px; }
.home-menu-toggle { display:none; }
.reference-hero { min-height:560px; position:relative; display:flex; align-items:center; background-image:url('../images/most-ai-hero.jpg'); background-size:cover; background-position:center 48%; overflow:hidden; }
.reference-hero:after { content:""; position:absolute; left:-1%; right:-1%; bottom:-1px; height:105px; background:#fff; clip-path:polygon(0 0,100% 100%,0 100%); z-index:2; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,31,53,.88) 0%,rgba(3,31,53,.66) 30%,rgba(3,31,53,.04) 63%); }
.reference-hero-content { width:min(100% - 9%,1600px); margin:0 auto; position:relative; z-index:3; padding:30px 0 65px; color:#fff; }
.hero-kicker { font-size:15px; letter-spacing:.31em; margin-bottom:22px; }
.reference-hero h1 { color:#fff; font-size:clamp(40px,4vw,56px); line-height:1.1; letter-spacing:-.025em; margin:0 0 18px; max-width:660px; }
.reference-hero p { color:#f4f7fa; font-size:19px; line-height:1.55; margin:0 0 25px; }
.hero-cta { display:inline-flex; align-items:center; gap:16px; padding:16px 28px; border:1px solid #2193e2; background:#0b477d; color:#fff; text-decoration:none; font-size:18px; border-radius:3px; }
.hero-cta:hover { background:#12619f; }
.hero-cta span { font-size:24px; }
.big-brand { text-align:center; padding:0 15px 16px; position:relative; margin-top:-4px; color:#0b477d; }
.big-roof { display:block; width:270px; max-width:42vw; height:54px; margin:0 auto 0; }
.big-brand-title { font-size:clamp(40px,5vw,64px); line-height:1.04; font-weight:850; letter-spacing:-.04em; }
.big-brand-sub { display:flex; justify-content:center; align-items:center; gap:20px; margin-top:4px; font-size:clamp(17px,2vw,28px); line-height:1.15; font-weight:800; }
.big-brand-sub i { width:58px; }
.home-services { max-width:1740px; margin:auto; padding:22px 3.5% 20px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); background:#fff; }
.home-services a { display:flex; flex-direction:column; align-items:center; text-align:center; padding:0 12px; color:#0b477d; text-decoration:none; border-right:1px solid #b3c8db; min-width:0; }
.home-services a:last-child { border-right:0; }
.home-services a:hover strong { text-decoration:underline; }
.home-services svg { width:76px; height:54px; margin-bottom:4px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.home-services strong { font-size:16px; margin-bottom:5px; }
.home-services small { color:#3f5e7c; font-size:14px; line-height:1.35; }
.home-footer { min-height:74px; padding:15px 4%; background:#0b355a; color:#eaf3fb; display:flex; align-items:center; gap:38px; position:relative; overflow:hidden; }
.footer-location { display:flex; align-items:center; gap:10px; font-size:16px; white-space:nowrap; }
.footer-location svg { width:22px; height:22px; }
.footer-divider { width:1px; height:31px; background:#8da9c0; }
.footer-values { color:#c8d8e7; font-style:italic; display:flex; gap:20px; font-size:14px; }
.footer-values b { font-style:normal; color:#fff; }
.footer-roof { width:145px; height:42px; margin-left:auto; color:#0e568d; }
@media(max-width:1250px) {
 .home-header-inner { gap:14px; padding-left:2.2%; padding-right:2.2%; }
 .logo-lockup { flex-basis:225px; }
 .roof-logo { width:175px; }
 .logo-title { font-size:24px; }
 .logo-sub { font-size:10px; gap:6px; }
 .home-nav { gap:12px; }
 .home-nav a { font-size:12px; }
 .home-phone { font-size:16px; gap:7px; }
 .home-phone svg { width:23px; }
}
@media(max-width:980px) {
 .home-header-inner { min-height:96px; flex-wrap:wrap; }
 .logo-lockup { flex-basis:220px; align-items:flex-start; }
 .roof-logo { width:150px; height:34px; }
 .logo-title { font-size:22px; }
 .logo-sub { font-size:9px; }
 .home-menu-toggle { display:block; margin-left:auto; order:3; background:#fff; border:1px solid #c7d6e4; color:#0b477d; border-radius:4px; font-size:24px; padding:6px 11px; }
 .home-phone { margin-left:auto; }
 .home-nav { display:none; order:4; width:100%; flex-basis:100%; flex-direction:column; align-items:stretch; gap:0; padding:6px 0 12px; }
 .home-nav.open,.home-nav.active { display:flex; }
 .home-nav a { padding:11px 8px; border-bottom:1px solid #e0e8ef; }
 .reference-hero { min-height:500px; }
 .home-services { grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:18px; }
 .home-services a:nth-child(3) { border-right:0; }
 .home-services a:nth-child(-n+3) { padding-bottom:16px; border-bottom:1px solid #b3c8db; }
}
@media(max-width:600px) {
 .home-header-inner { padding:10px 16px; min-height:86px; gap:8px; }
 .logo-lockup { flex-basis:165px; }
 .roof-logo { width:115px; height:27px; }
 .logo-title { font-size:18px; }
 .logo-sub { font-size:7px; gap:4px; margin-top:5px; }
 .logo-sub i { width:12px; }
 .home-phone { font-size:0; gap:0; margin-left:auto; }
 .home-phone svg { width:24px; height:24px; }
 .home-menu-toggle { font-size:21px; padding:4px 8px; }
 .reference-hero { min-height:500px; background-position:58% center; }
 .reference-hero:after { height:45px; }
 .hero-shade { background:linear-gradient(90deg,rgba(3,31,53,.83),rgba(3,31,53,.48) 72%,rgba(3,31,53,.18)); }
 .reference-hero-content { width:calc(100% - 36px); padding:12px 0 55px; }
 .hero-kicker { font-size:11px; letter-spacing:.22em; margin-bottom:18px; }
 .reference-hero h1 { font-size:clamp(33px,9vw,44px); }
 .reference-hero p { font-size:16px; }
 .desktop-only { display:none; }
 .hero-cta { padding:13px 20px; font-size:16px; }
 .big-roof { height:40px; width:190px; }
 .big-brand-title { font-size:38px; }
 .big-brand-sub { font-size:14px; gap:8px; }
 .big-brand-sub i { width:18px; }
 .home-services { padding:18px 8px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; }
 .home-services a { padding:13px 5px 16px; }
 .home-services a:nth-child(odd) { border-right:1px solid #b3c8db; }
 .home-services a:nth-child(even) { border-right:0; }
 .home-services a:nth-child(-n+4) { border-bottom:1px solid #b3c8db; }
 .home-services a:nth-child(3) { border-right:1px solid #b3c8db; }
 .home-services svg { width:60px; height:44px; }
 .home-services strong { font-size:14px; }
 .home-services small { font-size:12px; }
 .home-footer { gap:10px; flex-wrap:wrap; padding:15px 16px; }
 .footer-location { font-size:13px; }
 .footer-divider { height:24px; }
 .footer-values { gap:8px; font-size:11px; }
 .footer-roof { display:none; }
}

/* Jednotné logo podle titulní stránky – používá se v hlavičce i patičce všech podstránek */
.brand-lockup {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:0; flex-shrink:0; width:250px; min-width:210px; text-decoration:none;
  color:#0b477d; line-height:1.05; padding:4px 0;
}
.brand-lockup .brand-roof { display:block; width: min(100%, 205px); height:auto; margin-bottom:-2px; }
.brand-lockup .brand-title { font-size:1.55rem; font-weight:800; letter-spacing:.015em; white-space:nowrap; }
.brand-lockup .brand-sub { display:flex; align-items:center; gap:8px; font-size:.66rem; font-weight:700; white-space:nowrap; margin-top:3px; }
.brand-lockup .brand-sub i { display:block; width:17px; height:1.5px; background:#0b477d; }
.brand-footer.brand-lockup, .footer .brand-lockup { align-items:flex-start; width:240px; min-width:0; }
.brand-footer.brand-lockup .brand-roof, .footer .brand-lockup .brand-roof { width:165px; }
.brand-footer.brand-lockup .brand-title, .footer .brand-lockup .brand-title { font-size:1.3rem; }
.brand-footer.brand-lockup .brand-sub, .footer .brand-lockup .brand-sub { font-size:.56rem; gap:5px; }
.brand-footer.brand-lockup .brand-sub i, .footer .brand-lockup .brand-sub i { width:10px; }
@media(max-width:1100px) {
 .brand-lockup { width:205px; min-width:175px; }
 .brand-lockup .brand-title { font-size:1.25rem; }
 .brand-lockup .brand-sub { font-size:.53rem; gap:5px; }
 .brand-lockup .brand-roof { width:165px; }
}
@media(max-width:700px) {
 .brand-lockup { width:190px; min-width:160px; }
 .brand-lockup .brand-title { font-size:1.1rem; }
 .brand-lockup .brand-sub { font-size:.47rem; }
 .brand-lockup .brand-roof { width:145px; }
}

/* Jednotná plovoucí horní lišta na všech stránkách */
.home-header { position:fixed; top:0; left:0; right:0; z-index:1000; background:#fff; border-bottom:1px solid #e2e9ef; box-shadow:0 2px 12px rgba(5,35,61,.06); }
.home-header-inner { width:min(100% - 44px, 1500px); min-height:112px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.home-nav { display:flex; align-items:center; justify-content:center; gap:clamp(12px,1.45vw,26px); flex:1; }
.home-nav a { color:#153b60; text-decoration:none; font-size:14px; white-space:nowrap; padding:12px 0 10px; border-bottom:2px solid transparent; }
.home-nav a:hover, .home-nav a.active { color:#0b477d; border-bottom-color:#0b477d; }
.home-phone { display:flex; align-items:center; gap:12px; color:#0b477d; text-decoration:none; white-space:nowrap; font-size:18px; }
.home-phone svg { width:27px; height:27px; }
.home-menu-toggle { display:none; border:0; background:transparent; color:#0b477d; font-size:28px; cursor:pointer; }
@media(max-width:1150px) {
 .home-header-inner { gap:14px; width:calc(100% - 30px); }
 .home-nav { gap:10px; }
 .home-nav a { font-size:12px; }
 .brand-lockup { width:205px; min-width:185px; }
 .home-phone { font-size:15px; gap:7px; }
}
@media(max-width:900px) {
 .home-header-inner { min-height:88px; flex-wrap:wrap; padding:8px 0; }
 .home-menu-toggle { display:block; order:3; margin-left:auto; }
 .home-phone { margin-left:auto; order:2; }
 .home-nav { display:none; order:4; flex:0 0 100%; width:100%; align-items:stretch; flex-direction:column; gap:0; padding:8px 0 12px; }
 .home-nav.open { display:flex; }
 .home-nav a { font-size:15px; padding:11px 8px; border-bottom:1px solid #e5edf4; }
}
@media(max-width:520px) {
 .home-header-inner { width:calc(100% - 22px); gap:8px; }
 .brand-lockup { width:168px; min-width:150px; }
 .brand-lockup .brand-roof { width:125px; }
 .brand-lockup .brand-title { font-size:1.03rem; }
 .brand-lockup .brand-sub { font-size:.43rem; gap:4px; }
 .brand-lockup .brand-sub i { width:9px; }
 .home-phone { font-size:13px; gap:5px; }
 .home-phone svg { width:21px; height:21px; }
}

/* Rozšířené informační bloky na titulní stránce */
.home-detail-section { background:#fff; color:#173c60; }
.home-detail-section .section-heading h2, .home-detail-cta h2 { color:#0b477d; }
.home-detail-section .eyebrow, .home-detail-cta .eyebrow { color:#3976a8; }
.home-detail-section .card { border:1px solid #e0e8ef; box-shadow:0 8px 28px rgba(9,43,72,.08); }
.home-detail-section .card h3 { color:#0b477d; }
.home-detail-section .text-link { color:#0b477d; font-weight:700; text-decoration:none; }
.home-detail-dark { background:#0a355b; color:#fff; }
.home-detail-dark .split p { color:#e0eaf2; }
.home-detail-dark .check-list li::marker { color:#a9d0ef; }
.home-detail-dark .button-light { background:#fff; color:#0b477d; border-color:#fff; }
.home-detail-dark .split-image { object-fit:cover; }
.home-detail-cta { background:#f1f6fa; color:#173c60; }
.home-detail-cta .button { background:#0b477d; color:#fff; border-color:#0b477d; }
@media(max-width:760px) { .home-detail-section, .home-detail-dark, .home-detail-cta { padding:52px 0; } }


/* Titulní stránka: navigace trvale dostupná na spodním okraji */
.bottom-dock {
  position:fixed; z-index:1000; left:0; right:0; bottom:0;
  min-height:70px; display:flex; align-items:stretch; justify-content:center;
  gap:0; padding:7px max(10px, calc((100vw - 1400px)/2));
  background:rgba(8,48,82,.97); color:#fff;
  box-shadow:0 -5px 22px rgba(5,28,48,.18);
  border-top:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
}
.bottom-dock a {
  color:#fff; text-decoration:none; display:flex; flex:1 1 0; min-width:0;
  flex-direction:column; align-items:center; justify-content:center; gap:2px;
  border-radius:8px; transition:background .18s ease; padding:4px 6px;
}
.bottom-dock a:hover, .bottom-dock a:focus-visible { background:rgba(255,255,255,.13); outline:none; }
.bottom-dock a > span { font-size:23px; line-height:1.1; font-weight:400; }
.bottom-dock small { font-size:12px; white-space:nowrap; }
.bottom-dock .dock-contact { background:#1262a0; }
body:has(.bottom-dock) { padding-bottom:78px; }
.graphic-brand-band { will-change:opacity,transform; transition:opacity .08s linear; }
@media(max-width:760px) {
 .bottom-dock { justify-content:flex-start; overflow-x:auto; padding:6px 8px; min-height:66px; }
 .bottom-dock a { flex:0 0 76px; }
 .bottom-dock small { font-size:10px; }
 .bottom-dock a > span { font-size:21px; }
 body:has(.bottom-dock) { padding-bottom:72px; }
}
@media(prefers-reduced-motion:reduce) {
 .bottom-dock a, .graphic-brand-band { transition:none; }
}

/* Spodní navigace přebírá grafiku ikon ze sekce služeb na titulní stránce */
.bottom-dock { background:#fff; color:#0b477d; border-top:1px solid #d9e4ee; box-shadow:0 -5px 22px rgba(5,28,48,.10); padding:10px max(10px, calc((100vw - 1400px)/2)); min-height:96px; }
.bottom-dock a { color:#0b477d; border-radius:8px; gap:4px; padding:5px 8px; }
.bottom-dock a:hover, .bottom-dock a:focus-visible { background:#edf4f9; }
.bottom-dock a svg { display:block; width:45px; height:32px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.bottom-dock a strong { font-size:13px; font-weight:700; white-space:nowrap; }
.bottom-dock .dock-contact { background:#0b477d; color:#fff; }
.bottom-dock .dock-contact:hover { background:#145b94; }
.bottom-dock .dock-home { background:#f1f6fa; }
body:has(.bottom-dock) { padding-bottom:104px; }
@media(max-width:760px) {
 .bottom-dock { min-height:78px; padding:5px 7px; }
 .bottom-dock a { flex:0 0 82px; }
 .bottom-dock a svg { width:37px; height:27px; }
 .bottom-dock a strong { font-size:11px; }
 body:has(.bottom-dock) { padding-bottom:84px; }
}


/* Plovoucí horní lišta a prostor pro ni na všech stránkách */
.home-header { position:fixed; top:0; left:0; right:0; z-index:1000; }
body { padding-top:112px; }
body.home-design { padding-top:112px; }
.intro-stage { position:sticky; top:112px; z-index:1; will-change:opacity,transform; transition:opacity .12s linear; }
.intro-stage .reference-hero { margin-top:0; }
.intro-stage .big-brand { margin-bottom:0; }
.home-design main > section:not(.intro-stage) { position:relative; z-index:2; background-color:#fff; }
/* Keep the dark feature section dark: the general homepage section rule must not wash it out. */
.home-design main > section.home-detail-dark { background-color:#0a355b; color:#fff; }
.home-design main > section.home-detail-dark h2 { color:#fff; }
.home-design main > section.home-detail-dark p,
.home-design main > section.home-detail-dark .check-list li { color:#f0f6fb; }
.home-design main > section.home-detail-dark .eyebrow { color:#c7e6ff; }
@media(max-width:900px) {
 body.home-design { padding-top:88px; }
 .intro-stage { top:88px; }
}
@media(max-width:760px) {
 .intro-stage { position:relative; top:auto; }
 .home-design main > section:not(.intro-stage) { z-index:auto; }
}

/* Úvodní značka: držet ji přibližně jeden řádek nad spodní navigací.
   Na kratších obrazovkách může transparentně překrýt spodní část hero fotografie. */
@media (min-width: 761px) {
  .intro-stage {
    height: calc(100vh - 112px - 110px);
    min-height: 590px;
    position: sticky;
    top: 112px;
  }
  .intro-stage .reference-hero {
    height: calc(100% - 116px);
    min-height: 0;
  }
  .intro-stage .big-brand {
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    bottom: 2px;
    margin: 0;
    padding: 0 15px 2px;
    background: transparent;
    pointer-events: none;
  }
  .intro-stage .big-roof { height: 38px; width: 205px; }
  .intro-stage .big-brand-title { font-size: clamp(34px, 3.8vw, 48px); }
  .intro-stage .big-brand-sub { font-size: clamp(14px, 1.45vw, 20px); }
  .intro-stage .big-brand-sub i { width: 36px; }
}
@media (max-height: 850px) and (min-width: 761px) {
  .intro-stage { height: calc(100vh - 112px - 100px); min-height: 0; }
  .intro-stage .reference-hero { height: calc(100% - 100px); }
  .intro-stage .big-brand { bottom: 2px; }
  .intro-stage .big-roof { height: 32px; width: 175px; }
  .intro-stage .big-brand-title { font-size: clamp(30px, 3.3vw, 40px); }
  .intro-stage .big-brand-sub { font-size: clamp(12px, 1.3vw, 17px); margin-top: 2px; }
}

/* Jemný světlý opar pod značkou, aby zůstala čitelná i při překrytí fotografie */
@media (min-width: 761px) {
  .intro-stage .big-brand {
    isolation: isolate;
    padding: 14px 15px 12px;
    text-shadow: 0 1px 0 rgba(255,255,255,.92), 0 2px 12px rgba(255,255,255,.55);
  }
  .intro-stage .big-brand::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 50%;
    top: 50%;
    width: min(100%, 920px);
    height: calc(100% + 42px);
    transform: translate(-50%, -50%);
    background: radial-gradient(ellipse at center, rgba(255,255,255,.94) 0%, rgba(255,255,255,.82) 42%, rgba(255,255,255,.48) 68%, rgba(255,255,255,0) 100%);
    filter: blur(8px);
    border-radius: 50%;
    pointer-events: none;
  }
  .intro-stage .big-brand-title { color: #073b68; }
  .intro-stage .big-brand-sub { color: #0b477d; }
  .intro-stage .big-roof { filter: drop-shadow(0 1px 2px rgba(255,255,255,.85)); }
}
@media (max-height: 850px) and (min-width: 761px) {
  .intro-stage .big-brand { padding-top: 10px; padding-bottom: 8px; }
  .intro-stage .big-brand::before { height: calc(100% + 34px); }
}


/* Lepší čitelnost spodního logotypu a jemná výzva k posunutí stránky */
.scroll-cue {
  position:absolute; z-index:5; left:50%; bottom:24px; transform:translateX(-50%);
  display:flex; align-items:center; gap:10px; padding:8px 14px;
  color:#fff; background:rgba(4,35,61,.74); border:1px solid rgba(255,255,255,.55);
  border-radius:999px; text-decoration:none; font-size:13px; font-weight:700; letter-spacing:.04em;
  box-shadow:0 3px 14px rgba(0,0,0,.16); backdrop-filter:blur(5px);
  animation:scrollCueFloat 2.2s ease-in-out infinite;
}
.scroll-cue b { font-size:20px; line-height:1; font-weight:500; }
.scroll-cue:hover, .scroll-cue:focus-visible { background:rgba(4,35,61,.92); outline:2px solid #fff; outline-offset:3px; }
@keyframes scrollCueFloat { 0%,100% { transform:translate(-50%,0); } 50% { transform:translate(-50%,4px); } }
@media(max-width:760px) { .scroll-cue { bottom:18px; font-size:12px; padding:7px 12px; } }
@media(prefers-reduced-motion:reduce) { .scroll-cue { animation:none; } }

/* Spodní značka má vždy dostatečný kontrast i nad světlou fotografií. */
.intro-stage .big-brand-title { color:#06365f; text-shadow:0 1px 0 #fff, 0 2px 9px rgba(255,255,255,.92); }
.intro-stage .big-brand-sub { color:#073b68; text-shadow:0 1px 0 rgba(255,255,255,.98), 0 1px 7px rgba(255,255,255,.9); }
.intro-stage .big-brand-sub i { background:#073b68; box-shadow:0 0 0 2px rgba(255,255,255,.35); }
.bottom-dock a strong { color:#073b68; text-shadow:none; }
.bottom-dock .dock-contact strong { color:#fff; }


/* Jemně výraznější modré texty a výzva ke scrollování v bílém prostoru nad spodní lištou */
.home-detail-section { color:#123d62; }
.home-detail-section .section-heading h2,
.home-detail-section .card h3,
.home-detail-section .text-link,
.home-detail-cta h2 { color:#064b82; }
.home-detail-section .eyebrow,
.home-detail-cta .eyebrow { color:#1d659e; }
.home-detail-section .section-heading p,
.home-detail-section .card p { color:#294f70; }
.home-detail-dark h2 { color:#fff; text-shadow:0 1px 0 rgba(0,0,0,.12); }
.home-detail-dark .split p,
.home-detail-dark .check-list li { color:#f0f6fb; }
.home-detail-dark .eyebrow { color:#c7e6ff; }
@media (min-width:761px) {
  .intro-stage > .scroll-cue {
    left:auto; right:clamp(18px, 3.2vw, 58px); bottom:12px;
    transform:none;
    color:#064b82; background:rgba(255,255,255,.94);
    border:1px solid rgba(11,71,125,.22);
    box-shadow:0 3px 16px rgba(5,35,60,.10);
    backdrop-filter:blur(6px);
  }
  .intro-stage > .scroll-cue:hover,
  .intro-stage > .scroll-cue:focus-visible { background:#fff; outline-color:#0b477d; }
}
@media (max-width:760px) {
  .intro-stage > .scroll-cue { left:50%; bottom:18px; transform:translateX(-50%); }
}
@media(prefers-reduced-motion:reduce) { .intro-stage > .scroll-cue { animation:none; } }


/* Podstránky: hero plynule ustupuje při scrollování, bez spodní navigace a velkého loga. */
.page-hero-fade { will-change: opacity, transform; transform-origin: top center; }
@media (max-width:900px) { body { padding-top:88px; } body.home-design { padding-top:88px; } }
@media (max-width:520px) { body { padding-top:86px; } body.home-design { padding-top:86px; } }


/* Podstránky: hero zůstává při scrollování pod horní hlavičkou a obsah jej postupně překrývá. */
main > .page-hero-fade {
  position: sticky;
  top: 112px;
  z-index: 1;
  will-change: opacity, transform;
  transform-origin: top center;
}
main > section:not(.page-hero-fade) {
  position: relative;
  z-index: 2;
  background-color: #fff;
}
main > section.section-soft:not(.page-hero-fade) { background-color: var(--cream); }
main > section.section-dark:not(.page-hero-fade) { background-color: var(--dark); color: #fff; }
@media (max-width: 900px) { main > .page-hero-fade { top: 88px; } }
@media (max-width: 520px) { main > .page-hero-fade { top: 86px; } }
@media (prefers-reduced-motion: reduce) { main > .page-hero-fade { position: relative; top: auto; } }


/* Přesné zaměření a validace projektu – sdílený blok na stránkách konstrukcí */
.precision-section { position: relative; }
.precision-section .section-heading { max-width: 850px; }
.precision-section .section-heading h2 { color: var(--blue, #0b477d); }
.precision-cards .card { border: 1px solid #d9e5ef; box-shadow: 0 10px 28px rgba(9,43,72,.07); }
.precision-cards .card-content { padding-top: 24px; }
.precision-number { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin-bottom: 12px; border-radius: 50%; background: #e5f0f8; color: #0b477d; font-weight: 800; letter-spacing: .04em; }
.precision-cards h3 { color: #0b477d; }
.precision-cards p { color: #42566a; }

/* Jednotná barevnost a čitelnost napříč všemi stránkami */
:root {
  --green: #0b477d;
  --dark: #092447;
  --lime: #d9eaff;
  --cream: #f2f7fc;
  --text: #172b45;
  --muted: #526a82;
  --border: #d7e3ee;
}

body { color: var(--text); background: #fff; }
p { color: #526a82; }
.section-heading h2,
.section h2,
.split h2,
.card h3 { color: #064b82; }
.eyebrow { color: #1d659e; }
.section-soft { background: #f2f7fc; }
.section-soft p,
.section:not(.section-dark) .split p,
.section:not(.section-dark) .section-heading p,
.section:not(.section-dark) .card p { color: #294f70; }
/* Na světlém pozadí nesmí být běžný text nastavený na světlou barvu. */
.split p { color: #294f70; }
.section-dark,
.home-detail-dark { background: #092f52; color: #fff; }
.section-dark h2,
.section-dark h3,
.section-dark .section-heading h2,
.home-detail-dark h2,
.home-detail-dark h3 { color: #fff; }
.section-dark p,
.section-dark .split p,
.section-dark .section-heading p,
.section-dark .card p,
.home-detail-dark p,
.home-detail-dark .check-list li { color: #e5eef7; }
.section-dark .eyebrow,
.home-detail-dark .eyebrow { color: #c7e6ff; }
.card { border-color: #d7e3ee; }
.card h3 { color: #064b82; }
.card p { color: #294f70; }
.button { background: #0b477d; border-color: #0b477d; color: #fff; }
.button:hover { background: #08365f; border-color: #08365f; }
.button-outline { color: #fff; border-color: rgba(255,255,255,.78); background: transparent; }
.button-light { color: #08365f; background: #fff; border-color: #fff; }
.home-nav a { color: #173d60; }
.home-nav a:hover, .home-nav a.active { color: #064b82; border-bottom-color: #064b82; }
.home-phone { color: #064b82; }
.footer { background: #092f52; }
.footer p, .footer a { color: #d8e5f0; }
.footer a:hover { color: #fff; }
.precision-section .section-heading h2,
.precision-cards h3 { color: #064b82; }
.precision-cards p { color: #294f70; }
.bottom-dock a strong { color: #073b68; }
.bottom-dock .dock-contact strong { color: #fff; }
@media (max-width: 760px) {
  .section:not(.section-dark) .section-heading p,
  .section:not(.section-dark) .split p,
  .section:not(.section-dark) .card p { color: #294f70; }
}