/* Monteaguado Asociados — estilos propios sobre Tailwind */

:root {
  --tinta: #132137;
  --noche: #05152D;
  --oro: #AC8642;
  --oro-viejo: #9E792B;
  --marfil: #F7F4EC;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

::selection { background: var(--oro); color: var(--noche); }

.wrap { width: 100%; max-width: 72rem; margin-inline: auto; padding-inline: 1.25rem; }
@media (min-width: 768px) { .wrap { padding-inline: 2rem; } }

.section-pad { padding-block: 5rem; }
@media (min-width: 768px) { .section-pad { padding-block: 7rem; } }

.kicker {
  font-family: 'Cinzel', Georgia, serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.btn-gold { letter-spacing: 0.04em; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 2px solid var(--oro-viejo);
  outline-offset: 3px;
}

/* Header: sombra al hacer scroll */
#header.scrolled { box-shadow: 0 10px 30px -18px rgba(5, 21, 45, 0.35); }

/* Enlace de navegación activo/hover con subrayado dorado */
.nav-link { position: relative; padding-block: 0.4rem; }
.nav-link::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%;
  background: var(--oro-viejo); transform: scaleX(0); transform-origin: left;
  transition: transform 0.25s ease;
}
.nav-link:hover::after, .nav-link[aria-current="page"]::after { transform: scaleX(1); }

/* FAQ con <details> nativo */
details.faq summary::-webkit-details-marker { display: none; }
details.faq summary { list-style: none; }
details.faq[open] .faq-chevron { transform: rotate(180deg); }

/* Línea vertical del proceso */
.proceso::before {
  content: ""; position: absolute; left: 15px; top: 8px; bottom: 8px; width: 1px;
  background: linear-gradient(to bottom, rgba(158, 121, 43, 0.5), rgba(158, 121, 43, 0.08));
}

/* Formulario */
.field {
  width: 100%; border: 1px solid rgba(19, 33, 55, 0.18); background: #fff;
  padding: 0.85rem 1rem; font-size: 0.95rem; color: var(--tinta);
  transition: border-color 0.2s ease;
}
.field::placeholder { color: rgba(90, 98, 115, 0.6); }
.field:focus { border-color: var(--oro-viejo); outline: none; }
.field:user-invalid { border-color: #b4372f; }

/* Honeypot antispam: fuera de pantalla para humanos */
.hp-field { position: absolute !important; left: -9999px !important; height: 0; overflow: hidden; }

/* Imágenes: nunca desbordar */
img { max-width: 100%; height: auto; }

/* ============ Capa señorial (v2) ============ */

/* Ornamento: línea — rombo — línea (hereda color del contenedor) */
.orn { display: inline-flex; align-items: center; gap: 0.8rem; color: var(--oro-viejo); }
.orn-line { height: 1px; width: 3.5rem; background: currentColor; opacity: 0.75; }
.orn-diamond { width: 7px; height: 7px; background: currentColor; transform: rotate(45deg); }
.orn--light { color: var(--oro); }

/* Panel enmarcado con doble filete */
.panel-frame { position: relative; border: 1px solid rgba(172, 134, 66, 0.5); }
.panel-frame::before {
  content: ""; position: absolute; inset: 8px;
  border: 1px solid rgba(172, 134, 66, 0.28); pointer-events: none;
}

/* Esquinas doradas en L */
.corners { position: relative; }
.corners::before, .corners::after {
  content: ""; position: absolute; width: 22px; height: 22px;
  border: 0 solid var(--oro); pointer-events: none; transition: width 0.3s ease, height 0.3s ease;
}
.corners::before { top: -1px; left: -1px; border-top-width: 1px; border-left-width: 1px; }
.corners::after { bottom: -1px; right: -1px; border-bottom-width: 1px; border-right-width: 1px; }
.corners:hover::before, .corners:hover::after { width: 34px; height: 34px; }

/* Letra capitular */
.dropcap::first-letter {
  font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 600;
  font-size: 3.3em; line-height: 0.78; float: left;
  margin: 0.05em 0.14em 0 0; color: var(--oro-viejo);
}

/* Textura de líneas finas para secciones azul noche */
.tex-lines::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, rgba(247, 244, 236, 0.03) 0 1px, transparent 1px 96px);
}

/* Navegación en Cinzel */
.nav-cinzel {
  font-family: 'Cinzel', Georgia, serif; font-size: 0.7rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
}

/* Botón dorado con filete interior grabado */
.btn-gold { position: relative; }
.btn-gold::after {
  content: ""; position: absolute; inset: 4px;
  border: 1px solid rgba(5, 21, 45, 0.28); pointer-events: none;
}

/* Cards que se invierten a azul noche al pasar el cursor */
.card-invert { transition: background-color 0.35s ease, border-color 0.35s ease, transform 0.3s ease; }
.card-invert:hover { background-color: var(--noche) !important; border-color: rgba(172, 134, 66, 0.6) !important; }
.card-invert:hover h3 { color: var(--marfil) !important; }
.card-invert:hover p { color: rgba(247, 244, 236, 0.72) !important; }
.card-invert:hover .card-link { color: var(--oro) !important; }
.card-invert:hover .card-seal { border-color: rgba(172, 134, 66, 0.9); }
.card-invert h3, .card-invert p, .card-invert .card-link { transition: color 0.35s ease; }
.card-seal { transition: border-color 0.35s ease; }

/* Botón flotante de WhatsApp */
.wa-float {
  position: fixed; right: 1.1rem; bottom: 1.1rem; z-index: 60;
  display: flex; height: 3.4rem; width: 3.4rem; align-items: center; justify-content: center;
  background: var(--noche); color: var(--marfil);
  border: 1px solid rgba(172, 134, 66, 0.65);
  box-shadow: 0 14px 30px -12px rgba(5, 21, 45, 0.5);
  transition: transform 0.2s ease, background 0.2s ease;
}
.wa-float:hover { transform: translateY(-2px); background: var(--tinta); }