:root {
    --primary-accent: #5B5FEF;
    --primary-accent-hover: #4B4FDF;
    --primary-accent-light: #EEF0FD;
    --bg-main: #FFFFFF;
    --bg-secondary: #F8FAFC;
    --bg-card: #FFFFFF;
    --bg-subtle: #F1F5F9;
    --text-main: #0F172A;
    --text-muted: #64748B;
    --border-light: #E2E8F0;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background-color: var(--bg-main);
    color: var(--text-main);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    margin-top: 0;
    line-height: 1.25;
}

a,
a:hover,
a:focus {
    text-decoration: none;
    color: inherit;
    transition: color 0.2s ease;
}

button {
    cursor: pointer;
    border: none;
    background: none;
    font-family: inherit;
}

ul,
ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

:focus-visible {
    outline: 2px solid var(--primary-accent);
    outline-offset: 2px;
}

@media (max-width: 768px) {
    h1 {
        font-size: clamp(1.75rem, 5vw, 2.25rem);
    }

    h2 {
        font-size: clamp(1.5rem, 4vw, 1.875rem);
    }

    h3 {
        font-size: clamp(1.125rem, 3.5vw, 1.375rem);
    }

    .truncate-mobile {
        word-break: break-all;
    }
}

/* ===== fervano_header ===== */
#site-header {
    overflow: hidden;
    hyphens: auto;
}

html {
    scroll-behavior: smooth;
}

.js-mobile-overlay.open {
    display: flex !important;
}

/* ===== fervano_hero ===== */
#hero-section {
    overflow: hidden;
    hyphens: auto;
}

#hero-section h1 {
    line-height: 1.2;
}

/* ===== fervano_categories ===== */
#categories {
    width: 100%;
    box-sizing: border-box;
}

#categories h2,
#categories h3 {
    hyphens: auto;
}

/* ===== fervano_popular_smartphones ===== */
#popular-smartphones {
    overflow: hidden;
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.96)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.animate-fadeIn {
    animation: modalFadeIn 0.2s ease-out forwards;
}

/* ===== fervano_accessories ===== */
#accessories {
    overflow: hidden;
    hyphens: auto;
}

#accessories input::placeholder {
    color: #64748B;
}

/* ===== fervano_new_arrivals ===== */
#new-arrivals {
    overflow: hidden;
    hyphens: auto;
}

#new-arrivals input::placeholder {
    color: #64748B;
}

/* ===== fervano_interactive_finder ===== */
#interactive-finder .js-finder-btn.active {
    background-color: #5B5FEF;
    color: #FFFFFF;
    border-color: #5B5FEF;
}

#interactive-finder .js-finder-btn.active i {
    color: #FFFFFF;
}

/* ===== fervano_bundles ===== */
#bundles input::placeholder {
    color: #64748B;
}

#bundles input:focus {
    border-color: #5B5FEF;
    box-shadow: 0 0 0 1px #5B5FEF;
}

/* ===== fervano_advantages ===== */
#advantages {
    overflow: hidden;
}

#advantages .js-adv-card {
    hyphens: auto;
}

/* ===== fervano_useful_accessories ===== */
#accessories {
    overflow: hidden;
}

#accessories * {
    box-sizing: border-box;
    hyphens: auto;
}

input::placeholder {
    color: #64748B;
}

/* ===== fervano_faq ===== */
#faq {
    overflow: hidden;
}

#faq .js-faq-item.is-open {
    border-color: #5B5FEF;
    box-shadow: 0 4px 12px rgba(91, 95, 239, 0.08);
}

#faq .js-faq-item.is-open .js-faq-icon {
    transform: rotate(180deg);
    color: #5B5FEF;
}

/* ===== fervano_order_modal ===== */
#quick-order-modal {
    overflow: hidden;
}

#quick-order-modal input::placeholder,
#quick-order-modal textarea::placeholder {
    color: #94A3B8;
    opacity: 1;
}

#quick-order-modal input[type="number"]::-webkit-inner-spin-button,
#quick-order-modal input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#quick-order-modal input[type="number"] {
    -moz-appearance: textfield;
}

/* ===== fervano_footer ===== */
#site-footer {
    hyphens: auto;
}

#site-footer a {
    transition: color 0.2s ease-in-out;
}