/* ==========================================
   1. RESET GLOBALE & TIPOGRAFIA (ARIAL)
   ========================================== */
body, html {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
    color: #111111;
    background-color: #ffffff !important;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
}

/* ==========================================
   2. HEADER, LOGO & MENU
   ========================================== */
.site-header, 
header {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px 20px 20px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    box-sizing: border-box !important;
}

/* Logo spinto a SINISTRA e Non Cliccabile */
.site-header img,
.custom-logo,
header img,
.site-branding,
.custom-logo-link {
    order: 1 !important;
    margin-right: auto !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.site-header img,
.custom-logo,
header img {
    max-width: 82px !important;
    height: auto !important;
    display: block;
    opacity: 0.8;
}

.site-logo a, 
.custom-logo-link,
header .logo a {
    pointer-events: none !important;
    cursor: default !important;
}

/* Menu spinto a DESTRA */
.main-navigation,
header nav,
.site-header nav {
    order: 2 !important;
    margin-left: auto !important;
    margin-right: 0 !important;
}

.main-navigation ul,
header nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 25px;
}

/* Base per tutte le voci del menu */
.main-navigation li a,
header nav li a,
nav ul li a {
    color: #777777 !important;
    text-decoration: none;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    transition: color 0.2s ease;
}

.main-navigation li a:hover,
header nav li a:hover,
nav ul li a:hover {
    color: #111111 !important;
}

/* PAGINA ATTIVA IN GRASSETTO (Copre Homepage, Pagine standard, Categorie e Archivi) */
.main-navigation li.current-menu-item > a,
.main-navigation li.current_page_item > a,
.main-navigation li.current-menu-parent > a,
.main-navigation li.current_page_parent > a,
.main-navigation li.current-menu-ancestor > a,
header nav li.current-menu-item > a,
header nav li.current_page_item > a,
header nav li.current_page_parent > a,
header nav li.current-menu-ancestor > a,
nav li.current-menu-item > a,
nav li.current_page_item > a,
nav li.current_page_parent > a {
    font-weight: 800 !important;
    color: #000000 !important;
}

/* ==========================================
   3. STRUTTURA PAGINE & CONTENUTI TEXT
   ========================================== */
.single-page-content,
.page,
.site-content,
.entry-content,
.type-page {
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 20px !important; /* Spazio extra sopra i testi */
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-bottom: 120px !important;
    box-sizing: border-box !important;
}

/* NESSUN TITOLO PAGINA (NASCOSTO OVUNQUE) */
.page-title, 
h1.page-title,
h1.wp-block-post-title,
.entry-title {
    display: none !important;
}

/* Paragrafi compatti e minimali */
.single-page-content p,
.entry-content p,
.wp-block-paragraph {
    margin-top: 0 !important;
    margin-bottom: 2px !important;
    line-height: 1.3 !important;
    font-size: 14px;
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
}

/* ==========================================
   4. GRIGLIA PROGETTI & OVERLAY HOVER
   ========================================== */
.projects-container,
.blog,
.archive {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px 80px 20px !important;
    box-sizing: border-box !important;
}

.projects-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px 30px;
}

.project-item {
    display: flex;
    flex-direction: column;
}

.project-thumbnail {
    width: 100%;
    position: relative !important;
    overflow: hidden;
}

.project-card-link {
    display: block !important;
    position: relative !important;
    width: 100%;
    text-decoration: none !important;
    color: inherit !important;
}

/* IMMAGINI DESATURATE 50% */
.project-thumbnail img {
    width: 100%;
    height: 250px !important;
    aspect-ratio: 4 / 3;
    object-fit: cover !important;
    display: block;
    filter: grayscale(50%) !important;
    opacity: 0.95;
    transition: filter 0.4s ease, opacity 0.4s ease !important;
}

/* OVERLAY CENTRATO (NASCOSTO DI DEFAULT) */
.project-overlay {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.92) !important;
    
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    
    padding: 20px !important;
    box-sizing: border-box !important;
    
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    pointer-events: none;
}

/* CATEGORIA PROGETTO */
.project-overlay .project-category {
    font-size: 10px !important;
    text-transform: uppercase !important;
    color: #777777 !important;
    margin: 0 !important;
    letter-spacing: 0.12em !important;
}

/* TITOLO PROGETTO (NERO ASSOLUTO) */
.project-overlay .project-title,
.project-overlay h2,
.project-overlay h2 a,
.project-card-link .project-title {
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    color: #000000 !important;
    margin: 4px 0 0 0 !important;
    letter-spacing: 0.1em !important;
    text-decoration: none !important;
}

/* CONTENITORE METADATI */
.project-overlay .project-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    margin-top: 12px !important;
    gap: 4px !important;
}

/* TESTO LUOGO */
.project-overlay .meta-luogo,
.project-overlay .meta-luogo *,
.project-card-link .meta-luogo {
    font-size: 10px !important;
    font-weight: 50 !important;
    text-transform: uppercase !important;
    color: #000000 !important;
    letter-spacing: 0.12em !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}

/* ANNO/STATO */
.project-overlay .meta-info,
.project-overlay .meta-info * {
    font-size: 8px !important;
    text-transform: uppercase !important;
    color: #666666 !important;
    letter-spacing: 0.1em !important;
    text-decoration: none !important;
}

/* HOVER STATE OVERLAY */
.project-card-link:hover .project-overlay,
.project-item:hover .project-overlay {
    opacity: 1 !important;
    visibility: visible !important;
}

.project-card-link:hover img {
    filter: grayscale(0%) !important;
    opacity: 1;
}

/* ==========================================
   5. LIGHTBOX OVERLAY
   ========================================== */
