/* assets/css/style.css */
:root{
  --brand: #2C7A75;
  --brand-2: #E06448;
  --brand-3: #D9A047;

  --ink: #0f172a;
  --muted: #475569;
  --soft: #f1f5f9;
  --card: #ffffff;

  --radius-xl: 22px;
  --radius-lg: 16px;
  --shadow: 0 18px 50px rgba(2, 6, 23, .10);
  --shadow-soft: 0 10px 28px rgba(2, 6, 23, .08);

  --font-title: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{ font-family: var(--font-body); color: var(--ink); background: #fff; overflow-x: hidden;}
a{ text-decoration: none; }
img{ max-width: 100%; display: block; }
.skip-link{ position: absolute; left: -9999px; top: 10px; background: var(--ink); color: #fff; padding: 10px 12px; border-radius: 10px; z-index: 9999; }
.skip-link:focus{ left: 10px; }

/* TOPBAR */
.topbar{ background: linear-gradient(90deg, rgba(44,122,117,1), rgba(44,122,117,.85)); color: rgba(255,255,255,.92); font-size: 14px; }
.topbar-inner{ display:flex; align-items:center; justify-content:space-between; gap: 12px; padding: 10px 0; }
.topbar-badge{ display:inline-flex; align-items:center; gap: 10px; padding: 6px 10px;  border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.14);}
.topbar-right{ display:flex; align-items:center; gap: 14px; }
.topbar-text { display: flex; flex-direction: column; gap: 4px; line-height: 1.2; }
.topbar-line-1 { font-size: 0.85rem; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;}
.topbar-line-2 { font-size: 0.8rem; opacity: 0.9; }
.topbar-line-3 { font-size: 0.85rem; font-weight: 600; }
.topbar-line-3 strong { color: #30FF00; }
.topbar-text{ display: inline; white-space: nowrap; }
.social{ display:flex; gap: 10px; }
.social-link{ width: 34px; height: 34px; display:grid; place-items:center; border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.14); color: #fff; transition: transform .2s ease, background .2s ease; }
.social-link:hover{ transform: translateY(-2px); background: rgba(255,255,255,.18); }
.btn-student { font-family: var(--font-title); background: linear-gradient(135deg, #EB6852, #E64022); border: 0; color: #fff; position: relative; overflow: hidden; border-radius: 30px; font-weight: 700; padding: 10px 14px; letter-spacing: 0.02em; cursor: pointer; text-decoration: none; transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease; }
.btn-student::before { content: ""; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; background: linear-gradient( 120deg, transparent, rgba(255, 255, 255, 0.45), transparent); transform: skewX(-25deg);}
.btn-student:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(255, 94, 3, 0.35); color: #fff; }
.btn-student:hover::before { animation: btn-student-shine 0.9s ease forwards; }
@keyframes btn-student-shine { from { left: -75%;} to { left: 125%; }}
.site-header{ position: sticky; top: 0; z-index: 1030; background: rgba(255,255,255,.75); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(15, 23, 42, .06); transition: box-shadow .25s ease, background .25s ease; }
.site-header.is-scrolled{ background: rgba(255,255,255,1); box-shadow: var(--shadow-soft); }
.navbar{ padding: 5px 0; }
.navbar-brand{ font-family: var(--font-title); color: var(--ink);}
.nav-link{ font-weight: 600; color: rgba(15,23,42,.78); padding: 10px 10px !important; border-radius: 12px; transition: background .2s ease, color .2s ease, transform .2s ease; }
.nav-link:hover{ color: var(--brand); background: rgba(44,122,117,.08); }
.nav-link.active{ color: var(--brand); background: rgba(44,122,117,.10); }
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show { color: var(--brand); }
.dropdown-menu{ border: 1px solid rgba(15, 23, 42, .08); border-radius: 16px; box-shadow: var(--shadow-soft); padding: 8px; }
.dropdown-item{ border-radius: 12px; padding: 10px 12px; font-weight: 600; }
.dropdown-item:hover{ background: rgba(44,122,117,.10); color: var(--brand); }
.btn-primary{ --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: #256a66; --bs-btn-hover-border-color: #256a66; --bs-btn-active-bg: #1f5b57; --bs-btn-active-border-color: #1f5b57; border-radius: 999px; font-weight: 700; background-image: linear-gradient(135deg, #2C7A75 0%, #2F8F88 65%); background-color: transparent; border: 0; position: relative; overflow: hidden; }
.btn-primary::after{ content: ""; position: absolute; inset: -2px; background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.18) 35%, rgba(255,255,255,.45) 50%, rgba(255,255,255,.18) 65%, transparent 100%); transform: translateX(-120%) skewX(-18deg); opacity: 0; pointer-events: none;}
.btn-primary:hover::after{  opacity: 1; animation: btn-shine 0.9s ease;}

/* animação */
@keyframes btn-shine{ 0%{ transform: translateX(-120%) skewX(-18deg);} 100%{ transform: translateX(120%) skewX(-18deg); }}
.btn-cta{ box-shadow: 0 12px 26px rgba(44,122,117,.22); padding-left: 20px; padding-right: 20px; }

/* HOME */
.hero{ position: relative; padding: 12px 0 0px; overflow: hidden;  background: radial-gradient(circle at 15% 25%, rgba(44,122,117,.20), transparent 55%), radial-gradient(circle at 85% 30%, rgba(224,100,72,.16), transparent 55%), radial-gradient(circle at 55% 85%, rgba(217,160,71,.14), transparent 55%); }
.hero-kicker{ display:inline-flex; align-items:center; gap:10px; font-weight: 800; font-size: 13px; letter-spacing: .4px; text-transform: uppercase; color: rgba(44,122,117,.95); background: rgba(44,122,117,.08); border: 1px solid rgba(44,122,117,.16); padding: 8px 12px; border-radius: 999px; }
.kicker-dot{ width: 10px; height: 10px; border-radius: 99px; background: var(--brand-2); box-shadow: 0 0 0 6px rgba(224,100,72,.18); }
.hero-title{ font-family: var(--font-title); font-weight: 800; letter-spacing: -0.03em; line-height: 1.08; font-size: clamp(2rem, 3.2vw, 3.25rem); margin: 28px 0 28px;}
.text-accent{ background: linear-gradient( 90deg, #2C7A75 0%, #2FBF8F 35%, #1F9E7A 70%, #2C7A75 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.hero-subtitle{ color: rgba(71,85,105,.95); font-size: 1.05rem; line-height: 1.7; max-width: 54ch; }
.hero-actions{ margin-top: 38px; margin-bottom: 48px; display:flex; gap: 12px; flex-wrap: wrap; }
.btn-hero{ padding: 14px 18px;}
.btn-hero-outline{ padding: 14px 18px; }
.hero-trust{ display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px;}
.trust-item{ display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 13px; background: rgba(255,255,255,.35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.45); border-radius: 999px; color: rgba(15,23,42,.85); }
.trust-item i{ color: #2FBF8F; }
.btn-hero-main{ padding: 14px 18px; background-image: linear-gradient(135deg, #2FBF8F 0%, #2C7A75 75%, #1F5B57 100%); border: none; box-shadow: 0 18px 40px rgba(44,122,117,.35); margin-bomttom: 30px;}
.btn-hero-main:hover{ background-image: linear-gradient( 135deg, #34D399 0%, #2FBF8F 50%, #256A66 100%);}

@keyframes floaty{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-10px); }
}

/* SECTIONS */
.section{ padding: 72px 0; }
.section-head{ margin-bottom: 18px; }
.section-title{ font-family: var(--font-title); font-weight: 800; letter-spacing: -0.02em; font-size: clamp(1.6rem, 2.2vw, 2.25rem);}
.section-subtitle{ color: rgba(71,85,105,.95); max-width: 70ch; margin: 0 auto; line-height: 1.75; }
.problem{  background: linear-gradient(180deg, rgba(241,245,249,.7), rgba(255,255,255,1)); padding-top: 100px; padding-bottom: 100px; }
.card-soft{  height: 100%; background: #fff; border-radius: var(--radius-lg); border: 1px solid rgba(15,23,42,.08); box-shadow: var(--shadow-soft); padding: 18px; transition: transform .2s ease, box-shadow .2s ease; }
.card-soft:hover{ transform: translateY(-4px); box-shadow: var(--shadow);}
.icon-soft{ width: 44px; height: 44px; border-radius: 14px; display:grid; place-items:center; background: rgba(44,122,117,.10); color: var(--brand); margin-bottom: 12px; }
.section-dark{ position: relative; background: radial-gradient(circle at 15% 20%, rgba(47,191,143,.25), transparent 55%), radial-gradient(circle at 85% 30%, rgba(44,122,117,.35), transparent 60%), linear-gradient(180deg, #1F5B57 0%, #163E3B 100%); color: #fff;}
.text-light{ color: #ffffff; }
.text-light-70{ color: rgba(255,255,255,.75); }

/* BENEFÍCIOS */
.section-benefits{ position: relative; overflow: hidden; color: #fff; padding-top: 100px; padding-bottom: 100px; }
.section-benefits .benefits-bg{ position: absolute; inset: -12%; z-index: 0; background: radial-gradient(circle at 18% 22%, rgba(79,209,197,.42), transparent 52%), radial-gradient(circle at 82% 28%, rgba(52,211,153,.38), transparent 55%), radial-gradient(circle at 45% 85%, rgba(44,122,117,.42), transparent 58%), linear-gradient(180deg, #2B7E78 0%, #1B4F4B 100%); background-size: 140% 140%; animation: benefitsGlow 7.5s ease-in-out infinite alternate; transform: translateZ(0); filter: saturate(1.12) brightness(1.03); opacity: 1; }
.section-benefits::after{ content:""; position:absolute; inset:0; z-index:0; background: radial-gradient(circle at 50% 20%, rgba(255,255,255,.08), transparent 55%); pointer-events:none; }
.section-benefits .container{ position: relative; z-index: 1; }
.text-light-80{ color: rgba(255,255,255,.86); max-width: 820px; }

@keyframes benefitsGlow{
  0%{ background-position: 10% 0%; transform: scale(1.00) rotate(0deg); filter: saturate(1.05) brightness(1.02); }
  100%{ background-position: 90% 100%; transform: scale(1.06) rotate(0.6deg); filter: saturate(1.20) brightness(1.10); }
}

.benefit-card{ height: 100%; display: flex; gap: 16px; padding: 18px 18px; background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.08)), radial-gradient(circle at 30% 20%, rgba(79,209,197,.18), transparent 55%); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.20); border-radius: 18px; box-shadow: 0 18px 40px rgba(2,6,23,.28), 0 0 0 1px rgba(255,255,255,.06) inset; position: relative; overflow: hidden; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.benefit-card::after{ content:""; position:absolute; inset: -2px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent); transform: translateX(-120%) skewX(-18deg); opacity: 0; pointer-events:none;}
.benefit-card:hover{ transform: translateY(-3px); border-color: rgba(255,255,255,.28); box-shadow: 0 22px 52px rgba(2,6,23,.34), 0 0 0 1px rgba(255,255,255,.08) inset; }
.benefit-card:hover::after{ opacity: 1; animation: cardShine .85s ease;}

@keyframes cardShine{
  0%{ transform: translateX(-120%) skewX(-18deg); }
  100%{ transform: translateX(120%) skewX(-18deg); }
}

.benefit-icon{ min-width: 56px; height: 56px; border-radius: 18px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #34D399 0%, #2C7A75 55%, #1F5B57 100%); box-shadow: 0 10px 26px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.18); }
.benefit-icon i{  color: #ffffff; font-size: 22px; line-height: 1; }
.benefit-card:hover .benefit-icon{ transform: scale(1.06); transition: transform .25s ease; }
.benefit-text strong{ display: block; font-weight: 800; font-size: 18px; color: #fff; line-height: 1.15; letter-spacing: -0.01em; }
.benefit-text span{ display: block; margin-top: 6px; font-size: 15.5px;  color: rgba(255,255,255,.82); line-height: 1.45; }
.benefits-cta .btn{ padding: 12px 22px; }

/* ===== FAQ (NOVO ESTILO) ===== */
.section-faq{ position: relative; overflow: hidden; padding-top: 100px; padding-bottom: 100px;}
.section-faq .faq-bg{ position: absolute; inset: 0; z-index: 0; background: radial-gradient(circle at 10% 20%, rgba(44,122,117,.10), transparent 55%), radial-gradient(circle at 85% 25%, rgba(52,211,153,.10), transparent 55%),   linear-gradient(180deg, #ffffff 0%, #f6fbfa 100%); }
.section-faq .container{ position: relative; z-index: 1; }
.faq-head{ margin-bottom: 10px;}
.faq-title{ font-family: var(--font-title, "Poppins", sans-serif);  font-weight: 800; letter-spacing: -0.02em; color: rgba(15,23,42,.90); margin: 0;}
.faq-subtitle{  margin: 10px auto 0;  max-width: 860px;  color: rgba(15,23,42,.68);  font-size: 16px;  line-height: 1.55;}
.faq-stack{  display: grid; gap: 12px;}
.faq-item{  border-radius: 18px;  background: rgba(255,255,255,.65);  border: 1px solid rgba(15,23,42,.08);  box-shadow: 0 14px 30px rgba(2,6,23,.06);  overflow: hidden;}
.faq-q{ width: 100%; border: 0; background: transparent; padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; gap: 14px; text-align: left;  font-weight: 800; color: rgba(15,23,42,.88); letter-spacing: -0.01em; }
.faq-q i{  color: rgba(44,122,117,.95); transition: transform .2s ease; }
.faq-q[aria-expanded="true"] i{  transform: rotate(180deg);}
.faq-a{  padding: 0 18px 16px 18px;  color: rgba(15,23,42,.70); line-height: 1.6; font-size: 15px;}
.faq-cta .faq-note{  color: rgba(15,23,42,.62);  font-size: 14px;}

/* ===== Depoimentos WhatsApp (NOVO ESTILO) ===== */
.section-testimonials{ background: #fff; padding-top: 100px; padding-bottom: 100px }
.testi-head{ margin-bottom: 10px;}
.testi-title{ font-family: var(--font-title, "Poppins", sans-serif); font-weight: 800; letter-spacing: -0.02em;  color: rgba(15,23,42,.92); margin: 0; }
.testi-subtitle{  margin: 10px auto 0; max-width: 860px; color: rgba(15,23,42,.68); font-size: 16px; line-height: 1.55; }
.testi-wrap{ position: relative; margin-top: 18px;}
.wa-card{ height: 100%; border-radius: 22px; border: 1px solid rgba(15,23,42,.10); box-shadow: 0 16px 34px rgba(2,6,23,.08); overflow: hidden; background: #fff; }
.wa-top{ display: flex; align-items: center; gap: 12px;  padding: 14px 14px 12px 14px; border-bottom: 1px solid rgba(15,23,42,.08); background: linear-gradient(180deg, rgba(44,122,117,.08), rgba(44,122,117,.03)); }
.wa-avatar{  width: 40px; height: 40px;  border-radius: 999px;  display: grid; place-items: center;  font-weight: 800; color: #fff; background: linear-gradient(135deg, #2C7A75, #34D399); letter-spacing: .02em; }
.wa-meta{ display: flex;  flex-direction: column; line-height: 1.15;}
.wa-meta strong{  color: rgba(15,23,42,.92);  font-size: 14px;}
.wa-meta span{  color: rgba(15,23,42,.55);  font-size: 12.5px;}
.wa-badge{  margin-left: auto;  font-size: 12px;  color: rgba(15,23,42,.55);  display: inline-flex;  align-items: center;  gap: 6px;}
.wa-chat{ padding: 14px; background:   radial-gradient(circle at 15% 20%, rgba(217,160,71,.10), transparent 55%),   radial-gradient(circle at 85% 30%, rgba(44,122,117,.10), transparent 55%),   linear-gradient(180deg, #f7fbfa 0%, #ffffff 100%); min-height: 280px;}
.wa-bubble{ max-width: 92%; padding: 10px 12px; border-radius: 14px; position: relative; margin: 8px 0; font-size: 14px; line-height: 1.35; color: rgba(15,23,42,.86); box-shadow: 0 10px 18px rgba(2,6,23,.06); }
.wa-in{  background: #fff; border: 1px solid rgba(15,23,42,.10);}
.wa-out{  margin-left: auto;  background: rgba(44,122,117,.12);  border: 1px solid rgba(44,122,117,.18); }
.wa-time{  display: block;  text-align: right;  margin-top: 6px;  font-size: 11px;   color: rgba(15,23,42,.48); }
.testi-nav{  display: flex;  justify-content: center;  gap: 10px;  margin-top: 14px;}
.testi-btn{  width: 44px;  height: 44px;  border-radius: 999px;  border: 1px solid rgba(15,23,42,.12);  background: rgba(255,255,255,.70);  box-shadow: 0 12px 22px rgba(2,6,23,.08); display: grid;  place-items: center; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.testi-btn:hover{  transform: translateY(-2px);  border-color: rgba(44,122,117,.35);  box-shadow: 0 16px 26px rgba(2,6,23,.10); }
.testi-pagination{  margin-top: 14px; }
.testi-pagination .swiper-pagination-bullet{  width: 8px;  height: 8px;  opacity: .35; }
.testi-pagination .swiper-pagination-bullet-active{  opacity: 1;}


/* SOBRE */
.about-simple{ background: #fff;}
.about-content{  max-width: 520px;}
.about-eyebrow{  display: inline-block;  margin-bottom: 10px;  font-weight: 700;  font-size: 13px;  letter-spacing: .08em;  text-transform: uppercase;  color: #2C7A75;}
.about-content .section-title{  margin-bottom: 16px;}
.about-content p{  color: rgba(15,23,42,.72);  line-height: 1.65;  margin-bottom: 14px;  font-size: 16px;}
.about-image{  border-radius: 18px;  overflow: hidden;  box-shadow: 0 18px 40px rgba(2,6,23,.18);}
.about-image img{  width: 100%;  height: 480px;  object-fit: cover;  display: block;}

/* ===== FOOTER (4 colunas + newsletter vertical) ===== */
.site-footer{ position: relative; overflow: hidden; color: rgba(255,255,255,.86); background: #1D6C67; }
.site-footer .footer-bg{ position: absolute; inset: 0; pointer-events: none; opacity: .85; background: radial-gradient(circle at 10% 85%, rgba(217,160,71,.12), transparent 55%), radial-gradient(circle at 90% 80%, rgba(52,211,153,.12), transparent 60%);}
.site-footer .container{ position: relative; z-index: 1; }
.footer-grid{  padding: 44px 0 18px;  display: grid;  gap: 22px;  grid-template-columns: 1.6fr 1fr 1.15fr 1.1fr;  align-items: start; }
.footer-title{  margin: 0 0 12px;  font-size: 16px;  letter-spacing: .08em;  text-transform: uppercase;  font-weight: 900;  color: rgba(255,255,255,.92); }
.footer-text{  margin: 0 0 12px;  color: rgba(255,255,255,.72);  line-height: 1.65;  font-size: 15px; }
.footer-mini{  display: flex;  gap: 10px;  flex-wrap: wrap;  margin-top: 10px;}
.footer-tag{  display: inline-flex;  align-items: center;  gap: 8px;  padding: 8px 12px;  border-radius: 999px;  background: rgba(255,255,255,.07);  border: 1px solid rgba(255,255,255,.12);  color: rgba(255,255,255,.74);  font-weight: 800;  font-size: 12.5px;}
.footer-tag i{  color: rgba(52,211,153,.95);}
.footer-links{  list-style: none;  padding: 0;  margin: 0;  display: grid;  gap: 9px;}
.footer-links a{  color: rgba(255,255,255,.74);  text-decoration: none;  transition: color .2s ease, transform .2s ease;}
.footer-links a:hover{  color: rgba(52,211,153,.96);  transform: translateX(2px);}
.footer-contact{  list-style: none;  padding: 0;  margin: 0 0 14px;  display: grid;  gap: 10px;}
.footer-contact li{  display: flex;  gap: 10px;  align-items: center;  color: rgba(255,255,255,.74);  font-size: 14px; }
.footer-contact i{  width: 18px;  color: rgba(52,211,153,.92);}
.footer-contact a{  color: rgba(255,255,255,.82);  text-decoration: none; }
.footer-contact a:hover{  color: rgba(52,211,153,.96);}
.footer-social{  display: flex;  gap: 10px;  flex-wrap: wrap;}
.footer-social-link{  width: 40px;  height: 40px;  border-radius: 999px;  display: grid;  place-items: center;  color: rgba(255,255,255,.92);  border: 1px solid rgba(255,255,255,.16);  background: rgba(255,255,255,.07);  backdrop-filter: blur(10px);  -webkit-backdrop-filter: blur(10px);  transition: transform .2s ease, border-color .2s ease, background .2s ease;}
.footer-social-link:hover{  transform: translateY(-2px);  border-color: rgba(52,211,153,.32);  background: rgba(255,255,255,.10);}
.newsletter-box{  border-radius: 22px;  padding: 18px 16px 16px;  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.06));  border: 1px solid rgba(255,255,255,.14);  box-shadow: 0 18px 44px rgba(0,0,0,.28);  backdrop-filter: blur(10px);  -webkit-backdrop-filter: blur(10px);  position: relative;  overflow: hidden;}
.newsletter-box::before{  content:"";  position:absolute;  inset:-2px;  background:    radial-gradient(circle at 20% 10%, rgba(52,211,153,.22), transparent 55%),    radial-gradient(circle at 85% 25%, rgba(217,160,71,.12), transparent 60%);  pointer-events:none;  opacity:.85;}
.newsletter-box > *{ position: relative; z-index: 1; }
.newsletter-title{  margin: 0 0 6px;  font-weight: 900;  letter-spacing: .06em;  text-transform: uppercase;  font-size: 16px;  color: rgba(255,255,255,.92);}
.newsletter-subtitle{  margin: 0 0 12px;  color: rgba(255,255,255,.72);  line-height: 1.5;  font-size: 14px;}
.newsletter-form{  display: grid;  gap: 10px;}
.nl-input{  height: 46px;  border-radius: 14px;  padding: 0 14px;  border: 1px solid rgba(255,255,255,.16);  background: rgba(8,20,18,.38);  color: rgba(255,255,255,.92);  outline: none;  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;}
.nl-input::placeholder{  color: rgba(255,255,255,.55);}
.nl-input:focus{  border-color: rgba(52,211,153,.40);  box-shadow: 0 0 0 6px rgba(44,122,117,.20);  background: rgba(8,20,18,.52);}
.nl-btn{  height: 46px;  border: 0;  border-radius: 14px;  padding: 0 14px;  font-weight: 900;  color: #06201c;  background: linear-gradient(135deg, #34D399 0%, #2C7A75 60%, #34D399 100%);  box-shadow: 0 18px 32px rgba(44,122,117,.28);  position: relative;  overflow: hidden;  transition: transform .2s ease, box-shadow .2s ease;}
.nl-btn::after{  content:"";  position:absolute;  inset:-40%;  background: linear-gradient(120deg, transparent 40%, rgba(255,255,255,.38) 50%, transparent 60%);  transform: translateX(-85%) rotate(12deg);  transition: transform .65s ease;}
.nl-btn:hover{  transform: translateY(-2px);  box-shadow: 0 22px 44px rgba(44,122,117,.34);}
.nl-btn:hover::after{  transform: translateX(70%) rotate(12deg);}
.newsletter-note{  margin-top: 10px;  display: flex;  gap: 10px;  align-items: center;  color: rgba(255,255,255,.68);  font-size: 13px;}
.newsletter-note i{  color: rgba(52,211,153,.90);}
.footer-bottom{  padding: 14px 0 18px;  border-top: 1px solid rgba(255,255,255,.10);  display: flex;  align-items: center;  justify-content: space-between;  gap: 10px;  flex-wrap: wrap;}
.footer-copy{  color: rgba(255,255,255,.72);  font-size: 14px;}
.footer-legal{  display: flex;  align-items: center;  gap: 10px;  color: rgba(255,255,255,.65);  font-size: 14px;}
.footer-legal a{  color: rgba(255,255,255,.72);  text-decoration: none;  transition: color .2s ease;}
.footer-legal a:hover{  color: rgba(52,211,153,.95); }
.footer-legal .dot{  opacity: .55;}

.backtop{  position: fixed;  right: 18px;  bottom: 18px;  width: 46px;  height: 46px;  border-radius: 18px;  border: 1px solid rgba(15,23,42,.10);  background: rgba(255,255,255,.92);  box-shadow: var(--shadow-soft);  display:grid;  place-items:center;  color: var(--brand);  opacity: 0;  transform: translateY(10px);  pointer-events: none; transition: opacity .2s ease, transform .2s ease;  z-index: 1050;}
.backtop.is-visible{  opacity: 1;  transform: translateY(0);  pointer-events: auto;}

/* ANIMATIONS (Intersection Observer) */
[data-animate]{
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .7s ease, transform .7s ease;
  will-change: opacity, transform;
}
.is-inview{
  opacity: 1 !important;
  transform: translateY(0) !important;
}
@media (prefers-reduced-motion: reduce){
  [data-animate]{  opacity: 1;  transform: none;  transition: none; }
  .badge-1, .badge-2{ animation: none; }
}

@media (min-width: 992px) {
  .navbar .dropdown:hover > .dropdown-menu { display: block; opacity: 1; visibility: visible; transform: translateY(0); }
  .navbar .dropdown-menu { display: block;  opacity: 0; visibility: hidden; transform: translateY(8px); transition:  opacity .2s ease, transform .2s ease, visibility .2s ease; margin-top: 10px;}
  .navbar .dropdown-toggle::after { transition: transform .2s ease; }
  .navbar .dropdown:hover .dropdown-toggle::after {  transform: rotate(180deg); }
  
}

/* RESPONSIVE */
@media (max-width: 991.98px){  
  .navbar{  padding: 10px 0; }
  .course-card{ grid-template-columns: 1fr; }
  .media-mini{  grid-template-columns: 1fr; }
  .mockup img, .course-thumb img, .about-visual img, .media-stack img{ height: 320px;}
  .about-image img{ height: 360px; }
  .footer-grid{    grid-template-columns: 1fr;  }
}
@media (max-width: 575.98px){
  .topbar{ gap: 0px; display: none;}
  .hero{ padding-top: 32px; }
  .trust-item{ width: 100%; justify-content: center; }
  .nav-student{   margin-top: 10px; }
  .hero-visual{ display: none;}
  .hero-title, .hero-subtitle{ text-align: center;}
  .hero-kicker{ width: 100%; text-align: center;}
  .section-benefits{ position: relative; overflow: hidden; color: #fff; padding-top: 60px; padding-bottom: 60px; }
  .problem{ padding-top: 60px; padding-bottom: 60px; }
  .section-testimonials{ background: #fff; padding-top: 60px; padding-bottom: 60px }
  .section-faq{  padding-top: 60px; padding-bottom: 60px;}
  .footer-bottom {    flex-direction: column;    text-align: center;    gap: 8px;  }
  .footer-copy, .footer-legal {  justify-content: center; }
  .footer-legal {  flex-wrap: wrap; }
}