/* topxperu.com · crónica de lectura larga, tema claro (family N) · prefijo plg- */
:root{
  --plg-navy:#090F1E;--plg-navy2:#111A2B;--plg-navy3:#1C2842;
  --plg-paper:#FFFFFF;--plg-soft:#F4F5F8;--plg-line:#E1E4EB;
  --plg-ink:#0B1222;--plg-ink2:#3A4357;--plg-mute:#687188;
  --plg-red:#FF2400;--plg-redtx:#D11E00;--plg-tint:#FFF1ED;
  --plg-head:"Familjen Grotesk","Segoe UI",Arial,sans-serif;
  --plg-serif:Gelasio,Georgia,"Times New Roman",serif;
  --plg-col:41rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--plg-paper);color:var(--plg-ink);font:19px/1.75 var(--plg-serif);overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:var(--plg-redtx);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--plg-ink)}
.shell{max-width:1160px;margin:0 auto;padding:0 22px}
h1,h2,h3{font-family:var(--plg-head);color:var(--plg-ink);line-height:1.12;letter-spacing:-.02em}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 22px;border-radius:4px;
  font:700 16.5px/1.2 var(--plg-head);text-decoration:none;border:2px solid transparent;letter-spacing:.01em;transition:background .15s,color .15s}
.btn-main{background:var(--plg-red);color:#fff}
.btn-main:hover{background:var(--plg-navy);color:#fff}

/* ---------- cabecera clara y fija */
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);border-bottom:1px solid var(--plg-line);backdrop-filter:saturate(1.4) blur(6px)}
.top-in{display:flex;align-items:center;gap:22px;min-height:64px}
.top-in>a:first-child{flex:0 0 auto;display:flex;background:var(--plg-navy);padding:6px 10px;border-radius:4px}
.top nav{display:flex;gap:4px;margin-left:auto}
.top nav a{font:600 16px/1 var(--plg-head);color:var(--plg-ink2);text-decoration:none;padding:12px 12px;border-bottom:2px solid transparent;white-space:nowrap}
.top nav a:hover{color:var(--plg-ink);border-bottom-color:var(--plg-red)}
.top .btn{min-height:44px;padding:9px 18px;font-size:15.5px}

