/* Portal de Soporte Innfortec — tema claro de marca (naranja/navy). */
:root{
  --sp-orange:#F36C21; --sp-orange-dk:#d65c16;
  --sp-navy:#2B307E; --sp-navy-dk:#21255f;
  --sp-text:#231F20; --sp-muted:#6b7280;
  --sp-bg:#F6F7FB; --sp-surface:#fff; --sp-border:#e5e7eb;
  --sp-radius:12px; --sp-shadow:0 1px 3px rgba(16,24,40,.06),0 6px 20px rgba(16,24,40,.05);
}
*{box-sizing:border-box}
body{font-family:'DM Sans',system-ui,sans-serif;color:var(--sp-text);background:var(--sp-bg);margin:0;
  background-image:radial-gradient(circle, rgba(43,48,126,.04) 1px, transparent 1px);background-size:24px 24px;}
a{color:var(--sp-navy);text-decoration:none}
a:hover{color:var(--sp-orange)}

.sp-header{background:var(--sp-surface);border-bottom:1px solid var(--sp-border);position:sticky;top:0;z-index:50}
.sp-header-in{max-width:960px;margin:0 auto;padding:.8rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.sp-brand{font-weight:700;font-size:1.15rem;color:var(--sp-navy);display:inline-flex;align-items:center;gap:.5rem}
.sp-brand:hover{color:var(--sp-navy)}
.sp-brand-dot{width:14px;height:14px;border-radius:50%;background:var(--sp-orange);display:inline-block}
.sp-brand-sub{color:var(--sp-orange);font-weight:600;font-size:.95rem}
.sp-nav-user{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;color:var(--sp-muted);font-size:.9rem}
.sp-ic{width:15px;height:15px;vertical-align:-2px}

.sp-main{max-width:960px;margin:0 auto;padding:2rem 1.25rem 3rem}
.sp-footer{max-width:960px;margin:0 auto;padding:1.5rem 1.25rem;color:var(--sp-muted);font-size:.85rem;text-align:center}

.sp-btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--sp-orange);color:#fff;border:none;
  border-radius:10px;padding:.6rem 1.1rem;font-weight:600;font-size:.95rem;cursor:pointer;text-decoration:none}
.sp-btn:hover{background:var(--sp-orange-dk);color:#fff}
.sp-btn-navy{background:var(--sp-navy)}.sp-btn-navy:hover{background:var(--sp-navy-dk)}
.sp-btn-ghost{display:inline-flex;align-items:center;gap:.4rem;color:var(--sp-navy);border:1px solid var(--sp-border);
  background:#fff;border-radius:10px;padding:.5rem .9rem;font-weight:500;font-size:.9rem;text-decoration:none}
.sp-btn-ghost:hover{border-color:var(--sp-orange);color:var(--sp-orange)}
.sp-btn-block{width:100%;justify-content:center}

.sp-card{background:var(--sp-surface);border:1px solid var(--sp-border);border-radius:var(--sp-radius);box-shadow:var(--sp-shadow);padding:1.75rem}
.sp-card-narrow{max-width:440px;margin:2rem auto}
.sp-title{font-size:1.6rem;font-weight:700;color:var(--sp-navy);margin:0 0 .35rem}
.sp-sub{color:var(--sp-muted);margin:0 0 1.5rem}

.sp-field{margin-bottom:1rem}
.sp-label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.35rem;color:var(--sp-text)}
.sp-input{width:100%;padding:.65rem .85rem;border:1px solid var(--sp-border);border-radius:10px;font-size:.95rem;font-family:inherit;background:#fff}
.sp-input:focus{outline:none;border-color:var(--sp-orange);box-shadow:0 0 0 3px rgba(243,108,33,.15)}

.sp-alert{padding:.8rem 1rem;border-radius:10px;font-size:.9rem;margin-bottom:1.25rem}
.sp-alert-error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}
.sp-alert-ok{background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d}
.sp-alert-info{background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8}

.sp-hero{text-align:center;padding:2.5rem 1rem}
.sp-hero h1{font-size:2.1rem;font-weight:700;color:var(--sp-navy);margin:0 0 .75rem}
.sp-hero p{color:var(--sp-muted);font-size:1.05rem;max-width:560px;margin:0 auto 1.75rem}
.sp-hero-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}

.sp-muted{color:var(--sp-muted)}
.sp-center{text-align:center}
.sp-mt{margin-top:1rem}
.sp-h3{font-size:1rem;font-weight:600;color:var(--sp-navy);margin:0 0 .75rem}
.sp-card+.sp-card{margin-top:1rem}

.sp-rowhead{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}

.sp-ticket-list{display:flex;flex-direction:column;gap:.6rem}
.sp-ticket{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  background:var(--sp-surface);border:1px solid var(--sp-border);border-radius:10px;padding:.85rem 1.1rem;text-decoration:none;color:var(--sp-text);box-shadow:var(--sp-shadow)}
.sp-ticket:hover{border-color:var(--sp-orange)}
.sp-ticket-code{font-weight:700;color:var(--sp-navy);margin-right:.6rem}
.sp-ticket-title{color:var(--sp-text)}
.sp-ticket-meta{display:flex;align-items:center;gap:.6rem;font-size:.85rem}

.sp-timeline{display:flex;flex-direction:column;gap:.6rem}
.sp-msg{background:#f9fafb;border:1px solid var(--sp-border);border-radius:10px;padding:.7rem .9rem}
.sp-msg-me{background:#fff7ed;border-color:#fed7aa}
.sp-msg-head{display:flex;justify-content:space-between;font-size:.82rem;margin-bottom:.25rem}
.sp-event{color:var(--sp-muted);font-size:.85rem;padding-left:.25rem}
.sp-attach-list{display:flex;flex-direction:column;gap:.35rem}
.sp-attach{text-decoration:none}
textarea.sp-input{resize:vertical}