/* =========================================================
   HOME — HERO SECTION
   Source: clean-modern-bighero.html (tokens swapped in)
   ========================================================= */

/* HERO CONTAINER */
.hero{
  position:relative;
  min-height:calc(100vh - 76px);
  display:flex;
  align-items:center;
  padding:30px 0 50px;
  overflow:hidden;
}

/* DECORATIVE BLOBS */
.blob{
  position:absolute;
  border-radius:50%;
  filter:blur(54px);
  z-index:0;
  opacity:.55;
}
.blob.b1{
  width:480px;height:480px;
  background:var(--yellow-soft);
  top:-120px;right:-60px;
  animation:drift 12s ease-in-out infinite;
}
.blob.b2{
  width:380px;height:380px;
  background:#DCE7FF;
  bottom:-160px;left:-90px;
  animation:drift 16s ease-in-out infinite reverse;
}
.blob.b3{
  width:240px;height:240px;
  background:#FFE0CC;
  top:40%;left:42%;
  opacity:.4;
  animation:drift 14s ease-in-out infinite;
}

/* GRID LAYOUT */
.hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:48px;
  align-items:center;
  width:100%;
}

/* PILL BADGE */
.pill{
  display:inline-flex;
  align-items:center;
  gap:9px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  border-radius:40px;
  padding:9px 16px;
  font-size:13.5px;
  font-weight:600;
  color:var(--muted);
}
.pill .dot{
  width:8px;height:8px;
  border-radius:50%;
  background:#2ecc71;
  box-shadow:0 0 0 4px rgba(46,204,113,.18);
  flex-shrink:0;
}

/* HERO HEADLINE — scoped so it never leaks globally */
.hero h1{
  font-size:clamp(44px,5.6vw,76px);
  line-height:1.02;
  letter-spacing:-.035em;
  font-weight:800;
  margin:22px 0;
}
.hero h1 .hl{
  position:relative;
  white-space:nowrap;
}
.hero h1 .hl:after{
  content:'';
  position:absolute;
  left:-3px;right:-3px;bottom:8px;
  height:.34em;
  background:var(--yellow);
  z-index:-1;
  border-radius:5px;
  transform:rotate(-1.2deg);
}

/* SUBTITLE */
.hero .sub{
  font-size:clamp(17px,1.5vw,20px);
  color:var(--muted);
  max-width:520px;
  margin-bottom:30px;
}

/* SEARCH BAR */
.search{
  display:flex;
  align-items:center;
  gap:10px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:10px 10px 10px 20px;
  max-width:540px;
  box-shadow:0 14px 40px rgba(27,34,51,.10);
}
.search .mag{
  font-size:19px;
  color:var(--muted);
  flex-shrink:0;
}
.search input[type="search"]{
  flex:1;
  border:none;
  outline:none;
  font-family:inherit;
  font-size:16px;
  color:var(--ink);
  background:none;
  min-width:0;
}
/* Hero-specific size override for the submit button */
.search .btn-primary{
  padding:13px 24px;
  font-size:15.5px;
  border-radius:13px;
  flex-shrink:0;
}

/* QUICK CHIPS ROW */
.quick{
  display:flex;
  gap:9px;
  margin-top:16px;
  flex-wrap:wrap;
  align-items:center;
}
.quick span{
  font-size:13.5px;
  color:var(--muted);
  font-weight:600;
}
.chip{
  font-size:13.5px;
  font-weight:600;
  background:#fff;
  border:1px solid var(--line);
  border-radius:30px;
  padding:6px 14px;
  transition:.2s;
  cursor:pointer;
  color:var(--ink);
}
.chip:hover{
  border-color:var(--orange);
  color:var(--orange);
  transform:translateY(-1px);
}

/* TRUST STRIP */
.trust{
  display:flex;
  gap:30px;
  margin-top:34px;
  align-items:center;
  color:var(--muted);
  font-size:14px;
  font-weight:600;
  flex-wrap:wrap;
}
.trust b{color:var(--ink)}
.stars{color:var(--orange);letter-spacing:2px}

