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

body{
font-family: 'Inter', sans-serif;
background:#f5f7fb;
color:#1e293b;
text-rendering:optimizeLegibility;
-webkit-font-smoothing:antialiased;
}

html {
scroll-behavior: smooth;
}

.container{
max-width:var(--container-width);
margin:auto;
padding:0 clamp(20px,4vw,32px);
}

/* =========================
   Sistema base de secciones
========================= */

.section{
padding:110px 0;
position:relative;
}

.section-sm{
padding:80px 0;
}

.section-lg{
padding:140px 0;
}

.section-title{
font-size:clamp(28px,3vw,38px);
line-height:1.2;
letter-spacing:-0.02em;
margin-bottom:18px;
color:#0f172a;
}

.section-subtitle{
max-width:760px;
margin:auto;
color:#475569;
font-size:18px;
line-height:1.6;
}

.hero{
padding:130px 0 120px;
background:linear-gradient(
180deg,
#f9fbff 0%,
#f1f5fb 58%,
#ffffff 100%
);
position:relative;
overflow:hidden;
}

.hero::before{
content:"";
position:absolute;
inset:0;
background:
radial-gradient(circle at 12% 18%, rgba(37,99,235,0.07), transparent 30%),
radial-gradient(circle at 84% 26%, rgba(37,99,235,0.05), transparent 28%);
pointer-events:none;
}

.hero-content{
display:flex;
align-items:center;
justify-content:space-between;
gap:56px;
position:relative;
z-index:1;
}

.hero-text{
flex:1;
max-width:var(--hero-text-max);
}

.hero-text h1{
font-size:60px;
line-height:1.02;
font-weight:700;
margin-bottom:24px;
letter-spacing:-0.04em;
max-width:12ch;
}

.hero-text p{
font-size:18px;
line-height:1.78;
margin-bottom:34px;
color:#475569;
max-width:58ch;
}

.cta{
background:var(--color-primary);
color:white;
padding:16px 32px;
border-radius:14px;
text-decoration:none;
display:inline-flex;
align-items:center;
justify-content:center;
font-weight:600;
letter-spacing:-0.01em;
transition:
transform .25s ease,
box-shadow .25s ease,
background .25s ease,
filter .25s ease;
box-shadow:var(--shadow-cta);
min-height:52px;
}

.cta:hover{
background:var(--color-primary-dark);
transform:translateY(-2px);
box-shadow:0 18px 38px rgba(37, 99, 235, 0.30);
filter:saturate(1.04);
}

.cta:active{
transform:translateY(1px);
}

.hero-image{
flex:1;
position:relative;
overflow:hidden;
border-radius:20px;
}

.hero-image::before{
content:"";
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:120%;
height:120%;
background:radial-gradient(
circle,
rgba(37,99,235,0.18) 0%,
rgba(37,99,235,0.10) 35%,
rgba(37,99,235,0.04) 55%,
transparent 70%
);
filter:blur(60px);
z-index:0;
}

.hero-image img{
width:100%;
display:block;
border-radius:20px;
box-shadow:0 20px 60px rgba(15,23,42,0.12);
position:relative;
z-index:1;
transition:transform var(--transition-base), box-shadow var(--transition-base);
}

.features{
padding:120px 0;
background:#ffffff;
scroll-margin-top:110px;
}

.features h2{
font-size:42px;
text-align:center;
margin-bottom:70px;
color:#1e293b;
letter-spacing:-0.02em;
}

.features-grid{
display:grid;
grid-template-columns:repeat(4, 1fr);
gap:24px;
}

.feature-card{
background:#ffffff;
border:1px solid #e2e8f0;
border-radius:20px;
padding:34px 28px;
box-shadow:0 12px 28px rgba(15,23,42,0.06);
transition:all .25s ease;
}

.feature-card:hover{
transform:translateY(-6px);
box-shadow:0 20px 45px rgba(15,23,42,0.10);
border-color:#dbe3f0;
}

.feature-card:hover h3{
color:#2563eb;
}

.feature-card h3{
font-size:22px;
margin-bottom:14px;
color:#0f172a;
}

.feature-card p{
font-size:16px;
line-height:1.7;
color:#475569;
}

.architecture{
padding:120px 0;
background:#f1f5f9;
}

.architecture-content{
display:flex;
align-items:center;
gap:60px;
}

.architecture-image{
flex:1;
overflow:hidden;
border-radius:16px;
}

.architecture-image img{
width:100%;
display:block;
border-radius:16px;
box-shadow:0 16px 36px rgba(15,23,42,0.08);
}

.architecture-text{
flex:1;
max-width:520px;
}

.architecture-text h2{
font-size:38px;
margin-bottom:20px;
color:#1e293b;
}

.architecture-text p{
font-size:17px;
line-height:1.6;
margin-bottom:24px;
color:#475569;
}

