/* ============================================================
   FidelyOS — "Grado Institucional / Blindado" (sitio principal)
   Oscuro obsidiana, serif Fraunces (gravedad) + JetBrains Mono
   (autoridad técnica) + Inter. Un acento verde-seguro. Hairlines.
   Cubre: landing, páginas de contenido, portal/login y dashboards.
   ============================================================ */
:root{
  --obs:#0a0c0e; --obs-2:#0f1215; --surf:#14181c; --surf-2:#181d22; --surf-3:#1e242a;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.16);
  --plat:#e9ecef; --plat-2:#aab2ba; --faint:#69727b;
  --acc:#3ecf8e; --acc-2:#4bdb9a; --acc-dk:#2ba873; --acc-ink:#062418; --acc-glow:rgba(62,207,142,.18);
  --brass:#c6a15b;
  --amber:#e0a53a; --amber-bg:rgba(224,165,58,.12);
  --rose:#e0678a; --rose-bg:rgba(224,103,138,.12);
  --serif:"Fraunces",Georgia,serif; --sans:"Inter",system-ui,-apple-system,sans-serif; --mono:"JetBrains Mono",ui-monospace,monospace;
  --maxw:1160px; --r:12px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{margin:0;background:var(--obs);color:var(--plat);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
svg{display:block;}
.wrap{width:min(var(--maxw),calc(100% - 48px));margin-inline:auto;}
.mono{font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;font-size:11.5px;color:var(--faint);}
.kick{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);}
.kick.center{justify-content:center;}
.kick .dot{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px var(--acc-glow);animation:pulse 2.4s ease-in-out infinite;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 3px var(--acc-glow);}50%{box-shadow:0 0 0 7px rgba(62,207,142,.05);}}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:9px;padding:14px 24px;font-family:var(--sans);font-weight:500;font-size:15px;cursor:pointer;transition:all .18s ease;white-space:nowrap;}
.btn-acc{background:var(--acc);color:var(--acc-ink);box-shadow:0 10px 30px var(--acc-glow);}
.btn-acc:hover{background:var(--acc-2);transform:translateY(-1px);}
.btn-ghost{border-color:var(--line-2);color:var(--plat);}
.btn-ghost:hover{border-color:var(--plat-2);background:rgba(255,255,255,.03);}
.btn-sm{padding:10px 20px;font-size:14px;}
.btn-block{width:100%;}

/* nav */
.nav{position:sticky;top:0;z-index:40;background:rgba(10,12,14,.72);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .2s;}
.nav.on{border-bottom-color:var(--line);}
.nav-in{display:flex;align-items:center;gap:20px;height:70px;}
.brand{display:inline-flex;align-items:center;gap:11px;font-family:var(--mono);font-weight:600;font-size:15px;letter-spacing:.14em;text-transform:uppercase;}
.brand .mk{width:30px;height:30px;border:1px solid var(--acc);border-radius:7px;display:grid;place-items:center;color:var(--acc);font-size:14px;}
.nav-menu{display:flex;gap:30px;margin-left:34px;font-size:14px;color:var(--plat-2);}
.nav-menu a:hover{color:var(--plat);}
.nav-r{margin-left:auto;display:flex;align-items:center;gap:14px;}
.nav-r .lk{font-size:14px;color:var(--plat-2);} .nav-r .lk:hover{color:var(--plat);}

/* hero */
.hero{position:relative;text-align:center;padding:96px 0 80px;}
.hero::before{content:"";position:absolute;top:-40px;left:50%;transform:translateX(-50%);width:760px;height:420px;max-width:120%;background:radial-gradient(50% 55% at 50% 40%,var(--acc-glow),transparent 70%);z-index:0;pointer-events:none;}
.hero>*{position:relative;z-index:1;}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(40px,6.4vw,78px);line-height:1.02;letter-spacing:-0.02em;margin:26px auto 0;max-width:900px;color:#fff;text-wrap:balance;}
.hero h1 em{font-style:italic;color:var(--acc);}
.hero .sub{max-width:620px;margin:26px auto 0;color:var(--plat-2);font-size:19px;line-height:1.6;}
.hero .cta{display:flex;justify-content:center;gap:13px;margin-top:36px;flex-wrap:wrap;}

