/* ============================================================
   AVC — Contacto. Depende de avc.css.
   ============================================================ */

/* Hero (oscuro, sin imagen) */
.c-hero { background: var(--ink); color: var(--on-strong); }
.c-hero__inner { padding-top: clamp(150px, 22vh, 250px); padding-bottom: clamp(50px, 8vh, 90px); }
.c-hero h1 { font-size: clamp(3rem, 11vw, 10rem); line-height: .9; font-weight: 560; letter-spacing: -.035em; margin-top: clamp(16px,3vh,32px); }
.c-hero h1 em { font-style: normal; color: var(--accent); }
.c-hero .lead { color: var(--on-mid); margin-top: 28px; max-width: 46ch; }

/* Layout */
.c-grid { display: grid; grid-template-columns: 1.25fr .9fr; gap: clamp(40px, 6vw, 110px); align-items: start; }

/* Formulario */
.cform { display: flex; flex-direction: column; gap: clamp(22px, 3vw, 32px); }
.cform__fields { display: flex; flex-direction: column; gap: clamp(22px, 3vw, 32px); }
.cform__row { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(22px, 3vw, 32px); }
.field { display: flex; flex-direction: column; gap: 10px; position: relative; }
.field label { font-family: var(--mono); font-size: .64rem; letter-spacing: .18em; text-transform: uppercase; color: var(--t-soft); }
.field input, .field textarea, .field select {
  font-family: var(--display); font-size: 1.05rem; color: var(--t-strong);
  background: transparent; border: 0; border-bottom: 1px solid var(--line-dark);
  padding: 10px 0; transition: border-color .35s var(--ease); width: 100%;
  border-radius: 0; -webkit-appearance: none; appearance: none;
}
.field textarea { resize: vertical; min-height: 110px; line-height: 1.5; }
.field select { cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237c8696' stroke-width='1.4' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; padding-right: 24px; }
.field input:focus, .field textarea:focus, .field select:focus { outline: none; border-color: var(--accent); }
.field input::placeholder, .field textarea::placeholder { color: var(--t-soft); opacity: .7; }
.field.is-error input, .field.is-error textarea, .field.is-error select { border-color: #c0392b; }
.field__err { font-family: var(--mono); font-size: .6rem; letter-spacing: .08em; color: #c0392b; text-transform: uppercase; height: 0; opacity: 0; transition: opacity .3s; }
.field.is-error .field__err { height: auto; opacity: 1; }

.cform__foot { display: flex; align-items: center; justify-content: space-between; gap: 22px; flex-wrap: wrap; margin-top: 6px; }
.cform__note { font-family: var(--mono); font-size: .62rem; letter-spacing: .1em; color: var(--t-soft); max-width: 34ch; line-height: 1.6; }
.btn--solid { background: var(--ink); color: var(--paper); border: 1px solid var(--ink); }
.btn--solid .ico { background: var(--accent); color: var(--navy); }
.btn--solid:hover { background: var(--navy); border-color: var(--navy); color: #fff; }
.btn--solid:hover .ico { background: var(--accent); color: var(--navy); transform: rotate(45deg); }

/* Éxito */
.cform__success { display: none; padding: 40px 0; }
.cform__success.is-on { display: block; animation: tfadeC .6s var(--ease); }
@keyframes tfadeC { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.cform__success .ok { width: 54px; height: 54px; border-radius: 50%; background: var(--accent); color: var(--navy); display: grid; place-items: center; font-size: 1.4rem; }
.cform__success h3 { font-size: clamp(1.6rem, 3vw, 2.4rem); letter-spacing: -.02em; margin: 24px 0 12px; }
.cform__success p { color: var(--t-mid); max-width: 40ch; }
.cform.is-sent .cform__fields { display: none; }

/* Canales */
.channels { display: flex; flex-direction: column; }
.channel { display: block; padding: 22px 0; border-top: 1px solid var(--line-dark); transition: padding .35s var(--ease); }
.channel:last-child { border-bottom: 1px solid var(--line-dark); }
.channel:hover { padding-left: 10px; }
.channel .k { font-family: var(--mono); font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; color: var(--t-soft); display: block; margin-bottom: 8px; }
.channel .v { font-size: clamp(1.1rem, 1.6vw, 1.45rem); font-weight: 500; letter-spacing: -.01em; display: flex; align-items: center; gap: 10px; }
.channel .v .arr { color: var(--accent); transition: transform .35s var(--ease); }
.channel:hover .v .arr { transform: translate(3px,-3px); }
.channels__hours { margin-top: 26px; }
.channels__hours .k { font-family: var(--mono); font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; color: var(--t-soft); display: block; margin-bottom: 8px; }
.channels__hours .v { color: var(--t-mid); line-height: 1.7; }

@media (max-width: 1040px) {
  .c-grid { grid-template-columns: 1fr; gap: 56px; }
}
@media (max-width: 600px) {
  .cform__row { grid-template-columns: 1fr; }
}