/* =================================================================
   Linea estetica «De cabecera» para Astra + bloques - Mantenimiento.
   Se carga desde functions.php del tema hijo (no la pegues en «CSS
   adicional»). Autoaloja las fuentes (sin Google). Las clases awp-*
   se aplican a un bloque en Avanzado -> Clases CSS adicionales.
   La paleta global (fondo, cabecera, pie) se pone en el Personalizador:
   ver PERSONALIZADOR-astra.txt.
   ================================================================= */

/* ---- Fuentes autoalojadas ---- */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-sans-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/ibm-plex-sans-500.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/ibm-plex-sans-600.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-mono-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/ibm-plex-mono-500.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/ibm-plex-mono-600.woff2") format("woff2")}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:400 800;font-display:swap;src:url("../fonts/bricolage-grotesque-var.woff2") format("woff2")}

:root{
  --awp-bg:#fbf6ee; --awp-surface:#ffffff; --awp-surface-2:#faf6ee;
  --awp-ink:#262019; --awp-ink-2:#5d5342; --awp-ink-hi:#3d372c; --awp-meta:#77694e;
  --awp-line:#e8ddc8; --awp-line-2:#e0d5c0;
  --awp-accent:#2d9484; --awp-link:#1f6b60; --awp-marker:#ffe45c;
  --awp-btn:#2d9484; --awp-btn-ink:#08201c; --awp-btn-hover:#ffe45c; --awp-btn-hover-ink:#262019;
  --awp-band:#1f6b60; --awp-band-ink:#ffffff; --awp-soft:#e6f5f1;
}

/* ---- Tipografia ---- */
body,button,input,select,textarea,.ast-container,.main-header-menu a,.site-footer,.entry-content{
  font-family:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
}
h1,h2,h3,h4,h5,h6,.site-title,.entry-title,.ast-archive-title,.widget-title{
  font-family:"Bricolage Grotesque","IBM Plex Sans",system-ui,sans-serif;
  font-weight:700;letter-spacing:-.015em;
}
.entry-content{font-size:17px;line-height:1.6}

/* ---- Enlaces de contenido ---- */
.entry-content a,.ast-container a:not(.ast-button):not(.wp-block-button__link){color:var(--awp-link);text-underline-offset:2px}
.entry-content a:hover{color:var(--awp-ink)}

/* ---- Botones (Gutenberg, Astra y formularios) - cuadrados y con el acento ---- */
.wp-block-button__link,
.wp-block-button.is-style-fill .wp-block-button__link,
.ast-button,.button,.wp-element-button,
input[type="submit"],input[type="button"],button[type="submit"]{
  background-color:var(--awp-btn) !important;
  color:var(--awp-btn-ink) !important;
  border:1.5px solid var(--awp-btn) !important;
  border-radius:0 !important;
  padding:.78em 1.5em;
  font-family:"Bricolage Grotesque",sans-serif;font-weight:600;
  transition:background-color .15s,border-color .15s,color .15s;
}
.wp-block-button__link:hover,.ast-button:hover,.button:hover,.wp-element-button:hover,
input[type="submit"]:hover,button[type="submit"]:hover{
  background-color:var(--awp-btn-hover) !important;
  border-color:var(--awp-btn-hover) !important;
  color:var(--awp-btn-hover-ink) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link{
  background:transparent !important;color:var(--awp-ink) !important;
  border:1.5px solid var(--awp-ink) !important;border-radius:0 !important;
}

/* ---- Formularios cuadrados ---- */
input[type="text"],input[type="email"],input[type="url"],input[type="search"],
input[type="tel"],input[type="password"],input[type="number"],textarea,select{
  border:1.5px solid var(--awp-line-2) !important;border-radius:0 !important;background:var(--awp-surface);
}
input:focus,textarea:focus,select:focus{outline:2px solid var(--awp-link);outline-offset:1px}

/* ---- Foco visible ---- */
a:focus-visible,button:focus-visible,.wp-block-button__link:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--awp-link);outline-offset:2px;
}

/* =================================================================
   Utilidades (Avanzado -> Clases CSS adicionales en cualquier bloque)
   ================================================================= */

/* Tarjeta con borde y sombra dura (sin blur) */
.awp-card{background:var(--awp-surface);border:1px solid var(--awp-line-2);border-radius:0;padding:24px;box-shadow:4px 4px 0 rgba(38,32,25,.08)}

/* Banda de color para un CTA (fondo de acento profundo, texto claro) */
.awp-band{background:var(--awp-band);color:var(--awp-band-ink);border-radius:0;padding:40px 32px}
.awp-band :where(h1,h2,h3,h4,h5,h6,p){color:var(--awp-band-ink)}
.awp-band a{color:var(--awp-band-ink);text-decoration:underline}

/* Marcador amarillo sobre el texto (mejor envolviendo en un <mark class="awp-mark">) */
.awp-mark,mark.awp-mark{
  background:linear-gradient(var(--awp-marker),var(--awp-marker)) no-repeat 0 center;
  background-size:100% 1.05em;color:#262019;padding:.04em .14em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}

/* Etiquetas / badges tipo terminal */
.awp-badge{display:inline-block;font:600 11px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase;padding:6px 10px;border-radius:0;background:var(--awp-soft);color:var(--awp-link)}
.awp-badge--marker{background:var(--awp-marker);color:#262019}
.awp-badge--urgente{background:#c0392b;color:#ffffff}

/* Texto en monoespaciada */
.awp-mono{font-family:"IBM Plex Mono",ui-monospace,monospace}

/* Cursor de terminal opcional (span vacio con esta clase) */
.awp-cursor{display:inline-block;width:9px;height:1em;background:var(--awp-accent);vertical-align:-.12em;animation:awp-blink 1.15s steps(1) infinite}
@keyframes awp-blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.awp-cursor{animation:none}}