:root{
  --ink:#2f2a10;
  --muted:#675f2a;
  --bg:#fffdf4;
  --bg-soft:#fbf8e6;
  --line:rgba(47,42,16,.10);
  --shadow:0 18px 55px rgba(0,0,0,.12);
  --shadow2:0 26px 80px rgba(0,0,0,.14);

  --green:#5f5716;
  --green2:#4c4512;
  --accent:#dbcc39;

  --radius:22px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: var(--bg);
  color: var(--ink);
  overflow-x:hidden;
}
img{max-width:100%; height:auto}
a{color:inherit; text-decoration:none}

.container{max-width:1180px; margin:0 auto; padding:0 22px}
.section{padding:92px 0}
.section.tight{padding:62px 0}

/* =========================
   TOP NAV
========================= */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.nav .row{
  display:flex; align-items:center; justify-content:space-between;
  height:78px; gap:18px;
}
.brand{display:flex; flex-direction:column; line-height:1; letter-spacing:.06em}
.brand b,.brand span{font-size:22px}

.menu{display:flex; gap:16px; align-items:center; justify-content:center; flex:1}
.menu a{
  font-size:14px;
  opacity:.78;
  padding:10px 10px;
  border-radius:12px;
  transition:.25s;
  color:var(--ink);
}
.menu a:hover{opacity:1; background:rgba(8,25,21,.06)}
.menu a.active{opacity:1; background:rgba(8,25,21,.08); border:1px solid rgba(8,25,21,.12)}

.right{display:flex; align-items:center; gap:10px}
.iconbtn{
  width:40px; height:40px; display:grid; place-items:center;
  background:rgba(8,25,21,.05);
  border:1px solid rgba(8,25,21,.12);
  border-radius:999px;
  transition:transform .25s, background .25s, border-color .25s;
}
.iconbtn:hover{transform:translateY(-2px); background:rgba(8,25,21,.08); border-color:rgba(8,25,21,.22)}
.pill{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px;
  background:rgba(8,25,21,.05);
  border:1px solid rgba(8,25,21,.14);
  border-radius:999px;
  font-size:13px;
  color:var(--ink);
}

/* =========================
   HERO (diagonal 50/50)
========================= */
.hero{
  position:relative;
  min-height:78vh;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  align-items:stretch;
}
.hero-left{
  position:relative;
  padding:92px 64px 64px 64px;
  background:
    radial-gradient(900px 600px at 15% 20%, rgba(219,204,57,.18), transparent 60%),
    linear-gradient(160deg, #5b5316, #473f10 60%, #322d0c);
  clip-path: polygon(0 0, 68% 0, 54% 100%, 0 100%);
  overflow:hidden;
  color:rgba(255,255,255,.92);
}
.hero-left:before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(600px 340px at 25% 20%, rgba(219,204,57,.22), transparent 60%),
    radial-gradient(700px 420px at 35% 80%, rgba(248,239,180,.12), transparent 60%);
  filter: blur(12px);
  opacity:.9;
  pointer-events:none;
}
.hero-left .kicker{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  opacity:.9;
}
.hero-left .divider{width:1px; height:56px; background:rgba(255,255,255,.35); margin:22px 0 22px}
.hero-left h1{margin:14px 0 12px; font-size:62px; line-height:1.02; letter-spacing:-.02em}
.hero-left p{margin:0 0 24px; max-width:520px; color:rgba(255,255,255,.78); font-size:15px; line-height:1.7}

.hero-actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding:0 18px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:.02em;
  border:1px solid rgba(8,25,21,.14);
  background:#fff;
  color:var(--ink);
  transition: transform .25s, box-shadow .25s, background .25s, border-color .25s;
}
.btn:hover{transform:translateY(-2px); box-shadow: var(--shadow)}
.btn.primary{
  background:linear-gradient(135deg, rgba(219,204,57,.98), rgba(248,239,180,.68));
  border:0;
  color:#2f2a10;
  box-shadow:0 18px 55px rgba(0,0,0,.22);
}
.btn.primary:hover{transform:translateY(-3px) scale(1.01)}
.btn.light{background:#fff; border:1px solid rgba(255,255,255,.35)}
.btn.ghost{background:transparent; color:#fff; border:1px solid rgba(255,255,255,.18)}
.btn.ghost:hover{background:rgba(255,255,255,.10)}

.badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(8,25,21,.06);
  border:1px solid rgba(8,25,21,.10);
  font-size:12px;
  color:rgba(8,25,21,.86);
}

.kards{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px}
.card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px;
  box-shadow: 0 18px 70px rgba(0,0,0,.10);
  transition: transform .35s cubic-bezier(.22,1,.36,1), border-color .35s;
  position:relative;
  overflow:hidden;
  color:var(--ink);
}
.card h3{margin:0 0 6px; font-size:18px}
.card p{margin:0; color:var(--muted); line-height:1.65; font-size:13px}
.card:hover{transform:translateY(-6px); border-color:rgba(219,204,57,.28)}

/* Dark variant used inside hero */
.hero-left .badge{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.90);
}
.hero-left .card{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.92);
  box-shadow: 0 18px 70px rgba(0,0,0,.18);
}
.hero-left .card p{color:rgba(255,255,255,.76)}

