/* ============================================================
   Calcola Codice Fiscale - Responsive Styles
   ============================================================ */

/* Tablet (768px+) */
@media (min-width: 768px) {
    .ccf-container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .ccf-header__nav {
        display: block;
    }

    .ccf-header__mobile-btn {
        display: none;
    }

    .ccf-hero__title {
        font-size: 2.5rem;
    }

    .ccf-hero__inner {
        padding: 4rem 1.5rem 5rem;
    }

    .ccf-result-box__code {
        font-size: 2.5rem;
    }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
    .ccf-container {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .ccf-hero__title {
        font-size: 3rem;
    }

    .ccf-hero__inner {
        padding: 5rem 2rem 6rem;
    }
}

/* Mobile (below 768px) */
@media (max-width: 767px) {
    .ccf-grid--2 {
        grid-template-columns: 1fr;
    }

    .ccf-grid {
        display: grid;
        gap: 5px;
    }

    .ccf-grid--3 {
        grid-template-columns: 1fr;
    }

    .ccf-grid--4 {
        grid-template-columns: 1fr 1fr;
    }

    .ccf-grid--sidebar {
        grid-template-columns: 1fr;
    }

    .ccf-grid--hero {
        grid-template-columns: 1fr;
    }

    .ccf-grid--contact {
        grid-template-columns: 1fr;
    }

    .ccf-hero__content {
        text-align: left;
    }

    .ccf-hero__title {
        font-size: 1.875rem;
    }

    .ccf-hero__desc {
        font-size: 1rem;
    }

    .ccf-hero__inner {
        padding: 2rem 1rem 2.5rem;
    }

    .ccf-hero__card {
        padding: 1.25rem;
    }

    .ccf-hero__features {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .ccf-card__body {
        padding: 10px;
    }

    .ccf-result-box {
        padding: 1.5rem;
    }

    .ccf-result-box__code {
        font-size: 1.5rem;
        letter-spacing: 0.15em;
    }

    .ccf-breakdown__items {
        gap: 0.125rem;
    }

    .ccf-breakdown-item {
        min-width: 2.5rem;
        padding: 0.375rem 0.125rem;
    }

    .ccf-breakdown-item__code {
        font-size: 0.875rem;
        padding: 0.25rem 0.5rem;
    }

    .ccf-breakdown-item__label {
        font-size: 0.5rem;
    }

    .ccf-share__buttons {
        flex-direction: column;
    }

    .ccf-share-btn {
        justify-content: center;
    }

    .ccf-footer__main {
        padding: 2rem 1rem;
    }

    .ccf-footer .ccf-grid--3 {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .ccf-example__segments {
        gap: 0.175rem;
    }

    .ccf-segment__code {
        font-size: 0.875rem;
        padding: 0.375rem 0.5rem;
    }

    .ccf-section {
        padding: 2rem 0;
    }

    .ccf-section__title {
        font-size: 1.25rem;
    }

    .ccf-cookie-banner__inner {
        flex-direction: column;
        align-items: stretch;
    }

    .ccf-cookie-banner__actions {
        justify-content: stretch;
    }

    .ccf-cookie-banner__actions .ccf-btn {
        flex: 1;
    }

    .ccf-posts-grid {
        grid-template-columns: 1fr;
    }

    .ccf-404__code {
        font-size: 3rem;
    }

    .ccf-lang-switcher {
        font-size: 0.675rem;
    }

    .ccf-header__logo-tagline {
        display: none;
    }

    .ccf-form-group .ccf-grid--2 {
        grid-template-columns: 1fr;
    }

    .ccf-gender-group {
        flex-direction: row;
    }
}

/* Small Mobile (below 480px) */
@media (max-width: 479px) {
    .ccf-grid--4 {
        grid-template-columns: 1fr;
    }

    .ccf-hero__features {
        grid-template-columns: 1fr;
    }

    .ccf-hero__title {
        font-size: 1.5rem;
    }

    .ccf-result-box__code {
        font-size: 1.25rem;
    }

    .ccf-faq-filters {
        gap: 0.25rem;
    }

    .ccf-filter-btn {
        padding: 0.375rem 0.75rem;
        font-size: 0.75rem;
    }

    .ccf-info-card {
        padding: 1rem;
    }
}