:root{
  --bg:#f8fbff;
  --text:#0b1b2b;
  --muted:#5c7188;
  --card:#ffffff;
  --border:rgba(10,25,40,.10);
  --radius:18px;
  --shadow:0 12px 30px rgba(10,50,90,.10);
  --container:1100px;

  --blue:#1ea7ff;
  --blue2:#66ccff;
  --blueSoft:#eaf7ff;

  --gold1: rgba(228, 205, 150, .95);
  --gold2: rgba(195, 160, 90, .85);
  --goldSoft: rgba(195, 160, 90, .22);

  --section-light: rgba(255,255,255,0.35);
  --section-dark: rgba(255,255,255,0.12);

  --champagne: rgba(195,160,90,.85);
  --champagneSoft: rgba(195,160,90,.22);

  --a1-accent: #c46b45;        /* Sunrise */
  --a1-accent-soft: rgba(196,107,69,.13);
  --a1-accent-border: rgba(196,107,69,.30);

  --a2-accent: #607642;              /* Olive */
  --a2-accent-soft: rgba(96,118,66,.13);
  --a2-accent-border: rgba(96,118,66,.30);

  --a3-accent: #247c9f;              /* Sky */
  --a3-accent-soft: rgba(36,124,159,.13);
  --a3-accent-border: rgba(36,124,159,.30);

}

/* RESET */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  line-height:1.6;

  /* SVIJETLI BLUE GRADIENT PO CIJELOJ STRANICI */
  background:
    radial-gradient(900px 500px at 10% 0%, rgba(30,167,255,.18), transparent 60%),
    radial-gradient(800px 450px at 90% 10%, rgba(102,204,255,.15), transparent 60%),
    var(--bg);
}

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

a{color:inherit}

/* PREMIUM HEADER */
.header{
  position: fixed;
  top: 14px;
  left: 0;
  right: 0;
  z-index: 50;

  width: min(var(--container), calc(100% - 40px));
  margin: 0 auto;

  border-radius: 999px;
  border: 1px solid rgba(195,160,90,.28);

  /* dynamic glass (ONLY ONE background) */
  background: rgba(245,240,235,var(--header-bg, .88));
  backdrop-filter: blur(var(--header-blur, 10px));
  -webkit-backdrop-filter: blur(var(--header-blur, 10px));

  box-shadow:
    0 18px 55px rgba(80,50,20,.14),
    inset 0 1px 0 rgba(255,255,255,.70);

  transform: translateY(-130%);
  opacity: 0;
  transition: transform .45s cubic-bezier(.2,.9,.2,1), opacity .35s ease;

  will-change: transform, opacity;
}

.header__inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding: 10px 14px;  /* manji padding jer je pill */
  position: relative;  /* treba za dropdown nav */
}

.header--visible{
  transform: translateY(0);
  opacity: 1;

  box-shadow:
    0 22px 60px rgba(80,50,20,.18),
    inset 0 1px 0 rgba(255,255,255,.70);
}

.header:hover{
  background: rgba(245,240,235,.96);
  border-color: rgba(195,160,90,.40);

  box-shadow:
    0 26px 70px rgba(80,50,20,.20),
    inset 0 1px 0 rgba(255,255,255,.80);

  transform: translateY(-1px); /* tiny lift */
}

.logo{
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  transition: transform .22s ease, opacity .22s ease;
}

.logo:hover{
  transform: translateY(-1px);
  opacity: .82;
}

.logo__label{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(80,55,30,.85);
  line-height: 1;
}

.logo__divider{
  display: block;
  width: 1px;
  height: 26px;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(139,115,85,.50) 30%,
    rgba(139,115,85,.50) 70%,
    transparent
  );
  flex-shrink: 0;
}

.logo__name{
  font-family: 'Playfair Display', serif;
  font-size: 1.35rem;
  font-weight: 600;
  font-style: italic;
  letter-spacing: .01em;
  color: #2C2420;
  line-height: 1;
}

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

/* hide all nav children by default */
.nav a, .nav .nav__bookRow, .nav .nav__divider { display:none; }

.burger{
  display:inline-flex;
  flex-direction:column;
  gap:6px;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;

  border-radius: 999px;
  border: 1px solid rgba(195,160,90,.30);
  background: rgba(235,229,221,.90);
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 30px rgba(80,50,20,.12);

  cursor:pointer;
  transition: transform .18s ease;
}

.burger:hover{ transform: translateY(-1px); }
.burger:active{ transform: translateY(0); }

.burger span{
  width:18px;
  height:2px;
  background: rgba(11,27,43,.72);
  border-radius:999px;
  transition: transform .22s ease, opacity .18s ease;
}

.nav.is-open + .burger span:nth-child(1){
  transform: translateY(8px) rotate(45deg);
}
.nav.is-open + .burger span:nth-child(2){
  opacity: 0;
}
.nav.is-open + .burger span:nth-child(3){
  transform: translateY(-8px) rotate(-45deg);
}

/* ── Nav dropdown panel ─────────────────────── */
.nav.is-open{
  position: absolute;
  top: calc(100% + 10px);
  right: 0;

  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;

  width: min(300px, calc(100vw - 32px));
  padding: 10px;

  background: rgba(250,246,240,.97);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(195,160,90,.28);

  border-radius: 18px;
  box-shadow:
    0 20px 50px rgba(80,50,20,.18),
    inset 0 1px 0 rgba(255,255,255,.80);

  opacity: 0;
  transform: translateY(-8px);
  animation: menuIn .20s cubic-bezier(.2,.9,.2,1) forwards;
}

@keyframes menuIn{
  to{ opacity:1; transform: translateY(0); }
}

/* ── Regular nav items ──────────────────────── */
.nav.is-open a,
.nav.is-open .nav__bookRow,
.nav.is-open .nav__divider { display: flex; }

.nav.is-open .nav__item {
  align-items: center;
  gap: 11px;
  padding: 11px 13px;
  border-radius: 12px;
  color: rgba(11,27,43,.82);
  text-decoration: none;
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: -.01em;
  background: transparent;
  border: 1px solid transparent;
  transition:
    background .16s ease,
    color .16s ease,
    transform .16s ease,
    border-color .16s ease;
}

.nav.is-open .nav__item:hover {
  background: rgba(195,160,90,.12);
  border-color: rgba(195,160,90,.22);
  color: rgba(11,27,43,.95);
  transform: translateX(2px);
}

.nav__itemIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: rgba(181,118,58,.10);
  color: #b5763a;
  flex-shrink: 0;
}

.nav__itemLabel {
  flex: 1;
}

.nav__itemChevron {
  color: rgba(181,118,58,.45);
  flex-shrink: 0;
  transition: transform .16s ease, color .16s ease;
}

.nav.is-open .nav__item:hover .nav__itemChevron {
  transform: translateX(2px);
  color: #b5763a;
}

/* ── Divider ────────────────────────────────── */
.nav__divider {
  height: 1px;
  background: rgba(195,160,90,.18);
  margin: 4px 4px;
}

/* ── Rezerviraj row ─────────────────────────── */
.nav.is-open .nav__bookRow {
  align-items: stretch;
  gap: 8px;
}

.nav__rezervirajBtn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 13px 16px;
  border-radius: 12px;
  background: linear-gradient(135deg, #c98f3e 0%, #b5763a 100%);
  color: #fff !important;
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .01em;
  text-decoration: none;
  border: 1px solid rgba(181,118,58,.40);
  box-shadow:
    0 4px 14px rgba(181,118,58,.30),
    inset 0 1px 0 rgba(255,255,255,.20);
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.nav__rezervirajBtn:hover {
  background: linear-gradient(135deg, #d9a050 0%, #c98840 100%);
  transform: translateY(-1px);
  box-shadow:
    0 8px 20px rgba(181,118,58,.38),
    inset 0 1px 0 rgba(255,255,255,.28);
}

.nav__howIconBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 46px;
  border-radius: 12px;
  background: rgba(181,118,58,.12);
  border: 1px solid rgba(181,118,58,.28);
  color: #b5763a;
  cursor: pointer;
  transition: background .18s ease, transform .18s ease;
}

.nav__howIconBtn:hover {
  background: rgba(181,118,58,.22);
  transform: translateY(-1px);
}

/* BACKDROP iza otvorenog hamburger menija */
.menu-backdrop{
  position: fixed;
  inset: 0;
  z-index: 40; /* ispod headera (50), iznad sadržaja */

  background: rgba(180,155,120,.08);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
}

/* aktivno stanje */
.menu-backdrop.is-visible{
  opacity: 1;
  pointer-events: auto;
}

/* BUTTONS */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  border:1px solid var(--border);
  background:#fff;
  box-shadow:var(--shadow);
}
.btn--primary{
  border:0;
  color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--blue2));
}
.btn--secondary{
  background:#fff;
}

.hero__grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  align-items:center;
}

/* HERO BLUE GRADIENT CARD */
.hero__text{
  background: linear-gradient(
    135deg,
    rgba(30,167,255,.12),
    rgba(255,255,255,.90)
  );
  border:1px solid var(--border);
  border-radius:22px;
  padding:24px;
  box-shadow:var(--shadow);
}

.badge{
  display:inline-block;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(30,167,255,.18);
  border:1px solid rgba(30,167,255,.3);
  font-weight:800;
}

h1{
  font-size:clamp(34px,4vw,52px);
  line-height:1.1;
  margin:12px 0;
}

.lead{
  color:var(--muted);
  font-size:1.05rem;
  margin-bottom:16px;
}

.hero__cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.hero__info{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.chip{
  padding:8px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--border);
  font-weight:700;
  box-shadow:var(--shadow);
}

/* HERO IMAGE */
.hero__image{
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  background:#fff;
  min-height:340px;
}
.hero__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.section--alt{
  background: linear-gradient(
    180deg,
    rgba(30,167,255,.06),
    rgba(255,255,255,.4)
  );
}

h2{
  font-size:clamp(26px,3vw,36px);
  margin-bottom:10px;
}
.muted{color:var(--muted);}

/* CARDS */
.cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:16px;
}
.card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px;
  box-shadow:var(--shadow);
  transition:.25s;
}
.card:hover{
  transform:translateY(-3px);
}
.list{color:var(--muted);}

/* GALLERY */
.gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:16px;
}
.gallery__item{
  height:170px;
  border-radius:16px;
  border:1px solid var(--border);
  background:linear-gradient(135deg,#eaf7ff,#f5fcff);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  font-weight:700;
}

/* TABLE */
.table{
  margin-top:16px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.row{
  display:grid;
  grid-template-columns:1fr 1fr .7fr;
  padding:12px 14px;
  border-top:1px solid var(--border);
  color:var(--muted);
}
.row--head{
  border-top:0;
  background:rgba(30,167,255,.12);
  color:var(--text);
  font-weight:900;
}

/* MAP */
.map{
  border-radius:16px;
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid var(--border);
}
.map iframe{
  width: 100%;
  height: 420px;
  border: 0;
  display: block;
}

@media (max-width:900px){
  .map iframe{
    height: 320px;
  }
}

/* CONTACT */
.contact{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.form label{
  display:block;
  margin:10px 0;
  color:var(--muted);
  font-weight:700;
}
input, textarea{
  width:100%;
  padding:12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:#fff;
}
input:focus, textarea:focus{
  border-color:var(--blue);
  outline:none;
}

/* SIMPLE HERO */

.hero__sub--simple{
  font-size: 1.05rem;
  color: rgba(44,36,32,.72);
  line-height: 1.8;
  max-width: 52ch;
  margin: 0 auto;
}

/* HERO BACKGROUND SLIDER */
.hero{
  position: relative;
  overflow: hidden;

  height: 100dvh;      /* puni ekran */
  min-height: 100vh;   /* fallback */

  display: flex;
  align-items: center;

  padding: 0;          /* VAŽNO: nema paddinga na hero */

  /* ako želiš zadržati iz svog CSS-a: */
  will-change: transform;
  transform-origin: center center;
}

.hero__bgslider{
  position:absolute;
  inset:0;
  z-index:0;

  will-change: transform;
  transition: transform 0.1s linear;

}

.hero__bgslide{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0;
  transform: scale(1.05);
  transition: opacity 900ms ease;
  will-change: opacity;
}

.hero__bgslide.is-active{
  opacity:1;
  animation: kenburns 7s ease-in-out both;
}

/* Svijetli overlay da tekst bude čitljiv */
.hero__bgoverlay{
  position:absolute;
  inset:0;
  z-index:1;

  /* manje opacity = jača slika */
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.15),
      rgba(255,255,255,.45)
    );
}

/* da tekst bude iznad slidera */
.hero .container,
.hero__wrap,
.hero__panel{
  position:relative;
  z-index:2;
}

/* PREMIUM FINISH (fade-in + scroll indicator) */
@keyframes heroIn{
  from{opacity:0; transform: translateY(14px);}
  to{opacity:1; transform: translateY(0);}
}

.hero--new{
  position: relative;
  overflow: hidden;
}

.hero--new .hero__wrap{
  position: relative;
  z-index: 1;
  padding: 120px 0 80px;
}


/* Scroll indicator */
.hero__wrap{
  position: relative;
  z-index: 2;

  padding: 120px 0 80px;
}


.hero__scroll{
  position:absolute;
  left:50%;
  bottom:-6px;
  transform: translateX(-50%);
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(0,0,0,.10);
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 30px rgba(10,40,70,.12);
  color: #0b1b2b;
}

.hero__scroll:hover{
  transform: translateX(-50%) translateY(-1px);
}

.hero__scroll-text{
  font-weight: 900;
  font-size: .95rem;
  color: rgba(11,27,43,.78);
  letter-spacing: .2px;
}

.hero__scroll-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background: linear-gradient(135deg, var(--blue), var(--blue2));
  box-shadow: 0 8px 20px rgba(30,167,255,.35);
  animation: dotPulse 1.6s ease-in-out infinite;
}

@keyframes dotPulse{
  0%, 100%{ transform: translateY(0); opacity: .9; }
  50%{ transform: translateY(4px); opacity: .55; }
}

/* Na mobitelu da ne ide izvan ekrana */
@media(max-width:900px){
  .hero__scroll{
    bottom:-10px;
  }
}


/* ═══════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════ */
.footer{
  background: #b5763a;
  padding:32px 0 24px;
}

/* Main row */
.footer__main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}

/* Brand */
.footer__brand{ display:flex; flex-direction:column; gap:3px; }
.footer__logo{
  font-size:1rem;
  font-weight:800;
  color:#fff;
  letter-spacing:-.01em;
}
.footer__tagline{
  margin:0;
  font-size:.75rem;
  color:#0b1b2b;
}

/* Nav — horizontal */
.footer__nav{
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:wrap;
}
.footer__nav a{
  font-size:.93rem;
  font-weight:600;
  color:#0b1b2b;
  text-decoration:none;
  transition:opacity .2s;
}
.footer__nav a:hover{ opacity:.6; }
.footer__bookGroup {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.footer__howBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 999px;
  color: rgba(255,255,255,.90);
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  transition: background .18s ease, color .18s ease;
}
.footer__howBtn:hover {
  background: rgba(255,255,255,.32);
  color: #fff;
}

/* Contact */
.footer__contact{
  display:flex;
  align-items:center;
  gap:14px;
}
.footer__contact a{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:.82rem;
  font-weight:700;
  color:#fff;
  text-decoration:none;
  background:rgba(0,0,0,.18);
  padding:4px 10px;
  border-radius:20px;
  transition:background .2s;
  white-space: nowrap;
}
.footer__contact a:hover{ background:rgba(0,0,0,.30); }
.footer__contact svg{ flex-shrink:0; }

/* Divider */
.footer__divider{
  margin:20px 0 16px;
  border:none;
  height:1px;
  background:rgba(11,27,43,.15);
}

/* Bottom row */
.footer__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
}
.footer__copy{
  margin:0;
  font-size:.74rem;
  color:#0b1b2b;
}

/* Apartment tags */
.footer__apts{ display:flex; gap:7px; }
.footer__aptTag{
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.05em;
  padding:3px 9px;
  border-radius:20px;
  border:1px solid;
  opacity:.50;
  transition:opacity .2s;
}
.footer__aptTag:hover{ opacity:1; }
.footer__aptTag--a1{ color:#c46b45; border-color:#c46b45; }
.footer__aptTag--a2{ color:#7a9454; border-color:#7a9454; }
.footer__aptTag--a3{ color:#3a9cc4; border-color:#3a9cc4; }

/* Footer responsive */
@media(max-width:700px){
  .footer__main{ flex-direction:column; align-items:flex-start; gap:16px; }
  .footer__nav{ gap:14px; }
  .footer__contact{ gap:12px; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; }
}

/* MOBILE */
@media(max-width:900px){
  .hero__grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .contact{grid-template-columns:1fr}
}

@keyframes kenburns{
  from{ transform: scale(1.03); }
  to{ transform: scale(1.08); }
}

/* PRO TEXT BACKGROUND */
.hero__panel--simple{
  position: relative;
  z-index: 2;

  max-width: 760px;
  margin: 0 auto;
  text-align: center;

  padding: 28px 32px;
  border-radius: 24px;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.72) 0%,
      rgba(255,255,255,.45) 60%,
      rgba(255,255,255,0) 100%
    );

  backdrop-filter: blur(6px);

  animation: heroFloat 1s ease-out both;
}


@keyframes heroFloat{
  from{
    opacity:0;
    transform: translateY(18px);
  }
  to{
    opacity:1;
    transform: translateY(0);
  }
}

.hero__meta{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(139,100,55,.18);
  backdrop-filter: blur(8px);
}

.hero__meta-item{
  display: flex;
  align-items: center;
  gap: 6px;
}

.hero__google-icon{
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.hero__star-single{
  color: #f5a623;
  font-size: .95rem;
  line-height: 1;
}

.hero__stars{
  display: flex;
  gap: 1px;
  color: #f5a623;
  font-size: .8rem;
  line-height: 1;
}

.hero__rating{
  font-size: .82rem;
  font-weight: 700;
  color: rgba(44,36,32,.85);
  letter-spacing: .01em;
}

.hero__meta-sep{
  width: 1px;
  height: 20px;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(139,100,55,.40) 30%,
    rgba(139,100,55,.40) 70%,
    transparent
  );
  flex-shrink: 0;
}

.hero__pin-icon,
.hero__apt-icon{
  width: 14px;
  height: 14px;
  color: rgba(80,55,30,.65);
  flex-shrink: 0;
}

.hero__location{
  font-size: .82rem;
  font-weight: 600;
  color: rgba(44,36,32,.75);
  letter-spacing: .01em;
}

.hero__welcome{
  margin: 0 0 14px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: rgba(80,55,30,.70);
}

.hero__panel--simple h1{
  margin: 0 0 18px;
  font-family: 'Playfair Display', serif;
  font-size: clamp(2.2rem, 5.5vw, 4rem);
  font-weight: 600;
  line-height: 1.15;
  color: #1a1008;
  text-shadow: 0 2px 16px rgba(255,255,255,.40);
}


/* cinematic scroll smoothness */
#heroPanel{
  will-change: transform, opacity, filter;
  transition: opacity .08s linear;
}

