/* ==========================================================================
   Milena Tortorelli — design system
   Palette ispirata alle opere: blu notte + oro (Sindoni), calce/crema, terracotta
   ========================================================================== */

:root{
	--ink:        #22201b;
	--ink-soft:   #55524a;
	--cream:      #f7f3ea;
	--cream-2:    #efe8d8;
	--navy:       #1c2740;
	--navy-2:     #101828;
	--gold:       #b6924f;
	--gold-light: #d8bd82;
	--terracotta: #a15a3a;
	--line:       rgba(34,32,27,.12);
	--radius:     2px;
	--font-head:  'Cormorant Garamond', Georgia, serif;
	--font-body:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--maxw:       1200px;
}

/* ---- reset ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none;margin:0;padding:0}
button{font:inherit;cursor:pointer;background:none;border:0}
h1,h2,h3{font-family:var(--font-head);font-weight:600;line-height:1.1;margin:0 0 .4em;color:var(--navy-2)}
h1{font-size:clamp(2.4rem,5vw,4rem)}
h2{font-size:clamp(1.7rem,3vw,2.4rem)}
p{margin:0 0 1em}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.mt-skip{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:.8em 1.2em;z-index:999}
.mt-skip:focus{left:0}

/* ---- layout helpers ---- */
.mt-eyebrow{font-family:var(--font-body);text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;color:var(--gold);font-weight:600;margin-bottom:.6em}
.mt-lead{font-size:1.15rem;color:var(--ink-soft);max-width:60ch}
.mt-link{color:var(--navy);border-bottom:1px solid var(--gold);padding-bottom:2px;font-weight:500}
.mt-empty{color:var(--ink-soft);font-style:italic}

/* ---- buttons ---- */
.mt-btn{display:inline-flex;align-items:center;gap:.5em;padding:.85em 1.7em;border-radius:var(--radius);font-weight:600;font-size:.95rem;transition:transform .15s ease,background .15s ease,color .15s ease;border:1px solid transparent}
.mt-btn--primary{background:var(--navy);color:#fff}
.mt-btn--primary:hover{background:var(--navy-2);transform:translateY(-1px)}
.mt-btn--ghost{border-color:var(--navy);color:var(--navy)}
.mt-btn--ghost:hover{background:var(--navy);color:#fff}
.mt-btn--lg{padding:1em 2.2em;font-size:1.05rem}

.mt-badge{display:inline-block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;padding:.3em .8em;border-radius:99px;margin-bottom:.8em}
.mt-badge--arte{background:var(--gold-light);color:var(--navy-2)}
.mt-badge--architettura{background:var(--navy);color:#fff}
.mt-badge--disponibile{background:var(--terracotta);color:#fff;margin-left:.6em}

/* ==========================================================================
   HEADER
   ========================================================================== */
.mt-header{position:sticky;top:0;z-index:100;background:rgba(247,243,234,.92);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--line)}
.mt-header__inner{max-width:var(--maxw);margin:0 auto;padding:1em 1.5em;display:flex;align-items:center;justify-content:space-between}
.mt-logo__text{font-family:var(--font-head);font-size:1.4rem;font-weight:600;color:var(--navy-2);letter-spacing:.02em}
.mt-nav__list{display:flex;gap:2em;align-items:center}
.mt-nav__list a{font-size:.95rem;font-weight:500;color:var(--ink);transition:color .15s}
.mt-nav__list a:hover{color:var(--gold)}
.mt-nav__cta{background:var(--navy);color:#fff !important;padding:.6em 1.3em;border-radius:var(--radius)}
.mt-nav-toggle{display:none;flex-direction:column;gap:5px;padding:.4em}
.mt-nav-toggle span{width:24px;height:2px;background:var(--navy-2)}

@media (max-width:860px){
	.mt-nav-toggle{display:flex}
	.mt-nav{position:absolute;top:100%;left:0;right:0;background:var(--cream);border-bottom:1px solid var(--line);display:none}
	.mt-nav.is-open{display:block}
	.mt-nav__list{flex-direction:column;align-items:flex-start;gap:0;padding:1em 1.5em}
	.mt-nav__list li{width:100%;border-bottom:1px solid var(--line)}
	.mt-nav__list a{display:block;padding:.9em 0}
	.mt-nav__cta{display:inline-block;margin:1em 0}
}

/* ==========================================================================
   HERO (home)
   ========================================================================== */
.mt-hero{max-width:var(--maxw);margin:0 auto;padding:3em 1.5em 2em;display:grid;grid-template-columns:1.1fr 1fr;gap:3em;align-items:center}
.mt-hero__media{position:relative}
.mt-hero__img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius)}
.mt-hero__img--placeholder{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-2) 55%,var(--gold) 100%)}
.mt-plate{position:absolute;bottom:-1em;left:-1em;background:var(--navy-2);color:var(--gold-light);font-family:var(--font-head);font-style:italic;font-size:1.4rem;letter-spacing:.12em;padding:.5em 1em;border:1px solid var(--gold);box-shadow:0 10px 30px rgba(16,24,40,.3)}
.mt-hero__title{margin-bottom:.15em}
.mt-hero__phrase{font-family:var(--font-head);font-style:italic;font-size:1.5rem;color:var(--ink-soft)}
.mt-hero__actions{display:flex;gap:1em;margin-top:1.6em;flex-wrap:wrap}

