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

body{
margin:0;
padding:0;
background:
linear-gradient(rgba(8,15,25,.34),rgba(8,15,25,.50)),
url("/assets/img/fondo-gn.webp");
background-size:cover;
background-position:center;
background-repeat:no-repeat;
background-attachment:fixed;
color:#ffffff;
overflow-x:hidden;
font-family:Arial,sans-serif;
box-sizing:border-box;
}

/* HEADER */

.header{
position:fixed;
top:0;
left:0;
width:100%;
z-index:1000;
background:rgba(0,0,0,.94);
border-bottom:1px solid rgba(0,123,255,.25);
}

.topbar{
width:100%;
padding:7px 20px;
background:linear-gradient(90deg,#00111f,#003d80,#00111f);
border-bottom:1px solid rgba(0,162,255,.35);
display:flex;
justify-content:center;
align-items:center;
gap:22px;
font-size:.85rem;
font-weight:700;
color:#dcefff;
box-sizing:border-box;
}

.topbar a{
color:#00a2ff;
text-decoration:none;
font-weight:900;
}

.nav{
width:94%;
max-width:1500px;
margin:0 auto;
padding:12px 22px;
display:flex;
align-items:center;
justify-content:space-between;
box-sizing:border-box;
}

.brand{
display:flex;
align-items:center;
gap:12px;
text-decoration:none;
color:#ffffff;
}

.brand img{
width:58px;
display:block;
}

.brand span{
font-size:1rem;
font-weight:800;
}

.menu{
display:flex;
gap:18px;
align-items:center;
}

.menu a{
text-decoration:none;
color:#ffffff;
font-size:.95rem;
transition:.25s;
white-space:nowrap;
}

.menu a:hover{
color:#00a2ff;
}

/* HERO */

.hero{
display:flex;
align-items:center;
justify-content:center;
padding:165px 24px 95px;
background:rgba(0,0,0,.10);
}

.hero-content{
width:94%;
max-width:1180px;
text-align:center;
}

.badge{
display:inline-block;
padding:9px 18px;
border:1px solid rgba(0,162,255,.45);
border-radius:50px;
color:#00a2ff;
font-weight:bold;
margin-bottom:24px;
background:rgba(0,0,0,.45);
}

.hero h1{
font-size:3rem;
line-height:1.15;
margin:0 0 24px;
}

.hero h1 span{
color:#00a2ff;
}

.intro{
font-size:1.05rem;
line-height:1.65;
opacity:.92;
max-width:980px;
margin:0 auto;
}

.exp{
margin-top:28px;
font-size:1.05rem;
font-weight:800;
color:#00a2ff;
}

.whatsapp-btn{
display:inline-block;
margin-top:34px;
padding:17px 34px;
background:#007bff;
color:#ffffff;
text-decoration:none;
font-weight:bold;
border-radius:12px;
box-shadow:0 0 25px rgba(0,123,255,.35);
transition:.25s;
}

.whatsapp-btn:hover{
transform:translateY(-3px);
background:#0090ff;
}

/* HERO PÁGINAS INTERNAS */

.page-hero{
padding:160px 20px 80px;
text-align:center;
background:rgba(0,0,0,.08);
}

.page-hero h1{
font-size:3rem;
margin:0 0 20px;
text-shadow:0 0 20px rgba(0,162,255,.15);
}

.page-hero p{
max-width:760px;
margin:0 auto;
line-height:1.8;
font-size:1.08rem;
opacity:.92;
}

/* SECCIONES */

.section{
padding:80px 22px;
background:rgba(0,0,0,.06);
}

.section.alt{
background:rgba(0,0,0,.10);
}

.container{
width:94%;
max-width:1500px;
margin:0 auto;
box-sizing:border-box;
}

.section-title{
text-align:center;
font-size:2rem;
margin:0 0 14px;
color:#00a2ff;
}

.section-subtitle{
text-align:center;
max-width:850px;
margin:0 auto 45px;
line-height:1.7;
opacity:.9;
}

/* TARJETAS GENERALES */

.cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:28px;
align-items:stretch;
}

.card{
background:rgba(0,0,0,.48);
backdrop-filter:blur(3px);
border:1px solid rgba(0,123,255,.25);
border-radius:18px;
padding:34px;
box-shadow:0 0 25px rgba(0,123,255,.08);
box-sizing:border-box;
}

.card h3{
margin:0 0 12px;
color:#00a2ff;
}

.card p{
margin:0;
font-size:.98rem;
line-height:1.55;
opacity:.9;
}

.card img{
width:100%;
height:300px;
object-fit:cover;
object-position:center;
display:block;
border-radius:14px;
margin-bottom:18px;
box-shadow:0 0 25px rgba(0,162,255,.08);
}

/* PROYECTOS / GALERÍAS */

.proyectos-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:28px;
align-items:stretch;
}