.hero-right{position:relative; overflow:hidden}
.hero-media{position:absolute; inset:0; background: url('/assets/img/hero.jpg') center/cover no-repeat; transform:scale(1.08)}
.hero-media:after{content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.05)), radial-gradient(900px 500px at 30% 20%, rgba(0,0,0,.20), transparent 60%)}

/* =========================
   LIGHT SECTIONS
========================= */
.split{display:grid; grid-template-columns: 1fr 1fr; gap:28px; align-items:center}

.block{
  background: #fff;
  border:1px solid var(--line);
  border-radius:28px;
  padding:26px;
  box-shadow: var(--shadow);
}
.block h2{margin:0 0 10px; font-size:34px; letter-spacing:-.02em}
.block p{margin:0; color:var(--muted); line-height:1.75}

.media{
  border-radius:28px;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow: var(--shadow2);
  position:relative;
  background:#fff;
}
.media img{width:100%; height:100%; display:block; object-fit:cover}

.pilltag{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(8,25,21,.05);
  border:1px solid rgba(8,25,21,.10);
  font-size:13px;
  color:var(--ink);
}
.small{font-size:13px; color:rgba(8,25,21,.62)}

/* =========================
   AVAILABILITY (like screenshots)
========================= */
.avail{
  display:grid;
  grid-template-columns: 1fr 1.1fr;
  gap:28px;
  align-items:stretch;
}
.avail-left{
  background: #efefe9;
  border:1px solid rgba(8,25,21,.10);
  border-radius:26px;
  padding:26px;
}
.avrow{display:flex; gap:16px; padding:18px 0; border-bottom:1px solid rgba(8,25,21,.10)}
.avrow:last-child{border-bottom:0}
.avico{width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:rgba(8,25,21,.06); border:1px solid rgba(8,25,21,.10)}
.avrow b{display:block; margin-bottom:4px}
.avrow .meta{color:rgba(8,25,21,.66); font-size:13px; line-height:1.55}

.avail-right{
  background: var(--green);
  border-radius:0;
  padding:54px 56px;
  color:#fff;
}
.avail-right .top-pill{
  display:inline-flex;
  padding:9px 14px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  font-size:13px;
}
.avail-right h2{margin:16px 0 8px; font-size:40px; letter-spacing:-.02em}
.avail-right p{margin:0 0 18px; color:rgba(255,255,255,.80); line-height:1.7}

.formgrid{display:grid; gap:12px; margin-top:18px}
.field{
  display:flex; align-items:center; gap:12px;
  padding:12px 14px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
}
.field input, .field select{
  width:100%;
  border:0; outline:0;
  background:transparent;
  color:#fff;
  font-size:13px;
}
.field input::placeholder{color:rgba(255,255,255,.64)}

.avbtn{
  height:44px;
  border-radius:0;
  width:100%;
  font-weight:900;
  letter-spacing:.02em;
  background:#fff;
  color:#0a1b16;
  border:0;
  cursor:pointer;
}
.avbtn:hover{filter:brightness(1.02)}

