/* CSS Variables - CLASP Style */
:root{--primary:#0B7BD9;--primary-600:#096ab9;--primary-700:#085a9b;--accent:#29B36B;--text:#0f172a;--muted:#475569;--bg:#ffffff;--bg-soft:#f1f5f9;--ring:rgba(11,123,217,.25);--shadow:0 10px 30px rgba(2,8,23,.08);--radius:18px;--clasp-dark-blue:#0B1220;--clasp-light-blue:#0B7BD9;--clasp-gradient:linear-gradient(135deg, #0B1220 0%, #1e293b 50%, #334155 100%)}

/* Reset & Base */
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:var(--bg)}a{color:var(--primary);text-decoration:none}img{max-width:100%;height:auto;display:block}

/* Layout */
.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Components - Buttons */
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.15rem;border-radius:12px;font-weight:600;border:1px solid transparent;box-shadow:var(--shadow);transition:.2s background,.2s transform;cursor:pointer}
.btn.primary{background:var(--primary);color:#fff;box-shadow:0 4px 14px rgba(11,123,217,0.4)}
.btn.primary:hover{background:var(--primary-600);transform:translateY(-2px);box-shadow:0 6px 20px rgba(11,123,217,0.5)}
.btn.outline{background:rgba(255,255,255,0.1);border:2px solid rgba(255,255,255,0.3);color:#ffffff;backdrop-filter:blur(10px)}
.btn.outline:hover{background:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.5);transform:translateY(-2px)}
.btn.secondary{background:#fff;color:var(--primary);border:2px solid var(--primary)}
.btn.secondary:hover{background:var(--primary);color:#fff}
/* Hero specific button styles */
.hero .btn.primary{background:linear-gradient(135deg, var(--primary), #3b82f6);border:none;font-weight:700;text-transform:uppercase;letter-spacing:0.5px}
.hero .btn.outline{background:rgba(255,255,255,0.15);border:2px solid rgba(255,255,255,0.4);color:#ffffff;font-weight:600}

/* Chips & Badges */
.chip{display:inline-block
padding:.35rem .6rem;border-radius:999px;color:var(--primary-700);font-weight:600;font-size:.90rem}.badge{display:inline-block;background:#EEF6FF;color:#0B7BD9;font-weight:700;border-radius:999px;padding:6px 10px;margin:8px 0 4px}.price-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1rem;border-radius:16px;background:linear-gradient(135deg,var(--primary),#3b82f6);color:#fff;font-weight:800;font-size:1.1rem;box-shadow:0 4px 12px rgba(59,130,246,.3);margin:.5rem 0}

/* Trust & Disclaimer */
.trust-indicators{display:flex;align-items:center;gap:1rem;margin:1rem 0;flex-wrap:wrap}.trust-seal{display:flex;align-items:center;gap:.5rem;padding:.4rem .8rem;background:rgba(11,123,217,.05);border:1px solid rgba(11,123,217,.1);border-radius:12px;font-size:.85rem;color:var(--primary-700);font-weight:600}.disclaimer{font-size:.8rem;color:var(--muted);margin-top:.8rem;padding:.6rem;background:rgba(248,250,252,.8);border-radius:8px;border-left:3px solid var(--primary)}

/* Header & Navigation */
header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.98);backdrop-filter:blur(20px);border-bottom:1px solid rgba(11,123,217,0.1);box-shadow:0 2px 20px rgba(0,0,0,0.08);transition:all .3s ease}
.nav{display:flex;align-items:center;height:75px;position:relative;flex-wrap:nowrap;max-width:1200px;margin:0 auto;padding:0 1rem}
.brand{display:flex;align-items:center;z-index:60;flex-shrink:0}
.brand img{width:140px;height:45px;object-fit:contain;border-radius:12px;transition:transform .2s ease;text-shadow:0 1px 2px rgba(11,123,217,0.1)}
.brand img:hover{transform:scale(1.05)}
.nav-menu{display:flex;gap:1.5rem;list-style:none;margin:0;padding:0;align-items:center;flex-wrap:nowrap;margin-left:1rem}
.nav-menu a{display:block;padding:.8rem 0;border-radius:0;color:var(--text);font-weight:600;transition:all .3s ease;position:relative;text-decoration:none;font-size:1rem;white-space:nowrap}
.nav-menu a:hover{color:var(--primary);transform:translateY(-1px)}
.nav-menu a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--primary);transition:width 0.3s ease}
.nav-menu a:hover::after{width:100%}
.nav-menu a.chip{background:rgba(11,123,217,.1);color:var(--primary);border:1px solid rgba(11,123,217,.2);font-size:.85rem;padding:.5rem .7rem;font-weight:700;border-radius:12px}
.nav-menu a.chip:hover{background:var(--primary);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(11,123,217,.3)}
.nav-menu a.active{color:var(--primary)}
.nav-menu a.active::after{width:100%}
.menu-toggle{display:none;flex-direction:column;cursor:pointer;padding:.5rem;border-radius:8px;transition:background .2s ease;color:var(--primary)}
.menu-toggle:hover{background:var(--bg-soft)}
.menu-toggle span{width:24px;height:2px;background:var(--primary);margin:3px 0;transition:all .3s ease;border-radius:2px}
.menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}

.menu-toggle.active span:nth-child(2){opacity:0}.menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}.nav-mobile{display:none!important;position:absolute;top:100%;left:0;right:0;background:rgba(255,255,255,.98);backdrop-filter:blur(20px);border-bottom:1px solid #eef2f7;border-top:1px solid #eef2f7;padding:1rem 0;box-shadow:0 10px 30px rgba(0,0,0,.1)}.nav-mobile ul{flex-direction:column;gap:.5rem;padding:0 1rem}.nav-mobile a{padding:.8rem 1rem;margin:.2rem 0;border-radius:12px}.nav-mobile .nav-actions{margin-top:1rem;padding:0 1rem;display:flex;flex-direction:column;gap:.8rem}@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.nav-actions{display:flex;gap:1rem;align-items:center;flex-shrink:0}
.nav-actions .btn{font-size:.9rem;padding:.8rem 1.5rem;white-space:nowrap;font-weight:600;border-radius:8px}
.nav-actions .btn.primary{background:linear-gradient(135deg, var(--primary), #3b82f6);box-shadow:0 4px 14px rgba(11,123,217,0.3);text-transform:uppercase;letter-spacing:0.5px;border:none}
.nav-actions .btn.primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(11,123,217,0.4)}
.nav-actions .btn.outline{border:2px solid var(--primary);color:var(--primary);background:transparent}
.nav-actions .btn.outline:hover{background:var(--primary);color:#fff;transform:translateY(-1px)}
.nav .cta{margin-left:0}

/* Hero & Sections - CLASP Dark Style */
.hero{position:relative;padding:0 56px;background:var(--clasp-gradient);color:#ffffff;overflow:hidden}
.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="%23ffffff" stroke-width="0.5" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');opacity:0.3}
.hero .container{position:relative;z-index:2}.hero-grid{display:flex;gap:40px;align-items:center}.hero-text{flex:1.1}.hero h1{font-size:clamp(1.8rem,3.2vw + .5rem,3rem);line-height:1.1;margin:.5rem 0 .75rem;color:#ffffff;font-weight:800;text-shadow:0 2px 4px rgba(0,0,0,0.3)}
.hero-image{display:flex;align-items:flex-end;justify-content:center;position:relative;height:100%;flex:0.9;}
.hero-image img{max-width:100%;height:auto;max-height:550px;object-fit:contain;filter:drop-shadow(0 10px 30px rgba(0,0,0,0.3));transition:transform 0.3s ease;margin-bottom:0}
.hero-image img:hover{transform:scale(1.05)}
.hero p.lead{font-size:clamp(1rem,1.2vw + .6rem,1.25rem);color:rgba(255,255,255,0.9);margin:0 0 1.2rem;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.hero .chip{background:rgba(255,255,255,0.15);color:#ffffff;border:1px solid rgba(255,255,255,0.2);backdrop-filter:blur(10px)}
.hero .trust-indicators{color:rgba(255,255,255,0.8)}
.hero .trust-seal{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);color:#ffffff}
.hero .disclaimer{background:rgba(255,255,255,0.1);border-left:3px solid #ffffff;color:rgba(255,255,255,0.9);backdrop-filter:blur(10px)}
.badges{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 1.2rem}
.points{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}
.point{padding:14px;border:1px solid #eef2f7;border-radius:14px;background:#fff}
.price{font-size:1.65rem;font-weight:800;color:var(--accent)}
.hero-card{background:rgba(255,255,255,0.95);border:1px solid rgba(255,255,255,0.2);border-radius:var(--radius);padding:24px;box-shadow:0 8px 32px rgba(0,0,0,0.3);backdrop-filter:blur(20px)}
.hero-card h3{color:var(--text);margin-bottom:16px}
.hero-card .points .point{background:rgba(11,123,217,0.05);border:1px solid rgba(11,123,217,0.1);color:var(--text)}
.hero-card .muted{color:var(--muted)}
.hero-card .btn.primary{background:var(--primary);color:#fff;box-shadow:0 4px 14px rgba(11,123,217,0.4)}section{padding:64px 0}
.section-head{text-align:center;margin-bottom:32px}
h2{font-size:clamp(1.75rem,2vw + 1rem,2rem);margin:0}
p.section-sub{color:#4a5568;margin:.35rem 0 0}

/* CLASP Quem Somos Section */
#quem-somos{background:linear-gradient(135deg, #f8fafc 0%, #f1f5f9 50%, #e2e8f0 100%);position:relative;overflow:hidden}
#quem-somos::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="20" height="20" patternUnits="userSpaceOnUse"><path d="M 20 0 L 0 0 0 20" fill="none" stroke="%23e2e8f0" stroke-width="0.5" opacity="0.3"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>') repeat;opacity:0.4}
#quem-somos .container{position:relative;z-index:1}
#quem-somos .section-head h2{color:var(--text);font-weight:800;background:linear-gradient(135deg, var(--primary), #3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
#quem-somos .section-sub{color:var(--muted);font-size:1.1rem;line-height:1.6}
#quem-somos .card{background:rgba(255,255,255,0.9);border:1px solid rgba(11,123,217,0.1);border-radius:16px;padding:28px;backdrop-filter:blur(10px);transition:all 0.3s ease;position:relative;overflow:hidden}
#quem-somos .card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg, var(--primary), #3b82f6)}
#quem-somos .card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(11,123,217,0.15);border-color:rgba(11,123,217,0.2)}
#quem-somos .card h3{color:var(--text);font-weight:700;font-size:1.3rem;margin-bottom:16px;display:flex;align-items:center;gap:12px}
#quem-somos .card h3::before{content:'🏆';font-size:1.5rem;filter:hue-rotate(200deg)}
#quem-somos .card:nth-child(1) h3::before{content:'🏛️'}
#quem-somos .card:nth-child(2) h3::before{content:'🤝'}
#quem-somos .card:nth-child(3) h3::before{content:'🏆'}
#quem-somos .card p{color:var(--muted);line-height:1.7;font-size:1.05rem}

/* Grids & Cards */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.card{background:#fff;border:1px solid #eef2f7;border-radius:16px;padding:24px;box-shadow:0 4px 12px rgba(0,0,0,0.08)}.card h3{margin:0 0 .35rem;font-size:1.05rem}.muted{color:var(--muted)}.benef-card{background:#fff;border:1px solid #E2E8F0;border-radius:16px;box-shadow:0 8px 24px rgba(2,8,23,.06);padding:22px}.icon-wrap{width:40px;height:40px;border-radius:999px;background:#F1F5F9;display:grid;place-items:center;margin-bottom:12px}.icon-wrap img{width:22px;height:22px;filter:none}.bullets{list-style:none;padding:0;margin:10px 0 0}.bullets li{display:flex;gap:10px;align-items:flex-start;color:#475569;margin:8px 0}.bullets .check{width:16px;height:16px;background:url('/icons/check.svg') no-repeat center/16px 16px;flex:0 0 16px}/* ===== BENEFITS DARK SECTION ===== */
.benefits-dark-section {
  position: relative;
  padding: 80px 0;
  background: var(--clasp-gradient);
  color: #ffffff;
  overflow: hidden;
}

.benefits-dark-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: 
    url('img/img3-min.jpg'),
    linear-gradient(135deg, rgba(11, 18, 32, 0.95) 0%, rgba(30, 41, 59, 0.9) 50%, rgba(51, 65, 85, 0.95) 100%);
  background-size: cover, cover;
  background-position: center, center;
  background-blend-mode: overlay;
  opacity: 0.8;
}

.benefits-dark-section .container {
  position: relative;
  z-index: 2;
}

.benefits-dark-section .section-head h2 {
  color: #ffffff;
  font-weight: 800;
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
  margin-bottom: 16px;
}

.benefits-dark-section .section-sub {
  color: rgba(255,255,255,0.9);
  font-size: 1.1rem;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.benefits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 32px;
  margin-top: 48px;
}

.benefit-card {
  background: rgba(255,255,255,0.95);
  border-radius: 24px;
  padding: 36px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
  border: 1px solid rgba(255,255,255,0.2);
  backdrop-filter: blur(20px);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
  transform: translateY(0);
}

.benefit-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--primary) 0%, #3b82f6 50%, var(--accent) 100%);
  transform: scaleX(0);
  transition: transform 0.4s ease;
}

.benefit-card::after {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, rgba(11,123,217,0.05) 0%, transparent 70%);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.benefit-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 20px 60px rgba(11,123,217,0.3);
  border-color: rgba(11,123,217,0.3);
}

.benefit-card:hover::before {
  transform: scaleX(1);
}

.benefit-card:hover::after {
  opacity: 1;
}

.benefit-card:hover .benefit-icon {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 8px 25px rgba(11,123,217,0.4);
}

/* ===== TESTIMONIALS SECTION ===== */
.testimonials-section {
  position: relative;
  padding: 100px 0;
  background: var(--clasp-gradient);
  color: #ffffff;
  overflow: hidden;
}

.testimonials-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: 
    url('img/img4-min.jpg'),
    linear-gradient(135deg, rgba(11, 18, 32, 0.92) 0%, rgba(30, 41, 59, 0.88) 50%, rgba(51, 65, 85, 0.92) 100%);
  background-size: cover, cover;
  background-position: center, center;
  background-blend-mode: overlay;
  opacity: 0.9;
}

.testimonials-section .container {
  position: relative;
  z-index: 2;
}

.testimonials-section .section-head h2 {
  color: #ffffff;
  font-weight: 800;
  text-shadow: 0 2px 4px rgba(0,0,0,0.4);
  text-align: center;
}

.testimonials-section .section-sub {
  color: rgba(255,255,255,0.9);
  font-size: 1.1rem;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  text-align: center;
}

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: 32px;
  margin: 48px 0;
}

.testimonial-card {
  background: rgba(255,255,255,0.95);
  border-radius: 20px;
  padding: 32px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
  border: 1px solid rgba(255,255,255,0.2);
  backdrop-filter: blur(20px);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.testimonial-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), #3b82f6);
  transform: scaleX(0);
  transition: transform 0.4s ease;
}

.testimonial-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 50px rgba(11,123,217,0.3);
}

.testimonial-card:hover::before {
  transform: scaleX(1);
}

.quote-icon {
  font-size: 4rem;
  color: var(--primary);
  font-weight: bold;
  line-height: 1;
  margin-bottom: 16px;
  opacity: 0.3;
}

.testimonial-content p {
  color: var(--text);
  font-size: 1.1rem;
  line-height: 1.7;
  margin-bottom: 24px;
  font-style: italic;
}

.testimonial-author {
  display: flex;
  align-items: center;
  gap: 16px;
}

.author-info h4 {
  color: var(--text);
  font-weight: 700;
  margin: 0 0 4px 0;
  font-size: 1.1rem;
}

.author-info span {
  color: var(--muted);
  font-size: 0.9rem;
  display: block;
  margin-bottom: 8px;
}

.rating span {
  color: #fbbf24;
  font-size: 1rem;
}

.testimonials-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 32px;
  margin-top: 64px;
  padding-top: 48px;
  border-top: 1px solid rgba(255,255,255,0.2);
}

.stat-item {
  text-align: center;
  padding: 24px;
  background: rgba(255,255,255,0.1);
  border-radius: 16px;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.2);
  transition: all 0.3s ease;
}

.stat-item:hover {
  transform: translateY(-4px);
  background: rgba(255,255,255,0.15);
}

.stat-number {
  font-size: 3rem;
  font-weight: 900;
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
  margin-bottom: 8px;
  display: block;
}

.stat-label {
  color: rgba(255,255,255,0.9);
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.benefit-icon {
  width: 64px;
  height: 64px;
  background: linear-gradient(135deg, var(--primary) 0%, #3b82f6 100%);
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  font-size: 32px;
  color: white;
  box-shadow: 0 4px 16px rgba(11,123,217,0.3);
  transition: all 0.3s ease;
}

.benefit-card:hover .benefit-icon {
  transform: scale(1.05);
  box-shadow: 0 6px 20px rgba(11,123,217,0.4);
}

.benefit-card h3 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 16px;
  line-height: 1.3;
}

.benefit-card p {
  color: var(--muted);
  line-height: 1.7;
  margin-bottom: 20px;
  font-size: 1.05rem;
}

.benefit-highlights {
  list-style: none;
  padding: 0;
  margin: 0;
}

.benefit-highlights li {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  font-size: 0.95rem;
  color: #555;
}

.benefit-highlights li::before {
  content: '✓';
  color: var(--accent);
  font-weight: bold;
  margin-right: 8px;
  font-size: 16px;
}

.benefit-price {
  background: linear-gradient(135deg, #e8f5e8, #f0f9ff);
  border: 1px solid #d1fae5;
  border-radius: 8px;
  padding: 12px 16px;
  margin-top: 16px;
  text-align: center;
}

.benefit-price .price {
  font-size: 2.5rem;
  font-weight: 900;
  background: linear-gradient(135deg, var(--primary), #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: block;
  text-shadow: none;
}

.benefit-price .price-label {
  font-size: 0.9rem;
  color: var(--muted);
  font-weight: 600;
  background: rgba(11,123,217,0.05);
  padding: 4px 12px;
  border-radius: 20px;
  display: inline-block;
  margin-top: 8px;
}

/* ===== SPECIALTIES CAROUSEL ===== */
.specialties-carousel-container {
  margin-top: 32px;
  position: relative;
}

/* ===== SPECIALTIES CAROUSEL - CLASP Style ===== */
.specialties-carousel {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  overflow: visible;
  margin-bottom: 2rem;
}

.specialty-list {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid rgba(11,123,217,0.1);
  border-radius: 20px;
  padding: 28px 24px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.specialty-list::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), #3b82f6);
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.specialty-list:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 40px rgba(11,123,217,0.2);
  border-color: var(--primary);
}

.specialty-list:hover::before {
  transform: scaleX(1);
}

.list-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 20px 0;
  text-align: center;
  padding-bottom: 16px;
  border-bottom: 2px solid rgba(11,123,217,0.1);
  position: relative;
}

.list-title::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 2px;
  background: var(--primary);
}

.specialty-items {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.specialty-item {
  background: rgba(11,123,217,0.03);
  border: 1px solid rgba(11,123,217,0.1);
  border-radius: 12px;
  padding: 14px 18px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  text-align: center;
  transition: all 0.3s ease;
  cursor: pointer;
}

.specialty-item:hover {
  border-color: var(--primary);
  background: rgba(11,123,217,0.1);
  color: var(--primary);
  transform: translateX(4px);
  box-shadow: 0 2px 8px rgba(11,123,217,0.15);
}

.carousel-indicators {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 32px;
}

.indicator {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #d1d5db;
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.indicator:hover {
  background: rgba(11,123,217,0.5);
  transform: scale(1.1);
}

.indicator.active {
  background: var(--primary);
  transform: scale(1.3);
  border-color: rgba(11,123,217,0.2);
  box-shadow: 0 0 0 4px rgba(11,123,217,0.1);
}

/* ===== SPECIALTIES DARK SECTION ===== */
.specialties-dark-section {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.95), rgba(51, 65, 85, 0.9)), url('#img') center/cover;
  color: white;
  position: relative;
  overflow: hidden;
}

.specialties-dark-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 70% 20%, rgba(59, 130, 246, 0.1) 0%, transparent 50%),
              radial-gradient(circle at 30% 80%, rgba(139, 92, 246, 0.1) 0%, transparent 50%),
              radial-gradient(circle at 60% 60%, rgba(16, 185, 129, 0.05) 0%, transparent 50%);
  pointer-events: none;
}

.specialties-dark-section .section-head h2 {
  color: white;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}

.specialties-dark-section .section-sub {
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.specialties-dark-section .specialties-carousel {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  margin-bottom: 40px;
  transition: all 0.5s ease;
}

.specialties-dark-section .specialty-list {
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(15px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 16px;
  padding: 30px;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.specialties-dark-section .specialty-list::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--clasp-light-blue), #3b82f6);
  transform: scaleX(0);
  transition: transform 0.4s ease;
}

.specialties-dark-section .specialty-list:hover::before {
  transform: scaleX(1);
}

.specialties-dark-section .specialty-list:hover {
  transform: translateY(-8px);
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(59, 130, 246, 0.3);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.specialties-dark-section .list-title {
  color: white;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 20px;
  text-align: center;
  background: linear-gradient(135deg, var(--clasp-light-blue), #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  border-bottom: none;
  padding-bottom: 0;
}

.specialties-dark-section .specialty-items {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.specialties-dark-section .specialty-item {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 12px 16px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 500;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  text-align: center;
}

.specialties-dark-section .specialty-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(59, 130, 246, 0.2), transparent);
  transition: left 0.4s ease;
}

.specialties-dark-section .specialty-item:hover::before {
  left: 100%;
}

.specialties-dark-section .specialty-item:hover {
  background: rgba(59, 130, 246, 0.15);
  border-color: rgba(59, 130, 246, 0.4);
  color: white;
  transform: translateX(5px);
}

.specialties-dark-section .carousel-indicators {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 30px;
}

.specialties-dark-section .indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.specialties-dark-section .indicator:hover {
  background: rgba(255, 255, 255, 0.5);
  transform: scale(1.1);
}

.specialties-dark-section .indicator.active {
  background: var(--clasp-light-blue);
  border-color: rgba(255, 255, 255, 0.3);
  transform: scale(1.2);
}

/* ===== ACCORDION ===== */
.specialty-accordion {
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 16px;
}

.accordion-header {
  background: var(--primary);
  color: white;
  padding: 16px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
  user-select: none;
}

.accordion-header::after {
  content: '+';
  font-size: 1.2rem;
  transition: transform 0.3s ease;
}

.accordion-header.active::after {
  transform: rotate(45deg);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  background: white;
}

.accordion-content.active {
  max-height: 500px;
}

.accordion-content .specialties-list {
  padding: 16px;
}

.partners-accordion {
  margin-bottom: 1rem;
}

.partners-accordion .accordion-header {
  background: var(--secondary);
  color: var(--text);
}

.partners-accordion .accordion-header:hover {
  background: #e8f4f8;
}

/* ===== FAQ ===== */
#faq {
  background: var(--clasp-gradient);
  color: #ffffff;
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}

#faq::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: 
    url('img/img4-min.jpg'),
    linear-gradient(135deg, rgba(11, 18, 32, 0.92) 0%, rgba(30, 41, 59, 0.88) 50%, rgba(51, 65, 85, 0.92) 100%);
  background-size: cover, cover;
  background-position: center, center;
  background-blend-mode: overlay;
  opacity: 0.9;
}

#faq .container {
  position: relative;
  z-index: 2;
}