@media (max-width:860px){
	.mt-hero{grid-template-columns:1fr;padding-top:2em}
	.mt-plate{left:1em}
}

/* ---- doppio ingresso Arte/Architettura ---- */
.mt-split{display:grid;grid-template-columns:1fr 1fr;margin:3em 0}
.mt-split__panel{position:relative;padding:4em 2em;display:flex;flex-direction:column;gap:.3em;color:#fff;overflow:hidden;transition:padding-left .2s ease}
.mt-split__panel--arte{background:linear-gradient(135deg,var(--navy) 0%,#2c3c60 100%)}
.mt-split__panel--architettura{background:linear-gradient(135deg,#3a2c22 0%,var(--terracotta) 100%)}
.mt-split__panel:hover{padding-left:2.6em}
.mt-split__label{font-family:var(--font-head);font-size:2.2rem}
.mt-split__desc{opacity:.85;max-width:32ch}
.mt-split__arrow{position:absolute;right:2em;bottom:2em;font-size:1.5rem;color:var(--gold-light)}

@media (max-width:700px){.mt-split{grid-template-columns:1fr}}

/* ---- intro / bio breve ---- */
.mt-intro{background:var(--cream-2);padding:4em 1.5em}
.mt-intro__inner{max-width:70ch;margin:0 auto;text-align:center}
.mt-intro__inner p{color:var(--ink-soft);font-size:1.1rem}

/* ---- sezioni con titolo + link ---- */
.mt-section-head{max-width:var(--maxw);margin:0 auto;padding:0 1.5em;display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.2em}

.mt-featured,.mt-filoni,.mt-mostre__list,.mt-related{max-width:var(--maxw);margin:0 auto;padding:3.5em 1.5em}

/* ---- grid opere ---- */
.mt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6em}
@media (max-width:960px){.mt-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.mt-grid{grid-template-columns:1fr}}

.mt-card{display:block;background:#fff;border:1px solid var(--line);transition:transform .2s ease,box-shadow .2s ease}
.mt-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(28,39,64,.12)}
.mt-card__img{aspect-ratio:1/1;overflow:hidden;background:var(--cream-2)}
.mt-card__img img{width:100%;height:100%;object-fit:cover}
.mt-card__img--empty{width:100%;height:100%;background:linear-gradient(135deg,var(--cream-2),var(--gold-light))}
.mt-card__caption{padding:1em 1.1em}
.mt-card__title{display:block;font-family:var(--font-head);font-size:1.15rem;color:var(--navy-2)}
.mt-card__meta{display:block;font-size:.82rem;color:var(--ink-soft);margin-top:.2em}

/* ---- filoni (liste categorie Arte/Architettura) ---- */
.mt-filoni{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2em}
@media (max-width:700px){.mt-filoni{grid-template-columns:1fr}}
.mt-filone{position:relative;display:block;padding:2em 2.2em;background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold)}
.mt-filone:hover{border-left-color:var(--terracotta)}
.mt-filone__title{display:block;font-family:var(--font-head);font-size:1.5rem;margin-bottom:.2em}
.mt-filone__desc{display:block;color:var(--ink-soft);font-size:.95rem;max-width:48ch}
.mt-filone__arrow{position:absolute;right:1.6em;top:50%;transform:translateY(-50%);color:var(--gold)}

/* ---- CTA ---- */
.mt-cta{max-width:var(--maxw);margin:0 auto;padding:5em 1.5em;text-align:center;background:var(--navy-2);color:#fff;border-radius:var(--radius)}
.mt-cta h2{color:#fff}
.mt-cta p{color:rgba(255,255,255,.75);max-width:50ch;margin:0 auto 1.6em}

/* ==========================================================================
   PAGINE INTERNE — hero generico
   ========================================================================== */
.mt-page__hero{max-width:var(--maxw);margin:0 auto;padding:4em 1.5em 1em}
.mt-page__hero--arte{border-top:4px solid var(--gold)}
.mt-page__hero--architettura{border-top:4px solid var(--terracotta)}

/* ---- Chi sono ---- */
.mt-bio__hero{max-width:var(--maxw);margin:0 auto;padding:3.5em 1.5em 1em;display:grid;grid-template-columns:.8fr 1.2fr;gap:2.5em;align-items:end}
.mt-bio__photo img{aspect-ratio:4/5;object-fit:cover}
.mt-bio__body{max-width:var(--maxw);margin:0 auto;padding:2.5em 1.5em 4em;display:grid;grid-template-columns:1fr 1fr;gap:3em}
.mt-bio__col p{color:var(--ink-soft)}
@media (max-width:800px){.mt-bio__hero,.mt-bio__body{grid-template-columns:1fr}}

/* ---- Mostre ---- */
.mt-mostre__item{display:grid;grid-template-columns:220px 1fr;gap:2em;padding:2em 0;border-bottom:1px solid var(--line)}
.mt-mostre__img{aspect-ratio:1/1;overflow:hidden}
.mt-mostre__img img{width:100%;height:100%;object-fit:cover}
.mt-mostre__data{color:var(--gold);font-weight:700;letter-spacing:.08em}
@media (max-width:640px){.mt-mostre__item{grid-template-columns:1fr}}

/* ---- Singola opera ---- */
.mt-single-opera .mt-opera{max-width:var(--maxw);margin:0 auto;padding:3em 1.5em;display:grid;grid-template-columns:1.3fr 1fr;gap:3em}
.mt-opera__media img{width:100%;object-fit:cover}
.mt-opera__meta{color:var(--ink-soft);font-size:.95rem}
.mt-opera__luogo{color:var(--ink-soft);font-style:italic}
.mt-opera__tags{display:flex;flex-wrap:wrap;gap:.5em;margin:1em 0}
.mt-tag{font-size:.8rem;padding:.3em .8em;border:1px solid var(--line);border-radius:99px;color:var(--ink-soft)}
.mt-opera__info .mt-btn{margin-top:1.5em}
@media (max-width:860px){.mt-single-opera .mt-opera{grid-template-columns:1fr}}

/* ---- Contatti ---- */
.mt-contatti__body{max-width:var(--maxw);margin:0 auto;padding:2em 1.5em 5em;display:grid;grid-template-columns:1.4fr .8fr;gap:3em}
.mt-form{display:flex;flex-direction:column;gap:1.2em}
.mt-form__field{display:flex;flex-direction:column;gap:.4em;font-weight:600;font-size:.92rem}
.mt-form__field input,.mt-form__field select,.mt-form__field textarea{font:inherit;padding:.8em 1em;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--ink)}
.mt-form__field input:focus,.mt-form__field select:focus,.mt-form__field textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
.mt-form__honeypot{position:absolute;left:-9999px}
.mt-contatti__info{background:var(--cream-2);padding:2em;align-self:start}
.mt-contatti__info a{display:block;margin-bottom:.6em;color:var(--navy);font-weight:600}
.mt-alert{padding:1em 1.3em;border-radius:var(--radius);margin-bottom:1em;font-weight:600}
.mt-alert--ok{background:#e5f3ea;color:#1e5c33}
.mt-alert--errore{background:#fbe6e2;color:#8a2c1c}
@media (max-width:860px){.mt-contatti__body{grid-template-columns:1fr}}

/* ---- pagination ---- */
.mt-pagination{display:flex;gap:.5em;justify-content:center;margin-top:2em}
.mt-pagination a,.mt-pagination span{padding:.5em 1em;border:1px solid var(--line)}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.mt-footer{background:var(--navy-2);color:rgba(255,255,255,.75);margin-top:4em}
.mt-footer__inner{max-width:var(--maxw);margin:0 auto;padding:3em 1.5em;display:grid;grid-template-columns:1fr 1fr 1fr;gap:2em}
.mt-footer__name{display:block;font-family:var(--font-head);font-size:1.3rem;color:#fff}
.mt-footer__role{color:var(--gold-light);font-size:.9rem}
.mt-footer__list{display:flex;flex-direction:column;gap:.6em}
.mt-footer__list a:hover{color:var(--gold-light)}
.mt-footer__contact a{display:block;margin-bottom:.4em}
.mt-footer__contact a:hover{color:var(--gold-light)}
.mt-footer__bottom{text-align:center;padding:1.2em;font-size:.82rem;border-top:1px solid rgba(255,255,255,.1)}
@media (max-width:700px){.mt-footer__inner{grid-template-columns:1fr}}