/* =========================
   GALLERY GRID
========================= */
.masonry{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.tile{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  cursor:pointer;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 16px 50px rgba(0,0,0,.10);
  background:#fff;
}
.tile img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s}
.tile:hover img{transform:scale(1.05)}
.tile .cap{position:absolute; left:0; right:0; bottom:0; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; background:linear-gradient(180deg, transparent, rgba(0,0,0,.40)); color:#fff; font-size:12px}

/* LIGHTBOX */
.lightbox{
  position:fixed; inset:0;
  background:rgba(0,0,0,.78);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:200;
  padding:22px;
}
.lightbox.open{display:flex}
.lightbox img{max-width:min(1100px, 96vw); max-height:86vh; border-radius:18px; box-shadow:0 30px 120px rgba(0,0,0,.45)}
.lightbox .close{
  position:fixed; top:18px; right:18px;
  width:44px; height:44px;
  display:grid; place-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  cursor:pointer;
  font-weight:900;
}

/* =========================
   FOOTER
========================= */
.footer{
  background: #111;
  color: rgba(255,255,255,.92);
  padding:74px 0;
}
.footer h2{font-family: ui-serif, Georgia, "Times New Roman", Times, serif; font-size:64px; font-weight:500; margin:0 0 24px; letter-spacing:.01em}
.footer .cols{display:grid; grid-template-columns:repeat(4,1fr); gap:22px}
.footer .col h4{margin:0 0 12px; font-size:14px; letter-spacing:.10em; text-transform:uppercase; opacity:.8}
.footer a{opacity:.75}
.footer a:hover{opacity:1; text-decoration:underline}

/* =========================
   LOGIN (purple card on photo)
========================= */
.login-body{
  min-height:100vh;
  background: url('/assets/img/hero.jpg') center/cover no-repeat;
}
.login-body:before{
  content:"";
  position:fixed; inset:0;
  background: radial-gradient(900px 500px at 50% 20%, rgba(255,255,255,.10), transparent 60%),
              linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.25));
}
.login-wrap{position:relative; min-height:100vh; display:grid; place-items:center; padding:40px 22px}
.login-card{
  width:min(430px, 92vw);
  border-radius:18px;
  padding:34px 34px 28px;
  background: linear-gradient(180deg, #6f74ff, #b334ff);
  color:#fff;
  box-shadow:0 25px 90px rgba(0,0,0,.35);
}
.login-top{display:grid; place-items:center; gap:16px; text-align:center}
.login-icon{
  width:90px; height:90px;
  border-radius:999px;
  background: rgba(255,255,255,.92);
  display:grid; place-items:center;
  color:#222;
}
.login-icon svg{filter: drop-shadow(0 12px 22px rgba(0,0,0,.20))}
.login-top h1{margin:0; font-size:18px; letter-spacing:.06em; line-height:1.35; text-transform:uppercase}

.login-form{margin-top:22px; display:grid; gap:14px}
.login-field{
  display:flex; align-items:center; gap:10px;
  padding:10px 10px;
  border-bottom:1px solid rgba(255,255,255,.35);
}
.login-field-ico{opacity:.9}
.login-field input{
  width:100%;
  border:0; outline:0;
  background:transparent;
  color:#fff;
  font-size:14px;
  padding:8px 0;
}
.login-field input::placeholder{color:rgba(255,255,255,.80)}
.login-remember{display:flex; align-items:center; gap:10px; font-size:13px; opacity:.9; user-select:none}
.login-remember input{accent-color:#fff}

.login-btn{
  margin-top:6px;
  height:44px;
  border-radius:999px;
  border:0;
  background:#fff;
  color:#4b2b7a;
  font-weight:900;
  cursor:pointer;
}
.login-btn:hover{filter:brightness(1.03)}
.login-error{
  margin-top:14px;
  background: rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.28);
  padding:12px 14px;
  border-radius:14px;
  font-weight:700;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 980px){
  .hero{grid-template-columns:1fr}
  .hero-left{clip-path:none; padding:72px 22px 28px}
  .hero-right{min-height:46vh}
  .kards{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .masonry{grid-template-columns:repeat(2,1fr)}
  .avail{grid-template-columns:1fr}
  .avail-right{padding:42px 22px}
}
@media (max-width: 520px){
  .nav .row{height:72px}
  .brand b,.brand span{font-size:18px}
  .menu{display:none}
  .hero-left h1{font-size:46px}
  .masonry{grid-template-columns:1fr}
}


/* ===== V4 FIX: hero full height + wedge 50% ===== */
.hero, .hero-section, .apik-hero { height: 100vh !important; min-height: 100vh !important; }
.hero-inner, .hero .hero-inner, .hero-section .hero-inner, .apik-hero .hero-inner { height: 100% !important; min-height: 100% !important; }
.hero-bg, .hero .hero-bg, .hero-section .hero-bg, .apik-hero .hero-bg { height: 100% !important; min-height: 100% !important; }
.hero-wedge, .hero .hero-wedge, .hero-section .hero-wedge, .apik-hero .hero-wedge,
.wedge { width: 50vw !important; height: 100% !important; min-height: 100% !important; }

/* ===== V4 brand logo (SVG text only) ===== */
.brandmark { text-decoration: none !important; }
.brand-logo{ height:44px; width:auto; display:block; filter: drop-shadow(0 10px 22px rgba(0,0,0,.18)); }
.brand-text{
  font-family: system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  font-weight: 900;
  letter-spacing: .10em;
  fill: rgba(10, 50, 44, .98);
}
@media (min-width: 1100px){ .brand-logo{ height:46px; } }

/* ===== V4 kicker: Nejlepší volba + lux line ===== */
.kicker{
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:12px;
  opacity:.95;
}
.kicker::before{
  content:"";
  width:54px;
  height:2px;
  border-radius:999px;
  background: linear-gradient(90deg, rgba(255,255,255,.95), rgba(255,255,255,.25));
  box-shadow: 0 0 22px rgba(248,239,180,.22);
}

/* ===== WAU: subtle parallax + wedge shine ===== */
:root{ --mx:0px; --my:0px; }
.wedge, .hero-wedge{
  position:relative;
  overflow:hidden;
}
.wedge::after, .hero-wedge::after{
  content:"";
  position:absolute;
  inset:-40%;
  background: radial-gradient(closest-side, rgba(219,204,57,.16), rgba(219,204,57,0) 60%);
  transform: translate(calc(var(--mx) * .35), calc(var(--my) * .35));
  filter: blur(18px);
  pointer-events:none;
  opacity:.9;
}
.wedge::before, .hero-wedge::before{
  content:"";
  position:absolute;
  inset:-20%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.10) 50%, rgba(255,255,255,0) 65%);
  transform: translateX(-40%) skewX(-14deg);
  opacity:.0;
  transition: opacity .25s ease;
  pointer-events:none;
}
.wedge:hover::before, .hero-wedge:hover::before{ opacity:.9; animation: wedgeShine 1.4s ease forwards; }
@keyframes wedgeShine{
  from{ transform: translateX(-60%) skewX(-14deg); }
  to{ transform: translateX(60%) skewX(-14deg); }
}

/* Button shine sweep (if classes exist) */
.btn.primary, .btn.primary:link, .btn.primary:visited{
  position:relative;
  overflow:hidden;
}
.btn.primary::after{
  content:"";
  position:absolute;
  inset:-40%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.25) 50%, rgba(255,255,255,0) 65%);
  transform: translateX(-55%) skewX(-14deg);
  opacity:0;
  transition: opacity .2s ease;
  pointer-events:none;
}
.btn.primary:hover::after{ opacity:1; animation: btnShine 1.1s ease forwards; }
@keyframes btnShine{
  from{ transform: translateX(-55%) skewX(-14deg); }
  to{ transform: translateX(55%) skewX(-14deg); }
}

