/* ===== BOLSONI TECH - SHARED STYLES ===== */

/* RESET */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  --blue-900:#0b1f47; --blue-800:#0f2d5e; --blue-700:#163d7a; --blue-600:#1a4fa0;
  --blue-500:#2563eb; --blue-400:#4d8bff; --blue-300:#93c5fd; --blue-200:#bfdbfe;
  --blue-100:#dbeafe; --blue-50:#eff6ff; --white:#fff;
  --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; --gray-900:#0f172a;
  --font-h:'Playfair Display', Georgia, serif;
  --font-b:'Plus Jakarta Sans', sans-serif;
  --shadow-sm:0 1px 3px rgba(0,0,0,.06); --shadow-md:0 4px 16px rgba(0,0,0,.08);
  --shadow-lg:0 12px 40px rgba(0,0,0,.1); --shadow-xl:0 20px 60px rgba(0,0,0,.12);
  --ease:cubic-bezier(.16,1,.3,1); --r:12px; --rl:20px;
}
body { font-family:var(--font-b); background:var(--white); color:var(--gray-800); line-height:1.6; overflow-x:hidden; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
svg { flex-shrink:0; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
.container { max-width:1180px; margin:0 auto; padding:0 24px; }

/* ==================== TOP BAR ==================== */
.top-bar { background:var(--blue-900); color:rgba(255,255,255,.75); padding:10px 0; font-size:13px; font-weight:500; }
.top-bar .container { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; }
.tb-g { display:flex; gap:24px; flex-wrap:wrap; align-items:center; }
.tb-i { display:flex; align-items:center; gap:7px; }
.tb-i svg { width:14px; height:14px; min-width:14px; max-height:14px; stroke:var(--blue-400); fill:none; stroke-width:2; }

/* ==================== HEADER ==================== */
header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--gray-200); transition:box-shadow .3s; }
header.scrolled { box-shadow:var(--shadow-md); }
header nav { display:flex; align-items:center; justify-content:space-between; padding:14px 0; }
.logo { display:flex; align-items:center; gap:10px; font-weight:800; font-size:20px; color:var(--blue-900); }
.logo img { height:40px; width:auto; }
.nav-links { display:flex; align-items:center; gap:28px; list-style:none; }
.nav-links > li > a { font-size:14px; font-weight:600; color:var(--gray-600); transition:color .2s; padding:6px 0; }
.nav-links > li > a:hover { color:var(--blue-600); }
.nav-links > li > a.active { color:var(--blue-600); border-bottom:2px solid var(--blue-500); padding-bottom:4px; }
.nav-links > li > a.nav-cta { color:#fff !important; font-size:13px; padding:10px 24px; background:linear-gradient(135deg,var(--blue-500),var(--blue-700)); border-radius:100px; font-weight:700; box-shadow:0 2px 12px rgba(37,99,235,.25); white-space:nowrap; display:inline-block; line-height:1.4; }
.nav-links > li > a.nav-cta:hover { color:#fff !important; transform:translateY(-1px); box-shadow:0 6px 20px rgba(37,99,235,.35); }

/* Dropdown */
.dropdown { position:relative; }
.dropdown > a { display:flex; align-items:center; gap:4px; }
.dropdown > a svg { width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2.5; }
.dropdown-menu { position:absolute; top:calc(100% + 10px); left:-12px; background:var(--white); border:1px solid var(--gray-200); border-radius:var(--r); padding:6px; min-width:230px; box-shadow:var(--shadow-lg); opacity:0; visibility:hidden; transform:translateY(-6px); transition:all .2s var(--ease); z-index:200; }
.dropdown:hover .dropdown-menu { opacity:1; visibility:visible; transform:translateY(0); }
.dropdown-menu a { display:block; padding:10px 14px; border-radius:8px; font-size:13px; font-weight:500; color:var(--gray-700); transition:all .15s; }
.dropdown-menu a:hover { background:var(--blue-50); color:var(--blue-600); }

.nav-cta { display:inline-block; padding:10px 24px; background:linear-gradient(135deg,var(--blue-500),var(--blue-700)); color:#fff; font-weight:700; font-size:13px; border-radius:100px; transition:all .25s var(--ease); box-shadow:0 2px 12px rgba(37,99,235,.25); white-space:nowrap; line-height:1.4; }
.nav-cta:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(37,99,235,.35); }

.mobile-toggle { display:none; flex-direction:column; gap:5px; padding:4px; }
.mobile-toggle span { width:22px; height:2px; background:var(--gray-700); border-radius:2px; }

/* ==================== SECTION BASE ==================== */
section { padding:100px 0; }

.section-label, .sl {
  font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.14em;
  color:var(--blue-500); margin-bottom:14px; display:flex; align-items:center; gap:10px;
}
.section-label::before, .sl::before {
  content:''; width:20px; height:2px; background:var(--blue-500); border-radius:2px;
}
.section-title, .st {
  font-family:var(--font-h); font-size:clamp(30px,3.5vw,44px); line-height:1.15;
  letter-spacing:-.02em; color:var(--blue-900); margin-bottom:14px;
}
.section-title em, .st em { font-style:italic; color:var(--blue-500); }
.section-desc, .sd {
  font-size:16px; color:var(--gray-500); max-width:520px; line-height:1.7;
}
.section-header { margin-bottom:56px; }

/* ==================== BUTTONS ==================== */
.btn-primary { display:inline-flex; align-items:center; gap:8px; padding:14px 30px; background:linear-gradient(135deg,var(--blue-500),var(--blue-700)); color:#fff; font-weight:700; font-size:14px; border-radius:100px; transition:all .25s var(--ease); box-shadow:0 4px 16px rgba(37,99,235,.3); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(37,99,235,.4); }
.btn-primary svg { width:16px; height:16px; }
.btn-outline { display:inline-flex; align-items:center; gap:8px; padding:14px 30px; color:var(--blue-700); font-weight:600; font-size:14px; border-radius:100px; border:1.5px solid var(--blue-200); background:var(--white); transition:all .25s var(--ease); }
.btn-outline:hover { border-color:var(--blue-400); background:var(--blue-50); }
.btn-white { display:inline-flex; align-items:center; gap:8px; padding:14px 30px; background:var(--white); color:var(--blue-700); font-weight:700; font-size:14px; border-radius:100px; transition:all .25s var(--ease); box-shadow:0 4px 16px rgba(0,0,0,.15); }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,0,0,.2); }
.btn-white svg { width:18px; height:18px; fill:currentColor; }
.btn-ghost { display:inline-flex; align-items:center; gap:8px; padding:14px 30px; color:#fff; font-weight:600; font-size:14px; border-radius:100px; border:1.5px solid rgba(255,255,255,.2); transition:all .25s var(--ease); }
.btn-ghost:hover { border-color:rgba(255,255,255,.4); background:rgba(255,255,255,.06); }
.btn-ghost svg { width:16px; height:16px; stroke:#fff; fill:none; stroke-width:2; }

/* ==================== PAGE HERO ==================== */
.page-hero { padding:60px 0; background:linear-gradient(160deg,var(--blue-50),var(--white)); border-bottom:1px solid var(--gray-200); }
.breadcrumb { font-size:13px; color:var(--gray-400); margin-bottom:16px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.breadcrumb a { color:var(--blue-500); font-weight:600; }
.breadcrumb svg { width:12px; height:12px; min-width:12px; max-height:12px; stroke:var(--gray-400); fill:none; stroke-width:2; }
.page-hero h1 { font-family:var(--font-h); font-size:clamp(32px,4vw,48px); color:var(--blue-900); line-height:1.15; letter-spacing:-.02em; margin-bottom:12px; }
.page-hero h1 em { font-style:italic; color:var(--blue-500); }
.page-hero p { font-size:17px; color:var(--gray-500); max-width:600px; line-height:1.7; }

/* ==================== SERVICE PAGE ==================== */
.service-content { background:var(--white); }
.service-content .container { display:grid; grid-template-columns:2fr 1fr; gap:60px; align-items:start; }
.service-text h2 { font-family:var(--font-h); font-size:24px; color:var(--blue-900); margin-bottom:16px; margin-top:40px; line-height:1.2; }
.service-text h2:first-child { margin-top:0; }
.service-text p { font-size:15px; color:var(--gray-600); line-height:1.75; margin-bottom:16px; }
.service-sidebar { position:sticky; top:100px; }
.sidebar-card { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:var(--rl); padding:32px 24px; }
.sidebar-card h3 { font-size:16px; font-weight:700; color:var(--blue-900); margin-bottom:20px; }
.sidebar-links { list-style:none; }
.sidebar-links li { margin-bottom:8px; }
.sidebar-links a { display:block; padding:10px 14px; border-radius:8px; font-size:14px; font-weight:500; color:var(--gray-600); transition:all .15s; }
.sidebar-links a:hover, .sidebar-links a.active { background:var(--blue-50); color:var(--blue-600); font-weight:600; }
.sidebar-cta { margin-top:24px; padding:24px; background:linear-gradient(135deg,var(--blue-900),var(--blue-700)); border-radius:16px; color:#fff; text-align:center; }
.sidebar-cta h4 { font-size:15px; font-weight:700; margin-bottom:8px; }
.sidebar-cta p { font-size:13px; opacity:.7; margin-bottom:16px; line-height:1.5; }

/* ==================== FEATURES GRID ==================== */
.features-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:32px; }
.feature-item { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:var(--r); padding:24px 20px; transition:all .3s var(--ease); }
.feature-item:hover { border-color:var(--blue-200); transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.feature-item h4 { font-size:15px; font-weight:700; color:var(--blue-900); margin-bottom:6px; display:flex; align-items:center; gap:8px; }
.feature-item h4 svg { width:18px; height:18px; min-width:18px; max-height:18px; stroke:var(--blue-500); fill:none; stroke-width:2; }
.feature-item p { font-size:13px; color:var(--gray-500); line-height:1.6; }

/* ==================== CTA SECTION ==================== */
.cta-section { position:relative; background:linear-gradient(135deg,var(--blue-900),var(--blue-700)); overflow:hidden; }
.cta-section::before { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%23fff' fill-opacity='.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
.cta-content { text-align:center; max-width:620px; margin:0 auto; position:relative; z-index:1; color:#fff; }
.cta-content .sl, .cta-content .section-label { justify-content:center; color:var(--blue-400); }
.cta-content .sl::before, .cta-content .section-label::before { background:var(--blue-400); }
.cta-content .st, .cta-content .section-title { color:#fff; margin-bottom:18px; }
.cta-content .st em, .cta-content .section-title em { color:var(--blue-400); }
.cta-desc { font-size:16px; color:rgba(255,255,255,.65); margin-bottom:36px; line-height:1.7; }
.cta-actions { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
.cta-phone { margin-top:24px; font-size:13px; color:rgba(255,255,255,.45); }

/* ==================== CONTACT ==================== */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.contact-info { display:flex; flex-direction:column; gap:24px; }
.contact-card { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:var(--rl); padding:28px 24px; display:flex; gap:16px; align-items:flex-start; transition:all .3s var(--ease); }
.contact-card:hover { border-color:var(--blue-200); transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.contact-card-icon { width:48px; height:48px; min-width:48px; background:var(--blue-100); border-radius:12px; display:flex; align-items:center; justify-content:center; }
.contact-card-icon svg { width:22px; height:22px; min-width:22px; max-height:22px; stroke:var(--blue-600); fill:none; stroke-width:2; }
.contact-card h3 { font-size:15px; font-weight:700; color:var(--blue-900); margin-bottom:4px; }
.contact-card p { font-size:14px; color:var(--gray-500); line-height:1.6; }
.contact-card a { color:var(--blue-500); font-weight:600; }
.contact-form-wrap { background:var(--gray-50); border:1px solid var(--gray-200); border-radius:var(--rl); padding:36px 32px; }
.contact-form-wrap h3 { font-size:18px; font-weight:700; color:var(--blue-900); margin-bottom:24px; }
.form-group { margin-bottom:16px; }
.form-group label { display:block; font-size:13px; font-weight:600; color:var(--gray-700); margin-bottom:6px; }
.form-group input, .form-group textarea, .form-group select { width:100%; padding:12px 16px; border:1px solid var(--gray-200); border-radius:8px; font-family:var(--font-b); font-size:14px; color:var(--gray-800); transition:border-color .2s; background:var(--white); }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline:none; border-color:var(--blue-400); box-shadow:0 0 0 3px rgba(37,99,235,.1); }
.form-group textarea { resize:vertical; min-height:120px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

/* ==================== FOOTER ==================== */
footer { background:var(--gray-50); padding:72px 0 0; border-top:1px solid var(--gray-200); }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:48px; border-bottom:1px solid var(--gray-200); }
.footer-about .logo { margin-bottom:14px; }
.footer-about p { font-size:14px; color:var(--gray-500); line-height:1.7; max-width:300px; }
.footer-col h4 { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--gray-400); margin-bottom:18px; }
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:10px; }
.footer-col a { font-size:14px; color:var(--gray-600); transition:color .2s; }
.footer-col a:hover { color:var(--blue-500); }
.footer-contact, .fc-item { display:flex; align-items:flex-start; gap:10px; margin-bottom:14px; font-size:13px; color:var(--gray-500); line-height:1.6; }
.footer-contact svg, .fc-item svg { width:16px; height:16px; min-width:16px; max-height:16px; stroke:var(--blue-500); fill:none; stroke-width:2; margin-top:2px; }
.footer-contact strong, .fc-item strong { color:var(--gray-700); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding:20px 0; font-size:13px; color:var(--gray-400); flex-wrap:wrap; gap:8px; }
.footer-bottom a { color:var(--gray-500); transition:color .2s; }
.footer-bottom a:hover { color:var(--blue-500); }

/* ==================== WHATSAPP ==================== */
.whatsapp-btn { position:fixed; bottom:24px; right:24px; width:56px; height:56px; background:#25D366; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(37,211,102,.4); z-index:1000; transition:all .25s var(--ease); }
.whatsapp-btn:hover { transform:scale(1.08); box-shadow:0 6px 28px rgba(37,211,102,.5); }
.whatsapp-btn svg { width:28px; height:28px; fill:#fff; stroke:none; }

/* ==================== ANIMATIONS ==================== */
@keyframes fadeInUp { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.4; } }
.reveal { opacity:0; transform:translateY(28px); transition:all .65s var(--ease); }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ==================== HOME PAGE ==================== */
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative;z-index:1}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--blue-100);border:1px solid rgba(37,99,235,.15);border-radius:100px;padding:6px 16px 6px 10px;font-size:12px;font-weight:700;color:var(--blue-600);text-transform:uppercase;letter-spacing:.06em;margin-bottom:24px;animation:fadeInUp .7s var(--ease) both}
.hero-badge-dot{width:8px;height:8px;background:var(--blue-500);border-radius:50%;animation:pulse 2s infinite}
.hero h1{font-family:var(--font-h);font-size:clamp(36px,4.5vw,54px);line-height:1.12;letter-spacing:-.02em;color:var(--blue-900);margin-bottom:20px;animation:fadeInUp .7s .1s var(--ease) both}
.hero h1 em{font-style:italic;color:var(--blue-500)}
.hero-desc{font-size:17px;color:var(--gray-500);max-width:480px;line-height:1.75;margin-bottom:36px;animation:fadeInUp .7s .2s var(--ease) both}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;animation:fadeInUp .7s .3s var(--ease) both}
.hero-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;animation:fadeInUp .8s .35s var(--ease) both}
.hero-card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--rl);padding:28px 22px;box-shadow:var(--shadow-sm);transition:all .3s var(--ease)}
.hero-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--blue-200)}
.hero-card.featured{grid-column:span 2;background:linear-gradient(135deg,var(--blue-900),var(--blue-700));color:#fff;border:none;box-shadow:var(--shadow-lg)}
.hc-icon{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.hero-card:not(.featured) .hc-icon{background:var(--blue-50)}
.hero-card.featured .hc-icon{background:rgba(255,255,255,.12)}
.hc-icon svg{width:20px;height:20px;stroke-width:2;fill:none}
.hero-card:not(.featured) .hc-icon svg{stroke:var(--blue-500)}
.hero-card.featured .hc-icon svg{stroke:#fff}
.hero-card h3{font-size:14px;font-weight:700;margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}
.hero-card p{font-size:13px;line-height:1.6;opacity:.75}
.home-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.home-service-card{display:block;text-decoration:none;background:var(--white);border:1px solid var(--gray-200);border-radius:var(--rl);padding:32px 24px;transition:all .3s var(--ease);position:relative;overflow:hidden}
.home-service-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue-500),var(--blue-400));transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.home-service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--blue-200)}
.home-service-card:hover::after{transform:scaleX(1)}
.home-service-card h4{font-size:17px;font-weight:700;color:var(--blue-900);margin-bottom:8px}
.home-service-card p{font-size:14px;color:var(--gray-500);line-height:1.65}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.about-features{display:flex;flex-direction:column;gap:16px;margin-top:32px}
.about-feat{display:flex;gap:16px;align-items:flex-start;padding:16px;border-radius:var(--r)}
.about-feat-icon{flex-shrink:0;width:40px;height:40px;background:var(--blue-100);border-radius:10px;display:flex;align-items:center;justify-content:center}
.about-feat-icon svg{width:18px;height:18px;stroke:var(--blue-600);fill:none;stroke-width:2}
.about-feat h4{font-size:15px;font-weight:700;color:var(--blue-900);margin-bottom:3px}
.about-feat p{font-size:13px;color:var(--gray-500);line-height:1.6}
.about-image-box{background:linear-gradient(135deg,var(--blue-50),var(--gray-100));border:1px solid var(--gray-200);border-radius:var(--rl);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;color:var(--gray-400);font-size:13px}
.about-badge{position:absolute;bottom:-20px;right:-12px;background:linear-gradient(135deg,var(--blue-500),var(--blue-700));color:#fff;padding:22px 28px;border-radius:16px;text-align:center;box-shadow:0 12px 36px rgba(37,99,235,.3)}
.about-badge-num{font-family:var(--font-h);font-size:44px;line-height:1}
.about-badge-lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-top:4px;opacity:.85}
.tech-strip{padding:56px 0;background:var(--blue-900);color:#fff}
.tech-logos{display:flex;justify-content:center;align-items:center;gap:48px;flex-wrap:wrap;margin-top:32px}
.tech-logos span{font-size:14px;font-weight:700;opacity:.35;letter-spacing:.04em;text-transform:uppercase}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.testimonial-card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--rl);padding:32px 26px;transition:all .3s var(--ease)}
.testimonial-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.stars{display:flex;gap:2px;margin-bottom:18px}
.testimonial-card blockquote{font-size:14px;line-height:1.75;color:var(--gray-600);margin-bottom:24px;font-style:italic}
.testimonial-author{display:flex;align-items:center;gap:12px;border-top:1px solid var(--gray-100);padding-top:18px}
.testimonial-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--blue-100),var(--blue-200));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:var(--blue-700);flex-shrink:0}
.testimonial-author h4{font-size:14px;font-weight:700;color:var(--blue-900)}
.testimonial-author p{font-size:12px;color:var(--gray-400)}