.authstrip{display:flex;flex-wrap:wrap;justify-content:center;margin-top:56px;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.authstrip .a{flex:1 1 200px;padding:20px 22px;border-right:1px solid var(--line);text-align:left;}
.authstrip .a:last-child{border-right:0;}
.authstrip .a .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);}
.authstrip .a .v{margin-top:6px;font-size:15px;color:var(--plat);display:flex;align-items:center;gap:8px;}
.authstrip .a .v i{width:6px;height:6px;border-radius:50%;background:var(--acc);flex:none;}

/* secciones */
.section{padding:80px 0;}
.sec-h{text-align:center;font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.6vw,44px);line-height:1.12;letter-spacing:-0.01em;color:#fff;margin:14px auto 0;max-width:660px;}
.sec-p{text-align:center;max-width:560px;margin:16px auto 0;color:var(--plat-2);font-size:17px;}

.sectors{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:48px;}
.sector{border:1px solid var(--line);border-radius:12px;padding:24px 20px;background:var(--obs-2);transition:border-color .18s,transform .18s;}
.sector:hover{border-color:var(--line-2);transform:translateY(-3px);}
.sector .n{font-family:var(--mono);font-size:11px;color:var(--brass);letter-spacing:.1em;}
.sector h3{font-family:var(--serif);font-weight:500;font-size:20px;color:#fff;margin:12px 0 6px;}
.sector p{margin:0;color:var(--plat-2);font-size:13.5px;line-height:1.55;}

.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px;}
.pillar{border:1px solid var(--line);border-radius:14px;padding:30px 26px;background:linear-gradient(180deg,var(--surf),var(--obs-2));}
.pillar .ic{width:44px;height:44px;border:1px solid var(--line-2);border-radius:11px;display:grid;place-items:center;color:var(--acc);margin-bottom:20px;}
.pillar .ic svg{width:22px;height:22px;}
.pillar h3{font-family:var(--serif);font-weight:500;font-size:21px;color:#fff;margin:0 0 10px;}
.pillar p{margin:0;color:var(--plat-2);font-size:14.5px;line-height:1.62;}
.pillar .tag{display:inline-block;margin-top:16px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--acc);border:1px solid var(--line);border-radius:999px;padding:5px 11px;}

.band{margin:0 auto;border:1px solid var(--line);border-radius:20px;padding:clamp(44px,6vw,76px) 32px;text-align:center;background:radial-gradient(70% 120% at 50% 0%,rgba(62,207,142,.08),transparent 60%),var(--obs-2);position:relative;overflow:hidden;}
.band h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,4vw,50px);line-height:1.06;color:#fff;margin:16px auto 0;max-width:640px;}
.band p{max-width:520px;margin:18px auto 28px;color:var(--plat-2);font-size:17px;}
.band .cta{display:flex;justify-content:center;gap:13px;flex-wrap:wrap;}

.foot{border-top:1px solid var(--line);margin-top:40px;}
.foot-in{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:30px 0;color:var(--faint);font-size:13px;}
.foot-in .brand{font-size:13px;} .foot-in .r{margin-left:auto;display:flex;gap:22px;align-items:center;}
.foot-in a:hover{color:var(--plat-2);}
.foot-in .r .sec{color:var(--acc);display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;}

