/* ============================================================
   Estilos específicos de páginas de servicio
   Namespace .svc-* para evitar conflictos con styles.css
   ============================================================ */

:root{
  --svc-navy:      #0d1f3c;
  --svc-navy-deep: #081527;
  --svc-brass:     #b08d3f;
  --svc-brass-lt:  #d8b876;
  --svc-cream:     #f6f4ef;
  --svc-paper:     #fbfaf7;
  --svc-ink:       #1b2434;
  --svc-ink-soft:  #4a5568;
  --svc-line:      #e4dfd3;

  --svc-f-display: 'Bitter', Georgia, serif;
  --svc-f-body: 'Libre Franklin', 'Segoe UI', sans-serif;
  --svc-f-mono: 'IBM Plex Mono', monospace;
}

.svc-main{ background:var(--svc-paper); color:var(--svc-ink); font-family:var(--svc-f-body); line-height:1.65; }
.svc-main .container{ max-width:1140px; margin:0 auto; padding:0 24px; }
.svc-main h1, .svc-main h2, .svc-main h3{ font-family:var(--svc-f-display); color:var(--svc-navy); line-height:1.2; }
.svc-eyebrow{
  font-family:var(--svc-f-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--svc-brass); display:flex; align-items:center; gap:10px; margin-bottom:14px;
}
.svc-eyebrow::before{ content:""; width:22px; height:1px; background:var(--svc-brass); display:inline-block; }

