/* Landing base styles — moved out of the inline <style> block in index.php
   (Content-Security-Policy blocks inline styles). Loaded LAST so it wins
   exactly like the old block did. */
html { scroll-behavior: smooth; scroll-padding-top: 140px; }
.landing-main,
.landing-main * { font-family: 'Roboto', 'DM Sans', sans-serif; }
.landing-main { --r: 16px; }
.landing-main img { display: block; max-width: 100%; }
.landing-main .eyebrow {
    display: inline-block;
    background: #fbe4e4;
    color: #b4070b; font-size: 13px; font-weight: 700;
    padding: 10px 25px; border-radius: 0;
}

/* Contact form: spam-trap field kept off-screen (bots fill it, people never see it) */
.landing-main .hp-field { position: absolute; left: -9999px; }
/* Contact form result message (shown by js/landing.js) */
.landing-main .contact-form-status { margin-top: 14px; font-size: 14.5px; }
.landing-main .contact-form-status.is-ok    { color: #0c7a3f; }
.landing-main .contact-form-status.is-error { color: #b4070b; }

/* Phones: product cards fade up as they scroll into view.
   js/landing.js adds .reveal (phones only) and .active when a card is seen. */
.reveal        { opacity: 0; transform: translateY(20px); transition: all 0.6s ease; }
.reveal.active { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; }
}