/* VOXEO · página del método */

.mhero{background:linear-gradient(180deg,var(--paper) 0%,var(--paper) 62%,var(--white) 100%);
  padding-block:clamp(40px,5vw,76px) clamp(44px,5vw,72px)}
.mhero h1{margin-top:18px;font-size:clamp(34px,4.6vw,62px);max-width:15ch}
.mhero .ver{margin-top:18px;font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;color:var(--ink-4)}

/* la tesis, como cita grande */
.thesis{margin-top:clamp(30px,4vw,52px);border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);
  padding:clamp(26px,3.4vw,44px) 0}
.thesis p{font-family:var(--serif);font-size:clamp(20px,2.3vw,31px);line-height:1.32;letter-spacing:-.02em;
  max-width:34ch;font-weight:600}
.thesis p em{font-style:normal;color:var(--ai)}
.thesis .who{margin-top:24px;font-family:var(--sans);font-weight:400;font-size:15.5px;color:var(--ink-3);max-width:62ch;line-height:1.6;letter-spacing:0}

/* índice pegajoso */
.mwrap{display:grid;grid-template-columns:210px minmax(0,1fr);gap:clamp(28px,4vw,72px);align-items:start}
.toc{position:sticky;top:92px;font-size:13.5px;line-height:1.45}
.toc b{display:block;font:700 11px var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--ink-4);
  margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
.toc a{display:block;padding:7px 0;color:var(--ink-3);text-decoration:none;border-left:2px solid transparent;
  padding-left:12px;margin-left:-14px;transition:color .18s,border-color .18s}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--ai);border-left-color:var(--ai);font-weight:600}
@media (max-width:1040px){.mwrap{grid-template-columns:1fr}.toc{display:none}}

.msec{padding-block:clamp(40px,5vw,72px);border-top:1px solid var(--rule)}
.msec:first-child{border-top:0;padding-top:0}
.msec h2{font-size:clamp(26px,3.1vw,42px);max-width:20ch}
.msec > p{margin-top:18px;font-size:17px;line-height:1.65;color:var(--ink-3);max-width:64ch}
.msec > p + p{margin-top:15px}
.msec p b{color:var(--ink);font-weight:600}

/* los dos mundos del problema */
.worlds{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,3.6vw,58px);margin-top:34px;border-top:1px solid var(--ink)}
.worlds div{padding:24px 0 22px}
.worlds h4{font-size:20px;margin-bottom:10px}
.worlds p{font-size:15.5px;line-height:1.6;color:var(--ink-3)}
.worlds .tag{font:700 11px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--hot);margin-bottom:12px;display:block}
@media (max-width:820px){.worlds{grid-template-columns:1fr;gap:0}
 .worlds div{border-bottom:1px solid var(--rule);padding:22px 0}
 .worlds div:last-child{border-bottom:0}}

/* los siete principios */
.prin{border-top:1px solid var(--ink);margin-top:34px}
.prin article{display:grid;grid-template-columns:64px minmax(0,1fr);gap:clamp(16px,2.4vw,34px);
  padding:clamp(26px,3vw,40px) 0;border-bottom:1px solid var(--rule)}
