/*  =====================================================
    makeovers-unscoped.css
    Re-declares every makeovers component style WITHOUT
    the Astro-scoped [data-astro-cid-*] selectors.
    ===================================================== */

/* ─── Doodle animations (chapter-doodles) ─── */
.chapter-doodles{display:none}
@media(min-width:1440px){
  .chapter-doodles{display:block;position:absolute;inset:0;pointer-events:none;z-index:0;opacity:0;transition:opacity .55s ease}
  .chapter-doodles.live{opacity:1}
  .doodle{position:absolute;width:clamp(3.25rem,4.6vw,4.5rem);height:auto;opacity:.55}
  .doodle-ra,.doodle-rb{left:calc(100% + clamp(1.25rem,2.4vw,3rem))}
  .doodle-la,.doodle-lb{right:calc(100% + clamp(1rem,2vw,2.5rem))}
  .doodle-ra{top:clamp(7rem,16%,14rem);transform:rotate(-7deg)}
  .doodle-la{top:clamp(11rem,26%,20rem);transform:rotate(6deg);width:clamp(2.75rem,3.8vw,3.75rem)}
  .doodle-rb{top:58%;transform:rotate(5deg);width:clamp(2.75rem,3.8vw,3.75rem)}
  .doodle-lb{top:72%;transform:rotate(-5deg)}
  .doodle path{stroke-dasharray:1;stroke-dashoffset:1}
  .chapter-doodles.live .doodle path{animation:doodle-draw .8s ease-out forwards;animation-delay:calc(var(--slot, 0) * .45s + var(--d, 0) * .22s + .15s)}
  .chapter-doodles.bye .doodle path{stroke-dashoffset:0}
  @media(prefers-reduced-motion:reduce){
    .chapter-doodles{transition:none}
    .doodle path{stroke-dashoffset:0}
    .chapter-doodles.live .doodle path{animation:none}
  }
}
@keyframes doodle-draw{to{stroke-dashoffset:0}}

