/* ============================================
   NetVoipKCE - CSS Global
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* ── CSS Variables ── */
:root {
  --blue-900: #1e3a8a; --blue-800: #1e40af; --blue-700: #1d4ed8;
  --blue-600: #2563eb; --blue-500: #3b82f6; --blue-400: #60a5fa;
  --blue-300: #93c5fd; --blue-100: #dbeafe; --blue-50: #eff6ff;
  --cyan-500: #06b6d4; --cyan-400: #22d3ee; --cyan-300: #67e8f9;
  --green-500: #22c55e; --green-400: #4ade80; --green-600: #16a34a;
  --gray-900: #111827; --gray-800: #1f2937; --gray-700: #374151;
  --gray-600: #4b5563; --gray-500: #6b7280; --gray-400: #9ca3af;
  --gray-300: #d1d5db; --gray-200: #e5e7eb; --gray-100: #f3f4f6;
  --gray-50: #f9fafb; --white: #ffffff;
  --header-bg-scrolled: rgba(10, 22, 40, 0.93);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,.1);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,.1);
  --shadow-xl: 0 20px 25px -5px rgba(0,0,0,.1);
  --shadow-2xl: 0 25px 50px -12px rgba(0,0,0,.25);
  --radius-sm: 0.375rem; --radius-md: 0.5rem;
  --radius-lg: 0.75rem; --radius-xl: 1rem; --radius-2xl: 1.5rem;
  --radius-full: 9999px;
}

