/* ============================================================
   Palazzo Merli — shared stylesheet
   Design system: EB Garamond + white/Venetian-red alternation.
   ============================================================ */

:root{
  --white:#FFFFFF;
  --ink:#1F1212;
  --walnut:#3D2424;
  --muted-walnut:#5C3838;
  --venetian:#8C2A2A;
  --venetian-dark:#6E2020;
  --cream:#F5E8DC;
  --cream-body:#EAD4C4;
  --cream-label:#E8C8B8;
  --stone:#F5EFE4;
  --stone-mid:#C9B998;
  --stone-dark:#B9A985;
  --hairline:#EEE8DC;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'EB Garamond',Georgia,serif;
  background:var(--white);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
a{color:inherit;}

.label{
  font-size:11px;
  letter-spacing:0.32em;
  text-transform:uppercase;
  font-weight:500;
}
.rule{width:34px;height:1px;background:var(--venetian);border:0;}

/* ---------- NAV ---------- */
nav{
  display:flex;justify-content:space-between;align-items:center;
  padding:24px 48px;
  border-bottom:0.5px solid var(--hairline);
  position:sticky;top:0;background:rgba(255,255,255,0.94);
  backdrop-filter:blur(8px);z-index:100;
}
.brand{font-size:19px;color:var(--ink);letter-spacing:0.02em;text-decoration:none;}
.brand em{font-style:italic;}
.brand .dot{color:var(--venetian);}
.menu{display:flex;gap:26px;align-items:center;}
.menu a{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--muted-walnut);text-decoration:none;transition:color .2s;
}
.menu a:hover{color:var(--venetian);}
.menu a.active{color:var(--venetian);}
.menu .lang{color:var(--venetian);}

/* ---------- HOMEPAGE HERO — "place statement" ---------- */
.home-hero{
  background:var(--white);
  padding:120px 48px 110px;
  text-align:center;
}
.home-hero .title{
  font-weight:400;
  font-size:96px;
  line-height:0.98;
  letter-spacing:-0.01em;
  color:var(--ink);
}
.home-hero .title em{font-style:italic;}
.home-hero .rule{margin:34px auto 28px;width:54px;}
.home-hero .sub{
  font-size:12px;letter-spacing:0.32em;text-transform:uppercase;
  color:var(--venetian);font-weight:500;
}
.home-hero .facade{
  margin:64px auto 0;max-width:960px;
  height:380px;background:var(--stone);
  border:0.5px solid var(--hairline);
  display:flex;align-items:flex-end;justify-content:center;
  position:relative;overflow:hidden;
}
.home-hero .facade .towers{display:flex;gap:24px;align-items:flex-end;}
.home-hero .facade .t-tall{width:64px;height:300px;background:var(--stone-dark);}
.home-hero .facade .t-mid{width:120px;height:180px;background:var(--stone-mid);}
.home-hero .facade .cap{
  position:absolute;bottom:14px;right:20px;font-style:italic;font-size:12px;
  color:#8A7553;
}

/* ---------- PAGE HERO (internal pages) ---------- */
.page-hero{padding:72px 48px 0;text-align:center;}
.page-hero .label{color:var(--venetian);display:block;margin-bottom:26px;}
.hero-figure{
  width:100%;height:420px;background:var(--stone);
  display:flex;align-items:flex-end;justify-content:center;
  border:0.5px solid var(--hairline);position:relative;overflow:hidden;
}
.hero-figure .towers{display:flex;gap:22px;align-items:flex-end;padding-bottom:0;}
.hero-figure .t-tall{width:64px;height:340px;background:var(--stone-dark);}
.hero-figure .t-mid{width:104px;height:150px;background:var(--stone-mid);}
.ph-cap{
  position:absolute;bottom:14px;right:20px;font-style:italic;font-size:12px;
  color:#8A7553;
}
.hero-caption{
  font-style:normal;font-size:18px;color:var(--muted-walnut);
  max-width:48ch;margin:30px auto 0;line-height:1.6;letter-spacing:0.01em;
}