.sl-navigation .sl-next,
.sl-navigation .sl-prev,
.simple-lightbox .sl-next,
.simple-lightbox .sl-prev,
[class*="sl-"] .sl-next,
[class*="sl-"] .sl-prev {
    width: 40px !important;
    height: 60px !important;
    background: rgba(0, 0, 0, 0.3) !important;
    border-radius: 0 !important;
    opacity: 0.5 !important;
    transition: all 0.25s ease !important;
}

.sl-navigation .sl-next:hover,
.sl-navigation .sl-prev:hover,
.simple-lightbox .sl-next:hover,
.simple-lightbox .sl-prev:hover {
    opacity: 1 !important;
    background: rgba(0, 0, 0, 0.7) !important;
}

.sl-caption, 
.sl-counter,
.simple-lightbox .sl-caption,
.simple-lightbox .sl-counter {
    font-family: Arial, sans-serif !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: #ffffff !important;
    opacity: 0.7 !important;
}

/* ==========================================
   6. GALLERIA IN PAGINA
   ========================================== */
.wp-block-gallery .swiper-pagination,
.wp-block-gallery .wp-block-gallery-navigation {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 20px !important;
}

.wp-block-gallery .swiper-pagination-bullet,
.wp-block-gallery .page-bullet {
    width: 6px !important;
    height: 6px !important;
    background-color: #cccccc !important;
    opacity: 1 !important;
    border-radius: 50% !important;
    border: none !important;
    transition: all 0.3s ease !important;
}

.wp-block-gallery .swiper-pagination-bullet-active,
.wp-block-gallery .page-bullet.is-active {
    background-color: #000000 !important;
    transform: scale(1.2) !important;
}

/* ==========================================
   7. FOOTER & RESPONSIVE
   ========================================== */
.site-footer, 
footer {
    max-width: 1200px;
    margin: 100px auto 40px auto !important;
    padding: 20px;
    text-align: center !important;
    clear: both;
}

.site-footer p, 
footer p,
.site-info {
    text-align: center !important;
    font-size: 11px !important;
    color: #999999 !important;
    letter-spacing: 0.5px;
    margin: 0 !important;
}

@media (max-width: 900px) {
    .projects-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .projects-grid { grid-template-columns: 1fr; }
    .site-header, header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 15px;
    }
}

/* ==========================================
   8. LIGHTBOX: SFONDO BIANCO & PULIZIA
   ========================================== */
.sl-overlay,
.simple-lightbox,
[class*="sl-overlay"],
.wp-lightbox-overlay {
    background-color: #ffffff !important;
    opacity: 0.98 !important;
}

.sl-caption,
.simple-lightbox .sl-caption,
.sl-wrapper .sl-caption {
    display: none !important;
}

.sl-close,
.simple-lightbox .sl-close,
.sl-wrapper .sl-close {
    color: #000000 !important;
}

.sl-navigation .sl-next::after,
.sl-navigation .sl-prev::after,
.simple-lightbox .sl-next::after,
.simple-lightbox .sl-prev::after {
    color: #000000 !important;
}

.sl-counter,
.simple-lightbox .sl-counter {
    color: #888888 !important;
    font-size: 10px !important;
    font-family: Arial, sans-serif !important;
}

.wp-lightbox-overlay,
.wp-lightbox-overlay.active {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

.wp-lightbox-overlay .wp-lightbox-overlay__bg {
    background-color: #ffffff !important;
    opacity: 1 !important;
}

.wp-lightbox-overlay figcaption,
.wp-lightbox-overlay .wp-element-caption,
.wp-lightbox-overlay .lightbox-image-title {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
}

.wp-lightbox-overlay .close-button,
.wp-lightbox-overlay button {
    color: #000000 !important;
    fill: #000000 !important;
}

.wp-lightbox-overlay .close-button svg,
.wp-lightbox-overlay button svg {
    fill: #000000 !important;
    stroke: #000000 !important;
}

[class*="lightbox"],
[class*="overlay"],
[class*="modal"],
[id*="lightbox"],
[id*="overlay"],
.sl-overlay,
.mfp-bg,
.fancybox-bg,
.glightbox-container {
    background-color: #ffffff !important;
    background: #ffffff !important;
    opacity: 1 !important;
}

[class*="lightbox"] [class*="caption"],
[class*="lightbox"] [class*="title"],
[class*="lightbox"] [class*="description"],
[class*="lightbox"] figcaption,
[class*="lightbox"] p,
.sl-caption,
.mfp-title,
.fancybox-caption,
.gslide-description {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

[class*="lightbox"] [class*="close"],
[class*="lightbox"] [class*="next"],
[class*="lightbox"] [class*="prev"],
.mfp-close,
.fancybox-button {
    color: #000000 !important;
    fill: #000000 !important;
}

[class*="lightbox"] img,
[class*="overlay"] img,
[class*="modal"] img,
.sl-image img,
.mfp-img,
.fancybox-image,
.gslide-image img {
    max-width: 85vw !important;
    max-height: 85vh !important;
    object-fit: contain !important;
}

/* ==========================================
   9. ALINEAMENTO TESTI & LINK MAILTO
   ========================================== */
.page .entry-content,
.page .entry-content p,
.page .entry-content div,
.wp-block-group,
.wp-block-column,
.wp-block-columns {
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
}

.entry-content p {
    text-indent: 0 !important;
}

.entry-content a[href^="mailto:"] {
    color: #111111 !important;
    text-decoration: none !important;
    transition: opacity 0.2s ease;
}

.entry-content a[href^="mailto:"]:hover {
    opacity: 0.6;
}

/* Interlinea e spaziatura maggiorata ESCLUSIVAMENTE per la pagina Studio */
body.page-slug-studio .entry-content p,
body.page-id-46 .entry-content p {
    line-height: 1.7 !important;
    margin-bottom: 16px !important;
}