/* ---------- HERO ---------- */
.svc-hero{
  background: linear-gradient(155deg, var(--svc-navy) 0%, var(--svc-navy-deep) 100%);
  color:#f2efe6; padding:120px 0 90px; position:relative; overflow:hidden;
}
.svc-hero::after{
  content:""; position:absolute; right:-120px; top:-120px; width:420px; height:420px;
  border:1px solid rgba(216,184,118,.18); border-radius:50%;
}
.svc-hero-grid{ display:grid; grid-template-columns:1.4fr .9fr; gap:56px; align-items:end; position:relative; z-index:1; }
.svc-hero .svc-eyebrow{ color:var(--svc-brass-lt); }
.svc-hero h1{ color:#fff; font-size:clamp(32px,4.4vw,52px); margin:0 0 20px; max-width:14ch; }
.svc-hero .svc-lede{ font-size:18px; color:#cfd6e4; max-width:46ch; margin:0 0 32px; }
.svc-hero-side{ font-family:var(--svc-f-mono); font-size:13px; color:#aeb8cc; border-left:1px solid rgba(216,184,118,.35); padding-left:22px; }
.svc-hero-side dt{ color:var(--svc-brass-lt); margin-top:16px; text-transform:uppercase; letter-spacing:.06em; font-size:11px; }
.svc-hero-side dd{ margin:4px 0 0; color:#e7e2d4; font-family:var(--svc-f-body); font-size:14px; }
.svc-btn{
  display:inline-flex; align-items:center; gap:10px; background:var(--svc-brass); color:var(--svc-navy-deep);
  font-family:var(--svc-f-mono); font-size:13px; letter-spacing:.05em; text-transform:uppercase;
  padding:14px 26px; border-radius:2px; text-decoration:none; transition:background .2s ease, transform .2s ease;
}
.svc-btn:hover{ background:var(--svc-brass-lt); transform:translateY(-1px); }
.svc-btn-outline{ background:transparent; color:#f2efe6; border:1px solid rgba(242,239,230,.4); }
.svc-btn-outline:hover{ background:rgba(242,239,230,.08); color:#fff; }

/* ---------- SECTION shell ---------- */
.svc-section{ padding:76px 0; border-bottom:1px solid var(--svc-line); }
.svc-section.alt{ background:var(--svc-cream); }
.svc-head{ max-width:640px; margin-bottom:36px; }
.svc-head h2{ font-size:clamp(24px,2.6vw,32px); margin:0; }
.svc-body p{ margin:0 0 16px; color:var(--svc-ink-soft); max-width:72ch; }
.svc-body p:last-child{ margin-bottom:0; }

/* ---------- two column ---------- */
.svc-cols{ display:grid; grid-template-columns:1fr 1fr; gap:48px; }

/* ---------- process ---------- */
.svc-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--svc-line); border:1px solid var(--svc-line); }
.svc-step{ background:var(--svc-paper); padding:28px 26px; }
.svc-step .num{ font-family:var(--svc-f-mono); color:var(--svc-brass); font-size:13px; display:block; margin-bottom:12px; }
.svc-step h3{ font-size:17px; margin:0 0 8px; }
.svc-step p{ font-size:14px; color:var(--svc-ink-soft); margin:0; }

/* ---------- benefits ---------- */
.svc-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.svc-card{ background:var(--svc-paper); border:1px solid var(--svc-line); border-top:3px solid var(--svc-brass); padding:24px 22px; }
.svc-card h3{ font-size:16px; margin:0 0 8px; }
.svc-card p{ font-size:14px; color:var(--svc-ink-soft); margin:0; }

/* ---------- sectors ---------- */
.svc-sectors{ display:flex; flex-wrap:wrap; gap:10px; }
.svc-sectors span{
  font-family:var(--svc-f-mono); font-size:13px; color:var(--svc-navy); background:var(--svc-cream);
  border:1px solid var(--svc-line); padding:8px 16px; border-radius:2px;
}

/* ---------- normativa ---------- */
.svc-norm-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:14px 32px; }
.svc-norm-list li{ font-size:15px; color:var(--svc-ink); border-bottom:1px dashed var(--svc-line); padding-bottom:12px; display:flex; gap:12px; }
.svc-norm-list li::before{ content:"—"; color:var(--svc-brass); }

/* ---------- why us ---------- */
.svc-why{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:28px; }
.svc-why-item h3{ font-size:16px; margin:0 0 6px; }
.svc-why-item p{ font-size:14px; color:var(--svc-ink-soft); margin:0; }

/* ---------- FAQ ---------- */
.svc-faq-item{ border-bottom:1px solid var(--svc-line); }
.svc-faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  font-family:var(--svc-f-body); font-weight:600; font-size:16px; color:var(--svc-navy);
  padding:20px 0; display:flex; justify-content:space-between; align-items:center; gap:16px;
}
.svc-faq-q .icon{ font-family:var(--svc-f-mono); color:var(--svc-brass); flex:none; }
.svc-faq-a{ max-height:0; overflow:hidden; transition:max-height .25s ease; }
.svc-faq-a p{ color:var(--svc-ink-soft); font-size:15px; padding:0 0 20px; margin:0; max-width:70ch; }
.svc-faq-item.open .svc-faq-a{ max-height:400px; }
.svc-faq-item.open .svc-faq-q .icon{ transform:rotate(45deg); display:inline-block; }

/* ---------- final CTA ---------- */
.svc-cta{
  background: linear-gradient(155deg, var(--svc-navy-deep) 0%, var(--svc-navy) 100%);
  color:#fff; padding:80px 0; text-align:center;
}
.svc-cta h2{ color:#fff; font-size:clamp(24px,3vw,34px); margin:0 0 14px; }
.svc-cta p{ color:#cfd6e4; max-width:52ch; margin:0 auto 30px; }
.svc-cta-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ---------- decorative hero image ---------- */
.svc-hero-figure{
  position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center;
  opacity:.1;pointer-events:none;
}

/* ---------- scroll animations ---------- */
.svc-animate{
  opacity:0;transform:translateY(30px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1),transform .65s cubic-bezier(.22,.61,.36,1);
}
.svc-animate.visible{opacity:1;transform:translateY(0);}

/* ---------- tables ---------- */
.svc-table-wrap{ overflow-x:auto; margin-top:32px; }
.svc-table{ width:100%; border-collapse:collapse; font-size:14px; }
.svc-table th,.svc-table td{ border:1px solid var(--svc-line); padding:12px 16px; text-align:left; vertical-align:top; }
.svc-table th{ background:var(--svc-navy); color:#fff; font-family:var(--svc-f-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase; }
.svc-table tbody tr:nth-child(even){ background:var(--svc-cream); }
.svc-table tbody tr:hover{ background:rgba(176,141,63,.06); }

@media (max-width: 860px){
  .svc-hero-grid{ grid-template-columns:1fr; }
  .svc-hero-side{ border-left:none; border-top:1px solid rgba(216,184,118,.35); padding-left:0; padding-top:20px; }
  .svc-cols{ grid-template-columns:1fr; }
  .svc-steps{ grid-template-columns:1fr; }
  .svc-cards{ grid-template-columns:1fr; }
  .svc-norm-list{ grid-template-columns:1fr; }
}
