/* === RFP Core UI (Sprint 2) ==========================================
   Design tokens + estilos base accesibles. Independiente del tema.
   Edítame para añadir componentes en P2.2+.
====================================================================== */
:root{
  --c-primary-600:#0E7490; --c-primary-700:#0C6178; --c-primary-800:#0A4E60;
  --c-accent-600:#7C3AED; --c-accent-700:#6D28D9;
  --c-neutral-50:#F9FAFB; --c-neutral-100:#F3F4F6; --c-neutral-300:#D1D5DB;
  --c-neutral-500:#6B7280; --c-neutral-700:#374151; --c-neutral-900:#111827;
  --c-success-600:#16A34A; --c-warning-600:#D97706; --c-danger-600:#DC2626; --c-info-600:#2563EB;
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  --lead: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --h1: clamp(2.1rem, 1.4rem + 2.2vw, 3.2rem);
  --h2: clamp(1.8rem, 1.2rem + 1.6vw, 2.6rem);
  --h3: clamp(1.4rem, 1.1rem + 1.0vw, 2.0rem);
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-6:1.5rem; --space-8:2rem; --space-12:3rem; --space-16:4rem;
  --radius-sm:.5rem; --radius-md:1rem; --radius-lg:1.25rem;
  --elev-1: 0 2px 10px rgba(17,24,39,.06); --elev-2: 0 8px 24px rgba(17,24,39,.10);
  --container: 1200px; --bp-sm:480px; --bp-md:768px; --bp-lg:1024px; --bp-xl:1280px;
}
html{scroll-behavior:smooth}
body{font-family:var(--font-sans); font-size:var(--lead); line-height:1.6; color:var(--c-neutral-900); background:var(--c-neutral-50)}
h1,h2,h3{line-height:1.2; font-weight:700; letter-spacing:-.01em; margin:0 0 var(--space-4)}
h1{font-size:var(--h1)} h2{font-size:var(--h2)} h3{font-size:var(--h3)}
.container{max-width:var(--container); margin:0 auto; padding:0 var(--space-4)}
@media (min-width:1600px){ .container{max-width:1320px} }
a{color:var(--c-accent-600); text-decoration:underline; text-underline-offset:2px}
a:hover{color:var(--c-accent-700)}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1.25rem; border-radius:var(--radius-md);
     font-weight:600; text-decoration:none; border:1px solid transparent; transition:transform .06s ease, box-shadow .2s ease}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--c-primary-600); color:#fff; box-shadow:var(--elev-1)}
.btn-primary:hover{background:var(--c-primary-700); box-shadow:var(--elev-2)}
.btn-outline{background:#fff; color:var(--c-primary-700); border-color:var(--c-primary-700)}
.btn-outline:hover{background:var(--c-neutral-100)}
:focus-visible{outline:3px solid var(--c-info-600); outline-offset:3px; border-radius:8px}
.card{background:#fff; border-radius:var(--radius-lg); box-shadow:var(--elev-1); padding:var(--space-6)}
label{font-weight:600; display:block; margin-bottom:.375rem}
.input, input[type="text"],input[type="email"],input[type="tel"],select,textarea{
  width:100%; padding:.75rem .875rem; border-radius:.75rem; border:1px solid var(--c-neutral-300); background:#fff;
}
.input:focus, select:focus, textarea:focus{border-color:var(--c-primary-600); box-shadow:0 0 0 4px rgba(14,116,144,.12)}
.alert{padding:var(--space-4); border-radius:var(--radius-md)}
.alert--ok{background:rgba(22,163,74,.12); border:1px solid var(--c-success-600)}
.alert--warn{background:rgba(217,119,6,.12); border:1px solid var(--c-warning-600)}
.alert--err{background:rgba(220,38,38,.12); border:1px solid var(--c-danger-600)}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition:none !important; scroll-behavior:auto !important}
}
.hide-visually{position:absolute!important;clip:rect(1px,1px,1px,1px);padding:0!important;border:0!important;height:1px!important;width:1px!important;overflow:hidden}
.mt-8{margin-top:var(--space-8)} .mb-8{margin-bottom:var(--space-8)}

