/* ==========================================================================
   Theme "Archive" — editorial index / contact-sheet layout.
   Changes composition, not just colours: vertical sidebar navigation,
   typographic hero above a cinematic strip, film-strip highlights,
   single-column reading, contact-sheet gallery, numbered sections.
   ========================================================================== */
html body[data-theme="archive"],html[data-color-resolved="light"] body[data-theme="archive"]{--bg:#efebe3;--ink:#151413;--soft:#5d5852;--accent:#c2410c;--panel:#e4ded3;--line:#1514131f;--font:'DM Sans',system-ui,sans-serif;--radius:0px;--hero-size:clamp(64px,10.5vw,190px);--side:290px}
body[data-theme="archive"]{counter-reset:dwsec}
html[data-color-resolved="dark"] body[data-theme="archive"]:not(#x){--bg:#141311;--ink:#efe9de;--soft:#a69d90;--accent:#ff8a4c;--panel:#1f1d1a;--line:#efe9de24}
body[data-theme="archive"]{background:var(--bg);color:var(--ink)}
body[data-theme="archive"] ::selection{background:var(--accent);color:var(--bg)}

/* ---------- Desktop: sidebar layout ---------- */
@media (min-width:1051px){
  body[data-theme="archive"] .top{position:fixed;inset:0 auto 0 0;width:var(--side);height:100vh;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0;padding:38px 30px 30px;border-bottom:0;border-right:1px solid var(--line);background:var(--bg);backdrop-filter:none;overflow-y:auto}
  body[data-theme="archive"] .top .logo{font:italic 400 40px/1 'Playfair Display',serif;letter-spacing:-.03em;margin-bottom:8px}
  body[data-theme="archive"] .top .logo span{color:var(--accent)}
  body[data-theme="archive"] .top .logo::after{content:"Photography · Technology · Notes";display:block;margin-top:14px;font:400 10px/1.5 'DM Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);font-style:normal}
  body[data-theme="archive"] .nav{flex-direction:column;align-items:stretch;gap:0;width:100%;margin-top:44px;counter-reset:dwnav;flex:1}
  body[data-theme="archive"] .nav>a{counter-increment:dwnav;display:flex;align-items:baseline;gap:14px;padding:13px 0;border-top:1px solid var(--line);font:500 15px/1.2 'DM Sans',sans-serif;letter-spacing:0;text-transform:none}
  body[data-theme="archive"] .nav>a::before{content:counter(dwnav,decimal-leading-zero);font:10px 'DM Mono',monospace;color:var(--soft);min-width:20px}
  body[data-theme="archive"] .nav>a:hover{color:var(--accent);padding-left:6px;transition:padding .2s}
  body[data-theme="archive"] .nav .dw-explore{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0;font:500 15px 'DM Sans',sans-serif}
  body[data-theme="archive"] .nav .dw-explore__links{position:static!important;box-shadow:none!important;background:transparent!important;border:0!important;padding:8px 0 0 34px!important}
  body[data-theme="archive"] .nav #themeToggle{margin-top:auto;align-self:flex-start;border:1px solid var(--ink);color:var(--ink);background:transparent;font:11px 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;padding:11px 16px}
  body[data-theme="archive"] .nav .color-preference{margin-top:14px}
  body[data-theme="archive"] .shell,body[data-theme="archive"] .footer{margin-left:var(--side);max-width:none}
  body[data-theme="archive"] .switcher{left:calc(var(--side) + 20px)}
  body[data-theme="archive"] .music-dock{left:auto;right:22px}
}

/* ---------- Shared typography ---------- */
body[data-theme="archive"] .shell{overflow:visible}
body[data-theme="archive"] .eyebrow,body[data-theme="archive"] .about-section-kicker,body[data-theme="archive"] .dw-gallery-eyebrow{font:400 11px 'DM Mono',monospace;letter-spacing:.16em;color:var(--accent)}
body[data-theme="archive"] .section h2,body[data-theme="archive"] .about-hero h1,body[data-theme="archive"] .dw-gallery-collection h2{font-family:'Playfair Display',serif;font-weight:400;font-style:italic;letter-spacing:-.035em}
body[data-theme="archive"] .cta{background:transparent;color:var(--ink);border:1px solid var(--ink);border-radius:999px;padding:14px 22px}
body[data-theme="archive"] .cta:hover{background:var(--ink);color:var(--bg)}

/* Numbered sections, like an index */
body[data-theme="archive"] .shell>.section{counter-increment:dwsec;position:relative;padding:90px clamp(28px,5vw,90px) 90px clamp(90px,9vw,150px);border-top:1px solid var(--line)}
body[data-theme="archive"] .shell>.section::before{content:"§" counter(dwsec,decimal-leading-zero);position:absolute;left:clamp(28px,3vw,50px);top:98px;font:12px 'DM Mono',monospace;color:var(--accent);letter-spacing:.08em}

/* ---------- Home hero: headline on top, cinematic strip below, intro in columns ---------- */
body[data-theme="archive"] .hero{display:flex!important;flex-direction:column;min-height:auto;padding:70px clamp(28px,5vw,90px) 60px!important;gap:0}
body[data-theme="archive"] .hero-copy{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"title title" "eyebrow lead" ". cta";column-gap:6vw;order:1;max-width:none;width:100%}
body[data-theme="archive"] .hero-copy .eyebrow{grid-area:eyebrow;margin:34px 0 0}
body[data-theme="archive"] .hero h1{grid-area:title;font:400 var(--hero-size)/.86 'Playfair Display',serif!important;letter-spacing:-.06em!important;max-width:none;text-transform:none}
body[data-theme="archive"] .hero h1::first-letter{color:var(--accent);font-style:italic}
body[data-theme="archive"] .hero .lead{grid-area:lead;margin:30px 0 0;max-width:520px;font-size:17px;color:var(--soft)}
body[data-theme="archive"] .hero .lead p{margin:0 0 .6em}
body[data-theme="archive"] .hero-copy .cta{grid-area:cta;justify-self:start;margin-top:24px}
body[data-theme="archive"] .hero-visual{order:0;width:100%;height:clamp(240px,34vw,520px)!important;transform:none!important;margin:0 0 48px}
body[data-theme="archive"] .hero-visual .frame{border-radius:0}
body[data-theme="archive"] .hero-visual .frame:after{background:none}
body[data-theme="archive"] .hero-visual .frame img{filter:none}
body[data-theme="archive"] .stamp{left:auto;right:18px;bottom:16px;mix-blend-mode:difference}
body[data-theme="archive"] .hero-slide-controls{position:absolute;left:0;top:calc(100% + 10px);max-width:none!important}
body[data-theme="archive"] .hero-slide-controls button{background:transparent;border:0;border-bottom:1px solid transparent;border-radius:0;color:var(--soft);font:10px 'DM Mono',monospace;padding:4px 0;margin-right:16px}
body[data-theme="archive"] .hero-slide-controls button.is-active{color:var(--ink);border-bottom-color:var(--accent)}

/* ---------- Home highlights: film strip ---------- */
body[data-theme="archive"] .sectiontop{flex-direction:row-reverse;align-items:flex-start}
body[data-theme="archive"] .gallery{display:flex!important;gap:2px;overflow-x:auto;scroll-snap-type:x mandatory;padding:12px 0 18px;background:#0e0d0c;margin:0 calc(-1 * clamp(28px,5vw,90px));padding-left:12px}
body[data-theme="archive"] .gallery .photo{flex:0 0 min(46vw,560px);margin:0!important;scroll-snap-align:start;border-radius:0;background:#0e0d0c;min-height:0;counter-increment:dwframe}
body[data-theme="archive"] .gallery{counter-reset:dwframe}
body[data-theme="archive"] .gallery .photo img{height:min(34vw,380px)!important;filter:grayscale(.15)}
body[data-theme="archive"] .gallery .photo:hover img{transform:none;filter:none}
body[data-theme="archive"] .photocap{position:static;background:none;padding:10px 4px 0;color:#d8d2c6;justify-content:flex-start;gap:14px}
body[data-theme="archive"] .photocap::before{content:counter(dwframe,decimal-leading-zero) "A";font:10px 'DM Mono',monospace;color:#ff8a4c}

/* ---------- Story: single column, drop cap ---------- */
body[data-theme="archive"] .story{display:block;max-width:760px}
body[data-theme="archive"] .story>p,body[data-theme="archive"] .story>div:first-child{font:italic 400 clamp(22px,2.4vw,32px)/1.45 'Playfair Display',serif;color:var(--ink);margin-bottom:40px}
body[data-theme="archive"] .story>div:last-child p:first-child::first-letter{float:left;font:400 74px/.8 'Playfair Display',serif;color:var(--accent);margin:8px 10px 0 0}
body[data-theme="archive"] .story p{font-size:18px}

/* ---------- Photography page: contact sheet ---------- */
body[data-theme="archive"] .dw-gallery-banner{height:auto!important;min-height:0!important;padding:80px clamp(28px,5vw,90px) 30px!important;background:var(--bg)!important;color:var(--ink)!important;align-items:flex-end}
body[data-theme="archive"] .dw-gallery-banner__photo,body[data-theme="archive"] .dw-gallery-banner__overlay{display:none!important}
body[data-theme="archive"] .dw-gallery-banner h1{font:400 clamp(56px,8vw,140px)/.9 'Playfair Display',serif;letter-spacing:-.05em;color:var(--ink)}
body[data-theme="archive"] .dw-gallery-banner h1 em{color:var(--accent)}
body[data-theme="archive"] .dw-gallery-banner p,body[data-theme="archive"] .dw-gallery-banner__index{color:var(--soft)!important}
body[data-theme="archive"] .dw-gallery-discover{border-color:var(--ink)!important;color:var(--ink)!important;background:transparent!important}
body[data-theme="archive"] .dw-gallery-collection{padding-top:20px}
body[data-theme="archive"] .dw-gallery-masonry{columns:auto!important;display:grid!important;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:26px 18px;counter-reset:dwsheet}
body[data-theme="archive"] .dw-gallery-tile{margin:0!important;border-radius:0!important;background:transparent!important;counter-increment:dwsheet;box-shadow:none!important}
body[data-theme="archive"] .dw-gallery-tile img{aspect-ratio:1/1;object-fit:cover;width:100%;height:auto;outline:1px solid var(--line);outline-offset:6px;filter:saturate(.9)}
body[data-theme="archive"] .dw-gallery-tile:hover img{filter:none;outline-color:var(--accent)}
body[data-theme="archive"] .dw-gallery-tile__overlay{position:static!important;opacity:1!important;transform:none!important;background:none!important;color:var(--ink)!important;padding:14px 0 0!important;line-height:1.3}
body[data-theme="archive"] .dw-gallery-tile__overlay::before{content:counter(dwsheet,decimal-leading-zero);font:10px 'DM Mono',monospace;color:var(--accent);width:100%}
body[data-theme="archive"] .dw-gallery-tile__title{font:500 14px 'DM Sans',sans-serif}
body[data-theme="archive"] .dw-gallery-tile__category{font:10px 'DM Mono',monospace;color:var(--soft);text-transform:uppercase;letter-spacing:.1em}
body[data-theme="archive"] .dw-gallery-tile__view{display:none}
body[data-theme="archive"] .dw-gallery-filterbar{background:transparent!important;border:0!important;border-top:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;padding:16px 0!important}

/* ---------- About: index of chapters ---------- */
body[data-theme="archive"] .about-hero{padding:90px clamp(28px,5vw,90px) 60px}
body[data-theme="archive"] .about-today__grid,body[data-theme="archive"] .about-feature__grid,body[data-theme="archive"] .about-journey__heading{grid-template-columns:1fr!important}
body[data-theme="archive"] .about-timeline article{grid-template-columns:140px 1fr}
body[data-theme="archive"] .about-feature{background:transparent}
body[data-theme="archive"] .about-expertise{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 30px}
body[data-theme="archive"] .about-outro{text-align:left}

/* ---------- Projects & contact ---------- */
body[data-theme="archive"] .project-grid,body[data-theme="archive"] .dw-projects-page .projects{grid-template-columns:1fr!important;gap:0!important}
body[data-theme="archive"] .project,body[data-theme="archive"] .project-card{background:transparent!important;border:0!important;border-top:1px solid var(--line)!important;border-radius:0!important;padding:26px 0!important;display:grid;grid-template-columns:1fr 2fr auto;gap:24px;align-items:baseline}
body[data-theme="archive"] .contact-form input,body[data-theme="archive"] .contact-form textarea{background:transparent;border:0;border-bottom:1px solid var(--ink);padding:12px 0}

/* ---------- Footer: colophon ---------- */
body[data-theme="archive"] .footer{flex-direction:column;align-items:flex-start;gap:10px;padding:40px clamp(28px,5vw,90px) 110px;border-top:1px solid var(--ink)}
body[data-theme="archive"] .footer strong{font:italic 400 22px 'Playfair Display',serif}

/* ---------- Tablet & mobile ---------- */
@media (max-width:1050px){
  body[data-theme="archive"] .shell>.section{padding:60px 22px}
  body[data-theme="archive"] .shell>.section::before{position:static;writing-mode:horizontal-tb;transform:none;display:block;margin-bottom:16px}
  body[data-theme="archive"] .hero{padding:100px 22px 40px!important}
  body[data-theme="archive"] .hero-copy{grid-template-columns:1fr;grid-template-areas:"title" "eyebrow" "lead" "cta"}
  body[data-theme="archive"] .hero-visual{height:260px!important;margin-bottom:56px}
  body[data-theme="archive"] .gallery .photo{flex-basis:78vw}
  body[data-theme="archive"] .gallery .photo img{height:58vw!important}
  body[data-theme="archive"] .project,body[data-theme="archive"] .project-card{grid-template-columns:1fr}
  body[data-theme="archive"] .dw-gallery-masonry{grid-template-columns:repeat(2,1fr)}
}
/* hard overrides for header pieces styled with !important elsewhere */
body[data-theme="archive"] .top{background:var(--bg)!important;color:var(--ink)!important}
body[data-theme="archive"] .top .logo span{color:var(--accent)!important}
body[data-theme="archive"] .top #themeToggle{border-color:var(--ink)!important;color:var(--ink)!important;background:transparent!important}
body[data-theme="archive"] .top .nav>a,body[data-theme="archive"] .top .dw-explore summary{color:var(--ink)!important}