:root{

--bg-dark:#050505;

--gold:#a67c52;

--text-white:#ffffff;

--text-gray:#a1a1a1;

--transition:all .6s cubic-bezier(.16,1,.3,1);

}

*{

margin:0;
padding:0;
box-sizing:border-box;

}

body{

font-family:'Inter',sans-serif;

background:#050505;

color:white;

overflow-x:hidden;

}

.container{

width:90%;
max-width:1300px;
margin:auto;

}

.section{

padding:120px 0;

}

/* NAVBAR */

.navbar{

position:fixed;
top:0;
width:100%;
padding:25px 0;
z-index:1000;

}

.nav-container{

display:flex;
justify-content:space-between;
align-items:center;

}

.logo{

font-weight:900;
font-size:1.5rem;

}

.logo span{

color:var(--gold);

}

.nav-links{

display:flex;
gap:30px;
list-style:none;

}

.nav-links a{

color:white;
text-decoration:none;
font-weight:600;

}

.btn-contact{

border:1px solid var(--gold);

color:var(--gold);

padding:10px 24px;

border-radius:50px;

text-decoration:none;

}

/* HERO */

.hero{

height:100vh;

background:url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?q=80&w=1920');

background-size:cover;

display:flex;

align-items:center;

position:relative;

}

.hero-overlay{

position:absolute;
width:100%;
height:100%;

background:linear-gradient(180deg,rgba(0,0,0,.3),#050505);

}

.hero-content{

position:relative;
z-index:2;

}

.hero h1{

font-size:clamp(3rem,7vw,5rem);

font-weight:900;

line-height:.95;

}

.hero h1 span{

color:transparent;

-webkit-text-stroke:1px var(--gold);

}

/* INTRO */

.intro-text{

font-size:clamp(1.8rem,3vw,3rem);

font-weight:700;

}

/* BENTO SECTION */

.bento{

background:white;

color:#111;

}

.section-title{

font-size:3rem;

font-weight:900;

margin-bottom:10px;

}

.section-subtitle{

color:#666;

margin-bottom:60px;

}

/* GRID */

.bento-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

}

/* TARJETAS */

.bento-card{

background:white;

border-radius:28px;

padding:45px;

border:1px solid rgba(0,0,0,.06);

box-shadow:0 10px 30px rgba(0,0,0,.06);

transition:

transform .5s cubic-bezier(.16,1,.3,1),

box-shadow .5s cubic-bezier(.16,1,.3,1);

position:relative;

overflow:hidden;

}

/* GLOW MOUSE */

.bento-card::before{

content:"";

position:absolute;

width:250px;
height:250px;

background:radial-gradient(circle,var(--gold),transparent 60%);

opacity:0;

pointer-events:none;

transition:opacity .4s;

}

.bento-card:hover::before{

opacity:.15;

}

/* HOVER */

.bento-card:hover{

transform:translateY(-12px);

box-shadow:

0 30px 70px rgba(0,0,0,.15);

}

/* ICONO */

.card-icon{

font-size:2rem;

margin-bottom:20px;

transition:transform .4s;

}

.bento-card:hover .card-icon{

transform:scale(1.2);

}

/* TITULO */

.bento-card h3{

font-size:1.3rem;

font-weight:800;

margin-bottom:10px;

}

.bento-card p{

color:#555;

font-size:.95rem;

}

/* ANIMACION SCROLL */

.animate-on-scroll{

opacity:0;

transform:translateY(40px);

transition:1s cubic-bezier(.16,1,.3,1);

}

.animate-on-scroll.visible{

opacity:1;

transform:translateY(0);

}

/* FOOTER */

.footer{

background:#050505;

text-align:center;

}

.footer-email{

font-size:clamp(2rem,4vw,3rem);

color:var(--gold);

text-decoration:none;

font-weight:900;

}

/* RESPONSIVE */

@media(max-width:900px){

.bento-grid{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:600px){

.bento-grid{

grid-template-columns:1fr;

}

}