.co-servicios{ --co-panel:#17161B; --co-line:#2C2A33; --co-text:#EFEBE3; --co-text-dim:#8B8792; --co-amber:#E8A33D; --co-dred:#C1352E; --co-gled:#6FA97A; font-family:'Inter', sans-serif; width:100%; box-sizing:border-box; } .co-servicios *{ box-sizing:border-box; } .co-servicios .co-row{ display:flex; flex-wrap:wrap; gap:22px; width:100%; align-items:stretch; } .co-servicios .co-card{ flex:1 1 320px; min-width:280px; border-radius:2px; display:flex; flex-direction:column; overflow:hidden; background:var(--co-panel); border:1px solid var(--co-line); box-shadow:0 12px 34px -14px rgba(0,0,0,0.55); } .co-servicios .co-head{ position:relative; padding:18px 18px 14px; background:linear-gradient(180deg,#1A1913,#131217); border-bottom:1px solid var(--co-line); text-align:center; } .co-servicios .co-head::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; } .co-servicios .co-eyebrow{ font-family:'IBM Plex Mono', monospace; font-size:9.5px; letter-spacing:0.12em; text-transform:uppercase; display:flex; align-items:center; justify-content:center; gap:6px; margin-bottom:8px; } .co-servicios .co-dot{ width:5px; height:5px; border-radius:50%; background:var(--co-gled); box-shadow:0 0 6px var(--co-gled); animation:co-pulse 2.4s ease-in-out infinite; } @keyframes co-pulse{ 0%,100%{opacity:1;} 50%{opacity:0.35;} } .co-servicios .co-head h2{ font-family:'Barlow Condensed', sans-serif; font-weight:700; font-size:22px; text-transform:uppercase; letter-spacing:0.01em; margin:0 0 2px; color:var(--co-text); } .co-servicios .co-by{ font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--co-text-dim); } .co-servicios .co-by b{ color:var(--co-text); font-weight:500; } .co-servicios .co-cta-wrap{ padding:16px 18px 22px; text-align:center; } .co-servicios .co-cta{ display:block; width:100%; color:#171208; font-family:'Barlow Condensed', sans-serif; font-weight:700; font-size:15px; letter-spacing:0.05em; text-transform:uppercase; padding:12px 14px; border:none; border-radius:2px; cursor:pointer; transition:filter 0.12s ease; text-decoration:none; text-align:center; } .co-servicios .co-cta:hover{ filter:brightness(1.1); } .co-servicios .co-cta-note{ margin-top:9px; font-family:'IBM Plex Mono', monospace; font-size:10px; color:var(--co-text-dim); } .co-servicios .co-photo .co-head::before{ background:linear-gradient(90deg, #C9A15A, var(--co-dred)); } .co-servicios .co-photo .co-eyebrow{ color:#C9A15A; } .co-servicios .co-photo .co-cta{ background:#C9A15A; } .co-servicios .co-photo .co-cta:hover{ background:#d9b46f; } .co-servicios .co-tech .co-head::before{ background:linear-gradient(90deg, var(--co-amber), var(--co-dred)); } .co-servicios .co-tech .co-eyebrow{ color:var(--co-amber); } .co-servicios .co-tech .co-cta{ background:var(--co-amber); } .co-servicios .co-tech .co-cta:hover{ background:#f2b455; } .co-servicios .co-rows{ padding:6px 6px 0; flex:1; } .co-servicios .co-r{ display:grid; align-items:center; gap:10px; padding:11px 10px; border-bottom:1px solid var(--co-line); } .co-servicios .co-photo .co-r{ grid-template-columns:34px 1fr 60px; } .co-servicios .co-tech .co-r{ grid-template-columns:34px 1fr 46px; } .co-servicios .co-r:last-child{ border-bottom:none; } .co-servicios .co-r-num{ font-family:'IBM Plex Mono', monospace; font-size:9.5px; color:var(--co-text-dim); } .co-servicios .co-r-num span{ display:block; font-size:8px; color:#5c5964; margin-top:1px; } .co-servicios .co-r-label{ font-family:'Barlow Condensed', sans-serif; font-weight:600; font-size:15px; color:var(--co-text); letter-spacing:0.01em; line-height:1.15; } .co-servicios .co-bar{ height:4px; background:#000; border-radius:3px; overflow:hidden; border:1px solid var(--co-line); } .co-servicios .co-bar i{ display:block; height:100%; border-radius:3px; } .co-servicios .co-photo .co-fstop{ font-family:'IBM Plex Mono', monospace; font-size:10.5px; color:#C9A15A; text-align:right; margin-bottom:3px; } .co-servicios .co-photo .co-bar i{ background:linear-gradient(90deg, #C9A15A, #e8cf9e); margin-left:auto; } .co-servicios .co-bar-tech{ width:46px; } .co-servicios .co-bar-tech i{ background:linear-gradient(90deg, var(--co-amber), #f2c56b); } @media (max-width:640px){ .co-servicios .co-row{ flex-direction:column; } }