/* páginas de contenido */
.page-hero{text-align:center;padding:80px 0 10px;}
.page-hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(34px,5vw,60px);line-height:1.04;letter-spacing:-0.02em;color:#fff;max-width:840px;margin:22px auto 0;}
.page-hero h1 em{font-style:italic;color:var(--acc);}
.page-hero p{max-width:600px;margin:20px auto 0;color:var(--plat-2);font-size:18px;}
.prose{max-width:760px;margin:0 auto;}
.prose h2{font-family:var(--serif);font-weight:500;font-size:28px;color:#fff;margin:38px 0 12px;}
.prose p{color:var(--plat-2);margin:0 0 16px;}
.prose strong{color:var(--plat);font-weight:500;}
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.icard{border:1px solid var(--line);border-radius:14px;padding:28px;background:var(--obs-2);}
.icard h3{font-family:var(--serif);font-weight:500;font-size:19px;color:#fff;margin:0 0 8px;}
.icard p{margin:0;color:var(--plat-2);font-size:14.5px;line-height:1.6;}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start;}
.form-card{border:1px solid var(--line);border-radius:16px;padding:30px;background:var(--obs-2);}
.form-card label{display:block;margin:0 0 7px;font-size:13px;color:var(--plat-2);}
.form-card input,.form-card textarea{width:100%;margin-bottom:15px;background:var(--surf);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font:inherit;color:var(--plat);transition:border-color .15s,box-shadow .15s;}
.form-card input::placeholder,.form-card textarea::placeholder{color:var(--faint);}
.form-card input:focus,.form-card textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-glow);}

/* portal / login */
.portal{padding:60px 0 90px;}
.auth-wrap{max-width:430px;margin:0 auto;}
.auth-card{border:1px solid var(--line);border-radius:18px;padding:36px;background:linear-gradient(180deg,var(--surf),var(--obs-2));text-align:center;}
.auth-card .logo{width:52px;height:52px;border:1px solid var(--acc);border-radius:13px;display:grid;place-items:center;color:var(--acc);font-family:var(--mono);font-size:22px;margin:0 auto 20px;}
.auth-card h1{font-family:var(--serif);font-weight:500;font-size:26px;color:#fff;margin:0 0 6px;}
.auth-card>p{color:var(--plat-2);font-size:14.5px;margin:0 auto 22px;max-width:320px;}
.auth-fields{text-align:left;}
label{display:block;margin-bottom:7px;font-size:12.5px;color:var(--plat-2);font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;}
input{width:100%;height:48px;margin-bottom:15px;background:var(--surf);border:1px solid var(--line);border-radius:11px;padding:0 15px;font:inherit;color:var(--plat);transition:border-color .15s,box-shadow .15s;}
input::placeholder{color:var(--faint);}
input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-glow);}
.step-status{display:inline-flex;align-items:center;gap:7px;margin:0 auto 16px;padding:6px 13px;border-radius:999px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line);}
.step-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;}
.step-status.ok{color:var(--acc);border-color:rgba(62,207,142,.4);}
.step-status.warn{color:var(--amber);border-color:rgba(224,165,58,.4);}
.step-status.err{color:var(--rose);border-color:rgba(224,103,138,.4);}
.step-status.idle{color:var(--faint);}
.auth-msg{margin-top:14px;font-size:13.5px;color:var(--plat-2);line-height:1.5;}

