/*
Theme Name: CIMETSAS v3
Theme URI: https://cimetsas.com/
Author: CIMETSAS
Description: Tema propio de CIMETSAS. Sin Foundation, sin jQuery, sin Owl Carousel y sin Font Awesome: ~21 KB de CSS+JS frente a los ~640 KB del tema anterior. Paleta y tipografia tomadas del tema de 2019.
Version: 1.0.0
Requires at least: 5.9
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cimetsas-v3
Tags: business, custom-menu, featured-images, translation-ready
*/

/* ==========================================================================
   Solo lo que necesita WordPress. El sistema de diseño esta en
   assets/css/estilo.css, que se encola antes que este fichero.
   ========================================================================== */

/* ---------- Bloques de Gutenberg dentro de .prose ---------- */
.prose > *:first-child{margin-top:0}
.prose img{border-radius:0}
.prose .wp-block-image{margin:1.75rem 0}
.prose .wp-block-image img{width:100%;height:auto}
.prose figcaption,.prose .wp-block-image figcaption{
  font-size:.85rem;color:var(--muted);margin-top:.6rem;text-align:center}
.prose .wp-block-columns{display:grid;gap:clamp(1rem,3vw,2rem);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));margin:1.5rem 0}
.prose .wp-block-column{min-width:0}
.prose .wp-block-list{padding-left:1.15rem}
.prose .wp-block-spacer{max-height:64px}   /* los spacers de 100px descuadraban */
.prose .has-large-font-size{font-size:clamp(1.25rem,2.4vw,1.6rem);line-height:1.3;
  font-family:var(--disp);font-weight:800;color:var(--navy)}
.prose .wp-block-table{overflow-x:auto;display:block}
.prose .wp-block-table table{border-collapse:collapse;width:100%}
.prose .wp-block-table td,.prose .wp-block-table th{
  border:1px solid var(--mist-2);padding:.6rem .8rem;text-align:left}

/* El editor deja colores de fondo de la paleta antigua en algunos parrafos.
   Se neutralizan para que no rompan el contraste del texto. */
.prose .has-background{padding:1rem 1.15rem;border-radius:0}
.prose .has-light-green-cyan-background-color{background:var(--mist);color:var(--ink)}
.prose .has-vivid-cyan-blue-background-color{background:var(--navy);color:#fff}
.prose .has-vivid-cyan-blue-background-color strong{color:#fff}

/* ---------- Contact Form 7 ----------
   El contenido del formulario 154 esta escrito con la rejilla de 12 columnas
   de Foundation (.row + .column.medium-N). Foundation ya no se carga, asi que
   esas clases hay que implementarlas aqui o los campos salen uno debajo de
   otro a lo ancho. No se toca la definicion del formulario: esta en produccion
   y funciona. */
.prose .wpcf7-form{margin-top:1.5rem}
.prose .wpcf7-form .hidden-fields-container{display:none}
.prose .wpcf7-form .row{display:grid;grid-template-columns:repeat(12,1fr);
  gap:1rem;margin:0 0 1rem}
.prose .wpcf7-form .column{grid-column:span 12;min-width:0}
@media (min-width:640px){
  .prose .wpcf7-form .column.medium-6{grid-column:span 6}
  .prose .wpcf7-form .column.medium-4{grid-column:span 4}
  .prose .wpcf7-form .column.medium-12{grid-column:span 12}
}
.prose .wpcf7-form p{margin:0}
/* El rotulo es un nodo de texto suelto dentro de <label>, antes del campo. */
.prose .wpcf7-form label{display:flex;flex-direction:column;gap:.35rem;
  font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--navy)}
.prose .wpcf7-form .wpcf7-form-control-wrap{display:block}
.prose .wpcf7-form input[type=text],
.prose .wpcf7-form input[type=email],
.prose .wpcf7-form input[type=tel],
.prose .wpcf7-form select,
.prose .wpcf7-form textarea{
  font:inherit;font-size:.94rem;font-weight:400;letter-spacing:0;text-transform:none;
  color:var(--ink);background:#fff;border:1px solid var(--mist-2);padding:.7rem .85rem;
  width:100%;transition:border-color .18s,box-shadow .18s}
/* La textarea del formulario trae rows="10" y cols="40" escritos en la
   definicion: dentro de una columna estrecha eso la deja larguisima. */
.prose .wpcf7-form textarea{min-height:150px;height:150px;resize:vertical}

/* Grupo de radios de "Tipo de envio". CF7 anida OTRO <label> dentro del
   label del campo, asi que hay que deshacer el estilo de rotulo en el interior
   o cada opcion sale en versales y en columna. */
.prose .wpcf7-form .wpcf7-radio,
.prose .wpcf7-form .wpcf7-checkbox{display:flex;flex-wrap:wrap;gap:.45rem 1.4rem;
  margin-top:.2rem}
.prose .wpcf7-form .wpcf7-list-item{margin:0}
.prose .wpcf7-form .wpcf7-list-item label{flex-direction:row;align-items:center;
  gap:.45rem;font-size:.88rem;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--ink);cursor:pointer}
.prose .wpcf7-form input[type=radio],
.prose .wpcf7-form input[type=checkbox]{width:auto;margin:0;accent-color:var(--blue)}
.prose .wpcf7-form input:focus,
.prose .wpcf7-form select:focus,
.prose .wpcf7-form textarea:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(28,108,159,.16)}
/* El boton de enviar va FUERA del .row en la definicion del formulario. */
.prose .wpcf7-form input[type=submit]{
  margin-top:.5rem;cursor:pointer;border:0;
  background:var(--citron);color:var(--navy);
  padding:.9rem 1.7rem;font-weight:700;font-size:.92rem;letter-spacing:.01em;
  text-transform:none;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
  transition:background .18s,transform .18s}
.prose .wpcf7-form input[type=submit]:hover{background:var(--citron-bright);transform:translateY(-2px)}
.prose .wpcf7-response-output{border:1px solid var(--mist-2)!important;
  padding:.85rem 1rem!important;margin:1rem 0 0!important;font-size:.9rem}
.prose .wpcf7-not-valid-tip{font-size:.78rem;color:#c0392b;font-weight:600;
  letter-spacing:0;text-transform:none}

/* ---------- Foto de la ficha de servicio ---------- */
.ficha-foto{margin:0;position:sticky;top:100px}
.ficha-foto img{width:100%;height:auto;display:block;
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--chamfer)),
    calc(100% - var(--chamfer)) 100%,0 100%)}
@media (max-width:880px){.ficha-foto{position:static}}

/* ---------- Alineaciones del editor ---------- */
.alignleft{float:left;margin:.35rem 1.5rem 1rem 0}
.alignright{float:right;margin:.35rem 0 1rem 1.5rem}
.aligncenter{margin-inline:auto;display:block}
.alignwide,.alignfull{max-width:none}

/* ---------- Barra de administracion ---------- */
.admin-bar .head{top:32px}
@media (max-width:782px){.admin-bar .head{top:46px}}
