/* SMG Movers LLC — custom styles
   Tailwind utility classes are loaded via CDN in index.html.
   This file holds: icon font tweaks, header logo background, and small overrides. */

/* Material Symbols default weight/fill */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Filled stars for review ratings */
.filled-star {
    font-variation-settings: 'FILL' 1;
}

/* Smooth anchor scrolling fallback for browsers without JS */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px; /* offset for fixed nav */
}

/* Header / hero — match logo's solid black background */
header#top {
    background-color: #000000;
}

/* Footer — also use the logo's black for visual consistency */
footer {
    background-color: #000000;
}

/* Subtle radial accent behind the hero content to lift it off pure black */
header#top::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        circle at 20% 50%,
        rgba(253, 118, 26, 0.08) 0%,
        transparent 60%
    );
    pointer-events: none;
    z-index: 1;
}

/* Logo image — keep crisp on dark background */
img[alt*="SMG Movers LLC logo"] {
    image-rendering: -webkit-optimize-contrast;
}

/* Form status message colors */
.text-error {
    color: #ba1a1a;
}

/* Make sure form inputs stay readable on autofill (Chrome) */
input:-webkit-autofill,
select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #f7f9ff inset;
    -webkit-text-fill-color: #001d32;
}

/* Disabled submit button while sending */
button[type="submit"]:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Carousel track — hide native scrollbar but keep scroll behavior */
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Gallery dot active state width transition */
.gallery-dot {
    transition: width 0.25s ease, background-color 0.25s ease;
}

/* RevuKit widget — hide its internal heading; the section already has its own H2 */
.revukit-wrapper h1,
.revukit-wrapper h2,
.revukit-wrapper h3,
.revukit-wrapper h4 {
    display: none !important;
}

/* Glass card surface (shared with landing page) */
.glass-card {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(0, 32, 70, 0.12);
}

/* Body gradient (subtle top-blue fade into off-white) */
.gradient-bg {
    background: linear-gradient(180deg, #d3e4fe 0%, #faf9fd 35%, #faf9fd 100%);
    background-color: #faf9fd;
}

.letter-spacing-wide {
    letter-spacing: 0.05em;
}

/* Pulsing dot used in trust badges */
@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.6; transform: scale(1.15); }
}
.pulse-dot { animation: pulse-dot 2s ease-in-out infinite; }

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .pulse-dot { animation: none; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}