.section{
  padding: 90px 0;
  scroll-margin-top: 110px;

  position: relative;
  z-index: 1;
}

main > .section:nth-of-type(odd){
  background: #F5F0EB;
}
main > .section:nth-of-type(even){
  background: #EBE5DD;
}

.section::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.12),
    transparent
  );
  pointer-events:none;
}

#onama.section::before{
  display: none;
}

/* =========================
   O NAMA — SCROLLYTELLING
   ========================= */
.aboutS{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 28px;
  align-items:start;
}

.aboutS__kicker{
  margin: 0 0 10px;
  font-weight: 900;
  color: rgba(11,27,43,.62);
  letter-spacing: .25px;
}

.aboutS__title{
  margin: 0 0 12px;
}

.aboutS__lead{
  margin: 0 0 16px;
  font-size: 1.12rem;
  line-height: 1.9;
  color: rgba(11,27,43,.82);
}

.aboutS__text{
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.9;
}

.aboutS__amenities{
  display:flex;
  flex-wrap:wrap;
  gap: 10px 12px;
  margin: 16px 0 18px;
}

.aboutS__amenities span{
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(255,255,255,.72);
  font-weight: 800;
  color: rgba(11,27,43,.72);
}

.aboutS__cta{
  display:flex;
  align-items:center;
  gap: 14px;
  flex-wrap:wrap;
}

.aboutS__link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,.60);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 14px 34px rgba(10,40,70,.08);
  text-decoration:none;
  font-weight: 900;
  color: rgba(11,27,43,.76);
}
.aboutS__link:hover{
  transform: translateY(-1px);
}

/* Right side sticky like a brochure */
.aboutS__side{
  position: sticky;
  top: 110px; /* ispod headera */
}

.aboutS__image{
  height: 420px;
  border-radius: 26px;
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 22px 70px rgba(10,40,70,.16);
  overflow:hidden;

  background-image: url('../images/about.jpg');
  background-size: cover;
  background-position: center;
  position: relative;
}

.aboutS__image::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.06),
    rgba(255,255,255,.22)
  );
}

.aboutS__highlights{
  display:grid;
  gap: 12px;
  margin-top: 14px;
}

.aboutS__hl{
  display:grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 14px 34px rgba(10,40,70,.10);
}

.aboutS__hl h3{
  margin: 0 0 4px;
  font-size: 1.05rem;
}
.aboutS__hl p{
  margin: 0;
  color: rgba(11,27,43,.70);
  line-height: 1.6;
}

.aboutS__hlIcon{
  width:44px;
  height:44px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 10px 22px rgba(10,40,70,.10);
  font-size: 1.05rem;
}

/* --- Reveal animation (premium, subtle) --- */
.reveal{
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .6s ease, transform .6s ease;
  will-change: opacity, transform;
}

.reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}

/* Mobile */
@media (max-width: 900px){
  .aboutS{
    grid-template-columns: 1fr;
  }
  .aboutS__side{
    position: relative;
    top: auto;
  }
  .aboutS__image{
    height: 320px;
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .reveal{
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
}

/* ===== Premium override (less “app”, more “boutique”) ===== */

/* manje plavo, više neutralno */
.aboutS__kicker{
  color: rgba(11,27,43,.50);
  font-weight: 750;
  letter-spacing: .35px;
  text-transform: uppercase;
  font-size: .82rem;
}

.aboutS__lead{
  color: rgba(11,27,43,.78);
  font-size: 1.08rem;
}

/* strong da bude suptilan */
.aboutS__copy strong{
  font-weight: 800;
  color: rgba(11,27,43,.82);
}

/* amenities: umjesto chipova -> elegantna lista */
.aboutS__amenities{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 18px;
  margin: 18px 0 18px;
}

.aboutS__amenities span{
  padding: 0;
  border: 0;
  background: transparent;
  font-weight: 650;
  color: rgba(11,27,43,.68);
  border-bottom: 1px solid rgba(10,25,40,.08);
  padding-bottom: 8px;
}

/* highlights: bez ikona, tanki border, manje “cardy” */
.aboutS__hl{
  grid-template-columns: 1fr;
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 18px 45px rgba(10,40,70,.08);
}

.aboutS__hl h3{
  font-size: 1.02rem;
  letter-spacing: .2px;
}

.aboutS__hl p{
  color: rgba(11,27,43,.62);
}

/* makni hlIcon ako je ostao negdje */
.aboutS__hlIcon{ display:none; }

/* slika: malo “editorial” */
.aboutS__image{
  border-radius: 28px;
  box-shadow: 0 26px 80px rgba(10,40,70,.14);
}

@media (max-width: 900px){
  .aboutS__amenities{
    grid-template-columns: 1fr;
  }
}

.titleBadge{
  display:inline-grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:999px;
  margin-right:10px;

  font-weight:900;
  font-size:.95rem;
  color: rgba(11,27,43,.75);

  background: rgba(255,255,255,.65);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 10px 22px rgba(10,40,70,.08);
}

/* O NAMA — čisti premium tekst */
.aboutText{
  max-width: 860px;
  margin: 0 auto;

  padding: 26px 28px;
  border-radius: 22px;

  background: rgba(255,255,255,.56);
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 18px 50px rgba(10,40,70,.08);
}

.aboutText__kicker{
  margin: 0 0 12px;
  font-weight: 900;
  letter-spacing: .35px;
  text-transform: uppercase;
  font-size: .78rem;
  color: rgba(11,27,43,.50);
}

.aboutText__title{
  margin: 0 0 18px;
}

/* ✨ ključni dio — reading comfort */
.aboutText__body{
  max-width: 68ch;   /* MAGIC NUMBER */
}

.aboutText__body p{
  margin: 0 0 18px;

  font-size: 1.05rem;
  line-height: 1.95;
  letter-spacing: .01em;

  color: rgba(11,27,43,.68);
}

/* prvi paragraf malo jači (editorial look) */
.aboutText__body p:first-child{
  font-size: 1.12rem;
  color: rgba(11,27,43,.80);
}

/* završni paragraf */
.aboutText__closing{
  margin-top: 6px;
  color: rgba(11,27,43,.78);
  font-weight: 650;
}

.aboutText__cta{
  margin-top: 18px;
}

.aboutText__link{
  display:inline-flex;
  align-items:center;
  gap: 10px;

  padding: 10px 14px;
  border-radius: 999px;

  background: rgba(255,255,255,.60);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 14px 34px rgba(10,40,70,.08);

  text-decoration:none;
  font-weight:900;
  color: rgba(11,27,43,.76);
}

.aboutText__link:hover{
  transform: translateY(-1px);
}

/* =========================
   ABOUT SPLIT SECTION
   ========================= */
.aboutSplit{
  margin-top: 0;
  position: relative;
  z-index: 10;
}

.aboutSplit__intro{
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,248,240,.70), transparent 65%),
    radial-gradient(ellipse 60% 50% at 10% 100%, rgba(195,160,90,.07), transparent 60%),
    #F5F0EB;
  border-radius: 28px;
  box-shadow: 0 26px 80px rgba(0,0,0,.10);
  overflow: hidden;
  padding: 58px 0 68px;
  text-align: center;
}

.aboutSplit__center{
  position: relative;
  z-index: 1;
}

.aboutSplit__kicker{
  margin: 0 0 12px;

  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .8px;
  text-transform: uppercase;

  color: #8B7355;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.aboutSplit__kicker span:first-child{
  font-size: 1.4rem;
  transform: translateY(-1px);

  color: #3f8f52;
  filter: saturate(1.2);
}

.aboutSplit__title{
  margin: 0 auto 0;
  max-width: 720px;

  font-size: clamp(1.5rem, 2.3vw, 2.15rem);
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: #2C2420;
}

.aboutSplit__title::after{
  content: "";
  display: block;
  width: 52px;
  height: 2px;
  margin: 14px auto 14px;
  border-radius: 99px;
  background: linear-gradient(90deg, rgba(139,115,85,0), rgba(139,115,85,.7), rgba(139,115,85,0));
}


.aboutSplit__subtitle{
  font-size: .97rem;
  max-width: 54ch;
  margin: 0 auto 24px;
  line-height: 1.75;
  color: #6B5E52;
}

/* CTA gumb */
.aboutSplit__cta{
  position: relative;
  overflow: hidden;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: 14px 30px;
  border-radius: 999px;

  background: #2C2420;
  border: 1px solid #2C2420;

  color: #F5F0EB;
  font-weight: 700;
  font-size: .95rem;
  letter-spacing: .3px;
  text-decoration: none;

  box-shadow:
    0 8px 24px rgba(44,36,32,.25),
    inset 0 1px 0 rgba(255,255,255,.08);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background .25s ease;
}

/* strelica */
.aboutSplit__cta::after{
  content: none;
}

/* shine layer */
.aboutSplit__cta::before{
  content: "";
  position: absolute;
  top: -50%;
  left: -60%;
  width: 40%;
  height: 200%;

  background: linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,.18),
    transparent
  );

  transform: skewX(-20deg);
  opacity: 0;
}

/* hover */
.aboutSplit__cta:hover{
  transform: translateY(-3px);
  background: #3D332E;

  box-shadow:
    0 14px 36px rgba(44,36,32,.30),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.aboutSplit__cta:hover::after{
  transform: translateX(5px);
}

.aboutSplit__cta:hover::before{
  animation: ctaShine 0.9s ease forwards;
  opacity: 1;
}

@keyframes ctaShine{
  0%  { left: -60%; }
  100%{ left: 140%; }
}

@media (max-width: 900px){
  .aboutSplit{ margin-top: -90px; }
  .aboutSplit__intro{ border-radius: 22px; }
}

/* DARK PART — FIX + OCEAN TRANSITION */
/* =========================
   BENEFITS — OCEAN DUSK (NEW)
   ========================= */

.aboutSplit__benefits{
  position: relative;
  overflow: hidden;

  background: #EBE5DD;

  color: #2a2a2a;

  padding: 42px 0 52px;

  margin-top: -40px;

  border-top-left-radius: 34px;
  border-top-right-radius: 34px;

  box-shadow:
    0 -18px 60px rgba(0,0,0,.08),
    0 0 0 1px rgba(139,115,85,.10);
}

/* sadržaj iznad overlay-a */
.aboutSplit__benefits > .container{
  position: relative;
  z-index: 1;
}

.aboutSplit__benefits::before{
  content:"";
  position:absolute;
  inset:-30%;
  background:
    radial-gradient(600px 420px at 20% 20%, rgba(245,240,235,.55), transparent 60%),
    radial-gradient(520px 380px at 80% 30%, rgba(195,160,90,.08), transparent 65%);
  pointer-events:none;
  z-index:0;
}

.aboutSplit__benefits::after{
  content:"";
  position:absolute;
  inset:0;

  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");

  mix-blend-mode: overlay;
  pointer-events:none;
}

.aboutSplit__kicker--light{
  color: #8B7355;
  text-align:center;
  text-transform: uppercase;
  letter-spacing: .62px;
  font-weight: 800;
  font-size: .76rem;
  margin: 0 0 6px;
}

.aboutSplit__benefitTitle{
  text-align:center;
  margin: 0 0 24px;

  font-size: clamp(1.5rem, 2.2vw, 2.1rem);
  color: #2C2420;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.aboutSplit__benefitTitle span{
  font-weight: 300;
  opacity: .85;
}

.aboutSplit__benefitTitle::after{
  content:"";
  display:block;
  width:60px;
  height:2px;
  margin:18px auto 0;

  background: linear-gradient(
    90deg,
    rgba(195,160,90,.0),
    rgba(228,205,150,.8),
    rgba(195,160,90,.0)
  );

  border-radius:99px;
  opacity:.85;
}

.aboutSplit__grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 22px;
}

.aboutSplit__benefits .aboutSplit__item.reveal{
  filter: none !important;
}

.aboutSplit__item{
  position: relative;
  overflow: hidden;
  padding: 32px 28px;
  border-radius: 22px;

  background: linear-gradient(
    145deg,
    #F5F0EB,
    #F0EAE2
  );
  border: 1px solid rgba(139,115,85,.18);
  box-shadow:
    0 8px 28px rgba(44,36,32,.10),
    inset 0 1px 0 rgba(255,255,255,.70);

  outline: 0 solid rgba(195,160,90,0);
  outline-offset: 2px;
  text-align: left;
  backdrop-filter: blur(2px);

  top: 0;
  transition:
    transform .26s cubic-bezier(.25,.8,.25,1),
    box-shadow .26s ease,
    border-color .26s ease,
    background .26s ease;
}

/* === PREMIUM HOVER EFFECT === */

.aboutSplit__item:hover{
  transform: translateY(-6px);

  border-color: rgba(139,115,85,.35);
  outline-width: 1px;
  outline-color: rgba(139,115,85,.12);

  background: linear-gradient(
    145deg,
    #FAF6F2,
    #F5EFE6
  );

  box-shadow:
    0 16px 48px rgba(44,36,32,.15),
    0 0 0 1px rgba(139,115,85,.10),
    inset 0 1px 0 rgba(255,255,255,.90);
}

.aboutSplit__head{
  display: flex;
  align-items: center; /* OVO centrirа h4 u odnosu na ikonu */
  gap: 16px;
}

.aboutSplit__head h4{
  margin: 0;
  transform: translateY(-1px);
}

/* opis neka krene ispod naslova (poravnan s naslovom, ne ispod ikone) */
.aboutSplit__desc{
  margin-top: 10px;
  margin-left: 64px;
}

/* premium stagger ulaz (1 po 1) */
.aboutSplit__grid .aboutSplit__item.reveal{ transition-delay: 0ms; }
.aboutSplit__grid .aboutSplit__item.reveal:nth-child(2){ transition-delay: 90ms; }
.aboutSplit__grid .aboutSplit__item.reveal:nth-child(3){ transition-delay: 180ms; }
.aboutSplit__grid .aboutSplit__item.reveal:nth-child(4){ transition-delay: 270ms; }

.aboutSplit__grid .aboutSplit__item.reveal.is-visible{
  transition-delay: 0ms !important;
}

/* i kad hoveraš, nikad nemoj čekati */
.aboutSplit__item:hover{
  transition-delay: 0ms !important;
}

/* BITNO: delay mora vrijediti i za reveal tranzicije */
.aboutSplit__grid .aboutSplit__item.reveal{
  transition-property: opacity, transform, filter, box-shadow, background-image;
}

.aboutSplit__item:hover::before{
  transform: scaleX(1.18);
  opacity: 1;
}

.aboutSplit__benefits .aboutSplit__item:hover{
  transform: translateY(-6px) !important;
}

/* zlatni “signature” detalj gore */
.aboutSplit__item::before{
  display:none;
  content:"";
  position:absolute;
  left:22px;
  top:18px;
  width:56px;
  height:2px;
  border-radius:99px;

  background: linear-gradient(
    90deg,
    rgba(195,160,90,.96),
    rgba(228,205,150,.72)
  );
  opacity:.92;

  transform-origin: left center;
  transition: transform .22s ease, opacity .22s ease;
}

.aboutSplit__item::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-75%;
  width:50%;
  height:180%;
  transform: skewX(-20deg);

  background: linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,.16),
    transparent
  );

  opacity:0;
  pointer-events:none;
}

.aboutSplit__item:hover::after{
  animation: premiumSweep 1.05s ease forwards;
}

/* okidač: kad se reveal element pojavi */
.aboutSplit__item.reveal.is-visible::after{
  animation: cardShine 1.1s ease forwards;
}

@keyframes premiumSweep{
  0%{ left:-75%; opacity:0; }
  18%{ opacity:.9; }
  100%{ left:140%; opacity:0; }
}

@keyframes cardShine{
  0%{ left:-70%; opacity:0; }
  18%{ opacity:.9; }
  100%{ left:140%; opacity:0; }
}

/* respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .aboutSplit__item.reveal.is-visible::after{
    animation: none;
  }
}

.aboutSplit__item h4{
  margin: 0;              /* nema dodatnog pomaka */
  text-align: left;
  font-size: 1.12rem;
  line-height: 1.25;      /* bitno za optičko centriranje */
  color: #2C2420;
  letter-spacing: .08px;
}

.aboutSplit__item:hover h4{
  color: #1A1310;
}

.aboutSplit__header{
  display: flex;
  align-items: center;   /* vertikalno centriranje */
  gap: 18px;             /* razmak između ikone i naslova */
  margin-top: 0px;
}

/* ICON u benefit karticama */
.aboutSplit__icon{
  position: relative;
  overflow: visible;
  width: 48px;
  height: 48px;
  border-radius: 14px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: rgba(245,240,235,.90);
  border: 1px solid rgba(139,115,85,.28);

  flex-shrink: 0; /* da se ne smanjuje */

  transition:
    transform .45s cubic-bezier(.2,.8,.2,1),
    box-shadow .45s cubic-bezier(.2,.8,.2,1),
    border-color .45s cubic-bezier(.2,.8,.2,1),
    background .45s cubic-bezier(.2,.8,.2,1);

  transition-delay: 90ms;
}

