:root{--gold:#d4af37;--dark:#07111f}
*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}
body{font-family:Arial,sans-serif;background:#111827;color:#fff}
header{position:fixed;top:0;width:100%;background:rgba(0,0,0,0.0);backdrop-filter:blur(0px);z-index:999}
.container{max-width:1200px;margin:auto;padding:0 10px}
.nav{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.hero{
min-height:72vh;
display:flex;align-items:center;
background:
linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,.65)),
url('images/tlo1.png') center/cover fixed;
}
.hero h1{font-size:72px;animation:slideUp 2s ease}
.hero p,.btn{animation:fadeIn 1.5s ease}
.logo span,.gold{color:var(--gold)}
.phone,.btn{background:var(--gold);color:#000;padding:12px 22px;border-radius:8px;text-decoration:none;font-weight:bold}
.hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:30px}
.tile{
background:rgba(255,255,255,0.2);
backdrop-filter:blur(0px);
padding:20px;border-radius:14px;
margin:12px 0;
animation:float 4s ease-in-out infinite;
}
section{padding:90px 0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.card{
background:rgba(255,255,255,0.1);padding:30px;border-radius:16px;
transition:.4s;
opacity:0;transform:translateY(40px);
}

.card.show{opacity:1;transform:translateY(0)}
.card:hover{transform:translateY(-10px)}
.contact{background:#0b1220}
iframe{width:100%;height:380px;border:0;border-radius:14px}
@keyframes slideUp{from{opacity:0;transform:translateY(50px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes float{50%{transform:translateY(-10px)}}
@media(max-width:900px){.hero-grid,.cards{grid-template-columns:1fr}.hero h1{font-size:42px}}