/* HERO VISUAL COLUMN */
.hero-visual{
  position:relative;
  height:min(64vh,540px);
}

/* PHOTO PANEL */
.photo{
  position:absolute;
  inset:0;
  border-radius:var(--r-lg);
  overflow:hidden;
  background-image:linear-gradient(160deg,#2b3346,#171d2b);
  box-shadow:var(--shadow-lg);
}
.photo:before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 72% 18%,rgba(252,184,20,.28),transparent 55%);
}
.photo .play{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:78px;height:78px;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  display:grid;place-items:center;
  font-size:26px;
  color:var(--orange);
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  animation:floaty 5s ease-in-out infinite;
}

/* FLOATING CARDS */
.card-float{
  position:absolute;
  background:#fff;
  border-radius:18px;
  box-shadow:0 22px 50px rgba(27,34,51,.18);
  padding:16px 18px;
  animation:floaty 6.5s ease-in-out infinite;
}
.cf1{
  top:30px;left:-30px;
  display:flex;gap:13px;align-items:center;
  animation-delay:.4s;
}
.cf1 .ic{
  width:46px;height:46px;
  border-radius:12px;
  background:var(--yellow-soft);
  display:grid;place-items:center;
  font-size:22px;
  flex-shrink:0;
}
.cf1 b{font-size:16px}
.cf1 span{font-size:13px;color:var(--muted)}

.cf2{
  bottom:36px;right:-24px;
  animation-delay:1.5s;
}
.cf2 .row{display:flex;align-items:center;gap:11px}
.cf2 .av{display:flex}
.cf2 .av i{
  width:28px;height:28px;
  border-radius:50%;
  border:2px solid #fff;
  margin-left:-9px;
  display:block;
}
.cf2 .av i:first-child{margin-left:0}
.cf2 .av i:nth-child(1){background:#FFD27D}
.cf2 .av i:nth-child(2){background:#A8C7FF}
.cf2 .av i:nth-child(3){background:#B6E3C6}
.cf2 b{font-size:15px}
.cf2 span{font-size:12.5px;color:var(--muted)}

.cf3{
  top:42%;right:30px;
  background:var(--ink);
  color:#fff;
  animation-delay:1s;
  text-align:center;
}
.cf3 b{font-size:24px;display:block}
.cf3 span{font-size:12px;opacity:.8}

/* SCROLL CUE */
.scroll-cue{
  position:absolute;
  bottom:18px;left:50%;
  transform:translateX(-50%);
  z-index:2;
  font-size:12.5px;
  color:var(--muted);
  font-weight:600;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
}
.scroll-cue .m{
  width:22px;height:34px;
  border:2px solid var(--muted);
  border-radius:14px;
  position:relative;
}
.scroll-cue .m:after{
  content:'';
  position:absolute;
  top:6px;left:50%;
  transform:translateX(-50%);
  width:4px;height:7px;
  border-radius:3px;
  background:var(--muted);
  animation:floaty 1.6s ease-in-out infinite;
}

/* =========================================================
   HOME — CATEGORÍAS SECTION
   Source: clean-modern-bighero.html (tokens swapped in)
   ========================================================= */

.cats{padding:80px 0 20px}

.sec-head{text-align:center;margin-bottom:42px}
.sec-head h2{font-size:36px;font-weight:800;letter-spacing:-.025em;color:var(--ink)}
.sec-head p{color:var(--muted);font-size:17px;margin-top:8px}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

.ccard{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--r-card);
  padding:26px;
  transition:transform .25s,box-shadow .25s,border-color .25s;
  cursor:pointer;
  display:block;
  color:var(--ink);
}
.ccard:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-md);
  border-color:transparent;
}