.architecture-list{
list-style:none;
padding:0;
}

.architecture-list li{
margin-bottom:10px;
font-size:16px;
color:#334155;
}

.product-section{
padding:120px 0;
background:#ffffff;
}

.product-content{
display:flex;
align-items:center;
gap:60px;
}

.product-text{
flex:1;
max-width:540px;
}

.product-text h2{
font-size:38px;
margin-bottom:20px;
color:#1e293b;
}

.product-text p{
font-size:17px;
line-height:1.6;
margin-bottom:24px;
color:#475569;
}

.product-list{
list-style:none;
padding:0;
margin-bottom:30px;
}

.product-list li{
margin-bottom:14px;
font-size:16px;
color:#334155;
line-height:1.5;
}

.product-image{
flex:1;
overflow:hidden;
border-radius:16px;
}

.product-image img{
width:100%;
display:block;
border-radius:16px;
box-shadow:0 16px 36px rgba(15,23,42,0.08);
}

.secondary-cta{
background:#0f172a;
padding:14px 28px;
border-radius:10px;
font-weight:600;
transition:0.2s;
}

.secondary-cta:hover{
background:#1e293b;
}

.process-section{
padding:120px 0;
background:#f8fafc;
}

.process-content{
display:flex;
align-items:center;
gap:60px;
}

.process-image{
flex:1;
overflow:hidden;
border-radius:16px;
}

.process-image img{
width:100%;
display:block;
border-radius:16px;
box-shadow:0 16px 36px rgba(15,23,42,0.08);
}

.process-text{
flex:1;
max-width:540px;
}

.process-text h2{
font-size:38px;
margin-bottom:20px;
color:#1e293b;
}

.process-text p{
font-size:17px;
line-height:1.6;
margin-bottom:24px;
color:#475569;
}

.process-list{
list-style:none;
padding:0;
}

.process-list li{
margin-bottom:14px;
font-size:16px;
line-height:1.5;
color:#334155;
}

.final-cta{
padding:130px 0;
background:#ffffff;
text-align:center;
}

.final-cta-container{
max-width:720px;
margin:auto;
}

.final-cta h2{
font-size:42px;
margin-bottom:20px;
color:#1e293b;
}

.final-cta p{
font-size:18px;
line-height:1.6;
color:#475569;
margin-bottom:40px;
}

.final-cta-button{
font-size:18px;
padding:16px 34px;
border-radius:10px;
}

.footer{
background:#0f172a;
padding:60px 0;
margin-top:80px;
}

.footer-content{
display:flex;
justify-content:space-between;
align-items:center;
gap:24px;
}

.footer-logo{
font-size:24px;
font-weight:700;
color:#ffffff;
margin-bottom:8px;
}

.footer-brand p{
color:#94a3b8;
font-size:15px;
}

.footer-nav{
display:flex;
flex-wrap:wrap;
gap:20px;
}

.footer-nav a{
color:#cbd5e1;
text-decoration:none;
font-size:15px;
transition:color var(--transition-fast), transform var(--transition-fast);
}

.footer-nav a:hover{
color:#ffffff;
transform:translateY(-1px);
}

.trust-section{
padding:120px 0;
background:linear-gradient(
180deg,
#ffffff 0%,
#f5f8ff 100%
);
}

.trust-header{
max-width:820px;
margin:0 auto 64px;
text-align:center;
}

.trust-header h2{
font-size:44px;
line-height:1.1;
letter-spacing:-0.03em;
font-weight:700;
}

.trust-header p{
font-size:18px;
line-height:1.7;
color:#475569;
}

.trust-grid{
display:grid;
grid-template-columns:repeat(3, 1fr);
gap:28px;
max-width:1100px;
margin:auto;
}

.trust-card{
background:#ffffff;
border:1px solid #e2e8f0;
border-radius:20px;
padding:34px 28px;
box-shadow:0 12px 28px rgba(15,23,42,0.06);
transition:all .25s ease;
}

.trust-card:hover{
transform:translateY(-6px);
box-shadow:0 20px 45px rgba(15,23,42,0.10);
border-color:#dbe3f0;
}

.trust-card h3{
font-size:22px;
margin-bottom:14px;
color:#0f172a;
transition:color .25s ease;
}

.trust-card:hover h3{
color:#2563eb;
}

.trust-card p{
font-size:16px;
line-height:1.7;
color:#475569;
}

.hero-image:hover img,
.architecture-image:hover img,
.product-image:hover img,
.process-image:hover img,
.architecture-overview-image:hover img,
.product-visual-image:hover img,
.applications-processes-image:hover img {
transform: translateY(-4px);
box-shadow: var(--shadow-image-hover);
will-change: transform;
}

section,
.content-block,
.page-cta-block,
.final-cta {
scroll-margin-top: 110px;
}