/* Self-hosted fonts — Bricolage Grotesque (display) · Manrope (body) · Fira Mono (data) */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/bricolage-grotesque-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/bricolage-grotesque-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:800;font-display:swap;src:url("/assets/fonts/bricolage-grotesque-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/manrope-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/manrope-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/manrope-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/manrope-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Fira Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/fira-mono-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Fira Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/fira-mono-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Fira Mono";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/fira-mono-latin-700-normal.woff2") format("woff2")}

/* ============================================================
   BonusElegido — dark "award / editorial pick" identity
   graphite · crimson · bronze · rosette signature
   ============================================================ */
:root{
  --bg:#16161B; --bg2:#1E1E25; --card:#22222B; --card2:#2B2B36;
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.15);
  --text:#ECECF0; --soft:#A6A6B2; --faint:#71717F;
  --crimson:#E23E52; --crimson-d:#C22A3E; --crimson-t:rgba(226,62,82,.13);
  --bronze:#C29A5B; --bronze-t:rgba(194,154,91,.14);
  --maxw:1140px;
  --disp:"Bricolage Grotesque",system-ui,"Segoe UI",sans-serif;
  --body:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Fira Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1200px 520px at 50% -12%,rgba(226,62,82,.09),transparent 70%)}
img{max-width:100%;display:block}
a{color:var(--crimson);text-decoration:none}
a:hover{color:#f2657a}
.be13e{max-width:var(--maxw);margin:0 auto;padding:0 22px}

h1,h2,h3,h4{font-family:var(--disp);font-weight:800;line-height:1.1;margin:0;letter-spacing:-.3px}
h1{font-size:clamp(2.35rem,5.8vw,3.85rem)}
h2{font-size:clamp(1.55rem,3.3vw,2.3rem);margin:1.7em 0 .45em}
h3{font-size:clamp(1.2rem,2.2vw,1.48rem);margin:1.4em 0 .3em;font-weight:700}
p{margin:0 0 1.05em}
strong{color:#fff;font-weight:700}
em{font-style:italic}

.be99c{font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;color:var(--bronze);display:inline-flex;align-items:center;gap:.7em;margin-bottom:.7em}
.be99c::before{content:"\2726";color:var(--crimson)}

/* Header */
.beb7a{position:sticky;top:0;z-index:50;background:rgba(22,22,27,.86);backdrop-filter:blur(11px);border-bottom:1px solid var(--line)}
.beb7a .be13e{display:flex;align-items:center;gap:18px;height:68px}
.bee1e{font-family:var(--disp);font-weight:800;font-size:1.4rem;letter-spacing:-.4px;color:#fff;white-space:nowrap;display:flex;align-items:center;gap:11px}
.bee1e b{color:var(--crimson)}
.be0a7{flex:none;width:38px;height:38px}
.beaad{display:flex;gap:24px;margin-left:auto}
.beaad a{color:var(--soft);font-weight:600;font-size:.93rem}
.beaad a:hover{color:var(--crimson)}
.bee56{display:inline-flex;align-items:center;gap:.5em;background:var(--crimson);color:#fff;font-family:var(--body);font-weight:700;font-size:.97rem;padding:11px 20px;border-radius:9px;border:none;transition:.15s;white-space:nowrap;box-shadow:0 4px 16px rgba(226,62,82,.28)}
.bee56:hover{background:var(--crimson-d);color:#fff;transform:translateY(-1px);box-shadow:0 8px 22px rgba(226,62,82,.34)}

/* Hero */
.be898{padding:54px 0 16px}
.be898 .be42a{font-size:1.26rem;line-height:1.6;color:var(--soft);max-width:62ch;margin:.2em 0 0}
.be898 h1{margin:.12em 0 .4em;max-width:20ch}
.be898 h1 b{color:var(--crimson)}
.be941{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 4px}
.be6d1{display:inline-flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:9px;padding:9px 14px;font-size:.88rem;color:var(--soft)}
.be6d1 b{color:#fff;font-family:var(--mono);font-weight:500;font-size:1rem}
.be6d1 .beb0b{width:8px;height:8px;border-radius:50%;background:var(--bronze);box-shadow:0 0 8px var(--bronze)}
.beb79{display:flex;align-items:center;gap:11px;margin-top:22px;font-size:.9rem;color:var(--soft)}
.beb79 .be0e2{width:40px;height:40px;border-radius:50%;background:var(--crimson-t);border:1px solid var(--crimson);display:flex;align-items:center;justify-content:center;color:var(--crimson);font-weight:800;font-family:var(--disp);font-size:1.1rem}
.beb79 b{color:#fff}
.beb79 .be7bc{color:var(--bronze);font-weight:700}

/* Amount nav */
.be226{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 6px}
.be226 a{font-family:var(--mono);font-weight:500;border:1px solid var(--line2);background:var(--card);color:var(--text);padding:8px 14px;border-radius:9px;font-size:.85rem;transition:.15s}
.be226 a:hover{border-color:var(--crimson);color:var(--crimson)}
.be226 a.be595{background:var(--crimson);border-color:var(--crimson);color:#fff}

/* Section head */
.be959{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:48px 0 16px;border-bottom:1px solid var(--line2);padding-bottom:12px}
.be959 h2{margin:0}
.be959 h2::before{content:"";display:inline-block;width:20px;height:3px;background:var(--crimson);border-radius:3px;vertical-align:middle;margin-right:12px}
.be959 .bedfa{font-family:var(--mono);font-weight:400;font-size:.78rem;color:var(--faint);text-transform:uppercase;letter-spacing:.1em}

/* Selection table */
.be2ec{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--card)}
table.bec75{width:100%;border-collapse:collapse;min-width:660px;font-size:.95rem}
table.bec75 th{background:var(--bg2);text-align:left;font-family:var(--mono);font-weight:500;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--soft);padding:13px 16px;border-bottom:1px solid var(--line)}
table.bec75 td{padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
table.bec75 tr:last-child td{border-bottom:none}
table.bec75 tbody tr:hover td{background:var(--card2)}
.be9aa{width:52px}
.beea4{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;font-family:var(--mono);font-weight:500;font-size:.9rem;color:var(--soft);background:#33333f;border-radius:50%}
.beea4.be83d{background:var(--crimson);color:#fff}
.beea4.be497{background:var(--bronze);color:#1c1c22}
.beea4.beeac{background:#4a4a58;color:#fff}
.beb31{font-family:var(--disp);font-weight:700;font-size:1.1rem;color:#fff;white-space:nowrap}
.be744{color:var(--soft)}
.be7e9 a{display:inline-block;background:var(--crimson);color:#fff;font-weight:700;font-size:.86rem;padding:8px 15px;border-radius:9px;white-space:nowrap}
.be7e9 a:hover{background:var(--crimson-d);color:#fff}

/* Grade chip */
.be83a{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:.72rem;padding:4px 10px;border-radius:6px;white-space:nowrap}
.be83a.be4c2{background:var(--crimson-t);color:#f2657a;border:1px solid rgba(226,62,82,.4)}
.be83a.bef35{background:var(--bronze-t);color:var(--bronze);border:1px solid rgba(194,154,91,.4)}
.be83a.beb25{background:rgba(166,166,178,.1);color:var(--soft);border:1px solid var(--line2)}

/* Candidate (podium) card */
.be8a2{display:flex;flex-direction:column;gap:16px;margin:16px 0}
.be31a{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 24px;display:grid;grid-template-columns:54px 1fr 300px;gap:24px;align-items:center;transition:.16s}
.be31a:hover{border-color:var(--line2);transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.4)}
.be31a.be28d{border-color:rgba(226,62,82,.55);box-shadow:0 0 0 1px rgba(226,62,82,.3),0 16px 44px rgba(226,62,82,.13)}
.bed21{position:absolute;top:-12px;left:22px;background:var(--crimson);color:#fff;font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.08em;font-size:.68rem;padding:4px 12px;border-radius:6px}
.bebdd{font-family:var(--disp);font-weight:800;font-size:2.6rem;color:#3a3a46;text-align:center;line-height:1}
.be31a.be28d .bebdd{color:var(--crimson)}
.beb1d .be8e8{display:inline-flex;align-items:center;font-family:var(--disp);font-weight:800;color:#fff;padding:6px 14px;border-radius:9px;font-size:1.1rem}
.beb1d .be6dc{font-family:var(--disp);font-weight:700;font-size:1.3rem;color:#fff;margin:10px 0 4px}
.beb1d .be1a1{font-size:.94rem;color:var(--soft);margin-bottom:10px}
.beb1d .be1a1 b{color:#fff}
.be833{display:flex;flex-direction:column;gap:8px;max-width:440px}
.be65f{display:grid;grid-template-columns:112px 1fr 40px;align-items:center;gap:10px}
.be65f .be59d{font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:.68rem;color:var(--soft)}
.be65f .be7c0{height:7px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.be65f .be3c7{height:100%;border-radius:99px}
.be65f .be3c7.be8e2{background:var(--crimson)}
.be65f .be3c7.bec7c{background:var(--bronze)}
.be65f .bea56{font-family:var(--mono);font-size:.76rem;color:var(--text);text-align:right}
.bebd7{display:flex;flex-direction:column;gap:10px}
.bebd7 .beaa6{display:flex;align-items:center;justify-content:space-between;gap:8px}
.befb7{font-family:var(--mono);font-size:.78rem;background:var(--bg2);border:1px dashed var(--line2);border-radius:9px;padding:7px 11px;color:var(--text);text-align:center}
.befb7 span{color:var(--faint)}
.bebd7 .bee56{width:100%;justify-content:center}
.bea09{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bea09 li{font-size:.8rem;color:var(--soft);background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:3px 9px}
.bea09 li::before{content:"\2713 ";color:var(--crimson);font-weight:700}

/* Prose */
.bec8c{max-width:72ch}
.bec8c h2{padding-bottom:.12em}
.be14c{background:var(--crimson-t);border:1px solid rgba(226,62,82,.3);border-left:4px solid var(--crimson);border-radius:0 10px 10px 0;padding:15px 18px;margin:22px 0;color:var(--text)}
.be14c b{color:#f2657a}
.be1a8{background:var(--bronze-t);border:1px solid rgba(194,154,91,.34);border-left:4px solid var(--bronze);border-radius:0 10px 10px 0;padding:15px 18px;margin:22px 0;color:var(--text)}
.be1a8 b{color:var(--bronze)}

/* Review (H2 detail) */
.beba1{display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.beba1 .be067{font-family:var(--mono);font-weight:500;color:var(--bronze);font-size:.95rem}
.beba1 h2{margin:0;border:none;padding:0;font-size:1.44rem}
.beba1 h2::before{display:none}
.be655{margin-top:14px}
.be655 p{color:var(--soft)}
.be655 .bee56{margin-top:6px}

/* H3 amount grid */
.be512{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin:16px 0}
.be7c7{display:block;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;transition:.16s}
.be7c7:hover{border-color:var(--crimson);transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.4)}
.be7c7 h3{margin:0 0 .3em;font-size:1.3rem;color:#fff}
.be7c7 p{margin:0;font-size:.9rem;color:var(--soft)}
.be7c7 .be9b9{display:inline-block;margin-top:12px;color:var(--crimson);font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.04em;font-size:.78rem}

/* FAQ */
.be780 details{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;background:var(--card)}
.be780 summary{cursor:pointer;padding:16px 18px;font-family:var(--disp);font-weight:700;font-size:1.1rem;color:#fff;list-style:none;display:flex;justify-content:space-between;gap:14px}
.be780 summary::-webkit-details-marker{display:none}
.be780 summary::after{content:"+";color:var(--crimson);font-size:1.5rem;line-height:1;transition:.2s;font-family:var(--mono)}
.be780 details[open] summary::after{transform:rotate(45deg)}
.be780 .be60a{padding:0 18px 16px;color:var(--soft)}

/* Breadcrumb */
.be2ab{font-family:var(--mono);font-size:.76rem;color:var(--faint);padding-top:4px;text-transform:uppercase;letter-spacing:.03em}
.be2ab a{color:var(--soft)}
.be2ab a:hover{color:var(--crimson)}

/* Resource list */
.bedd9{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin:18px 0}
.be817{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.be817 h3{margin:0 0 .25em;font-size:1.12rem}
.be817 p{margin:0 0 .5em;font-size:.9rem;color:var(--soft)}
.be817 .be35f{font-family:var(--mono);font-weight:500;font-size:1.15rem;color:var(--crimson)}

/* Author box */
.be048{margin:46px 0 0;padding:22px 24px;background:var(--card);border:1px solid var(--line);border-radius:16px;display:flex;gap:16px;align-items:flex-start}
.be048 .be541{flex:none;width:52px;height:52px;border-radius:50%;background:var(--crimson-t);border:1px solid var(--crimson);display:flex;align-items:center;justify-content:center;color:var(--crimson);font-family:var(--disp);font-weight:800;font-size:1.35rem}
.be048 .be4d4{font-family:var(--disp);font-weight:800;font-size:1.22rem;color:#fff;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.be147{display:inline-flex;align-items:center;gap:5px;font-family:var(--body);font-weight:700;font-size:.82rem;color:var(--bronze)}
.be147 .bec07{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;background:var(--bronze);color:#1c1c22;font-size:.7rem;font-weight:700}
.bedf5{margin:.45em 0 0;font-size:.92rem;color:var(--soft);line-height:1.6;max-width:70ch}

/* CTA band + footer */
.bec74{background:linear-gradient(135deg,#26161c,#1a1a20);border:1px solid var(--line2);border-radius:18px;padding:40px;text-align:center;margin:58px 0 0;position:relative;overflow:hidden}
.bec74::before{content:"";position:absolute;inset:0;background:radial-gradient(480px 200px at 50% 0,rgba(226,62,82,.24),transparent 70%)}
.bec74>*{position:relative}
.bec74 h2{color:#fff;margin:0 0 .3em}
.bec74 h2::before{display:none}
.bec74 p{color:var(--soft);max-width:56ch;margin:0 auto 20px}
.be0b9{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border:2px solid var(--crimson);color:var(--crimson);border-radius:50%;font-family:var(--mono);font-weight:500;margin-bottom:14px;font-size:1rem}
.be4c7{margin-top:50px;border-top:1px solid var(--line);padding:38px 0 34px;color:var(--faint);font-size:.87rem}
.befca{display:grid;grid-template-columns:1.7fr 1fr 1fr;gap:30px;margin-bottom:24px}
.befca h4{font-family:var(--disp);font-size:1.05rem;color:#fff;margin:0 0 12px}
.befca a{display:block;color:var(--soft);margin-bottom:7px}
.befca a:hover{color:var(--crimson)}
.be74e{border-top:1px solid var(--line);padding-top:16px;line-height:1.6}
.be74e b{color:var(--bronze)}

/* Responsive */
@media(max-width:900px){
  .be31a{grid-template-columns:1fr;gap:16px;padding:20px}
  .bed21{left:20px}
  .bebdd{text-align:left;font-size:2rem}
  .be833{max-width:none}
  .befca{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  body{font-size:16px}
  .beaad{display:none}
  .be65f{grid-template-columns:94px 1fr 36px}
  .befca{grid-template-columns:1fr}
  .bec74{padding:28px 20px}
  .be898{padding:38px 0 10px}
}
a:focus-visible,summary:focus-visible,.bee56:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}