.aboutSplit__icon::after{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius: 18px;
  background: radial-gradient(
    circle,
    rgba(228,205,150,.25),
    transparent 70%
  );
  opacity: 0;
  transition: opacity .35s ease;
  pointer-events:none;
}

.aboutSplit__item:hover .aboutSplit__icon::after{
  opacity: 1;
}

/* SVG veličina + boja */
.aboutSplit__icon svg{
  width: 22px;
  height: 22px;
  color: #8B6914;
}

.aboutSplit__item:hover .aboutSplit__icon svg{
  color: #6B4E10;
}

.aboutSplit__row{
  display: flex;
  align-items: center; /* OVO centrirа ikonu prema cijelom tekstu */
  gap: 18px;
}

.aboutSplit__text{
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.aboutSplit__text h4{
  margin: 0;
  line-height: 1.2;
}

.aboutSplit__text p{
  margin: 10px 0 0 0; /* mali razmak ispod naslova */
}

.aboutSplit__item p{
  margin: 0;
  color: #6B5E52;
  line-height: 1.7;
}

.aboutSplit__item:hover .aboutSplit__icon{
  transform: translateY(-2px) scale(1.05);

  border-color: rgba(139,115,85,.45);
  background: rgba(245,235,215,.95);

  box-shadow:
    0 6px 18px rgba(44,36,32,.12),
    0 0 14px rgba(139,115,85,.15),
    inset 0 1px 0 rgba(255,255,255,.9);
}

.aboutSplit__item:hover .aboutSplit__icon svg{
  color: #6B4E10;
  filter: drop-shadow(0 0 4px rgba(139,105,20,.25));
  transition: all .35s ease;
}

/* responsive */
@media (max-width: 900px){
  .aboutSplit__grid{ grid-template-columns: 1fr; }

  .aboutSplit__benefits{
    margin-top: -36px;
    border-top-left-radius: 22px;
    border-top-right-radius: 22px;
    padding: 92px 0 96px;
  }
}

/* =========================
   APARTMANI — EDITORIAL SHOWCASE
   ========================= */

.apartmentsS__head{
  max-width: 1100px;
  margin: 10px auto 40px;
  padding: 0;
  text-align: center;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.apartmentsS__kicker{
  margin: 0 0 12px;
  display: flex;                 /* BITNO */
  align-items: center;
  justify-content: center;
  gap: 14px;

  width: 100%;                   /* BITNO: da linije budu simetrične */

  font-weight: 950;
  letter-spacing: .8px;
  text-transform: uppercase;
  font-size: .86rem;
  color: rgba(11,27,43,.60);
}

.apartmentsS__kickerLine{
  flex: 1;                       /* BITNO: raste s obje strane */
  max-width: 110px;              /* kontrola dužine */
  height: 1px;
  border-radius: 999px;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(195,160,90,.55),
    transparent
  );
  opacity: .65;
}

@media (max-width: 520px){
  .apartmentsS__kickerLine{ max-width: 60px; }
}

.apartmentsS__kicker::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-9px;
  transform: translateX(-50%);
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(195,160,90,.60);
  box-shadow: 0 10px 26px rgba(195,160,90,.14);
  opacity: .45;
  display:none;
}

.apartmentsS__title{
  margin: 0 auto 12px;
  max-width: none;

  font-size: clamp(1.9rem, 3.2vw, 2.8rem);
  line-height: 1.15;
  letter-spacing: -0.02em;

  color: rgba(11,27,43,.92);
}

@media (min-width: 900px){
  .apartmentsS__title{
    white-space: nowrap;
  }
}

.apartmentsS__subtitle{
  margin: 0 auto;          /* BITNO: centriranje bloka */
  max-width: 48ch;

  font-size: 1.03rem;
  line-height: 1.9;
  color: rgba(11,27,43,.62);

  text-align: center;      /* BITNO: centriranje teksta */
}

.apartmentsS__pills{
  list-style: none;
  margin: 22px auto 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.apartmentsS__pill{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  padding: 7px 16px;
  border-radius: 999px;

  background: rgba(255,255,255,.72);
  border: 1px solid rgba(195,160,90,.30);
  box-shadow: 0 2px 10px rgba(10,40,70,.07);

  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .3px;
  color: rgba(11,27,43,.68);

  transition: background .2s, box-shadow .2s, transform .2s;
}

.apartmentsS__pill svg{
  color: rgba(195,160,90,.85);
  flex-shrink: 0;
}

.apartmentsS__pill:hover{
  background: rgba(255,255,255,.92);
  box-shadow: 0 4px 18px rgba(195,160,90,.18);
  transform: translateY(-1px);
}

.apartmentsS__topCtas{
  display: inline-flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 6px;
}

.apartmentsS__btnSoft{
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 14px 34px rgba(10,40,70,.08);
}

.apartmentsS__btnSoft:hover{
  transform: translateY(-1px);
}

@media (max-width: 520px){
  .apartmentsS__kickerLine{ width: 46px; }
  .apartmentsS__title{ max-width: 18ch; }
}

#apartmani{
  padding-top: 60px;   /* bilo je 90px kroz .section */
}

#apartmani.section{
  padding-top: 60px;
}

.apt{
  --apt-accent: var(--a1-accent);
  --apt-accent-soft: var(--a1-accent-soft);
  --apt-accent-border: var(--a1-accent-border);
}

.aptLux__title::after{
  background: linear-gradient(90deg, var(--apt-accent), transparent);
}
.aptLux__priceValue{ color: var(--apt-accent); }
.aptLux__euroIcon{ stroke: var(--apt-accent); }
.cap__icon svg{ color: var(--apt-accent); }
.aptLux__divider{ background: var(--apt-accent-border); }
.aptLux__check{ color: var(--apt-accent); }
.aptLux__perks li{ border-bottom: 1px solid var(--apt-accent-border); }

.aptLux__action--primary{
  border-color: var(--apt-accent-border);
  background: linear-gradient(135deg, var(--apt-accent-soft), rgba(255,255,255,.78));
}
.aptLux__action--primary .aptLux__actionText strong{ color: var(--apt-accent); }
.aptLux__action--primary .aptLux__svg{ stroke: var(--apt-accent); }

/* One apartment block */
.apt{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 26px;

  margin: 10px 0 30px 0;
  padding: 14px 18px 18px;

  border-radius: 28px;
  align-items: stretch; 

  background: rgba(255,255,255,.36);
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: 0 22px 70px rgba(10,40,70,.10);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: transform .35s ease, box-shadow .35s ease;
}

/* A2 override (maslinasto/sage) */
.apt--a2{
  --apt-accent: var(--a2-accent);
  --apt-accent-soft: var(--a2-accent-soft);
  --apt-accent-border: var(--a2-accent-border);
}

.apt--a3{
  --apt-accent: var(--a3-accent);
  --apt-accent-soft: var(--a3-accent-soft);
  --apt-accent-border: var(--a3-accent-border);
}

.apt:hover{
  transform: translateY(-6px);
  box-shadow: 0 40px 90px rgba(10,40,70,.18);
}

.apt--alt{
  grid-template-columns: .95fr 1.05fr;
}
.apt--alt .apt__media{ order: 2; }
.apt--alt .apt__body{ order: 1; }

.apt__media{
  position: relative;
  display: flex;
  flex-direction: column;

  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(10,25,40,.10);
  background: #fff;
  box-shadow: 0 20px 55px rgba(10,40,70,.12);
}

.apt__media > img{
  flex: 1;
  width:100%;
  min-height: 320px;
  object-fit: cover;
  display:block;

  transform: scale(1.01);
  transition: transform .6s ease;
}

.apt__media > img,
.apt__thumbs img { cursor: pointer; }

.apt__thumbs{
  margin-top: auto;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 12px;
  background: rgba(255,255,255,.70);
  border-top: 1px solid rgba(10,25,40,.08);
}

.apt__thumbs img{
  width:100%;
  height: 92px;
  object-fit: cover;
  display:block;

  border-radius:14px;
  border: 1px solid rgba(10,25,40,.08);
  opacity: .92;

  transition: transform .25s ease, box-shadow .25s ease;
  cursor: pointer;
}

.apt__badges{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin: 4px 0 8px;
}

.apt__badge{
  padding: 8px 10px;
  border-radius: 999px;

  background: rgba(11,27,43,.045);
  border: 1px solid rgba(11,27,43,.08);

  font-weight: 850;
  font-size: .86rem;
  color: rgba(11,27,43,.72);

  position: relative;
  border-color: rgba(195,160,90,.18);
}

.apt__lead{
  margin: 0 0 14px;
  font-size: 1.03rem;
  letter-spacing: .005em;
  color: rgba(11,27,43,.70);
  line-height: 1.85;
}

.apt__meta{
  font-weight: 800;
  color: rgba(11,27,43,.55);
  font-size: .95rem;
}

.apt__facts{
  margin: 0 0 16px;
  padding-left: 18px;
  color: rgba(11,27,43,.68);
  line-height: 1.8;
}

.apt__facts li{
  margin: 6px 0;
}

.apt__facts li strong{
  color: rgba(11,27,43,.82);
}

.apt__cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top: 8px;
}

.apt__note{
  margin: 12px 0 0;
  font-size: .92rem;
  color: rgba(11,27,43,.52);
}

/* Responsive */
@media (max-width: 900px){
  .apt{
    grid-template-columns: 1fr;
    padding: 14px;
  }
  .apt__media > img{ height: 280px; }
  .apt__thumbs img{ height: 86px; }
}

/* =========================
   MODAL (Calendar placeholder)
   ========================= */

.modal{
  position: fixed;
  inset: 0;
  z-index: 80;

  display:none;
}

.modal.is-open{
  display:block;
}

.modal__backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.30);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.modal__panel{
  position: relative;
  width: min(720px, calc(100% - 28px));
  margin: 10vh auto 0;

  border-radius: 22px;
  overflow: hidden;

  background: rgba(255,255,255,.90);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 26px 80px rgba(0,0,0,.22);

  transform: translateY(10px);
  animation: modalIn .18s ease forwards;
}

@keyframes modalIn{
  to{ transform: translateY(0); }
}

.modal__head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between; /* GURA X SKROZ DESNO */
  gap: 20px;
  position: relative;
}

/* =========================
   Floating glass close button
   ========================= */

.modal__close{
  flex-shrink: 0;
  margin-left: auto;  /* dodatno osiguranje */
  right: 0;
  top: 0;
}

.modal--details .modal__close,
.modal--gallery .modal__close{
  position: relative;

  width: 42px;
  height: 42px;
  border-radius: 50%;

  display: grid;
  place-items: center;

  font-size: 16px;
  font-weight: 600;

  background: rgba(255,255,255,55);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  border: 1px solid rgba(255,255,255,6);

  box-shadow:
    0 10px 30px rgba(10,40,70,18),
    inset 0 1px 0 rgba(255,255,255,9);

  color: rgba(11,27,43,85);

  cursor: pointer;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

.modal--details .modal__close:hover,
.modal--gallery .modal__close:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,75);
  box-shadow:
    0 16px 40px rgba(10,40,70,22),
    inset 0 1px 0 rgba(255,255,255,95);
}

.modal--gallery .modal__close span{
  font-size: 22px;
  line-height: 1;
  transform: translateY(-1px);
  display: block;
}

.modal--details .modal__close:active,
.modal--gallery .modal__close:active{
  transform: translateY(0);
}

.modal__body{
  padding: 16px 18px 18px;
}

.modal__foot{
  display:flex;
  gap: 12px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top: 16px;
}

/* =========================
   Calendar (A1/A2/A3) — editable
   ========================= */

.calHead{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding: 2px 2px 10px;
}

.calApt{
  font-weight: 900;
  opacity: .85;
}

.calMonth{
  font-weight: 900;
  font-size: 1.15rem;
  letter-spacing: .2px;
}

.calLegend{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin: 6px 0 10px;
  color: rgba(11,27,43,.68);
  font-weight: 750;
}

.calHint{
  margin-left:auto;
  font-weight: 650;
  opacity: .8;
}

.calDot{
  width:10px;height:10px;border-radius:999px;
  display:inline-block;
  border: 1px solid rgba(10,25,40,.12);
}
.calDot--free{ background: rgba(30,167,255,.35); }
.calDot--busy{ background: rgba(11,27,43,.30); }

.calWeekdays{
  display:grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap:10px;
  margin-bottom: 8px;
  font-weight: 900;
  opacity: .65;
  text-align:center;
}

.calGrid{
  display:grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 10px;
}

.calCell{
  border-radius: 14px;
  border: 1px solid rgba(10,25,40,.10);
  background: rgba(255,255,255,.78);
  padding: 10px 10px 8px;
  min-height: 64px;
  cursor: pointer;
  user-select:none;
  position: relative;
}

.calCell.is-out{
  opacity:.35;
  cursor: default;
}

.calCell.is-busy{
  opacity: .6;
  text-decoration: line-through;
}

.calCell__day{
  font-weight: 950;
  color: rgba(11,27,43,.80);
  font-size: .95rem;
}

.calCell__price{
  position: absolute;
  bottom: 7px;
  right: 9px;
  font-weight: 900;
  color: rgba(11,27,43,.70);
  font-size: 1.05rem;
}

.calCell.is-busy .calCell__price{
  opacity:.85;
}

.apt__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.22) 100%);
  opacity:.9;
}

.apt:hover .apt__media > img{
  transform: scale(1.04);
}

.apt__thumbs img:hover{
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 16px 35px rgba(0,0,0,.15);
}

/* fokus za accessibility (premium = detalji) */
.apt__thumbs img:focus{
  outline: 2px solid rgba(195,160,90,.55);
  outline-offset: 2px;
}

/* ===== Quick facts grid ===== */
.apt__quick{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin: 12px 0 14px;
}

.apt__q{
  display:flex;
  align-items:center;
  gap: 10px;

  padding: 12px 12px;
  border-radius: 16px;

  background: rgba(255,255,255,.62);
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 16px 40px rgba(10,40,70,.08);
}

.apt__q span{
  width: 36px;
  height: 36px;
  border-radius: 14px;
  display:grid;
  place-items:center;

  background: rgba(11,27,43,.045);
  border: 1px solid rgba(11,27,43,.08);
}

.apt__q strong{
  display:block;
  font-weight: 900;
  line-height: 1.1;
}

.apt__q em{
  display:block;
  font-style: normal;
  color: rgba(11,27,43,.62);
  font-weight: 700;
  font-size: .92rem;
  line-height: 1.2;
}

@media (max-width: 900px){
  .apt__quick{ grid-template-columns: 1fr; }
}

.apt__trust{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  margin-top: 12px;
  color: rgba(11,27,43,.60);
  font-weight: 800;
  font-size: .92rem;
}

.apt__trust span{
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(10,25,40,.08);
}

/* =========================
   GALLERY MODAL
   ========================= */

.modal__panel--gallery{
  width: min(980px, calc(100% - 28px));
  margin: 7vh auto 0;
}

/* Gallery header – da naslov ne bude zalijepljen i da izgleda premium */
.modal--gallery .modal__head{
  padding: 18px 22px;
  background: rgba(255,255,255,55);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,6);
  box-shadow:
    0 8px 30px rgba(10,40,70,08),
    inset 0 1px 0 rgba(255,255,255,8);
}

.modal--gallery .modal__head h3{
  margin: 0;
  font-size: 1.15rem;
  letter-spacing: -.01em;
  font-weight: 800;
}

.galleryModal__meta{
  margin-left: auto;
  margin-right: 10px;
  font-weight: 800;
  color: rgba(11,27,43,.62);
  font-size: .95rem;
}

.galleryModal__stage{
  position: relative;
  padding: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.55);
}

.galleryModal__img{
  width: 100%;
  max-height: 72vh;
  object-fit: contain;
  border-radius: 18px;
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 22px 70px rgba(10,40,70,.16);
  background: #fff;
  will-change: transform;
}

.galleryModal__stage{
  touch-action: pan-y;
}

.galleryModal__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(10,25,40,.14);
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
  font-size: 28px;
  line-height: 1;
  display: grid;
  place-items: center;
  box-shadow: 0 14px 34px rgba(10,40,70,.12);
}

.galleryModal__nav--prev{ left: 14px; }
.galleryModal__nav--next{ right: 14px; }

@media (max-width: 700px){
  .modal__panel--gallery{ margin: 6vh auto 0; }
  .galleryModal__nav{ width: 42px; height: 42px; }
}

/* Gallery: dok je otvoreno, spriječi pinch zoom i “gumeni” touch */
.modal--gallery.is-open .galleryModal__stage{
  touch-action: none; /* disable pinch + browser gestures na tom području */
}
.modal--gallery.is-open .galleryModal__img{
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: auto;
}

/* FIX: da se oba gumba vide i budu klikabilna */
.galleryModal__stage { position: relative; overflow: visible; }
.galleryModal__nav { z-index: 9999; pointer-events: auto; }
.galleryModal__nav--prev { left: 14px !important; right: auto !important; }

/* =========================
   DETAILS MODAL — BOUTIQUE
   ========================= */

.modal--details .modal__panel--details{
  width: min(860px, calc(100vw - 28px));
  position: relative;
}

.modal--details .modal__panel--details::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height: 28px;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.92));
  pointer-events:none;
}

.detailsHead h3{
  margin: 0;
  letter-spacing: -0.01em;
}

.detailsHead__meta{
  margin: 6px 0 0;
  color: rgba(11,27,43,.62);
  font-weight: 650;
  font-size: .95rem;
}

.detailsBody{
  padding-top: 14px;
}

.detailsHero{
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(195,160,90,.10), rgba(255,255,255,.66));
  border: 1px solid rgba(195,160,90,.18);
  box-shadow: 0 18px 50px rgba(10,40,70,.08);
  margin-bottom: 14px;
}

.detailsHero__badge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.66);
  border: 1px solid rgba(10,25,40,.08);
  font-weight: 850;
  color: rgba(11,27,43,.72);
}

.detailsHero__dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(195,160,90,.75);
  box-shadow: 0 8px 18px rgba(195,160,90,.25);
}