/* V7 adjustments */
.logo-tag{
font-weight:700;
}

.hero-wedge{
width:50vw !important;
}

.hero-title{
text-align:left;
}

.hero-wedge .hero-content{
align-items:flex-start;
text-align:left;
}


/* ===== V8 WOW EFFECTS ===== */

/* sweep light over wedge */
.hero-wedge::after{
content:"";
position:absolute;
top:0;
left:-60%;
width:40%;
height:100%;
background:linear-gradient(
90deg,
rgba(255,255,255,0) 0%,
rgba(255,255,255,0.08) 50%,
rgba(255,255,255,0) 100%
);
transform:skewX(-25deg);
animation:sweepHero 8s infinite;
pointer-events:none;
}

@keyframes sweepHero{
0%{left:-60%;}
100%{left:120%;}
}

/* hero text subtle float */
.hero-title{
animation:heroFloat 6s ease-in-out infinite;
}

@keyframes heroFloat{
0%{transform:translateY(0);}
50%{transform:translateY(-6px);}
100%{transform:translateY(0);}
}

/* luxury button hover */
.btn,
button{
transition:all .35s ease;
}

.btn:hover,
button:hover{
transform:translateY(-3px) scale(1.02);
box-shadow:0 12px 30px rgba(0,0,0,0.25);
}

/* icon glow hover */
.nav-icons a,
.social-icons a{
transition:all .3s ease;
}

.nav-icons a:hover,
.social-icons a:hover{
transform:scale(1.15);
box-shadow:0 0 14px rgba(0,255,200,0.35);
border-radius:50%;
}

/* parallax layer helper */
.hero-bg{
transition:transform .15s linear;
}


/* ===== V9 FIX: wedge true 50% + bottom aligned cut + left align ===== */
.hero .wedge{
  width:50vw !important;
  max-width:none !important;
  clip-path: polygon(0 0, 112% 0, 100% 100%, 0 100%) !important;
}
.hero .wedge::before,
.hero .wedge::after{
  clip-path: polygon(0 0, 112% 0, 100% 100%, 0 100%) !important;
}
/* Ensure wedge fills hero height */
.hero, .hero .photo, .hero .wedge{ height:100vh !important; min-height:100vh !important; }
.hero .brand{ align-items:flex-start !important; text-align:left !important; }
.hero .kicker{ text-align:left !important; }
.hero h1, .hero p{ text-align:left !important; }
/* Move 'APÍK CROATIA' brand block slightly left for stronger alignment */
.hero .brand{ margin-left:-4px; }


/* ===== V10: bring back diagonal cut while keeping wedge at 50% ===== */
/* Base wedge stays exact 50% width; triangle adds angled top extension only */
.hero .wedge,
.hero-wedge,
.hero .hero-wedge{
  width: 50vw !important;
  position: relative !important;
  overflow: visible !important;
}

/* Triangle overlay for the cut (top extends into photo, bottom stays at 50%) */
.hero .wedge::before,
.hero-wedge::before,
.hero .hero-wedge::before{
  content:"";
  position:absolute;
  top:0;
  right:-14vw;          /* how far it reaches into photo at the top */
  width:14vw;
  height:100%;
  background: inherit;  /* same gradient/background as wedge */
  clip-path: polygon(0 0, 100% 0, 0 100%); /* triangle */
  filter: drop-shadow(18px 0 28px rgba(0,0,0,.18));
  pointer-events:none;
}

/* Ensure right side photo starts at 50% */
.hero .photo,
.hero-photo,
.hero .hero-bg{
  left: 50vw !important;
  width: 50vw !important;
}

/* ===== V10: header logo truly left ===== */
.topbar, .navbar, header{
  width:100%;
}
.topbar .container, .navbar .container, header .container{
  max-width: none !important;
  width: 100% !important;
  padding-left: 22px !important;
  padding-right: 22px !important;
}
.topbar .inner, .navbar .inner, header .inner{
  display:flex !important;
  align-items:center !important;
  justify-content: space-between !important;
}
.brand{
  margin-left: 0 !important;
  justify-content:flex-start !important;
}


/* ===== V11: ensure diagonal CUT is visible (z-index + triangle gradient) ===== */
.hero{ position:relative; overflow:hidden; }
.hero .wedge, .hero-wedge, .hero .hero-wedge{
  position:absolute !important;
  left:0; top:0; bottom:0;
  width:50vw !important;
  z-index: 3 !important;
  overflow: visible !important;
  /* make sure wedge actually has a background */
  background: linear-gradient(180deg, #b8aa2f 0%, #948823 55%, #5f5716 100%) !important;
}
.hero .photo, .hero-photo, .hero .hero-bg{
  position:absolute !important;
  left:50vw !important;
  top:0; bottom:0;
  width:50vw !important;
  z-index: 1 !important;
}

/* The diagonal bite: a triangle that sits ABOVE the photo */
.hero .wedge::after, .hero-wedge::after, .hero .hero-wedge::after{
  content:"";
  position:absolute;
  top:0; right:-18vw;
  width:18vw; height:100%;
  background: linear-gradient(180deg, #b8aa2f 0%, #948823 55%, #5f5716 100%);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  z-index: 4;
  pointer-events:none;
  filter: drop-shadow(24px 0 30px rgba(0,0,0,.20));
}

/* crisp edge highlight */
.hero .wedge::before, .hero-wedge::before, .hero .hero-wedge::before{
  content:"";
  position:absolute;
  top:0; right:-18vw;
  width:18vw; height:100%;
  clip-path: polygon(0 0, 100% 0, 0 100%);
  background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,255,255,0));
  z-index: 5;
  pointer-events:none;
  mix-blend-mode: overlay;
  opacity:.55;
}


