
:root{
  --bg:#0a0a0c; --bg-2:#121217; --edge:#24262f;
  --ink:#f4f4f6; --muted:#adb1ba; --accent:#ffffff;
  --whatsapp:#25d366; --radius:16px; --radius-sm:12px;
  --shadow:0 12px 35px rgba(0,0,0,.45); --glow:0 0 28px rgba(255,255,255,.35);
  --gold:#d9b156; --halo:rgba(217,177,86,.14); --halo2:rgba(217,177,86,.1);
  --container:1280px; --speed:260ms;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:
    radial-gradient(1200px 700px at 20% -10%, var(--halo), transparent 60%),
    radial-gradient(900px 600px at 90% -20%, var(--halo2), transparent 60%),
    var(--bg);
  color:var(--ink);
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  line-height:1.7;
  font-size:18px;
}
h1,h2,h3,h4{font-family:'Playfair Display', Georgia, serif;line-height:1.15;margin:0 0 14px}
h1{font-size:clamp(2.8rem,4.8vw,4.3rem);letter-spacing:.2px}
h2{font-size:clamp(2.2rem,3.6vw,3.1rem)}
h3{font-size:clamp(1.4rem,2.2vw,1.9rem)}
p{margin:0 0 16px}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 28px}

/* Header */
header{position:sticky;top:0;z-index:1000;background:rgba(10,10,12,.90);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--edge);transition:box-shadow var(--speed)}
header.scrolled{box-shadow:0 6px 30px rgba(0,0,0,.55)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:70px;width:auto;filter:drop-shadow(0 0 10px rgba(255,255,255,.25));transition:transform .25s ease, filter .25s ease}
.brand img:hover{filter:drop-shadow(0 0 22px rgba(255,255,255,.8));transform:scale(1.05)}
.brand img:active{filter:drop-shadow(0 0 28px rgba(255,255,255,1));transform:scale(1.08)}

/* Menu */
nav ul{list-style:none;display:flex;gap:26px;margin:0;padding:0;align-items:center}
nav a.link{font-weight:700;font-size:1.15rem;padding:10px 12px;border-radius:10px;position:relative}
nav a.link::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--speed)}
nav a.link:hover::after{transform:scaleX(1)}
.lang{display:flex;gap:12px;align-items:center}
.lang a{opacity:.85} .lang a:hover{opacity:1}

/* Dropdown (hover-intent) */
.dropdown{position:relative}
.dropdown > a{display:flex;gap:6px;align-items:center}
.menu-panel{position:absolute;top:calc(100% + 10px);left:0;min-width:320px;background:var(--bg-2);
  border:1px solid var(--edge);border-radius:12px;box-shadow:var(--shadow);padding:12px;display:none}
.menu-panel.open{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.menu-panel a{font-weight:600;padding:10px 12px;border-radius:10px;white-space:nowrap}
.menu-panel a:hover{background:rgba(255,255,255,.08)}

/* Burger Mobile */
.burger{display:none;flex-direction:column;gap:5px;border:0;background:transparent}
.burger span{display:block;width:26px;height:2px;background:var(--ink)}
@media (max-width:980px){
  nav ul.links{display:none}
  nav ul.links.open{display:block;position:absolute;right:28px;left:28px;top:86px;background:var(--bg-2);
    border:1px solid var(--edge);border-radius:12px;padding:14px}
  nav ul.links.open li{margin:6px 0}
  .menu-panel{position:static;display:grid;grid-template-columns:1fr 1fr}
  .burger{display:flex}
  .brand img{height:78px}
}

/* Hero */
.hero{padding:96px 0 32px}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:46px;align-items:center}
@media (max-width:980px){.hero .wrap{grid-template-columns:1fr;gap:28px}}
.lead{font-size:1.22rem;color:var(--muted);max-width:65ch;margin-bottom:24px}
.btns{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 18px;border-radius:12px;
  border:1px solid var(--edge);font-weight:800;text-decoration:none;transition:transform var(--speed), box-shadow var(--speed), opacity var(--speed)}
.btn.primary{background:var(--accent);color:#0c0c0f !important;box-shadow:var(--glow)}
.btn.ghost{color:var(--ink)}
.btn:hover{transform:translateY(-2px)}

/* Roberto feature */
.portrait{position:relative}
.portrait figure{margin:0;position:relative}
.portrait img{width:100%;max-width:560px;border-radius:18px;border:3px solid var(--accent);
  box-shadow:0 20px 60px rgba(0,0,0,.6), 0 0 50px rgba(255,255,255,.18)}
.tag{position:absolute;left:-12px;bottom:-12px;background:rgba(255,255,255,.08);border:1px solid var(--edge);
  backdrop-filter:blur(6px);padding:10px 14px;border-radius:12px;font-weight:700}

/* Sections */
section{padding:80px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:1100px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:740px){.grid{grid-template-columns:1fr}}
.card{background:var(--bg-2);border:1px solid var(--edge);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  transition:transform var(--speed), box-shadow var(--speed)}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 60px rgba(0,0,0,.6)}
.thumb{height:190px;background:#0f0f13;border-bottom:1px solid var(--edge);display:block}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.card .body{padding:18px}
.card .body h3{margin-bottom:8px}
.card .body p{color:var(--muted)}

/* Locations */
.list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:880px){.list{grid-template-columns:1fr}}
.loc{background:var(--bg-2);border:1px solid var(--edge);border-radius:12px;padding:16px}
.loc strong{display:block;margin-bottom:4px}
.map{position:relative;width:100%;aspect-ratio:16/9;border:1px solid var(--edge);border-radius:12px;overflow:hidden;margin-top:10px}
.map iframe{position:absolute;inset:0;border:0;width:100%;height:100%;filter:grayscale(20%) contrast(1.05)}

/* CTA band */
.cta{background:linear-gradient(90deg, rgba(255,255,255,.06), rgba(255,255,255,0) 70%);
  border:1px solid var(--edge);border-radius:16px;padding:24px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.cta p{margin:0;color:var(--muted)}
@media (max-width:800px){.cta{flex-direction:column;align-items:flex-start}}

/* Footer */
footer{border-top:1px solid var(--edge);padding:46px 0 80px;color:var(--muted)}
footer a{color:var(--ink);text-decoration:none}

/* WhatsApp */
.whatsapp{position:fixed;bottom:22px;right:22px;background:var(--whatsapp);border-radius:50px;padding:16px 24px;
  display:flex;align-items:center;gap:12px;box-shadow:0 0 36px rgba(37,211,102,1);z-index:2000;font-weight:800;color:#fff;text-decoration:none;font-size:1.05rem;animation:pulse 2s infinite}
.whatsapp img{width:26px;height:26px}
@keyframes pulse{0%,100%{box-shadow:0 0 22px rgba(37,211,102,.7)}50%{box-shadow:0 0 44px rgba(37,211,102,1)}}

/* Scroll reveal animations */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s ease, transform .8s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.zoom{opacity:0;transform:scale(.96);transition:opacity .9s ease, transform .9s ease}
.zoom.visible{opacity:1;transform:scale(1)}

/* Utility */
.muted{color:var(--muted)}
.spacer{height:26px}
