
:root{
  --bg:#f8fafc; --card:#ffffff; --text:#1f2937; --muted:#6b7280; --accent:#8b5e34; --border:#e5e7eb;
  --radius:18px; --shadow:0 10px 28px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg)}
h1,h2,h3{margin:0 0 .8rem}
h1{font-size:clamp(2rem,4vw,3rem)} h2{font-size:clamp(1.5rem,2.4vw,2rem)}
p{margin:.4rem 0 1rem;line-height:1.65}
a{color:#0ea5e9;text-decoration:none}
.container{width:min(1120px,92%);margin:0 auto}
.section{padding:64px 0}
.section.alt{background:#fbfbfb}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
.eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.lead{font-size:1.1rem}
.muted{color:var(--muted)} .small{font-size:.9rem}

.site-header{position:sticky;top:0;z-index:90;background:#fff;border-bottom:1px solid var(--border)}
.nav{display:flex;justify-content:space-between;align-items:center;padding:12px 0;gap:16px}
.brand{font-weight:900;color:#111}
.menu{display:flex;gap:18px;align-items:center}
.menu a{color:#111;padding:8px 10px;border-radius:10px}
.menu a:hover{background:#f3f4f6}
.nav-toggle{display:none;background:#fff;border:1px solid var(--border);border-radius:12px;padding:8px 10px}
.nav-toggle .bar{display:block;width:22px;height:2px;background:#111;margin:4px 0}

@media(max-width:900px){
  .menu{position:fixed; top:60px; left:0; right:0; background:#fff; padding:20px; display:block; border-top:1px solid var(--border)}
  .menu[hidden]{display:none}
  .nav-toggle{display:block}
}

.hero .hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center}
.hero-photo .hero-placeholder{background:#e5e7eb;border:1px dashed #cbd5e1;color:#475569;padding:18px;border-radius:16px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;border:1px solid var(--accent);background:var(--accent);color:#fff;font-weight:700;box-shadow:var(--shadow)}
.btn.ghost{background:#fff;color:var(--accent)}
@media(max-width:900px){.hero .hero-grid{grid-template-columns:1fr}}

.two-cols{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:center}
.stack-photos img{width:100%;border-radius:14px;box-shadow:var(--shadow);margin-bottom:10px;aspect-ratio:4/3;object-fit:cover}
.img-placeholder{background:#f1f5f9;border:1px dashed #cbd5e1;color:#475569;padding:18px;border-radius:14px}

.points{padding-left:1rem}
.points li{margin:.3rem 0}

.grid.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.grid.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;box-shadow:var(--shadow)}
@media(max-width:1100px){.grid.gallery{grid-template-columns:repeat(3,1fr)}}
@media(max-width:740px){.grid.gallery{grid-template-columns:repeat(2,1fr)}}

.reviews{display:grid;gap:14px;margin-top:10px}
.reviews blockquote{background:#fff;border-left:4px solid var(--accent);padding:14px 18px;border-radius:12px;box-shadow:var(--shadow);margin:0;font-style:italic}
.reviews cite{display:block;margin-top:6px;color:#444;font-style:normal}

.contact .form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:10px}
.contact .form-grid .full{grid-column:1/-1}
input,textarea,select{width:100%;padding:11px;border:1px solid var(--border);border-radius:10px;font:inherit;background:#fff}
button.btn{cursor:pointer}

.site-footer{background:#111;color:#e5e7eb;text-align:center;padding:24px 0;margin-top:32px}


.hero {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  
  color: white;
  display: flex;
  align-items: center;
}

.hero-overlay {
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4); /* tmavý filtr pro čitelnost textu */
  display: flex;
  align-items: center;
}

.hero .container {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

/* ===== Logo v hlavičce ===== */
.site-header .logo{
  height:48px; width:auto; display:block;
}
@media (max-width:768px){
  .site-header .logo{ height:38px; }
}

/* ===== Hero sekce (celá šířka, dominantní text) ===== */
.hero{
  position:relative;
  color:#fff;
  min-
  display:flex;
  align-items:center;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.hero-overlay{
  width:100%; height:100%;
  background:rgba(0,0,0,.45); /* tmavý filtr pro čitelnost */
  display:flex; align-items:center; justify-content:center;
}
.hero-text-wide{
  width:100%;
  max-width:1200px;           /* rozumné maximum, ne .container */
  padding:0 5%;
  text-align:center;
}
.hero-text-wide h1{
  font-size:clamp(2.6rem, 6vw, 4rem);
  font-weight:700;
  margin:.4rem 0 1rem;
}
.hero-text-wide .lead{
  font-size:clamp(1.1rem, 2.2vw, 1.6rem);
  margin-bottom:1.4rem;
}

/* ===== CTA tlačítka uprostřed + efekty ===== */
.cta-row.center{
  display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-top:1rem;
}
.btn{
  display:inline-block; padding:12px 24px; border-radius:12px;
  font-weight:600; text-decoration:none; transition:all .25s ease;
}
.btn.primary{
  background:#8b5e34; color:#fff; border:2px solid #8b5e34;
}
.btn.ghost{
  background:transparent; color:#fff; border:2px solid #fff;
}
.btn.primary:hover{
  background:#a06b3d; transform:scale(1.05);
  box-shadow:0 6px 16px rgba(0,0,0,.25);
}
.btn.ghost:hover{
  background:rgba(255,255,255,.1); transform:scale(1.05);
  box-shadow:0 6px 16px rgba(0,0,0,.25);
}

/* ===== Mobil: tlačítka přes celou šířku (příjemnější na palec) ===== */
@media (max-width:600px){
  .cta-row.center{ flex-direction:column; align-items:center; width:100%; }
  .cta-row.center .btn{ width:100%; max-width:320px; text-align:center; }
}
/* spacing tweak */
@media (max-width: 700px){ .section{ padding:48px 0 } }


/* ==== Hezčí formulář ==== */
.contact .card h2{ margin-bottom:.4rem }
.contact .contact-info{ margin:8px 0 18px }
.contact .contact-list{ list-style:none; padding:0; margin:0; display:flex; gap:18px; flex-wrap:wrap }
.contact .contact-list a{ color:#0ea5e9; text-decoration:none }
.contact .contact-list a:hover{ text-decoration:underline }

.contact .form-grid{ grid-template-columns:repeat(2,1fr); gap:14px; }
.contact label{ font-weight:600; color:#374151; display:block }
.contact input, .contact textarea, .contact select{
  margin-top:6px; padding:12px 14px; border-radius:12px; border:1px solid var(--border);
  background:#fff; transition:border-color .2s, box-shadow .2s;
}
.contact input:focus, .contact textarea:focus, .contact select:focus{
  outline:none; border-color:#8b5e34; box-shadow:0 0 0 3px rgba(139,94,52,.15);
}
.contact button.btn.primary{ padding:14px 22px; font-weight:700 }

@media (max-width: 740px){
  .contact .form-grid{ grid-template-columns:1fr }
}


/* === Mobile menu slide-down (minimal patch) === */
@media (max-width: 900px){
  /* default state (closed) */
  #menu{
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .28s ease, opacity .28s ease;
  }
  body.nav-open #menu{
    max-height: 420px; /* enough for all links */
    opacity: 1;
  }

  /* backdrop visibility */
  
  body.nav-open 

  /* touch-friendly links */
  #menu a{ display:block; padding:12px 6px; border-bottom:1px solid #eee; }
  #menu a:last-child{ border-bottom:0; }

  /* keep toggle clickable above layers */
  .nav-toggle{ position:relative; z-index:260; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
}

/* Backdrop default hidden */

body.nav-open 

/* Backdrop default hidden */
.backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .28s ease;z-index:150}
body.nav-open .backdrop{opacity:1;pointer-events:auto}

/* Mobile slide-down menu (restored) */
@media (max-width: 900px){
  #menu{
    max-height:0; overflow:hidden; opacity:0;
    transition:max-height .3s ease, opacity .3s ease;
  }
  body.nav-open #menu{ max-height:420px; opacity:1; }
  #menu a{ display:block; padding:12px 6px; border-bottom:1px solid #eee; }
  #menu a:last-child{ border-bottom:0; }
  .nav-toggle{ position:relative; z-index:260; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
}
