
:root{
  --bg:#160305; --bg-2:#100204;
  --surface:oklch(0.185 0.048 12); --surface-2:oklch(0.225 0.055 12);
  --fg:#FAF4EF; --fg-2:oklch(0.75 0.02 30); --fg-3:oklch(0.60 0.02 28);
  --line:oklch(1 0 0 / 10%); --line-lo:oklch(1 0 0 / 5.5%);
  --brand:#8F0D35; --glow:#D54563;
  --btn-bg:#FAF4EF; --btn-fg:#160305;
  --shadow:0 24px 60px -30px rgba(0,0,0,.9);
  --c:#B24BE8;
  --font:'Helvetica Neue',Helvetica,Arial,'Liberation Sans',sans-serif;
  --w:1220px; --pad:30px;
}
[data-pia="light"]{
  --bg:oklch(0.985 0.004 45); --bg-2:oklch(0.966 0.005 42);
  --surface:oklch(0.997 0.002 60); --surface-2:oklch(0.955 0.006 40);
  --fg:oklch(0.205 0.035 16); --fg-2:oklch(0.44 0.022 20); --fg-3:oklch(0.60 0.018 25);
  --line:oklch(0.205 0.035 16 / 13%); --line-lo:oklch(0.205 0.035 16 / 7%);
  --glow:#A81E42; --btn-bg:#8F0D35; --btn-fg:#ffffff;
  --shadow:0 20px 50px -34px rgba(30,6,10,.55);
  --c:#7B2BB0;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:var(--font);background:var(--bg);color:var(--fg);font-size:16px;line-height:1.55;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background .35s,color .35s;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;cursor:pointer;border:none;background:none;}
ul,ol{list-style:none;}
:focus-visible{outline:2px solid var(--c);outline-offset:3px;border-radius:4px;}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--pad);}

/* NAV */
#nav{position:fixed;inset:0 0 auto 0;z-index:200;transition:background .35s,border-color .35s;border-bottom:1px solid transparent;}
#nav.on{background:color-mix(in oklab,var(--bg) 86%,transparent);backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);border-bottom-color:var(--line-lo);}
.nav-in{max-width:var(--w);margin:0 auto;padding:0 var(--pad);height:78px;display:flex;align-items:center;gap:22px;}
.brand{display:flex;align-items:center;margin-right:auto;}
.chip{position:relative;display:flex;align-items:center;}
.chip::before{content:'';position:absolute;inset:-80% -34%;z-index:0;
  background:radial-gradient(ellipse at 42% 52%,color-mix(in oklab,var(--brand) 62%,transparent),transparent 68%);
  filter:blur(10px);opacity:.7;}
[data-pia="light"] .chip::before{opacity:.13;}
.chip img{position:relative;z-index:1;height:30px;width:auto;}
.pia-light{display:none;}
[data-pia="light"] .pia-dark{display:none;}
[data-pia="light"] .pia-light{display:block;}
.nav-back{font-size:14.5px;color:var(--fg-2);transition:color .2s;}
.nav-back:hover{color:var(--fg);}
.tool{border:1px solid var(--line);border-radius:9px;height:38px;min-width:38px;padding:0 10px;
  display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600;
  letter-spacing:.04em;color:var(--fg-2);transition:border-color .2s,color .2s;}
.tool:hover{color:var(--fg);border-color:var(--c);}
.tool svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.ico-sun{display:none;}
[data-pia="light"] .ico-sun{display:block;}
[data-pia="light"] .ico-moon{display:none;}
.nav-cta{background:var(--btn-bg);color:var(--btn-fg);border-radius:9px;padding:10px 18px;font-size:14.5px;font-weight:500;white-space:nowrap;}
@media(max-width:640px){.nav-back{display:none;}}

/* ARTICULO */
main{padding-top:78px;}
.head{position:relative;overflow:hidden;padding:clamp(44px,6vw,76px) 0 clamp(28px,3vw,40px);}
.head::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 50% at 20% -10%,color-mix(in oklab,var(--c) 22%,transparent),transparent 66%);}
.head .wrap{position:relative;z-index:1;}
.crumbs{font-size:12.5px;color:var(--fg-3);display:flex;gap:8px;flex-wrap:wrap;}
.crumbs a:hover{color:var(--fg);}
.kicker{display:inline-block;margin-top:22px;font-size:11px;font-weight:600;text-transform:uppercase;
  letter-spacing:.18em;color:var(--c);}
h1{font-weight:500;font-size:clamp(29px,4.2vw,52px);line-height:1.1;letter-spacing:-.028em;
  margin-top:14px;max-width:20ch;text-wrap:balance;}
.meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:13px;color:var(--fg-3);}
.layout{display:grid;grid-template-columns:1fr 260px;gap:clamp(32px,5vw,68px);align-items:start;
  padding-bottom:clamp(56px,7vw,96px);}
@media(max-width:960px){.layout{grid-template-columns:1fr;}.toc{position:static!important;order:-1;}}

