/* ============================================================================ Arquigestión Campus — arquigestion.css Orden: (1) port de src/css/estilos.css · (2) utilidades · (3) puente Elementor · (4) bloques nuevos (compra, 404, curso LD, Mi cuenta, Woo blocks, Focus Mode) · (5) editor · (6) prefers-reduced-motion. Se encola con dependencias elementor-frontend / learndash-front / wc-blocks-style a prioridad 999: gana los empates de especificidad por orden de carga. ============================================================================ */ /* --------------------------------------------------------------------------- (1) PORT DE estilos.css — casi verbatim. Cambios: sin @font-face (Montserrat la sirve el Kit de Elementor), sin img{max-width:none…} (→ .deco y .elementor-widget img), 800→900, 500→400, -webkit-backdrop-filter, .btn.btn--borde, body.home .footer, admin-bar. --------------------------------------------------------------------------- */ :root{--azul:#00346A;--naranja:#E64F13;--gris:#798A9C;--blanco:#F0F2F5;--negro:#1D1D1B} *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--blanco);font-family:'Montserrat',sans-serif;color:var(--negro);-webkit-font-smoothing:antialiased} a{color:var(--azul);text-decoration:none} a:hover{color:var(--naranja)} ::selection{background:var(--naranja);color:var(--blanco)} /* En el estatico una regla img{max-width:none;width:auto;height:auto} neutralizaba el presentational hint de width/height. En WordPress esa regla rompe el img{max-width:100%} del tema, asi que se reemplaza por dos reglas acotadas: las decoraciones no se limitan al ancho del contenedor y las imagenes de los widgets ignoran el alto del atributo. */ .deco{max-width:none} .elementor-widget img{height:auto} /* El estatico traia img{max-width:none;width:auto;height:auto}, que no se puede portar tal cual porque rompe el max-width:100% que WordPress da por sentado. Las imagenes del diseno fijan su altura con style inline: para esas, y solo para esas, se restaura el ancho proporcional; si no conservan el ancho natural del archivo (519px del monograma) y salen aplastadas. */ body.arq img[style*="height:"]{width:auto;max-width:none} .footer__marca img,.menu-movil__logo img,.arq-focus-logo img,img.footer__monograma,img.menu-movil__monograma{width:auto} input,textarea,button{font-family:'Montserrat',sans-serif} input::placeholder,textarea::placeholder{color:var(--gris)} @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}} @keyframes fadeUp{from{opacity:0;transform:translateY(42px)}to{opacity:1;transform:translateY(0)}} @keyframes fadeIn{from{opacity:0}to{opacity:1}} @keyframes fadeLeft{from{opacity:0;transform:translateX(-46px)}to{opacity:1;transform:translateX(0)}} @keyframes scaleIn{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}} @keyframes drift{from{transform:translateY(60px)}to{transform:translateY(-60px)}} @keyframes slideMark{from{transform:translateX(3%)}to{transform:translateX(-40%)}} /* Reveals al scroll (fallback: se muestran de una) */ .rev{animation:fadeUp 1ms linear both;animation-timeline:view();animation-range:entry 0% entry 28%} .rev-izq{animation:fadeLeft 1ms linear both;animation-timeline:view();animation-range:entry 0% entry 28%} .rev-esc{animation:scaleIn 1ms linear both;animation-timeline:view();animation-range:entry 0% entry 25%} .rev-2{animation-range:entry 6% entry 36%} .rev-3{animation-range:entry 12% entry 42%} /* Safari (WebKit) todavia no soporta animation-timeline. Sin soporte, `animation: X linear both` sin duracion corre como animacion de tiempo de 0s y `fill:both` la deja en su estado FINAL. Para casi todos los efectos ese estado final es "visible" y la degradacion es correcta, pero `drift` termina en translateY(-60px) y `slideMark` en translateX(-40%): las decoraciones quedan corridas y el wordmark gigante se lee desplazado. Por eso esas dos SOLO se declaran donde el scroll-timeline existe; sin el, el elemento queda en su posicion natural. */ @supports (animation-timeline: view()){ .deriva{animation:drift linear both;animation-timeline:view();animation-range:entry 0% exit 100%} } .anima-1{animation:fadeUp .8s ease both} .anima-2{animation:fadeUp .8s .08s ease both} .anima-3{animation:fadeUp .8s .16s ease both} .anima-4{animation:fadeUp .8s .24s ease both} .aparece-1{animation:fadeIn 1.4s .5s ease both} .aparece-2{animation:fadeIn 1.4s .7s ease both} /* Header */ .header{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;height:64px;background:rgba(240,242,245,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(0,52,106,.1)} body.admin-bar .header{top:32px} @media (max-width:782px){body.admin-bar .header{top:46px}} .header__logo{display:flex;align-items:center} .logo-desktop{height:24px;display:block} .logo-movil{height:36px;display:none} .nav{display:flex;align-items:center;gap:clamp(18px,2.6vw,34px)} .nav__link{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:4px 0} .nav__link.activo{font-weight:700;color:var(--naranja);border-bottom:2px solid var(--naranja)} .btn-campus{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blanco);background:var(--azul);padding:12px 22px;display:inline-block} .btn-campus:hover{background:var(--naranja);color:var(--blanco)} .burger{display:none;background:none;border:none;cursor:pointer;padding:10px 0 10px 12px;flex-direction:column;gap:5px;align-items:flex-end} .burger span{display:block;width:26px;height:3px;background:var(--azul)} /* El Theme Style de botones del Kit (.elementor-kit-6 button, especificidad 0,1,1) pinta de naranja TODO