.proyectos-grid .card{
display:flex;
flex-direction:column;
min-height:100%;
overflow:hidden;
}

.proyectos-grid .card img{
width:100%;
height:300px;
object-fit:cover;
object-position:center;
display:block;
border-radius:14px;
margin-bottom:18px;
}

/* CATEGORÍAS DE PROYECTOS */

.project-catalog{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:28px;
margin:0 auto 55px;
align-items:stretch;
}

.project-category{
display:flex;
flex-direction:column;
text-decoration:none;
color:#ffffff;
background:rgba(0,0,0,.48);
border:1px solid rgba(0,123,255,.28);
border-radius:18px;
overflow:hidden;
box-shadow:0 0 22px rgba(0,123,255,.08);
transition:.25s;
}

.project-category:hover{
transform:translateY(-5px);
border-color:#00a2ff;
background:rgba(0,123,255,.16);
box-shadow:0 0 28px rgba(0,123,255,.22);
}

.project-category img{
width:100%;
height:260px;
object-fit:cover;
object-position:center;
display:block;
}

.project-category div{
padding:22px;
}

.project-category h3{
margin:0 0 10px;
color:#00a2ff;
font-size:1.15rem;
}

.project-category p{
margin:0;
line-height:1.55;
opacity:.9;
font-size:.95rem;
}

/* CONTACTO */

.contact-layout{
display:block;
max-width:1050px;
margin:0 auto;
}

.contact-info{
display:none;
}

.contact-form{
display:flex;
flex-direction:column;
width:100%;
}

.contact-form h3{
margin-top:0;
}

.contact-form label{
display:block;
margin:16px 0 7px;
font-weight:800;
color:#00a2ff;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
width:100%;
padding:14px 15px;
border-radius:10px;
border:1px solid rgba(0,123,255,.35);
background:rgba(0,0,0,.55);
color:white;
font-size:1rem;
box-sizing:border-box;
outline:none;
}

.contact-form textarea{
min-height:140px;
resize:vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
color:rgba(255,255,255,.55);
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
border-color:#00a2ff;
box-shadow:0 0 18px rgba(0,162,255,.18);
}

.form-buttons{
display:flex;
gap:18px;
flex-wrap:wrap;
margin-top:28px;
}

.form-buttons button{
border:none;
padding:16px 26px;
border-radius:12px;
background:#007bff;
color:white;
font-weight:900;
cursor:pointer;
box-shadow:0 0 22px rgba(0,123,255,.30);
transition:.25s;
}

.form-buttons button:hover{
background:#0090ff;
transform:translateY(-3px);
}

.contact-bottom{
margin-top:32px;
text-align:center;
}

/* FOOTER */

.footer{
padding:35px 20px;
text-align:center;
background:#030303;
border-top:1px solid rgba(0,123,255,.2);
font-size:.9rem;
}

.designer-credit{
display:inline-block;
margin-top:10px;
color:#ffd76a;
font-size:.9rem;
font-weight:800;
letter-spacing:.4px;
text-shadow:
0 0 5px #ffd76a,
0 0 12px rgba(255,215,106,.95),
0 0 24px rgba(255,180,0,.75),
0 0 42px rgba(255,180,0,.55);
animation:goldGlow 2.4s ease-in-out infinite alternate;
}

@keyframes goldGlow{
from{
text-shadow:
0 0 4px #ffd76a,
0 0 10px rgba(255,215,106,.75),
0 0 20px rgba(255,180,0,.45);
}
to{
text-shadow:
0 0 8px #fff1a8,
0 0 18px rgba(255,215,106,1),
0 0 34px rgba(255,180,0,.85),
0 0 52px rgba(255,180,0,.65);
}
}

/* RESPONSIVE */

