/* Landing bespoke — Quality Sign (Círculo Alianza). Paleta y tipografía
   propias de la marca (no las del sistema de Círculo Alianza): Poppins
   (sustituto libre de Century Gothic, fuente comercial no disponible en
   Google Fonts) + Lato. Dorado/negro con acento azul en los CTA, tal como
   el diseño real en Figma (identidad Quality Sign). */

:root{
  --qs-black:#00071A;--qs-navy:#1B3163;
  --qs-gold:#9D723D;--qs-gold-mid:#E5CD8A;--qs-gold-light:#F3EAA0;
  --qs-blue:#007AFF;--qs-teal:#2A7893;
  --qs-ink:#1D1D1D;--qs-gray:#B0B0B0;--qs-line:#E2DCD0;--qs-cream:#FEF9F9;
  --qs-radius:14px;
}
.qs{font-family:'Lato',sans-serif;color:var(--qs-ink);line-height:1.55;overflow-x:hidden}
.qs h1,.qs h2,.qs b,.qs strong{font-family:'Poppins',sans-serif}
.qs .qs-h2{font-size:30px;font-weight:700;line-height:1.28;color:var(--qs-black)}
.qs .qs-center{text-align:center}
.qs .qs-gold{color:var(--qs-gold)}
.qs .qs-gold-light{color:var(--qs-gold-light)}
.qs .qs-sec{padding:64px 24px}
.qs .qs-white{background:#fff}
.qs img{display:block;max-width:100%;height:auto}

.qs-btn{display:inline-flex;align-items:center;justify-content:center;font-family:'Poppins',sans-serif;font-weight:700;font-size:15.5px;padding:14px 26px;border-radius:999px;text-decoration:none;border:none;cursor:pointer;transition:transform .15s,opacity .15s}
.qs-btn:hover{transform:translateY(-1px);opacity:.92}
.qs-btn-blue{background:var(--qs-blue);color:#fff}
.qs-btn-submit{background:#fff;color:var(--qs-teal);width:100%;border:1px solid rgba(42,120,147,.25)}

/* Barra de marca (header/footer propios de la landing) */
.qs-brandbar{background:var(--qs-black);padding:18px;text-align:center}
.qs-brand-pill{display:inline-flex;align-items:center}
.qs-brandbar-foot{margin-top:0}

/* HERO */
.qs-hero{background:linear-gradient(120deg,var(--qs-black) 40%,var(--qs-navy));padding:72px 24px}
.qs-hero-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:40px}
.qs-hero-txt{flex:1;min-width:280px;color:#fff}
.qs-hero-txt h1{font-size:38px;font-weight:700;line-height:1.22;margin-bottom:18px}
.qs-hero-txt p{font-size:16px;color:rgba(255,255,255,.88);max-width:480px;margin-bottom:26px}
.qs-hero-photo{flex:none;width:460px;border-radius:12px;filter:drop-shadow(0 20px 40px rgba(0,0,0,.35))}

/* No debería detener la operación */
.qs-intro1-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:56px}
.qs-intro1-photo{flex:none;width:320px}
.qs-intro1-photo img{border:1.5px solid var(--qs-gold);padding:10px}
.qs-intro1-txt{flex:1;min-width:280px}
.qs-intro1-txt p{margin-top:14px;font-size:15px;color:#4a4a4a;max-width:480px}

/* Qué es Quality Sign */
.qs-what{background:linear-gradient(120deg,var(--qs-black),var(--qs-navy))}
.qs-what-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:48px}
.qs-what-txt{flex:1;min-width:280px}
.qs-what-txt .qs-h2{font-size:30px;margin-bottom:16px}
.qs-what-lede{color:#fff;font-size:22px;font-weight:400;font-family:'Poppins',sans-serif;margin-bottom:14px;line-height:1.35}
.qs-what-sub{color:var(--qs-cream);font-size:15.5px;max-width:480px}
.qs-what-photo{flex:none;width:300px}

/* Principales beneficios */
.qs-benefits-grid{max-width:1000px;margin:36px auto 0;display:grid;grid-template-columns:repeat(3,1fr);column-gap:36px;row-gap:26px}
.qs-benefit{display:flex;align-items:flex-start;gap:14px;border-left:2px solid var(--qs-line);padding-left:16px}
.qs-benefit:nth-child(3n+1){border-left:none;padding-left:0}
.qs-benefit .qs-num{font-family:'Lato',sans-serif;font-weight:700;color:var(--qs-gold);font-size:18px;flex:none}
.qs-benefit p{font-size:15px;color:var(--qs-black)}

/* Grandes diferenciales */
.qs-diff{background:var(--qs-black)}
.qs-diff-grid{max-width:1000px;margin:36px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.qs-diff-card{background:#14141B;border:1px solid rgba(229,205,138,.18);border-radius:10px;padding:14px 18px;display:flex;align-items:center;gap:12px}
.qs-diff-card .qs-ic{flex:none;width:26px;height:26px;color:var(--qs-gold-mid);display:grid;place-items:center}
.qs-diff-card .qs-ic svg{width:100%;height:100%}
.qs-diff-card span:last-child{color:#fff;font-size:14.5px}
.qs-iso-pill{max-width:560px;margin:32px auto 0;background:#fff;border-radius:999px;padding:12px 22px;display:flex;align-items:center;gap:12px;color:var(--qs-teal);font-size:14px;font-weight:700;font-family:'Poppins',sans-serif}
.qs-iso-badge{flex:none;width:30px;height:30px;color:var(--qs-navy)}
.qs-iso-badge svg{width:100%;height:100%}

/* Cómo funciona el proceso de firma */
.qs-steps{max-width:1180px;margin:40px auto 0;display:flex;align-items:flex-start;gap:8px}
.qs-step{flex:1;min-width:0;border:1.5px solid var(--qs-gold-mid);border-radius:12px;padding:26px 22px}
.qs-step-ic{width:40px;height:40px;margin-bottom:14px;color:var(--qs-gold);display:inline-flex;align-items:center;justify-content:center}
.qs-step-ic svg{width:100%;height:100%}
.qs-step b{display:block;font-size:16px;margin-bottom:8px;color:var(--qs-black)}
.qs-step p{font-size:13.5px;color:#6b6b6b}
.qs-step-arrow{flex:none;width:28px;height:28px;color:var(--qs-gold);margin-top:40px}
.qs-step-arrow svg{width:100%;height:100%}

/* Para quién es */
.qs-who{background:var(--qs-black);display:flex;align-items:stretch;gap:0;padding:0;max-width:none}
.qs-who-photo{flex:1 1 44%;min-width:280px;overflow:hidden}
.qs-who-photo img{width:100%;height:100%;object-fit:cover;min-height:360px}
.qs-who-txt{flex:1 1 56%;min-width:280px;padding:56px 40px;align-self:center}
.qs-who-txt .qs-h2{font-size:30px;margin-bottom:16px}
.qs-who-lede{color:#fff;font-size:16px;max-width:480px;margin-bottom:10px}
.qs-who-sub{color:var(--qs-cream);font-size:15px;margin-bottom:14px}
.qs-who-list{list-style:none;display:grid;grid-template-columns:repeat(3,auto);gap:10px 28px;padding:0;margin:0}
.qs-who-list li{color:var(--qs-cream);font-size:14.5px;font-weight:700;font-family:'Poppins',sans-serif}
.qs-who-list li::before{content:'✓ ';color:var(--qs-gold-mid)}

/* Con Quality Sign, procesos más rápidos */
.qs-faster-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:56px}
.qs-faster-txt{flex:1;min-width:280px}
.qs-faster-txt p{margin-top:14px;font-size:15px;color:#4a4a4a;max-width:420px}
.qs-faster-photo{flex:none;width:340px}

/* Grandes empresas que confían en nosotros */
.qs-clients{background:#F5F5F5}
.qs-clients-pill{max-width:600px;margin:0 auto 34px;text-align:center;border:1.5px solid var(--qs-gold);border-radius:999px;padding:12px 24px;font-family:'Poppins',sans-serif;font-weight:700;font-size:16px;color:var(--qs-black)}
.qs-clients-row{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:18px}
.qs-carousel-arrow{flex:none;width:44px;height:44px;border:1.5px solid var(--qs-gold);background:#fff;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.qs-carousel-arrow img{width:14px;height:14px}
.qs-clients-logos{flex:1;display:grid;grid-template-columns:repeat(6,1fr);align-items:center;gap:14px}
.qs-clients-logos img{max-height:64px;width:auto;margin:0 auto;background:#fff;border-radius:8px;padding:8px;box-shadow:0 2px 10px rgba(0,0,0,.06)}

/* Certificación NQA / ISO */
.qs-certs{background:linear-gradient(120deg,var(--qs-black),var(--qs-navy));color:#fff}
.qs-certs-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:48px}
.qs-certs-txt{flex:1;min-width:280px}
.qs-certs-badges{display:flex;gap:16px;margin-top:20px}
.qs-cert-badge{display:flex;flex-direction:column;align-items:center;gap:6px;background:rgba(255,255,255,.08);border-radius:10px;padding:14px 18px;color:var(--qs-gold-mid);font-size:12px}
.qs-cert-badge svg{width:30px;height:30px}
.qs-cert-badge b{font-family:'Lato',sans-serif;color:#fff;font-size:12px}
.qs-certs-list{flex:1;min-width:280px;display:flex;flex-direction:column;gap:16px}
.qs-certs-list p{font-size:14.5px;color:rgba(255,255,255,.92)}

/* FAQ */
.qs-faq-list{max-width:860px;margin:32px auto 0}
.qs-faq-item{border-bottom:1px solid var(--qs-line);padding:18px 4px}
.qs-faq-item summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:'Poppins',sans-serif;font-weight:700;font-size:15.5px;color:var(--qs-black)}
.qs-faq-item summary::-webkit-details-marker{display:none}
.qs-faq-item .qs-chev{width:15px;height:15px;flex:none;transition:transform .2s}
.qs-faq-item:not([open]) .qs-chev{transform:rotate(180deg)}
.qs-faq-item p{margin-top:10px;font-size:14px;color:#6b6b6b;max-width:760px}

/* CTA final */
.qs-cta{background-size:cover;background-position:center;padding:64px 24px 0}
.qs-cta-top{max-width:760px;margin:0 auto;text-align:center;padding-bottom:40px}
.qs-cta-top .qs-h2{font-size:28px;margin-bottom:22px}
.qs-cta-lede{color:#fff;font-size:15px;margin-top:16px}
.qs-form-wrap{background:var(--qs-navy);padding:40px 24px}
.qs-alert{max-width:560px;margin:0 auto 18px;padding:12px 16px;border-radius:10px;font-size:13.5px;font-weight:600;font-family:'Lato',sans-serif}
.qs-alert-success{background:#E7F7EC;color:#1E7A3C}
.qs-alert-error{background:#FBEAE5;color:#973423}
.qs-form{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.qs-form input,.qs-form select{width:100%;padding:13px 16px;border:none;border-radius:10px;font-family:'Lato',sans-serif;font-size:14.5px;color:var(--qs-ink);background:#fff}
.qs-form input::placeholder{color:var(--qs-gray)}
.qs-form-row{display:flex;gap:12px;flex-wrap:wrap}
.qs-form-row input{flex:1;min-width:200px}
.qs-phone{flex:1;min-width:200px;display:flex;gap:6px}
.qs-phone select{flex:none;width:96px;font-size:12.5px}
.qs-phone input{flex:1;min-width:0}
.qs-check{display:flex;align-items:flex-start;gap:8px;color:#fff;font-size:13px}
.qs-check input{width:auto;margin-top:2px}
.qs-check a{color:#fff;text-decoration:underline}

/* ===== Responsive — sin frame móvil en Figma: adaptado siguiendo los
   mismos breakpoints (1080px / 860px / 560px) que ya usa el resto del sitio. ===== */
@media(max-width:1080px){
  .qs-benefits-grid{grid-template-columns:1fr 1fr}
  .qs-benefit:nth-child(3n+1){border-left:2px solid var(--qs-line);padding-left:16px}
  .qs-benefit:nth-child(2n+1){border-left:none;padding-left:0}
  .qs-diff-grid{grid-template-columns:1fr 1fr}
  .qs-steps{flex-wrap:wrap;justify-content:center}
  .qs-step{flex:1 1 220px}
  .qs-step-arrow{display:none}
  .qs-clients-logos{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .qs-hero-in,.qs-intro1-in,.qs-what-in,.qs-faster-in,.qs-certs-in{flex-direction:column;text-align:center}
  .qs-hero-txt p,.qs-what-sub{margin-left:auto;margin-right:auto}
  .qs-hero-photo,.qs-intro1-photo,.qs-what-photo,.qs-faster-photo{width:280px}
  .qs-who{flex-direction:column}
  .qs-who-photo img{min-height:260px}
  .qs-who-txt{padding:40px 24px;text-align:center}
  .qs-who-list{justify-content:center}
  .qs-who-list li::before{content:'✓ '}
  .qs-benefits-grid{grid-template-columns:1fr;max-width:340px}
  .qs-benefit{border-left:none !important;border-top:2px solid var(--qs-line);padding-left:0 !important;padding-top:12px}
  .qs-diff-grid{grid-template-columns:1fr}
  .qs-hero-txt h1{font-size:28px}
  .qs-h2{font-size:24px}
  .qs-clients-logos{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .qs-sec{padding:44px 18px}
  .qs-hero{padding:52px 18px}
  .qs-form-row{flex-direction:column}
  .qs-phone{flex-direction:row}
  .qs-clients-row{flex-wrap:wrap}
}