.detailsHero__lead{
  margin: 12px 0 0;
  color: rgba(11,27,43,.74);
  line-height: 1.85;
  max-width: 72ch;
}

.detailsGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.detailsCard{
  border-radius: 18px;
  background: rgba(255,255,255,.66);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 18px 45px rgba(10,40,70,.08);
  padding: 14px 14px;
}

.detailsCard h4{
  margin: 0 0 10px;
  font-size: 1.02rem;
  letter-spacing: -.01em;
}

.detailsCard--wide{
  grid-column: 1 / -1;
}

.detailsList{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

.detailsList li{
  position: relative;
  padding-left: 22px;
  color: rgba(11,27,43,.70);
  line-height: 1.55;
}

.detailsList li::before{
  content:"";
  position:absolute;
  left: 2px;
  top: 5px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(195,160,90,.18);
  box-shadow: inset 0 0 0 2px rgba(195,160,90,.26);
}

.detailsPins{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.detailsPin{
  display:flex;
  justify-content:space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(11,27,43,.03);
  border: 1px solid rgba(10,25,40,.08);
}

.detailsPin__k{
  color: rgba(11,27,43,.70);
  font-weight: 750;
}

.detailsPin__v{
  color: rgba(11,27,43,.84);
  font-weight: 950;
  white-space: nowrap;
}

.detailsFoot{
  display:flex;
  justify-content:flex-end;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(10,25,40,.08);
}

@media (max-width: 900px){
  .detailsGrid{ grid-template-columns: 1fr; }
  .detailsPins{ grid-template-columns: 1fr; }
}

/* Details hero with image */
.detailsHero--withImg{
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 14px;
  align-items: stretch;
}

.detailsHero__media{
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 18px 45px rgba(10,40,70,.10);
  background: rgba(255,255,255,.55);
  min-height: 190px;
  position: relative;
}

.detailsHero__media::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.04),
    rgba(255,255,255,.18)
  );
  pointer-events:none;
}

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

.detailsHero__content{
  display: grid;
  align-content: start;
  gap: 10px;
}

/* Mobile: image on top */
@media (max-width: 900px){
  .detailsHero--withImg{
    grid-template-columns: 1fr;
  }
  .detailsHero__media{
    min-height: 210px;
  }
}

/* =========================
   PERFECT CENTERED DETAILS MODAL
   ========================= */

/* cijeli modal overlay koristi flex centriranje */
.modal--details{
  display: none;
  position: fixed;
  inset: 0;
  z-index: 80;

  align-items: center;
  justify-content: center;
  padding: 48px 32px;
}

.modal--details.is-open{
  display: flex;
}

/* header ostaje sticky */
.modal--details .modal__head{
  position: sticky;
  top: 0;
  z-index: 5;

  padding: 18px 22px;

  background: rgba(255,255,255,.55);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);

  border-bottom: 1px solid rgba(255,255,255,.6);

  box-shadow:
    0 8px 30px rgba(10,40,70,.08),
    inset 0 1px 0 rgba(255,255,255,.8);
}

.modal--details .detailsHead h3{
  font-size: 1.15rem;
  letter-spacing: -.01em;
  font-weight: 800;
}

.modal--details .detailsHead__meta{
  margin-top: 6px;
  font-size: .92rem;
  color: rgba(11,27,43,.65);
  font-weight: 600;
}

.modal--details .modal__head::after{
  content:"";
  display:block;
  height: 1px;
  margin-top: 14px;
  background: linear-gradient(
    90deg,
    rgba(195,160,90,.6),
    rgba(195,160,90,.15)
  );
}

@keyframes detailsIn{
  from{
    opacity:0;
    transform: translateY(8px) scale(.98);
  }
  to{
    opacity:1;
    transform: translateY(0) scale(1);
  }
}

/* =========================
   DETAILS MODAL — true centering fix
   (ukloni globalni margin:10vh)
   ========================= */

/* details modal overlay - hidden by default */
.modal--details{
  display: none;              /* važno: da nije stalno prikazan */
  position: fixed;
  inset: 0;
  z-index: 80;

  align-items: center;
  justify-content: center;
  padding: 24px;              /* jednako gore i dolje */
}

/* otvoreno stanje */
.modal--details.is-open{
  display: flex;
}

/* OVODIJE JE KLJUČ: makni globalni margin s .modal__panel */
.modal--details .modal__panel{
  margin: 0 !important;       /* pregazi margin:10vh auto 0 */
}

/* panel visina + layout */
.modal--details .modal__panel--details{
  width: min(860px, 100%);
  max-height: calc(100dvh - 96px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* scroll samo unutar body */
.modal--details .detailsBody{
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 12px;
}

/* =========================
   APARTMAN A1 — FINAL (single block)
   Zalijepi na KRAJ style.css
   ========================= */

/* oba stupca nek se rastegnu na istu visinu */
.apt__media,
.apt__body{
  height: 100%;
}

.apt--a1 .apt__features li{
  padding: 12px 0;
  border-bottom: 1px solid var(--a1-accent-border);
}

.apt--a1 .apt__features li:last-child{
  border-bottom: 1px solid var(--a1-accent-border); /* zadrži liniju i ispod Wi-Fi */
}

.apt--a1 .btn--reserve:hover{
  transform: translateY(-2px);
  box-shadow: 
    0 25px 60px rgba(31,58,95,.45);
}

/* 2) A1 body layout */
.apt__body--lux{
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(8px);
  border:1px solid rgba(255,255,255,.6);
  box-shadow: 0 30px 80px rgba(10,40,70,.12);
  border-radius:28px;
  padding:34px;
}

/* A1 header: naslov + cijena ispod, desno badge 2+2 */
.aptLux__head{
  display:flex;
  justify-content:space-between;
  align-items: baseline; /* umjesto center ili flex-start */
  gap:20px;
  margin-bottom:18px;
}

.aptLux__titleBlock{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.aptLux__title{
  font-size: 1.85rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0b1b2b;
  line-height: 1.15;
  position: relative;

  display: inline-block; /* bitno: da underline prati samo tekst */
}

.aptLux__title::after{
  content:"";
  display:block;
  width: 100%;           /* <-- OVO je ono što želiš */
  height: 3px;
  margin-top: 10px;
  border-radius: 99px;

  background: linear-gradient(
    90deg,
    var(--a1-accent),
    rgba(31,58,95,35)
  );
}

.aptLux__price{
  display:flex;
  align-items:center;
  gap:10px;

  font-size:.95rem;
  font-weight:700;
  color:rgba(11,27,43,.65);
}

.aptLux__priceMain{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.aptLux__priceValue{
  font-weight:550;
  font-size:1.15rem;
  color:var(--a1-accent);
  letter-spacing:.01em;
}

.aptLux__euroIcon{
  width:18px;
  height:18px;
  stroke:var(--a1-accent);
  opacity:.95;
}

.aptLux__priceFrom,
.aptLux__priceUnit{
  opacity:.85;
}

/* ako ti još uvijek postoji ova crta ispod cijene — ugasi je */
.aptLux__price::after{ content:none; }

/* Kapacitet badge: učini "4 osobe" glavnim, "2+2" sekundarnim */
.aptLux__cap{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 0;              /* makni osjećaj gumba */
  border: 0;
  background: transparent; /* bez pozadine */
  box-shadow: none;        /* bez sjene */
  border-radius: 0;

  color: #0b1b2b;          /* normalan tekst (ili var(--text)) */
}

.aptLux__cap svg,
.aptLux__cap i{
  position: relative;
  top: 1px; /* sitno spuštanje ako treba */
}

.aptLux__cap .cap__sub{
  font-weight: 600;
  font-size: 1rem;   /* <-- malo veće */
  opacity: .75;
  line-height: 1;
}

/* Overlay badge na slici */
.apt__capOverlay{
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;

  padding: 10px 12px;
  border-radius: 999px;

  font-weight: 900;
  font-size: .92rem;
  letter-spacing: .02em;

  color: #0b1b2b;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(10,25,40,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  box-shadow: 0 14px 34px rgba(10,40,70,.14);
}

.aptLux__cap:hover{
  transform: none !important;
  box-shadow: none !important;
  background: transparent !important;
  cursor: default;
}

/* 4) opis */
.aptLux__desc p{
  margin: 0;
  max-width: 62ch;
  font-size: 1.05rem;
  line-height: 1.9;
  color: rgba(11,27,43,.70);
}

.aptLux__divider{
  height: 1px;
  background: var(--a1-accent-border);  /* <-- ovo */
  margin: 6px 0 18px;
}

.aptLux__cap .cap__top{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  font-weight: 700;
  font-size: 1.02rem;   /* <-- povećano */
  line-height: 1;
}

.cap__icon{
  font-size: 1.2em;  /* 👈 OVO će sigurno povećati ikonu */
  display: inline-flex;
  align-items: center;
}

.cap__icon svg{
  width: 22px;
  height: 22px;
  color: var(--a1-accent);   /* A1 plava */
}

.aptLux__cap .cap__top::first-letter{
  line-height: 1; /* dodatno smiri emoji baseline */
  font-size: 1.3em;
}

@media (max-width: 700px){
  .aptLux__head{
    align-items: flex-start;
  }
  .aptLux__cap{
    padding: 9px 14px;
    font-size: .95rem;
  }
}

/* Mobile */
@media (max-width: 700px){
  .aptLux__facts{
    grid-template-columns: 1fr;
    gap: 22px;
  }
}

/* A1 — PERKS (4 stavke s check ikonom) */
.aptLux__perks{
  list-style: none;
  padding: 0;
  margin: 6px 0 0;
  margin-bottom: 0;

  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.aptLux__perks li{
  padding: 8px 0;
  border-bottom: 1px solid var(--a1-accent-border);
}

.aptLux__perks li:last-child{
  border-bottom: 0;
}

.aptLux__check{
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: var(--a1-accent); /* A1 plava */
}

.aptLux__perks span{
  font-size: .92rem;
  font-weight: 900;
  letter-spacing: .08em;
  color: rgba(11,27,43,.78);
}

/* Mobile: Kapacitet/Raspored u 1 kolonu */
@media (max-width: 700px){
  .aptLux__facts{
    grid-template-columns: 1fr;
  }
}

/* 6) ACTIONS: niži gumbi */
.aptLux__actions{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;

  margin-top: auto; /* gurne gumbe dolje da desni stupac lijepo popuni visinu */
}

.aptLux__action{
  display: flex;
  align-items: center;
  gap: 10px;

  padding: 10px 12px;    /* NIŽE */
  border-radius: 16px;

  background: rgba(255,255,255,.62);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 16px 40px rgba(10,40,70,.08);

  text-decoration: none;
  color: inherit;
  cursor: pointer;

  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}

.aptLux__action:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.78);
  border-color: rgba(10,25,40,.14);
  box-shadow: 0 22px 54px rgba(10,40,70,.12);
}

.aptLux__icon{
  width: 32px;
  height: 32px;
  border-radius: 12px;
  display: grid;
  place-items: center;

  background: rgba(255,255,255,.75);
  border: 1px solid rgba(10,25,40,.10);
}

.aptLux__svg{
  width: 16px;
  height: 16px;
  display: block;

  fill: none;
  stroke: rgba(11,27,43,.72);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* primary (rezerviraj) */
.aptLux__action--primary{
  border-color: var(--a1-accent-border);

  background: linear-gradient(
    135deg,
    var(--a1-accent-soft),
    rgba(255,255,255,.78)
  );
}

/* da tekst i ikona budu A1 */
.aptLux__action--primary .aptLux__actionText strong{
  color: var(--a1-accent);
}

.aptLux__action--primary .aptLux__svg{
  stroke: var(--a1-accent);
}

.aptLux__actionText strong{
  font-weight: 750; /* manje “debel” */
  letter-spacing: .1px;
}

/* mobile */
@media (max-width: 900px){
  .apt__media > img{
    min-height: 260px;
  }

  .aptLux__head{
    flex-direction: column;
    align-items: flex-start;
  }

  .aptLux__price{
    text-align: left;
  }

  .aptLux__actions{
    grid-template-columns: 1fr;
  }
}

/* ===== Apartman A1 – premium fix ===== */

.apt__body h3{
  font-family: 'Playfair Display', serif;
  font-weight: 600;
  font-size: 2.2rem;          /* VEĆE */
  letter-spacing: -0.4px;
  margin-bottom: 6px;
  color: #0b1b2b;
  margin-top: 0;
}

/* A1 dio malo naglasi */
.apt__body h3 span{
  font-size: 1.15em;          /* povećava A1 */
  font-weight: 700;
}

/* Plava gradijent linija */
/* ===== Premium tapered underline ===== */

.apt__body h3::after{
  content:"";
  display:block;
  width: 150px;
  height: 2px;
  margin-top: 12px;

  background: linear-gradient(
    90deg,
    var(--a1-accent) 0%,
    var(--a1-accent) 35%,
    rgba(31,58,95,.6) 65%,
    rgba(31,58,95,0) 100%
  );

  /* sužavanje u špic */
  clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);

  border-radius: 2px;
}

/* ==== FORCE per-apartment accent (override hardcoded A1 styles) ==== */
.apt .aptLux__title::after{
  background: linear-gradient(90deg, var(--apt-accent), transparent) !important;
}
.apt .aptLux__priceValue{ color: var(--apt-accent) !important; }
.apt .aptLux__euroIcon{ stroke: var(--apt-accent) !important; }
.apt .aptLux__divider{ background: var(--apt-accent-border) !important; }
.apt .cap__icon svg{ color: var(--apt-accent) !important; }
.apt .aptLux__perks li{ border-bottom-color: var(--apt-accent-border) !important; }
.apt .aptLux__check{ color: var(--apt-accent) !important; }

/* primary button */
.apt .aptLux__action--primary{
  border-color: var(--apt-accent-border) !important;
  background: linear-gradient(135deg, var(--apt-accent-soft), rgba(255,255,255,.78)) !important;
}
.apt .aptLux__action--primary .aptLux__actionText strong{ color: var(--apt-accent) !important; }
.apt .aptLux__action--primary .aptLux__svg{ stroke: var(--apt-accent) !important; }

/* ===== Luxury Accent Edge ===== */

.apt{
  position: relative;
  overflow: hidden;
}

/* suptilan glow */
.apt{
  box-shadow: 0 10px 30px rgba(0,0,0,0.04);
  border: 1px solid var(--apt-accent-border);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.apt:hover{
  transform: translateY(-4px);
  box-shadow: 
    0 14px 35px rgba(0,0,0,0.06),
    0 0 0 1px var(--apt-accent-border);
}

/* ============================= */
/* ULTRA PREMIUM HOTEL STYLE */
/* ============================= */

.apt{
  position: relative;
  border-radius: 28px;
  border: 1px solid rgba(0,0,0,0.04);
  
  /* suptilan tint */
  background: 
    radial-gradient(
      1200px 400px at -10% -20%,
      var(--apt-accent-soft),
      transparent 60%
    ),
    #ffffff;
  
  box-shadow:
    0 8px 30px rgba(0,0,0,0.04),
    0 2px 8px rgba(0,0,0,0.03);
  
  transition: 
    transform 0.4s cubic-bezier(.16,.8,.24,1),
    box-shadow 0.4s ease,
    background 0.4s ease;
}

/* luksuzni hover */
.apt:hover{
  transform: translateY(-6px);
  
  box-shadow:
    0 18px 45px rgba(0,0,0,0.08),
    0 4px 15px rgba(0,0,0,0.05);
  
  background:
    radial-gradient(
      900px 350px at 0% 0%,
      var(--apt-accent-soft),
      transparent 70%
    ),
    #ffffff;
}

.apt::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:1px;
  background: linear-gradient(
    to right,
    transparent,
    var(--apt-accent-border),
    transparent
  );
}

/* ============================= */
/* FULL PREMIUM CTA BUTTONS */
/* ============================= */

/* zajednički stil za sve action gumbe */
.apt .aptLux__action{
  border-radius: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.70);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
  transition: transform .25s cubic-bezier(.16,.8,.24,1), box-shadow .25s ease, border-color .25s ease;
}

.apt .aptLux__action:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.08);
  border-color: rgba(0,0,0,0.12);
}

/* PRIMARY = Rezerviraj */
.apt .aptLux__action--primary{
  border: 1px solid var(--apt-accent-border);
  background:
    radial-gradient(800px 260px at 20% 20%, var(--apt-accent-soft), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,0.92), rgba(255,255,255,0.72));
}

.apt .aptLux__action--primary .aptLux__actionText strong{
  color: var(--apt-accent);
  letter-spacing: .2px;
}

.apt .aptLux__action--primary .aptLux__svg{
  stroke: var(--apt-accent);
}

/* premium focus (kad dođe tipkovnicom) */
.apt .aptLux__action:focus-visible{
  outline: none;
  box-shadow:
    0 14px 30px rgba(0,0,0,0.10),
    0 0 0 3px var(--apt-accent-soft);
}

/* sekundarni (Detalji / Kalendar) — tiši */
.apt .aptLux__action:not(.aptLux__action--primary){
  background: rgba(255,255,255,0.60);
}

.apt .aptLux__action:not(.aptLux__action--primary):hover{
  background: rgba(255,255,255,0.78);
}

.apt .aptLux__action--primary:hover{
  box-shadow:
    0 16px 34px rgba(0,0,0,0.10),
    0 0 0 1px var(--apt-accent-border);
}

/* =========================
   UI cleanup: remove thin borders around action buttons
   (Detalji / Kalendar)
   ========================= */

/* makni “tanke crte” (border) na sekundarnim gumbima */
.apt .aptLux__action:not(.aptLux__action--primary){
  border-color: transparent;
}

/* i na ikonicama unutar gumba (ako ti se vidi rub) */
.apt .aptLux__action:not(.aptLux__action--primary) .aptLux__icon{
  border-color: transparent;
}

/* Apartment identity colors: Sunset / Olive / Azure */
.apt > *{
  position: relative;
  z-index: 1;
}

.apt::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, var(--apt-accent-soft), transparent 46%),
    radial-gradient(520px 260px at 8% 12%, var(--apt-accent-soft), transparent 72%);
  opacity: .9;
}

