/*
 * ITNETCOM - normalizzazione UX pagine secondarie
 * La home non carica questo file: index.php resta invariato.
 */

body.itn-secondary-page {
    --itn-secondary-title: clamp(32px, 4vw, 54px);
    --itn-secondary-title-mobile: clamp(28px, 8vw, 38px);
    --itn-secondary-h2: clamp(24px, 2.4vw, 34px);
    --itn-secondary-h3: 20px;
    --itn-secondary-text: 16px;
    --itn-secondary-small: 13px;
    --itn-secondary-label: 12px;
    --itn-secondary-gap: 24px;
    --itn-secondary-border: #dddddd;
    --itn-secondary-soft: #f7f7f7;
    background: #ffffff;
    color: var(--text, #1f1f1f);
    font-family: Arial, Helvetica, sans-serif;
    font-size: var(--itn-secondary-text);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.itn-secondary-page main {
    background: #ffffff;
    overflow-x: hidden;
}

body.itn-secondary-page :where(.cart-page, .checkout-page, .shop-page, .product-page, .account-page, .registration-page, .about-legacy-page) {
    background: #ffffff;
    color: var(--text, #1f1f1f);
}

body.itn-secondary-page :where(.cart-hero, .shop-hero, .account-hero, .registration-section, .about-legacy-page) {
    background: #ffffff;
}

body.itn-secondary-page :where(.cart-hero, .shop-hero, .account-hero) {
    padding-top: 34px;
    padding-bottom: 24px;
    border-bottom: 1px solid #eeeeee;
}

body.itn-secondary-page :where(.cart-hero-inner, .shop-hero-inner, .account-hero-inner) {
    margin: 0;
    text-align: left;
}

body.itn-secondary-page :where(.shop-hero-copy) {
    padding: 0;
    border: 0;
    background: transparent;
}

body.itn-secondary-page :where(.cart-kicker, .shop-kicker, .shop-results-kicker, .shop-filter-kicker, .account-kicker, .account-panel-heading p, .account-order-label) {
    margin-top: 0;
    color: var(--brand-red, #ff0000);
    font-size: 11px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.itn-secondary-page :where(.cart-hero h1, .shop-hero-copy h1, .account-hero h1, .registration-title h1, .about-legacy-head h1) {
    margin-top: 0;
    color: #111111;
    font-size: var(--itn-secondary-title);
    line-height: 0.98;
    font-weight: 800;
    letter-spacing: -0.05em;
}

body.itn-secondary-page :where(.product-summary h1, .product-empty-state h1) {
    font-size: clamp(26px, 2.6vw, 40px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -0.035em;
}

body.itn-secondary-page :where(.cart-hero p:not(.cart-kicker), .shop-hero-copy p:not(.shop-kicker), .account-hero p:not(.account-kicker), .about-legacy-lead, .about-legacy-sublead) {
    max-width: 820px;
    color: #555555;
    font-size: 16px;
    line-height: 1.65;
}

body.itn-secondary-page :where(.cart-panel-heading h2, .checkout-card-heading h2, .account-panel-heading h2, .registration-block h2, .shop-filter-heading h2, .shop-category-panel h2, .shop-results-toolbar h2, .product-description-title, .product-related-title, .about-legacy-contact h2, .about-legacy-message h2, .about-legacy-specialties-main h2) {
    color: #111111;
    font-size: var(--itn-secondary-h2);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -0.035em;
}

body.itn-secondary-page :where(p, li, td, th) {
    font-size: inherit;
}

body.itn-secondary-page :where(.cart-items-panel, .cart-summary-panel, .checkout-card, .shop-filter-panel, .shop-category-panel, .shop-results-toolbar, .account-panel, .registration-panel, .product-description-card, .product-buy-box, .cart-empty, .account-login-card) {
    border-color: var(--itn-secondary-border);
    background: #ffffff;
    border-radius: 0;
}

body.itn-secondary-page :where(input, select, textarea) {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.3;
    border-radius: 0;
}

body.itn-secondary-page :where(.checkout-card input, .checkout-card select, .checkout-card textarea, .registration-field input, .registration-field select, .registration-field textarea, .account-field input, .account-field select, .account-field textarea, .shop-field input, .shop-field select) {
    min-height: 48px;
    border: 1px solid #dcdcdc;
    background: #ffffff;
    color: #111111;
    font-size: 16px;
    font-weight: 500;
}

body.itn-secondary-page :where(.checkout-card label, .checkout-full-label, .registration-field span, .account-field, .shop-field span) {
    color: #111111;
    font-size: var(--itn-secondary-label);
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

body.itn-secondary-page :where(button, .cart-primary-link, .cart-submit-button, .cart-secondary-link, .checkout-submit-btn, .checkout-back-link, .account-primary-btn, .account-secondary-btn, .account-logout, .account-order-actions a, .registration-submit, .shop-filter-submit, .shop-empty-button, .shop-product-cart, .product-add-button) {
    min-height: 48px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
    border-radius: 0;
    text-decoration: none;
}

body.itn-secondary-page :where(a, button, input, select, textarea) {
    -webkit-tap-highlight-color: rgba(255, 0, 0, 0.12);
}

body.itn-secondary-page :where(a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible) {
    outline: 2px solid var(--brand-red, #ff0000);
    outline-offset: 2px;
}

body.itn-secondary-page .about-legacy-page {
    padding-top: 34px;
    padding-bottom: 56px;
}

body.itn-secondary-page .about-legacy-shell .container {
    background: transparent;
}

body.itn-secondary-page :where(.about-legacy-feature p, .about-legacy-contact p, .about-legacy-message p, .about-legacy-hours, .about-legacy-lists li) {
    font-size: 16px;
    line-height: 1.7;
    color: #333333;
}

body.itn-secondary-page .about-legacy-phone {
    color: #111111;
    font-size: 20px;
}

body.itn-secondary-page .shop-products-grid {
    align-items: stretch;
}

body.itn-secondary-page .shop-product-name {
    font-size: 15px;
    line-height: 1.3;
}

body.itn-secondary-page :where(.shop-product-brand, .shop-product-code, .shop-product-tech, .shop-product-stock, .shop-product-vat) {
    font-size: 12px;
}

body.itn-secondary-page .shop-product-price {
    font-size: 22px;
}

body.itn-secondary-page .product-code-inline,
body.itn-secondary-page .product-category-line,
body.itn-secondary-page .product-buy-availability,
body.itn-secondary-page .product-buy-benefits li {
    font-size: 14px;
    line-height: 1.5;
}

@media (max-width: 1180px) {
    body.itn-secondary-page .product-detail-card {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    }

    body.itn-secondary-page .product-gallery {
        grid-column: 1 / -1;
    }

    body.itn-secondary-page .product-media {
        min-height: 420px;
    }
}

@media (max-width: 820px) {
    body.itn-secondary-page {
        --itn-secondary-gap: 16px;
        font-size: 15px;
    }

    body.itn-secondary-page .container {
        width: min(100% - 28px, 1600px);
    }

    body.itn-secondary-page :where(.cart-hero, .shop-hero, .account-hero) {
        padding-top: 24px;
        padding-bottom: 18px;
    }

    body.itn-secondary-page :where(.cart-hero h1, .shop-hero-copy h1, .account-hero h1, .registration-title h1, .about-legacy-head h1) {
        font-size: var(--itn-secondary-title-mobile);
        line-height: 1;
        letter-spacing: -0.045em;
    }

    body.itn-secondary-page :where(.product-summary h1, .product-empty-state h1) {
        font-size: clamp(24px, 7vw, 34px);
        line-height: 1.12;
    }

    body.itn-secondary-page :where(.cart-hero p:not(.cart-kicker), .shop-hero-copy p:not(.shop-kicker), .account-hero p:not(.account-kicker), .about-legacy-lead, .about-legacy-sublead) {
        font-size: 15px;
        line-height: 1.6;
    }

    body.itn-secondary-page :where(.cart-section, .checkout-section, .shop-catalog, .account-section, .registration-section, .product-main-section, .product-description-section, .product-related-section) {
        padding-top: 20px;
        padding-bottom: 34px;
    }

    body.itn-secondary-page :where(.cart-layout, .checkout-layout, .shop-layout, .product-detail-card, .account-rma-layout, .account-data-grid, .registration-grid, .registration-grid-2, .registration-grid-3, .registration-grid-4) {
        grid-template-columns: 1fr !important;
    }

    body.itn-secondary-page :where(.checkout-form-grid-2, .checkout-form-grid-3, .account-rma-form) {
        grid-template-columns: 1fr !important;
    }

    body.itn-secondary-page :where(.checkout-span-2, .account-field-wide, .registration-wide) {
        grid-column: auto !important;
    }

    body.itn-secondary-page :where(.checkout-card, .account-panel, .registration-block, .cart-items-panel, .cart-summary-panel) {
        padding: 18px;
    }

    body.itn-secondary-page .cart-panel-heading {
        gap: 8px;
        align-items: flex-start;
    }

    body.itn-secondary-page .shop-sidebar {
        position: static;
        top: auto;
        gap: 12px;
    }

    body.itn-secondary-page .shop-filter-panel,
    body.itn-secondary-page .shop-category-panel {
        padding: 14px;
    }

    body.itn-secondary-page .shop-products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px 14px;
    }

    body.itn-secondary-page .shop-product-card {
        min-height: 0;
    }

    body.itn-secondary-page .shop-product-media {
        padding: 10px;
        margin-bottom: 10px;
    }

    body.itn-secondary-page .shop-product-name {
        min-height: 0;
        font-size: 14px;
        line-height: 1.28;
    }

    body.itn-secondary-page :where(.shop-product-brand, .shop-product-code, .shop-product-tech, .shop-product-stock, .shop-product-vat) {
        font-size: 11px;
    }

    body.itn-secondary-page .shop-product-price {
        font-size: 20px;
    }

    body.itn-secondary-page .shop-product-actions {
        align-items: stretch;
        gap: 8px;
    }

    body.itn-secondary-page .shop-product-qty {
        width: 82px;
        min-width: 82px;
        height: 42px;
    }

    body.itn-secondary-page .shop-product-cart {
        min-height: 42px;
        height: 42px;
        font-size: 10px;
        padding: 0 8px;
    }

    body.itn-secondary-page .product-summary {
        padding-top: 0;
    }

    body.itn-secondary-page .product-media {
        min-height: 300px;
    }

    body.itn-secondary-page .product-buy-box {
        position: static;
        top: auto;
    }

    body.itn-secondary-page .checkout-delivery-choice {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    body.itn-secondary-page .checkout-delivery-option {
        min-height: 112px;
        padding: 14px;
        grid-template-columns: 30px minmax(0, 1fr);
        column-gap: 10px !important;
    }

    body.itn-secondary-page .checkout-delivery-option .material-symbols-outlined {
        width: 30px;
        height: 30px;
        font-size: 19px;
    }

    body.itn-secondary-page .checkout-delivery-option strong {
        font-size: 14px;
    }

    body.itn-secondary-page .checkout-delivery-option small {
        font-size: 12px;
    }

    body.itn-secondary-page .account-tabs {
        grid-template-columns: 1fr;
    }

    body.itn-secondary-page .account-tabs a {
        justify-content: flex-start;
        padding: 0 16px;
        min-height: 52px;
    }

    body.itn-secondary-page .account-order-card,
    body.itn-secondary-page .account-rma-card {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    body.itn-secondary-page .about-legacy-top-grid,
    body.itn-secondary-page .about-legacy-specialties,
    body.itn-secondary-page .about-legacy-lists {
        grid-template-columns: 1fr !important;
        gap: 24px;
    }

    body.itn-secondary-page :where(.about-legacy-icon, .about-legacy-contact-icon, .about-legacy-message-icon) {
        height: auto;
        margin-bottom: 14px;
        justify-content: flex-start;
    }

    body.itn-secondary-page :where(.about-legacy-icon svg, .about-legacy-contact-icon svg, .about-legacy-message-icon svg) {
        width: 72px;
        height: 72px;
    }

    body.itn-secondary-page .about-legacy-contact,
    body.itn-secondary-page .about-legacy-message {
        text-align: left;
    }
}

@media (max-width: 520px) {
    body.itn-secondary-page .container {
        width: min(100% - 24px, 1600px);
    }

    body.itn-secondary-page :where(.checkout-card, .account-panel, .registration-block, .cart-items-panel, .cart-summary-panel) {
        padding: 16px;
    }

    body.itn-secondary-page .registration-title {
        padding: 26px 22px 22px;
    }

    body.itn-secondary-page .shop-products-grid {
        gap: 18px 12px;
    }

    body.itn-secondary-page .shop-product-name {
        font-size: 13.5px;
    }

    body.itn-secondary-page .shop-product-actions {
        flex-direction: column;
    }

    body.itn-secondary-page .shop-product-qty,
    body.itn-secondary-page .shop-product-cart {
        width: 100%;
        min-width: 0;
    }

    body.itn-secondary-page .checkout-delivery-option {
        grid-template-columns: 1fr;
        row-gap: 8px !important;
    }
}

@media (max-width: 360px) {
    body.itn-secondary-page .shop-products-grid,
    body.itn-secondary-page .checkout-delivery-choice {
        grid-template-columns: 1fr;
    }
}
