/* ============================================================
   MOVEO COACH · Guía "Cómo funciona" (coach + alumno) — wrapper de página
   Todo bajo .mv-guia (no choca). Requiere ADEMÁS:
     · como-funciona.css  (estilos del pin / bloque 1, clases .mv-howto)
     · reputacion-alumno.css (estilos de las fichas, clases .mv-rep)
   ============================================================ */
.mv-guia, .mv-guia *{ box-sizing:border-box; }
.mv-guia{
  --sand:#F2EBDE; --sand-2:#E8DFCC; --paper:#F7F2E9; --sand-3:#D8CDB6;
  --ink:#1A1A1A; --espresso:#3F352B; --taupe:#A89B85; --olive:#6B6A4E; --rule:#C9BFAD;
  --gold:#B8924A; --blue:#6f8fae; --green:#4a8a5a; --red:#a3372b;
  --serif:'Cormorant Garamond',Garamond,serif; --sans:'Jost','Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono',monospace; --ease:cubic-bezier(.22,1,.36,1);
  font-family:var(--sans); font-weight:300; color:var(--espresso); -webkit-font-smoothing:antialiased;
  max-width:960px; margin:0 auto;
}

/* cabecera */
.mv-guia__hd{ margin-bottom:4px; }
.mv-guia__eyebrow{ font-family:var(--mono); font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--olive); }
.mv-guia h1{ font-family:var(--serif); font-weight:400; color:var(--ink); font-size:clamp(1.7rem,3.4vw,2.4rem); margin:.2em 0 0; line-height:1.04; }
.mv-guia__lede{ color:var(--olive); max-width:64ch; margin:8px 0 0; font-size:15px; }

/* secciones */
.mv-guia__sec{ margin-top:30px; }
.mv-guia__sec + .mv-guia__sec{ padding-top:30px; border-top:1px solid var(--rule); }
.mv-guia__sectitle{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin:0 0 6px; }
.mv-guia__sectitle h2{ font-family:var(--serif); font-weight:500; color:var(--ink); font-size:clamp(1.4rem,2.6vw,1.85rem); margin:0; line-height:1.05; }
.mv-guia__kicker{ font-family:var(--mono); font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold); border-radius:999px; padding:3px 9px; }

/* tarjetas reputación */
.mv-guia__grid{ display:grid; gap:18px; grid-template-columns:1fr; margin-top:16px; align-items:start; }
@media(min-width:780px){ .mv-guia__grid.two{ grid-template-columns:1fr 1fr; } }
.mv-guia__card{ background:var(--paper); border:1px solid var(--rule); border-radius:20px; padding:22px; box-shadow:0 30px 60px -48px rgba(26,26,26,.5); }
.mv-guia__card h3{ font-family:var(--serif); font-weight:500; color:var(--ink); font-size:1.3rem; margin:0 0 3px; }
.mv-guia__card .sub{ font-size:12.5px; color:var(--olive); margin:0 0 16px; }

/* mini-formulario ilustrativo */
.mv-guia__field{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:9px; }
.mv-guia__field label{ font-size:14px; }
.mv-guia select{ font-family:var(--sans); font-size:14px; border:1px solid var(--rule); border-radius:8px; padding:6px 10px; background:var(--paper); color:var(--ink); }
.mv-guia__flags{ display:flex; gap:14px; flex-wrap:wrap; margin:10px 0 14px; }
.mv-guia__flags label{ font-size:13px; display:flex; align-items:center; gap:6px; color:var(--red); }
.mv-guia__btn{ font-family:var(--sans); font-size:14px; border:1px solid var(--ink); background:var(--ink); color:var(--sand); border-radius:10px; padding:9px 14px; cursor:default; opacity:.55; }
.mv-guia__accept{ display:flex; gap:8px; margin-top:14px; }
.mv-guia__accept button{ font-family:var(--sans); font-size:14px; background:transparent; border-radius:10px; padding:9px 16px; cursor:default; }
.mv-guia__accept .a{ border:1px solid var(--green); color:var(--green); }
.mv-guia__accept .d{ border:1px solid var(--red); color:var(--red); }
.mv-guia__hint{ font-family:var(--mono); font-size:9px; letter-spacing:.04em; color:var(--taupe); margin:12px 0 0; }

/* lista de puntos */
.mv-guia__list{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.mv-guia__list li{ font-size:13.5px; color:var(--espresso); padding-left:20px; position:relative; line-height:1.4; }
.mv-guia__list li::before{ content:""; position:absolute; left:2px; top:7px; width:7px; height:7px; border-radius:50%; background:var(--gold); }
.mv-guia__note{ font-family:var(--mono); font-size:9px; line-height:1.7; letter-spacing:.03em; color:var(--taupe); margin:16px 0 0; padding-top:12px; border-top:1px solid var(--rule); }

/* el bloque 1 (pin) usa .mv-howto; reseteamos su margen superior dentro de la guía */
.mv-guia .mv-howto h2{ margin-top:.1em; }