/* ============================================================
   Fortress Continuity Group — premium.css
   Capa visual "Fortress Premium" (aprobada 2026-10-24):
   fondo fotográfico, tarjetas de vidrio, íconos 3D, degradados.
   Se enlaza DESPUÉS de guia.css para prevalecer sobre style.css.
   No cambia estructura, textos, enlaces ni funcionalidad.
   ============================================================ */
:root{
  --fp-deep:#06182e;
  --fp-cyan:#00bcd4;
  --fp-cyan-l:#6ee7f9;
  --fp-line:rgba(110,231,249,.30);
  --fp-muted:#a9c3da;
  --fp-glass-a:rgba(23,47,78,.88);
  --fp-glass-b:rgba(9,23,42,.93);
}

body{
  background:linear-gradient(180deg,#081c33 0%,#0b1e36 34%,#07182c 100%);
  color:#dbe7f3;
}

/* ---------- Header ---------- */
.header{
  background:rgba(7,20,38,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(110,231,249,.22);
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.nav-links a:hover{ color:var(--fp-cyan-l); }

/* ---------- Hero fotográfico ---------- */
.hero{
  background:linear-gradient(100deg, rgba(4,13,26,.88) 28%, rgba(4,13,26,.45) 62%, rgba(4,13,26,.66) 100%),
             url('hero-bg.jpg') center/cover no-repeat;
  padding:110px 50px 120px;
}
.kicker{ color:var(--fp-cyan-l); text-transform:uppercase; font-size:15px; letter-spacing:3px; }
.hero h1{ font-size:54px; font-weight:800; text-shadow:0 4px 30px rgba(0,0,0,.45); }
.hero h1 [data-i18n="heroTitle2"]{
  background:linear-gradient(92deg,#8df3ff 0%,#22c8e8 55%,#0090b8 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
.hero p{ font-size:16px; color:#d7e6f5; max-width:560px; }

/* ---------- Botones ---------- */
.btn-primary{
  background:linear-gradient(92deg,#3fe3f7,#00a9ce);
  color:#04263b;
  box-shadow:0 10px 28px rgba(0,188,212,.38);
}
.btn-primary:hover{ opacity:1; filter:brightness(1.07); }
.btn-secondary{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(110,231,249,.55);
  color:#eaf7ff;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.hero-badge{
  background:rgba(8,24,44,.66);
  border:1px solid var(--fp-line);
  padding:8px 14px; border-radius:999px;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  color:#cfe6f7;
}
.hero-badge i{ color:var(--fp-cyan-l); }

/* ---------- Titulares de sección sobre fondo oscuro ---------- */
.section-head h2, .assessment-content h2, .why-us-center h2{ color:#fff; }
.section-head p, .assessment-content p{ color:var(--fp-muted); }

/* ---------- Video ---------- */
.video-section{
  background:linear-gradient(180deg, rgba(4,13,26,.88), rgba(4,13,26,.94)),
             url('hero-bg.jpg') center 28%/cover no-repeat;
}
.video-section h2{ color:#fff; }
.video-section video{
  border:1px solid var(--fp-line); border-radius:18px;
  box-shadow:0 24px 60px rgba(0,0,0,.45);
}

/* ---------- Servicios: fondo fotográfico + vidrio + íconos 3D ---------- */
.services-section{
  background:linear-gradient(180deg, rgba(4,13,26,.80), rgba(4,13,26,.90)),
             url('services-bg.jpg') center 38%/cover no-repeat;
  padding:56px 50px;
}
.services-grid{ gap:12px; align-items:stretch; align-content:start; }
.service-card{
  position:relative; overflow:hidden; height:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"icon title" "icon list";
  column-gap:16px; row-gap:2px; align-content:start;
  background:linear-gradient(165deg, rgba(30,58,96,.52), rgba(8,20,38,.66));
  border:1px solid rgba(110,231,249,.38); border-radius:16px;
  box-shadow:0 14px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -18px 30px rgba(0,188,212,.05);
  backdrop-filter:blur(12px) saturate(1.25);
  -webkit-backdrop-filter:blur(12px) saturate(1.25);
  padding:18px 16px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 42%);
}
.service-card::after{
  content:""; position:absolute; top:-46px; left:-30px; width:190px; height:150px; pointer-events:none;
  background:radial-gradient(closest-side, rgba(0,188,212,.20), rgba(0,188,212,0));
}
.service-card:hover{
  transform:translateY(-6px);
  border-color:rgba(110,231,249,.65);
  box-shadow:0 26px 54px rgba(0,0,0,.5), 0 12px 34px rgba(0,188,212,.18);
}
.card-icon{
  grid-area:icon;
  width:98px; height:98px; border-radius:20px;
  background-color:#0c1e33; background-size:cover; background-position:center;
  border:1px solid rgba(110,231,249,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15), 0 8px 18px rgba(0,0,0,.35), 0 0 26px rgba(0,188,212,.28);
  margin-bottom:0;
  position:relative; z-index:1;
  align-self:start;
}
.card-icon i{ display:none; }
.services-grid .service-card:nth-child(1) .card-icon{ background-image:url('icon-soporte.jpg'); }
.services-grid .service-card:nth-child(2) .card-icon{ background-image:url('icon-respaldo.jpg'); }
.services-grid .service-card:nth-child(3) .card-icon{ background-image:url('icon-seguridad.jpg'); }
.services-grid .service-card:nth-child(4) .card-icon{ background-image:url('icon-servidor.jpg'); }
.services-grid .service-card:nth-child(5) .card-icon{ background-image:url('icon-monitoreo.jpg'); }
.service-card h3{ grid-area:title; color:#fff; font-size:15.5px; min-height:0; min-width:0; overflow-wrap:break-word; margin-bottom:6px; align-self:start; padding-top:2px; position:relative; z-index:1; }
.service-card ul{ grid-area:list; position:relative; z-index:1; min-width:0; }
.service-card li{ color:#c9dcee; font-size:12.5px; margin-bottom:6px; min-width:0; overflow-wrap:break-word; }
.service-card li i{ color:var(--fp-cyan-l); }

/* ---------- Evaluación gratuita ---------- */
.assessment-section{
  background:linear-gradient(180deg, rgba(4,13,26,.90), rgba(4,13,26,.94)),
             url('hero-bg.jpg') center 78%/cover no-repeat;
}
.assessment-container{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg, rgba(30,58,96,.50), rgba(8,20,38,.64));
  border:1px solid rgba(110,231,249,.38); border-radius:20px;
  box-shadow:0 18px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -18px 30px rgba(0,188,212,.05);
  backdrop-filter:blur(12px) saturate(1.25);
  -webkit-backdrop-filter:blur(12px) saturate(1.25);
}
.assessment-container::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 42%);
}
.assessment-visual img{
  width:100%; max-width:360px; display:block; margin:0 auto;
  border-radius:20px; border:1px solid rgba(110,231,249,.35);
  box-shadow:0 14px 30px rgba(0,0,0,.4), 0 0 30px rgba(0,188,212,.25);
  position:relative; z-index:1;
}
.assessment-content, .assessment-includes{ position:relative; z-index:1; }
.assessment-includes h4{ color:#fff; }
.assessment-includes li{ color:#c9dcee; }

/* ---------- Por qué nosotros ---------- */
.why-us-section{
  background:linear-gradient(160deg, rgba(6,20,38,.84), rgba(4,13,26,.92)),
             url('services-bg.jpg') center 62%/cover no-repeat;
}
.feature-icon{
  width:62px; height:62px; border-radius:18px; flex:none;
  background-color:#0c1e33; background-size:cover; background-position:center;
  border:1px solid rgba(110,231,249,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15), 0 8px 18px rgba(0,0,0,.35), 0 0 22px rgba(0,188,212,.22);
}
.feature-icon i{ display:none; }
.why-us-right .feature-item:nth-child(1) .feature-icon{ background-image:url('icon-riesgo.jpg'); }
.why-us-right .feature-item:nth-child(2) .feature-icon{ background-image:url('icon-reloj.jpg'); }
.why-us-right .feature-item:nth-child(3) .feature-icon{ background-image:url('icon-usuario.jpg'); }
.why-us-right .feature-item:nth-child(4) .feature-icon{ background-image:url('icon-equipo.jpg'); }
.feature-item p{ color:var(--fp-muted); }
.why-us-logo{ filter:drop-shadow(0 12px 28px rgba(0,188,212,.25)); }

/* ---------- Banner de enfoque ---------- */
.testimonial-banner{
  background:linear-gradient(100deg, rgba(4,13,26,.85), rgba(4,13,26,.55)),
             url('hero-bg.jpg') center 72%/cover no-repeat;
}
.quote-text{ color:#fff; }
.quote-author{ color:var(--fp-cyan-l); }
.badge{
  background:linear-gradient(165deg, rgba(30,58,96,.50), rgba(8,20,38,.62));
  border:1px solid rgba(110,231,249,.38);
  border-radius:14px;
  padding:12px 12px 10px;
  color:#e6f4ff; font-size:12.5px;
  backdrop-filter:blur(10px) saturate(1.25);
  -webkit-backdrop-filter:blur(10px) saturate(1.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.3);
}
.badge i{ display:none; }
.badge::before{
  content:""; display:block; width:46px; height:46px; margin:0 auto 8px;
  border-radius:13px; background-size:cover; background-position:center;
  background-color:#0c1e33; border:1px solid rgba(110,231,249,.35);
  box-shadow:0 0 18px rgba(0,188,212,.25);
}
.trust-badges .badge:nth-child(1)::before{ background-image:url('icon-seguridad.jpg'); }
.trust-badges .badge:nth-child(2)::before{ background-image:url('icon-respaldo.jpg'); }
.trust-badges .badge:nth-child(3)::before{ background-image:url('icon-soporte.jpg'); }

/* ---------- Guía $19 ---------- */
.guia-section{
  background:linear-gradient(180deg, rgba(4,13,26,.90), rgba(4,13,26,.95)),
             url('hero-bg.jpg') center 88%/cover no-repeat;
}
.guia-hero h2{ color:#fff; }
.guia-hero p.lead{ color:#c9dcee; }
.guia-benefits li{ color:#dbe7f3; }
.guia-toc{
  background:rgba(13,30,52,.88);
  border:1px solid var(--fp-line);
}
.guia-toc h3{ color:#fff; }
.guia-toc ol{ color:#c9dcee; }
.guia-toc .toc-note{ color:#8fb0c9; }
.guia-precio{
  background:linear-gradient(165deg,var(--fp-glass-a),var(--fp-glass-b));
  border:1px solid rgba(110,231,249,.5);
}
.guia-autor .avatar{
  border-radius:18px;
  background-color:#0c1e33;
  background-image:url('icon-seguridad.jpg');
  background-size:cover; background-position:center;
  border:1px solid rgba(110,231,249,.35);
  box-shadow:0 0 22px rgba(0,188,212,.25);
}
.guia-autor .avatar i{ display:none; }
.guia-precio .monto{ color:#fff; }
.guia-precio .monto small, .guia-precio p, .guia-nota{ color:var(--fp-muted); }

/* ---------- Contacto ---------- */
.contact-section{
  background:linear-gradient(180deg, rgba(4,13,26,.92), rgba(3,10,20,.97)),
             url('services-bg.jpg') center 85%/cover no-repeat;
}
.contact-info p{ color:#dbe7f3; }
.contact-info a{ color:#fff; border-bottom-color:var(--fp-cyan-l); }
.contact-ready{ color:#fff; }
.contact-services{ color:#8fb0c9; }
.contact-form{
  background:rgba(13,30,52,.88);
  border:1px solid var(--fp-line);
}
.contact-form label{ color:#eaf4ff; }
.contact-form input, .contact-form textarea{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(110,231,249,.28);
  color:#fff;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{ color:#a8c2d8; }
.form-note{ color:#8fb0c9; }

/* ---------- Footer ---------- */
.footer{ background:#050f1e; border-top:1px solid rgba(110,231,249,.18); }

/* ---------- Ajustes v7 (revisión de Jhon en laptop, 2026-10-24) ---------- */
/* Our Approach: tres marcos del mismo tamaño, simétricos */
.trust-badges{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px; align-items:stretch;
}
.badge{
  height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  text-align:center;
}
/* Guía: la caja del precio con el mismo ancho que la tarjeta del autor */
.guia-precio{ max-width:none; width:100%; margin-left:0; margin-right:0; }
/* Línea de LinkedIn en la tarjeta del autor de la guía */
.guia-autor-linkedin{ margin-top:12px; font-size:13.5px; }
.guia-autor-linkedin i{ color:var(--fp-cyan-l); margin-right:6px; }
.guia-autor-linkedin a{ color:#cfe6f7; text-decoration:none; border-bottom:1px solid rgba(110,231,249,.4); }
/* Botón flotante del chat: ícono 3D, sin el glifo plano */
#fcg-a-btn{
  background:#0c1e33 url('icon-chat.jpg') center/cover no-repeat;
  border:1px solid rgba(110,231,249,.55);
  box-shadow:0 10px 24px rgba(0,0,0,.45), 0 0 26px rgba(0,188,212,.35);
}
#fcg-a-btn svg{ display:none; }
#fcg-a-btn .fcg-a-dot{ background:#3fe3f7; border-color:#0c1e33; z-index:2; }

/* ---------- Móvil ---------- */
@media (max-width:768px){
  .hero{ padding:70px 22px 92px; }
  .hero h1{ font-size:36px; }
  .card-icon{ width:84px; height:84px; border-radius:18px; }
  .service-card h3{ font-size:15px; }
  .services-section{ padding:44px 20px; }
}

/* Separador entre las dos guías en la sección #guia */
.guia-sep{ border:none; border-top:1px solid var(--fp-line); margin:54px 0 42px; }

/* ============ v11: fondos fotográficos visibles en #guia y #contact ============
   Misma técnica que Servicios/Por qué nosotros: degradado + foto directos
   sobre la sección. Contacto ya tenía foto pero con velo .92/.97 (invisible);
   se aclara a .86/.94. Guías no tenía foto: entra con velo .82/.92. */
#guia{
  background:
    linear-gradient(180deg, rgba(4,13,26,.74), rgba(4,13,26,.86)),
    url('services-bg.jpg') center 25%/cover no-repeat,
    linear-gradient(180deg, rgba(4,13,26,.76), rgba(4,13,26,.89)),
    url('hero-bg.jpg') center 40%/cover no-repeat;
  background-size:100% 55%, 100% 55%, 100% 45%, 100% 45%;
  background-position:0 0, 0 0, 0 100%, 0 100%;
  background-repeat:no-repeat;
}
.contact-section{
  background:linear-gradient(180deg, rgba(4,13,26,.74), rgba(3,10,20,.88)),
             url('services-bg.jpg') center 62%/cover no-repeat;
}

/* ============ v14: mejoras de la auditoría estética (25/oct) ============ */
.brand-tagline{ font-size:10px; letter-spacing:.8px; }
.assessment-container{ padding:28px 32px; }
.assessment-visual img{ max-width:225px; }
.why-us-section{ grid-template-columns:1.1fr 1.7fr 1.5fr; }
.why-us-center p{ font-size:14.5px; line-height:1.65; }
@media (max-width:768px){
  .assessment-container{ padding:22px; }
  .why-us-section{ grid-template-columns:1fr; }
}