.ccard .ic{
  width:56px;height:56px;
  border-radius:15px;
  display:grid;place-items:center;
  font-size:26px;
  margin-bottom:18px;
}
.ccard:nth-child(1) .ic{background:var(--yellow-soft)}
.ccard:nth-child(2) .ic{background:#DCE7FF}
.ccard:nth-child(3) .ic{background:#D8F3E3}

.ccard h3{font-size:20px;font-weight:700;margin-bottom:6px;color:var(--ink)}
.ccard p{font-size:14.5px;color:var(--muted);margin-bottom:16px}
.ccard .more{
  font-size:14.5px;
  font-weight:700;
  color:var(--orange);
  display:inline-flex;
  gap:6px;
  align-items:center;
  transition:gap .2s;
}
.ccard:hover .more{gap:11px}

.ccard .tag{
  font-size:12px;
  font-weight:700;
  color:var(--muted);
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:30px;
  padding:4px 11px;
  float:right;
}

@media(max-width:860px){.grid{grid-template-columns:1fr}}

/* =========================================================
   RESPONSIVE — mobile stack
   ========================================================= */
@media(max-width:900px){
  .hero-grid{
    grid-template-columns:1fr;
    gap:28px;
  }
  .hero-visual{
    height:min(60vw,420px);
  }
  .cf1{left:-10px}
  .cf2{right:-8px}
}
@media(max-width:600px){
  .search{
    flex-wrap:wrap;
    padding:12px 14px;
    gap:8px;
  }
  .search input[type="search"]{
    order:1;
    width:100%;
    flex:none;
  }
  .search .mag{order:0}
  .search .btn-primary{
    order:2;
    width:100%;
    justify-content:center;
  }
  .trust{gap:16px}
}

/* =========================================================
   HOME — CURSOS DESTACADOS (WooCommerce)
   ========================================================= */
.featured{padding:70px 0 10px}
.course-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.course-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;transition:transform .25s,box-shadow .25s}
.course-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.cc-img img{aspect-ratio:4/3;object-fit:cover;width:100%}
.cc-body{padding:18px}
.cc-body h3{font-size:17px;font-weight:700;margin-bottom:8px}
.cc-price{color:var(--orange);font-weight:800;margin-bottom:10px}
.course-card .more{font-size:14px;font-weight:700;color:var(--ink)}
@media(max-width:980px){.course-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.course-grid{grid-template-columns:1fr}}

/* =========================================================
   HOME — BANDA FUNDAE (B2B)
   Source: clean-modern.html (tokens swapped in)
   ========================================================= */
.b2b{margin:60px 0;padding:0 28px}
.b2b-inner{max-width:1120px;margin:0 auto;background:linear-gradient(120deg,var(--ink),#26304a);border-radius:26px;padding:46px 48px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;overflow:hidden}
.b2b-inner:before{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(252,184,20,.3),transparent 70%);top:-100px;right:-40px}
.b2b-inner h2{font-size:30px;font-weight:800;letter-spacing:-.02em;position:relative}
.b2b-inner p{color:#B9C0D0;font-size:15.5px;margin-top:8px;max-width:440px;position:relative}
.b2b .badge{display:inline-block;background:var(--yellow);color:var(--ink);font-weight:800;font-size:12.5px;padding:5px 12px;border-radius:30px;margin-bottom:14px}
.b2b-inner .btn-primary{position:relative;white-space:nowrap}
.btn-lg{padding:15px 26px;font-size:16px;border-radius:14px}
@media(max-width:760px){.b2b-inner{flex-direction:column;align-items:flex-start;text-align:left}}

/* =========================================================
   HOME — PRÓXIMAS CONVOCATORIAS (The Events Calendar)
   ========================================================= */
.events{padding:70px 0 10px}
.ev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ev-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:22px;transition:transform .25s,box-shadow .25s}
.ev-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.ev-date{display:inline-block;background:var(--yellow-soft);color:var(--ink);font-weight:800;font-size:13px;border-radius:30px;padding:5px 12px;margin-bottom:12px}
.ev-card h3{font-size:18px;font-weight:700;margin-bottom:10px}
@media(max-width:860px){.ev-grid{grid-template-columns:1fr}}