
/* ---------- hero ---------- */
.d4-hero{display:grid;background:var(--deep-2)}
@media(min-width:1000px){.d4-hero{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)}}
.d4-hero__copy{padding:clamp(3rem,7vw,6.5rem) var(--pad) clamp(2rem,4vw,3rem);display:flex;flex-direction:column;justify-content:center}
.d4-hero__copy>div{width:100%;max-width:40rem;margin-inline:auto}
@media(min-width:1000px){
  .d4-hero__copy{padding-left:max(var(--pad),calc((100vw - var(--shell)) / 2 + var(--pad)))}
  .d4-hero__copy>div{margin-inline:0;padding-right:clamp(1rem,3vw,3.5rem)}
}
.d4-hero h1{color:var(--paper);margin:1.6rem 0 0;
  font-size:clamp(2.5rem,1.3rem + 4.6vw,5rem);line-height:.95;letter-spacing:-.035em}
.d4-hero h1 em{font-style:italic;color:var(--sage-soft);display:block}
.d4-hero__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.25rem}
.d4-hero__media{position:relative;min-height:clamp(360px,62vw,100%)}
.d4-hero__media .mm-slot{position:absolute;inset:0;border-radius:0}
.d4-hero__media .mm-slot img{height:100%}
.d4-hero__rail{grid-column:1/-1;border-top:1px solid var(--hair-light)}

/* ---------- overture ---------- */
.d4-overture{padding-block:clamp(3rem,7vw,5.5rem);border-bottom:1px solid var(--hair)}
.d4-overture__grid{display:grid;gap:clamp(1.25rem,3vw,4rem)}
@media(min-width:1000px){.d4-overture__grid{grid-template-columns:minmax(0,.28fr) minmax(0,1fr)}}
.d4-overture .mm-body{font-size:clamp(1.0625rem,1rem + .35vw,1.3rem);line-height:1.68;color:var(--ink);font-weight:300;column-gap:clamp(2rem,4vw,4rem)}
@media(min-width:900px){.d4-overture .mm-body{column-count:2}}
.d4-overture__mark{font-family:var(--serif);font-style:italic;font-size:clamp(2.5rem,2rem + 2.6vw,4.25rem);line-height:.9;letter-spacing:-.035em;color:var(--deep);margin:0}

/* ---------- filmstrip ---------- */
.d4-strip{padding-block:clamp(2.5rem,5vw,4rem);background:var(--mist);border-bottom:1px solid var(--hair);overflow:hidden}
.d4-strip__grid{display:grid;gap:clamp(1.25rem,3vw,3rem);align-items:center}
@media(min-width:1000px){.d4-strip__grid{grid-template-columns:minmax(0,.26fr) minmax(0,1fr)}}
.d4-strip h2{font-size:clamp(1.4rem,1.2rem + 1vw,2rem);line-height:1.06;letter-spacing:-.028em;margin:.85rem 0 1.15rem}
.d4-strip h2 em{font-style:italic;color:var(--sage-ink)}
.d4-strip__track{display:flex;gap:.6rem;overflow-x:auto;scrollbar-width:none;padding-bottom:.25rem}
.d4-strip__track::-webkit-scrollbar{display:none}
.d4-strip__track>*{flex:0 0 clamp(140px,26vw,200px)}

/* ---------- typographic chapter ---------- */
.d4-chapter{padding-block:clamp(2.5rem,6vw,4.5rem);background:var(--deep);color:var(--paper)}
.d4-chapter__row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem}
.d4-chapter__title{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--paper);
  font-size:clamp(2.05rem,1.1rem + 2.8vw,3.4rem);line-height:.94;letter-spacing:-.03em;margin:.7rem 0 0}
.d4-chapter__meta{display:flex;gap:2rem;padding-bottom:.5rem;
  font:500 .625rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:rgba(243,255,239,.66)}

/* chapter note */
.d4-note{padding-block:clamp(2.5rem,5vw,4rem);background:var(--mint);border-bottom:1px solid var(--hair)}
.d4-note__grid{display:grid;gap:clamp(1.25rem,3vw,4rem)}
@media(min-width:1000px){.d4-note__grid{grid-template-columns:minmax(0,.28fr) minmax(0,1fr)}}
.d4-note h2{font-size:clamp(1.55rem,1.3rem + 1.4vw,2.35rem);line-height:1.06;letter-spacing:-.028em;margin:.85rem 0 0}

