/*
Theme Name: Old Photons
Theme URI: https://qsplace.co.uk
Author: Old Photons
Description: A dark, image-forward astrophotography theme. Pairs with the Old Photons Gallery plugin to present captures and equipment with a capture-log aesthetic and hover plate-solve. The signature: every object shows how old its light is.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: old-photons
*/

:root{
  --void:#07090f; --ink:#0e1320; --panel:#101626; --haze:#1c2638;
  --starlight:#ece9e1; --muted:#76819c; --amber:#e0a85a;
  --halpha:#cd5870; --oiii:#3fb6a8; --violet:#9b7bd4; --cluster:#bcd2ff;
  --accent:var(--amber);
  --maxw:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--starlight);font-family:'Inter',system-ui,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--amber);text-decoration:none}
a:hover{color:var(--starlight)}
img{max-width:100%;height:auto}
h1,h2,h3,h4{font-family:'Spectral',serif;font-weight:400;line-height:1.15}

/* ---- top bar ---- */
.op-topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1.5rem;border-bottom:1px solid var(--haze);
  background:color-mix(in srgb,var(--void) 86%,transparent);backdrop-filter:blur(10px)}
.op-topbar.op-over{position:fixed;left:0;right:0;background:transparent;border-color:transparent}
.op-brand{font-family:'Spectral',serif;font-size:1.15rem;letter-spacing:.01em;color:var(--starlight)}
.op-brand em{font-style:italic;color:var(--amber)}
.op-nav{display:flex;gap:1.4rem;align-items:center}
.op-nav a{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.op-nav a:hover,.op-nav .current-menu-item>a{color:var(--starlight)}
.op-burger{display:none;background:none;border:1px solid var(--haze);color:var(--starlight);border-radius:2px;padding:.35rem .6rem;cursor:pointer;font-size:1rem}
@media(max-width:760px){
  .op-burger{display:block}
  .op-nav{position:absolute;top:100%;right:1.5rem;flex-direction:column;gap:.9rem;background:var(--ink);border:1px solid var(--haze);border-radius:4px;padding:1rem 1.4rem;display:none}
  .op-nav.op-open{display:flex}
}

/* ---- hero ---- */
.op-hero{position:relative;min-height:78vh;display:flex;flex-direction:column;justify-content:center;padding:8rem 1.5rem 4rem;overflow:hidden}
.op-starfield{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.op-hero::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 90% at 50% 30%,transparent 40%,var(--void) 100%);pointer-events:none}
.op-hero-inner{position:relative;z-index:2;max-width:1100px;margin:0 auto;width:100%}
.op-eyebrow{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--amber);margin-bottom:1.3rem}
.op-wordmark{font-family:'Spectral',serif;font-weight:300;font-size:clamp(3.2rem,11vw,8rem);line-height:.92;letter-spacing:-.01em;margin:0}
.op-wordmark em{font-style:italic;color:var(--amber);font-weight:400}
.op-thesis{font-family:'Spectral',serif;font-weight:300;font-size:clamp(1.05rem,2.2vw,1.45rem);color:#c7cdda;max-width:46ch;margin:1.7rem 0 0}
.op-telemetry{font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:var(--muted);margin-top:2.3rem;display:flex;flex-wrap:wrap;gap:1.4rem}
.op-telemetry b{color:var(--starlight);font-weight:500}

/* ---- controls / filters ---- */
.op-controls{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--void) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--haze);padding:.9rem 1.5rem}
.op-controls-inner{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.op-filter,.op-gfilter{font-family:'IBM Plex Mono',monospace;font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;background:transparent;color:var(--muted);border:1px solid var(--haze);border-radius:2px;padding:.45rem .8rem;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.op-filter:hover,.op-gfilter:hover{color:var(--starlight);border-color:var(--muted)}
.op-filter[aria-pressed="true"],.op-gfilter[aria-pressed="true"]{color:var(--void);background:var(--amber);border-color:var(--amber);font-weight:500}
.op-fdot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:.5rem;vertical-align:middle;background:currentColor}

/* ---- gallery ---- */
.op-gallery{max-width:var(--maxw);margin:0 auto;padding:2.5rem 1.5rem 5rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.5rem}
.op-empty{color:var(--muted);font-family:'IBM Plex Mono',monospace}
.op-card{--accent:var(--amber);background:var(--ink);border:1px solid var(--haze);border-radius:4px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;transition:transform .25s,border-color .25s;text-align:left;font:inherit;color:inherit;width:100%;padding:0}
.op-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 60%,var(--haze))}
.op-card:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.op-frame{position:relative;aspect-ratio:4/3;background:radial-gradient(60% 55% at 38% 32%,color-mix(in srgb,var(--accent) 38%,transparent),transparent 70%),radial-gradient(50% 60% at 70% 72%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 75%),var(--panel)}
.op-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.op-frame .op-annot{opacity:0;transition:opacity .45s ease}
.op-frame:hover .op-annot,.op-frame.op-show-annot .op-annot{opacity:1}
.op-stars{position:absolute;inset:0;opacity:.6;background-image:radial-gradient(1px 1px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 60% 70%,#fff,transparent),radial-gradient(1px 1px at 80% 20%,#cfe0ff,transparent),radial-gradient(1px 1px at 35% 80%,#fff,transparent),radial-gradient(1px 1px at 50% 50%,#ffe9c7,transparent),radial-gradient(1px 1px at 90% 60%,#fff,transparent)}
.op-tag{position:absolute;left:.7rem;bottom:.7rem;z-index:2;font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px dashed var(--haze);padding:.2rem .45rem;border-radius:2px;background:color-mix(in srgb,var(--void) 55%,transparent)}
.op-solved{position:absolute;left:.7rem;bottom:.7rem;z-index:3;font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);background:color-mix(in srgb,var(--void) 70%,transparent);border:1px solid color-mix(in srgb,var(--accent) 50%,var(--haze));padding:.2rem .45rem;border-radius:2px}
.op-rig-badge{position:absolute;right:.7rem;top:.7rem;z-index:2;font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--starlight);background:color-mix(in srgb,var(--void) 60%,transparent);border:1px solid var(--haze);padding:.2rem .45rem;border-radius:2px}
.op-card-body{padding:1.1rem 1.15rem 1.25rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.op-type-line{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:.5rem}
.op-type-line .op-dot{width:7px;height:7px;border-radius:50%;background:var(--accent)}
.op-name{font-family:'Spectral',serif;font-weight:400;font-size:1.45rem;line-height:1.1}
.op-desig{font-family:'IBM Plex Mono',monospace;font-size:.74rem;color:var(--muted)}
.op-lightage{margin-top:.35rem;padding-top:.7rem;border-top:1px solid var(--haze);font-family:'Spectral',serif;font-style:italic;font-size:.92rem;color:#c7cdda}
.op-lightage b{font-style:normal;font-weight:500;color:var(--amber)}

/* ---- modal ---- */
.op-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:1.5rem;background:color-mix(in srgb,var(--void) 80%,transparent);backdrop-filter:blur(6px)}
.op-modal.op-open{display:flex}
.op-modal-card{background:var(--ink);border:1px solid var(--haze);border-radius:6px;max-width:920px;width:100%;max-height:90vh;overflow:auto;display:grid;grid-template-columns:1.1fr 1fr}
.op-mframe{position:relative;min-height:340px;background:var(--panel)}
.op-mframe img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.op-mframe .op-annot{opacity:0;transition:opacity .45s}
.op-mframe.op-show-annot .op-annot{opacity:1}
.op-annot-toggle{position:absolute;left:.8rem;bottom:.8rem;z-index:4;font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--starlight);background:color-mix(in srgb,var(--void) 65%,transparent);border:1px solid var(--haze);padding:.35rem .6rem;border-radius:2px;cursor:pointer}
.op-minfo{padding:1.8rem}
.op-minfo .op-name{font-size:2rem;margin-bottom:.2rem}
.op-log{margin-top:1.3rem;border-top:1px solid var(--haze)}
.op-log dl{display:grid;grid-template-columns:auto 1fr;gap:0;margin:0}
.op-log dt,.op-log dd{font-family:'IBM Plex Mono',monospace;font-size:.74rem;padding:.55rem .2rem;border-bottom:1px solid var(--haze);margin:0}
.op-log dt{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;padding-right:1.2rem;white-space:nowrap}
.op-log dd{color:var(--starlight);text-align:right}
.op-log dd.op-em{color:var(--haze)}
.op-log .op-sub{grid-column:1/-1;font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);padding:.9rem .2rem .3rem}
.op-mactions{margin-top:1.5rem;display:flex;gap:.8rem;flex-wrap:wrap}
.op-btn{font-family:'IBM Plex Mono',monospace;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;padding:.6rem 1rem;border-radius:2px;text-decoration:none;cursor:pointer;border:1px solid var(--haze);background:transparent;color:var(--starlight)}
.op-btn.op-primary{background:var(--amber);color:var(--void);border-color:var(--amber);font-weight:500}
.op-btn:hover{border-color:var(--muted);color:var(--starlight)}
.op-close{position:absolute;top:1rem;right:1rem;z-index:5;background:color-mix(in srgb,var(--void) 60%,transparent);border:1px solid var(--haze);color:var(--starlight);width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:1rem}

