:root{
  --bg:#0e1117; --fg:#e8eefc; --muted:#98a2b3;
  --card:#121826; --line:#2a3244; --accent:#7aa2f7; --accent-2:#a78bfa;
  --ok:#34d399; --err:#f87171; --shadow: 0 10px 30px rgba(0,0,0,.35);
}
html[data-theme='light']{
  --bg:#f7f9fc; --fg:#0b1220; --muted:#5b6473;
  --card:#ffffff; --line:#dbe1ee; --accent:#4c6fff; --accent-2:#7c5cff;
  --ok:#059669; --err:#dc2626; --shadow: 0 10px 24px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font:16px/1.45 system-ui, Segoe UI, Roboto, Ubuntu}
.container{max-width:1200px;margin:0 auto;padding:0 16px}
.row{display:flex;align-items:center;gap:12px}
.row.between{justify-content:space-between}
.row.gap{gap:10px}
.grow{flex:1}
.nav{position:sticky;top:0;z-index:10;background:color-mix(in oklab, var(--bg), transparent 20%);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav .brand{font-weight:900;letter-spacing:.3px}
.nav .menu a{color:var(--fg);text-decoration:none;margin-left:14px;font-size:14px;opacity:.85}
.nav .menu a:hover{opacity:1}
.btn{background:#1b2333;color:#e8eefc;border:1px solid var(--line);padding:10px 14px;border-radius:12px;text-decoration:none;cursor:pointer;font-weight:700;box-shadow:var(--shadow)}
.btn:hover{filter:brightness(1.05)}
.btn.primary{background:var(--accent);color:#0b1020;border-color:transparent}
.btn.ghost{background:transparent;color:var(--fg)}
.section{padding:56px 0}
.section.alt{background:color-mix(in oklab, var(--bg), black 4%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
h1,h2{margin:0 0 8px 0}
h1{font-size:48px;line-height:1.05}
h2{font-size:28px}
.muted{color:var(--muted)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:960px){.grid-3{grid-template-columns:1fr} .cta-row{flex-direction:column;align-items:flex-start}}
.hero{position:relative}
.slider{position:relative;height:70vh;min-height:420px;overflow:hidden}
.slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transform:scale(1.06);
  transition:opacity .8s ease, transform 1.2s ease;
  pointer-events: none;           /* 👈 desactiva clicks si está inactivo */
}

.slide.active{
  opacity:1; transform:scale(1);
  pointer-events: auto;           /* 👈 solo el activo recibe clicks */
}
.slide .overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.25), transparent 60%);
  display:flex; flex-direction:column;
  align-items:center;                /* 👈 centrado horizontal */
  justify-content:center;            /* 👈 centrado vertical */
  text-align:center;                 /* 👈 texto centrado */
  gap:12px;
  padding:0 16px;
}
html[data-theme='light'] .slide .overlay{
  background:linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,.3), transparent 60%);
}
.slide h1{color:#fff;text-shadow:0 8px 24px rgba(0,0,0,.35)}
.slide p{color:#e8eefc;max-width:700px}
.s1 { background-image: url('img/hero1.png'); }
.s2 { background-image: url('img/hero2.webp'); }
.s3 { background-image: url('img/hero3.webp'); }

.arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.35);border:0;color:#fff;padding:10px 14px;border-radius:10px;cursor:pointer}
.arrow:hover{filter:brightness(1.1)}
.arrow.left{left:12px} .arrow.right{right:12px}
.dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:8px}
.dots button{width:10px;height:10px;border-radius:999px;border:0;background:rgba(255,255,255,.5);cursor:pointer}
.dots button.active{background:#fff}
.amen-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px}
@media(max-width:960px){.amen-grid{grid-template-columns:repeat(2,1fr)}}
.amen{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:var(--shadow);transition:transform .2s ease}
.amen:hover{transform:translateY(-2px)}
.amen .ico{font-size:24px;background:color-mix(in oklab, var(--accent), transparent 70%);width:40px;height:40px;display:grid;place-items:center;border-radius:10px;margin-bottom:8px}
.gallery{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:140px;gap:10px}
@media(max-width:960px){.gallery{grid-template-columns:repeat(3,1fr)}}
.g{background-size:cover;background-position:center;border-radius:14px;filter:saturate(1.05) contrast(1.05);transform:translateZ(0);transition:transform .2s ease, box-shadow .2s ease, filter .3s ease;box-shadow:var(--shadow);cursor:pointer}
.g:hover{transform:scale(1.03);filter:saturate(1.1) contrast(1.1)}
.g1{ background-image:url('img/1727129458731.jpg'); }
.g2{ background-image:url('img/1727129458748.jpg'); }
.g3{ background-image:url('img/1727129458764.jpg'); }
.g4{ background-image:url('img/1727129458780.jpg'); }
.g5{ background-image:url('img/1727129458795.jpg'); }
.g6{ background-image:url('img/1727129458810.jpg'); }
.g7{ background-image:url('img/1727129458826.jpg'); }
.g8{ background-image:url('img/1727129458844.jpg'); }
.g9{ background-image:url('img/1727129458878.jpg'); }

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:grid;place-items:center;z-index:50}
.lightbox.hidden{display:none}
.lightbox .lb-img{width:min(90vw,1000px);height:min(70vh,700px);border-radius:16px;background:#000;box-shadow:var(--shadow);background-size:cover;background-position:center}
.lightbox button{position:absolute;background:rgba(255,255,255,.12);border:0;color:#fff;padding:10px;border-radius:10px;cursor:pointer}
#lbClose{top:18px;right:18px} .lb-nav{top:50%;transform:translateY(-50%)} #lbPrev{left:18px} #lbNext{right:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.card.p{padding:14px}
.form{padding:14px;display:flex;flex-direction:column;gap:10px}
.form label{font-size:13px;color:var(--muted);display:block}
.form input,.form textarea{width:100%;margin-top:6px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in oklab, var(--bg), black 10%);color:var(--fg);outline:none}
.inline-msg{min-height:22px}
.ok{color:var(--ok)} .err{color:var(--err)}
.sum{padding:12px 14px;border-bottom:1px solid var(--line);cursor:pointer}
.panel{background:color-mix(in oklab, var(--bg), black 8%);border:1px solid var(--line);padding:10px;border-radius:12px;max-height:260px;overflow:auto}
.hidden{display:none}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
thead{background:color-mix(in oklab, var(--bg), black 12%);position:sticky;top:0}
tbody tr:hover{background:color-mix(in oklab, var(--bg), black 8%)}
td:nth-child(8){max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.footer{border-top:1px solid var(--line);padding:24px 0;color:var(--muted)}
.reviews{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:14px}
@media(max-width:960px){.reviews{grid-template-columns:1fr}}
.reviews > div{background:color-mix(in oklab, var(--bg), black 8%);border:1px solid var(--line);border-radius:12px;padding:12px}
.reviews .meta{color:var(--muted);font-size:12px;margin-top:8px}
.hint{margin:4px 0 0 2px;font-size:12px}
.chip{background:color-mix(in oklab, var(--bg), black 8%);border:1px solid var(--line);padding:6px 10px;border-radius:999px;color:var(--fg);cursor:pointer}
.chip:hover{filter:brightness(1.05)}
.map-card iframe{width:100%;height:380px;border:0;display:block}
.p16{padding:12px 14px}
.lightbox .lb-img {
  transition: background-image 0.4s ease, opacity 0.3s ease;
}
.cta-row{display:flex; gap:12px; justify-content:center;}
.wa-float{
  position:fixed; right:18px; bottom:18px;
  width:56px; height:56px; border-radius:999px;
  display:grid; place-items:center;
  background:#25D366; color:#fff; text-decoration:none;
  border:0; box-shadow:0 10px 24px rgba(0,0,0,.25);
  transition:transform .15s ease, filter .15s ease; z-index:60;
}
.wa-float:hover{ transform:translateY(-2px); filter:brightness(1.05); }
html[data-theme='light'] .wa-float{ box-shadow:0 10px 18px rgba(0,0,0,.12); }
.wa-float{
  position:fixed; right:18px; bottom:18px;
  width:56px; height:56px; border-radius:999px;
  display:grid; place-items:center;
  background:#25D366; color:#fff; text-decoration:none;
  border:0; box-shadow:0 10px 24px rgba(0,0,0,.25);
  transition:transform .15s ease, filter .15s ease; z-index:60;
}
.wa-float:hover{ transform:translateY(-2px); filter:brightness(1.05); }
html[data-theme='light'] .wa-float{ box-shadow:0 10px 18px rgba(0,0,0,.12); }
/* NAV: empujar el menú a la derecha */
.nav .menu { margin-left: auto; display:flex; align-items:center; gap:14px; }

/* Hamburguesa (oculta en desktop) */
#burger { display:none; background:transparent; border:0; font-size:26px; line-height:1; cursor:pointer; }
@media (max-width: 900px){
  .nav .menu { 
    position: absolute; top:56px; right:12px; 
    background: var(--card); border:1px solid var(--line); border-radius:12px;
    padding:10px; display:none; flex-direction:column; gap:8px; min-width: 180px;
    box-shadow: var(--shadow);
  }
  .nav .menu a { margin:0; padding:8px 10px; border-radius:8px; display:block; }
  .nav .menu a:hover { background: color-mix(in oklab, var(--bg), black 8%); }
  .nav .menu.open { display:flex; }
  #burger { display:block; }
  /* opcional: ocultar el theme toggle en mobile dentro del menú */
}
.footer .ig { margin-left:12px; color:var(--fg); opacity:.85; }
.footer .ig:hover{ opacity:1; }
.card h3 {
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:600;
  margin-bottom:8px;
}
.card h3 svg {
  flex-shrink:0;
  opacity:0.8;
  transition:opacity .2s ease;
}
.card:hover h3 svg {
  opacity:1;
}
.card p a {
  color:var(--fg);
  text-decoration:none;
  font-weight:500;
}
.card p a:hover {
  text-decoration:underline;
}

.reviews-carousel{
  position:relative;
  margin-top:16px;
}

.reviews-window{
  overflow:hidden;
}

.reviews-track{
  display:flex;
  transition:transform .4s ease;
}

.review-item{
  min-width:100%;
  padding:14px;
  background:color-mix(in oklab, var(--bg), black 8%);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow);
}

.review-item p{
  margin:0;
}

.review-item .meta{
  color:var(--muted);
  font-size:12px;
  margin-top:8px;
}

.rev-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  border:0;
  background:rgba(0,0,0,.35);
  color:#fff;
  width:32px;
  height:32px;
  border-radius:999px;
  cursor:pointer;
}
html[data-theme='light'] .rev-arrow{
  background:rgba(0,0,0,.18);
}
#revPrev{left:6px;}
#revNext{right:6px;}
