/*
Theme Name: Starazona Seguros
Theme URI: https://starazona.com
Author: Starazona
Description: Tema personalizado para Salvador Tarazona Correduría de Seguros
Version: 1.0
License: Private
Text Domain: starazona
*/

/* ============================================================
   VARIABLES Y RESET
   ============================================================ */
:root {
  --az: #12326b;
  --az2: #1a3f85;
  --az-light: #e8eef7;
  --or: #e8600a;
  --or2: #fdf1ea;
  --bg: #f7f8fc;
  --w: #ffffff;
  --t1: #12326b;
  --t2: #5a6a85;
  --bd: #e2e8f0;
  --radius: 10px;
  --shadow: 0 2px 20px rgba(18,50,107,.08);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Outfit', 'Segoe UI', sans-serif;
  color: var(--t1);
  background: var(--w);
  line-height: 1.6;
  font-size: 15px;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }

/* ============================================================
   TOPBAR
   ============================================================ */
.sta-topbar {
  background: var(--az);
  padding: 6px 0;
}
.sta-topbar-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}
.sta-topbar-left {
  font-size: 11px;
  color: rgba(255,255,255,.55);
  display: flex;
  align-items: center;
  gap: 6px;
}
.sta-topbar-left svg { width:13px; height:13px; fill:var(--or); flex-shrink:0; }
.sta-topbar-right { display: flex; gap: 1.5rem; }
.sta-topbar-right a {
  font-size: 11px;
  color: rgba(255,255,255,.55);
  transition: color .2s;
}
.sta-topbar-right a:hover { color: #fff; }

/* ============================================================
   HEADER
   ============================================================ */
.sta-header {
  background: var(--w);
  border-bottom: 1px solid var(--bd);
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 2px 12px rgba(18,50,107,.06);
}
.sta-header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  gap: 1.5rem;
}