/* ---- single capture ---- */
.op-wrap{max-width:var(--maxw);margin:0 auto;padding:3rem 1.5rem 5rem}
.op-single{display:grid;grid-template-columns:1.2fr 1fr;gap:2.5rem;align-items:start}
.op-single-media{position:relative;aspect-ratio:3/2;background:var(--panel);border:1px solid var(--haze);border-radius:6px;overflow:hidden}
.op-single-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#05070c}
.op-single-media .op-annot{opacity:0;transition:opacity .45s}
.op-single-media:hover .op-annot,.op-single-media.op-show-annot .op-annot{opacity:1}
.op-single h1{font-size:clamp(2rem,4vw,2.8rem);margin:.2rem 0 .3rem}
.op-back{font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.op-prose{margin-top:2.5rem;max-width:70ch}
.op-prose p{color:#c7cdda;margin:0 0 1.1rem}
.op-prose h2,.op-prose h3{margin:2rem 0 .8rem}
.op-gear-used{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.5rem}
.op-chip{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--haze);border-radius:2px;padding:.3rem .6rem;color:var(--starlight)}
@media(max-width:820px){.op-single{grid-template-columns:1fr}}

/* ---- gear inventory ---- */
.op-gear-grid{max-width:var(--maxw);margin:0 auto;padding:2.5rem 1.5rem 5rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.3rem}
.op-gear-card{background:var(--ink);border:1px solid var(--haze);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .25s,border-color .25s}
.op-gear-card:hover{transform:translateY(-4px);border-color:var(--muted)}
.op-gear-photo{position:relative;aspect-ratio:4/3;background:var(--panel);display:flex;align-items:center;justify-content:center}
.op-gear-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.op-gear-ph{font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--haze)}
.op-status{position:absolute;right:.6rem;top:.6rem;font-family:'IBM Plex Mono',monospace;font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;padding:.2rem .45rem;border-radius:2px;background:color-mix(in srgb,var(--void) 60%,transparent);border:1px solid var(--haze);color:var(--muted)}
.op-status.op-wishlist{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 50%,var(--haze))}
.op-gear-body{padding:1rem 1.05rem 1.15rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.op-gear-type{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.op-gear-name{font-family:'Spectral',serif;font-size:1.2rem;line-height:1.15}
.op-gear-sub{font-size:.84rem;color:#c7cdda}
.op-gear-specs{font-family:'IBM Plex Mono',monospace;font-size:.68rem;color:var(--muted);line-height:1.5;margin-top:.2rem}
.op-tag-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}
.op-disc{font-family:'IBM Plex Mono',monospace;font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid;border-radius:2px;padding:.15rem .4rem}

/* ---- blog / posts / pages ---- */
.op-list{max-width:820px;margin:0 auto;padding:3rem 1.5rem 5rem}
.op-page-head{max-width:820px;margin:0 auto;padding:2.5rem 1.5rem .5rem}
.op-page-head h1{font-size:clamp(2rem,5vw,3rem);font-weight:300}
.op-entry{padding:2rem 0;border-bottom:1px solid var(--haze)}
.op-entry h2{font-size:1.7rem;margin:0 0 .4rem}
.op-entry h2 a{color:var(--starlight)}
.op-entry h2 a:hover{color:var(--amber)}
.op-meta-line{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.op-excerpt{color:#c7cdda}
.op-pagination{display:flex;justify-content:space-between;gap:1rem;padding:2rem 0}
.op-single-post{max-width:760px;margin:0 auto;padding:3rem 1.5rem 5rem}
.op-single-post h1{font-size:clamp(2rem,5vw,3rem);font-weight:300;margin:.3rem 0 .5rem}

/* ---- footer ---- */
.op-foot{border-top:1px solid var(--haze);padding:3rem 1.5rem;text-align:center}
.op-foot .about{max-width:680px;margin:0 auto 2rem;color:#bcc4d4;text-align:left}
.op-foot .about h2{font-weight:300;font-size:1.8rem;margin-bottom:1rem}
.op-foot .credit{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;color:var(--muted)}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto}
  .op-starfield{display:none}
}