Mauri
393f6b0dc3
- Arista Pro Alternate Regular self-hosted (font corporativa) - Toggle theme con CSS variables y @custom-variant dark - 6 servicios en 3 categorías (Hosting & Correo / Diseño & Contenido / Infraestructura) - 3 planes destacados (Básico USD 59, Institucional USD 129, E-commerce USD 219) - Datacenters en 4 países (Canadá, USA, Alemania, Uruguay) sin ciudades en el sitio - Sede operativa en Maldonado, Uruguay - i18n es/en con contenido duplicado en Keystatic - Endpoint PHP para form de contacto con PHPMailer + reCAPTCHA v3 + honeypot + rate limit - WorldMap con animación SVG de los 4 países - 29 páginas generadas, 0 JS por default - Sitemap auto + robots.txt - JSON-LD Organization + ProfessionalService con areaServed
36 lines
1.3 KiB
Plaintext
36 lines
1.3 KiB
Plaintext
---
|
|
import type { TranslationKey } from '@/i18n/ui';
|
|
import StatCounter from './StatCounter.astro';
|
|
|
|
interface Props {
|
|
t: (key: TranslationKey) => string;
|
|
}
|
|
const { t } = Astro.props;
|
|
|
|
const stats = [
|
|
{ value: '26+', label: 'Años de experiencia', sub: 'Desde el 2000' },
|
|
{ value: '100+', label: 'Proyectos hospedados', sub: 'Webs, e-commerce, infra' },
|
|
{ value: '4', label: 'Países', sub: 'Canadá, USA, Alemania, UY' },
|
|
{ value: 'Senior', label: 'Equipo senior', sub: 'SysAdmin / SRE' },
|
|
];
|
|
---
|
|
<section class="py-20 md:py-24" style="background: var(--hds-bg); border-top: 1px solid var(--hds-line); border-bottom: 1px solid var(--hds-line);">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="grid grid-cols-2 md:grid-cols-4 gap-10 md:gap-8">
|
|
{stats.map((stat) => (
|
|
<div class="text-center">
|
|
<div class="font-display leading-none mb-3" style="font-size: clamp(3rem, 6vw, 4.5rem); color: var(--color-hds-naranja); font-weight: 500;">
|
|
{stat.value}
|
|
</div>
|
|
<div class="text-sm font-semibold" style="color: var(--hds-fg-soft);">
|
|
{stat.label}
|
|
</div>
|
|
<div class="text-xs mt-1" style="color: var(--hds-fg-muted);">
|
|
{stat.sub}
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|