/* ── Dark Theme Variables ── */
[data-theme="dark"] {
  --white: #020617;
  --gray-50: #0f172a;
  --gray-100: #1e293b;
  --gray-200: #334155;
  --gray-300: #475569;
  --gray-400: #64748b;
  --gray-500: #94a3b8;
  --gray-600: #cbd5e1;
  --gray-700: #e2e8f0;
  --gray-800: #f1f5f9;
  --gray-900: #f8fafc;
  --header-bg-scrolled: rgba(2, 6, 23, 0.95);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] .bg-gray-section { background-color: #0f172a; }
[data-theme="dark"] .hero-card { background: rgba(30, 41, 59, 0.6); border-color: rgba(255, 255, 255, 0.1); }
[data-theme="dark"] .service-btn { background: #020617; border-color: #334155; }
[data-theme="dark"] .service-btn.active { background: rgba(37, 99, 235, 0.1); border-color: var(--blue-500); }
[data-theme="dark"] .service-detail { background: #0f172a; border-color: #1e293b; }
[data-theme="dark"] .achievement-card, [data-theme="dark"] .diff-card, [data-theme="dark"] .blog-card { background: #0f172a; border: 1px solid #1e293b; }
[data-theme="dark"] .contact-method { background: #0f172a; border: 1px solid #1e293b; }
[data-theme="dark"] .business-hours { background: #1e293b; }
[data-theme="dark"] .footer { background: #010409; }
[data-theme="dark"] .form-input, [data-theme="dark"] .form-textarea, [data-theme="dark"] .form-select { background: #0f172a; border-color: #334155; color: #fff; }
[data-theme="dark"] .form-input:focus, [data-theme="dark"] .form-textarea:focus { border-color: var(--blue-500); }

/* Theme Toggle Button */
.theme-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 9999px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.1);
  color: #fff; transition: all 0.3s ease; margin-left: 12px;
}
.theme-toggle:hover { background: rgba(255,255,255,0.15); transform: rotate(15deg); }
[data-theme="dark"] .theme-toggle { background: rgba(30, 41, 59, 0.8); border-color: rgba(255,255,255,0.1); color: #fbbf24; }


/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; color: var(--gray-900); background: var(--white); line-height: 1.6; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, textarea, select { font-family: inherit; }

/* ── Utility ── */
.container { max-width: 72rem; margin: 0 auto; padding: 0 1rem; }
@media(min-width:640px){ .container { padding: 0 1.5rem; } }
@media(min-width:1024px){ .container { padding: 0 2rem; } }
.container-wide { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
@media(min-width:640px){ .container-wide { padding: 0 1.5rem; } }
@media(min-width:1024px){ .container-wide { padding: 0 2rem; } }
.section { padding: 5rem 0; }
.section-sm { padding: 3rem 0; }
.text-center { text-align: center; }
.flex { display: flex; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-12 { gap: 3rem; }
.grid { display: grid; }
.hidden { display: none !important; }
.relative { position: relative; }
.absolute { position: absolute; }
.inset-0 { inset: 0; }
.z-10 { z-index: 10; }
.z-50 { z-index: 50; }
.overflow-hidden { overflow: hidden; }
.w-full { width: 100%; }
.h-full { height: 100%; }
.min-h-screen { min-height: 100vh; }
.object-cover { object-fit: cover; width: 100%; height: 100%; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0; }

/* ── Animations ── */
@keyframes neon-pulse {
  0%,100%{ box-shadow:0 0 6px rgba(0,210,255,.3),0 0 12px rgba(0,210,255,.15); }
  50%{ box-shadow:0 0 10px rgba(0,210,255,.5),0 0 20px rgba(0,210,255,.25); }
}
@keyframes badge-glow {
  0%,100%{ box-shadow:0 0 4px rgba(16,185,129,.4),0 0 8px rgba(16,185,129,.2); transform:scale(1); }
  50%{ box-shadow:0 0 8px rgba(16,185,129,.6),0 0 16px rgba(16,185,129,.3); transform:scale(1.05); }
}
@keyframes cta-glow {
  0%,100%{ box-shadow:0 4px 15px rgba(59,130,246,.4),0 0 30px rgba(59,130,246,.15); }
  50%{ box-shadow:0 4px 20px rgba(59,130,246,.6),0 0 40px rgba(59,130,246,.25); }
}
@keyframes shimmer {
  0%{ background-position:-200% 0; }
  100%{ background-position:200% 0; }
}
@keyframes ping { 75%,100%{ transform:scale(2); opacity:0; } }
@keyframes spin { to{ transform:rotate(360deg); } }
@keyframes fadeInUp { from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:translateY(0); } }
@keyframes fadeInLeft { from{ opacity:0; transform:translateX(-30px); } to{ opacity:1; transform:translateX(0); } }
@keyframes fadeInScale { from{ opacity:0; transform:scale(.85); } to{ opacity:1; transform:scale(1); } }
@keyframes bounceY { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(12px); } }
@keyframes slideDown { from{ opacity:0; transform:translateY(-10px) scale(.97); } to{ opacity:1; transform:translateY(0) scale(1); } }

.animate-neon-pulse { animation:neon-pulse 3s ease-in-out infinite; }
.animate-badge-glow { animation:badge-glow 2s ease-in-out infinite; }
.animate-cta-glow { animation:cta-glow 2.5s ease-in-out infinite; }
.animate-shimmer { background-size:200% 100%; animation:shimmer 3s linear infinite; }
.animate-ping { animation:ping 1.2s cubic-bezier(0,0,.2,1) infinite; }
.animate-spin { animation:spin 1s linear infinite; }
.animate-bounce-y { animation:bounceY 2s ease-in-out infinite; }

/* IntersectionObserver reveal */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity:1; transform:translateY(0); }
.reveal-left { opacity:0; transform:translateX(-28px); transition:opacity .6s ease, transform .6s ease; }
.reveal-left.is-visible { opacity:1; transform:translateX(0); }
.reveal-scale { opacity:0; transform:scale(.88); transition:opacity .5s ease, transform .5s ease; }
.reveal-scale.is-visible { opacity:1; transform:scale(1); }

/* ── HEADER ── */
.header {
  position:fixed; top:0; left:0; right:0; z-index:50;
  transition:all .5s ease;
  background:linear-gradient(to bottom, rgba(0,0,0,.3), transparent);
}
.header::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(to right, transparent, rgba(34,211,238,.4), transparent);
}
.header.scrolled {
  background:var(--header-bg-scrolled);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  box-shadow:0 4px 40px rgba(0,120,255,.12);
  border-bottom:1px solid rgba(6,182,212,.1);
}
.header-inner { max-width:80rem; margin:0 auto; padding:0 1rem; }
@media(min-width:640px){ .header-inner{ padding:0 1.5rem; } }
@media(min-width:1024px){ .header-inner{ padding:0 2rem; } }
.header-row { display:flex; align-items:center; justify-content:space-between; height:68px; }

/* Logo */
.header-logo { display:flex; align-items:center; flex-shrink:0; }
.header-logo img { height:44px; width:176px; object-fit:contain; filter:drop-shadow(0 0 8px rgba(0,180,255,.25)); transition:transform .3s ease; }
.header-logo:hover img { transform:scale(1.04); }

/* Desktop Nav */
.nav-desktop { display:none; }
@media(min-width:1024px){ .nav-desktop{ display:flex; align-items:center; } }
.nav-pill {
  display:flex; align-items:center; gap:2px;
  border-radius:9999px; padding:4px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(16px);
  transition:all .5s ease;
}
.header.scrolled .nav-pill { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.07); }
.nav-link {
  position:relative; display:flex; align-items:center; gap:6px;
  padding:8px 16px; border-radius:9999px;
  font-size:13px; font-weight:600; letter-spacing:.03em;
  color:rgba(255,255,255,.7);
  transition:color .3s ease;
}
.nav-link:hover { color:rgba(224,240,255,.95); }
.nav-link.active { color:#fff; }
.nav-link.active::before {
  content:''; position:absolute; inset:0; border-radius:9999px;
  background:linear-gradient(135deg,rgba(29,78,216,.9),rgba(8,145,178,.8));
  animation:neon-pulse 3s ease-in-out infinite;
  box-shadow:0 0 12px rgba(0,180,255,.35), inset 0 1px 0 rgba(255,255,255,.15);
}
.nav-link span, .nav-link svg { position:relative; z-index:1; }
.nav-link svg { width:14px; height:14px; flex-shrink:0; }
.nav-badge {
  display:inline-flex; align-items:center;
  padding:2px 6px; font-size:9px; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em;
  background:linear-gradient(to right,#34d399,#22d3ee);
  color:#0a1628; border-radius:9999px; line-height:1;
  animation:badge-glow 2s ease-in-out infinite;
}

/* CTA Header Button */
.header-cta {
  display:none;
}
@media(min-width:1024px){ .header-cta{ display:flex; align-items:center; } }
.btn-header-cta {
  position:relative; display:inline-flex; align-items:center; gap:8px;
  padding:10px 20px; border-radius:9999px;
  font-weight:700; font-size:13px; letter-spacing:.04em; color:#fff;
  background:linear-gradient(135deg,#1d4ed8 0%,#0891b2 50%,#06b6d4 100%);
  overflow:hidden; transition:transform .3s ease;
  animation:cta-glow 2.5s ease-in-out infinite;
}
.btn-header-cta:hover { transform:scale(1.03); }
.btn-header-cta:active { transform:scale(.98); }
.btn-header-cta .shimmer-overlay {
  position:absolute; inset:0; opacity:.3; pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 50%,transparent 100%);
  background-size:200% 100%; animation:shimmer 3s linear infinite;
}
.pulse-dot { position:relative; display:flex; width:8px; height:8px; }
.pulse-dot .ping {
  position:absolute; inset:0; border-radius:9999px;
  background:#86efac; animation:ping 1.2s cubic-bezier(0,0,.2,1) infinite;
}
.pulse-dot .dot { position:relative; border-radius:9999px; width:8px; height:8px; background:#4ade80; box-shadow:0 0 6px rgba(52,211,153,.7); }
.arrow-icon { width:14px; height:14px; opacity:0; transform:translateX(-4px); transition:all .3s ease; }
.btn-header-cta:hover .arrow-icon { opacity:1; transform:translateX(0); }

/* Mobile Menu Toggle */
.mobile-menu-btn {
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:12px;
  color:#fff; transition:background .2s ease;
}
@media(min-width:1024px){ .mobile-menu-btn{ display:none; } }
.mobile-menu-btn:hover { background:rgba(255,255,255,.1); }
.mobile-menu-btn svg { width:24px; height:24px; }

/* Mobile Drawer */
.mobile-nav {
  position:absolute; top:100%; left:12px; right:12px; margin-top:8px;
  border-radius:1rem; overflow:hidden;
  border:1px solid rgba(6,182,212,.15);
  background:linear-gradient(180deg,rgba(10,22,40,.97) 0%,rgba(15,30,55,.98) 100%);
  box-shadow:0 20px 60px rgba(0,0,0,.4),0 0 30px rgba(0,120,255,.08);
  backdrop-filter:blur(24px);
  display:none; animation:slideDown .35s ease;
}
.mobile-nav.open { display:block; }
.mobile-nav-accent { height:1px; background:linear-gradient(to right,transparent,rgba(34,211,238,.3),transparent); }
.mobile-nav-links { padding:12px; }
.mobile-nav-link {
  display:flex; align-items:center; gap:12px;
  padding:12px; border-radius:12px;
  border:1px solid transparent;
  transition:all .2s ease; color:rgba(255,255,255,.7);
  margin-bottom:2px;
}
.mobile-nav-link:hover { background:rgba(255,255,255,.05); color:rgba(255,255,255,.9); }
.mobile-nav-link.active {
  background:linear-gradient(to right,rgba(29,78,216,.2),rgba(6,182,212,.1));
  border-color:rgba(6,182,212,.2); color:#fff;
}
.mobile-nav-icon {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:10px;
  background:rgba(255,255,255,.06); color:rgba(255,255,255,.5);
  transition:all .3s ease; flex-shrink:0;
}
.mobile-nav-link.active .mobile-nav-icon {
  background:linear-gradient(135deg,#3b82f6,#06b6d4);
  color:#fff; box-shadow:0 0 12px rgba(0,180,255,.3);
}
.mobile-nav-icon svg { width:18px; height:18px; }
.mobile-nav-text { font-size:15px; font-weight:600; letter-spacing:.02em; flex:1; }
.mobile-nav-chevron { width:16px; height:16px; margin-left:auto; opacity:.2; color:rgba(255,255,255,.5); transition:opacity .2s; }
.mobile-nav-link.active .mobile-nav-chevron { color:#22d3ee; opacity:1; }
.mobile-nav-footer { padding:12px; padding-top:4px; }
.mobile-nav-divider { border-top:1px solid rgba(255,255,255,.06); padding-top:12px; }
.btn-mobile-cta {
  display:flex; align-items:center; justify-content:center; gap:10px; width:100%;
  padding:14px 16px; border-radius:12px;
  font-weight:700; font-size:13px; letter-spacing:.04em; color:#fff;
  background:linear-gradient(135deg,#1d4ed8 0%,#0891b2 50%,#06b6d4 100%);
  box-shadow:0 4px 20px rgba(6,182,212,.3),0 0 30px rgba(59,130,246,.15);
  transition:transform .2s ease;
}
.btn-mobile-cta:hover { transform:scale(1.02); }

/* ── HERO ── */
.hero {
  position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.hero-bg { position:absolute; inset:0; }
.hero-bg img { width:100%; height:100%; object-fit:cover; }
.hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(30,58,138,.9) 0%,rgba(30,64,175,.8) 50%,rgba(17,24,39,.9) 100%);
}
.hero-content { position:relative; z-index:10; width:100%; padding-top:5rem; }
.hero-grid { display:grid; gap:3rem; align-items:center; }
@media(min-width:1024px){ .hero-grid{ grid-template-columns:1fr 1fr; } }
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 16px; border-radius:9999px;
  background:rgba(37,99,235,.2); backdrop-filter:blur(8px);
  border:1px solid rgba(96,165,250,.3); color:#bfdbfe;
  font-size:14px; font-weight:500; margin-bottom:1.5rem;
}
.hero-title { font-size:2.5rem; font-weight:900; line-height:1.1; color:#fff; margin-bottom:1.5rem; }
@media(min-width:768px){ .hero-title{ font-size:3.75rem; } }
@media(min-width:1024px){ .hero-title{ font-size:4.5rem; } }
.hero-title .accent { color:#93c5fd; }
.hero-subtitle { font-size:1.25rem; color:#bfdbfe; margin-bottom:2rem; line-height:1.7; }
.hero-buttons { display:flex; flex-direction:column; gap:1rem; margin-bottom:3rem; }
@media(min-width:640px){ .hero-buttons{ flex-direction:row; } }
.btn-primary {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:16px 32px; border-radius:10px;
  background:var(--blue-600); color:#fff; font-size:1.125rem; font-weight:700;
  box-shadow:var(--shadow-xl); transition:all .2s ease;
}
.btn-primary:hover { background:var(--blue-700); box-shadow:var(--shadow-2xl); transform:translateY(-1px); }
.btn-ghost {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:16px 32px; border-radius:10px;
  background:rgba(255,255,255,.1); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.2); color:#fff;
  font-size:1.125rem; font-weight:600; transition:all .2s ease;
}
.btn-ghost:hover { background:rgba(255,255,255,.2); }
.hero-stats { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
@media(min-width:768px){ .hero-stats{ grid-template-columns:repeat(4,1fr); } }
.stat-card { text-align:center; }
.stat-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:9999px;
  background:rgba(255,255,255,.1); backdrop-filter:blur(8px); margin-bottom:.75rem;
  transition:transform .3s ease;
}
.stat-card:hover .stat-icon { transform:scale(1.1); }
.stat-icon svg { width:24px; height:24px; }
.stat-icon.green { color:#22c55e; }
.stat-icon.blue { color:#60a5fa; }
.stat-icon.purple { color:#a78bfa; }
.stat-icon.orange { color:#fb923c; }
.stat-value { font-size:1.5rem; font-weight:800; color:#fff; margin-bottom:.25rem; }
.stat-label { font-size:.875rem; color:#bfdbfe; }
.hero-card {
  background:rgba(255,255,255,.1); backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.2); border-radius:1.5rem; padding:2rem; color:#fff;
}
.hero-card h3 { font-size:1.5rem; font-weight:700; margin-bottom:1.5rem; }
.hero-features { display:flex; flex-direction:column; gap:1rem; }
.hero-feature { display:flex; align-items:center; gap:.75rem; }
.hero-feature .check { color:#4ade80; font-weight:700; flex-shrink:0; }
.hero-feature span { color:#bfdbfe; }
.hero-card-footer { margin-top:2rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.2); text-align:center; }
.hero-card-footer p { color:#bfdbfe; font-size:.875rem; }
.scroll-indicator {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.5rem; color:#fff;
  animation:bounceY 2s ease-in-out infinite;
}
.scroll-indicator span { font-size:.875rem; color:#bfdbfe; }
.scroll-bar { width:4px; height:32px; background:rgba(255,255,255,.2); border-radius:9999px; overflow:hidden; }
.scroll-bar-inner { width:4px; height:16px; background:#60a5fa; border-radius:9999px; animation:bounceY 2s ease-in-out infinite; }

/* ── SECTION HEADER (shared) ── */
.section-tag {
  display:inline-block; padding:8px 16px; border-radius:9999px;
  background:var(--blue-100); color:var(--blue-600);
  font-size:.875rem; font-weight:600; margin-bottom:1rem;
}
.section-title { font-size:1.875rem; font-weight:800; color:var(--gray-900); margin-bottom:1.5rem; }
@media(min-width:768px){ .section-title{ font-size:3rem; } }
.section-title .accent { color:var(--blue-600); }
.section-desc { font-size:1.125rem; color:var(--gray-600); max-width:48rem; margin:0 auto; }

/* ── SERVICES ── */
.services-section { padding:5rem 0; background:linear-gradient(to bottom,var(--gray-50),var(--white)); }
.services-grid { display:grid; gap:2rem; }
@media(min-width:1024px){ .services-grid{ grid-template-columns:1fr 2fr; gap:2rem; } }
.services-list { display:flex; flex-direction:column; gap:1rem; }
.service-btn {
  width:100%; text-align:left; padding:1.5rem; border-radius:.75rem;
  border:2px solid var(--gray-200); background:var(--white);
  transition:all .3s ease; cursor:pointer; display:flex; align-items:flex-start; gap:1rem;
}
.service-btn:hover { border-color:var(--gray-300); box-shadow:var(--shadow-md); }
.service-btn.active { border-color:var(--blue-500); background:var(--blue-50); box-shadow:var(--shadow-lg); }
.service-icon {
  width:48px; height:48px; border-radius:.5rem; display:flex; align-items:center;
  justify-content:center; color:#fff; flex-shrink:0;
  background:linear-gradient(135deg,var(--blue-500),var(--blue-600));
}
.service-icon svg { width:24px; height:24px; }
.service-icon.blue { background:linear-gradient(135deg,#3b82f6,#2563eb); }
.service-icon.purple { background:linear-gradient(135deg,#8b5cf6,#7c3aed); }
.service-icon.green { background:linear-gradient(135deg,#22c55e,#16a34a); }
.service-icon.orange { background:linear-gradient(135deg,#f97316,#ea580c); }
.service-icon.indigo { background:linear-gradient(135deg,#6366f1,#4f46e5); }
.service-icon.red { background:linear-gradient(135deg,#ef4444,#dc2626); }
.service-btn-title { font-size:1.125rem; font-weight:600; color:var(--gray-900); margin-bottom:.25rem; }
.service-btn-sub { font-size:.875rem; color:var(--gray-600); }
.service-detail { background:var(--white); border-radius:1.5rem; box-shadow:var(--shadow-xl); overflow:hidden; }
.service-detail-img { position:relative; aspect-ratio:16/9; overflow:hidden; }
.service-detail-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.service-detail:hover .service-detail-img img { transform:scale(1.03); }
.service-detail-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.5),transparent); }
.service-detail-icon-wrap { position:absolute; bottom:1.5rem; left:1.5rem; }
.service-detail-icon {
  width:64px; height:64px; border-radius:9999px; display:flex; align-items:center;
  justify-content:center; color:#fff;
}
.service-detail-body { padding:2rem; }
.service-detail-body h3 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin-bottom:1rem; }
.service-detail-body p { color:var(--gray-600); margin-bottom:1.5rem; line-height:1.7; }
.service-tags { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:2rem; }
.service-tag { padding:4px 12px; background:var(--gray-100); color:var(--gray-700); font-size:.875rem; border-radius:9999px; }
.service-actions { display:flex; flex-direction:column; gap:1rem; }
@media(min-width:640px){ .service-actions{ flex-direction:row; } }
.btn-cta {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 24px; border-radius:.5rem;
  background:var(--blue-600); color:#fff; font-weight:600;
  transition:all .2s ease;
}
.btn-cta:hover { background:var(--blue-700); }
.btn-cta.flex-1 { flex:1; }
.btn-outline {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 24px; border-radius:.5rem;
  border:1px solid var(--gray-300); color:var(--gray-700); font-weight:600;
  transition:all .2s ease;
}
.btn-outline:hover { background:var(--gray-50); }
.services-cta-box {
  background:linear-gradient(to right,var(--blue-600),var(--blue-800));
  color:#fff; border-radius:1.5rem; padding:2rem;
  text-align:center; margin-top:4rem;
}
@media(min-width:768px){ .services-cta-box{ padding:3rem; } }
.services-cta-box h3 { font-size:1.5rem; font-weight:700; margin-bottom:1rem; }
@media(min-width:768px){ .services-cta-box h3{ font-size:1.875rem; } }
.services-cta-box p { color:#bfdbfe; margin-bottom:2rem; }
.btn-white {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:16px 32px; border-radius:.5rem;
  background:#fff; color:var(--blue-600); font-weight:700; font-size:1.125rem;
  transition:all .2s ease;
}
.btn-white:hover { background:var(--gray-100); }

/* ── ABOUT ── */
.about-section { padding:5rem 0; background:var(--white); }
.about-grid { display:grid; gap:3rem; align-items:center; }
@media(min-width:1024px){ .about-grid{ grid-template-columns:1fr 1fr; } }
.about-img { position:relative; aspect-ratio:4/3; border-radius:1rem; overflow:hidden; box-shadow:var(--shadow-2xl); }
.about-img img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.about-img:hover img { transform:scale(1.05); }
.about-img::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.2),transparent); }
.about-tag {
  display:inline-block; padding:8px 16px; border-radius:9999px;
  background:var(--blue-100); color:var(--blue-600);
  font-size:.875rem; font-weight:600; margin-bottom:1.5rem;
}
.about-title { font-size:1.875rem; font-weight:800; color:var(--gray-900); margin-bottom:1.5rem; }
@media(min-width:768px){ .about-title{ font-size:3rem; } }
.about-title .accent { color:var(--blue-600); }
.about-text { font-size:1.125rem; color:var(--gray-600); margin-bottom:1.5rem; line-height:1.7; }
.about-bullets { display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem; }
.about-bullet { display:flex; align-items:center; gap:.75rem; }
.about-bullet .dot { width:8px; height:8px; background:var(--blue-600); border-radius:9999px; flex-shrink:0; }
.about-bullet span { color:var(--gray-700); }
.about-link {
  display:inline-flex; align-items:center; gap:8px;
  color:var(--blue-600); font-weight:600;
  transition:all .2s ease;
}
.about-link:hover { color:var(--blue-700); gap:12px; }
.achievements-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
@media(min-width:768px){ .achievements-grid{ grid-template-columns:repeat(4,1fr); } }
.achievement-card {
  text-align:center; padding:1.5rem; border-radius:.75rem;
  background:linear-gradient(to bottom,var(--gray-50),var(--white));
  transition:all .3s ease; cursor:default;
}
.achievement-card:hover { box-shadow:var(--shadow-lg); }
.achievement-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:9999px;
  background:var(--blue-100); color:var(--blue-600); margin-bottom:1rem;
  transition:all .3s ease;
}
.achievement-card:hover .achievement-icon { background:var(--blue-600); color:#fff; }
.achievement-icon svg { width:32px; height:32px; }
.achievement-number { font-size:1.875rem; font-weight:800; color:var(--gray-900); margin-bottom:.5rem; }
.achievement-label { font-size:1.125rem; font-weight:600; color:var(--gray-700); margin-bottom:.25rem; }
.achievement-desc { font-size:.875rem; color:var(--gray-500); }

/* ── DIFFERENTIALS ── */
.diff-section { padding:5rem 0; background:linear-gradient(to bottom,var(--gray-50),var(--gray-100)); }
.diff-grid { display:grid; gap:2rem; }
@media(min-width:768px){ .diff-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .diff-grid{ grid-template-columns:repeat(3,1fr); } }
.diff-card {
  background:var(--white); border-radius:1.5rem; padding:2rem;
  box-shadow:var(--shadow-lg); position:relative; overflow:hidden;
  transition:all .3s ease;
}
.diff-card:hover { box-shadow:var(--shadow-2xl); transform:translateY(-4px); }
.diff-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:1rem; color:#fff; margin-bottom:1.5rem;
  transition:transform .3s ease;
}
.diff-card:hover .diff-icon { transform:scale(1.1); }
.diff-icon svg { width:32px; height:32px; }
.diff-icon.green { background:linear-gradient(135deg,#22c55e,#16a34a); }
.diff-icon.blue { background:linear-gradient(135deg,#3b82f6,#2563eb); }
.diff-icon.yellow { background:linear-gradient(135deg,#eab308,#ca8a04); }
.diff-icon.purple { background:linear-gradient(135deg,#8b5cf6,#7c3aed); }
.diff-icon.orange { background:linear-gradient(135deg,#f97316,#ea580c); }
.diff-icon.indigo { background:linear-gradient(135deg,#6366f1,#4f46e5); }
.diff-card h3 { font-size:1.25rem; font-weight:700; color:var(--gray-900); margin-bottom:1rem; }
.diff-card p { color:var(--gray-600); line-height:1.7; }
.diff-cta-box {
  background:var(--white); border-radius:1.5rem; padding:2rem;
  box-shadow:var(--shadow-xl); text-align:center; margin-top:4rem;
}
@media(min-width:768px){ .diff-cta-box{ padding:3rem; } }
.diff-cta-box h3 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin-bottom:1rem; }
@media(min-width:768px){ .diff-cta-box h3{ font-size:1.875rem; } }
.diff-cta-box p { color:var(--gray-600); margin-bottom:2rem; max-width:40rem; margin-left:auto; margin-right:auto; }
.diff-cta-buttons { display:flex; flex-direction:column; gap:1rem; justify-content:center; }
@media(min-width:640px){ .diff-cta-buttons{ flex-direction:row; } }

/* ── TESTIMONIALS ── */
.testimonials-section { padding:5rem 0; background:linear-gradient(to bottom,var(--white),var(--gray-50)); }
.testimonial-slider { position:relative; }
.testimonial-card {
  background:var(--white); border-radius:1.5rem; box-shadow:var(--shadow-2xl); overflow:hidden;
}
.testimonial-body { padding:2rem; }
@media(min-width:768px){ .testimonial-body{ padding:3rem; } }
.testimonial-grid { display:grid; gap:2rem; align-items:center; }
@media(min-width:1024px){ .testimonial-grid{ grid-template-columns:2fr 1fr; } }
.testimonial-header { display:flex; align-items:center; gap:.75rem; margin-bottom:1.5rem; }
.testimonial-stars { display:flex; gap:4px; }
.testimonial-stars svg { width:20px; height:20px; color:#eab308; fill:#eab308; }
blockquote { font-size:1.125rem; color:var(--gray-700); margin-bottom:2rem; line-height:1.7; font-style:italic; }
@media(min-width:768px){ blockquote{ font-size:1.25rem; } }
.testimonial-author { display:flex; align-items:center; gap:1rem; }
.author-avatar {
  width:48px; height:48px; border-radius:9999px;
  background:var(--blue-100); display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.author-avatar svg { width:24px; height:24px; color:var(--blue-600); }
.author-name { font-weight:600; color:var(--gray-900); }
.author-role { font-size:.875rem; color:var(--gray-600); }
.testimonial-stats { display:flex; flex-direction:column; gap:1.5rem; }
.t-stat { border-radius:.75rem; padding:1.5rem; text-align:center; }
.t-stat.green { background:linear-gradient(to right,#f0fdf4,#dcfce7); }
.t-stat.blue { background:linear-gradient(to right,var(--blue-50),var(--blue-100)); }
.t-stat.purple { background:linear-gradient(to right,#faf5ff,#f3e8ff); }
.t-stat-value { font-size:1.875rem; font-weight:700; margin-bottom:.5rem; }
.t-stat.green .t-stat-value { color:var(--green-600); }
.t-stat.blue .t-stat-value { color:var(--blue-600); }
.t-stat.purple .t-stat-value { color:#7c3aed; }
.t-stat-label { font-weight:600; }
.t-stat.green .t-stat-label { color:#15803d; }
.t-stat.blue .t-stat-label { color:#1d4ed8; }
.t-stat.purple .t-stat-label { color:#6d28d9; }
.t-stat-stars { display:flex; justify-content:center; gap:4px; margin-bottom:.5rem; }
.t-stat-stars svg { width:16px; height:16px; color:#7c3aed; fill:#7c3aed; }
.testimonial-nav { display:flex; align-items:center; justify-content:space-between; margin-top:2rem; }
.nav-btn {
  width:44px; height:44px; border-radius:9999px; background:var(--white);
  box-shadow:var(--shadow-lg); display:flex; align-items:center; justify-content:center;
  color:var(--gray-600); transition:all .2s ease;
}
.nav-btn:hover { box-shadow:var(--shadow-xl); color:var(--blue-600); }
.nav-btn svg { width:24px; height:24px; }
.testimonial-dots { display:flex; gap:8px; }
.t-dot {
  width:12px; height:12px; border-radius:9999px;
  background:var(--gray-300); transition:all .3s ease; cursor:pointer;
}
.t-dot.active { width:32px; background:var(--blue-600); }
.testimonial-bottom-cta { text-align:center; margin-top:4rem; }
.testimonial-bottom-cta h3 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin-bottom:1rem; }
.testimonial-bottom-cta p { color:var(--gray-600); margin-bottom:2rem; max-width:40rem; margin-left:auto; margin-right:auto; }

/* ── BLOG ── */
.blog-section { padding:5rem 0; background:var(--white); }
.blog-grid { display:grid; gap:2rem; }
@media(min-width:768px){ .blog-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .blog-grid{ grid-template-columns:repeat(3,1fr); } }
.blog-card {
  background:var(--white); border-radius:1.5rem; box-shadow:var(--shadow-lg); overflow:hidden;
  transition:all .3s ease;
}
.blog-card:hover { box-shadow:var(--shadow-2xl); transform:translateY(-4px); }
.blog-card-img { position:relative; aspect-ratio:16/9; overflow:hidden; }
.blog-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.blog-card:hover .blog-card-img img { transform:scale(1.05); }
.blog-card-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.5),transparent); }
.blog-category {
  position:absolute; top:1rem; left:1rem;
  display:inline-flex; align-items:center; gap:4px;
  padding:4px 12px; border-radius:9999px; color:#fff; font-size:.875rem; font-weight:500;
}
.blog-category.green { background:linear-gradient(135deg,#22c55e,#16a34a); }
.blog-category.purple { background:linear-gradient(135deg,#8b5cf6,#7c3aed); }
.blog-category.blue { background:linear-gradient(135deg,#3b82f6,#2563eb); }
.blog-category svg { width:16px; height:16px; }
.blog-readtime {
  position:absolute; bottom:1rem; right:1rem;
  display:flex; align-items:center; gap:8px; color:#fff; font-size:.875rem;
}
.blog-readtime svg { width:16px; height:16px; }
.blog-card-body { padding:1.5rem; }
.blog-card-body h3 {
  font-size:1.25rem; font-weight:700; color:var(--gray-900); margin-bottom:.75rem; line-height:1.4;
  transition:color .2s ease;
}
.blog-card:hover .blog-card-body h3 { color:var(--blue-600); }
.blog-card-body p { color:var(--gray-600); margin-bottom:1rem; line-height:1.6; }
.blog-read-more {
  display:inline-flex; align-items:center; gap:8px;
  color:var(--blue-600); font-weight:600; transition:gap .2s ease;
}
.blog-read-more:hover { gap:12px; }
.blog-read-more svg { width:16px; height:16px; transition:transform .2s ease; }
.blog-read-more:hover svg { transform:translateX(4px); }

/* ── CONTACT SECTION (home) ── */
.contact-section { padding:5rem 0; background:linear-gradient(to bottom,var(--gray-50),var(--white)); }
.contact-grid { display:grid; gap:3rem; }
@media(min-width:1024px){ .contact-grid{ grid-template-columns:1fr 1fr; } }
.contact-methods { display:grid; gap:1rem; }
.contact-method {
  display:flex; align-items:center; gap:1.5rem; padding:1.5rem; background:var(--white);
  border-radius:.75rem; box-shadow:var(--shadow-lg); transition:all .3s ease;
}
.contact-method[href="#"]{ cursor:default; }
.contact-method:not([href="#"]):hover { box-shadow:var(--shadow-xl); transform:translateY(-2px); }
.contact-method-icon {
  width:56px; height:56px; border-radius:.75rem; display:flex; align-items:center;
  justify-content:center; color:#fff; flex-shrink:0; transition:transform .3s ease;
}
.contact-method:hover .contact-method-icon { transform:scale(1.1); }
.contact-method-icon.blue { background:linear-gradient(135deg,#3b82f6,#2563eb); }
.contact-method-icon.green { background:linear-gradient(135deg,#22c55e,#16a34a); }
.contact-method-icon.purple { background:linear-gradient(135deg,#8b5cf6,#7c3aed); }
.contact-method-icon.orange { background:linear-gradient(135deg,#f97316,#ea580c); }
.contact-method-icon svg { width:24px; height:24px; }
.contact-method-title { font-weight:600; color:var(--gray-900); margin-bottom:.25rem; }
.contact-method-info { color:var(--blue-600); font-weight:500; margin-bottom:.25rem; }
.contact-method-desc { font-size:.875rem; color:var(--gray-500); }
.business-hours { background:linear-gradient(135deg,var(--blue-50),var(--gray-50)); border-radius:.75rem; padding:1.5rem; margin-top:2rem; }
.business-hours-header { display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; }
.business-hours-header svg { width:24px; height:24px; color:var(--blue-600); }
.business-hours-header h4 { font-weight:600; color:var(--gray-900); }
.hours-row { display:flex; justify-content:space-between; padding:.5rem 0; border-bottom:1px solid var(--gray-200); font-size:.875rem; }
.hours-row:last-child { border-bottom:none; }
.hours-label { color:var(--gray-600); }
.hours-value { font-weight:500; color:var(--gray-900); }
.hours-value.highlight { color:var(--blue-600); }
.contact-cta-box { background:linear-gradient(135deg,var(--blue-600),var(--blue-800)); color:#fff; border-radius:1.5rem; padding:2.5rem; }
.contact-cta-box h3 { font-size:1.5rem; font-weight:700; margin-bottom:1.5rem; }
@media(min-width:768px){ .contact-cta-box h3{ font-size:1.875rem; } }
.contact-cta-box p { color:#bfdbfe; margin-bottom:2rem; line-height:1.7; }
.contact-benefits { display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem; }
.contact-benefit { display:flex; align-items:center; gap:.75rem; }
.contact-benefit .check { color:#4ade80; font-weight:700; }
.contact-benefit span { color:#bfdbfe; }
.contact-cta-buttons { display:flex; flex-direction:column; gap:1rem; }
@media(min-width:640px){ .contact-cta-buttons{ flex-direction:row; } }
.btn-white-cta {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 24px; border-radius:.5rem;
  background:#fff; color:var(--blue-600); font-weight:600; flex:1;
  transition:all .2s ease;
}
.btn-white-cta:hover { background:var(--gray-100); }
.btn-glass {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 24px; border-radius:.5rem;
  background:rgba(255,255,255,.1); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.2); color:#fff; font-weight:600;
  transition:all .2s ease;
}
.btn-glass:hover { background:rgba(255,255,255,.2); }
.contact-cta-footer { margin-top:1.5rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.2); text-align:center; }
.contact-cta-footer p { color:#bfdbfe; font-size:.875rem; }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  position:relative; background:linear-gradient(135deg,var(--blue-900) 0%,var(--blue-800) 50%,var(--gray-900) 100%);
  color:#fff; padding:8rem 0 5rem;
}
.page-hero::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,.2); }
.page-hero-inner { position:relative; text-align:center; }
.page-hero h1 { font-size:2.5rem; font-weight:900; margin-bottom:1.5rem; }
@media(min-width:768px){ .page-hero h1{ font-size:3.75rem; } }
.page-hero h1 .accent { color:#93c5fd; }
.page-hero p { font-size:1.25rem; color:#bfdbfe; max-width:48rem; margin:0 auto; }

/* ── FOOTER ── */
.footer { background:var(--gray-900); color:#fff; }
.footer-main { padding:4rem 0; }
.footer-grid { display:grid; gap:2rem; }
@media(min-width:768px){ .footer-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .footer-grid{ grid-template-columns:2fr 1fr 1fr; } }
.footer-brand { grid-column:span 1; }
@media(min-width:1024px){ .footer-brand{ grid-column:span 1; } }
.footer-logo-row { display:flex; align-items:center; gap:.75rem; margin-bottom:1.5rem; }
.footer-logo-icon { width:40px; height:40px; background:var(--blue-600); border-radius:.5rem; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1.125rem; }
.footer-logo-name { font-size:1.25rem; font-weight:700; }
.footer-logo-sub { color:var(--gray-400); font-size:.875rem; }
.footer-desc { color:var(--gray-300); margin-bottom:1.5rem; line-height:1.7; }
.footer-location { display:flex; align-items:center; gap:.5rem; color:var(--gray-400); font-size:.875rem; }
.footer-location svg { width:16px; height:16px; flex-shrink:0; }
.footer-col h3 { font-size:1.125rem; font-weight:600; margin-bottom:1.5rem; }
.footer-links { display:flex; flex-direction:column; gap:.75rem; }
.footer-links a { color:var(--gray-300); font-size:.875rem; transition:color .2s ease; }
.footer-links a:hover { color:var(--blue-400); }
.footer-contacts { padding:2rem 0; border-top:1px solid var(--gray-800); }
.footer-contacts-grid { display:grid; gap:1.5rem; }
@media(min-width:768px){ .footer-contacts-grid{ grid-template-columns:repeat(3,1fr); } }
.footer-contact-item { display:flex; align-items:center; gap:.75rem; color:var(--gray-300); transition:color .2s ease; }
.footer-contact-item:hover { color:var(--blue-400); }
.footer-contact-icon {
  width:40px; height:40px; background:var(--gray-800); border-radius:.5rem;
  display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .2s ease;
}
.footer-contact-item:hover .footer-contact-icon { background:var(--blue-600); }
.footer-contact-icon svg { width:20px; height:20px; }
.footer-contact-label { font-size:.75rem; color:var(--gray-400); }
.footer-contact-value { font-weight:500; }
.footer-bottom { border-top:1px solid var(--gray-800); padding:2rem 0; }
.footer-bottom-row { display:flex; flex-direction:column; gap:1rem; align-items:center; }
@media(min-width:768px){ .footer-bottom-row{ flex-direction:row; justify-content:space-between; } }
.footer-copy { font-size:.875rem; color:var(--gray-400); text-align:center; }
.footer-copy a { transition:color .2s ease; }
.footer-copy a:hover { color:var(--blue-400); }
.footer-legal { display:flex; gap:1rem; font-size:.875rem; color:var(--gray-400); }
.footer-legal a { transition:color .2s ease; }
.footer-legal a:hover { color:var(--blue-400); }

/* ── WHATSAPP FLOAT ── */
.whatsapp-float { position:fixed; bottom:1.5rem; right:1.5rem; z-index:40; }
.whatsapp-btn {
  width:60px; height:60px; border-radius:9999px; background:#22c55e;
  display:flex; align-items:center; justify-content:center; color:#fff;
  box-shadow: 0 0 20px rgba(34, 197, 94, 0.4); 
  transition:all .3s ease; position:relative;
  animation: whatsapp-pulse 2s infinite;
}
.whatsapp-btn:hover { 
  background:#16a34a; 
  box-shadow: 0 0 30px rgba(34, 197, 94, 0.7); 
  transform:scale(1.1); 
  animation: none;
}
.whatsapp-btn svg { width:32px; height:32px; }
.whatsapp-tooltip {
  position:absolute; right:calc(100% + 12px); top:50%; transform:translateY(-50%);
  background:#111827 !important; color:#fff !important; font-size:.875rem;
  padding:8px 16px; border-radius:.75rem; white-space:nowrap;
  opacity:0; pointer-events:none; transition:all .3s ease;
  box-shadow: var(--shadow-xl);
  border: 1px solid rgba(255,255,255,0.1);
}
.whatsapp-btn:hover .whatsapp-tooltip { opacity:1; transform:translateY(-50%) translateX(-5px); }
.whatsapp-tooltip::after {
  content:''; position:absolute; left:100%; top:50%; transform:translateY(-50%);
  border:6px solid transparent; border-left-color:#111827;
}

@keyframes whatsapp-pulse {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4); }
  70% { box-shadow: 0 0 0 15px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

/* ── FORMS ── */
.form-group { margin-bottom:1.5rem; }
.form-row { display:grid; gap:1rem; }
@media(min-width:768px){ .form-row{ grid-template-columns:1fr 1fr; } }
.form-label { display:block; font-size:.875rem; font-weight:500; color:var(--gray-700); margin-bottom:.5rem; }
.form-input, .form-textarea, .form-select {
  width:100%; padding:10px 14px; border:1px solid var(--gray-300); border-radius:.5rem;
  font-size:1rem; color:var(--gray-900); background:var(--white);
  transition:border-color .2s ease, box-shadow .2s ease; outline:none;
}
.form-input:focus, .form-textarea:focus, .form-select:focus {
  border-color:var(--blue-500); box-shadow:0 0 0 3px rgba(59,130,246,.15);
}
.form-input.error, .form-textarea.error { border-color:#ef4444; }
.form-textarea { resize:vertical; min-height:120px; }
.form-error { display:flex; align-items:center; gap:4px; font-size:.875rem; color:#dc2626; margin-top:.25rem; }
.form-error svg { width:16px; height:16px; flex-shrink:0; }
.form-checkbox-group { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-top:.5rem; }
.form-checkbox-item { display:flex; align-items:center; gap:.5rem; }
.form-checkbox { width:16px; height:16px; cursor:pointer; }
.form-checkbox-label { font-size:.875rem; color:var(--gray-700); cursor:pointer; }
.btn-submit {
  width:100%; padding:14px; border-radius:.5rem; font-weight:600; font-size:1rem; color:#fff;
  background:var(--blue-600); transition:all .2s ease; display:flex; align-items:center; justify-content:center; gap:8px;
}
.btn-submit:hover { background:var(--blue-700); }
.btn-submit.green { background:#16a34a; }
.btn-submit.green:hover { background:#15803d; }
.btn-submit:disabled { opacity:.7; cursor:not-allowed; }
.form-note { font-size:.75rem; color:var(--gray-500); text-align:center; margin-top:1rem; }
.form-success { text-align:center; padding:2rem; }
.form-success-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:9999px;
  background:#dcfce7; color:#16a34a; margin-bottom:1rem;
}
.form-success-icon svg { width:32px; height:32px; }
.form-success h3 { font-size:1.125rem; font-weight:600; color:var(--gray-900); margin-bottom:.5rem; }
.form-success p { color:var(--gray-600); margin-bottom:1.5rem; }
.btn-outline-sm {
  display:inline-flex; align-items:center; justify-content:center;
  padding:8px 20px; border:1px solid var(--gray-300); border-radius:.5rem;
  color:var(--gray-700); font-weight:500; transition:all .2s ease;
}
.btn-outline-sm:hover { background:var(--gray-50); }
.toast {
  position:fixed; bottom:2rem; left:50%; transform:translateX(-50%);
  background:var(--gray-900); color:#fff; padding:12px 24px; border-radius:.75rem;
  font-size:.875rem; box-shadow:var(--shadow-xl); z-index:9999;
  opacity:0; transition:opacity .3s ease; pointer-events:none; white-space:nowrap;
}
.toast.show { opacity:1; }
.toast.error { background:#dc2626; }

/* ── PAGE CONTENT SECTIONS ── */
.bg-white-section { background:var(--white); padding:5rem 0; }
.bg-gray-section { background:var(--gray-50); padding:5rem 0; }
.bg-dark-section { background:var(--gray-900); padding:5rem 0; color:#fff; }
.two-col { display:grid; gap:3rem; align-items:center; }
@media(min-width:1024px){ .two-col{ grid-template-columns:1fr 1fr; } }
.img-rounded { border-radius:1rem; overflow:hidden; box-shadow:var(--shadow-2xl); aspect-ratio:4/3; }
.img-rounded img { width:100%; height:100%; object-fit:cover; }
.img-video { border-radius:1rem; overflow:hidden; box-shadow:var(--shadow-2xl); aspect-ratio:16/9; }
.img-video img { width:100%; height:100%; object-fit:cover; }
.info-card { background:linear-gradient(135deg,var(--blue-50),var(--gray-50)); border-radius:.75rem; padding:2rem; }
.info-card h4 { font-weight:600; color:var(--gray-900); margin-bottom:1rem; }
.info-card-dark { background:linear-gradient(135deg,var(--gray-800),var(--gray-700)); border-radius:.75rem; padding:2rem; }
.info-card-dark h4 { font-weight:600; color:#93c5fd; margin-bottom:1rem; }
.info-list { display:flex; flex-direction:column; gap:1rem; }
.info-item { display:flex; align-items:flex-start; gap:1rem; }
.info-dot { width:8px; height:8px; background:var(--blue-400); border-radius:9999px; margin-top:8px; flex-shrink:0; }
.info-item h5 { font-weight:600; color:#93c5fd; margin-bottom:.25rem; font-size:.875rem; }
.info-item p { color:var(--gray-300); font-size:.875rem; }
.values-grid { display:grid; gap:1.5rem; }
@media(min-width:768px){ .values-grid{ grid-template-columns:1fr 1fr; } }
.value-card { background:linear-gradient(135deg,var(--blue-50),var(--gray-50)); border-radius:.75rem; padding:2rem; transition:all .3s ease; }
.value-card:hover { background:linear-gradient(135deg,var(--blue-100),var(--gray-100)); }
.value-card h3 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin-bottom:1rem; }
.value-card p { color:var(--gray-600); line-height:1.7; }

/* ── BLOG POST ── */
.blog-post-content { max-width:48rem; margin:0 auto; padding:5rem 1rem; }
.blog-post-content h2 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin:2rem 0 1rem; }
.blog-post-content h3 { font-size:1.25rem; font-weight:600; color:var(--gray-900); margin:1.5rem 0 .75rem; }
.blog-post-content p { color:var(--gray-700); line-height:1.8; margin-bottom:1rem; }
.blog-post-content ul { list-style:disc; padding-left:1.5rem; margin-bottom:1rem; }
.blog-post-content ul li { color:var(--gray-700); line-height:1.8; margin-bottom:.5rem; }
.blog-post-content strong { font-weight:700; }
.blog-post-meta { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:2rem; }
.blog-post-meta-tag { display:inline-flex; align-items:center; gap:4px; padding:4px 12px; border-radius:9999px; font-size:.875rem; font-weight:500; }
.blog-post-cta { background:linear-gradient(135deg,var(--blue-600),var(--blue-800)); color:#fff; border-radius:1rem; padding:2rem; margin-top:3rem; text-align:center; }
.blog-post-cta h3 { font-size:1.25rem; font-weight:700; margin-bottom:1rem; }
.blog-post-cta p { color:#bfdbfe; margin-bottom:1.5rem; }

/* ── CONTACT PAGE ── */
.contacts-grid { display:grid; gap:1.5rem; }
@media(min-width:768px){ .contacts-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .contacts-grid{ grid-template-columns:repeat(4,1fr); } }
.contact-card {
  background:var(--white); border-radius:.75rem; padding:1.5rem; box-shadow:var(--shadow-lg);
  display:flex; flex-direction:column; align-items:center; text-align:center;
  transition:all .3s ease;
}
.contact-card:hover { background:var(--blue-50); box-shadow:var(--shadow-xl); transform:translateY(-2px); }
.contact-card-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:9999px;
  background:var(--blue-100); color:var(--blue-600); margin-bottom:1rem;
  transition:all .3s ease;
}
.contact-card:hover .contact-card-icon { background:var(--blue-600); color:#fff; }
.contact-card-icon svg { width:24px; height:24px; }
.contact-card h3 { font-weight:600; color:var(--gray-900); margin-bottom:.5rem; }
.contact-card .info { color:var(--blue-600); font-weight:500; margin-bottom:.25rem; }
.contact-card .desc { font-size:.875rem; color:var(--gray-500); }

/* ── TELEMARKETING PAGE ── */
.tele-hero-badge {
  display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border-radius:9999px;
  background:rgba(37,99,235,.2); border:1px solid rgba(96,165,250,.3); color:#bfdbfe;
  font-size:.875rem; font-weight:500; margin-bottom:1.5rem;
}
.tele-benefits { display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem; }
.tele-benefit { display:flex; align-items:center; gap:.75rem; }
.tele-benefit .check { color:#4ade80; font-size:1.25rem; }
.tele-benefit span { color:#bfdbfe; }
.plans-grid { display:grid; gap:2rem; }
@media(min-width:768px){ .plans-grid{ grid-template-columns:repeat(3,1fr); } }
.plan-card { background:var(--white); border-radius:1.5rem; padding:2rem; box-shadow:var(--shadow-lg); position:relative; border:2px solid transparent; }
.plan-card.featured { border-color:var(--blue-500); }
.plan-badge {
  position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:linear-gradient(135deg,var(--blue-600),var(--cyan-500)); color:#fff;
  padding:4px 16px; border-radius:9999px; font-size:.75rem; font-weight:700;
}
.plan-name { font-size:1.25rem; font-weight:700; color:var(--gray-900); margin-bottom:.5rem; }
.plan-price { font-size:2.5rem; font-weight:900; color:var(--blue-600); margin-bottom:1.5rem; }
.plan-price span { font-size:1rem; font-weight:400; color:var(--gray-500); }
.plan-features { display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem; }
.plan-feature { display:flex; align-items:center; gap:.75rem; font-size:.875rem; color:var(--gray-700); }
.plan-feature .check { color:var(--green-500); flex-shrink:0; }

/* ── PRIVACY & TERMS ── */
.legal-content { max-width:48rem; margin:0 auto; padding:5rem 1rem; }
.legal-content h2 { font-size:1.5rem; font-weight:700; color:var(--gray-900); margin:2.5rem 0 1rem; padding-bottom:.75rem; border-bottom:2px solid var(--blue-100); }
.legal-content h3 { font-size:1.125rem; font-weight:600; color:var(--gray-900); margin:1.5rem 0 .5rem; }
.legal-content p { color:var(--gray-700); line-height:1.8; margin-bottom:1rem; }
.legal-content ul { padding-left:1.5rem; margin-bottom:1rem; }
.legal-content ul li { color:var(--gray-700); line-height:1.8; margin-bottom:.5rem; list-style:disc; }
.legal-last-updated { color:var(--gray-500); font-size:.875rem; margin-bottom:3rem; }

/* ── RESPONSIVE UTILITIES ── */
@media(max-width:767px){
  .section { padding:3rem 0; }
  .section-title { font-size:1.75rem; }
  .hero-title { font-size:2rem; }
  .page-hero { padding:6rem 0 3rem; }
  .page-hero h1 { font-size:2rem; }
}

/* Footer Logo Effect */
.footer-logo-link { display: inline-block; transition: transform 0.3s ease; }
.footer-logo-link img { filter: drop-shadow(0 0 8px rgba(0,180,255,0.25)); transition: transform 0.3s ease; }
.footer-logo-link:hover img { transform: scale(1.04); }
/* Language Switcher */
.lang-switcher { display: flex; align-items: center; align-self: center; gap: 8px; margin-left: 12px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,0.1); height: 32px; }
.lang-flag { 
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px; height: 18px; border-radius: 2px; overflow: hidden; 
    cursor: pointer; opacity: 0.6; transition: all 0.3s ease;
    border: 1px solid rgba(255,255,255,0.1);
}
.lang-flag svg {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: fill;
}
.lang-flag:hover { opacity: 1; transform: translateY(-2px); }
.lang-flag.active { opacity: 1; border-color: var(--blue-400); box-shadow: 0 0 10px rgba(0,180,255,0.3); }
[data-theme="dark"] .lang-switcher { border-left-color: rgba(255,255,255,0.05); }