/* ==================== PRIVACY PAGE ==================== */
.privacy-content h2 { font-family:var(--font-h); font-size:22px; color:var(--blue-900); margin:32px 0 12px; }
.privacy-content h2:first-child { margin-top:0; }
.privacy-content p { font-size:15px; color:var(--gray-600); line-height:1.75; margin-bottom:12px; }

/* ==================== RESPONSIVE ==================== */
@media(max-width:1024px){
  .hero-grid,.about-grid{grid-template-columns:1fr}
  .home-services-grid,.testimonials-grid{grid-template-columns:repeat(2,1fr)}
  .service-content .container { grid-template-columns:1fr; }
  .service-sidebar { position:static; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .contact-grid { grid-template-columns:1fr; }
  .features-grid { grid-template-columns:1fr; }
}

@media(max-width:768px){
  section { padding:64px 0; }
  .top-bar { display:none; }
  .nav-links {
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--white); border-bottom:1px solid var(--gray-200);
    box-shadow:var(--shadow-lg); flex-direction:column; padding:16px 24px; gap:4px;
  }
  .nav-links.mobile-open { display:flex; }
  .nav-links > li > a { padding:12px 0; display:block; width:100%; }
  .nav-links > li > a.nav-cta { text-align:center; margin-top:8px; }
  .dropdown-menu { position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; padding:0 0 0 16px; min-width:auto; }
  .mobile-toggle { display:flex; }
  .footer-grid { grid-template-columns:1fr; gap:32px; }
  .form-row { grid-template-columns:1fr; }
  .page-hero { padding:40px 0; }
  .cta-actions { flex-direction:column; align-items:center; }
  .btn-primary, .btn-outline, .btn-white, .btn-ghost { width:100%; justify-content:center; }
  .hero-cards{grid-template-columns:1fr}
  .hero-card.featured{grid-column:span 1}
  .home-services-grid,.testimonials-grid{grid-template-columns:1fr}
  .hero-actions{flex-direction:column}
  .about-badge{position:relative;bottom:auto;right:auto;margin-top:16px;display:inline-block}
}

/* ==================== FAQ DETAILS ==================== */
details { border:1px solid var(--gray-200); border-radius:var(--r); margin-bottom:12px; background:var(--gray-50); }
details summary { padding:20px 24px; font-weight:700; font-size:15px; color:var(--blue-900); cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; }
details summary::-webkit-details-marker { display:none; }
details summary::after { content:'+'; font-size:20px; font-weight:700; color:var(--blue-400); transition:transform .2s var(--ease); flex-shrink:0; margin-left:16px; }
details[open] summary::after { content:'\2212'; }
details > div, details > p { padding:0 24px 20px; font-size:15px; color:var(--gray-600); line-height:1.7; }
details > p { padding-top:0; }