/* Botón nativo de bloques con nuestro estilo */
.wp-block-button__link{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.75rem 1.25rem; border-radius:var(--radius-md);
  font-weight:600; text-decoration:none; border:1px solid transparent;
  transition:transform .06s ease, box-shadow .2s ease;
  background:var(--c-primary-600); color:#fff; box-shadow:var(--elev-1);
}
.wp-block-button__link:hover{background:var(--c-primary-700); box-shadow:var(--elev-2)}
.wp-block-button__link.is-style-outline{
  background:#fff; color:var(--c-primary-700); border-color:var(--c-primary-700);
}
.wp-block-button__link.is-style-outline:hover{background:var(--c-neutral-100)}

/* === P2.2 Botones & Enlaces ===================================== */
/* Base */
.btn{
  --_bg: var(--c-primary-600);
  --_bgH: var(--c-primary-700);
  --_fg: #fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:44px; padding:.75rem 1.25rem; border-radius:var(--radius-md);
  font-weight:600; text-decoration:none; border:1px solid transparent;
  transition:transform .06s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  background:var(--_bg); color:var(--_fg); box-shadow:var(--elev-1);
}
.btn:hover{background:var(--_bgH); box-shadow:var(--elev-2)}
.btn:active{transform:translateY(1px)}
.btn[aria-disabled="true"], .btn.is-disabled{opacity:.55; pointer-events:none}

/* Variantes */
.btn--primary{ --_bg: var(--c-primary-600); --_bgH: var(--c-primary-700); --_fg:#fff; }
.btn--secondary{ --_bg:#fff; --_bgH: var(--c-neutral-100); --_fg: var(--c-primary-700); border-color:var(--c-primary-700); }
.btn--accent{ --_bg: var(--c-accent-600); --_bgH: var(--c-accent-700); --_fg:#fff; }
.btn--ghost{ background:transparent; color:var(--c-primary-700); box-shadow:none }
.btn--link{ background:transparent; color:var(--c-accent-600); text-decoration:underline; text-underline-offset:2px; box-shadow:none; padding:0 }
.btn--danger{ --_bg: var(--c-danger-600); --_bgH:#b91c1c; --_fg:#fff; }

/* Tamaños */
.btn--sm{ min-height:40px; padding:.5rem .9rem; font-size:.95em }
.btn--lg{ min-height:48px; padding:1rem 1.5rem; font-size:1.05em }
.btn--block{ display:flex; width:100% }

/* Iconos */
.btn .icon{ width:1.2em; height:1.2em; display:inline-block }

/* Foco accesible */
.btn:focus-visible{ outline:3px solid var(--c-info-600); outline-offset:3px }

/* Enlaces destacados (texto) */
.link, .prose a{
  color:var(--c-accent-600); text-decoration:underline; text-underline-offset:2px;
}
.link:hover, .prose a:hover{ color:var(--c-accent-700) }

/* Opcional: mapear el botón nativo de Gutenberg a nuestro estilo.
   Descomenta si quieres que TODOS los bloques Botón adopten este UI. */
/*
.wp-block-button__link{ @apply: not real; }  /* marcador para localizar */
/* Equivalente sin Tailwind: */
.wp-block-button__link{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:44px; padding:.75rem 1.25rem; border-radius:var(--radius-md);
  font-weight:600; border:1px solid transparent; transition:transform .06s ease, box-shadow .2s ease, background .2s ease;
  background:var(--c-primary-600); color:#fff; box-shadow:var(--elev-1);
}
.wp-block-button__link:hover{ background:var(--c-primary-700); box-shadow:var(--elev-2) }
.wp-block-button__link.is-style-outline{ background:#fff; color:var(--c-primary-700); border-color:var(--c-primary-700) }
.wp-block-button__link.is-style-outline:hover{ background:var(--c-neutral-100) }
*/
