/*
 Theme Name:   Astra Luxury Child V2
 Theme URI:    https://afterdubai.com
 Description:  Premium child theme for Astra with design system.
 Author:       BaliDubai Team
 Author URI:   https://dubaibali.com
 Template:     astra
 Version:      2.0.0
 License:      GPL v2 or later
 Text Domain:  astra-luxury-child
*/

:root {
  --brand-navy: #0A1628;
  --brand-gold: #C5A572;
  --brand-teal: #1A7A7A;
  --brand-white: #FAFAF8;
  --brand-warm-bg: #FAFAF8;
  --brand-card-dark: #111E30;
  --brand-gold-hover: color-mix(in srgb, var(--brand-gold) 85%, white);
  --brand-navy-light: color-mix(in srgb, var(--brand-navy) 80%, white);
  --brand-text-on-dark: rgba(250, 250, 248, 0.7);
  --brand-text-on-light: #2D3748;
  --brand-shadow: rgba(0, 0, 0, 0.12);
  --brand-shadow-hover: rgba(0, 0, 0, 0.2);
  --space-section: clamp(80px, 10vw, 160px);
  --space-section-inner: clamp(48px, 6vw, 80px);
  --space-content: clamp(24px, 3vw, 48px);
  --space-card: clamp(20px, 2.5vw, 32px);
  --type-h1: clamp(36px, 5.5vw, 72px);
  --type-h2: clamp(28px, 4vw, 54px);
  --type-h3: clamp(20px, 2.5vw, 32px);
  --type-h4: clamp(18px, 2vw, 24px);
  --type-body: clamp(16px, 1.2vw, 19px);
  --type-small: clamp(13px, 1vw, 15px);
  --type-tagline: clamp(12px, 1vw, 14px);
  --ls-tagline: 3px;
  --ls-button: 1.5px;
  --ls-nav: 0.5px;
  --transition-fast: 0.2s ease;
  --transition-base: 0.3s ease;
  --transition-slow: 0.6s ease;
  --transition-reveal: 0.8s ease;
}
body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: var(--type-body); color: var(--brand-text-on-light); background: var(--brand-white); -webkit-font-smoothing: antialiased; line-height: 1.7; }
h1, h2, h3, h4 { font-family: 'Playfair Display', Georgia, serif; line-height: 1.2; }
h1 { font-size: var(--type-h1); } h2 { font-size: var(--type-h2); } h3 { font-size: var(--type-h3); } h4 { font-size: var(--type-h4); }

.db-section [style*="grid-template-columns: repeat(3"], .db-section [style*="grid-template-columns:repeat(3"] { gap: var(--space-card) !important; }
.db-section [style*="grid-template-columns: repeat(2"], .db-section [style*="grid-template-columns:repeat(2"] { gap: var(--space-card) !important; }
@media (max-width: 768px) {
  .db-section [style*="grid-template-columns: repeat(3"], .db-section [style*="grid-template-columns:repeat(3"],
  .db-section [style*="grid-template-columns: repeat(2"], .db-section [style*="grid-template-columns:repeat(2"] { grid-template-columns: 1fr !important; gap: 20px !important; }
  .db-section { padding-left: 16px !important; padding-right: 16px !important; }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .db-section [style*="grid-template-columns: repeat(3"], .db-section [style*="grid-template-columns:repeat(3"] { grid-template-columns: repeat(2, 1fr) !important; }
}

.db-hero { position: relative; overflow: hidden; min-height: 90vh; display: flex; align-items: center; justify-content: center; }
.db-hero::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(ellipse at 30% 50%, rgba(197,165,114,0.1) 0%, transparent 60%); pointer-events: none; z-index: 2; }
.db-hero-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.db-hero-video-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(10,22,40,0.3) 0%, rgba(10,22,40,0.75) 100%); z-index: 1; }
.db-hero-content { position: relative; z-index: 3; text-align: center; max-width: 900px; padding: 0 24px; }
.db-hero h1 { font-size: var(--type-h1); color: var(--brand-white); margin-bottom: 24px; }
.db-hero .db-tagline { color: var(--brand-gold); font-size: var(--type-tagline); letter-spacing: var(--ls-tagline); text-transform: uppercase; margin-bottom: 16px; }
@media (max-width: 768px) { .db-hero-video { display: none; } .db-hero { background-size: cover; background-position: center; min-height: 70vh; } }

body.home #masthead, body.home .ast-primary-header { transition: background var(--transition-base), box-shadow var(--transition-base); }
body.home .header-transparent #masthead, body.home .header-transparent .ast-primary-header { background: transparent !important; }
body.home .header-solid #masthead, body.home .header-solid .ast-primary-header { background: var(--brand-navy) !important; box-shadow: 0 2px 20px rgba(0,0,0,0.15); }