/* ─── Arch rail (photo carousel) ─── */
.arch-rail{--arch-w:clamp(190px,24vw,260px);overflow:clip;mask-image:linear-gradient(to right,transparent 0%,black 5%,black 95%,transparent 100%)}
.arch-track{display:flex;align-items:flex-start;gap:clamp(1.1rem,2.4vw,1.75rem);width:max-content;padding:.75rem 0 .5rem;animation:arch-drift calc(var(--rail-count) * 13s) linear infinite}
.arch-rail--reverse .arch-track{animation-direction:reverse}
@keyframes arch-drift{0%{transform:translate(0)}to{transform:translate(calc(-50% - (clamp(1.1rem,2.4vw,1.75rem)/2)))}}
.arch-item{width:var(--arch-w);flex:none;transform-origin:center 80%;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.arch-item:nth-child(4n+1){transform:rotate(-1.7deg)}
.arch-item:nth-child(4n+2){transform:rotate(1.3deg) translateY(6px)}
.arch-item:nth-child(4n+3){transform:rotate(-1deg) translateY(3px)}
.arch-item:nth-child(4n+4){transform:rotate(1.9deg)}
.arch-trigger{display:block;width:100%;padding:0;border:1px solid var(--color-line);border-radius:calc(var(--arch-w) / 2) calc(var(--arch-w) / 2) 10px 10px;overflow:hidden;background:var(--color-aqua);cursor:pointer;box-shadow:0 14px 30px -16px color-mix(in srgb,var(--color-ink) 38%,transparent);transition:box-shadow .35s ease}
.arch-item--ghost .arch-trigger{cursor:default}
.arch-img{display:block;width:100%;aspect-ratio:4/5.4;object-fit:cover}
.arch-rail:hover .arch-track{animation-play-state:paused}
.arch-rail:focus-within{overflow-x:auto;scrollbar-width:none}
.arch-rail:focus-within .arch-track{animation:none}
.arch-item:hover,.arch-item:focus-within{transform:rotate(0) translateY(-8px);z-index:2}
.arch-item:hover .arch-trigger,.arch-item:focus-within .arch-trigger{box-shadow:0 26px 44px -18px color-mix(in srgb,var(--color-ink) 48%,transparent)}
.arch-caption{margin:.7rem .35rem 0;text-align:center;font-size:var(--text-small);line-height:1.45;color:var(--color-ink-soft)}
.arch-caption:after{content:"";display:block;width:2.4rem;height:3px;margin:.45rem auto 0;border-radius:2px;background:var(--accent);transform:scaleX(0);transform-origin:center;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.arch-item:hover .arch-caption:after,.arch-item:focus-within .arch-caption:after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){
  .arch-rail{overflow-x:auto;mask-image:none;scrollbar-width:thin}
  .arch-track{animation:none}
  .arch-item,.arch-item:hover,.arch-item:focus-within{transform:none;transition:none}
  .arch-item--ghost{display:none}
  .arch-caption:after{transform:scaleX(1);transition:none}
}

/* ─── Before/After slider ─── */
.ba{aspect-ratio:4/3;background-color:var(--color-paper-deep)}
.ba-before{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba-line{left:var(--pos);width:2px;transform:translate(-1px);background-color:var(--color-paper);box-shadow:0 0 0 1px color-mix(in srgb,var(--color-ink) 25%,transparent)}
.ba-knob{position:absolute;top:50%;left:50%;height:2.5rem;width:2.5rem;transform:translate(-50%,-50%);border-radius:9999px;background-color:var(--color-paper);box-shadow:0 4px 16px color-mix(in srgb,var(--color-ink) 35%,transparent)}
.ba-knob:before,.ba-knob:after{content:"";position:absolute;top:50%;width:0;height:0;border-block:5px solid transparent}
.ba-knob:before{left:.5rem;border-right:7px solid var(--color-navy);transform:translateY(-50%)}
.ba-knob:after{right:.5rem;border-left:7px solid var(--color-navy);transform:translateY(-50%)}
.ba-range{margin:0}
.ba-range::-webkit-slider-thumb{appearance:none;width:2.75rem;height:100%;cursor:ew-resize}
.ba-range::-moz-range-thumb{width:2.75rem;height:100%;border:0;background:transparent;cursor:ew-resize}
.ba-range:focus-visible+.ba-tag-before,.ba-range:focus-visible~.ba-line .ba-knob{outline:3px solid var(--color-navy);outline-offset:2px}
.ba-tag{position:absolute;bottom:.75rem;padding:.25rem .625rem;border-radius:9999px;font-size:var(--text-small);font-weight:600;color:var(--color-paper);background-color:color-mix(in srgb,var(--color-ink) 70%,transparent);pointer-events:none}
.ba-tag-before{left:.75rem}
.ba-tag-after{right:.75rem}

/* ─── Diptych (side-by-side photos) ─── */
.diptych{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(.75rem,2vw,1.5rem);margin:0}
.diptych-half{position:relative}
.diptych-frame{aspect-ratio:4/3;overflow:hidden;border-radius:3px}
.diptych-img{display:block;width:100%;height:100%;object-fit:cover}
.diptych-ribbon{position:absolute;left:50%;bottom:-.55rem;z-index:1;max-width:92%;padding:.32rem 1.35rem .38rem;font-family:var(--font-label);font-size:var(--text-small);font-weight:600;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--color-paper);background:var(--color-ink);clip-path:polygon(0% 0%,100% 0%,calc(100% - .65rem) 50%,100% 100%,0% 100%,.65rem 50%);box-shadow:0 8px 18px -8px color-mix(in srgb,var(--color-ink) 55%,transparent)}
.diptych-ribbon--tiltl{transform:translate(-50%) rotate(-1.6deg)}
.diptych-ribbon--tiltr{transform:translate(-50%) rotate(1.4deg)}
.diptych-caption{grid-column:1/-1;margin-top:1.1rem;text-align:center;font-size:var(--text-small);color:var(--color-ink-soft)}
@media(max-width:640px){.diptych{grid-template-columns:1fr;grid-template-rows:auto auto;row-gap:1.4rem}}

/* ─── Makeover chapter & anchor ─── */
.makeover-chapter{position:relative}
.anchor{position:relative;height:clamp(280px,34vw,420px);overflow:hidden;border-radius:3px}
.anchor-img{width:100%;height:100%;object-fit:cover;display:block}
.anchor-scrim{position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--color-ink) 94%,transparent) 0%,color-mix(in srgb,var(--color-ink) 76%,transparent) 48%,transparent 100%),linear-gradient(to top,color-mix(in srgb,var(--color-ink) 62%,transparent) 0%,transparent 44%)}
.anchor-text{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(1.25rem,3vw,2.5rem)}
.anchor-line{font-family:var(--font-display);font-weight:700;font-size:var(--text-h2);line-height:1.05;color:var(--color-paper);max-width:20ch;margin-top:.35rem;text-shadow:0 2px 18px color-mix(in srgb,var(--color-ink) 55%,transparent)}
@media(max-width:640px){
  .anchor-scrim{background:linear-gradient(180deg,transparent 0%,color-mix(in srgb,var(--color-ink) 78%,transparent) 45%,color-mix(in srgb,var(--color-ink) 95%,transparent) 100%)}
  .anchor-line{max-width:none}
}

/* ─── Collapsible gallery (rest/details) ─── */
.rest{margin-top:1.25rem}
.rest-summary{display:inline-block;cursor:pointer;font-family:var(--font-label);text-transform:uppercase;letter-spacing:.16em;font-size:var(--text-small);color:var(--color-ink);border:1.5px solid var(--color-ink);border-radius:2px;padding:.6rem 1.15rem;list-style:none}
.rest-summary::-webkit-details-marker{display:none}
.rest-summary:hover{background:var(--color-ink);color:var(--color-paper)}
.rest-close,.rest[open] .rest-open{display:none}
.rest[open] .rest-close{display:inline}

/* ─── Lightbox ─── */
.lightbox{opacity:0;transition:opacity .2s ease}
.lightbox[data-open]{opacity:1}
.lightbox-backdrop{background:color-mix(in srgb,var(--color-ink) 92%,transparent)}
@media(prefers-reduced-motion:reduce){.lightbox{transition:none}}

/* ─── Memorial portrait ─── */
.memorial-portrait{width:clamp(12rem,42vw,15rem);padding:.5rem;border-radius:14px;background:var(--color-paper);border:1px solid var(--color-line);box-shadow:0 22px 55px color-mix(in srgb,var(--color-ink) 22%,transparent)}

/* ─── Site header (unscoped) ─── */
.site-header .wordmark,.site-header .nav-link,.site-header .menu-btn{color:var(--color-paper)}
.site-header .logo-color,.site-header[data-scrolled] .logo-white{display:none}
.site-header[data-scrolled] .logo-color{display:inline}
.logo-link--big{transform-origin:top left;opacity:0;transition:opacity .45s ease}
.logo-link--big.ready{opacity:1}
.logo-link--big .logo-big{filter:drop-shadow(0 0 24px var(--color-paper)) drop-shadow(0 0 10px var(--color-paper)) drop-shadow(0 1px 2px color-mix(in srgb,var(--color-ink) 30%,transparent))}
@media(prefers-reduced-motion:reduce){.logo-link--big{transition:none}}
.site-header .nav-link{position:relative;transition:opacity .2s ease}
.site-header .nav-link:after{content:"";position:absolute;left:0;right:0;bottom:.2rem;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.site-header .nav-link:hover:after,.site-header .nav-link[aria-expanded=true]:after{transform:scaleX(1)}
[data-dropdown-menu]{position:absolute}
[data-dropdown-menu]:before{content:"";position:absolute;left:0;right:0;top:-.85rem;height:.85rem}
.site-header:before{content:"";position:absolute;inset:0 0 auto;height:10.5rem;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,color-mix(in srgb,var(--color-ink) 80%,transparent) 0%,color-mix(in srgb,var(--color-ink) 56%,transparent) 46%,transparent 100%);transition:opacity .3s ease}
.site-header[data-scrolled]:before,.site-header[data-solid]:before{opacity:0}
.site-header[data-scrolled]{background:color-mix(in srgb,var(--color-paper) 90%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-line);box-shadow:0 1px 24px #1a17140f}
.site-header[data-scrolled] .site-bar{padding-top:.9rem;padding-bottom:.9rem}
.site-header[data-scrolled] .wordmark,.site-header[data-scrolled] .nav-link,.site-header[data-scrolled] .menu-btn{color:var(--color-ink)}
@media(prefers-reduced-motion:reduce){.site-header,.site-bar,.site-header .nav-link:after{transition:none}}

/* ─── Mobile nav ─── */
.mobile-nav{opacity:0;transform:translateY(-8px);transition:opacity .25s ease,transform .25s ease}
.mobile-nav[data-open]{opacity:1;transform:translateY(0)}
@media(prefers-reduced-motion:reduce){.mobile-nav{transition:none;transform:none}}

/* ─── Footer social ─── */
.footer-social{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:9999px;background:var(--color-paper);color:var(--color-navy);transition:transform .2s ease,background-color .2s ease}
.footer-social:hover,.footer-social:focus-visible{background:var(--color-yellow);transform:translateY(-2px) scale(1.06)}
@media(prefers-reduced-motion:reduce){.footer-social,.footer-social:hover,.footer-social:focus-visible{transform:none;transition:none}}

/* ─── Footprints ─── */
.foot-field{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.foot-field img{position:absolute;height:var(--s);width:auto;opacity:0;transform:rotate(var(--r));animation:foot-step var(--d) ease-in-out var(--delay) infinite;will-change:opacity}
@keyframes foot-step{0%,to{opacity:0}20%{opacity:.55}55%{opacity:.55}}
@supports(animation-timeline:scroll()){
  .foot-field img{animation:foot-stamp linear both;animation-timeline:scroll(root);animation-range:calc(var(--p) * 82%) calc(var(--p) * 82% + 18%)}
  @keyframes foot-stamp{0%{opacity:0;transform:rotate(var(--r)) scale(1.18)}22%{opacity:.55;transform:rotate(var(--r)) scale(1)}70%{opacity:.55;transform:rotate(var(--r)) scale(1)}to{opacity:0;transform:rotate(var(--r)) scale(1)}}
}
@media(prefers-reduced-motion:reduce){.foot-field img{animation:none;opacity:.35}}

/* ─── Trail nav ─── */
main.banded>nav.trail-nav{position:sticky;top:5rem;z-index:40;width:fit-content;max-width:calc(100% - 2rem);margin-inline:auto;padding:.5rem 1rem .55rem;border-radius:999px;background:var(--color-paper);box-shadow:0 10px 26px -14px color-mix(in srgb,var(--color-ink) 45%,transparent)}
.trail-nav .trail-scroll{position:relative;overflow-x:auto;scrollbar-width:none}
.trail-nav .trail-scroll::-webkit-scrollbar{display:none}
.trail-nav .trail-list{display:flex;align-items:center;gap:.25rem;width:max-content;margin:0 auto}
.trail-nav .trail-stop{position:relative;z-index:1;display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .55rem .45rem;font-family:var(--font-label);font-size:var(--text-small);letter-spacing:.06em;color:var(--color-ink-soft);white-space:nowrap;border-radius:999px;text-decoration:none}
.trail-nav .trail-stop:hover{color:var(--color-ink)}
.trail-nav .trail-stop[aria-current=true]{color:var(--color-ink);font-weight:700}
.trail-nav .trail-dot{width:7px;height:7px;border-radius:999px;background:color-mix(in srgb,var(--color-ink) 28%,transparent);transition:background-color .3s ease}
.trail-nav .trail-stop[aria-current=true] .trail-dot{background:currentColor}
.trail-nav .trail-marker{position:absolute;left:0;top:0;height:8px;width:3.5rem;color:var(--color-coral);pointer-events:none;transition:transform .45s cubic-bezier(.22,1,.36,1),width .45s cubic-bezier(.22,1,.36,1),color .3s ease}
.trail-nav .trail-caption{min-height:1.15rem;margin:.15rem 0 0;text-align:center;font-size:.72rem;letter-spacing:.04em;color:var(--color-ink-soft)}
@media(min-width:1440px){
  main.banded>nav.trail-nav{position:fixed;top:50%;left:clamp(.75rem,1.8vw,2rem);transform:translateY(-50%);margin-inline:0;width:auto;max-width:none;padding:.9rem .9rem 1rem;border-radius:999px}
  .trail-nav .trail-scroll{overflow:visible}
  .trail-nav .trail-list{flex-direction:column;align-items:flex-start;gap:.3rem;width:auto;margin:0}
  .trail-nav .trail-caption{display:none}
}
@media(prefers-reduced-motion:reduce){.trail-nav .trail-marker,.trail-nav .trail-dot{transition:none}}

/* ─── Scroll-margin for chapter anchors ─── */
article.makeover-chapter{scroll-margin-top:10rem}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* ─── Brush-underline in anchor ─── */
.anchor-mask{position:absolute;inset:0;pointer-events:none}
.anchor-brush-edge{position:absolute;inset:0;pointer-events:none}