/* Red de Turismo Comunitario — estilos del tema La paleta, la tipografía y los espaciados viven en theme.json. Aquí solo van los componentes que los bloques no resuelven solos. */ :root{ --rtc-sombra:0 1px 2px rgba(28,22,19,.06),0 10px 30px -12px rgba(28,22,19,.18); --rtc-radio:14px; /* Borde de controles interactivos. 4.00:1 sobre tarjeta, 3.64:1 sobre papel y 3.31:1 sobre papel-2: cumple el 3:1 que WCAG 2.2 §1.4.11 pide para el contorno de un control. El token «linea» (1.41:1) sólo sirve para bordes decorativos de tarjeta, que no son controles. */ --rtc-borde-control:#8f7b60; } html{scroll-behavior:smooth} @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important} } body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility} img{max-width:100%;height:auto} /* Foco visible en todo elemento interactivo: requisito de accesibilidad */ /* Foco: contorno grana (9.2:1 sobre papel) con halo oro. Cumple WCAG 2.2 · 1.4.11; el oro solo no llegaba a 3:1. */ a:focus-visible,button:focus-visible,summary:focus-visible, input:focus-visible,textarea:focus-visible,select:focus-visible{ outline:3px solid var(--wp--preset--color--grana); outline-offset:2px;border-radius:4px; box-shadow:0 0 0 6px color-mix(in srgb,var(--wp--preset--color--oro) 55%,transparent); } /* Sobre fondos oscuros el contraste se invierte: ahí manda el oro */ .rtc-oscuro a:focus-visible,.rtc-pie a:focus-visible,.rtc-portada a:focus-visible, .rtc-oscuro button:focus-visible,.rtc-pie button:focus-visible,.rtc-portada button:focus-visible{ outline-color:var(--wp--preset--color--oro); box-shadow:0 0 0 6px rgba(255,255,255,.35); } /* Saltar al contenido */ .rtc-saltar{ position:absolute;left:-999px;top:0;z-index:200; background:var(--wp--preset--color--grana);color:#fff; padding:10px 16px;border-radius:0 0 8px 0;text-decoration:none; } /* Respaldo para navegadores sin :focus-visible (Safari anterior a 15.4). El contorno se quitó de theme.json porque WordPress sólo admite «:focus» ahí, y eso dibujaba el anillo también al tocar con el dedo. */ @supports not selector(:focus-visible){ a:focus,button:focus,summary:focus, input:focus,textarea:focus,select:focus{ outline:3px solid var(--wp--preset--color--grana); outline-offset:2px;border-radius:4px; } } .rtc-saltar:focus{left:0} /* Antetítulo */ .rtc-antetitulo{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.78rem;letter-spacing:.18em;text-transform:uppercase; color:var(--wp--preset--color--grana);font-weight:600;margin:0 0 .4rem; } .rtc-oscuro .rtc-antetitulo{color:var(--wp--preset--color--oro)} /* Encabezado fijo */ .rtc-encabezado{ position:sticky;top:0;z-index:100; background:color-mix(in srgb,var(--wp--preset--color--papel) 88%,transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--wp--preset--color--linea); } @supports not (backdrop-filter:blur(10px)){.rtc-encabezado{background:var(--wp--preset--color--papel)}} /* Con el menú desplegable abierto hay que quitar el desenfoque. Un backdrop-filter distinto de «none» convierte al encabezado en bloque contenedor de sus descendientes position:fixed, así que el inset:0 del menú se resolvía contra una franja de 46px en vez de contra la pantalla: el menú abría recortado y solo se veía el primer enlace. WordPress marca con has-modal-open mientras el menú está abierto. */ html.has-modal-open .rtc-encabezado{ backdrop-filter:none; background:var(--wp--preset--color--papel); } /* Presentación del menú desplegable en teléfono. Sin esto hereda la alineación a la derecha del menú de escritorio y el submenú se ve igual que el primer nivel, sin jerarquía legible. */ .rtc-encabezado .wp-block-navigation__responsive-container.is-menu-open{ padding:1.2rem 1.4rem 2rem; } .rtc-encabezado .is-menu-open .wp-block-navigation__responsive-container-content{ width:100%; } /* Los dos !important de aquí abajo no son negligencia: el bloque de navegación lleva la clase «items-justified-right», que WordPress necesita para alinear el menú a la derecha en escritorio y que emite con una especificidad que gana a cualquier selector nuestro razonable. En el desplegable de teléfono esa alineación deja los enlaces pegados al borde derecho y con 22.4px de separación entre ellos, que es justo lo que se veía mal. Sólo se anula dentro de .is-menu-open, así que el escritorio conserva su alineación. */ .rtc-encabezado .is-menu-open .wp-block-navigation__container{ align-items:flex-start !important; gap:0 !important; width:100%; padding-top:.6rem; } /* Dentro del desplegable cada
  • es un flex en columna, así que «align-items» controla el eje horizontal. El valor heredado del menú de escritorio es flex-end y pegaba el submenú al borde derecho, con la línea guía dorada a media pantalla. Con stretch, enlace y submenú arrancan en el mismo margen izquierdo que el resto. */ .rtc-encabezado .is-menu-open .wp-block-navigation-item{ width:100%; align-items:stretch !important; border-bottom:1px solid var(--wp--preset--color--linea); } .rtc-encabezado .is-menu-open .wp-block-navigation-item:last-child{border-bottom:0} /* El selector lleva .wp-block-navigation-item de más a propósito: con menos clases empata en especificidad con la regla general del encabezado, que está más abajo en el archivo y ganaba con su padding de 9px. */ .rtc-encabezado .is-menu-open .wp-block-navigation-item > .wp-block-navigation-item__content{ display:block; width:100%; box-sizing:border-box; /* sin esto el relleno lateral se sumaba al 100% y el enlace sobresalía 6px */ padding:.85rem .2rem; font-size:1.08rem; } /* El submenú se distingue con sangría y una línea guía, no con tamaño. */ /* Mismo caso: el estilo base del bloque fija el relleno y quita el borde del submenú con más especificidad, de modo que la línea guía dorada nunca llegaba a dibujarse. */ .rtc-encabezado .is-menu-open .wp-block-navigation__submenu-container{ width:auto !important; /* el bloque impone min-width:200px y un ancho propio */ min-width:0 !important; box-sizing:border-box; padding-left:1rem !important; margin-left:.2rem !important; border-left:2px solid var(--wp--preset--color--oro) !important; gap:0 !important; } .rtc-encabezado .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item{ border-bottom:0; } .rtc-encabezado .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{ font-size:.98rem; padding:.62rem .2rem; color:var(--wp--preset--color--tinta-suave); } .rtc-encabezado .is-menu-open .wp-block-navigation-item > .wp-block-navigation-submenu__toggle{ padding:.85rem .2rem; font-size:1.08rem; } .rtc-encabezado .wp-block-site-title a{ font-family:var(--wp--preset--font-family--titulos); font-weight:800;letter-spacing:-.02em;text-decoration:none; color:var(--wp--preset--color--tinta);font-size:1rem;line-height:1.05; } .rtc-encabezado .wp-block-navigation a, .rtc-encabezado .wp-block-navigation .wp-block-navigation-item__content{ font-family:var(--wp--preset--font-family--titulos); font-weight:600;font-size:.9rem;text-decoration:none; padding:9px 10px;border-radius:8px;color:var(--wp--preset--color--tinta); } /* Navegación: el menú completo solo donde cabe. Con siete entradas de primer nivel, el punto de quiebre de 600px que trae WordPress deja el menú apretado y desbordado entre 600 y 1050px. Aquí el menú desplegable manda hasta 1024px y arriba de eso el menú va en una sola fila. */ @media (min-width:1025px){ .rtc-encabezado .wp-block-navigation__container{flex-wrap:nowrap} .rtc-encabezado .wp-block-navigation a, .rtc-encabezado .wp-block-navigation .wp-block-navigation-item__content{ white-space:nowrap; } /* El submenú sí se apila: la regla anterior es solo para el primer nivel. */ .rtc-encabezado .wp-block-navigation__submenu-container{flex-wrap:wrap} } @media (max-width:1024px){ .rtc-encabezado .wp-block-navigation__responsive-container-open:not(.always-shown){ display:flex; /* 44x44: el mínimo cómodo para un control táctil principal. El icono de WordPress mide 24x24 por sí solo. */ width:44px;height:44px;align-items:center;justify-content:center; border-radius:8px; } .rtc-encabezado .wp-block-navigation__responsive-container-close{ width:44px;height:44px;display:flex;align-items:center;justify-content:center; } .rtc-encabezado .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){ display:none; } } .rtc-encabezado .wp-block-navigation a:hover{ background:var(--wp--preset--color--papel-2);color:var(--wp--preset--color--grana); } .rtc-encabezado .wp-block-site-logo img{border-radius:9px} /* Portada: bloque de apertura */ .rtc-portada{position:relative;overflow:hidden;isolation:isolate} .rtc-portada::after{ content:"";position:absolute;inset:0;z-index:-1;pointer-events:none; background:linear-gradient(180deg,rgba(28,22,19,.32),rgba(94,22,34,.80)); } .rtc-portada .wp-block-cover__image-background{z-index:-2} .rtc-portada h1,.rtc-portada h2{color:#fff;text-wrap:balance;max-width:16ch} .rtc-portada p{color:#f3e7e0} .rtc-cifras{ display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:22px; margin-top:2.4rem;padding-top:1.4rem; border-top:1px solid rgba(255,255,255,.22); } @media (max-width:460px){.rtc-cifras{grid-template-columns:repeat(2,minmax(0,1fr))}} .rtc-cifra span{display:block;text-wrap:balance} .rtc-cifra b{ font-family:var(--wp--preset--font-family--titulos);font-weight:800; font-size:2rem;display:block;line-height:1;color:#fff; } .rtc-cifra span{ font-family:var(--wp--preset--font-family--etiqueta);font-size:.72rem; letter-spacing:.1em;text-transform:uppercase;color:#e7cdd0; } /* Franja oscura de territorio */ .rtc-oscuro{background:var(--wp--preset--color--tinta);color:var(--wp--preset--color--papel)} .rtc-oscuro h2,.rtc-oscuro h3{color:#fff} .rtc-oscuro p{color:#cdbdb0} .rtc-region{ background:linear-gradient(160deg,#2a201c,#1c1613); border:1px solid #38291f;border-radius:var(--rtc-radio); padding:26px 24px;height:100%; } .rtc-region h3 span{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.75rem;color:var(--wp--preset--color--oro);letter-spacing:.1em; } /* Expedientes por comunidad */ .rtc-expedientes .wp-block-post{ background:var(--wp--preset--color--tarjeta); border:1px solid var(--wp--preset--color--linea); border-radius:var(--rtc-radio);overflow:hidden; box-shadow:var(--rtc-sombra);display:flex;flex-direction:column; } .rtc-expedientes .wp-block-post-featured-image{margin:0} .rtc-expedientes .wp-block-post-featured-image img{aspect-ratio:16/9;object-fit:cover;width:100%} .rtc-expedientes .wp-block-post-title{font-size:1.4rem;margin:0} .rtc-expedientes .wp-block-post-title a{text-decoration:none;color:var(--wp--preset--color--tinta)} .rtc-expedientes .wp-block-post-title a:hover{color:var(--wp--preset--color--grana)} .rtc-expedientes .wp-block-post-excerpt{color:var(--wp--preset--color--tinta-suave);font-size:1rem} .rtc-expedientes .wp-block-post-terms{ font-family:var(--wp--preset--font-family--etiqueta);font-size:.72rem; letter-spacing:.05em;color:var(--wp--preset--color--grana); } /* Ficha técnica desplegable */ .rtc-ficha{border-top:1px solid var(--wp--preset--color--linea);margin-top:1rem} .rtc-ficha summary{ cursor:pointer;list-style:none;padding:14px 0 4px; font-family:var(--wp--preset--font-family--titulos); font-weight:600;font-size:.88rem;color:var(--wp--preset--color--grana); } .rtc-ficha summary::-webkit-details-marker{display:none} .rtc-ficha summary::before{content:"› ";display:inline-block;transition:transform .2s} .rtc-ficha[open] summary::before{transform:rotate(90deg)} .rtc-ficha dl{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.8rem;line-height:1.5;margin:0;padding:6px 0 18px; } .rtc-ficha dl>div{ display:grid;grid-template-columns:minmax(90px,120px) 1fr;gap:8px; padding:6px 0;border-bottom:1px dashed var(--wp--preset--color--linea); } .rtc-ficha dt{ color:var(--wp--preset--color--tinta-suave);text-transform:uppercase; font-size:.68rem;letter-spacing:.06em; } .rtc-ficha dd{margin:0;color:var(--wp--preset--color--tinta)} /* Bitácora: línea de tiempo */ .rtc-bitacora{background:var(--wp--preset--color--papel-2)} .rtc-linea{border-left:2px solid var(--wp--preset--color--grana);margin-left:8px;padding-left:0} .rtc-linea .wp-block-post{position:relative;padding:18px 0 22px 28px;list-style:none} .rtc-linea .wp-block-post::before{ content:"";position:absolute;left:-8px;top:24px;width:13px;height:13px; border-radius:50%;background:var(--wp--preset--color--grana); border:3px solid var(--wp--preset--color--papel-2); } .rtc-linea .wp-block-post-date{ font-family:var(--wp--preset--font-family--etiqueta);font-size:.75rem; letter-spacing:.06em;color:var(--wp--preset--color--grana);text-transform:uppercase; } .rtc-linea .wp-block-post-title{font-size:1.25rem;margin:.4rem 0 0} .rtc-linea .wp-block-post-title a{text-decoration:none;color:var(--wp--preset--color--tinta)} .rtc-linea .wp-block-post-title a:hover{color:var(--wp--preset--color--grana)} .rtc-linea .wp-block-post-excerpt{color:var(--wp--preset--color--tinta-suave);font-size:1rem;max-width:70ch} /* La imagen destacada solo existe si la nota la tiene; cuando falta, el bloque no imprime nada y la entrada conserva su maqueta de texto. */ .rtc-linea .wp-block-post-featured-image{margin:0 0 .7rem;max-width:420px} .rtc-linea .wp-block-post-featured-image img{display:block;width:100%;height:auto;border-radius:10px} /* Directorio */ .rtc-persona{ display:flex;gap:16px;align-items:flex-start; background:var(--wp--preset--color--tarjeta); border:1px solid var(--wp--preset--color--linea); border-radius:var(--rtc-radio);padding:18px;height:100%; } .rtc-avatar{ width:54px;height:54px;border-radius:50%;flex:none; background:var(--wp--preset--color--grana);color:#fff; font-family:var(--wp--preset--font-family--titulos);font-weight:800;font-size:1.2rem; display:grid;place-items:center; } .rtc-persona h3{font-size:1.06rem;margin:0} .rtc-persona .rtc-cargo{font-size:.9rem;color:var(--wp--preset--color--tinta-suave);margin:3px 0 0} /* Solo el correo va en monoespaciada. El nombre es un enlace y debe conservar la tipografía de títulos: antes heredaba esta regla y se veía como código. */ .rtc-persona .rtc-correo a, .rtc-persona > div > a{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.78rem;word-break:break-word; /* Relleno vertical para que el enlace del correo llegue a 24px de alto, el mínimo de WCAG 2.2 · 2.5.8. Antes medía 16px. */ display:inline-block;padding:4px 0;min-height:24px; } /* Rejilla del directorio */ .rtc-rejilla-personas{ display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:16px;margin-block:0 var(--wp--preset--spacing--40); } /* Tarjetas genéricas */ .rtc-tarjeta{ background:var(--wp--preset--color--tarjeta); border:1px solid var(--wp--preset--color--linea); border-radius:var(--rtc-radio);padding:30px;height:100%; } /* Aviso editorial: visible solo para quien administra */ .rtc-aviso{ margin-top:var(--wp--preset--spacing--40); background:#fff8ec;border:1px solid var(--wp--preset--color--oro);border-left-width:5px; border-radius:10px;padding:14px 18px;font-size:.9rem;color:#6b4e1e; } /* Pie de página */ .rtc-pie{background:var(--wp--preset--color--tinta);color:#e9ded2} .rtc-pie h2,.rtc-pie h3,.rtc-pie h4{color:#fff;font-size:1.05rem} .rtc-pie a{color:#e9ded2;text-decoration:none} .rtc-pie a:hover{color:var(--wp--preset--color--oro);text-decoration:underline} .rtc-pie p{color:#b9ab9d;font-size:.95rem} .rtc-legal{ border-top:1px solid #34261d;margin-top:2rem;padding-top:1.2rem; font-family:var(--wp--preset--font-family--etiqueta);font-size:.72rem;color:#9c8e80; } /* Mapa incrustado */ .rtc-mapa{ border-radius:var(--rtc-radio);overflow:hidden; border:1px solid var(--wp--preset--color--linea);background:#ded3c4; } .rtc-mapa iframe{width:100%;min-height:340px;border:0;display:block} /* Formulario de contacto nativo */ .rtc-formulario label{ display:block;font-family:var(--wp--preset--font-family--titulos); font-weight:600;font-size:.9rem;margin:1rem 0 .3rem; } .rtc-formulario input,.rtc-formulario textarea{ width:100%;padding:12px 14px;font:inherit;font-size:1rem; background:#fff;border:1px solid var(--wp--preset--color--linea);border-radius:10px; } .rtc-formulario textarea{min-height:140px;resize:vertical} /* Los encabezados de sección alinean con el contenido ancho */ .rtc-encabezado-seccion{max-width:var(--wp--style--global--wide-size);margin-inline:auto} @media (max-width:781px){ .rtc-cifras{gap:20px} .rtc-cifra b{font-size:1.6rem} } /* ---- Regiones navegables ---- */ .rtc-regiones{ display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:16px;margin-top:var(--wp--preset--spacing--40); } .rtc-regiones .rtc-region{ display:flex;flex-direction:column;text-decoration:none;color:inherit; transition:border-color .18s ease, transform .18s ease; } .rtc-regiones .rtc-region:hover{border-color:var(--wp--preset--color--oro);transform:translateY(-2px)} .rtc-region-cuenta{ display:inline-block;margin-top:auto;padding-top:14px; align-self:flex-start; font-family:var(--wp--preset--font-family--etiqueta); font-size:.72rem;letter-spacing:.1em;text-transform:uppercase; color:var(--wp--preset--color--oro); } .rtc-region-cuenta::before{content:"";} .rtc-regiones .rtc-region-cuenta{ border:1px solid #4a3728;border-radius:20px;padding:4px 11px;margin-top:auto; } /* ---- Expediente sin fotografía: marcador digno, no un hueco ---- */ .rtc-expedientes .wp-block-post:not(:has(.wp-block-post-featured-image)) .wp-block-group::before, .rtc-sin-imagen{ content:"";display:block;height:180px;margin:-22px -22px 18px; background: repeating-linear-gradient(135deg,transparent,transparent 12px,rgba(122,30,43,.055) 12px,rgba(122,30,43,.055) 24px), var(--wp--preset--color--papel-2); border-bottom:1px solid var(--wp--preset--color--linea); } /* ---- Notas de campo relacionadas ---- */ .rtc-relacionadas{ margin-top:var(--wp--preset--spacing--60); padding-top:var(--wp--preset--spacing--40); border-top:1px solid var(--wp--preset--color--linea); } .rtc-relacionadas h2{font-size:1.2rem;margin-bottom:.8rem} .rtc-relacionadas ul{list-style:none;padding:0;margin:0} .rtc-relacionadas li{ display:flex;justify-content:space-between;gap:16px;align-items:baseline; padding:10px 0;border-bottom:1px dashed var(--wp--preset--color--linea); } .rtc-relacionadas a{text-decoration:none;font-family:var(--wp--preset--font-family--titulos);font-weight:600} .rtc-relacionadas a:hover{text-decoration:underline} .rtc-relacionadas time{ font-family:var(--wp--preset--font-family--etiqueta);font-size:.72rem; color:var(--wp--preset--color--tinta-suave);white-space:nowrap; } /* ---- Etiqueta de región sobre la fotografía del expediente ---- */ .rtc-expedientes .wp-block-post{position:relative} .rtc-expedientes .wp-block-post-terms{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.68rem;letter-spacing:.08em;text-transform:uppercase; margin-bottom:.5rem; } .rtc-expedientes .wp-block-post-terms a{ text-decoration:none;background:var(--wp--preset--color--papel-2); border:1px solid var(--wp--preset--color--linea);border-radius:20px; padding:3px 10px;display:inline-block; } /* ---- Refuerzo de contraste en la portada sobre fotografías claras ---- */ .rtc-portada::after{ background: linear-gradient(180deg,rgba(28,22,19,.42) 0%,rgba(28,22,19,.26) 35%,rgba(94,22,34,.86) 100%); } /* Buscador */ .wp-block-search__inside-wrapper{ border:1px solid var(--rtc-borde-control); background:var(--wp--preset--color--tarjeta); border-radius:6px;padding:2px;max-width:34rem; } .wp-block-search__input{ border:0;background:transparent;padding:.7rem .9rem; font-family:var(--wp--preset--font-family--cuerpo); color:var(--wp--preset--color--tinta); } .wp-block-search__input:focus{outline:0} .wp-block-search__inside-wrapper:focus-within{ outline:3px solid var(--wp--preset--color--grana);outline-offset:2px; } .wp-block-search__button{ background:var(--wp--preset--color--grana);color:var(--wp--preset--color--papel); border:0;border-radius:4px;padding:.6rem 1.1rem;cursor:pointer; font-family:var(--wp--preset--font-family--etiqueta); font-size:.78rem;letter-spacing:.1em;text-transform:uppercase; } .wp-block-search__button:hover{background:var(--wp--preset--color--grana-oscuro)} /* ---------- Filtros del directorio y de la biblioteca ---------- */ .rtc-filtros{ display:flex;flex-wrap:wrap;gap:1.4rem 2rem;align-items:flex-start; border:1px solid var(--wp--preset--color--linea); background:var(--wp--preset--color--papel-2); border-radius:8px;padding:1.2rem 1.3rem;margin:0 0 1.2rem; } .rtc-filtro-busqueda{display:flex;flex-direction:column;gap:.35rem;flex:1 1 17rem} .rtc-filtro-busqueda label,.rtc-grupo-filtro legend{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.72rem;letter-spacing:.14em;text-transform:uppercase; color:var(--wp--preset--color--tinta-suave);font-weight:600;padding:0; } .rtc-filtro-busqueda input[type="search"]{ border:1px solid var(--rtc-borde-control);border-radius:6px; background:var(--wp--preset--color--tarjeta); padding:.6rem .8rem;font-family:var(--wp--preset--font-family--cuerpo); font-size:1rem;color:var(--wp--preset--color--tinta);width:100%; } .rtc-grupo-filtro{border:0;padding:0;margin:0;flex:1 1 15rem;min-width:0} .rtc-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.5rem} .rtc-chip{position:relative;display:inline-flex} .rtc-chip input{ position:absolute;inset:0;width:100%;height:100%; margin:0;opacity:0;cursor:pointer; } .rtc-chip span{ display:inline-block;border:1px solid var(--rtc-borde-control); background:var(--wp--preset--color--tarjeta);border-radius:999px; padding:.4rem .85rem;font-size:.86rem;line-height:1.2; color:var(--wp--preset--color--tinta-suave); transition:background .12s,color .12s,border-color .12s; } .rtc-chip input:checked + span{ background:var(--wp--preset--color--grana); border-color:var(--wp--preset--color--grana); color:var(--wp--preset--color--papel);font-weight:600; } .rtc-chip input:focus-visible + span{ outline:3px solid var(--wp--preset--color--grana);outline-offset:2px; box-shadow:0 0 0 6px color-mix(in srgb,var(--wp--preset--color--oro) 55%,transparent); } .rtc-cuenta{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.8rem;letter-spacing:.06em;color:var(--wp--preset--color--tinta-suave); margin:0 0 .9rem; } .rtc-cuenta strong{color:var(--wp--preset--color--grana)} .rtc-vacio,.rtc-nota-biblioteca{ color:var(--wp--preset--color--tinta-suave);font-size:.92rem; border-left:3px solid var(--wp--preset--color--oro);padding-left:.9rem;margin:1rem 0 0; } /* ---------- Tarjetas del directorio de comunidades ---------- */ .rtc-exp-rejilla{ display:grid;gap:1.3rem; /* min(...,100%) evita que la columna mínima de 21rem (336px) desborde una pantalla de 320px: sin esto el contenido se cortaba. */ grid-template-columns:repeat(auto-fit,minmax(min(21rem,100%),1fr)); } .rtc-exp-tarjeta{ background:var(--wp--preset--color--tarjeta); border:1px solid var(--wp--preset--color--linea); border-radius:var(--rtc-radio);overflow:hidden; box-shadow:var(--rtc-sombra); display:flex;flex-direction:column; } .rtc-exp-tarjeta[hidden]{display:none} .rtc-exp-enlace{display:block;text-decoration:none;color:inherit} .rtc-exp-enlace img,.rtc-exp-tarjeta .rtc-sin-imagen{ /* height:auto anula el height:180px de la regla antigua del mismo nombre, para que manden el ancho y la proporción 16/9. */ display:block;width:100%;height:auto;aspect-ratio:16/9; object-fit:cover;margin:0; } .rtc-exp-tarjeta .rtc-sin-imagen{ background:repeating-linear-gradient(135deg, var(--wp--preset--color--papel-2) 0 14px, var(--wp--preset--color--papel) 14px 28px); border-bottom:1px solid var(--wp--preset--color--linea); } .rtc-exp-enlace h2{ margin:0;padding:1.05rem 1.2rem .1rem; font-size:1.26rem;line-height:1.25;color:var(--wp--preset--color--tinta); } .rtc-exp-enlace:hover h2,.rtc-exp-enlace:focus-visible h2{color:var(--wp--preset--color--grana)} .rtc-exp-tarjeta > p{margin:0;padding:.25rem 1.2rem} .rtc-exp-tarjeta > p:last-child{padding-bottom:1.2rem;margin-top:auto} .rtc-exp-region{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.72rem;letter-spacing:.12em;text-transform:uppercase; color:var(--wp--preset--color--grana);font-weight:600; } .rtc-exp-municipio,.rtc-exp-vocacion,.rtc-exp-estado{ font-size:.9rem;color:var(--wp--preset--color--tinta-suave); } .rtc-exp-vocacion .rtc-antetitulo{display:inline;margin:0 .35rem 0 0} .rtc-exp-estado{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.74rem;letter-spacing:.08em; color:var(--wp--preset--color--jade); } /* La etiqueta de región en la cronología es un enlace, no la tarjeta oscura */ .rtc-cron-region{margin:.1rem 0 0;font-size:.8rem} .rtc-cron-region a{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.72rem;letter-spacing:.1em;text-transform:uppercase; color:var(--wp--preset--color--grana);text-decoration:none; border-bottom:1px solid transparent; } .rtc-cron-region a:hover{border-bottom-color:var(--wp--preset--color--grana)} /* ---------- Cronología ---------- */ .rtc-cronologia-anio{margin:0 0 2.2rem} .rtc-cronologia-anio > h2{ font-family:var(--wp--preset--font-family--etiqueta); font-size:.86rem;letter-spacing:.2em;color:var(--wp--preset--color--grana); border-bottom:1px solid var(--wp--preset--color--linea); padding-bottom:.4rem;margin:0 0 1rem; } .rtc-cronologia-anio ol{list-style:none;margin:0;padding:0 0 0 1.4rem;border-left:2px solid var(--wp--preset--color--linea)} .rtc-cronologia-anio li{position:relative;margin:0 0 1.5rem} .rtc-cronologia-anio li::before{ content:"";position:absolute;left:-1.85rem;top:.45rem; width:.6rem;height:.6rem;border-radius:50%; background:var(--wp--preset--color--grana); box-shadow:0 0 0 3px var(--wp--preset--color--papel); } .rtc-cronologia-anio time{ display:block;font-family:var(--wp--preset--font-family--etiqueta); font-size:.74rem;letter-spacing:.1em;text-transform:uppercase; color:var(--wp--preset--color--tinta-suave); } .rtc-cronologia-anio h3{margin:.15rem 0 .25rem;font-size:1.06rem;line-height:1.3} /* Entradilla de una nota de bitácora: el párrafo que WordPress toma como resumen automático si no se escribe uno a mano. */ .rtc-entradilla{ font-size:1.14rem;line-height:1.6;color:var(--wp--preset--color--tinta); border-left:3px solid var(--wp--preset--color--oro);padding-left:1rem; } /* Nota con fotografía. El ancho de la miniatura es fijo y la proporción está declarada, para que el navegador reserve el hueco antes de descargarla y la lista no salte al cargar (desplazamiento acumulado de maqueta). */ .rtc-cron-nota{display:block} .rtc-cron-con-foto{display:grid;grid-template-columns:140px 1fr;gap:1rem;align-items:start} .rtc-cron-foto{display:block;border-radius:10px;overflow:hidden;background:var(--wp--preset--color--papel-2)} .rtc-cron-foto img{ display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover; transition:transform .35s ease; } .rtc-cron-foto:hover img{transform:scale(1.04)} @media (prefers-reduced-motion:reduce){ .rtc-cron-foto img{transition:none} .rtc-cron-foto:hover img{transform:none} } .rtc-cron-resumen{ margin:.35rem 0 0;font-size:.94rem;line-height:1.5; color:var(--wp--preset--color--tinta-suave);max-width:68ch; } /* Debajo de 560px la miniatura pasa arriba: a 140px de ancho en una pantalla de teléfono el texto se quedaría en dos palabras por renglón. */ @media (max-width:560px){ .rtc-cron-con-foto{grid-template-columns:1fr;gap:.6rem} .rtc-cron-foto{max-width:100%} } /* ---------- Biblioteca ---------- */ .rtc-documentos{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(min(20rem,100%),1fr))} .rtc-documento{ border:1px solid var(--wp--preset--color--linea);border-radius:8px; background:var(--wp--preset--color--tarjeta);padding:1.1rem 1.2rem; display:flex;flex-direction:column;gap:.4rem; } .rtc-documento h2{margin:0;font-size:1.06rem;line-height:1.3} .rtc-doc-autor{font-style:italic;color:var(--wp--preset--color--tinta-suave);margin:0;font-size:.92rem} .rtc-doc-accion{margin:auto 0 0} .rtc-documento-pendiente{background:var(--wp--preset--color--papel-2);border-style:dashed} .rtc-doc-aviso{font-size:.86rem;color:var(--wp--preset--color--tinta-suave);border-left:3px solid var(--wp--preset--color--oro);padding-left:.8rem} .rtc-boton{ display:inline-block;background:var(--wp--preset--color--grana); color:var(--wp--preset--color--papel);text-decoration:none; border-radius:5px;padding:.55rem 1rem; font-family:var(--wp--preset--font-family--etiqueta); font-size:.78rem;letter-spacing:.09em;text-transform:uppercase; } .rtc-boton:hover{background:var(--wp--preset--color--grana-oscuro)} .rtc-boton span{text-transform:none;letter-spacing:0;opacity:.85} /* ---------- Equipo ---------- */ .rtc-equipo-grupo{margin:0 0 2.4rem} .rtc-persona{ display:flex;gap:1rem;align-items:flex-start; border:1px solid var(--wp--preset--color--linea);border-radius:8px; background:var(--wp--preset--color--tarjeta);padding:1rem 1.1rem; height:100%; } .rtc-persona h3{margin:0 0 .15rem;font-size:1.02rem;line-height:1.3} .rtc-persona h3 a{ font-family:var(--wp--preset--font-family--titulos); font-size:inherit;font-weight:700;text-decoration:none; color:var(--wp--preset--color--tinta); /* Bloque con relleno vertical para que el objetivo llegue a 24px de alto, el mínimo de WCAG 2.2 · 2.5.8. Antes medía 19px. */ display:inline-block;padding:3px 0;min-height:24px; } .rtc-persona h3 a:hover, .rtc-persona h3 a:focus-visible{ color:var(--wp--preset--color--grana);text-decoration:underline; } .rtc-adscripcion{font-size:.88rem;color:var(--wp--preset--color--tinta-suave);margin:.1rem 0} .rtc-lineas{list-style:none;margin:.5rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem} .rtc-lineas li{ border:1px solid var(--wp--preset--color--linea);border-radius:999px; padding:.2rem .6rem;font-size:.78rem;color:var(--wp--preset--color--tinta-suave); } .rtc-correo{margin:.55rem 0 0;font-size:.88rem;word-break:break-word} .rtc-avatar-vacio{ display:block;width:64px;height:64px;border-radius:50%;flex:0 0 auto; background:var(--wp--preset--color--papel-2); border:1px solid var(--wp--preset--color--linea); } .rtc-fuente{ font-size:.84rem;color:var(--wp--preset--color--tinta-suave); border-top:1px solid var(--wp--preset--color--linea); padding-top:.7rem;margin:1.2rem 0 0; } @media (max-width:600px){ .rtc-filtros{padding:1rem} .rtc-persona{flex-direction:column} }