/* PROPOSTA C - "Indice": pietra calda e carbone. Hero diviso in due, capitoli in un indice a righe
   che si aprono, contatti su fondo chiaro. */
:root {
    --bg: #ebe8e1; --text: #3a3935; --head: #1a1a19; --mute: #75726b; --paper: #dfdbd2; --line: rgba(26, 26, 25, .24);
}
.site-header { background: rgba(26, 26, 25, .96); border-bottom-color: rgba(255, 255, 255, .2); }
.section :focus-visible { outline-color: var(--head); }

.hero-c { padding: calc(var(--header-h) + clamp(1.5rem, 4vw, 3rem)) var(--gutter) clamp(3rem, 7vw, 5rem); background: var(--bg); }
.hero-c-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; max-width: 1340px; margin: 0 auto; min-height: calc(100vh - var(--header-h) - 6rem); min-height: calc(100svh - var(--header-h) - 6rem); }
.hero-c h1 { font-size: clamp(2.6rem, 6vw, 5.4rem); max-width: 14ch; }
.hero-c .lead { color: var(--text); }
.hero-c .actions { margin-top: 2.25rem; }
.hero-c .badge { width: 72px; height: 72px; margin-bottom: 2rem; border: 1px solid var(--line); }
.hero-vbox { aspect-ratio: 4 / 5; max-height: calc(100svh - var(--header-h) - 5rem); width: 100%; margin-left: auto; }
.hero-vbox .veil { background: linear-gradient(0deg, rgba(10, 10, 10, .5) 0%, transparent 45%); }
.hero-vbox .hero-logo { position: absolute; left: 1.4rem; bottom: 1.4rem; width: clamp(64px, 8vw, 96px); margin: 0; z-index: 4; }

/* Indice dei capitoli */
.index { background: var(--bg); padding: clamp(3rem, 8vh, 6rem) 0; }
.index .wrap { max-width: 1340px; }
.ix-row { border-top: 1px solid var(--head); }
.ix-row:last-of-type { border-bottom: 1px solid var(--head); }
.ix-row summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 4.5rem 1fr auto 2.4rem; align-items: center; gap: clamp(.75rem, 2vw, 2rem); padding: clamp(1.25rem, 3vw, 2.25rem) 0; transition: padding-left .4s ease; }
.ix-row summary::-webkit-details-marker { display: none; }
.ix-row summary:hover { padding-left: clamp(.5rem, 1.6vw, 1.5rem); }
.ix-n { font-family: var(--font-roman); font-size: .8rem; letter-spacing: .24em; color: var(--mute); }
.ix-t { font-family: var(--font-display); font-weight: 500; font-size: clamp(2.6rem, 8vw, 7rem); line-height: 1; color: var(--head); }
.ix-g { font-family: var(--font-roman); font-size: .68rem; letter-spacing: .26em; text-transform: uppercase; color: var(--mute); text-align: right; }
.ix-x { position: relative; width: 26px; height: 26px; justify-self: end; }
.ix-x::before, .ix-x::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: var(--head); transition: transform .3s; }
.ix-x::after { transform: rotate(90deg); }
.ix-row[open] .ix-x::after { transform: rotate(0); }
.ix-body { padding: 0 0 clamp(2rem, 4vw, 3rem); }
.ix-body .vbox { min-height: min(70vh, 640px); min-height: min(70svh, 640px); display: flex; align-items: flex-end; padding: clamp(1.5rem, 3vw, 2.5rem); margin-bottom: 1.5rem; }
.ix-body .vbox .bg { z-index: -2; }
.ix-body .ov-text { max-width: 30rem; }
.ix-body .veil { background: linear-gradient(0deg, rgba(10, 10, 10, .75) 0%, rgba(10, 10, 10, .15) 55%, transparent 100%); }

/* Situazioni: elenco sempre aperto */
.sit-list { border-top: 1px solid var(--head); }
.sit-item { display: grid; grid-template-columns: 4rem 1fr 1.4fr; gap: clamp(1rem, 3vw, 3rem); padding: 1.6rem 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.sit-item .n { font-family: var(--font-roman); font-size: .72rem; letter-spacing: .2em; color: var(--mute); }
.sit-item h3 { font-size: clamp(1.5rem, 2.4vw, 2rem); }

/* Separatore e contatti su fondo chiaro */
.tail-c { min-height: min(70vh, 640px); display: flex; align-items: center; justify-content: center; text-align: center; padding: 3rem var(--gutter); }
.tail-c .veil { background: radial-gradient(ellipse at center, rgba(10, 10, 10, .6) 0%, rgba(10, 10, 10, .75) 100%); }
.band-c { padding: 0 var(--frame-x) var(--gap); background: var(--bg); }
.contact-c { background: var(--bg); padding: clamp(4rem, 10vh, 7rem) 0; }
.contact-c .contact-grid { align-items: start; }
.contact-c .contact-info { color: var(--text); }
.contact-c address .label { color: var(--mute); }
.contact-c address a { border-bottom-color: var(--line); }
.contact-c .contact-vbox { aspect-ratio: 16 / 10; margin-top: 2rem; }
.contact-c .form { background: var(--paper); border-color: var(--line); backdrop-filter: none; -webkit-backdrop-filter: none; }
.contact-c .form label { color: var(--mute); }
.contact-c .form input[type="text"], .contact-c .form input[type="email"], .contact-c .form select, .contact-c .form textarea { color: var(--head); background: rgba(255, 255, 255, .55); border-color: var(--line); }
.contact-c .form select { background-image: linear-gradient(45deg, transparent 50%, var(--head) 50%), linear-gradient(135deg, var(--head) 50%, transparent 50%); }
.contact-c .form input:focus, .contact-c .form select:focus, .contact-c .form textarea:focus { outline-color: var(--head); border-color: var(--head); }
.contact-c .form .check { color: var(--text); }
.contact-c .form .check input { accent-color: var(--head); }
.contact-c .btn-solid { background: var(--head); border-color: var(--head); color: #fff; }
.contact-c .btn-solid:hover { background: transparent; color: var(--head); }
.contact-c .form-status.ok { color: #1b6b3a; }
.contact-c .form-status.err { color: #a12a2a; }

@media (max-width: 1000px) {
    .hero-c-grid { grid-template-columns: 1fr; min-height: 0; }
    .hero-vbox { aspect-ratio: 16 / 11; max-height: none; }
    .sit-item { grid-template-columns: 3rem 1fr; }
    .sit-item p { grid-column: 2; }
}
@media (max-width: 560px) {
    .ix-row summary { grid-template-columns: 2.6rem 1fr 1.6rem; }
    .ix-g { display: none; }
    .ix-t { font-size: clamp(2.3rem, 11vw, 3.2rem); }
    .hero-c .lead { display: block; }
}