/* ========================================
   TUOLV MODULAR HOMES — STYLESHEET
   Premium Modular Home Website
   ======================================== */

/* ===== RESET & BASE ===== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
    font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
    color:#1a1a2e; background:#fff; line-height:1.6; overflow-x:hidden;
}
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
button { cursor:pointer; border:none; font-family:inherit; }

/* ===== COLOR VARIABLES ===== */
:root {
    --green-dark:#0d3320;
    --green-mid:#14532d;
    --green-light:#166534;
    --blue:#1e3a5f;
    --blue-mid:#2563eb;
    --gold:#d4a017;
    --gold-light:#fbbf24;
    --charcoal:#1a1a2e;
    --gray-50:#f8fafc;
    --gray-100:#f1f5f9;
    --gray-200:#e2e8f0;
    --gray-300:#cbd5e1;
    --gray-400:#94a3b8;
    --gray-500:#64748b;
    --gray-600:#475569;
    --gray-700:#334155;
    --gray-800:#1e293b;
    --red:#dc2626;
    --green:#16a34a;
    --shadow-sm:0 1px 3px rgba(0,0,0,.08);
    --shadow-md:0 4px 12px rgba(0,0,0,.1);
    --shadow-lg:0 8px 30px rgba(0,0,0,.12);
    --shadow-xl:0 20px 60px rgba(0,0,0,.15);
    --radius:12px;
    --radius-lg:20px;
}

/* ===== TYPOGRAPHY HELPERS ===== */
.text-accent { color:var(--gold); }
.section-eyebrow {
    display:inline-block; font-size:.85rem; font-weight:600;
    text-transform:uppercase; letter-spacing:2px;
    color:var(--green-light); margin-bottom:.5rem;
}
.section-title {
    font-size:2.2rem; font-weight:800; line-height:1.2;
    margin-bottom:1rem; color:var(--charcoal);
}
.section-desc {
    font-size:1.1rem; color:var(--gray-600);
    max-width:700px; margin:0 auto 2rem;
}