#faq .section-head h2 {
  color: #ffffff;
  font-weight: 800;
  text-shadow: 0 2px 4px rgba(0,0,0,0.4);
  text-align: center;
}

#faq .section-sub {
  color: rgba(255,255,255,0.9);
  font-size: 1.1rem;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  text-align: center;
}

.faq-container {
  max-width: 800px;
  margin: 0 auto;
}

.faq-item {
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 20px;
  margin-bottom: 20px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
  backdrop-filter: blur(20px);
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}

.faq-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), #3b82f6);
  transform: scaleX(0);
  transition: transform 0.4s ease;
}

.faq-item:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 50px rgba(11,123,217,0.3);
}

.faq-item:hover::before {
  transform: scaleX(1);
}

.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 32px;
  cursor: pointer;
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--text);
  transition: all 0.3s ease;
  user-select: none;
  background: transparent;
  border: none;
  position: relative;
  overflow: hidden;
}

.faq-question::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(11,123,217,0.1), transparent);
  transition: left 0.5s ease;
}

.faq-question:hover::before {
  left: 100%;
}

.faq-question:hover {
  background: rgba(11,123,217,0.05);
  color: var(--primary);
}

.faq-question.active {
  background: rgba(11,123,217,0.1);
  color: var(--primary);
  border-bottom: 1px solid rgba(11,123,217,0.2);
}

