/* ==========================================================================
   Páginas de producto: SGCR y Plataforma ERP
   Se apoya en fisher-ui.css (tokens --fn-*, fn-frame, fn-shot, fn-modrow…)
   y añade lo que esas páginas necesitan. Todo en claro: sin fondos oscuros.
   ========================================================================== */

:root{
    --pr-teal:#0E9F96;
    --pr-teal-600:#0B847D;
    --pr-teal-50:#E7F7F5;
    --pr-red:#DC2626;
    --pr-red-50:#FDECEC;
    --pr-amber:#D97706;
    --pr-amber-50:#FEF5E6;
    --pr-green:#16A34A;
    --pr-green-50:#E9F8EF;
    --pr-violet:#7C3AED;
    --pr-violet-50:#F3EEFE;
}

/* ---- Barra de enlaces de producto (arriba de la cabecera de página) ---- */
.pr-switch{background:#fff;border-bottom:1px solid var(--fn-line);}
.pr-switch__in{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding-top:10px;padding-bottom:10px;}
.pr-switch__label{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fn-muted);margin-right:6px;}
.pr-switch a{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border-radius:999px;border:1px solid var(--fn-line);font-size:14px;font-weight:600;color:var(--fn-navy-800);text-decoration:none;transition:all .2s;}
.pr-switch a:hover{border-color:var(--fn-blue);color:var(--fn-blue);}
.pr-switch a.is-on{background:var(--fn-blue-50);border-color:rgba(28,109,168,.35);color:var(--fn-blue);}
.pr-switch a.is-on--teal{background:var(--pr-teal-50);border-color:rgba(14,159,150,.4);color:var(--pr-teal-600);}