/* ---------- hero / puerta */
.plg-hero{background:var(--plg-navy);color:#fff;position:relative;overflow:hidden}
.plg-hero::before{content:"";position:absolute;inset:auto -10% -60% auto;width:720px;height:720px;border-radius:50%;background:radial-gradient(circle,rgba(255,36,0,.32),transparent 62%)}
.plg-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:linear-gradient(90deg,var(--plg-red) 0 34%,transparent 34%)}
.plg-hero-in{position:relative;max-width:52rem;margin:0 auto;padding:62px 22px 58px}
.plg-kick{font:700 14.5px/1 var(--plg-head);letter-spacing:.16em;text-transform:uppercase;color:#FF8063;margin:0 0 18px}
.plg-hero h1{color:#fff;font-size:60px;font-weight:700;margin:0 0 26px;max-width:13em}
.plg-hero--page h1{font-size:48px;margin-bottom:16px}
.plg-dek{font-size:21px;line-height:1.55;color:#C9D0DF;margin:0 0 14px;max-width:34em;font-style:italic}
.plg-meta{font:500 15px/1.4 var(--plg-head);color:#8E98AE;margin:0 0 8px}
.plg-door-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.plg-door-b1{min-height:58px;padding:14px 34px;font-size:19px}
.plg-door-b2{min-height:58px;padding:14px 26px;font-size:18px;background:#fff;color:var(--plg-navy)}
.plg-door-b2:hover{background:var(--plg-tint);color:var(--plg-navy)}
.plg-door-steps{list-style:none;margin:0 0 22px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #2A3756}
.plg-door-steps li{font:600 17px/1.35 var(--plg-head);color:#E8ECF4;padding:16px 16px 4px 0;display:flex;gap:12px;align-items:flex-start}
.plg-door-steps span{font:700 30px/1 var(--plg-head);color:var(--plg-red);flex:0 0 auto;margin-top:-2px}
.plg-door-bono{font:700 18px/1.4 var(--plg-head);margin:0 0 6px;color:#fff}
.plg-door-ad{font:500 14.5px/1.4 var(--plg-head);color:#8E98AE;margin:0}
.plg-hero .plg-go{margin:18px 0 0}
.plg-hero .plg-age{color:#8E98AE}

/* ---------- columna de lectura */
.plg-col{max-width:calc(var(--plg-col) + 44px);margin:0 auto;padding:44px 22px 70px}
.plg-toc{border:1px solid var(--plg-line);border-left:5px solid var(--plg-red);padding:18px 22px 14px;margin:0 0 40px;background:var(--plg-soft)}
.plg-toc p{font:700 14.5px/1 var(--plg-head);text-transform:uppercase;letter-spacing:.14em;color:var(--plg-mute);margin:0 0 10px}
.plg-toc ol{margin:0;padding:0 0 0 24px;columns:2;column-gap:26px}
.plg-toc li{font:600 16px/1.4 var(--plg-head);margin:0 0 7px;break-inside:avoid}
.plg-toc li::marker{color:var(--plg-red);font-weight:700}
.plg-toc a{color:var(--plg-ink);text-decoration:none}
.plg-toc a:hover{color:var(--plg-redtx);text-decoration:underline}

.plg-art{counter-reset:plgc}
.plg-art p{margin:0 0 20px}
.plg-first::first-letter{float:left;font:700 84px/.82 var(--plg-head);color:var(--plg-red);margin:8px 12px 0 0}
.plg-first{font-size:21px;line-height:1.7}
.plg-art h2{font-size:36px;margin:58px 0 18px;counter-increment:plgc}
.plg-art h2::before{content:"Capítulo " counter(plgc);display:block;font:700 14.5px/1 var(--plg-head);letter-spacing:.16em;text-transform:uppercase;color:var(--plg-red);margin-bottom:12px}
.plg-art h2.plg-plain{counter-increment:none}
.plg-art h2.plg-plain::before{content:"Para cerrar"}
.plg-art ul{margin:0 0 22px;padding-left:22px}
.plg-art li{margin:0 0 8px}
.plg-art li::marker{color:var(--plg-red)}

.plg-quote{margin:36px -40px;padding:6px 0 6px 34px;border-left:6px solid var(--plg-red)}
.plg-quote p{font:400 italic 27px/1.42 var(--plg-serif);color:var(--plg-ink);margin:0!important}

.plg-box{background:var(--plg-navy);color:#E6EAF2;padding:22px 26px 6px;margin:30px 0;border-radius:2px}
.plg-box-t{font:700 15px/1 var(--plg-head)!important;letter-spacing:.14em;text-transform:uppercase;color:#FF8063;margin:0 0 14px!important}
.plg-box ul{padding-left:20px}
.plg-box p{color:#E6EAF2}

.plg-tbl{margin:26px 0 28px;overflow-x:auto}
.plg-tbl table{width:100%;border-collapse:collapse;font:16.5px/1.45 var(--plg-head)}
.plg-tbl th{text-align:left;padding:10px 12px;border-bottom:3px solid var(--plg-ink);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.06em}
.plg-tbl td{padding:12px;border-bottom:1px solid var(--plg-line);vertical-align:top}
.plg-tbl td:first-child{font-weight:700}

.plg-ol{list-style:none;counter-reset:plgo;padding:0!important;margin:26px 0!important}
.plg-ol li{counter-increment:plgo;position:relative;padding:0 0 18px 62px!important;margin:0!important;min-height:46px}
.plg-ol li::before{content:counter(plgo);position:absolute;left:0;top:0;width:44px;height:44px;border:2px solid var(--plg-ink);border-radius:50%;display:grid;place-items:center;font:700 19px/1 var(--plg-head)}
.plg-ol strong{font-family:var(--plg-head)}

.plg-fig{margin:36px -60px}
.plg-fig img{width:100%}
.plg-fig figcaption{font:500 15px/1.45 var(--plg-head);color:var(--plg-mute);padding:10px 60px 0;border-top:0}
.plg-fig--side{float:right;width:220px;margin:6px -40px 16px 24px}

.plg-go{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin:30px 0}
.plg-age{font:500 14.5px/1.3 var(--plg-head);color:var(--plg-mute)}
.plg-go--end{padding:22px 0;border-top:1px solid var(--plg-line);border-bottom:1px solid var(--plg-line);margin-top:40px}

.plg-faq{border-top:3px solid var(--plg-ink)}
.plg-qa{padding:18px 0 4px;border-bottom:1px solid var(--plg-line)}
.plg-qa h3{font-size:21px;margin:0 0 8px}
.plg-qa p{font-size:18px}

.plg-final{margin:48px 0 0;padding:32px 30px 10px;background:var(--plg-tint);border-top:6px solid var(--plg-red)}
.plg-final-t{font:700 28px/1.2 var(--plg-head);margin:0 0 6px!important}
.plg-final .plg-go{margin-top:10px}

.plg-next{margin-top:34px}
.plg-next-t{font:700 14.5px/1 var(--plg-head);text-transform:uppercase;letter-spacing:.14em;color:var(--plg-mute);margin:0 0 10px!important}
.plg-next ul{list-style:none;padding:0!important;margin:0}
.plg-next li{padding:12px 0;border-bottom:1px solid var(--plg-line);font-size:17px}
.plg-next a{font:700 20px/1.3 var(--plg-head);color:var(--plg-ink);text-decoration:none;margin-right:6px}
.plg-next a:hover{color:var(--plg-redtx)}
.plg-next span{color:var(--plg-mute)}

/* ---------- pie */
.foot{background:var(--plg-navy);color:#9AA4BA;padding:44px 0 34px;font:15.5px/1.6 var(--plg-head)}
.foot-top{display:flex;gap:30px;flex-wrap:wrap;align-items:flex-start;padding-bottom:22px;margin-bottom:20px;border-bottom:1px solid #22304D}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.foot nav a{color:#DCE1EC;text-decoration:none;padding:6px 0}
.foot nav a:hover{color:#FF8063}
.foot p{margin:0 0 6px}

@media (max-width:860px){
  .plg-fig{margin:30px 0}.plg-fig figcaption{padding:10px 0 0}
  .plg-quote{margin:30px 0}
  .plg-fig--side{float:none;width:180px;margin:20px auto}
}
@media (max-width:700px){
  body{font-size:18px}
  .top-in{flex-wrap:wrap;gap:8px 12px;min-height:0;padding-top:8px}
  .top .btn{margin-left:auto}
  .top nav{order:3;width:calc(100% + 44px);margin:0 -22px;padding:0 12px;overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--plg-line)}
  .top nav::-webkit-scrollbar{display:none}
  .top nav a{padding:12px 10px;font-size:15.5px}
  .plg-hero-in{padding:26px 20px 30px}
  .plg-kick{font-size:14.5px;margin-bottom:12px}
  .plg-hero h1{font-size:34px;margin-bottom:18px}
  .plg-hero--page h1{font-size:32px}
  .plg-dek{font-size:18px}
  .plg-door-btns{margin-bottom:16px}
  .plg-door-btns .btn{flex:1 1 100%;min-height:52px;padding:12px 20px}
  .plg-door-steps{grid-template-columns:1fr;margin-bottom:14px}
  .plg-door-steps li{padding:9px 0 0;font-size:16.5px;align-items:center}
  .plg-door-steps span{font-size:24px;width:22px}
  .plg-door-bono{font-size:16.5px}
  .plg-col{padding:30px 20px 56px}
  .plg-toc ol{columns:1}
  .plg-first{font-size:19px}
  .plg-first::first-letter{font-size:66px}
  .plg-art h2{font-size:28px;margin-top:46px}
  .plg-quote{padding-left:20px}
  .plg-quote p{font-size:22px}
  .plg-tbl table{font-size:15.5px}
  .plg-tbl th,.plg-tbl td{padding:9px 8px}
  .plg-ol li{padding-left:56px!important}
  .plg-go .btn{flex:1 1 100%}
  .plg-final{padding:24px 18px 6px}
}