.faq-icon {
  font-size: 24px;
  font-weight: bold;
  color: var(--primary);
  transition: all 0.3s ease;
  margin-left: auto;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(11,123,217,0.1);
  z-index: 1;
  position: relative;
}

.faq-question.active .faq-icon {
  transform: rotate(45deg);
  background: rgba(11,123,217,0.2);
  color: var(--primary);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: all 0.4s ease;
  background: rgba(11,123,217,0.02);
}

.faq-answer.active {
  max-height: 200px;
}

.faq-answer p {
  padding: 0 32px 32px 32px;
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
  font-size: 1.05rem;
}

/* Mobile responsive */
@media (max-width: 768px) {
  .faq-question {
    padding: 24px;
    font-size: 1rem;
  }
  
  .faq-answer p {
    padding: 0 24px 24px 24px;
    font-size: 0.95rem;
  }
  
  .faq-icon {
    font-size: 20px;
    width: 26px;
    height: 26px;
  }
}

/* ===== LISTS ===== */
.list-col {
  columns: 2;
  column-gap: 24px;
}

.list-col li {
  break-inside: avoid;
}

/* ===== STEPS - CLASP Style ===== */
.steps {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 24px;
  margin-top: 2rem;
}

.step {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid rgba(11,123,217,0.1);
  border-radius: 20px;
  padding: 2rem 1.5rem 1.5rem;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

.step:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 30px rgba(11,123,217,0.15);
  border-color: var(--primary);
}