/* ---------- INTRO ---------- */
.intro{padding:64px 48px 80px;display:flex;justify-content:center;}
.intro p{
  max-width:60ch;font-size:18px;line-height:1.85;color:var(--walnut);
  text-align:center;
}
.intro p + p{margin-top:1.2em;}

/* ---------- ERA / STRIPE SECTIONS ---------- */
.era{display:grid;grid-template-columns:1fr 1fr;min-height:460px;}
.era .text{padding:72px 56px;display:flex;flex-direction:column;justify-content:center;}
.era .figure{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.era .num{display:block;margin-bottom:20px;}
.era h2{
  font-weight:400;font-size:33px;line-height:1.16;margin-bottom:22px;letter-spacing:-0.005em;
}
.era h2 em{font-style:italic;}
.era p{font-size:16.5px;line-height:1.8;max-width:40ch;}
.era p + p{margin-top:1em;}
.era .stripe-link{
  margin-top:24px;font-style:italic;font-size:16px;text-decoration:none;
  border-bottom:0.5px solid var(--venetian);padding-bottom:3px;align-self:flex-start;
  transition:color .2s;
}

/* white era */
.era.light{background:var(--white);}
.era.light .num{color:var(--venetian);}
.era.light h2{color:var(--ink);}
.era.light p{color:var(--walnut);}
.era.light .figure{background:var(--stone);}
.era.light .stripe-link{color:var(--ink);}
.era.light .stripe-link:hover{color:var(--venetian);}

/* red era */
.era.red{background:var(--venetian);}
.era.red .num{color:var(--cream-label);}
.era.red h2{color:var(--cream);}
.era.red p{color:var(--cream-body);}
.era.red .figure{background:var(--venetian-dark);}
.era.red .stripe-link{color:var(--cream);border-bottom-color:var(--cream-label);}
.era.red .stripe-link:hover{color:var(--cream-body);}

.fig-cap{
  position:absolute;bottom:14px;left:0;right:0;text-align:center;
  font-style:italic;font-size:12px;
}
.light .fig-cap{color:#8A7553;}
.red .fig-cap{color:var(--cream-label);}

.placeholder-block{display:flex;gap:18px;align-items:flex-end;}
.pb-tall{width:54px;height:280px;}
.pb-mid{width:88px;height:130px;}
.light .pb-tall{background:var(--stone-dark);}
.light .pb-mid{background:var(--stone-mid);}
.red .pb-tall{background:#A8341E;}
.red .pb-mid{background:#B95430;}
.pb-rect{width:240px;height:300px;border:0.5px solid;}
.light .pb-rect{background:#E5DDC9;border-color:var(--stone-mid);}
.red .pb-rect{background:#7A2424;border-color:#A8341E;}
.pb-portrait{width:200px;height:260px;border:0.5px solid;}
.light .pb-portrait{background:#E5DDC9;border-color:var(--stone-mid);}
.red .pb-portrait{background:#7A2424;border-color:#A8341E;}
.pb-note{font-style:italic;font-size:11px;text-align:center;line-height:1.6;align-self:center;padding:0 12px;}
.light .pb-note{color:#8A7553;}
.red .pb-note{color:var(--cream-label);}

/* paired split stripe (two half-cards in one stripe, used on homepage) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.split .half{padding:72px 56px;display:flex;flex-direction:column;justify-content:center;min-height:380px;}
.split .half + .half{border-left:0.5px solid rgba(245,232,220,0.18);}
.split.red{background:var(--venetian);color:var(--cream);}
.split.red .num{color:var(--cream-label);}
.split.red h3{color:var(--cream);}
.split.red p{color:var(--cream-body);}
.split.red .stripe-link{color:var(--cream);border-bottom:0.5px solid var(--cream-label);}
.split h3{
  font-weight:400;font-size:26px;line-height:1.2;margin:14px 0 18px;
}
.split h3 em{font-style:italic;}
.split p{font-size:16px;line-height:1.75;max-width:38ch;}
.split .stripe-link{
  margin-top:20px;font-style:italic;font-size:15px;text-decoration:none;
  padding-bottom:3px;align-self:flex-start;
}

/* ---------- DETAILS BAND ---------- */
.details{background:var(--venetian);padding:72px 48px;}
.details .label{color:var(--cream-label);text-align:center;display:block;margin-bottom:14px;}
.details h2{
  text-align:center;color:var(--cream);font-style:italic;font-weight:400;
  font-size:30px;margin-bottom:48px;
}
.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:920px;margin:0 auto;}
.detail-item{text-align:center;}
.detail-img{
  width:100%;height:180px;background:#7A2424;border:0.5px solid #A8341E;margin-bottom:12px;
}
.detail-item .lead .detail-img{background:#9A3020;}
.detail-cap{font-style:italic;font-size:13px;color:var(--cream-body);line-height:1.5;}

/* ---------- CLOSING ---------- */
.closing{background:var(--white);padding:90px 48px;text-align:center;}
.closing .rule{margin:0 auto 32px;}
.closing blockquote{
  font-style:italic;font-size:23px;line-height:1.55;color:var(--ink);
  max-width:42ch;margin:0 auto;
}
.closing .src{
  display:block;margin-top:26px;font-style:normal;font-size:11px;
  letter-spacing:0.28em;text-transform:uppercase;color:var(--muted-walnut);
}

/* ---------- FORWARD LINK ---------- */
.forward{background:var(--white);padding:0 48px 90px;text-align:center;}
.forward a{
  text-decoration:none;color:var(--ink);font-style:italic;font-size:20px;
  border-bottom:0.5px solid var(--venetian);padding-bottom:5px;transition:color .2s;
}
.forward a:hover{color:var(--venetian);}
.forward .pre{
  display:block;font-style:normal;font-size:11px;letter-spacing:0.28em;
  text-transform:uppercase;color:var(--muted-walnut);margin-bottom:18px;
}

/* ---------- LONG-FORM ARTICLE BODY (La Famiglia, FLM) ---------- */
.longform{padding:64px 48px 96px;display:flex;justify-content:center;}
.longform .col{max-width:62ch;width:100%;}
.longform h2{
  font-weight:400;font-size:30px;line-height:1.2;margin:64px 0 8px;color:var(--ink);
  letter-spacing:-0.005em;
}
.longform h2 em{font-style:italic;}
.longform h2:first-of-type{margin-top:0;}
.longform h3{
  font-weight:400;font-style:italic;font-size:21px;line-height:1.3;
  margin:40px 0 6px;color:var(--walnut);
}
.longform .num{
  display:block;margin-bottom:14px;color:var(--venetian);
}
.longform p{font-size:17px;line-height:1.85;color:var(--walnut);margin-bottom:1.05em;}
.longform p.lede{font-size:19px;line-height:1.8;color:var(--ink);}
.longform blockquote{
  border-left:2px solid var(--venetian);
  padding:6px 0 6px 22px;margin:1.4em 0;
  font-style:italic;font-size:17px;color:var(--muted-walnut);
}
.longform .meta{
  font-size:11px;letter-spacing:0.28em;text-transform:uppercase;
  color:var(--muted-walnut);margin-bottom:6px;
}
.longform hr{
  border:0;border-top:0.5px solid var(--hairline);
  margin:56px auto;width:80px;
}

/* timeline (light variant used inline in longform) */
.timeline{margin:32px 0 8px;border-top:0.5px solid var(--hairline);border-bottom:0.5px solid var(--hairline);padding:8px 0;}
.timeline .row{display:grid;grid-template-columns:96px 1fr;gap:20px;padding:12px 0;border-bottom:0.5px solid var(--hairline);}
.timeline .row:last-child{border-bottom:0;}
.timeline .yr{
  font-size:13px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--venetian);font-weight:500;padding-top:2px;
}
.timeline .ev{font-size:16px;line-height:1.65;color:var(--walnut);}
.timeline .ev em{font-style:italic;}

/* ---------- IN PREPARAZIONE (stub pages) ---------- */
.in-prep{
  background:var(--white);padding:120px 48px 140px;text-align:center;
}
.in-prep .label{color:var(--venetian);display:block;margin-bottom:34px;}
.in-prep h1{
  font-weight:400;font-size:54px;line-height:1.1;margin-bottom:18px;color:var(--ink);
}
.in-prep h1 em{font-style:italic;}
.in-prep .rule{margin:0 auto 36px;}
.in-prep .teaser{
  max-width:52ch;margin:0 auto;font-size:18px;line-height:1.8;color:var(--walnut);
}
.in-prep .badge{
  display:inline-block;margin-top:48px;
  font-size:11px;letter-spacing:0.32em;text-transform:uppercase;
  color:var(--muted-walnut);
  border:0.5px solid var(--hairline);padding:10px 22px;
  background:#FAF6EE;
}

/* ---------- ARCHIVIO ---------- */
.archive-section{padding:72px 48px;border-top:0.5px solid var(--hairline);}
.archive-section:first-of-type{border-top:0;}
.archive-section .inner{max-width:780px;margin:0 auto;}
.archive-section .label{color:var(--venetian);display:block;margin-bottom:14px;}
.archive-section h2{
  font-weight:400;font-size:30px;line-height:1.2;margin-bottom:24px;color:var(--ink);
}
.archive-section h2 em{font-style:italic;}
.archive-section p.intro-p{font-size:16.5px;line-height:1.8;color:var(--walnut);max-width:60ch;margin-bottom:28px;}

.biblio{list-style:none;padding:0;margin:0;}
.biblio li{
  font-size:15.5px;line-height:1.65;color:var(--walnut);
  padding:14px 0;border-bottom:0.5px solid var(--hairline);
}
.biblio li:last-child{border-bottom:0;}
.biblio li em{font-style:italic;}
.biblio li .src-note{
  display:block;margin-top:4px;font-size:13px;color:var(--muted-walnut);font-style:italic;
}

/* ---------- DEDICATION (subtle) ---------- */
.dedication{
  padding:54px 48px 10px;text-align:center;
  font-style:italic;font-size:14px;color:var(--muted-walnut);
}

/* ---------- FOOTER ---------- */
footer{
  background:#FAF6EE;padding:30px 48px;
  display:flex;justify-content:space-between;align-items:center;
  border-top:0.5px solid var(--hairline);
}
footer .f-left{font-size:14px;color:var(--muted-walnut);}
footer .f-left em{font-style:italic;}
footer .f-right{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#8A7553;}

/* ---------- RESPONSIVE ---------- */
@media(max-width:760px){
  nav{padding:18px 22px;flex-direction:column;gap:14px;}
  .menu{gap:14px;flex-wrap:wrap;justify-content:center;}

  .home-hero{padding:72px 22px 64px;}
  .home-hero .title{font-size:60px;}
  .home-hero .facade{height:240px;margin-top:44px;}

  .page-hero,.intro,.details,.closing,.forward,.longform,.in-prep,.archive-section,.dedication{
    padding-left:22px;padding-right:22px;
  }
  .hero-figure{height:280px;}
  .era{grid-template-columns:1fr;}
  .era .figure{min-height:300px;}
  .era .text{padding:48px 28px;}
  .era.flip .figure{order:2;}
  .era.flip .text{order:1;}

  .split{grid-template-columns:1fr;}
  .split .half{padding:48px 28px;min-height:auto;}
  .split .half + .half{border-left:0;border-top:0.5px solid rgba(245,232,220,0.18);}

  .detail-grid{grid-template-columns:repeat(2,1fr);}
  .longform h2{font-size:25px;}
  .in-prep h1{font-size:40px;}
  footer{flex-direction:column;gap:10px;text-align:center;}
  .timeline .row{grid-template-columns:78px 1fr;gap:14px;}
}