/* ===== ALTURIN · Cursos (lista, ficha e inscripción) ===== */

/* ---------- secciones por categoría ---------- */
.cat{padding:30px 0 50px}
.cat__head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:18px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.cat__head h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;display:flex;align-items:center;gap:14px}
.cat__num{font:700 .85rem var(--fh);letter-spacing:.14em;color:var(--accent);padding:.3em .7em;border-radius:8px;border:1px solid currentColor}
.cat__head p{color:var(--muted);max-width:520px;font-size:.95rem}
.cat[data-color=red]{--accent:var(--red2)}
.cat[data-color=blue]{--accent:var(--blue2)}
.cat[data-color=silver]{--accent:var(--silver)}
.cat .course-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.course__soft{position:absolute;left:16px;bottom:12px;z-index:1;font:800 1.5rem var(--fh);color:rgba(255,255,255,.88);text-shadow:0 2px 14px rgba(0,0,0,.4)}
.course__meta{display:flex;gap:14px;flex-wrap:wrap;font-size:.78rem;color:var(--silver)}
.course__meta span{display:flex;align-items:center;gap:6px}
.course__meta svg{width:14px;height:14px;fill:none;stroke:var(--red2);stroke-width:2}
.course__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:14px;border-top:1px solid var(--line)}
.course__price{font:700 1.15rem var(--fh)}
.course__price small{font:500 .78rem var(--fb);color:var(--muted);margin-left:4px}

/* ---------- ficha del curso ---------- */
.detail-hero{padding-bottom:50px}
.detail-hero .course__badge{position:static;display:inline-block;margin-bottom:16px}
.detail-hero h1{font-size:clamp(1.9rem,4vw,3.1rem)}
.detail{display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start;padding:20px 0 100px}
.cover{position:relative;aspect-ratio:16/8;border-radius:22px;overflow:hidden;border:1px solid var(--line)}
.cover img{width:100%;height:100%;object-fit:cover}
.cover__art{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:28px}
.cover__art::after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--tint) 1px,transparent 1px),linear-gradient(90deg,var(--tint) 1px,transparent 1px);background-size:28px 28px}
.cover__soft{position:relative;z-index:1;font:800 clamp(1.6rem,4vw,2.8rem) var(--fh);letter-spacing:.02em}
.cover__logo{position:absolute;z-index:1;top:22px;right:22px;width:70px;height:70px;background:url(../assets/logo-marca-256.webp) center/contain no-repeat;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}

.specs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 46px}
.spec{display:flex;gap:12px;align-items:center;padding:16px;border-radius:14px;background:var(--panel);border:1px solid var(--line)}
.spec__ico{width:40px;height:40px;flex-shrink:0;border-radius:11px;display:grid;place-items:center;background:rgba(227,38,45,.12)}
.spec__ico svg{width:20px;height:20px;fill:none;stroke:var(--red2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.spec small{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.spec b{font-size:.95rem;font-weight:600}

.block{margin-bottom:46px}
.block h2{font-size:1.6rem;font-weight:800;margin-bottom:18px;display:flex;align-items:center;gap:12px}
.block h2::before{content:"";width:6px;height:26px;border-radius:3px;background:linear-gradient(var(--red),var(--blue))}
.goals{list-style:none;display:grid;gap:10px}
.goals li{display:flex;gap:12px;padding:14px 16px;border-radius:12px;background:var(--sunk);border:1px solid var(--line);color:var(--text2)}
.goals li::before{content:"✓";flex-shrink:0;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:700;background:rgba(37,211,102,.15);color:#3ee07f}

.syllabus{display:grid;gap:10px}
.mod{border-radius:14px;border:1px solid var(--line);background:var(--panel);overflow:hidden;transition:border-color .2s}
.mod.is-open{border-color:rgba(95,160,255,.4)}
.mod__head{width:100%;display:flex;align-items:center;gap:14px;padding:16px 18px;text-align:left;font-weight:600}
.mod__n{font:700 .8rem var(--fh);color:var(--blue2);min-width:62px;letter-spacing:.06em}
.mod__head .chev{margin-left:auto;flex-shrink:0}
.mod.is-open .chev{transform:rotate(225deg) translateY(-1px)}
.mod__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s}
.mod.is-open .mod__body{grid-template-rows:1fr}
.mod__body > div{overflow:hidden}
.mod__body p{padding:0 18px 18px 94px;color:var(--muted);font-size:.92rem}

/* ---------- tarjeta de inversión ---------- */
.buy{position:sticky;top:96px;padding:28px;border-radius:22px;border:1px solid rgba(95,160,255,.3);background:linear-gradient(160deg,var(--panel2),var(--panel) 60%);box-shadow:0 30px 60px -30px rgba(47,107,255,.5)}
.buy__label{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.buy__price{font:800 2.6rem var(--fh);margin:6px 0 2px;line-height:1}
.buy__price small{font-size:1rem;color:var(--muted);font-weight:600}
.buy__usd{color:var(--silver)}
.buy__list{list-style:none;display:grid;gap:10px;margin:22px 0;padding:20px 0;border-block:1px solid var(--line)}
.buy__list li{display:flex;gap:10px;align-items:center;font-size:.93rem}
.buy__list svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:#3ee07f;stroke-width:2.2}
.buy .btn{width:100%;justify-content:center;padding:1em}
.buy__note{margin-top:14px;font-size:.8rem;color:var(--muted);text-align:center}


@media (max-width:980px){
  .detail{grid-template-columns:1fr}
  .buy{position:static}
  .specs{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:520px){
  .page-hero{padding:120px 0 50px}
  .specs{grid-template-columns:1fr}
  .mod__body p{padding-left:18px}
}