/* ---------- folio sections ---------- */
.d4-sec{padding-block:clamp(2.75rem,5.5vw,4.5rem);border-bottom:1px solid var(--hair)}
.d4-folio{display:grid;gap:clamp(1.25rem,3vw,3rem)}
@media(min-width:1000px){
  .d4-folio{grid-template-columns:minmax(0,.26fr) minmax(0,1fr)}
  .d4-folio__aside{position:sticky;top:150px;align-self:start;padding-right:clamp(1rem,2vw,2rem);
    border-right:1px solid var(--hair)}
}
.d4-folio__aside h2{font-size:clamp(1.75rem,1.4rem + 1.7vw,2.7rem);line-height:1;letter-spacing:-.03em;margin:.85rem 0 .85rem}
.d4-folio__tally{display:flex;align-items:baseline;gap:.5rem;color:var(--muted)}
.d4-folio__tally b{font-family:var(--serif);font-weight:400;font-size:1.6rem;line-height:1;color:var(--sage-ink)}
.d4-folio__tally span{font:500 .625rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase}
.d4-folio__pic{margin:0 0 1.35rem}
.d4-folio__pic .mm-slot{aspect-ratio:4/5}

/* ---------- feature: full-bleed half ---------- */
.d4-feature{border-bottom:1px solid var(--hair)}
.d4-feature__split{display:grid}
@media(min-width:1000px){
  .d4-feature__split{grid-template-columns:1fr 1fr;align-items:stretch}
  .d4-feature__split.is-flip .d4-feature__media{order:2}
}
.d4-feature__media{position:relative;min-height:clamp(300px,46vw,600px)}
.d4-feature__media .mm-slot{position:absolute;inset:0;border-radius:0}
.d4-feature__media .mm-slot img{height:100%}
.d4-feature__copy{padding:clamp(2.25rem,5vw,4.5rem) var(--pad);display:flex;flex-direction:column;justify-content:center}
.d4-feature__copy>div{width:100%;max-width:36rem}
@media(min-width:1000px){
  .d4-feature__split:not(.is-flip) .d4-feature__copy{padding-right:max(var(--pad),calc((100vw - var(--shell)) / 2 + var(--pad)))}
  .d4-feature__split.is-flip .d4-feature__copy{padding-left:max(var(--pad),calc((100vw - var(--shell)) / 2 + var(--pad)));justify-items:end}
  .d4-feature__split.is-flip .d4-feature__copy>div{margin-left:auto}
}
.d4-feature__copy h2{font-size:clamp(1.9rem,1.45rem + 2.1vw,3.1rem);line-height:1;letter-spacing:-.032em;margin:.9rem 0 1.15rem}
.d4-feature__index{padding-block:clamp(2rem,4vw,3rem)}

/* ---------- engraved index ---------- */
.d4-idx{margin-top:clamp(1.5rem,3vw,2.25rem)}
.d4-idx__label{margin:0 0 1rem;font:500 .5625rem/1 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}
.d4-idx ul{list-style:none;margin:0;padding:0;display:grid;gap:0 clamp(1.5rem,3.5vw,3.5rem)}
@media(min-width:620px){.d4-idx ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.d4-idx ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
.d4-idx a{display:flex;align-items:baseline;gap:.4rem;padding:.5rem 0;text-decoration:none;color:var(--ink);
  font-family:var(--serif);font-size:1.0625rem;line-height:1.3;transition:color .28s var(--ease)}
.d4-idx a>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d4-idx a::after{content:"";flex:1;min-width:1rem;border-bottom:1px dotted var(--line);transform:translateY(-.3em);transition:border-color .28s}
.d4-idx a i{font-size:.7rem;color:var(--sage);opacity:0;transform:translateX(-5px);transition:all .3s var(--slow)}
.d4-idx a:hover{color:var(--sage-ink)}
.d4-idx a:hover::after{border-bottom-color:var(--sage-soft)}
.d4-idx a:hover i{opacity:1;transform:none}
.d4-idx--dark a{color:rgba(243,255,239,.9)}
.d4-idx--dark a::after{border-bottom-color:rgba(243,255,239,.28)}
.d4-idx--dark a:hover{color:var(--paper)}
.d4-idx--dark .d4-idx__label{color:rgba(243,255,239,.55)}

/* ---------- outro ---------- */
.d4-outro{padding-block:clamp(3.5rem,7vw,6rem);background:var(--deep-2)}
.d4-outro__grid{display:grid;gap:clamp(1.75rem,4vw,4rem);align-items:center}
@media(min-width:1000px){.d4-outro__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.d4-outro h2{color:var(--paper);font-size:clamp(1.9rem,1.45rem + 2.2vw,3.2rem);line-height:1.02;letter-spacing:-.032em;margin:1.1rem 0 1.2rem;max-width:17ch}
.d4-outro h2 em{font-style:italic;color:var(--sage-soft)}
.d4-outro .mm-body{color:rgba(243,255,239,.82);max-width:54ch}
.d4-outro__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.d4-outro__pics{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.d4-outro__pics>*:first-child{transform:translateY(1.5rem)}
@media(max-width:640px){.d4-outro__pics>*:first-child{transform:none}}