.answer{border:1.6px solid color-mix(in oklab,var(--c) 55%,transparent);border-radius:16px;
  background:color-mix(in oklab,var(--c) 8%,transparent);padding:26px 28px;margin-bottom:38px;}
.answer .l{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.18em;color:var(--c);}
.answer p{font-size:17.5px;line-height:1.6;margin-top:12px;color:var(--fg);}

article h2{font-weight:500;font-size:clamp(21px,2.3vw,28px);line-height:1.25;letter-spacing:-.02em;
  margin:44px 0 0;scroll-margin-top:100px;}
article h2:first-of-type{margin-top:0;}
article p{font-size:16.5px;line-height:1.72;color:var(--fg-2);margin-top:16px;}
article p strong,article li strong{color:var(--fg);font-weight:600;}
article a{color:var(--c);border-bottom:1px solid color-mix(in oklab,var(--c) 40%,transparent);}
article ul{margin-top:16px;display:flex;flex-direction:column;gap:11px;}
article ul li{display:flex;gap:12px;font-size:16.5px;line-height:1.65;color:var(--fg-2);}
article ul li::before{content:'';flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--c);margin-top:10px;}
article table{width:100%;border-collapse:collapse;margin-top:24px;font-size:15px;display:block;overflow-x:auto;}
article thead th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;
  color:var(--fg-3);font-weight:600;padding:0 14px 12px 0;border-bottom:1px solid var(--line);}
article tbody td{padding:13px 14px 13px 0;border-bottom:1px solid var(--line-lo);color:var(--fg-2);vertical-align:top;}
article .r{text-align:right;font-variant-numeric:tabular-nums;color:var(--fg);font-weight:600;padding-right:0;}
article tr.tot td{border-bottom:none;padding-top:16px;color:var(--fg);font-weight:600;font-size:17px;}
article tr.tot .r{color:var(--c);font-size:20px;}
article .nota{font-size:13.5px;color:var(--fg-3);line-height:1.6;margin-top:14px;}
article .formula{border-left:3px solid var(--c);padding:14px 0 14px 18px;margin-top:18px;
  font-size:16px;color:var(--fg);background:color-mix(in oklab,var(--c) 5%,transparent);border-radius:0 8px 8px 0;}

.toc{position:sticky;top:100px;border-left:1px solid var(--line);padding-left:22px;}
.toc h4{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--fg-3);}
.toc ul{margin-top:14px;display:flex;flex-direction:column;gap:10px;}
.toc a{font-size:13.5px;color:var(--fg-2);line-height:1.45;transition:color .2s;}
.toc a:hover{color:var(--c);}

.faq{margin-top:56px;padding-top:12px;border-top:1px solid var(--line);}
.faq h2{margin-bottom:4px;}
.faq details{border-bottom:1px solid var(--line-lo);}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;
  font-size:17px;font-weight:500;cursor:pointer;list-style:none;transition:color .2s;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--c);}
.pm{flex:0 0 auto;width:20px;height:20px;position:relative;}
.pm::before,.pm::after{content:'';position:absolute;background:var(--c);left:50%;top:50%;
  transform:translate(-50%,-50%);transition:opacity .2s,transform .2s;}
.pm::before{width:13px;height:1.5px;}
.pm::after{width:1.5px;height:13px;}
details[open] .pm::after{opacity:0;transform:translate(-50%,-50%) rotate(90deg);}
.faq p{font-size:16px;line-height:1.7;color:var(--fg-2);padding:0 0 22px;}

.cierre{margin-top:56px;border:1.6px solid var(--line);border-radius:18px;padding:clamp(28px,3.4vw,40px);
  background:color-mix(in oklab,var(--surface) 60%,transparent);}
.cierre h3{font-size:clamp(21px,2.2vw,27px);font-weight:500;letter-spacing:-.022em;line-height:1.25;}
.cierre p{font-size:16px;color:var(--fg-2);line-height:1.68;margin-top:12px;max-width:56ch;}
.cierre .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px;}
.btn{display:inline-flex;align-items:center;gap:9px;border-radius:10px;padding:13px 24px;
  font-size:15px;font-weight:500;transition:transform .2s,border-color .2s,background .2s;}
.btn-p{background:var(--btn-bg);color:var(--btn-fg);}
.btn-p:hover{transform:translateY(-1px);}
.btn-s{border:1px solid var(--line);color:var(--fg);}
.btn-s:hover{border-color:var(--c);}

#foot{border-top:1px solid var(--line-lo);background:var(--bg-2);}
.foot-b{max-width:var(--w);margin:0 auto;padding:26px var(--pad);display:flex;flex-wrap:wrap;gap:12px;
  align-items:center;justify-content:space-between;}
.foot-b p,.foot-b a{font-size:12.5px;color:var(--fg-3);}
.foot-b a:hover{color:var(--fg);}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.001ms!important;}html{scroll-behavior:auto;}}
