:root {
    --color-primary: #232833;
    --color-secondary: #b58a3c;
    --color-accent: #d4b26a;
    --color-bg: #f6f2ea;
    --color-text: #20242c;
    --header-bg: #17212b;
    --footer-bg-start: #17212b;
    --footer-bg-end: #7b5d22;
    --mobile-bar-bg: #151515;
    --mobile-bar-cta-bg: #d4a958;
    --color-white: #ffffff;
    --radius: 20px;
    --shadow: 0 24px 60px rgba(10, 30, 60, 0.12);
}
* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", sans-serif; color: var(--color-text); background: linear-gradient(180deg, var(--color-bg) 0%, #f3ede3 100%); line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; border-radius: 18px; }
.topbar,.navbar,.section,.site-footer,.inner-hero,.hero,.not-found { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }
.topbar { display:flex; justify-content:space-between; gap:16px; padding:10px 0; font-size:14px; color:#e7dcc7; }
.site-header { background: linear-gradient(120deg, var(--header-bg), var(--color-primary)); position: sticky; top: 0; z-index: 40; box-shadow: 0 18px 40px rgba(9, 20, 48, 0.18); border-bottom: 1px solid rgba(212,178,106,.18); }
.navbar { display:flex; align-items:center; justify-content:space-between; padding:18px 0; gap:20px; }
.brand { color:#fff; font-weight:800; font-size:28px; letter-spacing:.4px; }
.desktop-nav { display:flex; gap:18px; color:#dbeafe; align-items:center; }
.nav-item { position:relative; }
.nav-item > a { display:inline-flex; align-items:center; gap:6px; }
.has-children > a::after { content:'+'; font-size:12px; opacity:.8; }
.mobile-menu-toggle,.mobile-menu-panel { display:none; }
.submenu { display:none; position:absolute; top:calc(100% + 12px); left:0; min-width:220px; padding:10px; background:#fff; color:#0f172a; border-radius:16px; box-shadow:0 18px 40px rgba(15,23,42,.16); z-index:50; }
.submenu .nav-item { display:block; }
.submenu a { display:block; padding:10px 12px; border-radius:10px; }
.submenu .submenu { left:calc(100% + 10px); top:0; }
.has-children:hover > .submenu { display:block; }
.nav-cta,.hero-actions,.topbar-actions { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; padding:14px 20px; border-radius:999px; font-weight:700; border:none; cursor:pointer; }
.btn-primary { background: linear-gradient(120deg, var(--color-accent), var(--color-secondary)); color:#1e2025; }
.btn-whatsapp { background:#12b981; color:#fff; }
.btn-light,.btn-outline { background:#fff; color:var(--color-primary); }
.full { width:100%; }
.hero { display:grid; grid-template-columns:1.2fr .8fr; gap:32px; padding:56px 0 48px; align-items:center; }
.hero-slider { grid-column: 1 / -1; position: relative; width:100% !important; max-width:100% !important; overflow:hidden !important; }
.hero-slider-viewport { width:100% !important; max-width:100% !important; overflow:hidden !important; border-radius: 28px; position:relative; }
.hero-slider-track { display:flex !important; flex-wrap:nowrap !important; align-items:stretch !important; width:100% !important; min-width:100% !important; transition: transform .55s ease; will-change: transform; min-height: 540px; }
.hero-slide { flex: 0 0 100% !important; width:100% !important; min-width:100% !important; max-width:100% !important; display:grid !important; grid-template-columns: 1.05fr .95fr; gap:32px; align-items:stretch; box-sizing:border-box; }
.hero-copy,.hero-panel,.card,.testimonial,.ba-card,.sticky-card,.contact-form,.contact-info,.stat-box,.table-card,.login-card { background: var(--color-white); border-radius: var(--radius); box-shadow: var(--shadow); }
.hero-copy { padding:40px; background: linear-gradient(145deg, rgba(23,33,43,.96), rgba(86,68,34,.92)); color:#fff; }
.hero-panel { padding:24px; display:grid; gap:16px; align-content:center; background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,240,227,.98)); }
.hero-visual { display:grid; gap:18px; align-content:space-between; }
.hero-image-frame { min-height: 420px; padding: 18px; border-radius: 28px; overflow:hidden; background:
radial-gradient(circle at top left, rgba(212,178,106,.45), transparent 36%),
linear-gradient(135deg, rgba(255,255,255,.98), rgba(246,237,222,.96)); box-shadow: var(--shadow); }
.hero-image-frame img { width:100%; height:100%; min-height:384px; object-fit:cover; object-position:center center; border-radius:22px; }
.hero-slider-controls { margin-top: 20px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.hero-dots { display:flex; gap:10px; justify-content:center; }
.hero-dot,.slider-arrow { border:none; cursor:pointer; }
.hero-dot { width:12px; height:12px; border-radius:999px; background:rgba(15,23,42,.18); }
.hero-dot.is-active { width:34px; background:linear-gradient(120deg, var(--color-accent), var(--color-secondary)); }
.slider-arrow { width:48px; height:48px; border-radius:999px; background:#fff; color:var(--color-primary); box-shadow: var(--shadow); font-size:24px; line-height:1; }
.eyebrow,.section-heading span,.inner-hero span,.not-found span { color:var(--color-accent); text-transform:uppercase; font-size:13px; letter-spacing:1.8px; font-weight:800; }
h1,h2,h3,h4,p { margin-top:0; }
h1 { font-size: clamp(34px, 5vw, 62px); line-height:1.05; margin:14px 0 16px; }
h2 { font-size: clamp(28px, 4vw, 42px); line-height:1.1; }
.hero-badges { display:flex; gap:10px; flex-wrap:wrap; margin-top:22px; }
.hero-badges span,.stat-card,.steps div { padding:12px 14px; border-radius:16px; background: rgba(255,255,255,.12); backdrop-filter: blur(10px); }
.section { padding:56px 0; }
.section.alt { background: rgba(255,255,255,.55); width:100%; padding-inline: max(16px, calc((100vw - 1180px)/2)); }
.section-heading { max-width:760px; margin-bottom:24px; }
.card-grid,.reasons,.testimonial-grid,.before-after-grid,.footer-grid,.contact-layout,.detail-layout,.stats-grid,.form-grid,.checkbox-grid { display:grid; gap:20px; }
.card-grid,.reasons,.testimonial-grid,.before-after-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.card,.testimonial,.ba-card,.contact-form,.contact-info,.sticky-card { padding:24px; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.steps div { background:linear-gradient(135deg, #f3e4bf, #ffffff); text-align:center; font-weight:700; }
.ba-images { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.faq-list { display:grid; gap:14px; }
details { background:#fff; border-radius:18px; padding:18px 22px; box-shadow: var(--shadow); }
.contact-cta { display:grid; grid-template-columns: .9fr 1.1fr; gap:24px; align-items:start; }
.contact-form input,.contact-form textarea,.contact-form select,.settings-form input,.settings-form textarea,.settings-form select { width:100%; padding:14px 16px; border:1px solid #cbd5e1; border-radius:16px; font:inherit; }
.contact-form textarea,.settings-form textarea { min-height:140px; resize:vertical; }
.checkbox { display:flex; gap:10px; align-items:flex-start; font-size:14px; }
.map-section iframe { width:100%; min-height:380px; border:0; border-radius:22px; box-shadow: var(--shadow); }
.site-footer { padding:56px 0 20px; }
.footer-grid { grid-template-columns:1.2fr .8fr .8fr; padding:28px; border-radius:26px; background: linear-gradient(135deg, var(--footer-bg-start), var(--footer-bg-end)); color:#fff; }
.footer-grid a { display:block; margin-bottom:8px; color:#e0f2fe; }
.footer-bottom { text-align:center; color:#64748b; padding:18px 0 90px; }
.mobile-sticky-bar { position:fixed; bottom:0; left:0; right:0; display:none; grid-template-columns:1fr 1fr 1fr; background:var(--mobile-bar-bg); padding:10px; gap:10px; z-index:60; }
.mobile-sticky-bar a,.mobile-sticky-bar button { border:none; background:#262a30; color:#fff; padding:14px 10px; border-radius:14px; font-weight:800; }
.mobile-sticky-bar a:last-child,.mobile-sticky-bar button:last-child { background:var(--mobile-bar-cta-bg); color:#1f2022; }
.quote-modal[hidden] { display:none; }
.quote-modal { position:fixed; inset:0; background:rgba(3,7,18,.65); display:grid; place-items:center; z-index:70; padding:16px; }
.quote-card { width:min(560px, 100%); background:#fff; border-radius:24px; padding:24px; position:relative; }
.modal-close { position:absolute; right:12px; top:12px; background:none; border:none; font-size:28px; cursor:pointer; }
.flash { position:fixed; top:96px; right:18px; z-index:80; padding:14px 18px; border-radius:14px; color:#fff; }
.flash-success { background:#16a34a; }
.flash-error { background:#dc2626; }
.inner-hero,.not-found { padding:54px 0 18px; }
.detail-layout,.contact-layout { grid-template-columns: 1.2fr .8fr; align-items:start; }
.prose { background:#fff; padding:28px; border-radius:26px; box-shadow: var(--shadow); }
.hidden-field { position:absolute; left:-9999px; }

@media (max-width: 900px) {
    .hero,.contact-cta,.detail-layout,.contact-layout,.footer-grid,.hero-slide { grid-template-columns:1fr; }
    .desktop-nav,.topbar { display:none; }
    .nav-cta { display:none; }
    .mobile-menu-toggle { display:inline-flex; align-items:center; justify-content:center; padding:12px 16px; border-radius:999px; border:none; background:#fff; color:var(--color-primary); font-weight:800; cursor:pointer; }
    .mobile-menu-panel { display:block; width:min(1180px, calc(100% - 32px)); margin:0 auto 18px; }
    .mobile-menu-panel[hidden] { display:none; }
    .mobile-menu-inner { display:grid; gap:12px; padding:18px; background:#fff; border-radius:24px; box-shadow:var(--shadow); }
    .mobile-menu-actions { display:grid; gap:10px; grid-template-columns:1fr 1fr; }
    .mobile-menu-item { display:grid; gap:10px; padding:8px 0; border-bottom:1px solid #e2e8f0; }
    .mobile-menu-item:last-child { border-bottom:none; }
    .mobile-menu-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
    .mobile-menu-row a { font-weight:700; color:var(--color-primary); }
    .mobile-submenu-toggle { width:36px; height:36px; border:none; border-radius:999px; background:#e0f2fe; color:var(--color-primary); font-size:20px; line-height:1; cursor:pointer; }
    .mobile-submenu-toggle.is-open { background:#0ea5e9; color:#fff; }
    .mobile-submenu { display:grid; gap:8px; padding:8px 0 0 14px; }
    .mobile-sticky-bar { display:grid; }
    .steps { grid-template-columns:1fr 1fr; }
    .navbar { padding:16px 0; }
    .hero-slider-track { min-height: unset; }
    .hero-image-frame { min-height: 320px; padding: 12px; }
    .hero-image-frame img { min-height: 296px; aspect-ratio: 4 / 5; object-fit: cover; object-position: center center; }
}

@media (max-width: 640px) {
    .hero-copy,.hero-panel,.card,.testimonial,.ba-card,.contact-form,.contact-info,.sticky-card,.table-card,.login-card { padding:20px; }
    h1 { font-size:34px; }
    .steps,.ba-images { grid-template-columns:1fr; }
    .mobile-menu-actions { grid-template-columns:1fr; }
}
