/*
Theme Name: COLPROLeón 2026
Theme URI: https://colproleon.es/
Author: COLPROLeón
Description: Tema institucional ligero y accesible para la Asociación de Colegios Profesionales de León.
Version: 1.1.0
Requires at least: 6.3
Requires PHP: 7.4
Text Domain: colproleon
*/

:root {
  --cl-burgundy: #6D0000;
  --cl-burgundy-dark: #510000;
  --cl-ink: #171717;
  --cl-text: #4f4f4f;
  --cl-muted: #747474;
  --cl-border: #e3e3e3;
  --cl-soft: #f7f4f4;
  --cl-white: #ffffff;
  --cl-max: 1200px;
  --cl-radius: 12px;
  --cl-shadow: 0 10px 30px rgba(23,23,23,.07);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--cl-text);
  background: var(--cl-white);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}
a { color: var(--cl-burgundy); text-decoration-thickness: .08em; text-underline-offset: .15em; }
a:hover, a:focus { color: var(--cl-burgundy-dark); }
img { max-width: 100%; height: auto; }
button, input, textarea, select { font: inherit; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.screen-reader-text:focus { width: auto; height: auto; clip: auto; margin: 8px; padding: 10px 14px; background: #fff; z-index: 99999; }

.cl-container { width: min(calc(100% - 40px), var(--cl-max)); margin-inline: auto; }
.cl-narrow { width: min(calc(100% - 40px), 820px); margin-inline: auto; }
.cl-section { padding: 72px 0; }
.cl-section--soft { background: var(--cl-soft); }
.cl-section-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:32px; }
.cl-eyebrow { color: var(--cl-burgundy); font-size:.83rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin:0 0 8px; }
h1,h2,h3,h4 { color: var(--cl-ink); line-height:1.15; margin-top:0; }
h1 { font-size: clamp(2.2rem, 4.4vw, 4.15rem); letter-spacing:-.035em; }
h2 { font-size: clamp(1.75rem, 3vw, 2.65rem); letter-spacing:-.025em; }
h3 { font-size: 1.22rem; }
p { margin: 0 0 1.1em; }

.cl-btn, .wp-block-button__link {
  display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:11px 22px;
  border:2px solid var(--cl-burgundy); border-radius:8px; background:var(--cl-burgundy); color:#fff !important;
  font-weight:750; text-decoration:none; transition:.18s ease;
}
.cl-btn:hover,.cl-btn:focus,.wp-block-button__link:hover,.wp-block-button__link:focus { background:var(--cl-burgundy-dark); border-color:var(--cl-burgundy-dark); transform:translateY(-1px); }
.cl-btn--ghost { background:transparent; color:var(--cl-burgundy) !important; }
.cl-btn--ghost:hover,.cl-btn--ghost:focus { color:#fff !important; }
.cl-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }

/* Header */
.cl-site-header { position:sticky; top:0; z-index:1000; background:rgba(255,255,255,.98); border-bottom:1px solid var(--cl-border); backdrop-filter: blur(10px); }
.admin-bar .cl-site-header { top:32px; }
.cl-header-inner { min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:26px; }
.cl-brand { display:flex; align-items:center; min-width:176px; }
.cl-brand img { width:auto; height:58px; display:block; }
.cl-nav { margin-left:auto; align-self:stretch; display:flex; align-items:stretch; }
.cl-menu, .cl-menu ul { list-style:none; margin:0; padding:0; }
.cl-menu { display:flex; align-items:stretch; gap:24px; }
.cl-menu > li { position:relative; display:flex; align-items:stretch; }
.cl-menu > li > a { display:flex; align-items:center; min-height:82px; }
.cl-menu a { color:var(--cl-ink); font-weight:650; text-decoration:none; font-size:.96rem; }
.cl-menu a:hover,.cl-menu a:focus,.cl-menu .current-menu-item>a,.cl-menu .current_page_item>a,.cl-menu .current-menu-ancestor>a { color:var(--cl-burgundy); }
.cl-menu li { position:relative; }
.cl-menu .menu-item-has-children > a:after { content:""; width:7px; height:7px; margin-left:8px; border-right:1.7px solid currentColor; border-bottom:1.7px solid currentColor; transform:rotate(45deg) translateY(-2px); }
.cl-menu .sub-menu { position:absolute; top:100%; left:-16px; z-index:1010; min-width:240px; padding:8px; background:#fff; border:1px solid var(--cl-border); border-radius:0 0 10px 10px; box-shadow:0 14px 28px rgba(23,23,23,.10); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-3px); transition:opacity .14s ease, transform .14s ease, visibility .14s; }
.cl-menu li:hover>.sub-menu,.cl-menu li:focus-within>.sub-menu { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); }
.cl-menu .sub-menu li { display:block; }
.cl-menu .sub-menu a { display:block; padding:10px 11px; border-radius:6px; line-height:1.35; white-space:normal; }
.cl-menu .sub-menu a:hover,.cl-menu .sub-menu a:focus { background:var(--cl-soft); }
.cl-menu-toggle { display:none; width:46px; height:46px; border:1px solid var(--cl-border); border-radius:8px; background:#fff; color:var(--cl-ink); }
.cl-menu-toggle span,.cl-menu-toggle:before,.cl-menu-toggle:after { content:""; display:block; width:22px; height:2px; margin:5px auto; background:currentColor; }

/* Hero */
.cl-hero { position:relative; overflow:hidden; padding:78px 0 74px; background:linear-gradient(115deg,#fff 0%,#fff 58%,#f7f0f0 100%); border-bottom:1px solid var(--cl-border); }
.cl-hero:after { content:""; position:absolute; width:520px; height:520px; border:88px solid rgba(109,0,0,.06); border-radius:50%; right:-210px; top:-145px; }
.cl-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.32fr) minmax(250px,.68fr); align-items:center; gap:48px; }
.cl-hero h1 { max-width:820px; margin-bottom:22px; text-wrap:balance; }
.cl-hero .cl-lead { font-size:1.23rem; max-width:760px; color:#444; }
.cl-hero-mark { padding:28px; border-radius:18px; background:rgba(255,255,255,.9); border:1px solid var(--cl-border); box-shadow:0 10px 26px rgba(23,23,23,.055); }
.cl-hero-mark img { display:block; margin:auto; max-width:225px; }

/* Stats */
.cl-stats { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--cl-border); border-radius:var(--cl-radius); overflow:hidden; background:#fff; }
.cl-stat { padding:32px; text-align:center; }
.cl-stat + .cl-stat { border-left:1px solid var(--cl-border); }
.cl-stat strong { display:block; color:var(--cl-burgundy); font-size:clamp(2.2rem,5vw,3.4rem); line-height:1; margin-bottom:8px; }
.cl-stat span { color:var(--cl-ink); font-weight:650; }

.cl-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.cl-feature { padding:28px; border:1px solid var(--cl-border); border-top:4px solid var(--cl-burgundy); border-radius:var(--cl-radius); background:#fff; }
.cl-feature p { margin-bottom:0; }

/* Cards */
.cl-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.cl-card { display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid var(--cl-border); border-radius:var(--cl-radius); overflow:hidden; transition:.18s ease; }
.cl-card:hover,.cl-card:focus-within { transform:translateY(-3px); box-shadow:var(--cl-shadow); }
.cl-card-media { aspect-ratio:16/9; overflow:hidden; background:linear-gradient(135deg,#f4eaea,#fff); }
.cl-card-media img { width:100%; height:100%; object-fit:cover; display:block; }
.cl-card-placeholder { height:100%; display:flex; align-items:center; justify-content:center; color:var(--cl-burgundy); font-size:2.3rem; font-weight:900; }
.cl-card-body { display:flex; flex-direction:column; flex:1; padding:23px; }
.cl-card-meta { display:flex; flex-wrap:wrap; gap:8px 14px; margin-bottom:10px; color:var(--cl-muted); font-size:.84rem; }
.cl-card-cat { color:var(--cl-burgundy); font-weight:750; }
.cl-card h3 { margin-bottom:10px; }
.cl-card h3 a { color:var(--cl-ink); text-decoration:none; }
.cl-card h3 a:hover,.cl-card h3 a:focus { color:var(--cl-burgundy); }
.cl-card-excerpt { margin-bottom:20px; color:#5b5b5b; }
.cl-card-more { margin-top:auto; font-weight:750; }

/* Colleges */
.cl-college-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.cl-college { min-height:128px; padding:22px; display:flex; align-items:center; gap:16px; border:1px solid var(--cl-border); border-radius:10px; background:#fff; }
.cl-college:before { content:""; flex:0 0 5px; align-self:stretch; border-radius:5px; background:var(--cl-burgundy); }
.cl-college-logo { width:62px; height:62px; object-fit:contain; }
.cl-college-name { color:var(--cl-ink); font-weight:700; line-height:1.3; }

/* Page */
.cl-page-hero { padding:58px 0 38px; background:var(--cl-soft); border-bottom:1px solid var(--cl-border); }
.cl-page-hero h1 { font-size:clamp(2rem,4vw,3.5rem); margin-bottom:8px; }
.cl-content { padding:58px 0 76px; }
.cl-content h2 { margin-top:2em; }
.cl-content h3 { margin-top:1.7em; }
.cl-content ul,.cl-content ol { padding-left:1.35em; }
.cl-content .wp-block-image { margin:2rem 0; }
.cl-content .wp-block-image img { border-radius:var(--cl-radius); }
.cl-intro { font-size:1.17rem; color:#444; }
.cl-values { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin:32px 0; }
.cl-value { padding:26px; background:var(--cl-soft); border-radius:var(--cl-radius); }
.cl-value h3 { margin-top:0; }

/* Board */
.cl-board-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:28px 0; }
.cl-board-card { padding:24px; border:1px solid var(--cl-border); border-radius:10px; }
.cl-board-role { color:var(--cl-burgundy); font-weight:800; font-size:.83rem; text-transform:uppercase; letter-spacing:.05em; }
.cl-board-name { color:var(--cl-ink); font-weight:800; font-size:1.12rem; margin:5px 0; }
.cl-board-college { color:var(--cl-muted); }

/* Archive */
.cl-archive-head { padding:54px 0 30px; }
.cl-filter-list { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 32px; padding:0; list-style:none; }
.cl-filter-list a { display:inline-block; padding:8px 13px; border:1px solid var(--cl-border); border-radius:999px; color:var(--cl-ink); text-decoration:none; font-weight:650; font-size:.9rem; }
.cl-filter-list a:hover,.cl-filter-list a:focus { border-color:var(--cl-burgundy); color:var(--cl-burgundy); }
.navigation.pagination { margin-top:38px; }
.nav-links { display:flex; flex-wrap:wrap; gap:8px; }
.page-numbers { padding:8px 12px; border:1px solid var(--cl-border); border-radius:6px; text-decoration:none; }
.page-numbers.current { background:var(--cl-burgundy); color:#fff; border-color:var(--cl-burgundy); }

/* Single */
.cl-single-meta { color:var(--cl-muted); margin:10px 0 26px; }
.cl-single-featured { margin:0 0 34px; }
.cl-single-featured img { width:100%; max-height:620px; object-fit:cover; border-radius:var(--cl-radius); }
.cl-single .cl-content { padding-top:40px; }

/* CTA */
.cl-cta { background:var(--cl-burgundy); color:#fff; padding:48px; border-radius:18px; display:flex; justify-content:space-between; align-items:center; gap:34px; }
.cl-cta h2 { color:#fff; margin-bottom:8px; }
.cl-cta p { margin-bottom:0; color:rgba(255,255,255,.86); max-width:720px; }
.cl-cta .cl-btn { background:#fff; color:var(--cl-burgundy)!important; border-color:#fff; white-space:nowrap; }

/* Footer */
.cl-site-footer { background:#171717; color:#cfcfcf; padding:54px 0 28px; }
.cl-footer-grid { display:grid; grid-template-columns:1.2fr .8fr .8fr; gap:44px; }
.cl-site-footer h2,.cl-site-footer h3 { color:#fff; font-size:1rem; }
.cl-site-footer a { color:#fff; }
.cl-footer-logo { width:210px; background:#fff; padding:12px; border-radius:8px; margin-bottom:16px; }
.cl-footer-links { list-style:none; margin:0; padding:0; }
.cl-footer-links li { margin:7px 0; }
.cl-footer-bottom { margin-top:38px; padding-top:22px; border-top:1px solid #333; display:flex; justify-content:space-between; gap:20px; font-size:.85rem; }

/* Consent */
.cl-consent { position:fixed; inset:auto 16px 16px 16px; z-index:99999; display:none; }
.cl-consent.is-visible { display:block; }
.cl-consent-inner { width:min(100%,760px); margin:auto; padding:17px 18px; background:#fff; border:1px solid var(--cl-border); border-radius:12px; box-shadow:0 12px 40px rgba(0,0,0,.18); }
.cl-consent-inner p { margin:0 0 11px; font-size:.9rem; line-height:1.5; }
.cl-consent-actions { display:flex; flex-wrap:wrap; gap:10px; }
.cl-consent-actions button { min-height:42px; padding:8px 15px; border-radius:7px; font-weight:750; cursor:pointer; }
.cl-consent-accept { background:var(--cl-burgundy); color:#fff; border:1px solid var(--cl-burgundy); }
.cl-consent-reject { background:#fff; color:var(--cl-ink); border:1px solid #777; }


/* Estados de foco y consistencia interactiva */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline:3px solid rgba(109,0,0,.28); outline-offset:3px; }
.cl-btn:focus-visible, .cl-consent-actions button:focus-visible { outline-color:rgba(109,0,0,.38); }

@media (max-width: 1180px) and (min-width: 981px) {
  .cl-menu { gap:18px; }
  .cl-menu a { font-size:.91rem; }
  .cl-brand { min-width:150px; }
}

@media (max-width: 980px) {
  .cl-menu-toggle { display:block; }
  .cl-nav { display:none; position:absolute; top:82px; left:0; right:0; background:#fff; border-bottom:1px solid var(--cl-border); padding:14px 20px 22px; }
  .cl-nav.is-open { display:block; }
  .cl-menu { display:block; }
  .cl-menu>li { display:block; border-bottom:1px solid var(--cl-border); }
  .cl-menu>li>a,.cl-menu a { display:block; min-height:0; padding:13px 4px; }
  .cl-menu .menu-item-has-children > a:after { display:none; }
  .cl-menu .sub-menu { display:block; position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none; box-shadow:none; border:0; border-radius:0; padding:0 0 8px 18px; min-width:0; }
  .cl-menu .sub-menu a { padding:8px 4px; color:var(--cl-text); }
  .cl-hero-grid { grid-template-columns:1fr; gap:34px; }
  .cl-hero-mark { max-width:430px; }
  .cl-grid-4 { grid-template-columns:repeat(2,1fr); }
  .cl-card-grid,.cl-college-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cl-footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 640px) {
  body { font-size:16px; }
  .cl-container,.cl-narrow { width:min(calc(100% - 28px), var(--cl-max)); }
  .cl-section { padding:52px 0; }
  .cl-header-inner { min-height:72px; }
  .cl-brand img { height:48px; }
  .admin-bar .cl-site-header { top:46px; }
  .cl-nav { top:72px; }
  .cl-hero { padding:56px 0 52px; }
  .cl-hero-mark { padding:22px; max-width:320px; }
  .cl-stats { grid-template-columns:1fr; }
  .cl-stat + .cl-stat { border-left:0; border-top:1px solid var(--cl-border); }
  .cl-grid-4,.cl-card-grid,.cl-college-grid,.cl-values,.cl-board-grid,.cl-footer-grid { grid-template-columns:1fr; }
  .cl-section-head { display:block; }
  .cl-section-head .cl-btn { margin-top:12px; }
  .cl-cta { padding:32px 24px; display:block; }
  .cl-cta .cl-btn { margin-top:20px; }
  .cl-footer-bottom { display:block; }
}