@media(max-width:1100px){

.project-catalog{
grid-template-columns:repeat(2,1fr);
}

.cards,
.proyectos-grid{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:850px){

body{
background-attachment:scroll;
}

.topbar{
flex-direction:column;
gap:4px;
text-align:center;
font-size:.78rem;
}

.nav{
flex-direction:column;
padding:12px 16px;
}

.menu{
flex-wrap:wrap;
justify-content:center;
gap:12px;
}

.brand img{
width:50px;
}

.brand span{
font-size:.9rem;
}

.hero{
padding:190px 20px 75px;
}

.hero h1,
.page-hero h1{
font-size:2rem;
}

.intro{
font-size:1rem;
}

.cards,
.proyectos-grid,
.project-catalog{
grid-template-columns:1fr;
}

.card{
padding:26px;
}

.card img,
.proyectos-grid .card img{
height:280px;
}

.project-category img{
height:230px;
}

.form-buttons{
flex-direction:column;
}

.form-buttons button{
width:100%;
}

}

/* ============================= */
/* INICIO NUEVO GN */
/* ============================= */

.home-hero{
padding:150px 24px 70px;
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
background:
radial-gradient(circle at top right,rgba(0,162,255,.16),transparent 32%),
radial-gradient(circle at bottom left,rgba(0,70,140,.20),transparent 36%),
rgba(0,0,0,.12);
box-sizing:border-box;
}

.home-hero-inner{
width:94%;
max-width:1500px;
margin:0 auto;
display:grid;
grid-template-columns:.88fr 1.12fr;
gap:42px;
align-items:center;
box-sizing:border-box;
}

.home-copy{
text-align:left;
}

.home-copy .badge{
margin-bottom:22px;
}

.home-copy h1{
font-size:3.4rem;
line-height:1.05;
margin:0 0 24px;
text-transform:uppercase;
letter-spacing:.5px;
}

.home-copy h1 span{
display:block;
color:#00a2ff;
text-shadow:0 0 24px rgba(0,162,255,.24);
}

.home-copy p{
font-size:1.03rem;
line-height:1.75;
opacity:.92;
max-width:650px;
margin:0 0 16px;
}

.home-actions{
display:flex;
gap:16px;
flex-wrap:wrap;
align-items:center;
margin-top:30px;
}

.secondary-btn{
display:inline-block;
padding:17px 30px;
border:1px solid rgba(0,162,255,.55);
border-radius:12px;
color:#ffffff;
text-decoration:none;
font-weight:900;
background:rgba(0,0,0,.45);
box-shadow:0 0 22px rgba(0,162,255,.12);
transition:.25s;
}

.secondary-btn:hover{
transform:translateY(-3px);
border-color:#00a2ff;
background:rgba(0,123,255,.18);
box-shadow:0 0 26px rgba(0,162,255,.25);
}

.home-showcase{
display:grid;
grid-template-columns:repeat(6,1fr);
grid-auto-rows:210px;
gap:18px;
}

.home-tile{
position:relative;
grid-column:span 3;
display:block;
overflow:hidden;
border-radius:22px;
border:1px solid rgba(0,162,255,.30);
background:
linear-gradient(135deg,rgba(0,10,18,.95),rgba(0,48,90,.50)),
url("assets/img/fondo-gn.webp");
background-size:cover;
background-position:center;
color:#ffffff;
text-decoration:none;
box-shadow:
0 0 24px rgba(0,123,255,.10),
inset 0 0 45px rgba(0,0,0,.55);
transition:.35s ease;
clip-path:polygon(0 0,92% 0,100% 100%,0 100%);
}

.home-tile:nth-child(even){
clip-path:polygon(8% 0,100% 0,100% 100%,0 100%);
}

.home-tile:hover{
transform:translateY(-7px) scale(1.015);
border-color:#00a2ff;
box-shadow:
0 0 38px rgba(0,162,255,.28),
inset 0 0 50px rgba(0,0,0,.55);
}

.home-tile::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(110deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.45) 55%,rgba(0,162,255,.12) 100%);
z-index:1;
}

.home-tile::after{
content:"";
position:absolute;
top:-40%;
right:-20%;
width:55%;
height:190%;
background:linear-gradient(180deg,transparent,rgba(0,162,255,.38),transparent);
transform:rotate(18deg);
opacity:.22;
z-index:2;
transition:.35s;
}

.home-tile:hover::after{
right:5%;
opacity:.45;
}

.tile-overlay{
position:absolute;
inset:0;
background:radial-gradient(circle at top right,rgba(0,162,255,.22),transparent 35%);
z-index:2;
}

.tile-content{
position:relative;
z-index:3;
height:100%;
padding:28px;
display:flex;
flex-direction:column;
justify-content:flex-end;
box-sizing:border-box;
}

.tile-content span{
display:inline-flex;
width:48px;
height:48px;
align-items:center;
justify-content:center;
background:linear-gradient(135deg,#007bff,#00a2ff);
border-radius:14px;
font-size:1.25rem;
font-weight:900;
box-shadow:0 0 22px rgba(0,162,255,.35);
margin-bottom:auto;
}

.tile-content h2{
margin:18px 0 8px;
font-size:2rem;
line-height:1;
text-transform:uppercase;
}

.tile-content p{
margin:0 0 16px;
font-size:.98rem;
line-height:1.5;
opacity:.9;
max-width:390px;
}

.tile-content strong{
color:#00a2ff;
font-size:.95rem;
letter-spacing:.3px;
}

.tile-big{
grid-column:span 6;
grid-row:span 1;
}

.tile-big .tile-content h2{
font-size:2.7rem;
}

.tile-wide{
grid-column:span 3;
}

/* PROCESO NUEVO */

.home-process{
padding:80px 22px 95px;
background:
linear-gradient(rgba(0,0,0,.10),rgba(0,0,0,.30));
border-top:1px solid rgba(0,162,255,.16);
}

.process-line{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
position:relative;
}

.process-step{
position:relative;
background:rgba(0,0,0,.52);
border:1px solid rgba(0,162,255,.26);
border-radius:20px;
padding:32px;
box-shadow:0 0 25px rgba(0,123,255,.08);
overflow:hidden;
}

.process-step::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#007bff,#00a2ff,transparent);
}