.db-anim-hidden { opacity: 0; transform: translateY(30px); transition: opacity var(--transition-reveal), transform var(--transition-reveal); }
.db-anim-visible { opacity: 1; transform: translateY(0); }
.db-anim-delay-1 { transition-delay: 0.1s; } .db-anim-delay-2 { transition-delay: 0.2s; } .db-anim-delay-3 { transition-delay: 0.3s; }
[data-stagger] > * { opacity: 0; transform: translateY(20px); transition: opacity var(--transition-slow), transform var(--transition-slow); }
[data-stagger].db-stagger-active > * { opacity: 1; transform: translateY(0); }
.db-parallax-container { overflow: hidden; position: relative; }
[data-scroll-scale] { overflow: hidden; border-radius: 12px; }

figure.db-content-image { margin: var(--space-content) 0; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 32px var(--brand-shadow); }
figure.db-content-image img { width: 100%; height: auto; display: block; transition: transform 0.4s ease; }

.db-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-content); align-items: center; margin: var(--space-section-inner) 0; }
.db-split-reverse { direction: rtl; } .db-split-reverse > * { direction: ltr; }
@media (max-width: 768px) { .db-split, .db-split-reverse { grid-template-columns: 1fr !important; direction: ltr; } }

.db-pull-quote { border-left: 3px solid var(--brand-gold); padding: 24px 32px; margin: var(--space-section-inner) 0; font-family: 'Playfair Display', serif; font-size: clamp(20px, 2.5vw, 28px); font-style: italic; color: var(--brand-navy); background: rgba(197,165,114,0.05); border-radius: 0 8px 8px 0; }
.db-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-card); text-align: center; padding: var(--space-section-inner) 0; }
.db-stats-row .db-stat-number { font-family: 'Playfair Display', serif; font-size: clamp(36px, 4vw, 56px); font-weight: 700; color: var(--brand-gold); }
@media (max-width: 768px) { .db-stats-row { grid-template-columns: 1fr; } }

.aeo-atomic-answer { background: #f8f9fa; border-left: 4px solid var(--brand-gold); padding: 20px 24px; margin: var(--space-content) 0; border-radius: 0 8px 8px 0; font-size: 17px; }
.db-section [style*="display: grid"] > p, .db-section [style*="display:grid"] > p { display: none !important; }

.db-cta-button { display: inline-block; padding: 16px 40px; background: var(--brand-gold); color: var(--brand-navy) !important; font-weight: 600; font-size: 15px; letter-spacing: var(--ls-button); text-transform: uppercase; text-decoration: none; border-radius: 8px; transition: all var(--transition-base); border: none; cursor: pointer; }
@media (hover: hover) { .db-cta-button:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(197,165,114,0.3); } }

.db-inquiry-widget { background: var(--brand-navy); padding: var(--space-section-inner); border-radius: 16px; max-width: 600px; margin: var(--space-content) auto; }
.db-inquiry-widget input, .db-inquiry-widget select, .db-inquiry-widget textarea { width: 100%; padding: 14px 20px; margin-bottom: 12px; border: 1px solid rgba(197,165,114,0.3); border-radius: 8px; background: rgba(255,255,255,0.05); color: var(--brand-white); font-size: 16px; }

.db-footer { background: var(--brand-navy); color: var(--brand-white); padding: var(--space-section) 24px 30px; }
.db-footer a { color: var(--brand-text-on-dark); text-decoration: none; transition: color var(--transition-base); }
@media (hover: hover) { .db-footer a:hover { color: var(--brand-gold); } }

.db-whatsapp-float { position: fixed; bottom: 24px; right: 24px; width: 60px; height: 60px; background: #25D366; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 16px rgba(37,211,102,0.4); z-index: 9999; transition: transform var(--transition-base); }
@media (hover: hover) { .db-whatsapp-float:hover { transform: scale(1.1); } }
.db-whatsapp-float svg { width: 32px; height: 32px; fill: white; }

.db-carousel { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--space-card); padding: 8px 0 24px; scrollbar-width: none; }
.db-carousel::-webkit-scrollbar { display: none; }
.db-carousel > * { scroll-snap-align: start; flex: 0 0 calc(33.333% - var(--space-card)); min-width: 280px; }
@media (max-width: 768px) { .db-carousel > * { flex: 0 0 85%; } }

a, button, input, select, textarea, [role="button"] { min-height: 44px; }
:focus-visible { outline: 2px solid var(--brand-gold); outline-offset: 2px; }
.db-skip-link { position: absolute; top: -100px; left: 0; background: var(--brand-gold); color: var(--brand-navy); padding: 8px 16px; z-index: 10000; }
.db-skip-link:focus { top: 0; }