.apt--alt::before{
  background:
    linear-gradient(270deg, var(--apt-accent-soft), transparent 46%),
    radial-gradient(520px 260px at 92% 12%, var(--apt-accent-soft), transparent 72%);
}

.apt .aptLux__title span{
  color: var(--apt-accent);
}

.apt .aptLux__chip,
.apt .aptLux__cap{
  border-color: var(--apt-accent-border);
  background:
    linear-gradient(135deg, rgba(255,255,255,.82), var(--apt-accent-soft));
}

.apt .apt__media{
  border-color: var(--apt-accent-border);
}

.apt:hover .apt__media > img{
  transform: scale(1.035);
}

/* Keep the hero image hover independent from the whole apartment card. */
.apt .apt__media > img{
  transform: scale(1);
  transition: transform .25s cubic-bezier(.16,.8,.24,1);
}

.apt:hover .apt__media > img{
  transform: scale(1);
}

.apt .apt__media > img:hover{
  transform: scale(1.04);
}

/* =========================
   APARTMENT CARD — PREMIUM EXTRAS
   ========================= */

/* Number badge (01, 02, 03) on image */
.apt__numBadge{
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 6;

  width: 46px;
  height: 46px;
  border-radius: 50%;

  display: grid;
  place-items: center;

  background: rgba(255,255,255,.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.70);
  box-shadow: 0 6px 22px rgba(0,0,0,.18);

  font-weight: 900;
  font-size: .78rem;
  letter-spacing: .08em;
  color: var(--apt-accent);

  pointer-events: none;
  user-select: none;
}

/* Image caption overlay at bottom of hero image (above thumbs) */
.apt__imageCaption{
  position: absolute;
  bottom: 116px;    /* above the thumbs strip */
  left: 0;
  right: 0;
  z-index: 5;

  padding: 28px 18px 10px;
  background: linear-gradient(
    0deg,
    rgba(0,0,0,.52) 0%,
    transparent 100%
  );

  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .55px;
  text-transform: uppercase;
  color: rgba(255,255,255,.88);

  pointer-events: none;
  user-select: none;
}

/* Decorative watermark number in body */
.apt__body--lux{
  position: relative;
  overflow: hidden;
}

.apt__bodyWm{
  position: absolute;
  top: -28px;
  right: -18px;
  z-index: 0;

  font-size: 10rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.06em;

  color: var(--apt-accent);
  opacity: .042;

  pointer-events: none;
  user-select: none;

  font-family: 'Playfair Display', serif;
  font-style: italic;
}

/* Ensure body content sits above watermark */
.apt__body--lux > *:not(.apt__bodyWm){
  position: relative;
  z-index: 1;
}

/* Chips base styling */
.aptLux__chips{
  list-style: none;
  padding: 0;
  margin: 14px 0 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aptLux__chip{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 3px 10px rgba(10,40,70,.06);
  font-size: .80rem;
  font-weight: 700;
  color: rgba(11,27,43,.72);
  letter-spacing: .12px;
  transition: transform .18s ease, box-shadow .18s ease;
}

.aptLux__chip:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(10,40,70,.10);
}

.aptLux__chip svg{
  flex-shrink: 0;
  color: var(--apt-accent);
}

/* =========================
   LOKACIJA SECTION
   ========================= */

.lokacijaSection{
  scroll-margin-top: 110px;
}

/* Header */
.lokHead{
  text-align: center;
  margin-bottom: 32px;
}

.lokHead__pill{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid rgba(10,25,40,.12);
  border-radius: 999px;
  padding: 6px 16px;
  font-size: .78rem;
  font-weight: 650;
  color: rgba(11,27,43,.55);
  letter-spacing: .4px;
  margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(10,25,40,.06);
}