.step .num {
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, var(--primary), #3b82f6);
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 1.1rem;
  box-shadow: 0 4px 15px rgba(11,123,217,0.3);
  border: 3px solid #ffffff;
}

.step h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
  margin: 0.5rem 0 0.75rem;
  text-align: center;
}

.step p.muted {
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--muted);
  text-align: center;
  margin: 0;
}

/* ===== FORMS ===== */
.form {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 14px;
}

.form .field {
  grid-column: span 6;
}

.form .field.full {
  grid-column: 1 / -1;
}

.form label {
  display: block;
  font-weight: 600;
  margin: 6px 0;
}

.form input,
.form select,
.form textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  outline: none;
}

.form input:focus,
.form select:focus,
.form textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px var(--ring);
}

.helper {
  font-size: .9rem;
  color: var(--muted);
}

.checkbox-field {
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  padding: 1rem;
  background: rgba(248,250,252,.8);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  margin: 1rem 0;
}

.checkbox-field input[type="checkbox"] {
  width: auto;
  margin: 0;
  transform: scale(1.2);
}

.checkbox-field label {
  margin: 0;
  font-weight: 500;
  font-size: .9rem;
  line-height: 1.4;
}

.checkbox-field.discrete {
  background: transparent;
  border: none;
  padding: 0.5rem 0;
  margin: 0.5rem 0;
}

