
/* ===== Certificar · page prefix cf- ===== */
main section[id]{scroll-margin-top:calc(var(--hd,73px) + 66px)}
.nb{white-space:nowrap}

/* hero: the lead is two sentences; the first pill links to the published scope */
.cf-ph .ph-lead{max-width:42ch}
.cf-ph a.tp{text-decoration:none;transition:border-color .2s,background .2s}
.cf-ph a.tp:hover{border-color:rgba(245,241,234,.55);background:rgba(245,241,234,.1)}

/* situación: four doors; the whole card is the link */
.cf-doors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none;perspective:1600px}
.cf-doors > li{display:flex;min-width:0}
.cf-door{position:relative;display:flex;flex-direction:column;gap:14px;width:100%;padding:clamp(22px,2.4vw,34px);border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--ink);text-decoration:none;transition:border-color .25s,transform .35s var(--ease),box-shadow .35s}
.cf-door:hover,.cf-door:focus-visible{border-color:var(--ink);transform:translateY(-4px);box-shadow:0 24px 54px rgba(7,16,28,.12)}
.cf-door-hd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:clamp(14px,2.2vw,34px)}
.cf-door-ic{display:grid;place-items:center;flex:none;width:52px;height:52px;border:1px solid var(--line);border-radius:16px;background:var(--mist)}
.cf-door-ic svg{width:26px;height:26px;fill:none;stroke:var(--ink);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.cf-door h3{font-size:clamp(24px,2.1vw,32px);font-weight:500;line-height:1.08;letter-spacing:-.03em;color:inherit}
.cf-door p{max-width:46ch;font-size:16px;line-height:1.5;color:var(--body)}
.cf-door-go{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:15.5px;font-weight:600}
.cf-door-go i{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;transition:background .25s,border-color .25s,color .25s,transform .4s var(--ease)}
.cf-door-go svg{width:15px;height:15px}
.cf-door:hover .cf-door-go i,.cf-door:focus-visible .cf-door-go i{background:var(--ink);border-color:var(--ink);color:#fff;transform:rotate(45deg)}
.cf-door-tag{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:5px 12px;border:1px solid rgba(214,0,12,.3);border-radius:999px;background:rgba(214,0,12,.06);font-size:13px;font-weight:600;line-height:1.25;color:var(--red-act);font-variant-numeric:tabular-nums}
.cf-door-tag::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px rgba(214,0,12,.16)}
.cf-door--ink{border-color:var(--ink);background:radial-gradient(600px 300px at 100% 0%,rgba(214,0,12,.22),transparent 65%),var(--ink);color:#fff}
.cf-door--ink:hover,.cf-door--ink:focus-visible{border-color:rgba(245,241,234,.45);box-shadow:0 28px 60px rgba(7,16,28,.3)}
.cf-door--ink .cf-door-ic{border-color:var(--hair);background:rgba(245,241,234,.08)}
.cf-door--ink .cf-door-ic svg{stroke:#fff}
.cf-door--ink p{color:var(--bone-84)}
.cf-door--ink .cf-door-go{border-top-color:var(--hair)}
.cf-door--ink .cf-door-go i{border-color:rgba(245,241,234,.3)}
.cf-door--ink:hover .cf-door-go i,.cf-door--ink:focus-visible .cf-door-go i{background:var(--red-act);border-color:var(--red-act)}
/* signature moment: the doors swing open from their hinge as the section arrives (nothing moves with reduced motion) */
.cf-doors.rv-pre > li{opacity:0;transform:rotateY(-22deg) translateX(-12px);transform-origin:0 50%}
.cf-doors.rv-in > li{transition:opacity .8s ease calc(var(--k,0)*120ms),transform 1.1s var(--ease) calc(var(--k,0)*120ms)}

/* qué gana: four effects on ink, then what is evaluated */
.cf-gain{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.cf-gain > li{display:flex;min-width:0}
.cf-g{display:flex;flex-direction:column;gap:12px;width:100%;padding:clamp(20px,2vw,28px);border:1px solid var(--hair);border-radius:var(--r);background:linear-gradient(180deg,rgba(245,241,234,.055),rgba(245,241,234,.02));transition:border-color .25s}
.cf-g:hover{border-color:rgba(245,241,234,.34)}
.cf-g-ic{display:grid;place-items:center;width:48px;height:48px;margin-bottom:clamp(10px,1.6vw,22px);border:1px solid rgba(240,48,59,.3);border-radius:15px;background:rgba(240,48,59,.1)}
.cf-g-ic svg{width:24px;height:24px;fill:none;stroke:var(--red-lt);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cf-g h3{font-size:clamp(19px,1.5vw,22px);font-weight:600;line-height:1.2;letter-spacing:-.015em;color:#fff}
.cf-g p{font-size:15px;line-height:1.5;color:var(--bone-84)}
.cf-g-k{display:flex;align-items:center;gap:9px;margin-top:auto;padding-top:14px;border-top:1px solid var(--hair);font-size:13px;font-weight:600;color:var(--bone-84)}
.cf-g-k::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--bone)}
.cf-ev{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto 1fr;grid-template-areas:"h l" "a l";column-gap:clamp(24px,3vw,56px);row-gap:12px;align-items:start;margin-top:clamp(40px,4.4vw,64px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--hair)}
.cf-ev .h3{grid-area:h}
.cf-ev .list{grid-area:l;max-width:60ch}
.cf-ev .list li{font-size:16.5px}
.cf-ev .tl{grid-area:a;justify-self:start}

/* recorrido: the links share one baseline */
.cf-rec .tl{margin-top:auto;min-height:40px;font-size:14.5px}

/* prepara: the table and a sticky card with the question and the action */
.cf-prep{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(16px,2.4vw,36px);align-items:start}
.cf-prep .tbl{min-width:0}
.cf-prep .tbl th:first-child,.cf-prep .tbl td:first-child{width:32%}
.cf-cp{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid #b7bdc6;border-radius:999px;background:#fff;font:600 14px/1 var(--sans);color:var(--ink);cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.cf-cp:hover{border-color:var(--ink)}
.cf-cp.ok,.cf-cp.ok:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.cf-ask{position:sticky;top:calc(var(--hd,73px) + 86px);gap:18px;padding:clamp(24px,2.6vw,36px)}
.cf-ask .h3{font-size:clamp(22px,1.9vw,30px);line-height:1.15}
.cf-ask p{font-size:15.5px;line-height:1.5;color:var(--bone-84)}
.cf-ask .btns{margin-top:6px}

/* normas: the home rail, nine cards; the title wraps so the arrows keep their place */
.cf-no .head{margin-bottom:clamp(28px,3.4vw,48px)}
.cf-no .src{margin-top:0}
@media(min-width:821px){.cf-no .head > div{max-width:calc(100% - 320px)}}

/* preguntas */
.cf-qa{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(28px,4vw,72px);align-items:start}
.cf-qa-h{position:sticky;top:calc(var(--hd,73px) + 86px);display:grid;gap:20px;justify-items:start}

@media(max-width:1080px){
  .cf-gain{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .cf-prep,.cf-qa,.cf-ev{grid-template-columns:minmax(0,1fr)}
  .cf-ev{grid-template-rows:auto;grid-template-areas:"h" "l" "a"}
  .cf-ask,.cf-qa-h{position:static}
}
@media(max-width:820px){
  .cf-doors{grid-template-columns:minmax(0,1fr);gap:12px}
  .cf-door-hd{margin-bottom:10px}
}
@media(max-width:600px){
  /* the deadline reads as a red-dot line, not a pill, when it has to wrap */
  .cf-door-tag{flex-basis:100%;align-items:flex-start;min-height:0;padding:0;border:0;background:none;font-size:13.5px;line-height:1.35}
  .cf-door-tag::before{margin-top:.38em}
  .cf-gain{grid-template-columns:minmax(0,1fr);gap:12px}
  .cf-g{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:16px;row-gap:6px;padding:18px}
  .cf-g-ic{grid-row:1/4;width:44px;height:44px;margin:0;border-radius:14px}
  .cf-g h3,.cf-g p,.cf-g-k{grid-column:2}
  .cf-g-k{margin-top:4px;padding-top:10px}
  .cf-ev{row-gap:18px}
  /* the table stacks: each item shows its name and what to prepare */
  .cf-prep .tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .cf-prep .tbl,.cf-prep .tbl tbody,.cf-prep .tbl tr,.cf-prep .tbl td,.cf-prep .tbl td:first-child{display:block;width:auto}
  .cf-prep .tbl tr{border-bottom:1px solid var(--line)}
  .cf-prep .tbl tr:last-child{border-bottom:0}
  .cf-prep .tbl td{border:0}
  .cf-prep .tbl td:first-child{padding:14px 16px 2px;font-size:16px}
  .cf-prep .tbl td:last-child{padding:0 16px 14px;color:var(--body)}
}
@media(max-width:460px){
  .cf-door{padding:20px}
  .cf-door h3{font-size:24px}
  .cf-door p{font-size:15.5px}
}

/* certificados entregados: mosaic of archive photos */
.cf-ent-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(150px,15.5vw,236px);gap:12px}
.cf-ent-grid figure{position:relative;margin:0;border-radius:18px;overflow:hidden;background:var(--mist)}
.cf-ent-grid img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.cf-ent-grid figure:hover img{transform:scale(1.04)}
.cf-ent-grid figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 14px 12px;background:linear-gradient(rgba(7,16,28,0),rgba(7,16,28,.82));color:#fff;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;line-height:1.35}
.cf-ent-grid .big{grid-column:span 2;grid-row:span 2}
@media(max-width:820px){.cf-ent-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(140px,38vw,220px);gap:10px}.cf-ent-grid .big{grid-column:span 2;grid-row:span 1}.cf-ent-grid figcaption{font-size:9.5px;padding:26px 10px 10px}}