/* ===== V12 CLEAN WEDGE (reset messy pseudo triangles) ===== */
.hero{ position:relative !important; overflow:hidden !important; }

/* Photo should cover whole hero behind everything */
.hero .photo,
.hero-photo,
.hero .hero-bg,
.hero-bg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:1 !important;
  object-fit:cover !important;
  transform:none !important;
}

/* Wedge: exact 50% width, full height, diagonal cut via clip-path */
.hero .wedge,
.hero-wedge,
.hero .hero-wedge,
.wedge{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:50vw !important;
  height:100% !important;
  z-index:3 !important;
  background: linear-gradient(180deg, #b8aa2f 0%, #948823 60%, #5f5716 100%) !important;
  clip-path: polygon(0 0, 100% 0, 86% 100%, 0 100%) !important; /* clean diagonal */
  box-shadow: inset -60px 0 90px rgba(0,0,0,.22), 0 22px 60px rgba(0,0,0,.28) !important;
  overflow:hidden !important;
}

/* Kill any previous pseudo-elements that were creating extra strips/blocks */
.hero .wedge::before,
.hero .wedge::after,
.hero-wedge::before,
.hero-wedge::after,
.hero .hero-wedge::before,
.hero .hero-wedge::after,
.wedge::before,
.wedge::after{
  content: none !important;
  display:none !important;
}

/* Make wedge content aligned left (as you liked) */
.hero .wedge .hero-content,
.hero-wedge .hero-content,
.wedge .hero-content{
  align-items:flex-start !important;
  text-align:left !important;
}


/* ===== V13: wedge slightly smaller to sit nicer near CTA ===== */
.hero .wedge,
.hero-wedge,
.hero .hero-wedge,
.wedge{
  width:46vw !important;
  clip-path: polygon(0 0, 100% 0, 82% 100%, 0 100%) !important;
}


/* === GOLD LUXURY GLOBAL OVERRIDE v70 FULL === */
:root{
  --gold:#dbcc39;
  --gold-strong:#c4b62f;
  --gold-dark:#948823;
  --gold-deep:#6f671a;
  --gold-deeper:#504a14;
  --gold-light:#efe78a;
  --gold-soft:#f6f2b5;
  --gold-glass:rgba(219,204,57,.10);
  --gold-border:rgba(219,204,57,.24);
  --gold-shadow:rgba(219,204,57,.16);
}

html, body{
  background:
    radial-gradient(circle at 15% 20%, rgba(239,231,138,.08), transparent 24%),
    radial-gradient(circle at 85% 30%, rgba(219,204,57,.06), transparent 26%),
    linear-gradient(180deg, #3a3510 0%, #4c4615 24%, #5e5819 55%, #71691d 100%) !important;
}

body *{
  accent-color: var(--gold);
}

.section,
.hero,
.heroSection,
.homeSection,
.reviewsSection,
.gallerySection,
.mapSection,
.tipsSection,
.availabilitySection,
.contactSection,
footer,
section[class],
div[class*="section-bg"],
div[class*="home-section"]{
  background-color: transparent !important;
}

.section::before,
.section::after,
section[class]::before,
section[class]::after,
div[class*="section"]::before,
div[class*="section"]::after{
  background-image:
    radial-gradient(circle at center, rgba(219,204,57,.10), transparent 68%) !important;
}

/* common dark green backgrounds -> gold luxury */
[class*="green"],
[class*="emerald"],
[class*="teal"]{
  background-color: transparent !important;
  border-color: var(--gold-border) !important;
}

.card,
.glass,
.glass-card,
.info-card,
.review-card,
.review-spotlight,
.tip-card,
.gallery-card,
.map-card,
.near-card,
.calendar-card,
.feature-card,
.panel,
.box{
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    rgba(219,204,57,.07) !important;
  border:1px solid var(--gold-border) !important;
  box-shadow:
    0 10px 30px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 0 1px rgba(219,204,57,.03) !important;
}

button,
.btn,
.button,
a.btn,
input[type="submit"],
input[type="button"]{
  background: linear-gradient(180deg, var(--gold-light), var(--gold)) !important;
  color:#24210b !important;
  border:1px solid rgba(255,255,255,.22) !important;
  box-shadow: 0 10px 24px rgba(80,74,20,.22) !important;
}
button:hover,
.btn:hover,
.button:hover,
a.btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover{
  background: linear-gradient(180deg, #fff7b8, var(--gold-light)) !important;
  color:#1b1808 !important;
}

.nav a.active,
.topbar .nav a.active,
.nav a:hover,
.topbar .nav a:hover,
.brand-accent,
.text-accent,
.highlight,
.accent,
.section-badge,
.badge,
.pill{
  color: var(--gold-light) !important;
}

.badge,
.pill,
.section-badge,
.tag,
.chip{
  background: rgba(219,204,57,.10) !important;
  border:1px solid var(--gold-border) !important;
}

input, textarea, select{
  border-color: rgba(219,204,57,.22) !important;
  box-shadow:none !important;
}
input:focus, textarea:focus, select:focus{
  border-color: rgba(239,231,138,.55) !important;
  box-shadow: 0 0 0 4px rgba(219,204,57,.10) !important;
}

/* links */
a{ color: var(--gold-soft); }
a:hover{ color: #fff7b8; }

/* gradients that used to be green */
[style*="#0"], [style*="#1"], [style*="#2"], [style*="#3"]{
  /* keep inline styles from forcing greenish feeling less aggressively */
}

/* calendar */
.calendar-day.is-free,
.day.free{
  background: rgba(239,231,138,.08) !important;
  border-color: rgba(239,231,138,.18) !important;
}
.calendar-day.is-busy,
.day.busy{
  background: rgba(196,182,47,.22) !important;
  border-color: rgba(239,231,138,.26) !important;
}
.calendar-day.is-blocked,
.day.blocked{
  background: rgba(148,136,35,.32) !important;
}

/* map / gallery section backdrop smoothing */
#galerie-home,
#mapa,
#kde-nas-najdete,
#tips-home,
#proc-brac,
#den-na-braci,
#rozlozeni,
#o-apiku,
#reviews,
#availability,
#obsazenost{
  background:
    radial-gradient(circle at 14% 20%, rgba(239,231,138,.08), transparent 24%),
    radial-gradient(circle at 86% 35%, rgba(219,204,57,.06), transparent 28%),
    linear-gradient(180deg, #4c4615 0%, #5d5719 50%, #70691d 100%) !important;
}

/* subtle luxury separators */
section + section{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}



/* =========================
   ADMIN LUX DASHBOARD 2026
========================= */
body.admin-ui{
  background:
    radial-gradient(980px 620px at 12% 12%, rgba(219,204,57,.10), transparent 60%),
    radial-gradient(880px 560px at 88% 20%, rgba(248,239,180,.06), transparent 60%),
    linear-gradient(180deg, #171407 0%, #100d04 48%, #0b0903 100%);
  color:#fff8de;
  min-height:100vh;
}
body.admin-ui .nav{
  background:rgba(14,11,4,.72);
  backdrop-filter: blur(16px);
  border-bottom:1px solid rgba(219,204,57,.14);
  box-shadow:0 18px 60px rgba(0,0,0,.32);
}
body.admin-ui .brand b,
body.admin-ui .brand span{
  color:#efe78a;
  text-shadow:0 10px 28px rgba(219,204,57,.14);
}
body.admin-ui .menu a{
  color:rgba(255,248,222,.72);
  border:1px solid transparent;
}
body.admin-ui .menu a:hover{
  color:#fff8de;
  background:rgba(219,204,57,.08);
  border-color:rgba(219,204,57,.16);
}
body.admin-ui .menu a.active{
  color:#f6edab;
  background:rgba(219,204,57,.12);
  border-color:rgba(219,204,57,.22);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03), 0 12px 28px rgba(0,0,0,.18);
}
body.admin-ui .pill{
  background:rgba(219,204,57,.08);
  border:1px solid rgba(219,204,57,.20);
  color:#f6edab;
}
body.admin-ui .section,
body.admin-ui .section.tight{padding:56px 0 82px}

.admin-dashboard{padding:26px 0 40px}
.dash-hero{
  display:grid;
  grid-template-columns:1.35fr .85fr;
  gap:20px;
  align-items:stretch;
}
.dash-hero-copy,
.dash-hero-side{
  position:relative;
  overflow:hidden;
  border-radius:32px;
  border:1px solid rgba(219,204,57,.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)),
    radial-gradient(800px 500px at 12% 12%, rgba(219,204,57,.10), transparent 58%),
    linear-gradient(180deg, rgba(28,23,9,.96), rgba(16,13,5,.98));
  box-shadow:0 28px 90px rgba(0,0,0,.34);
}
.dash-hero-copy{padding:34px}
.dash-hero-side{padding:24px; display:grid; gap:16px}
.dash-kicker{
  display:inline-flex; padding:9px 14px; border-radius:999px;
  background:rgba(219,204,57,.10); border:1px solid rgba(219,204,57,.18);
  color:#f3eaa5; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
}
.dash-hero h1{
  margin:16px 0 10px;
  font-size:clamp(38px,4vw,66px);
  line-height:.98;
  letter-spacing:-.05em;
  color:#fff7d4;
}
.dash-hero p{
  margin:0;
  max-width:760px;
  color:rgba(255,248,222,.76);
  line-height:1.75;
  font-size:15px;
}
.dash-meta-row{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:18px;
}
.dash-meta-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  color:#efe78a; font-size:13px;
}
.dash-insights{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:22px;
}
.dash-stat-card{
  padding:18px; border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
.dash-stat-card strong{
  display:block; margin:8px 0 6px; font-size:34px; line-height:1; letter-spacing:-.05em; color:#fff7cf;
}
.dash-stat-card small,.dash-stat-label{
  display:block; color:rgba(255,248,222,.66);
}
.dash-stat-label{font-size:12px; text-transform:uppercase; letter-spacing:.12em; color:#efe78a}
.dash-orb{
  position:absolute; right:-90px; top:-90px; width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle, rgba(219,204,57,.24), rgba(219,204,57,0));
  filter:blur(8px); pointer-events:none;
}
.dash-side-card,.dash-chart-card,.dash-panel,.dash-action-card{
  position:relative;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  box-shadow:0 24px 80px rgba(0,0,0,.28);
}
.dash-side-card{padding:22px}
.dash-chart-card{padding:22px; min-height:230px}
.dash-side-badge{
  display:inline-flex; padding:8px 12px; border-radius:999px;
  background:rgba(219,204,57,.10); border:1px solid rgba(219,204,57,.18);
  color:#f3eaa5; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
.dash-side-card h3,
.dash-chart-top h3,
.dash-panel h2{
  margin:14px 0 8px; font-size:28px; line-height:1.05; letter-spacing:-.04em; color:#fff8de;
}
.dash-side-card p,.dash-note-card p,.dash-activity-item p{margin:0; color:rgba(255,248,222,.72); line-height:1.7}
.dash-link-btn{
  margin-top:16px; display:inline-flex; align-items:center; justify-content:center;
  min-height:46px; padding:0 18px; border-radius:999px;
  background:linear-gradient(180deg, #f3eaa5, #dbcc39); color:#3d3810; font-weight:900;
  box-shadow:0 16px 40px rgba(0,0,0,.28);
}
.dash-chart-top{display:flex; align-items:flex-start; justify-content:space-between; gap:12px}
.dash-chart-value{font-size:34px; font-weight:900; color:#fff7cf}
.dash-chart-bars{
  display:grid; grid-template-columns:repeat(6,1fr); gap:12px; align-items:end; height:138px; margin-top:18px;
}
.dash-bar-wrap{
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:8px; height:100%;
}
.dash-bar{
  width:100%;
  border-radius:16px 16px 8px 8px;
  background:linear-gradient(180deg, #f3eaa5, #dbcc39 60%, #b8aa2f);
  box-shadow:0 14px 34px rgba(219,204,57,.16);
  min-height:24px;
}
.dash-bar-wrap span{font-size:12px; color:rgba(255,248,222,.58)}
.dash-actions{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:18px;
}
.dash-action-card{
  padding:20px; color:#fff8de; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.dash-action-card:hover{
  transform:translateY(-5px);
  border-color:rgba(219,204,57,.22);
  box-shadow:0 30px 80px rgba(0,0,0,.34);
}
.dash-action-card.is-gold{
  background:
    linear-gradient(180deg, rgba(219,204,57,.12), rgba(255,255,255,.03)),
    linear-gradient(180deg, rgba(30,24,8,.98), rgba(16,12,4,.98));
}
.dash-action-top{display:flex; align-items:center; justify-content:space-between; gap:8px}
.dash-action-tag{
  display:inline-flex; padding:7px 11px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08);
  color:#efe78a; font-size:12px; font-weight:800; letter-spacing:.10em; text-transform:uppercase;
}
.dash-action-arrow{
  width:38px; height:38px; display:grid; place-items:center; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); color:#fff7cf;
}
.dash-action-card h3{margin:18px 0 8px; font-size:24px; line-height:1.08; letter-spacing:-.03em}
.dash-action-card p{margin:0; color:rgba(255,248,222,.70); line-height:1.68}
.dash-action-link{display:inline-flex; margin-top:16px; color:#f3eaa5; font-weight:800}
.dash-grid{
  display:grid; grid-template-columns:1.2fr .8fr; gap:18px; margin-top:18px;
}
.dash-panel{padding:24px}
.dash-panel-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:16px;
}
.dash-muted{color:rgba(255,248,222,.56); font-size:13px}
.dash-activity-list{display:grid; gap:12px}
.dash-activity-item{
  display:grid; grid-template-columns:52px 1fr; gap:14px; align-items:flex-start;
  padding:16px; border-radius:22px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.06);
}
.dash-activity-icon{
  width:52px; height:52px; display:grid; place-items:center; border-radius:18px;
  background:linear-gradient(180deg, rgba(219,204,57,.16), rgba(219,204,57,.06));
  border:1px solid rgba(219,204,57,.20); color:#f3eaa5; font-size:20px; font-weight:900;
}
.dash-activity-item strong{
  display:block; margin-bottom:5px; color:#fff8de; font-size:16px;
}
.dash-metric-stack{display:grid; gap:12px}
.dash-metric{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:16px 18px; border-radius:22px;
  background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.06);
}
.dash-metric span{color:rgba(255,248,222,.72)}
.dash-metric strong{font-size:28px; line-height:1; color:#fff7cf}
.dash-note-card{
  margin-top:16px; padding:18px; border-radius:24px;
  background:linear-gradient(180deg, rgba(219,204,57,.10), rgba(255,255,255,.025));
  border:1px solid rgba(219,204,57,.16);
}
.dash-note-card b{display:block; margin-bottom:8px; color:#fff7cf}
body.admin-ui .card,
body.admin-ui .block{
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.08);
  color:#fff8de;
  box-shadow:0 22px 70px rgba(0,0,0,.28);
}
body.admin-ui .card p,
body.admin-ui .block p,
body.admin-ui .small{color:rgba(255,248,222,.68)}
body.admin-ui .badge{
  background:rgba(219,204,57,.10);
  border-color:rgba(219,204,57,.16);
  color:#f3eaa5;
}
body.admin-ui .btn{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color:#fff8de;
}
body.admin-ui .btn.primary{
  background:linear-gradient(180deg, #f3eaa5, #dbcc39);
  color:#3d3810 !important;
  border:0;
}
body.admin-ui .btn.ghost{
  background:rgba(255,255,255,.04);
  color:#fff8de;
  border:1px solid rgba(255,255,255,.10);
}
body.admin-ui .field,
body.admin-ui input,
body.admin-ui textarea,
body.admin-ui select{
  color:#fff8de;
}
body.admin-ui .field{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.10);
}
body.admin-ui input,
body.admin-ui textarea,
body.admin-ui select{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
}
body.admin-ui .field input,
body.admin-ui .field select{
  background:transparent; border:0;
}
body.admin-ui .footer{background:#0a0803}
@media (max-width:1100px){
  .dash-hero,.dash-grid{grid-template-columns:1fr}
  .dash-insights,.dash-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:740px){
  .dash-insights,.dash-actions{grid-template-columns:1fr}
  .dash-hero-copy,.dash-hero-side,.dash-panel,.dash-action-card{padding:18px}
  .dash-panel-head{flex-direction:column; align-items:flex-start}
  .nav .row{height:auto; padding:12px 0; flex-wrap:wrap}
  .menu{order:3; width:100%; justify-content:flex-start; flex-wrap:wrap}
}


/* Homepage editor studio polish */
body.admin-ui .hpv-page{
  background:
    radial-gradient(900px 520px at 16% 10%, rgba(219,204,57,.10), transparent 60%),
    linear-gradient(180deg, #171407 0%, #0f0d04 45%, #0b0903 100%);
}
body.admin-ui .hpv-badge{background:rgba(219,204,57,.12);border-color:rgba(219,204,57,.18);color:#f3eaa5}

/* ADMIN POLISH V89 */
body.admin-ui .btn,
body.admin-ui .card,
body.admin-ui .block,
body.admin-ui .menu a{
  transition: all .18s ease;
}
body.admin-ui .btn:hover{
  transform: translateY(-1px);
}

/* ===== v106 clean fix: booked calendar days = occupancy blue ===== */
.availability-grid-body .day.is-occupied,
.availability-grid-body .day[data-available="0"],
.availability-grid-body .day.status-confirmed,
.availability-grid-body .day.status-booked,
.availability-grid-body .day.status-reserved,
.availability-grid-body .day.status-busy,
.calendar-day.is-busy,
.calendar-day.is-occupied,
.day.busy{
  background: linear-gradient(135deg, #c8fff5 0%, #8ef5e2 100%) !important;
  border-color: rgba(142,245,226,.78) !important;
  color: #061f1b !important;
  box-shadow: 0 10px 24px rgba(126,232,212,.18), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
.availability-grid-body .day.is-occupied .num,
.availability-grid-body .day[data-available="0"] .num,
.availability-grid-body .day.status-confirmed .num,
.availability-grid-body .day.status-booked .num,
.availability-grid-body .day.status-reserved .num,
.availability-grid-body .day.status-busy .num,
.calendar-day.is-busy .num,
.calendar-day.is-occupied .num,
.day.busy .num{
  color: #061f1b !important;
  font-weight: 900 !important;
}
.availability-grid-body .day.is-occupied:hover,
.availability-grid-body .day[data-available="0"]:hover{
  transform: none !important;
  cursor: not-allowed !important;
}


/* ===== v110: diagonální půldny příjezd / odjezd v kalendáři ===== */
.availability-grid-body .day.is-half-start,
.calendar-day.is-half-start{
  /* v110: příjezdový den = jedna celá diagonální půlka modrá, druhá žlutá */
  background: linear-gradient(135deg, rgba(239,231,138,.96) 0 49.6%, #8ef5e2 50.4% 100%) !important;
  border-color: rgba(142,245,226,.78) !important;
  color: #061f1b !important;
  box-shadow: 0 10px 24px rgba(126,232,212,.12), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
.availability-grid-body .day.is-half-end,
.calendar-day.is-half-end{
  /* v110: odjezdový den = opačná diagonální půlka modrá, druhá žlutá */
  background: linear-gradient(135deg, #8ef5e2 0 49.6%, rgba(239,231,138,.96) 50.4% 100%) !important;
  border-color: rgba(142,245,226,.78) !important;
  color: #061f1b !important;
  box-shadow: 0 10px 24px rgba(126,232,212,.12), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
.availability-grid-body .day.is-half-start .num,
.availability-grid-body .day.is-half-end .num,
.calendar-day.is-half-start .num,
.calendar-day.is-half-end .num{
  color: #061f1b !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.25);
}
.availability-grid-body .day.is-half-end{
  cursor: pointer !important;
}
.availability-grid-body .day.is-half-end:hover{
  transform: translateY(-2px) !important;
}
body.admin-ui .right{
  gap: 10px;
}