.checkbox-field.discrete label {
  font-size: 0.9rem;
  color: #6b7280;
  font-weight: 400;
}

.checkbox-field.discrete input[type="checkbox"] {
  transform: scale(1);
}

.form-disclaimer {
  background: rgba(254,243,199,.5);
  border: 1px solid #fbbf24;
  border-radius: 8px;
  padding: .8rem;
  margin: 1rem 0;
  font-size: .85rem;
  color: #92400e;
}

/* ===== LOGOS ===== */
.logo-row {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 18px;
  align-items: center;
}

.logo-row .logo {
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 16px;
  padding: 14px;
  display: grid;
  place-items: center;
  min-height: 84px;
  opacity: .9;
}

.logo-row img {
  max-height: 40px;
  object-fit: contain;
  filter: grayscale(100%);
}

/* ===== FOOTER ===== */
footer {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.98), rgba(30, 41, 59, 0.95)), url('#img') center/cover;
  color: white;
  padding: 60px 0 20px;
  position: relative;
  overflow: hidden;
}

footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 25% 25%, rgba(59, 130, 246, 0.1) 0%, transparent 50%),
              radial-gradient(circle at 75% 75%, rgba(139, 92, 246, 0.1) 0%, transparent 50%),
              radial-gradient(circle at 50% 50%, rgba(16, 185, 129, 0.05) 0%, transparent 50%);
  pointer-events: none;
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: 40px;
  margin-bottom: 40px;
  position: relative;
  z-index: 2;
}

.foot-brand {
  position: relative;
}

.foot-brand img {
  height: 48px;
  margin-bottom: 16px;
  filter: brightness(1.1);
  transition: all 0.3s ease;
}

.foot-brand:hover img {
  filter: brightness(1.3) drop-shadow(0 0 10px rgba(59, 130, 246, 0.3));
}

.foot-brand p {
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
  font-size: 0.95rem;
  margin-top: 12px;
}

footer h4 {
  color: white;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px;
  position: relative;
}

footer h4::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 30px;
  height: 2px;
  background: white;
  border-radius: 1px;
}

footer p {
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
  margin-bottom: 8px;
}

footer a {
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  font-weight: 500;
}

footer a::before {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: white;
  transition: width 0.3s ease;
}

footer a:hover {
  color: white;
  transform: translateX(3px);
}

footer a:hover::before {
  width: 100%;
}

footer p a {
  display: inline-block;
  padding: 2px 0;
}

.copyright {
  text-align: center;
  padding-top: 30px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
  position: relative;
  z-index: 2;
}

/* Mobile responsive */
@media (max-width: 1024px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
}

@media (max-width: 768px) {
  footer {
    padding: 40px 0 20px;
  }
  
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 25px;
    text-align: center;
  }
  
  .foot-brand {
    padding-right: 0;
    margin-bottom: 20px;
  }
  
  footer h4::after {
    left: 50%;
    transform: translateX(-50%);
  }
}

/* ===== PARALLAX E ANIMAÇÕES DE SCROLL ===== */
.parallax-element {
  will-change: transform;
  transition: transform 0.1s ease-out;
}

.parallax-container {
  overflow: hidden;
  position: relative;
}

.scroll-animate {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.scroll-animate.animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Variações de animação */
.scroll-animate.fade-left {
  transform: translateX(-30px);
}

.scroll-animate.fade-left.animate-in {
  transform: translateX(0);
}

.scroll-animate.fade-right {
  transform: translateX(30px);
}

.scroll-animate.fade-right.animate-in {
  transform: translateX(0);
}

.scroll-animate.scale-up {
  transform: scale(0.9);
}

.scroll-animate.scale-up.animate-in {
  transform: scale(1);
}

/* Efeito parallax para hero */
.hero-parallax {
  position: relative;
  overflow: hidden;
  min-height: 100vh;
}

.hero-parallax::before {
  content: '';
  position: absolute;
  top: -20%;
  left: 0;
  width: 100%;
  height: 120%;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.9), rgba(30, 41, 59, 0.8)),
              url('img/img1-min.jpg') center/cover;
  will-change: transform;
  z-index: -1;
}

/* Benefício Completo Dark Section */
.beneficio-completo-dark {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
  color: white;
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}

.beneficio-completo-dark::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 30% 20%, rgba(59, 130, 246, 0.15) 0%, transparent 50%),
              radial-gradient(circle at 70% 80%, rgba(139, 92, 246, 0.1) 0%, transparent 50%);
  pointer-events: none;
}

.beneficio-completo-dark .container {
  position: relative;
  z-index: 1;
}

.beneficio-completo-dark h2 {
  color: white;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.beneficio-completo-dark .section-sub {
  color: rgba(255, 255, 255, 0.8);
}

.beneficio-completo-dark .card {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  padding: 2rem;
  transition: all 0.3s ease;
}

.beneficio-completo-dark .card:hover {
  background: rgba(255, 255, 255, 0.15);
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.beneficio-completo-dark .card h3 {
  color: white;
  margin-bottom: 1rem;
}

.beneficio-completo-dark .card .muted {
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
}

/* Otimizações de performance */
@media (prefers-reduced-motion: reduce) {
  .parallax-element,
  .scroll-animate {
    transform: none !important;
    transition: none !important;
  }
  
  .hero-parallax::before {
    transform: none !important;
  }
}

/* Desabilitar parallax em dispositivos móveis para melhor performance */
@media (max-width: 768px) {
  .parallax-element {
    transform: none !important;
  }
  
  .hero-parallax::before {
    transform: none !important;
  }
  
  .beneficio-completo-dark {
    padding: 60px 0;
  }
  
  .beneficio-completo-dark .card {
    padding: 1.5rem;
  }
}

/* ===== FLOATING ELEMENTS ===== */
.wa-floating {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 40;
}

.wa-floating a {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  font-weight: 800;
  box-shadow: var(--shadow);
}

/* ===== MOBILE CONVERSION BAR ===== */
.mobile-conversion-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-top: 1px solid #eef2f7;
  padding: 12px 16px;
  display: none;
  z-index: 50;
  box-shadow: 0 -4px 20px rgba(0,0,0,.1);
}

.mobile-conversion-bar .conversion-buttons {
  display: flex;
  gap: 8px;
}

.mobile-conversion-bar .btn {
  flex: 1;
  padding: 12px 16px;
  font-size: .9rem;
  font-weight: 700;
  border-radius: 8px;
  text-align: center;
  text-decoration: none;
  transition: all .2s ease;
}

.mobile-conversion-bar .btn.primary {
  background: var(--primary);
  color: #fff;
  border: 2px solid var(--primary);
}

.mobile-conversion-bar .btn.primary:hover {
  background: var(--primary-600);
  border-color: var(--primary-600);
}

/* ===== UTILITIES ===== */
.hide-mobile {
  display: block;
}

.desktop-only {
  display: block;
}

.mobile-only {
  display: none;
}

/* ===== ACCESSIBILITY ===== */
*:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}

.btn:focus,
.nav-menu a:focus {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}

.accordion-header:focus,
.faq-question:focus {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
}

input:focus,
textarea:focus,
select:focus {
  outline: 2px solid var(--primary);
  outline-offset: 0;
  border-color: var(--primary);
}

.skip-link {
  position: absolute;
  top: -40px;
  left: 6px;
  background: var(--primary);
  color: #fff;
  padding: 8px;
  text-decoration: none;
  border-radius: 4px;
  z-index: 100;
  transition: top .3s;
}

.skip-link:focus {
  top: 6px;
}

/* ===== PARTNERS SECTION ===== */
#parceiros {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  position: relative;
}

#parceiros::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: 
    radial-gradient(circle at 25% 25%, rgba(59, 130, 246, 0.03) 0%, transparent 50%),
    radial-gradient(circle at 75% 75%, rgba(16, 185, 129, 0.03) 0%, transparent 50%);
  pointer-events: none;
}

.partners-layout {
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* Abas de Região */
.region-tabs {
  display: flex;
  gap: 2px;
  margin-bottom: 24px;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(10px);
  border-radius: 12px;
  padding: 6px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  width: fit-content;
}

.tab-button {
  background: transparent;
  border: none;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  border-radius: 8px;
  transition: all 0.3s ease;
  white-space: nowrap;
  min-width: fit-content;
  width: fit-content;
  scroll-snap-align: start;
  position: relative;
}

.tab-button:hover {
  color: var(--primary);
  background: rgba(59, 130, 246, 0.1);
  transform: translateY(-1px);
}

.tab-button:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.tab-button.active {
  color: white;
  background: linear-gradient(135deg, var(--primary) 0%, #1e40af 100%);
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
  transform: translateY(-1px);
}

/* Filtro por Cidade */
.city-filter {
  margin-bottom: 24px;
}

#city-filter {
  padding: 12px 16px;
  border: 2px solid #e2e8f0;
  border-radius: 8px;
  background: white;
  color: #374151;
  font-size: 0.9rem;
  transition: all 0.3s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

#city-filter:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
  outline: none;
}

/* Conteúdo das Regiões */
.region-content {
  display: none;
}

.region-content.active {
  display: block;
}

.partners-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 32px;
  align-items: start;
}

/* Grupos de Cidade */
.city-group {
  margin-bottom: 32px;
}

.city-title {
  color: var(--primary);
  margin-bottom: 16px;
  font-size: 1.2rem;
  font-weight: 700;
  border-bottom: 3px solid #f1f5f9;
  padding-bottom: 8px;
  position: relative;
}

.city-title::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, var(--primary), #10b981);
  border-radius: 2px;
}

/* Grid de Clínicas */
.clinic-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}

.clinic-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 16px 20px;
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
  line-height: 1.6;
  gap: 6px;
  position: relative;
  overflow: hidden;
}

.clinic-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--primary), #10b981);
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.clinic-item:hover {
  border-color: var(--primary);
  box-shadow: 0 8px 25px rgba(59, 130, 246, 0.15);
  transform: translateY(-2px);
}

.clinic-item:hover::before {
  transform: scaleX(1);
}

.clinic-name {
  font-weight: 600;
  color: #1e293b;
  word-wrap: break-word;
  hyphens: auto;
  width: 100%;
  font-size: 1rem;
}

.clinic-location {
  color: #64748b;
  font-size: 0.9rem;
  width: 100%;
  font-weight: 500;
}

/* Link Ver Rede Completa */
.view-all-link {
  margin-top: 24px;
  text-align: center;
}

.link-secondary {
  color: var(--primary);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 6px;
  border: 2px solid transparent;
  transition: all 0.3s ease;
  display: inline-block;
}

.link-secondary:hover {
  border-color: var(--primary);
  background: rgba(59, 130, 246, 0.05);
  transform: translateY(-1px);
}

/* Card Como Utilizar */
.how-to-use {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  padding: 24px;
  border-radius: 16px;
  border: 2px solid #e2e8f0;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  position: sticky;
  top: 100px;
  height: fit-content;
  backdrop-filter: blur(10px);
}

.how-to-use h3 {
  margin-bottom: 20px;
  color: var(--primary);
  font-size: 1.2rem;
  font-weight: 700;
  text-align: center;
}

.checklist {
  margin-bottom: 24px;
}

.check-item {
  margin-bottom: 12px;
  color: #374151;
  font-size: 0.95rem;
  line-height: 1.6;
  font-weight: 500;
  padding-left: 8px;
  position: relative;
}

.check-item::before {
  content: '✓';
  position: absolute;
  left: -8px;
  color: #10b981;
  font-weight: bold;
  font-size: 1.1rem;
}

/* Estado Vazio */
.no-results {
  text-align: center;
  padding: 60px 20px;
  color: #64748b;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 12px;
  backdrop-filter: blur(10px);
}

.no-results p {
  margin-bottom: 8px;
  font-weight: 500;
}

.no-results .muted {
  font-size: 0.9rem;
}

/* ===== PERFORMANCE OPTIMIZATIONS ===== */
.hero-card img,
.benefit-card img {
  will-change: transform;
}

/* ===== RESPONSIVE DESIGN ===== */

/* Tablet Styles */
@media (max-width: 1024px) {
  .grid-4 {
    grid-template-columns: repeat(3,1fr);
  }
  
  .logo-row {
    grid-template-columns: repeat(4,1fr);
  }
  
  .steps {
    grid-template-columns: repeat(2,1fr);
  }
  
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
  
  .specialties-carousel {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

/* Small Tablet/Large Mobile */
@media (max-width: 900px) {
  .nav-menu {
    gap: .6rem;
  }
  
  .nav-menu a {
    padding: .5rem .6rem;
    font-size: .85rem;
  }
  
  .nav-menu a.chip {
    padding: .4rem .6rem;
    font-size: .8rem;
  }
  
  .nav-actions .btn {
    font-size: .8rem;
    padding: .5rem .8rem;
  }
  
  .grid-3 {
    grid-template-columns: 1fr;
  }
}

/* Mobile Styles - Auto-adaptive */
@media (max-width: 768px) {
  .desktop-only {
    display: none;
  }
  
  .mobile-only {
    display: block;
  }
  
  .container {
    padding: 0 15px;
    max-width: 100%;
  }
  
  .specialties-carousel-container {
    overflow: visible;
    position: relative;
    margin: 0;
    width: 100%;
    padding: 0;
  }
  
  .specialties-carousel {
    display: flex !important;
    grid-template-columns: none !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 20px;
    padding: 20px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  
  .specialties-carousel::-webkit-scrollbar {
    display: none;
  }
  
  .specialty-list {
    flex: 0 0 85%;
    min-width: 85%;
    scroll-snap-align: center;
    padding: 20px 15px;
    margin: 0;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    border-radius: 16px;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(11,123,217,0.1);
  }
  
  .carousel-indicators {
    display: flex;
    margin-top: 20px;
    justify-content: center;
  }
  
  .specialty-items {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  
  .specialty-item {
    padding: 10px 12px;
    font-size: clamp(0.8rem, 2.8vw, 0.9rem);
    line-height: 1.3;
    word-wrap: break-word;
    hyphens: auto;
    text-align: center;
    border-radius: 8px;
    background: rgba(11,123,217,0.05);
    border: 1px solid rgba(11,123,217,0.1);
  }
  
  .list-title {
    font-size: clamp(0.9rem, 3.2vw, 1rem);
    margin-bottom: 15px;
    text-align: center;
    font-weight: 700;
  }
  
  /* Partners Mobile Styles - Auto-adaptive */
  .partners-grid {
    grid-template-columns: 1fr;
    gap: clamp(15px, 4vw, 20px);
    padding: 0 clamp(10px, 3vw, 15px);
  }
  
  .region-tabs {
    margin-bottom: clamp(15px, 4vw, 20px);
    padding: 4px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  
  .region-tabs::-webkit-scrollbar {
    display: none;
  }
  
  .tab-button {
    padding: clamp(6px, 2vw, 8px) clamp(10px, 3vw, 12px);
    font-size: clamp(0.75rem, 2.2vw, 0.85rem);
    white-space: nowrap;
    min-width: auto;
    flex-shrink: 0;
  }
  
  .clinic-grid {
    grid-template-columns: 1fr;
    gap: clamp(8px, 2.5vw, 12px);
  }
  
  .city-group {
    margin-bottom: clamp(15px, 4vw, 20px);
    background: rgba(255,255,255,0.9);
    border-radius: clamp(8px, 2.5vw, 12px);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  }
  
  .city-title {
    font-size: clamp(0.9rem, 2.8vw, 1rem);
    cursor: pointer;
    position: relative;
    padding: clamp(12px, 4vw, 16px) clamp(15px, 4vw, 20px);
    background: rgba(11,123,217,0.05);
    border-bottom: 1px solid rgba(11,123,217,0.1);
    margin: 0;
    font-weight: 600;
    color: var(--primary);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  
  .city-title::after {
    content: '▼';
    font-size: clamp(0.8rem, 2.5vw, 0.9rem);
    color: var(--primary);
    transition: transform 0.3s ease;
    font-weight: bold;
    flex-shrink: 0;
  }
  
  .city-title.expanded {
    background: rgba(11,123,217,0.1);
  }
  
  .city-title.expanded::after {
    transform: rotate(180deg);
  }
  
  .clinic-grid {
    display: grid;
    margin: 0;
    padding: clamp(12px, 4vw, 16px);
    background: white;
    grid-template-columns: 1fr;
    gap: clamp(8px, 2.5vw, 12px);
    max-height: 300px;
    overflow-y: auto;
    transition: all 0.3s ease;
    opacity: 1;
  }
  
  .clinic-grid.collapsed {
    max-height: 0;
    padding: 0 clamp(12px, 4vw, 16px);
    overflow: hidden;
    opacity: 0;
  }
  
  @keyframes slideDown {
    from {
      opacity: 0;
      max-height: 0;
    }
    to {
      opacity: 1;
      max-height: 500px;
    }
  }
  
  .clinic-item {
    padding: clamp(12px, 3.5vw, 16px);
    background: rgba(11,123,217,0.03);
    border: 1px solid rgba(11,123,217,0.15);
    border-radius: clamp(8px, 2.5vw, 10px);
    font-size: clamp(0.85rem, 2.5vw, 0.95rem);
    line-height: 1.4;
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: all 0.3s ease;
  }
  
  .clinic-item:hover {
    background: rgba(11,123,217,0.08);
    border-color: var(--primary);
    transform: translateY(-1px);
  }
  
  .clinic-name {
    font-weight: 600;
    color: var(--text);
    font-size: clamp(0.9rem, 2.8vw, 1rem);
  }
  
  .clinic-location {
    color: var(--muted);
    font-size: clamp(0.8rem, 2.3vw, 0.9rem);
    font-weight: 500;
  }
  
  .how-to-use {
    order: -1;
    position: static;
    padding: 16px;
  }
}

/* Extra small screens */
@media (max-width: 480px) {
  .specialties-carousel-container {
    margin: 0;
    width: 100%;
    padding: 0;
  }
  
  .specialty-list {
    flex: 0 0 90%;
    min-width: 90%;
    padding: 15px 10px;
  }
  
  .specialty-items {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  
  .specialty-item {
    padding: 8px 6px;
    font-size: clamp(0.75rem, 3.5vw, 0.85rem);
  }
  
  .partners-grid {
    padding: 0 5px;
  }
  
  .city-title {
    padding: 10px 12px;
    font-size: clamp(0.8rem, 3.5vw, 0.9rem);
  }
  
  .clinic-card {
    padding: 8px;
    font-size: clamp(0.75rem, 3.2vw, 0.85rem);
  }
}

@media (max-width: 767px) {
  .mobile-conversion-bar {
    display: block;
  }
  
  .wa-floating {
    bottom: 80px;
  }
  
  body {
    padding-bottom: 70px;
  }
}

/* Large mobile screens */
@media (min-width: 481px) and (max-width: 768px) {
  .specialty-items {
    grid-template-columns: 1fr 1fr;
  }
  
  .specialty-item {
    font-size: clamp(0.8rem, 2vw, 0.9rem);
  }
}

@media (max-width: 760px) {
  .hero-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  
  .hero-image {
    order: -1;
  }
  
  .hero-image img {
    max-height: 250px;
  }
  
  .points {
    grid-template-columns: 1fr 1fr;
  }
  
  .grid-4 {
    grid-template-columns: 1fr 1fr;
  }
  
  .list-col {
    columns: 1;
  }
  
  .logo-row {
    grid-template-columns: repeat(2,1fr);
  }
  
  .form .field {
    grid-column: 1/-1;
  }
  
  .hide-mobile {
    display: none !important;
  }
}

/* ===== AUTO-ADAPTIVE ENHANCEMENTS ===== */
/* Prevent horizontal overflow */
html, body {
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  min-width: 320px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Ensure all elements respect container width */
* {
  max-width: 100%;
}

img, video, iframe, canvas {
  max-width: 100%;
  height: auto;
}

/* Flexible container for all screen sizes */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(15px, 4vw, 20px);
}

/* Auto-adaptive text scaling */
h1, h2, h3, h4, h5, h6 {
  word-wrap: break-word;
  hyphens: auto;
  word-break: keep-all;
  overflow-wrap: break-word;
}

/* Better text wrapping for mobile */
@media (max-width: 768px) {
  body, p, div, span, a, li {
    word-break: keep-all;
    overflow-wrap: break-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
  }
  
  /* Prevent breaking in the middle of words for important text */
  .hero h1, .hero p, .section-title, .card-title {
    word-break: keep-all;
    overflow-wrap: break-word;
    line-height: 1.4;
  }
  
  /* Specific fix for step titles to prevent word breaking */
  .step h3 {
    word-break: keep-all;
    overflow-wrap: break-word;
    hyphens: none;
    white-space: nowrap;
  }
  
  /* Allow wrapping only if absolutely necessary on very small screens */
  @media (max-width: 480px) {
    .step h3 {
      white-space: normal;
      word-break: keep-all;
      overflow-wrap: break-word;
    }
  }
}

/* Smooth transitions for all interactive elements */
* {
  transition: all 0.2s ease;
}

/* Touch-friendly interactive elements */
@media (max-width: 768px) {
  button, .btn, a, input, select, textarea {
    min-height: 15px;
    min-width: 15px;
  }
  
  /* Improve touch scrolling */
  * {
    -webkit-overflow-scrolling: touch;
  }
  
  /* Prevent zoom on input focus */
  input, select, textarea {
    font-size: 16px;
  }
}

/* High DPI display optimizations */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}
  
  /* Mobile Menu Styles */
  .menu-toggle {
    display: flex !important;
    margin-left: auto;
    position: relative;
    z-index: 60;
  }
  
  .nav-mobile {
    display: none !important;
  }
  
  .nav-mobile.active {
    display: block !important;
    animation: slideDown .3s ease;
  }
  
  .nav {
    height: 60px;
  }
  
  .brand img {
    height: 20px;
  }
  
  .nav-mobile ul {
    list-style: none;
    margin: 0;
    padding: 1.5rem 0;
  }
  
  .nav-mobile a {
    display: block;
    padding: 1rem 1.5rem;
    color: var(--text);
    font-weight: 600;
    border-bottom: 1px solid #f3f4f6;
    transition: all .2s ease;
    font-size: .95rem;
  }
.nav-mobile a:hover{background:var(--bg-soft);color:var(--primary)}.nav-mobile a.chip{background:rgba(11,123,217,.1);color:var(--primary);border:1px solid rgba(11,123,217,.2);margin:1rem 1.5rem;border-radius:12px;border-bottom:1px solid rgba(11,123,217,.2)}.nav-mobile a.chip:hover{background:var(--primary);color:#fff}.nav-mobile .nav-actions{flex-direction:column;gap:.8rem;padding:1.5rem;border-top:1px solid #f3f4f6}.nav-mobile .nav-actions .btn{width:100%;justify-content:center}}@media(min-width:761px){.menu-toggle{display:none!important}.nav-mobile{display:none!important}.hide-mobile{display:block!important}}

/* Hero Actions Styles */
.hero-actions {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin: 1.5rem 0;
}

/* Hide elements on desktop */
@media (min-width: 769px) {
  .hide-on-desktop {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .hero {
    padding: 1rem 1rem 0;
  }
  .hero-grid {
    flex-direction: column;
    text-align: center;
  }

  .hero-text {
    order: 1;
  }

  .hero-image {
    order: 2;
    margin-top: 2rem;
  }

  .hero-image img {
    max-width: 320px;
    margin: 0 auto;
  }

  .hero-actions {
    flex-direction: column;
    gap: 1.2rem;
    align-items: center;
  }

  .hero-actions .btn {
    width: 100%;
    max-width: 280px;
  }
}