html{scroll-behavior:smooth;}
:root{
  --wood-dark:#1b1510;
  --wood-darker:#120d09;
  --panel:#241b13;
  --panel-2:#2c2116;
  --gold-1:#f0d78c;
  --gold-2:#cda44e;
  --gold-3:#8a691f;
  --cream:#f4ede0;
  --muted:#c9bfae;
  --line:rgba(205,164,78,0.35);
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  font-family:'Montserrat', sans-serif;
  background:var(--wood-darker);
  color:var(--cream);
}
h1,h2,h3,h4{
  font-family:'Cormorant Garamond', serif;
  font-weight:700;
  letter-spacing:0.02em;
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
.section-divider{
  width:60px; height:2px; background:var(--gold-2);
  margin:0 auto 40px;
}

/* header */
header{
  background:
    linear-gradient(180deg, rgba(18,13,9,0.92), rgba(18,13,9,0.92)),
    repeating-linear-gradient(100deg, #241a10 0 18px, #1c140d 18px 36px);
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:50;
}
.topbar{
  display:flex; justify-content:flex-end; gap:28px;
  font-size:12.5px; color:var(--muted);
  padding:10px 32px;
  border-bottom:1px solid rgba(205,164,78,0.15);
  letter-spacing:0.03em;
}
.topbar span{display:flex; align-items:center; gap:6px;}
.topbar svg{width:13px; height:13px; fill:var(--gold-2);}

.navrow{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 32px;
  max-width:1180px; margin:0 auto;
}
.brand{display:flex; align-items:center; gap:14px;}
.brand svg{width:46px; height:46px;}
.brand-text .name{
  font-family:'Cormorant Garamond', serif;
  font-size:26px; font-weight:700; color:var(--gold-1);
  letter-spacing:0.06em; line-height:1.1;
}
.brand-text .tag{
  font-size:9.5px; letter-spacing:0.18em; color:var(--muted); text-transform:uppercase;
}
nav{display:flex; align-items:center; gap:34px;}
nav ul{display:flex; gap:34px; list-style:none;}
nav li{position:relative;}
nav a.top-link{
  font-size:13.5px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--gold-1); font-weight:600;
  padding:6px 0; display:flex; align-items:center; gap:5px;
  border-bottom:2px solid transparent;
  transition:border-color .2s;
}
nav li:hover a.top-link, nav a.top-link.active{border-color:var(--gold-2);}

/* hero */
.hero{position:relative; min-height:600px; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.hero img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(1.05) contrast(1.05);
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(15,11,7,0.40) 0%, rgba(15,11,7,0.15) 45%, rgba(15,11,7,0.80) 100%);
}
.hero-inner{position:relative; z-index:2; text-align:center; padding:0 20px;}
.hero-inner h1{
  font-family:'Cormorant Garamond', serif;
  font-size:52px; font-weight:700; color:var(--gold-1);
  letter-spacing:0.04em; line-height:1.15;
  margin-bottom:16px;
  text-shadow:0 2px 20px rgba(0,0,0,0.5);
}
.hero-inner p{
  font-size:16px; letter-spacing:0.06em; color:var(--muted);
  margin-bottom:36px; font-weight:400;
  text-shadow:0 1px 8px rgba(0,0,0,0.4);
}
.hero-cta{
  display:inline-block;
  background:linear-gradient(180deg, var(--gold-1), var(--gold-2) 55%, var(--gold-3));
  color:#1b1510; font-weight:800; letter-spacing:0.12em; font-size:14px;
  padding:15px 42px; margin:8px; border:1px solid #7c5c18;
  box-shadow:0 8px 18px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.4);
  cursor:pointer; transition:transform .18s ease, box-shadow .18s ease;
}
.hero-cta:hover{transform:translateY(-2px); box-shadow:0 12px 22px rgba(0,0,0,0.5);}

/* service strip */
.service-strip{
  display:grid; grid-template-columns:repeat(3,1fr);
  background:var(--wood-dark); position:relative; z-index:3; margin-top:-1px;
}
.service-strip a{
  padding:40px 20px; text-align:center;
  border-right:1px solid var(--line);
  font-family:'Cormorant Garamond', serif; font-weight:700;
  font-size:22px; letter-spacing:0.04em; color:var(--gold-1);
  background:linear-gradient(180deg, rgba(205,164,78,0.06), transparent);
  transition:background .2s;
}
.service-strip a:last-child{border-right:none;}
.service-strip a:hover{background:rgba(205,164,78,0.14);}

