/* ===== Reset mínimo ===== */
*{box-sizing:border-box}
html,body{scroll-behavior:smooth}
body{margin:0;color:#eaeaea;background:#000000;font-family:"Montserrat",Arial,Helvetica,sans-serif;line-height:1.5}
img{max-width:100%;height:auto;display:block}

/* ===== Topbar ===== */
.mt-topbar{background:#000000;border-bottom:1px solid #1a1a1a; width: 100%; text-align: center; justify-content: center;}
.mt-topbar__inner{max-width:1160px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:22px}
.mt-brand img{height:90px;width:auto}
.mt-topbar__info{display:flex;align-items:center;gap:18px;flex-wrap:wrap; width: 100%;text-align: center; justify-content: center;padding: 15px;}
.mt-topbar__item{color:#ecdca9;font-size:14px; padding: 15px;}
.mt-topbar__item i{margin-right:6px;color:#ecdca9}
.mt-topbar__link{color:#ecdca9;text-decoration:none;border-bottom:1px dotted transparent}
.mt-topbar__link:hover{color:#ffffff;border-bottom-color:#ecdca9}

/* ===== Hero (fondo) ===== */
.mt-hero{position:relative;padding:90px 0 80px;background:radial-gradient(780px 380px at 70% -20%, #ecdca926, #00000000 60%),linear-gradient(180deg,#160000 0%,#000000 60%);overflow:hidden;text-align:center}
.mt-hero-copy{color:#dddddd;font-size:18px;margin:10px auto 22px;max-width:920px}
.mt-hero-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ===== Tipografía y efecto degradado del título (tu estilo) ===== */
.mt-hero-script-hero-mt{
  font-family:'Great Vibes',cursive;
  font-size:clamp(34px,6vw,76px);
  line-height:1.05;letter-spacing:.3px;text-align:center;
  margin:6px 0 2px 0;

  color:transparent;-webkit-text-fill-color:transparent;
  background:linear-gradient(180deg,#ffffff 0%,#ecdca9 60%,#b89b51 100%);
  -webkit-background-clip:text;background-clip:text;
  background-size:200% 100%;
  text-shadow:0 2px 0 #00000080,0 14px 32px #00000080;
  animation:mt-hero-sheen-hero-mt 8s ease-in-out infinite alternate;
}
@keyframes mt-hero-sheen-hero-mt{from{background-position:0% 0}to{background-position:100% 0}}
.mt-hero-gradient-hero-mt{
  background:linear-gradient(180deg,#ffffff 0%,#ecdca9 55%,#a07f27 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

/* Subtítulo + franja dorada bajo el H1 */
.mt-hero-subtitle-hero-mt{
  font-family:'Cormorant Garamond',serif;font-weight:600;
  font-size:clamp(16px,2.2vw,22px);color:#eaeaea;opacity:.96;
  text-align:center;margin:6px 0 12px 0;
}
.mt-hero-subtitle-hero-mt::after{
  content:"";display:block;width:220px;height:6px;margin:10px auto 0;
  border-radius:8px;
  background:linear-gradient(90deg,#660000 0%,#ecdca9 55%,#660000 100%);
  box-shadow:0 6px 12px #00000059,0 0 0 2px #ecdca914 inset;
}

/* ===== Títulos secundarios con el mismo look ===== */
.mt-title-script{
  font-family:'Great Vibes',cursive;
  font-size:clamp(28px,4.4vw,48px);
  line-height:1.1;letter-spacing:.2px;margin:0 0 12px 0;text-align:left;
  color:transparent;-webkit-text-fill-color:transparent;
  background:linear-gradient(180deg,#ffffff 0%,#ecdca9 60%,#b89b51 100%);
  -webkit-background-clip:text;background-clip:text;
  text-shadow:0 1px 0 #00000066,0 8px 22px #00000059;
}
.mt-title-small{
  font-family:'Cormorant Garamond',serif;font-weight:700;
  font-size:22px;margin:0 0 8px 0;letter-spacing:.3px;
  color:transparent;-webkit-text-fill-color:transparent;
  background:linear-gradient(180deg,#ffffff 0%,#ecdca9 60%,#b89b51 100%);
  -webkit-background-clip:text;background-clip:text;
  text-shadow:0 1px 0 #00000066,0 6px 18px #00000059;
}

/* ===== Secciones ===== */
.mt-section{padding:72px 0}
.mt-section-alt{background:linear-gradient(180deg,#070707 0%,#0b0b0b 100%)}
.mt-lead{font-size:18px;color:#dddddd;margin:10px 0 16px}
.mt-bullets{margin:8px 0 0;padding-left:18px}
.mt-bullets li{margin:6px 0}

/* ===== Figure / imágenes ===== */
.mt-figure{border-radius:14px;overflow:hidden;border:1px solid #222222;box-shadow:0 8px 28px #00000059}
.mt-figure__img{display:block}
.mt-portrait{border-radius:18px;overflow:hidden;border:1px solid #262626;box-shadow:0 10px 32px #00000066;max-width:420px}

/* ===== Cards / pricing ===== */
.mt-pricing{background:linear-gradient(180deg,#070707 0%,#0b0b0b 100%)}
.mt-card{background:#0f0f0f;border:1px solid #222222;border-radius:14px;padding:22px;height:100%;position:relative;box-shadow:0 8px 28px #00000059}
.mt-card-featured{background:#151515;outline:2px solid #ecdca9}
.mt-ribbon{position:absolute;top:14px;right:-6px;background:#ecdca9;color:#000000;padding:6px 10px;border-radius:8px;font-size:12px;font-weight:700}
.mt-card__desc{color:#cfcfcf;margin:0 0 8px}
.mt-price{font-size:28px;color:#ecdca9;margin:8px 0 14px}
.mt-includes{margin:0 0 16px;padding-left:18px}
.mt-includes li{margin:6px 0}

/* ===== Formulario ===== */
.mt-form{background:#0f0f0f;border:1px solid #222222;border-radius:14px;padding:22px;box-shadow:0 8px 28px #00000059}
.mt-label{font-weight:600;color:#d9d9d9;margin-bottom:6px}
.mt-input{width:100%;background:#121212 !important;color:#f0f0f0 !important;border:1px solid #2a2a2a;border-radius:10px;padding:12px 12px;outline:none}
.mt-input:focus{border-color:#ecdca9;box-shadow:0 0 0 3px #ecdca92e}
.mt-msg{color:#bfbfbf;min-height:1.25em;margin:6px 0 0}
.mt-privacy{font-size:14px;color:#bfbfbf;margin:6px 0 0}
.mt-honey{position:absolute;left:-9999px;opacity:0;pointer-events:none}

/* ===== Botones: hover accesible (texto no se pierde) ===== */
.mt-btn{display:inline-block;padding:12px 20px;border-radius:12px;text-decoration:none;border:1px solid transparent;font-weight:700;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .15s ease,box-shadow .15s ease}
.mt-btn i{margin-right:8px}
.mt-btn:focus{outline:2px solid #ecdca9;outline-offset:2px}
.mt-btn:active{transform:translateY(1px)}

.mt-btn-primary{background:#ecdca9;color:#000000;border-color:#cdbf99;box-shadow:0 8px 28px #00000059}
.mt-btn-primary:hover{background:#fff2c9;color:#000000;border-color:#ecdca9}

.mt-btn-ghost{background:transparent;color:#ecdca9;border-color:#3a3a3a}
.mt-btn-ghost:hover{background:#161616;color:#ffffff;border-color:#4a4a4a}

.mt-btn-dark{background:#660000;color:#ffffff;border-color:#4b0000}
.mt-btn-dark:hover{background:#8a0000;color:#ffffff;border-color:#660000}

/* ===== Footer ===== */
.mt-footer{border-top:1px solid #1a1a1a;padding:28px 0;color:#bdbdbd;background:#080808;text-align:center}

/* ===== Responsive ===== */
@media (max-width:992px){.mt-hero-script-hero-mt{font-size:40px}}
@media (max-width:640px){
  .mt-hero-script-hero-mt{font-size:32px}
  .mt-hero-subtitle-hero-mt{font-size:18px}
}
/* ===== Fix recorte de la parte superior en títulos con efecto caligráfico ===== */

/* 1) Da “zona de seguridad” al título */
.mt-hero-script-hero-mt{
  /* más aire arriba para que no choque con el borde del panel */
  padding-top: .30em;         /* ~8–12px según el tamaño del H1 */
  line-height: 1.18;          /* evita que los ascendentes se recorten */
}

/* 2) Asegura que ningún contenedor inmediato lo corte por overflow */
.mt-hero-grid-hero-mt{ overflow: visible; }  /* el grid no recorta */
.mt-hero-panel-hero-mt{ overflow: hidden; }  /* mantenemos hidden aquí para los halos */

/* 3) Si aún vieras corte por el text-shadow en navegadores WebKit,
      reduce un poco la fuerza del glow superior */
.mt-hero-script-hero-mt{
  text-shadow: 0 2px 0 #00000080, 0 12px 28px #00000080; /* antes 14px/32px */
}

/* 4) Como respaldo, separa un poco el hero del borde superior del panel */
@media (min-width: 768px){
  .mt-hero-grid-hero-mt{ padding-top: 10px; } /* micro-colchón sin cambiar el layout */
}
/* ========= ARREGLO GLOBAL: títulos caligráficos que se cortan arriba ========= */
/* Aplica aire superior y un line-height seguro a los títulos con efecto dorado */

.mt-hero-script-hero-mt,        /* H1 del HERO */
.mt-reserve-script-reserve-mt,  /* Título de Reserva/FAQ */
.mt-title-script                /* Títulos script en secciones internas */
{
  padding-top: .38em;   /* colchón superior: evita que la S, T, L se corten */
  line-height: 1.18;    /* ascendentes seguros para Great Vibes */
  text-shadow: 0 2px 0 #00000080, 0 12px 28px #00000080; /* glow un poco más corto */
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent; /* por si algún CSS anterior lo perdió */
}

/* Si tuvieras otros títulos script futuros, añade su clase aquí ^ */

/* ========= Contenedores inmediatos: no recortar el texto ========= */
/* Muchos recortes vienen porque el wrapper directo tiene overflow:hidden */
.mt-hero-grid-hero-mt,
.mt-reserve-grid-reserve-mt {
  overflow: visible;
}

/* Mantén el overflow del panel del HERO si lo usas para halos,
   pero dale un microacolchado para separar del borde redondeado */
@media (min-width: 768px){
  .mt-hero-grid-hero-mt { padding-top: 10px; }
}

/* ========= Variantes NO script (dorados en tarjetas) ========= */
/* Si ves corte en h2/h3 dentro de tarjetas, dales un pequeño padding-top también */
.mt-feature-h2-feature-mt,
.mt-about-h2-about-mt,
.mt-reserve-h3-reserve-mt,
.mt-title-small {
  padding-top: .20em;     /* aire mínimo */
  line-height: 1.16;
}
