/* AM Vivencial Tours - "Envíanos tu experiencia" (mu-plugins/am-blog-visitantes.php). Blue Nova Consulting.
   Escala fluida con la regla del sistema: tope en 1440px. */
.am-visit{ scroll-margin-top:calc(var(--am-hd,92px) + 16px); }
.am-visit__intro{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(28px,5.556vw,80px); align-items:end; }
.am-visit__copy .am-lead{ margin:22px 0 0; }
.am-visit__side{ display:grid; gap:24px; justify-items:start; }
.am-visit__steps{ list-style:none; margin:0; padding:0; display:grid; gap:14px; counter-reset:none; }
.am-page .am-visit__steps li{ display:grid; grid-template-columns:40px 1fr; gap:14px; align-items:center; margin:0; font-size:clamp(1rem,1.181vw,1.0625rem); line-height:1.45; color:var(--am-ink,#251E18); }
.am-visit__n{ display:inline-grid; place-items:center; width:40px; height:40px; border-radius:50%; border:1.5px solid var(--am-terracotta,#A2573A);
  font-family:var(--am-font-display); font-weight:500; font-size:1rem; color:var(--am-terracotta,#A2573A); }
.am-visit__open .am-ico{ width:20px; height:20px; }

/* panel del formulario (acordeon). Sin JS queda abierto; con JS arranca cerrado sin parpadeo
   (html.am-visit-ready lo pone un script en linea antes de la seccion). */
.am-visit__panel{ margin-top:clamp(28px,3.333vw,48px); max-width:920px; padding:clamp(20px,2.778vw,40px); border-radius:var(--am-r-lg,28px);
  background:rgba(255,255,255,.86); border:1px solid var(--am-line,#e6dccf); box-shadow:0 20px 50px rgba(37,30,24,.08); outline:none; }
html.am-visit-ready .am-visit:not(.is-open) .am-visit__panel{ display:none; }
html.am-visit-ready .am-visit .am-visit__panel:target{ display:block; }
.am-visit.is-open .am-visit__panel{ animation:am-visit-in .5s var(--am-ease,ease) both; }
@keyframes am-visit-in{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
html.am-motion-ninguna .am-visit.is-open .am-visit__panel, html.am-no-motion .am-visit.is-open .am-visit__panel{ animation:none; }
@media (prefers-reduced-motion:reduce){ .am-visit.is-open .am-visit__panel{ animation-duration:.2s; } }
.am-visit__panel-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 20px; }
.am-page button.am-visit__close{ min-height:40px; padding:6px 2px; border:0; background:none; box-shadow:none; cursor:pointer;
  font-family:var(--am-font-display); font-size:.95rem; font-weight:500; letter-spacing:.01em; text-transform:none; color:var(--am-green-800,#1f2a1b);
  text-decoration:underline; text-decoration-color:var(--am-terracotta,#A2573A); text-decoration-thickness:1.5px; text-underline-offset:5px; }
.am-page button.am-visit__close:hover{ color:var(--am-terracotta,#A2573A); background:none; }

/* formulario: mismas clases que el 57 (page.css las pinta en /contacto/ y en el blog). Refuerzos por si el bloque
   se usa en una vista que no carga page.css. */
.am-visit .am-form{ display:grid; gap:16px; }
.am-visit .am-form p{ margin:0; }
.am-visit .am-form br{ display:none; }
.am-visit .am-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.am-visit .am-grid3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.am-visit .am-form label{ display:block; margin:0; font-family:var(--am-font-display); font-size:.92rem; font-weight:500; color:var(--am-green-800,#1f2a1b); }
.am-visit .am-field__lab{ display:block; margin:0 0 7px; line-height:1.3; }
.am-visit .am-req{ color:var(--am-terracotta,#A2573A); }
.am-visit .am-form input:not([type=checkbox]):not([type=submit]):not([type=file]), .am-visit .am-form textarea, .am-visit .am-form select{ width:100%; min-height:54px; padding:14px 16px;
  border:1.5px solid var(--am-line,#e6dccf); border-radius:14px; background:var(--am-cream,#fbf8f3); font-family:var(--am-font-body); font-size:1rem; color:var(--am-ink,#251E18); }
.am-visit .am-form textarea{ min-height:180px; height:180px; resize:vertical; }
.am-visit .am-form input[type=file]{ width:100%; max-width:100%; min-height:54px; padding:12px 14px; border:1.5px dashed var(--am-line,#e6dccf); border-radius:14px; background:var(--am-cream,#fbf8f3);
  font-family:var(--am-font-body); font-size:.92rem; color:var(--am-muted,#5d675f); cursor:pointer; }
.am-visit .am-form input[type=file]::file-selector-button{ margin-right:12px; padding:8px 14px; border:0; border-radius:999px; background:var(--am-green,#374631); color:#FAEDE4;
  font-family:var(--am-font-display); font-size:.88rem; font-weight:500; cursor:pointer; }
.am-visit .am-form .wpcf7-submit{ width:100%; min-height:56px; border:0; border-radius:999px !important; background:var(--am-green,#374631); color:#FAEDE4;
  font-family:var(--am-font-display); font-size:1.02rem; font-weight:500; letter-spacing:.01em; cursor:pointer; transition:background .25s ease; }
.am-visit .am-form .wpcf7-submit:hover{ background:var(--am-green-800,#1f2a1b); }
/* r24: el icono de correo iba pegado al texto («✉Enviar mi historia»): la regla de am-formularios.php solo se imprime en /contacto/ */
.am-visit .am-form button.wpcf7-submit{ display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:0 24px; line-height:1.2; text-transform:none; }
.am-visit .am-form button.wpcf7-submit .am-ico{ flex:none; width:20px; height:20px; }
.am-visit .am-form .wpcf7-submit:disabled{ opacity:.5; cursor:not-allowed; }
.am-visit .am-quest{ margin:0; padding:clamp(16px,1.667vw,24px); border:1.5px solid var(--am-line,#e6dccf); border-radius:18px; background:#fdfbf8; min-width:0; }
.am-visit .am-quest__legend{ padding:0 8px; font-family:var(--am-font-display); font-size:1rem; font-weight:600; color:var(--am-green-800,#1f2a1b); }
.am-visit .am-quest__in{ display:grid; gap:12px; }
.am-visit .am-field__ayuda{ margin:0; font-size:max(.86rem,12px); line-height:1.45; color:var(--am-muted,#5d675f); }
.am-visit .am-field--consent .wpcf7-list-item{ margin:0; }
.am-visit .am-field--consent label{ display:grid; grid-template-columns:24px 1fr; gap:12px; align-items:start; font-family:var(--am-font-body); font-size:.96rem; font-weight:400; line-height:1.5; color:var(--am-muted,#5d675f); cursor:pointer; }
.am-visit .am-field--consent input[type=checkbox]{ width:22px; height:22px; margin:1px 0 0; accent-color:var(--am-green,#374631); cursor:pointer; }
.am-page .am-visit .am-field--consent a{ color:var(--am-green-800,#1f2a1b) !important; text-decoration:underline; text-underline-offset:3px; }
.am-visit .am-form__consent-hint{ margin:10px 0 0; font-size:max(.88rem,12px); line-height:1.45; color:var(--am-terracotta,#A2573A); }
.am-visit .am-form__consent-hint[hidden]{ display:none; }
.am-visit .wpcf7-not-valid-tip{ margin-top:6px; font-size:max(.85rem,12px); color:#9b2c16; }
.am-visit .wpcf7-response-output{ margin:6px 0 0 !important; padding:14px 18px !important; border-radius:14px; font-size:.98rem; }
.am-visit .wpcf7 form.sent .wpcf7-response-output{ background-color:#eef4e6; border-color:rgba(55,70,49,.28); color:var(--am-green-800,#1f2a1b); }
/* campo trampa: fuera de la vista y del foco */
.am-visit .am-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* tono oscuro */
.am-section--coffee.am-visit .am-visit__steps li{ color:#FAEDE4; }
.am-section--coffee.am-visit .am-visit__n{ border-color:var(--am-beige,#E1C5AF); color:var(--am-beige,#E1C5AF); }
.am-section--coffee.am-visit .am-visit__panel{ background:#fbf8f3; }

@media (max-width:900px){
  .am-visit__intro{ grid-template-columns:1fr; align-items:start; }
}
@media (max-width:600px){
  .am-visit .am-grid2, .am-visit .am-grid3{ grid-template-columns:1fr; }
  .am-visit__open{ width:100%; justify-content:center; }
  .am-visit__panel{ padding:18px 14px; border-radius:20px; }
}
/* fotos: una por fila (en tres columnas el nombre del archivo quedaba recortado) */
.am-visit .am-visit__fotos .am-grid3{ grid-template-columns:minmax(0,1fr); max-width:620px; }
.am-page .am-visit .am-visit__open{ text-transform:none; letter-spacing:.02em; }

/* r24 (30-sep) · campos de foto con nombre propio. A 390 el texto nativo salia cortado («Ning…nado»). visitantes.js pone
   .am-file en el envoltorio de CF7 y un span con el nombre (puede ir en dos lineas); la caja punteada la dibuja el
   envoltorio y el input queda solo como boton. Sin JS se queda el campo nativo de siempre. */
.am-visit .am-form .am-file{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; box-sizing:border-box; min-height:54px; padding:9px 14px;
  border:1.5px dashed var(--am-line,#e6dccf); border-radius:14px; background:var(--am-cream,#fbf8f3); cursor:pointer; }
.am-visit .am-form .am-file > input[type=file]{ flex:0 0 auto; width:auto !important; max-width:100%; min-height:0 !important; margin:0; padding:0 !important;
  border:0 !important; border-radius:999px; background:none !important; font-size:0 !important; line-height:1; color:transparent !important; }
.am-visit .am-form .am-file > input[type=file]::file-selector-button{ margin:0 !important; font-size:.88rem; }
.am-visit .am-form .am-file > input[type=file]:focus{ outline:0 !important; }
.am-visit .am-form .am-file__name{ flex:1 1 16ch; min-width:0; font-family:var(--am-font-body); font-size:.92rem; font-weight:400; line-height:1.35; color:var(--am-muted,#5d675f); overflow-wrap:anywhere; }
.am-visit .am-form .am-file.is-set .am-file__name{ color:var(--am-ink,#251E18); }
.am-visit .am-form .am-file:focus-within{ outline:2px solid var(--am-green,#374631); outline-offset:1px; border-color:var(--am-green,#374631); background:#fff; }
.am-visit .am-form .am-file:has(.wpcf7-not-valid){ border-color:#b4462a; }
.am-visit .am-form .am-file .wpcf7-not-valid-tip{ flex:0 0 100%; position:static !important; margin:0 !important; }
@media (max-width:600px){ .am-visit .am-form .am-file{ padding:8px 12px; } .am-visit .am-form .am-file__name{ font-size:.9rem; } }
