/**
 * aa-detail-grid.css — Layout auto-contenuto per la vista dettaglio.
 *
 * Dopo la migrazione dal vecchio template (che forniva Bootstrap globale), la pagina
 * dettaglio usava classi Bootstrap senza che il CSS fosse caricato. Qui ricostruiamo
 * SOLO le utility effettivamente usate in tmpl/detail.php, senza librerie esterne e
 * senza web font. Tutto è scoped sotto ".aa-immersive-container" per non impattare il
 * resto del template (anti-conflitto Gantry/tpl_architectadvisor).
 *
 * Breakpoints Bootstrap 5: md = 768px, lg = 992px. Spacer base = 1rem.
 *
 * Include anche il layout immersive (ex detail_immersive.css) in un unico foglio
 * bloccante: una richiesta HTTP in meno sul percorso critico mobile.
 */

/* ============================ GRIGLIA ============================ */
.aa-immersive-container .container-fluid {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
    box-sizing: border-box;
}
.aa-immersive-container .row {
    --aa-gx: 1.5rem;
    --aa-gy: 0rem;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--aa-gy));
    margin-right: calc(-0.5 * var(--aa-gx));
    margin-left: calc(-0.5 * var(--aa-gx));
}
.aa-immersive-container .row > * {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(0.5 * var(--aa-gx));
    padding-left: calc(0.5 * var(--aa-gx));
    margin-top: var(--aa-gy);
}
.aa-immersive-container .g-0 { --aa-gx: 0rem; --aa-gy: 0rem; }
.aa-immersive-container .g-3 { --aa-gx: 1rem;   --aa-gy: 1rem; }
.aa-immersive-container .g-4 { --aa-gx: 1.5rem; --aa-gy: 1.5rem; }
.aa-immersive-container .g-5 { --aa-gx: 3rem;   --aa-gy: 3rem; }

.aa-immersive-container .col { flex: 1 0 0%; }
.aa-immersive-container .col-12 { flex: 0 0 auto; width: 100%; }
/* row-cols-* impone la larghezza ai figli: serve flex:0 0 auto per battere .col (flex:1 0 0%) */
.aa-immersive-container .row-cols-1 > * { flex: 0 0 auto; width: 100%; }

@media (min-width: 768px) {
    .aa-immersive-container .col-md-4 { flex: 0 0 auto; width: 33.3333%; }
    .aa-immersive-container .col-md-6 { flex: 0 0 auto; width: 50%; }
    .aa-immersive-container .row-cols-md-2 > * { flex: 0 0 auto; width: 50%; }
}
@media (min-width: 992px) {
    .aa-immersive-container .col-lg-4 { flex: 0 0 auto; width: 33.3333%; }
    .aa-immersive-container .col-lg-8 { flex: 0 0 auto; width: 66.6667%; }
    .aa-immersive-container .row-cols-lg-3 > * { flex: 0 0 auto; width: 33.3333%; }
}

/* ============================ DISPLAY / FLEX ============================ */
.aa-immersive-container .d-none { display: none !important; }
.aa-immersive-container .d-flex { display: flex !important; }
.aa-immersive-container .d-grid { display: grid !important; }
.aa-immersive-container .d-inline-block { display: inline-block !important; }
.aa-immersive-container .flex-column { flex-direction: column !important; }
.aa-immersive-container .flex-wrap { flex-wrap: wrap !important; }
.aa-immersive-container .align-items-start { align-items: flex-start !important; }
.aa-immersive-container .align-items-center { align-items: center !important; }
.aa-immersive-container .align-items-stretch { align-items: stretch !important; }
.aa-immersive-container .justify-content-center { justify-content: center !important; }
.aa-immersive-container .justify-content-between { justify-content: space-between !important; }
.aa-immersive-container .gap-2 { gap: 0.5rem !important; }
.aa-immersive-container .gap-3 { gap: 1rem !important; }

@media (min-width: 768px) {
    .aa-immersive-container .d-md-none { display: none !important; }
    .aa-immersive-container .d-md-block { display: block !important; }
    .aa-immersive-container .d-md-flex { display: flex !important; }
}

/* ============================ SIZING / POSITION ============================ */
.aa-immersive-container .w-100 { width: 100% !important; }
.aa-immersive-container .h-100 { height: 100% !important; }
.aa-immersive-container .position-relative,
.aa-immersive-container .relative { position: relative !important; }
.aa-immersive-container .position-absolute { position: absolute !important; }
.aa-immersive-container .overflow-hidden { overflow: hidden !important; }
.aa-immersive-container .opacity-25 { opacity: 0.25 !important; }
.aa-immersive-container .opacity-75 { opacity: 0.75 !important; }