/* process */
.process{padding:80px 32px; text-align:center; background:var(--wood-darker);}
.process h2{font-size:36px; color:var(--gold-1); letter-spacing:0.05em; margin-bottom:12px;}
.process-grid{
  max-width:1000px; margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:30px;
  margin-top:50px;
}
.process-item{display:flex; flex-direction:column; align-items:center; gap:14px;}
.process-item .step-num{
  font-family:'Cormorant Garamond', serif;
  font-size:14px; font-weight:700; color:var(--gold-3);
  letter-spacing:0.1em; margin-bottom:4px;
}
.process-item .icon-ring{
  width:70px; height:70px; border:1.5px solid var(--gold-2); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .2s;
}
.process-item:hover .icon-ring{border-color:var(--gold-1);}
.process-item svg{width:28px; height:28px; stroke:var(--gold-1); fill:none;}
.process-item h4{
  font-size:17px; font-weight:700; color:var(--cream);
  letter-spacing:0.02em;
}
.process-item p{font-size:13px; letter-spacing:0.03em; color:var(--muted); font-weight:400; line-height:1.5;}

/* about / nosotros */
.about{padding:80px 32px; background:var(--wood-dark);}
.about .wrap{max-width:900px; text-align:center;}
.about h2{font-size:36px; color:var(--gold-1); letter-spacing:0.05em; margin-bottom:12px;}
.about p{
  font-size:15px; color:var(--muted); line-height:1.75;
  letter-spacing:0.02em; margin-bottom:20px;
}
.about .highlights{
  display:grid; grid-template-columns:repeat(3,1fr); gap:30px;
  margin-top:44px;
}
.about .highlight-item{text-align:center;}
.about .highlight-item .hl-num{
  font-family:'Cormorant Garamond', serif;
  font-size:42px; font-weight:700; color:var(--gold-1);
  line-height:1;
}
.about .highlight-item .hl-label{
  font-size:12px; letter-spacing:0.1em; color:var(--muted);
  text-transform:uppercase; margin-top:6px;
}

/* portfolio */
.portfolio{padding:80px 32px; background:var(--wood-darker);}
.portfolio h2{text-align:center; font-size:36px; color:var(--gold-1); letter-spacing:0.05em; margin-bottom:12px;}
.portfolio-grid{
  max-width:1180px; margin:40px auto 0;
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.portfolio-grid figure{
  border:1px solid var(--gold-2); overflow:hidden; aspect-ratio:1/0.85; position:relative;
}
.portfolio-grid figcaption{
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(transparent, rgba(0,0,0,0.75));
  padding:30px 14px 12px; font-size:12px; font-weight:600;
  letter-spacing:0.04em; color:var(--cream);
  opacity:0; transition:opacity .3s ease;
}
.portfolio-grid figure:hover figcaption{opacity:1;}
.portfolio-grid img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease;}
.portfolio-grid figure:hover img{transform:scale(1.08);}

/* trust / garantias */
.trust{padding:80px 32px; background:var(--wood-dark);}
.trust h2{text-align:center; font-size:36px; color:var(--gold-1); letter-spacing:0.05em; margin-bottom:12px;}
.trust-grid{
  max-width:1000px; margin:50px auto 0;
  display:grid; grid-template-columns:repeat(4,1fr); gap:28px;
}
.trust-item{text-align:center; padding:30px 16px;}
.trust-item .trust-icon{
  width:56px; height:56px; margin:0 auto 18px;
  border:1.5px solid var(--gold-2); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}
.trust-item svg{width:24px; height:24px; stroke:var(--gold-1); fill:none;}
.trust-item h4{font-size:16px; font-weight:700; color:var(--cream); letter-spacing:0.02em; margin-bottom:8px;}
.trust-item p{font-size:12.5px; color:var(--muted); line-height:1.6; letter-spacing:0.02em;}

