
:root {
  --app-font-sans: 'Manrope', sans-serif;
  --app-font-serif: 'Cormorant Garamond', Georgia, serif;
  --shadow-sm: 0 10px 30px rgba(10, 31, 68, 0.08);
  --shadow-lg: 0 24px 70px rgba(10, 31, 68, 0.14);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #faf8f3; }
body {
  font-family: var(--app-font-sans);
  -webkit-font-smoothing: antialiased;
  background: #faf8f3;
  color: #0a1f44;
  margin: 0;
  min-width: 320px;
}
::selection { background: #c9a227; color: #0a1f44; }
a { color: inherit; }
button { font-family: inherit; cursor: pointer; }

@keyframes rise-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } } }

.site-shell { overflow: hidden; background: #faf8f3; }
.container-wide { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.eyebrow { display: flex; align-items: center; gap: 11px; color: #7a580c; font-size: .67rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.eyebrow::before { content: ""; display: block; width: 28px; height: 1px; background: #c9a227; }
.section-heading { max-width: 680px; margin: 17px 0 0; color: #0a1f44; font-family: var(--app-font-serif); font-size: clamp(2.9rem, 6vw, 5.2rem); font-weight: 500; letter-spacing: -.045em; line-height: .9; }
.section-lede { max-width: 510px; margin: 24px 0 0; color: #576273; font-size: .93rem; line-height: 1.85; }

.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; border: 1px solid transparent; padding: 0 22px; font-size: .72rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; text-decoration: none; transition: transform .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease; }
.button:hover { transform: translateY(-2px); }
.button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, img[tabindex]:focus-visible, .lightbox-close:focus-visible { outline: 2px solid #c9a227; outline-offset: 4px; }
.button-primary { background: #c9a227; color: #0a1f44; }
.button-primary:hover { background: #dfbb42; }
.button-dark { background: #0a1f44; color: #fbfaf7; }
.button-dark:hover { background: #163463; }
.button-outline { border-color: rgba(10,31,68,.26); color: #0a1f44; background: transparent; }
.button-outline:hover { border-color: #0a1f44; background: #f4efe3; }

.site-header { position: fixed; z-index: 50; top: 0; width: 100%; border-bottom: 1px solid rgba(10,31,68,.12); background: rgba(251,250,247,.92); backdrop-filter: blur(14px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 78px; }
.wordmark { display: inline-flex; align-items: center; gap: 11px; color: #0a1f44; text-decoration: none; }
.wordmark-mark { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #c9a227; color: #0a1f44; font-family: var(--app-font-serif); font-size: 1.4rem; font-weight: 700; line-height: 1; }
.wordmark-copy { display: flex; flex-direction: column; gap: 1px; }
.wordmark-name { font-size: .83rem; font-weight: 800; letter-spacing: .1em; line-height: 1; }
.wordmark-sub { color: #7a580c; font-size: .54rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.desktop-nav { display: flex; align-items: center; gap: 27px; }
.nav-link { position: relative; color: #506074; font-size: .68rem; font-weight: 800; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; background: none; border: none; padding: 0; }
.nav-link::after { content: ""; position: absolute; right: 0; bottom: -9px; left: 0; height: 1px; background: #c9a227; transform: scaleX(0); transform-origin: right; transition: transform .25s ease; }
.nav-link:hover, .nav-link.is-active { color: #0a1f44; }
.nav-link:hover::after, .nav-link.is-active::after { transform: scaleX(1); transform-origin: left; }
.header-cta { min-height: 38px; padding: 0 15px; font-size: .61rem; }
.mobile-menu-button { display: none; border: 0; background: transparent; color: #0a1f44; padding: 9px; }
.mobile-menu { display: none; }
.mobile-menu.is-open { display: block; border-top: 1px solid rgba(10,31,68,.12); padding: 16px 24px 20px; background: #fbfaf7; }
.mobile-menu a { display: block; padding: 13px 0; color: #0a1f44; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.mobile-menu .button { width: 100%; margin-top: 8px; }

.hero { position: relative; min-height: auto; padding: 175px 0 82px; color: #0a1f44; background: #faf8f3; isolation: isolate; }
.hero-grid { display: block; }
.hero-kicker { display: flex; align-items: center; gap: 11px; color: #7a580c; font-size: .68rem; font-weight: 800; letter-spacing: .19em; text-transform: uppercase; animation: rise-in .7s ease both; }
.hero-kicker::before { content: ""; width: 35px; height: 1px; background: #c9a227; }
.hero h1 { max-width: 650px; margin: 23px 0 0; font-family: var(--app-font-serif); font-size: clamp(4.4rem, 10vw, 8.9rem); font-weight: 500; letter-spacing: -.065em; line-height: .78; animation: rise-in .7s .08s ease both; }
.hero h1 em { color: #a67e11; font-style: italic; }
.hero-intro { max-width: 430px; margin: 33px 0 0; color: #536175; font-size: .95rem; line-height: 1.8; animation: rise-in .7s .16s ease both; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; animation: rise-in .7s .23s ease both; }
.hero .button-outline { border-color: rgba(10,31,68,.28); color: #0a1f44; }
.hero .button-outline:hover { border-color: #a67e11; background: #f2e4d8; }
.hero-note { display: flex; align-items: center; gap: 14px; margin-top: 62px; color: #7b8490; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.hero-note strong { color: #0a1f44; font-size: .72rem; }
.hero-note-line { width: 42px; height: 1px; background: #c9a227; }


.section { padding: 125px 0; }
.section-tinted { background: #f2e5dc; }
.services-intro { display: flex; align-items: end; justify-content: space-between; gap: 36px; margin-bottom: 57px; }
.services-intro .section-lede { margin-top: 0; }
.services-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.service-card { position: relative; min-height: 285px; padding: 30px; border: 1px solid #ded6c8; background: #fbfaf7; transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease; }
.service-card:hover { border-color: #c9a227; box-shadow: var(--shadow-sm); transform: translateY(-5px); }
.service-card:nth-child(1) { grid-column: span 3; background: #fffaf4; }
.service-card:nth-child(2) { grid-column: span 3; background: #f5e8dc; }
.service-card:nth-child(3) { grid-column: span 3; background: #fffaf4; }
.service-card:nth-child(4) { grid-column: span 3; background: #f5e8dc; }
.service-index { color: #c9a227; font-size: .67rem; font-weight: 800; letter-spacing: .14em; }
.service-icon { display: grid; place-items: center; width: 42px; height: 42px; margin: 34px 0 21px; border: 1px solid #c9a227; color: #0a1f44; }
.service-title { margin: 0; color: #0a1f44; font-family: var(--app-font-serif); font-size: 2rem; font-weight: 600; letter-spacing: -.03em; line-height: .95; }
.service-text { margin: 14px 0 0; color: #647080; font-size: .78rem; line-height: 1.7; }
.service-link { position: absolute; right: 28px; bottom: 29px; color: #7a580c; font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.services-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 48px; }
.services-cta p { margin: 0; color: #536175; font-family: var(--app-font-serif); font-size: 1.45rem; }



.story { position: relative; padding: 140px 0; background: #ead8cc; color: #0a1f44; }
.story::before { content: ""; position: absolute; top: 0; left: 0; width: 40%; height: 1px; background: #c9a227; }
.story-grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: 120px; align-items: center; }
.story-portrait { position: relative; min-height: 480px; border: 1px solid rgba(10,31,68,.22); background: linear-gradient(145deg, rgba(201,162,39,.4), rgba(255,250,244,.2) 47%, rgba(10,31,68,.35)), linear-gradient(118deg, #bd9f82 0 28%, #d9c8b6 29% 58%, #71827f 59%); overflow: hidden; }
.story-portrait::before { content: ""; position: absolute; inset: 22px; border: 1px solid rgba(251,250,247,.5); z-index: 2; pointer-events: none; }
.story-portrait-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; z-index: 0; }
.story-portrait::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(10,31,68,.62) 0%, rgba(10,31,68,0) 26%); pointer-events: none; }
.portrait-caption { position: absolute; z-index: 3; right: 25px; bottom: 24px; left: 25px; display: flex; justify-content: space-between; color: #f7ecd2; font-size: .6rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.story .eyebrow { color: #7a580c; }
.story .section-heading { color: #0a1f44; }
.story-lede { max-width: 490px; margin: 29px 0 0; color: #536175; font-size: 1rem; line-height: 1.85; }
.story-quote { max-width: 530px; margin: 39px 0 0; padding-left: 24px; border-left: 1px solid #c9a227; color: #8a6710; font-family: var(--app-font-serif); font-size: 1.75rem; font-style: italic; line-height: 1.1; }
.story-sign { display: flex; align-items: center; gap: 16px; margin-top: 38px; color: #697384; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.story-sign strong { color: #0a1f44; font-size: .76rem; }

.area-section { padding: 122px 0 130px; }
.area-grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 92px; }
.area-map { position: relative; min-height: 440px; border: 1px solid #d9d0c0; background: #eee8dc; overflow: hidden; }
.map-lines { position: absolute; inset: -20% -10%; background: repeating-linear-gradient(22deg, transparent 0 45px, rgba(10,31,68,.12) 46px 47px), repeating-linear-gradient(111deg, transparent 0 65px, rgba(10,31,68,.09) 66px 68px); transform: rotate(-9deg); }
.map-river { position: absolute; top: -5%; left: 47%; width: 42px; height: 120%; background: rgba(114,156,165,.28); transform: rotate(24deg); }
.map-label { position: absolute; z-index: 1; color: #0a1f44; font-size: .62rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.map-label.verona { top: 31%; left: 24%; }
.map-label.vicenza { top: 50%; right: 14%; }
.map-label.mantova { bottom: 17%; left: 31%; color: #718091; }
.map-pin { position: absolute; z-index: 2; display: grid; place-items: center; width: 31px; height: 31px; border: 2px solid #fbfaf7; border-radius: 50%; background: #c9a227; color: #0a1f44; font-size: .6rem; font-weight: 800; box-shadow: 0 5px 15px rgba(10,31,68,.18); }
.map-pin.pin-verona { top: 35%; left: 30%; }
.map-pin.pin-vicenza { top: 55%; right: 21%; }
.map-legend { position: absolute; right: 20px; bottom: 19px; left: 20px; display: flex; justify-content: space-between; border-top: 1px solid rgba(10,31,68,.14); padding-top: 12px; color: #687381; font-size: .62rem; letter-spacing: .09em; text-transform: uppercase; }
.area-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 28px; margin-top: 31px; }
.area-list span { display: flex; align-items: center; gap: 10px; padding: 13px 0; border-bottom: 1px solid #ddd4c7; color: #425168; font-size: .75rem; }
.area-list svg { color: #c9a227; }
.area-cta { margin-top: 34px; }
.area-extra { margin-top: 22px; padding: 16px 18px; background: #fdf5e6; border-left: 3px solid #c9a227; color: #5a4a25; font-size: .8rem; line-height: 1.65; font-style: italic; }

.reviews-section { padding: 90px 0 95px; background: #f2e5dc; }
.reviews-head { margin-bottom: 38px; }
.reviews-placeholder { padding: 40px 44px; border: 1px dashed #cdbca9; background: rgba(255,250,244,.65); }
.reviews-placeholder p { margin: 0; color: #687381; font-size: .88rem; line-height: 1.75; }

.contact-section { padding: 124px 0 105px; background: #f4e9df; }
.contact-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 100px; align-items: start; }
.contact-intro .section-heading { font-size: clamp(3.2rem, 6vw, 5.7rem); }
.contact-copy { max-width: 360px; margin-top: 25px; color: #596578; font-size: .88rem; line-height: 1.8; }
.contact-details { margin-top: 44px; }
.whatsapp-cta { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; padding: 13px 20px; background: #0a1f44; color: #fbfaf7; text-decoration: none; font-size: .78rem; font-weight: 800; letter-spacing: .04em; border: 1px solid #0a1f44; transition: background-color .25s ease, transform .25s ease; }
.whatsapp-cta:hover { background: #163463; transform: translateY(-2px); }
.whatsapp-cta svg:first-child { color: #4ade80; flex: 0 0 auto; }
.whatsapp-float { position: fixed; z-index: 60; right: 22px; bottom: 22px; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #fff; box-shadow: 0 8px 24px rgba(10,31,68,.25); transition: transform .2s ease; }
.whatsapp-float:hover { transform: scale(1.08); }
@media (max-width: 600px) { .whatsapp-float { right: 16px; bottom: 16px; width: 52px; height: 52px; } }

/* ── PERCHE SCEGLIERE ─────────────────────────────────────────────────────── */
.why-section { padding: 110px 0 100px; background: #faf8f3; }
.why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 50px; }
.why-item { padding: 30px 26px; border: 1px solid #ded6c8; background: #fbfaf7; }
.why-item svg { color: #c9a227; }
.why-item h3 { margin: 16px 0 0; color: #0a1f44; font-family: var(--app-font-serif); font-size: 1.35rem; font-weight: 600; }
.why-item p { margin: 10px 0 0; color: #647080; font-size: .78rem; line-height: 1.65; }
@media (max-width: 900px) { .why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .why-grid { grid-template-columns: 1fr; } .why-section { padding: 80px 0; } }

/* ── FAQ ──────────────────────────────────────────────────────────────────── */
.faq-section { padding: 100px 0 120px; background: #f2e5dc; }
.faq-list { max-width: 780px; margin-top: 44px; display: grid; gap: 12px; }
.faq-item { background: #fbfaf7; border: 1px solid #ddd0bc; padding: 20px 24px; }
.faq-item summary { cursor: pointer; color: #0a1f44; font-family: var(--app-font-serif); font-size: 1.15rem; font-weight: 600; list-style: none; position: relative; padding-right: 30px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; right: 0; top: -2px; color: #c9a227; font-size: 1.4rem; font-weight: 400; }
.faq-item[open] summary::after { content: "–"; }
.faq-item p { margin: 14px 0 0; color: #576273; font-size: .85rem; line-height: 1.7; }
@media (max-width: 600px) { .faq-section { padding: 75px 0; } .faq-item summary { font-size: 1rem; } }
.contact-detail { display: block; margin-top: 16px; color: #0a1f44; font-family: var(--app-font-serif); font-size: 1.55rem; text-decoration: none; }
.contact-detail:hover { color: #7a580c; }
.contact-label { display: block; color: #7a580c; font-size: .61rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.trust-points { display: grid; gap: 15px; margin-top: 44px; }
.trust-point { display: flex; align-items: flex-start; gap: 12px; color: #7a580c; }
.trust-point svg { flex: 0 0 auto; margin-top: 2px; }
.trust-point span { display: grid; gap: 2px; }
.trust-point strong { color: #0a1f44; font-size: .72rem; letter-spacing: .04em; }
.trust-point small { color: #687381; font-size: .7rem; line-height: 1.5; }
.quote-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; padding: 35px; border: 1px solid #d7cdbd; background: #fbfaf7; box-shadow: var(--shadow-sm); }
.field { display: flex; flex-direction: column; gap: 8px; }
.field-full { grid-column: 1 / -1; }
.field label { color: #536175; font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.field input, .field select, .field textarea { width: 100%; border: 0; border-bottom: 1px solid #cfc4b4; border-radius: 0; outline: 0; background: transparent; padding: 11px 0; color: #0a1f44; font: inherit; font-size: .82rem; }
.field textarea { min-height: 105px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: #a4a4a0; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: #c9a227; }
.field-file { display: flex; flex-direction: row; align-items: center; gap: 12px; margin-top: 3px; }
.field-file input { width: auto; padding: 0; border: 0; color: #687381; font-size: .74rem; }
.file-hint { color: #7e8791; font-size: .68rem; }
.hp-field { position: absolute; left: -9999px; top: -9999px; }
.field-consent { margin-top: 2px; }
.consent-label { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.consent-label input { width: auto; flex: 0 0 auto; margin-top: 3px; accent-color: #c9a227; }
.consent-label span { color: #536175; font-size: .78rem; line-height: 1.5; }
.consent-label a { color: #7a580c; text-decoration: underline; }
.form-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; grid-column: 1 / -1; margin-top: 4px; }
.form-privacy { max-width: 270px; color: #8a8d8d; font-size: .63rem; line-height: 1.5; }
.form-feedback { display: none; grid-column: 1 / -1; margin: 0; padding: 12px 14px; border-left: 2px solid #c9a227; color: #536175; font-size: .74rem; line-height: 1.5; }
.form-feedback.is-visible { display: block; }

.site-footer { padding: 32px 0 35px; background: #071932; color: rgba(251,250,247,.64); }
.footer-grid { display: grid; grid-template-columns: 1fr auto auto auto; align-items: center; gap: 32px; }
.site-footer .wordmark { color: #fbfaf7; }
.site-footer .wordmark-sub { color: #dfbd4c; }
.site-footer .wordmark-mark { color: #dfbd4c; border-color: #dfbd4c; }
.footer-meta { font-size: .64rem; line-height: 1.8; }
.footer-meta strong { display: block; color: #fbfaf7; font-size: .69rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-copy { color: rgba(251,250,247,.42); font-size: .63rem; text-align: right; }
.footer-cta { min-height: 42px; padding-inline: 16px; font-size: .6rem; }

@media (max-width: 900px) {
  .desktop-nav, .header-cta { display: none; }
  .mobile-menu-button { display: block; }
  .hero-grid, .story-grid, .area-grid, .contact-grid { grid-template-columns: 1fr; gap: 60px; }
  .hero { min-height: auto; padding: 145px 0 70px; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .service-card:nth-child(n) { grid-column: span 1; margin-top: 0; }
  .service-card:first-child { grid-column: span 2; }
  .services-cta { align-items: flex-start; flex-direction: column; }
  .story-portrait { min-height: 390px; }
  .area-map { order: 2; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-copy { text-align: left; grid-column: span 2; }
  .footer-cta { justify-self: start; }
}
@media (max-width: 600px) {
  .container-wide { width: min(100% - 36px, 1160px); }
  .header-inner { min-height: 68px; }
  .wordmark-name { font-size: .72rem; }
  .hero { padding-top: 120px; }
  .hero h1 { font-size: clamp(4rem, 19vw, 6rem); }
  .hero-intro { font-size: .86rem; }
  .hero-actions .button { width: 100%; }
  .section, .area-section, .contact-section, .story { padding: 85px 0; }
  .section-heading { font-size: 3.5rem; }
  .services-intro, .portfolio-head { display: block; margin-bottom: 38px; }
  .services-intro .section-lede, .portfolio-head .section-lede { margin-top: 20px; }
  .services-grid { display: block; }
  .service-card { min-height: 265px; margin-bottom: 14px !important; }
  .services-cta p { font-size: 1.25rem; }
  .story-grid { gap: 38px; }
  .story-portrait { min-height: 300px; }
  .story-lede { font-size: .9rem; }
  .story-quote { font-size: 1.45rem; }
  .area-grid { gap: 35px; }
  .area-map { min-height: 340px; }
  .area-list { grid-template-columns: 1fr; }
  .contact-grid { gap: 38px; }
  .quote-form { display: block; padding: 24px; }
  .field { margin-bottom: 21px; }
  .form-footer { align-items: stretch; flex-direction: column; margin-top: 26px; }
  .form-privacy { max-width: none; }
  .form-footer .button { width: 100%; }
  .reviews-placeholder { padding: 28px 24px; }
  .footer-grid { display: flex; align-items: flex-start; flex-direction: column; gap: 25px; }
  .footer-copy { width: 100%; }
}

/* ── PRIMA E DOPO ────────────────────────────────────────────────────────── */
.before-after-section { padding: 0 0 110px; background: #faf8f3; }
.ba-intro { margin-bottom: 44px; }
.ba-intro .section-lede { margin-top: 20px; }
.ba-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.ba-card.is-wide { grid-column: 1 / -1; }
.ba-card { background: #fff; border: 1px solid #ddd4c4; padding: 22px; box-shadow: 0 12px 40px rgba(10,31,68,.06); }
.ba-card-title { margin: 0 0 16px; color: #0a1f44; font-family: var(--app-font-serif); font-size: 1.7rem; font-weight: 600; }
.ba-images { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ba-image-wrap { position: relative; overflow: hidden; aspect-ratio: 4/3; min-width: 0; }
.ba-image-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ba-tag { position: absolute; top: 10px; left: 10px; padding: 4px 11px; font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ba-tag.prima { background: rgba(10,31,68,.78); color: #fbfaf7; }
.ba-tag.dopo { background: #c9a227; color: #0a1f44; }
.ba-caption { margin: 14px 0 0; color: #687381; font-size: .76rem; line-height: 1.6; }
@media (max-width: 700px) {
  .ba-grid { grid-template-columns: 1fr; }
}

.ba-render { margin-top: 20px; padding-top: 20px; border-top: 1px solid #e6ddd0; }
.ba-render-head { margin-bottom: 14px; }
.ba-render-label { display: inline-block; margin-bottom: 6px; color: #7a580c; font-size: .6rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.ba-render-head p { margin: 0; color: #687381; font-size: .76rem; line-height: 1.65; }
.ba-render img { width: 100%; height: auto; display: block; border: 1px solid #e6ddd0; }

/* ── ANTEPRIMA LAVORI (HOME) ─────────────────────────────────────────────── */
.teaser-section { padding: 0 0 125px; background: #faf8f3; }
.teaser-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.teaser-card { background: #fff; border: 1px solid #ddd4c4; padding: 16px; box-shadow: 0 12px 40px rgba(10,31,68,.06); }
.teaser-images { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.teaser-image-wrap { position: relative; overflow: hidden; aspect-ratio: 4/3; background: #f2e5dc; }
.teaser-image-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.teaser-card--scale .teaser-image-wrap { aspect-ratio: 3/4; }
.teaser-tag { position: absolute; top: 10px; left: 10px; padding: 4px 11px; font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; z-index: 2; }
.teaser-tag.prima { background: rgba(10,31,68,.78); color: #fbfaf7; }
.teaser-tag.dopo { background: #c9a227; color: #0a1f44; }
.teaser-tag.render { background: #0a1f44; color: #fbfaf7; }
.teaser-caption { margin: 14px 0 0; color: #687381; font-size: .78rem; line-height: 1.6; }
.teaser-cta { display: flex; justify-content: center; margin-top: 44px; }
.teaser-card--wide { grid-column: 1 / -1; margin-top: 20px; }
.teaser-card--wide .teaser-images { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) {
  .teaser-grid { grid-template-columns: 1fr; }
  .teaser-card--wide .teaser-images { grid-template-columns: 1fr; }
}

.ba-image-wrap--contain { aspect-ratio: auto; background: #efe9dd; display: flex; align-items: center; justify-content: center; min-height: 220px; max-height: 420px; }
.ba-image-wrap--contain img { width: 100%; height: 100%; object-fit: contain; }

.ba-colors { margin-top: 16px; padding: 14px 18px; background: #f7f1e8; border-left: 3px solid #c9a227; }
.ba-colors-label { display: block; margin-bottom: 10px; color: #7a580c; font-size: .62rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ba-colors-list { display: flex; flex-wrap: wrap; gap: 14px; }
.ba-color-item { display: flex; align-items: center; gap: 8px; color: #425168; font-size: .78rem; }
.ba-swatch { display: inline-block; width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(10,31,68,.15); }
.swatch-tortora { background: #a8907c; }
.swatch-crema { background: #e9dfcd; }
.swatch-bianco { background: #f7f4ec; }

.lavori-title { background: #faf8f3; }
.lavori-title-heading { color: #0a1f44 !important; }
.lavori-title-eyebrow { color: #7a580c !important; }
.lavori-title-lede { color: #576273 !important; }

/* ── LIGHTBOX ─────────────────────────────────────────────────────────────── */
.ba-image-wrap img, .ba-image-wrap--contain img, .ba-render img { cursor: zoom-in; }
.lightbox-overlay {
  position: fixed; inset: 0; z-index: 999; display: none;
  align-items: center; justify-content: center;
  background: rgba(7,25,50,.94); padding: 24px;
}
.lightbox-overlay.is-open { display: flex; }
.lightbox-overlay img {
  max-width: 100%; max-height: 90vh; object-fit: contain;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.lightbox-close {
  position: absolute; top: 20px; right: 20px; z-index: 1000;
  display: grid; place-items: center; width: 44px; height: 44px;
  border: 1px solid rgba(251,250,247,.4); border-radius: 50%;
  background: rgba(251,250,247,.1); color: #fbfaf7; cursor: pointer;
}
.lightbox-close:hover { background: rgba(251,250,247,.2); }

.ba-single-image { overflow: hidden; }
.ba-single-image img { width: 100%; height: auto; max-height: 480px; object-fit: cover; display: block; cursor: zoom-in; }
