del copyright y le imponía max-width:48ch → 3 líneas.) */ .site-footer .cm-foot-brand p { color:var(--cm-gray-300); font-size:13px; line-height:1.7; max-width:48ch; margin:16px 0 0; } /* Títulos de columna */ .site-footer .cm-foot-h { font-family:var(--cm-font-sans); font-size:11px; letter-spacing:0.22em; line-height:1.1; text-transform:uppercase; color:var(--cm-gray-400); font-weight:500; margin:0 0 16px; display:block; } /* Mapa de sitio (nav widget) */ .site-footer .footer-widget-area .menu, .site-footer .footer-widget-area ul { list-style:none; padding:0; margin:0; } .site-footer .footer-widget-area .menu li, .site-footer .footer-widget-area li { padding:0; font-size:13.5px; } .site-footer .footer-widget-area .menu a, .site-footer .footer-widget-area li a { color:var(--cm-gray-300); transition:color .2s; } .site-footer .footer-widget-area .menu a:hover, .site-footer .footer-widget-area li a:hover { color:var(--cm-cream); } /* Contacto */ .site-footer .cm-foot-contact .contact-line { display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--cm-gray-300); padding:4px 0; } .site-footer .cm-foot-contact .contact-line svg { width:14px; height:14px; color:var(--cm-gray-400); flex-shrink:0; } /* Barra de copyright (fila bottom) — alineada a la izquierda como la referencia */ .site-footer .site-footer-row-columns-1 .footer-html, .site-footer .footer-html-inner { font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--cm-gray-500); } /* El
del copyright a ancho completo (1 línea como la referencia) y sin margen. */ .site-footer .footer-html-inner p { margin:0; max-width:none; font-size:11px; line-height:1.6; } .site-footer .site-bottom-footer-inner-wrap { border-top:1px solid rgba(251,251,249,0.08); padding-top:16px; padding-bottom:24px; } .site-footer .site-footer-row-columns-1 .site-footer-section { justify-content:flex-start; text-align:left; } .site-footer .site-footer-row-columns-1 .footer-html { text-align:left; } /* Tipografía base del footer */ .site-footer { font-family:var(--cm-font-sans); } /* ============ MENÚ MÓVIL — Popup Drawer de Kadence (fullwidth overlay) ============ Estructura real de Kadence: #mobile-drawer.popup-drawer-layout-fullwidth .drawer-overlay .drawer-inner .drawer-header > button.menu-toggle-close (2× .toggle-close-bar = X) .drawer-content.mobile-drawer-content nav#site-navigation > .primary-menu-container > ul#primary-menu.menu > li.menu-item > a Lo estilamos como el overlay de la referencia Website-Home.html: fondo negro, enlaces grandes serif a ANCHO COMPLETO alineados a la izquierda, con "→" al hacer hover, label "Menú" arriba-izquierda, X arriba-derecha, y entrada escalonada. */ /* --- Botón hamburguesa (en el header, sobre el hero oscuro → crema) --- */ #mobile-toggle.menu-toggle-open { background:transparent; border:none; cursor:pointer; padding:8px; display:inline-flex; align-items:center; justify-content:center; color:var(--cm-cream); } #mobile-toggle .menu-toggle-icon { color:var(--cm-cream); display:inline-flex; } #mobile-toggle .menu-toggle-icon svg, #mobile-toggle .kadence-svg-iconset svg { width:24px; height:24px; fill:currentColor; color:var(--cm-cream); } /* --- El popup fullwidth: overlay negro a pantalla completa --- */ #mobile-drawer.popup-drawer-layout-fullwidth { background:var(--cm-black); position:fixed; inset:0; z-index:9999; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .5s cubic-bezier(0.4,0,0.2,1), visibility 0s linear .5s; } #mobile-drawer.popup-drawer-layout-fullwidth.show-drawer, #mobile-drawer.popup-drawer-layout-fullwidth.active { opacity:1; visibility:visible; pointer-events:auto; transition:opacity .5s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 0s; } .drawer-overlay { display:none; } body.showing-popup-drawer-from-full { overflow:hidden; } /* --- Contenedor interno: centra verticalmente el menú, padding lateral 32px --- */ #mobile-drawer .drawer-inner { position:relative; min-height:100%; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; padding:128px 32px 48px; } /* Header (solo contiene la X): lo sacamos del flujo para no descentrar el menú */ #mobile-drawer .drawer-header { position:absolute; top:0; right:0; margin:0; padding:0; } /* --- Botón de cierre (X formada por 2 barras) arriba-derecha --- */ #mobile-drawer .menu-toggle-close.drawer-toggle { position:absolute; top:30px; right:26px; width:30px; height:30px; background:transparent; border:none; cursor:pointer; padding:0; z-index:10; } #mobile-drawer .menu-toggle-close .toggle-close-bar { background:var(--cm-cream); } /* fallback por si Kadence usa un icono SVG en vez de barras */ #mobile-drawer .menu-toggle-close svg { width:24px; height:24px; fill:var(--cm-cream); } /* --- Label "Menú" arriba-izquierda (relativo al drawer fijo) --- */ #mobile-drawer .mobile-drawer-content::before { content:"Menú"; position:absolute; top:38px; left:32px; font-family:var(--cm-font-sans); font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--cm-gray-400); opacity:0; transition:opacity .4s ease .2s; } #mobile-drawer.show-drawer .mobile-drawer-content::before { opacity:1; } /* --- Área de contenido del menú: ancho completo, alineado a la izquierda --- */ #mobile-drawer .drawer-content.mobile-drawer-content { width:100%; max-width:none; padding:0; margin:0; text-align:left; } #mobile-drawer .site-header-item, #mobile-drawer .main-navigation, #mobile-drawer .primary-menu-container, #mobile-drawer .header-navigation { width:100%; } /* --- La lista de enlaces: columna a ancho completo --- */ #mobile-drawer .menu { list-style:none; padding:0; margin:0; display:flex !important; flex-direction:column !important; align-items:stretch; gap:16px; width:100%; } #mobile-drawer .menu > .menu-item { width:100%; margin:0; } /* --- Cada enlace: serif grande, ancho completo, texto izq + "→" der --- */ #mobile-drawer .menu > .menu-item > a { font-family:var(--cm-font-serif); font-size:clamp(34px,9vw,54px); font-weight:400; line-height:1.0; letter-spacing:-0.018em; color:var(--cm-cream); display:flex; align-items:center; justify-content:space-between; width:100%; padding:4px 0; border-bottom:1px solid rgba(251,251,249,0.08); text-decoration:none; opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(0.16,1,0.3,1), transform .8s cubic-bezier(0.16,1,0.3,1), color .2s; } /* "→" al final, oculto hasta el hover */ #mobile-drawer .menu > .menu-item > a::after { content:"→"; font-family:var(--cm-font-sans); font-size:18px; font-weight:400; color:var(--cm-gray-500); opacity:0; transform:translateX(-6px); transition:opacity .25s, transform .3s cubic-bezier(0.16,1,0.3,1), color .2s; } #mobile-drawer .menu > .menu-item > a:hover::after { opacity:1; transform:translateX(0); color:var(--cm-cream); } /* enlace activo: punto • en vez de flecha */ #mobile-drawer .menu > .menu-item.current-menu-item > a::after { content:"\2022"; opacity:1; transform:none; color:var(--cm-cream); font-size:22px; } /* --- Entrada escalonada al abrir (igual a la referencia) --- */ #mobile-drawer.show-drawer .menu > .menu-item > a { opacity:1; transform:translateY(0); } #mobile-drawer.show-drawer .menu > .menu-item:nth-child(1) > a { transition-delay:.22s; } #mobile-drawer.show-drawer .menu > .menu-item:nth-child(2) > a { transition-delay:.30s; } #mobile-drawer.show-drawer .menu > .menu-item:nth-child(3) > a { transition-delay:.38s; } #mobile-drawer.show-drawer .menu > .menu-item:nth-child(4) > a { transition-delay:.46s; } #mobile-drawer.show-drawer .menu > .menu-item:nth-child(5) > a { transition-delay:.54s; } /* En escritorio (>900px) ocultamos el toggle y el drawer */ @media (min-width:901px) { #mobile-toggle, #mobile-drawer { display:none !important; } }