/* stretched-link: rende cliccabile l'intera card */
.aa-immersive-container .stretched-link::after {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: 1;
    content: "";
}

/* ============================ SPAZIATURE ============================ */
.aa-immersive-container .mt-auto { margin-top: auto !important; }
.aa-immersive-container .mb-0 { margin-bottom: 0 !important; }
.aa-immersive-container .mb-2 { margin-bottom: 0.5rem !important; }
.aa-immersive-container .mb-3 { margin-bottom: 1rem !important; }
.aa-immersive-container .mb-4 { margin-bottom: 1.5rem !important; }
.aa-immersive-container .mb-5 { margin-bottom: 3rem !important; }
.aa-immersive-container .mt-2 { margin-top: 0.5rem !important; }
.aa-immersive-container .mt-3 { margin-top: 1rem !important; }
.aa-immersive-container .mt-4 { margin-top: 1.5rem !important; }
.aa-immersive-container .mt-5 { margin-top: 3rem !important; }
.aa-immersive-container .mx-1 { margin-right: 0.25rem !important; margin-left: 0.25rem !important; }
.aa-immersive-container .me-1 { margin-right: 0.25rem !important; }
.aa-immersive-container .me-2 { margin-right: 0.5rem !important; }
.aa-immersive-container .me-3 { margin-right: 1rem !important; }
.aa-immersive-container .ms-1 { margin-left: 0.25rem !important; }
.aa-immersive-container .ms-2 { margin-left: 0.5rem !important; }

.aa-immersive-container .p-3 { padding: 1rem !important; }
.aa-immersive-container .p-4 { padding: 1.5rem !important; }
.aa-immersive-container .p-5 { padding: 3rem !important; }
.aa-immersive-container .pt-3 { padding-top: 1rem !important; }
.aa-immersive-container .pt-4 { padding-top: 1.5rem !important; }
.aa-immersive-container .pt-5 { padding-top: 3rem !important; }
.aa-immersive-container .pb-2 { padding-bottom: 0.5rem !important; }
.aa-immersive-container .pb-4 { padding-bottom: 1.5rem !important; }
.aa-immersive-container .pb-5 { padding-bottom: 3rem !important; }
.aa-immersive-container .px-3 { padding-right: 1rem !important; padding-left: 1rem !important; }
.aa-immersive-container .px-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; }
.aa-immersive-container .px-5 { padding-right: 3rem !important; padding-left: 3rem !important; }
.aa-immersive-container .py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.aa-immersive-container .py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.aa-immersive-container .py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.aa-immersive-container .py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

@media (min-width: 768px) {
    .aa-immersive-container .mb-md-0 { margin-bottom: 0 !important; }
    .aa-immersive-container .p-md-4 { padding: 1.5rem !important; }
}
@media (min-width: 992px) {
    .aa-immersive-container .px-lg-5 { padding-right: 3rem !important; padding-left: 3rem !important; }
}

/* ============================ TIPOGRAFIA ============================ */
.aa-immersive-container .display-4 { font-size: calc(1.475rem + 2.7vw); font-weight: 300; line-height: 1.2; }
.aa-immersive-container .display-5 { font-size: calc(1.425rem + 2.1vw); font-weight: 300; line-height: 1.2; }
.aa-immersive-container .display-6 { font-size: calc(1.375rem + 1.5vw); font-weight: 300; line-height: 1.2; }
@media (min-width: 1200px) {
    .aa-immersive-container .display-4 { font-size: 3.5rem; }
    .aa-immersive-container .display-5 { font-size: 3rem; }
    .aa-immersive-container .display-6 { font-size: 2.5rem; }
}
.aa-immersive-container .fs-4 { font-size: 1.5rem !important; }
.aa-immersive-container .fs-5 { font-size: 1.25rem !important; }
.aa-immersive-container .fs-6 { font-size: 1rem !important; }
.aa-immersive-container .h5,
.aa-immersive-container h5 { font-size: 1.25rem; }
.aa-immersive-container .fw-normal { font-weight: 400 !important; }
.aa-immersive-container .fw-semibold { font-weight: 600 !important; }
.aa-immersive-container .fw-bold { font-weight: 700 !important; }
.aa-immersive-container .lead { font-size: 1.25rem; font-weight: 300; }
.aa-immersive-container .small { font-size: 0.875em; }
.aa-immersive-container .text-center { text-align: center !important; }
.aa-immersive-container .text-start { text-align: left !important; }
.aa-immersive-container .text-uppercase { text-transform: uppercase !important; }
.aa-immersive-container .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aa-immersive-container .text-decoration-none { text-decoration: none !important; }
.aa-immersive-container .text-decoration-underline { text-decoration: underline !important; }
.aa-immersive-container .tracking-wide,
.aa-immersive-container .ls-1 { letter-spacing: 0.05em !important; }
.aa-immersive-container .list-unstyled { padding-left: 0; list-style: none; margin-top: 0; margin-bottom: 1rem; }

