/* V3-final executive layer (Sofia). Overrides only; loads after Madison's inline styles. */
:root{--u:8px;--r-sm:12px;--r-lg:40px;--dur-1:200ms;--dur-2:400ms;--dur-3:600ms;--dur-pulse:2400ms;--ease-out:cubic-bezier(.2,.8,.2,1);--line:rgba(2,66,42,.14)}
:focus-visible{outline:3px solid var(--sprout);outline-offset:3px;border-radius:6px}
::selection{background:var(--sprout);color:var(--kale)}

/* Label band: full-width color strip opening each chapter, wipes in scaleX 0 to 1 */
.band{display:flex;height:12px;width:100%;transform-origin:left;transform:scaleX(0);transition:transform var(--dur-3) var(--ease-out)}
.band i{flex:1}.band.in{transform:none}
.band i:nth-child(1){background:var(--c1,var(--sprout))}.band i:nth-child(2){background:var(--c2,var(--mint))}.band i:nth-child(3){background:var(--c3,var(--thistle))}.band i:nth-child(4){background:var(--c4,var(--blue))}.band i:nth-child(5){background:var(--c5,var(--carrot))}

/* Four paths: equal weight, every card a solid palette fill */
.p-inv{background:var(--carrot);box-shadow:none}
.path{transition:transform var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out)}
.path:hover{transform:translateY(-8px);box-shadow:0 24px 48px -24px rgba(2,66,42,.45)}
.path .btn{transition:transform var(--dur-2) var(--ease-out),background var(--dur-1)}

/* Photo slots: swap src only. Placeholder = palette fill + label icon, never stock */
.slot{position:relative;overflow:hidden;border-radius:var(--r);background:var(--slot-fill,var(--mint));aspect-ratio:var(--ar,4/5)}
.slot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:none;opacity:1}
.slot.empty>img{display:none}
.slot .ph{position:absolute;inset:0;display:none;place-items:center;align-content:center;gap:16px;color:var(--kale)}
.slot.empty .ph{display:grid}
.slot .ph img{position:static;width:96px;height:96px;object-fit:contain}
.slot .ph span{font:700 12px/1.3 var(--m);letter-spacing:.08em;text-transform:uppercase;text-align:center}

/* Manifesto photo: framed, full color, no wallpaper dimming */
.mani{background:var(--ivory)}
.mani .img{margin:var(--pad);margin-right:0;border-radius:var(--r);min-height:auto}
.mani .img img{inset:0;height:100%}
@media(max-width:900px){.mani .img{margin:20px 20px 0;aspect-ratio:4/5;min-height:0}}

/* Horizontal chapter photos: inset frame on panel color */
.panel .pi:not(.art){margin:16px;border-radius:calc(var(--r) - 8px)}
@media(max-width:900px){.panel .pi:not(.art){margin:12px 12px 0;min-height:0;aspect-ratio:4/3}}

/* Proof band: tabular, editorial */
.proof-row b{font-variant-numeric:tabular-nums}

/* Buttons: magnetic movement is JS; add press feedback */
.btn{transition:background var(--dur-1),color var(--dur-1),box-shadow var(--dur-1),transform var(--dur-2) var(--ease-out)}
.btn:active{transform:scale(.97)}

/* Sticky mobile Eat/Grow bar */
.mbar{display:none}
@media(max-width:620px){
 .mbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:55;padding:6px;border-radius:999px;background:rgba(2,66,42,.94);backdrop-filter:blur(12px);box-shadow:0 12px 32px -12px rgba(0,0,0,.45);transform:translateY(140%);transition:transform var(--dur-2) var(--ease-out)}
 .mbar.on{transform:none}
 .mbar .btn{min-height:48px;font-size:15px}
 .mbar .btn-line{color:var(--ivory)}
 footer{padding-bottom:96px!important}
 nav.barmode .pills{opacity:0;pointer-events:none;transition:opacity var(--dur-1)}
 .findus{row-gap:12px}
 footer a{padding-block:6px;display:inline-block}
}

/* Reduced motion: everything visible and static */
@media (prefers-reduced-motion:reduce){
 .band{transform:none!important;transition:none!important}
 .path:hover,.btn:active{transform:none}
 .mbar{transition:none}
}
.rm .band{transform:none}
@media(min-width:901px){.mani .img.slot,.panel .pi.slot{aspect-ratio:auto}}