:root{
  --brand:#007a80;
  --brand-2:#009ba4;
  --accent:#E3B23C;
  --ink:#333333;
  --bg:#fafaf7;
  --bg-2:#f1efe9;
  --radius-lg:24px;
  --radius-md:18px;
}
html{scroll-behavior:smooth}
body{
  font-family:'Outfit',system-ui,sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-size:1rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.container-x{ width:90%; margin-inline:auto; max-width:1400px; }
@media (min-width:768px){ .container-x{ width:85%; } }
#site-header .container-x{ width:calc(100% - 20px); }
@media (min-width:768px){ #site-header .container-x{ width:87%; max-width:1500px; } }
@media (max-width:767px){ #site-header .container-x{ margin-top:8px; } }
/* zabraň horizontálnímu scrollu na mobilu (clip nezruší position:sticky) */
@media (max-width:767px){ html{ overflow-x:clip; } body{ overflow-x:clip; } }
.prose-w{ max-width:70ch; }

body h1, body h2, body h3, body h4{ font-family:'Outfit',sans-serif !important; color:#0f1a1c; letter-spacing:-.035em; line-height:1.02; font-weight:800 !important; }
body h1{ font-size:clamp(2.25rem, 5.2vw, 4.75rem) !important; line-height:.98 !important; font-weight:800 !important; }
body h2{ font-size:clamp(1.85rem, 3.8vw, 3.25rem) !important; line-height:1 !important; font-weight:800 !important; }
body h3{ font-size:clamp(1.3rem, 2vw, 1.7rem) !important; line-height:1.15 !important; letter-spacing:-.025em; font-weight:700 !important; }
body h4{ font-size:clamp(1.1rem, 1.5vw, 1.3rem) !important; line-height:1.2 !important; letter-spacing:-.02em; font-weight:700 !important; }
p{ line-height:1.7; }

.gradient-text{
  background:linear-gradient(135deg,#007a80 0%,#009ba4 60%,#33b8c2 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.bg-gradient-brand{ background:linear-gradient(135deg,#007a80 0%,#009ba4 100%); }
.bg-gradient-dark{ background:linear-gradient(135deg,#0d2528 0%,#103a3e 50%,#0a4548 100%); }
.bg-mesh{
  background:
    radial-gradient(1100px 600px at 8% -10%, rgba(0,155,164,.18), transparent 60%),
    radial-gradient(900px 500px at 100% 10%, rgba(227,178,60,.16), transparent 55%),
    radial-gradient(700px 400px at 50% 110%, rgba(0,122,128,.14), transparent 60%),
    var(--bg);
}
.glass{
  background:rgba(255,255,255,.8);
  backdrop-filter:blur(8px) saturate(1.05);
  -webkit-backdrop-filter:blur(8px) saturate(1.05);
  border:1px solid rgba(255,255,255,.7);
}
.glass-dark{
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.15);
}

.btn{ display:inline-flex; align-items:center; gap:.55rem; padding:.95rem 1.5rem; border-radius:999px; font-weight:600; transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease; will-change:transform; font-size:1rem; }
.btn-primary{ background:var(--brand); color:#fff; box-shadow:0 8px 24px -8px rgba(0,122,128,.55); }
.btn-primary:hover{ background:var(--brand-2); transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(0,155,164,.6); }
.btn-ghost{ background:rgba(255,255,255,.7); color:var(--brand); border:1px solid rgba(0,122,128,.18); backdrop-filter:blur(8px); }
.btn-ghost:hover{ background:#fff; transform:translateY(-2px); }
.btn-outline-light{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.4); }
.btn-outline-light:hover{ background:rgba(255,255,255,.1); transform:translateY(-2px); }
.btn-accent{ background:var(--accent); color:#1a2326; box-shadow:0 8px 24px -8px rgba(227,178,60,.55); }
.btn-accent:hover{ filter:brightness(1.05); transform:translateY(-2px); }

.card{ border-radius:var(--radius-lg); transition:transform .35s ease, box-shadow .35s ease; }
.card-hover:hover{ transform:translateY(-4px); box-shadow:0 24px 60px -28px rgba(0,0,0,.22); }

.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease; }
.reveal.in{ opacity:1; transform:none; }

.nav-link{ position:relative; padding:.5rem 0; font-weight:500; color:#1a2326; }
.nav-link::after{ content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--brand); transition:width .25s ease; border-radius:2px; }
.nav-link:hover::after,.nav-link.active::after{ width:100%; }

.mobile-menu{ transform:translateX(100%); transition:transform .35s ease; }
.mobile-menu.open{ transform:translateX(0); }
#mobileMenu{ overflow-y:auto; overscroll-behavior:contain; }
#mobileMenu .btn{ font-size:.8rem !important; padding:.75rem 1.2rem !important; }
@media(max-width:1023px){ #site-header .btn{ display:none !important; } }

.has-dd:hover .dd{ opacity:1; visibility:visible; transform:translateY(0); }
.dd{ opacity:0; visibility:hidden; transform:translateY(8px); transition:all .2s ease; }
.dd .glass{ background:rgba(255,255,255,.96); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }

.footer-link{ color:#cfe3e5; transition:color .2s; }
.footer-link:hover{ color:#fff; }

.img-cover{ width:100%; height:100%; object-fit:cover; display:block; }
.img-frame{ overflow:hidden; border-radius:var(--radius-lg); position:relative; }
.img-frame::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,.35)); opacity:0; transition:opacity .3s; }
.card-hover:hover .img-frame::after{ opacity:1; }
.img-frame img{ transition:transform .8s ease; }
.card-hover:hover .img-frame img{ transform:scale(1.05); }

.dot-grid{ background-image:radial-gradient(rgba(0,122,128,.18) 1px, transparent 1px); background-size:18px 18px; }

.num-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:14px;
  font-weight:700; font-size:1.1rem;
  background:linear-gradient(135deg,#007a80,#009ba4); color:#fff;
  box-shadow:0 8px 20px -8px rgba(0,122,128,.45);
}

@keyframes floaty { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-14px) } }
.floaty{ animation:floaty 7s ease-in-out infinite; }

/* form */
.field{ display:block; width:100%; padding:.95rem 1.1rem; border-radius:14px; border:1px solid #e5e1d8; background:#fff; font-size:1rem; color:var(--ink); transition:border-color .2s, box-shadow .2s; font-family:inherit; }
.field:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 4px rgba(0,122,128,.12); }
.field-label{ display:block; font-weight:500; color:#1a2326; margin-bottom:.45rem; font-size:.95rem; }
.hp-field{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* breadcrumb */
.crumb{ color:#7a8588; font-size:.9rem; }
.crumb a:hover{ color:var(--brand); }

/* ── Lightbox ── */
#lb-overlay{
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.92);
  display:none; align-items:center; justify-content:center;
  padding:20px;
}
#lb-overlay.open{ display:flex; }
#lb-img{
  max-width:90vw; max-height:85vh;
  object-fit:contain; border-radius:12px;
  user-select:none; pointer-events:none;
  transition:opacity .2s;
}
#lb-close{
  position:absolute; top:18px; right:18px;
  width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.15); border:none;
  color:#fff; font-size:1.2rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s;
}
#lb-close:hover{ background:rgba(255,255,255,.28); }
#lb-prev, #lb-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border-radius:50%;
  background:rgba(255,255,255,.15); border:none;
  color:#fff; font-size:1.1rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s;
}
#lb-prev:hover, #lb-next:hover{ background:rgba(255,255,255,.28); }
#lb-prev{ left:18px; }
#lb-next{ right:18px; }
#lb-counter{
  position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.6); font-size:.85rem; font-family:'Outfit',sans-serif;
  letter-spacing:.05em;
}
.lb-item{ cursor:zoom-in; }