/* Blog e pagine secondarie generate da contenuti/ — stesso linguaggio del design Diva */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #0B0B0B; color: #F4F0EA; font-family: 'Jost', system-ui, sans-serif; overflow-x: hidden; }
* { box-sizing: border-box; }
a { color: inherit; text-decoration: none; }
a:hover { color: #A08B6C; }
img { display: block; max-width: 100%; }
::selection { background: #A08B6C; color: #0B0B0B; }

.pg { background: #0B0B0B; }
.pg-wrap { max-width: 1400px; margin: 0 auto; }
.pg-center { display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(20px, 3vw, 34px); max-width: 900px; }
.pg-crumb { padding: 18px clamp(20px, 4vw, 56px); font-size: 10px; letter-spacing: .24em; color: #6E6862; }
.pg-crumb span { color: #3A3733; }
.pg-eyebrow { display: block; font-size: 10px; letter-spacing: .42em; color: #8C857C; }
.pg-h1 { margin: 0; font-family: 'Bodoni Moda', serif; font-weight: 400; font-size: clamp(34px, 5.6vw, 76px); line-height: 1.05; letter-spacing: -.018em; padding-bottom: .06em; text-wrap: balance; }
.pg-h1 em, .pg-h2 em { font-weight: 400; color: #A08B6C; }
.pg-h2 { margin: 0; font-family: 'Bodoni Moda', serif; font-weight: 400; font-size: clamp(26px, 4.4vw, 56px); line-height: 1.1; letter-spacing: -.015em; }
.pg-big { font-size: clamp(28px, 5.4vw, 72px); }
.pg-lead { margin: 0; font-size: 15px; line-height: 1.8; color: #B8B2A8; font-weight: 300; max-width: 540px; text-wrap: pretty; }
.pg-meta { font-size: 10px; letter-spacing: .24em; color: #6E6862; }

.pg-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.pg-btn { display: inline-flex; align-items: center; gap: 14px; font-size: 11px; letter-spacing: .24em; padding: 18px 30px; background: #F4F0EA; color: #0B0B0B; transition: background 350ms ease, color 350ms ease; }
.pg-btn span { font-family: 'Bodoni Moda', serif; }
.pg-btn:hover { background: #A08B6C; color: #0B0B0B; }
.pg-btn-line { background: transparent; color: #F4F0EA; border: 1px solid rgba(244,240,234,.42); padding: 17px 26px; }
.pg-btn-line:hover { background: #F4F0EA; color: #0B0B0B; }

/* Hero: testo + foto ritratto */
.pg-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(24px, 4vw, 64px); align-items: center; padding: clamp(20px, 4vw, 56px) clamp(20px, 4vw, 56px) clamp(60px, 9vw, 110px); max-width: 1400px; margin: 0 auto; }
.pg-hero-solo { grid-template-columns: minmax(0,1fr); max-width: 1100px; margin: 0; }
.pg-hero-txt { display: flex; flex-direction: column; gap: clamp(18px, 2.6vw, 30px); align-items: flex-start; }
.pg-hero-img { width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 12%; }

/* Corpo del testo su avorio */
.pg-chiaro { background: #F4F0EA; color: #0B0B0B; padding: clamp(60px, 9vw, 120px) clamp(20px, 4vw, 56px); }
.pg-testo { max-width: 720px; margin: 0 auto; font-size: 17px; line-height: 1.85; font-weight: 300; color: #2A2723; }
.pg-testo > :first-child { margin-top: 0; }
.pg-testo p { margin: 0 0 1.3em; text-wrap: pretty; }
.pg-testo h2 { font-family: 'Bodoni Moda', serif; font-weight: 400; font-size: clamp(26px, 3.4vw, 40px); line-height: 1.15; letter-spacing: -.012em; color: #0B0B0B; margin: 1.9em 0 .6em; }
.pg-testo h3 { font-family: 'Jost', sans-serif; font-weight: 500; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: #7A5C4B; margin: 2em 0 .7em; }
.pg-testo strong { font-weight: 500; color: #0B0B0B; }
.pg-testo em { font-style: italic; }
.pg-testo a { color: #7A5C4B; border-bottom: 1px solid rgba(122,92,75,.35); transition: border-color 300ms ease; }
.pg-testo a:hover { color: #0B0B0B; border-color: #0B0B0B; }
.pg-testo ul, .pg-testo ol { margin: 0 0 1.4em; padding-left: 1.2em; }
.pg-testo li { margin-bottom: .55em; padding-left: .3em; }
.pg-testo ul li::marker { color: #A08B6C; }
.pg-testo blockquote { margin: 2em 0; padding: 0 0 0 clamp(18px, 3vw, 32px); border-left: 1px solid #A08B6C; }
.pg-testo blockquote p { font-family: 'Bodoni Moda', serif; font-style: italic; font-size: clamp(21px, 2.6vw, 28px); line-height: 1.4; color: #0B0B0B; margin: 0; }
.art-fig { margin: 2.4em 0; display: flex; flex-direction: column; gap: 12px; }
.art-fig img { width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 12%; }
.art-fig figcaption { font-size: 12px; letter-spacing: .06em; color: #8C857C; }
.pg-correlati { margin-top: 3em; padding-top: 1.6em; border-top: 1px solid rgba(11,11,11,.14); display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: baseline; }
.pg-correlati .pg-eyebrow { width: 100%; }
.pg-testo .pg-correlati a { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; border: 0; color: #0B0B0B; }
.pg-testo .pg-correlati a:hover { color: #7A5C4B; }

/* Galleria */
.pg-gal { padding: clamp(60px, 9vw, 110px) clamp(20px, 4vw, 56px); }
.pg-gal-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: clamp(14px, 2vw, 26px); }
.pg-gal figure { margin: 0; display: flex; flex-direction: column; gap: 12px; }
.pg-gal img { width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; object-position: 50% 12%; }
.pg-gal figcaption { font-size: 12px; letter-spacing: .06em; color: #8C857C; }

/* FAQ */
.pg-faq { padding: clamp(70px, 10vw, 130px) clamp(20px, 4vw, 56px); border-top: 1px solid rgba(244,240,234,.1); }
.pg-faq .pg-wrap { max-width: 900px; display: flex; flex-direction: column; gap: clamp(18px, 2.6vw, 28px); }
.pg-faq-list { margin-top: clamp(10px, 2vw, 24px); border-top: 1px solid rgba(244,240,234,.14); }
.pg-faq details { border-bottom: 1px solid rgba(244,240,234,.14); }
.pg-faq summary { cursor: pointer; list-style: none; padding: 24px 40px 24px 0; position: relative; font-family: 'Bodoni Moda', serif; font-size: clamp(18px, 2.2vw, 24px); line-height: 1.35; }
.pg-faq summary::-webkit-details-marker { display: none; }
.pg-faq summary::after { content: '+'; position: absolute; right: 4px; top: 22px; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 24px; color: #A08B6C; transition: transform 300ms ease; }
.pg-faq details[open] summary::after { transform: rotate(45deg); }
.pg-faq details p { margin: 0 0 26px; font-size: 15px; line-height: 1.8; color: #B8B2A8; font-weight: 300; max-width: 720px; }

/* Chiusura */
.pg-cta { padding: clamp(70px, 11vw, 130px) clamp(20px, 4vw, 56px); border-top: 1px solid rgba(244,240,234,.1); }
.pg-cta p { margin: 0; font-size: 14px; line-height: 1.8; color: #8C857C; font-weight: 300; max-width: 460px; }
.pg-cta .pg-btns { justify-content: center; }

/* Blog */
.bl-sez { padding: clamp(50px, 8vw, 100px) clamp(20px, 4vw, 56px); border-top: 1px solid rgba(244,240,234,.1); }
.bl-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 40px; margin-bottom: clamp(30px, 5vw, 56px); }
.bl-head p { margin: 0; max-width: 420px; font-size: 14px; line-height: 1.8; color: #8C857C; font-weight: 300; }
.bl-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(30px, 4vw, 56px) clamp(16px, 2.4vw, 32px); }
.bl-card { display: flex; flex-direction: column; gap: 14px; }
.bl-img { display: block; overflow: hidden; }
.bl-img img { width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 12%; transition: transform 900ms cubic-bezier(.16,1,.3,1); }
.bl-card:hover .bl-img img { transform: scale(1.045); }
.bl-meta { font-size: 10px; letter-spacing: .24em; color: #6E6862; }
.bl-title { font-family: 'Bodoni Moda', serif; font-size: clamp(21px, 2.2vw, 27px); line-height: 1.2; color: #F4F0EA; transition: color 300ms ease; }
.bl-card:hover .bl-title { color: #A08B6C; }
.bl-ex { font-size: 14px; line-height: 1.7; color: #8C857C; font-weight: 300; }
.bl-leggi { padding: clamp(60px, 9vw, 110px) clamp(20px, 4vw, 56px); border-top: 1px solid rgba(244,240,234,.1); }
.bl-leggi .pg-eyebrow { margin-bottom: clamp(24px, 4vw, 44px); }

@media (max-width: 899px) {
  .pg-hero { grid-template-columns: minmax(0,1fr); }
  .pg-hero-img { aspect-ratio: 4/5; max-height: 78vh; }
  .pg-gal-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .bl-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 599px) {
  .bl-grid { grid-template-columns: minmax(0,1fr); }
  .pg-testo { font-size: 16px; }
  .pg-btn, .pg-btn-line { padding: 16px 22px; }
}