.process-step span{
display:inline-block;
color:#00a2ff;
font-weight:900;
font-size:1.5rem;
margin-bottom:16px;
}

.process-step h3{
margin:0 0 12px;
font-size:1.25rem;
}

.process-step p{
margin:0;
line-height:1.6;
opacity:.9;
}

/* RESPONSIVE INICIO NUEVO */

@media(max-width:1180px){

.home-hero-inner{
grid-template-columns:1fr;
}

.home-copy{
text-align:center;
}

.home-copy p{
margin-left:auto;
margin-right:auto;
}

.home-actions{
justify-content:center;
}

}

@media(max-width:850px){

.home-hero{
padding:200px 18px 65px;
}

.home-copy h1{
font-size:2.2rem;
}

.home-showcase{
grid-template-columns:1fr;
grid-auto-rows:230px;
}

.home-tile,
.home-tile:nth-child(even),
.tile-big,
.tile-wide{
grid-column:span 1;
clip-path:none;
border-radius:18px;
}

.tile-big .tile-content h2,
.tile-content h2{
font-size:1.8rem;
}

.tile-content{
padding:24px;
}

.process-line{
grid-template-columns:1fr;
}

.home-actions a{
width:100%;
text-align:center;
box-sizing:border-box;
}

}

/* AJUSTE BOTONES HOME */

.home-actions{
display:flex;
gap:16px;
flex-wrap:wrap;
align-items:center;
}

.home-actions .whatsapp-btn,
.home-actions .secondary-btn{
height:52px;
min-width:190px;
padding:0 28px;
display:inline-flex;
align-items:center;
justify-content:center;
margin-top:0;
box-sizing:border-box;
line-height:1;
}

.home-actions .whatsapp-btn{
background:#007bff;
}

.home-actions .secondary-btn{
background:rgba(0,0,0,.45);
border:1px solid rgba(0,162,255,.55);
}

@media(max-width:850px){

.home-actions{
width:100%;
}

.home-actions .whatsapp-btn,
.home-actions .secondary-btn{
width:100%;
min-width:0;
}

}

/* ============================= */
/* EFECTO ANIMATED BOX TARJETAS HOME */
/* Azul / negro / blanco */
/* ============================= */

.home-tile{
position:relative;
overflow:hidden;
background-size:cover;
background-position:center;
border:1px solid rgba(0,162,255,.35);
border-radius:24px;
box-shadow:
0 0 26px rgba(0,162,255,.10),
inset 0 0 60px rgba(0,0,0,.70);
transition:
transform .35s ease,
box-shadow .35s ease,
border-color .35s ease;
isolation:isolate;
}

/* Capa oscura base */
.home-tile::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(135deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.58) 45%,rgba(0,162,255,.20) 100%);
z-index:1;
transition:.35s ease;
}

/* Capa azul animada */
.home-tile::after{
content:"";
position:absolute;
width:125%;
height:125%;
left:-135%;
top:-15%;
background:
linear-gradient(120deg,
transparent 0%,
rgba(0,162,255,.10) 25%,
rgba(0,162,255,.82) 50%,
rgba(255,255,255,.18) 62%,
transparent 100%);
z-index:2;
transform:skewX(-18deg);
transition:.55s ease;
}

/* Brillo circular decorativo */
.tile-overlay{
position:absolute;
inset:auto -45px -70px auto;
width:190px;
height:190px;
border-radius:50%;
background:
radial-gradient(circle,rgba(0,162,255,.60) 0%,rgba(0,162,255,.22) 42%,transparent 70%);
z-index:2;
opacity:.55;
transition:.35s ease;
}

/* Contenido */
.tile-content{
position:relative;
z-index:4;
height:100%;
padding:30px;
display:flex;
flex-direction:column;
justify-content:flex-end;
box-sizing:border-box;
}

/* Número */
.tile-content span{
width:52px;
height:52px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:16px;
background:#00a2ff;
color:#ffffff;
font-weight:900;
font-size:1.25rem;
box-shadow:
0 0 18px rgba(0,162,255,.75),
0 0 38px rgba(0,162,255,.30);
margin-bottom:auto;
transition:.35s ease;
}

/* Títulos */
.tile-content h2{
margin:18px 0 8px;
font-size:2rem;
line-height:1;
text-transform:uppercase;
color:#ffffff;
text-shadow:0 3px 14px rgba(0,0,0,.85);
transition:.35s ease;
}

/* Texto */
.tile-content p{
margin:0 0 16px;
font-size:.98rem;
line-height:1.5;
color:#ffffff;
opacity:.95;
text-shadow:0 2px 10px rgba(0,0,0,.85);
}