.lokHead__titleRow{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.lokHead__pinBal{
  width: 30px;
  flex-shrink: 0;
}

.lokHead__pin{
  display: flex;
  align-items: center;
  line-height: 1;
  flex-shrink: 0;
}

.lokHead__title{
  margin: 0;
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 800;
  line-height: 1.15;
  color: rgba(11,27,43,.92);
  letter-spacing: -.4px;
}

.lokHead__sub{
  margin: 0 0 28px;
  font-size: clamp(.92rem, 1.4vw, 1.05rem);
  font-weight: 400;
  color: rgba(11,27,43,.45);
  letter-spacing: .01em;
}

/* Slim address line above map */
.lokAddrBar{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 14px;
}

.lokAddrBar__icon{
  color: rgba(11,27,43,.45);
  flex-shrink: 0;
  display: block;
}

.lokAddrBar__label{
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  color: rgba(11,27,43,.45);
  text-transform: uppercase;
}

.lokAddrBar__sep{
  color: rgba(11,27,43,.3);
  font-size: .85rem;
}

.lokAddrBar__addr{
  font-size: .93rem;
  font-weight: 600;
  color: rgba(11,27,43,.72);
}

/* Info row: address + distances */
.lokInfoRow{
  display: grid;
  grid-template-columns: 1fr 1.65fr;
  gap: 18px;
  margin-bottom: 18px;
}

/* Address card */
.lokAddr{
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 8px 30px rgba(10,40,70,.07);
  padding: 28px 26px;
  display: flex;
  align-items: flex-start;
  gap: 18px;
}

.lokAddr__iconWrap{
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: rgba(10,25,40,.05);
  border: 1px solid rgba(10,25,40,.10);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: rgba(11,27,43,.50);
}

.lokAddr__body{
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.lokAddr__label{
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: rgba(11,27,43,.38);
  margin: 0 0 4px;
}

.lokAddr__street{
  font-size: 1.45rem;
  font-weight: 900;
  color: rgba(11,27,43,.88);
  margin: 0;
  line-height: 1.15;
  letter-spacing: -.2px;
}

.lokAddr__place{
  font-size: .88rem;
  color: rgba(11,27,43,.50);
  font-weight: 500;
  margin: 0 0 12px;
}

.lokAddr__badge{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(36,124,159,.09);
  border: 1px solid rgba(36,124,159,.22);
  border-radius: 999px;
  padding: 5px 13px;
  font-size: .78rem;
  font-weight: 650;
  color: #247c9f;
  width: fit-content;
}

/* Distances card */
.lokDCard{
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 8px 30px rgba(10,40,70,.07);
  padding: 22px 24px;
}

.lokDCard__title{
  font-size: .92rem;
  font-weight: 750;
  color: rgba(11,27,43,.72);
  margin: 0 0 16px;
}

.lokDCard__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.lokDCard__item{
  background: rgba(10,25,40,.025);
  border: 1px solid rgba(10,25,40,.07);
  border-radius: 14px;
  padding: 12px 14px 13px;
}

.lokDCard__itemHead{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .76rem;
  font-weight: 600;
  color: rgba(11,27,43,.50);
  margin-bottom: 7px;
}

.lokDCard__val{
  display: block;
  font-size: 1.38rem;
  font-weight: 900;
  color: rgba(11,27,43,.88);
  line-height: 1.1;
  letter-spacing: -.3px;
  margin-bottom: 2px;
}

.lokDCard__note{
  display: block;
  font-size: .72rem;
  font-weight: 650;
  color: #c46b45;
  margin-bottom: 9px;
}

.lokDCard__bar{
  height: 4px;
  background: rgba(10,25,40,.08);
  border-radius: 4px;
  overflow: hidden;
}

.lokDCard__fill{
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, #c46b45, #e8895f);
}

/* Full-width map */
.lokMapFull{
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 12px 40px rgba(10,40,70,.10);
  margin-bottom: 32px;
}

.lokMapFull iframe{
  width: 100%;
  height: 500px;
  border: 0;
  display: block;
}

/* ── Okolna mjesta + Prirodne atrakcije ───────────────── */
.lokNearby{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-bottom: 32px;
  align-items: stretch;
}

.lokNearby__head{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}

.lokNearby__headIcon{
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.lokNearby__headIcon--blue{
  background: rgba(36,124,159,.12);
  color: #247c9f;
}
.lokNearby__headIcon--green{
  background: rgba(47,133,90,.12);
  color: #2f855a;
}

.lokNearby__headTitle{
  font-size: 1.08rem;
  font-weight: 750;
  color: rgba(11,27,43,.88);
  margin: 0;
}

/* Column: flex column so grid + list fill height */
.lokNearby__col{
  display: flex;
  flex-direction: column;
}

/* 2-col grid of place rows */
.lokNearbyGrid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: 1fr;
  gap: 8px;
  flex: 1;
}

.lokNearbyRow{
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid rgba(10,25,40,.08);
  border-radius: 12px;
  padding: 11px 14px;
  transition: box-shadow .18s, border-color .18s;
}
.lokNearbyRow:hover{
  border-color: rgba(10,25,40,.15);
  box-shadow: 0 4px 14px rgba(10,40,70,.07);
}

.lokNearbyRow__icon{
  color: rgba(11,27,43,.38);
  flex-shrink: 0;
  display: flex;
}

.lokNearbyRow__name{
  flex: 1;
  font-size: .9rem;
  font-weight: 600;
  color: rgba(11,27,43,.80);
}

.lokNearbyRow__km{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .78rem;
  font-weight: 700;
  color: #000000;
  background: rgba(36,124,159,.10);
  border-radius: 999px;
  padding: 3px 10px;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Nature attraction cards */
.lokNatureList{
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.lokNatureCard{
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 1px solid rgba(10,25,40,.08);
  border-radius: 12px;
  padding: 11px 14px;
  flex: 1;
  transition: box-shadow .18s, border-color .18s;
}
.lokNatureCard:hover{
  border-color: rgba(10,25,40,.15);
  box-shadow: 0 4px 14px rgba(10,40,70,.07);
}

.lokNatureCard__iconWrap{
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.lokNatureCard__iconWrap--green{
  background: rgba(47,133,90,.11);
  color: #2f855a;
}
.lokNatureCard__iconWrap--blue{
  background: rgba(36,124,159,.11);
  color: #247c9f;
}
.lokNatureCard__iconWrap--amber{
  background: rgba(180,110,30,.11);
  color: #b46a1e;
}

.lokNatureCard__name{
  flex: 1;
  font-size: .9rem;
  font-weight: 620;
  color: rgba(11,27,43,.82);
}

.lokNatureCard__dist{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(47,133,90,.10);
  color: #2a7a4f;
  font-size: .78rem;
  font-weight: 700;
  border-radius: 999px;
  padding: 3px 10px;
  white-space: nowrap;
  flex-shrink: 0;
}

/* 4 category cards */
.lokCats{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}

.lokCat{
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 6px 24px rgba(10,40,70,.07);
  padding: 18px 18px 14px;
  transition: transform .22s ease, box-shadow .22s ease;
}

.lokCat:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(10,40,70,.11);
}

.lokCat__head{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid rgba(10,25,40,.07);
}

.lokCat__icon{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(196,107,69,.10);
  border: 1px solid rgba(196,107,69,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #c46b45;
}

.lokCat__icon--nature{
  background: rgba(36,124,159,.10);
  border-color: rgba(36,124,159,.20);
  color: #247c9f;
}

.lokCat__title{
  font-size: .88rem;
  font-weight: 750;
  color: rgba(11,27,43,.82);
  margin: 0;
}

.lokCat__list{
  list-style: none;
  padding: 0;
  margin: 0;
}

.lokCat__list li{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid rgba(10,25,40,.05);
}
.lokCat__list li:last-child{ border-bottom: none; }

.lokCat__item{
  font-size: .85rem;
  font-weight: 500;
  color: rgba(11,27,43,.70);
}

.lokCat__item--np{
  font-weight: 700;
  color: #247c9f;
}

.lokCat__dist{
  font-size: .80rem;
  font-weight: 750;
  color: #1a7db5;
  white-space: nowrap;
}

.lokCat__dist--np{
  color: #247c9f;
  background: rgba(36,124,159,.10);
  border-radius: 20px;
  padding: 2px 8px;
}

/* 3 why/feature cards */
.lokWhy{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.lokWhy__card{
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(10,25,40,.08);
  box-shadow: 0 6px 24px rgba(10,40,70,.07);
  padding: 28px 22px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  transition: transform .22s ease, box-shadow .22s ease;
}

.lokWhy__card:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(10,40,70,.11);
}

.lokWhy__icon{
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: rgba(196,107,69,.09);
  border: 1px solid rgba(196,107,69,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #c46b45;
  margin-bottom: 2px;
}

.lokWhy__title{
  font-size: .98rem;
  font-weight: 800;
  color: rgba(11,27,43,.88);
  margin: 0;
}

.lokWhy__desc{
  font-size: .86rem;
  color: rgba(11,27,43,.58);
  line-height: 1.65;
  margin: 0;
}

/* Responsive */
@media (max-width: 900px){
  .lokInfoRow{
    grid-template-columns: 1fr;
  }
  .lokAddr{
    padding: 22px 20px;
  }
  .lokCats{
    grid-template-columns: repeat(2, 1fr);
  }
  .lokMapFull iframe{
    height: 360px;
  }
  .lokNearby{
    grid-template-columns: 1fr;
  }
  .lokNearbyGrid{
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 600px){
  .lokDCard__grid{
    grid-template-columns: 1fr 1fr;
  }
  .lokWhy{
    grid-template-columns: 1fr;
  }
  .lokCats{
    grid-template-columns: 1fr 1fr;
  }
  .lokMapFull iframe{
    height: 280px;
  }
  .lokNearbyGrid{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 420px){
  .lokCats{
    grid-template-columns: 1fr;
  }
  .lokDCard__grid{
    grid-template-columns: 1fr;
  }
  .lokNearbyGrid{
    grid-template-columns: 1fr;
  }
}

/* =========================
   RECENZIJE SECTION
   ========================= */

.revSection{
  scroll-margin-top: 110px;
}

/* Head */
.revHead{
  text-align: center;
  margin-bottom: 52px;
}

.revHead__kicker{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 0 0 14px;

  font-weight: 900;
  font-size: .82rem;
  letter-spacing: .75px;
  text-transform: uppercase;
  color: rgba(11,27,43,.55);
}

.revHead__line{
  flex: 1;
  max-width: 100px;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(195,160,90,.55), transparent);
  opacity: .65;
}

.revHead__title{
  margin: 0 auto 22px;
  max-width: 540px;
  font-size: clamp(1.7rem, 2.8vw, 2.4rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: rgba(11,27,43,.92);
}

.revHead__sub{
  margin: 0 auto 28px;
  max-width: 50ch;
  font-size: 1.01rem;
  line-height: 1.8;
  color: rgba(11,27,43,.60);
}

/* Badge block — one row, no background */
.revHead__badge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.revHead__gLogo{
  flex-shrink: 0;
}

.revHead__score{
  font-size: 1.55rem;
  font-weight: 900;
  color: rgba(11,27,43,.88);
  line-height: 1;
  letter-spacing: -0.02em;
}

.revHead__stars{
  display: flex;
  gap: 2px;
  color: #f5a623;
  font-size: 1rem;
}

.revHead__based{
  font-size: .82rem;
  color: rgba(11,27,43,.48);
  font-weight: 600;
  letter-spacing: .1px;
  white-space: nowrap;
  padding-left: 4px;
  border-left: 1px solid rgba(11,27,43,.18);
  margin-left: 2px;
}

/* Grid */
/* Slider wrapper */
.revSlider{
  position: relative;
  display: flex;
  align-items: center;
  gap: 0;
}

.revSlider__track{
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 8px 4px 16px;
  flex: 1;
}
.revSlider__track::-webkit-scrollbar{
  display: none;
}

.revSlider__btn{
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(10,25,40,.12);
  background: #fff;
  box-shadow: 0 4px 14px rgba(10,40,70,.10);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: rgba(11,27,43,.70);
  transition: background .18s, box-shadow .18s, color .18s;
  z-index: 2;
}
.revSlider__btn:hover{
  background: rgba(11,27,43,.06);
  box-shadow: 0 6px 20px rgba(10,40,70,.15);
  color: rgba(11,27,43,.92);
}
.revSlider__btn--prev{ margin-right: 10px; }
.revSlider__btn--next{ margin-left: 10px; }

/* Card */
.revCard{
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 0 0 320px;
  scroll-snap-align: start;

  padding: 26px 24px;
  border-radius: 22px;

  background: rgba(255,255,255,.82);
  border: 1px solid rgba(10,25,40,.09);
  box-shadow: 0 8px 30px rgba(10,40,70,.08);

  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  transition: transform .28s ease, box-shadow .28s ease;
}

.revCard:hover{
  transform: translateY(-5px);
  box-shadow: 0 22px 58px rgba(10,40,70,.14);
}

/* Card header: avatar + meta + stars */
.revCard__header{
  display: flex;
  align-items: center;
  gap: 12px;
}

.revCard__avatar{
  width: 44px;
  height: 44px;
  border-radius: 50%;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 1rem;
  color: #fff;
  background: var(--av-bg, #8B7355);
  box-shadow: 0 6px 16px rgba(0,0,0,.16);
  letter-spacing: .02em;
}

.revCard__meta{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.revCard__name{
  font-weight: 800;
  font-size: .95rem;
  color: rgba(11,27,43,.88);
}

.revCard__loc{
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: .78rem;
  color: rgba(11,27,43,.52);
  font-weight: 500;
}

.revCard__flag{
  font-size: .9rem;
  line-height: 1;
  flex-shrink: 0;
  border-radius: 2px;
  overflow: hidden;
}

.revCard__stars{
  color: #f5a623;
  font-size: .9rem;
  letter-spacing: 1px;
  flex-shrink: 0;
}

/* Quote text */
.revCard__text{
  margin: 0;
  padding: 0;
  border: 0;
  font-size: .93rem;
  line-height: 1.82;
  color: rgba(11,27,43,.68);
  font-style: normal;
  flex: 1;
}

/* Footer: apartment tag + date */
.revCard__footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid rgba(10,25,40,.07);
}

.revCard__apt{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(195,160,90,.25);
  font-size: .75rem;
  font-weight: 750;
  color: rgba(11,27,43,.70);
  letter-spacing: .2px;
}

.revCard__apt::before{
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(195,160,90,.65);
  flex-shrink: 0;
}

.revCard__date{
  font-size: .76rem;
  color: rgba(11,27,43,.45);
  font-weight: 600;
}

@media (max-width: 600px){
  .revCard{
    flex: 0 0 280px;
  }
  .revSlider__btn{
    display: none;
  }
}

/* =========================
   APARTMENT CARDS — CLEAN REDESIGN
   ========================= */

/* Price badge overlaid on hero image — subtle glass pill */
.apt__priceBadge{
  position: absolute;
  bottom: 126px;   /* above the thumbs strip */
  right: 16px;
  z-index: 6;

  display: inline-flex;
  align-items: baseline;
  gap: 3px;

  padding: 7px 16px;
  border-radius: 999px;

  background: rgba(255,251,243,.84);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255,240,200,.60);
  color: var(--apt-accent);
  font-size: .80rem;
  font-weight: 600;
  letter-spacing: .1px;

  box-shadow: 0 4px 14px rgba(0,0,0,.13);

  pointer-events: none;
  user-select: none;
}

.apt__priceBadge strong{
  font-weight: 800;
  font-size: .96rem;
}

/* Clean body */
.apt__body--clean{
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 26px 70px rgba(10,40,70,.11);
  border-radius: 26px;
  padding: 30px 32px 26px;

  display: flex;
  flex-direction: column;
}

/* Apartment name */
.apt__name{
  font-family: 'Playfair Display', serif;
  font-size: 1.95rem;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: #0b1b2b;
  line-height: 1.15;
  margin: 0 0 4px;
}

.apt__name span{
  color: var(--apt-accent);
}

.apt__name::after{
  content: "";
  display: block;
  width: 48px;
  height: 2px;
  margin-top: 10px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--apt-accent), transparent);
}

/* Short description */
.apt__shortDesc{
  margin: 10px 0 20px;
  font-size: .96rem;
  line-height: 1.78;
  color: rgba(11,27,43,.62);
}

/* Capacity specs row */
.apt__specs{
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 14px 0;
  border-top: 1px solid rgba(10,25,40,.07);
  border-bottom: 1px solid rgba(10,25,40,.07);
  margin-bottom: 16px;
}

.apt__spec{
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: .86rem;
  font-weight: 700;
  color: rgba(11,27,43,.68);
  white-space: nowrap;
}

.apt__spec svg{
  color: var(--apt-accent);
  flex-shrink: 0;
  opacity: .90;
}

/* Amenity checklist — 2×2 grid, fills horizontal space */
.apt__checklist{
  list-style: none;
  margin: 0 0 26px;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px 18px;
}

.apt__checklist li{
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: .93rem;
  font-weight: 650;
  color: rgba(11,27,43,.72);
  padding: 11px 0;
  border-bottom: 1px solid rgba(10,25,40,.055);
}

.apt__checklist li::before{
  content: "";
  display: inline-block;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: rgba(195,160,90,.11);
  border: 1.5px solid rgba(195,160,90,.28);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%23b8892a' stroke-width='1.9' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

/* Override checkmark colour per apartment */
.apt--a1 .apt__checklist li::before{
  background-color: rgba(195,160,90,.11);
  border-color: rgba(195,160,90,.28);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%23b8892a' stroke-width='1.9' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.apt--a2 .apt__checklist li::before{
  background-color: rgba(80,120,70,.10);
  border-color: rgba(80,120,70,.26);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%23507848' stroke-width='1.9' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.apt--a3 .apt__checklist li::before{
  background-color: rgba(40,100,160,.10);
  border-color: rgba(40,100,160,.26);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%232864a0' stroke-width='1.9' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Footer: three buttons */
.apt__footer{
  display: grid;
  grid-template-columns: 1fr 1fr 1.5fr;
  align-items: stretch;
  gap: 8px;
  margin-top: auto;
}

/* Primary — Rezerviraj */
.apt__btnBook{
  display: flex;
  align-items: center;
  justify-content: center;

  padding: 14px 20px;
  border-radius: 999px;

  background: var(--apt-accent);
  color: #fff;
  font-weight: 700;
  font-size: .93rem;
  letter-spacing: .2px;
  text-decoration: none;

  box-shadow:
    0 4px 14px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.18);

  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.apt__btnBook:hover{
  transform: translateY(-2px);
  filter: brightness(1.07);
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}

/* Secondary — Detalji & Kalendar */
.apt__btnInfo,
.apt__btnCal{
  padding: 14px 10px;
  border-radius: 999px;
  border: none;
  background: var(--apt-accent-soft, rgba(195,160,90,.10));
  font-weight: 600;
  font-size: .88rem;
  color: var(--apt-accent);
  cursor: pointer;
  white-space: nowrap;
  text-align: center;
  letter-spacing: .1px;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.apt__btnInfo:hover,
.apt__btnCal:hover{
  transform: translateY(-2px);
  background: var(--apt-accent-soft, rgba(195,160,90,.18));
  box-shadow: 0 4px 14px rgba(0,0,0,.08);
}

/* Mobile */
@media (max-width: 900px){
  .apt__body--clean{
    padding: 24px 22px 20px;
  }
  .apt__name{ font-size: 1.65rem; }
  .apt__specs{ gap: 14px; }
  .apt__priceBadge{ bottom: 130px; }
  .apt__checklist{
    grid-template-columns: 1fr 1fr;
  }
  .apt__footer{
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 7px;
  }
  .apt__btnBook{
    grid-column: 1 / -1;
    order: -1;
  }
}

/* =========================
   DETAILS MODAL — DM REDESIGN
   ========================= */

/* Per-apartment accent tokens */
.dm--a1 { --dm-accent: #c46b45; --dm-soft: rgba(196,107,69,.10); --dm-border: rgba(196,107,69,.28); --dm-strip: rgba(196,107,69,.85); }
.dm--a2 { --dm-accent: #607642; --dm-soft: rgba(96,118,66,.10); --dm-border: rgba(96,118,66,.28); --dm-strip: rgba(96,118,66,.82); }
.dm--a3 { --dm-accent: #247c9f; --dm-soft: rgba(36,124,159,.10); --dm-border: rgba(36,124,159,.28); --dm-strip: rgba(36,124,159,.82); }

/* Overlay */
.modal--details {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 80;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.modal--details.is-open { display: flex; }

/* Panel */
.dm {
  position: relative;
  width: min(880px, 100%);
  max-height: calc(100dvh - 48px);
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  background: #fff;
  box-shadow:
    0 32px 80px rgba(10,30,60,.22),
    0 2px 8px rgba(10,30,60,.08);
  overflow: hidden;
  animation: dmIn .28s cubic-bezier(.22,.68,0,1.1) both;
}

@keyframes dmIn {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1);   }
}

/* Top accent strip */
.dm__strip {
  height: 4px;
  flex-shrink: 0;
  background: var(--dm-strip, rgba(184,137,42,.85));
  transition: background .3s ease;
}

/* Sticky header */
.dm__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 26px 18px;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(10,25,40,.07);
  background: #fff;
}

.dm__headText {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dm__title {
  margin: 0;
  font-family: 'Playfair Display', serif;
  font-size: 1.50rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: #0b1b2b;
  line-height: 1.2;
}

.dm__title span {
  color: var(--dm-accent, #b8892a);
  transition: color .3s ease;
}

.dm__meta {
  margin: 0;
  font-size: .875rem;
  font-weight: 600;
  color: rgba(11,27,43,.50);
  letter-spacing: .05px;
}

/* Close button — flat, no shadow */
.dm__close {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(10,25,40,.13);
  background: transparent;
  color: rgba(11,27,43,.55);
  font-size: 14px;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
  line-height: 1;
}
.dm__close:hover {
  background: rgba(10,25,40,.06);
  color: rgba(11,27,43,.85);
  border-color: rgba(10,25,40,.22);
}

/* Scrollable body */
.dm__body {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 26px 28px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

/* Hero image */
.dm__hero {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  margin-top: 22px;
  aspect-ratio: 16/7;
  background: rgba(10,25,40,.06);
  flex-shrink: 0;
}

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

/* gradient overlay + badge at bottom of image */
.dm__hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    transparent 40%,
    rgba(10,20,40,.55) 100%
  );
  pointer-events: none;
}

.dm__heroBadge {
  position: absolute;
  bottom: 16px;
  left: 20px;
  right: 20px;
  z-index: 2;
  color: rgba(255,255,255,.92);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
  pointer-events: none;
}

/* Lead paragraph */
.dm__lead {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.82;
  color: rgba(11,27,43,.72);
}

/* 2-column info grid */
.dm__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.dm__section {
  background: rgba(10,25,40,.025);
  border: 1px solid rgba(10,25,40,.07);
  border-radius: 16px;
  padding: 18px 20px;
}

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

/* Section heading with accent left-border */
.dm__sHead {
  margin: 0 0 14px;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--dm-accent, #b8892a);
  padding-left: 11px;
  border-left: 2.5px solid var(--dm-accent, #b8892a);
  transition: color .3s ease, border-color .3s ease;
}

/* Bullet list */
.dm__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.dm__list li {
  position: relative;
  padding-left: 18px;
  font-size: .90rem;
  color: rgba(11,27,43,.70);
  line-height: 1.55;
}

.dm__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--dm-accent, #b8892a);
  opacity: .55;
}

/* Rules (key → value) */
.dm__rules {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.dm__rule {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid rgba(10,25,40,.06);
  font-size: .88rem;
}

.dm__rule:last-child { border-bottom: none; }

.dm__rule span {
  color: rgba(11,27,43,.55);
  font-weight: 600;
}

.dm__rule b {
  color: #0b1b2b;
  font-weight: 750;
  text-align: right;
}

/* Distances — pill row */
.dm__dists {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dm__dist {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--dm-border, rgba(184,137,42,.28));
  transition: border-color .3s ease;
}

.dm__distLabel {
  font-size: .84rem;
  font-weight: 600;
  color: rgba(11,27,43,.60);
}

.dm__distVal {
  font-size: .88rem;
  font-weight: 800;
  color: var(--dm-accent, #b8892a);
  transition: color .3s ease;
}

/* CTA footer */
.dm__foot {
  padding-top: 6px;
}

button.dm__cta {
  border: none;
  cursor: pointer;
}

.dm__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 16px 24px;
  border-radius: 14px;
  background: var(--dm-accent, #b8892a);
  color: #fff;
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: .3px;
  text-decoration: none;
  box-shadow:
    0 8px 26px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.18);
  transition: filter .2s ease, transform .2s ease, box-shadow .2s ease;
}

.dm__cta::after {
  content: none;
}

.dm__cta:hover {
  filter: brightness(1.08);
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(0,0,0,.20);
}

.dm__cta:hover::after { transform: translateX(4px); }

/* Mobile */
@media (max-width: 680px) {
  .modal--details { padding: 0; align-items: flex-end; }
  .dm {
    width: 100%;
    max-height: 94dvh;
    border-radius: 22px 22px 0 0;
    animation: dmInMobile .28s cubic-bezier(.22,.68,0,1.1) both;
  }
  @keyframes dmInMobile {
    from { transform: translateY(30px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
  }
  .dm__body { padding: 0 18px 24px; }
  .dm__head { padding: 16px 18px 14px; }
  .dm__grid { grid-template-columns: 1fr; }
  .dm__section--full { grid-column: 1; }
  .dm__hero { aspect-ratio: 16/9; margin-top: 16px; }
}

/* =========================
   CALENDAR MODAL — CM REDESIGN
   ========================= */

/* Per-apartment tokens */
.cm--a1 { --cm-accent: #b8892a; --cm-soft: rgba(184,137,42,.12); --cm-border: rgba(184,137,42,.30); --cm-strip: rgba(184,137,42,.85); }
.cm--a2 { --cm-accent: #507848; --cm-soft: rgba(80,120,72,.12); --cm-border: rgba(80,120,72,.30); --cm-strip: rgba(80,120,72,.82); }
.cm--a3 { --cm-accent: #2864a0; --cm-soft: rgba(40,100,160,.12); --cm-border: rgba(40,100,160,.30); --cm-strip: rgba(40,100,160,.82); }

/* Overlay */
.modal--calendar {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 80;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.modal--calendar.is-open { display: flex; }

/* Panel */
.cm {
  position: relative;
  width: min(660px, 100%);
  max-height: calc(100dvh - 48px);
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  background: #fff;
  box-shadow:
    0 32px 80px rgba(10,30,60,.22),
    0 2px 8px rgba(10,30,60,.08);
  overflow: hidden;
  animation: cmIn .28s cubic-bezier(.22,.68,0,1.1) both;
}

@keyframes cmIn {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1);   }
}

/* Accent strip */
.cm__strip {
  height: 4px;
  flex-shrink: 0;
  background: var(--cm-strip, rgba(184,137,42,.85));
}

/* Header */
.cm__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 24px 16px;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(10,25,40,.07);
}

.cm__aptName {
  margin: 0 0 2px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: rgba(11,27,43,.40);
}

.cm__aptName span {
  color: var(--cm-accent, #b8892a);
}

.cm__title {
  margin: 0;
  font-family: 'Playfair Display', serif;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #0b1b2b;
}

/* Close button — flat */
.cm__close {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(10,25,40,.13);
  background: transparent;
  color: rgba(11,27,43,.50);
  font-size: 14px;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.cm__close:hover {
  background: rgba(10,25,40,.06);
  color: rgba(11,27,43,.85);
  border-color: rgba(10,25,40,.22);
}

/* Month navigation */
.cm__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px 10px;
  flex-shrink: 0;
}

.cm__monthLabel {
  font-size: 1.10rem;
  font-weight: 800;
  color: #0b1b2b;
  letter-spacing: -.01em;
  text-align: center;
}

.cm__navBtn {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1.5px solid rgba(10,25,40,.10);
  background: rgba(10,25,40,.03);
  color: rgba(11,27,43,.70);
  font-size: 1.30rem;
  line-height: 1;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
  user-select: none;
}
.cm__navBtn:hover:not(:disabled) {
  background: var(--cm-soft, rgba(184,137,42,.12));
  border-color: var(--cm-border, rgba(184,137,42,.30));
  color: var(--cm-accent, #b8892a);
}
.cm__navBtn:disabled {
  opacity: .25;
  cursor: not-allowed;
}

/* Weekday labels */
.cm__weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 4px;
  padding: 0 24px 8px;
  flex-shrink: 0;
}

.cm__weekdays div {
  text-align: center;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: rgba(11,27,43,.38);
}

/* Calendar grid */
.cm__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 4px;
  padding: 0 24px;
  overflow-y: auto;
  flex-shrink: 0;
}

/* Day cell */
.cmCell {
  border-radius: 10px;
  border: 1px solid rgba(10,25,40,.07);
  background: rgba(10,25,40,.02);
  padding: 8px 6px 7px;
  min-height: 58px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  position: relative;
  transition: background .15s ease, border-color .15s ease;
}

/* Out-of-month: invisible placeholder */
.cmCell--out {
  border-color: transparent;
  background: transparent;
}

/* Weekend: subtle tint */
.cmCell--weekend:not(.cmCell--out) {
  background: rgba(10,25,40,.04);
}

/* Today highlight */
.cmCell--today {
  border-color: var(--cm-accent, #b8892a);
  background: var(--cm-soft, rgba(184,137,42,.06));
}

/* Busy / blocked */
.cmCell--busy {
  background: var(--cm-soft, rgba(184,137,42,.12));
  border-color: var(--cm-border, rgba(184,137,42,.30));
}

/* Admin: hover feedback */
[role="button"].cmCell:hover {
  border-color: var(--cm-accent, #b8892a);
  cursor: pointer;
  background: rgba(10,25,40,.05);
}
[role="button"].cmCell--busy:hover {
  background: var(--cm-soft);
  filter: brightness(.94);
}

/* Cell contents */
.cmCell__num {
  font-size: .86rem;
  font-weight: 800;
  color: rgba(11,27,43,.80);
  line-height: 1;
}

.cmCell--busy .cmCell__num {
  color: var(--cm-accent, #b8892a);
}

.cmCell--today .cmCell__num {
  color: var(--cm-accent, #b8892a);
}

.cmCell__price {
  position: absolute;
  bottom: 7px;
  right: 7px;
  font-size: .88rem;
  font-weight: 900;
  color: var(--cm-accent, #b8892a);
  line-height: 1;
}

.cmCell__status {
  display: inline-block;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .2px;
  color: var(--cm-accent, #b8892a);
  opacity: .75;
  margin-top: auto;
  text-transform: uppercase;
}

/* Footer */
.cm__foot {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 24px 22px;
  flex-shrink: 0;
  border-top: 1px solid rgba(10,25,40,.07);
  margin-top: 14px;
}

/* Legend */
.cm__legend {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.cm__legendItem {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: .80rem;
  font-weight: 650;
  color: rgba(11,27,43,.55);
}

.cm__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.cm__dot--free { background: rgba(10,25,40,.10); border: 1.5px solid rgba(10,25,40,.16); }
.cm__dot--busy { background: var(--cm-accent, #b8892a); opacity: .65; }

.cm__legendHint {
  margin-left: auto;
  font-size: .76rem;
  font-weight: 600;
  color: rgba(11,27,43,.38);
}

/* Admin bar */
.cm__adminBar[hidden] { display: none; }

.cm__adminBar {
  display: flex;
  justify-content: flex-start;
}

.cm__blockBtn {
  padding: 9px 18px;
  border-radius: 10px;
  border: 1.5px solid var(--cm-border, rgba(184,137,42,.30));
  background: var(--cm-soft, rgba(184,137,42,.08));
  color: var(--cm-accent, #b8892a);
  font-size: .84rem;
  font-weight: 750;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, filter .18s ease;
}
.cm__blockBtn:hover {
  filter: brightness(.92);
  border-color: var(--cm-accent, #b8892a);
}

/* CTA */
.cm__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 22px;
  border-radius: 13px;
  background: var(--cm-accent, #b8892a);
  color: #fff;
  font-size: .92rem;
  font-weight: 800;
  letter-spacing: .2px;
  text-decoration: none;
  box-shadow: 0 6px 20px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.18);
  transition: filter .2s ease, transform .2s ease, box-shadow .2s ease;
}
.cm__cta:hover {
  filter: brightness(1.08);
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
}

/* Price popup — centered overlay inside panel */
.cm__pricePopup[hidden] { display: none; }

.cm__pricePopup {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.60);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: 24px;
}

.cm__priceCard {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(10,25,40,.10);
  box-shadow: 0 20px 60px rgba(10,30,60,.18);
  padding: 28px 28px 22px;
  width: min(320px, 100%);
  display: flex;
  flex-direction: column;
  gap: 16px;
  animation: cmIn .22s cubic-bezier(.22,.68,0,1.1) both;
}

.cm__priceDay {
  margin: 0;
  font-size: .90rem;
  font-weight: 700;
  color: rgba(11,27,43,.55);
  text-align: center;
}

.cm__priceField {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1.5px solid var(--cm-border, rgba(184,137,42,.30));
  border-radius: 12px;
  padding: 0 14px;
  background: var(--cm-soft, rgba(184,137,42,.06));
  transition: border-color .18s ease;
}
.cm__priceField:focus-within {
  border-color: var(--cm-accent, #b8892a);
}

.cm__priceInput {
  flex: 1;
  border: none;
  background: transparent;
  font-size: 1.55rem;
  font-weight: 800;
  color: #0b1b2b;
  padding: 12px 0;
  outline: none;
  width: 0; /* flex grows it */
  min-width: 0;
}
.cm__priceInput::placeholder { color: rgba(11,27,43,.22); }

.cm__priceSuffix {
  font-size: 1.20rem;
  font-weight: 800;
  color: var(--cm-accent, #b8892a);
  opacity: .75;
}

.cm__priceBtns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.cm__priceSave {
  padding: 12px;
  border-radius: 11px;
  border: none;
  background: var(--cm-accent, #b8892a);
  color: #fff;
  font-size: .90rem;
  font-weight: 800;
  cursor: pointer;
  transition: filter .18s ease;
}
.cm__priceSave:hover { filter: brightness(1.08); }

.cm__priceCancel {
  padding: 12px;
  border-radius: 11px;
  border: 1.5px solid rgba(10,25,40,.12);
  background: transparent;
  color: rgba(11,27,43,.60);
  font-size: .90rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .18s ease;
}
.cm__priceCancel:hover { background: rgba(10,25,40,.05); }

/* Mobile: bottom sheet */
@media (max-width: 680px) {
  .modal--calendar { padding: 0; align-items: flex-end; }
  .cm {
    width: 100%;
    max-height: 96dvh;
    border-radius: 22px 22px 0 0;
  }
  .cm__head, .cm__nav, .cm__weekdays, .cm__grid, .cm__foot { padding-left: 16px; padding-right: 16px; }
  .cmCell { min-height: 46px; padding: 6px 4px; }
  .cmCell__num { font-size: .78rem; }
  .cmCell__price { font-size: .62rem; }
  .cmCell__status { display: none; }
}

/* ═══════════════════════════════════════════
   KONTAKT / REZERVACIJA SECTION
   ═══════════════════════════════════════════ */

.ktSection {
  scroll-margin-top: 80px;
}

/* Head */
.ktHead {
  text-align: center;
  margin-bottom: 52px;
}
.ktHead__kicker {
  display: inline-block;
  margin: 0 0 14px;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #b5763a;
}
.ktHead__title {
  margin: 0 auto 14px;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 600;
  color: rgba(11,27,43,.90);
  line-height: 1.1;
}
.ktHead__sub {
  margin: 0 auto;
  max-width: 54ch;
  font-size: .98rem;
  line-height: 1.8;
  color: rgba(11,27,43,.52);
}

/* Layout — forma lijevo, kalendar+info desno */
.ktLayout {
  display: grid;
  grid-template-columns: 1fr 440px;
  gap: 36px;
  align-items: start;
}

/* ── Form ── */
.ktForm {
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.ktForm__row2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 13px;
}
.ktForm__input {
  width: 100%;
  padding: 13px 15px;
  border: 1.5px solid rgba(11,27,43,.12);
  border-radius: 10px;
  background: rgba(255,255,255,.85);
  font-size: .96rem;
  color: rgba(11,27,43,.88);
  font-family: inherit;
  transition: border-color .18s, box-shadow .18s;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.ktForm__input::placeholder {
  color: rgba(11,27,43,.35);
}
.ktForm__input:focus {
  border-color: #b5763a;
  box-shadow: 0 0 0 3px rgba(181,118,58,.13);
}
.ktForm__input.is-error {
  border-color: #d93025;
  box-shadow: 0 0 0 3px rgba(217,48,37,.09);
}
.ktForm__input.is-error:focus {
  border-color: #d93025;
  box-shadow: 0 0 0 3px rgba(217,48,37,.14);
}
.ktForm__input:disabled {
  background: rgba(11,27,43,.04);
  color: rgba(11,27,43,.28);
  cursor: not-allowed;
  border-color: rgba(11,27,43,.07);
}
.ktForm__field {
  display: flex;
  flex-direction: column;
}
.ktForm__errMsg {
  font-size: .72rem;
  font-weight: 600;
  color: #d93025;
  margin-top: 4px;
  padding-left: 2px;
  min-height: 1.1em;
  line-height: 1.2;
}
.ktForm__req {
  color: #d93025;
  font-style: normal;
}
.ktForm__calNote {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: -2px 0 0;
  padding: 11px 14px;
  border-radius: 8px;
  background: rgba(181,118,58,.12);
  border: 1px solid rgba(181,118,58,.32);
  font-size: .84rem;
  font-weight: 500;
  color: rgba(11,27,43,.78);
  line-height: 1.5;
}
.ktForm__sendErr {
  margin: 0;
  padding: 12px 16px;
  border-radius: 10px;
  background: rgba(217,48,37,.07);
  border: 1px solid rgba(217,48,37,.25);
  color: #c0281e;
  font-size: .88rem;
  line-height: 1.5;
}
.ktForm__sendErr a {
  color: #c0281e;
  font-weight: 600;
}
.ktForm__select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23b5763a' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  padding-right: 38px;
}
.ktForm__dateField {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.ktForm__dateLabel {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(11,27,43,.42);
  padding-left: 2px;
}
.ktForm__dateInput {
  cursor: default;
  background: rgba(255,255,255,.60);
}
.ktForm__dateInput.is-set {
  background: rgba(255,255,255,.95);
  color: #b5763a;
  font-weight: 600;
}
.ktForm__textarea {
  resize: vertical;
  min-height: 108px;
}
.ktForm__btn {
  align-self: flex-start;
  padding: 13px 34px;
  border: none;
  border-radius: 10px;
  background: #b5763a;
  color: #fff;
  font-size: .97rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  letter-spacing: .2px;
  transition: background .2s, transform .1s, box-shadow .2s;
  box-shadow: 0 4px 18px rgba(181,118,58,.28);
}
.ktForm__btn:hover {
  background: #9e6430;
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(181,118,58,.36);
}
.ktForm__btn:active {
  transform: translateY(0);
}
.ktForm__success {
  margin: 0;
  padding: 12px 16px;
  border-radius: 10px;
  background: rgba(96,118,66,.10);
  border: 1px solid rgba(96,118,66,.30);
  color: #607642;
  font-size: .9rem;
  font-weight: 600;
}

/* ── Term summary ── */
.ktSummary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  border-radius: 10px;
  background: rgba(181,118,58,.08);
  border: 1px solid rgba(181,118,58,.22);
}
.ktSummary__info {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ktSummary__dates {
  font-size: .88rem;
  font-weight: 700;
  color: rgba(11,27,43,.80);
}
.ktSummary__nights {
  font-size: .76rem;
  color: rgba(11,27,43,.48);
  font-weight: 500;
}
.ktSummary__total {
  font-size: 1.15rem;
  font-weight: 900;
  color: #b5763a;
  white-space: nowrap;
  letter-spacing: -.01em;
}

/* ── Right column ── */
.ktRight {
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: sticky;
  top: 88px;
}

/* ── Per-apartment accent tokens ── */
#ktAptSelect.kt--a1, #ktCal.kt--a1 { --kt-accent: #c46b45; --kt-soft: rgba(196,107,69,.12); --kt-border: rgba(196,107,69,.35); }
#ktAptSelect.kt--a2, #ktCal.kt--a2 { --kt-accent: #607642; --kt-soft: rgba(96,118,66,.12);  --kt-border: rgba(96,118,66,.35);  }
#ktAptSelect.kt--a3, #ktCal.kt--a3 { --kt-accent: #247c9f; --kt-soft: rgba(36,124,159,.12); --kt-border: rgba(36,124,159,.35); }


#ktCal.kt--a1,
#ktCal.kt--a2,
#ktCal.kt--a3 {
  border-color: var(--kt-border);
}

#ktCal.kt--a1 .ktCell__pr,
#ktCal.kt--a2 .ktCell__pr,
#ktCal.kt--a3 .ktCell__pr {
  color: var(--kt-accent);
}

#ktCal.kt--a1 .ktCal__navBtn:not(:disabled),
#ktCal.kt--a2 .ktCal__navBtn:not(:disabled),
#ktCal.kt--a3 .ktCal__navBtn:not(:disabled) {
  color: var(--kt-accent);
  border-color: var(--kt-border);
}

#ktCal.kt--a1 .ktCell--selStart,
#ktCal.kt--a2 .ktCell--selStart,
#ktCal.kt--a3 .ktCell--selStart,
#ktCal.kt--a1 .ktCell--selEnd,
#ktCal.kt--a2 .ktCell--selEnd,
#ktCal.kt--a3 .ktCell--selEnd {
  background: var(--kt-accent);
}

#ktCal.kt--a1 .ktCell--inRange,
#ktCal.kt--a2 .ktCell--inRange,
#ktCal.kt--a3 .ktCell--inRange {
  background: var(--kt-soft);
}

/* ── Calendar (inside form, full-width) ── */
.ktCal {
  border-radius: 14px;
  border: 1.5px solid rgba(11,27,43,.09);
  background: rgba(255,255,255,.90);
  box-shadow: 0 4px 20px rgba(10,40,70,.07);
  overflow: hidden;
}
.ktCal__titleRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px 12px;
  border-bottom: 1px solid rgba(11,27,43,.07);
}
.ktCal__title {
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .9px;
  text-transform: uppercase;
  color: rgba(11,27,43,.48);
}
.ktCal__phase {
  font-size: .78rem;
  font-weight: 600;
  color: #b5763a;
  min-height: 1em;
}
.ktCal__lock {
  padding: 40px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
  color: rgba(11,27,43,.55);
}
.ktCal__lock p {
  margin: 0;
  font-size: .97rem;
  font-weight: 600;
  line-height: 1.55;
  color: rgba(11,27,43,.72);
}
.ktCal__inner {
  padding: 16px 18px 18px;
}
.ktCal__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.ktCal__navBtn {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: rgba(181,118,58,.10);
  color: #b5763a;
  border-radius: 9px;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  transition: background .14s;
}
.ktCal__navBtn:hover:not(:disabled) { background: rgba(181,118,58,.22); }
.ktCal__navBtn:disabled { opacity: .30; cursor: default; }
.ktCal__monthLabel {
  font-size: 1rem;
  font-weight: 700;
  color: rgba(11,27,43,.82);
}
.ktCal__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  margin-bottom: 4px;
}
.ktCal__weekdays > div {
  text-align: center;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .3px;
  color: rgba(11,27,43,.38);
  padding: 5px 0;
  text-transform: uppercase;
}
.ktCal__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
}

/* Calendar cells */
.ktCell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 54px;
  gap: 3px;
  border-radius: 8px;
  font-size: .92rem;
  color: rgba(11,27,43,.80);
  cursor: pointer;
  transition: background .1s, color .1s;
  user-select: none;
}
.ktCell:hover:not(.ktCell--busy):not(.ktCell--past):not(.ktCell--out):not(.ktCell--blocked) {
  background: rgba(181,118,58,.13);
}
.ktCell__num {
  font-size: .92rem;
  font-weight: 500;
  line-height: 1;
  position: relative;
  z-index: 1;
}
.ktCell__pr {
  font-size: .65rem;
  font-weight: 700;
  color: var(--kt-accent, #c46b45);
  line-height: 1;
  z-index: 1;
}
.ktCell--selStart .ktCell__pr,
.ktCell--selEnd   .ktCell__pr { color: rgba(255,255,255,.75); }
.ktCell--previewEnd .ktCell__pr { color: rgba(255,255,255,.70); }
.ktCell--busy .ktCell__pr,
.ktCell--past .ktCell__pr { display: none; }
.ktCell--out {
  visibility: hidden;
  pointer-events: none;
}
.ktCell--past {
  color: rgba(11,27,43,.20);
  cursor: default;
  pointer-events: none;
}
.ktCell--busy {
  color: rgba(11,27,43,.22);
  cursor: not-allowed;
  pointer-events: none;
  text-decoration: line-through;
}
.ktCell--blocked {
  color: rgba(11,27,43,.18);
  cursor: not-allowed;
  pointer-events: none;
}
.ktCell--today {
  font-weight: 700;
}
.ktCell--today .ktCell__num::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #b5763a;
}
.ktCell--selStart,
.ktCell--selEnd {
  background: #b5763a !important;
  color: #fff !important;
  border-radius: 6px;
  font-weight: 700;
}
.ktCell--inRange {
  background: rgba(181,118,58,.13);
  border-radius: 0;
  color: rgba(11,27,43,.80);
}
.ktCell--previewEnd {
  background: rgba(181,118,58,.45) !important;
  color: #fff !important;
  border-radius: 6px;
  font-weight: 600;
}
.ktCell--inPreview {
  background: rgba(181,118,58,.09);
  border-radius: 0;
}

/* Legend */
.ktCal__legend {
  display: flex;
  gap: 12px;
  margin-top: 11px;
  justify-content: center;
  flex-wrap: wrap;
}
.ktCal__legendItem {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: .70rem;
  color: rgba(11,27,43,.48);
  font-weight: 600;
}
.ktCal__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.ktCal__dot--free { background: rgba(11,27,43,.15); }
.ktCal__dot--busy { background: rgba(11,27,43,.22); }
.ktCal__dot--sel  { background: #b5763a; }

/* ── Contact info ── */
.ktInfo {
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  border: 1px solid rgba(11,27,43,.09);
  background: rgba(255,255,255,.85);
  box-shadow: 0 6px 28px rgba(10,40,70,.08);
  overflow: hidden;
}
.ktInfo__item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(11,27,43,.06);
}
.ktInfo__item:last-child { border-bottom: none; }
.ktInfo__icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: rgba(181,118,58,.10);
  color: #b5763a;
}
.ktInfo__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ktInfo__text strong {
  font-size: .80rem;
  font-weight: 800;
  color: rgba(11,27,43,.72);
  letter-spacing: .1px;
}
.ktInfo__text a,
.ktInfo__text span {
  font-size: .88rem;
  color: rgba(11,27,43,.58);
  text-decoration: none;
  word-break: break-word;
}
.ktInfo__text a:hover { color: #b5763a; }

/* ── Responsive ── */
@media (max-width: 820px) {
  .ktLayout {
    grid-template-columns: 1fr;
  }
  .ktRight {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }
}
@media (max-width: 600px) {
  .ktForm__row2 {
    grid-template-columns: 1fr;
  }
  .ktRight {
    grid-template-columns: 1fr;
  }
  .ktCell {
    height: 44px;
  }
  .ktCell__num { font-size: .82rem; }
  .ktCell__pr  { font-size: .58rem; }
}

/* =============================================
   LANGUAGE SWITCHER
   ============================================= */
.header__right {
  display: flex;
  align-items: center;
  gap: 8px;
}


.langSwitcher {
  position: relative;
}

.langSwitcher__btn {
  display: flex;
  align-items: center;
  gap: 5px;
  background: rgba(235,229,221,.80);
  border: 1px solid rgba(195,160,90,.35);
  border-radius: 999px;
  padding: 6px 11px;
  cursor: pointer;
  font-size: .78rem;
  font-weight: 700;
  color: var(--text);
  transition: background .2s, border-color .2s, transform .18s;
  backdrop-filter: blur(6px);
  line-height: 1;
}

.langSwitcher__btn:hover {
  background: rgba(245,240,235,.96);
  border-color: rgba(195,160,90,.55);
  transform: translateY(-1px);
}

.langSwitcher__flag {
  font-size: 1.05rem;
  line-height: 1;
  border-radius: 2px;
  overflow: hidden;
  flex-shrink: 0;
}

.langSwitcher__chevron {
  transition: transform .22s ease;
  opacity: .65;
}

.langSwitcher.is-open .langSwitcher__chevron {
  transform: rotate(180deg);
}

.langSwitcher__dropdown {
  position: absolute;
  top: calc(100% + 9px);
  right: 0;
  background: rgba(250,247,242,.98);
  border: 1px solid rgba(195,160,90,.32);
  border-radius: 14px;
  box-shadow:
    0 10px 36px rgba(60,40,20,.16),
    inset 0 1px 0 rgba(255,255,255,.75);
  padding: 6px;
  min-width: 148px;
  display: none;
  z-index: 200;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  animation: langDropIn .16s ease;
}

@keyframes langDropIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.langSwitcher.is-open .langSwitcher__dropdown {
  display: block;
}

.langSwitcher__option {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 11px;
  border-radius: 9px;
  cursor: pointer;
  font-size: .82rem;
  font-weight: 500;
  color: var(--text);
  transition: background .15s;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  letter-spacing: .01em;
}

.langSwitcher__option:hover {
  background: rgba(195,160,90,.15);
}

.langSwitcher__option.is-active {
  background: rgba(195,160,90,.22);
  font-weight: 700;
}

.langSwitcher__optFlag {
  font-size: 1.18rem;
  line-height: 1;
  border-radius: 2px;
  overflow: hidden;
  flex-shrink: 0;
}

/* =========================
   Booking Info Modal
   ========================= */

.ktHead__howBtn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 18px;
  padding: 9px 18px;
  border-radius: 999px;
  border: 1.5px solid rgba(181,118,58,.35);
  background: rgba(181,118,58,.07);
  color: #b5763a;
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .18s, border-color .18s, transform .18s;
  letter-spacing: .02em;
}
.ktHead__howBtn:hover {
  background: rgba(181,118,58,.14);
  border-color: rgba(181,118,58,.55);
  transform: translateY(-1px);
}
.ktHead__howBtn svg {
  flex-shrink: 0;
  opacity: .8;
}

/* Booking modal panel */
.modal--booking {
  z-index: 100;
  overflow-y: auto;
  display: none;
}
.modal--booking.is-open {
  display: block;
}

.modal__panel--booking {
  position: relative;
  width: min(780px, calc(100% - 28px));
  margin: 5vh auto 5vh;
  border-radius: 22px;
  overflow: hidden;
  background: #faf7f2;
  border: 1px solid rgba(195,160,90,.28);
  box-shadow: 0 30px 80px rgba(30,15,5,.22);
  animation: modalIn .2s ease forwards;
}

/* Header */
.bookingModal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.85);
  display: grid;
  place-items: center;
  cursor: pointer;
  color: rgba(11,27,43,.65);
  transition: background .15s, transform .15s;
  z-index: 2;
}
.bookingModal__close:hover {
  background: #fff;
  transform: scale(1.08);
}

.bookingModal__header {
  text-align: center;
  padding: 48px 44px 30px;
  border-bottom: 1px solid rgba(195,160,90,.18);
  background: linear-gradient(160deg, #fff 0%, #faf5ed 100%);
}
.bookingModal__headerIcon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background: rgba(181,118,58,.12);
  color: #b5763a;
  display: grid;
  place-items: center;
  margin: 0 auto 16px;
}
.bookingModal__title {
  margin: 0 0 10px;
  font-size: 1.45rem;
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 600;
  color: rgba(11,27,43,.90);
  line-height: 1.2;
}
.bookingModal__subtitle {
  margin: 0 auto;
  font-size: 1rem;
  color: rgba(11,27,43,.68);
  line-height: 1.72;
  max-width: 46ch;
}

/* Body */
.bookingModal__body {
  padding: 32px 44px;
  display: flex;
  flex-direction: column;
  gap: 26px;
}

.bookingModal__section {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bookingModal__kicker {
  margin: 0 0 14px;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #b5763a;
  opacity: .85;
}

.bookingModal__steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-left: 2px solid rgba(195,160,90,.22);
  padding-left: 0;
  margin-left: 14px;
}

.bookingModal__step {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 13px 0 13px 22px;
  position: relative;
}
.bookingModal__step:last-child {
  padding-bottom: 0;
}

.bookingModal__stepNum {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #b5763a;
  color: #fff;
  font-size: .8rem;
  font-weight: 700;
  display: grid;
  place-items: center;
  margin-left: -29px;
  position: relative;
  z-index: 1;
  box-shadow: 0 2px 8px rgba(181,118,58,.30);
}

.bookingModal__stepContent {
  padding-top: 2px;
  flex: 1;
}
.bookingModal__stepContent strong {
  display: block;
  font-size: .97rem;
  font-weight: 700;
  color: rgba(11,27,43,.88);
  margin-bottom: 4px;
}
.bookingModal__stepContent p {
  margin: 0;
  font-size: .93rem;
  color: rgba(11,27,43,.72);
  line-height: 1.68;
}

/* Footer */
.bookingModal__footer {
  padding: 20px 44px 30px;
  text-align: center;
  border-top: 1px solid rgba(195,160,90,.15);
  background: linear-gradient(0deg, rgba(250,247,242,1) 0%, rgba(250,247,242,0) 100%);
}

.bookingModal__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 36px;
  border-radius: 999px;
  background: #b5763a;
  color: #fff;
  font-size: .93rem;
  font-weight: 700;
  letter-spacing: .03em;
  border: none;
  cursor: pointer;
  transition: background .18s, transform .18s, box-shadow .18s;
  box-shadow: 0 4px 18px rgba(181,118,58,.35);
}
.bookingModal__cta:hover {
  background: #9e6230;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(181,118,58,.40);
}
.bookingModal__cta:active {
  transform: translateY(0);
}

@media (max-width: 600px) {
  .bookingModal__header { padding: 42px 22px 24px; }
  .bookingModal__body { padding: 24px 20px; }
  .bookingModal__footer { padding: 16px 20px 26px; }
  .bookingModal__title { font-size: 1.22rem; }
  .bookingModal__subtitle { font-size: .94rem; }
  .bookingModal__stepContent strong { font-size: .92rem; }
  .bookingModal__stepContent p { font-size: .88rem; }
}

/* =========================
   Review Form Modal
   ========================= */

.revSection__cta {
  text-align: center;
  margin-top: 40px;
}

.revSection__leaveBtn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
  border-radius: 999px;
  border: 1.5px solid rgba(11,27,43,.22);
  background: transparent;
  color: rgba(11,27,43,.72);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .18s, border-color .18s, color .18s, transform .18s;
  letter-spacing: .02em;
}
.revSection__leaveBtn:hover {
  background: rgba(11,27,43,.06);
  border-color: rgba(11,27,43,.40);
  color: rgba(11,27,43,.90);
  transform: translateY(-1px);
}

/* Review modal panel */
.modal--review {
  z-index: 100;
  overflow-y: auto;
  display: none;
}
.modal--review.is-open {
  display: block;
}
.modal__panel--review {
  position: relative;
  width: min(760px, calc(100% - 28px));
  margin: 4vh auto 4vh;
  border-radius: 22px;
  overflow: hidden;
  background: #faf7f2;
  border: 1px solid rgba(195,160,90,.25);
  box-shadow: 0 30px 80px rgba(30,15,5,.22);
  animation: modalIn .2s ease forwards;
}

.reviewModal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.85);
  display: grid;
  place-items: center;
  cursor: pointer;
  color: rgba(11,27,43,.65);
  transition: background .15s, transform .15s;
  z-index: 2;
}
.reviewModal__close:hover {
  background: #fff;
  transform: scale(1.08);
}

.reviewModal__header {
  text-align: center;
  padding: 44px 36px 26px;
  border-bottom: 1px solid rgba(195,160,90,.18);
  background: linear-gradient(160deg, #fff 0%, #faf5ed 100%);
}
.reviewModal__headerIcon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(245,166,35,.14);
  color: #c8860a;
  display: grid;
  place-items: center;
  margin: 0 auto 14px;
}
.reviewModal__title {
  margin: 0 0 8px;
  font-size: 1.35rem;
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 600;
  color: rgba(11,27,43,.90);
  line-height: 1.2;
}
.reviewModal__subtitle {
  margin: 0 auto;
  font-size: .92rem;
  color: rgba(11,27,43,.60);
  line-height: 1.7;
  max-width: 42ch;
}

/* Form body */
.reviewModal__body {
  padding: 28px 36px 10px;
}

.rfForm__row2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.rfForm__row3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.rfForm__row4 {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr 1fr;
  gap: 14px;
  align-items: start;
  margin-bottom: 14px;
}
.rfForm__row2 .rfForm__field,
.rfForm__row3 .rfForm__field,
.rfForm__row4 .rfForm__field,
.rfForm__row4 .rfForm__starsWrap {
  margin-bottom: 0;
}
.rfForm__field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 14px;
}

.rfForm__label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(11,27,43,.58);
}
.rfForm__req {
  color: #c0392b;
  margin-left: 2px;
}

.rfForm__input,
.rfForm__select,
.rfForm__textarea {
  width: 100%;
  padding: 10px 13px;
  border-radius: 10px;
  border: 1.5px solid rgba(11,27,43,.14);
  background: #fff;
  font-size: .88rem;
  color: rgba(11,27,43,.85);
  transition: border-color .15s, box-shadow .15s;
  outline: none;
  font-family: inherit;
  box-sizing: border-box;
}
.rfForm__input:focus,
.rfForm__select:focus,
.rfForm__textarea:focus {
  border-color: rgba(181,118,58,.55);
  box-shadow: 0 0 0 3px rgba(181,118,58,.10);
}
.rfForm__input.is-error,
.rfForm__select.is-error,
.rfForm__textarea.is-error {
  border-color: rgba(192,57,43,.45);
}
.rfForm__textarea {
  min-height: 100px;
  resize: vertical;
}
.rfForm__errMsg {
  font-size: .76rem;
  color: #c0392b;
  min-height: 1em;
}

/* Star rating */
.rfForm__starsWrap {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 14px;
  justify-content: flex-start;
}
.rfForm__starsWidget {
  display: flex;
  gap: 4px;
}
.rfForm__starBtn {
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  color: rgba(11,27,43,.15);
  border: none;
  background: none;
  padding: 0;
  transition: color .12s, transform .12s;
}
.rfForm__starBtn:hover,
.rfForm__starBtn.is-active {
  color: #f5a623;
}
.rfForm__starBtn.is-hover {
  color: #f5a623;
  transform: scale(1.15);
}

/* Note */
.rfForm__note {
  margin: 0 0 22px;
  font-size: .78rem;
  color: rgba(11,27,43,.45);
  line-height: 1.6;
  display: flex;
  align-items: flex-start;
  gap: 7px;
}
.rfForm__note svg {
  flex-shrink: 0;
  margin-top: 1px;
  opacity: .6;
}

/* Footer */
.reviewModal__footer {
  padding: 10px 36px 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.rfForm__submitBtn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  justify-content: center;
  padding: 14px 32px;
  border-radius: 999px;
  background: rgba(11,27,43,.88);
  color: #fff;
  font-size: .93rem;
  font-weight: 700;
  letter-spacing: .03em;
  border: none;
  cursor: pointer;
  transition: background .18s, transform .18s, box-shadow .18s;
  box-shadow: 0 4px 18px rgba(11,27,43,.20);
}
.rfForm__submitBtn:hover {
  background: rgba(11,27,43,1);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(11,27,43,.25);
}
.rfForm__submitBtn:disabled {
  opacity: .75;
  cursor: default;
  transform: none;
}
.rfForm__submitBtn.is-sent {
  background: #2e7d4f;
  box-shadow: 0 4px 18px rgba(46,125,79,.28);
  opacity: 1;
}
.rfForm__success {
  text-align: center;
  font-size: .9rem;
  color: #2e7d4f;
  font-weight: 600;
  padding: 10px 16px;
  background: rgba(46,125,79,.08);
  border-radius: 10px;
  border: 1px solid rgba(46,125,79,.20);
  width: 100%;
}
.rfForm__sendErr {
  text-align: center;
  font-size: .85rem;
  color: #c0392b;
  width: 100%;
}

@media (max-width: 600px) {
  .reviewModal__header { padding: 40px 20px 22px; }
  .reviewModal__body { padding: 22px 18px 8px; }
  .reviewModal__footer { padding: 8px 18px 24px; }
  .rfForm__row2 { grid-template-columns: 1fr; }
  .rfForm__row3 { grid-template-columns: 1fr 1fr; }
  .rfForm__row4 { grid-template-columns: 1fr 1fr; }
}

/* nav open burger transform — with .header__right sibling */
.nav.is-open ~ .header__right .burger span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}
.nav.is-open ~ .header__right .burger span:nth-child(2) {
  opacity: 0;
}
.nav.is-open ~ .header__right .burger span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

/* ═══════════════════════════════════════════════
   MOBITEL OVERHAUL — fokus na ≤ 600px i ≤ 420px
═══════════════════════════════════════════════ */

@media (max-width: 600px) {

  /* Body: manji gradient koji ne dominira na malim ekranima */
  body {
    background:
      radial-gradient(380px 200px at 100% 0%, rgba(102,204,255,.10), transparent 65%),
      var(--bg);
  }

  /* Sekcije: svjetlije boje na mobitelu (manje "tamno") */
  main > .section:nth-of-type(odd) {
    background: #FAFAF7;
  }
  main > .section:nth-of-type(even) {
    background: #F5F1EC;
  }
  .section {
    padding: 52px 0;
  }

  /* ── HEADER ─────────────────────────────── */
  .header {
    top: 10px;
    width: calc(100% - 24px);
  }
  .header__inner {
    padding: 8px 11px;
  }
  .logo__name {
    font-size: 1.15rem;
  }
  .logo__label {
    font-size: .67rem;
    letter-spacing: .14em;
  }

  /* ── HERO ────────────────────────────────── */
  .hero--new .hero__wrap,
  .hero__wrap {
    padding: 90px 0 50px;
  }
  .hero__panel--simple {
    padding: 20px 18px 22px;
    border-radius: 18px;
    background: linear-gradient(
      160deg,
      rgba(255,255,255,.80) 0%,
      rgba(255,255,255,.58) 100%
    );
  }
  .hero__panel--simple h1 {
    font-size: clamp(1.7rem, 7.5vw, 2.4rem);
    margin: 0 0 12px;
  }
  .hero__sub--simple {
    font-size: .93rem;
    line-height: 1.7;
    max-width: 100%;
  }
  .hero__welcome {
    font-size: .67rem;
    letter-spacing: .18em;
    margin: 0 0 10px;
  }
  /* Meta bar: sakri separatore, wrapaj stavke */
  .hero__meta {
    flex-wrap: wrap;
    gap: 6px 10px;
    padding: 7px 12px;
    justify-content: center;
    margin-top: 18px;
  }
  .hero__meta-sep {
    display: none;
  }
  .hero__meta-item {
    gap: 4px;
  }
  .hero__location,
  .hero__rating {
    font-size: .78rem;
  }
  .hero__google-icon {
    width: 15px;
    height: 15px;
  }
  .hero__stars {
    font-size: .72rem;
  }

  /* ── O NAMA / ABOUT SPLIT ────────────────── */
  .aboutSplit__intro {
    padding: 40px 0 48px;
    border-radius: 18px !important;
  }
  .aboutSplit__title {
    font-size: clamp(1.22rem, 5vw, 1.58rem);
    padding: 0 2px;
  }
  .aboutSplit__subtitle {
    font-size: .90rem;
    line-height: 1.72;
  }
  .aboutSplit__benefits {
    background: #EDF0EA;
    padding: 32px 0 42px;
  }
  .aboutSplit__benefitTitle {
    font-size: clamp(1.3rem, 4.8vw, 1.7rem);
  }
  .aboutSplit__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .aboutSplit__item {
    padding: 20px 17px;
  }
  .aboutSplit__desc {
    margin-left: 0;
    margin-top: 8px;
  }

  /* ── APARTMANI ───────────────────────────── */
  .apartmentsS__head {
    margin-bottom: 28px;
  }
  .apartmentsS__title {
    font-size: clamp(1.55rem, 6.2vw, 2.1rem);
  }
  .apt {
    grid-template-columns: 1fr !important;
    border-radius: 18px;
    gap: 0;
  }
  .apt:hover {
    transform: none;
  }
  .apt--alt .apt__media { order: unset; }
  .apt--alt .apt__body  { order: unset; }
  .apt__media {
    border-radius: 18px 18px 0 0;
  }
  .apt__media > img {
    min-height: 240px !important;
    border-radius: 18px 18px 0 0;
  }
  .apt__thumbs img {
    height: 70px;
  }
  .apt__body--clean {
    padding: 18px 16px 18px;
    border-radius: 0 0 18px 18px;
  }
  .apt__body h3,
  .apt__name {
    font-size: 1.65rem !important;
  }
  .apt__quick {
    grid-template-columns: 1fr 1fr !important;
  }
  .apt__checklist {
    grid-template-columns: 1fr 1fr !important;
  }
  .apt__footer {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 8px;
  }
  .apt__btnBook {
    grid-column: 1 / -1;
    order: -1;
  }
  .apt__priceBadge {
    bottom: auto;
    top: 14px;
    right: 14px;
  }

  /* ── RECENZIJE ───────────────────────────── */
  .revHead {
    margin-bottom: 28px;
  }
  .revHead__title {
    font-size: clamp(1.42rem, 5.5vw, 1.88rem);
  }
  .revHead__sub {
    font-size: .92rem;
  }
  .revSlider__btn {
    display: none;
  }
  .revSlider__track {
    padding: 6px 0 14px;
    gap: 14px;
  }

  /* ── LOKACIJA / KARTA ────────────────────── */
  .map iframe {
    height: 240px;
  }
  .lokMapFull iframe {
    height: 240px;
  }
  .lokNearbyGrid {
    grid-template-columns: 1fr 1fr !important;
  }

  /* ── KONTAKT / FORMA ─────────────────────── */
  .ktLayout {
    grid-template-columns: 1fr;
  }
  .ktRight {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column;
  }
  .ktCell {
    height: 42px;
  }
  .ktCell__num  { font-size: .80rem; }
  .ktCell__pr   { font-size: .58rem; }
  .ktForm__row2 {
    grid-template-columns: 1fr;
  }

  /* ── FOOTER ──────────────────────────────── */
  .footer__main {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
  .footer__contact {
    flex-wrap: wrap;
    gap: 8px;
  }
  .footer__nav {
    gap: 12px;
    flex-wrap: wrap;
  }
}

/* ── 420px i manji ─────────────────────────── */
@media (max-width: 420px) {

  .header {
    width: calc(100% - 16px);
    top: 8px;
  }
  .header__inner {
    padding: 7px 10px;
  }
  .logo__name {
    font-size: 1.05rem;
  }
  .logo__label {
    display: none;
  }
  .logo__divider {
    display: none;
  }

  .section {
    padding: 44px 0;
  }

  .hero__panel--simple {
    padding: 16px 14px 18px;
    border-radius: 14px;
  }
  .hero__panel--simple h1 {
    font-size: 1.62rem;
  }
  .hero__sub--simple {
    font-size: .88rem;
  }

  .aboutSplit__intro {
    padding: 32px 0 40px;
  }

  /* Apt footer na 420px → jedan stupac */
  .apt__footer {
    grid-template-columns: 1fr;
  }
  .apt__btnBook {
    grid-column: 1;
    order: -1;
  }

  /* Rezerviraj btn u footer nav */
  .footer__contact a {
    font-size: .76rem;
    padding: 4px 8px;
  }
}