/* Logo */
.sta-logo { display: flex; align-items: center; gap: 12px; }
.sta-logo-icon {
  width: 44px;
  height: 44px;
  background: var(--or2);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sta-logo-icon svg { width:24px; height:24px; }
.sta-logo-text .sub {
  font-size: 10px;
  color: var(--t2);
  text-transform: uppercase;
  letter-spacing: .1em;
  line-height: 1;
}
.sta-logo-text .name {
  font-size: 16px;
  font-weight: 600;
  color: var(--az);
  line-height: 1.3;
}

/* Nav */
.sta-nav { display: flex; align-items: center; gap: 0; }
.sta-nav a {
  font-size: 13px;
  color: var(--t2);
  font-weight: 500;
  padding: 8px 14px;
  border-radius: 8px;
  transition: all .2s;
  white-space: nowrap;
}
.sta-nav a:hover,
.sta-nav a.current { color: var(--az); background: var(--az-light); }
.sta-nav a.current { font-weight: 600; }
.sta-nav a.nav-acceso {
  color: var(--az);
  border: 1.5px solid var(--az);
  padding: 7px 14px;
  margin-left: 6px;
}
.sta-nav a.nav-acceso:hover { background: var(--az); color: #fff; }

/* CTA button */
.sta-btn-cta {
  background: var(--or);
  color: #fff !important;
  border: none;
  padding: 10px 20px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s, transform .1s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.sta-btn-cta:hover { background: #d4550a; transform: translateY(-1px); }

/* Mobile menu toggle */
.sta-hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  color: var(--az);
}
.sta-hamburger svg { width:24px; height:24px; }

/* Mobile nav */
.sta-mobile-nav {
  display: none;
  background: var(--w);
  border-top: 1px solid var(--bd);
  padding: 1rem 1.5rem 1.5rem;
}
.sta-mobile-nav.open { display: block; }
.sta-mobile-nav a {
  display: block;
  padding: 10px 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--t2);
  border-bottom: 1px solid var(--bd);
}
.sta-mobile-nav a:last-child { border-bottom: none; }
.sta-mobile-nav a.current { color: var(--az); }
.sta-mobile-nav a.nav-acceso { color: var(--az); font-weight: 600; }
.sta-mobile-nav .sta-btn-cta {
  display: block;
  text-align: center;
  margin-top: 1rem;
  padding: 12px;
  width: 100%;
  justify-content: center;
}

/* ============================================================
   FOOTER
   ============================================================ */
.sta-footer {
  background: var(--az);
  padding: 2.5rem 0 1.5rem;
}
.sta-footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.sta-footer-top {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 2.5rem;
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.sta-footer-brand .logo-row { display: flex; align-items: center; gap: 10px; margin-bottom: 1rem; }
.sta-footer-brand .logo-ic {
  width:36px; height:36px;
  background:rgba(255,255,255,.08);
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
}
.sta-footer-brand .logo-ic svg { width:18px; height:18px; }
.sta-footer-brand .logo-name { font-size:14px; font-weight:600; color:#fff; }
.sta-footer-brand .logo-sub { font-size:10px; color:rgba(255,255,255,.45); text-transform:uppercase; letter-spacing:.08em; }
.sta-footer-brand p { font-size:12px; color:rgba(255,255,255,.5); line-height:1.7; }
.sta-footer-col h4 { font-size:12px; font-weight:600; color:#fff; text-transform:uppercase; letter-spacing:.08em; margin-bottom:.75rem; }
.sta-footer-col a, .sta-footer-col p {
  display: block;
  font-size: 12px;
  color: rgba(255,255,255,.5);
  margin-bottom: .4rem;
  transition: color .2s;
}
.sta-footer-col a:hover { color: #fff; }
.sta-footer-col .contact-item { display:flex; align-items:center; gap:6px; margin-bottom:.5rem; }
.sta-footer-col .contact-item svg { width:14px; height:14px; fill:var(--or); flex-shrink:0; }
.sta-footer-bot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem;
}
.sta-footer-bot span, .sta-footer-bot a {
  font-size: 11px;
  color: rgba(255,255,255,.3);
}
.sta-footer-bot a:hover { color: rgba(255,255,255,.6); }
.sta-footer-bot-links { display:flex; gap:1.5rem; }
.dgs-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11px;
  color: rgba(255,255,255,.6);
  margin-top: .75rem;
}
.dgs-badge svg { width:14px; height:14px; fill:var(--or); }

/* ============================================================
   TRUST BAR
   ============================================================ */
.sta-trust {
  background: var(--w);
  border-bottom: 1px solid var(--bd);
  padding: .9rem 0;
}
.sta-trust-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem;
}
.sta-trust-item { display:flex; align-items:center; gap:10px; }
.sta-trust-item svg { width:20px; height:20px; fill:var(--or); flex-shrink:0; }
.sta-trust-item strong { display:block; font-size:12px; color:var(--az); font-weight:600; }
.sta-trust-item span { font-size:11px; color:var(--t2); }
.sta-trust-sep { width:1px; height:30px; background:var(--bd); }

/* ============================================================
   HERO (HOME)
   ============================================================ */
.sta-hero {
  position: relative;
  height: 520px;
  overflow: hidden;
  background: var(--az);
}
.sta-slide { position:absolute; inset:0; opacity:0; transition:opacity .8s ease; }
.sta-slide.active { opacity:1; }
.sta-slide img { width:100%; height:100%; object-fit:cover; }
.sta-slide-overlay {
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(18,50,107,.82) 0%, rgba(18,50,107,.4) 55%, transparent 100%);
}
.sta-slide-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%);
  max-width: 1200px;
  width: 100%;
  padding: 0 1.5rem;
  margin-left: -600px;
}
@media (max-width:1200px) {
  .sta-slide-content { margin-left: 0; left: 0; transform: translateY(-50%); }
}
.sta-slide-kicker {
  display: inline-flex; align-items:center; gap:6px;
  background: rgba(232,96,10,.2);
  border: 1px solid rgba(232,96,10,.4);
  border-radius: 20px;
  padding: 4px 12px;
  font-size: 11px; color: #ffb88a; font-weight:600;
  margin-bottom: .75rem;
}
.sta-slide-content h1 {
  font-size: 34px; font-weight:700; color:#fff; line-height:1.2; margin-bottom:.75rem;
}
.sta-slide-content h1 em { font-style:normal; color:#ff9a5c; }
.sta-slide-content p { font-size:14px; color:rgba(255,255,255,.8); line-height:1.7; margin-bottom:1.5rem; max-width:440px; }
.sta-slide-btns { display:flex; gap:10px; flex-wrap:wrap; }
.btn-hero-w {
  background:#fff; color:var(--az); border:none;
  padding:11px 24px; border-radius:9px; font-size:13px; font-weight:600; cursor:pointer;
  transition:all .2s;
}
.btn-hero-w:hover { background:#f0f4ff; }
.btn-hero-o {
  background:transparent; color:#fff;
  border:1.5px solid rgba(255,255,255,.6);
  padding:10px 22px; border-radius:9px; font-size:13px; cursor:pointer;
  transition:all .2s;
}
.btn-hero-o:hover { background:rgba(255,255,255,.1); }
.sta-dots {
  position:absolute; bottom:1.25rem; left:50%;
  transform:translateX(-50%);
  display:flex; gap:8px;
}
.sta-dot {
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,.4);
  border:none; cursor:pointer; transition:all .3s;
}
.sta-dot.active { background:var(--or); width:24px; border-radius:4px; }

/* ============================================================
   SECTIONS UTILITY
   ============================================================ */
.sta-section { padding: 4rem 0; }
.sta-section-alt { background: var(--bg); }
.sta-container { max-width:1200px; margin:0 auto; padding:0 1.5rem; }
.sta-sec-tag {
  font-size:11px; color:var(--or); font-weight:600;
  text-transform:uppercase; letter-spacing:.08em;
  display:flex; align-items:center; gap:8px; margin-bottom:.4rem;
}
.sta-sec-tag::before { content:''; width:20px; height:2px; background:var(--or); border-radius:1px; }
.sta-sec-h2 { font-size:26px; font-weight:700; color:var(--az); margin-bottom:1.5rem; }
.sta-sec-h2-center { text-align:center; }
.sta-sec-tag-center { justify-content:center; }

/* ============================================================
   STATS (HOME)
   ============================================================ */
.sta-stats { padding: 3rem 0; background:var(--w); }
.sta-stats-grid {
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap:1.5rem;
}
.sta-stat {
  background:var(--bg);
  border-radius:var(--radius);
  padding:1.25rem;
  text-align:center;
}
.sta-stat .num { font-size:28px; font-weight:700; color:var(--or); }
.sta-stat .lbl { font-size:12px; color:var(--t2); margin-top:.25rem; }

/* ============================================================
   PRODUCT CARDS
   ============================================================ */
.sta-products-tabs {
  display:flex; gap:6px; margin-bottom:2rem; flex-wrap:wrap;
}
.sta-tab {
  padding:7px 18px; border-radius:8px; font-size:12px; font-weight:500;
  cursor:pointer; border:1px solid var(--bd); background:transparent; color:var(--t2);
  transition:all .15s;
}
.sta-tab.active, .sta-tab:hover { background:var(--az); color:#fff; border-color:var(--az); }

.sta-products-grid {
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:14px;
}
.sta-pcard {
  background:var(--w);
  border:1px solid var(--bd);
  border-radius:var(--radius);
  overflow:hidden;
  cursor:pointer;
  transition:all .2s;
  border-top: 3px solid transparent;
}
.sta-pcard:hover { border-top-color:var(--or); box-shadow:var(--shadow); transform:translateY(-2px); }
.sta-pcard-img { height:140px; overflow:hidden; }
.sta-pcard-img img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.sta-pcard:hover .sta-pcard-img img { transform:scale(1.04); }
.sta-pcard-body { padding:1.1rem; }
.sta-pcard-ico { display:flex; align-items:center; gap:8px; margin-bottom:.5rem; }
.sta-pcard-ico svg { width:18px; height:18px; fill:var(--or); }
.sta-pcard-ico span { font-size:11px; color:var(--t2); }
.sta-pcard h3 { font-size:14px; font-weight:600; color:var(--az); margin-bottom:.3rem; }
.sta-pcard p { font-size:12px; color:var(--t2); line-height:1.5; }
.sta-pcard-link {
  margin-top:.75rem; font-size:12px; color:var(--az); font-weight:600;
  display:flex; align-items:center; gap:4px;
  border-top:1px solid var(--bd); padding-top:.6rem;
}
.sta-pcard-link svg { width:14px; height:14px; fill:var(--az); }

/* ============================================================
   CTA BANNER
   ============================================================ */
.sta-cta-banner {
  background:var(--az);
  border-radius:16px;
  padding:2.5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  flex-wrap:wrap;
}
.sta-cta-banner h3 { font-size:22px; font-weight:700; color:#fff; margin-bottom:.4rem; }
.sta-cta-banner p { font-size:13px; color:rgba(255,255,255,.65); }
.btn-or {
  background:var(--or); color:#fff; border:none;
  padding:12px 28px; border-radius:9px; font-size:14px; font-weight:600;
  cursor:pointer; white-space:nowrap; transition:background .2s;
}
.btn-or:hover { background:#d4550a; }

/* ============================================================
   CONTACT / FORM SECTION
   ============================================================ */
.sta-contact-grid {
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:3.5rem;
  align-items:start;
}
.sta-contact-info h2 { font-size:24px; font-weight:700; color:var(--az); margin-bottom:.6rem; }
.sta-contact-info p { font-size:14px; color:var(--t2); line-height:1.8; margin-bottom:1.5rem; }
.sta-ci-list { display:flex; flex-direction:column; gap:12px; }
.sta-ci { display:flex; gap:12px; align-items:flex-start; }
.sta-ci-ic {
  width:38px; height:38px;
  background:var(--w);
  border:1px solid var(--bd);
  border-radius:10px;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.sta-ci-ic svg { width:16px; height:16px; fill:var(--az); }
.sta-ci-lbl { font-size:10px; color:var(--t2); text-transform:uppercase; letter-spacing:.06em; }
.sta-ci-val { font-size:13px; font-weight:600; color:var(--az); }

.sta-fcard {
  background:var(--w);
  border:1px solid var(--bd);
  border-radius:var(--radius);
  padding:1.75rem;
  border-top:3px solid var(--or);
}
.sta-fcard h3 { font-size:15px; font-weight:600; color:var(--az); margin-bottom:1.1rem; padding-bottom:.75rem; border-bottom:1px solid var(--bd); }
.sta-frow { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px; }
.sta-fg { margin-bottom:10px; }
.sta-fg label { font-size:11px; color:var(--t2); display:block; margin-bottom:4px; font-weight:500; text-transform:uppercase; letter-spacing:.05em; }
.sta-fg input, .sta-fg select, .sta-fg textarea {
  width:100%; font-size:13px; padding:9px 12px;
  border:1px solid var(--bd); border-radius:8px;
  background:var(--bg); color:var(--t1);
  font-family:inherit; transition:border-color .2s;
}
.sta-fg input:focus, .sta-fg select:focus, .sta-fg textarea:focus {
  outline:none; border-color:var(--az);
}
.sta-fg textarea { height:72px; resize:none; }
.sta-fsub {
  width:100%; background:var(--or); color:#fff; border:none;
  padding:12px; border-radius:9px; font-size:14px; font-weight:600;
  cursor:pointer; margin-top:4px; display:flex; align-items:center;
  justify-content:center; gap:8px; font-family:inherit; transition:background .2s;
}
.sta-fsub:hover { background:#d4550a; }
.sta-fsub svg { width:16px; height:16px; fill:#fff; }

/* ============================================================
   BLOG
   ============================================================ */
.sta-blog-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.sta-bcard {
  border:1px solid var(--bd);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--w);
  transition:all .2s;
}
.sta-bcard:hover { box-shadow:var(--shadow); transform:translateY(-2px); }
.sta-bcard-img { height:180px; overflow:hidden; position:relative; }
.sta-bcard-img img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.sta-bcard:hover .sta-bcard-img img { transform:scale(1.04); }
.sta-bcard-img-bar { position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--or); }
.sta-bbody { padding:1.1rem; }
.sta-btag {
  font-size:10px; color:var(--or); background:var(--or2);
  padding:2px 9px; border-radius:20px; display:inline-block;
  margin-bottom:.6rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em;
}
.sta-bbody h4 { font-size:14px; font-weight:600; line-height:1.4; margin-bottom:.4rem; color:var(--az); }
.sta-bbody .dt { font-size:11px; color:var(--t2); margin-bottom:.5rem; }
.sta-bbody .excerpt { font-size:12px; color:var(--t2); line-height:1.6; margin-bottom:.75rem; }
.sta-read-more {
  font-size:12px; color:var(--az); font-weight:600;
  display:inline-flex; align-items:center; gap:4px;
}
.sta-read-more svg { width:12px; height:12px; fill:var(--az); }

/* Blog single */
.sta-blog-single { padding:3rem 0; }
.sta-blog-single-inner {
  max-width:760px; margin:0 auto; padding:0 1.5rem;
}
.sta-blog-single h1 { font-size:30px; font-weight:700; color:var(--az); margin-bottom:1rem; line-height:1.25; }
.sta-blog-single .meta { font-size:12px; color:var(--t2); margin-bottom:1.5rem; display:flex; gap:1rem; }
.sta-blog-single .featured-img { width:100%; border-radius:var(--radius); margin-bottom:2rem; }
.sta-blog-single .entry-content { font-size:15px; color:var(--t1); line-height:1.8; }
.sta-blog-single .entry-content h2 { font-size:20px; font-weight:700; color:var(--az); margin:1.5rem 0 .75rem; }
.sta-blog-single .entry-content p { margin-bottom:1rem; }
.sta-blog-single .entry-content img { border-radius:8px; margin:1rem 0; }
.sta-blog-single .entry-content ul { padding-left:1.5rem; margin-bottom:1rem; }
.sta-blog-single .entry-content ul li { list-style:disc; margin-bottom:.4rem; }

/* Breadcrumb */
.sta-breadcrumb {
  background: var(--bg);
  border-bottom: 1px solid var(--bd);
  padding: .75rem 0;
}
.sta-breadcrumb-inner {
  max-width:1200px; margin:0 auto; padding:0 1.5rem;
  font-size:12px; color:var(--t2);
  display:flex; align-items:center; gap:6px;
}
.sta-breadcrumb-inner a { color:var(--t2); }
.sta-breadcrumb-inner a:hover { color:var(--az); }
.sta-breadcrumb-inner svg { width:12px; height:12px; fill:var(--t2); }

/* ============================================================
   PAGE HERO (interior pages)
   ============================================================ */
.sta-page-hero {
  background: linear-gradient(135deg, var(--az) 60%, var(--az2));
  padding: 3.5rem 0;
  text-align: center;
}
.sta-page-hero h1 { font-size:30px; font-weight:700; color:#fff; margin-bottom:.5rem; }
.sta-page-hero p { font-size:14px; color:rgba(255,255,255,.7); }

/* ============================================================
   SOBRE NOSOTROS
   ============================================================ */
.sta-about-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  align-items:center;
}
.sta-about-img { border-radius:var(--radius); overflow:hidden; }
.sta-about-img img { width:100%; height:360px; object-fit:cover; }
.sta-about-text h2 { font-size:26px; font-weight:700; color:var(--az); margin-bottom:1rem; }
.sta-about-text p { font-size:14px; color:var(--t2); line-height:1.8; margin-bottom:1rem; }
.sta-values { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.5rem; }
.sta-value-item {
  background:var(--bg);
  border-radius:10px;
  padding:1rem;
  border-left:3px solid var(--or);
}
.sta-value-item h4 { font-size:13px; font-weight:600; color:var(--az); margin-bottom:.25rem; }
.sta-value-item p { font-size:12px; color:var(--t2); margin-bottom:0; }

/* Team */
.sta-team-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.sta-team-card {
  background:var(--w);
  border:1px solid var(--bd);
  border-radius:var(--radius);
  overflow:hidden;
  text-align:center;
}
.sta-team-card img { width:100%; height:200px; object-fit:cover; object-position:top; }
.sta-team-body { padding:1.1rem; }
.sta-team-body h3 { font-size:14px; font-weight:600; color:var(--az); }
.sta-team-body span { font-size:12px; color:var(--t2); }

/* ============================================================
   PRODUCT PAGE
   ============================================================ */
.sta-product-hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  align-items:center;
  padding:3rem 0;
}
.sta-product-hero-img img { width:100%; border-radius:var(--radius); height:360px; object-fit:cover; }
.sta-product-hero-text h1 { font-size:28px; font-weight:700; color:var(--az); margin-bottom:1rem; }
.sta-product-hero-text p { font-size:14px; color:var(--t2); line-height:1.8; margin-bottom:1.5rem; }
.sta-product-features { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:1.5rem; }
.sta-feat {
  display:flex; align-items:flex-start; gap:8px;
  font-size:13px; color:var(--t2);
}
.sta-feat svg { width:16px; height:16px; fill:var(--or); flex-shrink:0; margin-top:2px; }
.sta-products-list {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1.25rem;
  margin-top:2rem;
}
.sta-prod-item {
  background:var(--w);
  border:1px solid var(--bd);
  border-radius:var(--radius);
  padding:1.25rem;
  border-left:4px solid var(--or);
}
.sta-prod-item .ico { width:40px; height:40px; background:var(--or2); border-radius:8px; display:flex; align-items:center; justify-content:center; margin-bottom:.75rem; }
.sta-prod-item .ico svg { width:20px; height:20px; fill:var(--or); }
.sta-prod-item h3 { font-size:14px; font-weight:600; color:var(--az); margin-bottom:.3rem; }
.sta-prod-item p { font-size:12px; color:var(--t2); line-height:1.5; }

/* ============================================================
   PAGINATION
   ============================================================ */
.sta-pagination {
  display:flex; justify-content:center; gap:6px; margin-top:2.5rem;
}
.sta-pagination a, .sta-pagination span {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:8px;
  font-size:13px; font-weight:500; color:var(--t2);
  border:1px solid var(--bd); transition:all .2s;
}
.sta-pagination a:hover, .sta-pagination span.current {
  background:var(--az); color:#fff; border-color:var(--az);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px) {
  .sta-nav { display:none; }
  .sta-btn-cta.desktop-only { display:none; }
  .sta-hamburger { display:block; }
  .sta-stats-grid { grid-template-columns:repeat(2,1fr); }
  .sta-products-grid { grid-template-columns:repeat(2,1fr); }
  .sta-blog-grid { grid-template-columns:repeat(2,1fr); }
  .sta-about-grid { grid-template-columns:1fr; }
  .sta-contact-grid { grid-template-columns:1fr; }
  .sta-product-hero { grid-template-columns:1fr; }
  .sta-footer-top { grid-template-columns:1fr 1fr; }
  .sta-trust-inner { justify-content:center; }
  .sta-trust-sep { display:none; }
}
@media (max-width:600px) {
  .sta-hero { height:400px; }
  .sta-slide-content h1 { font-size:24px; }
  .sta-products-grid { grid-template-columns:1fr; }
  .sta-blog-grid { grid-template-columns:1fr; }
  .sta-team-grid { grid-template-columns:1fr 1fr; }
  .sta-footer-top { grid-template-columns:1fr; }
  .sta-stats-grid { grid-template-columns:repeat(2,1fr); }
  .sta-frow { grid-template-columns:1fr; }
  .sta-products-list { grid-template-columns:1fr; }
  .sta-cta-banner { flex-direction:column; text-align:center; }
}

/* ── LOGO IMAGEN (cuando existe img/logo.png) ── */
.sta-logo-img {
  height: 44px;
  width: auto;
  max-width: 220px;
  display: block;
  object-fit: contain;
}

/* ── INTRO GRID (Productos) ── */
.sta-intro-grid {
  grid-template-columns: repeat(3,1fr);
}
@media (max-width:700px) {
  .sta-intro-grid { grid-template-columns: 1fr !important; }
}