/* Link */
.tile-content strong{
color:#00a2ff;
font-weight:900;
font-size:.95rem;
letter-spacing:.3px;
transition:.35s ease;
}

/* Hover general */
.home-tile:hover{
transform:translateY(-8px) scale(1.018);
border-color:#ffffff;
box-shadow:
0 0 35px rgba(0,162,255,.55),
0 0 80px rgba(0,162,255,.20),
inset 0 0 65px rgba(0,0,0,.52);
}

/* Hover capa azul */
.home-tile:hover::before{
background:
linear-gradient(135deg,rgba(0,0,0,.70) 0%,rgba(0,60,120,.72) 50%,rgba(0,162,255,.55) 100%);
}

.home-tile:hover::after{
left:45%;
}

/* Hover círculo */
.home-tile:hover .tile-overlay{
opacity:1;
transform:scale(1.18);
}

/* Hover número */
.home-tile:hover .tile-content span{
background:#ffffff;
color:#007bff;
box-shadow:
0 0 18px rgba(255,255,255,.75),
0 0 36px rgba(0,162,255,.55);
}

/* Hover texto */
.home-tile:hover .tile-content h2{
color:#ffffff;
letter-spacing:1px;
}

.home-tile:hover .tile-content strong{
color:#ffffff;
}

/* Variante para tarjeta grande */
.tile-big .tile-content h2{
font-size:2.8rem;
}

.tile-big .tile-content p{
font-size:1.02rem;
}

/* Efecto diagonal más limpio */
.home-tile,
.home-tile:nth-child(even){
clip-path:polygon(0 0,94% 0,100% 100%,0 100%);
}

.home-tile:nth-child(even){
clip-path:polygon(6% 0,100% 0,100% 100%,0 100%);
}

/* Responsive */
@media(max-width:850px){

.home-tile,
.home-tile:nth-child(even){
clip-path:none;
border-radius:20px;
}

.tile-big .tile-content h2,
.tile-content h2{
font-size:1.75rem;
}

.tile-content{
padding:24px;
}

.tile-content span{
width:46px;
height:46px;
font-size:1.05rem;
}

}

/* ============================= */
/* DISTRIBUIDORES PREMIUM */
/* ============================= */

.distributor-featured{
display:grid;
grid-template-columns:1fr 1fr;
gap:0;
overflow:hidden;
border-radius:26px;
border:1px solid rgba(255,215,106,.38);
background:
linear-gradient(135deg,rgba(0,0,0,.96),rgba(26,18,8,.88));
box-shadow:
0 0 35px rgba(255,215,106,.13),
0 0 55px rgba(0,162,255,.08);
margin:0 auto 34px;
min-height:430px;
}

.distributor-image{
position:relative;
overflow:hidden;
min-height:430px;
background:#070707;
}

.distributor-image::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.78)),
radial-gradient(circle at bottom left,rgba(255,215,106,.22),transparent 38%);
}

.distributor-image img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
display:block;
filter:saturate(1.05) contrast(1.05);
transition:.35s ease;
}

.distributor-featured:hover .distributor-image img{
transform:scale(1.05);
}

.distributor-content{
position:relative;
padding:52px;
display:flex;
flex-direction:column;
justify-content:center;
background:
radial-gradient(circle at top right,rgba(255,215,106,.16),transparent 34%),
linear-gradient(135deg,rgba(0,0,0,.88),rgba(35,22,6,.82));
box-sizing:border-box;
}

.distributor-content::before{
content:"";
position:absolute;
left:0;
top:0;
width:5px;
height:100%;
background:linear-gradient(180deg,#ffd76a,#9c6b18,#00a2ff);
}

.distributor-label{
display:inline-block;
width:max-content;
padding:8px 16px;
border-radius:999px;
border:1px solid rgba(255,215,106,.45);
color:#ffd76a;
background:rgba(0,0,0,.35);
font-size:.86rem;
font-weight:900;
margin-bottom:18px;
letter-spacing:.3px;
}

.distributor-content h3{
margin:0 0 18px;
font-size:2.6rem;
line-height:1;
text-transform:uppercase;
color:#ffffff;
text-shadow:0 0 22px rgba(255,215,106,.22);
}

.distributor-content p{
margin:0;
line-height:1.7;
font-size:1rem;
opacity:.92;
max-width:650px;
}

.distributor-tags{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:24px;
}

.distributor-tags span{
padding:8px 12px;
border-radius:999px;
background:rgba(255,215,106,.10);
border:1px solid rgba(255,215,106,.26);
color:#ffe29a;
font-size:.82rem;
font-weight:800;
}

.distributor-actions{
display:flex;
gap:14px;
flex-wrap:wrap;
margin-top:30px;
}

.distributor-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:50px;
padding:0 26px;
border-radius:13px;
font-weight:900;
text-decoration:none;
transition:.25s ease;
box-sizing:border-box;
}

