/* Grafica SG adattata ai componenti Bootstrap del CMS. */
:root { --sg-navy: #00283a; --sg-lime: #92c500; --sg-green: #6f9600; --sg-header-edge-height: 5px; }
body { margin: 0; color: #59666c; font-family: 'Open Sans', Arial, sans-serif; padding: 0; }
.container { max-width: 1140px; }
a { color: var(--sg-green); }
a:hover { color: #506d00; }
.sg-header { position: sticky; top: calc(-1 * var(--sg-topbar-height, 30px)); z-index: 1030; background: transparent; border-bottom: 0; transition: top .2s ease; }
.sg-header::after { content: ''; position: absolute; top: 100%; left: 0; right: 0; height: var(--sg-header-edge-height); background: rgba(40, 90, 115, .6); pointer-events: none; }
/* Con una gallery iniziale, la testata si sovrappone alla foto senza riservare spazio. */
.sg-header:has(+ .sg-main > #myCarousel) { position: fixed; top: 0; left: 0; right: 0; transition: top .2s ease; }
.sg-header.sg-scrolled:has(+ .sg-main > #myCarousel) { top: calc(-1 * var(--sg-topbar-height, 30px)); }
.sg-header.sg-show-topbar, .sg-header.sg-show-topbar:has(+ .sg-main > #myCarousel) { top: 0; }
.sg-main:has(> #myCarousel) { padding-top: var(--sg-topbar-height, 30px); }
.sg-header #topbar { font-size: .8rem; background: #012232; border-bottom: 0; }
.sg-header #topbar a { color: #fff; text-decoration: none; }
.sg-topbar-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1.5rem; }
.sg-topbar-contacts, .sg-topbar-account { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem 1rem; color: #fff; }
.sg-topbar-contacts { flex: 1; min-width: 0; }
.sg-topbar-contacts > * { overflow-wrap: anywhere; }
.sg-topbar-account { margin-left: auto; }
.sg-header #topbar .sg-topbar-account > a { font-size: 1rem; font-weight: 600; }
.sg-header #topbarx a { float: none; white-space: nowrap; }
.sg-header #topbar a:hover { color: var(--sg-lime); }
.sg-header #topbar .bi-key { font-size: 1.5rem; line-height: 1; vertical-align: middle; }
.sg-topbar-mobile-access { display: none; }
.sg-account-dropdown { position: relative; }
.sg-account-dropdown summary { display: flex; align-items: center; gap: .35rem; cursor: pointer; list-style: none; font-size: 1rem; font-weight: 600; }
.sg-account-dropdown summary::-webkit-details-marker { display: none; }
.sg-account-dropdown summary:hover { color: var(--sg-lime); }
.sg-account-dropdown-panel { position: absolute; top: 100%; right: 0; z-index: 1050; min-width: 220px; max-width: calc(100vw - 32px); padding: .8rem 1rem; background: #012232; border-top: 2px solid var(--sg-lime); box-shadow: 0 8px 20px #0004; }
.sg-header #topbarx .sg-account-dropdown-panel a { display: block; white-space: normal; overflow-wrap: anywhere; font-size: .9rem; }
.sg-header .navbar { background: rgba(20, 60, 78, .75); padding: 0; }
.sg-header .navbar-brand { display: flex; align-items: center; gap: .75rem; color: #fff; white-space: normal; max-width: 45%; font-weight: 300; text-transform: uppercase; }
.sg-header .navbar-brand img { width: auto; height: auto; max-width: none; max-height: none; flex-shrink: 0; }
.sg-header .nav-link { padding: 2rem 1.1rem; border-top: 2px solid transparent; color: #fff; font-size: .9rem; font-weight: 600; text-transform: uppercase; }
.sg-header .navbar-toggler { border-color: rgba(255, 255, 255, .6); }
.sg-header .navbar-toggler-icon { filter: none; }
.sg-header .nav-link, .sg-header .navbar { transition: padding .2s ease; }
/* Solo la testata fixed può cambiare altezza senza spostare il contenuto e lo scroll. */
@media (min-width: 992px) {
 .sg-header.sg-scrolled:has(+ .sg-main > #myCarousel) .nav-link { padding-top: .75rem; padding-bottom: .75rem; }
 .sg-header.sg-scrolled:has(+ .sg-main > #myCarousel) .navbar { padding-top: .2rem; padding-bottom: .2rem; }
}
.sg-header .nav-link:hover, .sg-header .nav-link:focus, .sg-header .nav-link.active, .sg-header .nav-link.show { color: var(--sg-lime); border-top-color: var(--sg-lime); }
.sg-header .dropdown-menu { background: var(--sg-navy); border: 0; border-radius: 0; }
.sg-header .dropdown-item { color: #fff; padding: .75rem 1.2rem; }
.sg-header .dropdown-item:hover, .sg-header .dropdown-item:focus { background: #012232; color: var(--sg-lime); }
.sg-header .dropdown-item.active { background: #012232; color: var(--sg-lime); }
#myCarousel { margin: 0; background: var(--sg-navy); }
#myCarousel .sg-slide-caption { position: absolute; left: 12%; right: 12%; bottom: 18%; text-align: center; pointer-events: none; }
#myCarousel .sg-slide-caption span { display: inline-block; max-width: 100%; padding: .3em .65em; background: rgba(146, 197, 0, .8); color: #fff; font-size: clamp(1.15rem, 3vw, 2.6rem); font-weight: 400; line-height: 1.3; overflow-wrap: anywhere; }
#myCarousel .carousel-item img { width: auto; max-width: 100%; height: auto; min-height: 0; max-height: none; margin-inline: auto; }
@media (min-width: 992px) {
 #myCarousel .carousel-item img.sg-home-slide-image { width: min(100%, var(--sg-image-width)); height: calc(min(100vw, var(--sg-image-width)) * var(--sg-image-ratio) * .92); object-fit: cover; }
}
#myCarousel .carousel-control-prev, #myCarousel .carousel-control-next { opacity: .35; transition: opacity .2s ease; }
#myCarousel .carousel-control-prev-icon, #myCarousel .carousel-control-next-icon { width: 30px; height: 30px; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .8)); }
#myCarousel .carousel-control-prev:is(:hover, :focus-visible), #myCarousel .carousel-control-next:is(:hover, :focus-visible) { opacity: 1; }
#myCarousel .carousel-indicators { bottom: 0; margin: 0; padding: 12px; background: rgba(0,40,58,.53); }
#myCarousel .carousel-indicators button { box-sizing: border-box; width: 16px; height: 16px; border-radius: 50%; border: 3px solid #71848b; background: transparent; opacity: 1; }
#myCarousel .carousel-indicators button.active { background: var(--sg-lime); }
.carousel-draggable { cursor: grab; touch-action: pan-y; }
.carousel-draggable:active { cursor: grabbing; }
#first-block p { color: #bdcbd1; font-size: 1rem; }
.sg-inline-button { display: inline-block !important; text-decoration: none; }
#features { box-shadow: none; }
.sg-feature { display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.sg-feature-image { width: 110px; height: 110px; border-radius: 50%; object-fit: cover; border: 5px solid var(--sg-lime); }
.sg-feature .color-btn { margin-top: auto; text-decoration: none; }
.sg-feature-text { padding-bottom: 1rem; }
.sg-studio { background: var(--sg-navy); scroll-margin-top: 150px; }
.sg-studio-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.sg-studio article { padding: clamp(1.5rem, 4vw, 4rem); }
.sg-studio article h2 { font-size: clamp(2.5rem, 4vw, 4rem); }
.sg-studio article p { margin-bottom: 1rem; }
.sg-studio .sg-studio-text p { font-size: 1rem !important; line-height: 1.7; }
.sg-studio .sg-studio-text p span { font-size: inherit !important; }
.sg-studio .about-us-icons { display: flex; align-items: flex-start; gap: 1rem; }
.sg-studio .about-us-icons > i { float: none; flex: 0 0 60px; margin-right: 0; }
.sg-studio .about-us-icons > p { min-width: 0; margin-bottom: 0; }
/* Riquadri di sg_old/features.php, con alternanza assegnata dal ciclo PHP del menu. */
.sg-menu-features .sg-menu-feature { display: flex; flex-direction: column; height: 13em; padding: 10px 24px; color: #fff; -webkit-transition: background-color 1.5s ease; transition: background-color 1.5s ease; }
.sg-menu-features div.xxx { background-color: #053F59; }
.sg-menu-features div.xxx1 { background-color: #074B6A; }
.sg-menu-features div.xxx:hover, .sg-menu-features div.xxx1:hover { background-color: #769F00; opacity: 1; }
.sg-menu-features :is(div.xxx, div.xxx1) :is(h2, h3) a { color: #fff; }
.sg-main #op { padding-top: 120px; }
.sg-menu-feature h2 { font-size: 1.35rem; font-weight: 600; margin-bottom: 1rem; }
.sg-menu-feature h2 i { display: inline-block; margin-right: .4rem; font-size: 1.6rem; vertical-align: middle; }
.sg-menu-feature a, .sg-menu-feature a:visited { color: #fff; text-decoration: none; }
.sg-menu-feature p { font-size: .95rem; line-height: 1.6; margin-bottom: 1.5rem; }
.sg-menu-feature .white-btn { margin-top: auto; text-align: center; }
.sg-menu-feature h2 a:hover, .sg-menu-feature p a:hover { text-decoration: underline; }
.sg-page-section { padding: 3rem 0 1.5rem; background: #fff; }
.sg-page-title { text-align: center; color: var(--sg-navy); font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 700; margin-bottom: 0; }
.sg-page-title:after { content: ''; display: block; width: 100px; height: 3px; background: var(--sg-lime); margin: 1rem auto; }
.sg-content { overflow-wrap: anywhere; }
.sg-documents { max-width: 1000px; margin: 2rem auto; padding: clamp(1rem, 3vw, 2rem); border: 1px solid #dce5e9; border-top: 3px solid var(--sg-lime); border-radius: 8px; background: #fff; }
.sg-documents-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.sg-documents-folder > summary { cursor: pointer; list-style: none; }
.sg-documents-folder > summary::-webkit-details-marker { display: none; }
.sg-folder-toggle { flex-shrink: 0; color: var(--sg-green); font-size: 1.8rem; line-height: 1; }
.sg-folder-toggle::before { content: '+'; }
.sg-documents-folder[open] > summary .sg-folder-toggle::before { content: '−'; }
.sg-documents-eyebrow { color: #59666c; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.sg-documents-heading h2 { margin: .3rem 0; color: var(--sg-navy); font-size: clamp(1.3rem, 3vw, 2rem); overflow-wrap: anywhere; }
.sg-documents-logout { flex-shrink: 0; padding: .5rem .8rem; border: 1px solid #bdcbd1; border-radius: 4px; text-decoration: none; }
.sg-documents-count { margin: 1rem 0; color: #59666c; font-size: .9rem; }
.sg-documents-list { list-style: none; padding: 0; margin: 0; }
.sg-document-row { display: flex; align-items: center; gap: 1rem; padding: 1rem 0; border-top: 1px solid #e3eaed; }
.sg-document-type { flex: 0 0 3.5rem; padding: .8rem .25rem; text-align: center; background: #edf3e2; color: #506d00; border-radius: 4px; font-size: .75rem; font-weight: 700; overflow-wrap: anywhere; }
.sg-document-info { flex: 1; min-width: 0; }
.sg-document-download { flex-shrink: 0; padding: .5rem .75rem; border: 1px solid var(--sg-green); border-radius: 4px; text-decoration: none; font-size: .85rem; }
.sg-document-download:hover { background: var(--sg-green); color: #fff; }
.sg-document-info a { color: var(--sg-navy); font-weight: 600; overflow-wrap: anywhere; }
.sg-document-size { display: block; margin-top: .3rem; color: #59666c; font-size: .85rem; }
.sg-document-delete { color: #a52c2c; font-size: .85rem; }
.sg-documents-empty { margin: 1.5rem 0 0; padding: 1rem; background: #f5f8f9; border-radius: 4px; }
@media (max-width: 575.98px) { .sg-document-row { gap: .65rem; flex-wrap: wrap; } .sg-document-delete { margin-left: 4.15rem; } }
.sg-communication-form, .sg-communication-success { max-width: 860px; margin: 0 auto; padding: clamp(1.25rem, 4vw, 3rem); background: #f5f8f9; border: 1px solid #dce5e9; border-top: 3px solid var(--sg-lime); border-radius: 8px; }
.sg-communication-intro { margin: 0 0 2rem; color: #59666c; line-height: 1.6; }
.sg-communication-form .form-label { color: var(--sg-navy); font-weight: 600; margin-bottom: .5rem; }
.sg-communication-form .form-control { width: 100%; padding: .85rem 1rem; background: #fff; border: 1px solid #bdcbd1; border-radius: 4px; color: var(--sg-navy); font: inherit; }
.sg-communication-form .form-control:focus { border-color: var(--sg-green); box-shadow: 0 0 0 .2rem #92c50025; }
.sg-communication-form textarea { resize: vertical; min-height: 160px; }
.sg-communication-actions { display: flex; justify-content: flex-end; }
.sg-communication-submit { padding: .85rem 1.5rem; border: 0; border-radius: 4px; background: var(--sg-green); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.sg-communication-submit:hover { background: #506d00; }
.sg-communication-success h2 { color: var(--sg-navy); font-size: 1.5rem; }
@media (max-width: 575.98px) { .sg-communication-submit { width: 100%; } }
.sg-content img { max-width: 100%; height: auto; }
.sg-content .sg-page-image { float: right; max-width: 45%; margin: 0 0 1.5rem 1.5rem; }
@media (max-width: 575.98px) { .sg-content .sg-page-image { float: none; display: block; max-width: 100%; margin: 0 auto 1.5rem; } }
.sg-content article :is(h1,h2,h3,h4,h5,h6,p,li) { color: inherit; opacity: 1; }
.sg-content article h2 { font-size: 2rem; letter-spacing: normal; line-height: 1.2; }
.sg-cta { background: var(--sg-green); padding: 4rem 1rem; text-align: center; color: #fff; }
.sg-cta h2 { color: #fff; font-size: 2rem; font-weight: 300; }
.sg-cta .white-btn { margin-top: 1rem; }
#contact { box-shadow: none; }
#contact .section-title { color: var(--sg-navy); font-size: clamp(2rem, 4vw, 3.8rem); }
#contact .form-control { padding: .8rem; border: 1px solid #cbd3d7; }
#contact .form-control:focus { border-color: var(--sg-green); box-shadow: 0 0 0 .2rem #92c50025; }
#contact button:disabled { opacity: .45; cursor: not-allowed; }
.sg-footer-wrap { background: var(--sg-navy); }
.sg-footer { color: #bac8ce; padding: 3.5rem 0 1.5rem; }
.sg-footer-column { padding-top: .5rem; padding-bottom: 1.5rem; }
.sg-footer h4 { color: #fff; font-size: .85rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 1.25rem; }
.sg-footer h4::before { content: ''; display: inline-block; width: 20px; height: 2px; margin-right: .75rem; background: var(--sg-lime); vertical-align: middle; }
.sg-footer-mission { padding-right: clamp(1rem, 4vw, 3.5rem); }
.sg-footer-column { line-height: 1.8; overflow-wrap: anywhere; }
.sg-footer :is(p,a,a:visited) { color: #bac8ce; font-size: .9rem; }
/* La missione del CMS può contenere colori inline su paragrafi e span. */
.sg-footer .sg-footer-mission p,
.sg-footer .sg-footer-mission p * { color: #e1e9ed !important; }
.sg-footer .sg-footer-mission p { font-size: .95rem; line-height: 1.8; }
.sg-footer a:hover { color: var(--sg-lime); }
.sg-footer a { text-decoration: none; transition: color .2s; }
.sg-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.sg-footer ul { padding-left: 0; list-style: none; }
.sg-footer li { margin-bottom: .6rem; }
.sg-footer-bottom { border-top: 1px solid #ffffff1f; margin-top: 1rem; padding-top: 1.5rem; font-size: .8rem; }
.sg-footer-bottom p { margin-bottom: 0; font-size: .8rem; }
.sg-footer .sg-footer-credit, .sg-footer .sg-footer-credit * { font-size: .75rem; line-height: 1.5; color: #9eafb7; }
.sg-footer-credit { max-width: 100%; overflow-wrap: anywhere; }
.sg-footer .sg-footer-credit ul { margin: 0; padding: 0; }
.sg-footer .sg-footer-credit li { margin: 0 !important; }
.sg-footer .sg-footer-credit a { font-size: .75rem !important; line-height: 1.5; color: #9eafb7 !important; }
.sg-footer .sg-footer-credit a:hover { color: var(--sg-lime) !important; }
@media (max-width: 575.98px) { .sg-footer { padding-top: 2.5rem; } .sg-footer-mission { padding-right: 12px; } .sg-footer-bottom { align-items: flex-start !important; flex-direction: column; } }
.gallery-link, .gallery-link img { cursor: zoom-in; }
#galleryModal .modal-content { background: #000; }
#galleryModal .modal-body { cursor: zoom-out; }
#galleryCarousel .carousel-item { text-align: center; }
#galleryCarousel img { max-width: 95vw; max-height: 85vh; width: auto !important; height: auto !important; object-fit: contain; margin: auto; cursor: default; }
:focus-visible { outline: 3px solid var(--sg-lime); outline-offset: 3px; }
#dettaglio { scroll-margin-top: 150px; }
@media(max-width: 991.98px) {
 .sg-topbar-contacts > :not(.sg-topbar-whatsapp), .sg-topbar-account > :not(.sg-topbar-mobile-access):not(.sg-topbar-logout):not(.sg-account-dropdown) { display: none; }
 .sg-topbar-logout { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
 .sg-topbar-mobile-access { display: inline-flex; align-items: center; gap: .35rem; }
 .sg-topbar-inner { flex-wrap: nowrap; gap: .5rem; }
 .sg-topbar-whatsapp { white-space: nowrap; }
 .sg-header #topbar .bi { opacity: 1; }
 .sg-header:has(+ .sg-main > #myCarousel) { position: sticky; top: calc(-1 * var(--sg-topbar-height, 30px)); }
 .sg-header.sg-show-topbar, .sg-header.sg-show-topbar:has(+ .sg-main > #myCarousel) { top: 0; }
 .sg-main:has(> #myCarousel) { padding-top: 0; }
 /* La fascia della testata si sovrappone ai primi pixel della gallery. */
 #myCarousel .carousel-item img { width: 100%; height: auto; min-height: 18vh; min-height: 18svh; object-fit: cover; object-position: center; }
 #myCarousel .carousel-item img.sg-home-slide-image { height: 45vh; height: 45svh; }
 .sg-header .navbar { padding: .6rem 0; }
 .sg-header .navbar-brand { max-width: 75%; font-size: 1rem; }
 .sg-header .nav-link { padding: .85rem 1rem; }
 #features, #contact { padding: 3rem 1rem; }
 .sg-page-section { padding: 3rem 0 1.5rem; }
}
@media(prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }
