﻿ :root { --primary-purple:#8e44ad; --light-purple:#9b59b6; --pale-lilac:#f3ecf8; --deep-text:#243042; --whatsapp:#25d366; }
html { scroll-behavior:smooth; }
body { font-family:'Nunito',sans-serif; color:var(--deep-text); background:#faf8fc; }
.navbar {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
    color: var(--primary-purple)
}
.navbar-brand img {
    height: 64px;
    width: auto;
    color: var(--primary-purple);
}
.navbar-brand {
    height: 64px;
    width: auto;
    color: var(--primary-purple); 
    font-weight:800;
}
.hero-section { background:linear-gradient(135deg,var(--primary-purple),var(--light-purple)); color:#fff; padding:96px 0 82px; }
.hero-kicker { letter-spacing:.1em; font-size:.8rem; font-weight:800; }
.hero-image { max-height:460px; object-fit:cover; }
.quick-info { background:var(--light-purple); color:#fff; }
.section-title { color:var(--primary-purple); font-weight:800; }
.bg-pale-lilac { background:var(--pale-lilac); }
.surface-card { background:#fff; border-radius:14px; box-shadow:0 8px 24px rgba(36,48,66,.08); }
.modal-trigger { text-align:left; font-weight:700; color:#3e3154; transition:transform .2s ease; }
.modal-trigger:hover { transform:translateY(-2px); }
.media-card { background:#fff; border-radius:12px; padding:12px; box-shadow:0 8px 20px rgba(36,48,66,.08); height:100%; }
.media-card img { width:100%; height:240px; object-fit:cover; cursor:zoom-in; }
.video-shell { max-width:860px; border-radius:14px; overflow:hidden; box-shadow:0 10px 30px rgba(36,48,66,.16); }
.video-shell video { width:100%; display:block; background:#111; }
.btn-whatsapp { background:var(--whatsapp); border-color:var(--whatsapp); color:#fff; }
.btn-whatsapp:hover { background:#1fb45a; border-color:#1fb45a; color:#fff; }
.social-icon { color:#fff; font-size:1.25rem; margin-right:12px; text-decoration:none; }
.social-dark { background:#2b3850; color:#fff; display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; }
.floating-whatsapp { position:fixed; right:22px; bottom:22px; width:58px; height:58px; border-radius:50%; background:var(--whatsapp); color:#fff; display:flex; align-items:center; justify-content:center; font-size:2rem; text-decoration:none; box-shadow:0 10px 20px rgba(0,0,0,.22); z-index:1100; }
.zoomable { cursor:zoom-in; }

.modal-satori .modal-content { border:0; border-radius:18px; overflow:hidden; box-shadow:0 22px 60px rgba(33,26,46,.35); }
.modal-satori .modal-header { background:linear-gradient(120deg,#8e44ad,#b06dc8); color:#fff; border-bottom:0; }
.modal-satori .modal-title { font-weight:800; letter-spacing:.02em; }
.modal-satori .btn-close { filter:invert(1); }
.modal-satori .modal-body { background:#fff; line-height:1.65; }
.modal-satori h6 { color:#6f3e87; font-weight:800; margin-top:1rem; }
.modal-satori ul li, .modal-satori ol li { margin-bottom:.35rem; }

#imageZoomModal .modal-content { background:transparent; }
#zoomedImage { max-height:85vh; margin:0 auto; display:block; box-shadow:0 14px 40px rgba(0,0,0,.4); }
footer { background:#212b39; color:#fff; }
iframe { border:0; width:100%; min-height:320px; border-radius:12px; }
@media (max-width:768px){ .hero-section{ padding:84px 0 64px; } }


.info-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border-radius: 12px;
  background: #f5f1f9;
  color: #3f2b57;
  font-weight: 800;
  letter-spacing: .01em;
  cursor: pointer;
  border: 1px solid #e2d8ec;
  transition: all .2s ease;
}
.info-badge:hover {
  background: #ece2f6;
  transform: translateY(-1px);
}
.info-badge:focus {
  outline: 2px solid #9b59b6;
  outline-offset: 2px;
}
.nivel-card {
    cursor: pointer;
    transition: .3s ease;
}

    .nivel-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 30px rgba(0,0,0,.12);
    }

.social-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    margin-right: 10px;
    color: #fff !important;
    font-size: 1.1rem;
    transition: all .25s ease;
}

    .social-icon:hover {
        transform: translateY(-3px);
        color: #fff !important;
    }

    .social-icon.facebook {
        background: #1877F2;
    }

    .social-icon.instagram {
        background: linear-gradient( 45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888 );
    }

    .social-icon.tiktok {
        background: #111;
    }