/* ---- Héroe ---- */
.pr-hero{position:relative;overflow:hidden;background:#fff;padding:64px 0 56px;}
.pr-hero:before,.pr-hero:after{content:'';position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;}
.pr-hero:before{width:560px;height:560px;background:rgba(14,159,150,.13);top:-220px;right:-140px;}
.pr-hero:after{width:440px;height:440px;background:rgba(28,109,168,.10);bottom:-220px;left:-160px;}
.pr-hero--blue:before{background:rgba(23,184,212,.15);}
.pr-hero__grid{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center;}
.pr-hero__kicker{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:var(--pr-teal-50);color:var(--pr-teal-600);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:18px;}
.pr-hero--blue .pr-hero__kicker{background:var(--fn-blue-50);color:var(--fn-blue);}
.pr-hero h1{font-size:clamp(34px,4.4vw,56px);letter-spacing:-.03em;line-height:1.08;margin:0 0 18px;}
.pr-hero h1 em{font-style:normal;color:var(--pr-teal);}
.pr-hero--blue h1 em{background:var(--fn-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.pr-hero__lead{font-size:19px;color:var(--fn-muted);max-width:580px;margin:0 0 28px;}
.pr-hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:26px;}
.pr-hero__proof{display:flex;flex-wrap:wrap;gap:10px 22px;margin:0;padding:0;list-style:none;}
.pr-hero__proof li{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:600;color:var(--fn-navy-800);}
.pr-hero__proof i{color:var(--pr-teal);}
.pr-hero--blue .pr-hero__proof i{color:var(--fn-green);}
.fn-btn--teal{background:var(--pr-teal);border-color:var(--pr-teal);color:#fff !important;}
.fn-btn--teal:hover{background:var(--pr-teal-600);border-color:var(--pr-teal-600);}

/* ---- Tarjeta «semáforo del grupo» del héroe ---- */
.pr-semcard{position:relative;background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);box-shadow:var(--fn-sh-lg);padding:22px 22px 18px;}
.pr-semcard__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.pr-semcard__head b{font-family:var(--fn-font-display);font-size:17px;color:var(--fn-navy-900);}
.pr-semcard__head span{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fn-muted);}
.pr-semrow{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--fn-line-soft);}
.pr-semrow:first-of-type{border-top:0;}
.pr-dot{width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 4px rgba(0,0,0,.04);}
.pr-dot--ok{background:var(--pr-green);box-shadow:0 0 0 4px var(--pr-green-50);}
.pr-dot--warn{background:#F59E0B;box-shadow:0 0 0 4px var(--pr-amber-50);}
.pr-dot--bad{background:var(--pr-red);box-shadow:0 0 0 4px var(--pr-red-50);}
.pr-semrow strong{display:block;font-size:15px;color:var(--fn-ink);}
.pr-semrow small{display:block;font-size:13px;color:var(--fn-muted);}
.pr-tag{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;}
.pr-tag--ok{background:var(--pr-green-50);color:#15803D;}
.pr-tag--warn{background:var(--pr-amber-50);color:#B45309;}
.pr-tag--bad{background:var(--pr-red-50);color:#B91C1C;}
.pr-tag--info{background:var(--fn-blue-50);color:var(--fn-blue);}
.pr-tag--teal{background:var(--pr-teal-50);color:var(--pr-teal-600);}
.pr-tag--violet{background:var(--pr-violet-50);color:var(--pr-violet);}
.pr-tag--mute{background:var(--fn-line-soft);color:var(--fn-muted);}
.pr-semcard__foot{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:12px;border-top:1px dashed var(--fn-line);font-size:13px;color:#B91C1C;font-weight:600;}

/* ---- Cifras ---- */
.pr-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.pr-stat{background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);padding:26px 24px;box-shadow:var(--fn-sh-xs);}
.pr-stat b{display:block;font-family:var(--fn-font-display);font-size:clamp(32px,3.4vw,44px);font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--fn-navy-900);}
.pr-stat b small{font-size:.5em;letter-spacing:0;}
.pr-stat--red b{color:var(--pr-red);}
.pr-stat--teal b{color:var(--pr-teal);}
.pr-stat--amber b{color:var(--pr-amber);}
.pr-stat h3{font-size:15px;margin:12px 0 6px;color:var(--fn-ink);text-transform:uppercase;letter-spacing:.05em;}
.pr-stat p{font-size:14.5px;color:var(--fn-muted);margin:0;}
.pr-quote{margin:28px auto 0;max-width:900px;padding:20px 26px;border-left:4px solid var(--pr-teal);background:var(--pr-teal-50);border-radius:0 var(--fn-r) var(--fn-r) 0;font-size:17px;color:var(--fn-navy-800);}
.pr-quote--red{border-color:var(--pr-red);background:var(--pr-red-50);}
.pr-note{margin:16px auto 0;max-width:900px;font-size:13px;color:var(--fn-muted);text-align:center;}

/* ---- Tarjetas con icono (dolores, valor, objetivos) ---- */
.pr-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.pr-cards--4{grid-template-columns:repeat(4,1fr);}
.pr-cards--2{grid-template-columns:repeat(2,1fr);}
.pr-card{background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);padding:26px 24px;transition:transform .25s,box-shadow .25s,border-color .25s;}
.pr-card:hover{transform:translateY(-3px);box-shadow:var(--fn-sh);border-color:rgba(14,159,150,.35);}
.pr-card__icon{width:48px;height:48px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-size:21px;margin-bottom:16px;background:var(--pr-teal-50);color:var(--pr-teal);}
.pr-card__icon--red{background:var(--pr-red-50);color:var(--pr-red);}
.pr-card__icon--amber{background:var(--pr-amber-50);color:var(--pr-amber);}
.pr-card__icon--blue{background:var(--fn-blue-50);color:var(--fn-blue);}
.pr-card__icon--violet{background:var(--pr-violet-50);color:var(--pr-violet);}
.pr-card__icon--green{background:var(--pr-green-50);color:var(--pr-green);}
.pr-card h3{font-size:18px;margin:0 0 8px;}
.pr-card p{font-size:15px;color:var(--fn-muted);margin:0;}
.pr-card__num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--pr-teal);color:#fff;font-weight:800;font-size:14px;margin-bottom:14px;}

/* ---- Tabla de sanciones ---- */
.pr-fines{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:26px;}
.pr-fine{border-radius:var(--fn-r-lg);padding:22px 22px;background:#fff;border:1px solid var(--fn-line);}
.pr-fine b{display:block;font-family:var(--fn-font-display);font-size:28px;font-weight:800;color:var(--pr-red);letter-spacing:-.02em;}
.pr-fine span{font-size:14.5px;color:var(--fn-muted);}
.pr-bar{position:relative;display:block;height:9px;border-radius:999px;background:var(--fn-line-soft);min-width:120px;}
.pr-bar i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:linear-gradient(90deg,#F59E0B,var(--pr-red));}
.pr-finetable td:first-child,.pr-finetable th:first-child{text-align:left;}
.pr-finetable td{vertical-align:middle;}
.pr-finetable td small{display:block;color:var(--fn-muted);font-size:12.5px;}
.pr-finetable .pr-amount{font-weight:700;color:var(--fn-navy-900);white-space:nowrap;}

/* ---- Autoridades ---- */
.pr-auths{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.pr-auth{position:relative;background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);padding:22px 22px 20px;overflow:hidden;}
.pr-auth:before{content:'';position:absolute;inset:0 0 auto 0;height:4px;background:var(--pr-teal);}
.pr-auth h3{font-size:22px;margin:0 0 2px;letter-spacing:-.01em;}
.pr-auth h4{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fn-muted);margin:0 0 12px;}
.pr-auth p{font-size:14.5px;color:var(--fn-body);margin:0 0 14px;}

/* ---- Flujo de un trámite ---- */
.pr-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;margin-bottom:30px;}
.pr-flow:before{content:'';position:absolute;left:10%;right:10%;top:22px;height:3px;background:linear-gradient(90deg,var(--pr-teal),var(--fn-blue));border-radius:3px;}
.pr-flow__step{position:relative;text-align:center;padding:0 10px;}
.pr-flow__step span{position:relative;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:#fff;border:3px solid var(--pr-teal);color:var(--pr-teal-600);font-weight:800;font-size:17px;margin-bottom:12px;}
.pr-flow__step--warn span{border-color:#F59E0B;color:#B45309;}
.pr-flow__step--end span{border-color:var(--fn-blue);color:var(--fn-blue);}
.pr-flow__step h3{font-size:16px;margin:0 0 6px;}
.pr-flow__step p{font-size:14px;color:var(--fn-muted);margin:0;}
.pr-outcomes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.pr-outcome{border:1px solid var(--fn-line);border-radius:var(--fn-r);padding:16px 18px;background:#fff;}
.pr-outcome .pr-tag{margin-bottom:8px;}
.pr-outcome p{font-size:14px;color:var(--fn-muted);margin:0;}

/* ---- Semáforo (tres niveles) ---- */
.pr-lights{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:26px;}
.pr-light{border-radius:var(--fn-r-lg);padding:24px;border:1px solid var(--fn-line);background:#fff;}
.pr-light__top{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.pr-light__top .pr-dot{width:18px;height:18px;}
.pr-light h3{font-size:20px;margin:0;}
.pr-light p{font-size:14.5px;color:var(--fn-muted);margin:0 0 4px;}
.pr-light strong{font-size:14.5px;color:var(--fn-navy-800);}
.pr-light--ok{background:linear-gradient(180deg,var(--pr-green-50),#fff 70%);}
.pr-light--warn{background:linear-gradient(180deg,var(--pr-amber-50),#fff 70%);}
.pr-light--bad{background:linear-gradient(180deg,var(--pr-red-50),#fff 70%);}

/* ---- Estructura (árbol organización → estaciones) ---- */
.pr-tree{display:grid;gap:16px;justify-items:center;}
.pr-tree__root{padding:14px 26px;border-radius:var(--fn-r);background:var(--pr-teal);color:#fff;font-weight:700;font-family:var(--fn-font-display);font-size:17px;box-shadow:var(--fn-sh-sm);}
.pr-tree__row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;}
.pr-tree__node{padding:10px 20px;border-radius:var(--fn-r);background:#fff;border:2px solid var(--pr-teal);color:var(--pr-teal-600);font-weight:700;}
.pr-tree__node--dash{border-style:dashed;color:var(--fn-muted);border-color:var(--fn-line);}

/* ---- Roles ---- */
.pr-role{background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);padding:26px 24px;display:flex;flex-direction:column;}
.pr-role__head{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.pr-role__head h3{font-size:20px;margin:0;}
.pr-role__head small{display:block;font-size:13px;color:var(--fn-muted);font-weight:600;}
.pr-role p{font-size:15px;color:var(--fn-body);margin:0 0 16px;flex:1;}
.pr-role .pr-tag{align-self:flex-start;}

/* ---- Modalidades ---- */
.pr-modes{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:26px;}
.pr-mode{background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);padding:20px 18px;display:flex;flex-direction:column;}
.pr-mode--key{border-color:var(--pr-teal);box-shadow:0 0 0 3px var(--pr-teal-50);}
.pr-mode h3{font-size:16px;margin:0 0 8px;}
.pr-mode p{font-size:14px;color:var(--fn-muted);margin:0 0 14px;flex:1;}
.pr-configs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.pr-config{border-radius:var(--fn-r-lg);padding:24px;border:1px solid var(--fn-line);background:#fff;}
.pr-config--best{border:2px solid var(--pr-teal);position:relative;}
.pr-config--best:after{content:'Referencia';position:absolute;top:-12px;right:18px;background:var(--pr-teal);color:#fff;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;}
.pr-config h3{font-size:20px;margin:0 0 6px;}
.pr-config code{display:inline-block;margin-bottom:10px;padding:3px 9px;border-radius:8px;background:var(--fn-surface);border:1px solid var(--fn-line);font-size:13px;color:var(--fn-navy-800);}
.pr-config p{font-size:14.5px;color:var(--fn-muted);margin:0;}

/* ---- Componentes de la contratación (3 columnas con lista) ---- */
.pr-stack{background:#fff;border:1px solid var(--fn-line);border-radius:var(--fn-r-lg);padding:24px;}
.pr-stack h3{font-size:19px;margin:0 0 4px;}
.pr-stack > span{display:block;font-size:13px;font-weight:700;color:var(--pr-teal-600);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;}
.pr-stack ul{margin:0;padding:0;list-style:none;display:grid;gap:9px;}
.pr-stack li{display:flex;gap:9px;font-size:14.5px;color:var(--fn-body);}
.pr-stack li i{color:var(--pr-teal);margin-top:4px;}

/* ---- Socios ---- */
.pr-partners{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:28px 54px;}
.pr-partners img{max-height:64px;width:auto;filter:saturate(.9);opacity:.95;}
.pr-partners img.is-tall{max-height:86px;}

/* ---- CTA en claro ---- */
.pr-cta{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center;padding:44px 48px;border-radius:var(--fn-r-xl);background:linear-gradient(135deg,var(--pr-teal-50),var(--fn-blue-50));border:1px solid rgba(14,159,150,.22);}
.pr-cta--blue{background:linear-gradient(135deg,var(--fn-blue-50),var(--fn-cyan-50));border-color:rgba(28,109,168,.2);}
.pr-cta h2{font-size:clamp(26px,3vw,38px);margin:0 0 10px;}
.pr-cta p{font-size:17px;color:var(--fn-body);margin:0;}
.pr-cta__actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end;}
.pr-contact{display:grid;gap:6px;margin-top:16px;font-size:15px;color:var(--fn-navy-800);}
.pr-contact a{color:var(--fn-blue);font-weight:600;}

/* ---- Referencias ---- */
.pr-refs{max-width:960px;margin:0 auto;font-size:13.5px;color:var(--fn-muted);}
.pr-refs li{margin-bottom:8px;}
.pr-refs details summary{cursor:pointer;font-weight:700;color:var(--fn-navy-800);font-size:15px;margin-bottom:12px;}

/* ---- Índice de módulos de la plataforma ---- */
.pr-modgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.pr-mod{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--fn-line);border-radius:var(--fn-r);background:#fff;text-decoration:none !important;transition:all .2s;}
.pr-mod:hover{border-color:rgba(28,109,168,.35);box-shadow:var(--fn-sh-sm);transform:translateY(-2px);}
.pr-mod i{flex:0 0 40px;width:40px;height:40px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;font-size:18px;background:var(--fn-blue-50);color:var(--fn-blue);}
.pr-mod b{display:block;font-size:15px;color:var(--fn-ink);margin-bottom:2px;}
.pr-mod span{display:block;font-size:13.5px;color:var(--fn-muted);line-height:1.45;}
.pr-mod--teal i{background:var(--pr-teal-50);color:var(--pr-teal);}
.pr-mod--violet i{background:var(--pr-violet-50);color:var(--pr-violet);}
.pr-mod--amber i{background:var(--pr-amber-50);color:var(--pr-amber);}
.pr-mod--green i{background:var(--pr-green-50);color:var(--pr-green);}
.pr-mod--red i{background:var(--pr-red-50);color:var(--pr-red);}
.pr-groupnav{position:sticky;top:calc(var(--fn-header-h) + 4px);z-index:5;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--fn-line);}
.pr-groupnav ul{display:flex;gap:6px;overflow-x:auto;margin:0;padding:10px 0;list-style:none;scrollbar-width:none;}
.pr-groupnav a{display:block;white-space:nowrap;padding:7px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--fn-navy-800);text-decoration:none;}
.pr-groupnav a:hover{background:var(--fn-blue-50);color:var(--fn-blue);}

/* Galería de capturas secundarias dentro de una fila de módulo */
.pr-thumbs{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:16px;}
.pr-thumbs .fn-frame{margin:0;}
.pr-thumbs .fn-caption{font-size:13px;}

/* Grupo de módulos */
.pr-group{scroll-margin-top:140px;}
.pr-group + .pr-group{border-top:1px solid var(--fn-line);}
.pr-group__title{display:flex;align-items:center;gap:12px;margin:0 0 30px;}
.pr-group__title i{width:44px;height:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:var(--fn-blue-50);color:var(--fn-blue);font-size:20px;}
.pr-group__title h2{font-size:clamp(24px,2.6vw,34px);margin:0;}
.pr-group__title p{margin:2px 0 0;color:var(--fn-muted);font-size:15.5px;}

/* Integraciones / sellos */
.pr-badges{display:flex;flex-wrap:wrap;gap:10px;}
.pr-badges span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--fn-line);font-size:14px;font-weight:600;color:var(--fn-navy-800);}
.pr-badges span i{color:var(--fn-blue);}

/* ---- Responsive ---- */
@media (max-width:1199px){
    .pr-modgrid{grid-template-columns:repeat(3,1fr);}
    .pr-modes{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:991px){
    .pr-hero__grid{grid-template-columns:1fr;gap:36px;}
    .pr-stats,.pr-cards--4{grid-template-columns:repeat(2,1fr);}
    .pr-cards,.pr-auths,.pr-fines,.pr-lights,.pr-configs{grid-template-columns:repeat(2,1fr);}
    .pr-flow{grid-template-columns:1fr;gap:18px;}
    .pr-flow:before{display:none;}
    .pr-flow__step{display:grid;grid-template-columns:46px 1fr;gap:14px;text-align:left;padding:0;}
    .pr-flow__step span{margin:0;}
    .pr-outcomes{grid-template-columns:repeat(2,1fr);}
    .pr-modgrid{grid-template-columns:repeat(2,1fr);}
    .pr-cta{grid-template-columns:1fr;padding:34px 28px;text-align:center;}
    .pr-cta__actions{justify-content:center;}
}
@media (max-width:640px){
    .pr-hero{padding:42px 0 40px;}
    .pr-stats,.pr-cards,.pr-cards--2,.pr-cards--4,.pr-auths,.pr-fines,.pr-lights,.pr-configs,.pr-modes,.pr-outcomes,.pr-modgrid,.pr-thumbs{grid-template-columns:1fr;}
    .pr-semrow{grid-template-columns:auto 1fr;}
    .pr-semrow .pr-tag{grid-column:2;justify-self:start;}
}

/* La barra fija inferior del tema («Ver planes / Contratar internet») es del
   internet residencial: en las páginas de software se sustituye por el botón
   flotante de WhatsApp, que ya está. */
@media (max-width:991px){
    body.pr-page .fn-mobilebar{display:none !important;}
    body.pr-page{padding-bottom:0 !important;}
}
@media (max-width:767px){
    body.pr-page .fn-wa-float{bottom:20px;}
}