/* ============================================================
   SERVICE PAGES — Rockwell-Style Hero + Structured Body
   Pro AIC Automatización · css/service-pages.css
   v20260905_servicepages_v1
   ============================================================ */

/* ── Hero ─────────────────────────────────────────────────── */
.sp-hero {
  position: relative;
  min-height: 84vh;
  display: flex;
  align-items: center;
  background: #050A14;
  overflow: hidden;
  padding-top: 110px;
}
.sp-hero__canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  display: block;
}
.sp-hero__image { position:absolute; inset:0; z-index:0; background:var(--sp-hero-image) 62% center/cover no-repeat; filter:brightness(.73) contrast(1.13) saturate(1.08); transform:scale(1.015); }
.sp-hero__video { position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:brightness(.66) contrast(1.12) saturate(1.05); }
.sp-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(5,10,20,.84) 0%, rgba(5,10,20,.68) 50%, rgba(5,10,20,.88) 100%);
  z-index: 1;
}
.sp-hero--image .sp-hero__overlay { background:linear-gradient(90deg,rgba(4,14,27,.92) 0%,rgba(4,14,27,.74) 43%,rgba(4,14,27,.30) 100%); }
.sp-hero--image::after { content:''; position:absolute; z-index:2; pointer-events:none; inset:auto 0 0; height:30%; background:linear-gradient(to bottom,rgba(255,255,255,0),#FFF 100%); }
.sp-hero__content {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 64px 28px 88px;
}

/* ── Breadcrumb ── */
.sp-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  font-size: .8rem;
  font-family: var(--font-mono,'JetBrains Mono',monospace);
  color: rgba(255,255,255,.5);
}
.sp-breadcrumb a { color: rgba(255,255,255,.5); text-decoration: none; transition: color .2s; }
.sp-breadcrumb a:hover { color: var(--brand-orange, #C2541A); }
.sp-breadcrumb__sep { color: rgba(255,255,255,.25); margin: 0 2px; }
.sp-breadcrumb__current { color: rgba(255,255,255,.82); }

/* ── Kicker Badge ── */
.sp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono,'JetBrains Mono',monospace);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #FF8A50;
  background: rgba(194, 84, 26, 0.12);
  border: 1px solid rgba(194, 84, 26, 0.35);
  border-radius: 4px;
  padding: 6px 14px;
  margin-bottom: 22px;
}
.sp-kicker::before {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #C2541A;
  box-shadow: 0 0 8px rgba(194, 84, 26, 0.6);
  animation: sp-dot-pulse 2.4s ease-in-out infinite;
  flex-shrink: 0;
}
/* Accent overrides */
.sp-hero--amber .sp-kicker { color:#F59E0B; background:rgba(245,158,11,.09); border-color:rgba(245,158,11,.32); }
.sp-hero--amber .sp-kicker::before { background:#F59E0B; box-shadow:0 0 8px #F59E0B; }
.sp-hero--emerald .sp-kicker { color:#10B981; background:rgba(16,185,129,.09); border-color:rgba(16,185,129,.32); }
.sp-hero--emerald .sp-kicker::before { background:#10B981; box-shadow:0 0 8px #10B981; }
.sp-hero--red .sp-kicker { color:#EF4444; background:rgba(239,68,68,.09); border-color:rgba(239,68,68,.32); }
.sp-hero--red .sp-kicker::before { background:#EF4444; box-shadow:0 0 8px #EF4444; }
.sp-hero--blue .sp-kicker { color:#3B82F6; background:rgba(59,130,246,.09); border-color:rgba(59,130,246,.32); }
.sp-hero--blue .sp-kicker::before { background:#3B82F6; box-shadow:0 0 8px #3B82F6; }
.sp-hero--violet .sp-kicker { color:#8B5CF6; background:rgba(139,92,246,.09); border-color:rgba(139,92,246,.32); }
.sp-hero--violet .sp-kicker::before { background:#8B5CF6; box-shadow:0 0 8px #8B5CF6; }
.sp-hero--orange .sp-kicker { color:#F97316; background:rgba(249,115,22,.09); border-color:rgba(249,115,22,.32); }
.sp-hero--orange .sp-kicker::before { background:#F97316; box-shadow:0 0 8px #F97316; }
@keyframes sp-dot-pulse {
  0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.65)}
}

/* ── Hero Title & Subtitle ── */
.sp-hero__title {
  font-family: var(--font-heading,'Barlow',sans-serif);
  font-size: clamp(2.1rem,5.5vw,3.8rem);
  font-weight: 800;
  color: #FFF;
  line-height: 1.08;
  max-width: 820px;
  margin: 0 0 20px;
  letter-spacing: -.025em;
}
.sp-hero__subtitle {
  font-size: clamp(.98rem,2vw,1.18rem);
  color: rgba(255,255,255,.68);
  max-width: 620px;
  line-height: 1.68;
  margin-bottom: 42px;
}

/* ── Hero CTAs ── */
.sp-hero__actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.sp-btn--cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 15px 30px;
  border-radius: 8px;
  font-family: var(--font-heading,'Barlow',sans-serif);
  font-size: .97rem;
  font-weight: 700;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all .25s ease;
  white-space: nowrap;
  background: #075985;
  color: #FFF;
  box-shadow: 0 4px 12px rgba(7,89,133,.26);
}
.sp-btn--cta:hover { background:#0C4A6E; box-shadow:0 8px 20px rgba(7,89,133,.3); transform:translateY(-3px); color:#FFF; }
.sp-btn--ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 15px 30px;
  border-radius: 8px;
  font-family: var(--font-heading,'Barlow',sans-serif);
  font-size: .97rem;
  font-weight: 600;
  text-decoration: none;
  border: 1.5px solid rgba(255,255,255,.32);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.88);
  backdrop-filter: blur(6px);
  transition: all .25s ease;
  white-space: nowrap;
}
.sp-btn--ghost:hover { border-color:rgba(255,255,255,.72); background:rgba(255,255,255,.12); color:#fff; transform:translateY(-3px); }

/* Insignia Oficial Siemens Solution Partner en sp-hero */
.sp-siemens-hero-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border-radius: 8px;
  height: 52px;
  padding: 0;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.35);
  text-decoration: none;
  overflow: hidden;
  box-sizing: border-box;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.sp-siemens-hero-badge:hover {
  transform: translateY(-3px);
  border-color: #00A3A6;
  box-shadow: 0 12px 28px rgba(0, 163, 166, 0.45), 0 4px 14px rgba(0, 0, 0, 0.45);
}

.sp-siemens-hero-badge img {
  height: 100%;
  width: auto;
  display: block;
  object-fit: contain;
}


/* ── Sections ── */
.sp-section { padding:88px 0; }
.sp-section--alt { background:#F8FAFD; }
.sp-section--dark { background:#070E1A; }
.sp-container { max-width:1180px; margin:0 auto; padding:0 28px; }
.sp-section__header { text-align:center; margin-bottom:60px; }
.sp-section__eyebrow {
  display: inline-block;
  font-family: var(--font-mono,'JetBrains Mono',monospace);
  font-size: .7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color: var(--brand-orange, #C2541A); margin-bottom:14px;
}
.sp-section--dark .sp-section__eyebrow { color:#FF8A50; }
.sp-section__title {
  font-family: var(--font-heading,'Barlow',sans-serif);
  font-size: clamp(1.65rem,3vw,2.35rem); font-weight:800; color:#0A192F; line-height:1.18; margin:0 0 14px;
}
.sp-section--dark .sp-section__title { color:#F1F5F9; }
.sp-section__desc { font-size:1.02rem; color:#64748B; max-width:580px; margin:0 auto; line-height:1.72; }
.sp-section--dark .sp-section__desc { color:#94A3B8; }

/* ── Franja editorial: ingeniería PLC ─────────────────────── */
.sp-feature-split { min-height:50vh; position:relative; overflow:hidden; display:flex; align-items:center; background:#071321; color:#F8FAFC; }
.sp-feature-split__image { position:absolute; inset:0 auto 0 0; width:62%; background-image:var(--sp-feature-image,url('../assets/images/services/ingeniero-programando-plc.jpg.avif')); background-position:var(--sp-feature-position,center center); background-size:cover; background-repeat:no-repeat; }
.sp-feature-split--custom .sp-feature-split__image { background-color:#FFF; background-position:var(--sp-feature-position,center top); }
.sp-feature-split--software .sp-feature-split__image { background-image:url('../assets/images/services/tia-portal-s7-1500-software-feature.jpg'); background-position:center; }
.sp-feature-split__fade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,19,33,0) 15%,rgba(7,19,33,.15) 38%,#071321 63%,#071321 100%); }
.sp-feature-split__content { position:relative; z-index:1; width:min(42%,570px); margin-left:auto; margin-right:max(7vw,28px); padding:56px 0; }
.sp-feature-split__eyebrow { display:block; margin-bottom:14px; color:#9FC5DE; font-family:var(--font-mono,'JetBrains Mono',monospace); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.sp-feature-split h2 { margin:0 0 20px; color:#FFF; font-family:var(--font-heading,'Barlow',sans-serif); font-size:clamp(2.05rem,3.7vw,3.45rem); font-weight:800; line-height:1.02; letter-spacing:-.035em; text-wrap:balance; text-shadow:0 3px 20px rgba(0,0,0,.28); }
.sp-feature-split h2::before { content:''; display:block; width:64px; height:4px; margin-bottom:20px; background:linear-gradient(90deg,#C2541A,#FF8A50); box-shadow:0 3px 12px rgba(194,84,26,.28); }
.sp-feature-split h2 em { color:#FF8A50; font-style:normal; position:relative; white-space:normal; overflow-wrap:anywhere; }
.sp-feature-split h2 em::after { content:''; position:absolute; height:5px; left:1px; right:1px; bottom:-7px; background:rgba(194,84,26,.38); transform:skewX(-18deg); }
.sp-feature-split p { margin:0; color:#C7D4DF; font-size:1.03rem; line-height:1.72; }

/* ── Capabilities Grid ── */
.sp-capabilities-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.sp-cap-card {
  background:#fff; border:1px solid rgba(14,30,64,.07); border-radius:14px;
  padding:28px 24px 26px; transition:all .32s ease; box-shadow:0 2px 10px rgba(0,0,0,.04);
  position:relative; overflow:hidden;
}
.sp-cap-card::before { content:''; position:absolute; top:0;left:0;right:0; height:3px; opacity:0; transition:opacity .3s; background:linear-gradient(90deg,#C2541A,#FF6600); }
.sp-cap-card:hover { transform:translateY(-6px); box-shadow:0 16px 48px rgba(194,84,26,.15); border-color:rgba(194,84,26,.2); }
.sp-cap-card:hover::before { opacity:1; }
.sp-cap-card--amber::before{background:linear-gradient(90deg,#F59E0B,#FBBF24)} .sp-cap-card--amber:hover{box-shadow:0 16px 48px rgba(245,158,11,.15)}
.sp-cap-card--emerald::before{background:linear-gradient(90deg,#10B981,#34D399)} .sp-cap-card--emerald:hover{box-shadow:0 16px 48px rgba(16,185,129,.15)}
.sp-cap-card--red::before{background:linear-gradient(90deg,#EF4444,#F87171)} .sp-cap-card--red:hover{box-shadow:0 16px 48px rgba(239,68,68,.15)}
.sp-cap-card--blue::before{background:linear-gradient(90deg,#3B82F6,#60A5FA)} .sp-cap-card--blue:hover{box-shadow:0 16px 48px rgba(59,130,246,.15)}
.sp-cap-card--violet::before{background:linear-gradient(90deg,#8B5CF6,#A78BFA)} .sp-cap-card--violet:hover{box-shadow:0 16px 48px rgba(139,92,246,.15)}
.sp-cap-card--orange::before{background:linear-gradient(90deg,#F97316,#FB923C)} .sp-cap-card--orange:hover{box-shadow:0 16px 48px rgba(249,115,22,.15)}
.sp-cap-icon { width:48px;height:48px;border-radius:10px;background:rgba(0,87,200,.08);display:flex;align-items:center;justify-content:center;margin-bottom:18px;color:#0057C8;flex-shrink:0; }
.sp-cap-card--amber .sp-cap-icon{background:rgba(245,158,11,.1);color:#D97706}
.sp-cap-card--emerald .sp-cap-icon{background:rgba(16,185,129,.1);color:#059669}
.sp-cap-card--red .sp-cap-icon{background:rgba(239,68,68,.1);color:#DC2626}
.sp-cap-card--blue .sp-cap-icon{background:rgba(59,130,246,.1);color:#2563EB}
.sp-cap-card--violet .sp-cap-icon{background:rgba(139,92,246,.1);color:#7C3AED}
.sp-cap-card--orange .sp-cap-icon{background:rgba(249,115,22,.1);color:#EA580C}
.sp-cap-card__title { font-family:var(--font-heading,'Barlow',sans-serif); font-size:1.02rem; font-weight:700; color:#0A192F; margin:0 0 8px; line-height:1.25; }
.sp-cap-card__desc { font-size:.87rem; color:#64748B; line-height:1.65; margin:0 0 14px; }
.sp-cap-card__spec {
  display:inline-flex; align-items:center; font-family:var(--font-mono,'JetBrains Mono',monospace);
  font-size:.68rem; font-weight:600; color:#C2541A; background:rgba(194,84,26,.08);
  border:1px solid rgba(194,84,26,.2); border-radius:4px; padding:3px 9px;
}
.sp-cap-card--amber .sp-cap-card__spec{color:#D97706;background:rgba(217,119,6,.06);border-color:rgba(217,119,6,.16)}
.sp-cap-card--emerald .sp-cap-card__spec{color:#059669;background:rgba(5,150,105,.06);border-color:rgba(5,150,105,.16)}
.sp-cap-card--red .sp-cap-card__spec{color:#DC2626;background:rgba(220,38,38,.06);border-color:rgba(220,38,38,.16)}
.sp-cap-card--blue .sp-cap-card__spec{color:#2563EB;background:rgba(37,99,235,.06);border-color:rgba(37,99,235,.16)}
.sp-cap-card--violet .sp-cap-card__spec{color:#7C3AED;background:rgba(124,58,237,.06);border-color:rgba(124,58,237,.16)}
.sp-cap-card--orange .sp-cap-card__spec{color:#EA580C;background:rgba(234,88,12,.06);border-color:rgba(234,88,12,.16)}

/* Centro de control interactivo — exclusivo para Software PLC & SCADA */
.sp-capabilities-grid--visual { gap:16px; }
.sp-capabilities-grid--visual .sp-cap-card { isolation:isolate; min-height:354px; padding:0 24px 24px; display:flex; flex-direction:column; justify-content:flex-end; border-radius:10px; background:#0A1929; border-color:#1B3A52; color:#FFF; cursor:default; box-shadow:0 8px 22px rgba(4,22,36,.13); }
.sp-capabilities-grid--visual .sp-cap-card::before { z-index:4; height:2px; opacity:1; background:linear-gradient(90deg,#C2541A,#FF8A50 55%,transparent); }
.sp-capabilities-grid--visual .sp-cap-card > :not(.sp-cap-media):not(.sp-cap-visor) { position:relative; z-index:2; transition:color .35s ease,opacity .35s ease,transform .35s ease; }
.sp-cap-media { position:absolute; z-index:0; inset:0 0 auto; height:176px; opacity:1; background:var(--capability-image) center/cover no-repeat; transform:scale(1.01); transition:height .45s cubic-bezier(.2,.8,.2,1),filter .45s ease,transform .7s cubic-bezier(.2,.8,.2,1); }
.sp-cap-media::before { content:''; position:absolute; inset:0; background:linear-gradient(to bottom,rgba(4,22,36,.02) 34%,#0A1929 100%); }
.sp-cap-media::after { content:''; position:absolute; inset:0; opacity:.38; background:linear-gradient(90deg,rgba(194,84,26,.18) 1px,transparent 1px),linear-gradient(0deg,rgba(194,84,26,.12) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(to bottom,#000,transparent 82%); }
.sp-cap-visor { position:absolute; z-index:3; top:18px; right:17px; opacity:1; color:#FFD8BF; font-family:var(--font-mono,'JetBrains Mono',monospace); font-size:.6rem; font-weight:700; letter-spacing:.11em; text-shadow:0 1px 4px #05111D; }
.sp-capabilities-grid--visual .sp-cap-icon { position:absolute!important; z-index:3!important; top:142px; left:24px; width:42px; height:42px; margin:0; border:1px solid rgba(194,84,26,.5); background:#0A192F; color:#FF8A50; box-shadow:0 4px 14px rgba(0,0,0,.22); }
.sp-capabilities-grid--visual .sp-cap-card__title { color:#F8FAFC; margin-top:42px; font-size:1.14rem; letter-spacing:-.01em; }
.sp-capabilities-grid--visual .sp-cap-card__desc { color:#B7C8D6; margin-bottom:15px; }
.sp-capabilities-grid--visual .sp-cap-card__spec { color:#FF8A50; border-color:rgba(194,84,26,.35); background:rgba(194,84,26,.12); align-self:flex-start; }
.sp-capabilities-grid--visual .sp-cap-card:hover, .sp-capabilities-grid--visual .sp-cap-card:focus { transform:translateY(-8px); box-shadow:0 20px 40px rgba(4,28,50,.32); border-color:#C2541A; }
.sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-media, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-media { height:100%; filter:brightness(.48) saturate(1.08); transform:scale(1.05); }
.sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-icon, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-icon { background:rgba(194,84,26,.2); color:#FFF; backdrop-filter:blur(5px); }
.sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-card__title, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-card__title, .sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-card__desc, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-card__desc { color:#FFF; }
.sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-card__desc, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-card__desc { transform:translateY(-2px); }
.sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-card__spec, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-card__spec { color:#FFF; background:rgba(194,84,26,.45); border-color:rgba(255,138,80,.6); }
.sp-capabilities-grid--visual .sp-cap-card:hover .sp-cap-visor, .sp-capabilities-grid--visual .sp-cap-card:focus .sp-cap-visor { color:#FFF; }

/* Una capacidad puede habilitar su visor técnico mientras se completan las demás imágenes. */
.sp-cap-card--visual { isolation:isolate; min-height:354px; padding:0 24px 24px; display:flex; flex-direction:column; justify-content:flex-end; border-radius:10px; background:#0A1929; border-color:#1B3A52; color:#FFF; cursor:default; box-shadow:0 8px 22px rgba(4,22,36,.13); }
.sp-cap-card--visual::before { z-index:4; height:2px; opacity:1; background:linear-gradient(90deg,#C2541A,#FF8A50 55%,transparent); }
.sp-cap-card--visual > :not(.sp-cap-media):not(.sp-cap-visor) { position:relative; z-index:2; transition:color .35s ease,opacity .35s ease,transform .35s ease; }
.sp-cap-card--visual .sp-cap-icon { position:absolute!important; z-index:3!important; top:142px; left:24px; width:42px; height:42px; margin:0; border:1px solid rgba(194,84,26,.5); background:#0A192F; color:#FF8A50; box-shadow:0 4px 14px rgba(0,0,0,.22); }
.sp-cap-card--visual .sp-cap-card__title { color:#F8FAFC; margin-top:42px; font-size:1.14rem; letter-spacing:-.01em; }
.sp-cap-card--visual .sp-cap-card__desc { color:#B7C8D6; margin-bottom:15px; }
.sp-cap-card--visual .sp-cap-card__spec { color:#FF8A50; border-color:rgba(194,84,26,.35); background:rgba(194,84,26,.12); align-self:flex-start; }
.sp-cap-card--visual:hover, .sp-cap-card--visual:focus { transform:translateY(-8px); box-shadow:0 20px 40px rgba(4,28,50,.32); border-color:#C2541A; }
.sp-cap-card--visual:hover .sp-cap-media, .sp-cap-card--visual:focus .sp-cap-media { height:100%; filter:brightness(.48) saturate(1.08); transform:scale(1.05); }
.sp-cap-card--visual:hover .sp-cap-icon, .sp-cap-card--visual:focus .sp-cap-icon { background:rgba(194,84,26,.2); color:#FFF; backdrop-filter:blur(5px); }
.sp-cap-card--visual:hover .sp-cap-card__title, .sp-cap-card--visual:focus .sp-cap-card__title, .sp-cap-card--visual:hover .sp-cap-card__desc, .sp-cap-card--visual:focus .sp-cap-card__desc { color:#FFF; }
.sp-cap-card--visual:hover .sp-cap-card__desc, .sp-cap-card--visual:focus .sp-cap-card__desc { transform:translateY(-2px); }
.sp-cap-card--visual:hover .sp-cap-card__spec, .sp-cap-card--visual:focus .sp-cap-card__spec { color:#FFF; background:rgba(194,84,26,.45); border-color:rgba(255,138,80,.6); }
.sp-cap-card--visual:hover .sp-cap-visor, .sp-cap-card--visual:focus .sp-cap-visor { color:#FFF; }

/* ── Tech Strip ── */
.sp-tech-strip { background:#070E1A; padding:60px 28px; }
.sp-tech-strip__inner { max-width:1180px; margin:0 auto; }
.sp-tech-strip__eyebrow { font-family:var(--font-mono,'JetBrains Mono',monospace); font-size:.7rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#FF8A50; text-align:center; display:block; margin-bottom:32px; }
.sp-tech-badges { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.sp-tech-badge { display:inline-flex; align-items:center; gap:7px; font-family:var(--font-mono,'JetBrains Mono',monospace); font-size:.77rem; font-weight:600; color:rgba(255,255,255,.78); background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.1); border-radius:6px; padding:9px 15px; transition:all .22s; cursor:default; }
.sp-tech-badge:hover { background:rgba(194,84,26,.12); border-color:rgba(194,84,26,.35); color:#FF8A50; transform:translateY(-2px); }
.sp-tech-badge__dot { width:5px;height:5px;border-radius:50%;background:#C2541A;flex-shrink:0; }

/* Carrusel de marcas — Software PLC & SCADA */
.sp-tech-strip--brands { padding:54px 0; overflow:hidden; background:linear-gradient(110deg,#071321,#0B2133); }
.sp-brand-carousel { max-width:1180px; margin:0 auto; }
.sp-brand-carousel__viewport { position:relative; overflow:hidden; padding:6px 0; }
.sp-brand-carousel__viewport::before,.sp-brand-carousel__viewport::after { content:''; position:absolute; z-index:2; top:0; bottom:0; width:80px; pointer-events:none; }
.sp-brand-carousel__viewport::before { left:0; background:linear-gradient(90deg,#071321,transparent); }
.sp-brand-carousel__viewport::after { right:0; background:linear-gradient(-90deg,#0B2133,transparent); }
.sp-brand-carousel__track { display:flex; width:max-content; align-items:center; animation:sp-brand-marquee 28s linear infinite; }
.sp-brand-carousel__item { width:190px; height:76px; margin:0 9px; padding:18px 25px; display:flex; align-items:center; justify-content:center; background:#FFF; border:1px solid rgba(255,255,255,.14); border-radius:7px; box-shadow:0 8px 18px rgba(0,0,0,.18); }
.sp-brand-carousel__item img { display:block; max-width:100%; max-height:38px; object-fit:contain; }
.sp-brand-carousel__viewport:hover .sp-brand-carousel__track { animation-play-state:paused; }
@keyframes sp-brand-marquee { to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce) { .sp-brand-carousel__track { animation:none; } }

/* ── Applications ── */
.sp-applications-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:16px; }
.sp-app-item { display:flex; align-items:center; gap:14px; background:#fff; border:1px solid rgba(14,30,64,.07); border-radius:10px; padding:18px 20px; font-size:.9rem; font-weight:600; color:#1E3A5F; box-shadow:0 1px 6px rgba(0,0,0,.04); transition:all .22s; }
.sp-app-item:hover { border-color:rgba(194,84,26,.3); box-shadow:0 4px 16px rgba(194,84,26,.1); transform:translateY(-2px); }
.sp-app-item__icon { font-size:1.5rem; flex-shrink:0; }

/* ── Closing CTA ── */
.sp-closing-cta { background:linear-gradient(135deg,#060D1C 0%,#0C1B34 55%,#060D1C 100%); border-radius:20px; padding:60px 52px; text-align:center; max-width:860px; margin:0 auto; border:1px solid rgba(194,84,26,.25); box-shadow:0 0 60px rgba(0,0,0,.4),inset 0 1px 0 rgba(194,84,26,.2); position:relative; overflow:hidden; }
.sp-closing-cta::before { content:''; position:absolute; top:0;left:15%;right:15%; height:1.5px; background:linear-gradient(90deg,transparent,#C2541A,transparent); }
.sp-closing-cta__eyebrow { font-family:var(--font-mono,'JetBrains Mono',monospace); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:#FF8A50; display:block; margin-bottom:16px; }
.sp-closing-cta__title { font-family:var(--font-heading,'Barlow',sans-serif); font-size:clamp(1.5rem,3vw,2.1rem); font-weight:800; color:#F1F5F9; margin:0 0 14px; line-height:1.2; }
.sp-closing-cta__desc { font-size:1rem; color:#94A3B8; line-height:1.72; margin:0 auto 38px; max-width:540px; }
.sp-closing-cta__actions { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; align-items:center; }
.sp-closing-cta__link { font-size:.88rem; color:rgba(255,255,255,.5); text-decoration:none; transition:color .2s; display:inline-flex; align-items:center; gap:4px; }
.sp-closing-cta__link:hover { color:#FF8A50; }

/* ── WhatsApp Float ── */
.sp-wa-float { position:fixed; bottom:28px; right:28px; z-index:9999; width:60px; height:60px; border-radius:50%; background:#25D366; box-shadow:0 4px 22px rgba(37,211,102,.48); display:flex; align-items:center; justify-content:center; text-decoration:none; transition:all .3s; animation:sp-wa-bob 3.5s ease-in-out infinite; }
.sp-wa-float:hover { transform:scale(1.13); box-shadow:0 8px 32px rgba(37,211,102,.65); animation:none; }
.sp-wa-float svg { width:32px;height:32px;fill:#fff; }
.sp-wa-float__label { position:absolute; right:70px; background:#0F1923; color:#fff; font-size:.78rem; font-weight:600; white-space:nowrap; padding:8px 14px; border-radius:8px; pointer-events:none; opacity:0; transform:translateX(8px); transition:all .25s; border:1px solid rgba(255,255,255,.1); }
.sp-wa-float__label::after { content:''; position:absolute; right:-5px; top:50%; transform:translateY(-50%); border:5px solid transparent; border-right:none; border-left-color:#0F1923; }
.sp-wa-float:hover .sp-wa-float__label { opacity:1; transform:translateX(0); }
@keyframes sp-wa-bob {
  0%,100%{transform:translateY(0);box-shadow:0 4px 22px rgba(37,211,102,.48)}
  50%{transform:translateY(-5px);box-shadow:0 10px 30px rgba(37,211,102,.58)}
}

/* ── Spec Table ── */
.sp-spec-table{width:100%;border-collapse:collapse;font-size:.9rem;border-radius:10px;overflow:hidden;box-shadow:0 1px 8px rgba(0,0,0,.06)}
.sp-spec-table thead th{background:#0A1628;color:#E2E8F0;font-family:var(--font-mono,'JetBrains Mono',monospace);font-size:.72rem;font-weight:600;text-align:left;padding:13px 18px;text-transform:uppercase;letter-spacing:.08em}
.sp-spec-table tbody td{padding:12px 18px;border-bottom:1px solid rgba(0,0,0,.05);color:#334155;vertical-align:top;line-height:1.55}
.sp-spec-table tbody tr:nth-child(even) td{background:#F8FAFD}
.sp-spec-table tbody tr:last-child td{border-bottom:none}
.sp-spec-table tbody td:first-child{font-weight:700;color:#0A192F;white-space:nowrap}

/* ── Responsive ── */
@media(max-width:920px){.sp-capabilities-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){
  .sp-hero{min-height:72vh;padding-top:96px}
  .sp-hero__content{padding:40px 20px 64px}
  .sp-capabilities-grid{grid-template-columns:1fr}
  .sp-closing-cta{padding:38px 22px;border-radius:14px}
  .sp-btn--cta,.sp-btn--ghost{width:100%;justify-content:center}
  .sp-hero__actions{flex-direction:column;align-items:stretch}
  .sp-applications-grid{grid-template-columns:1fr 1fr}
  .sp-tech-strip{padding:44px 20px}
  .sp-feature-split{min-height:520px;align-items:flex-end}
  .sp-feature-split__image{width:100%;background-position:60% center}
  .sp-feature-split__fade{background:linear-gradient(180deg,rgba(7,19,33,.05) 20%,rgba(7,19,33,.72) 55%,#071321 100%)}
  .sp-feature-split__content{width:auto;margin:0;padding:42px 24px}
  .sp-feature-split h2{font-size:clamp(1.9rem,9vw,2.65rem);line-height:1.06}
  .sp-hero__video{object-position:58% center}
}
@media(max-width:420px){.sp-applications-grid{grid-template-columns:1fr}}

/* ── Interactive 3D Model Viewer Component ──────────────────── */
.sp-viewer-3d-wrap {
  margin: 36px 0;
  background: #0B1322;
  border: 1px solid rgba(0, 217, 255, 0.22);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(5, 10, 20, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.sp-viewer-switcher {
  display: flex;
  background: #060D1A;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 8px 12px;
  gap: 8px;
  overflow-x: auto;
}

.sp-viewer-switch-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #94A3B8;
  font-family: var(--font-heading, 'Barlow', sans-serif);
  font-size: 0.85rem;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.sp-viewer-switch-btn:hover {
  background: rgba(194, 84, 26, 0.15);
  color: #FFFFFF;
  border-color: rgba(194, 84, 26, 0.4);
}

.sp-viewer-switch-btn.active {
  background: #C2541A;
  color: #FFFFFF;
  border-color: #EA580C;
  box-shadow: 0 0 14px rgba(194, 84, 26, 0.4);
}

.sp-viewer-pane {
  display: none;
  width: 100%;
  position: relative;
}

.sp-viewer-pane.active {
  display: block;
}

.sp-model-box {
  width: 100%;
  height: 480px;
  position: relative;
  background: radial-gradient(circle at center, #132238 0%, #080E1A 100%);
}

.sp-model-box model-viewer {
  width: 100%;
  height: 100%;
  --poster-color: transparent;
  outline: none;
}

.sp-viewer-topbar {
  position: absolute;
  top: 14px;
  left: 14px;
  right: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  z-index: 10;
  pointer-events: none;
}

.sp-viewer-hint {
  pointer-events: auto;
  background: rgba(8, 14, 26, 0.85);
  border: 1px solid rgba(194, 84, 26, 0.35);
  padding: 6px 14px;
  border-radius: 999px;
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 0.72rem;
  color: #FF8A50;
  display: flex;
  align-items: center;
  gap: 8px;
  backdrop-filter: blur(8px);
}

.sp-viewer-hint-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #C2541A;
  box-shadow: 0 0 8px #C2541A;
  animation: sp-dot-pulse 2s infinite;
}

.sp-viewer-presets {
  pointer-events: auto;
  display: flex;
  gap: 6px;
  background: rgba(8, 14, 26, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 4px;
  border-radius: 8px;
  backdrop-filter: blur(8px);
}

.sp-camera-btn {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #94A3B8;
  font-family: var(--font-heading, 'Barlow', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s;
}

.sp-camera-btn:hover {
  background: rgba(194, 84, 26, 0.18);
  color: #FFFFFF;
  border-color: rgba(194, 84, 26, 0.4);
}

.sp-camera-btn.active {
  background: #C2541A;
  color: #FFFFFF;
  border-color: #EA580C;
}

.sp-viewer-toolbar {
  position: absolute;
  bottom: 14px;
  left: 14px;
  right: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  background: rgba(8, 14, 26, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  padding: 8px 14px;
  backdrop-filter: blur(12px);
  z-index: 10;
}

.sp-viewer-tools-left {
  display: flex;
  gap: 8px;
  align-items: center;
}

.sp-tool-btn {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #E2E8F0;
  padding: 6px 12px;
  border-radius: 6px;
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 0.72rem;
  cursor: pointer;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.sp-tool-btn:hover {
  background: rgba(255, 255, 255, 0.16);
  color: #FFFFFF;
  border-color: rgba(255, 255, 255, 0.25);
}

.sp-viewer-external-link {
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 0.72rem;
  color: #FF8A50;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color 0.2s;
}

.sp-viewer-external-link:hover {
  color: #FF6600;
  text-decoration: underline;
}

#pane-photo {
  background: radial-gradient(circle at center, #132238 0%, #080E1A 100%);
  display: none;
  justify-content: center;
  align-items: center;
  height: 480px;
  position: relative;
  overflow: hidden;
}

#pane-photo.active {
  display: flex;
}

.sp-photo-pane-img {
  max-width: 100%;
  max-height: 480px;
  width: auto;
  height: 100%;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}

@media (max-width: 640px) {
  .sp-model-box {
    height: 380px;
  }
  #pane-photo {
    height: 380px;
  }
  .sp-photo-pane-img {
    max-height: 380px;
  }
  .sp-viewer-presets {
    display: none;
  }
}



/* ============================================================
   SERVICE DECISION CONTENT — Corporate Industrial Standard
   Pro AIC Automatización · Guías de Decisión, Alcance y Cotización
   ============================================================ */

.service-decision-content {
  color: #334155;
  background: #FFFFFF;
}

.service-decision-content .sp-section {
  padding: 80px 0;
  position: relative;
}

.service-decision-content .sp-section--alt {
  background: #F8FAFD;
}

.service-decision-content h2,
.service-decision-content h3 {
  font-family: var(--font-heading, 'Barlow', sans-serif);
  color: #0A192F;
}

.service-decision-content h2 {
  font-size: clamp(1.75rem, 3.2vw, 2.35rem);
  font-weight: 800;
  line-height: 1.18;
  margin-bottom: 16px;
  letter-spacing: -0.02em;
}

.service-decision-content h3 {
  font-size: 1.18rem;
  font-weight: 700;
  line-height: 1.35;
  margin-bottom: 10px;
}

.service-decision-content p {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 1.02rem;
  line-height: 1.72;
  color: #475569;
  max-width: 85ch;
  margin-bottom: 20px;
}

.service-decision-content a:not(.btn):not(.sp-btn--cta) {
  color: #1E3A8A;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.service-decision-content a:not(.btn):not(.sp-btn--cta):hover {
  color: #2563EB;
  text-decoration: none;
}

.service-decision-content .sp-section {
  position: relative;
  background-color: #FFFFFF;
}

.service-decision-content .sp-section--alt {
  background-color: #F8FAFD;
  background-image: radial-gradient(rgba(30, 58, 138, 0.06) 1px, transparent 1px);
  background-size: 24px 24px;
}

.service-decision-content .sp-section__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #1E3A8A;
  background: rgba(30, 58, 138, 0.08);
  border: 1px solid rgba(30, 58, 138, 0.22);
  border-radius: 6px;
  padding: 5px 14px;
  margin-bottom: 16px;
}

.service-decision-content .sp-section__eyebrow::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #1E3A8A;
  box-shadow: 0 0 8px rgba(30, 58, 138, 0.5);
  animation: sp-dot-pulse 2.4s ease-in-out infinite;
  flex-shrink: 0;
}

/* Callout Note / Scope Context */
.service-decision-note {
  background: linear-gradient(135deg, #F8FAFD 0%, #F1F5F9 100%);
  border-left: 4px solid #1E3A8A;
  border-radius: 0 12px 12px 0;
  padding: 20px 26px;
  margin: 32px 0;
  font-size: 0.98rem;
  color: #334155;
  line-height: 1.65;
  box-shadow: 0 2px 12px rgba(10, 25, 47, 0.03);
}

.service-decision-note p:last-child {
  margin-bottom: 0;
}

/* Decision Grid (Needs / Pain Points) */
.service-decision-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 36px;
}

.service-decision-card,
.service-decision-grid article {
  position: relative;
  padding: 36px 32px 32px;
  background: #FFFFFF;
  border: 1px solid rgba(14, 30, 64, 0.08);
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(10, 25, 47, 0.03);
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.service-decision-card::before,
.service-decision-grid article::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #162B4D 0%, #1E3A8A 60%, transparent 100%);
  opacity: 0.85;
  transition: all 0.35s ease;
}

.service-decision-card:hover,
.service-decision-grid article:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(30, 58, 138, 0.1), 0 2px 8px rgba(10, 25, 47, 0.04);
  border-color: rgba(30, 58, 138, 0.3);
}

.service-decision-card:hover::before,
.service-decision-grid article:hover::before {
  opacity: 1;
  height: 4px;
  background: linear-gradient(90deg, #162B4D 0%, #1E3A8A 50%, #2563EB 100%);
}

.service-decision-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.09) 0%, rgba(37, 99, 235, 0.03) 100%);
  border: 1px solid rgba(30, 58, 138, 0.18);
  color: #1E3A8A;
  margin-bottom: 22px;
  font-size: 1.35rem;
  flex-shrink: 0;
  transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease, color 0.3s ease;
}

.service-decision-card:hover .service-decision-card-icon,
.service-decision-grid article:hover .service-decision-card-icon {
  transform: scale(1.08) rotate(3deg);
  background: #1E3A8A;
  border-color: #1E3A8A;
  color: #FFFFFF;
  box-shadow: 0 6px 18px rgba(30, 58, 138, 0.28);
}

.service-decision-card h3,
.service-decision-grid article h3 {
  font-size: 1.22rem;
  font-weight: 700;
  color: #0A192F;
  margin-bottom: 12px;
}

.service-decision-card p,
.service-decision-grid article p {
  color: #64748B;
  font-size: 0.98rem;
  line-height: 1.65;
  margin-bottom: 0;
}

/* Service Decision Lists (Checklist & Deliverables) */
.service-decision-list {
  list-style: none;
  padding: 0;
  margin: 32px 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.service-decision-list.service-decision-list--grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.service-decision-list li {
  position: relative;
  padding: 18px 22px 18px 56px;
  background: #FFFFFF;
  border: 1px solid rgba(14, 30, 64, 0.08);
  border-radius: 12px;
  font-size: 0.98rem;
  line-height: 1.62;
  color: #334155;
  box-shadow: 0 2px 10px rgba(10, 25, 47, 0.02);
  transition: all 0.28s ease;
}

.service-decision-list li:hover {
  background: #FFFFFF;
  border-color: rgba(30, 58, 138, 0.3);
  box-shadow: 0 8px 24px rgba(30, 58, 138, 0.08);
  transform: translateX(4px);
}

.service-decision-list li::before {
  content: '';
  position: absolute;
  top: 18px;
  left: 18px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(30, 58, 138, 0.08) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E3A8A' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E") center center/13px no-repeat;
  border: 1px solid rgba(30, 58, 138, 0.2);
  transition: all 0.28s ease;
}

.service-decision-list li:hover::before {
  background-color: #1E3A8A;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  border-color: #1E3A8A;
  box-shadow: 0 2px 10px rgba(30, 58, 138, 0.32);
  transform: scale(1.08);
}

.service-decision-list li strong {
  color: #0A192F;
  font-weight: 700;
}

/* Service Decision Steps (Execution Methodology with Watermark & Illuminated Corporate Navy Badge) */
.service-decision-steps {
  list-style: none;
  padding: 0;
  margin: 40px 0 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
}

.service-decision-step-item,
.service-decision-steps li {
  position: relative;
  padding: 32px 22px 26px;
  background: #FFFFFF;
  border: 1px solid rgba(14, 30, 64, 0.08);
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(10, 25, 47, 0.03);
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.service-decision-step-item::before,
.service-decision-steps li::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #162B4D 0%, #1E3A8A 50%, #2563EB 100%);
  opacity: 0.8;
  transition: all 0.3s ease;
}

.service-decision-step-item:hover,
.service-decision-steps li:hover {
  transform: translateY(-6px);
  border-color: rgba(30, 58, 138, 0.32);
  box-shadow: 0 18px 40px rgba(30, 58, 138, 0.12);
}

.service-decision-step-item:hover::before,
.service-decision-steps li:hover::before {
  opacity: 1;
  height: 4px;
}

/* Watermark step number in background */
.service-decision-step-watermark {
  position: absolute;
  top: 10px;
  right: 14px;
  font-family: var(--font-heading, 'Barlow', sans-serif);
  font-size: 3.2rem;
  font-weight: 900;
  line-height: 1;
  color: rgba(30, 58, 138, 0.06);
  pointer-events: none;
  user-select: none;
  transition: all 0.35s ease;
  letter-spacing: -0.04em;
}

.service-decision-step-item:hover .service-decision-step-watermark,
.service-decision-steps li:hover .service-decision-step-watermark {
  color: rgba(30, 58, 138, 0.16);
  transform: scale(1.08) translateY(-2px);
}

.service-decision-step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  background: linear-gradient(135deg, #162B4D 0%, #1E3A8A 100%);
  color: #FFFFFF;
  border: 1px solid rgba(59, 130, 246, 0.35);
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  margin-bottom: 20px;
  box-shadow: 0 4px 14px rgba(30, 58, 138, 0.28);
  align-self: flex-start;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.service-decision-step-item:hover .service-decision-step-badge,
.service-decision-steps li:hover .service-decision-step-badge {
  background: linear-gradient(135deg, #1E3A8A 0%, #2563EB 100%);
  color: #FFFFFF;
  border-color: #60A5FA;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35);
  transform: scale(1.08);
}

.service-decision-step-item h3,
.service-decision-steps li h3 {
  font-family: var(--font-heading, 'Barlow', sans-serif);
  font-size: 1.12rem;
  font-weight: 700;
  color: #0A192F;
  margin-bottom: 10px;
  line-height: 1.3;
}

.service-decision-step-item p,
.service-decision-steps li p {
  color: #64748B;
  font-size: 0.92rem;
  line-height: 1.6;
  margin-bottom: 0;
}

/* Quotation Box / Action Card */
.service-decision-quote-card {
  background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFD 100%);
  border: 1px solid rgba(14, 30, 64, 0.1);
  border-radius: 20px;
  padding: 48px 44px;
  box-shadow: 0 12px 36px rgba(10, 25, 47, 0.05);
  position: relative;
  overflow: hidden;
}

.service-decision-quote-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #162B4D 0%, #1E3A8A 50%, #2563EB 100%);
}

.service-decision-quote-footer {
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid rgba(14, 30, 64, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 22px;
}

.service-decision-quote-note {
  font-size: 0.95rem;
  color: #64748B;
  max-width: 620px;
  margin-bottom: 0;
  line-height: 1.65;
}

/* Service Decision FAQ (Interactive Accordions) */
.service-decision-faq {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 40px;
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}

.service-decision-faq-item {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 14px;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 2px 10px rgba(10, 25, 47, 0.02);
}

.service-decision-faq-item:hover {
  border-color: rgba(30, 58, 138, 0.3);
  box-shadow: 0 8px 24px rgba(30, 58, 138, 0.07);
}

.service-decision-faq-item[open] {
  border-color: #1E3A8A;
  box-shadow: 0 12px 32px rgba(30, 58, 138, 0.1);
}

.service-decision-faq-trigger {
  padding: 22px 28px;
  cursor: pointer;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px;
  user-select: none;
  list-style: none !important;
  list-style-type: none !important;
  background: transparent;
  transition: background 0.25s ease;
  width: 100%;
  box-sizing: border-box;
}

.service-decision-faq-trigger::-webkit-details-marker,
.service-decision-faq-trigger::marker {
  display: none !important;
  content: "" !important;
}

.service-decision-faq-trigger:hover {
  background: rgba(248, 250, 253, 0.85);
}

.service-decision-faq-item[open] .service-decision-faq-trigger {
  background: rgba(30, 58, 138, 0.04);
  border-bottom: 1px solid rgba(30, 58, 138, 0.1);
}

.service-decision-faq-trigger h3 {
  font-family: var(--font-heading, 'Barlow', sans-serif);
  font-size: 1.15rem;
  font-weight: 700;
  color: #0A192F;
  margin: 0;
  line-height: 1.35;
  flex: 1;
  text-align: left;
}

.service-decision-faq-item[open] .service-decision-faq-trigger h3 {
  color: #0A192F;
}

.faq-toggle-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 50%;
  background: #F1F5F9;
  color: #64748B;
  border: 1px solid #E2E8F0;
  flex-shrink: 0;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-toggle-icon svg {
  width: 16px;
  height: 16px;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.service-decision-faq-item:hover .faq-toggle-icon {
  background: rgba(30, 58, 138, 0.09);
  border-color: rgba(30, 58, 138, 0.25);
  color: #1E3A8A;
  transform: scale(1.06);
}

.service-decision-faq-item[open] .faq-toggle-icon {
  background: linear-gradient(135deg, #162B4D 0%, #1E3A8A 100%);
  border-color: #1E3A8A;
  color: #FFFFFF;
  box-shadow: 0 4px 14px rgba(30, 58, 138, 0.3);
}

.service-decision-faq-item[open] .faq-toggle-icon svg {
  transform: rotate(180deg);
}

.faq-content {
  padding: 24px 28px 26px;
  background: #FFFFFF;
  animation: faqSlideDown 0.3s ease-out;
}

@keyframes faqSlideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.faq-content p {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.98rem;
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.service-decision-closing {
  border-top: 3px solid #1E3A8A;
}

.service-decision-content .sp-btn--cta {
  white-space: normal;
  text-align: center;
}

[data-service-closing] .diagnostic-banner-actions .btn {
  white-space: normal;
  text-align: center;
  max-width: 100%;
}

/* Responsive adjustments */
@media (max-width: 1100px) {
  .service-decision-steps {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .service-decision-grid {
    grid-template-columns: 1fr;
  }
  .service-decision-list.service-decision-list--grid {
    grid-template-columns: 1fr;
  }
  .service-decision-steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .service-decision-quote-card {
    padding: 36px 28px;
  }
  .service-decision-quote-footer {
    flex-direction: column;
    align-items: stretch;
  }
  .service-decision-quote-footer .btn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .service-decision-content .sp-section {
    padding: 56px 0;
  }
  .service-decision-card,
  .service-decision-grid article {
    padding: 26px 22px;
  }
  .service-decision-steps {
    grid-template-columns: 1fr;
  }
  .service-decision-faq-trigger {
    padding: 18px 20px;
  }
  .faq-content {
    padding: 18px 20px 22px;
  }
}