/* =============================================================
   main.css – Design system globale Accanto
   ============================================================= */

/* 1. CSS Custom Properties */
:root {
    --ac-primary:        #ffa647;
    --ac-primary-hover:  #f09030;
    --ac-primary-fg:     #ffffff;
    --ac-green:          #8fd0b2;
    --ac-bg:             #ffffff;
    --ac-fg:             #0a0a0a;
    --ac-muted:          #f8f8f8;
    --ac-muted-fg:       #6b7280;
    --ac-card:           #ffffff;
    --ac-card-alt:       #f8f6f2;
    --ac-border:         #e5e7eb;
    --ac-step-green-bg:  #effaf6;
    --ac-step-orange-bg: #fff4e6;
    --ac-check-green-bg: #d1fae5;
    --ac-check-green-fg: #059669;
    --ac-check-orange-bg:#fed7aa;
    --ac-check-orange-fg:#ea580c;
    --ac-font:           'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ac-font-mono:      'Geist Mono', ui-monospace, 'SFMono-Regular', 'Menlo', monospace;
    --ac-radius:         0.625rem;
    --ac-radius-lg:      1rem;
    --ac-radius-xl:      1.5rem;
    --ac-radius-2xl:     2rem;
    --ac-max-w:          1280px;
    --ac-shadow:         0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -1px rgba(0,0,0,0.05);
    --ac-shadow-lg:      0 10px 25px -5px rgba(0,0,0,0.10), 0 4px 10px -5px rgba(0,0,0,0.05);
    --ac-shadow-xl:      0 20px 50px -12px rgba(0,0,0,0.12);
}

/* 2. Reset & Base */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: var(--ac-font);
    background-color: var(--ac-bg);
    color: var(--ac-fg);
    -webkit-font-smoothing: antialiased;
    margin: 0; padding: 0;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }

/* Override Astra – rimosso display:none su header per usare header nativo Astra */
.ast-breadcrumbs-wrapper { display: none !important; }

/* Contiene l'overflow orizzontale dei marquee (.ac-reviews__track width:max-content ecc.)
   senza rompere position:sticky – overflow-x:clip non crea un scroll container.
   min-width:0 è necessario se .ast-container usa flexbox (impedisce che il flex item
   si espanda oltre il contenitore per accomodare figli width:max-content) */
.ac-site-main { overflow-x: clip; min-width: 0; width: 100%; }

/* 3. Layout */
.ac-container {
    width: 100%; max-width: var(--ac-max-w);
    margin: 0 auto; padding: 0 1.5rem;
}
@media (min-width:640px) { .ac-container { padding: 0 2rem; } }

.ac-section {
    width: 100%; max-width: var(--ac-max-w);
    margin: 0 auto; padding: 2rem 1.5rem;
}
@media (min-width:768px) { .ac-section { padding: 3rem 2rem; } }

.ac-grid-hero { display: grid; gap: 2.5rem; }
@media (min-width:1024px) { .ac-grid-hero { grid-template-columns: 1.1fr 0.9fr; align-items: center; } }

.ac-grid-2 { display: grid; gap: 3rem; }
@media (min-width:1024px) { .ac-grid-2 { grid-template-columns: 1fr 1fr; align-items: center; gap: 5rem; } }

.ac-grid-3 { display: grid; gap: 2rem; }
@media (min-width:768px) { .ac-grid-3 { grid-template-columns: repeat(3,1fr); } }

.ac-grid-4 { display: grid; gap: 2.5rem; }
@media (min-width:640px)  { .ac-grid-4 { grid-template-columns: repeat(2,1fr); } }
@media (min-width:1024px) { .ac-grid-4 { grid-template-columns: repeat(4,1fr); } }

/* 4. Typography */
.ac-hero-title { font-size: 2.25rem; font-weight: 600; letter-spacing: -0.025em; line-height: 1.15; margin: 1.25rem 0 0; }
@media (min-width:640px) { .ac-hero-title { font-size: 3rem; } }

.ac-section-title { font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; line-height: 1.2; color: var(--ac-fg); margin: 0; }
@media (min-width:640px) { .ac-section-title { font-size: 2.25rem; } }
.ac-section-title .ac-primary { color: var(--ac-primary); }