/* testimonials */
.testimonials{padding:80px 32px; background:var(--wood-darker);}
.testimonials h2{text-align:center; font-size:36px; color:var(--gold-1); letter-spacing:0.05em; margin-bottom:12px;}
.testimonials-grid{
  max-width:1000px; margin:50px auto 0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px;
}
.testimonial-card{
  background:var(--panel); border:1px solid var(--line);
  padding:30px 24px; position:relative;
}
.testimonial-card::before{
  content:"\201C"; position:absolute; top:10px; left:18px;
  font-size:48px; color:var(--gold-3); font-family:'Cormorant Garamond', serif;
  line-height:1; opacity:0.5;
}
.testimonial-card .tc-text{
  font-size:13.5px; color:var(--cream); line-height:1.7;
  letter-spacing:0.02em; margin-bottom:18px;
  font-style:italic; padding-top:10px;
}
.testimonial-card .tc-author{
  display:flex; align-items:center; gap:10px;
  border-top:1px solid var(--line); padding-top:14px;
}
.testimonial-card .tc-avatar{
  width:36px; height:36px; border-radius:50%;
  background:var(--gold-3); display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond', serif; font-weight:700; font-size:15px; color:var(--gold-1);
}
.testimonial-card .tc-name{font-size:13px; font-weight:700; color:var(--gold-1);}
.testimonial-card .tc-role{font-size:11px; color:var(--muted); letter-spacing:0.03em;}

