/* ============================================================
   Marivox.com — Our Travels
   Shared stylesheet
   ============================================================ */
:root{
  --ink:#1c1a17;
  --ink-soft:#4a453e;
  --cream:#f7f3ec;
  --cream-2:#efe8dc;
  --line:#ddd3c4;
  --gold:#a9852f;
  --gold-deep:#8a6a1f;
  --burgundy:#6e2230;
  --shadow:0 10px 30px rgba(28,26,23,.12);
  --maxw:1120px;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --display:"Playfair Display",Georgia,serif;
  --sans:"Inter",-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--cream);color:var(--ink);
  font-family:var(--sans);font-size:18px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--burgundy);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- top nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(247,243,236,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-family:var(--display);font-weight:700;font-size:1.35rem;letter-spacing:.06em;color:var(--ink);text-transform:uppercase}
.brand:hover{text-decoration:none}
.brand span{color:var(--gold)}
.nav-links a{color:var(--ink-soft);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;margin-left:28px}
.nav-links a:hover{color:var(--burgundy);text-decoration:none}
@media(max-width:640px){.nav-links a{margin-left:16px;font-size:.72rem}}
/* language switch */
.lang-switch{display:inline-flex;border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-left:22px;vertical-align:middle}
.lang-switch button{font-family:var(--sans);font-size:.7rem;font-weight:600;letter-spacing:.08em;padding:5px 11px;border:0;background:transparent;color:var(--ink-soft);cursor:pointer;line-height:1}
.lang-switch button.active{background:var(--ink);color:#fff}
@media(max-width:640px){.lang-switch{margin-left:12px}.lang-switch button{padding:5px 9px;font-size:.66rem}}
/* show/hide by language (default English until JS sets the body class) */
body.lang-en [lang="bg"]{display:none !important}
body.lang-bg [lang="en"]{display:none !important}

/* ---------- hero ---------- */
.hero{position:relative;min-height:78vh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,6,.15) 0%,rgba(10,8,6,.65) 100%)}
.hero .inner{position:relative;z-index:2;padding:0 24px 64px;max-width:var(--maxw);margin:0 auto;width:100%}
.eyebrow{font-size:.8rem;letter-spacing:.32em;text-transform:uppercase;opacity:.9;margin-bottom:14px}
.hero h1{font-family:var(--display);font-weight:800;line-height:1.02;margin:0;font-size:clamp(2.6rem,7vw,5rem);text-shadow:0 2px 24px rgba(0,0,0,.4)}
.hero .sub{font-family:var(--serif);font-size:clamp(1.2rem,2.6vw,1.7rem);margin-top:14px;max-width:720px;opacity:.96}
.hero .meta{margin-top:18px;font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
/* neutral illustrated hero (no photo) */
.hero.art{min-height:72vh}
.hero.art .artbg{position:absolute;inset:0;width:100%;height:100%}
.hero.art::after{background:linear-gradient(180deg,rgba(12,14,22,.12) 0%,rgba(12,14,22,.5) 100%)}

/* ---------- sections ---------- */
section{padding:72px 0}
.section-head{max-width:760px;margin:0 auto 44px;text-align:center}
.kicker{font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:14px}
h2{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.1;margin:0 0 .4em}
h3{font-family:var(--display);font-weight:700;font-size:1.5rem;margin:0 0 .35em}
.lead{font-family:var(--serif);font-size:1.35rem;color:var(--ink-soft)}
p{margin:0 0 1em}
.muted{color:var(--ink-soft)}

/* divider */
.rule{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--gold);margin:6px 0 0}
.rule::before,.rule::after{content:"";height:1px;width:60px;background:var(--line)}