.ac-section-subtitle { margin-top: 1rem; font-size: 1.125rem; color: var(--ac-muted-fg); line-height: 1.6; }
.ac-section-header { text-align: center; max-width: 48rem; margin: 0 auto 3rem; }
.ac-text-primary { color: var(--ac-primary); }
.ac-text-green   { color: var(--ac-green); }
.ac-text-muted   { color: var(--ac-muted-fg); }
.ac-text-center  { text-align: center; }

/* 5. Badge/Eyebrow */
.ac-badge {
    display: inline-block; border-radius: 9999px;
    border: 1px solid var(--ac-border); background: var(--ac-card);
    padding: 0.25rem 0.875rem; font-size: 0.8125rem;
    font-weight: 600; color: var(--ac-green); text-decoration: none;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.ac-badge:hover { border-color: var(--ac-primary); color: var(--ac-primary); }
.ac-badge--active { background: var(--ac-primary); color: #1a1a1a; border-color: var(--ac-primary); }

/* 6. Buttons */
.ac-btn {
    display: inline-flex; align-items: center; justify-content: center;
    gap: 0.5rem; height: 3rem; padding: 0 2rem;
    border-radius: 9999px; background: var(--ac-primary); color: #fff;
    font-size: 1rem; font-weight: 600; border: none; cursor: pointer;
    text-decoration: none; transition: background 0.2s, box-shadow 0.2s, transform 0.15s;
    white-space: nowrap;
}
.ac-btn:hover { background: var(--ac-primary-hover); box-shadow: var(--ac-shadow-lg); transform: translateY(-1px); color: #fff; }
.ac-btn svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }

.ac-btn-sm {
    height: 2.25rem; padding: 0 1rem; font-size: 0.9375rem;
    border-radius: 9999px; background: var(--ac-primary); color: #fff;
    font-weight: 500; border: none; cursor: pointer;
    display: inline-flex; align-items: center; transition: background 0.2s;
    text-decoration: none;
}
.ac-btn-sm:hover { background: var(--ac-primary-hover); color: #fff; }

/* 7. Fade animation */
@keyframes ac-fadeIn { from { opacity:0; transform:translateY(1.25rem); } to { opacity:1; transform:translateY(0); } }
.ac-fade { opacity: 0; transform: translateY(1.25rem); transition: opacity 0.6s ease, transform 0.6s ease; }
.ac-fade.is-visible { opacity: 1; transform: translateY(0); }

/* 8. Marquee */
@keyframes ac-marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.ac-marquee { animation: ac-marquee 50s linear infinite; display: flex; width: max-content; }
.ac-marquee:hover { animation-play-state: paused; }

/* 9. Scrollbar hidden */
.ac-no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.ac-no-scrollbar::-webkit-scrollbar { display: none; }

/* 10. WhatsApp float */
.ac-wa-float { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 999; display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; background: #25d366; color: #fff; border-radius: 9999px; font-weight: 600; font-size: 0.875rem; box-shadow: var(--ac-shadow-lg); text-decoration: none; transition: transform 0.2s, box-shadow 0.2s; }
.ac-wa-float:hover { transform: translateY(-2px); box-shadow: var(--ac-shadow-xl); color: #fff; }
.ac-wa-float svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }

/* 13. Blog */
.ac-blog-archive { max-width: var(--ac-max-w); margin: 0 auto; padding: 3rem 1.5rem; }
@media (min-width:640px) { .ac-blog-archive { padding: 4rem 2rem; } }
.ac-blog-grid { display: grid; gap: 2rem; }
@media (min-width:640px)  { .ac-blog-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width:1024px) { .ac-blog-grid { grid-template-columns: repeat(3,1fr); } }
.ac-blog-card { background: var(--ac-card); border: 1px solid var(--ac-border); border-radius: var(--ac-radius-xl); overflow: hidden; transition: box-shadow 0.2s, transform 0.2s; }
.ac-blog-card:hover { box-shadow: var(--ac-shadow-lg); transform: translateY(-2px); }
.ac-blog-card__thumb img { width: 100%; height: 14rem; object-fit: cover; }
.ac-blog-card__body { padding: 1.25rem; }
.ac-blog-card__cat { font-size: 0.75rem; font-weight: 600; color: var(--ac-primary); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.5rem; }
.ac-blog-card__title { font-size: 1.0625rem; font-weight: 600; line-height: 1.4; color: var(--ac-fg); }
.ac-blog-card__title a:hover { color: var(--ac-primary); }
.ac-blog-card__excerpt { margin-top: 0.5rem; font-size: 0.875rem; color: var(--ac-muted-fg); line-height: 1.6; }
.ac-blog-card__meta { margin-top: 1rem; font-size: 0.75rem; color: var(--ac-muted-fg); display: flex; gap: 1rem; }
.ac-blog-pagination { margin-top: 3rem; display: flex; justify-content: center; gap: 0.5rem; flex-wrap: wrap; }
.ac-blog-pagination a,.ac-blog-pagination span { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: 9999px; font-size: 0.875rem; font-weight: 500; border: 1px solid var(--ac-border); color: var(--ac-fg); transition: all 0.15s; }
.ac-blog-pagination a:hover { background: var(--ac-primary); color: #fff; border-color: var(--ac-primary); }
.ac-blog-pagination .current { background: var(--ac-primary); color: #fff; border-color: var(--ac-primary); }
.ac-single-post { max-width: 48rem; margin: 0 auto; padding: 3rem 1.5rem; }
.ac-single-post h1 { font-size: 2rem; font-weight: 700; line-height: 1.2; }
.ac-single-post__meta { font-size: 0.875rem; color: var(--ac-muted-fg); margin: 0.75rem 0 2rem; }
.ac-single-post .entry-content { font-size: 1.0625rem; line-height: 1.8; }
.ac-single-post .entry-content h2 { font-size: 1.5rem; font-weight: 700; margin: 2rem 0 0.75rem; }
.ac-single-post .entry-content h3 { font-size: 1.25rem; font-weight: 600; margin: 1.5rem 0 0.5rem; }
.ac-single-post .entry-content p { margin-bottom: 1.25rem; }
.ac-single-post .entry-content a { color: var(--ac-primary); text-decoration: underline; }
.ac-single-post .entry-content blockquote { border-left: 3px solid var(--ac-primary); padding-left: 1rem; color: var(--ac-muted-fg); font-style: italic; margin: 1.5rem 0; }

/* 14. Legal */
.ac-legal { max-width: 52rem; margin: 0 auto; padding: 3rem 1.5rem; }
.ac-legal h1 { font-size: 2rem; font-weight: 700; margin-bottom: 0.5rem; }
.ac-legal .ac-legal__updated { font-size: 0.875rem; color: var(--ac-muted-fg); margin-bottom: 2.5rem; }
.ac-legal h2 { font-size: 1.25rem; font-weight: 600; margin: 2rem 0 0.5rem; }
.ac-legal p,.ac-legal li { font-size: 1rem; line-height: 1.8; }
.ac-legal ul,.ac-legal ol { padding-left: 1.5rem; margin-bottom: 1rem; }
.ac-legal a { color: var(--ac-primary); }

/* 15. Contact */
.ac-contact { max-width: 42rem; margin: 0 auto; padding: 3rem 1.5rem; }
.ac-contact h1 { font-size: 2rem; font-weight: 700; margin-bottom: 0.5rem; }
.ac-contact .ac-contact__intro { font-size: 1.125rem; color: var(--ac-muted-fg); margin-bottom: 2.5rem; }
.ac-contact .wpcf7-form p { margin-bottom: 1.25rem; }
.ac-contact .wpcf7-form label { font-size: 0.875rem; font-weight: 600; display: block; margin-bottom: 0.375rem; }
.ac-contact .wpcf7-form input[type="text"],
.ac-contact .wpcf7-form input[type="email"],
.ac-contact .wpcf7-form textarea,
.ac-contact .wpcf7-form select { width:100%; padding:0.75rem 1rem; border:1px solid var(--ac-border); border-radius:var(--ac-radius-lg); font-size:1rem; font-family:var(--ac-font); background:var(--ac-bg); color:var(--ac-fg); outline:none; transition:border-color 0.15s; }
.ac-contact .wpcf7-form input[type="text"]:focus,
.ac-contact .wpcf7-form input[type="email"]:focus,
.ac-contact .wpcf7-form textarea:focus { border-color:var(--ac-primary); }
.ac-contact .wpcf7-form input[type="submit"] { appearance:none; display:inline-flex; align-items:center; justify-content:center; height:2.75rem; padding:0 1.5rem; border-radius:9999px; background:var(--ac-primary); color:#fff; font-size:0.9375rem; font-weight:600; border:none; cursor:pointer; transition:background 0.2s; }
.ac-contact .wpcf7-form input[type="submit"]:hover { background:var(--ac-primary-hover); }

/* 16. Modal Wizard */
.ac-modal-overlay { display:none; position:fixed; inset:0; z-index:1000; background:rgba(0,0,0,0.5); backdrop-filter:blur(4px); align-items:center; justify-content:center; padding:1rem; }
.ac-modal-overlay.is-open { display:flex; }
.ac-modal-box { background:var(--ac-bg); border-radius:var(--ac-radius-2xl); width:100%; max-width:32rem; max-height:90vh; overflow-y:auto; padding:2rem; box-shadow:var(--ac-shadow-xl); position:relative; }
.ac-modal-close { position:absolute; top:1rem; right:1rem; width:2rem; height:2rem; display:flex; align-items:center; justify-content:center; border-radius:9999px; background:var(--ac-muted); border:none; cursor:pointer; color:var(--ac-muted-fg); transition:background 0.15s; }
.ac-modal-close:hover { background:var(--ac-border); }

/* 17. Blog — miglioramenti */
.ac-blog-grid--2col { grid-template-columns: repeat(2,1fr) !important; }
.ac-blog-card__thumb { display:block; overflow:hidden; }
.ac-blog-card__thumb img { transition:transform 0.3s ease; }
.ac-blog-card:hover .ac-blog-card__thumb img { transform:scale(1.04); }
.ac-blog-card__meta { display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap; margin-bottom:0.625rem; }
.ac-blog-card__meta time { font-size:0.75rem; color:var(--ac-muted-fg); }
.ac-blog-card__title { margin:0 0 0.5rem; font-size:1.0625rem; font-weight:700; line-height:1.35; }
.ac-blog-card__title a { color:var(--ac-fg); text-decoration:none; }
.ac-blog-card__title a:hover { color:var(--ac-primary); }
.ac-blog-card__excerpt { font-size:0.875rem; color:var(--ac-muted-fg); line-height:1.65; margin-bottom:1.25rem; }
.ac-blog-card__body { display:flex; flex-direction:column; height:100%; padding:1.25rem 1.5rem; }
.ac-blog-card__body .ac-btn-sm { margin-top:auto; align-self:flex-start; }

/* Pagina blog: hero e featured post */
.ac-blog-hero { background:var(--ac-bg-alt); padding:4rem 0 3rem; border-bottom:1px solid var(--ac-border); margin-bottom:3rem; }
.ac-blog-hero .ac-section-title { margin-bottom:0.5rem; }
.ac-blog-hero .ac-section-subtitle { color:var(--ac-muted-fg); }
.ac-blog-featured { margin-bottom:3rem; }
.ac-blog-featured .ac-blog-card { display:flex; flex-direction:row; max-height:22rem; }
.ac-blog-featured .ac-blog-card__thumb { flex:0 0 45%; }
.ac-blog-featured .ac-blog-card__thumb img { height:100%; object-fit:cover; }
.ac-blog-featured .ac-blog-card__title { font-size:1.5rem; }
@media (max-width:640px) { .ac-blog-featured .ac-blog-card { flex-direction:column; max-height:none; } }

/* Single post — tipografia articolo */
.ac-single-post__content { font-size:1.0625rem; line-height:1.8; color:var(--ac-fg); }
.ac-single-post__content h2 { font-size:1.5rem; font-weight:700; margin:2.5rem 0 0.75rem; padding-top:0.5rem; border-top:1px solid var(--ac-border); }
.ac-single-post__content h3 { font-size:1.25rem; font-weight:600; margin:2rem 0 0.5rem; }
.ac-single-post__content p { margin-bottom:1.375rem; }
.ac-single-post__content a { color:var(--ac-primary); text-decoration:underline; text-underline-offset:3px; }
.ac-single-post__content blockquote { border-left:3px solid var(--ac-primary); padding:0.5rem 1.25rem; color:var(--ac-muted-fg); font-style:italic; margin:2rem 0; background:var(--ac-bg-alt); border-radius:0 var(--ac-radius-lg) var(--ac-radius-lg) 0; }
.ac-single-post__content ul,.ac-single-post__content ol { padding-left:1.5rem; margin-bottom:1.25rem; }
.ac-single-post__content li { margin-bottom:0.375rem; line-height:1.7; }
.ac-single-post__content img { max-width:100%; height:auto; border-radius:var(--ac-radius-lg); margin:1.5rem 0; }
.ac-single-post__content code { font-family:var(--ac-font-mono); font-size:0.9em; background:var(--ac-bg-alt); padding:0.1em 0.4em; border-radius:0.25rem; }
.ac-post-navigation { display:flex; gap:1rem; flex-wrap:wrap; }
.ac-post-navigation a { font-size:0.9375rem; color:var(--ac-primary); text-decoration:none; }
.ac-post-navigation a:hover { text-decoration:underline; }

/* 18. Shortcode avanzati — stili condivisi */
/* FAQ accordion */
.ac-faq { display:flex; flex-direction:column; gap:0; border:1px solid var(--ac-border); border-radius:var(--ac-radius-xl); overflow:hidden; }
.ac-faq__item { border-bottom:1px solid var(--ac-border); }
.ac-faq__item:last-child { border-bottom:none; }
.ac-faq__question { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.125rem 1.5rem; font-size:1rem; font-weight:600; color:var(--ac-fg); background:transparent; border:none; cursor:pointer; text-align:left; transition:background 0.15s; font-family:var(--ac-font); }
.ac-faq__question:hover { background:var(--ac-bg-alt); }
.ac-faq__question[aria-expanded="true"] { color:var(--ac-primary); background:var(--ac-bg-alt); }
.ac-faq__icon { flex-shrink:0; font-size:1.25rem; font-weight:300; color:var(--ac-primary); transition:transform 0.2s; }
.ac-faq__answer { padding:0 1.5rem 1.25rem; font-size:0.9375rem; line-height:1.7; color:var(--ac-muted-fg); }
.ac-faq__answer p { margin:0 0 0.75rem; }
.ac-faq__answer p:last-child { margin-bottom:0; }

/* Blog preview (shortcode) */
.ac-blog-preview-wrap { padding:1rem 0; }

/* Testimonial */
.ac-testimonial { border-radius:var(--ac-radius-xl); }

/* Team grid */
.ac-team-card { background:var(--ac-card); border:1px solid var(--ac-border); border-radius:var(--ac-radius-xl); padding:2rem 1.5rem; text-align:center; transition:box-shadow 0.2s; }
.ac-team-card:hover { box-shadow:var(--ac-shadow-md); }

/* Stat row */
.ac-stat-row { border-radius:var(--ac-radius-2xl); }

/* Pagine legali (ac-legal) — corpo migliore */
.ac-legal > * + * { margin-top:1rem; }
.ac-legal h1 { font-size:clamp(1.75rem,3vw,2.5rem); font-weight:800; margin-bottom:0.25rem; }
.ac-legal h2 { font-size:1.25rem; font-weight:700; margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid var(--ac-border); }
.ac-legal p,.ac-legal li { font-size:1rem; line-height:1.8; color:var(--ac-fg); }
.ac-legal strong { color:var(--ac-fg); }
.ac-legal a { color:var(--ac-primary); text-underline-offset:3px; }
.ac-legal ul,.ac-legal ol { padding-left:1.5rem; }
.ac-legal li { margin-bottom:0.5rem; }

/* Pagina contatti */
.ac-contact h1 { font-size:clamp(1.75rem,3vw,2.5rem); font-weight:800; }
.ac-contact h3 { font-size:1.125rem; font-weight:700; margin:0 0 0.75rem; }
.ac-contact p { line-height:1.7; margin-bottom:0.75rem; }

/* Astra override globali per coerenza */
.ast-separate-container .ast-article-post,.ast-separate-container .ast-article-single { padding:0 !important; box-shadow:none !important; }
.entry-thumbnail img { border-radius:var(--ac-radius-xl); }