/* contact form section */
.contact-section{background:var(--cream); color:#241b13; padding:80px 32px;}
.contact-section h2{
  text-align:center; font-size:36px; letter-spacing:0.04em; margin-bottom:12px;
  font-weight:800; font-family:'Montserrat', sans-serif; color:#1b1510;
}
.contact-grid{
  max-width:1100px; margin:0 auto;
  display:grid; grid-template-columns:1.4fr 1fr; gap:50px;
}
.field{margin-bottom:22px;}
.field label{display:block; font-size:13px; font-weight:700; margin-bottom:8px; letter-spacing:0.02em;}
.field input, .field select, .field textarea{
  width:100%; background:var(--wood-dark); color:var(--gold-1);
  border:1px solid var(--gold-2); padding:13px 14px; font-size:13.5px;
  font-family:'Montserrat', sans-serif;
}
.field input::placeholder, .field textarea::placeholder{color:#9c8f76;}
.field textarea{min-height:120px; resize:vertical;}
.row-2{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.checkline{display:flex; align-items:center; gap:10px; font-size:13px; margin:22px 0 26px;}
.checkline input{width:16px; height:16px; accent-color:var(--gold-2);}
.submit-btn{
  width:100%; background:linear-gradient(180deg, var(--gold-1), var(--gold-2) 55%, var(--gold-3));
  color:#1b1510; font-weight:800; letter-spacing:0.1em; font-size:14px;
  padding:16px; border:1px solid #7c5c18; cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.4);
  transition:filter .18s;
}
.submit-btn:hover{filter:brightness(1.05);}
.form-msg{margin-top:14px; font-size:13px; font-weight:600; display:none;}

.info-panel h3{
  font-size:22px; margin-bottom:24px; color:#1b1510;
  font-family:'Montserrat',sans-serif; font-weight:800; letter-spacing:0.02em;
}
.info-item{display:flex; gap:12px; align-items:flex-start; margin-bottom:18px; font-size:14px;}
.info-item svg{width:17px; height:17px; fill:var(--gold-3); flex-shrink:0; margin-top:2px;}
.map-box{
  margin-top:24px; height:180px; border:1px solid #d8cba0;
  background:
    linear-gradient(#e7e0cc,#e7e0cc),
    repeating-linear-gradient(0deg, transparent 0 24px, rgba(0,0,0,0.04) 24px 25px),
    repeating-linear-gradient(90deg, transparent 0 24px, rgba(0,0,0,0.04) 24px 25px);
  position:relative; display:flex; align-items:center; justify-content:center;
}
.map-box .pin{
  width:34px; height:34px; background:#d64545; border-radius:50% 50% 50% 0;
  transform:rotate(-45deg); display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px rgba(0,0,0,0.3);
}
.map-box .pin::after{content:""; width:12px; height:12px; background:#fff; border-radius:50%; transform:rotate(45deg);}
.map-label{position:absolute; bottom:10px; left:50%; transform:translateX(-50%); font-size:12px; font-weight:700; color:#3a3226; background:#fff8; padding:2px 10px; border-radius:3px;}

/* footer */
footer{
  background:var(--wood-dark); border-top:1px solid var(--line);
  padding:28px 32px;
}
.footer-inner{
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px; font-size:13px;
}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand svg{width:30px; height:30px;}
.footer-brand .fname{color:var(--gold-1); font-weight:700; letter-spacing:0.04em;}
.footer-brand .ftag{font-size:10px; color:var(--muted); letter-spacing:0.1em; text-transform:uppercase;}
.footer-right{text-align:right;}
.footer-right .fcopy{font-size:11px; color:var(--muted); margin-top:4px; letter-spacing:0.03em;}
footer .fcontact{display:flex; gap:22px; color:var(--muted); flex-wrap:wrap;}
footer .fcontact span{display:flex; align-items:center; gap:6px;}
footer svg{width:13px; height:13px; fill:var(--gold-2);}

/* hamburger menu button */
.menu-toggle{
  display:none; background:none; border:none; cursor:pointer;
  width:30px; height:24px; position:relative; z-index:100;
}
.menu-toggle span{
  display:block; width:100%; height:2px; background:var(--gold-1);
  position:absolute; left:0; transition:all .3s ease;
}
.menu-toggle span:nth-child(1){top:0;}
.menu-toggle span:nth-child(2){top:50%; transform:translateY(-50%);}
.menu-toggle span:nth-child(3){bottom:0;}
.menu-toggle.active span:nth-child(1){top:50%; transform:translateY(-50%) rotate(45deg);}
.menu-toggle.active span:nth-child(2){opacity:0;}
.menu-toggle.active span:nth-child(3){bottom:50%; transform:translateY(50%) rotate(-45deg);}

/* mobile menu */
.mobile-menu{
  position:fixed; top:0; right:-300px; width:280px; height:100vh;
  background:var(--wood-dark); border-left:1px solid var(--line);
  z-index:200; transition:right .35s ease;
  display:flex; flex-direction:column;
  box-shadow:-10px 0 30px rgba(0,0,0,0.5);
}
.mobile-menu.active{right:0;}
.mobile-menu-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px; border-bottom:1px solid var(--line);
}
.mobile-menu-header .brand{display:flex; align-items:center; gap:10px;}
.mobile-menu-header .brand svg{width:36px; height:36px;}
.mobile-menu-header .brand .name{
  font-family:'Cormorant Garamond', serif;
  font-size:16px; font-weight:700; color:var(--gold-1);
  letter-spacing:0.04em; line-height:1.1;
}
.menu-close{
  background:none; border:none; color:var(--muted); font-size:28px;
  cursor:pointer; padding:0 4px; line-height:1;
}
.menu-close:hover{color:var(--gold-1);}
.mobile-nav{flex:1; padding:20px; overflow-y:auto;}
.mobile-nav ul{list-style:none;}
.mobile-nav li{border-bottom:1px solid rgba(205,164,78,0.15);}
.mobile-nav a{
  display:block; padding:14px 0; font-size:15px; font-weight:600;
  color:var(--cream); letter-spacing:0.04em; transition:color .2s;
}
.mobile-nav a:hover{color:var(--gold-1);}
.mobile-menu-contact{
  padding:20px; border-top:1px solid var(--line);
  display:flex; flex-direction:column; gap:10px;
}
.mobile-menu-contact a{
  font-size:12px; color:var(--muted); display:flex; align-items:center; gap:8px;
}
.mobile-menu-contact a:hover{color:var(--gold-1);}
.mobile-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,0.6);
  z-index:190; opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease;
}
.mobile-overlay.active{opacity:1; visibility:visible;}

/* CTA Banner */
.cta-banner{
  padding:80px 32px;
  background:linear-gradient(135deg, var(--gold-3) 0%, var(--gold-2) 50%, var(--gold-3) 100%);
  text-align:center;
}
.cta-content h2{
  font-size:38px; color:#1b1510; letter-spacing:0.04em; margin-bottom:16px;
  font-weight:700;
}
.cta-content p{
  font-size:16px; color:#3a3226; max-width:600px; margin:0 auto 30px;
  line-height:1.7; letter-spacing:0.02em;
}
.cta-banner .hero-cta{
  background:var(--wood-dark); color:var(--gold-1);
  border:1px solid var(--gold-2);
  box-shadow:0 8px 18px rgba(0,0,0,0.3);
}
.cta-banner .hero-cta:hover{
  background:var(--wood-darker);
}

/* WhatsApp button */
.whatsapp-btn{
  position:fixed; bottom:24px; right:24px; z-index:100;
  width:60px; height:60px; border-radius:50%;
  background:#25d366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,0.4);
  transition:transform .3s ease, box-shadow .3s ease;
}
.whatsapp-btn svg{width:30px; height:30px;}
.whatsapp-btn:hover{transform:scale(1.1); box-shadow:0 6px 28px rgba(37,211,102,0.5);}
.whatsapp-tooltip{
  position:absolute; right:70px; top:50%; transform:translateY(-50%);
  background:#fff; color:#333; font-size:12px; font-weight:600;
  padding:8px 14px; border-radius:6px; white-space:nowrap;
  box-shadow:0 2px 10px rgba(0,0,0,0.15);
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
  letter-spacing:0.02em;
}
.whatsapp-tooltip::after{
  content:""; position:absolute; right:-6px; top:50%; transform:translateY(-50%);
  border:6px solid transparent; border-left-color:#fff;
}
.whatsapp-btn:hover .whatsapp-tooltip{opacity:1; visibility:visible;}
.whatsapp-btn{
  animation:whatsappPulse 2s infinite;
}
@keyframes whatsappPulse{
  0%{box-shadow:0 4px 20px rgba(37,211,102,0.4);}
  50%{box-shadow:0 4px 30px rgba(37,211,102,0.6);}
  100%{box-shadow:0 4px 20px rgba(37,211,102,0.4);}
}

/* Back to top */
.back-to-top{
  position:fixed; bottom:24px; left:24px; z-index:100;
  width:44px; height:44px; border-radius:50%;
  background:var(--gold-2); color:#1b1510; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 12px rgba(0,0,0,0.3);
  opacity:0; visibility:hidden; transform:translateY(20px);
  transition:all .3s ease;
}
.back-to-top svg{width:20px; height:20px;}
.back-to-top.visible{opacity:1; visibility:visible; transform:translateY(0);}
.back-to-top:hover{background:var(--gold-1); transform:translateY(-3px);}

/* scroll animations */
.reveal{opacity:0; transform:translateY(40px); transition:opacity 0.8s ease, transform 0.8s ease;}
.reveal.active{opacity:1; transform:translateY(0);}
.reveal-left{opacity:0; transform:translateX(-40px); transition:opacity 0.8s ease, transform 0.8s ease;}
.reveal-left.active{opacity:1; transform:translateX(0);}
.reveal-right{opacity:0; transform:translateX(40px); transition:opacity 0.8s ease, transform 0.8s ease;}
.reveal-right.active{opacity:1; transform:translateX(0);}
.reveal-scale{opacity:0; transform:scale(0.9); transition:opacity 0.8s ease, transform 0.8s ease;}
.reveal-scale.active{opacity:1; transform:scale(1);}

.delay-1{transition-delay:0.1s;}
.delay-2{transition-delay:0.2s;}
.delay-3{transition-delay:0.3s;}
.delay-4{transition-delay:0.4s;}
.delay-5{transition-delay:0.5s;}
.delay-6{transition-delay:0.6s;}

/* hero entrance */
.hero-inner h1,.hero-inner p,.hero-cta{
  opacity:0; transform:translateY(30px);
  animation:heroFadeIn 0.9s ease forwards;
}
.hero-inner p{animation-delay:0.2s;}
.hero-cta:first-of-type{animation-delay:0.4s;}
.hero-cta:last-of-type{animation-delay:0.55s;}

@keyframes heroFadeIn{
  to{opacity:1; transform:translateY(0);}
}

/* counter animation */
.counter-animate{transition:transform 0.3s ease;}
.counter-animate:hover{transform:scale(1.05);}

/* responsive */
@media (max-width:900px){
  .menu-toggle{display:block;}
  nav{display:none;}
  .topbar{font-size:11px; gap:16px; padding:8px 20px;}
  .navrow{padding:14px 20px;}
  .brand .name{font-size:20px;}
  .brand svg{width:36px; height:36px;}
  .hero-inner h1{font-size:34px;}
  .hero-inner p{font-size:14px;}
  .service-strip{grid-template-columns:1fr;}
  .service-strip a{border-right:none; border-bottom:1px solid var(--line);}
  .process-grid{grid-template-columns:repeat(2,1fr);}
  .about .highlights{grid-template-columns:1fr; gap:24px;}
  .trust-grid{grid-template-columns:repeat(2,1fr);}
  .testimonials-grid{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:1fr;}
  .row-2{grid-template-columns:1fr;}
  .footer-inner{flex-direction:column; align-items:flex-start;}
  .footer-right{text-align:left;}
}