:root{
  --bg:#0f1115;
  --bg-2:#171a20;
  --text:#f7f4ed;
  --muted:#b9b2a4;
  --line:rgba(255,255,255,.12);
  --gold:#c9a35c;
  --gold-2:#e0bf78;
  --white:#ffffff;
  --ink:#171717;
  --soft:#f3efe7;
  --radius:22px;
  --shadow:0 22px 70px rgba(0,0,0,.22);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.55;
}
a{color:inherit;text-decoration:none}
.container{width:min(1180px, calc(100% - 36px)); margin:0 auto}
.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(15,17,21,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  min-height:84px;
  display:flex;
  align-items:center;
  gap:26px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--text);
  min-width:max-content;
}
.brand-with-logo{
  min-width:230px;
}
.brand-logo{
  display:block;
  height:54px;
  width:auto;
  max-width:260px;
  object-fit:contain;
}
.brand-mark{
  width:46px;
  height:46px;
  border:1px solid rgba(201,163,92,.7);
  color:var(--gold-2);
  display:grid;
  place-items:center;
  font-weight:800;
  letter-spacing:-1px;
  border-radius:14px;
}
.brand-text strong{display:block;letter-spacing:.08em;font-size:15px}
.brand-text small{display:block;color:var(--muted);font-size:12px;margin-top:1px}
.main-nav{
  display:flex;
  align-items:center;
  gap:22px;
  margin-left:auto;
}
.main-nav a{
  color:rgba(247,244,237,.82);
  font-size:14px;
}
.main-nav a.active,
.main-nav a:hover{color:var(--gold-2)}
.header-cta{
  color:var(--bg);
  background:var(--gold-2);
  padding:11px 16px;
  border-radius:999px;
  font-weight:700;
  font-size:14px;
}
.nav-toggle{
  display:none;
  margin-left:auto;
  color:var(--text);
  background:transparent;
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 11px;
  font-size:22px;
}
.hero{
  background:
    radial-gradient(circle at 75% 20%, rgba(201,163,92,.22), transparent 34%),
    linear-gradient(135deg, #0f1115 0%, #151922 48%, #090a0d 100%);
  color:var(--text);
  padding:86px 0 72px;
  overflow:hidden;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:56px;
  align-items:center;
}
.eyebrow{
  margin:0 0 14px;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
  font-weight:800;
}
h1,h2,h3{line-height:1.1;margin:0}
.hero h1{
  font-size:clamp(40px, 6vw, 76px);
  max-width:780px;
  letter-spacing:-.055em;
}
.lead{
  font-size:20px;
  color:rgba(247,244,237,.78);
  max-width:720px;
  margin:24px 0 0;
}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 20px;
  border-radius:999px;
  font-weight:800;
  border:1px solid transparent;
}
.btn.primary{background:var(--gold-2);color:#111}
.btn.secondary{border-color:rgba(255,255,255,.2);color:var(--text)}
.btn.light{background:#fff;color:#111}
.trust-strip{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:30px;
}
.trust-strip span{
  color:rgba(247,244,237,.78);
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  padding:8px 12px;
  font-size:13px;
}

.hero-main-image{
  display:block;
  width:100%;
  height:360px;
  object-fit:cover;
  object-position:center;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
}

.hero-card{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  border-radius:30px;
  padding:16px;
  box-shadow:var(--shadow);
}
.hero-photo-placeholder{
  height:360px;
  border-radius:22px;
  background:
    linear-gradient(135deg, rgba(201,163,92,.32), rgba(255,255,255,.04)),
    linear-gradient(145deg,#242936,#0d0f13);
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.10);
}
.hero-photo-placeholder span{
  font-size:32px;
  font-weight:900;
  letter-spacing:.14em;
  color:rgba(247,244,237,.74);
}

.hero-main-photo{
  display:block;
  width:100%;
  height:360px;
  object-fit:cover;
  object-position:center;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
}

.hero-card-content{padding:22px 10px 6px}
.hero-card-content h2{font-size:28px}
.hero-card-content p{color:rgba(247,244,237,.72);margin-bottom:0}
.section{padding:76px 0}
.section.muted{background:var(--soft)}
.section-head{max-width:780px;margin-bottom:30px}
.section-head h2,
.split h2,
.cta-inner h2,
.page-title h1{
  font-size:clamp(32px, 4vw, 52px);
  letter-spacing:-.04em;
}
.section-head p{font-size:18px;color:#5d5a54}
.cards{
  display:grid;
  gap:18px;
}
.cards.three{grid-template-columns:repeat(3, 1fr)}
.card{
  border:1px solid #e5ded2;
  border-radius:var(--radius);
  padding:28px;
  background:#fff;
  min-height:240px;
}
.card .number{
  display:inline-flex;
  width:44px;height:44px;
  align-items:center;justify-content:center;
  border-radius:14px;
  background:#151922;
  color:var(--gold-2);
  font-weight:900;
  margin-bottom:22px;
}
.card h3{font-size:23px;margin-bottom:14px}
.card p{color:#5d5a54;margin:0}
.split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:50px;
  align-items:center;
}
.split p{font-size:18px;color:#5d5a54}
.checklist{
  background:#fff;
  border-radius:var(--radius);
  padding:28px;
  box-shadow:0 16px 42px rgba(0,0,0,.08);
}
.checklist p{
  margin:0;
  padding:13px 0;
  border-bottom:1px solid #eee6da;
  color:#2c2c2c;
  font-weight:700;
}
.checklist p:last-child{border-bottom:0}
.cta-band{
  background:linear-gradient(135deg,#151922,#090a0d);
  color:var(--text);
  padding:58px 0;
}
.cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.cta-inner p{color:rgba(247,244,237,.76);font-size:18px;max-width:580px}
.page-title{
  background:
    radial-gradient(circle at 75% 20%, rgba(201,163,92,.17), transparent 36%),
    linear-gradient(135deg,#11141b,#08090c);
  color:var(--text);
  padding:70px 0;
}
.page-title p:last-child{
  max-width:760px;
  color:rgba(247,244,237,.78);
  font-size:19px;
}
.service-list{display:grid;gap:22px}
.service-block{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:24px;
  border:1px solid #e5ded2;
  border-radius:26px;
  padding:30px;
  background:#fff;
}
.service-block.featured{
  background:#151922;
  color:var(--text);
  border-color:#151922;
}
.service-number{
  width:64px;height:64px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:var(--gold-2);
  color:#111;
  font-weight:900;
  font-size:22px;
}
.service-block h2{font-size:32px;margin-bottom:10px}
.service-target{
  color:#7a6333;
  font-weight:800;
  margin:0 0 14px;
}
.service-block.featured .service-target{color:var(--gold-2)}
.service-block p{color:#5d5a54}
.service-block.featured p{color:rgba(247,244,237,.75)}
.service-block ul{margin:18px 0 0;padding-left:20px}
.service-block li{margin:7px 0}
.timeline{display:grid;gap:0;max-width:900px}
.timeline-item{
  display:grid;
  grid-template-columns:72px 1fr;
  gap:24px;
  padding:0 0 34px;
  position:relative;
}
.timeline-item:not(:last-child)::before{
  content:"";
  position:absolute;
  left:35px;top:64px;bottom:0;
  width:1px;background:#ded3c1;
}
.timeline-item span{
  width:70px;height:70px;border-radius:50%;
  display:grid;place-items:center;
  background:#151922;color:var(--gold-2);
  font-weight:900;
}
.timeline-item h2{font-size:30px;margin-bottom:8px}
.timeline-item p{color:#5d5a54;font-size:18px}
.quote-box{
  border-left:5px solid var(--gold);
  background:#fff;
  padding:30px;
  border-radius:0 22px 22px 0;
}
.quote-box p{font-size:24px;color:#171717;margin:0;font-weight:800}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:16px;
}
.gallery-item{
  height:230px;
  border-radius:22px;
  background:
    linear-gradient(135deg, rgba(201,163,92,.24), rgba(255,255,255,.03)),
    linear-gradient(145deg,#242936,#0d0f13);
  display:grid;
  place-items:center;
  color:rgba(247,244,237,.75);
  font-weight:800;
  letter-spacing:.08em;
}



.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.contact-card{
  border:1px solid #e5ded2;
  border-radius:26px;
  padding:34px;
  background:#fff;
}
.contact-card.dark{
  background:#151922;
  color:var(--text);
}
.contact-card h2{font-size:34px;margin-bottom:18px}
.contact-card p,.contact-card li{font-size:18px;color:#5d5a54}
.contact-card.dark li{color:rgba(247,244,237,.78)}
.contact-card a:not(.btn){color:#7a6333;font-weight:800}
.legal-text{max-width:900px}
.legal-text h2{font-size:28px;margin:28px 0 10px}
.legal-text p{color:#5d5a54;font-size:18px}
.site-footer{
  background:#0b0d11;
  color:rgba(247,244,237,.75);
  padding:52px 0 24px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:36px;
}
.footer-brand{
  color:var(--text);
  font-weight:900;
  letter-spacing:.10em;
  margin-bottom:12px;
}
.site-footer h3{color:var(--text);margin-bottom:12px}
.site-footer p{margin:8px 0}
.site-footer a:hover{color:var(--gold-2)}
.footer-bottom{
  border-top:1px solid var(--line);
  margin-top:34px;
  padding-top:18px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:13px;
}
.floating-whatsapp{
  position:fixed;
  right:18px;
  bottom:18px;
  background:#25d366;
  color:#05180c;
  padding:14px 18px;
  border-radius:999px;
  font-weight:900;
  box-shadow:0 12px 28px rgba(0,0,0,.24);
  z-index:60;
}
@media (max-width: 900px){
  .nav-toggle{display:block}
  .main-nav{
    display:none;
    position:absolute;
    left:18px;right:18px;top:78px;
    background:#11141b;
    border:1px solid var(--line);
    border-radius:18px;
    padding:16px;
    flex-direction:column;
    align-items:flex-start;
  }
  .main-nav.open{display:flex}
  .header-cta{display:none}
  .hero-grid,.split,


.contact-grid{grid-template-columns:1fr}
  .cards.three{grid-template-columns:1fr 1fr}
  .gallery-grid{grid-template-columns:1fr 1fr}
  .cta-inner{display:block}
  .service-block{grid-template-columns:1fr}
}
@media (max-width: 620px){
  .brand-with-logo{min-width:auto}
  .brand-logo{height:42px;max-width:210px}
  .container{width:min(100% - 28px, 1180px)}
  .hero{padding:58px 0}
  .hero h1{font-size:42px}
  .lead{font-size:18px}
  .hero-photo-placeholder{height:240px}
  .hero-main-photo{height:240px}
  .hero-main-image{height:240px}
  .section{padding:54px 0}
  .cards.three,.gallery-grid,.footer-grid{grid-template-columns:1fr}
  .service-block{padding:22px}
  .service-block h2{font-size:27px}
  .timeline-item{grid-template-columns:54px 1fr;gap:16px}
  .timeline-item span{width:54px;height:54px}
  .timeline-item:not(:last-child)::before{left:27px;top:54px}
  .footer-bottom{display:block}
}

/* V11 formulario WhatsApp */
.contact-form-layout{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:34px;
  align-items:start;
}
.form-intro{
  background:#151922;
  color:var(--text);
  border-radius:28px;
  padding:34px;
  position:sticky;
  top:104px;
}
.form-intro h2{
  font-size:clamp(32px, 4vw, 48px);
  letter-spacing:-.04em;
}
.form-intro p{
  color:rgba(247,244,237,.76);
  font-size:18px;
}
.mini-list{
  margin-top:24px;
  border-top:1px solid rgba(255,255,255,.13);
  padding-top:16px;
}
.mini-list p{
  margin:10px 0;
  font-weight:800;
  color:rgba(247,244,237,.82);
}
.whatsapp-form{
  background:#fff;
  border:1px solid #e5ded2;
  border-radius:28px;
  padding:30px;
  box-shadow:0 18px 50px rgba(0,0,0,.10);
}
.form-row{
  display:grid;
  gap:16px;
}
.form-row.two{
  grid-template-columns:1fr 1fr;
}
.whatsapp-form label{
  display:block;
  font-weight:900;
  margin-bottom:16px;
  color:#171717;
}
.whatsapp-form input,
.whatsapp-form select,
.whatsapp-form textarea{
  width:100%;
  margin-top:8px;
  border:1px solid #d9d1c3;
  background:#fbfaf7;
  border-radius:14px;
  padding:14px 14px;
  font:inherit;
  color:#171717;
  outline:none;
}
.whatsapp-form input:focus,
.whatsapp-form select:focus,
.whatsapp-form textarea:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(201,163,92,.18);
}
.whatsapp-form textarea{
  resize:vertical;
}
.checkbox-line{
  display:flex !important;
  gap:12px;
  align-items:flex-start;
  font-weight:700 !important;
  color:#4a4741 !important;
}
.checkbox-line input{
  width:auto;
  margin-top:5px;
}
.form-submit{
  width:100%;
  border:none;
  cursor:pointer;
  font-size:16px;
}
.form-note{
  font-size:14px;
  color:#6c665c;
  margin:14px 0 0;
}
@media screen and (max-width: 900px){
  .contact-form-layout{
    grid-template-columns:1fr !important;
  }
  .form-intro{
    position:static;
    padding:26px;
  }
  .whatsapp-form{
    padding:22px;
  }
  .form-row.two{
    grid-template-columns:1fr !important;
  }
}

/* V9 galería corregida */
.gallery-grid.real-gallery{
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:22px;
}
.gallery-photo{
  margin:0;
  overflow:hidden;
  border-radius:22px;
  background:#f2efe8;
  border:1px solid #e5ded2;
  box-shadow:0 12px 34px rgba(0,0,0,.10);
}
.gallery-photo img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:contain;
  object-position:center;
  background:#e7e3da;
}
.gallery-photo figcaption{
  padding:14px 16px;
  color:#171717;
  background:#fff;
  font-weight:800;
}
@media screen and (max-width: 900px){
  .gallery-grid.real-gallery{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:16px !important;
  }
  .gallery-photo img{
    aspect-ratio:4/3 !important;
    object-fit:contain !important;
  }
}
@media screen and (max-width: 620px){
  .gallery-grid.real-gallery{
    grid-template-columns:1fr !important;
  }
}

/* V7 móvil forzado */

@media screen and (max-width: 900px){
  html, body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }
  .container{
    width:calc(100% - 28px) !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .site-header{
    width:100% !important;
    overflow:hidden !important;
  }
  .header-inner{
    min-height:72px !important;
    display:flex !important;
    align-items:center !important;
  }
  .brand-with-logo{
    min-width:0 !important;
    max-width:220px !important;
  }
  .brand-logo{
    height:38px !important;
    max-width:210px !important;
    width:auto !important;
  }
  .nav-toggle{
    margin-left:auto !important;
    flex:0 0 auto !important;
  }
  .hero{
    padding:36px 0 42px !important;
    overflow:hidden !important;
  }
  .hero-grid{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .hero-copy{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:block !important;
  }
  .hero-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:block !important;
    margin-top:26px !important;
    padding:12px !important;
    border-radius:24px !important;
    transform:none !important;
  }
  .hero h1{
    width:100% !important;
    max-width:100% !important;
    font-size:42px !important;
    line-height:1.04 !important;
    letter-spacing:-0.055em !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }
  .lead{
    width:100% !important;
    max-width:100% !important;
    font-size:18px !important;
  }
  .hero-main-photo,
  .hero-photo-placeholder{
    display:block !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:4/3 !important;
    max-width:100% !important;
    object-fit:cover !important;
    object-position:center !important;
    border-radius:18px !important;
  }
  .hero-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
  }
  .hero-actions .btn{
    width:100% !important;
  }
  .trust-strip{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
  }
  .trust-strip span{
    font-size:12px !important;
    padding:7px 10px !important;
  }
}
@media screen and (max-width: 620px){
  .cards.three,
  .gallery-grid,
  .footer-grid,
  .contact-grid,
  .split{
    grid-template-columns:1fr !important;
  }
  .service-block{
    grid-template-columns:1fr !important;
  }
  .page-title h1,
  .section-head h2,
  .split h2,
  .cta-inner h2{
    font-size:34px !important;
  }
}

/* V15 galería 2026 */
.gallery-photo figcaption{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.gallery-card-title{
  display:block;
  font-size:1rem;
  font-weight:800;
  line-height:1.2;
}
.gallery-card-subtitle{
  display:block;
  font-size:.95rem;
  font-weight:500;
  line-height:1.35;
  color:#333;
}
.page-title p{
  max-width:900px;
}