mirror of
https://github.com/marcogll/AnchorOS.git
synced 2026-03-15 22:24:34 +00:00
bf607f7aa6
- Crear landing page con hero, fundamento, servicios y testimoniales - Crear página de servicios con grid y descripciones - Crear página de historia con filosofía de la marca - Crear página de contacto con formulario - Crear página de franchises con solicitud - Crear página de membresías con 3 tiers (Gold, Black, VIP) - Crear páginas de Privacy Policy y Legal - Implementar header y footer global - Estilos con Tailwind CSS según especificaciones - HTML semántico y estructura clara - Conversión silenciosa hacia booking.anchor23.mx
89 lines
4.0 KiB
TypeScript
89 lines
4.0 KiB
TypeScript
export default function HistoriaPage() {
|
|
return (
|
|
<div className="section">
|
|
<div className="section-header">
|
|
<h1 className="section-title">Nuestra Historia</h1>
|
|
<p className="section-subtitle">
|
|
El origen de una marca que redefine el estándar de belleza exclusiva.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="max-w-7xl mx-auto px-6">
|
|
<section className="foundation mb-24">
|
|
<article>
|
|
<h2>El Fundamento</h2>
|
|
<h3 className="text-3xl md:text-4xl font-bold text-gray-900 mb-6">Nada sólido nace del caos</h3>
|
|
<p className="text-lg text-gray-600 leading-relaxed mb-6">
|
|
Anchor:23 nace de la unión de dos creativos que creen en el lujo
|
|
como estándar, no como promesa.
|
|
</p>
|
|
<p className="text-lg text-gray-600 leading-relaxed">
|
|
En un mundo saturado de opciones, decidimos crear algo diferente:
|
|
un refugio donde la precisión técnica se encuentra con la elegancia
|
|
atemporal, donde cada detalle importa y donde la exclusividad es
|
|
inherente, no promocional.
|
|
</p>
|
|
</article>
|
|
|
|
<aside className="foundation-image">
|
|
<div className="w-full h-full bg-gradient-to-br from-gray-200 to-gray-300 flex items-center justify-center">
|
|
<span className="text-gray-500 text-lg">Imagen Historia</span>
|
|
</div>
|
|
</aside>
|
|
</section>
|
|
|
|
<section className="max-w-4xl mx-auto mb-24">
|
|
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">El Significado</h2>
|
|
|
|
<div className="grid md:grid-cols-2 gap-8">
|
|
<div className="p-8 bg-white rounded-2xl shadow-lg border border-gray-100">
|
|
<h3 className="text-2xl font-bold text-gray-900 mb-4">ANCHOR</h3>
|
|
<p className="text-gray-600 leading-relaxed">
|
|
El ancla representa estabilidad, firmeza y permanencia.
|
|
Es el símbolo de nuestro compromiso con la calidad constante
|
|
y la excelencia sin concesiones.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="p-8 bg-white rounded-2xl shadow-lg border border-gray-100">
|
|
<h3 className="text-2xl font-bold text-gray-900 mb-4">:23</h3>
|
|
<p className="text-gray-600 leading-relaxed">
|
|
El dos y tres simbolizan la dualidad equilibrada: precisión
|
|
técnica y creatividad artística, tradición e innovación,
|
|
rigor y calidez.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section className="max-w-4xl mx-auto">
|
|
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">Nuestra Filosofía</h2>
|
|
|
|
<div className="space-y-6">
|
|
<div className="p-6 bg-gradient-to-r from-gray-50 to-white rounded-xl border border-gray-100">
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-3">Lujo como Estándar</h3>
|
|
<p className="text-gray-600">
|
|
No es lo extrañamente costoso, es lo excepcionalmente bien hecho.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="p-6 bg-gradient-to-r from-gray-50 to-white rounded-xl border border-gray-100">
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-3">Exclusividad Inherente</h3>
|
|
<p className="text-gray-600">
|
|
Una sucursal por ciudad, invitación por membresía, calidad por convicción.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="p-6 bg-gradient-to-r from-gray-50 to-white rounded-xl border border-gray-100">
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-3">Precisión Absoluta</h3>
|
|
<p className="text-gray-600">
|
|
Cada corte, cada color, cada tratamiento ejecutado con la máxima perfección técnica.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|