/* ========================================================== A TRAVÉS DE LAS ESCRITURAS CSS GENERAL LIMPIO ========================================================== */ /* ========================================================== 1. COLORES GENERALES ========================================================== */ :root { --ates-navy: #071f3d; --ates-navy-soft: #0a3150; --ates-gold: #b47720; --ates-gold-light: #d4a14c; --ates-gold-soft: #c58a32; --ates-parchment: rgba(246, 239, 224, .30); } /* ========================================================== 2. BOTÓN DE VÍDEO — EFECTO PULSE ========================================================== */ .ct-pulse { border-radius: 50%; animation: pulse 2s ease-out infinite; } @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .8); } 80% { box-shadow: 0 0 0 30px rgba(255, 255, 255, 0); } } /* ========================================================== 3. IMAGEN DE FONDO DE LA CABECERA ========================================================== */ #header > [data-device] { background-image: linear-gradient( rgba(255, 255, 255, .55), rgba(255, 255, 255, .75) ), url("https://atravesdelasescrituras.com/wp-content/uploads/2026/08/ChatGPT-Image-30-ago-2026-11_00_38.png"); background-position: center; background-size: cover; background-repeat: no-repeat; } #header [data-row] { background-color: transparent !important; background-image: none !important; } /* ========================================================== 4. METADATOS EN ESPAÑOL ========================================================== */ .entry-meta .meta-author > span:first-of-type, .entry-meta .meta-date > span:first-of-type, .entry-meta .meta-categories > span:first-of-type { font-size: 0 !important; } .entry-meta .meta-author > span:first-of-type::after { content: "POR "; font-size: 12px; } .entry-meta .meta-date > span:first-of-type::after { content: "EL "; font-size: 12px; } .entry-meta .meta-categories > span:first-of-type::after { content: "EN "; font-size: 12px; } /* ========================================================== 5. BARRA LATERAL ========================================================== */ .ct-sidebar, .ct-sidebar-inner, aside.ct-sidebar, [data-sidebar], [data-sidebar] .ct-sidebar, [data-sidebar] .ct-sidebar-inner, .ct-sidebar .ct-widget, .ct-sidebar .widget, .ct-sidebar section.widget, .ct-sidebar .widget_block, .ct-sidebar .wp-block-group, .ct-sidebar .wp-block-group__inner-container, .ct-sidebar .wp-block-widget-group { background: transparent !important; background-color: transparent !important; background-image: none !important; border: none !important; box-shadow: none !important; } [data-sidebar] { --theme-background-color: transparent !important; } /* Centrado general */ .ct-sidebar .ct-widget, .ct-sidebar .widget, .ct-sidebar .widget_block { text-align: center; } .ct-sidebar .widget-title { text-align: center; } .ct-sidebar img { display: block; margin-left: auto; margin-right: auto; } .ct-sidebar ul { padding-left: 0; margin-left: auto; margin-right: auto; } /* Widgets personalizados */ .ct-sidebar #vd365-widget, .ct-sidebar #parasha-widget, .ct-sidebar #moadim-widget, .ct-sidebar #calendario-widget, .ct-sidebar #gravatar-widget, .ct-sidebar #facebook-site-widget, .ct-sidebar #sitios-interes-widget, .ct-sidebar .youtube-widget, .ct-sidebar .ates-theme-box, .ct-sidebar .ate-buscador { display: block !important; width: 100% !important; max-width: 320px !important; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box !important; } /* Controles internos */ .ct-sidebar .ate-buscador input, .ct-sidebar .ate-buscador button, .ct-sidebar .ates-theme-box button { margin-left: 0 !important; margin-right: 0 !important; } /* Formularios */ .ct-sidebar input[type="text"], .ct-sidebar input[type="search"], .ct-sidebar input[type="email"], .ct-sidebar textarea, .ct-sidebar select { background-color: rgba(255, 255, 255, .90) !important; } /* Google Translate */ .ct-sidebar .goog-te-gadget, .ct-sidebar .goog-te-gadget-simple, .ct-sidebar .google-translate-element { background: transparent !important; background-color: transparent !important; } /* ========================================================== 6. MENÚ PRINCIPAL SOLO ESCRITORIO ========================================================== */ @media (min-width: 1025px) { /* ------------------------------------------------------ CABECERA A TODO EL ANCHO ------------------------------------------------------ */ header [data-row="bottom"] .ct-container, header [data-row="middle"] .ct-container { width: 100% !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; } /* ------------------------------------------------------ CONTENEDOR DEL MENÚ ------------------------------------------------------ */ [data-id="menu"] { position: relative !important; width: 100% !important; max-width: none !important; box-sizing: border-box !important; padding: 3px 20px !important; margin: 0 !important; overflow: visible !important; z-index: 100 !important; /* Textura pergamino */ background-color: var(--ates-parchment) !important; background-image: repeating-linear-gradient( 93deg, rgba(110, 74, 23, .025) 0, rgba(110, 74, 23, .025) 1px, transparent 1px, transparent 8px ), repeating-linear-gradient( 4deg, rgba(255, 255, 255, .035) 0, rgba(255, 255, 255, .035) 1px, transparent 1px, transparent 10px ), radial-gradient( ellipse at center, rgba(255, 255, 255, .25), rgba(255, 249, 234, .12) 55%, rgba(172, 126, 48, .05) ), linear-gradient( 180deg, rgba(255, 252, 242, .46), rgba(238, 224, 198, .28) ) !important; /* Bordes dorados */ border: none !important; border-top: 1px solid rgba(203, 159, 73, .28) !important; border-bottom: 1px solid rgba(174, 119, 27, .44) !important; border-radius: 0 !important; /* Sombra */ box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46), inset 0 -1px 0 rgba(112, 73, 17, .07), 0 3px 12px rgba(59, 40, 13, .07) !important; } /* ------------------------------------------------------ LISTA PRINCIPAL ------------------------------------------------------ */ [data-id="menu"] > ul { display: flex !important; align-items: center !important; justify-content: space-evenly !important; width: 100% !important; gap: 0 !important; margin: 0 auto !important; padding: 0 !important; overflow: visible !important; } /* ------------------------------------------------------ ELEMENTOS ------------------------------------------------------ */ [data-id="menu"] > ul > li { position: relative !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; } /* ------------------------------------------------------ SEPARADORES VERTICALES DORADOS ------------------------------------------------------ */ [data-id="menu"] > ul > li:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: 0; width: 1px; height: 25px; transform: translateY(-50%); background: linear-gradient( to bottom, transparent, rgba(180, 119, 32, .18) 20%, rgba(198, 147, 55, .58) 50%, rgba(180, 119, 32, .18) 80%, transparent ); pointer-events: none; } /* ------------------------------------------------------ ENLACES PRINCIPALES ------------------------------------------------------ */ [data-id="menu"] > ul > li > a { position: relative !important; display: flex !important; align-items: center !important; justify-content: center !important; min-height: 52px !important; padding: 0 17px !important; color: var(--ates-navy) !important; background: transparent !important; border: none !important; border-radius: 0 !important; font-family: inherit !important; font-size: 13.5px !important; font-weight: 700 !important; letter-spacing: .25px !important; white-space: nowrap !important; text-shadow: 0 1px 1px rgba(255, 255, 255, .55); box-shadow: none !important; transition: color .22s ease, background .22s ease, transform .22s ease !important; } /* ------------------------------------------------------ HOVER ------------------------------------------------------ */ [data-id="menu"] > ul > li > a:hover { color: var(--ates-gold) !important; background: radial-gradient( ellipse at center bottom, rgba(219, 174, 87, .15), transparent 72% ) !important; transform: translateY(-1px); } /* ------------------------------------------------------ ELEMENTO ACTIVO ------------------------------------------------------ */ [data-id="menu"] > ul > li.current-menu-item > a, [data-id="menu"] > ul > li.current_page_item > a, [data-id="menu"] > ul > li.current-menu-ancestor > a { color: var(--ates-gold) !important; background: radial-gradient( ellipse at center bottom, rgba(222, 177, 88, .12), transparent 72% ) !important; } /* ------------------------------------------------------ LÍNEA DORADA DEL ELEMENTO ACTIVO ------------------------------------------------------ */ [data-id="menu"] > ul > li.current-menu-item > a::after, [data-id="menu"] > ul > li.current_page_item > a::after, [data-id="menu"] > ul > li.current-menu-ancestor > a::after { content: ""; position: absolute; left: 50%; bottom: 5px; width: 76%; height: 2px; transform: translateX(-50%); border-radius: 20px; background: linear-gradient( 90deg, transparent, #b87a18 22%, #dfb256 40%, #f0d58c 50%, #dfb256 60%, #b87a18 78%, transparent ); box-shadow: 0 0 5px rgba(219, 174, 83, .16); } /* ------------------------------------------------------ PEQUEÑO ROMBO DEL ELEMENTO ACTIVO ------------------------------------------------------ */ [data-id="menu"] > ul > li.current-menu-item > a::before, [data-id="menu"] > ul > li.current_page_item > a::before, [data-id="menu"] > ul > li.current-menu-ancestor > a::before { content: ""; position: absolute; left: 50%; bottom: 3px; width: 6px; height: 6px; transform: translateX(-50%) rotate(45deg); background: linear-gradient( 135deg, #f0d27d, #b97813 ); border: 1px solid rgba(255, 248, 218, .88); box-shadow: 0 1px 4px rgba(101, 63, 7, .20); } /* ====================================================== MENÚ "MÁS" ====================================================== */ [data-id="menu"] .menu-mas-automatico { position: relative !important; overflow: visible !important; } [data-id="menu"] .menu-mas-automatico > .menu-mas-enlace { display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; color: var(--ates-navy) !important; font-weight: 700 !important; cursor: default !important; } /* Flecha */ [data-id="menu"] .flecha-mas { display: inline-block !important; position: static !important; width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; color: var(--ates-navy) !important; background: none !important; font-size: 11px !important; line-height: 1 !important; transition: transform .22s ease, color .22s ease !important; } /* ------------------------------------------------------ SUBMENÚ DE "MÁS" ------------------------------------------------------ */ [data-id="menu"] .menu-mas-automatico > .submenu-mas-automatico { display: block !important; position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; width: max-content !important; min-width: 250px !important; max-width: 330px !important; margin: 0 !important; padding: 8px !important; list-style: none !important; background: linear-gradient( 180deg, rgba(255, 252, 244, .98), rgba(246, 237, 218, .98) ) !important; border: 1px solid rgba(181, 119, 32, .40) !important; border-top: 2px solid var(--ates-gold-soft) !important; border-radius: 0 0 10px 10px !important; box-shadow: 0 12px 28px rgba(20, 32, 44, .18) !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: translateY(5px) !important; transition: opacity .20s ease, visibility .20s ease, transform .20s ease !important; z-index: 999999 !important; } /* Abrir Más */ [data-id="menu"] .menu-mas-automatico:hover > .submenu-mas-automatico { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: translateY(0) !important; } [data-id="menu"] .menu-mas-automatico:hover > .menu-mas-enlace, [data-id="menu"] .menu-mas-automatico:hover .flecha-mas { color: var(--ates-gold) !important; } [data-id="menu"] .menu-mas-automatico:hover .flecha-mas { transform: rotate(180deg) !important; } /* ------------------------------------------------------ ELEMENTOS DEL SUBMENÚ ------------------------------------------------------ */ [data-id="menu"] .submenu-mas-automatico > li { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } [data-id="menu"] .submenu-mas-automatico > li > a { display: block !important; width: 100% !important; box-sizing: border-box !important; padding: 10px 14px !important; color: var(--ates-navy) !important; background: transparent !important; font-weight: 600 !important; text-align: left !important; white-space: nowrap !important; border-radius: 6px !important; text-shadow: none !important; transition: color .18s ease, background .18s ease, padding-left .18s ease !important; } [data-id="menu"] .submenu-mas-automatico > li > a:hover { color: #95600b !important; background: rgba(190, 139, 58, .10) !important; padding-left: 18px !important; } /* ------------------------------------------------------ ICONOS BLOCKSY ------------------------------------------------------ */ [data-id="menu"] svg { color: var(--ates-navy) !important; fill: currentColor !important; transition: color .22s ease, transform .22s ease !important; } [data-id="menu"] li:hover > a svg { color: var(--ates-gold) !important; } } /* ========================================================== 7. ORNAMENTO DESACTIVADO Evita que aparezca aunque todavía exista su HTML ========================================================== */ .ates-separador-cabecera { display: none !important; } /* ========================================================== DISEÑO DE CITAS ========================================================== */ .entry-content blockquote, .wp-block-quote { position: relative !important; margin: 32px 0 !important; padding: 28px 32px 24px 42px !important; background: linear-gradient( 135deg, #fffdf8 0%, #fbf7ed 55%, #f6ecd7 100% ) !important; border: 1px solid rgba(180, 119, 32, .32) !important; border-left: 5px solid #b47720 !important; border-radius: 4px 10px 10px 4px !important; box-shadow: 0 5px 18px rgba(35, 43, 52, .08), inset 0 1px 0 rgba(255,255,255,.85) !important; color: #24384c !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-style: italic !important; line-height: 1.8 !important; overflow: hidden !important; } /* COMILLA DECORATIVA */ .entry-content blockquote::before, .wp-block-quote::before { content: "“" !important; position: absolute !important; top: -15px !important; left: 10px !important; color: rgba(180, 119, 32, .20) !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 90px !important; font-weight: bold !important; font-style: normal !important; line-height: 1 !important; pointer-events: none !important; } /* TEXTO */ .entry-content blockquote p, .wp-block-quote p { position: relative !important; margin-top: 0 !important; margin-bottom: 12px !important; color: #24384c !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-style: italic !important; line-height: 1.8 !important; z-index: 2 !important; } /* REFERENCIA O AUTOR */ .entry-content blockquote cite, .wp-block-quote cite, .wp-block-quote__citation { display: block !important; margin-top: 16px !important; color: #174a78 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 14px !important; font-style: normal !important; font-weight: 600 !important; text-align: right !important; } /* RAYA DORADA ANTES DE LA REFERENCIA */ .entry-content blockquote cite::before, .wp-block-quote cite::before, .wp-block-quote__citation::before { content: "— " !important; color: #b47720 !important; } /* ENLACES */ .entry-content blockquote a, .wp-block-quote a { color: #174a78 !important; text-decoration-color: rgba(180,119,32,.55) !important; text-underline-offset: 3px !important; } .entry-content blockquote a:hover, .wp-block-quote a:hover { color: #b47720 !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark .entry-content blockquote, html.ates-dark .wp-block-quote { background: linear-gradient( 135deg, #12273b, #0c1f31 ) !important; border-color: rgba(201,169,106,.35) !important; border-left-color: #c9a96a !important; color: #edf1f4 !important; } html.ates-dark .entry-content blockquote p, html.ates-dark .wp-block-quote p { color: #edf1f4 !important; } html.ates-dark .entry-content blockquote::before, html.ates-dark .wp-block-quote::before { color: rgba(201,169,106,.20) !important; } html.ates-dark .entry-content blockquote cite, html.ates-dark .wp-block-quote cite, html.ates-dark .wp-block-quote__citation { color: #c9d9e7 !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 600px) { .entry-content blockquote, .wp-block-quote { margin: 24px 0 !important; padding: 23px 20px 20px 29px !important; font-size: 16px !important; line-height: 1.7 !important; } .entry-content blockquote p, .wp-block-quote p { font-size: 16px !important; line-height: 1.7 !important; } .entry-content blockquote::before, .wp-block-quote::before { top: -10px !important; left: 7px !important; font-size: 68px !important; } .entry-content blockquote cite, .wp-block-quote cite, .wp-block-quote__citation { font-size: 13px !important; } }/* ========================================================== A TRAVÉS DE LAS ESCRITURAS CSS GENERAL COMPLETO ========================================================== */ /* ========================================================== 1. COLORES GENERALES ========================================================== */ :root { --ates-navy: #071f3d; --ates-navy-soft: #0a3150; --ates-gold: #b47720; --ates-gold-light: #d4a14c; --ates-gold-soft: #c58a32; --ates-parchment: rgba(246, 239, 224, .30); } /* ========================================================== 2. BOTÓN DE VÍDEO — EFECTO PULSE ========================================================== */ .ct-pulse { border-radius: 50%; animation: pulse 2s ease-out infinite; } @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .8); } 80% { box-shadow: 0 0 0 30px rgba(255, 255, 255, 0); } } /* ========================================================== 3. IMAGEN DE FONDO DE LA CABECERA ========================================================== */ #header > [data-device] { background-image: linear-gradient( rgba(255, 255, 255, .55), rgba(255, 255, 255, .75) ), url("https://atravesdelasescrituras.com/wp-content/uploads/2026/08/ChatGPT-Image-30-ago-2026-11_00_38.png"); background-position: center; background-size: cover; background-repeat: no-repeat; } #header [data-row] { background-color: transparent !important; background-image: none !important; } /* ========================================================== 4. METADATOS EN ESPAÑOL ========================================================== */ .entry-meta .meta-author > span:first-of-type, .entry-meta .meta-date > span:first-of-type, .entry-meta .meta-categories > span:first-of-type { font-size: 0 !important; } .entry-meta .meta-author > span:first-of-type::after { content: "POR "; font-size: 12px; } .entry-meta .meta-date > span:first-of-type::after { content: "EL "; font-size: 12px; } .entry-meta .meta-categories > span:first-of-type::after { content: "EN "; font-size: 12px; } /* ========================================================== 5. BARRA LATERAL ========================================================== */ .ct-sidebar, .ct-sidebar-inner, aside.ct-sidebar, [data-sidebar], [data-sidebar] .ct-sidebar, [data-sidebar] .ct-sidebar-inner, .ct-sidebar .ct-widget, .ct-sidebar .widget, .ct-sidebar section.widget, .ct-sidebar .widget_block, .ct-sidebar .wp-block-group, .ct-sidebar .wp-block-group__inner-container, .ct-sidebar .wp-block-widget-group { background: transparent !important; background-color: transparent !important; background-image: none !important; border: none !important; box-shadow: none !important; } [data-sidebar] { --theme-background-color: transparent !important; } .ct-sidebar .ct-widget, .ct-sidebar .widget, .ct-sidebar .widget_block { text-align: center; } .ct-sidebar .widget-title { text-align: center; } .ct-sidebar img { display: block; margin-left: auto; margin-right: auto; } .ct-sidebar ul { padding-left: 0; margin-left: auto; margin-right: auto; } .ct-sidebar #vd365-widget, .ct-sidebar #parasha-widget, .ct-sidebar #moadim-widget, .ct-sidebar #calendario-widget, .ct-sidebar #gravatar-widget, .ct-sidebar #facebook-site-widget, .ct-sidebar #sitios-interes-widget, .ct-sidebar .youtube-widget, .ct-sidebar .ates-theme-box, .ct-sidebar .ate-buscador { display: block !important; width: 100% !important; max-width: 320px !important; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box !important; } .ct-sidebar .ate-buscador input, .ct-sidebar .ate-buscador button, .ct-sidebar .ates-theme-box button { margin-left: 0 !important; margin-right: 0 !important; } .ct-sidebar input[type="text"], .ct-sidebar input[type="search"], .ct-sidebar input[type="email"], .ct-sidebar textarea, .ct-sidebar select { background-color: rgba(255, 255, 255, .90) !important; } .ct-sidebar .goog-te-gadget, .ct-sidebar .goog-te-gadget-simple, .ct-sidebar .google-translate-element { background: transparent !important; background-color: transparent !important; } /* ========================================================== 6. MENÚ PRINCIPAL DE ESCRITORIO ========================================================== */ @media (min-width: 1025px) { header [data-row="bottom"] .ct-container, header [data-row="middle"] .ct-container { width: 100% !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; } [data-id="menu"] { position: relative !important; width: 100% !important; max-width: none !important; box-sizing: border-box !important; padding: 3px 20px !important; margin: 0 !important; overflow: visible !important; z-index: 100 !important; background-color: var(--ates-parchment) !important; background-image: repeating-linear-gradient( 93deg, rgba(110, 74, 23, .025) 0, rgba(110, 74, 23, .025) 1px, transparent 1px, transparent 8px ), repeating-linear-gradient( 4deg, rgba(255, 255, 255, .035) 0, rgba(255, 255, 255, .035) 1px, transparent 1px, transparent 10px ), radial-gradient( ellipse at center, rgba(255, 255, 255, .25), rgba(255, 249, 234, .12) 55%, rgba(172, 126, 48, .05) ), linear-gradient( 180deg, rgba(255, 252, 242, .46), rgba(238, 224, 198, .28) ) !important; border: none !important; border-top: 1px solid rgba(203, 159, 73, .28) !important; border-bottom: 1px solid rgba(174, 119, 27, .44) !important; border-radius: 0 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46), inset 0 -1px 0 rgba(112, 73, 17, .07), 0 3px 12px rgba(59, 40, 13, .07) !important; } [data-id="menu"] > ul { display: flex !important; align-items: center !important; justify-content: space-evenly !important; width: 100% !important; gap: 0 !important; margin: 0 auto !important; padding: 0 !important; overflow: visible !important; } [data-id="menu"] > ul > li { position: relative !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; } [data-id="menu"] > ul > li:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: 0; width: 1px; height: 25px; transform: translateY(-50%); background: linear-gradient( to bottom, transparent, rgba(180, 119, 32, .18) 20%, rgba(198, 147, 55, .58) 50%, rgba(180, 119, 32, .18) 80%, transparent ); pointer-events: none; } [data-id="menu"] > ul > li > a { position: relative !important; display: flex !important; align-items: center !important; justify-content: center !important; min-height: 52px !important; padding: 0 17px !important; color: var(--ates-navy) !important; background: transparent !important; border: none !important; border-radius: 0 !important; font-family: inherit !important; font-size: 13.5px !important; font-weight: 700 !important; letter-spacing: .25px !important; white-space: nowrap !important; text-shadow: 0 1px 1px rgba(255, 255, 255, .55); box-shadow: none !important; transition: color .22s ease, background .22s ease, transform .22s ease !important; } [data-id="menu"] > ul > li > a:hover { color: var(--ates-gold) !important; background: radial-gradient( ellipse at center bottom, rgba(219, 174, 87, .15), transparent 72% ) !important; transform: translateY(-1px); } [data-id="menu"] > ul > li.current-menu-item > a, [data-id="menu"] > ul > li.current_page_item > a, [data-id="menu"] > ul > li.current-menu-ancestor > a { color: var(--ates-gold) !important; background: radial-gradient( ellipse at center bottom, rgba(222, 177, 88, .12), transparent 72% ) !important; } [data-id="menu"] > ul > li.current-menu-item > a::after, [data-id="menu"] > ul > li.current_page_item > a::after, [data-id="menu"] > ul > li.current-menu-ancestor > a::after { content: ""; position: absolute; left: 50%; bottom: 5px; width: 76%; height: 2px; transform: translateX(-50%); border-radius: 20px; background: linear-gradient( 90deg, transparent, #b87a18 22%, #dfb256 40%, #f0d58c 50%, #dfb256 60%, #b87a18 78%, transparent ); box-shadow: 0 0 5px rgba(219, 174, 83, .16); } [data-id="menu"] > ul > li.current-menu-item > a::before, [data-id="menu"] > ul > li.current_page_item > a::before, [data-id="menu"] > ul > li.current-menu-ancestor > a::before { content: ""; position: absolute; left: 50%; bottom: 3px; width: 6px; height: 6px; transform: translateX(-50%) rotate(45deg); background: linear-gradient( 135deg, #f0d27d, #b97813 ); border: 1px solid rgba(255, 248, 218, .88); box-shadow: 0 1px 4px rgba(101, 63, 7, .20); } /* ====================================================== MENÚ MÁS ====================================================== */ [data-id="menu"] .menu-mas-automatico { position: relative !important; overflow: visible !important; } [data-id="menu"] .menu-mas-automatico > .menu-mas-enlace { display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; color: var(--ates-navy) !important; font-weight: 700 !important; cursor: default !important; } [data-id="menu"] .flecha-mas { display: inline-block !important; position: static !important; width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; color: var(--ates-navy) !important; background: none !important; font-size: 11px !important; line-height: 1 !important; transition: transform .22s ease, color .22s ease !important; } [data-id="menu"] .menu-mas-automatico > .submenu-mas-automatico { display: block !important; position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; width: max-content !important; min-width: 250px !important; max-width: 330px !important; margin: 0 !important; padding: 8px !important; list-style: none !important; background: linear-gradient( 180deg, rgba(255, 252, 244, .98), rgba(246, 237, 218, .98) ) !important; border: 1px solid rgba(181, 119, 32, .40) !important; border-top: 2px solid var(--ates-gold-soft) !important; border-radius: 0 0 10px 10px !important; box-shadow: 0 12px 28px rgba(20, 32, 44, .18) !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: translateY(5px) !important; transition: opacity .20s ease, visibility .20s ease, transform .20s ease !important; z-index: 999999 !important; } [data-id="menu"] .menu-mas-automatico:hover > .submenu-mas-automatico { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: translateY(0) !important; } [data-id="menu"] .menu-mas-automatico:hover > .menu-mas-enlace, [data-id="menu"] .menu-mas-automatico:hover .flecha-mas { color: var(--ates-gold) !important; } [data-id="menu"] .menu-mas-automatico:hover .flecha-mas { transform: rotate(180deg) !important; } [data-id="menu"] .submenu-mas-automatico > li { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } [data-id="menu"] .submenu-mas-automatico > li > a { display: block !important; width: 100% !important; box-sizing: border-box !important; padding: 10px 14px !important; color: var(--ates-navy) !important; background: transparent !important; font-weight: 600 !important; text-align: left !important; white-space: nowrap !important; border-radius: 6px !important; text-shadow: none !important; transition: color .18s ease, background .18s ease, padding-left .18s ease !important; } [data-id="menu"] .submenu-mas-automatico > li > a:hover { color: #95600b !important; background: rgba(190, 139, 58, .10) !important; padding-left: 18px !important; } [data-id="menu"] svg { color: var(--ates-navy) !important; fill: currentColor !important; transition: color .22s ease, transform .22s ease !important; } [data-id="menu"] li:hover > a svg { color: var(--ates-gold) !important; } } /* ========================================================== 7. ORNAMENTO NEGRO DE CABECERA ========================================================== */ .ates-ornamento-negro { display: flex !important; align-items: center; justify-content: center; width: 380px; max-width: 88%; height: 34px; margin: -4px auto 1px !important; padding: 0 !important; position: relative; z-index: 20; color: #000000; pointer-events: none; box-sizing: border-box; } .ates-ornamento-negro svg { display: block; width: 100%; height: auto; overflow: visible; color: inherit; } .ates-ornamento-negro path, .ates-ornamento-negro polygon, .ates-ornamento-negro ellipse { vector-effect: non-scaling-stroke; } /* Ornamento antiguo */ .ates-separador-cabecera { display: none !important; } /* ========================================================== 8. CITAS ========================================================== */ .entry-content blockquote, .wp-block-quote { position: relative !important; margin: 32px 0 !important; padding: 28px 32px 24px 42px !important; background: linear-gradient( 135deg, #fffdf8 0%, #fbf7ed 55%, #f6ecd7 100% ) !important; border: 1px solid rgba(180, 119, 32, .32) !important; border-left: 5px solid #b47720 !important; border-radius: 4px 10px 10px 4px !important; box-shadow: 0 5px 18px rgba(35, 43, 52, .08), inset 0 1px 0 rgba(255, 255, 255, .85) !important; color: #24384c !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-style: italic !important; line-height: 1.8 !important; overflow: hidden !important; } .entry-content blockquote::before, .wp-block-quote::before { content: "“" !important; position: absolute !important; top: -15px !important; left: 10px !important; color: rgba(180, 119, 32, .20) !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 90px !important; font-weight: bold !important; font-style: normal !important; line-height: 1 !important; pointer-events: none !important; } .entry-content blockquote p, .wp-block-quote p { position: relative !important; margin-top: 0 !important; margin-bottom: 12px !important; color: #24384c !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-style: italic !important; line-height: 1.8 !important; z-index: 2 !important; } .entry-content blockquote cite, .wp-block-quote cite, .wp-block-quote__citation { display: block !important; margin-top: 16px !important; color: #174a78 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 14px !important; font-style: normal !important; font-weight: 600 !important; text-align: right !important; } .entry-content blockquote cite::before, .wp-block-quote cite::before, .wp-block-quote__citation::before { content: "— " !important; color: #b47720 !important; } .entry-content blockquote a, .wp-block-quote a { color: #174a78 !important; text-decoration-color: rgba(180, 119, 32, .55) !important; text-underline-offset: 3px !important; } .entry-content blockquote a:hover, .wp-block-quote a:hover { color: #b47720 !important; } /* Modo oscuro */ html.ates-dark .entry-content blockquote, html.ates-dark .wp-block-quote { background: linear-gradient( 135deg, #12273b, #0c1f31 ) !important; border-color: rgba(201, 169, 106, .35) !important; border-left-color: #c9a96a !important; color: #edf1f4 !important; } html.ates-dark .entry-content blockquote p, html.ates-dark .wp-block-quote p { color: #edf1f4 !important; } html.ates-dark .entry-content blockquote::before, html.ates-dark .wp-block-quote::before { color: rgba(201, 169, 106, .20) !important; } html.ates-dark .entry-content blockquote cite, html.ates-dark .wp-block-quote cite, html.ates-dark .wp-block-quote__citation { color: #c9d9e7 !important; } /* ========================================================== 9. MENÚ MÓVIL + IPAD ========================================================== */ @media (max-width: 1024px) { /* Botón hamburguesa */ #header [data-id="trigger"], #header .ct-header-trigger { position: relative; z-index: 1000; } #header [data-id="trigger"] a, #header [data-id="trigger"] button, #header .ct-header-trigger a, #header .ct-header-trigger button { display: flex !important; align-items: center !important; justify-content: center !important; width: 42px !important; height: 42px !important; padding: 0 !important; color: #071f3d !important; background: rgba(255, 253, 248, .35) !important; border: 1px solid rgba(180, 119, 32, .30) !important; border-radius: 50% !important; box-shadow: 0 2px 8px rgba(26, 37, 48, .08) !important; transition: color .22s ease, border-color .22s ease, background .22s ease, transform .22s ease !important; } #header [data-id="trigger"] a:hover, #header [data-id="trigger"] button:hover, #header .ct-header-trigger a:hover, #header .ct-header-trigger button:hover { color: #b47720 !important; background: rgba(255, 250, 239, .58) !important; border-color: rgba(180, 119, 32, .58) !important; transform: scale(1.04); } #header [data-id="trigger"] svg, #header .ct-header-trigger svg { width: 22px !important; height: 22px !important; color: inherit !important; } /* Panel */ .ct-panel, .ct-panel-content { background: linear-gradient( 180deg, rgba(255, 253, 248, .99), rgba(248, 241, 226, .99) ) !important; color: #071f3d !important; } .ct-panel .ct-panel-inner, .ct-panel .ct-panel-content-inner { background: transparent !important; } /* ====================================================== LOGO GRANDE DENTRO DEL MENÚ ====================================================== */ .ates-logo-menu-movil { width: 100%; padding: 14px 20px 16px; text-align: center; box-sizing: border-box; } .ates-logo-menu-enlace { display: inline-flex !important; align-items: center; justify-content: center; background: transparent !important; border: none !important; box-shadow: none !important; text-decoration: none !important; } .ates-logo-menu-movil img { display: block; width: auto; height: auto; max-width: 220px; max-height: 135px; margin: 0 auto; object-fit: contain; filter: drop-shadow( 0 2px 3px rgba(20, 30, 40, .10) ); } /* Separador del logo */ .ates-linea-logo-menu { display: flex; align-items: center; justify-content: center; width: 210px; max-width: 78%; margin: 12px auto 0; } .ates-linea-logo-menu span { display: block; flex: 1; height: 1px; background: linear-gradient( 90deg, transparent, rgba(180, 119, 32, .55) ); } .ates-linea-logo-menu span:last-child { background: linear-gradient( 90deg, rgba(180, 119, 32, .55), transparent ); } .ates-linea-logo-menu i { display: block; width: 6px; height: 6px; margin: 0 8px; background: #b47720; border: 1px solid rgba(255, 246, 217, .9); transform: rotate(45deg); box-shadow: 0 1px 3px rgba(87, 54, 8, .18); } /* ====================================================== MENÚ ====================================================== */ .mobile-menu, .ct-panel .mobile-menu, .ct-panel [data-id="mobile-menu"] { background: transparent !important; margin: 0 !important; padding: 4px 18px 18px !important; } .mobile-menu ul, .ct-panel .mobile-menu ul { margin: 0 !important; padding: 0 !important; list-style: none !important; } .mobile-menu > ul > li, .ct-panel .mobile-menu > ul > li { position: relative !important; margin: 0 !important; padding: 0 !important; border-bottom: 1px solid rgba(180, 119, 32, .18) !important; } .mobile-menu > ul > li:last-child, .ct-panel .mobile-menu > ul > li:last-child { border-bottom: none !important; } .mobile-menu > ul > li > a, .ct-panel .mobile-menu > ul > li > a { position: relative !important; display: flex !important; align-items: center !important; min-height: 50px !important; padding: 11px 14px !important; color: #071f3d !important; background: transparent !important; border: none !important; border-radius: 7px !important; font-family: inherit !important; font-size: 15px !important; font-weight: 650 !important; line-height: 1.35 !important; letter-spacing: .15px !important; text-decoration: none !important; box-shadow: none !important; transition: color .18s ease, background .18s ease, padding-left .18s ease !important; } .mobile-menu > ul > li > a:hover, .mobile-menu > ul > li > a:focus, .ct-panel .mobile-menu > ul > li > a:hover, .ct-panel .mobile-menu > ul > li > a:focus { color: #9b650e !important; background: rgba(180, 119, 32, .08) !important; padding-left: 19px !important; } .mobile-menu > ul > li.current-menu-item > a, .mobile-menu > ul > li.current_page_item > a, .mobile-menu > ul > li.current-menu-ancestor > a, .ct-panel .mobile-menu > ul > li.current-menu-item > a, .ct-panel .mobile-menu > ul > li.current_page_item > a, .ct-panel .mobile-menu > ul > li.current-menu-ancestor > a { color: #b47720 !important; background: linear-gradient( 90deg, rgba(180, 119, 32, .09), rgba(180, 119, 32, .03) ) !important; font-weight: 700 !important; } .mobile-menu > ul > li.current-menu-item > a::before, .mobile-menu > ul > li.current_page_item > a::before, .mobile-menu > ul > li.current-menu-ancestor > a::before, .ct-panel .mobile-menu > ul > li.current-menu-item > a::before, .ct-panel .mobile-menu > ul > li.current_page_item > a::before, .ct-panel .mobile-menu > ul > li.current-menu-ancestor > a::before { content: ""; position: absolute; left: 0; top: 50%; width: 3px; height: 27px; transform: translateY(-50%); border-radius: 10px; background: linear-gradient( 180deg, #d7a64c, #9d650d ); } /* Submenús */ .mobile-menu .sub-menu, .ct-panel .mobile-menu .sub-menu { margin: 0 0 6px 0 !important; padding: 3px 0 5px 16px !important; background: transparent !important; border: none !important; } .mobile-menu .sub-menu li, .ct-panel .mobile-menu .sub-menu li { border: none !important; margin: 0 !important; padding: 0 !important; } .mobile-menu .sub-menu a, .ct-panel .mobile-menu .sub-menu a { display: block !important; padding: 9px 12px !important; color: #174a78 !important; background: transparent !important; border-radius: 6px !important; font-family: inherit !important; font-size: 13.5px !important; font-weight: 500 !important; line-height: 1.4 !important; transition: color .18s ease, background .18s ease, padding-left .18s ease !important; } .mobile-menu .sub-menu a:hover, .mobile-menu .sub-menu a:focus, .ct-panel .mobile-menu .sub-menu a:hover, .ct-panel .mobile-menu .sub-menu a:focus { color: #b47720 !important; background: rgba(180, 119, 32, .07) !important; padding-left: 16px !important; } /* Flechas */ .mobile-menu .ct-toggle-dropdown-desktop, .mobile-menu .ct-toggle-dropdown-mobile, .ct-panel .mobile-menu button { color: #071f3d !important; background: transparent !important; border: none !important; box-shadow: none !important; } .mobile-menu button:hover, .ct-panel .mobile-menu button:hover { color: #b47720 !important; background: rgba(180, 119, 32, .08) !important; } /* Botón cerrar */ .ct-panel .ct-toggle-close, .ct-panel .ct-panel-close { color: #071f3d !important; background: rgba(255, 255, 255, .35) !important; border: 1px solid rgba(180, 119, 32, .28) !important; border-radius: 50% !important; } .ct-panel .ct-toggle-close:hover, .ct-panel .ct-panel-close:hover { color: #b47720 !important; border-color: rgba(180, 119, 32, .60) !important; } .menu-mas-automatico { display: none !important; } } /* ========================================================== 10. IPAD / TABLET ========================================================== */ @media (min-width: 601px) and (max-width: 1024px) { .ates-ornamento-negro { width: 285px; max-width: 72%; height: 28px; margin: -3px auto 1px !important; } /* LOGO MÁS GRANDE EN IPAD */ .ates-logo-menu-movil img { max-width: 245px; max-height: 150px; } .mobile-menu, .ct-panel .mobile-menu { padding-left: 26px !important; padding-right: 26px !important; } .mobile-menu > ul > li > a, .ct-panel .mobile-menu > ul > li > a { min-height: 54px !important; padding: 12px 17px !important; font-size: 15.5px !important; } .mobile-menu .sub-menu a, .ct-panel .mobile-menu .sub-menu a { font-size: 14px !important; } } /* ========================================================== 11. MÓVIL ========================================================== */ @media (max-width: 600px) { .ates-ornamento-negro { width: 185px; max-width: 62%; height: 22px; margin: -2px auto 0 !important; } /* LOGO GRANDE EN MÓVIL */ .ates-logo-menu-movil { padding: 10px 15px 13px; } .ates-logo-menu-movil img { max-width: 185px; max-height: 115px; } .ates-linea-logo-menu { width: 175px; margin-top: 10px; } /* Menú */ .mobile-menu, .ct-panel .mobile-menu { padding-left: 12px !important; padding-right: 12px !important; } .mobile-menu > ul > li > a, .ct-panel .mobile-menu > ul > li > a { min-height: 48px !important; padding: 10px 12px !important; font-size: 14.5px !important; } .mobile-menu .sub-menu, .ct-panel .mobile-menu .sub-menu { padding-left: 12px !important; } .mobile-menu .sub-menu a, .ct-panel .mobile-menu .sub-menu a { font-size: 13px !important; } /* Citas */ .entry-content blockquote, .wp-block-quote { margin: 24px 0 !important; padding: 23px 20px 20px 29px !important; font-size: 16px !important; line-height: 1.7 !important; } .entry-content blockquote p, .wp-block-quote p { font-size: 16px !important; line-height: 1.7 !important; } .entry-content blockquote::before, .wp-block-quote::before { top: -10px !important; left: 7px !important; font-size: 68px !important; } .entry-content blockquote cite, .wp-block-quote cite, .wp-block-quote__citation { font-size: 13px !important; } } /* ========================================================== 12. TELÉFONOS PEQUEÑOS ========================================================== */ @media (max-width: 380px) { .ates-ornamento-negro { width: 155px; max-width: 60%; height: 19px; } }/* ========================================================== BUSCADOR MÓVIL — COLOR DEL TEXTO ========================================================== */ /* Texto que escribes */ @media (max-width: 768px) { .ct-search-form input[type="search"], .search-form input[type="search"], [data-id="search"] input, .ct-search-modal input[type="search"] { color: #071f3d !important; -webkit-text-fill-color: #071f3d !important; } /* Texto de ejemplo: "Buscar..." */ .ct-search-form input::placeholder, .search-form input::placeholder, [data-id="search"] input::placeholder, .ct-search-modal input::placeholder { color: #6d7882 !important; opacity: 1 !important; } }/* ========================================================== BUSCADOR MÓVIL TEXTO + RESULTADOS DE BÚSQUEDA ========================================================== */ @media (max-width: 768px) { /* Texto que escribes en el buscador */ .ct-search-form input[type="search"], .search-form input[type="search"], [data-id="search"] input, .ct-search-modal input[type="search"] { color: #071f3d !important; -webkit-text-fill-color: #071f3d !important; } /* Texto "Buscar..." */ .ct-search-form input::placeholder, .search-form input::placeholder, [data-id="search"] input::placeholder, .ct-search-modal input::placeholder { color: #667788 !important; -webkit-text-fill-color: #667788 !important; opacity: 1 !important; } /* Resultados de búsqueda */ .ct-search-results, .ct-search-results a, .ct-search-results .entry-title, .ct-search-results .ct-search-item, .ct-search-results span { color: #071f3d !important; } /* Títulos de los resultados */ .ct-search-results a { color: #0a3150 !important; text-decoration: none !important; } /* Al tocar/pasar sobre un resultado */ .ct-search-results a:hover { color: #b47720 !important; } /* Texto secundario de los resultados */ .ct-search-results p, .ct-search-results .entry-meta { color: #667788 !important; } } /* ========================================================= REDES SOCIALES - MEDALLONES EDITORIALES ========================================================= */ header a:has(svg), header a:has(i) { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin: 0 4px; padding: 0 !important; border-radius: 50% !important; background: rgba(250, 247, 239, 0.82) !important; border: 1px solid rgba(170, 129, 66, 0.5) !important; box-shadow: 0 4px 14px rgba(66, 49, 25, 0.08); overflow: visible; transition: transform .28s ease, background-color .28s ease, border-color .28s ease, box-shadow .28s ease; } /* DOBLE ARO */ header a:has(svg)::before, header a:has(i)::before { content: ""; position: absolute; inset: 3px; border-radius: 50%; border: 1px solid rgba(170, 129, 66, 0.18); pointer-events: none; } /* PEQUEÑO DETALLE DORADO */ header a:has(svg)::after, header a:has(i)::after { content: ""; position: absolute; width: 4px; height: 4px; top: 3px; right: 3px; border-radius: 50%; background: #b58a46; opacity: .45; transition: transform .28s ease, opacity .28s ease; } /* ICONOS */ header a:has(svg) svg, header a:has(i) i { position: relative; z-index: 2; width: 16px; height: 16px; font-size: 16px; color: #8b6934 !important; fill: #8b6934 !important; transition: transform .28s ease, color .28s ease, fill .28s ease; } /* HOVER DEL MEDALLÓN */ header a:has(svg):hover, header a:has(i):hover { transform: translateY(-3px) scale(1.04); background: rgba(255, 252, 245, 1) !important; border-color: rgba(170, 129, 66, 0.9) !important; box-shadow: 0 9px 22px rgba(74, 54, 26, 0.16); } /* ICONO AL PASAR */ header a:has(svg):hover svg, header a:has(i):hover i { color: #5d4524 !important; fill: #5d4524 !important; transform: scale(1.1); } /* DETALLE SUPERIOR AL PASAR */ header a:has(svg):hover::after, header a:has(i):hover::after { transform: scale(1.5); opacity: .9; } /* VARIACIÓN MUY SUTIL ENTRE ICONOS */ header a:has(svg):nth-of-type(2n), header a:has(i):nth-of-type(2n) { transform: translateY(1px); } header a:has(svg):nth-of-type(2n):hover, header a:has(i):nth-of-type(2n):hover { transform: translateY(-3px) scale(1.04); } /* TABLET */ @media (max-width: 1024px) { header a:has(svg), header a:has(i) { width: 35px; height: 35px; margin: 0 3px; } } /* MÓVIL */ @media (max-width: 767px) { header a:has(svg), header a:has(i) { width: 33px; height: 33px; } header a:has(svg) svg, header a:has(i) i { width: 15px; height: 15px; font-size: 15px; } }/* ========================================================== LUPA DE LA CABECERA EFECTO ZOOM - SIN MODIFICAR COLORES ========================================================== */ /* ---------------------------------------------------------- 1. ELEMENTOS DE BÚSQUEDA ---------------------------------------------------------- */ header [class*="search"], header [class*="Search"], header .fa-search, header .fa-magnifying-glass, header [aria-label*="Buscar"], header [aria-label*="buscar"], header [aria-label*="Search"], header [title*="Buscar"], header [title*="Search"] { transform: scale(1); transform-origin: center center; transition: transform 0.30s cubic-bezier(.2,.8,.2,1) !important; } /* ---------------------------------------------------------- 2. ZOOM DIRECTAMENTE SOBRE LA LUPA ---------------------------------------------------------- */ header [class*="search"]:hover, header [class*="Search"]:hover, header .fa-search:hover, header .fa-magnifying-glass:hover, header [aria-label*="Buscar"]:hover, header [aria-label*="buscar"]:hover, header [aria-label*="Search"]:hover, header [title*="Buscar"]:hover, header [title*="Search"]:hover { transform: scale(1.30) !important; } /* ---------------------------------------------------------- 3. SI LA LUPA ESTÁ DENTRO DE UN ENLACE ---------------------------------------------------------- */ header a:hover .fa-search, header a:hover .fa-magnifying-glass, header a:hover [class*="search"], header a:hover [class*="Search"], header a:hover svg { transform: scale(1.30) !important; } /* ---------------------------------------------------------- 4. SI LA LUPA ESTÁ DENTRO DE UN BOTÓN ---------------------------------------------------------- */ header button:hover .fa-search, header button:hover .fa-magnifying-glass, header button:hover [class*="search"], header button:hover [class*="Search"], header button:hover svg { transform: scale(1.30) !important; } /* ---------------------------------------------------------- 5. ZOOM DEL CONTENEDOR DE BÚSQUEDA ---------------------------------------------------------- */ header a:has(.fa-search), header a:has(.fa-magnifying-glass), header button:has(.fa-search), header button:has(.fa-magnifying-glass), header a:has([class*="search"]), header button:has([class*="search"]) { transform: scale(1); transform-origin: center center; transition: transform 0.30s cubic-bezier(.2,.8,.2,1) !important; } /* ---------------------------------------------------------- 6. HOVER DEL CONTENEDOR ---------------------------------------------------------- */ header a:has(.fa-search):hover, header a:has(.fa-magnifying-glass):hover, header button:has(.fa-search):hover, header button:has(.fa-magnifying-glass):hover, header a:has([class*="search"]):hover, header button:has([class*="search"]):hover { transform: scale(1.22) !important; } /* ---------------------------------------------------------- 7. LA LUPA CRECE AÚN MÁS DENTRO DEL BOTÓN ---------------------------------------------------------- */ header a:has(.fa-search):hover .fa-search, header a:has(.fa-magnifying-glass):hover .fa-magnifying-glass, header button:has(.fa-search):hover .fa-search, header button:has(.fa-magnifying-glass):hover .fa-magnifying-glass, header a:has([class*="search"]):hover svg, header button:has([class*="search"]):hover svg { transform: scale(1.15) !important; } /* ---------------------------------------------------------- 8. EFECTO AL HACER CLIC ---------------------------------------------------------- */ header a:has(.fa-search):active, header a:has(.fa-magnifying-glass):active, header button:has(.fa-search):active, header button:has(.fa-magnifying-glass):active, header a:has([class*="search"]):active, header button:has([class*="search"]):active { transform: scale(0.94) !important; } /* ========================================================== LOGOTIPO CABECERA - EFECTO HOVER ELEGANTE ========================================================== */ /* Logo */ header .custom-logo, header .site-logo img, header .site-branding img, header a[rel="home"] img { transform: scale(1); transform-origin: center center; transition: transform .40s cubic-bezier(.2,.8,.2,1), filter .40s ease !important; } /* EFECTO AL PASAR EL RATÓN */ header .custom-logo:hover, header .site-logo:hover img, header .site-branding a:hover img, header a[rel="home"]:hover img { transform: translateY(-2px) scale(1.07) !important; filter: drop-shadow(0 5px 7px rgba(20, 42, 60, .14)) drop-shadow(0 1px 2px rgba(184, 148, 84, .18)); } /* Al hacer clic */ header .site-branding a:active img, header a[rel="home"]:active img { transform: scale(.98) !important; } /* ========================================= REDES SOCIALES - TAMAÑO EN MÓVIL ========================================= */ @media (max-width: 767px) { header a:has(svg), header a:has(i) { width: 26px !important; height: 26px !important; margin: 0 1px !important; } header a:has(svg) svg, header a:has(i) i { width: 12px !important; height: 12px !important; font-size: 12px !important; } }/* ========================================================== CABECERA MÓVIL TÍTULO + SUBTÍTULO MÁS GRANDES Y COMPACTOS ========================================================== */ @media (max-width: 767px) { /* Permite que el bloque de texto use el espacio disponible */ header .site-branding, header .site-branding-text, header .site-identity { min-width: 0 !important; } /* TÍTULO PRINCIPAL */ header .site-title, header .site-title a { font-size: clamp(18px, 5vw, 23px) !important; line-height: 1.05 !important; letter-spacing: -0.3px !important; margin: 0 !important; padding: 0 !important; white-space: normal !important; overflow-wrap: normal !important; word-break: normal !important; max-width: 100% !important; } /* SUBTÍTULO / DESCRIPCIÓN */ header .site-description, header .site-tagline { font-size: clamp(11px, 3.1vw, 14px) !important; line-height: 1.15 !important; letter-spacing: 0 !important; margin-top: 3px !important; margin-bottom: 0 !important; padding: 0 !important; white-space: normal !important; max-width: 100% !important; } /* Evita separaciones excesivas */ header .site-title + .site-description, header .site-title + .site-tagline { margin-top: 3px !important; } } /* ========================================================== MÓVILES MUY PEQUEÑOS ========================================================== */ @media (max-width: 390px) { header .site-title, header .site-title a { font-size: 18px !important; line-height: 1.03 !important; } header .site-description, header .site-tagline { font-size: 11px !important; line-height: 1.12 !important; } }/* ========================================================== CABECERA MÓVIL TÍTULO + VERSÍCULO MÁS COMPACTOS ========================================================== */ @media (max-width: 767px) { /* BLOQUE DE TEXTO */ header .site-branding-text, header .site-identity { display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: flex-start !important; min-width: 0 !important; width: auto !important; max-width: 165px !important; height: auto !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; } /* TÍTULO */ header .site-title, header .site-title a { display: block !important; width: 145px !important; max-width: 145px !important; margin: 0 !important; padding: 0 !important; font-size: 18px !important; line-height: 1 !important; font-weight: 700 !important; text-align: left !important; text-align-last: left !important; letter-spacing: 0 !important; word-spacing: 0 !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; overflow: visible !important; } /* VERSÍCULO / SUBTÍTULO */ header .site-description, header .site-tagline { display: block !important; width: 150px !important; max-width: 150px !important; height: auto !important; max-height: none !important; margin: 3px 0 0 0 !important; padding: 0 !important; font-size: 9px !important; line-height: 1.08 !important; text-align: left !important; text-align-last: left !important; letter-spacing: 0 !important; word-spacing: 0 !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; overflow: visible !important; } /* ENLACE DEL TÍTULO */ header .site-title a { color: inherit !important; text-decoration: none !important; } } /* ========================================================== MÓVILES MUY ESTRECHOS ========================================================== */ @media (max-width: 390px) { header .site-branding-text, header .site-identity { max-width: 150px !important; } header .site-title, header .site-title a { width: 135px !important; max-width: 135px !important; font-size: 17px !important; line-height: 1 !important; } header .site-description, header .site-tagline { width: 140px !important; max-width: 140px !important; font-size: 8.5px !important; line-height: 1.07 !important; margin-top: 3px !important; } }/* ========================================================== ENTRADAS DEL BLOG FOLIO BLANCO TRANSPARENTE + TEXTURA DOBLEZ SUPERIOR IZQUIERDO + INFERIOR DERECHO ========================================================== */ /* ========================================================== 1. FOLIO GENERAL ========================================================== */ .entries article, .ct-posts-container article, article.post { position: relative !important; box-sizing: border-box !important; /* Transparencia */ background-color: rgba(255,255,255,.42) !important; /* Textura suave del papel */ background-image: /* ========================================================== FONDO DEL FOLIO TRANSPARENCIA + TEXTURA DE PAPEL ========================================================== */ background-color: rgba(255,255,255,.42) !important; background-image: /* Fibra horizontal muy fina */ repeating-linear-gradient( 0deg, rgba(30,45,55,.018) 0px, rgba(30,45,55,.018) 1px, transparent 1px, transparent 5px ), /* Fibra vertical irregular */ repeating-linear-gradient( 90deg, rgba(30,45,55,.009) 0px, rgba(30,45,55,.009) 1px, transparent 1px, transparent 11px ), /* Variaciones cálidas del papel */ radial-gradient( ellipse at 14% 18%, rgba(184,145,76,.045) 0%, transparent 28% ), radial-gradient( ellipse at 82% 26%, rgba(255,255,255,.16) 0%, transparent 31% ), radial-gradient( ellipse at 28% 76%, rgba(181,145,80,.035) 0%, transparent 30% ), radial-gradient( ellipse at 72% 82%, rgba(255,255,255,.13) 0%, transparent 34% ), /* Variación general de la hoja */ linear-gradient( 115deg, rgba(255,255,255,.08) 0%, transparent 27%, rgba(180,145,82,.018) 52%, transparent 72%, rgba(255,255,255,.06) 100% ) !important; /* Borde fino del folio */ border: 1px solid rgba(20,45,65,.11) !important; border-radius: 2px !important; padding: 34px 38px 42px !important; margin-bottom: 36px !important; /* Sombra exterior */ box-shadow: 0 2px 3px rgba(20,30,40,.045), 0 7px 16px rgba(20,30,40,.07), 0 20px 40px rgba(20,30,40,.09) !important; overflow: hidden !important; transition: transform .25s ease, box-shadow .25s ease !important; } /* ========================================================== 2. CONTENIDO POR ENCIMA DEL PAPEL ========================================================== */ .entries article > *, .ct-posts-container article > *, article.post > * { position: relative; z-index: 3; } /* ========================================================== 3. DOBLEZ SUPERIOR IZQUIERDO ENTRADA INDIVIDUAL ========================================================== */ article.post::before { content: "" !important; position: absolute !important; top: -1px !important; left: -1px !important; right: auto !important; bottom: auto !important; width: 38px !important; height: 38px !important; z-index: 10 !important; pointer-events: none !important; background: linear-gradient( 315deg, rgba(236,238,236,.18) 0%, rgba(245,245,241,.82) 45%, rgba(189,153,84,.18) 48%, rgba(219,199,157,.28) 52%, rgba(255,255,255,.94) 56%, rgba(255,255,255,.97) 100% ) !important; border-top: none !important; border-left: none !important; border-right: 1px solid rgba(171,132,57,.11) !important; border-bottom: 1px solid rgba(171,132,57,.15) !important; box-shadow: 4px 4px 8px rgba(30,40,50,.05) !important; } /* ========================================================== 4. DOBLEZ INFERIOR DERECHO ENTRADA INDIVIDUAL ========================================================== */ article.post::after { content: "" !important; position: absolute !important; right: -1px !important; bottom: -1px !important; top: auto !important; left: auto !important; width: 38px !important; height: 38px !important; z-index: 10 !important; pointer-events: none !important; background: linear-gradient( 135deg, rgba(236,238,236,.18) 0%, rgba(245,245,241,.82) 45%, rgba(189,153,84,.18) 48%, rgba(219,199,157,.28) 52%, rgba(255,255,255,.94) 56%, rgba(255,255,255,.97) 100% ) !important; border-right: none !important; border-bottom: none !important; border-top: 1px solid rgba(171,132,57,.15) !important; border-left: 1px solid rgba(171,132,57,.11) !important; box-shadow: -4px -4px 8px rgba(30,40,50,.05) !important; } /* ========================================================== 5. ÚLTIMAS ENTRADAS DOBLEZ SUPERIOR IZQUIERDO MEJORADO ========================================================== */ body:not(.single-post) .entries article::before, body:not(.single-post) .ct-posts-container article::before, body:not(.single-post) article.post::before { content: "" !important; position: absolute !important; top: -1px !important; left: -1px !important; right: auto !important; bottom: auto !important; width: 42px !important; height: 42px !important; z-index: 10 !important; pointer-events: none !important; /* Forma del pliegue */ clip-path: polygon( 0 0, 100% 0, 0 100% ); /* Papel doblado */ background: linear-gradient( 315deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.96) 38%, rgba(241,241,237,.94) 46%, rgba(199,166,102,.25) 49%, rgba(226,210,175,.38) 52%, rgba(247,247,243,.94) 58%, rgba(255,255,255,.98) 100% ) !important; border: none !important; box-shadow: 3px 4px 8px rgba(24,34,42,.08) !important; filter: drop-shadow( 2px 3px 2px rgba(25,35,45,.09) ); } /* ========================================================== 6. ÚLTIMAS ENTRADAS DOBLEZ INFERIOR DERECHO MEJORADO ========================================================== */ body:not(.single-post) .entries article::after, body:not(.single-post) .ct-posts-container article::after, body:not(.single-post) article.post::after { content: "" !important; position: absolute !important; right: -1px !important; bottom: -1px !important; top: auto !important; left: auto !important; width: 42px !important; height: 42px !important; z-index: 10 !important; pointer-events: none !important; clip-path: polygon( 100% 0, 100% 100%, 0 100% ); background: linear-gradient( 135deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.96) 38%, rgba(241,241,237,.94) 46%, rgba(199,166,102,.25) 49%, rgba(226,210,175,.38) 52%, rgba(247,247,243,.94) 58%, rgba(255,255,255,.98) 100% ) !important; border: none !important; box-shadow: -3px -4px 8px rgba(24,34,42,.08) !important; filter: drop-shadow( -2px -3px 2px rgba(25,35,45,.09) ); } /* ========================================================== 7. ÚLTIMAS ENTRADAS ANCHO NORMAL ========================================================== */ body:not(.single-post) .entries article, body:not(.single-post) .ct-posts-container article, body:not(.single-post) article.post { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } /* ========================================================== 8. ENTRADA INDIVIDUAL MÁS ANCHA EN ESCRITORIO ========================================================== */ @media (min-width: 1025px) { body.single-post article.post { width: calc(100% + 90px) !important; max-width: none !important; margin-left: -45px !important; margin-right: -45px !important; padding-left: 55px !important; padding-right: 55px !important; } } /* ========================================================== 9. DETALLE DORADO DEL TÍTULO ========================================================== */ .entries article .entry-title::before, .ct-posts-container article .entry-title::before, article.post .entry-title::before { content: ""; display: block; width: 42px; height: 2px; margin: 0 0 12px; background: linear-gradient( 90deg, #b47720, #e0bd70, transparent ); border-radius: 10px; } /* ========================================================== 10. TÍTULOS ========================================================== */ .entries article .entry-title, .ct-posts-container article .entry-title, article.post .entry-title { color: #071f3d !important; } .entries article .entry-title a, .ct-posts-container article .entry-title a, article.post .entry-title a { color: #071f3d !important; transition: color .2s ease !important; } .entries article .entry-title a:hover, .ct-posts-container article .entry-title a:hover, article.post .entry-title a:hover { color: #b47720 !important; } /* ========================================================== 11. TEXTO ========================================================== */ .entries article .entry-excerpt, .ct-posts-container article .entry-excerpt, article.post .entry-content { color: #344450 !important; } /* ========================================================== 12. METADATOS ========================================================== */ .entries article .entry-meta, .ct-posts-container article .entry-meta, article.post .entry-meta { color: #71808c !important; } /* ========================================================== 13. IMÁGENES ========================================================== */ .entries article img, .ct-posts-container article img, article.post img { border-radius: 2px; box-shadow: 0 3px 10px rgba(20,35,50,.08); } /* ========================================================== 14. HOVER ========================================================== */ @media (min-width: 769px) { .entries article:hover, .ct-posts-container article:hover, article.post:hover { transform: translateY(-2px); box-shadow: 0 2px 3px rgba(20,30,40,.04), 0 9px 20px rgba(20,30,40,.08), 0 22px 44px rgba(20,30,40,.10) !important; } } /* ========================================================== 15. TABLET / IPAD ========================================================== */ @media (min-width: 601px) and (max-width: 1024px) { .entries article, .ct-posts-container article, article.post { /* Más transparente */ background-color: rgba(255,255,255,.48) !important; padding: 30px 28px 36px !important; margin-bottom: 32px !important; } /* Entrada individual */ article.post::before, article.post::after { width: 33px !important; height: 33px !important; } /* Últimas Entradas */ body:not(.single-post) .entries article::before, body:not(.single-post) .ct-posts-container article::before, body:not(.single-post) article.post::before, body:not(.single-post) .entries article::after, body:not(.single-post) .ct-posts-container article::after, body:not(.single-post) article.post::after { width: 36px !important; height: 36px !important; } body.single-post article.post { width: calc(100% + 24px) !important; max-width: none !important; margin-left: -12px !important; margin-right: -12px !important; padding-left: 32px !important; padding-right: 32px !important; } } /* ========================================================== 16. MÓVIL ========================================================== */ @media (max-width: 600px) { .entries article, .ct-posts-container article, article.post { /* Transparente pero con buena lectura */ background-color: rgba(255,255,255,.54) !important; padding: 24px 20px 31px !important; margin-bottom: 26px !important; box-shadow: 0 2px 3px rgba(20,30,40,.04), 0 7px 18px rgba(20,30,40,.08) !important; } /* Entrada individual */ article.post::before, article.post::after { width: 29px !important; height: 29px !important; } /* Últimas Entradas */ body:not(.single-post) .entries article::before, body:not(.single-post) .ct-posts-container article::before, body:not(.single-post) article.post::before, body:not(.single-post) .entries article::after, body:not(.single-post) .ct-posts-container article::after, body:not(.single-post) article.post::after { width: 31px !important; height: 31px !important; } body.single-post article.post { width: calc(100% + 10px) !important; max-width: none !important; margin-left: -5px !important; margin-right: -5px !important; } .entries article .entry-title::before, .ct-posts-container article .entry-title::before, article.post .entry-title::before { width: 34px; margin-bottom: 10px; } } /* ========================================================== 17. MÓVILES PEQUEÑOS ========================================================== */ @media (max-width: 380px) { article.post::before, article.post::after { width: 25px !important; height: 25px !important; } body:not(.single-post) .entries article::before, body:not(.single-post) .ct-posts-container article::before, body:not(.single-post) article.post::before, body:not(.single-post) .entries article::after, body:not(.single-post) .ct-posts-container article::after, body:not(.single-post) article.post::after { width: 27px !important; height: 27px !important; } } /* ========================================================== 18. BARRA LATERAL / WIDGETS TRANSPARENTES DEJAR ESTE BLOQUE AL FINAL ========================================================== */ .ct-sidebar, .ct-sidebar-inner, aside.ct-sidebar, [data-sidebar], [data-sidebar] .ct-sidebar, [data-sidebar] .ct-sidebar-inner, .ct-sidebar .ct-widget, .ct-sidebar .widget, .ct-sidebar section.widget, .ct-sidebar .widget_block, .ct-sidebar .wp-block-group, .ct-sidebar .wp-block-group__inner-container, .ct-sidebar .wp-block-widget-group, .ct-sidebar > div, .ct-sidebar > section { background: transparent !important; background-color: transparent !important; background-image: none !important; border: none !important; box-shadow: none !important; } [data-sidebar], .ct-sidebar { --theme-background-color: transparent !important; --sidebar-background-color: transparent !important; } /* ========================================================== FORZAR TEXTURA EN LA ENTRADA ABIERTA ========================================================== */ body.single-post article.post, body.single-post .site-main article, body.single-post .entry-content, body.single-post .ct-container-full, body.single-post .ct-container { background-color: rgba(255,255,255,.42) !important; background-image: repeating-linear-gradient( 0deg, rgba(30,45,55,.018) 0px, rgba(30,45,55,.018) 1px, transparent 1px, transparent 5px ), repeating-linear-gradient( 90deg, rgba(30,45,55,.009) 0px, rgba(30,45,55,.009) 1px, transparent 1px, transparent 11px ), radial-gradient( ellipse at 14% 18%, rgba(184,145,76,.045), transparent 28% ), radial-gradient( ellipse at 82% 26%, rgba(255,255,255,.16), transparent 31% ), radial-gradient( ellipse at 28% 76%, rgba(181,145,80,.035), transparent 30% ), radial-gradient( ellipse at 72% 82%, rgba(255,255,255,.13), transparent 34% ), linear-gradient( 115deg, rgba(255,255,255,.08) 0%, transparent 27%, rgba(180,145,82,.018) 52%, transparent 72%, rgba(255,255,255,.06) 100% ) !important; } /* ========================================================== QUITAR FONDOS BLANCOS QUE PUEDAN TAPAR LA TEXTURA ========================================================== */ body.single-post .entry-content > *, body.single-post article.post > *, body.single-post .site-main article > * { background-color: transparent !important; } /* ========================================================== TABLET ========================================================== */ @media (min-width:601px) and (max-width:1024px) { body.single-post article.post, body.single-post .site-main article, body.single-post .entry-content { background-color: rgba(255,255,255,.48) !important; } } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:600px) { body.single-post article.post, body.single-post .site-main article, body.single-post .entry-content { background-color: rgba(255,255,255,.54) !important; } }/* ========================================================== ENTRADAS - EFECTO HOVER ELEGANTE ========================================================== */ /* TARJETA DE LA ENTRADA */ .home article, .home .post { transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease !important; } /* IMAGEN */ .home article img, .home .post img, .home .wp-post-image { transition: transform .45s cubic-bezier(.2,.8,.2,1), filter .35s ease !important; transform: scale(1); } /* ========================================================== AL PASAR EL RATÓN POR LA ENTRADA ========================================================== */ .home article:hover, .home .post:hover { transform: translateY(-6px) !important; box-shadow: 0 12px 28px rgba(40, 52, 60, .10), 0 4px 10px rgba(166, 128, 65, .08) !important; } /* ZOOM SUAVE DE LA IMAGEN */ .home article:hover img, .home .post:hover img, .home article:hover .wp-post-image, .home .post:hover .wp-post-image { transform: scale(1.045) !important; filter: brightness(1.03) contrast(1.02); } /* ========================================================== TÍTULO DE LA ENTRADA ========================================================== */ .home article h2, .home article h3, .home .post h2, .home .post h3 { transition: transform .30s ease, opacity .30s ease !important; } /* El título se desplaza muy ligeramente */ .home article:hover h2, .home article:hover h3, .home .post:hover h2, .home .post:hover h3 { transform: translateX(3px); } /* ========================================================== SOLO EN DISPOSITIVOS CON RATÓN ========================================================== */ @media (hover: hover) and (pointer: fine) { .home article:hover, .home .post:hover { transform: translateY(-6px) !important; } } /* ========================================================== MÓVIL / TABLET TÁCTIL Evitamos efectos molestos al tocar ========================================================== */ @media (hover: none) { .home article, .home .post, .home article img, .home .post img { transform: none !important; } } /* ========================================================== ENTRADAS RELACIONADAS — TARJETAS EDITORIALES ========================================================== */ #jp-relatedposts { margin: 3.5rem 0 1.5rem !important; padding-top: 2rem !important; border-top: 1px solid rgba(180, 119, 32, .28); } #jp-relatedposts .jp-relatedposts-headline { display: flex !important; align-items: center; gap: .75rem; width: 100% !important; margin: 0 0 1.4rem !important; color: var(--ates-navy, #071f3d); font-size: clamp(1.35rem, 2vw, 1.75rem) !important; } #jp-relatedposts .jp-relatedposts-headline::before { content: "✦"; color: var(--ates-gold, #b47720); font-size: .9em; } #jp-relatedposts .jp-relatedposts-headline em { font-style: normal !important; font-weight: 700 !important; } #jp-relatedposts .jp-relatedposts-items { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; width: 100% !important; } #jp-relatedposts .jp-relatedposts-post { position: relative; display: flex !important; flex-direction: column; width: auto !important; min-height: 195px; margin: 0 !important; padding: 1.35rem 1.25rem 1.15rem !important; overflow: hidden; border: 1px solid rgba(180, 119, 32, .22); border-radius: 14px; background: linear-gradient( 145deg, rgba(255, 255, 255, .98), rgba(246, 239, 224, .62) ); box-shadow: 0 8px 25px rgba(7, 31, 61, .08); transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; } #jp-relatedposts .jp-relatedposts-post::before { content: "📖"; display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 1rem; border-radius: 50%; background: rgba(180, 119, 32, .12); font-size: 17px; } #jp-relatedposts .jp-relatedposts-post::after { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient( 90deg, var(--ates-gold, #b47720), var(--ates-gold-light, #d4a14c) ); } #jp-relatedposts .jp-relatedposts-post:hover { transform: translateY(-4px); border-color: rgba(180, 119, 32, .48); box-shadow: 0 14px 34px rgba(7, 31, 61, .14); } #jp-relatedposts .jp-relatedposts-post-title { display: block; margin-bottom: .8rem; line-height: 1.4; } #jp-relatedposts .jp-relatedposts-post-a { color: var(--ates-navy, #071f3d) !important; font-size: 1.02rem !important; font-weight: 700 !important; text-decoration: none !important; } #jp-relatedposts .jp-relatedposts-post-a:hover { color: var(--ates-gold, #b47720) !important; } #jp-relatedposts .jp-relatedposts-post-context { display: inline-flex !important; align-self: flex-start; order: 2; padding: .28rem .65rem; border-radius: 999px; background: rgba(7, 31, 61, .07); color: var(--ates-navy-soft, #0a3150) !important; font-size: .72rem !important; font-weight: 600; } #jp-relatedposts .jp-relatedposts-post-date { order: 3; margin-top: auto; padding-top: .85rem; color: #687180 !important; font-size: .78rem !important; } /* Modo oscuro */ [data-color-mode="dark"] #jp-relatedposts .jp-relatedposts-headline, [data-color-mode="dark"] #jp-relatedposts .jp-relatedposts-post-a { color: #f6efe0 !important; } [data-color-mode="dark"] #jp-relatedposts .jp-relatedposts-post { border-color: rgba(212, 161, 76, .28); background: linear-gradient( 145deg, rgba(10, 49, 80, .98), rgba(7, 31, 61, .98) ); box-shadow: 0 10px 30px rgba(0, 0, 0, .25); } [data-color-mode="dark"] #jp-relatedposts .jp-relatedposts-post-context { background: rgba(212, 161, 76, .16); color: #f1d49e !important; } [data-color-mode="dark"] #jp-relatedposts .jp-relatedposts-post-date { color: #c8ced6 !important; } /* Tabletas y móviles */ @media (max-width: 900px) { #jp-relatedposts .jp-relatedposts-items { grid-template-columns: 1fr; } #jp-relatedposts .jp-relatedposts-post { min-height: 0; } } @media (prefers-reduced-motion: reduce) { #jp-relatedposts .jp-relatedposts-post { transition: none; } }/* Fotografías en las entradas relacionadas */ #jp-relatedposts .jp-relatedposts-post { padding: 0 0 1.15rem !important; } #jp-relatedposts .jp-relatedposts-post::before { display: none; } #jp-relatedposts .jp-relatedposts-post-thumbs { display: block !important; margin: 0 !important; } #jp-relatedposts .jp-relatedposts-post-img { display: block !important; width: 100% !important; height: 175px !important; margin: 0 0 1.15rem !important; border-radius: 13px 13px 0 0; object-fit: cover; transition: transform .35s ease; } #jp-relatedposts .jp-relatedposts-post:hover .jp-relatedposts-post-img { transform: scale(1.035); } #jp-relatedposts .jp-relatedposts-post-title, #jp-relatedposts .jp-relatedposts-post-context, #jp-relatedposts .jp-relatedposts-post-date { margin-right: 1.25rem !important; margin-left: 1.25rem !important; } @media (max-width: 900px) { #jp-relatedposts .jp-relatedposts-post-img { height: 210px !important; } }/* ========================================================== ETIQUETAS — DISEÑO EDITORIAL ========================================================== */ .entry-tags, .ct-post-tags, .tags-links { display: flex !important; flex-wrap: wrap; align-items: center; gap: .55rem; margin-top: 2rem; } .entry-tags a, .ct-post-tags a, .tags-links a { display: inline-flex !important; align-items: center; gap: .35rem; margin: 0 !important; padding: .42rem .8rem !important; border: 1px solid rgba(180, 119, 32, .28) !important; border-radius: 999px !important; background: rgba(246, 239, 224, .58) !important; color: var(--ates-navy-soft, #0a3150) !important; font-size: .76rem !important; font-weight: 600 !important; line-height: 1.25 !important; text-decoration: none !important; box-shadow: none !important; transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease; } .entry-tags a::before, .ct-post-tags a::before, .tags-links a::before { content: "#"; color: var(--ates-gold, #b47720); font-weight: 700; } .entry-tags a:hover, .ct-post-tags a:hover, .tags-links a:hover { transform: translateY(-2px); border-color: var(--ates-gold, #b47720) !important; background: var(--ates-navy, #071f3d) !important; color: #fff !important; } .entry-tags a:hover::before, .ct-post-tags a:hover::before, .tags-links a:hover::before { color: var(--ates-gold-light, #d4a14c); } /* Modo oscuro */ [data-color-mode="dark"] .entry-tags a, [data-color-mode="dark"] .ct-post-tags a, [data-color-mode="dark"] .tags-links a { border-color: rgba(212, 161, 76, .3) !important; background: rgba(212, 161, 76, .1) !important; color: #f6efe0 !important; } /* Móvil */ @media (max-width: 600px) { .entry-tags, .ct-post-tags, .tags-links { gap: .42rem; } .entry-tags a, .ct-post-tags a, .tags-links a { padding: .38rem .68rem !important; font-size: .72rem !important; } }/* ========================================================== SUSCRIPCIÓN EN EL PIE DE PÁGINA ========================================================== */ footer .wp-block-jetpack-subscriptions, footer .jetpack_subscription_widget, footer .widget_blog_subscription { max-width: 850px; margin: -1rem auto 2rem; padding: 0 2rem 2rem; border: 1px solid rgba(212, 161, 76, .38); border-top: 0; border-radius: 0 0 18px 18px; background: rgba(246, 239, 224, .96); box-shadow: 0 18px 45px rgba(3, 18, 36, .24); text-align: center; } footer .wp-block-jetpack-subscriptions form, footer .jetpack_subscription_widget form, footer .widget_blog_subscription form { display: flex; justify-content: center; gap: .7rem; max-width: 620px; margin: 1rem auto 0; } footer .wp-block-jetpack-subscriptions input[type="email"], footer .jetpack_subscription_widget input[type="email"], footer .widget_blog_subscription input[type="email"] { flex: 1; min-width: 0; padding: .8rem 1rem !important; border: 1px solid rgba(7, 31, 61, .18) !important; border-radius: 10px !important; background: #fff !important; color: #071f3d !important; } footer .wp-block-jetpack-subscriptions button, footer .wp-block-jetpack-subscriptions input[type="submit"], footer .jetpack_subscription_widget input[type="submit"], footer .widget_blog_subscription input[type="submit"] { padding: .8rem 1.2rem !important; border: 0 !important; border-radius: 10px !important; background: var(--ates-gold, #b47720) !important; color: #fff !important; font-weight: 700 !important; cursor: pointer; transition: transform .2s ease, background-color .2s ease; } footer .wp-block-jetpack-subscriptions button:hover, footer .wp-block-jetpack-subscriptions input[type="submit"]:hover, footer .jetpack_subscription_widget input[type="submit"]:hover, footer .widget_blog_subscription input[type="submit"]:hover { transform: translateY(-2px); background: var(--ates-navy, #071f3d) !important; } @media (max-width: 650px) { footer .wp-block-jetpack-subscriptions, footer .jetpack_subscription_widget, footer .widget_blog_subscription { padding: 0 1.2rem 1.5rem; } footer .wp-block-jetpack-subscriptions form, footer .jetpack_subscription_widget form, footer .widget_blog_subscription form { flex-direction: column; } footer .wp-block-jetpack-subscriptions button, footer .wp-block-jetpack-subscriptions input[type="submit"], footer .jetpack_subscription_widget input[type="submit"], footer .widget_blog_subscription input[type="submit"] { width: 100%; } }/* ========================================================== CONTACTO Y SUSCRIPCIÓN — AZUL APAGADO ========================================================== */ .ates-footer-contact { border-color: rgba(194, 151, 84, .24); background: linear-gradient( 145deg, rgba(20, 48, 70, .88), rgba(9, 35, 57, .82) ); box-shadow: 0 18px 45px rgba(3, 18, 32, .22), inset 0 1px 0 rgba(255, 255, 255, .06); color: #e8edf1; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } .ates-footer-contact::before { background: linear-gradient( 90deg, transparent, rgba(194, 151, 84, .7), transparent ); } .ates-footer-contact__icon { border-color: rgba(194, 151, 84, .25); background: rgba(194, 151, 84, .1); color: #cba66c; } .ates-footer-contact__eyebrow { color: #cba66c; } .ates-footer-contact h2 { color: #f1f3f5; } .ates-footer-contact p { color: rgba(232, 237, 241, .75); } .ates-footer-contact__email { border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .09); color: #f4f5f6 !important; } .ates-footer-contact__email:hover { border-color: rgba(203, 166, 108, .5); background: rgba(194, 151, 84, .8); } /* Formulario de suscripción */ footer .wp-block-jetpack-subscriptions, footer .jetpack_subscription_widget, footer .widget_blog_subscription { border-color: rgba(194, 151, 84, .24); background: linear-gradient( 145deg, rgba(20, 48, 70, .88), rgba(9, 35, 57, .82) ); box-shadow: 0 18px 45px rgba(3, 18, 32, .22); color: rgba(232, 237, 241, .78); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } footer .wp-block-jetpack-subscriptions h2, footer .wp-block-jetpack-subscriptions h3, footer .jetpack_subscription_widget h2, footer .jetpack_subscription_widget h3, footer .widget_blog_subscription h2, footer .widget_blog_subscription h3 { color: #f1f3f5 !important; } footer .wp-block-jetpack-subscriptions input[type="email"], footer .jetpack_subscription_widget input[type="email"], footer .widget_blog_subscription input[type="email"] { border-color: rgba(255, 255, 255, .12) !important; background: rgba(255, 255, 255, .92) !important; } footer .wp-block-jetpack-subscriptions button, footer .wp-block-jetpack-subscriptions input[type="submit"], footer .jetpack_subscription_widget input[type="submit"], footer .widget_blog_subscription input[type="submit"] { background: #987343 !important; } footer .wp-block-jetpack-subscriptions button:hover, footer .wp-block-jetpack-subscriptions input[type="submit"]:hover, footer .jetpack_subscription_widget input[type="submit"]:hover, footer .widget_blog_subscription input[type="submit"]:hover { background: #b18a55 !important; }/* ========================================================== PIE DE PÁGINA — FORMATO HORIZONTAL Y COMPACTO ========================================================== */ .ates-footer-contact { grid-template-columns: 52px minmax(0, 1fr); gap: 1.1rem; max-width: 1100px; min-height: 0; margin: 1.2rem auto .7rem; padding: 1.15rem 1.5rem; border-radius: 14px; } .ates-footer-contact__icon { width: 52px; height: 52px; margin: 0; font-size: 1.25rem; } .ates-footer-contact__content { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto auto; column-gap: 1.5rem; align-items: center; } .ates-footer-contact__eyebrow { grid-column: 1; grid-row: 1; margin: 0 0 .15rem; font-size: .66rem; } .ates-footer-contact h2 { grid-column: 1; grid-row: 2; margin: 0 0 .2rem; font-size: clamp(1.1rem, 2vw, 1.45rem); } .ates-footer-contact p { grid-column: 1; grid-row: 3; max-width: 650px; margin: 0; font-size: .84rem; line-height: 1.45; } .ates-footer-contact__email { grid-column: 2; grid-row: 1 / 4; align-self: center; justify-self: end; padding: .68rem .9rem; white-space: nowrap; font-size: .8rem; } /* Suscripción más baja y alargada */ footer .wp-block-jetpack-subscriptions, footer .jetpack_subscription_widget, footer .widget_blog_subscription { max-width: 1100px; margin: .7rem auto 1.4rem; padding: 1rem 1.5rem; border: 1px solid rgba(194, 151, 84, .24); border-radius: 14px; } footer .wp-block-jetpack-subscriptions h2, footer .wp-block-jetpack-subscriptions h3, footer .jetpack_subscription_widget h2, footer .jetpack_subscription_widget h3, footer .widget_blog_subscription h2, footer .widget_blog_subscription h3 { margin: 0 0 .25rem !important; font-size: 1.15rem !important; } footer .wp-block-jetpack-subscriptions p, footer .jetpack_subscription_widget p, footer .widget_blog_subscription p { margin: 0 0 .65rem !important; font-size: .82rem; line-height: 1.4; } footer .wp-block-jetpack-subscriptions form, footer .jetpack_subscription_widget form, footer .widget_blog_subscription form { max-width: 760px; margin: .6rem auto 0; } footer .wp-block-jetpack-subscriptions input[type="email"], footer .jetpack_subscription_widget input[type="email"], footer .widget_blog_subscription input[type="email"], footer .wp-block-jetpack-subscriptions button, footer .wp-block-jetpack-subscriptions input[type="submit"], footer .jetpack_subscription_widget input[type="submit"], footer .widget_blog_subscription input[type="submit"] { min-height: 42px !important; padding-top: .55rem !important; padding-bottom: .55rem !important; } /* Adaptación para móvil */ @media (max-width: 760px) { .ates-footer-contact { grid-template-columns: 42px minmax(0, 1fr); padding: 1rem; } .ates-footer-contact__icon { width: 42px; height: 42px; } .ates-footer-contact__content { grid-template-columns: 1fr; } .ates-footer-contact__eyebrow, .ates-footer-contact h2, .ates-footer-contact p, .ates-footer-contact__email { grid-column: 1; grid-row: auto; } .ates-footer-contact__email { justify-self: stretch; justify-content: center; margin-top: .75rem; white-space: normal; } footer .wp-block-jetpack-subscriptions, footer .jetpack_subscription_widget, footer .widget_blog_subscription { margin-right: .75rem; margin-left: .75rem; padding: 1rem; } }/* ========================================================== ARTÍCULOS VARIOS A TRAVÉS DE LAS ESCRITURAS ========================================================== */ /* ========================================================== CONTENEDOR GENERAL ========================================================== */ html.ates-articulos-varios-page .entry-content { width: 100%; max-width: 1180px; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box; } /* ========================================================== CABECERA AZUL ========================================================== */ html.ates-articulos-varios-page .ates-library-intro { position: relative; overflow: hidden; width: 100%; max-width: 1180px; margin: 0 auto 38px !important; padding: 45px 48px 35px; box-sizing: border-box; border-radius: 16px; background: radial-gradient( circle at 72% 15%, rgba(201,144,37,.22), transparent 38% ), linear-gradient( 135deg, #061c33 0%, #092a4a 52%, #0d3b64 100% ); color: #fff; box-shadow: 0 12px 32px rgba(8,35,62,.14); } /* Línea dorada superior */ html.ates-articulos-varios-page .ates-library-intro::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient( 90deg, transparent, #bd8421, #e0b35a, #bd8421, transparent ); } /* Decoración suave de fondo */ html.ates-articulos-varios-page .ates-library-intro::after { content: "✦"; position: absolute; right: 3%; bottom: -70px; color: rgba(218,169,70,.07); font-size: 220px; pointer-events: none; } /* ========================================================== CABECERA: TEXTO A LA IZQUIERDA + LOGO HACIA EL CENTRO ========================================================== */ html.ates-articulos-varios-page .ates-library-header-row { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: center; gap: 28px; } /* Zona de texto */ html.ates-articulos-varios-page .ates-library-header-text { min-width: 0; } /* BIBLIOTECA DE ESTUDIOS */ html.ates-articulos-varios-page .ates-library-kicker { margin-bottom: 8px; color: #dda83e; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; } /* ARTÍCULOS VARIOS */ html.ates-articulos-varios-page .ates-library-title { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: #ffffff !important; font-family: Georgia, "Times New Roman", serif; font-size: clamp(36px, 5vw, 59px) !important; font-weight: 700; line-height: 1.08 !important; letter-spacing: -.02em; } /* Quitar decoraciones heredadas */ html.ates-articulos-varios-page .ates-library-title::before, html.ates-articulos-varios-page .ates-library-title::after { display: none !important; } /* Descripción */ html.ates-articulos-varios-page .ates-library-description { max-width: 620px; margin: 18px 0 0 !important; color: rgba(255,255,255,.88); font-size: 16px; line-height: 1.7; } /* ========================================================== LOGO MÁS HACIA LA IZQUIERDA / ZONA CENTRAL ========================================================== */ html.ates-articulos-varios-page .ates-library-logo-wrap { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; width: 180px; /* Valor principal: desplaza el logo hacia la izquierda */ transform: translateX(-100px); } html.ates-articulos-varios-page .ates-library-side-logo { display: block; width: 165px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow( 0 6px 15px rgba(0,0,0,.28) ); } /* ========================================================== BUSCADOR ========================================================== */ html.ates-articulos-varios-page .ates-library-search { position: relative; z-index: 3; width: 100%; max-width: 690px; margin-top: 29px; } html.ates-articulos-varios-page .ates-library-search input { display: block; width: 100%; min-height: 52px; padding: 0 20px 0 49px; box-sizing: border-box; border: 1px solid rgba(255,255,255,.32); border-radius: 8px; background: rgba(3,20,36,.52); color: #fff; font-size: 15px; outline: none; box-shadow: inset 0 1px 2px rgba(0,0,0,.08); transition: border-color .2s ease, background .2s ease; } html.ates-articulos-varios-page .ates-library-search input::placeholder { color: rgba(255,255,255,.64); } html.ates-articulos-varios-page .ates-library-search input:focus { border-color: #d6a343; background: rgba(3,20,36,.72); } /* Icono buscar */ html.ates-articulos-varios-page .ates-search-symbol { position: absolute; left: 17px; top: 50%; transform: translateY(-50%); color: #d5a044; font-size: 25px; line-height: 1; pointer-events: none; } /* ========================================================== TÍTULOS DE CATEGORÍAS ========================================================== */ html.ates-articulos-varios-page .entry-content > h2:not(.ates-library-title), html.ates-articulos-varios-page .entry-content > h3:not(.ates-library-title), html.ates-articulos-varios-page .entry-content > h4:not(.ates-library-title) { position: relative; width: 100%; max-width: 1100px; box-sizing: border-box; margin: 44px auto 0 !important; padding: 21px 25px 20px; border: 1px solid #173d5d; border-radius: 12px 12px 0 0; background: linear-gradient( 135deg, #071f38, #0d385e ); color: #fff !important; font-family: Georgia, "Times New Roman", serif; font-size: clamp(21px, 2.5vw, 28px); font-weight: 700; line-height: 1.25; box-shadow: 0 7px 24px rgba(8,35,62,.08); } /* Línea dorada de categorías */ html.ates-articulos-varios-page .entry-content > h2:not(.ates-library-title)::after, html.ates-articulos-varios-page .entry-content > h3:not(.ates-library-title)::after, html.ates-articulos-varios-page .entry-content > h4:not(.ates-library-title)::after { content: ""; position: absolute; left: 25px; bottom: 9px; width: 55px; height: 2px; background: #ca922d; } /* ========================================================== LISTAS DE ARTÍCULOS ========================================================== */ html.ates-articulos-varios-page .entry-content > ul { list-style: none !important; width: 100%; max-width: 1100px; box-sizing: border-box; margin: 0 auto 37px !important; padding: 12px 23px 19px !important; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 29px; background: #fff; border: 1px solid #e0e5e9; border-top: 0; border-radius: 0 0 12px 12px; box-shadow: 0 9px 27px rgba(8,35,62,.06); } /* Cada artículo */ html.ates-articulos-varios-page .entry-content > ul > li { position: relative; margin: 0 !important; padding: 0 !important; border-bottom: 1px solid #edf0f2; } /* Enlaces */ html.ates-articulos-varios-page .entry-content > ul > li > a { position: relative; display: block; padding: 13px 32px 13px 3px; color: #163754 !important; font-size: 14.5px; line-height: 1.45; font-weight: 500; text-decoration: none !important; transition: color .18s ease, padding-left .18s ease; } /* Flecha */ html.ates-articulos-varios-page .entry-content > ul > li > a::after { content: "›"; position: absolute; right: 7px; top: 50%; transform: translateY(-50%); color: #c68d24; font-family: Georgia, "Times New Roman", serif; font-size: 24px; line-height: 1; } /* Hover */ html.ates-articulos-varios-page .entry-content > ul > li > a:hover { color: #a66d0b !important; padding-left: 8px; } /* Ocultar separadores */ html.ates-articulos-varios-page .entry-content > hr { display: none; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-articulos-varios-page[data-theme="dark"] .entry-content > ul, html.ates-articulos-varios-page.dark .entry-content > ul, html.ates-articulos-varios-page.ates-dark .entry-content > ul { background: #101c27; border-color: #293947; } html.ates-articulos-varios-page[data-theme="dark"] .entry-content > ul > li, html.ates-articulos-varios-page.dark .entry-content > ul > li, html.ates-articulos-varios-page.ates-dark .entry-content > ul > li { border-color: #263745; } html.ates-articulos-varios-page[data-theme="dark"] .entry-content > ul > li > a, html.ates-articulos-varios-page.dark .entry-content > ul > li > a, html.ates-articulos-varios-page.ates-dark .entry-content > ul > li > a { color: #e7edf2 !important; } html.ates-articulos-varios-page[data-theme="dark"] .entry-content > ul > li > a:hover, html.ates-articulos-varios-page.dark .entry-content > ul > li > a:hover, html.ates-articulos-varios-page.ates-dark .entry-content > ul > li > a:hover { color: #e0b35a !important; } /* ========================================================== TABLET ========================================================== */ @media (max-width: 900px) { html.ates-articulos-varios-page .ates-library-intro { padding: 40px 32px 32px; } html.ates-articulos-varios-page .ates-library-header-row { grid-template-columns: minmax(0,1fr) 135px; gap: 15px; } html.ates-articulos-varios-page .ates-library-logo-wrap { width: 135px; /* Menos desplazamiento en tablet */ transform: translateX(-55px); } html.ates-articulos-varios-page .ates-library-side-logo { width: 130px; } } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 680px) { html.ates-articulos-varios-page .entry-content { width: 100%; max-width: 100%; padding-left: 12px; padding-right: 12px; box-sizing: border-box; } html.ates-articulos-varios-page .ates-library-intro { width: 100%; max-width: 100%; margin-bottom: 29px !important; padding: 29px 19px 25px; border-radius: 11px; } /* En móvil no desplazamos demasiado el logo para que no choque con el título. */ html.ates-articulos-varios-page .ates-library-header-row { grid-template-columns: minmax(0,1fr) 72px; align-items: center; gap: 8px; } html.ates-articulos-varios-page .ates-library-logo-wrap { width: 72px; transform: translateX(-10px); } html.ates-articulos-varios-page .ates-library-side-logo { width: 72px; } html.ates-articulos-varios-page .ates-library-kicker { margin-bottom: 5px; font-size: 10px; letter-spacing: .10em; } html.ates-articulos-varios-page .ates-library-title { font-size: 29px !important; line-height: 1.08 !important; } html.ates-articulos-varios-page .ates-library-description { margin-top: 11px !important; font-size: 13.5px; line-height: 1.55; } /* Buscador */ html.ates-articulos-varios-page .ates-library-search { width: 100%; max-width: 100%; margin-top: 21px; } html.ates-articulos-varios-page .ates-library-search input { min-height: 48px; padding-left: 43px; font-size: 13px; } html.ates-articulos-varios-page .ates-search-symbol { left: 14px; font-size: 22px; } /* Categorías */ html.ates-articulos-varios-page .entry-content > h2:not(.ates-library-title), html.ates-articulos-varios-page .entry-content > h3:not(.ates-library-title), html.ates-articulos-varios-page .entry-content > h4:not(.ates-library-title) { width: 100%; max-width: 100%; margin-top: 31px !important; padding: 18px 17px 17px; border-radius: 9px 9px 0 0; font-size: 21px; } html.ates-articulos-varios-page .entry-content > h2:not(.ates-library-title)::after, html.ates-articulos-varios-page .entry-content > h3:not(.ates-library-title)::after, html.ates-articulos-varios-page .entry-content > h4:not(.ates-library-title)::after { left: 17px; } /* Una columna de artículos */ html.ates-articulos-varios-page .entry-content > ul { width: 100%; max-width: 100%; grid-template-columns: 1fr; padding: 7px 16px 14px !important; border-radius: 0 0 9px 9px; } html.ates-articulos-varios-page .entry-content > ul > li > a { padding: 12px 27px 12px 2px; font-size: 14px; } } /* ========================================================== MÓVILES PEQUEÑOS ========================================================== */ @media (max-width: 390px) { html.ates-articulos-varios-page .ates-library-header-row { grid-template-columns: minmax(0,1fr) 62px; } html.ates-articulos-varios-page .ates-library-logo-wrap { width: 62px; transform: translateX(-6px); } html.ates-articulos-varios-page .ates-library-side-logo { width: 62px; } html.ates-articulos-varios-page .ates-library-title { font-size: 25px !important; } html.ates-articulos-varios-page .ates-library-description { font-size: 12.5px; } }/* ========================================================== ESTUDIOS VARIOS PÁGINA ID 7519 DISEÑO COMPLETO ========================================================== */ /* ========================================================== CABECERA AZUL ========================================================== */ html.ates-estudios-varios-page .ates-estudios-hero { position: relative; overflow: hidden; width: calc(100% - 40px); max-width: 1180px; /* Separación respecto al menú */ margin: 40px auto 18px !important; padding: 46px 48px 40px; box-sizing: border-box; border-radius: 16px; background: radial-gradient( circle at 72% 15%, rgba(201,144,37,.22), transparent 38% ), linear-gradient( 135deg, #061c33 0%, #092a4a 52%, #0d3b64 100% ); color: #ffffff; box-shadow: 0 12px 32px rgba(8,35,62,.15); } /* ========================================================== LÍNEA DORADA SUPERIOR ========================================================== */ html.ates-estudios-varios-page .ates-estudios-hero::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient( 90deg, transparent, #bd8421, #e0b35a, #bd8421, transparent ); } /* ========================================================== DECORACIÓN DE FONDO ========================================================== */ html.ates-estudios-varios-page .ates-estudios-hero::after { content: "✦"; position: absolute; right: 4%; bottom: -76px; font-size: 230px; color: rgba(218,169,70,.055); pointer-events: none; } /* ========================================================== INTERIOR DE LA CABECERA ========================================================== */ html.ates-estudios-varios-page .ates-estudios-hero-row { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr) 180px; align-items: center; gap: 30px; } html.ates-estudios-varios-page .ates-estudios-hero-text { min-width: 0; } /* ========================================================== TEXTO SUPERIOR ========================================================== */ html.ates-estudios-varios-page .ates-estudios-kicker { margin: 0 0 9px; color: #dda83e; font-size: 13px; font-weight: 700; line-height: 1.25; letter-spacing: .14em; text-transform: uppercase; } /* ========================================================== TÍTULO ========================================================== */ html.ates-estudios-varios-page .ates-estudios-title { margin: 0 !important; padding: 0 !important; color: #ffffff !important; background: transparent !important; border: 0 !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(38px,5vw,59px) !important; font-weight: 700 !important; line-height: 1.08 !important; letter-spacing: -.02em !important; } html.ates-estudios-varios-page .ates-estudios-title::before, html.ates-estudios-varios-page .ates-estudios-title::after { display: none !important; } /* ========================================================== DESCRIPCIÓN ========================================================== */ html.ates-estudios-varios-page .ates-estudios-description { max-width: 620px; margin: 18px 0 0 !important; color: rgba(255,255,255,.88); font-size: 16px; line-height: 1.7; } /* ========================================================== LOGO ========================================================== */ html.ates-estudios-varios-page .ates-estudios-logo-wrap { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; width: 180px; transform: translateX(-95px); } html.ates-estudios-varios-page .ates-estudios-logo { display: block; width: 165px; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow( 0 7px 16px rgba(0,0,0,.28) ); } /* ========================================================== CONTENIDO DE ESTUDIOS VARIOS MUY CERCA DE LA CABECERA, PERO CON UN LIGERO ESPACIO ========================================================== */ body.page-id-7519 .entry-content { max-width: 1180px; margin: -8px auto 0 !important; padding-top: 0 !important; padding-bottom: 35px; } /* ========================================================== PRIMER ELEMENTO DEL CONTENIDO ========================================================== */ body.page-id-7519 .entry-content > :first-child { margin-top: 8px !important; } /* ========================================================== TÍTULOS DE LAS SECCIONES ESTILO ARTÍCULOS VARIOS ========================================================== */ body.page-id-7519 .entry-content > h2, body.page-id-7519 .entry-content > h3, body.page-id-7519 .entry-content > h4 { position: relative; clear: both; margin: 28px 0 15px !important; padding: 0 0 11px 18px !important; color: #092a4a !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid rgba(9,42,74,.13) !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(23px,3vw,30px) !important; font-weight: 700 !important; line-height: 1.25 !important; } /* ========================================================== PRIMER TÍTULO ========================================================== */ body.page-id-7519 .entry-content > h2:first-child, body.page-id-7519 .entry-content > h3:first-child, body.page-id-7519 .entry-content > h4:first-child { margin-top: 8px !important; } /* ========================================================== RAYA DORADA ========================================================== */ body.page-id-7519 .entry-content > h2::before, body.page-id-7519 .entry-content > h3::before, body.page-id-7519 .entry-content > h4::before { content: ""; position: absolute; left: 0; top: 4px; width: 4px; height: calc(100% - 15px); min-height: 24px; border-radius: 4px; background: linear-gradient( 180deg, #e0b35a, #b47b19 ); } body.page-id-7519 .entry-content > h2::after, body.page-id-7519 .entry-content > h3::after, body.page-id-7519 .entry-content > h4::after { display: none !important; } /* ========================================================== LISTAS DE ESTUDIOS ========================================================== */ body.page-id-7519 .entry-content > ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 18px; margin: 0 0 27px !important; padding: 18px 20px !important; list-style: none !important; background: #ffffff; border: 1px solid rgba(9,42,74,.10); border-radius: 13px; box-shadow: 0 5px 18px rgba(9,42,74,.055); } /* ========================================================== ELEMENTOS DE LAS LISTAS ========================================================== */ body.page-id-7519 .entry-content > ul > li { position: relative; margin: 0 !important; padding: 10px 10px 10px 24px !important; border-radius: 8px; line-height: 1.5; transition: background .2s ease, transform .2s ease; } /* ========================================================== PUNTO DORADO ========================================================== */ body.page-id-7519 .entry-content > ul > li::before { content: ""; position: absolute; left: 7px; top: 19px; width: 6px; height: 6px; border-radius: 50%; background: #c8922d; } /* ========================================================== ENLACES ========================================================== */ body.page-id-7519 .entry-content > ul > li > a { color: #173956 !important; text-decoration: none !important; font-weight: 600; transition: color .2s ease; } body.page-id-7519 .entry-content > ul > li:hover { background: rgba(9,42,74,.045); transform: translateX(2px); } body.page-id-7519 .entry-content > ul > li:hover > a { color: #b77b17 !important; } /* ========================================================== PÁRRAFOS ========================================================== */ body.page-id-7519 .entry-content > p { max-width: 900px; color: #4b5661; font-size: 16px; line-height: 1.75; } /* ========================================================== SEPARADORES ========================================================== */ body.page-id-7519 .entry-content > hr { margin: 30px 0 !important; border: 0 !important; height: 1px; background: linear-gradient( 90deg, transparent, rgba(9,42,74,.18), transparent ); } /* ========================================================== MODO OSCURO TÍTULOS ========================================================== */ html[data-theme="dark"] body.page-id-7519 .entry-content > h2, html[data-theme="dark"] body.page-id-7519 .entry-content > h3, html[data-theme="dark"] body.page-id-7519 .entry-content > h4, html.dark body.page-id-7519 .entry-content > h2, html.dark body.page-id-7519 .entry-content > h3, html.dark body.page-id-7519 .entry-content > h4, html.ates-dark body.page-id-7519 .entry-content > h2, html.ates-dark body.page-id-7519 .entry-content > h3, html.ates-dark body.page-id-7519 .entry-content > h4 { color: #f4f6f8 !important; border-bottom-color: rgba(255,255,255,.12) !important; } /* ========================================================== MODO OSCURO LISTAS ========================================================== */ html[data-theme="dark"] body.page-id-7519 .entry-content > ul, html.dark body.page-id-7519 .entry-content > ul, html.ates-dark body.page-id-7519 .entry-content > ul { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.09); box-shadow: none; } html[data-theme="dark"] body.page-id-7519 .entry-content > ul > li > a, html.dark body.page-id-7519 .entry-content > ul > li > a, html.ates-dark body.page-id-7519 .entry-content > ul > li > a { color: #e7edf2 !important; } html[data-theme="dark"] body.page-id-7519 .entry-content > ul > li:hover, html.dark body.page-id-7519 .entry-content > ul > li:hover, html.ates-dark body.page-id-7519 .entry-content > ul > li:hover { background: rgba(255,255,255,.055); } html[data-theme="dark"] body.page-id-7519 .entry-content > ul > li:hover > a, html.dark body.page-id-7519 .entry-content > ul > li:hover > a, html.ates-dark body.page-id-7519 .entry-content > ul > li:hover > a { color: #e0b35a !important; } /* ========================================================== MODO OSCURO PÁRRAFOS ========================================================== */ html[data-theme="dark"] body.page-id-7519 .entry-content > p, html.dark body.page-id-7519 .entry-content > p, html.ates-dark body.page-id-7519 .entry-content > p { color: rgba(255,255,255,.76); } /* ========================================================== TABLET ========================================================== */ @media (max-width:900px) { html.ates-estudios-varios-page .ates-estudios-hero { margin: 34px auto 16px !important; padding: 40px 32px 34px; } html.ates-estudios-varios-page .ates-estudios-hero-row { grid-template-columns: minmax(0,1fr) 135px; gap: 16px; } html.ates-estudios-varios-page .ates-estudios-logo-wrap { width: 135px; transform: translateX(-50px); } html.ates-estudios-varios-page .ates-estudios-logo { width: 130px; } body.page-id-7519 .entry-content { margin-top: -6px !important; } } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:680px) { html.ates-estudios-varios-page .ates-estudios-hero { width: calc(100% - 24px); /* Separación de la cabecera respecto al menú */ margin: 26px auto 12px !important; padding: 29px 18px 26px; border-radius: 11px; } html.ates-estudios-varios-page .ates-estudios-hero-row { grid-template-columns: minmax(0,1fr) 72px; gap: 8px; } html.ates-estudios-varios-page .ates-estudios-logo-wrap { width: 72px; transform: translateX(-8px); } html.ates-estudios-varios-page .ates-estudios-logo { width: 72px; } html.ates-estudios-varios-page .ates-estudios-kicker { margin-bottom: 5px; font-size: 10px; letter-spacing: .10em; } html.ates-estudios-varios-page .ates-estudios-title { font-size: 29px !important; } html.ates-estudios-varios-page .ates-estudios-description { margin-top: 11px !important; font-size: 13.5px; line-height: 1.55; } /* ====================================================== CONTENIDO CASI PEGADO A LA CABECERA ====================================================== */ body.page-id-7519 .entry-content { margin-top: -4px !important; padding-top: 0 !important; } body.page-id-7519 .entry-content > :first-child { margin-top: 6px !important; } /* ====================================================== LISTAS EN UNA COLUMNA ====================================================== */ body.page-id-7519 .entry-content > ul { grid-template-columns: 1fr; gap: 3px; margin-bottom: 23px !important; padding: 13px 10px !important; border-radius: 10px; } body.page-id-7519 .entry-content > ul > li { padding: 9px 8px 9px 23px !important; } /* ====================================================== TÍTULOS EN MÓVIL ====================================================== */ body.page-id-7519 .entry-content > h2, body.page-id-7519 .entry-content > h3, body.page-id-7519 .entry-content > h4 { margin: 22px 0 13px !important; padding-left: 14px !important; font-size: 23px !important; } body.page-id-7519 .entry-content > h2:first-child, body.page-id-7519 .entry-content > h3:first-child, body.page-id-7519 .entry-content > h4:first-child { margin-top: 6px !important; } } /* ========================================================== MÓVILES PEQUEÑOS ========================================================== */ @media (max-width:390px) { html.ates-estudios-varios-page .ates-estudios-title { font-size: 25px !important; } html.ates-estudios-varios-page .ates-estudios-description { font-size: 12.5px; } html.ates-estudios-varios-page .ates-estudios-logo-wrap { width: 62px; transform: translateX(-5px); } html.ates-estudios-varios-page .ates-estudios-logo { width: 62px; } }/* ========================================================== LETRA CAPITULAR — A TRAVÉS DE LAS ESCRITURAS Estilo editorial clásico Escritorio + Tablet + Móvil + Modo oscuro ========================================================== */ /* ========================================================== PRIMER PÁRRAFO DEL ARTÍCULO ========================================================== */ .single-post .entry-content > p:first-of-type { position: relative; overflow: visible; } /* ========================================================== LETRA CAPITULAR ========================================================== */ .single-post .entry-content > p:first-of-type::first-letter { float: left; /* Tamaño */ font-size: 5.5em; /* Altura para que ocupe varias líneas */ line-height: 0.73; /* Separación respecto al texto */ margin: 0.09em 0.13em 0 0; padding: 0.02em 0.025em 0 0; /* Tipografía clásica */ font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-style: normal; /* Azul tinta */ color: #17364f; /* Efecto ligeramente impreso */ text-shadow: 0 1px 0 rgba(255,255,255,.95), 1px 2px 2px rgba(7,31,61,.13); } /* ========================================================== TABLET ========================================================== */ @media (max-width: 900px) { .single-post .entry-content > p:first-of-type::first-letter { font-size: 5em; line-height: 0.75; margin: 0.09em 0.12em 0 0; padding: 0.02em 0.02em 0 0; } } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 680px) { .single-post .entry-content > p:first-of-type::first-letter { font-size: 4.35em; line-height: 0.78; margin: 0.10em 0.11em 0 0; padding: 0.01em 0.02em 0 0; text-shadow: 0 1px 0 rgba(255,255,255,.80), 1px 1px 2px rgba(7,31,61,.10); } } /* ========================================================== MÓVIL PEQUEÑO ========================================================== */ @media (max-width: 420px) { .single-post .entry-content > p:first-of-type::first-letter { font-size: 4em; line-height: 0.80; margin: 0.10em 0.10em 0 0; padding: 0; } } /* ========================================================== MODO OSCURO ========================================================== */ html[data-theme="dark"] .single-post .entry-content > p:first-of-type::first-letter, html.dark .single-post .entry-content > p:first-of-type::first-letter, html.ates-dark .single-post .entry-content > p:first-of-type::first-letter { /* Dorado editorial */ color: #d2ad62; /* Relieve adaptado al fondo oscuro */ text-shadow: 0 1px 0 rgba(255,255,255,.08), 1px 2px 3px rgba(0,0,0,.40); } /* ========================================================== MODO OSCURO — MÓVIL ========================================================== */ @media (max-width: 680px) { html[data-theme="dark"] .single-post .entry-content > p:first-of-type::first-letter, html.dark .single-post .entry-content > p:first-of-type::first-letter, html.ates-dark .single-post .entry-content > p:first-of-type::first-letter { color: #d2ad62; text-shadow: 0 1px 0 rgba(255,255,255,.06), 1px 1px 2px rgba(0,0,0,.35); } }/* ========================================================== MODO OSCURO GENERAL — ENTRADAS INDIVIDUALES Corrige el widget aclarar / oscurecer ========================================================== */ /* FONDO GENERAL */ html.ates-dark body.single-post, html.dark body.single-post, html[data-theme="dark"] body.single-post { background-color: #111820 !important; color: #e7edf2 !important; } /* ZONA PRINCIPAL */ html.ates-dark body.single-post #main, html.ates-dark body.single-post .site-main, html.ates-dark body.single-post .ct-container, html.ates-dark body.single-post .ct-container-full, html.dark body.single-post #main, html.dark body.single-post .site-main, html.dark body.single-post .ct-container, html.dark body.single-post .ct-container-full, html[data-theme="dark"] body.single-post #main, html[data-theme="dark"] body.single-post .site-main, html[data-theme="dark"] body.single-post .ct-container, html[data-theme="dark"] body.single-post .ct-container-full { background-color: #111820 !important; } /* ENTRADA */ html.ates-dark body.single-post article.post, html.dark body.single-post article.post, html[data-theme="dark"] body.single-post article.post { background-color: #17212a !important; color: #e7edf2 !important; } /* CONTENIDO Y PÁRRAFOS */ html.ates-dark body.single-post .entry-content, html.ates-dark body.single-post .entry-content p, html.dark body.single-post .entry-content, html.dark body.single-post .entry-content p, html[data-theme="dark"] body.single-post .entry-content, html[data-theme="dark"] body.single-post .entry-content p { color: #e3e9ee !important; } /* TÍTULOS */ html.ates-dark body.single-post h1, html.ates-dark body.single-post h2, html.ates-dark body.single-post h3, html.ates-dark body.single-post h4, html.ates-dark body.single-post h5, html.ates-dark body.single-post h6, html.dark body.single-post h1, html.dark body.single-post h2, html.dark body.single-post h3, html.dark body.single-post h4, html.dark body.single-post h5, html.dark body.single-post h6, html[data-theme="dark"] body.single-post h1, html[data-theme="dark"] body.single-post h2, html[data-theme="dark"] body.single-post h3, html[data-theme="dark"] body.single-post h4, html[data-theme="dark"] body.single-post h5, html[data-theme="dark"] body.single-post h6 { color: #f3f6f8 !important; } /* ENLACES DEL CONTENIDO */ html.ates-dark body.single-post .entry-content a, html.dark body.single-post .entry-content a, html[data-theme="dark"] body.single-post .entry-content a { color: #d8ad58 !important; } /* METADATOS */ html.ates-dark body.single-post .entry-meta, html.ates-dark body.single-post .entry-meta *, html.dark body.single-post .entry-meta, html.dark body.single-post .entry-meta *, html[data-theme="dark"] body.single-post .entry-meta, html[data-theme="dark"] body.single-post .entry-meta * { color: #aebbc5 !important; } /* LISTAS */ html.ates-dark body.single-post .entry-content li, html.dark body.single-post .entry-content li, html[data-theme="dark"] body.single-post .entry-content li { color: #e3e9ee !important; } /* NEGRITAS */ html.ates-dark body.single-post strong, html.ates-dark body.single-post b, html.dark body.single-post strong, html.dark body.single-post b, html[data-theme="dark"] body.single-post strong, html[data-theme="dark"] body.single-post b { color: #f5f7f8 !important; } /* SEPARADORES */ html.ates-dark body.single-post hr, html.dark body.single-post hr, html[data-theme="dark"] body.single-post hr { border-color: rgba(255,255,255,.15) !important; } /* SIDEBAR */ html.ates-dark body.single-post .ct-sidebar, html.ates-dark body.single-post .ct-sidebar *, html.dark body.single-post .ct-sidebar, html.dark body.single-post .ct-sidebar *, html[data-theme="dark"] body.single-post .ct-sidebar, html[data-theme="dark"] body.single-post .ct-sidebar * { color: #dce4ea; } /* INPUTS */ html.ates-dark body.single-post input, html.ates-dark body.single-post textarea, html.ates-dark body.single-post select, html.dark body.single-post input, html.dark body.single-post textarea, html.dark body.single-post select, html[data-theme="dark"] body.single-post input, html[data-theme="dark"] body.single-post textarea, html[data-theme="dark"] body.single-post select { background-color: #19242d !important; color: #edf2f5 !important; border-color: #344652 !important; }/* ========================================================== MODO OSCURO GLOBAL — CORRECCIÓN DEFINITIVA Inicio + páginas + entradas ========================================================== */ /* ========================================================== 1. FONDO GENERAL ========================================================== */ html.ates-dark body, html.dark body, html[data-theme="dark"] body { background-color: #101820 !important; color: #e4eaf0 !important; } /* Contenedores principales */ html.ates-dark #main, html.ates-dark .site-main, html.ates-dark #primary, html.dark #main, html.dark .site-main, html.dark #primary, html[data-theme="dark"] #main, html[data-theme="dark"] .site-main, html[data-theme="dark"] #primary { background-color: #101820 !important; } /* ========================================================== 2. TEXTO GENERAL ========================================================== */ html.ates-dark .entry-content, html.ates-dark .entry-content p, html.ates-dark .entry-content li, html.dark .entry-content, html.dark .entry-content p, html.dark .entry-content li, html[data-theme="dark"] .entry-content, html[data-theme="dark"] .entry-content p, html[data-theme="dark"] .entry-content li { color: #e1e7ec !important; } /* ========================================================== 3. TÍTULOS ========================================================== */ html.ates-dark h1, html.ates-dark h2, html.ates-dark h3, html.ates-dark h4, html.ates-dark h5, html.ates-dark h6, html.dark h1, html.dark h2, html.dark h3, html.dark h4, html.dark h5, html.dark h6, html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3, html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6 { color: #f2f5f7 !important; } /* ========================================================== 4. ENLACES ========================================================== */ html.ates-dark .entry-content a, html.dark .entry-content a, html[data-theme="dark"] .entry-content a { color: #d8ad58 !important; } /* ========================================================== 5. ENTRADAS / TARJETAS ========================================================== */ html.ates-dark article.post, html.dark article.post, html[data-theme="dark"] article.post { color: #e1e7ec !important; } /* ========================================================== 6. CITAS — FORZAR FONDO OSCURO CORRECTO ========================================================== */ html.ates-dark .entry-content blockquote, html.ates-dark .wp-block-quote, html.dark .entry-content blockquote, html.dark .wp-block-quote, html[data-theme="dark"] .entry-content blockquote, html[data-theme="dark"] .wp-block-quote { background: linear-gradient( 135deg, #172b3d 0%, #102536 55%, #0c1e2d 100% ) !important; color: #edf1f4 !important; border: 1px solid rgba(201,169,106,.36) !important; border-left: 5px solid #c9a96a !important; box-shadow: 0 7px 22px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04) !important; } /* Texto de la cita */ html.ates-dark .entry-content blockquote p, html.ates-dark .wp-block-quote p, html.dark .entry-content blockquote p, html.dark .wp-block-quote p, html[data-theme="dark"] .entry-content blockquote p, html[data-theme="dark"] .wp-block-quote p { color: #edf1f4 !important; background: transparent !important; } /* Autor / referencia */ html.ates-dark blockquote cite, html.ates-dark .wp-block-quote cite, html.ates-dark .wp-block-quote__citation, html.dark blockquote cite, html.dark .wp-block-quote cite, html.dark .wp-block-quote__citation, html[data-theme="dark"] blockquote cite, html[data-theme="dark"] .wp-block-quote cite, html[data-theme="dark"] .wp-block-quote__citation { color: #c9d9e7 !important; } /* Comilla decorativa */ html.ates-dark .entry-content blockquote::before, html.ates-dark .wp-block-quote::before, html.dark .entry-content blockquote::before, html.dark .wp-block-quote::before, html[data-theme="dark"] .entry-content blockquote::before, html[data-theme="dark"] .wp-block-quote::before { color: rgba(212,175,102,.23) !important; } /* ========================================================== 7. SIDEBAR ========================================================== */ html.ates-dark .ct-sidebar, html.dark .ct-sidebar, html[data-theme="dark"] .ct-sidebar { color: #dce4ea !important; } html.ates-dark .ct-sidebar a, html.dark .ct-sidebar a, html[data-theme="dark"] .ct-sidebar a { color: #d8ad58 !important; } /* ========================================================== 8. METADATOS ========================================================== */ html.ates-dark .entry-meta, html.ates-dark .entry-meta *, html.dark .entry-meta, html.dark .entry-meta *, html[data-theme="dark"] .entry-meta, html[data-theme="dark"] .entry-meta * { color: #aebbc5 !important; } /* ========================================================== 9. INTERRUPTOR — ESTADO OSCURO ========================================================== */ /* Estas reglas cubren las estructuras más habituales del widget. El movimiento exacto dependerá del nombre real de la pieza circular. */ html.ates-dark .ates-theme-box .switch::before, html.ates-dark .ates-theme-box .slider::before, html.ates-dark .ates-theme-box .toggle::before, html.ates-dark .ates-theme-box button::before, html.dark .ates-theme-box .switch::before, html.dark .ates-theme-box .slider::before, html.dark .ates-theme-box .toggle::before, html.dark .ates-theme-box button::before, html[data-theme="dark"] .ates-theme-box .switch::before, html[data-theme="dark"] .ates-theme-box .slider::before, html[data-theme="dark"] .ates-theme-box .toggle::before, html[data-theme="dark"] .ates-theme-box button::before { transform: translateX(24px) !important; } /* Transición del círculo */ .ates-theme-box .switch::before, .ates-theme-box .slider::before, .ates-theme-box .toggle::before, .ates-theme-box button::before { transition: transform .25s ease, background-color .25s ease !important; } /* ========================================================== FOLIO — PAPEL VIEJO AMARRONADO TEXTURA + FIBRAS + RAYADO ========================================================== */ /* ========================================================== 1. EVITAR CAPAS DE FONDO SUPERPUESTAS ========================================================== */ html body.single-post .ct-container, html body.single-post .ct-container-full, html body.single-post #primary, html body.single-post .content-area, html body.single-post .site-main, html body.single-post article.post .entry-content { background-color: transparent !important; background-image: none !important; } /* ========================================================== 2. FOLIO PRINCIPAL ========================================================== */ html body.single-post .site-main article.post, html body.single-post article.post { position: relative !important; background: /* ------------------------------------------ RAYADO HORIZONTAL DEL PAPEL ------------------------------------------ */ repeating-linear-gradient( to bottom, transparent 0px, transparent 27px, rgba(83, 91, 91, .085) 28px, transparent 29px ), /* ------------------------------------------ FIBRA HORIZONTAL FINA ------------------------------------------ */ repeating-linear-gradient( 0deg, rgba(79, 62, 43, .030) 0px, rgba(79, 62, 43, .030) 1px, transparent 1px, transparent 4px ), /* ------------------------------------------ FIBRA VERTICAL IRREGULAR ------------------------------------------ */ repeating-linear-gradient( 90deg, rgba(88, 68, 45, .018) 0px, rgba(88, 68, 45, .018) 1px, transparent 1px, transparent 9px ), /* ------------------------------------------ ENVEJECIMIENTO SUPERIOR IZQUIERDO ------------------------------------------ */ radial-gradient( ellipse at 8% 12%, rgba(116, 83, 48, .095), transparent 27% ), /* ------------------------------------------ LUZ NATURAL SUPERIOR DERECHA ------------------------------------------ */ radial-gradient( ellipse at 90% 18%, rgba(255, 255, 255, .26), transparent 31% ), /* ------------------------------------------ MANCHA SUAVE INFERIOR IZQUIERDA ------------------------------------------ */ radial-gradient( ellipse at 20% 70%, rgba(126, 91, 51, .070), transparent 32% ), /* ------------------------------------------ ENVEJECIMIENTO INFERIOR DERECHO ------------------------------------------ */ radial-gradient( ellipse at 82% 84%, rgba(103, 75, 45, .055), transparent 29% ), /* ------------------------------------------ LIGERA ILUMINACIÓN CENTRAL ------------------------------------------ */ radial-gradient( ellipse at center, rgba(255, 255, 255, .15), transparent 60% ), /* ------------------------------------------ COLOR BASE DEL PAPEL VIEJO ------------------------------------------ */ linear-gradient( 135deg, #eee8dc 0%, #e5ddcf 28%, #e9e1d3 52%, #ddd3c3 76%, #ebe4d8 100% ) !important; /* Borde fino del folio */ border: 1px solid rgba(96, 73, 46, .24) !important; border-radius: 2px !important; /* Sombra física de la hoja */ box-shadow: 0 2px 3px rgba(38, 30, 21, .06), 0 9px 22px rgba(38, 30, 21, .10), 0 25px 48px rgba(38, 30, 21, .075) !important; } /* ========================================================== 3. INTERIOR DEL FOLIO TRANSPARENTE Evita que aparezcan aquellos cuadros blancos ========================================================== */ html body.single-post article.post > *, html body.single-post article.post .entry-content, html body.single-post article.post .entry-content > * { background-color: transparent !important; } /* ========================================================== 4. TEXTO DEL ARTÍCULO ========================================================== */ html body.single-post article.post .entry-content, html body.single-post article.post .entry-content p, html body.single-post article.post .entry-content li { color: #34434a !important; } /* ========================================================== 5. TÍTULO PRINCIPAL ========================================================== */ html body.single-post article.post .entry-title, html body.single-post article.post .entry-title a { color: #071f3d !important; } /* ========================================================== 6. ENCABEZADOS DEL ARTÍCULO ========================================================== */ html body.single-post article.post .entry-content h1, html body.single-post article.post .entry-content h2, html body.single-post article.post .entry-content h3, html body.single-post article.post .entry-content h4, html body.single-post article.post .entry-content h5, html body.single-post article.post .entry-content h6 { color: #071f3d !important; } /* ========================================================== 7. ENLACES ========================================================== */ html body.single-post article.post .entry-content a { color: #356fa8 !important; } /* ========================================================== 8. CONSERVAR LOS DOBLECES ORIGINALES ========================================================== */ html body.single-post article.post::before, html body.single-post article.post::after { display: block !important; } /* ========================================================== 9. CITAS La cita conserva su propio diseño ========================================================== */ html body.single-post article.post .entry-content blockquote, html body.single-post article.post .wp-block-quote { background: linear-gradient( 135deg, rgba(255,253,248,.94) 0%, rgba(247,241,228,.94) 100% ) !important; border: 1px solid rgba(180,119,32,.32) !important; border-left: 5px solid #b47720 !important; color: #24384c !important; } html body.single-post article.post .entry-content blockquote p, html body.single-post article.post .wp-block-quote p { color: #24384c !important; } /* ========================================================== 10. MODO OSCURO ========================================================== */ html.ates-dark body.single-post .site-main article.post, html.ates-dark body.single-post article.post { background: /* Rayado */ repeating-linear-gradient( to bottom, transparent 0px, transparent 27px, rgba(178,195,205,.065) 28px, transparent 29px ), /* Fibra horizontal */ repeating-linear-gradient( 0deg, rgba(255,255,255,.018) 0px, rgba(255,255,255,.018) 1px, transparent 1px, transparent 4px ), /* Fibra vertical */ repeating-linear-gradient( 90deg, rgba(255,255,255,.012) 0px, rgba(255,255,255,.012) 1px, transparent 1px, transparent 9px ), /* Ligero envejecimiento */ radial-gradient( ellipse at 12% 16%, rgba(201,169,106,.050), transparent 30% ), radial-gradient( ellipse at 82% 25%, rgba(255,255,255,.045), transparent 34% ), /* Fondo */ linear-gradient( 135deg, #344b5b 0%, #304756 45%, #2b414f 75%, #334a58 100% ) !important; border-color: rgba(201,169,106,.28) !important; box-shadow: 0 2px 4px rgba(0,0,0,.08), 0 10px 25px rgba(0,0,0,.13), 0 25px 50px rgba(0,0,0,.09) !important; } /* ========================================================== 11. TEXTO EN MODO OSCURO ========================================================== */ html.ates-dark body.single-post article.post .entry-content, html.ates-dark body.single-post article.post .entry-content p, html.ates-dark body.single-post article.post .entry-content li { color: #edf1f3 !important; } /* ========================================================== 12. TÍTULOS EN MODO OSCURO ========================================================== */ html.ates-dark body.single-post article.post .entry-title, html.ates-dark body.single-post article.post .entry-title a, html.ates-dark body.single-post article.post .entry-content h1, html.ates-dark body.single-post article.post .entry-content h2, html.ates-dark body.single-post article.post .entry-content h3, html.ates-dark body.single-post article.post .entry-content h4, html.ates-dark body.single-post article.post .entry-content h5, html.ates-dark body.single-post article.post .entry-content h6 { color: #ffffff !important; } /* ========================================================== 13. ENLACES EN MODO OSCURO ========================================================== */ html.ates-dark body.single-post article.post .entry-content a { color: #9dd2f2 !important; } /* ========================================================== 14. CITAS EN MODO OSCURO ========================================================== */ html.ates-dark body.single-post article.post .entry-content blockquote, html.ates-dark body.single-post article.post .wp-block-quote { background: linear-gradient( 135deg, #172b3d 0%, #102536 55%, #0c1e2d 100% ) !important; border: 1px solid rgba(201,169,106,.36) !important; border-left: 5px solid #c9a96a !important; color: #edf1f4 !important; } html.ates-dark body.single-post article.post .entry-content blockquote p, html.ates-dark body.single-post article.post .wp-block-quote p { color: #edf1f4 !important; } /* ========================================================== TARJETAS PARA LISTADOS DE ARTÍCULOS / ENTRADAS TODAS LAS PÁGINAS DE LISTADO ========================================================== */ /* Cada entrada del listado */ body:not(.single-post) .entries article, body:not(.single-post) .ct-posts-container article, body:not(.single-post) .site-main article.post { position: relative !important; background: linear-gradient( 135deg, #fbfaf6 0%, #f6f2e9 100% ) !important; border: 1px solid rgba(180,119,32,.22) !important; border-radius: 8px !important; padding: 22px 24px !important; margin-bottom: 22px !important; box-shadow: 0 4px 14px rgba(7,31,61,.07) !important; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important; } /* Hover en ordenador */ body:not(.single-post) .entries article:hover, body:not(.single-post) .ct-posts-container article:hover, body:not(.single-post) .site-main article.post:hover { transform: translateY(-3px); border-color: rgba(180,119,32,.48) !important; box-shadow: 0 9px 24px rgba(7,31,61,.12) !important; } /* ========================================================== TÍTULOS ========================================================== */ body:not(.single-post) article.post .entry-title, body:not(.single-post) article.post .entry-title a, body:not(.single-post) .entries article h2, body:not(.single-post) .entries article h2 a, body:not(.single-post) .ct-posts-container article h2, body:not(.single-post) .ct-posts-container article h2 a { color: #071f3d !important; font-weight: 700 !important; line-height: 1.25 !important; text-decoration: none !important; } /* Línea dorada pequeña debajo del título */ body:not(.single-post) article.post .entry-title::after, body:not(.single-post) .entries article h2::after { content: ""; display: block; width: 44px; height: 2px; margin-top: 10px; background: #b47720; opacity: .75; } /* Título al pasar el cursor */ body:not(.single-post) article.post .entry-title a:hover, body:not(.single-post) .entries article h2 a:hover, body:not(.single-post) .ct-posts-container article h2 a:hover { color: #b47720 !important; } /* ========================================================== TEXTO / EXTRACTO ========================================================== */ body:not(.single-post) article.post .entry-excerpt, body:not(.single-post) article.post .entry-content, body:not(.single-post) .entries article p { color: #4c5a62 !important; line-height: 1.65 !important; } /* ========================================================== ENLACE LEER MÁS ========================================================== */ body:not(.single-post) article.post .entry-button, body:not(.single-post) article.post .more-link, body:not(.single-post) .entries article .more-link { color: #b47720 !important; font-weight: 600 !important; text-decoration: none !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body:not(.single-post) .entries article, html.ates-dark body:not(.single-post) .ct-posts-container article, html.ates-dark body:not(.single-post) .site-main article.post { background: linear-gradient( 135deg, #263c4a 0%, #203542 100% ) !important; border-color: rgba(201,169,106,.25) !important; box-shadow: 0 5px 18px rgba(0,0,0,.13) !important; } html.ates-dark body:not(.single-post) article.post .entry-title, html.ates-dark body:not(.single-post) article.post .entry-title a, html.ates-dark body:not(.single-post) .entries article h2, html.ates-dark body:not(.single-post) .entries article h2 a, html.ates-dark body:not(.single-post) .ct-posts-container article h2, html.ates-dark body:not(.single-post) .ct-posts-container article h2 a { color: #f4f6f7 !important; } html.ates-dark body:not(.single-post) article.post .entry-excerpt, html.ates-dark body:not(.single-post) article.post .entry-content, html.ates-dark body:not(.single-post) .entries article p { color: #d8e0e5 !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 600px) { body:not(.single-post) .entries article, body:not(.single-post) .ct-posts-container article, body:not(.single-post) .site-main article.post { padding: 18px 17px !important; margin-bottom: 18px !important; border-radius: 7px !important; } }/* ========================================================== A TRAVÉS DE LAS ESCRITURAS MODO LECTOR INDEPENDIENTE Barra flotante + lector + capitular + tema ========================================================== */ /* ========================================================== 1. BARRA FLOTANTE ========================================================== */ body.single-post .ates-reading-floating { position: absolute !important; z-index: 999999 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important; width: auto !important; min-width: 0 !important; max-width: max-content !important; min-height: 30px !important; margin: 0 !important; padding: 3px 5px 3px 8px !important; box-sizing: border-box !important; white-space: nowrap !important; background: rgba(251,248,240,.96) !important; border: 1px solid rgba(180,119,32,.30) !important; border-radius: 999px !important; box-shadow: 0 3px 11px rgba(7,31,61,.10) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: #173956 !important; font-family: Georgia, "Times New Roman", serif !important; line-height: 1 !important; } /* ========================================================== 2. BOTONES DE LA BARRA ========================================================== */ body.single-post .ates-reading-floating button { appearance: none !important; -webkit-appearance: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 4px !important; width: auto !important; min-width: 0 !important; height: 24px !important; margin: 0 !important; padding: 2px 5px !important; background: transparent !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important; color: #173956 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1 !important; cursor: pointer !important; } body.single-post .ates-reading-floating button:hover { background: rgba(180,119,32,.10) !important; color: #9a620d !important; } /* ========================================================== 3. Aa + LECTOR ========================================================== */ body.single-post .ates-reading-floating .ates-reader-aa { display: inline-block !important; color: #071f3d !important; font-size: 15px !important; font-weight: 700 !important; line-height: 1 !important; } body.single-post .ates-reading-floating .ates-reader-label { display: inline-block !important; font-size: 11px !important; line-height: 1 !important; } /* ========================================================== 4. DIVISORES ========================================================== */ body.single-post .ates-reading-floating .ates-reading-divider { display: block !important; width: 1px !important; min-width: 1px !important; height: 14px !important; margin: 0 1px !important; background: rgba(7,31,61,.16) !important; } /* ========================================================== 5. TIEMPO DE LECTURA ========================================================== */ body.single-post .ates-reading-floating .ates-reading-time { display: inline-flex !important; align-items: center !important; width: auto !important; margin: 0 !important; padding: 0 2px !important; color: #68747c !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 10.5px !important; font-weight: 500 !important; line-height: 1 !important; white-space: nowrap !important; } body.single-post .ates-reading-floating .ates-reading-time::before { content: "◷"; margin-right: 4px !important; color: #b47720 !important; font-size: 12px !important; } /* ========================================================== 6. BOTÓN LUNA / SOL ========================================================== */ body.single-post .ates-reading-floating .ates-inline-theme { width: 24px !important; min-width: 24px !important; height: 24px !important; padding: 0 !important; color: #173956 !important; font-size: 14px !important; } /* ========================================================== 7. BARRA EN MODO OSCURO ========================================================== */ html.ates-dark body.single-post .ates-reading-floating { background: rgba(24,40,51,.96) !important; border-color: rgba(201,169,106,.34) !important; box-shadow: 0 3px 11px rgba(0,0,0,.18) !important; } html.ates-dark body.single-post .ates-reading-floating button { color: #edf1f4 !important; } html.ates-dark body.single-post .ates-reading-floating .ates-reader-aa { color: #d9aa50 !important; } html.ates-dark body.single-post .ates-reading-floating .ates-reading-time { color: #cbd3d8 !important; } html.ates-dark body.single-post .ates-reading-floating .ates-reading-divider { background: rgba(255,255,255,.15) !important; } /* ========================================================== 8. BLOQUEAR PÁGINA ORIGINAL ========================================================== */ html.ates-reader-open, html.ates-reader-open body { overflow: hidden !important; } /* ========================================================== 9. PANTALLA DEL LECTOR ========================================================== */ .ates-reader-overlay { --ates-reader-font-size: 20px; position: fixed !important; inset: 0 !important; z-index: 2147483000 !important; overflow-x: hidden !important; overflow-y: auto !important; background: #f3f1eb !important; color: #263944 !important; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; } /* ========================================================== 10. FONDO DEL LECTOR ========================================================== */ .ates-reader-shell { width: 100% !important; min-height: 100vh !important; margin: 0 !important; padding: 0 !important; background: #fbfaf7 !important; } /* ========================================================== 11. TOOLBAR ========================================================== */ .ates-reader-toolbar { position: sticky !important; top: 0 !important; z-index: 20 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; min-height: 58px !important; margin: 0 !important; padding: 8px 28px !important; box-sizing: border-box !important; background: rgba(251,250,247,.95) !important; border-bottom: 1px solid rgba(7,31,61,.10) !important; box-shadow: 0 3px 14px rgba(20,35,45,.045) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); } /* ========================================================== 12. NOMBRE DEL SITIO ========================================================== */ .ates-reader-brand { color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 15px !important; font-weight: 700 !important; line-height: 1.2 !important; letter-spacing: .02em !important; } /* ========================================================== 13. CONTROLES DEL LECTOR ========================================================== */ .ates-reader-actions { display: flex !important; align-items: center !important; gap: 5px !important; } .ates-reader-actions button { appearance: none !important; -webkit-appearance: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 36px !important; height: 34px !important; margin: 0 !important; padding: 0 10px !important; background: transparent !important; border: 1px solid transparent !important; border-radius: 8px !important; box-shadow: none !important; color: #173956 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1 !important; cursor: pointer !important; } .ates-reader-actions button:hover { background: rgba(180,119,32,.08) !important; border-color: rgba(180,119,32,.15) !important; } .ates-reader-close { margin-left: 5px !important; border-color: rgba(7,31,61,.12) !important; } .ates-reader-close span { margin-left: 5px !important; } /* ========================================================== 14. COLUMNA DE LECTURA ========================================================== */ .ates-reader-main { width: calc(100% - 60px) !important; max-width: 880px !important; margin: 0 auto !important; padding: 62px 0 100px !important; box-sizing: border-box !important; } /* ========================================================== 15. TÍTULO PRINCIPAL ========================================================== */ .ates-reader-title { display: block !important; width: 100% !important; margin: 0 0 14px !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(36px,4.5vw,54px) !important; font-weight: 700 !important; line-height: 1.12 !important; letter-spacing: -.018em !important; text-align: left !important; text-shadow: none !important; } /* ========================================================== 16. TIEMPO DENTRO DEL LECTOR ========================================================== */ .ates-reader-meta { display: block !important; margin: 0 0 42px !important; padding: 0 0 17px !important; border-bottom: 1px solid rgba(180,119,32,.24) !important; color: #74808a !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 13px !important; font-weight: 400 !important; } /* ========================================================== 17. CONTENIDO ========================================================== */ .ates-reader-overlay .ates-reader-content { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; background: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important; color: #263944 !important; } /* Evitar fondos heredados */ .ates-reader-overlay .ates-reader-content > * { background-image: none !important; } /* ========================================================== 18. PÁRRAFOS ========================================================== */ .ates-reader-overlay .ates-reader-content p { display: block !important; margin: 0 0 1.45em !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: #263944 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: var(--ates-reader-font-size) !important; font-weight: 400 !important; font-style: normal !important; line-height: 1.88 !important; letter-spacing: .003em !important; text-align: left !important; } /* ========================================================== 19. CAPITULAR IMPORTANTE: el JS añade la clase .ates-reader-first-paragraph al primer párrafo con texto. ========================================================== */ .ates-reader-overlay .ates-reader-content p.ates-reader-first-paragraph::first-letter { float: left !important; margin: 7px 12px 0 0 !important; padding: 1px 4px 1px 2px !important; color: #762b22 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 4.6em !important; font-weight: 700 !important; font-style: normal !important; line-height: .70 !important; text-shadow: 1px 1px 0 rgba(255,255,255,.60), 2px 3px 3px rgba(69,38,19,.14) !important; } /* ========================================================== 20. ENCABEZADOS ========================================================== */ .ates-reader-overlay .ates-reader-content h2, .ates-reader-overlay .ates-reader-content h3, .ates-reader-overlay .ates-reader-content h4 { position: relative !important; display: block !important; padding: 0 !important; background: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #0b3557 !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; text-align: left !important; text-shadow: none !important; transform: none !important; } .ates-reader-overlay .ates-reader-content h2 { margin: 2em 0 .75em !important; font-size: 32px !important; line-height: 1.25 !important; } .ates-reader-overlay .ates-reader-content h3 { margin: 1.7em 0 .65em !important; font-size: 26px !important; line-height: 1.30 !important; } .ates-reader-overlay .ates-reader-content h4 { margin: 1.5em 0 .60em !important; font-size: 22px !important; line-height: 1.35 !important; } /* Quitar adornos de los títulos del folio */ .ates-reader-overlay .ates-reader-content h2::before, .ates-reader-overlay .ates-reader-content h2::after, .ates-reader-overlay .ates-reader-content h3::before, .ates-reader-overlay .ates-reader-content h3::after, .ates-reader-overlay .ates-reader-content h4::before, .ates-reader-overlay .ates-reader-content h4::after { content: none !important; display: none !important; } /* ========================================================== 21. LISTAS ========================================================== */ .ates-reader-overlay .ates-reader-content ul, .ates-reader-overlay .ates-reader-content ol { margin: 0 0 1.5em 1.45em !important; padding: 0 !important; background: transparent !important; } .ates-reader-overlay .ates-reader-content li { margin: 0 0 .55em !important; padding: 0 !important; background: transparent !important; color: #263944 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: calc( var(--ates-reader-font-size) - 1px ) !important; font-weight: 400 !important; line-height: 1.80 !important; } /* ========================================================== 22. CITAS ========================================================== */ .ates-reader-overlay .ates-reader-content blockquote { position: relative !important; display: block !important; margin: 2em 0 !important; padding: 25px 30px !important; background: #f5efe2 !important; background-image: none !important; border: 0 !important; border-left: 4px solid #b47720 !important; border-radius: 5px !important; box-shadow: none !important; color: #263944 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: var(--ates-reader-font-size) !important; line-height: 1.80 !important; } .ates-reader-overlay .ates-reader-content blockquote::before, .ates-reader-overlay .ates-reader-content blockquote::after { content: none !important; display: none !important; } .ates-reader-overlay .ates-reader-content blockquote p { color: inherit !important; font-size: inherit !important; } /* ========================================================== 23. ENLACES ========================================================== */ .ates-reader-overlay .ates-reader-content a { color: #226eae !important; text-decoration: underline !important; text-decoration-thickness: 1px !important; text-underline-offset: 3px !important; } .ates-reader-overlay .ates-reader-content a:hover { color: #b47720 !important; } /* ========================================================== 24. IMÁGENES ========================================================== */ .ates-reader-overlay .ates-reader-content img { display: block !important; max-width: 100% !important; height: auto !important; margin: 2em auto !important; border-radius: 5px !important; box-shadow: 0 5px 18px rgba(20,35,45,.08) !important; } .ates-reader-overlay .ates-reader-content figure { max-width: 100% !important; margin: 2em auto !important; padding: 0 !important; background: transparent !important; } .ates-reader-overlay .ates-reader-content figcaption { margin-top: 8px !important; color: #76818a !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 13px !important; line-height: 1.5 !important; text-align: center !important; } /* ========================================================== 25. TABLAS ========================================================== */ .ates-reader-overlay .ates-reader-content table { width: 100% !important; margin: 2em 0 !important; border-collapse: collapse !important; background: transparent !important; color: #263944 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: calc( var(--ates-reader-font-size) - 2px ) !important; } .ates-reader-overlay .ates-reader-content th, .ates-reader-overlay .ates-reader-content td { padding: 10px 12px !important; border: 1px solid rgba(7,31,61,.14) !important; background: transparent !important; color: inherit !important; } /* ========================================================== 26. SEPARADORES ========================================================== */ .ates-reader-overlay .ates-reader-content hr { width: 100% !important; height: 1px !important; margin: 2.4em 0 !important; padding: 0 !important; background: rgba(180,119,32,.25) !important; border: 0 !important; } /* ========================================================== 27. MODO OSCURO DEL LECTOR ========================================================== */ .ates-reader-overlay.ates-reader-dark, .ates-reader-overlay.ates-reader-dark .ates-reader-shell { background: #151e24 !important; color: #e7ecef !important; } /* Toolbar */ .ates-reader-overlay.ates-reader-dark .ates-reader-toolbar { background: rgba(21,30,36,.96) !important; border-bottom-color: rgba(255,255,255,.09) !important; box-shadow: 0 3px 16px rgba(0,0,0,.18) !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-brand { color: #f1f3f4 !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-actions button { color: #e8edef !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-actions button:hover { background: rgba(255,255,255,.06) !important; border-color: rgba(201,169,106,.20) !important; } /* Título */ .ates-reader-overlay.ates-reader-dark .ates-reader-title { color: #f0f2f3 !important; } /* Meta */ .ates-reader-overlay.ates-reader-dark .ates-reader-meta { color: #aeb8be !important; border-bottom-color: rgba(201,169,106,.24) !important; } /* Texto */ .ates-reader-overlay.ates-reader-dark .ates-reader-content, .ates-reader-overlay.ates-reader-dark .ates-reader-content p, .ates-reader-overlay.ates-reader-dark .ates-reader-content li, .ates-reader-overlay.ates-reader-dark .ates-reader-content h2, .ates-reader-overlay.ates-reader-dark .ates-reader-content h3, .ates-reader-overlay.ates-reader-dark .ates-reader-content h4 { color: #edf1f3 !important; } /* ========================================================== 28. CAPITULAR EN OSCURO ========================================================== */ .ates-reader-overlay.ates-reader-dark .ates-reader-content p.ates-reader-first-paragraph::first-letter { color: #d4957b !important; text-shadow: 1px 1px 0 rgba(0,0,0,.28), 2px 3px 4px rgba(0,0,0,.20) !important; } /* Citas oscuras */ .ates-reader-overlay.ates-reader-dark .ates-reader-content blockquote { background: #202e38 !important; color: #e7ecef !important; border-left-color: #cda24e !important; } /* Links oscuros */ .ates-reader-overlay.ates-reader-dark .ates-reader-content a { color: #8ec9ef !important; } /* Tablas oscuras */ .ates-reader-overlay.ates-reader-dark .ates-reader-content table { color: #e7ecef !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-content th, .ates-reader-overlay.ates-reader-dark .ates-reader-content td { border-color: rgba(255,255,255,.12) !important; } /* Figcaption oscuro */ .ates-reader-overlay.ates-reader-dark .ates-reader-content figcaption { color: #aeb8be !important; } /* ========================================================== 29. TABLET ========================================================== */ @media (min-width:681px) and (max-width:1024px) { body.single-post .ates-reading-floating { transform: scale(.96) !important; transform-origin: right bottom !important; } .ates-reader-main { width: calc(100% - 50px) !important; max-width: 780px !important; padding: 50px 0 85px !important; } .ates-reader-title { font-size: 40px !important; } } /* ========================================================== 30. MÓVIL ========================================================== */ @media (max-width:680px) { /* Barra exterior */ body.single-post .ates-reading-floating { gap: 3px !important; min-height: 27px !important; padding: 2px 4px 2px 5px !important; } body.single-post .ates-reading-floating .ates-reader-label { display: none !important; } body.single-post .ates-reading-floating .ates-reader-aa { font-size: 14px !important; } body.single-post .ates-reading-floating .ates-reading-time { font-size: 9.5px !important; } body.single-post .ates-reading-floating .ates-inline-theme { width: 22px !important; min-width: 22px !important; height: 22px !important; font-size: 13px !important; } /* Toolbar */ .ates-reader-toolbar { min-height: 52px !important; padding: 7px 10px !important; } .ates-reader-brand { font-size: 11px !important; } .ates-reader-actions { gap: 2px !important; } .ates-reader-actions button { min-width: 31px !important; height: 31px !important; padding: 0 7px !important; font-size: 12px !important; } .ates-reader-close span { display: none !important; } /* Columna */ .ates-reader-main { width: calc(100% - 36px) !important; max-width: none !important; margin: 0 auto !important; padding: 38px 0 70px !important; } /* Título */ .ates-reader-title { font-size: 32px !important; line-height: 1.16 !important; } /* Meta */ .ates-reader-meta { margin-bottom: 30px !important; } /* Texto */ .ates-reader-overlay .ates-reader-content p { font-size: 18px !important; line-height: 1.82 !important; } .ates-reader-overlay .ates-reader-content li { font-size: 17px !important; line-height: 1.76 !important; } /* Capitular móvil */ .ates-reader-overlay .ates-reader-content p.ates-reader-first-paragraph::first-letter { font-size: 4.2em !important; line-height: .72 !important; margin: 6px 9px 0 0 !important; } /* Títulos */ .ates-reader-overlay .ates-reader-content h2 { font-size: 27px !important; } .ates-reader-overlay .ates-reader-content h3 { font-size: 23px !important; } .ates-reader-overlay .ates-reader-content h4 { font-size: 20px !important; } /* Citas */ .ates-reader-overlay .ates-reader-content blockquote { padding: 21px 22px !important; font-size: 17px !important; } } /* ========================================================== 31. MÓVILES PEQUEÑOS ========================================================== */ @media (max-width:390px) { .ates-reader-main { width: calc(100% - 28px) !important; } .ates-reader-brand { display: none !important; } .ates-reader-toolbar { justify-content: flex-end !important; } .ates-reader-title { font-size: 29px !important; } } /* ========================================================== 32. ACCESIBILIDAD ========================================================== */ @media (prefers-reduced-motion: reduce) { .ates-reader-overlay *, .ates-reading-floating * { transition: none !important; animation: none !important; } } /* ========================================================== FIN DEL MODO LECTOR ========================================================== */ /* ========================================================== A TRAVÉS DE LAS ESCRITURAS ENCABEZADOS EDITORIALES — FONDO SUAVE OSCURO Artículo normal + Modo Lector ========================================================== */ /* ========================================================== 1. H2 — ARTÍCULO NORMAL ========================================================== */ body.single-post article.post .entry-content h2 { position: relative !important; margin: 38px 0 20px !important; padding: 17px 24px 20px !important; background: rgba(205,185,148,.34) !important; background-image: linear-gradient( 90deg, rgba(255,255,255,.07), rgba(180,119,32,.025) ) !important; border: 1px solid rgba(157,101,13,.12) !important; border-radius: 7px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 2px 7px rgba(82,58,25,.04) !important; color: #0b3557 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(28px,2.5vw,35px) !important; font-weight: 700 !important; line-height: 1.22 !important; letter-spacing: -.012em !important; text-align: left !important; text-shadow: none !important; } /* Línea dorada H2 */ body.single-post article.post .entry-content h2::after { content: "" !important; display: block !important; width: 115px !important; height: 2px !important; margin: 12px 0 0 !important; border-radius: 999px !important; background: linear-gradient( 90deg, #a96d17 0%, #d1a34f 58%, rgba(180,119,32,0) 100% ) !important; } /* Quitar adornos anteriores */ body.single-post article.post .entry-content h2::before { content: none !important; display: none !important; } /* ========================================================== 2. H3 — ARTÍCULO NORMAL ========================================================== */ body.single-post article.post .entry-content h3 { position: relative !important; margin: 29px 0 16px !important; padding: 13px 20px 15px !important; background: rgba(205,185,148,.23) !important; background-image: linear-gradient( 90deg, rgba(255,255,255,.055), transparent ) !important; border: 1px solid rgba(157,101,13,.085) !important; border-radius: 6px !important; box-shadow: none !important; color: #173f5f !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(23px,2vw,28px) !important; font-weight: 700 !important; line-height: 1.27 !important; letter-spacing: -.005em !important; text-align: left !important; text-shadow: none !important; } /* Línea dorada H3 */ body.single-post article.post .entry-content h3::after { content: "" !important; display: block !important; width: 76px !important; height: 2px !important; margin: 9px 0 0 !important; border-radius: 999px !important; background: linear-gradient( 90deg, #a96d17, #d0a04a, rgba(180,119,32,0) ) !important; } body.single-post article.post .entry-content h3::before { content: none !important; display: none !important; } /* ========================================================== 3. H4 — ARTÍCULO NORMAL ========================================================== */ body.single-post article.post .entry-content h4 { position: relative !important; margin: 26px 0 12px !important; padding: 0 !important; background: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #31536a !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(20px,1.7vw,23px) !important; font-weight: 700 !important; line-height: 1.35 !important; letter-spacing: .003em !important; text-align: left !important; text-shadow: none !important; } body.single-post article.post .entry-content h4::before, body.single-post article.post .entry-content h4::after { content: none !important; display: none !important; } /* ========================================================== 4. H2 — MODO LECTOR ========================================================== */ .ates-reader-overlay .ates-reader-content h2 { position: relative !important; margin: 2.1em 0 .85em !important; padding: 17px 24px 20px !important; background: rgba(205,185,148,.34) !important; background-image: linear-gradient( 90deg, rgba(255,255,255,.07), rgba(180,119,32,.025) ) !important; border: 1px solid rgba(157,101,13,.12) !important; border-radius: 7px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 2px 7px rgba(82,58,25,.04) !important; color: #0b3557 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 32px !important; font-weight: 700 !important; line-height: 1.22 !important; letter-spacing: -.012em !important; text-align: left !important; text-shadow: none !important; } /* Línea dorada H2 — lector */ .ates-reader-overlay .ates-reader-content h2::after { content: "" !important; display: block !important; width: 115px !important; height: 2px !important; margin: 12px 0 0 !important; border-radius: 999px !important; background: linear-gradient( 90deg, #a96d17 0%, #d1a34f 58%, rgba(180,119,32,0) 100% ) !important; } .ates-reader-overlay .ates-reader-content h2::before { content: none !important; display: none !important; } /* ========================================================== 5. H3 — MODO LECTOR ========================================================== */ .ates-reader-overlay .ates-reader-content h3 { position: relative !important; margin: 1.75em 0 .72em !important; padding: 13px 20px 15px !important; background: rgba(205,185,148,.23) !important; background-image: linear-gradient( 90deg, rgba(255,255,255,.055), transparent ) !important; border: 1px solid rgba(157,101,13,.085) !important; border-radius: 6px !important; box-shadow: none !important; color: #173f5f !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 26px !important; font-weight: 700 !important; line-height: 1.27 !important; letter-spacing: -.005em !important; text-align: left !important; text-shadow: none !important; } /* Línea dorada H3 — lector */ .ates-reader-overlay .ates-reader-content h3::after { content: "" !important; display: block !important; width: 76px !important; height: 2px !important; margin: 9px 0 0 !important; border-radius: 999px !important; background: linear-gradient( 90deg, #a96d17, #d0a04a, rgba(180,119,32,0) ) !important; } .ates-reader-overlay .ates-reader-content h3::before { content: none !important; display: none !important; } /* ========================================================== 6. H4 — MODO LECTOR ========================================================== */ .ates-reader-overlay .ates-reader-content h4 { position: relative !important; margin: 1.55em 0 .62em !important; padding: 0 !important; background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; color: #31536a !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 21px !important; font-weight: 700 !important; line-height: 1.35 !important; text-align: left !important; text-shadow: none !important; } .ates-reader-overlay .ates-reader-content h4::before, .ates-reader-overlay .ates-reader-content h4::after { content: none !important; display: none !important; } /* ========================================================== 7. MODO OSCURO — ARTÍCULO ========================================================== */ html.ates-dark body.single-post article.post .entry-content h2 { background: rgba(128,103,67,.27) !important; background-image: linear-gradient( 90deg, rgba(218,177,94,.055), rgba(218,177,94,.015) ) !important; border-color: rgba(218,177,94,.18) !important; color: #f0f2f3 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 2px 8px rgba(0,0,0,.05) !important; } html.ates-dark body.single-post article.post .entry-content h3 { background: rgba(128,103,67,.18) !important; background-image: linear-gradient( 90deg, rgba(218,177,94,.035), transparent ) !important; border-color: rgba(218,177,94,.13) !important; color: #e1e8eb !important; } html.ates-dark body.single-post article.post .entry-content h4 { color: #c9d5da !important; } html.ates-dark body.single-post article.post .entry-content h2::after, html.ates-dark body.single-post article.post .entry-content h3::after { background: linear-gradient( 90deg, #d2a44e, #e0bb70, rgba(210,164,78,0) ) !important; } /* ========================================================== 8. MODO OSCURO — LECTOR ========================================================== */ .ates-reader-overlay.ates-reader-dark .ates-reader-content h2 { background: rgba(128,103,67,.27) !important; background-image: linear-gradient( 90deg, rgba(218,177,94,.055), rgba(218,177,94,.015) ) !important; border-color: rgba(218,177,94,.18) !important; color: #f0f2f3 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 2px 8px rgba(0,0,0,.05) !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-content h3 { background: rgba(128,103,67,.18) !important; background-image: linear-gradient( 90deg, rgba(218,177,94,.035), transparent ) !important; border-color: rgba(218,177,94,.13) !important; color: #e1e8eb !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-content h4 { color: #c9d5da !important; } .ates-reader-overlay.ates-reader-dark .ates-reader-content h2::after, .ates-reader-overlay.ates-reader-dark .ates-reader-content h3::after { background: linear-gradient( 90deg, #d2a44e, #e0bb70, rgba(210,164,78,0) ) !important; } /* ========================================================== 9. TABLET ========================================================== */ @media (min-width:681px) and (max-width:1024px) { body.single-post article.post .entry-content h2, .ates-reader-overlay .ates-reader-content h2 { padding: 15px 20px 18px !important; } body.single-post article.post .entry-content h3, .ates-reader-overlay .ates-reader-content h3 { padding: 12px 18px 14px !important; } } /* ========================================================== 10. MÓVIL ========================================================== */ @media (max-width:680px) { /* H2 */ body.single-post article.post .entry-content h2, .ates-reader-overlay .ates-reader-content h2 { margin: 30px 0 17px !important; padding: 14px 15px 17px !important; border-radius: 6px !important; font-size: 27px !important; line-height: 1.24 !important; text-align: left !important; } body.single-post article.post .entry-content h2::after, .ates-reader-overlay .ates-reader-content h2::after { width: 90px !important; height: 2px !important; margin: 10px 0 0 !important; } /* H3 */ body.single-post article.post .entry-content h3, .ates-reader-overlay .ates-reader-content h3 { margin: 25px 0 15px !important; padding: 11px 14px 13px !important; border-radius: 5px !important; font-size: 23px !important; line-height: 1.28 !important; text-align: left !important; } body.single-post article.post .entry-content h3::after, .ates-reader-overlay .ates-reader-content h3::after { width: 64px !important; margin: 8px 0 0 !important; } /* H4 */ body.single-post article.post .entry-content h4, .ates-reader-overlay .ates-reader-content h4 { margin: 22px 0 11px !important; font-size: 20px !important; line-height: 1.35 !important; } } /* ========================================================== FIN ENCABEZADOS — FONDO SUAVE OSCURO ========================================================== */ /* ========================================================== PREGUNTAS Y RESPUESTAS Página ID 57710 A través de las Escrituras ========================================================== */ body.page-id-57710 { --qa-navy:#0b3153; --qa-navy-2:#123f67; --qa-gold:#c79a42; --qa-gold-soft:#dfc184; --qa-ink:#102d49; --qa-paper:#fffaf0; --qa-paper-2:#f8f0df; --qa-line:rgba(174,126,47,.30); --qa-muted:#647487; } /* Evita interferencias de estilos globales de headings */ body.page-id-57710 .ates-qa-library h2, body.page-id-57710 .ates-qa-library h3, body.page-id-57710 .ates-qa-library h4 { border:0 !important; box-shadow:none !important; text-align:left !important; text-transform:none !important; } /* ========================================================== CONTENEDOR ========================================================== */ body.page-id-57710 .ates-qa-library { position:relative; width:100%; margin:28px 0 60px; color:var(--qa-ink); } /* ========================================================== HERO ========================================================== */ body.page-id-57710 .ates-qa-hero { position:relative; margin:0 0 24px; padding:7px; border:1px solid rgba(190,145,61,.62); border-radius:6px; background: linear-gradient( 135deg, rgba(255,252,244,.98), rgba(247,237,216,.96) ); box-shadow: 0 15px 38px rgba(30,45,57,.10), inset 0 0 0 3px rgba(255,255,255,.58); overflow:hidden; } body.page-id-57710 .ates-qa-hero::before, body.page-id-57710 .ates-qa-hero::after { content:""; position:absolute; width:48px; height:48px; pointer-events:none; } body.page-id-57710 .ates-qa-hero::before { left:14px; top:14px; border-left:1px solid var(--qa-gold); border-top:1px solid var(--qa-gold); } body.page-id-57710 .ates-qa-hero::after { right:14px; bottom:14px; border-right:1px solid var(--qa-gold); border-bottom:1px solid var(--qa-gold); } body.page-id-57710 .ates-qa-hero-inner { position:relative; min-height:175px; display:grid; grid-template-columns:104px minmax(0,1fr) 150px; align-items:center; gap:26px; padding:28px 32px; border:1px solid rgba(190,145,61,.25); } /* Icono ? */ body.page-id-57710 .ates-qa-symbol { width:92px; height:92px; display:flex; align-items:center; justify-content:center; border-radius:50%; background: radial-gradient( circle at 35% 25%, #174d78, var(--qa-navy) 70% ); border:3px solid var(--qa-gold); box-shadow: 0 0 0 6px rgba(199,154,66,.12), 0 8px 20px rgba(11,49,83,.18); } body.page-id-57710 .ates-qa-symbol span { font-family:Georgia,"Times New Roman",serif; font-size:59px; line-height:1; color:#f2cf83; transform:translateY(-2px); } /* Copy */ body.page-id-57710 .ates-qa-hero-copy { position:relative; padding-left:25px; border-left:1px solid rgba(190,145,61,.55); } body.page-id-57710 .ates-qa-eyebrow { margin:0 0 7px; font-size:11px; font-weight:700; letter-spacing:.19em; text-transform:uppercase; color:#9d762f; } body.page-id-57710 .ates-qa-hero-copy h2 { margin:0 !important; padding:0 !important; background:none !important; font-family:Georgia,"Times New Roman",serif !important; font-size:clamp(32px,3.1vw,49px) !important; line-height:1.03 !important; font-weight:700 !important; letter-spacing:-.025em; color:var(--qa-navy) !important; } body.page-id-57710 .ates-qa-hero-copy h2::before, body.page-id-57710 .ates-qa-hero-copy h2::after { display:none !important; } body.page-id-57710 .ates-qa-hero-copy p { max-width:690px; margin:12px 0 0; font-family:Georgia,"Times New Roman",serif; font-size:15px; line-height:1.65; color:#485c6d; } /* Signo decorativo derecho */ body.page-id-57710 .ates-qa-decoration { display:flex; align-items:center; justify-content:center; height:100%; opacity:.07; } body.page-id-57710 .ates-qa-decoration span { font-family:Georgia,"Times New Roman",serif; font-size:145px; line-height:1; color:var(--qa-navy); } /* ========================================================== BUSCADOR ========================================================== */ body.page-id-57710 .ates-qa-tools { display:flex; align-items:center; gap:15px; margin:0 0 18px; } body.page-id-57710 .ates-qa-search { position:relative; flex:1; max-width:650px; } body.page-id-57710 .ates-qa-search-input { width:100%; min-height:52px; padding:0 52px 0 48px !important; border:1px solid rgba(166,124,51,.34) !important; border-radius:7px !important; outline:none; background:rgba(255,251,243,.92) !important; box-shadow: 0 5px 18px rgba(30,46,58,.06), inset 0 1px 0 rgba(255,255,255,.8) !important; font-family:Georgia,"Times New Roman",serif; font-size:15px !important; color:var(--qa-ink) !important; transition: border-color .2s ease, box-shadow .2s ease; } body.page-id-57710 .ates-qa-search-input:focus { border-color:var(--qa-gold) !important; box-shadow: 0 0 0 3px rgba(199,154,66,.13), 0 7px 22px rgba(30,46,58,.07) !important; } body.page-id-57710 .ates-qa-search-icon { position:absolute; left:18px; top:50%; transform:translateY(-52%); z-index:2; font-size:25px; color:var(--qa-gold); pointer-events:none; } body.page-id-57710 .ates-qa-search-clear { position:absolute; right:10px; top:50%; transform:translateY(-50%); display:none; width:32px; height:32px; padding:0; border:0; border-radius:50%; background:transparent; font-size:24px; line-height:1; color:#83909b; cursor:pointer; } body.page-id-57710 .ates-qa-search-clear.is-visible { display:block; } body.page-id-57710 .ates-qa-counter { white-space:nowrap; font-size:12px; font-weight:700; letter-spacing:.04em; color:#9a762e; } /* ========================================================== FILTROS / CATEGORÍAS ========================================================== */ body.page-id-57710 .ates-qa-category-nav { display:flex; flex-wrap:wrap; gap:8px; padding:0 0 27px; margin-bottom:25px; border-bottom:1px solid rgba(180,137,58,.22); } body.page-id-57710 .ates-qa-category-pill { appearance:none; margin:0; padding:8px 13px; border:1px solid rgba(169,127,54,.35); border-radius:999px; background:rgba(255,250,240,.76); font-family:inherit; font-size:12px; font-weight:650; color:var(--qa-navy); cursor:pointer; transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease; } body.page-id-57710 .ates-qa-category-pill:hover { color:#fff; background:var(--qa-navy); border-color:var(--qa-navy); transform:translateY(-1px); } /* ========================================================== CATEGORÍAS ========================================================== */ body.page-id-57710 .ates-qa-category { scroll-margin-top:100px; margin:0 0 40px; } body.page-id-57710 .ates-qa-category-heading { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:14px; margin:0 0 16px; } body.page-id-57710 .ates-qa-category-number { width:43px; height:43px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(180,135,55,.42); border-radius:50%; background:rgba(255,249,237,.88); font-family:Georgia,"Times New Roman",serif; font-size:13px; font-weight:700; color:#a27a32; } body.page-id-57710 .ates-qa-category-title-wrap h3 { margin:0 !important; padding:0 !important; background:none !important; font-family:Georgia,"Times New Roman",serif !important; font-size:clamp(22px,2vw,29px) !important; line-height:1.18 !important; font-weight:700 !important; color:var(--qa-navy) !important; } body.page-id-57710 .ates-qa-category-title-wrap h3::before, body.page-id-57710 .ates-qa-category-title-wrap h3::after { display:none !important; } body.page-id-57710 .ates-qa-category-rule { display:block; width:72px; height:2px; margin-top:8px; background: linear-gradient( 90deg, var(--qa-gold), rgba(199,154,66,.08) ); } body.page-id-57710 .ates-qa-category-count { padding:6px 10px; border-radius:999px; background:rgba(199,154,66,.09); font-size:10px; font-weight:750; letter-spacing:.06em; text-transform:uppercase; color:#99722d; } /* ========================================================== TARJETAS ========================================================== */ body.page-id-57710 .ates-qa-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } body.page-id-57710 .ates-qa-card { position:relative; min-width:0; margin:0; border:1px solid rgba(177,133,56,.31); border-radius:8px; background: linear-gradient( 145deg, rgba(255,252,245,.96), rgba(250,243,229,.92) ); box-shadow: 0 8px 25px rgba(31,48,61,.065); overflow:hidden; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; } body.page-id-57710 .ates-qa-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background: linear-gradient( 180deg, var(--qa-gold), #e2c482, var(--qa-gold) ); } body.page-id-57710 .ates-qa-card:hover { transform:translateY(-3px); border-color:rgba(176,130,49,.58); box-shadow: 0 13px 31px rgba(31,48,61,.11); } body.page-id-57710 .ates-qa-card-link { position:relative; display:flex; flex-direction:column; min-height:175px; height:100%; padding:20px 20px 17px 23px; color:inherit !important; text-decoration:none !important; } body.page-id-57710 .ates-qa-card-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:12px; } body.page-id-57710 .ates-qa-question-number { display:flex; align-items:center; justify-content:center; min-width:36px; height:25px; padding:0 8px; border-radius:999px; background:var(--qa-navy); font-size:10px; line-height:1; font-weight:800; letter-spacing:.08em; color:#fff; } body.page-id-57710 .ates-qa-card-mark { font-family:Georgia,"Times New Roman",serif; font-size:28px; line-height:1; color:rgba(180,133,54,.32); } body.page-id-57710 .ates-qa-card h4 { flex:1; margin:0 0 17px !important; padding:0 !important; background:none !important; font-family:Georgia,"Times New Roman",serif !important; font-size:18px !important; line-height:1.38 !important; font-weight:700 !important; color:var(--qa-navy) !important; } body.page-id-57710 .ates-qa-card h4::before, body.page-id-57710 .ates-qa-card h4::after { display:none !important; } body.page-id-57710 .ates-qa-read { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:12px; border-top:1px solid rgba(180,136,56,.19); font-size:11px; font-weight:750; letter-spacing:.06em; text-transform:uppercase; color:#9b742d; } body.page-id-57710 .ates-qa-read span:last-child { font-size:18px; transition:transform .2s ease; } body.page-id-57710 .ates-qa-card:hover .ates-qa-read span:last-child { transform:translateX(4px); } /* Categorías vacías */ body.page-id-57710 .ates-qa-empty { grid-column:1 / -1; display:flex; align-items:center; gap:10px; min-height:70px; padding:17px 20px; border:1px dashed rgba(178,133,54,.34); border-radius:8px; background:rgba(255,250,240,.48); font-family:Georgia,"Times New Roman",serif; font-size:14px; font-style:italic; color:#7d725f; } body.page-id-57710 .ates-qa-empty-icon { color:var(--qa-gold); } /* ========================================================== FORMULARIO "ENVÍA TU PREGUNTA" ========================================================== */ body.page-id-57710 form.contact-form { padding:24px !important; border:1px solid rgba(182,136,54,.30); border-radius:8px; background:rgba(255,250,241,.68); box-shadow:0 10px 30px rgba(35,50,62,.06); } body.page-id-57710 form.contact-form input:not([type="submit"]), body.page-id-57710 form.contact-form textarea { border:1px solid rgba(172,132,61,.34) !important; border-radius:5px !important; background:rgba(255,255,255,.70) !important; color:#17344d !important; } body.page-id-57710 form.contact-form input:focus, body.page-id-57710 form.contact-form textarea:focus { outline:none !important; border-color:var(--qa-gold) !important; box-shadow:0 0 0 3px rgba(199,154,66,.12) !important; } body.page-id-57710 form.contact-form button, body.page-id-57710 form.contact-form input[type="submit"] { border-radius:5px !important; border:1px solid #092b49 !important; background:var(--qa-navy) !important; color:#fff !important; font-weight:700 !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-57710 .ates-qa-hero { background: linear-gradient( 135deg, rgba(23,36,48,.98), rgba(18,30,41,.97) ); border-color:rgba(205,163,82,.48); } html.ates-dark body.page-id-57710 .ates-qa-hero-inner { border-color:rgba(205,163,82,.15); } html.ates-dark body.page-id-57710 .ates-qa-hero-copy h2, html.ates-dark body.page-id-57710 .ates-qa-category-title-wrap h3, html.ates-dark body.page-id-57710 .ates-qa-card h4 { color:#f1e6cf !important; } html.ates-dark body.page-id-57710 .ates-qa-hero-copy p { color:#b9c2c9; } html.ates-dark body.page-id-57710 .ates-qa-search-input, html.ates-dark body.page-id-57710 .ates-qa-category-pill, html.ates-dark body.page-id-57710 .ates-qa-category-number { background:rgba(24,38,50,.88) !important; color:#e5ddd0 !important; } html.ates-dark body.page-id-57710 .ates-qa-card { background: linear-gradient( 145deg, rgba(27,40,52,.96), rgba(21,34,46,.94) ); border-color:rgba(205,163,82,.28); } html.ates-dark body.page-id-57710 .ates-qa-card-link { color:#e7e0d4 !important; } html.ates-dark body.page-id-57710 .ates-qa-empty { background:rgba(25,38,49,.55); color:#bbb4a9; } html.ates-dark body.page-id-57710 form.contact-form { background:rgba(23,36,48,.72); } html.ates-dark body.page-id-57710 form.contact-form input:not([type="submit"]), html.ates-dark body.page-id-57710 form.contact-form textarea { background:rgba(15,27,38,.72) !important; color:#eee5d7 !important; } /* ========================================================== TABLET ========================================================== */ @media (max-width:1024px) { body.page-id-57710 .ates-qa-hero-inner { grid-template-columns:82px minmax(0,1fr); padding:25px; } body.page-id-57710 .ates-qa-symbol { width:74px; height:74px; } body.page-id-57710 .ates-qa-symbol span { font-size:48px; } body.page-id-57710 .ates-qa-decoration { display:none; } } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:767px) { body.page-id-57710 .ates-qa-library { margin-top:20px; } body.page-id-57710 .ates-qa-hero-inner { display:block; min-height:0; padding:25px 19px 23px; text-align:center; } body.page-id-57710 .ates-qa-symbol { width:68px; height:68px; margin:0 auto 18px; } body.page-id-57710 .ates-qa-symbol span { font-size:44px; } body.page-id-57710 .ates-qa-hero-copy { padding-left:0; border-left:0; } body.page-id-57710 .ates-qa-hero-copy h2 { text-align:center !important; font-size:31px !important; } body.page-id-57710 .ates-qa-eyebrow { text-align:center; font-size:9px; } body.page-id-57710 .ates-qa-hero-copy p { text-align:center; font-size:14px; line-height:1.55; } body.page-id-57710 .ates-qa-tools { display:block; } body.page-id-57710 .ates-qa-counter { min-height:18px; padding-top:7px; } body.page-id-57710 .ates-qa-category-nav { flex-wrap:nowrap; overflow-x:auto; padding-bottom:15px; margin-bottom:27px; scrollbar-width:none; -webkit-overflow-scrolling:touch; } body.page-id-57710 .ates-qa-category-nav::-webkit-scrollbar { display:none; } body.page-id-57710 .ates-qa-category-pill { flex:0 0 auto; white-space:nowrap; } body.page-id-57710 .ates-qa-category-heading { grid-template-columns:41px minmax(0,1fr); gap:11px; } body.page-id-57710 .ates-qa-category-number { width:38px; height:38px; } body.page-id-57710 .ates-qa-category-title-wrap h3 { font-size:21px !important; } body.page-id-57710 .ates-qa-category-count { grid-column:2; justify-self:start; margin-top:-7px; } body.page-id-57710 .ates-qa-grid { grid-template-columns:1fr; gap:11px; } body.page-id-57710 .ates-qa-card-link { min-height:155px; padding:18px 17px 15px 20px; } body.page-id-57710 .ates-qa-card h4 { font-size:17px !important; } body.page-id-57710 form.contact-form { padding:17px !important; } }/* ========================================================== CUADERNO / PAPEL TAMBIÉN EN LAS PÁGINAS A través de las Escrituras ========================================================== */ /* ---------------------------------------------------------- 1. PAPEL CON TEXTURA ---------------------------------------------------------- */ html body.page .site-main article.page, html body.page .site-main article.type-page { position: relative; background-color: rgba(255,255,255,.42) !important; background-image: /* Fibra horizontal */ repeating-linear-gradient( 0deg, rgba(30,45,55,.018) 0px, rgba(30,45,55,.018) 1px, transparent 1px, transparent 5px ), /* Fibra vertical */ repeating-linear-gradient( 90deg, rgba(30,45,55,.009) 0px, rgba(30,45,55,.009) 1px, transparent 1px, transparent 11px ), /* Envejecimiento suave */ radial-gradient( ellipse at 14% 18%, rgba(184,145,76,.045), transparent 28% ), radial-gradient( ellipse at 82% 26%, rgba(255,255,255,.16), transparent 31% ), radial-gradient( ellipse at 28% 76%, rgba(181,145,80,.035), transparent 30% ), radial-gradient( ellipse at 72% 82%, rgba(255,255,255,.13), transparent 34% ), /* Variación del papel */ linear-gradient( 115deg, rgba(255,255,255,.08) 0%, transparent 27%, rgba(180,145,82,.018) 52%, transparent 72%, rgba(255,255,255,.06) 100% ) !important; border: 1px solid rgba(176,137,75,.22); box-shadow: 0 2px 4px rgba(30,40,50,.04), 0 12px 32px rgba(30,40,50,.07); border-radius: 2px; } /* ---------------------------------------------------------- 2. INTERIOR TRANSPARENTE Para que ningún bloque blanco tape el papel ---------------------------------------------------------- */ html body.page article.page > .entry-content, html body.page article.type-page > .entry-content { background-color: transparent !important; } /* ---------------------------------------------------------- 3. TÍTULO PRINCIPAL DE LA PÁGINA ---------------------------------------------------------- */ html body.page article.page .entry-title, html body.page article.type-page .entry-title { position: relative; margin-bottom: 30px !important; padding-bottom: 15px !important; font-family: Georgia, "Times New Roman", serif !important; color: #071f3d !important; font-weight: 700 !important; letter-spacing: -.015em; } /* Línea dorada bajo el título */ html body.page article.page .entry-title::after, html body.page article.type-page .entry-title::after { content: ""; display: block; width: 90px; height: 2px; margin-top: 12px; background: linear-gradient( 90deg, #b98936, #d7b66c 65%, transparent ); } /* ---------------------------------------------------------- 4. H2 DE LAS PÁGINAS Estilo editorial ---------------------------------------------------------- */ html body.page .entry-content > h2.wp-block-heading { position: relative; margin-top: 38px !important; margin-bottom: 20px !important; padding: 13px 18px 14px !important; border: 1px solid rgba(179,138,68,.23) !important; border-left: 3px solid #b98936 !important; border-radius: 3px !important; background: rgba(190,166,124,.20) !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; line-height: 1.25 !important; text-align: left !important; color: #092844 !important; } /* Línea decorativa */ html body.page .entry-content > h2.wp-block-heading::after { content: ""; display: block; width: 75px; height: 2px; margin-top: 9px; background: linear-gradient( 90deg, #b98936, transparent ); } /* ---------------------------------------------------------- 5. H3 ---------------------------------------------------------- */ html body.page .entry-content > h3.wp-block-heading { margin-top: 30px !important; margin-bottom: 15px !important; padding: 9px 14px 10px !important; border: 0 !important; border-left: 2px solid rgba(185,137,54,.75) !important; background: rgba(190,166,124,.11) !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; color: #12344f !important; text-align: left !important; } /* ---------------------------------------------------------- 6. H4 Limpio ---------------------------------------------------------- */ html body.page .entry-content > h4.wp-block-heading { margin-top: 25px !important; margin-bottom: 12px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; color: #17364f !important; text-align: left !important; } /* ========================================================== 7. NO INTERFERIR CON COMPONENTES ESPECIALES ========================================================== */ body.page .ates-qa-library h2, body.page .ates-qa-library h3, body.page .ates-qa-library h4, body.page .ates-estudios-hero h1, body.page .ates-estudios-hero h2, body.page .ates-estudios-hero h3, body.page [class*="ates-articulos"] h1, body.page [class*="ates-articulos"] h2, body.page [class*="ates-articulos"] h3 { border: revert !important; border-left: revert !important; background: revert !important; padding: revert !important; } /* ========================================================== 8. MODO OSCURO ========================================================== */ html.ates-dark body.page .site-main article.page, html.ates-dark body.page .site-main article.type-page { background: repeating-linear-gradient( to bottom, transparent 0px, transparent 27px, rgba(178,195,205,.065) 28px, transparent 29px ), repeating-linear-gradient( 0deg, rgba(255,255,255,.018) 0px, rgba(255,255,255,.018) 1px, transparent 1px, transparent 4px ), repeating-linear-gradient( 90deg, rgba(255,255,255,.012) 0px, rgba(255,255,255,.012) 1px, transparent 1px, transparent 9px ), radial-gradient( ellipse at 12% 16%, rgba(201,169,106,.050), transparent 30% ), radial-gradient( ellipse at 82% 25%, rgba(255,255,255,.045), transparent 34% ), linear-gradient( 135deg, #344b5b 0%, #304756 45%, #2b414f 75%, #334a58 100% ) !important; border-color: rgba(201,169,106,.28) !important; box-shadow: 0 2px 4px rgba(0,0,0,.08), 0 10px 25px rgba(0,0,0,.13), 0 25px 50px rgba(0,0,0,.09) !important; } html.ates-dark body.page article.page .entry-title, html.ates-dark body.page article.type-page .entry-title, html.ates-dark body.page .entry-content > h2.wp-block-heading, html.ates-dark body.page .entry-content > h3.wp-block-heading, html.ates-dark body.page .entry-content > h4.wp-block-heading { color: #f0e8db !important; } html.ates-dark body.page .entry-content > h2.wp-block-heading { background: rgba(201,169,106,.10) !important; border-color: rgba(201,169,106,.25) !important; border-left-color: #caa457 !important; } html.ates-dark body.page .entry-content > h3.wp-block-heading { background: rgba(201,169,106,.065) !important; border-left-color: #caa457 !important; } /* ========================================================== 9. MÓVIL ========================================================== */ @media (max-width:767px) { html body.page .entry-content > h2.wp-block-heading { margin-top: 30px !important; padding: 11px 13px 12px !important; font-size: 24px !important; } html body.page .entry-content > h3.wp-block-heading { margin-top: 24px !important; padding: 8px 11px 9px !important; font-size: 21px !important; } html body.page article.page .entry-title, html body.page article.type-page .entry-title { margin-bottom: 23px !important; padding-bottom: 12px !important; } }/* ========================================================== ENSANCHAR CUADERNO EN LAS PÁGINAS ========================================================== */ /* ESCRITORIO */ @media (min-width:1025px) { body.page .site-main article.page, body.page .site-main article.type-page { width: calc(100% + 100px) !important; max-width: none !important; margin-left: -50px !important; margin-right: -50px !important; padding-left: 55px !important; padding-right: 55px !important; } } /* TABLET */ @media (min-width:768px) and (max-width:1024px) { body.page .site-main article.page, body.page .site-main article.type-page { width: calc(100% + 50px) !important; max-width: none !important; margin-left: -25px !important; margin-right: -25px !important; padding-left: 32px !important; padding-right: 32px !important; } } /* MÓVIL */ @media (max-width:767px) { body.page .site-main article.page, body.page .site-main article.type-page { width: calc(100% + 24px) !important; max-width: none !important; margin-left: -12px !important; margin-right: -12px !important; padding-left: 18px !important; padding-right: 18px !important; } } /* ========================================================== ENTRADA ABIERTA — CUADERNO LIGERAMENTE MÁS CLARO Original .42 → ahora .43 ========================================================== */ html:not(.ates-dark) body.single-post .site-main article.post, html:not(.ates-dark) body.single-post article.post { background-color: rgba(255,255,255,.43) !important; background-image: /* Fibra horizontal */ repeating-linear-gradient( 0deg, rgba(30,45,55,.018) 0px, rgba(30,45,55,.018) 1px, transparent 1px, transparent 5px ), /* Fibra vertical */ repeating-linear-gradient( 90deg, rgba(30,45,55,.009) 0px, rgba(30,45,55,.009) 1px, transparent 1px, transparent 11px ), /* Envejecimiento suave */ radial-gradient( ellipse at 14% 18%, rgba(184,145,76,.045), transparent 28% ), /* Iluminación */ radial-gradient( ellipse at 82% 26%, rgba(255,255,255,.16), transparent 31% ), radial-gradient( ellipse at 28% 76%, rgba(181,145,80,.035), transparent 30% ), radial-gradient( ellipse at 72% 82%, rgba(255,255,255,.13), transparent 34% ), /* Variación natural del papel */ linear-gradient( 115deg, rgba(255,255,255,.08) 0%, transparent 27%, rgba(180,145,82,.018) 52%, transparent 72%, rgba(255,255,255,.06) 100% ) !important; }/* ========================================================== ENTRADA ABIERTA — CUADERNO TONO INTERMEDIO ========================================================== */ html:not(.ates-dark) body.single-post article.post, html:not(.ates-dark) body.single-post .site-main article.post, html:not(.ates-dark) body.single-post article.post .entry-content { background-color: rgba(246, 243, 233, .72) !important; background-image: /* Fibra horizontal */ repeating-linear-gradient( 0deg, rgba(30,45,55,.018) 0px, rgba(30,45,55,.018) 1px, transparent 1px, transparent 5px ), /* Fibra vertical */ repeating-linear-gradient( 90deg, rgba(30,45,55,.009) 0px, rgba(30,45,55,.009) 1px, transparent 1px, transparent 11px ), /* Envejecimiento cálido */ radial-gradient( ellipse at 14% 18%, rgba(170,132,72,.045), transparent 28% ), /* Luz suave */ radial-gradient( ellipse at 82% 26%, rgba(255,255,255,.13), transparent 31% ), radial-gradient( ellipse at 28% 76%, rgba(170,132,72,.030), transparent 30% ), radial-gradient( ellipse at 72% 82%, rgba(255,255,255,.11), transparent 34% ), /* Base del papel — tono intermedio */ linear-gradient( 135deg, rgba(246,243,233,.78), rgba(240,236,224,.74) ) !important; }/* ========================================================== ENTRADAS — EFECTO DE HOJA / CUADERNO REALISTA MÁS VISIBLE ========================================================== */ html:not(.ates-dark) body.single-post .site-main article.post, html:not(.ates-dark) body.single-post article.post { /* Borde ligeramente envejecido */ border: 1px solid rgba(112, 88, 53, .32) !important; /* Relieve + sombra visible debajo de la hoja */ box-shadow: /* Luz sobre el borde superior */ inset 0 2px 2px rgba(255,255,255,.75), /* Oscurecimiento muy suave en los laterales */ inset 4px 0 8px rgba(95,72,43,.055), inset -4px 0 8px rgba(95,72,43,.055), /* Sombra inferior de la hoja */ 0 3px 3px rgba(55,42,28,.16), 0 10px 18px rgba(55,42,28,.18), 0 24px 42px rgba(55,42,28,.14), 0 38px 65px rgba(55,42,28,.08) !important; } /* ========================================================== BORDE INFERIOR — MÁS SENSACIÓN DE GROSOR DEL PAPEL ========================================================== */ html:not(.ates-dark) body.single-post article.post { border-bottom: 3px solid rgba(105,82,51,.24) !important; } /* ========================================================== TEXTO IMPRESO SOBRE PAPEL ========================================================== */ html:not(.ates-dark) body.single-post article.post .entry-content p, html:not(.ates-dark) body.single-post article.post .entry-content li { text-shadow: 0 1px 0 rgba(255,255,255,.38) !important; } /* ========================================================== TÍTULO — IMPRESIÓN MÁS NATURAL ========================================================== */ html:not(.ates-dark) body.single-post article.post .entry-title { text-shadow: 0 1px 0 rgba(255,255,255,.55), 0 2px 2px rgba(35,45,48,.08) !important; } /* ========================================================== MÓVIL — SOMBRA ALGO MÁS CONTROLADA ========================================================== */ @media (max-width:767px) { html:not(.ates-dark) body.single-post article.post { box-shadow: inset 0 2px 2px rgba(255,255,255,.70), inset 3px 0 6px rgba(95,72,43,.05), inset -3px 0 6px rgba(95,72,43,.05), 0 3px 3px rgba(55,42,28,.14), 0 9px 17px rgba(55,42,28,.15), 0 20px 32px rgba(55,42,28,.11) !important; } } /* ========================================================== ENTRADAS — QUITAR EL SEGUNDO FONDO INTERIOR PARA QUE SE VEA EL PAPEL REAL DEL FOLIO ========================================================== */ html:not(.ates-dark) body.single-post article.post .entry-content, html:not(.ates-dark) body.single-post article.post .entry-content > div, html:not(.ates-dark) body.single-post article.post .entry-content > section { background-color: transparent !important; background-image: none !important; box-shadow: none !important; } /* ========================================================== PÁGINAS — FONDO MUY SUAVE EN H2 / H3 ========================================================== */ /* H2 */ html:not(.ates-dark) body.page .entry-content > h2.wp-block-heading { background: rgba(205, 188, 154, .13) !important; } /* H3 */ html:not(.ates-dark) body.page .entry-content > h3.wp-block-heading { background: rgba(205, 188, 154, .07) !important; } /* ========================================================== ENTRADAS — CUADERNO PERGAMINO CLARO CÁLIDO, SUAVE Y CON PROFUNDIDAD ========================================================== */ html:not(.ates-dark) body.single-post .site-main article.post, html:not(.ates-dark) body.single-post article.post { background-color: #f0e9dc !important; background-image: /* Fibra horizontal */ repeating-linear-gradient( 0deg, rgba(73,55,35,.018) 0px, rgba(73,55,35,.018) 1px, transparent 1px, transparent 5px ), /* Fibra vertical */ repeating-linear-gradient( 90deg, rgba(78,58,36,.009) 0px, rgba(78,58,36,.009) 1px, transparent 1px, transparent 11px ), /* Matiz cálido */ radial-gradient( ellipse at 14% 18%, rgba(151,108,56,.045), transparent 30% ), /* Luz natural */ radial-gradient( ellipse at 82% 26%, rgba(255,252,242,.22), transparent 32% ), /* Variación inferior */ radial-gradient( ellipse at 28% 76%, rgba(145,101,52,.032), transparent 31% ), radial-gradient( ellipse at 72% 82%, rgba(255,250,235,.16), transparent 34% ), /* BASE DEL PAPEL — MÁS CLARA */ linear-gradient( 135deg, #f3ede2 0%, #ece3d4 42%, #f0e8dc 70%, #e9decc 100% ) !important; border-color: rgba(126,91,48,.27) !important; border-bottom: 3px solid rgba(105,82,51,.22) !important; /* Profundidad del folio */ box-shadow: inset 0 2px 2px rgba(255,255,255,.78), inset 4px 0 8px rgba(95,72,43,.05), inset -4px 0 8px rgba(95,72,43,.05), 0 3px 3px rgba(55,42,28,.16), 0 10px 18px rgba(55,42,28,.18), 0 24px 42px rgba(55,42,28,.14), 0 38px 65px rgba(55,42,28,.08) !important; } /* ========================================================== EVITAR EL SEGUNDO RECUADRO INTERIOR ========================================================== */ html:not(.ates-dark) body.single-post article.post .entry-content, html:not(.ates-dark) body.single-post article.post .entry-content > div, html:not(.ates-dark) body.single-post article.post .entry-content > section { background-color: transparent !important; background-image: none !important; box-shadow: none !important; } /* Texto ligeramente integrado en el papel */ html:not(.ates-dark) body.single-post article.post .entry-content p, html:not(.ates-dark) body.single-post article.post .entry-content li { text-shadow: 0 1px 0 rgba(255,255,255,.28) !important; } /* MÓVIL */ @media (max-width: 767px) { html:not(.ates-dark) body.single-post article.post { box-shadow: inset 0 2px 2px rgba(255,255,255,.68), inset 3px 0 7px rgba(95,72,43,.04), inset -3px 0 7px rgba(95,72,43,.04), 0 3px 3px rgba(55,42,28,.13), 0 9px 17px rgba(55,42,28,.14), 0 20px 34px rgba(55,42,28,.10) !important; } }/* ========================================================== MÓVIL — HACER MÁS VISIBLE LA TEXTURA DEL CUADERNO SIN CAMBIAR EL TONO DEL PAPEL ========================================================== */ @media (max-width: 767px) { html:not(.ates-dark) body.single-post .site-main article.post, html:not(.ates-dark) body.single-post article.post { background-color: #f0e9dc !important; background-image: /* Líneas/fibra horizontal más visible */ repeating-linear-gradient( 0deg, rgba(82, 61, 39, .032) 0px, rgba(82, 61, 39, .032) 1px, transparent 1px, transparent 5px ), /* Fibra vertical */ repeating-linear-gradient( 90deg, rgba(82, 61, 39, .018) 0px, rgba(82, 61, 39, .018) 1px, transparent 1px, transparent 10px ), /* Envejecimiento suave arriba izquierda */ radial-gradient( ellipse at 5% 12%, rgba(150, 105, 53, .075), transparent 34% ), /* Zona clara irregular */ radial-gradient( ellipse at 88% 24%, rgba(255, 252, 240, .30), transparent 38% ), /* Envejecimiento inferior */ radial-gradient( ellipse at 15% 82%, rgba(145, 101, 52, .065), transparent 36% ), /* Otra variación del papel */ radial-gradient( ellipse at 90% 74%, rgba(255, 250, 232, .22), transparent 38% ), /* Sombreado muy ligero de los laterales */ linear-gradient( 90deg, rgba(105, 76, 45, .055) 0%, transparent 8%, transparent 92%, rgba(105, 76, 45, .05) 100% ), /* BASE — MISMO TONO */ linear-gradient( 135deg, #f3ede2 0%, #ece3d4 42%, #f0e8dc 70%, #e9decc 100% ) !important; } /* El contenido no debe tapar la textura */ html:not(.ates-dark) body.single-post article.post .entry-content { background-color: transparent !important; background-image: none !important; } }/* ========================================================== ESTUDIOS BÍBLICOS — PAGE ID 5510 DISEÑO EDITORIAL / BIBLIOTECA DE ESTUDIO ========================================================== */ /* ---------------------------------------------------------- CONTENEDOR PRINCIPAL ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content { background: radial-gradient( ellipse at 12% 10%, rgba(174, 133, 72, .045), transparent 32% ), radial-gradient( ellipse at 88% 84%, rgba(255,255,255,.20), transparent 34% ), repeating-linear-gradient( 0deg, rgba(76,57,36,.012) 0px, rgba(76,57,36,.012) 1px, transparent 1px, transparent 5px ), linear-gradient( 135deg, rgba(248,244,235,.96), rgba(239,231,216,.94) ) !important; border: 1px solid rgba(145, 107, 58, .28) !important; box-shadow: 0 3px 5px rgba(50,38,25,.08), 0 14px 35px rgba(50,38,25,.09) !important; padding: clamp(28px, 4vw, 56px) !important; border-radius: 3px !important; } /* ---------------------------------------------------------- TÍTULO PRINCIPAL ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content > h1, html:not(.ates-dark) body.page-id-5510 .entry-content > h1.wp-block-heading { color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; line-height: 1.12 !important; letter-spacing: -.02em !important; margin-bottom: 16px !important; position: relative; padding-bottom: 18px !important; } /* Línea dorada bajo el título */ html:not(.ates-dark) body.page-id-5510 .entry-content > h1::after { content: ""; display: block; width: 115px; height: 3px; margin-top: 16px; background: linear-gradient( 90deg, #a97831, #d7b369, transparent ); } /* ---------------------------------------------------------- INTRODUCCIÓN ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content > p:first-of-type { font-family: Georgia, "Times New Roman", serif !important; font-size: 1.12em !important; line-height: 1.8 !important; color: #34434a !important; max-width: 880px; margin-bottom: 32px !important; } /* ---------------------------------------------------------- H2 — GRANDES SECCIONES ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content > h2, html:not(.ates-dark) body.page-id-5510 .entry-content > h2.wp-block-heading { color: #071f3d !important; background: linear-gradient( 90deg, rgba(206,187,150,.24), rgba(206,187,150,.10), transparent ) !important; border-left: 4px solid #b78a43 !important; padding: 13px 18px !important; margin-top: 42px !important; margin-bottom: 20px !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; position: relative; } /* Línea fina inferior */ html:not(.ates-dark) body.page-id-5510 .entry-content > h2::after { content: ""; position: absolute; left: 18px; bottom: -5px; width: 82px; height: 2px; background: #c49a53; } /* ---------------------------------------------------------- H3 — SUBSECCIONES ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content > h3, html:not(.ates-dark) body.page-id-5510 .entry-content > h3.wp-block-heading { color: #0a2b4d !important; background: rgba(216,200,171,.13) !important; border-bottom: 1px solid rgba(183,138,67,.38) !important; padding: 10px 14px !important; margin-top: 30px !important; margin-bottom: 15px !important; font-family: Georgia, "Times New Roman", serif !important; } /* ---------------------------------------------------------- H4 — LIMPIO ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content > h4, html:not(.ates-dark) body.page-id-5510 .entry-content > h4.wp-block-heading { color: #123653 !important; background: transparent !important; border: none !important; border-left: 3px solid rgba(183,138,67,.62) !important; padding-left: 12px !important; margin-top: 24px !important; font-family: Georgia, "Times New Roman", serif !important; } /* ---------------------------------------------------------- LISTAS ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content ul, html:not(.ates-dark) body.page-id-5510 .entry-content ol { margin: 18px 0 28px 0 !important; padding-left: 28px !important; } html:not(.ates-dark) body.page-id-5510 .entry-content li { margin-bottom: 9px !important; line-height: 1.68 !important; color: #34434a !important; } html:not(.ates-dark) body.page-id-5510 .entry-content li::marker { color: #ae7e36 !important; font-weight: 700; } /* ---------------------------------------------------------- ENLACES A ESTUDIOS ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content a { color: #0a3158 !important; text-decoration-color: rgba(176,132,62,.62) !important; text-decoration-thickness: 1px; text-underline-offset: 3px; transition: color .2s ease, text-decoration-color .2s ease; } html:not(.ates-dark) body.page-id-5510 .entry-content a:hover { color: #9a6928 !important; text-decoration-color: #b8863b !important; } /* ---------------------------------------------------------- BLOQUES / GRUPOS DE ESTUDIO Gutenberg Group ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content .wp-block-group { background: linear-gradient( 135deg, rgba(255,253,247,.72), rgba(242,234,218,.66) ) !important; border: 1px solid rgba(158,119,64,.25) !important; border-left: 4px solid rgba(174,128,55,.78) !important; padding: 22px 24px !important; margin: 24px 0 !important; box-shadow: 0 3px 8px rgba(55,42,28,.05), 0 9px 20px rgba(55,42,28,.045) !important; border-radius: 2px; } /* ---------------------------------------------------------- CITAS BÍBLICAS / BLOCKQUOTE ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content blockquote, html:not(.ates-dark) body.page-id-5510 .entry-content .wp-block-quote { background: rgba(236,226,205,.55) !important; border-left: 4px solid #b4863c !important; margin: 28px 0 !important; padding: 20px 24px !important; color: #31434c !important; font-family: Georgia, "Times New Roman", serif !important; font-style: italic; box-shadow: inset 0 1px 0 rgba(255,255,255,.48); } /* ---------------------------------------------------------- SEPARADORES ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content hr, html:not(.ates-dark) body.page-id-5510 .wp-block-separator { border: 0 !important; height: 1px !important; background: linear-gradient( 90deg, transparent, rgba(177,132,60,.52), transparent ) !important; margin: 38px 0 !important; } /* ---------------------------------------------------------- IMÁGENES ---------------------------------------------------------- */ html:not(.ates-dark) body.page-id-5510 .entry-content img { border: 1px solid rgba(125,91,48,.30) !important; box-shadow: 0 4px 10px rgba(55,42,28,.10), 0 12px 24px rgba(55,42,28,.08) !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-5510 .entry-content { background: radial-gradient( ellipse at 12% 15%, rgba(202,164,99,.045), transparent 32% ), repeating-linear-gradient( 0deg, rgba(255,255,255,.012) 0px, rgba(255,255,255,.012) 1px, transparent 1px, transparent 5px ), linear-gradient( 135deg, #314958, #2c4351 ) !important; border-color: rgba(201,169,106,.24) !important; box-shadow: 0 10px 30px rgba(0,0,0,.18) !important; } html.ates-dark body.page-id-5510 .entry-content > h1, html.ates-dark body.page-id-5510 .entry-content > h2, html.ates-dark body.page-id-5510 .entry-content > h3, html.ates-dark body.page-id-5510 .entry-content > h4 { color: #f2e4bf !important; } html.ates-dark body.page-id-5510 .entry-content > h2 { background: linear-gradient( 90deg, rgba(201,169,106,.15), rgba(201,169,106,.04), transparent ) !important; } html.ates-dark body.page-id-5510 .entry-content > h3 { background: rgba(201,169,106,.075) !important; border-color: rgba(201,169,106,.30) !important; } html.ates-dark body.page-id-5510 .entry-content p, html.ates-dark body.page-id-5510 .entry-content li { color: #edf1f3 !important; } html.ates-dark body.page-id-5510 .entry-content a { color: #e0bd78 !important; } html.ates-dark body.page-id-5510 .entry-content .wp-block-group { background: rgba(25,45,59,.42) !important; border-color: rgba(201,169,106,.20) !important; border-left-color: rgba(218,179,103,.70) !important; } html.ates-dark body.page-id-5510 .entry-content blockquote { background: rgba(21,39,52,.48) !important; color: #edf1f3 !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 767px) { html body.page-id-5510 .entry-content { padding: 24px 18px !important; } html body.page-id-5510 .entry-content > h1 { font-size: clamp(30px, 9vw, 40px) !important; } html body.page-id-5510 .entry-content > h2 { padding: 11px 13px !important; margin-top: 32px !important; } html body.page-id-5510 .entry-content > h3 { padding: 9px 11px !important; } html body.page-id-5510 .entry-content .wp-block-group { padding: 18px 16px !important; } html body.page-id-5510 .entry-content blockquote { padding: 17px 18px !important; } }/* ========================================================== PARASHÁ SEMANAL — PAGE ID 42032 ESTILO MANUSCRITO / TORÁ ========================================================== */ /* CONTENEDOR PRINCIPAL */ html:not(.ates-dark) body.page-id-42032 .entry-content { background: radial-gradient( ellipse at 12% 10%, rgba(157, 112, 56, .06), transparent 30% ), radial-gradient( ellipse at 88% 18%, rgba(255,255,255,.20), transparent 32% ), radial-gradient( ellipse at 22% 82%, rgba(147, 101, 50, .04), transparent 32% ), repeating-linear-gradient( 0deg, rgba(73,55,35,.014) 0px, rgba(73,55,35,.014) 1px, transparent 1px, transparent 5px ), linear-gradient( 135deg, #f4eee2 0%, #ede3d2 48%, #f1e9dc 72%, #e9ddc9 100% ) !important; border: 1px solid rgba(133,94,46,.30) !important; border-top: 3px solid rgba(172,127,58,.58) !important; padding: clamp(30px,4vw,58px) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 4px 7px rgba(50,38,25,.08), 0 16px 38px rgba(50,38,25,.10) !important; border-radius: 2px !important; } /* ========================================================== TÍTULO PRINCIPAL ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content > h1, html:not(.ates-dark) body.page-id-42032 .entry-content > h1.wp-block-heading { color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; text-align: center !important; letter-spacing: -.02em !important; line-height: 1.12 !important; margin-bottom: 28px !important; padding-bottom: 22px !important; position: relative; } /* Ornamento dorado bajo el título */ html:not(.ates-dark) body.page-id-42032 .entry-content > h1::after { content: "✦"; display: block; color: #b4873f; font-size: 17px; font-weight: 400; letter-spacing: 10px; margin: 17px auto 0; width: 125px; border-bottom: 1px solid rgba(183,138,67,.54); padding-bottom: 7px; } /* ========================================================== TEXTO INTRODUCTORIO ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content > p:first-of-type { max-width: 880px; margin-left: auto !important; margin-right: auto !important; color: #36434a !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.11em !important; line-height: 1.8 !important; } /* ========================================================== H2 — PARASHOT / GRANDES SECCIONES ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content > h2, html:not(.ates-dark) body.page-id-42032 .entry-content > h2.wp-block-heading { color: #092846 !important; background: linear-gradient( 90deg, rgba(196,164,111,.20), rgba(215,193,155,.10), transparent ) !important; border-left: 4px solid #b3863e !important; border-bottom: 1px solid rgba(177,132,60,.25) !important; padding: 13px 18px !important; margin-top: 42px !important; margin-bottom: 20px !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; } /* ========================================================== H3 — SUBSECCIONES ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content > h3, html:not(.ates-dark) body.page-id-42032 .entry-content > h3.wp-block-heading { color: #123653 !important; background: rgba(203,184,149,.10) !important; border-bottom: 1px solid rgba(177,132,60,.34) !important; padding: 9px 13px !important; margin-top: 29px !important; margin-bottom: 15px !important; font-family: Georgia, "Times New Roman", serif !important; } /* ========================================================== H4 — LIMPIO ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content > h4, html:not(.ates-dark) body.page-id-42032 .entry-content > h4.wp-block-heading { background: transparent !important; color: #173a56 !important; border: none !important; border-left: 3px solid rgba(181,135,62,.58) !important; padding-left: 11px !important; } /* ========================================================== CITAS BÍBLICAS ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content blockquote, html:not(.ates-dark) body.page-id-42032 .entry-content .wp-block-quote { background: linear-gradient( 135deg, rgba(233,220,195,.62), rgba(245,239,225,.58) ) !important; border-left: 4px solid #ad7f37 !important; border-right: 1px solid rgba(173,127,55,.18) !important; padding: 21px 25px !important; margin: 28px 0 !important; font-family: Georgia, "Times New Roman", serif !important; font-style: italic; color: #34434a !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.48); } /* ========================================================== LISTAS ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content ul, html:not(.ates-dark) body.page-id-42032 .entry-content ol { padding-left: 28px !important; margin: 18px 0 28px !important; } html:not(.ates-dark) body.page-id-42032 .entry-content li { color: #34434a !important; line-height: 1.7 !important; margin-bottom: 9px !important; } html:not(.ates-dark) body.page-id-42032 .entry-content li::marker { color: #a87531 !important; } /* ========================================================== ENLACES ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content a { color: #0a3158 !important; text-decoration-color: rgba(176,132,62,.60) !important; text-underline-offset: 3px; transition: color .2s ease; } html:not(.ates-dark) body.page-id-42032 .entry-content a:hover { color: #946426 !important; } /* ========================================================== GRUPOS / BLOQUES DE CONTENIDO ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content .wp-block-group { background: linear-gradient( 135deg, rgba(255,253,247,.70), rgba(238,227,207,.58) ) !important; border: 1px solid rgba(153,111,54,.24) !important; border-top: 3px solid rgba(177,132,60,.48) !important; padding: 22px 24px !important; margin: 24px 0 !important; box-shadow: 0 3px 8px rgba(55,42,28,.05), 0 9px 20px rgba(55,42,28,.045) !important; } /* ========================================================== SEPARADORES ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content hr, html:not(.ates-dark) body.page-id-42032 .wp-block-separator { border: none !important; height: 1px !important; background: linear-gradient( 90deg, transparent, rgba(173,127,55,.58), transparent ) !important; margin: 40px 0 !important; } /* ========================================================== IMÁGENES ========================================================== */ html:not(.ates-dark) body.page-id-42032 .entry-content img { border: 1px solid rgba(123,88,45,.30) !important; padding: 4px; background: rgba(255,250,238,.56) !important; box-shadow: 0 4px 10px rgba(55,42,28,.10), 0 12px 25px rgba(55,42,28,.08) !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-42032 .entry-content { background: radial-gradient( ellipse at 15% 14%, rgba(201,169,106,.05), transparent 30% ), repeating-linear-gradient( 0deg, rgba(255,255,255,.012) 0px, rgba(255,255,255,.012) 1px, transparent 1px, transparent 5px ), linear-gradient( 135deg, #314957, #2a414f ) !important; border-color: rgba(201,169,106,.25) !important; border-top-color: rgba(218,179,103,.55) !important; } html.ates-dark body.page-id-42032 .entry-content > h1, html.ates-dark body.page-id-42032 .entry-content > h2, html.ates-dark body.page-id-42032 .entry-content > h3, html.ates-dark body.page-id-42032 .entry-content > h4 { color: #f1e3bd !important; } html.ates-dark body.page-id-42032 .entry-content > h2 { background: linear-gradient( 90deg, rgba(201,169,106,.14), rgba(201,169,106,.04), transparent ) !important; } html.ates-dark body.page-id-42032 .entry-content > h3 { background: rgba(201,169,106,.065) !important; } html.ates-dark body.page-id-42032 .entry-content p, html.ates-dark body.page-id-42032 .entry-content li { color: #edf1f3 !important; } html.ates-dark body.page-id-42032 .entry-content a { color: #dfbd78 !important; } html.ates-dark body.page-id-42032 .entry-content blockquote { background: rgba(22,40,53,.52) !important; color: #edf1f3 !important; } html.ates-dark body.page-id-42032 .entry-content .wp-block-group { background: rgba(23,42,55,.42) !important; border-color: rgba(201,169,106,.20) !important; border-top-color: rgba(218,179,103,.48) !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:767px) { html body.page-id-42032 .entry-content { padding: 24px 18px !important; } html body.page-id-42032 .entry-content > h1 { font-size: clamp(29px,8.8vw,39px) !important; padding-bottom: 18px !important; } html body.page-id-42032 .entry-content > h2 { padding: 11px 13px !important; margin-top: 32px !important; } html body.page-id-42032 .entry-content > h3 { padding: 9px 11px !important; } html body.page-id-42032 .entry-content .wp-block-group { padding: 18px 16px !important; } html body.page-id-42032 .entry-content blockquote { padding: 17px 18px !important; } }/* ========================================================== PARASHÁ SEMANAL — VIÑETAS DE CADA ESTUDIO ========================================================== */ /* Quitar la viñeta normal */ body.page-id-42032 .entry-content ul { list-style: none !important; padding-left: 0 !important; } /* Cada estudio */ body.page-id-42032 .entry-content ul > li { position: relative !important; padding: 11px 14px 11px 42px !important; margin-bottom: 8px !important; background: rgba(255, 252, 244, .32) !important; border-bottom: 1px solid rgba(164, 122, 58, .16) !important; transition: background .2s ease, transform .2s ease, border-color .2s ease; } /* Nuevo símbolo */ body.page-id-42032 .entry-content ul > li::before { content: "◆"; position: absolute; left: 15px; top: 12px; color: #b1843e; font-size: 10px; line-height: 1.7; } /* Al pasar el cursor */ body.page-id-42032 .entry-content ul > li:hover { background: rgba(231, 216, 188, .32) !important; border-bottom-color: rgba(177, 132, 60, .38) !important; transform: translateX(3px); } /* Enlace del estudio */ body.page-id-42032 .entry-content ul > li > a { color: #0a3158 !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 600 !important; text-decoration: none !important; } /* Pequeña línea dorada al pasar por encima */ body.page-id-42032 .entry-content ul > li > a:hover { color: #956626 !important; text-decoration: underline !important; text-decoration-color: rgba(177,132,60,.60) !important; text-underline-offset: 4px; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-42032 .entry-content ul > li { background: rgba(255,255,255,.025) !important; border-bottom-color: rgba(201,169,106,.14) !important; } html.ates-dark body.page-id-42032 .entry-content ul > li::before { color: #d6b36d !important; } html.ates-dark body.page-id-42032 .entry-content ul > li:hover { background: rgba(201,169,106,.075) !important; } html.ates-dark body.page-id-42032 .entry-content ul > li > a { color: #e5c77f !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 767px) { body.page-id-42032 .entry-content ul > li { padding: 10px 10px 10px 34px !important; margin-bottom: 6px !important; } body.page-id-42032 .entry-content ul > li::before { left: 11px; top: 11px; font-size: 9px; } }/* ========================================================== PARASHÁ SEMANAL — NUMERACIÓN ELEGANTE NÚMERO GRANDE DORADO + LÍNEA ========================================================== */ body.page-id-42032 .entry-content ol { list-style: none !important; padding-left: 0 !important; counter-reset: parasha-num; } /* CADA ESTUDIO */ body.page-id-42032 .entry-content ol > li { counter-increment: parasha-num; position: relative !important; padding: 15px 18px 15px 68px !important; margin-bottom: 8px !important; min-height: 58px; background: rgba(255, 252, 244, .22) !important; border-bottom: 1px solid rgba(166, 123, 57, .22) !important; transition: background .2s ease, transform .2s ease; } /* NÚMERO GRANDE */ body.page-id-42032 .entry-content ol > li::before { content: counter(parasha-num, decimal-leading-zero); position: absolute; left: 8px; top: 50%; transform: translateY(-50%); width: 44px; text-align: center; color: #a87831; font-family: Georgia, "Times New Roman", serif; font-size: 22px; font-weight: 700; line-height: 1; letter-spacing: -.03em; text-shadow: 0 1px 0 rgba(255,255,255,.65); } /* PEQUEÑA LÍNEA JUNTO AL NÚMERO */ body.page-id-42032 .entry-content ol > li::after { content: ""; position: absolute; left: 55px; top: 17%; width: 2px; height: 66%; background: linear-gradient( to bottom, transparent, #c69b51, transparent ); } /* TEXTO / ENLACE */ body.page-id-42032 .entry-content ol > li > a { color: #0a3158 !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 600 !important; text-decoration: none !important; } /* HOVER */ body.page-id-42032 .entry-content ol > li:hover { background: rgba(222, 203, 169, .18) !important; transform: translateX(3px); } body.page-id-42032 .entry-content ol > li:hover::before { color: #87591f; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-42032 .entry-content ol > li { background: rgba(255,255,255,.018) !important; border-bottom-color: rgba(201,169,106,.17) !important; } html.ates-dark body.page-id-42032 .entry-content ol > li::before { color: #e0bd76; text-shadow: 0 1px 2px rgba(0,0,0,.25); } html.ates-dark body.page-id-42032 .entry-content ol > li::after { background: linear-gradient( to bottom, transparent, rgba(218,179,103,.72), transparent ); } html.ates-dark body.page-id-42032 .entry-content ol > li > a { color: #e5c77f !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:767px) { body.page-id-42032 .entry-content ol > li { padding: 13px 8px 13px 55px !important; min-height: 52px; } body.page-id-42032 .entry-content ol > li::before { left: 3px; width: 37px; font-size: 19px; } body.page-id-42032 .entry-content ol > li::after { left: 45px; } }/* ========================================================== PARASHÁ SEMANAL — ESTUDIOS SIN ENLACE ========================================================== */ /* Próximamente en elementos que NO contienen enlace */ body.page-id-42032 .entry-content ol > li:not(:has(a))::after, body.page-id-42032 .entry-content ul > li:not(:has(a))::after { content: "(Próximamente)"; position: static !important; display: inline-block !important; width: auto !important; height: auto !important; margin-left: 7px !important; background: none !important; color: #9a7950 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: .76em !important; font-style: italic !important; font-weight: 400 !important; opacity: .82; vertical-align: baseline; } /* MODO OSCURO */ html.ates-dark body.page-id-42032 .entry-content ol > li:not(:has(a))::after, html.ates-dark body.page-id-42032 .entry-content ul > li:not(:has(a))::after { color: #d0b98c !important; opacity: .78; } /* MÓVIL */ @media (max-width:767px) { body.page-id-42032 .entry-content ol > li:not(:has(a))::after, body.page-id-42032 .entry-content ul > li:not(:has(a))::after { font-size: .72em !important; margin-left: 5px !important; } }/* ========================================================== CURIOSIDADES DE LA ESCRITURA — ID 7529 ESTILO ÍNDICE DE MANUSCRITO ========================================================== */ /* LISTA */ body.page-id-7529 .entry-content ul { list-style: none !important; padding: 0 !important; margin: 28px 0 36px !important; } /* CADA CURIOSIDAD */ body.page-id-7529 .entry-content ul > li { position: relative !important; padding: 12px 42px 12px 38px !important; margin: 0 !important; background: transparent !important; border: none !important; border-bottom: 1px solid rgba(168,126,61,.22) !important; transition: padding-left .2s ease, border-color .2s ease; } /* SÍMBOLO */ body.page-id-7529 .entry-content ul > li::before { content: "✦"; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); color: #b3863e; font-size: 13px; line-height: 1; } /* PEQUEÑA FLECHA AL FINAL */ body.page-id-7529 .entry-content ul > li::after { content: "→"; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: rgba(154,105,39,.48); font-size: 15px; transition: transform .2s ease, color .2s ease; } /* ENLACE */ body.page-id-7529 .entry-content ul > li > a { color: #0a3158 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.03em !important; font-weight: 600 !important; text-decoration: none !important; line-height: 1.45 !important; } /* HOVER */ body.page-id-7529 .entry-content ul > li:hover { padding-left: 44px !important; border-bottom-color: rgba(177,132,60,.52) !important; } body.page-id-7529 .entry-content ul > li:hover::after { transform: translate(4px,-50%); color: #986624; } body.page-id-7529 .entry-content ul > li:hover > a { color: #8d5f25 !important; } /* ========================================================== TÍTULO ========================================================== */ body.page-id-7529 .entry-content > h1, body.page-id-7529 .entry-content > h2:first-child { color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-weight: 700 !important; margin-bottom: 26px !important; padding-bottom: 13px !important; border-bottom: 1px solid rgba(178,132,59,.30) !important; } /* detalle dorado */ body.page-id-7529 .entry-content > h1::after, body.page-id-7529 .entry-content > h2:first-child::after { content: "✦ ✦ ✦"; display: block; margin-top: 10px; color: #b3863e; font-size: 9px; letter-spacing: 6px; } /* ========================================================== PRÓXIMAMENTE ========================================================== */ body.page-id-7529 .entry-content p:last-of-type { text-align: center !important; margin-top: 30px !important; color: #8a6c45 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: .86em !important; font-style: italic !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-7529 .entry-content ul > li { border-bottom-color: rgba(201,169,106,.16) !important; } html.ates-dark body.page-id-7529 .entry-content ul > li::before { color: #d9b66f !important; } html.ates-dark body.page-id-7529 .entry-content ul > li::after { color: rgba(218,179,103,.52) !important; } html.ates-dark body.page-id-7529 .entry-content ul > li > a { color: #e5c77f !important; } html.ates-dark body.page-id-7529 .entry-content > h1, html.ates-dark body.page-id-7529 .entry-content > h2:first-child { color: #f1e3bd !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:767px) { body.page-id-7529 .entry-content ul > li { padding: 11px 32px 11px 30px !important; } body.page-id-7529 .entry-content ul > li::before { left: 4px; font-size: 11px; } body.page-id-7529 .entry-content ul > li::after { right: 5px; font-size: 13px; } body.page-id-7529 .entry-content ul > li > a { font-size: .98em !important; } body.page-id-7529 .entry-content ul > li:hover { padding-left: 34px !important; } }/* ========================================================== REFLEXIONES — PAGE ID 12094 ESTILO CONTEMPLATIVO / EDITORIAL ========================================================== */ /* CONTENEDOR PRINCIPAL */ html:not(.ates-dark) body.page-id-12094 .entry-content { background: radial-gradient( ellipse at 12% 10%, rgba(157,112,56,.045), transparent 32% ), radial-gradient( ellipse at 88% 18%, rgba(255,255,255,.20), transparent 34% ), linear-gradient( 135deg, #f4eee3 0%, #eee5d6 48%, #f2eadf 100% ) !important; border: 1px solid rgba(143,105,57,.22) !important; padding: clamp(32px,4vw,58px) !important; box-shadow: 0 4px 8px rgba(55,42,28,.06), 0 18px 42px rgba(55,42,28,.07) !important; } /* ========================================================== TÍTULO ========================================================== */ body.page-id-12094 .entry-content > h1, body.page-id-12094 .entry-content > h2:first-child { color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(34px,4vw,48px) !important; font-weight: 700 !important; line-height: 1.15 !important; margin-bottom: 34px !important; padding-bottom: 22px !important; position: relative; } /* detalle inferior */ body.page-id-12094 .entry-content > h1::after, body.page-id-12094 .entry-content > h2:first-child::after { content: "✦"; display: block; width: 110px; margin-top: 15px; padding-bottom: 7px; color: #b1843d; font-size: 11px; text-align: center; border-bottom: 1px solid rgba(177,132,60,.44); } /* ========================================================== LISTA DE REFLEXIONES ========================================================== */ body.page-id-12094 .entry-content ul { list-style: none !important; padding: 0 !important; margin: 25px 0 38px !important; } /* CADA REFLEXIÓN */ body.page-id-12094 .entry-content ul > li { position: relative !important; padding: 17px 42px 17px 45px !important; margin: 0 !important; background: transparent !important; border: none !important; border-bottom: 1px solid rgba(158,117,58,.20) !important; transition: padding-left .22s ease, border-color .22s ease, background .22s ease; } /* símbolo contemplativo */ body.page-id-12094 .entry-content ul > li::before { content: "❧"; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); color: #aa7b35; font-family: Georgia, serif; font-size: 20px; line-height: 1; } /* pequeña flecha */ body.page-id-12094 .entry-content ul > li::after { content: "›"; position: absolute; right: 12px; top: 50%; transform: translateY(-52%); color: rgba(151,105,42,.42); font-family: Georgia, serif; font-size: 23px; transition: transform .2s ease, color .2s ease; } /* ENLACE */ body.page-id-12094 .entry-content ul > li > a { color: #123653 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.05em !important; font-weight: 600 !important; line-height: 1.45 !important; text-decoration: none !important; } /* HOVER */ body.page-id-12094 .entry-content ul > li:hover { padding-left: 51px !important; background: linear-gradient( 90deg, rgba(219,199,165,.16), transparent ) !important; border-bottom-color: rgba(177,132,60,.48) !important; } body.page-id-12094 .entry-content ul > li:hover::before { color: #8d5e21; } body.page-id-12094 .entry-content ul > li:hover::after { color: #986525; transform: translate(4px,-52%); } body.page-id-12094 .entry-content ul > li:hover > a { color: #8a5c22 !important; } /* ========================================================== PÁRRAFOS INTRODUCTORIOS ========================================================== */ body.page-id-12094 .entry-content > p { color: #3c494f !important; font-family: Georgia, "Times New Roman", serif !important; line-height: 1.8 !important; } /* PRIMER PÁRRAFO */ body.page-id-12094 .entry-content > p:first-of-type { font-size: 1.10em !important; max-width: 850px; margin-bottom: 30px !important; } /* ========================================================== CITAS / TEXTOS DESTACADOS ========================================================== */ body.page-id-12094 .entry-content blockquote, body.page-id-12094 .entry-content .wp-block-quote { background: rgba(232,218,193,.35) !important; border: none !important; border-left: 3px solid #b3863e !important; padding: 20px 25px !important; margin: 30px 0 !important; color: #3b4549 !important; font-family: Georgia, "Times New Roman", serif !important; font-style: italic !important; } /* ========================================================== SEPARADORES ========================================================== */ body.page-id-12094 .entry-content hr, body.page-id-12094 .entry-content .wp-block-separator { border: none !important; height: 1px !important; background: linear-gradient( 90deg, transparent, rgba(177,132,60,.48), transparent ) !important; margin: 40px 0 !important; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark body.page-id-12094 .entry-content { background: linear-gradient( 135deg, #314957, #2b4250 ) !important; border-color: rgba(201,169,106,.22) !important; } html.ates-dark body.page-id-12094 .entry-content > h1, html.ates-dark body.page-id-12094 .entry-content > h2:first-child { color: #f2e4bf !important; } html.ates-dark body.page-id-12094 .entry-content > p { color: #edf1f3 !important; } html.ates-dark body.page-id-12094 .entry-content ul > li { border-bottom-color: rgba(201,169,106,.15) !important; } html.ates-dark body.page-id-12094 .entry-content ul > li::before { color: #d8b56c !important; } html.ates-dark body.page-id-12094 .entry-content ul > li::after { color: rgba(218,179,103,.52) !important; } html.ates-dark body.page-id-12094 .entry-content ul > li > a { color: #e5c77f !important; } html.ates-dark body.page-id-12094 .entry-content blockquote { background: rgba(17,37,51,.42) !important; color: #edf1f3 !important; border-left-color: #c99c50 !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width:767px) { html body.page-id-12094 .entry-content { padding: 25px 18px !important; } body.page-id-12094 .entry-content ul > li { padding: 14px 34px 14px 36px !important; } body.page-id-12094 .entry-content ul > li::before { left: 4px; font-size: 17px; } body.page-id-12094 .entry-content ul > li::after { right: 5px; font-size: 20px; } body.page-id-12094 .entry-content ul > li > a { font-size: .98em !important; } body.page-id-12094 .entry-content ul > li:hover { padding-left: 40px !important; } }/* ========================================================== REFLEXIONES — QUITAR MARCO Y FONDO PRINCIPAL PAGE ID 12094 ========================================================== */ html:not(.ates-dark) body.page-id-12094 .entry-content, html.ates-dark body.page-id-12094 .entry-content { background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; padding-top: 15px !important; padding-bottom: 20px !important; } /* Evitar apariencia de tarjeta exterior */ body.page-id-12094 .entry-content::before, body.page-id-12094 .entry-content::after { background: none !important; border: none !important; box-shadow: none !important; } /* ========================================================== DONACIONES PAYPAL + BIZUM + TRANSFERENCIA ========================================================== */ .ates-donation-widget { max-width: 820px; margin: 48px auto !important; padding: 42px 42px 34px !important; position: relative; text-align: center; background: radial-gradient( ellipse at 12% 10%, rgba(188,146,76,.055), transparent 28% ), linear-gradient( 145deg, rgba(255,253,247,.82), rgba(239,228,207,.56) ); border: 1px solid rgba(162,119,57,.26); border-top: 3px solid #b4873f; box-shadow: 0 5px 12px rgba(55,42,28,.07), 0 20px 45px rgba(55,42,28,.08); } /* ========================================================== CORAZÓN ========================================================== */ .ates-donation-symbol { width: 54px; height: 54px; margin: -70px auto 22px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: linear-gradient( 145deg, #123e64, #082847 ); color: #e4be73; border: 2px solid #c89b50; font-family: Georgia, serif; font-size: 28px; box-shadow: 0 5px 12px rgba(7,31,61,.22); } /* ========================================================== CABECERA ========================================================== */ .ates-donation-kicker { margin: 0 0 9px !important; color: #9d6c2c !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .17em; } .ates-donation-widget > h2 { max-width: 650px; margin: 0 auto 18px !important; padding: 0 !important; background: none !important; border: none !important; color: #071f3d !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(27px,3vw,36px) !important; line-height: 1.2 !important; } .ates-donation-text { max-width: 650px; margin: 0 auto 25px !important; color: #445057 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.02em !important; line-height: 1.75 !important; } /* ========================================================== MENSAJE VOLUNTARIO ========================================================== */ .ates-donation-note { max-width: 650px; margin: 0 auto 34px; padding: 16px 19px; text-align: left; background: rgba(224,205,171,.27); border: 1px solid rgba(177,132,60,.14); border-left: 3px solid #b4873f; color: #5b5142; font-family: Georgia, "Times New Roman", serif; font-size: .92em; line-height: 1.62; } /* ========================================================== MÉTODOS DE DONACIÓN ========================================================== */ .ates-donation-methods { display: grid; gap: 14px; margin-top: 26px; text-align: left; } .ates-donation-method { display: grid; grid-template-columns: 145px 1fr; gap: 23px; align-items: center; padding: 23px 25px; background: rgba(255,253,248,.62); border: 1px solid rgba(169,126,62,.20); box-shadow: 0 3px 8px rgba(52,40,27,.04); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .ates-donation-method:hover { transform: translateY(-1px); border-color: rgba(169,126,62,.40); box-shadow: 0 7px 16px rgba(52,40,27,.07); } /* ========================================================== ZONA DEL LOGO ========================================================== */ .ates-method-logo { min-height: 82px; display: flex; align-items: center; justify-content: center; padding-right: 22px; border-right: 1px solid rgba(174,130,66,.18); } /* ========================================================== PAYPAL ========================================================== */ .ates-paypal-logo img { display: block; width: 100%; max-width: 125px; height: auto; object-fit: contain; } /* ========================================================== BIZUM ========================================================== */ .ates-bizum-logo { gap: 9px; } .ates-bizum-word { color: #00aeb8; font-family: Arial, Helvetica, sans-serif; font-size: 30px; font-weight: 700; letter-spacing: -.05em; } .ates-bizum-mark { width: 31px; height: 43px; position: relative; transform: rotate(-37deg); } .ates-bizum-mark span { position: absolute; display: block; height: 7px; background: #00b8c4; border-radius: 20px; } .ates-bizum-mark span:nth-child(1) { width: 9px; top: 0; left: 9px; } .ates-bizum-mark span:nth-child(2) { width: 24px; top: 11px; left: 1px; } .ates-bizum-mark span:nth-child(3) { width: 24px; top: 23px; left: 5px; } .ates-bizum-mark span:nth-child(4) { width: 9px; top: 35px; left: 14px; } /* ========================================================== BANCO / TRANSFERENCIA ========================================================== */ .ates-bank-logo svg { display: block; width: 88px; height: auto; fill: #0b365c; filter: drop-shadow( 0 2px 1px rgba(7,31,61,.08) ); } /* ========================================================== TEXTOS ========================================================== */ .ates-donation-method h3 { margin: 0 0 5px !important; padding: 0 !important; border: none !important; background: none !important; color: #0a3158 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 21px !important; line-height: 1.25 !important; } .ates-donation-method p { margin: 0 0 14px !important; color: #566168 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: .92em !important; line-height: 1.58 !important; } /* ========================================================== BOTONES ========================================================== */ .ates-donation-action { display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 19px !important; background: linear-gradient( 180deg, #13426a, #082846 ) !important; color: #fff !important; border: 1px solid #bd9149 !important; border-radius: 3px !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: 700 !important; text-decoration: none !important; cursor: pointer; box-shadow: 0 3px 8px rgba(7,31,61,.14); transition: transform .2s ease, background .2s ease, box-shadow .2s ease; } .ates-donation-action:hover { transform: translateY(-1px); background: linear-gradient( 180deg, #1b557f, #0a2e4d ) !important; color: #fff !important; box-shadow: 0 6px 13px rgba(7,31,61,.19); } .ates-external-arrow { font-size: 17px; } /* ========================================================== DATOS OCULTOS ========================================================== */ .ates-donation-details { margin-top: 17px; padding: 17px; background: rgba(229,214,187,.27); border: 1px solid rgba(170,128,64,.18); border-left: 2px solid #b78a43; } .ates-donation-details[hidden] { display: none !important; } .ates-detail-label { display: block; margin: 0 0 5px; color: #876329; font-family: Georgia, "Times New Roman", serif; font-size: 11px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; } .ates-bank-text { margin: 0 0 15px; color: #273a47; font-family: Georgia, "Times New Roman", serif; font-size: 15px; font-weight: 600; } /* ========================================================== COPIAR ========================================================== */ .ates-copy-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 11px; } .ates-copy-value { color: #162f43; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 14px; font-weight: 700; overflow-wrap: anywhere; } .ates-copy-button { flex: 0 0 auto; padding: 7px 12px; background: linear-gradient( 180deg, #ad7b32, #90601f ); color: #fff; border: 1px solid rgba(126,84,29,.40); border-radius: 3px; font-size: 12px; font-weight: 700; cursor: pointer; box-shadow: 0 2px 5px rgba(85,59,24,.15); } .ates-detail-hint { margin: 12px 0 0 !important; color: #746551 !important; font-size: 12px !important; font-style: italic; } /* ========================================================== PIE ========================================================== */ .ates-donation-secure { margin: 23px 0 0 !important; color: #81725e !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 12px !important; font-style: italic; } .ates-donation-thanks { margin-top: 23px; padding-top: 19px; border-top: 1px solid rgba(177,132,60,.21); color: #765d38; font-family: Georgia, "Times New Roman", serif; font-size: .91em; font-style: italic; line-height: 1.65; } /* ========================================================== MODO OSCURO ========================================================== */ html.ates-dark .ates-donation-widget { background: linear-gradient( 145deg, rgba(23,43,57,.80), rgba(18,36,49,.67) ); border-color: rgba(201,169,106,.24); border-top-color: #c99c51; } html.ates-dark .ates-donation-widget > h2 { color: #f2e4bf !important; } html.ates-dark .ates-donation-text { color: #edf1f3 !important; } html.ates-dark .ates-donation-note { background: rgba(201,169,106,.07); color: #ded4c0; border-left-color: #c99c51; } html.ates-dark .ates-donation-method { background: rgba(15,35,49,.45); border-color: rgba(201,169,106,.16); } html.ates-dark .ates-method-logo { border-right-color: rgba(201,169,106,.15); } html.ates-dark .ates-donation-method h3 { color: #ead39c !important; } html.ates-dark .ates-donation-method p { color: #dbe2e5 !important; } html.ates-dark .ates-bank-logo svg { fill: #d8bd7e; } html.ates-dark .ates-donation-details { background: rgba(201,169,106,.05); border-color: rgba(201,169,106,.14); } html.ates-dark .ates-copy-value, html.ates-dark .ates-bank-text { color: #edf1f3; } html.ates-dark .ates-detail-label, html.ates-dark .ates-detail-hint { color: #cfb786 !important; } html.ates-dark .ates-donation-secure, html.ates-dark .ates-donation-thanks { color: #cbb997 !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 767px) { .ates-donation-widget { margin: 46px 0 25px !important; padding: 36px 17px 27px !important; } .ates-donation-method { grid-template-columns: 1fr; gap: 12px; padding: 19px 15px; text-align: center; } .ates-method-logo { width: 100%; min-height: 60px; padding: 0 0 13px; border-right: none; border-bottom: 1px solid rgba(174,130,66,.18); } .ates-paypal-logo img { max-width: 120px; } .ates-bizum-word { font-size: 28px; } .ates-bank-logo svg { width: 67px; } .ates-donation-action { width: 100%; min-height: 45px; } .ates-donation-details { text-align: left; } .ates-copy-row { flex-direction: column; align-items: stretch; } .ates-copy-button { width: 100%; min-height: 39px; } .ates-copy-value { font-size: 13px; line-height: 1.55; } }/* ========================================= BOTÓN FLOTANTE DONACIONES ========================================= */ .ates-donar-float { position: fixed !important; right: 12px !important; bottom: 12px !important; z-index: 99999 !important; display: flex !important; align-items: center !important; gap: 6px !important; padding: 5px 10px 5px 5px !important; background: rgba(7, 31, 61, .68) !important; border: 1px solid rgba(201, 169, 106, .58) !important; border-radius: 22px !important; color: #fff !important; text-decoration: none !important; box-shadow: 0 3px 9px rgba(0,0,0,.14) !important; opacity: .72; transition: opacity .2s ease, transform .2s ease, background .2s ease !important; } /* CORAZÓN */ .ates-donar-float-heart { width: 27px !important; height: 27px !important; display: flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 27px !important; border: 1px solid rgba(226,190,115,.55) !important; border-radius: 50% !important; color: #e4bd72 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; line-height: 1 !important; } /* TEXTO */ .ates-donar-float-label { color: #fff !important; font-family: Arial, sans-serif !important; font-size: 10px !important; font-weight: 600 !important; line-height: 1 !important; white-space: nowrap !important; } /* AL PASAR EL CURSOR */ .ates-donar-float:hover, .ates-donar-float:focus-visible { opacity: 1; background: rgba(7, 31, 61, .92) !important; transform: translateY(-2px) !important; color: #fff !important; } /* MÓVIL */ @media (max-width: 767px) { .ates-donar-float { right: 8px !important; bottom: 8px !important; padding: 4px 8px 4px 4px !important; opacity: .65; } .ates-donar-float-heart { width: 25px !important; height: 25px !important; flex-basis: 25px !important; font-size: 15px !important; } .ates-donar-float-label { font-size: 9.5px !important; } }/* ========================================== SEPARAR FLECHA DE DONACIONES ========================================== */ /* Flecha "volver arriba" de Blocksy */ .ct-back-to-top { bottom: 62px !important; } /* Donaciones permanece abajo */ .ates-donar-float { bottom: 6px !important; } /* MÓVIL */ @media (max-width: 767px) { .ct-back-to-top { bottom: 55px !important; } .ates-donar-float { bottom: 4px !important; } }/* ========================================== MÓVIL: DONACIONES A LA IZQUIERDA ========================================== */ @media (max-width: 767px) { .ates-donar-float { left: 8px !important; right: auto !important; bottom: 4px !important; } }/* ========================================== DONACIONES — AJUSTE SOLO PARA MÓVIL ========================================== */ @media (max-width: 767px) { .ates-donar-float { /* izquierda */ left: 10px !important; right: auto !important; /* un poco más arriba */ bottom: 28px !important; /* sin transparencia */ opacity: 1 !important; background: #0b3155 !important; border: 1px solid rgba(218, 180, 108, .85) !important; box-shadow: 0 3px 9px rgba(0, 0, 0, .18) !important; } .ates-donar-float-heart { opacity: 1 !important; color: #e5bd70 !important; } .ates-donar-float-label { opacity: 1 !important; color: #ffffff !important; } }/* ========================================== DONACIONES — POSICIÓN FINAL EN MÓVIL ========================================== */ @media (max-width: 767px) { .ates-donar-float { left: 8px !important; right: auto !important; /* más abajo */ bottom: 12px !important; /* discreto / semitransparente */ opacity: .68 !important; background: rgba(7, 31, 61, .78) !important; border: 1px solid rgba(201, 169, 106, .60) !important; box-shadow: 0 3px 8px rgba(0, 0, 0, .14) !important; } /* Al tocarlo se hace totalmente visible */ .ates-donar-float:active, .ates-donar-float:focus { opacity: 1 !important; } }/* ========================================================== OCULTAR WIDGETS / SIDEBAR SOLO EN ENTRADAS MANTENERLOS EN LAS PÁGINAS ========================================================== */ body.single-post .ct-sidebar, body.single-post #sidebar, body.single-post aside[role="complementary"] { display: none !important; } /* ========================================================== APROVECHAR TODO EL ANCHO EN LAS ENTRADAS ========================================================== */ @media (min-width: 1025px) { body.single-post .ct-container { grid-template-columns: minmax(0, 1fr) !important; } body.single-post .site-main { width: 100% !important; max-width: 100% !important; } }/* ========================================================== MODO LECTOR — TEXTO EXTRA ANCHO SOLO EN ORDENADOR ========================================================== */ @media (min-width: 1025px) { /* Estructura general del lector */ body .ates-reader-overlay .ates-reader-shell, body .ates-reader-overlay .ates-reader-body, body .ates-reader-overlay .ates-reader-main, body .ates-reader-overlay .ates-reader-article { width: calc(100vw - 40px) !important; max-width: 1750px !important; margin-left: auto !important; margin-right: auto !important; } /* TEXTO REAL DE LA ENTRADA */ body .ates-reader-overlay .ates-reader-content, body .ates-reader-overlay .ates-reader-content.entry-content { width: 100% !important; max-width: 1650px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 35px !important; padding-right: 35px !important; } /* Permitir que el contenido aproveche todo ese ancho */ body .ates-reader-overlay .ates-reader-content > *, body .ates-reader-overlay .ates-reader-content p, body .ates-reader-overlay .ates-reader-content ul, body .ates-reader-overlay .ates-reader-content ol, body .ates-reader-overlay .ates-reader-content blockquote, body .ates-reader-overlay .ates-reader-content figure, body .ates-reader-overlay .ates-reader-content h1, body .ates-reader-overlay .ates-reader-content h2, body .ates-reader-overlay .ates-reader-content h3, body .ates-reader-overlay .ates-reader-content h4, body .ates-reader-overlay .ates-reader-content h5, body .ates-reader-overlay .ates-reader-content h6 { width: 100% !important; max-width: none !important; } }/* ========================================================== MODO LECTOR — FONDO OSCURO TIPO FOLIO ========================================================== */ /* Fondo general de toda la pantalla del lector */ .ates-reader-overlay.ates-reader-dark, html.ates-dark .ates-reader-overlay { background: #223845 !important; } /* Superficie donde se lee el artículo */ .ates-reader-overlay.ates-reader-dark .ates-reader-shell, .ates-reader-overlay.ates-reader-dark .ates-reader-body, .ates-reader-overlay.ates-reader-dark .ates-reader-main, .ates-reader-overlay.ates-reader-dark .ates-reader-article, html.ates-dark .ates-reader-overlay .ates-reader-shell, html.ates-dark .ates-reader-overlay .ates-reader-body, html.ates-dark .ates-reader-overlay .ates-reader-main, html.ates-dark .ates-reader-overlay .ates-reader-article { background: repeating-linear-gradient( to bottom, transparent 0px, transparent 27px, rgba(178,195,205,.055) 28px, transparent 29px ), repeating-linear-gradient( 0deg, rgba(255,255,255,.016) 0px, rgba(255,255,255,.016) 1px, transparent 1px, transparent 4px ), repeating-linear-gradient( 90deg, rgba(255,255,255,.011) 0px, rgba(255,255,255,.011) 1px, transparent 1px, transparent 9px ), radial-gradient( ellipse at 12% 16%, rgba(201,169,106,.045), transparent 30% ), radial-gradient( ellipse at 82% 25%, rgba(255,255,255,.04), transparent 34% ), linear-gradient( 135deg, #344b5b 0%, #304756 45%, #2b414f 75%, #334a58 100% ) !important; color: #edf1f3 !important; } /* IMPORTANTE: quitar cualquier fondo claro que conserve el contenido clonado */ .ates-reader-overlay.ates-reader-dark .ates-reader-content, .ates-reader-overlay.ates-reader-dark .ates-reader-content.entry-content, html.ates-dark .ates-reader-overlay .ates-reader-content, html.ates-dark .ates-reader-overlay .ates-reader-content.entry-content { background: transparent !important; background-image: none !important; color: #edf1f3 !important; } /* Texto */ .ates-reader-overlay.ates-reader-dark .ates-reader-content p, .ates-reader-overlay.ates-reader-dark .ates-reader-content li, html.ates-dark .ates-reader-overlay .ates-reader-content p, html.ates-dark .ates-reader-overlay .ates-reader-content li { color: #edf1f3 !important; } /* Títulos */ .ates-reader-overlay.ates-reader-dark .ates-reader-content h1, .ates-reader-overlay.ates-reader-dark .ates-reader-content h2, .ates-reader-overlay.ates-reader-dark .ates-reader-content h3, .ates-reader-overlay.ates-reader-dark .ates-reader-content h4, .ates-reader-overlay.ates-reader-dark .ates-reader-content h5, .ates-reader-overlay.ates-reader-dark .ates-reader-content h6, html.ates-dark .ates-reader-overlay .ates-reader-content h1, html.ates-dark .ates-reader-overlay .ates-reader-content h2, html.ates-dark .ates-reader-overlay .ates-reader-content h3, html.ates-dark .ates-reader-overlay .ates-reader-content h4, html.ates-dark .ates-reader-overlay .ates-reader-content h5, html.ates-dark .ates-reader-overlay .ates-reader-content h6 { color: #f0dfb5 !important; } /* Enlaces */ .ates-reader-overlay.ates-reader-dark .ates-reader-content a, html.ates-dark .ates-reader-overlay .ates-reader-content a { color: #dfbd76 !important; } /* Línea / separadores */ .ates-reader-overlay.ates-reader-dark .ates-reader-content hr, html.ates-dark .ates-reader-overlay .ates-reader-content hr { border-color: rgba(201,169,106,.30) !important; } /* ========================================================== CABECERA EDITORIAL FINAL ========================================================== */ /* ========================================================== CATEGORÍA SUPERIOR ========================================================== */ body.single-post .entry-header .ates-top-category { display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 7px 15px !important; background: linear-gradient( 180deg, #254e73 0%, #193a59 100% ) !important; border: 1px solid #d5a13b !important; border-radius: 4px !important; box-shadow: 0 0 0 1px rgba(213,161,59,.14), 0 3px 7px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.08) !important; } body.single-post .entry-header .ates-top-category a { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; color: #fff9e9 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .055em !important; text-transform: uppercase !important; text-decoration: none !important; } /* ========================================================== LÍNEA DORADA + HOJA ========================================================== */ body.single-post .ates-leaf-divider { display: flex !important; align-items: center !important; justify-content: center !important; width: min(610px, 62%) !important; gap: 17px !important; margin: 22px auto 20px !important; } body.single-post .ates-leaf-line { display: block !important; width: 100% !important; height: 1px !important; background: linear-gradient( 90deg, transparent 0%, rgba(209,160,64,.70) 26%, #d8a643 100% ) !important; } body.single-post .ates-leaf-line:last-child { background: linear-gradient( 90deg, #d8a643 0%, rgba(209,160,64,.70) 74%, transparent 100% ) !important; } body.single-post .ates-leaf-symbol { width: 44px !important; height: 35px !important; flex: 0 0 44px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #dba542 !important; } body.single-post .ates-leaf-symbol svg { display: block !important; width: 44px !important; height: 35px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.45 !important; stroke-linecap: round !important; stroke-linejoin: round !important; overflow: visible !important; filter: drop-shadow(0 1px 1px rgba(0,0,0,.25)); } /* ========================================================== OCULTAR META ANTIGUA ========================================================== */ body.single-post .entry-header .ates-hide-meta-original { display: none !important; } /* ========================================================== FILA META ========================================================== */ body.single-post .entry-header .ates-editorial-meta { display: flex !important; justify-content: center !important; align-items: center !important; flex-wrap: wrap !important; margin-top: 24px !important; color: #f7f0df !important; font-family: Georgia, "Times New Roman", serif !important; } /* cada bloque */ body.single-post .entry-header .ates-editorial-meta-item { position: relative !important; display: inline-flex !important; align-items: center !important; min-height: 47px !important; padding: 0 25px !important; white-space: nowrap !important; font-size: 11px !important; font-weight: 600 !important; } /* separadores */ body.single-post .entry-header .ates-editorial-meta-item + .ates-editorial-meta-item::before { content: "" !important; position: absolute !important; left: 0 !important; top: 15% !important; width: 1px !important; height: 70% !important; background: linear-gradient( to bottom, transparent 0%, rgba(215,166,68,.9) 28%, rgba(215,166,68,.9) 72%, transparent 100% ) !important; } /* ========================================================== AUTOR ========================================================== */ body.single-post .entry-header .ates-editorial-author { padding-left: 7px !important; } body.single-post .entry-header .ates-editorial-author-img { width: 42px !important; height: 42px !important; min-width: 42px !important; max-width: 42px !important; object-fit: cover !important; border-radius: 50% !important; margin-right: 11px !important; padding: 1px !important; border: 1px solid #d5a23e !important; background: #18364f !important; box-shadow: 0 5px 10px rgba(0,0,0,.50), 0 0 0 2px rgba(215,166,65,.14), 0 0 9px rgba(211,163,64,.15) !important; } body.single-post .entry-header .ates-editorial-author-copy { display: flex !important; align-items: center !important; gap: 5px !important; } body.single-post .entry-header .ates-editorial-by { color: #fff6e5 !important; font-size: 10px !important; letter-spacing: .13em !important; } body.single-post .entry-header .ates-editorial-author-copy a { color: #dda844 !important; font-size: 14px !important; font-weight: 700 !important; text-transform: uppercase !important; text-decoration: none !important; letter-spacing: .02em !important; } /* ========================================================== ICONOS REFINADOS ========================================================== */ body.single-post .entry-header .ates-editorial-icon { width: 30px !important; height: 30px !important; flex: 0 0 30px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin-right: 9px !important; color: #dba541 !important; } body.single-post .entry-header .ates-editorial-icon svg { display: block !important; width: 26px !important; height: 26px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.15 !important; stroke-linecap: round !important; stroke-linejoin: round !important; overflow: visible !important; filter: drop-shadow( 0 1px 1px rgba(0,0,0,.22) ); } /* carpeta un poco más ancha */ body.single-post .entry-header .ates-folder-icon svg { width: 29px !important; } /* comentarios */ body.single-post .entry-header .ates-comment-icon svg { width: 27px !important; } /* enlaces */ body.single-post .entry-header .ates-editorial-meta-item a { color: #f7f0df !important; text-decoration: none !important; } body.single-post .entry-header .ates-editorial-meta-item a:hover { color: #e0ad4b !important; } /* ========================================================== MÓVIL ========================================================== */ @media (max-width: 767px) { body.single-post .ates-leaf-divider { width: 72% !important; gap: 9px !important; margin: 16px auto 14px !important; } body.single-post .ates-leaf-symbol { width: 32px !important; height: 25px !important; flex-basis: 32px !important; } body.single-post .ates-leaf-symbol svg { width: 32px !important; height: 25px !important; } body.single-post .entry-header .ates-editorial-meta-item { min-height: 34px !important; padding: 0 9px !important; font-size: 9px !important; } body.single-post .entry-header .ates-editorial-author-img { width: 33px !important; height: 33px !important; min-width: 33px !important; max-width: 33px !important; margin-right: 6px !important; } body.single-post .entry-header .ates-editorial-author-copy a { font-size: 11px !important; } body.single-post .entry-header .ates-editorial-icon { width: 20px !important; height: 20px !important; flex-basis: 20px !important; margin-right: 5px !important; } body.single-post .entry-header .ates-editorial-icon svg { width: 18px !important; height: 18px !important; stroke-width: 1.05 !important; } }/* ========================================================== DIVISOR DORADO VISIBLE ========================================================== */ body.single-post .ates-divider-visible { display: flex !important; align-items: center !important; justify-content: center !important; width: min(610px, 62%) !important; max-width: 610px !important; margin: 20px auto 20px !important; gap: 16px !important; position: relative !important; visibility: visible !important; opacity: 1 !important; height: 38px !important; overflow: visible !important; z-index: 999 !important; } /* líneas */ body.single-post .ates-divider-line { display: block !important; flex: 1 1 auto !important; height: 1px !important; min-width: 80px !important; background: linear-gradient( 90deg, transparent 0%, rgba(216,166,67,.65) 22%, #dca642 100% ) !important; opacity: 1 !important; } body.single-post .ates-divider-line:last-child { background: linear-gradient( 90deg, #dca642 0%, rgba(216,166,67,.65) 78%, transparent 100% ) !important; } /* rama */ body.single-post .ates-divider-leaf { display: flex !important; align-items: center !important; justify-content: center !important; width: 45px !important; height: 35px !important; flex: 0 0 45px !important; color: #dca642 !important; } body.single-post .ates-divider-leaf svg { display: block !important; width: 45px !important; height: 35px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.35 !important; stroke-linecap: round !important; stroke-linejoin: round !important; overflow: visible !important; filter: drop-shadow(0 1px 1px rgba(0,0,0,.22)); } /* móvil */ @media (max-width: 767px) { body.single-post .ates-divider-visible { width: 72% !important; height: 28px !important; margin: 15px auto 15px !important; gap: 9px !important; } body.single-post .ates-divider-leaf { width: 32px !important; height: 25px !important; flex-basis: 32px !important; } body.single-post .ates-divider-leaf svg { width: 32px !important; height: 25px !important; } }/* DIVISOR FINAL */ body.single-post .entry-header .ates-divider-visible { width:min(540px,56%)!important; height:25px!important; display:flex!important; align-items:center!important; justify-content:center!important; margin:0 auto 3px!important; gap:12px!important; } /* LÍNEAS */ body.single-post .entry-header .ates-divider-line { display:block!important; flex:1 1 auto!important; height:1px!important; background:linear-gradient( 90deg, transparent 0%, rgba(218,166,65,.45) 22%, #dda844 100% )!important; } body.single-post .entry-header .ates-divider-line:last-child { background:linear-gradient( 90deg, #dda844 0%, rgba(218,166,65,.45) 78%, transparent 100% )!important; } /* ORNAMENTO CENTRAL */ body.single-post .entry-header .ates-divider-leaf { width:27px!important; height:27px!important; flex:0 0 27px!important; display:flex!important; align-items:center!important; justify-content:center!important; color:#dda844!important; transform:none!important; } /* SVG */ body.single-post .entry-header .ates-divider-leaf svg { width:27px!important; height:27px!important; display:block!important; fill:none!important; stroke:currentColor!important; stroke-width:1.15!important; stroke-linecap:round!important; stroke-linejoin:round!important; filter:drop-shadow( 0 1px 1px rgba(0,0,0,.18) )!important; } /* PUNTO CENTRAL */ body.single-post .entry-header .ates-divider-leaf circle { fill:#dda844!important; stroke:none!important; } /* ACERCAR EL SUBTÍTULO */ body.single-post .entry-header .entry-excerpt { margin-top:2px!important; } /* SOMBRA MÁS MARCADA DEL LOGO */ #header .site-logo-container img, #header [data-id="logo"] img, #header .site-branding img, header [data-id="logo"] img, header .site-logo-container img { filter: drop-shadow(0 3px 2px rgba(0,0,0,.55)) drop-shadow(0 7px 6px rgba(0,0,0,.42)) drop-shadow(0 13px 14px rgba(0,0,0,.28)) drop-shadow(0 0 7px rgba(218,168,68,.25)) !important; } /* ========================================= GOOGLE TRANSLATE — DISEÑO EDITORIAL ========================================= */ .goog-te-gadget { font-size:0 !important; line-height:1 !important; color:transparent !important; } .goog-te-gadget .goog-te-combo { appearance:none !important; -webkit-appearance:none !important; min-width:150px !important; height:38px !important; padding:0 38px 0 38px !important; border:1px solid rgba(218,168,68,.75) !important; border-radius:5px !important; background: linear-gradient(180deg,#234b6e 0%,#183852 100%) !important; color:#f8f1df !important; font-family:Georgia,"Times New Roman",serif !important; font-size:11px !important; font-weight:700 !important; letter-spacing:.06em !important; text-transform:uppercase !important; cursor:pointer !important; box-shadow: 0 3px 6px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(218,168,68,.08) !important; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important; } /* HOVER */ .goog-te-gadget .goog-te-combo:hover { border-color:#dda844 !important; box-shadow: 0 5px 10px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.10), 0 0 8px rgba(218,168,68,.16) !important; transform:translateY(-1px); } /* FOCUS */ .goog-te-gadget .goog-te-combo:focus { outline:none !important; border-color:#e3b04d !important; } /* QUITAR TEXTO DE GOOGLE */ .goog-te-gadget span, .goog-te-gadget a { display:none !important; } /* ========================================= CONTENEDOR COMO WIDGET ========================================= */ #google_translate_element { position:relative !important; display:inline-flex !important; align-items:center !important; } /* GLOBO */ #google_translate_element::before { content:"🌐" !important; position:absolute !important; left:12px !important; top:50% !important; transform:translateY(-50%) !important; z-index:3 !important; font-size:15px !important; line-height:1 !important; pointer-events:none !important; } /* FLECHA PERSONALIZADA */ #google_translate_element::after { content:"⌄" !important; position:absolute !important; right:12px !important; top:48% !important; transform:translateY(-50%) !important; color:#dda844 !important; font-size:16px !important; font-weight:700 !important; pointer-events:none !important; } /* ========================================= MÓVIL ========================================= */ @media(max-width:767px){ .goog-te-gadget .goog-te-combo { min-width:128px !important; height:35px !important; padding-left:34px !important; padding-right:30px !important; font-size:10px !important; } #google_translate_element::before { left:10px !important; font-size:13px !important; } #google_translate_element::after { right:9px !important; } }