/* ============ VALNITE — Tax & Lawyers ============ */
:root{
  --gold:#a08a5e;
  --gold-dark:#8a7349;
  --dark:#1a1a1a;
  --navy:#161b22;
  --light:#f3efe9;
  --gray:#6b6b6b;
  --serif:'Cormorant Garamond', 'Times New Roman', serif;
  --sans:'Montserrat', system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:#222;line-height:1.6;font-size:16px;background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* ============ TOPBAR ============ */
.topbar{background:#ebe7e0;color:#3a3a3a;font-size:12px;padding:8px 0;letter-spacing:.3px}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.topbar-info{display:flex;gap:24px;flex-wrap:wrap}
.topbar-info span{display:inline-flex;align-items:center;gap:6px}
.topbar-info svg{color:var(--gold)}
.topbar-social{display:flex;gap:14px}
.topbar-social a{color:#3a3a3a;transition:color .2s}
.topbar-social a:hover{color:var(--gold)}

/* ============ HEADER ============ */
.header{background:#ebe7e0;padding:18px 0;position:sticky;top:0;z-index:100;border-bottom:1px solid #d8d2c8}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo img{height:60px;width:auto}
.nav{display:flex;gap:8px}
.nav a{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:2px;padding:14px 22px;color:var(--dark);transition:all .25s;border-radius:2px}
.nav a:hover{color:var(--gold)}
.nav a.active{background:#fff;color:var(--dark);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.nav-toggle span{width:26px;height:2px;background:var(--dark)}

/* ============ HERO ============ */
.hero{position:relative;min-height:calc(100vh - 110px);display:flex;align-items:center;background:url('images/bg1.jpg') center/cover no-repeat;color:#fff;overflow:hidden}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(15,15,18,.65) 0%,rgba(15,15,18,.45) 50%,rgba(15,15,18,.7) 100%)}
.hero-content{position:relative;text-align:center;padding:80px 24px;max-width:900px}
.eyebrow{font-family:var(--sans);font-size:13px;letter-spacing:6px;text-transform:uppercase;color:#fff;margin-bottom:18px;font-weight:400}
.eyebrow.dark{color:var(--gold);font-weight:500}
.eyebrow.light{color:var(--gold)}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(48px,9vw,128px);line-height:.95;letter-spacing:1px;text-transform:lowercase}
.hero h1 .amp{font-style:italic;color:#fff}
.hero-divider{width:240px;height:1px;background:rgba(255,255,255,.5);margin:36px auto}
.hero-text{font-family:var(--serif);font-size:clamp(16px,1.4vw,20px);font-style:italic;font-weight:300;max-width:680px;margin:0 auto 40px;line-height:1.6}
.hero-cta{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}

/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 38px;font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:3px;text-transform:uppercase;cursor:pointer;border:none;transition:all .3s;border-radius:2px}
.btn-gold{background:var(--gold);color:#fff}
.btn-gold:hover{background:var(--gold-dark)}
.btn-dark{background:var(--dark);color:#fff}
.btn-dark:hover{background:#000}

/* ============ SECTIONS ============ */
.section{padding:100px 0}
.section-title{font-family:var(--serif);font-size:clamp(32px,4vw,56px);font-weight:400;line-height:1.15;margin-bottom:24px}
.section-title.light{color:#fff;text-align:center;margin-bottom:60px}

/* ============ NOSOTROS ============ */
.nosotros{background:#fff}
.nosotros-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center;margin-bottom:90px}
.nosotros-text h2{font-family:var(--serif);font-size:clamp(30px,3.5vw,46px);font-weight:400;line-height:1.2;margin:14px 0 22px;color:var(--dark)}
.nosotros-text p{color:var(--gray);font-size:15px;line-height:1.8}
.nosotros-image img{width:100%;border-radius:4px;box-shadow:0 30px 60px -20px rgba(0,0,0,.25)}

.values{text-align:center;max-width:980px;border-top:1px solid #ebe7e0;padding-top:80px}
.values-title{font-family:var(--serif);font-size:clamp(26px,3vw,38px);font-weight:400;color:var(--dark);margin-bottom:24px}
.values-text{color:var(--gray);font-size:15px;max-width:820px;margin:0 auto 60px;line-height:1.8}
.mv-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;text-align:left}
.mv-card{background:#faf8f4;padding:40px;border-left:3px solid var(--gold)}
.mv-card h4{font-family:var(--serif);font-size:28px;font-weight:500;margin-bottom:14px;color:var(--dark)}
.mv-card p{color:var(--gray);font-size:14.5px;line-height:1.7}

/* ============ SERVICIOS ============ */
.servicios{background:linear-gradient(180deg,#161b22 0%,#0d1117 100%);color:#fff;position:relative}
.servicios::before{content:'';position:absolute;inset:0;background:url('images/foto1-2.jpg') center/cover;opacity:.08;pointer-events:none}
.servicios .container{position:relative}
.servicios-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.servicio-card{background:rgba(255,255,255,.04);border:1px solid rgba(160,138,94,.25);padding:42px 30px;border-radius:4px;transition:all .35s;backdrop-filter:blur(4px)}
.servicio-card:hover{transform:translateY(-6px);border-color:var(--gold);background:rgba(160,138,94,.08)}
.servicio-icon{width:62px;height:62px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--gold);margin-bottom:24px}
.servicio-card h3{font-family:var(--serif);font-size:28px;font-weight:500;color:var(--gold);margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(160,138,94,.3)}
.servicio-card ul{list-style:none}
.servicio-card li{color:#e4e4e4;font-size:14px;padding:8px 0;padding-left:18px;position:relative}
.servicio-card li::before{content:'›';position:absolute;left:0;color:var(--gold);font-weight:700}

/* ============ CONTACTO ============ */
.contacto{background:#faf8f4}
.contacto-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:70px}
.contacto-info h2{font-family:var(--serif);font-size:clamp(44px,6vw,72px);font-weight:400;color:var(--dark);margin:8px 0 18px;letter-spacing:2px}
.contacto-lead{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--gray);margin-bottom:36px}
.contacto-list{list-style:none;margin-bottom:30px}
.contacto-list li{padding:14px 0;border-bottom:1px solid #e8e1d4;font-size:14px;color:var(--gray)}
.contacto-list strong{color:var(--dark);font-family:var(--sans);font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:12px}
.contacto-list a:hover{color:var(--gold)}
.contacto-social{display:flex;gap:10px;margin-top:20px}
.contacto-social a{width:38px;height:38px;border-radius:50%;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;transition:background .25s}
.contacto-social a:hover{background:var(--gold)}

.contacto-form{background:#fff;padding:48px;border-radius:4px;box-shadow:0 20px 60px -20px rgba(0,0,0,.15)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.contacto-form input,.contacto-form textarea{width:100%;padding:14px 16px;border:1px solid #e0d8c8;background:#faf8f4;font-family:var(--sans);font-size:14px;color:var(--dark);border-radius:2px;transition:border-color .2s}
.contacto-form input:focus,.contacto-form textarea:focus{outline:none;border-color:var(--gold)}
.contacto-form textarea{margin-bottom:24px;resize:vertical}
.contacto-form .btn{width:100%;justify-content:center}

/* ============ FOOTER ============ */
.footer{background:#0d1117;color:#9ba3ad;padding:36px 0;text-align:center;font-size:13px}
.copyright{margin-bottom:10px;color:#c8ccd1;letter-spacing:1px}
.credit{font-size:12px;max-width:880px;margin:0 auto;line-height:1.7;color:#7d858f}
.credit a{color:var(--gold);font-weight:600}
.credit a:hover{text-decoration:underline}

/* ============ BACK TO TOP ============ */
.back-to-top{position:fixed;right:24px;bottom:24px;width:44px;height:44px;background:var(--gold);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(0,0,0,.2);z-index:90;transition:background .2s}
.back-to-top:hover{background:var(--gold-dark)}

/* ============ RESPONSIVE ============ */
@media (max-width: 960px){
  .topbar-info{font-size:11px;gap:12px}
  .nav{position:fixed;top:0;right:-100%;width:75%;max-width:320px;height:100vh;background:#ebe7e0;flex-direction:column;padding:90px 30px;gap:0;transition:right .3s;box-shadow:-10px 0 30px rgba(0,0,0,.1)}
  .nav.open{right:0}
  .nav a{padding:18px 0;border-bottom:1px solid #d8d2c8;width:100%}
  .nav-toggle{display:flex;z-index:101}
  .nosotros-grid,.contacto-grid,.mv-grid{grid-template-columns:1fr;gap:40px}
  .servicios-grid{grid-template-columns:repeat(2,1fr)}
  .section{padding:70px 0}
  .form-row{grid-template-columns:1fr}
  .contacto-form{padding:30px}
  .hero-cta{flex-direction:column;align-items:center}
  .btn{width:100%;max-width:280px;justify-content:center}
}
@media (max-width: 560px){
  .servicios-grid{grid-template-columns:1fr}
  .topbar-info{justify-content:center;text-align:center}
}
