/* Animaciones específicas de la página Telefonía (extraídas del inline) */
@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }
.animate-fade-in { animation: fadeInUp 0.8s ease forwards; }

/* Utilidades Tailwind necesarias para el hero */
.opacity-0 { opacity: 0; }
.translate-y-10 { transform: translateY(2.5rem); }
.nt-stack-tight { display: flex; flex-direction: column; gap: 0.75rem; }
@media (min-width: 640px) { 
  .nt-stack-tight { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 1rem; } 
}

/* Espacio reservado para futuros estilos específicos de Telefonía */
/* ================== PLANES TEL. ================== */
/* ================== HERO TEL. ================== */
.telefonia-hero { position:relative; min-height:540px; display:flex; align-items:center; justify-content:center; padding:150px 1rem 90px; }
@media (min-width:900px){ .telefonia-hero { min-height:620px; padding-top:170px; padding-bottom:110px; } }
.telefonia-hero-bg { position:absolute; inset:0; background:url('../img/yeastar-hero.webp') center/cover no-repeat; }
/* Overlay oscuro para mejorar legibilidad del texto (sin patrones adicionales) */
.telefonia-hero-bg::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,23,38,.58),rgba(10,23,38,.68)); pointer-events:none; }
.telefonia-hero-inner { position:relative; z-index:2; max-width:880px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:1.25rem; }
/* Heading sin sombras, usando la clase invert solo para color claro */
.telefonia-hero-inner .nt-heading-hero { filter:none; color:#f5f9fc; text-shadow:none; }
.telefonia-hero-inner .nt-heading-hero.nt-heading-invert { text-shadow:none; }
/* Ajuste tipográfico del subtítulo: menor tamaño y sin sombras */
.telefonia-hero-sub { color:#e8f1f6; font-size:clamp(.95rem,1.15vw,1.05rem); line-height:1.5; max-width:740px; margin:0 auto; text-shadow:none; letter-spacing:.15px; }
.telefonia-hero-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; }
.telefonia-hero-actions a, .telefonia-hero-actions button { position:relative; font-weight:600; letter-spacing:.3px; }
/* Variante primaria: añade un borde semitransparente y glow muy sutil */
/* Botón primario hero: azul sólido consistente con iconografía del heading */
/* Unificación de estilo para los tres botones del hero */
.telefonia-hero-actions a.nt-btn, .telefonia-hero-actions button.nt-btn {
	--_btn-bg:linear-gradient(135deg,#1e3a8a,#1d4ed8 45%,#2563eb 70%,#3b82f6);
	--_btn-bg-hover:linear-gradient(135deg,#ffffff,#f0f7ff 55%,#e4f0ff);
	--_btn-color:#fff;
	--_btn-color-hover:#1d4ed8;
	background:var(--_btn-bg);
	color:var(--_btn-color);
	border:1px solid rgba(255,255,255,.25);
	box-shadow:0 3px 10px -2px rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.15) inset;
	background-size:165% 165%;
	transition:background-position .85s var(--nt-ease), box-shadow .45s var(--nt-ease), transform .45s var(--nt-ease), border-color .45s var(--nt-ease), background .6s var(--nt-ease), color .45s var(--nt-ease);
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:.55rem;
	padding:.85rem 1.25rem .9rem;
	--hero-btn-h:48px;
	min-height:var(--hero-btn-h);
	line-height:1;
	white-space:nowrap;
}
.telefonia-hero-actions a.nt-btn i, .telefonia-hero-actions button.nt-btn i { color:var(--_btn-color); transition:color .45s var(--nt-ease); }
.telefonia-hero-actions a.nt-btn:hover, .telefonia-hero-actions a.nt-btn:focus-visible, .telefonia-hero-actions button.nt-btn:hover, .telefonia-hero-actions button.nt-btn:focus-visible {
	transform:translateY(-2px);
	background:var(--_btn-bg-hover);
	color:var(--_btn-color-hover);
	background-position:65% 30%;
	box-shadow:0 0 0 3px rgba(255,255,255,.10),0 8px 20px -6px rgba(0,0,0,.55),0 0 0 1px rgba(59,130,246,.55),0 0 26px -6px rgba(59,130,246,.55);
	border-color:rgba(255,255,255,.55);
}
.telefonia-hero-actions a.nt-btn:hover i, .telefonia-hero-actions a.nt-btn:focus-visible i, .telefonia-hero-actions button.nt-btn:hover i, .telefonia-hero-actions button.nt-btn:focus-visible i { color:var(--_btn-color-hover); }
.telefonia-hero-actions a.nt-btn:active, .telefonia-hero-actions button.nt-btn:active { transform:translateY(0); box-shadow:0 2px 8px -3px rgba(0,0,0,.55),0 0 0 1px rgba(59,130,246,.55); }
@media (max-width:640px){
	.telefonia-hero-actions a.nt-btn, .telefonia-hero-actions button.nt-btn { --hero-btn-h:46px; padding:.75rem 1rem .8rem; font-size:.9rem; }
}
/* Variante secundaria / ghost dentro del hero: refuerzo de borde y fondo translúcido para contraste */
/* Botón secundario (ghost) ahora en azul tenue para armonizar */
/* Eliminadas variantes previas: se unifica apariencia */
/* Estado activo para ambos tipos (clic) */
.telefonia-hero-actions a.nt-btn-primary:active, .telefonia-hero-actions button.nt-btn-primary:active, .telefonia-hero-actions a.nt-btn-ghost:active, .telefonia-hero-actions button.nt-btn-ghost:active {
	transform:translateY(0);
	box-shadow:0 1px 3px -1px rgba(0,0,0,.5);
}
@media (prefers-reduced-motion:reduce){
	.telefonia-hero-actions a.nt-btn-primary, .telefonia-hero-actions button.nt-btn-primary, .telefonia-hero-actions a.nt-btn-ghost, .telefonia-hero-actions button.nt-btn-ghost { transition:none; }
}
@media (max-width:640px){ .telefonia-hero { min-height:520px; padding-top:140px; } }
@media (prefers-reduced-motion: reduce){ .telefonia-hero-inner [class*='translate-y-10'] { transform:none !important; opacity:1 !important; } }
@media (max-width:640px){ .telefonia-hero { min-height:520px; padding-top:140px; } }
@media (prefers-reduced-motion: reduce){ .telefonia-hero-inner [class*='translate-y-10'] { transform:none !important; opacity:1 !important; } }

/* Espaciado sección Dispositivos */
#dispositivos #dispositivos-title { margin-bottom:2.4rem; }
#dispositivos #dispositivos-title .nt-heading { margin-bottom:.65rem; }
#dispositivos .grid { margin-top:.5rem; }

.telefonia-plans { position:relative; }
/* ================= REDISEÑO TARJETAS PLANES ================= */
/* Sistema de variables por tarjeta (se asignan por data-plan-tier) */
.tel-plan-card { --plan-accent:#3b82f6; --plan-accent-soft:rgba(59,130,246,.12); --plan-accent-grad:linear-gradient(135deg,#2563eb,#3b82f6 55%,#60a5fa); --plan-accent-border:rgba(59,130,246,.45); --plan-price-grad:linear-gradient(90deg,#1e3a5f,#102234); --plan-bg:linear-gradient(165deg,#ffffff 0%,#f5f9ff 60%,#eef6ff 100%); --plan-bg-alt:linear-gradient(145deg,rgba(255,255,255,.65),rgba(255,255,255,.35)); position:relative; display:flex; flex-direction:column; gap:1rem; padding:1.65rem 1.55rem 1.85rem; background:var(--plan-bg); border:1px solid rgba(213,226,238,.95); border-radius:28px; box-shadow:0 6px 18px -8px rgba(15,23,42,.18),0 2px 8px rgba(15,23,42,.06); overflow:hidden; isolation:isolate; text-align:left; transition:border-color .5s var(--nt-ease), box-shadow .55s var(--nt-ease), transform .55s var(--nt-ease); }
.tel-plan-card:before { content:""; position:absolute; inset:0; background:
	radial-gradient(circle at 18% 20%, var(--plan-accent-soft), transparent 58%),
	radial-gradient(circle at 82% 78%, rgba(255,255,255,.65), transparent 62%);
	opacity:.9; pointer-events:none; mix-blend-mode:overlay; transition:opacity .6s var(--nt-ease); }
.tel-plan-card:after { content:""; position:absolute; inset:-1px; padding:1px; border-radius:inherit; background:linear-gradient(145deg,rgba(255,255,255,.35),rgba(255,255,255,0)); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; opacity:.9; }
.tel-plan-card:hover { transform:translateY(-7px); box-shadow:0 20px 44px -18px rgba(15,23,42,.32),0 10px 24px -6px rgba(15,23,42,.16); }
.tel-plan-card:hover:before { opacity:1; }
.tel-plan-card.destacado { --plan-accent:#2563eb; --plan-accent-soft:rgba(37,99,235,.16); --plan-accent-grad:linear-gradient(135deg,#1d4ed8,#2563eb 55%,#3b82f6); --plan-accent-border:rgba(37,99,235,.6); border:2px solid var(--plan-accent); box-shadow:0 24px 60px -22px rgba(37,99,235,.55),0 10px 28px -6px rgba(37,99,235,.25); }
/* Badge flotante reformulado */
.plan-badge-ribbon { position:absolute; top:14px; right:14px; z-index:6; background:var(--plan-accent-grad); color:#fff; font-size:.62rem; font-weight:800; letter-spacing:.9px; text-transform:uppercase; padding:.45rem .75rem .4rem; border-radius:999px; box-shadow:0 4px 14px -4px rgba(37,99,235,.55),0 2px 6px rgba(15,23,42,.25); display:flex; align-items:center; gap:.35rem; }
.plan-badge-ribbon span { display:block; }
/* Encabezado */
.tel-plan-header { display:flex; flex-direction:column; align-items:flex-start; gap:.65rem; }
/* Icono */
.tel-plan-icon { width:64px; height:64px; border-radius:20px; position:relative; display:flex; align-items:center; justify-content:center; font-size:1.45rem; font-weight:900; background:var(--plan-bg-alt); border:1px solid var(--plan-accent-border); box-shadow:0 6px 16px -6px rgba(15,23,42,.22),0 2px 6px rgba(15,23,42,.12); overflow:hidden; backdrop-filter:saturate(1.2) blur(2px); -webkit-backdrop-filter:saturate(1.2) blur(2px); }
.tel-plan-icon:before { content:""; position:absolute; inset:0; background:var(--plan-accent-grad); opacity:.6; mix-blend-mode:overlay; }
.tel-plan-icon:after { content:""; position:absolute; inset:0; background:var(--nt-plan-icon-sheen); mix-blend-mode:screen; transform:translateX(-65%); animation:ntIconSheen 5.5s cubic-bezier(.4,.8,.4,1) infinite; opacity:.85; pointer-events:none; }
.tel-plan-icon i { position:relative; z-index:1; color:var(--plan-accent); text-shadow:none; }
/* Títulos */
.tel-plan-title { font-size:1.15rem; font-weight:900; letter-spacing:.4px; color:#0f2335; margin:0; }
.tel-plan-tagline { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:1.1px; margin:0; background:var(--plan-accent-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
/* Lista de características */
.tel-plan-features { list-style:none; margin:.2rem 0 0; padding:0; display:flex; flex-direction:column; gap:.55rem; font-size:.9rem; }
.tel-plan-features li { display:flex; gap:.55rem; line-height:1.45; color:#24465c; font-weight:500; }
.tel-plan-features i { color:var(--plan-accent); font-size:.9rem; margin-top:.15rem; }
/* Precio */
.tel-plan-pricewrap { margin-top:.8rem; text-align:left; position:relative; }
.tel-plan-price { --_grad:var(--plan-price-grad); font-size:1.95rem; font-weight:900; letter-spacing:.5px; display:inline-flex; align-items:baseline; gap:.35rem; background:var(--_grad); -webkit-background-clip:text; background-clip:text; color:transparent; position:relative; line-height:1; }
.tel-plan-price:after { content:""; position:absolute; left:0; right:0; bottom:-6px; height:3px; border-radius:2px; background:linear-gradient(90deg,var(--plan-accent) 0%,transparent 75%); opacity:.25; }
.tel-plan-price small { font-size:.68rem; font-weight:700; letter-spacing:.6px; background:transparent; color:#4a6a82; }
/* CTA */
.tel-plan-cta { margin-top:auto; }
.tel-plan-card .nt-btn { font-size:.7rem; padding:.72rem 1rem; font-weight:800; letter-spacing:.55px; }
/* Estados de foco accesibles */
.tel-plan-card:focus-within { outline:2px solid var(--plan-accent); outline-offset:3px; }
/* Tier Variables */
.tel-plan-card[data-plan-tier="basico"] { --plan-accent:#2563eb; --plan-accent-soft:rgba(37,99,235,.14); --plan-accent-grad:linear-gradient(135deg,#1d4ed8,#2563eb 55%,#3b82f6); --plan-accent-border:rgba(37,99,235,.55); }
.tel-plan-card[data-plan-tier="premium"] { --plan-accent:#f97316; --plan-accent-soft:rgba(249,115,22,.16); --plan-accent-grad:linear-gradient(135deg,#ea580c,#f97316 55%,#fb923c); --plan-accent-border:rgba(249,115,22,.55); }
.tel-plan-card[data-plan-tier="empresarial"] { --plan-accent:#6366f1; --plan-accent-soft:rgba(99,102,241,.18); --plan-accent-grad:linear-gradient(135deg,#4f46e5,#6366f1 55%,#818cf8); --plan-accent-border:rgba(99,102,241,.55); }
/* Precio adaptando tono según tier (oscurecemos grad base con overlay) */
.tel-plan-card[data-plan-tier="premium"] .tel-plan-price { --plan-price-grad:linear-gradient(90deg,#74320c,#4a1f05); }
.tel-plan-card[data-plan-tier="empresarial"] .tel-plan-price { --plan-price-grad:linear-gradient(90deg,#2d286d,#171640); }
/* Responsive */
@media (max-width:900px){
	.tel-plan-card { padding:1.45rem 1.25rem 1.6rem; }
	.tel-plan-price { font-size:1.7rem; }
	.tel-plan-icon { width:58px; height:58px; font-size:1.3rem; }
	.tel-plan-title { font-size:1.05rem; }
}
@media (prefers-reduced-motion:reduce){
	.tel-plan-card, .tel-plan-card:before { transition:none; }
	.tel-plan-card:hover { transform:none; }
	.tel-plan-icon:after { animation:none; opacity:.55; }
}
/* ============================================================ */
/* ================= NUEVO SISTEMA TEL-PLAN (v2) ============== */
.tel-plans-modern { position:relative; }
.tel-plan { --tp-accent:#2563eb; --tp-accent-rgb:37,99,235; --tp-grad:linear-gradient(145deg,#1e3a8a,#1d4ed8 45%,#2563eb 70%,#3b82f6); --tp-sheen:linear-gradient(110deg,rgba(255,255,255,.0) 0%,rgba(255,255,255,.45) 45%,rgba(255,255,255,0) 70%); --tp-bg:linear-gradient(180deg,#ffffff,#f5f9ff); --tp-border:rgba(210,224,238,.9); --tp-radius:30px; --tp-shadow:0 8px 22px -12px rgba(15,23,42,.20),0 4px 12px rgba(15,23,42,.06); position:relative; display:flex; flex-direction:column; background:var(--tp-bg); border:1px solid var(--tp-border); border-radius:var(--tp-radius); padding:1.5rem 1.35rem 1.6rem; overflow:hidden; isolation:isolate; box-shadow:var(--tp-shadow); transition:box-shadow .6s var(--nt-ease), transform .55s var(--nt-ease), border-color .6s var(--nt-ease); }
.tel-plan:before { content:""; position:absolute; inset:0; background:
	radial-gradient(circle at 18% 18%, rgba(var(--tp-accent-rgb),.18), transparent 55%),
	radial-gradient(circle at 82% 82%, rgba(var(--tp-accent-rgb),.14), transparent 60%);
	opacity:.9; mix-blend-mode:overlay; pointer-events:none; transition:opacity .6s var(--nt-ease); }
.tel-plan:after { content:""; position:absolute; top:0; left:0; right:0; height:42%; background:linear-gradient(180deg,rgba(var(--tp-accent-rgb),.18),rgba(var(--tp-accent-rgb),0)); pointer-events:none; opacity:.85; }
.tel-plan:hover { transform:translateY(-8px); box-shadow:0 22px 50px -20px rgba(15,23,42,.35),0 10px 28px -6px rgba(15,23,42,.16); }
.tel-plan:focus-within { outline:2px solid var(--tp-accent); outline-offset:4px; }
.tel-plan.is-featured { --tp-accent:#1d4ed8; --tp-accent-rgb:29,78,216; border:2px solid var(--tp-accent); box-shadow:0 26px 64px -24px rgba(var(--tp-accent-rgb),.55),0 10px 28px -6px rgba(var(--tp-accent-rgb),.25); }
/* Badge */
.tel-plan__badge { position:absolute; top:14px; right:14px; background:var(--tp-grad); color:#fff; font-size:.6rem; font-weight:800; letter-spacing:.8px; text-transform:uppercase; padding:.5rem .85rem .45rem; border-radius:999px; display:inline-flex; align-items:center; gap:.4rem; box-shadow:0 4px 14px -4px rgba(var(--tp-accent-rgb),.55),0 2px 6px rgba(15,23,42,.3); z-index:4; }
.tel-plan__badge i { font-size:.75rem; }
/* Header */
.tel-plan__hdr { position:relative; display:flex; gap:.85rem; align-items:center; margin-bottom:1rem; }
.tel-plan__icon { width:62px; height:62px; border-radius:22px; background:linear-gradient(145deg,rgba(255,255,255,.75),rgba(255,255,255,.45)); display:flex; align-items:center; justify-content:center; font-size:1.45rem; color:var(--tp-accent); font-weight:900; position:relative; overflow:hidden; border:1px solid rgba(var(--tp-accent-rgb),.45); box-shadow:0 6px 16px -6px rgba(15,23,42,.25),0 2px 6px rgba(15,23,42,.15); backdrop-filter:saturate(1.2) blur(2px); -webkit-backdrop-filter:saturate(1.2) blur(2px); }
.tel-plan__icon:before { content:""; position:absolute; inset:0; background:var(--tp-grad); opacity:.55; mix-blend-mode:overlay; }
.tel-plan__icon:after { content:""; position:absolute; inset:0; background:var(--tp-sheen); transform:translateX(-60%); mix-blend-mode:screen; animation:ntIconSheen 5.5s cubic-bezier(.4,.8,.4,1) infinite; opacity:.85; }
.tel-plan__titles { display:flex; flex-direction:column; }
.tel-plan__name { font-size:1.15rem; font-weight:900; letter-spacing:.4px; margin:0; color:#0f2335; }
.tel-plan__tag { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:1.1px; margin:.15rem 0 0; background:var(--tp-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
/* Body */
.tel-plan__body { display:flex; flex-direction:column; gap:1rem; }
.tel-plan__features { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem; font-size:.9rem; }
.tel-plan__features li { display:flex; gap:.55rem; align-items:flex-start; line-height:1.45; color:#27475a; font-weight:500; }
.tel-plan__features i { color:var(--tp-accent); font-size:.9rem; margin-top:.15rem; }
.tel-plan__meta { display:flex; align-items:flex-end; justify-content:space-between; margin-top:.25rem; }
.tel-plan__price { font-size:1.9rem; font-weight:900; letter-spacing:.5px; line-height:1; background:linear-gradient(90deg,#1e3a5f,#102234); -webkit-background-clip:text; background-clip:text; color:transparent; position:relative; }
.tel-plan__price small { font-size:.65rem; font-weight:700; letter-spacing:.6px; color:#4a6a82; background:transparent; }
.tel-plan__price:after { content:""; position:absolute; left:0; bottom:-6px; height:3px; width:70%; border-radius:3px; background:linear-gradient(90deg,var(--tp-accent),transparent); opacity:.3; }
/* Footer */
.tel-plan__ftr { margin-top:auto; padding-top:1.05rem; }
.tel-plan__btn { width:100%; justify-content:center; font-size:.72rem; font-weight:800; letter-spacing:.55px; padding:.85rem 1.05rem .9rem; }
/* Variantes tier */
.tel-plan--tier-basico { --tp-accent:#2563eb; --tp-accent-rgb:37,99,235; --tp-grad:linear-gradient(145deg,#1d4ed8,#2563eb 55%,#3b82f6); }
.tel-plan--tier-premium { --tp-accent:#f97316; --tp-accent-rgb:249,115,22; --tp-grad:linear-gradient(145deg,#ea580c,#f97316 55%,#fb923c); }
.tel-plan--tier-empresarial { --tp-accent:#6366f1; --tp-accent-rgb:99,102,241; --tp-grad:linear-gradient(145deg,#4f46e5,#6366f1 55%,#818cf8); }
/* Hover adaptativo a gradiente */
.tel-plan--tier-premium:hover { box-shadow:0 26px 60px -22px rgba(249,115,22,.55),0 10px 28px -6px rgba(249,115,22,.25); }
.tel-plan--tier-empresarial:hover { box-shadow:0 26px 60px -22px rgba(99,102,241,.55),0 10px 28px -6px rgba(99,102,241,.25); }
/* Responsivo */
@media (max-width:900px){
	.tel-plan { padding:1.35rem 1.1rem 1.45rem; }
	.tel-plan__icon { width:56px; height:56px; font-size:1.25rem; }
	.tel-plan__price { font-size:1.65rem; }
	.tel-plan__name { font-size:1.05rem; }
}
@media (prefers-reduced-motion:reduce){
	.tel-plan, .tel-plan:before { transition:none; }
	.tel-plan:hover { transform:none; }
	.tel-plan__icon:after { animation:none; opacity:.55; }
}
/* ============================================================ */
/* ========== DISPOSITIVOS (cards profesionales) ========== */
.dev-cards-grid { display:grid; gap:2.2rem; margin-top:3.2rem; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); }
@media (min-width:1100px){ .dev-cards-grid { grid-template-columns:repeat(3,1fr); } }
.dev-card { position:relative; display:flex; flex-direction:column; background:linear-gradient(160deg,#ffffff,#f5f9ff); border:1px solid #d7e3ef; border-radius:30px; overflow:hidden; box-shadow:0 10px 26px -14px rgba(15,23,42,.18),0 4px 10px rgba(15,23,42,.06); isolation:isolate; min-height:100%; }
.dev-card:before { content:""; position:absolute; inset:0; background:
	radial-gradient(circle at 18% 16%, rgba(111,164,255,.18), transparent 60%),
	radial-gradient(circle at 82% 84%, rgba(155,196,255,.16), transparent 62%);
	mix-blend-mode:overlay; opacity:.85; pointer-events:none; transition:opacity .6s var(--nt-ease); }
.dev-card:after { content:""; position:absolute; top:0; left:0; right:0; height:38%; background:linear-gradient(180deg,rgba(31,74,125,.22),rgba(31,74,125,0)); pointer-events:none; opacity:.9; }
.dev-card__media { position:relative; aspect-ratio:16/10; overflow:hidden; }
.dev-card__media img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; filter:saturate(1.05); transition:transform 1.2s cubic-bezier(.4,.8,.4,1), filter .8s; }
.dev-card__content { position:relative; display:flex; flex-direction:column; gap:1rem; padding:1.45rem 1.35rem 1.55rem; flex:1; }
.dev-card__title { font-size:1.05rem; font-weight:900; letter-spacing:.45px; margin:0; display:flex; align-items:center; gap:.6rem; color:#0f2535; }
.dev-card__icon { width:46px; height:46px; border-radius:16px; background:linear-gradient(145deg,rgba(255,255,255,.75),rgba(255,255,255,.5)); display:inline-flex; align-items:center; justify-content:center; font-size:1.15rem; color:#2563eb; position:relative; overflow:hidden; border:1px solid rgba(111,164,255,.45); box-shadow:0 6px 14px -6px rgba(15,23,42,.25),0 2px 6px rgba(15,23,42,.12); backdrop-filter:saturate(1.2) blur(2px); -webkit-backdrop-filter:saturate(1.2) blur(2px); }
.dev-card__icon:before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,#1d4d7a,#1b3c5d,#153551); opacity:.5; mix-blend-mode:overlay; }
.dev-card__desc { font-size:.88rem; line-height:1.5; color:#335066; margin:0; font-weight:500; letter-spacing:.2px; }
.dev-card__highlights { list-style:none; margin:.2rem 0 0; padding:0; display:flex; flex-direction:column; gap:.45rem; font-size:.78rem; font-weight:600; letter-spacing:.35px; }
.dev-card__highlights li { display:flex; align-items:flex-start; gap:.5rem; color:#1d4157; line-height:1.4; }
.dev-card__highlights i { color:#2563eb; font-size:.85rem; margin-top:.05rem; }
/* Variante alterna (middle card) */
.dev-card--alt { background:linear-gradient(165deg,#ffffff,#f3f8ff 55%,#eef5ff); }
.dev-card--alt:after { background:linear-gradient(180deg,rgba(96,117,255,.22),rgba(96,117,255,0)); }
.dev-card--alt .dev-card__icon { color:#6366f1; border-color:rgba(120,125,255,.45); }
.dev-card--alt .dev-card__highlights i { color:#6366f1; }
/* Interacciones */
.dev-card { transition:transform .55s cubic-bezier(.4,.8,.4,1), box-shadow .55s cubic-bezier(.4,.8,.4,1); }
.dev-card:hover { transform:translateY(-10px); box-shadow:0 24px 52px -20px rgba(15,23,42,.35),0 10px 28px -6px rgba(15,23,42,.16); }
.dev-card:hover:before { opacity:1; }
.dev-card:hover .dev-card__media img { transform:scale(1.06); filter:saturate(1.15); }
.dev-card:focus-within { outline:2px solid #2563eb; outline-offset:4px; }
/* Animación escalonada al entrar */
.dev-cards-grid .dev-card { opacity:0; transform:translateY(18px); animation: devCardIn .9s cubic-bezier(.4,.8,.4,1) forwards; }
.dev-cards-grid .dev-card:nth-child(1){ animation-delay:.1s; }
.dev-cards-grid .dev-card:nth-child(2){ animation-delay:.25s; }
.dev-cards-grid .dev-card:nth-child(3){ animation-delay:.4s; }
@keyframes devCardIn { 0% { opacity:0; transform:translateY(28px) scale(.97); filter:blur(4px);} 60% { filter:blur(0); } 100% { opacity:1; transform:translateY(0) scale(1);} }
/* Responsivo */
@media (max-width:820px){
	.dev-card__content { padding:1.25rem 1.1rem 1.35rem; }
	.dev-card__title { font-size:1rem; }
	.dev-card__icon { width:44px; height:44px; font-size:1.05rem; }
	.dev-card__price { font-size:1.65rem; }
}
@media (prefers-reduced-motion:reduce){
	.dev-cards-grid .dev-card { animation:none; opacity:1; transform:none; }
	.dev-card, .dev-card__media img { transition:none; }
}