/* Luxavoy — brand layer. Loaded after the inherited twg stylesheets; only overrides. */
:root {
  --navy: #1F1D1A;   /* ink */
  --blue: #7B5E34;   /* deep brass, links */
  --gold: #A88552;   /* brass */
  --bg:   #F6F2EA;   /* ivory */
  --text: #2A2724;
  --gray: #6E675E;   /* stone */
  --lx-line: #E4DCCD;
  --lx-serif: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
}
body { background: #FBF9F5; }
::selection { background: #E9DCC3; }

/* type */
.hero-title, .section-title, .lx-h2, .mobile-overlay a,
.twg-article .entry-content h2, .twg-article .entry-content h3 {
  font-family: var(--lx-serif); font-weight: 500; letter-spacing: .005em;
}
.hero-title { font-weight: 500; }
.hero-title em { color: #D8BF94; }
.twg-article .entry-content h2 { font-size: 30px; }
.twg-article .entry-content h3 { font-size: 23px; }

/* nav */
.nav { gap: 2.2rem; }
.lx-brand { display: block; flex-shrink: 0; line-height: 0; }
.lx-brand img { height: 40px; width: auto; }
.lx-brand .on-light { display: none; }
.nav.scrolled { background: rgba(251,249,245,.97); box-shadow: 0 1px 0 var(--lx-line); }
.nav.scrolled .lx-brand .on-dark { display: none; }
.nav.scrolled .lx-brand .on-light { display: block; }
.nav-menu a { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 400; }
.nav-menu a.lx-cta { border: 1px solid rgba(216,191,148,.7); padding: .45rem 1rem; color: #F6F2EA; }
.nav.scrolled .nav-menu a.lx-cta { border-color: var(--gold); color: var(--navy); }
.nav-menu a:hover { color: #D8BF94 !important; }
.nav.scrolled .nav-menu a:hover { color: var(--blue) !important; }
.lang-toggle a.active { background: transparent; color: #D8BF94 !important; border: 1px solid rgba(216,191,148,.5); }
.nav.scrolled .lang-toggle a.active { color: var(--blue) !important; border-color: var(--gold); }
.mobile-overlay { background: var(--navy); }
.mobile-overlay a { font-size: 1.9rem; }

/* hero */
.hero-bg, .page-hero .hero-bg, .page-hero-hotels .hero-bg {
  background: linear-gradient(165deg, #12100D 0%, #1F1D1A 55%, #2C261E 100%);
}
.hero-bg::before {
  background: radial-gradient(ellipse 55% 45% at 78% 25%, rgba(168,133,82,.16) 0%, transparent 70%);
}
.hero-rule { width: 44px; height: 1px; background: var(--gold); }
.hero-eyebrow { color: #D8BF94; letter-spacing: .4em; }
.hero-sub { color: rgba(246,242,234,.72); }
.breadcrumb a:hover { color: #D8BF94; }

/* buttons: square, quiet */
.btn { border-radius: 0 !important; letter-spacing: .12em; text-transform: uppercase; font-size: .78rem; font-weight: 500; }
.btn-gold { background: var(--gold); color: #fff; }
.btn-gold:hover { background: #8F6F42; }
.btn-outline-white { border: 1px solid rgba(246,242,234,.55); }
.twg-article .entry-content button { background: var(--navy) !important; border-radius: 0 !important; letter-spacing: .12em !important; text-transform: uppercase; font-size: 13px !important; }

/* sections */
.section-light { background: var(--bg); }
.section-label { color: var(--blue); letter-spacing: .32em; }
.hotels-table th { background: var(--navy); font-weight: 500; letter-spacing: .04em; }
.hotels-table tr:hover td { background: #FAF6EE; }
.hotel-badge { border-radius: 0; border-width: 1px; }
.hotel-badge.active { background: var(--navy); border-color: var(--navy); }
.perk-chip { background: #fff; border-color: var(--lx-line); border-radius: 0; }
.hotels-search-input, .hotels-select { border-color: var(--lx-line); border-radius: 0; }

/* article pages without the old sidebar */
.twg-article.lx-noside { max-width: 820px; }

/* footer */
footer { background: #12100D; }
.lx-foot { text-align: center; }
.lx-foot img { height: 44px; width: auto; margin: 0 auto 1.2rem; display: block; }
.lx-foot .footer-sub { color: rgba(246,242,234,.45); letter-spacing: .06em; font-size: .8rem; }
footer .footer-links a:hover { color: #D8BF94; }

/* home + simple pages */
.lx-wrap { max-width: 1080px; margin: 0 auto; }
.lx-h2 { font-size: clamp(1.8rem, 3.6vw, 2.6rem); line-height: 1.2; color: var(--navy); margin: .4rem 0 1rem; }
.lx-lead { color: var(--gray); max-width: 640px; }
.lx-perks { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1px; background: var(--lx-line); border: 1px solid var(--lx-line); margin-top: 2.5rem; }
.lx-perks div { background: #FBF9F5; padding: 1.8rem 1.6rem; }
.lx-perks b { display: block; font-family: var(--lx-serif); font-size: 1.45rem; font-weight: 500; color: var(--navy); margin-bottom: .4rem; }
.lx-perks span { color: var(--gray); font-size: .92rem; }
.lx-steps { counter-reset: s; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2.5rem; margin-top: 2.5rem; }
.lx-steps div::before { counter-increment: s; content: '0' counter(s); display: block; font-family: var(--lx-serif); font-size: 2.4rem; color: var(--gold); line-height: 1; margin-bottom: .8rem; }
.lx-steps b { display: block; color: var(--navy); margin-bottom: .3rem; font-weight: 500; }
.lx-steps span { color: var(--gray); font-size: .94rem; }
.lx-tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-top: 2rem; }
.lx-tiers a { display: block; border: 1px solid var(--lx-line); background: #fff; padding: 1.3rem 1.2rem; text-decoration: none; color: var(--navy); }
.lx-tiers a:hover { border-color: var(--gold); }
.lx-tiers b { display: block; font-family: var(--lx-serif); font-size: 1.5rem; font-weight: 500; }
.lx-tiers span { color: var(--gray); font-size: .85rem; }
.lx-programs { margin-top: 1.6rem; color: var(--gray); font-size: .95rem; line-height: 2.1; }
.lx-programs span { display: inline-block; white-space: nowrap; }
.lx-citylist { columns: 4 160px; column-gap: 2rem; line-height: 2.2; }
.lx-citylist span { display: block; break-inside: avoid; }
.lx-programs span + span::before { content: '·'; margin: 0 .7rem; color: var(--gold); }
.lx-guides { margin-top: 1.5rem; }
.lx-guides > div { border: 0 !important; background: transparent !important; padding: 0 !important; margin: 0 !important; }
.lx-guides a { color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--lx-line); }
.lx-guides a:hover { border-color: var(--gold); }
.lx-note { border-left: 2px solid var(--gold); padding: .2rem 0 .2rem 1.2rem; color: var(--gray); max-width: 720px; margin-top: 1.8rem; }
.lx-center { text-align: center; }
.lx-center .lx-lead { margin: 0 auto; }
@media (max-width: 860px) {
  .lx-brand img { height: 34px; }
  .section { padding: 4rem 16px; }
}