.prin .n{font-family:var(--serif);font-size:clamp(34px,4vw,52px);line-height:.9;letter-spacing:-.04em;color:var(--ai);font-weight:600}
.prin h3{font-size:clamp(20px,2.3vw,28px);max-width:24ch}
.prin .ev{margin-top:14px;font-size:16.5px;line-height:1.65;color:var(--ink-3);max-width:62ch}
.prin .ev cite{font-style:normal;color:var(--ink-4);font-size:14.5px;white-space:nowrap}
.prin .does{margin-top:18px;padding:16px 20px;background:var(--ai-wash);border-left:2px solid var(--ai);
  font-size:16px;line-height:1.6;color:#1A2E7A;max-width:62ch}
.prin .does b{color:var(--ai);font-weight:700;display:block;font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;margin-bottom:6px;font-family:var(--sans)}
@media (max-width:700px){.prin article{grid-template-columns:1fr;gap:10px}}

/* el bucle */
.loopwrap{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:clamp(26px,4vw,60px);
  align-items:start;margin-top:36px}
.cyc{width:100%;height:auto;overflow:visible}
.cyc .ring{fill:none;stroke:var(--rule);stroke-width:1.5}
.cyc .seg{fill:none;stroke:var(--ai);stroke-width:3;stroke-linecap:round;opacity:0;transition:opacity 900ms}
.cyc .seg.on{opacity:1}
.cyc .nd{fill:var(--white);stroke:var(--rule);stroke-width:1.5;transition:stroke 900ms,fill 900ms}
.cyc .nd.on{fill:var(--ai);stroke:var(--ai)}
.cyc .nl{font:600 11.5px var(--sans);fill:var(--ink-4);transition:fill 900ms}
.cyc .nl.on{fill:var(--ink);font-weight:700}
.cyc .ctr{font:600 15px var(--serif);fill:var(--ink-4)}
.steps{list-style:none;margin:0;padding:0;counter-reset:st;border-top:1px solid var(--rule)}
.steps li{counter-increment:st;display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:14px;
  padding:13px 0;border-bottom:1px solid var(--rule);transition:opacity .5s}
.steps li::before{content:counter(st);grid-column:1;grid-row:1 / span 2;font-family:var(--mono);font-size:12px;color:var(--ai);font-weight:600;padding-top:3px}
.steps li b{grid-column:2;font-size:16px;margin-bottom:2px}
.steps li span{grid-column:2;font-size:14.5px;color:var(--ink-3);line-height:1.5}
.steps li.on b{color:var(--ai)}
@media (max-width:900px){.loopwrap{grid-template-columns:1fr}}

/* tabla de la sesión diaria */
.mtable{width:100%;border-collapse:collapse;margin-top:30px;font-size:15.5px}
.mtable th{text-align:left;font:700 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-4);padding:0 16px 12px 0;border-bottom:1px solid var(--ink)}
.mtable td{padding:16px 16px 16px 0;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.55;color:var(--ink-3)}
.mtable td:first-child{font-weight:600;color:var(--ink);white-space:nowrap}
.mtable td.min{font-family:var(--mono);font-size:14px;color:var(--ai);white-space:nowrap}
.mtable td:last-child{padding-right:0}
.mtable .pr{display:inline-block;font-family:var(--mono);font-size:12px;color:var(--ink-4);
  border:1px solid var(--rule);border-radius:3px;padding:1px 6px;white-space:nowrap}
@media (max-width:700px){.mtable,.mtable tbody,.mtable tr,.mtable td{display:block;width:100%}
 .mtable thead{display:none}
 .mtable tr{border-bottom:1px solid var(--rule);padding:14px 0}
 .mtable td{border:0;padding:2px 0}}

/* listas con viñeta de guion */
.dash{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px;max-width:64ch}
.dash li{position:relative;padding-left:24px;font-size:16.5px;line-height:1.6;color:var(--ink-3)}
.dash li::before{content:"";position:absolute;left:0;top:13px;width:12px;height:1.5px;background:var(--ai)}
.dash li b{color:var(--ink)}

/* lo que no hacemos */
.nots{border-top:1px solid var(--ink);margin-top:32px}
.nots div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);gap:clamp(14px,2.4vw,40px);
  padding:20px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.nots b{font-family:var(--serif);font-size:clamp(18px,2vw,23px);letter-spacing:-.02em;font-weight:600}
.nots span{font-size:16px;line-height:1.6;color:var(--ink-3)}
@media (max-width:760px){.nots div{grid-template-columns:1fr;gap:7px}}

/* referencias */
.refs{margin-top:28px;columns:2;column-gap:44px;font-size:13.5px;line-height:1.55;color:var(--ink-3)}
.refs p{break-inside:avoid;margin-bottom:14px;padding-left:18px;text-indent:-18px}
.refs i{font-style:italic}
@media (max-width:820px){.refs{columns:1}}
.reftoggle{margin-top:22px}