/* ---------- stat band ---------- */
.stats{background:var(--ink);color:var(--cream)}
.stats .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stats .num{font-family:var(--display);font-size:clamp(2rem,5vw,3.2rem);color:#e7c873;line-height:1}
.stats .lbl{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;opacity:.8;margin-top:10px}
@media(max-width:640px){.stats .grid{grid-template-columns:repeat(2,1fr);gap:28px}}

/* ---------- feature rows ---------- */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin:0 auto 64px;max-width:var(--maxw)}
.feature:last-child{margin-bottom:0}
.feature.flip .media{order:2}
.feature .media img{border-radius:6px;width:100%;height:480px;object-fit:contain;background:transparent;filter:drop-shadow(0 10px 24px rgba(28,26,23,.2))}
.feature .body h3{color:var(--ink)}
.feature .body .tag{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:10px}
@media(max-width:820px){.feature{grid-template-columns:1fr;gap:22px}.feature.flip .media{order:0}}

/* ---------- gallery ---------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gallery.two{grid-template-columns:repeat(2,1fr)}
.gallery figure{margin:0;border-radius:6px;overflow:hidden;background:transparent}
.gallery img{width:100%;height:340px;object-fit:contain;background:transparent;filter:drop-shadow(0 9px 20px rgba(28,26,23,.18));transition:transform .45s ease}
.gallery figure:hover img{transform:scale(1.04)}
.gallery.tall figure img{height:460px}
.gallery figcaption{font-size:.82rem;color:var(--ink-soft);padding:12px 8px 0;background:transparent;text-align:center}
.dark .gallery figcaption{color:#cabfb0}
@media(max-width:820px){.gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.gallery,.gallery.two{grid-template-columns:1fr}}

/* ---------- opera night cards ---------- */
.nights{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.night{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:var(--shadow)}
.night img{width:100%;height:230px;object-fit:cover}
.night .pad{padding:22px 24px}
.night .n{font-family:var(--display);color:var(--gold-deep);font-size:.9rem;letter-spacing:.16em;text-transform:uppercase}
.night h3{font-style:italic;margin-top:4px}
.night .listen{margin-top:14px;font-size:.92rem;border-top:1px dashed var(--line);padding-top:12px;color:var(--ink-soft)}
.night .listen b{color:var(--burgundy);font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:.74rem;display:block;margin-bottom:4px}
@media(max-width:720px){.nights{grid-template-columns:1fr}}

/* ---------- alt section bg ---------- */
.tint{background:var(--cream-2)}
.dark{background:var(--ink);color:var(--cream)}
.dark h2,.dark h3{color:#fff}
.dark .lead,.dark .muted{color:#cabfb0}
.dark .kicker{color:#e7c873}

/* pull quote */
.pull{max-width:820px;margin:0 auto;text-align:center}
.pull blockquote{font-family:var(--display);font-style:italic;font-size:clamp(1.5rem,3.4vw,2.2rem);line-height:1.3;margin:0;color:var(--ink)}
.dark .pull blockquote{color:#fff}

/* ---------- destination cards (home) ---------- */
.dest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:var(--shadow);transition:transform .35s ease,box-shadow .35s ease;display:block;color:inherit}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(28,26,23,.2);text-decoration:none}
.card .ph{position:relative;height:240px;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .ph img{transform:scale(1.06)}
.card .badge{position:absolute;top:14px;left:14px;background:rgba(247,243,236,.92);color:var(--ink);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;border-radius:20px}
.card .pad{padding:20px 22px 24px}
.card h3{margin-bottom:4px}
.card .when{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:10px}
.card p{font-size:.95rem;color:var(--ink-soft);margin:0}
.card.soon{opacity:.62;cursor:default}
.card.soon:hover{transform:none;box-shadow:var(--shadow)}
.card.soon .ph{background:var(--cream-2);display:flex;align-items:center;justify-content:center}
.card.soon .ph span{font-family:var(--display);font-style:italic;color:var(--ink-soft);font-size:1.3rem}
@media(max-width:820px){.dest-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.dest-grid{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.footer{background:var(--ink);color:#c7bfb2;padding:46px 0;text-align:center;font-size:.9rem}
.footer .brand{color:#fff;display:inline-block;margin-bottom:10px}
.footer a{color:#e7c873}
.back{display:inline-block;margin:0 0 26px;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}