/* ===== BUTTONS ===== */
.btn {
    display:inline-flex; align-items:center; justify-content:center;
    padding:.75rem 1.5rem; border-radius:var(--radius);
    font-weight:600; font-size:1rem; transition:all .3s ease;
    gap:.5rem; white-space:nowrap;
}
.btn-large { padding:1rem 2rem; font-size:1.1rem; }
.btn-block { display:flex; width:100%; }
.btn-primary {
    background:linear-gradient(135deg,var(--green-dark),var(--green-mid));
    color:#fff; box-shadow:var(--shadow-md);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); filter:brightness(1.1); }
.btn-whatsapp {
    background:linear-gradient(135deg,#25d366,#128c7e);
    color:#fff; box-shadow:var(--shadow-md);
}
.btn-whatsapp:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); filter:brightness(1.1); }
.btn-outline {
    background:transparent; border:2px solid var(--green-light);
    color:var(--green-light);
}
.btn-outline:hover { background:var(--green-light); color:#fff; }

/* ===== NAVIGATION ===== */
.navbar {
    position:fixed; top:0; left:0; right:0; z-index:1000;
    background:rgba(26,26,46,.95); backdrop-filter:blur(12px);
    transition:all .3s ease; padding:.5rem 0;
}
.nav-container {
    max-width:1200px; margin:0 auto; padding:0 1.5rem;
    display:flex; align-items:center; justify-content:space-between;
}
.nav-logo { display:flex; align-items:center; gap:.5rem; font-size:1.4rem; font-weight:800; color:#fff; }
.logo-icon { font-size:1.6rem; }
.logo-text { color:#fff; }
.logo-accent { color:var(--gold-light); }
.nav-menu { display:flex; gap:2rem; }
.nav-link { color:rgba(255,255,255,.8); font-weight:500; transition:color .2s; font-size:.95rem; }
.nav-link:hover, .nav-link.active { color:var(--gold-light); }
.nav-cta {
    background:linear-gradient(135deg,#25d366,#128c7e); color:#fff;
    padding:.6rem 1.2rem; border-radius:var(--radius); font-weight:600;
    font-size:.9rem; transition:all .3s;
}
.nav-cta:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.nav-toggle { display:none; flex-direction:column; gap:4px; background:none; padding:.5rem; }
.nav-toggle span { width:25px; height:2px; background:#fff; border-radius:2px; transition:all .3s; }

/* ===== HERO SECTION ===== */
.hero {
    position:relative; min-height:100vh; display:flex; align-items:center;
    padding:100px 0 60px; overflow:hidden;
    background:linear-gradient(160deg,#0d3320 0%,#1a1a2e 50%,#0f3460 100%);
}
.hero-bg {
    position:absolute; inset:0;
    background:
        radial-gradient(ellipse 800px 600px at 70% 40%,rgba(212,160,23,.15),transparent),
        radial-gradient(ellipse 600px 400px at 20% 70%,rgba(37,211,102,.08),transparent);
}
.hero-overlay {
    position:absolute; inset:0;
    background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 60 60"><circle cx="30" cy="30" r="1" fill="rgba(255,255,255,.03)"/></svg>') repeat;
}
.hero-container {
    position:relative; z-index:2; max-width:1200px; margin:0 auto;
    padding:0 1.5rem; display:grid; grid-template-columns:1.1fr .9fr;
    gap:3rem; align-items:center;
}
.hero-badge {
    display:inline-flex; align-items:center; gap:.5rem;
    background:rgba(212,160,23,.15); border:1px solid rgba(212,160,23,.3);
    color:var(--gold-light); padding:.5rem 1rem; border-radius:50px;
    font-size:.85rem; font-weight:500; margin-bottom:1.5rem;
}
.badge-dot { width:8px; height:8px; background:var(--gold-light); border-radius:50%; animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
.hero-title {
    font-size:3.5rem; font-weight:900; color:#fff; line-height:1.1;
    margin-bottom:1.5rem;
}
.hero-title-accent {
    background:linear-gradient(135deg,var(--gold-light),#f59e0b);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    background-clip:text;
}
.hero-subtitle { font-size:1.2rem; color:rgba(255,255,255,.8); margin-bottom:2rem; line-height:1.7; }
.hero-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2rem; }
.hero-stat {
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
    border-radius:var(--radius); padding:1rem; text-align:center;
}
.stat-number { font-size:2rem; font-weight:900; color:var(--gold-light); display:block; }
.stat-currency { font-size:1.5rem; font-weight:900; color:var(--gold-light); }
.stat-flag { font-size:2rem; }
.stat-unit { font-size:.85rem; color:rgba(255,255,255,.6); }
.stat-label { font-size:.75rem; color:rgba(255,255,255,.6); display:block; margin-top:.2rem; }
.hero-actions { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.5rem; }
.hero-contact-line { color:rgba(255,255,255,.6); font-size:.9rem; }

/* Hero Visual */
.hero-visual { position:relative; }
.hero-card {
    background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
    border-radius:var(--radius-lg); overflow:hidden; backdrop-filter:blur(10px);
    box-shadow:var(--shadow-xl);
}
.hero-card-image {
    height:280px; position:relative;
    background-image:url('images/enhanced-01-showroom.png');
    background-size:cover; background-position:center;
}
.hero-card-image::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.6),transparent 50%);
}
.hero-card-badge {
    position:absolute; top:1rem; right:1rem; z-index:3;
    background:var(--red); color:#fff; padding:.4rem .8rem;
    border-radius:6px; font-size:.75rem; font-weight:700; letter-spacing:1px;
}
.hero-card-info { padding:1.2rem; }
.hero-card-title { color:#fff; font-weight:600; margin-bottom:.5rem; }
.hero-card-price { display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
.price-old { text-decoration:line-through; color:rgba(255,255,255,.4); font-size:1rem; }
.price-now { color:var(--gold-light); font-size:1.5rem; font-weight:800; }
.price-save { background:var(--green); color:#fff; padding:.2rem .6rem; border-radius:4px; font-size:.75rem; font-weight:600; }
.floating-cta {
    position:absolute; bottom:-1rem; right:-1rem;
    background:linear-gradient(135deg,#25d366,#128c7e); color:#fff;
    padding:.8rem 1.5rem; border-radius:50px; font-weight:600;
    box-shadow:var(--shadow-lg); animation:bounce 2s infinite;
}
@keyframes bounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
.floating-cta a { color:#fff; }

.hero-scroll {
    position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
    color:rgba(255,255,255,.5); font-size:.85rem; text-align:center; z-index:2;
}
.scroll-arrow { width:2px; height:30px; background:rgba(255,255,255,.3); margin:.5rem auto 0; animation:scrollHint 1.5s infinite; }
@keyframes scrollHint { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* ===== TRUST BAR ===== */
.trust-bar {
    background:var(--charcoal); padding:1rem 0;
    border-bottom:1px solid rgba(255,255,255,.05);
}
.trust-container {
    max-width:1200px; margin:0 auto; padding:0 1.5rem;
    display:flex; justify-content:space-around; flex-wrap:wrap; gap:1rem;
}
.trust-item { display:flex; align-items:center; gap:.5rem; color:rgba(255,255,255,.7); font-size:.9rem; font-weight:500; }
.trust-icon { font-size:1.2rem; }

/* ===== SECTION CONTAINER ===== */
.section-container { max-width:1200px; margin:0 auto; padding:0 1.5rem; }
.section-header { text-align:center; margin-bottom:3rem; }
.section-header .section-title { max-width:800px; margin-left:auto; margin-right:auto; }

/* ===== PRODUCTS SECTION ===== */
.products { padding:80px 0; background:var(--gray-50); }
.products-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.product-card {
    background:#fff; border-radius:var(--radius-lg); overflow:hidden;
    box-shadow:var(--shadow-md); transition:all .4s ease; position:relative;
}
.product-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-xl); }
.product-card-featured { border:2px solid var(--gold); }
.product-image {
    height:280px; background-size:cover; background-position:center;
    position:relative;
}
.product-badge {
    position:absolute; top:1rem; left:1rem; padding:.4rem .8rem;
    border-radius:6px; font-size:.75rem; font-weight:700; color:#fff;
}
.product-badge-hot { background:var(--red); }
.product-badge-best { background:var(--gold); color:var(--charcoal); }
.product-body { padding:2rem; }
.product-name { font-size:1.5rem; font-weight:700; margin-bottom:.3rem; }
.product-dim { color:var(--gray-500); font-size:.9rem; margin-bottom:1rem; }
.product-features { margin-bottom:1.5rem; }
.product-features li { padding:.3rem 0; font-size:.95rem; color:var(--gray-700); }
.product-price-block { background:var(--gray-50); border-radius:var(--radius); padding:1rem; margin-bottom:1.5rem; text-align:center; }
.price-original { color:var(--gray-400); font-size:.9rem; margin-bottom:.3rem; }
.price-current { margin-bottom:.3rem; }
.price-big { font-size:2rem; font-weight:900; color:var(--green-dark); }
.price-fob { background:var(--blue); color:#fff; padding:.2rem .5rem; border-radius:4px; font-size:.7rem; margin-left:.3rem; vertical-align:middle; }
.price-save-big { color:var(--green); font-weight:700; font-size:.95rem; }
.product-actions { display:flex; gap:.8rem; flex-wrap:wrap; }

/* ===== LAYOUT SECTION ===== */
.layout-section { padding:80px 0; background:#fff; }
.layout-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:3rem; align-items:start; }
.layout-image-wrap { position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); }
.layout-image { width:100%; display:block; }
.layout-zoom {
    position:absolute; bottom:1rem; right:1rem;
    background:rgba(0,0,0,.7); color:#fff; padding:.5rem 1rem;
    border-radius:6px; font-size:.8rem; cursor:pointer;
}
.layout-details h3 { font-size:1.5rem; margin-bottom:1rem; }
.layout-list { margin-bottom:1.5rem; }
.layout-list li { display:flex; justify-content:space-between; padding:.6rem 0; border-bottom:1px solid var(--gray-100); }
.layout-room { font-weight:500; }
.layout-size { color:var(--gray-500); font-size:.9rem; }
.layout-note { background:var(--gray-50); padding:1rem; border-radius:var(--radius); margin-bottom:1.5rem; }
.layout-note p { font-size:.9rem; margin-bottom:.3rem; }

/* ===== HOW IT WORKS ===== */
.how-it-works { padding:80px 0; background:linear-gradient(180deg,#0d3320,#14532d); color:#fff; }
.how-it-works .section-title { color:#fff; }
.how-it-works .section-desc { color:rgba(255,255,255,.7); }
.timeline { max-width:800px; margin:0 auto; position:relative; padding:2rem 0; }
.timeline::before { content:''; position:absolute; left:30px; top:0; bottom:0; width:3px; background:rgba(255,255,255,.1); }
.timeline-item { position:relative; padding-left:80px; margin-bottom:2.5rem; }
.timeline-number {
    position:absolute; left:0; top:0; width:60px; height:60px;
    background:var(--gold); color:var(--charcoal); border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:1.5rem; font-weight:900; z-index:2;
    box-shadow:0 0 0 4px rgba(212,160,23,.2);
}
.timeline-content { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius); padding:1.5rem; }
.timeline-content h4 { font-size:1.2rem; margin-bottom:.5rem; color:var(--gold-light); }
.timeline-content p { color:rgba(255,255,255,.7); }
.timeline-time { display:inline-block; margin-top:.5rem; background:rgba(37,211,102,.15); color:#25d366; padding:.2rem .6rem; border-radius:4px; font-size:.8rem; font-weight:600; }
.timeline-cta { text-align:center; margin-top:2rem; }
.timeline-cta-bar {
    display:inline-block; background:var(--gold); color:var(--charcoal);
    padding:1rem 2rem; border-radius:50px; font-size:1.2rem; font-weight:800;
    box-shadow:var(--shadow-lg);
}

/* ===== SPECS SECTION ===== */
.specs { padding:80px 0; background:var(--gray-50); }
.specs-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.spec-card {
    background:#fff; border-radius:var(--radius); padding:2rem;
    box-shadow:var(--shadow-sm); transition:all .3s; text-align:center;
    border:1px solid var(--gray-100);
}
.spec-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--green-light); }
.spec-icon { font-size:2.5rem; margin-bottom:1rem; }
.spec-card h4 { font-size:1.1rem; margin-bottom:.5rem; color:var(--charcoal); }
.spec-card p { font-size:.9rem; color:var(--gray-600); }

/* ===== COMPARISON TABLE ===== */
.comparison { padding:80px 0; background:#fff; }
.comparison-table-wrap { overflow-x:auto; }
.comparison-table { width:100%; border-collapse:collapse; min-width:600px; }
.comparison-table th { padding:1rem; text-align:left; font-weight:700; font-size:1rem; }
.comparison-table th:first-child { width:35%; }
.comp-traditional { background:var(--gray-100); color:var(--gray-600); }
.comp-us { background:var(--green-dark); color:#fff; }
.comparison-table td { padding:1rem; border-bottom:1px solid var(--gray-100); font-size:.95rem; }
.comparison-table tr:hover td { background:var(--gray-50); }
.comp-traditional { color:var(--gray-500); }
.comp-us { color:var(--green-dark); font-weight:600; }

/* ===== GALLERY ===== */
.gallery { padding:80px 0; background:var(--gray-50); }
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.gallery-item { position:relative; border-radius:var(--radius); overflow:hidden; cursor:pointer; aspect-ratio:4/3; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.gallery-item:hover img { transform:scale(1.05); }
.gallery-overlay {
    position:absolute; bottom:0; left:0; right:0; padding:1rem;
    background:linear-gradient(to top,rgba(0,0,0,.8),transparent);
    color:#fff; font-weight:600; font-size:.9rem;
}

/* ===== FURNITURE SECTION ===== */
.furniture { padding:80px 0; background:#fff; }
.furniture-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-bottom:3rem; }
.furniture-card { border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); transition:all .3s; border:1px solid var(--gray-100); }
.furniture-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.furniture-image { height:180px; background-size:cover; background-position:center; }
.furniture-body { padding:1.2rem; }
.furniture-body h4 { font-size:1rem; margin-bottom:.5rem; }
.furniture-body p { font-size:.85rem; color:var(--gray-600); }
.furniture-cta { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:center; background:var(--gray-50); border-radius:var(--radius-lg); padding:2rem; }
.furniture-cta-image { height:250px; border-radius:var(--radius); background-size:cover; background-position:center; }
.furniture-cta-content h3 { font-size:1.5rem; margin-bottom:1rem; }
.furniture-cta-content p { color:var(--gray-600); margin-bottom:1.5rem; }

/* ===== TESTIMONIALS ===== */
.testimonials { padding:80px 0; background:var(--gray-50); }
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.testimonial-card { background:#fff; border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow-sm); transition:all .3s; }
.testimonial-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.testimonial-stars { color:#fbbf24; font-size:1.2rem; margin-bottom:.8rem; }
.testimonial-card p { font-style:italic; color:var(--gray-700); margin-bottom:1.5rem; }
.testimonial-author { display:flex; align-items:center; gap:.8rem; }
.author-avatar { width:45px; height:45px; border-radius:50%; background:var(--green-dark); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; }

/* ===== FINAL CTA ===== */
.final-cta { padding:80px 0; background:linear-gradient(135deg,var(--green-dark),var(--blue)); }
.cta-box { text-align:center; color:#fff; }
.cta-box h2 { font-size:2.5rem; font-weight:800; margin-bottom:1rem; }
.cta-box p { font-size:1.1rem; color:rgba(255,255,255,.8); margin-bottom:2rem; }
.cta-actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-bottom:1.5rem; }
.cta-email { color:rgba(255,255,255,.6); font-size:.9rem; }

/* ===== FOOTER ===== */
.footer { background:var(--charcoal); color:rgba(255,255,255,.7); padding:60px 0 20px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; margin-bottom:2rem; }
.footer-brand .logo-text { font-size:1.5rem; }
.footer-brand p { margin-top:1rem; font-size:.9rem; max-width:300px; }
.footer-links h4, .footer-contact h4 { color:#fff; margin-bottom:1rem; font-size:1rem; }
.footer-links ul li, .footer-contact ul li { padding:.3rem 0; font-size:.9rem; }
.footer-links a:hover { color:var(--gold-light); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding-top:1.5rem; text-align:center; font-size:.85rem; color:rgba(255,255,255,.4); }

/* ===== PAGE HEADER (sub pages) ===== */
.page-header { padding:140px 0 60px; background:linear-gradient(135deg,var(--green-dark),var(--blue)); color:#fff; text-align:center; }
.page-header h1 { font-size:3rem; font-weight:900; margin-bottom:1rem; }
.page-header p { font-size:1.1rem; color:rgba(255,255,255,.8); }

/* ===== FOB BANNER ===== */
.fob-banner { padding:40px 0; background:#fffbeb; border-bottom:1px solid #fde68a; }
.fob-box { display:grid; grid-template-columns:auto 1fr; gap:2rem; align-items:start; }
.fob-icon { font-size:3rem; }
.fob-text h3 { font-size:1.3rem; margin-bottom:.8rem; color:var(--charcoal); }
.fob-text p { color:var(--gray-700); margin-bottom:1rem; }
.fob-list { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; margin-bottom:1rem; }
.fob-item { background:#fff; padding:.6rem .8rem; border-radius:8px; font-size:.9rem; border:1px solid #fde68a; }
.fob-note { background:#fef3c7; padding:.8rem; border-radius:8px; font-size:.9rem; }

/* ===== PRICING CARDS ===== */
.pricing-cards-section { padding:60px 0; background:var(--gray-50); }
.pricing-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; max-width:1000px; margin:0 auto; }
.pricing-card { background:#fff; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); position:relative; transition:all .4s; }
.pricing-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-xl); }
.pricing-card-featured { border:2px solid var(--gold); }
.pricing-badge { position:absolute; top:1rem; right:1rem; padding:.4rem .8rem; border-radius:6px; font-size:.75rem; font-weight:700; z-index:2; color:#fff; }
.pricing-badge-hot { background:var(--red); }
.pricing-badge-best { background:var(--gold); color:var(--charcoal); }
.pricing-image { height:240px; background-size:cover; background-position:center; }
.pricing-body { padding:2rem; }
.pricing-body h3 { font-size:1.4rem; margin-bottom:.3rem; }
.pricing-dim { color:var(--gray-500); font-size:.85rem; margin-bottom:1rem; }
.price-display { text-align:center; margin-bottom:1rem; padding:1rem; background:var(--gray-50); border-radius:var(--radius); }
.price-was { display:block; text-decoration:line-through; color:var(--gray-400); font-size:1.1rem; margin-bottom:.2rem; }
.price-is { display:block; font-size:2.5rem; font-weight:900; color:var(--green-dark); }
.price-save-tag { display:inline-block; margin-top:.3rem; background:var(--green); color:#fff; padding:.3rem .8rem; border-radius:4px; font-size:.8rem; font-weight:700; }
.price-save-big { background:var(--red); font-size:.9rem; }
.price-fob-line { text-align:center; font-size:.85rem; color:var(--blue); font-weight:600; margin-bottom:1rem; }
.pricing-features { margin-bottom:1.5rem; }
.pricing-features li { padding:.3rem 0; font-size:.9rem; color:var(--gray-700); }
.pricing-actions { display:flex; flex-direction:column; gap:.8rem; }

/* ===== INCLUDED TABLE ===== */
.included-section { padding:80px 0; background:#fff; }
.included-table-wrap { overflow-x:auto; }
.included-table { width:100%; border-collapse:collapse; min-width:600px; }
.included-table th { background:var(--green-dark); color:#fff; padding:1rem; text-align:left; font-weight:600; }
.included-table td { padding:1rem; border-bottom:1px solid var(--gray-100); }
.included-table tr:hover td { background:var(--gray-50); }

/* ===== ADDITIONAL COSTS ===== */
.additional-costs { padding:80px 0; background:var(--gray-50); }
.costs-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.cost-card { background:#fff; border-radius:var(--radius); padding:1.5rem; box-shadow:var(--shadow-sm); border:1px solid var(--gray-100); }
.cost-card h4 { font-size:1rem; margin-bottom:.5rem; }
.cost-price { font-size:1.3rem; font-weight:800; color:var(--red); margin-bottom:.5rem; }
.cost-card p { font-size:.85rem; color:var(--gray-600); }

/* ===== ROI SECTION ===== */
.roi-section { padding:80px 0; background:#fff; }
.roi-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.roi-card { background:var(--gray-50); border-radius:var(--radius); padding:1.5rem; border:1px solid var(--gray-100); transition:all .3s; }
.roi-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--green-light); }
.roi-card h4 { font-size:1.1rem; margin-bottom:.8rem; color:var(--charcoal); }
.roi-card p { font-size:.9rem; color:var(--gray-600); }

/* ===== PAYMENT SECTION ===== */
.payment-section { padding:80px 0; background:var(--gray-50); }
.payment-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.payment-card { background:#fff; border-radius:var(--radius); padding:2rem; text-align:center; box-shadow:var(--shadow-sm); transition:all .3s; border:1px solid var(--gray-100); }
.payment-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.payment-step { width:50px; height:50px; background:var(--green-dark); color:#fff; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:1.3rem; font-weight:800; margin-bottom:1rem; }
.payment-card h4 { margin-bottom:.5rem; }
.payment-card p { font-size:.85rem; color:var(--gray-600); }

/* ===== QUOTE FORM ===== */
.quote-section { padding:80px 0; background:#fff; }
.quote-box { max-width:800px; margin:0 auto; background:var(--gray-50); border-radius:var(--radius-lg); padding:3rem; box-shadow:var(--shadow-md); }
.quote-header { text-align:center; margin-bottom:2rem; }
.quote-header h2 { font-size:2rem; margin-bottom:.5rem; }
.quote-form .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-group { margin-bottom:1.2rem; }
.form-group label { display:block; font-weight:600; margin-bottom:.4rem; font-size:.9rem; }
.form-group input, .form-group select, .form-group textarea {
    width:100%; padding:.8rem 1rem; border:1px solid var(--gray-200);
    border-radius:var(--radius); font-size:1rem; font-family:inherit;
    transition:border-color .2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
    outline:none; border-color:var(--green-light); box-shadow:0 0 0 3px rgba(22,101,52,.1);
}
.form-note { text-align:center; margin-top:1rem; font-size:.9rem; color:var(--gray-600); }

/* ===== ABOUT PAGE SECTIONS ===== */
.about-story { padding:80px 0; }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
.story-text h2 { font-size:2rem; margin-bottom:1.5rem; }
.story-text p { color:var(--gray-600); margin-bottom:1rem; line-height:1.8; }
.story-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2rem; }
.story-stat { text-align:center; }
.story-number { font-size:2rem; font-weight:900; color:var(--green-dark); }
.story-plus { font-size:1.5rem; font-weight:700; color:var(--gold); }
.story-unit { font-size:.85rem; color:var(--gray-500); }
.story-label { display:block; font-size:.75rem; color:var(--gray-500); margin-top:.2rem; }
.story-image { height:400px; border-radius:var(--radius-lg); background-size:cover; background-position:center; box-shadow:var(--shadow-lg); }

/* ===== STORY HIGHLIGHTS (about page) ===== */
.story-highlights { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.highlight-pill { background:var(--green-dark); color:#fff; padding:.5rem 1rem; border-radius:50px; font-size:.85rem; font-weight:500; }

/* ===== VALUES ===== */
.values { padding:80px 0; background:var(--gray-50); }
.values-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.value-card { background:#fff; border-radius:var(--radius); padding:2rem; text-align:center; box-shadow:var(--shadow-sm); transition:all .3s; border:1px solid var(--gray-100); }
.value-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--green-light); }
.value-icon { font-size:2.5rem; margin-bottom:1rem; }
.value-card h4 { margin-bottom:.5rem; }
.value-card p { font-size:.85rem; color:var(--gray-600); }

/* ===== TEAM ===== */
.team { padding:80px 0; }
.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.team-card { text-align:center; padding:2rem 1rem; background:var(--gray-50); border-radius:var(--radius); transition:all .3s; }
.team-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.team-avatar { width:80px; height:80px; border-radius:50%; margin:0 auto 1rem; display:flex; align-items:center; justify-content:center; font-size:1.5rem; font-weight:800; color:#fff; }
.team-card h4 { margin-bottom:.2rem; }
.team-role { color:var(--green-light); font-size:.85rem; font-weight:600; margin-bottom:.5rem; }
.team-card p { font-size:.85rem; color:var(--gray-600); }

/* ===== TIMELINE SECTION (about page) ===== */
.timeline-section { padding:80px 0; background:var(--gray-50); }
.milestone-list { max-width:800px; margin:0 auto; position:relative; padding:1rem 0; }
.milestone-list::before { content:''; position:absolute; left:100px; top:0; bottom:0; width:3px; background:var(--green-light); }
.milestone { display:flex; gap:2rem; margin-bottom:2rem; align-items:start; }
.milestone-year { width:100px; flex-shrink:0; text-align:right; font-size:1.3rem; font-weight:800; color:var(--green-dark); padding-top:.5rem; }
.milestone-content { background:#fff; border-radius:var(--radius); padding:1.5rem; flex:1; box-shadow:var(--shadow-sm); position:relative; margin-left:2rem; }
.milestone-content::before { content:''; position:absolute; left:-10px; top:1.5rem; width:20px; height:20px; background:var(--gold); border-radius:50%; }
.milestone-content h4 { margin-bottom:.3rem; }
.milestone-content p { font-size:.9rem; color:var(--gray-600); }

/* ===== CONTACT SECTION ===== */
.contact-section { padding:80px 0; background:var(--gray-50); }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; max-width:800px; margin:0 auto; }
.contact-card { background:#fff; border-radius:var(--radius-lg); padding:3rem 2rem; text-align:center; box-shadow:var(--shadow-md); }
.contact-card-whatsapp { border-top:4px solid #25d366; }
.contact-card-email { border-top:4px solid var(--blue); }
.contact-icon { font-size:3rem; margin-bottom:1rem; }
.contact-card h4 { font-size:1.3rem; margin-bottom:.5rem; }
.contact-value { font-size:1.5rem; font-weight:800; color:var(--charcoal); margin-bottom:.5rem; }
.contact-hint { color:var(--gray-500); font-size:.9rem; margin-bottom:1.5rem; }

/* ===== LIGHTBOX ===== */
.lightbox { display:none; position:fixed; inset:0; z-index:2000; background:rgba(0,0,0,.9); align-items:center; justify-content:center; padding:2rem; }
.lightbox.active { display:flex; }
.lightbox img { max-width:100%; max-height:90vh; border-radius:var(--radius); }
.lightbox-close { position:absolute; top:1rem; right:2rem; font-size:3rem; color:#fff; cursor:pointer; background:none; }

/* ===== WHATSAPP FLOAT ===== */
.whatsapp-float {
    position:fixed; bottom:2rem; right:2rem; z-index:999;
    width:60px; height:60px; background:linear-gradient(135deg,#25d366,#128c7e);
    color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center;
    font-size:1.8rem; box-shadow:var(--shadow-lg); transition:all .3s;
    animation:pulse-wa 2s infinite;
}
.whatsapp-float:hover { transform:scale(1.1); }
@keyframes pulse-wa { 0%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.4)} 50%{box-shadow:0 0 0 15px rgba(37,211,102,0)} }

/* ===== RESPONSIVE ===== */
@media (max-width:1024px) {
    .hero-title { font-size:2.5rem; }
    .hero-stats { grid-template-columns:repeat(2,1fr); }
    .specs-grid { grid-template-columns:repeat(2,1fr); }
    .gallery-grid { grid-template-columns:repeat(2,1fr); }
    .testimonials-grid { grid-template-columns:1fr; }
    .furniture-grid { grid-template-columns:repeat(2,1fr); }
    .roi-grid { grid-template-columns:repeat(2,1fr); }
    .costs-grid { grid-template-columns:repeat(2,1fr); }
    .payment-grid { grid-template-columns:repeat(2,1fr); }
    .values-grid { grid-template-columns:repeat(2,1fr); }
    .team-grid { grid-template-columns:repeat(2,1fr); }
    .footer-grid { grid-template-columns:1fr 1fr; }
    .story-stats { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
    .nav-menu { display:none; position:absolute; top:100%; left:0; right:0; background:var(--charcoal); flex-direction:column; padding:1rem; gap:0; }
    .nav-menu.active { display:flex; }
    .nav-menu li { padding:.8rem 0; border-bottom:1px solid rgba(255,255,255,.1); }
    .nav-toggle { display:flex; }
    .nav-cta { display:none; }
    .hero-container { grid-template-columns:1fr; }
    .hero-title { font-size:2rem; }
    .hero-stats { grid-template-columns:repeat(2,1fr); }
    .products-grid { grid-template-columns:1fr; }
    .layout-grid { grid-template-columns:1fr; }
    .furniture-cta { grid-template-columns:1fr; }
    .furniture-grid { grid-template-columns:1fr; }
    .gallery-grid { grid-template-columns:1fr; }
    .pricing-grid { grid-template-columns:1fr; }
    .costs-grid { grid-template-columns:1fr; }
    .roi-grid { grid-template-columns:1fr; }
    .payment-grid { grid-template-columns:1fr; }
    .quote-form .form-row { grid-template-columns:1fr; }
    .fob-list { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; }
    .story-grid { grid-template-columns:1fr; }
    .values-grid { grid-template-columns:1fr; }
    .team-grid { grid-template-columns:1fr; }
    .contact-grid { grid-template-columns:1fr; }
    .milestone { flex-direction:column; gap:.5rem; }
    .milestone-list::before { display:none; }
    .milestone-content { margin-left:0; }
    .milestone-year { text-align:left; width:auto; }
    .section-title { font-size:1.6rem; }
    .page-header h1 { font-size:2rem; }
    .hero-actions { flex-direction:column; }
    .cta-actions { flex-direction:column; }
    .trust-container { gap:.5rem; }
    .trust-item { font-size:.8rem; }
}


/* ===== CONVERSION & EMAIL OPTIMISATION ===== */
.btn-email { background:#fff; color:#123524; border:2px solid #fff; font-weight:800; }
.btn-email:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.email-cta { background:#fff !important; color:#14532d !important; border:1px solid rgba(20,83,45,.18); }
.email-highlight-line a, .cta-email a { color:#fff; text-decoration:underline; text-underline-offset:3px; }
.inline-email { color:var(--green-dark); text-decoration:underline; text-underline-offset:3px; }
.usecase-card { font-style:normal; }
.usecase-card p { font-style:normal; }
.usecase-card h3 { margin:.4rem 0 .7rem; }
.usecase-card a { color:var(--green-dark); font-weight:800; }
.usecase-icon { font-size:2.2rem; }
.quote-benefits { display:flex; justify-content:center; gap:.75rem; flex-wrap:wrap; margin-top:1rem; }
.quote-benefits span { background:#eef8f1; color:#14532d; border:1px solid #cce8d4; border-radius:999px; padding:.45rem .8rem; font-size:.86rem; font-weight:700; }
.conversion-quote { border:1px solid rgba(20,83,45,.14); box-shadow:0 24px 70px rgba(12,52,32,.12); }
.conversion-submit { font-size:1.08rem; letter-spacing:.01em; min-height:58px; }
.privacy-note { line-height:1.55; }
.direct-email-box { margin-top:1rem; padding:1rem; background:#fff8df; border:1px solid #edd58c; border-radius:10px; display:flex; gap:.6rem; align-items:center; justify-content:center; flex-wrap:wrap; }
.direct-email-box span { font-size:.9rem; color:#6b5a20; }
.direct-email-box a { font-weight:900; color:#254f34; text-decoration:underline; }
.sticky-contact-bar { position:fixed; left:50%; transform:translateX(-50%); bottom:18px; z-index:999; display:flex; box-shadow:0 14px 40px rgba(0,0,0,.22); border-radius:999px; overflow:hidden; border:1px solid rgba(255,255,255,.55); }
.sticky-contact-bar a { padding:.85rem 1.1rem; font-size:.9rem; font-weight:850; text-decoration:none; white-space:nowrap; }
.sticky-email { background:#fff; color:#14532d; }
.sticky-quote { background:#14532d; color:#fff; }
@media (max-width: 760px) {
  .sticky-contact-bar { width:calc(100% - 22px); bottom:10px; border-radius:12px; }
  .sticky-contact-bar a { flex:1; text-align:center; padding:.78rem .5rem; font-size:.78rem; white-space:normal; }
  body { padding-bottom:64px; }
  .hero-actions .btn { width:100%; }
  .hero-contact-line { font-size:.84rem; }
  .quote-benefits { align-items:stretch; }
  .quote-benefits span { width:100%; border-radius:8px; text-align:left; }
}

/* Global 4-market pricing additions */
.market-cost-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:30px}.market-cost-card{background:#fff;border:1px solid #e4e7ec;border-radius:18px;padding:26px;box-shadow:0 8px 28px rgba(15,23,42,.06)}.market-cost-card h3{font-size:1.35rem;margin:0 0 6px}.market-port{color:#667085;margin-bottom:14px}.market-cost-card ul{padding-left:20px;line-height:1.75}.total-box{margin-top:18px;padding:14px 16px;background:#f3f7f5;border-radius:12px;font-size:1.05rem}.cost-warning{margin-top:28px;padding:20px;border-left:4px solid #d6a84b;background:#fff9ed;border-radius:10px;line-height:1.65}.pricing-clarity .cost-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.pricing-clarity .cost-card{padding:24px;border:1px solid #e5e7eb;border-radius:16px;background:#fff}.logo{text-decoration:none;font-weight:800;color:inherit}.quote-form select{width:100%;padding:14px;border:1px solid #d0d5dd;border-radius:10px;background:#fff}@media(max-width:760px){.market-cost-grid,.pricing-clarity .cost-grid{grid-template-columns:1fr}.market-cost-card{padding:20px}}
.premium-value{background:#f8fafc}.premium-callout{margin-top:24px;padding:20px 24px;border:1px solid #d9e2ec;border-radius:14px;background:#fff;font-size:1.03rem;line-height:1.65}.premium-value .cost-card h3{margin-bottom:10px}.premium-value .cost-card p{line-height:1.65}