/* ===== RESET & BASE ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --gold-100: #faf3d5;
  --gold-200: #f1e19d;
  --gold-300: #e6cb5d;
  --gold-400: #dbae2f;
  --gold-500: #d4af37;
  --gold-600: #b08f23;
  --black: #0b0b0b;
  --dark: #141414;
  --gray: #1a1a1a;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
  background-color: var(--black);
  color: #e5e5e5;
}

body {
  font-family: 'Montserrat', ui-sans-serif, system-ui, sans-serif;
  background: var(--black);
  color: #e5e5e5;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
ul { list-style: none; }
img { display: block; max-width: 100%; }

.container { max-width: 1280px; margin: 0 auto; padding: 0 24px; position: relative; z-index: 10; }
.container-narrow { max-width: 900px; }
.container-medium { max-width: 1000px; }

.section { position: relative; padding: 96px 0; overflow: hidden; border-bottom: 1px solid rgba(212,175,55,0.05); }
@media (min-width: 640px) { .section { padding: 128px 0; } }

.eyebrow {
  font-size: 11px; font-weight: 700; letter-spacing: 0.35em; color: var(--gold-500);
  text-transform: uppercase; display: block; margin-bottom: 16px;
}

.section-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 32px; font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em;
  color: #fff; line-height: 1.1; margin-bottom: 24px;
}
@media (min-width: 640px) { .section-title { font-size: 42px; } }
@media (min-width: 768px) { .section-title { font-size: 48px; } }

.gold-gradient-text {
  background: linear-gradient(90deg, var(--gold-100), var(--gold-400), var(--gold-600));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
  text-shadow: 0 0 10px rgba(212,175,55,0.3);
}
.gold-gradient-text.glow-lg { text-shadow: 0 0 15px rgba(212,175,55,0.4), 0 0 30px rgba(212,175,55,0.2); }

.italic-gold {
  background: linear-gradient(90deg, var(--gold-100), var(--gold-500));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
  font-style: italic; font-weight: 300; font-family: 'Montserrat', sans-serif; letter-spacing: 0.02em;
}

.section-desc {
  font-size: 13px; color: #a3a3a3; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em;
}
@media (min-width: 640px) { .section-desc { font-size: 14px; } }

.section-header.center { text-align: center; max-width: 680px; margin: 0 auto 64px; }
.title-divider { width: 64px; height: 1px; background: rgba(212,175,55,0.35); margin: 0 auto 24px; }

.bg-glow {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
  background: radial-gradient(circle at center, rgba(212,175,55,0.15) 0%, transparent 60%);
}
.bg-glow-left { top: 50%; left: 5%; width: 350px; height: 350px; transform: translateY(-50%); opacity: 0.1; }
.bg-glow-center { bottom: 10%; left: 50%; width: 500px; height: 500px; transform: translateX(-50%); opacity: 0.08; }
.bg-glow-right { top: 33%; right: 10%; width: 380px; height: 380px; opacity: 0.1; animation: goldPulse 4s ease-in-out infinite; }
.bg-glow-left-2 { top: 25%; left: 33%; width: 400px; height: 400px; opacity: 0.05; }
.bg-glow-left-3 { top: 50%; left: 10%; width: 350px; height: 350px; transform: translateY(-50%); opacity: 0.05; }
.bg-glow-center-pulse { top: 50%; left: 50%; width: 550px; height: 550px; transform: translate(-50%,-50%); opacity: 0.15; animation: goldPulse 4s ease-in-out infinite; }
.bg-glow-right-2 { bottom: 25%; right: 15%; width: 400px; height: 400px; opacity: 0.05; }

@keyframes goldPulse {
  0%, 100% { opacity: 0.1; transform: scale(1); }
  50% { opacity: 0.25; transform: scale(1.1); }
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 16px 32px; font-size: 12px; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase;
  transition: all 0.3s ease; width: 100%;
}
@media (min-width: 640px) { .btn { width: 256px; } }
.btn-gold { background: linear-gradient(90deg, var(--gold-600), var(--gold-500), #e6c34b); color: #000; box-shadow: 0 4px 25px rgba(212,175,55,0.25); }
.btn-gold:hover { box-shadow: 0 4px 35px rgba(212,175,55,0.4); transform: translateY(-2px); }
.btn-outline { border: 1px solid rgba(255,255,255,0.25); background: rgba(255,255,255,0.05); color: #fff; }
.btn-outline:hover { border-color: rgba(212,175,55,0.6); color: var(--gold-400); transform: translateY(-2px); }
.btn-outline-gold { border: 1px solid rgba(212,175,55,0.3); color: var(--gold-500); background: transparent; }
.btn-outline-gold:hover { background: var(--gold-500); color: #000; }
.btn-white { background: #fff; color: #000; }
.btn-white:hover { background: var(--gold-500); }

/* ===== LOADER ===== */
#luxury-loader {
  position: fixed; inset: 0; z-index: 999; display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: var(--black); color: #fff; transition: opacity 0.8s ease, transform 0.8s ease;
}
#luxury-loader.fade-out { opacity: 0; transform: translateY(-20px); pointer-events: none; }
.loader-glow {
  position: absolute; top: 50%; left: 50%; width: 300px; height: 300px; transform: translate(-50%,-50%);
  border-radius: 50%; opacity: 0.3; background: radial-gradient(circle, rgba(212,175,55,0.15), transparent 60%);
}
.loader-inner { position: relative; z-index: 10; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 16px; }
.loader-crest {
  position: relative; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center;
  border-radius: 50%; border: 1px solid rgba(212,175,55,0.3); margin-bottom: 32px;
  box-shadow: 0 0 15px rgba(212,175,55,0.1);
}
.loader-crest span { font-family: 'Playfair Display', serif; font-size: 30px; font-weight: 700; color: var(--gold-500); }
.loader-ring { position: absolute; inset: -8px; border: 1px dashed rgba(212,175,55,0.2); border-radius: 50%; animation: spin 15s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.loader-brand { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4em; }
.loader-sub { font-size: 11px; text-transform: uppercase; letter-spacing: 0.2em; color: #a3a3a3; margin-top: 8px; opacity: 0.5; }
.loader-progress-wrap { position: absolute; bottom: 96px; width: 256px; display: flex; flex-direction: column; align-items: center; gap: 12px; z-index: 10; }
.loader-percent { font-family: 'Space Grotesk', sans-serif; font-size: 14px; font-weight: 500; color: var(--gold-500); letter-spacing: 0.1em; }
.loader-track { width: 100%; height: 1px; background: #262626; position: relative; overflow: hidden; }
.loader-bar { position: absolute; top: 0; left: 0; height: 100%; width: 0%; background: linear-gradient(90deg, var(--gold-600), var(--gold-400)); transition: width 0.05s linear; }
.loader-status { font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase; color: #737373; animation: pulse 2s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }

#app.hidden-app { opacity: 0; }
#app.app-visible { opacity: 1; animation: fadeIn 1.2s cubic-bezier(0.16,1,0.3,1); }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ===== SCROLL PROGRESS ===== */
.scroll-progress-track { position: fixed; top: 0; left: 0; right: 0; height: 2px; background: #171717; z-index: 60; }
.scroll-progress-bar { height: 100%; width: 0%; background: linear-gradient(90deg, var(--gold-600), var(--gold-500), var(--gold-400)); transition: width 0.1s; }

/* ===== NAVBAR ===== */
.navbar { position: fixed; top: 0; left: 0; right: 0; z-index: 40; padding: 24px 0; transition: all 0.4s ease; background: transparent; border-bottom: 1px solid transparent; }
.navbar.scrolled { background: rgba(11,11,11,0.9); backdrop-filter: blur(10px); padding: 14px 0; border-bottom: 1px solid rgba(212,175,55,0.1); box-shadow: 0 4px 30px rgba(0,0,0,0.8); }
.navbar-inner { max-width: 1280px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; }

.logo { display: flex; align-items: center; gap: 12px; }
.logo-crest { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid rgba(212,175,55,0.3); transition: border-color 0.3s; }
.logo-crest span { font-family: 'Playfair Display', serif; font-size: 14px; font-weight: 700; color: var(--gold-500); }
.logo:hover .logo-crest { border-color: rgba(212,175,55,0.8); }
.logo-text { display: flex; flex-direction: column; }
.logo-title { font-family: 'Playfair Display', serif; font-size: 17px; letter-spacing: 0.25em; font-weight: 800; color: #fff; transition: color 0.3s; }
.logo:hover .logo-title { color: var(--gold-500); }
.logo-sub { font-size: 9px; letter-spacing: 0.15em; color: #a3a3a3; text-transform: uppercase; }

.nav-links { display: none; align-items: center; gap: 32px; }
@media (min-width: 768px) { .nav-links { display: flex; } }
.nav-link { font-size: 12px; text-transform: uppercase; letter-spacing: 0.2em; color: #a3a3a3; font-weight: 300; padding: 4px 0; position: relative; transition: color 0.3s; }
.nav-link:hover { color: #fff; }
.nav-link.active { color: var(--gold-500); font-weight: 500; }
.nav-link.active::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background: var(--gold-500); }

.nav-cta { display: none; position: relative; padding: 10px 20px; border: 1px solid rgba(212,175,55,0.3); font-size: 12px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--gold-500); overflow: hidden; transition: color 0.3s; }
@media (min-width: 768px) { .nav-cta { display: inline-flex; align-items: center; gap: 6px; } }
.nav-cta:hover { color: #fff; }
.nav-cta::before { content: ''; position: absolute; inset: 0; width: 0; background: var(--gold-500); transition: width 0.5s ease-out; z-index: -1; }
.nav-cta:hover::before { width: 100%; }

.mobile-toggle { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid #262626; background: rgba(10,10,10,0.4); position: relative; }
@media (min-width: 768px) { .mobile-toggle { display: none; } }
.burger { width: 18px; height: 1.5px; background: #d4d4d4; position: relative; display: block; }
.burger::before, .burger::after { content: ''; position: absolute; left: 0; width: 18px; height: 1.5px; background: #d4d4d4; transition: 0.3s; }
.burger::before { top: -6px; }
.burger::after { top: 6px; }

.mobile-menu { position: fixed; inset: 0; z-index: 30; display: none; background: rgba(11,11,11,0.98); }
.mobile-menu.open { display: block; }
@media (min-width: 768px) { .mobile-menu { display: none !important; } }
.mobile-menu-glow { position: absolute; top: 33%; left: 50%; width: 350px; height: 350px; transform: translate(-50%,-50%); border-radius: 50%; background: radial-gradient(circle, rgba(212,175,55,0.15), transparent 60%); opacity: 0.5; }
.mobile-menu-inner { position: relative; z-index: 10; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 96px 32px; }
.mobile-menu-brand { display: flex; flex-direction: column; gap: 6px; border-bottom: 1px solid #171717; padding-bottom: 32px; }
.mobile-nav-links { display: flex; flex-direction: column; gap: 24px; margin: auto 0; }
.mobile-nav-link { font-family: 'Playfair Display', serif; font-size: 20px; text-transform: uppercase; letter-spacing: 0.25em; color: #a3a3a3; padding: 6px 0; border-left: 2px solid transparent; padding-left: 16px; font-weight: 300; }
.mobile-nav-link.active { color: var(--gold-500); border-left-color: var(--gold-500); font-weight: 600; }
.mobile-menu-footer { display: flex; flex-direction: column; gap: 24px; padding-top: 32px; border-top: 1px solid #171717; }
.mobile-cta { width: 100%; display: flex; align-items: center; justify-content: center; padding: 16px; background: linear-gradient(90deg, var(--gold-600), var(--gold-400)); color: #000; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.25em; }
.mobile-location { text-align: center; }
.mobile-location-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; color: #737373; display: block; }
.mobile-location-value { font-size: 11px; color: #d4d4d4; font-weight: 300; display: block; margin-top: 4px; }

/* ===== HERO ===== */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--black); color: #fff; }
.hero-bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; animation: kenBurns 25s ease infinite alternate; }
@keyframes kenBurns { 0% { transform: scale(1); } 100% { transform: scale(1.08); } }
.hero-vignette { position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, var(--black), rgba(11,11,11,0.7) 40%, rgba(11,11,11,0.6)); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(110px); pointer-events: none; z-index: 1; }
.hero-glow-1 { bottom: 25%; right: 0; width: 45%; height: 40%; background: rgba(212,175,55,0.1); animation: goldPulse 4s ease-in-out infinite; }
.hero-glow-2 { top: 25%; left: 0; width: 35%; height: 35%; background: rgba(176,143,35,0.05); animation: goldPulse 4s ease-in-out infinite 1.5s; }
.hero-particles { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.particle { position: absolute; border-radius: 50%; background: var(--gold-400); animation: floatUp linear infinite; }
@keyframes floatUp { 0%,100% { transform: translateY(0); opacity: 0.1; } 50% { transform: translateY(-40px); opacity: 0.5; } }

.hero-content { position: relative; z-index: 5; max-width: 900px; margin: 0 auto; padding: 96px 24px 0; text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero-badge { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px; border: 1px solid rgba(212,175,55,0.2); background: rgba(212,175,55,0.05); margin-bottom: 24px; }
.hero-badge .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); animation: ping 1.5s infinite; }
@keyframes ping { 0% { box-shadow: 0 0 0 0 rgba(212,175,55,0.5); } 70% { box-shadow: 0 0 0 6px rgba(212,175,55,0); } 100% { box-shadow: 0 0 0 0 rgba(212,175,55,0); } }
.hero-badge span:last-child { font-size: 10px; letter-spacing: 0.35em; color: var(--gold-500); text-transform: uppercase; font-weight: 600; }
.hero-title { font-family: 'Playfair Display', serif; font-size: 36px; font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em; line-height: 1.1; }
@media (min-width: 640px) { .hero-title { font-size: 48px; } }
@media (min-width: 768px) { .hero-title { font-size: 60px; } }
@media (min-width: 1024px) { .hero-title { font-size: 72px; } }
.gold-text { background: linear-gradient(90deg, var(--gold-100), var(--gold-400), var(--gold-600)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; text-shadow: 0 0 15px rgba(212,175,55,0.4); }
.hero-divider { width: 80px; height: 1px; background: rgba(212,175,55,0.45); margin: 32px 0; }
.hero-subtitle { font-size: 14px; color: #d4d4d4; font-weight: 300; max-width: 640px; line-height: 1.7; letter-spacing: 0.02em; opacity: 0.85; }
@media (min-width: 768px) { .hero-subtitle { font-size: 17px; } }
.hero-actions { margin-top: 48px; display: flex; flex-direction: column; align-items: center; gap: 20px; width: 100%; }
@media (min-width: 640px) { .hero-actions { flex-direction: row; width: auto; } }

.hero-bottom-details { position: absolute; bottom: 80px; left: 24px; right: 24px; display: none; justify-content: space-between; z-index: 5; color: #737373; font-family: 'Space Grotesk', sans-serif; font-size: 10px; letter-spacing: 0.3em; }
@media (min-width: 1280px) { .hero-bottom-details { display: flex; } }

.scroll-indicator { position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); z-index: 5; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.scroll-indicator span { font-size: 9px; text-transform: uppercase; letter-spacing: 0.3em; color: #a3a3a3; opacity: 0.4; }
.scroll-circle { width: 32px; height: 48px; border-radius: 50px; border: 1px solid #404040; display: flex; justify-content: center; padding-top: 6px; transition: border-color 0.3s; }
.scroll-circle:hover { border-color: rgba(212,175,55,0.6); }
.scroll-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); animation: scrollDot 2s ease-in-out infinite; }
@keyframes scrollDot { 0%,100% { transform: translateY(0); } 50% { transform: translateY(16px); } }

/* ===== ABOUT ===== */
.about-grid { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center; }
@media (min-width: 1024px) { .about-grid { grid-template-columns: 5fr 7fr; gap: 80px; } }
.about-image-wrap { position: relative; }
.about-image-border { position: absolute; inset: -12px; border: 1px solid rgba(212,175,55,0.15); pointer-events: none; }
.about-image-frame { position: relative; aspect-ratio: 929/1693; background: #171717; border: 1px solid rgba(212,175,55,0.1); overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.9); }
.about-image { width: 100%; height: 100%; object-fit: contain; transition: transform 1.5s cubic-bezier(0.16,1,0.3,1); }
.about-image-frame:hover .about-image { transform: scale(1.05); }
@media (max-width: 767px) {
  .about-image-frame { aspect-ratio: 441/582; }
}
.about-image-vignette { position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,11,11,0.9), transparent 60%); opacity: 0.8; }
.about-image-caption { position: absolute; bottom: 24px; left: 24px; right: 24px; backdrop-filter: blur(8px); background: rgba(11,11,11,0.75); border: 1px solid rgba(212,175,55,0.2); padding: 16px; }
.caption-name { font-family: 'Playfair Display', serif; font-size: 13px; font-weight: 700; letter-spacing: 0.2em; color: var(--gold-500); display: block; }
.caption-role { font-size: 10px; color: #a3a3a3; text-transform: uppercase; letter-spacing: 0.15em; margin-top: 4px; display: block; }
.corner { position: absolute; background: var(--gold-400); z-index: 20; }
.corner-tl { top: 0; left: 0; width: 32px; height: 1px; }
.corner-tl::after { content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 32px; background: var(--gold-400); }
.corner-br { bottom: 0; right: 0; width: 32px; height: 1px; }
.corner-br::after { content: ''; position: absolute; bottom: 0; right: 0; width: 1px; height: 32px; background: var(--gold-400); }

.about-quote { border-left: 2px solid rgba(212,175,55,0.5); padding: 8px 24px; margin-bottom: 32px; background: rgba(212,175,55,0.05); font-style: italic; font-size: 14px; color: #e5e5e5; font-weight: 300; line-height: 1.7; }
.about-paragraphs { display: flex; flex-direction: column; gap: 24px; font-size: 13px; color: #b3b3b3; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em; }
.about-values { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 48px; border-top: 1px solid #171717; padding-top: 32px; }
.value-item { display: flex; align-items: center; gap: 12px; }
.value-icon { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(212,175,55,0.1); background: #0a0a0a; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 16px; }
.value-title { font-size: 11px; font-weight: 700; color: #e5e5e5; text-transform: uppercase; letter-spacing: 0.1em; display: block; }
.value-sub { font-size: 9px; color: #737373; text-transform: uppercase; letter-spacing: 0.15em; }

/* ===== OFFER ===== */
.offer-tabs { display: flex; flex-direction: column; gap: 8px; justify-content: center; margin-bottom: 64px; max-width: 760px; margin-left: auto; margin-right: auto; }
@media (min-width: 640px) { .offer-tabs { flex-direction: row; gap: 12px; } }
.offer-tab { padding: 12px 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; border: 1px solid #262626; background: rgba(23,23,23,0.6); color: #a3a3a3; flex: 1; transition: all 0.3s; }
.offer-tab:hover { color: #fff; border-color: #404040; }
.offer-tab.active { background: var(--gold-500); border-color: var(--gold-500); color: #000; box-shadow: 0 4px 20px rgba(212,175,55,0.25); }

.offer-grid { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: stretch; margin: 0 auto; }
@media (min-width: 768px) { .offer-grid.cols-2 { grid-template-columns: repeat(2,1fr); max-width: 880px; } .offer-grid.cols-3 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .offer-grid.cols-3 { grid-template-columns: repeat(3,1fr); } }
.offer-grid.cols-1 { max-width: 600px; }

.offer-card { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 40px; background: linear-gradient(to bottom, #111111, #070707); border: 1px solid rgba(212,175,55,0.1); transition: all 0.5s; overflow: hidden; }
.offer-card:hover { border-color: rgba(212,175,55,0.4); box-shadow: 0 20px 50px rgba(212,175,55,0.08); }
.offer-card.hybrid { border-color: rgba(212,175,55,0.3); }
.offer-card::before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--gold-500); transform: scaleY(0); transition: transform 0.5s; transform-origin: top; }
.offer-card:hover::before { transform: scaleY(1); }
.offer-accent { font-size: 9px; text-transform: uppercase; letter-spacing: 0.25em; color: var(--gold-500); font-weight: 600; display: block; margin-bottom: 24px; }
.offer-title { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; color: #fff; transition: color 0.3s; }
.offer-card:hover .offer-title { color: var(--gold-500); }
.offer-duration { font-family: 'Space Grotesk', sans-serif; font-size: 10px; color: #737373; text-transform: uppercase; letter-spacing: 0.15em; margin: 4px 0 32px; }
.offer-description { font-size: 13px; color: #d4d4d4; font-weight: 300; line-height: 1.7; margin-bottom: 32px; letter-spacing: 0.02em; }
.offer-sep { height: 1px; background: #171717; margin: 24px 0; }
.offer-benefits { display: flex; flex-direction: column; gap: 16px; margin-bottom: 40px; }
.offer-benefit { display: flex; align-items: flex-start; gap: 12px; }
.offer-check { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(212,175,55,0.2); background: rgba(212,175,55,0.05); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px; font-size: 9px; color: var(--gold-500); }
.offer-benefit-text { font-size: 11.5px; color: #a3a3a3; font-weight: 300; line-height: 1.6; letter-spacing: 0.02em; }
.offer-footer { margin-top: auto; padding-top: 24px; border-top: 1px solid #171717; }
.offer-price-row { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 24px; }
.offer-price-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; color: #737373; }
.offer-price { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 800; letter-spacing: 0.02em; color: var(--gold-500); text-transform: uppercase; }
.offer-cta { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.01); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: #d4d4d4; transition: all 0.3s; }
.offer-card:hover .offer-cta { color: #fff; border-color: rgba(212,175,55,0.5); background: rgba(212,175,55,0.05); }

/* ===== WHY US ===== */
.whyus-header { display: flex; flex-direction: column; gap: 24px; justify-content: space-between; margin-bottom: 64px; }
@media (min-width: 768px) { .whyus-header { flex-direction: row; align-items: flex-end; } }
.whyus-header-left { max-width: 480px; }
.whyus-header-right { max-width: 400px; }
.whyus-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 768px) { .whyus-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .whyus-grid { grid-template-columns: repeat(3,1fr); } }
.benefit-card { padding: 40px; background: #0e0e0e; border: 1px solid #171717; transition: all 0.5s; position: relative; display: flex; flex-direction: column; justify-content: space-between; }
.benefit-card:hover { border-color: rgba(212,175,55,0.35); }
.benefit-icon { width: 48px; height: 48px; border-radius: 50%; border: 1px solid #262626; background: #0a0a0a; display: flex; align-items: center; justify-content: center; margin-bottom: 32px; font-size: 18px; transition: border-color 0.5s; }
.benefit-card:hover .benefit-icon { border-color: rgba(212,175,55,0.35); }
.benefit-title { font-family: 'Playfair Display', serif; font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #fff; margin-bottom: 16px; transition: color 0.3s; }
.benefit-card:hover .benefit-title { color: var(--gold-500); }
.benefit-desc { font-size: 13px; color: #a3a3a3; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em; }
.benefit-tag { font-size: 9px; color: #262626; font-family: 'Space Grotesk', sans-serif; letter-spacing: 0.15em; margin-top: 32px; text-align: right; }

/* ===== TIMELINE ===== */
.timeline { position: relative; display: flex; flex-direction: column; gap: 48px; max-width: 900px; margin: 0 auto; }
.timeline-item { position: relative; padding-left: 40px; }
@media (min-width: 768px) { .timeline-item { padding-left: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; } }
.timeline-node { position: absolute; left: 15px; top: 8px; width: 28px; height: 28px; border-radius: 50%; background: var(--black); border: 1px solid #262626; display: flex; align-items: center; justify-content: center; transform: translateX(-50%); z-index: 2; }
@media (min-width: 768px) { .timeline-node { left: 50%; } }
.timeline-node-dot { width: 10px; height: 10px; border-radius: 50%; background: #262626; }
.timeline-card { padding: 32px; background: rgba(9,9,9,0.9); border: 1px solid #171717; position: relative; transition: all 0.3s; box-shadow: 0 10px 35px rgba(0,0,0,0.8); }
.timeline-card:hover { border-color: rgba(212,175,55,0.25); }
.timeline-step-num { position: absolute; top: 16px; right: 16px; font-family: 'Playfair Display', serif; font-size: 30px; font-weight: 800; color: #0a0a0a; }
.timeline-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.timeline-badge { font-size: 10px; font-weight: 700; letter-spacing: 0.15em; color: var(--gold-500); text-transform: uppercase; }
.timeline-icon { width: 32px; height: 32px; border-radius: 50%; background: #0a0a0a; border: 1px solid #262626; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.timeline-title { font-family: 'Playfair Display', serif; font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #fff; margin-bottom: 12px; }
.timeline-desc { font-size: 13px; color: #a3a3a3; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em; }
@media (min-width: 768px) {
  .timeline-item:nth-child(odd) .timeline-card-wrap { order: 1; text-align: right; }
  .timeline-item:nth-child(odd) .timeline-spacer { order: 2; }
  .timeline-item:nth-child(even) .timeline-card-wrap { order: 2; text-align: right; }
  .timeline-item:nth-child(even) .timeline-spacer { order: 1; }
}

/* ===== FAQ ===== */
.faq-list { display: flex; flex-direction: column; gap: 16px; }
.faq-item { border-bottom: 1px solid #171717; background: #0a0a0a; transition: border-color 0.5s; }
.faq-item.open { border-color: rgba(212,175,55,0.4); }
.faq-question { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 24px 24px; text-align: left; }
@media (min-width: 640px) { .faq-question { padding: 24px 32px; } }
.faq-question-left { display: flex; align-items: center; gap: 16px; padding-right: 16px; }
.faq-icon { font-size: 14px; color: #737373; transition: color 0.3s; }
.faq-item.open .faq-icon { color: var(--gold-500); }
.faq-question-text { font-family: 'Playfair Display', serif; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #e5e5e5; transition: color 0.3s; }
@media (min-width: 640px) { .faq-question-text { font-size: 16px; } }
.faq-item.open .faq-question-text { color: var(--gold-500); }
.faq-toggle { width: 32px; height: 32px; border-radius: 50%; border: 1px solid #404040; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all 0.3s; font-size: 14px; color: #a3a3a3; }
.faq-item.open .faq-toggle { border-color: var(--gold-500); background: rgba(212,175,55,0.05); color: var(--gold-500); transform: rotate(180deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.35s cubic-bezier(0.16,1,0.3,1); }
.faq-answer-inner { padding: 8px 24px 32px; }
@media (min-width: 640px) { .faq-answer-inner { padding: 8px 32px 32px; } }
.faq-divider { height: 1px; background: #171717; margin-bottom: 24px; }
.faq-answer-text { font-size: 13px; color: #a3a3a3; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em; }

/* ===== CTA ===== */
.cta-box { position: relative; background: #090909; border: 1px solid rgba(212,175,55,0.2); padding: 56px 24px; text-align: center; box-shadow: 0 30px 70px rgba(0,0,0,0.9); }
@media (min-width: 640px) { .cta-box { padding: 64px 56px; } }
@media (min-width: 768px) { .cta-box { padding: 80px; } }
.cta-icon { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(212,175,55,0.3); background: #0a0a0a; display: flex; align-items: center; justify-content: center; margin: 0 auto 32px; font-size: 20px; }
.cta-desc { font-size: 13px; color: #a3a3a3; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em; margin: 24px auto 48px; max-width: 500px; }
.cta-actions { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; }
@media (min-width: 640px) { .cta-actions { flex-direction: row; } }
.cta-trust { margin-top: 64px; display: flex; align-items: center; justify-content: center; gap: 10px; color: #525252; font-size: 10px; letter-spacing: 0.15em; font-family: 'Space Grotesk', sans-serif; text-transform: uppercase; }

/* ===== SOCIALS ===== */
.social-tile { display: block; max-width: 700px; margin: 0 auto; padding: 40px; background: linear-gradient(to bottom, #0f0f0f, #080808); border: 1px solid #171717; transition: all 0.5s; }
.social-tile:hover { border-color: rgba(212,175,55,0.3); }
.social-tile-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; flex-wrap: wrap; gap: 12px; }
.social-tile-left { display: flex; align-items: center; gap: 16px; }
.social-icon { width: 48px; height: 48px; border-radius: 50%; border: 1px solid #262626; background: #0a0a0a; display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--gold-500); }
.social-platform { font-family: 'Playfair Display', serif; font-size: 14px; font-weight: 700; letter-spacing: 0.05em; color: #fff; display: block; }
.social-username { font-family: 'Space Grotesk', sans-serif; font-size: 11px; color: #a3a3a3; letter-spacing: 0.02em; margin-top: 2px; display: block; }
.social-followers { padding: 4px 12px; background: rgba(212,175,55,0.05); border: 1px solid rgba(212,175,55,0.1); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--gold-500); }
.social-desc { font-size: 13px; color: #d4d4d4; font-weight: 300; line-height: 1.7; letter-spacing: 0.02em; }

/* ===== FOOTER ===== */
.footer { background: var(--black); border-top: 1px solid #171717; color: #fff; }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 48px; padding: 80px 24px; max-width: 1280px; margin: 0 auto; }
@media (min-width: 768px) { .footer-grid { grid-template-columns: 5fr 3fr 4fr; padding: 96px 24px; } }
.footer-brand { display: flex; flex-direction: column; gap: 24px; }
.footer-desc { font-size: 13px; color: #a3a3a3; font-weight: 300; line-height: 1.7; max-width: 380px; letter-spacing: 0.02em; }
.footer-socials { display: flex; gap: 16px; margin-top: 8px; }
.social-circle { width: 40px; height: 40px; border-radius: 50%; border: 1px solid #262626; background: #0a0a0a; display: flex; align-items: center; justify-content: center; color: #a3a3a3; transition: all 0.3s; font-size: 16px; }
.social-circle:hover { border-color: rgba(212,175,55,0.4); color: var(--gold-500); }
.footer-heading { font-family: 'Playfair Display', serif; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.25em; color: var(--gold-500); margin-bottom: 24px; }
.footer-nav ul { display: flex; flex-direction: column; gap: 16px; }
.footer-nav a { font-size: 13px; color: #a3a3a3; font-weight: 300; letter-spacing: 0.02em; transition: color 0.3s; }
.footer-nav a:hover { color: var(--gold-500); }
.footer-contact { display: flex; flex-direction: column; gap: 24px; }
.contact-item { display: flex; align-items: flex-start; gap: 14px; }
.contact-icon { width: 36px; height: 36px; border-radius: 50%; background: #171717; border: 1px solid #262626; display: flex; align-items: center; justify-content: center; color: var(--gold-500); flex-shrink: 0; font-size: 13px; }
.contact-label { font-size: 10px; color: #737373; text-transform: uppercase; letter-spacing: 0.15em; font-family: 'Space Grotesk', sans-serif; display: block; }
.contact-value { font-size: 13px; font-weight: 700; color: #e5e5e5; transition: color 0.3s; display: block; margin-top: 2px; }
.contact-item a.contact-value:hover { color: var(--gold-500); }

.footer-bottom { background: #050505; border-top: 1px solid #0d0d0d; padding: 32px 0; color: #737373; font-size: 12px; }
.footer-bottom-inner { display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 24px; }
@media (min-width: 640px) { .footer-bottom-inner { flex-direction: row; } }
.footer-copy { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; font-family: 'Space Grotesk', sans-serif; }
.sep { display: none; }
@media (min-width: 640px) { .sep { display: inline; } }
.back-to-top { display: flex; align-items: center; gap: 8px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.15em; font-weight: 700; color: var(--gold-500); transition: color 0.3s; }
.back-to-top:hover { color: #fff; }
.back-circle { width: 28px; height: 28px; border-radius: 50%; border: 1px solid #262626; display: flex; align-items: center; justify-content: center; transition: border-color 0.3s; }
.back-to-top:hover .back-circle { border-color: var(--gold-500); }

/* ===== STICKY CTA ===== */
.sticky-cta { position: fixed; bottom: 0; left: 0; right: 0; z-index: 35; padding: 0 16px 16px; transform: translateY(100px); opacity: 0; transition: all 0.5s cubic-bezier(0.16,1,0.3,1); pointer-events: none; }
.sticky-cta.visible { transform: translateY(0); opacity: 1; pointer-events: auto; }
@media (min-width: 768px) { .sticky-cta { display: none; } }
.sticky-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; background: rgba(11,11,11,0.9); backdrop-filter: blur(8px); border: 1px solid rgba(212,175,55,0.15); box-shadow: 0 -10px 30px rgba(0,0,0,0.5); }
.sticky-cta-brand { display: flex; flex-direction: column; padding-left: 8px; flex-shrink: 0; }
.sticky-brand-name { font-family: 'Playfair Display', serif; font-size: 10px; letter-spacing: 0.2em; font-weight: 800; color: var(--gold-500); text-transform: uppercase; }
.sticky-brand-sub { font-size: 8px; color: #a3a3a3; text-transform: uppercase; letter-spacing: 0.15em; margin-top: 2px; }
.sticky-cta-actions { display: flex; align-items: center; gap: 8px; flex-grow: 1; justify-content: flex-end; }
.sticky-btn { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 14px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; flex-shrink: 0; }
/* ===== MATERIAL SYMBOLS ===== */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 20;
  font-size: 18px;
  line-height: 1;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
}
.btn .material-symbols-outlined, .sticky-btn .material-symbols-outlined { font-size: 16px; }
.value-icon .material-symbols-outlined, .social-icon .material-symbols-outlined, .contact-icon .material-symbols-outlined { font-size: 18px; color: var(--gold-500); }
.benefit-icon .material-symbols-outlined { font-size: 22px; color: var(--gold-500); }
.timeline-icon .material-symbols-outlined { font-size: 16px; color: var(--gold-500); }
.cta-icon .material-symbols-outlined { font-size: 22px; color: var(--gold-500); }
.faq-icon.material-symbols-outlined { font-size: 16px; }
.faq-toggle .material-symbols-outlined { font-size: 16px; }
.hero-bottom-item .material-symbols-outlined { font-size: 14px; color: var(--gold-500); }
.social-circle .material-symbols-outlined { font-size: 18px; }

/* ===== PHONE TOAST (desktop "show number" popup) ===== */
.phone-toast {
  position: fixed; bottom: 32px; left: 50%; transform: translate(-50%, 20px);
  display: flex; align-items: center; gap: 10px;
  padding: 16px 24px; background: rgba(11,11,11,0.97); border: 1px solid rgba(212,175,55,0.35);
  color: #fff; font-size: 13px; font-weight: 500; letter-spacing: 0.02em;
  box-shadow: 0 15px 40px rgba(0,0,0,0.6);
  opacity: 0; z-index: 200; transition: all 0.35s cubic-bezier(0.16,1,0.3,1); pointer-events: none;
}
.phone-toast .material-symbols-outlined { color: var(--gold-500); font-size: 18px; }
.phone-toast strong { color: var(--gold-500); font-weight: 700; letter-spacing: 0.05em; }
.phone-toast.visible { opacity: 1; transform: translate(-50%, 0); }