/* Digital Art Residence Chr5 – prototipo 06/11/2026. Sencillo: crema, negro, líneas finas, ningún texto por debajo de 1em. */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-size: 18px; line-height: 1.6; color: #111; background: #f7f4ec; }
h1, h2, h3, .btn, label, legend, .hero__kicker, .tarjeta__precio { font-family: 'Helvetica Neue', Arial, sans-serif; }
a { color: #111; text-decoration-color: #2f6b3a; text-decoration-thickness: 2px; text-underline-offset: 3px; }
main, .pie { max-width: 980px; margin: 0 auto; padding: 0 22px; }

/* Cabecera con la foto */
.hero { position: relative; height: min(78vh, 680px); min-height: 520px; display: flex; align-items: flex-end; color: #fff; background: #111; overflow: hidden; }
.hero__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; opacity: .78; }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 35%, rgba(0,0,0,.75)); }
.hero__txt { position: relative; z-index: 1; max-width: 980px; width: 100%; margin: 0 auto; padding: 0 22px 56px; }
.hero__kicker { margin: 0 0 6px; font-size: 1em; letter-spacing: .12em; text-transform: uppercase; }
.hero h1 { margin: 0 0 12px; font-size: clamp(2.2em, 6vw, 3.6em); line-height: 1.05; }
.hero h1 span { display: block; font-weight: 300; }
.hero__lema { max-width: 560px; margin: 0 0 24px; font-size: 1.1em; }
.hero .btn { border-color: #fff; color: #fff; }
.hero .btn:hover { background: #fff; color: #111; }

/* Botón: solo borde */
.btn { display: inline-flex; align-items: center; min-height: 52px; padding: 0 28px; border: 2px solid #111; border-radius: 999px; background: none; color: #111; font-size: 1em; font-weight: 700; text-decoration: none; cursor: pointer; }
.btn:hover { background: #111; color: #fff; }

section { padding: 56px 0 8px; }
h2 { margin: 0 0 22px; font-size: 1.7em; }
h3 { margin: 0 0 6px; font-size: 1.1em; }
.intro p { max-width: 720px; margin: 0; font-size: 1.25em; }

/* Valores */
.valores__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 28px 32px; }
.valores__lista li { padding-top: 14px; border-top: 1px solid #d9d2c1; }
.valores__lista p { margin: 0; }

/* Planes */
.plan__tarjetas { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.tarjeta { padding: 24px; border: 1px solid #d9d2c1; border-radius: 14px; background: #fff; }
.tarjeta__precio { margin: 0 0 10px; font-size: 1.5em; font-weight: 700; }
.tarjeta ul { margin: 0; padding-left: 1.1em; }
.plan__nota { margin: 18px 0 0; color: #444; }

/* Formulario */
.solicitud { padding-bottom: 64px; }
form { display: grid; gap: 18px; max-width: 640px; }
.campo { display: grid; gap: 6px; margin: 0; padding: 0; border: 0; }
label, legend { font-size: 1em; font-weight: 600; }
legend { margin-bottom: 6px; }
input, textarea { width: 100%; padding: 12px 14px; border: 1px solid #bfb7a4; border-radius: 10px; background: #fff; font: inherit; font-size: 1em; color: #111; }
input:focus, textarea:focus { outline: 2px solid #2f6b3a; outline-offset: 1px; }
.op { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; }
.op input { width: auto; margin-top: .35em; }
fieldset.campo .op { margin: 2px 0; }
.trampa { position: absolute; left: -9999px; }
.error { margin: 0; color: #b3261e; font-weight: 600; }
.gracias { max-width: 640px; padding: 24px; border: 1px solid #2f6b3a; border-radius: 14px; background: #fff; }

.pie { padding: 28px 22px 40px; border-top: 1px solid #d9d2c1; color: #444; }
.pie p { margin: 0 0 6px; }

@media (max-width: 600px) {
  body { font-size: 17px; }
  .hero { display: block; height: auto; min-height: 0; }
  .hero__foto { position: static; display: block; height: auto; aspect-ratio: 1122 / 617; object-position: 60% 30%; opacity: 1; }
  .hero::after { display: none; }
  .hero__txt { padding: 22px 22px 36px; }
}

/* Selector de idiomas, como en Awwa Art (globo + código + flecha; desplegable), arriba a la izquierda */
.barra { position: absolute; top: 14px; left: 14px; z-index: 50; }
.awg-lang { position: relative; }
.awg-lang__btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 8px 14px; border: 0; border-radius: 999px; background: rgba(17,17,17,.35); color: #fff; font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 1em; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; cursor: pointer; }
.awg-lang__btn:hover, .awg-lang.is-open .awg-lang__btn { background: #fff; color: #111; }
.awg-lang__code { display: inline-flex; align-items: center; gap: 5px; }
.awg-lang__caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; opacity: .7; transition: transform .2s; }
.awg-lang.is-open .awg-lang__caret { transform: rotate(180deg); }
.awg-lang__list { position: absolute; top: calc(100% + 8px); left: 0; min-width: 190px; margin: 0; padding: 8px; list-style: none; background: #fff; border-radius: 14px; box-shadow: 0 12px 32px rgba(17,17,17,.16); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .2s, transform .2s, visibility .2s; }
.awg-lang.is-open .awg-lang__list { opacity: 1; visibility: visible; transform: none; }
.awg-lang__list a { display: flex; gap: 12px; padding: 10px 12px; border-radius: 10px; color: #23232c; font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 1em; text-decoration: none; }
.awg-lang__list a:hover { background: #f6f5f0; }
.awg-lang__list a.is-current { background: #f1efe8; font-weight: 600; }
.awg-lang__list b { min-width: 28px; color: #6b7280; letter-spacing: .06em; text-transform: uppercase; }

/* Botón «Enviar solicitud»: negro con letras blancas, texto centrado (excepción a la regla de botones sin relleno, como el de /unlock) */
.btn { justify-content: center; text-align: center; }
.btn--enviar { background: #111; color: #fff; border-color: #111; }
.btn--enviar:hover { background: #2f6b3a; border-color: #2f6b3a; color: #fff; }

/* Cuatro residencias al año (enero, abril, junio, septiembre) */
.turnos { margin: 22px 0 0; padding: 18px 22px; border: 1px solid #d9d2c1; border-radius: 14px; background: #fff; }
.turnos p { margin: 0 0 10px; font-weight: 600; }
.turnos ul { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.turnos li { padding: 4px 16px; border: 1.5px solid #111; border-radius: 999px; font-family: 'Helvetica Neue', Arial, sans-serif; font-weight: 600; }