/* cuenta (tras login) */
.account{display:grid;gap:16px;max-width:860px;margin:0 auto;}
.account-head{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:16px;padding:22px 24px;background:var(--obs-2);}
.account-head .av{width:52px;height:52px;border:1px solid var(--acc);border-radius:13px;display:grid;place-items:center;color:var(--acc);font-family:var(--mono);font-weight:600;font-size:18px;flex:none;}
.account-head h1{font-family:var(--serif);font-weight:500;font-size:22px;color:#fff;margin:0 0 3px;}
.account-head p{margin:0;color:var(--plat-2);font-size:14px;}
.account-head .actions{margin-left:auto;display:flex;gap:10px;}
.kv{display:grid;grid-template-columns:1fr auto;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px;}
.kv:last-child{border-bottom:0;} .kv .k{color:var(--faint);font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.04em;} .kv .v{color:var(--plat);}

/* ===================== DASHBOARD ===================== */
.app{display:grid;grid-template-columns:250px 1fr;gap:16px;padding:16px;max-width:1440px;margin:0 auto;}
.side{border:1px solid var(--line);border-radius:16px;padding:18px 12px;background:var(--obs-2);position:sticky;top:16px;height:calc(100vh - 32px);display:flex;flex-direction:column;}
.side-brand{display:flex;align-items:center;gap:10px;padding:6px 8px 20px;font-family:var(--mono);font-weight:600;font-size:14px;letter-spacing:.12em;text-transform:uppercase;}
.side-brand .mk{width:30px;height:30px;border:1px solid var(--acc);border-radius:8px;display:grid;place-items:center;color:var(--acc);}
.side-nav{display:flex;flex-direction:column;gap:3px;}
.side-nav .lbl{padding:14px 10px 6px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);}
.nav-item{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;color:var(--plat-2);font-size:14.5px;cursor:pointer;transition:all .15s;}
.nav-item svg{width:19px;height:19px;}
.nav-item:hover{background:rgba(255,255,255,.04);color:var(--plat);}
.nav-item.active{background:rgba(62,207,142,.1);color:var(--acc);border:1px solid rgba(62,207,142,.25);}
.side-foot{margin-top:auto;display:flex;flex-direction:column;gap:3px;padding-top:14px;border-top:1px solid var(--line);}
.main-d{min-width:0;display:flex;flex-direction:column;gap:16px;}
.topbar{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:16px;padding:13px 18px;background:var(--obs-2);}
.topbar h1{font-family:var(--serif);font-weight:500;font-size:20px;color:#fff;margin:0;}
.search{flex:1;max-width:420px;display:flex;align-items:center;gap:10px;background:var(--surf);border:1px solid var(--line);border-radius:10px;padding:9px 14px;color:var(--faint);}
.search svg{width:16px;height:16px;} .search input{border:0;background:none;outline:none;height:auto;margin:0;padding:0;font:inherit;font-size:14px;width:100%;color:var(--plat);}
.top-r{margin-left:auto;display:flex;align-items:center;gap:12px;}
.ibtn{position:relative;width:38px;height:38px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;color:var(--plat-2);cursor:pointer;}
.ibtn:hover{background:rgba(255,255,255,.04);color:var(--plat);} .ibtn svg{width:17px;height:17px;} .ibtn .d{position:absolute;top:8px;right:9px;width:6px;height:6px;border-radius:50%;background:var(--rose);}
.uchip{display:flex;align-items:center;gap:9px;padding:5px 10px 5px 5px;border:1px solid var(--line);border-radius:999px;cursor:pointer;}
.uchip .av{width:32px;height:32px;border-radius:50%;border:1px solid var(--acc);color:var(--acc);display:grid;place-items:center;font-family:var(--mono);font-size:12px;} .uchip .nm{font-size:14px;color:var(--plat);}
.dgrid{display:grid;grid-template-columns:1fr 320px;gap:16px;align-items:start;}
.dcol{display:flex;flex-direction:column;gap:16px;min-width:0;}
.card{border:1px solid var(--line);border-radius:16px;padding:20px;background:var(--obs-2);}
.card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.card-h h3{font-family:var(--serif);font-weight:500;font-size:17px;color:#fff;margin:0;} .card-h .more{color:var(--faint);font-family:var(--mono);font-size:11px;text-transform:uppercase;}
.resume{display:flex;align-items:center;gap:16px;}
.resume .ic{width:46px;height:46px;border:1px solid var(--line-2);border-radius:12px;display:grid;place-items:center;color:var(--acc);flex:none;}
.resume .meta{min-width:0;} .resume .meta .t{font-family:var(--serif);font-weight:500;font-size:16px;color:#fff;}
.resume .bar{height:6px;border-radius:999px;background:var(--surf);margin-top:9px;overflow:hidden;} .resume .bar i{display:block;height:100%;background:var(--acc);}
.resume .counts{display:flex;gap:16px;margin-top:8px;color:var(--faint);font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em;} .resume .counts b{color:var(--plat);}
.resume .go{margin-left:auto;flex:none;}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.stat{border:1px solid var(--line);border-radius:14px;padding:18px;background:var(--surf);}
.stat .top{display:flex;align-items:center;justify-content:space-between;}
.stat .badge{width:34px;height:34px;border:1px solid var(--line-2);border-radius:10px;display:grid;place-items:center;color:var(--acc);} .stat .badge svg{width:17px;height:17px;}
.ring{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--acc) calc(var(--p)*1%),rgba(255,255,255,.08) 0);}
.ring::before{content:"";grid-area:1/1;width:40px;height:40px;border-radius:50%;background:var(--surf);}
.ring span{grid-area:1/1;font-family:var(--mono);font-size:10px;color:var(--acc);z-index:1;}
.stat .n{font-family:var(--serif);font-weight:500;font-size:30px;color:#fff;margin-top:14px;letter-spacing:-0.01em;}
.stat .k{color:var(--plat-2);font-size:13px;} .stat .k small{display:block;color:var(--faint);font-size:11.5px;}
.tbl{width:100%;border-collapse:collapse;}
.tbl th{text-align:left;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:0 10px 12px;font-weight:500;}
.tbl td{padding:12px 10px;border-top:1px solid var(--line);font-size:14px;color:var(--plat);}
.tbl tr:hover td{background:rgba(255,255,255,.02);}
.row-ic{display:flex;align-items:center;gap:11px;} .row-ic .ic{width:34px;height:34px;border:1px solid var(--line-2);border-radius:10px;display:grid;place-items:center;color:var(--acc);font-family:var(--mono);font-size:12px;flex:none;}
.row-ic .nm{color:var(--plat);} .row-ic .sub{color:var(--faint);font-size:12px;}
.mini-bar{width:110px;height:6px;border-radius:999px;background:var(--surf);overflow:hidden;} .mini-bar i{display:block;height:100%;background:var(--acc);}
.tag2{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--line);}
.t-ok{color:var(--acc);border-color:rgba(62,207,142,.3);} .t-warn{color:var(--amber);border-color:rgba(224,165,58,.3);} .t-info{color:var(--brass);border-color:rgba(198,161,91,.3);} .t-mut{color:var(--faint);}
.cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;} .cal-h h3{font-family:var(--serif);font-weight:500;font-size:16px;color:#fff;margin:0;} .cal-h .nav button{width:28px;height:28px;border:1px solid var(--line);border-radius:8px;background:none;color:var(--plat-2);cursor:pointer;}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;}
.cal .dow{font-family:var(--mono);font-size:10px;color:var(--faint);padding-bottom:4px;}
.cal .d{padding:8px 0;border-radius:8px;font-size:13px;color:var(--plat-2);cursor:pointer;} .cal .d:hover{background:rgba(255,255,255,.04);} .cal .d.mut{color:var(--faint);} .cal .d.on{background:var(--acc);color:var(--acc-ink);} .cal .d.dot{position:relative;} .cal .d.dot::after{content:"";position:absolute;bottom:3px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--brass);}
.ulist{display:flex;flex-direction:column;gap:4px;}
.uitem{display:flex;align-items:center;gap:12px;padding:10px;border-radius:10px;} .uitem:hover{background:rgba(255,255,255,.02);}
.uitem .dm{width:42px;height:42px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;text-align:center;line-height:1;flex:none;color:var(--acc);}
.uitem .dm b{font-family:var(--mono);font-size:14px;} .uitem .dm small{color:var(--faint);font-size:9px;}
.uitem .ut{font-size:13.5px;color:var(--plat);} .uitem .us{color:var(--faint);font-size:12px;display:inline-flex;align-items:center;gap:5px;} .uitem .us::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);} .uitem.warn .us::before{background:var(--amber);} .uitem.info .us::before{background:var(--brass);}

/* responsive */
@media(max-width:900px){.nav-menu{display:none;}.sectors{grid-template-columns:1fr 1fr;}.pillars{grid-template-columns:1fr;}.split,.contact-grid{grid-template-columns:1fr;}.authstrip .a{flex-basis:50%;border-bottom:1px solid var(--line);}
  .app{grid-template-columns:1fr;}.side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px;}.side-brand{padding:6px 8px;}.side-nav{flex-direction:row;flex-wrap:wrap;}.side-nav .lbl{display:none;}.side-foot{margin:0;border:0;padding:0;flex-direction:row;}.dgrid{grid-template-columns:1fr;}}
@media(max-width:520px){.sectors{grid-template-columns:1fr;}.hero .cta .btn{flex:1 1 auto;}.foot-in .r{margin-left:0;}.stat-row{grid-template-columns:1fr;}.topbar{flex-wrap:wrap;}.search{order:3;max-width:none;width:100%;}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}