/* ============================ COLORI ============================ */
.aa-immersive-container .text-dark { color: #212529 !important; }
/* A11y: #6c757d su sfondi chiari (#f8f9fa) e' ~4.5:1 (bocciato da Lighthouse). #565e64 -> ~6.4:1, resta "muted". */
.aa-immersive-container .text-muted { color: #565e64 !important; }
.aa-immersive-container .text-primary { color: #0d6efd !important; }
.aa-immersive-container .text-warning { color: #ffc107 !important; }
.aa-immersive-container .text-white { color: #fff !important; }
.aa-immersive-container .text-white-50 { color: rgba(255, 255, 255, 0.5) !important; }
.aa-immersive-container .bg-white { background-color: #fff !important; }
.aa-immersive-container .bg-light { background-color: #f8f9fa !important; }
.aa-immersive-container .bg-dark { background-color: #212529 !important; }
.aa-immersive-container .bg-warning { background-color: #ffc107 !important; }
.aa-immersive-container .bg-secondary { background-color: #6c757d !important; }
.aa-immersive-container .bg-success { background-color: #198754 !important; }

/* ============================ BORDI / RAGGI / OMBRE ============================ */
.aa-immersive-container .border { border: 1px solid rgba(0, 0, 0, 0.12) !important; }
.aa-immersive-container .border-0 { border: 0 !important; }
.aa-immersive-container .border-light { border-color: rgba(0, 0, 0, 0.06) !important; }
.aa-immersive-container .border-top { border-top: 1px solid rgba(0, 0, 0, 0.12) !important; }
.aa-immersive-container .rounded-1 { border-radius: 0.375rem !important; }
.aa-immersive-container .rounded-4 { border-radius: 1rem !important; }
.aa-immersive-container .rounded-pill { border-radius: 50rem !important; }
.aa-immersive-container .shadow-sm { box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.075) !important; }
.aa-immersive-container .shadow-lg { box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; }

/* ============================ BADGE ============================ */
.aa-immersive-container .badge {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.375rem;
}

/* ============================ BOTTONI ============================ */
.aa-immersive-container .btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: 1px solid transparent;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    border-radius: 0.375rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.aa-immersive-container .btn-lg { padding: 0.75rem 1.25rem; font-size: 1.25rem; border-radius: 0.5rem; }
.aa-immersive-container .btn-dark { color: #fff; background-color: #212529; border-color: #212529; }
.aa-immersive-container .btn-dark:hover { color: #fff; background-color: #1c1f23; border-color: #1a1e21; }
.aa-immersive-container .btn-outline-secondary { color: #565e64; border-color: #6c757d; background-color: transparent; }
.aa-immersive-container .btn-outline-secondary:hover { color: #fff; background-color: #565e64; border-color: #565e64; }

/* ============================ CARD ============================ */
.aa-immersive-container .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.375rem;
}
.aa-immersive-container .card-body { flex: 1 1 auto; padding: 1rem; }
.aa-immersive-container .card-title { margin-bottom: 0.5rem; }

/* ============================ ALERT ============================ */
.aa-immersive-container .alert {
    position: relative;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.375rem;
    background-color: #f8f9fa;
    color: #212529;
}

/* ============================ FORM ============================ */
.aa-immersive-container .form-label { display: inline-block; margin-bottom: 0.5rem; }
.aa-immersive-container .form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    box-sizing: border-box;
    appearance: none;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.aa-immersive-container .form-control:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.aa-immersive-container .form-control-lg { padding: 0.5rem 1rem; font-size: 1.25rem; border-radius: 0.5rem; }
.aa-immersive-container .form-check { display: block; min-height: 1.5rem; padding-left: 1.5em; }
.aa-immersive-container .form-check-input { float: left; margin-left: -1.5em; width: 1em; height: 1em; margin-top: 0.25em; vertical-align: top; }
.aa-immersive-container .form-check-label { display: inline-block; }

/* ============================ ACCESSIBILITÀ ============================ */
.aa-immersive-container .visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================ CARD "STUDI CONSIGLIATI" (rifinitura elegante) ============================ */
.aa-immersive-container #section-recommended .card.aa-card-hover {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    border-radius: 0.75rem !important;
    overflow: hidden;
}
.aa-immersive-container #section-recommended .card.aa-card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12) !important;
}
.aa-immersive-container #section-recommended .aa-rec-card-badge {
    background-color: #f1f3f5 !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
}
.aa-immersive-container #section-recommended .card-title a { transition: color 0.2s ease; }
.aa-immersive-container #section-recommended .card.aa-card-hover:hover .card-title a { color: #0D2146 !important; }

/* ============================ ICONE SVG INLINE (sostituiscono Font Awesome) ============================ */
/* Le classi .fa-* esistenti vengono renderizzate come SVG via mask: nessuna libreria/web font,
 * l'icona eredita automaticamente il colore del testo (currentColor) → compatibile con text-white,
 * text-muted, ecc. Solo le icone effettivamente usate in detail.php sono mappate. */
.aa-immersive-container .fa,
.aa-immersive-container .fas,
.aa-immersive-container .far {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    background-color: currentColor;
    -webkit-mask: var(--aa-fa, none) center / contain no-repeat;
    mask: var(--aa-fa, none) center / contain no-repeat;
}
.aa-immersive-container .fa-2x { font-size: 2em; }

.aa-immersive-container .fa-star { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-star-half-alt { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5.354 5.119 7.538.792A.516.516 0 0 1 8 .5c.183 0 .366.097.465.292l2.184 4.327 4.898.696A.537.537 0 0 1 16 6.32a.548.548 0 0 1-.17.445l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256a.52.52 0 0 1-.146.05c-.342.06-.668-.254-.6-.642l.83-4.73L.173 6.765a.55.55 0 0 1-.172-.403.58.58 0 0 1 .085-.302.513.513 0 0 1 .37-.245l4.898-.696zM8 12.027a.5.5 0 0 1 .232.056l3.686 1.894-.694-3.957a.565.565 0 0 1 .162-.505l2.907-2.77-4.052-.576a.525.525 0 0 1-.393-.288L8.001 2.223 8 2.226z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-lock { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-map-marker-alt,
.aa-immersive-container .fa-map-pin { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10zm0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-info-circle { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-check-circle { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-images { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M.002 3a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-12a2 2 0 0 1-2-2V3zm1 9v1a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V9.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12zm5-6.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-folder-open { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M9.828 3h3.982a2 2 0 0 1 1.992 2.181l-.637 7A2 2 0 0 1 13.174 14H2.826a2 2 0 0 1-1.991-1.819l-.637-7a1.99 1.99 0 0 1 .342-1.31L.5 3a2 2 0 0 1 2-2h3.672a2 2 0 0 1 1.414.586l.828.828A2 2 0 0 0 9.828 3zm-8.322.12C1.72 3.042 1.95 3 2.19 3h5.396l-.707-.707A1 1 0 0 0 6.172 2H2.5a1 1 0 0 0-1 .981l.006.139z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-shield-alt { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5.338 1.59a61.44 61.44 0 0 0-2.837.856.481.481 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.725 10.725 0 0 0 2.287 2.233c.346.244.652.42.893.533.12.057.218.095.293.118a.55.55 0 0 0 .101.025.615.615 0 0 0 .1-.025c.076-.023.174-.061.294-.118.24-.113.547-.29.893-.533a10.726 10.726 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-clock { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-chevron-right { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E"); }
.aa-immersive-container .fa-arrow-left { --aa-fa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z'/%3E%3C/svg%3E"); }

/* ============================ LAYOUT IMMERSIVE (ex detail_immersive.css) ============================ */
/**
 * Layout Immersive V8.2 - Centered Nav & Smart Recommender
 *
 * Solo stack di sistema (niente Google Fonts dal modulo). Questo foglio è caricato solo
 * sulla vista dettaglio: body/h1–h5 ripristinati come layout originale (evita differenze
 * di paint rispetto al container-only).
 */

:root {
    --aa-font-serif: Georgia, 'Palatino Linotype', 'Book Antiqua', Palatino, 'Times New Roman', serif;
    --aa-font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --aa-dark: #111111;
    --aa-light: #f8f9fa;
    --aa-muted: #6c757d;
    --aa-border-color: rgba(0,0,0,0.08);
    --hero-height: 700px;
}

body { font-family: var(--aa-font-sans); color: var(--aa-dark); overflow-x: hidden; }
h1, h2, h3, h4, h5, .font-serif { font-family: var(--aa-font-serif); }
.ls-1 { letter-spacing: 1px; }
.fw-medium { font-weight: 500; }

/* HERO */
.aa-hero {
    position: relative; height: var(--hero-height);
    background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important;
    display: flex; align-items: flex-end; padding-bottom: 80px;
}
.aa-hero-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
    background: linear-gradient(to bottom, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
}
.aa-hero-content { position: relative; z-index: 2; width: 100%; }

.aa-glass-card {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 20px;
    padding: 3.5rem; box-shadow: 0 30px 60px rgba(0,0,0,0.1);
    display: flex; align-items: center; justify-content: space-between; margin-bottom: -100px;
}
.aa-avatar { width: 160px; height: 160px; border-radius: 50%; object-fit: cover; border: 4px solid rgba(255,255,255,0.8); box-shadow: 0 10px 25px rgba(0,0,0,0.15); }
.aa-studio-name { font-size: 5rem; font-weight: 700; margin: 0 0 10px 0; line-height: 1; color: #000; text-shadow: 0 0 30px rgba(255,255,255,0.8); }
.aa-meta-location { font-size: 1.5rem; color: #111; font-weight: 500; text-shadow: 0 0 10px rgba(255,255,255,0.5); }
.aa-meta-rating { display: flex; align-items: center; margin-top: 15px; font-size: 1.2rem; }
.aa-btn-elegant { background: #000; border: none; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; transition: background-color 0.3s, transform 0.3s, box-shadow 0.3s; }
.aa-btn-elegant:hover { background: #333; transform: scale(1.05); box-shadow: 0 10px 30px rgba(0,0,0,0.3); }

/* STICKY NAV */
.aa-sticky-nav {
    position: relative;
    background: rgba(255,255,255,0.98); backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--aa-border-color); padding: 1.5rem 0;
    transition: box-shadow 0.3s ease;
    z-index: 1030;
}
.aa-sticky-nav.aa-fixed-active {
    position: fixed; top: 0; left: 0; width: 100%;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    animation: slideDown 0.3s ease forwards;
}
@keyframes slideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }

/* MENU CENTRATO PER EVITARE SIDEBAR */
.aa-nav-links {
    list-style: none; padding: 0; margin: 0; display: flex; gap: 4rem; font-size: 1.1rem;
    justify-content: center; /* CENTRATO */
}
.aa-nav-links a { text-decoration: none; color: var(--aa-muted); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; transition: color 0.2s; cursor: pointer; }
.aa-nav-links a:hover, .aa-nav-links a.active { color: #000; border-bottom: 2px solid #000; padding-bottom: 5px; }

/* CONTENT */
.aa-main-layout { padding-top: 160px; padding-bottom: 80px; }
.aa-section { margin-bottom: 8rem; scroll-margin-top: 160px; }
.aa-section-title { margin-bottom: 3rem; position: relative; padding-bottom: 1.5rem; color: #000; }
.aa-section-title::after { content:''; position:absolute; bottom:0; left:50%; transform: translateX(-50%); width: 80px; height: 3px; background: #000; }
#section-map .aa-section-title::after { left: 0; transform: none; }

/* PORTFOLIO */
.aa-portfolio-item-emotional {
    position: relative; border-radius: 16px; overflow: hidden; cursor: pointer; height: 500px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.5s ease, box-shadow 0.5s ease;
}
.aa-portfolio-item-emotional img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.2, 1, 0.3, 1); }
.aa-portfolio-overlay-emotional {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4);
    display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.5s ease; padding: 3rem;
}
.aa-project-title-emotional { color: #fff; transform: translateY(30px); transition: transform 0.5s ease; text-shadow: 0 5px 15px rgba(0,0,0,0.5); }
.aa-view-project-btn { display: inline-block; color: #fff; text-transform: uppercase; letter-spacing: 3px; border-bottom: 2px solid rgba(255,255,255,0.7); padding-bottom: 8px; opacity: 0; transform: translateY(30px); transition: transform 0.6s ease 0.1s, opacity 0.6s ease 0.1s; }
.aa-portfolio-item-emotional:hover img { transform: scale(1.1); }
.aa-portfolio-item-emotional:hover .aa-portfolio-overlay-emotional { opacity: 1; }
.aa-portfolio-item-emotional:hover .aa-project-title-emotional, .aa-portfolio-item-emotional:hover .aa-view-project-btn { transform: translateY(0); opacity: 1; }

/* FORM */
.aa-blurred-data { color: var(--aa-muted); font-family: monospace; background: #eee; padding: 4px 10px; border-radius: 6px; cursor: not-allowed; opacity: 0.7; }
.aa-quote-card-dark { background: #fff; }
.aa-force-white-text, .aa-force-white-text * { color: #ffffff !important; }
.form-control-lg { padding: 1.2rem 1.5rem; font-size: 1.1rem; }

/* MINI CARDS */
.aa-mini-card {
    background: #fff; border-radius: 12px; overflow: hidden; cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05); border: 1px solid rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease; height: 100%;
    display: flex; flex-direction: column;
}
.aa-mini-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0,0,0,0.15); }
.aa-mini-card-img-wrapper { height: 200px; overflow: hidden; position: relative; background: #eee; }
.aa-mini-card-img-wrapper img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.aa-mini-card:hover .aa-mini-card-img-wrapper img { transform: scale(1.05); }
.aa-mini-card-body { padding: 1.5rem; text-align: center; flex-grow: 1; display: flex; flex-direction: column; align-items: center; }
.aa-mini-title { font-family: var(--aa-font-serif); font-size: 1.4rem; font-weight: 700; margin-bottom: 0.5rem; color: #111; }
.aa-mini-rating { margin-bottom: 0.8rem; font-size: 0.9rem; }
.aa-mini-meta { color: #666; font-size: 0.95rem; font-weight: 500; margin-bottom: 1rem; }

/* MOBILE */
@media (max-width: 991px) {
    :root { --hero-height: 420px; }
    .aa-hero { align-items: center; padding-bottom: 48px; }
    .aa-glass-card {
        flex-direction: column; text-align: center; padding: 2rem; width: 100%; margin: -60px 0 40px 0; border-radius: 20px;
        background: rgba(255, 255, 255, 0.6);
    }
    .aa-profile-header { flex-direction: column; gap: 1rem; }
    .aa-studio-name { font-size: 3rem; }
    .aa-nav-links { gap: 2rem; font-size: 0.9rem; justify-content: flex-start; /* Su mobile left-align per lo scroll orizzontale */ }
    .aa-main-layout { padding-top: 40px; }
    .aa-portfolio-item-emotional { height: 350px; }
}

/* Mobile stretto: hero più bassa, testi in scala, contenuti a tutta larghezza */
@media (max-width: 767px) {
    :root { --hero-height: 260px; }
    .aa-hero { padding-bottom: 28px !important; align-items: center !important; }
    .aa-glass-card {
        margin: -40px 0 30px 0 !important;
        padding: 1rem !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    /* Hero: testi in scala, niente overflow (evita "Design" tagliato) */
    .aa-studio-name {
        font-size: 1.2rem !important;
        line-height: 1.25 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
    }
    .aa-meta-location { font-size: 0.9rem !important; }
    .aa-meta-rating { font-size: 0.85rem !important; margin-top: 8px !important; }
    .aa-unclaimed-text { font-size: 0.75rem !important; padding: 0.5rem !important; line-height: 1.4 !important; }
    .aa-unclaimed-badge { font-size: 0.6rem !important; padding: 0.3em 0.6em !important; }
    .aa-avatar { width: 72px !important; height: 72px !important; }
    .aa-main-layout { padding-left: 12px !important; padding-right: 12px !important; padding-top: 30px !important; }
    .aa-hero-content.container-fluid { padding-left: 12px !important; padding-right: 12px !important; }
    .aa-sticky-nav .container-fluid { padding-left: 12px !important; padding-right: 12px !important; }
    .aa-section { margin-bottom: 3rem; }
    /* Mappa: niente spazi esagerati (usa solo il padding del container 12px) */
    #section-map { padding-left: 0 !important; padding-right: 0 !important; }
    #section-map .row { margin-left: 0 !important; margin-right: 0 !important; }
    #aa-map-container { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
    /* Altri architetti: card a tutta larghezza (padding solo dal container) */
    #section-recommended { padding-left: 0 !important; padding-right: 0 !important; }
    #section-recommended .row { margin-left: 0 !important; margin-right: 0 !important; }
    #section-recommended .col { padding-left: 0 !important; padding-right: 0 !important; }
}