/* =================================================================== Berberina Nutrimax — Experiencia de scroll · estilos base Las fuentes se cargan vía de Google Fonts en el . El resto del diseño usa estilos inline en el HTML (intencional, para preservar exactamente el layout aprobado). =================================================================== */ *{ box-sizing:border-box; } html,body{ margin:0; padding:0; background:#0E0C07; color:#F4F1E9; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden; } ::selection{ background:#E3A50B; color:#16130C; } img{ display:block; } /* ---- Keyframes de la experiencia ---- */ @keyframes pulseDot{ 0%,100%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.18); opacity:.78; } } @keyframes floatY{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } } @keyframes drift{ 0%{ transform:translate(0,0); opacity:.4; } 50%{ transform:translate(10px,-26px); opacity:1; } 100%{ transform:translate(0,0); opacity:.4; } } @keyframes shimmer{ 0%{ background-position:0% 50%; } 100%{ background-position:200% 50%; } } @keyframes flowIn{ 0%{ transform:translateX(-40px) scale(.4); opacity:0; } 30%{ opacity:1; } 100%{ transform:translateX(0) scale(1); opacity:0; } } @keyframes ringPulse{ 0%,100%{ transform:scale(1); opacity:.5; } 50%{ transform:scale(1.5); opacity:0; } } @keyframes rise{ 0%{ transform:translateY(0); opacity:.3; } 50%{ opacity:.9; } 100%{ transform:translateY(-30px); opacity:0; } } /* ---- Hover states (antes eran style-hover en el DC) ---- */ .btn-primary{ transition:transform .25s, box-shadow .25s; } .btn-primary:hover{ transform:translateY(-3px); box-shadow:0 20px 46px rgba(227,165,11,.55); } .btn-ghost{ transition:border-color .25s, color .25s; } .btn-ghost:hover{ border-color:#E3A50B; color:#F6C544; } .cta-bar-btn{ transition:transform .2s; } .cta-bar-btn:hover{ transform:scale(1.04); } .card-soft{ transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s; } .card-soft:hover{ transform:translateY(-9px); border-color:rgba(227,165,11,.45); box-shadow:0 30px 60px rgba(0,0,0,.5); } .card-hero{ transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; } .card-hero:hover{ transform:translateY(-12px); box-shadow:0 36px 76px rgba(227,165,11,.26); } .cta-store{ transition:transform .25s, box-shadow .25s; } .cta-store:hover{ transform:translateY(-3px); box-shadow:0 22px 50px rgba(227,165,11,.55); } .cta-dark{ transition:transform .25s, box-shadow .25s; } .cta-dark:hover{ transform:translateY(-3px); box-shadow:0 26px 54px rgba(22,19,12,.4); } @media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; } }