.distributor-btn.gold{
background:linear-gradient(135deg,#a87517,#ffd76a,#b88624);
color:#070707;
box-shadow:0 0 25px rgba(255,215,106,.26);
}

.distributor-btn.blue{
background:#007bff;
color:#ffffff;
box-shadow:0 0 25px rgba(0,123,255,.30);
}

.distributor-btn:hover{
transform:translateY(-3px);
filter:brightness(1.08);
}

.distributor-small-cards{
margin-top:34px;
}

/* RESPONSIVE DISTRIBUIDORES */

@media(max-width:950px){

.distributor-featured{
grid-template-columns:1fr;
}

.distributor-image{
min-height:300px;
}

.distributor-content{
padding:34px;
}

.distributor-content h3{
font-size:2rem;
}

.distributor-actions{
flex-direction:column;
}

.distributor-btn{
width:100%;
}

}

/* ============================= */
/* EFECTO PREMIUM DISTRIBUIDOR */
/* Azul + dorado animado */
/* ============================= */

.distributor-featured{
position:relative;
isolation:isolate;
border:1px solid rgba(255,215,106,.45);
box-shadow:
0 0 22px rgba(255,215,106,.20),
0 0 34px rgba(0,162,255,.12),
inset 0 0 45px rgba(0,0,0,.75);
transition:
transform .35s ease,
box-shadow .35s ease,
border-color .35s ease,
filter .35s ease;
}

/* Aura exterior */
.distributor-featured::before{
content:"";
position:absolute;
inset:-2px;
border-radius:28px;
background:linear-gradient(
120deg,
rgba(0,162,255,.85),
rgba(255,215,106,.95),
rgba(0,162,255,.75),
rgba(255,215,106,.85)
);
background-size:300% 300%;
z-index:-2;
opacity:.35;
filter:blur(8px);
animation:distributorGlowMove 6s linear infinite;
}

/* Borde fino interior */
.distributor-featured::after{
content:"";
position:absolute;
inset:0;
border-radius:26px;
padding:1px;
background:linear-gradient(
120deg,
rgba(0,162,255,.95),
rgba(255,215,106,.95),
rgba(0,162,255,.75)
);
background-size:250% 250%;
-webkit-mask:
linear-gradient(#fff 0 0) content-box,
linear-gradient(#fff 0 0);
-webkit-mask-composite:xor;
mask-composite:exclude;
z-index:4;
pointer-events:none;
opacity:.55;
animation:distributorGlowMove 5s linear infinite;
}

.distributor-featured:hover{
transform:translateY(-7px);
border-color:#ffd76a;
box-shadow:
0 0 38px rgba(255,215,106,.45),
0 0 70px rgba(0,162,255,.35),
inset 0 0 70px rgba(0,0,0,.65);
}

/* Barrido de luz encima de toda la tarjeta */
.distributor-content{
overflow:hidden;
}

.distributor-content::after{
content:"";
position:absolute;
top:-40%;
left:-120%;
width:70%;
height:190%;
background:linear-gradient(
120deg,
transparent,
rgba(0,162,255,.18),
rgba(255,215,106,.38),
rgba(255,255,255,.16),
transparent
);
transform:skewX(-18deg);
z-index:1;
transition:.75s ease;
pointer-events:none;
}

.distributor-featured:hover .distributor-content::after{
left:125%;
}

/* Que el contenido quede encima del barrido */
.distributor-content > *{
position:relative;
z-index:3;
}

/* Imagen con brillo en hover */
.distributor-image img{
transition:.45s ease;
}

.distributor-featured:hover .distributor-image img{
transform:scale(1.06);
filter:saturate(1.18) contrast(1.12) brightness(1.08);
}

/* Imagen: capa azul/dorada */
.distributor-image::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(135deg,rgba(0,162,255,.22),transparent 45%,rgba(255,215,106,.16));
z-index:2;
opacity:.35;
transition:.35s ease;
pointer-events:none;
}

.distributor-featured:hover .distributor-image::before{
opacity:.75;
}

/* Línea divisoria más viva */
.distributor-content::before{
box-shadow:
0 0 16px rgba(255,215,106,.75),
0 0 28px rgba(0,162,255,.45);
animation:dividerGlow 2.4s ease-in-out infinite alternate;
}

/* Tags con hover */
.distributor-tags span{
transition:.25s ease;
}

.distributor-featured:hover .distributor-tags span{
border-color:rgba(255,215,106,.55);
background:rgba(255,215,106,.15);
box-shadow:0 0 14px rgba(255,215,106,.13);
}

/* Botones más vivos */
.distributor-btn.gold,
.distributor-btn.blue{
position:relative;
overflow:hidden;
}

.distributor-btn.gold::after,
.distributor-btn.blue::after{
content:"";
position:absolute;
top:0;
left:-80%;
width:45%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
transform:skewX(-20deg);
transition:.45s ease;
}

.distributor-btn.gold:hover::after,
.distributor-btn.blue:hover::after{
left:130%;
}

@keyframes distributorGlowMove{
0%{
background-position:0% 50%;
}
50%{
background-position:100% 50%;
}
100%{
background-position:0% 50%;
}
}

@keyframes dividerGlow{
from{
opacity:.65;
}
to{
opacity:1;
}
}

/* ============================= */
/* EFECTO GLOBAL TARJETAS GN */
/* Solo azul técnico */
/* ============================= */

.card,
.process-step,
.project-category{
position:relative;
overflow:hidden;
isolation:isolate;
border:1px solid rgba(0,162,255,.28);
box-shadow:
0 0 18px rgba(0,162,255,.10),
inset 0 0 35px rgba(0,0,0,.55);
transition:
transform .35s ease,
box-shadow .35s ease,
border-color .35s ease,
background .35s ease;
}

.card::before,
.process-step::before,
.project-category::before{
content:"";
position:absolute;
inset:-2px;
border-radius:inherit;
background:linear-gradient(
120deg,
rgba(0,162,255,.75),
rgba(0,70,140,.20),
rgba(0,162,255,.70),
rgba(255,255,255,.10)
);
background-size:300% 300%;
z-index:-2;
opacity:.18;
filter:blur(8px);
animation:gnBlueGlowMove 6s linear infinite;
}

.card::after,
.process-step::after,
.project-category::after{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(
90deg,
#0057b8,
#00a2ff,
rgba(255,255,255,.55),
#00a2ff,
#0057b8
);
background-size:250% 250%;
opacity:.8;
animation:gnBlueGlowMove 4s linear infinite;
z-index:2;
}

.card:hover,
.process-step:hover,
.project-category:hover{
transform:translateY(-7px);
border-color:#00a2ff;
background:rgba(0,20,38,.62);
box-shadow:
0 0 32px rgba(0,162,255,.38),
0 0 70px rgba(0,162,255,.14),
inset 0 0 55px rgba(0,0,0,.60);
}

.card > *,
.process-step > *,
.project-category > *{
position:relative;
z-index:3;
}

.card:hover::before,
.process-step:hover::before,
.project-category:hover::before{
opacity:.38;
}

.card:hover h3,
.process-step:hover h3,
.project-category:hover h3{
color:#ffffff;
text-shadow:
0 0 10px rgba(0,162,255,.75),
0 0 22px rgba(0,162,255,.35);
}

.card:hover p,
.process-step:hover p,
.project-category:hover p{
opacity:1;
}

@keyframes gnBlueGlowMove{
0%{background-position:0% 50%;}
50%{background-position:100% 50%;}
100%{background-position:0% 50%;}
}

/* ============================= */
/* FIX DISTRIBUIDORES + WHATSAPP */
/* ============================= */

/* Regresa el botón de revisar material al centro */
.material-review-box{
text-align:center;
display:flex;
justify-content:center;
align-items:center;
}

.material-review-box .whatsapp-btn{
margin-top:0 !important;
}

/* Refuerzo para que la tarjeta de Floors Decoriver sí brille */
.distributor-featured{
position:relative;
isolation:isolate;
overflow:hidden;
border:1px solid rgba(255,215,106,.55) !important;
box-shadow:
0 0 28px rgba(255,215,106,.22),
0 0 55px rgba(0,162,255,.16),
inset 0 0 55px rgba(0,0,0,.70) !important;
transition:.35s ease;
}

/* Aura azul/dorada exterior */
.distributor-featured::before{
content:"";
position:absolute;
inset:-3px;
border-radius:28px;
background:linear-gradient(
120deg,
rgba(0,162,255,.85),
rgba(255,215,106,.95),
rgba(0,162,255,.80),
rgba(255,215,106,.85)
);
background-size:300% 300%;
z-index:-2;
opacity:.55;
filter:blur(10px);
animation:fdPremiumGlow 5s linear infinite;
}

/* Borde interno animado */
.distributor-featured::after{
content:"";
position:absolute;
inset:0;
border-radius:26px;
pointer-events:none;
z-index:5;
border:1px solid rgba(255,215,106,.55);
box-shadow:
inset 0 0 18px rgba(255,215,106,.22),
inset 0 0 26px rgba(0,162,255,.16);
}

/* Hover más fuerte */
.distributor-featured:hover{
transform:translateY(-7px);
box-shadow:
0 0 40px rgba(255,215,106,.42),
0 0 85px rgba(0,162,255,.32),
inset 0 0 70px rgba(0,0,0,.62) !important;
}

/* Imagen con brillo */
.distributor-featured:hover .distributor-image img{
transform:scale(1.06);
filter:saturate(1.18) contrast(1.12) brightness(1.08);
}

/* Capa sobre imagen */
.distributor-image::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(135deg,rgba(0,162,255,.18),transparent 45%,rgba(255,215,106,.22));
z-index:2;
opacity:.55;
transition:.35s ease;
pointer-events:none;
}

.distributor-featured:hover .distributor-image::before{
opacity:.9;
}

/* Barrido de luz en la parte de texto */
.distributor-content{
position:relative;
overflow:hidden;
}

.distributor-content::after{
content:"";
position:absolute;
top:-45%;
left:-120%;
width:75%;
height:200%;
background:linear-gradient(
120deg,
transparent,
rgba(0,162,255,.20),
rgba(255,215,106,.42),
rgba(255,255,255,.14),
transparent
);
transform:skewX(-18deg);
z-index:1;
transition:.8s ease;
pointer-events:none;
}

.distributor-featured:hover .distributor-content::after{
left:125%;
}

/* Mantiene texto encima del brillo */
.distributor-content > *{
position:relative;
z-index:3;
}

/* Línea divisoria más viva */
.distributor-content::before{
box-shadow:
0 0 18px rgba(255,215,106,.85),
0 0 32px rgba(0,162,255,.45);
}

/* Botones sin moverse */
.distributor-actions .distributor-btn{
margin-top:0 !important;
}

@keyframes fdPremiumGlow{
0%{background-position:0% 50%;}
50%{background-position:100% 50%;}
100%{background-position:0% 50%;}
}

/* ============================= */
/* BLOG / DIARIO DE OBRA */
/* EN CONSTRUCCIÓN */
/* ============================= */

.blog-under-page{
padding:145px 20px 70px;
min-height:100vh;
box-sizing:border-box;
display:flex;
align-items:center;
justify-content:center;
}

.blog-under-card{
position:relative;
width:94%;
max-width:1450px;
min-height:calc(100vh - 235px);
border-radius:28px;
overflow:hidden;
border:1px solid rgba(0,162,255,.42);
background:#02070d;
box-shadow:
0 0 35px rgba(0,162,255,.26),
0 0 80px rgba(0,162,255,.10),
inset 0 0 70px rgba(0,0,0,.75);
isolation:isolate;
}

.blog-under-card::before{
content:"";
position:absolute;
inset:-3px;
border-radius:30px;
background:linear-gradient(
120deg,
rgba(0,162,255,.90),
rgba(0,70,140,.20),
rgba(0,162,255,.85),
rgba(255,255,255,.12)
);
background-size:300% 300%;
z-index:-2;
opacity:.45;
filter:blur(10px);
animation:gnBlueGlowMove 6s linear infinite;
}

.blog-under-card img{
width:100%;
height:100%;
min-height:calc(100vh - 235px);
object-fit:cover;
object-position:center;
display:block;
filter:brightness(.92) contrast(1.08);
}

.blog-under-overlay{
position:absolute;
left:0;
right:0;
bottom:0;
padding:38px 44px;
background:
linear-gradient(0deg,rgba(0,0,0,.92),rgba(0,0,0,.70),transparent);
box-sizing:border-box;
}

.blog-under-overlay span{
display:inline-block;
padding:8px 16px;
border-radius:999px;
border:1px solid rgba(0,162,255,.50);
background:rgba(0,0,0,.52);
color:#00a2ff;
font-weight:900;
margin-bottom:14px;
}

.blog-under-overlay h1{
margin:0 0 12px;
font-size:3rem;
line-height:1;
text-transform:uppercase;
color:#ffffff;
text-shadow:
0 0 15px rgba(0,162,255,.55),
0 0 28px rgba(0,162,255,.25);
}

.blog-under-overlay p{
max-width:850px;
margin:0;
line-height:1.65;
opacity:.94;
font-size:1.02rem;
}

.blog-under-actions{
display:flex;
gap:14px;
flex-wrap:wrap;
align-items:center;
margin-top:24px;
}

.blog-under-actions .whatsapp-btn,
.blog-under-actions .secondary-btn{
height:52px;
min-width:190px;
padding:0 26px;
display:inline-flex;
align-items:center;
justify-content:center;
margin-top:0 !important;
box-sizing:border-box;
line-height:1;
}

/* Responsive Diario */

@media(max-width:850px){

.blog-under-page{
padding:200px 16px 55px;
}

.blog-under-card{
width:100%;
border-radius:20px;
min-height:auto;
}

.blog-under-card img{
min-height:auto;
height:auto;
}

.blog-under-overlay{
position:relative;
padding:28px 22px;
background:rgba(0,0,0,.88);
text-align:center;
}

.blog-under-overlay h1{
font-size:2rem;
}

.blog-under-actions{
justify-content:center;
}

.blog-under-actions a{
width:100%;
}

}