/*
Theme Name: OurPaintingSale
Theme URI: https://www.ourpaintingsale.com/
Description: Catalogue of public-domain oil paintings. Thin bespoke theme; page bodies are pre-rendered and stored in post_content. No tracking, no SEO plugin.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: ops
*/
/* ourpaintingsale.com — hybrid theme (heritage identity + modern delivery)
   Anti-footprint: prefix ops- / --ops-*, fonts Fraunces + Hanken Grotesk
   (NOT Alice/Archivo/Inter/Mulish/Noto Serif SC used by siblings).
   Heritage colours: wine #992030 wordmark + teal #43878B band (old Enceshi site). */

:root{
  --ops-wine:#992030; --ops-wine-dk:#7c1a26; --ops-wine-soft:#f3e2e4;
  --ops-teal:#43878b; --ops-teal-dk:#2f6b6e; --ops-teal-soft:#e7f1f0;
  --ops-gold:#b0893f;
  --ops-ink:#211f1d; --ops-mut:#6c655c; --ops-paper:#ffffff;
  --ops-mist:#f5f8f5; --ops-sand:#faf8f3; --ops-line:#e4e0d8;
  --ops-frame:#efe9dd;
  --ops-wrap:1180px;
  --ops-disp:"Fraunces",Georgia,serif;
  --ops-sans:"Hanken Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --ops-sh:0 1px 2px rgba(33,31,29,.05),0 6px 20px rgba(33,31,29,.06);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:var(--ops-sans);color:var(--ops-ink);
  background:var(--ops-paper);line-height:1.6;font-size:17px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--ops-teal-dk);text-decoration:none}
a:hover{text-decoration:underline}
.ops-wrap{max-width:var(--ops-wrap);margin:0 auto;padding:0 22px}

/* ---------- Header ---------- */
.ops-topline{background:var(--ops-wine);color:#fde8ea;font-size:12.5px;letter-spacing:.04em}
.ops-topline .ops-wrap{display:flex;justify-content:space-between;align-items:center;min-height:30px}
.ops-topline a{color:#fff;opacity:.9}
.ops-head{background:var(--ops-paper);border-bottom:1px solid var(--ops-line)}
.ops-head .ops-wrap{display:flex;align-items:center;gap:20px;padding-top:16px;padding-bottom:16px}
.ops-brand{display:flex;flex-direction:column;line-height:1.05;flex:0 0 auto}
.ops-brand b{
  font-family:var(--ops-disp);font-weight:600;font-size:27px;letter-spacing:-.01em;
  color:var(--ops-wine);
}
.ops-brand b span{color:var(--ops-teal-dk)}
.ops-brand small{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ops-mut);margin-top:3px}
.ops-search{margin-left:auto;flex:1 1 360px;max-width:440px;position:relative}
.ops-search input{
  width:100%;border:1px solid var(--ops-line);background:var(--ops-mist);
  border-radius:999px;padding:11px 44px 11px 18px;font:inherit;font-size:15px;color:var(--ops-ink);
}
.ops-search input::placeholder{color:#9a938a}
.ops-search button{
  position:absolute;right:5px;top:5px;width:34px;height:34px;border:0;border-radius:50%;
  background:var(--ops-teal);color:#fff;cursor:pointer;font-size:15px;
}
.ops-burger{display:none;margin-left:auto;background:0;border:1px solid var(--ops-line);border-radius:9px;width:44px;height:40px;font-size:19px;color:var(--ops-ink)}

/* nav band — the heritage teal stripe, modernised */
.ops-nav{background:var(--ops-teal);box-shadow:inset 0 -3px 0 rgba(0,0,0,.08)}
.ops-nav .ops-wrap{display:flex;gap:4px;flex-wrap:wrap}
.ops-nav a{
  color:#eafbf9;font-weight:600;font-size:14.5px;letter-spacing:.02em;
  padding:13px 16px;display:block;border-bottom:3px solid transparent;
}
.ops-nav a:hover{background:rgba(255,255,255,.12);text-decoration:none;border-bottom-color:#fff}
.ops-nav a.ops-on{background:var(--ops-teal-dk);border-bottom-color:var(--ops-gold)}

/* ---------- Breadcrumbs ---------- */
.ops-crumbs{font-size:13px;color:var(--ops-mut);padding:14px 0 2px}
.ops-crumbs a{color:var(--ops-mut)}
.ops-crumbs b{color:var(--ops-ink);font-weight:600}
.ops-crumbs span{margin:0 7px;opacity:.5}

/* ---------- Buttons ---------- */
.ops-btn{
  display:inline-block;background:var(--ops-wine);color:#fff;font-weight:600;
  padding:13px 26px;border-radius:9px;font-size:15.5px;letter-spacing:.01em;
}
.ops-btn:hover{background:var(--ops-wine-dk);text-decoration:none}
.ops-btn.ops-ghost{background:transparent;color:var(--ops-teal-dk);border:1.5px solid var(--ops-teal)}
.ops-btn.ops-ghost:hover{background:var(--ops-teal-soft)}

/* ---------- Typo ---------- */
h1,h2,h3{font-family:var(--ops-disp);font-weight:600;color:var(--ops-ink);line-height:1.15;letter-spacing:-.01em}
.ops-prose p{margin:0 0 1.05em;max-width:72ch}
.ops-prose h2{font-size:26px;margin:1.9em 0 .55em}
.ops-eyebrow{font-family:var(--ops-sans);font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--ops-teal-dk)}

/* ---------- Gallery cards (framed-print character) ---------- */
.ops-grid{display:grid;gap:22px}
.ops-grid.ops-c4{grid-template-columns:repeat(4,1fr)}
.ops-grid.ops-c3{grid-template-columns:repeat(3,1fr)}
.ops-card{background:var(--ops-paper);border:1px solid var(--ops-line);border-radius:12px;overflow:hidden;box-shadow:var(--ops-sh);transition:transform .16s,box-shadow .16s}
.ops-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(33,31,29,.12);text-decoration:none}
.ops-frame{background:var(--ops-frame);padding:10px}
.ops-frame .ops-mat{background:#fff;border:1px solid #d9d3c6;padding:6px}
.ops-frame img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#ddd}
.ops-card .ops-cbody{padding:12px 14px 15px}
.ops-card h3{font-size:16.5px;margin:0 0 3px;letter-spacing:0}
.ops-card .ops-meta{font-size:12.5px;color:var(--ops-mut)}
.ops-card:hover h3{color:var(--ops-wine)}

/* section headers */
.ops-sec{padding:44px 0}
.ops-sec.ops-tint{background:var(--ops-mist);border-top:1px solid var(--ops-line);border-bottom:1px solid var(--ops-line)}
.ops-sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}
.ops-sechead h2{font-size:28px;margin:0}
.ops-sechead a{font-size:14px;font-weight:600}

/* pill tags */
.ops-tag{display:inline-block;background:var(--ops-wine-soft);color:var(--ops-wine-dk);font-weight:600;font-size:12.5px;padding:5px 12px;border-radius:999px;letter-spacing:.02em}
.ops-tag.ops-teal{background:var(--ops-teal-soft);color:var(--ops-teal-dk)}

/* ---------- Footer ---------- */
.ops-foot{background:#201d1b;color:#cfc8bf;margin-top:10px}
.ops-foot .ops-wrap{padding:38px 22px}
.ops-foot b{font-family:var(--ops-disp);color:#fff;font-size:20px}
.ops-foot b span{color:#e59aa4}
.ops-foot .ops-fgrid{display:flex;flex-wrap:wrap;gap:40px;margin-top:18px}
.ops-foot a{color:#cfc8bf;font-size:14px;display:block;margin:6px 0}
.ops-foot a:hover{color:#fff}
.ops-foot .ops-fcol h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8f877d;margin:0 0 6px;font-family:var(--ops-sans);font-weight:700}
.ops-foot .ops-fnote{margin-top:26px;padding-top:16px;border-top:1px solid #3a3531;font-size:12.5px;color:#8f877d}

/* ---------- Home hero ---------- */
.ops-hero{background:linear-gradient(180deg,var(--ops-sand),var(--ops-paper))}
.ops-hero .ops-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;padding:52px 22px}
.ops-hero h1{font-size:46px;line-height:1.05;margin:12px 0 16px}
.ops-hero p{font-size:18px;color:#403b34;max-width:48ch}
.ops-hero .ops-cta{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.ops-herowall{position:relative;aspect-ratio:4/3;background:var(--ops-frame);border-radius:14px;padding:16px;box-shadow:var(--ops-sh)}
.ops-herowall .ops-hw{position:absolute;border:7px solid #fff;box-shadow:0 8px 22px rgba(0,0,0,.22);background:#ccc}
.ops-herowall .ops-hw img{width:100%;height:100%;object-fit:cover}
.ops-hw1{width:46%;aspect-ratio:3/4;left:8%;top:10%;z-index:2}
.ops-hw2{width:40%;aspect-ratio:1/1;right:9%;top:16%;transform:rotate(3deg)}
.ops-hw3{width:38%;aspect-ratio:4/3;left:26%;bottom:9%;transform:rotate(-2deg);z-index:3}

/* ---------- Artist page ---------- */
.ops-banner{position:relative;height:300px;overflow:hidden;background:#111}
.ops-banner img{width:100%;height:100%;object-fit:cover;opacity:.92}
.ops-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.55))}
.ops-artisthead{text-align:center;margin-top:-66px;position:relative;z-index:2}
.ops-medal{width:116px;height:116px;border-radius:50%;margin:0 auto;border:5px solid #fff;box-shadow:var(--ops-sh);background:var(--ops-wine);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--ops-disp);font-size:40px;font-weight:600;overflow:hidden}
.ops-medal img{width:100%;height:100%;object-fit:cover}
.ops-artisthead h1{font-size:40px;margin:16px 0 4px}
.ops-artisthead .ops-dates{color:var(--ops-mut);font-size:15px}
.ops-artisthead .ops-tags{margin:14px 0 6px;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}

/* ---------- Painting page ---------- */
.ops-work{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:start;padding:26px 0 10px}
.ops-workimg{background:var(--ops-frame);padding:18px;border-radius:12px;box-shadow:var(--ops-sh)}
.ops-workimg .ops-mat{background:#fff;border:1px solid #d9d3c6;padding:10px}
.ops-workimg img{width:100%}
.ops-workthumbs{display:flex;gap:10px;margin-top:12px}
.ops-workthumbs img{width:68px;height:68px;object-fit:cover;border:1px solid var(--ops-line);border-radius:6px;background:#ddd}
.ops-facts{border:1px solid var(--ops-line);border-radius:12px;overflow:hidden;box-shadow:var(--ops-sh)}
.ops-facts .ops-fh{background:var(--ops-teal);color:#fff;padding:12px 18px;font-family:var(--ops-disp);font-size:18px}
.ops-facts dl{margin:0;padding:6px 18px 14px}
.ops-facts dt{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ops-mut);margin-top:12px}
.ops-facts dd{margin:2px 0 0;font-size:15.5px;color:var(--ops-ink);font-weight:500}
.ops-facts .ops-pd{display:inline-block;margin-top:3px;background:var(--ops-teal-soft);color:var(--ops-teal-dk);font-weight:600;font-size:12.5px;padding:3px 10px;border-radius:999px}
.ops-worktitle h1{font-size:38px;margin:4px 0 6px}
.ops-worktitle .ops-by{font-size:16px;color:var(--ops-mut);margin-bottom:18px}
.ops-worktitle .ops-by a{color:var(--ops-wine);font-weight:600}

/* money block on home */
.ops-money{background:var(--ops-teal-dk);color:#eafbf9;border-radius:14px;padding:30px 34px;margin:26px 0;display:flex;gap:26px;align-items:center;flex-wrap:wrap}
.ops-money h2{color:#fff;font-size:24px;margin:0 0 6px}
.ops-money p{margin:0;max-width:60ch;color:#d6efed}
.ops-money a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:3px}

.ops-lead{font-size:19px;line-height:1.6;color:var(--ops-ink);font-weight:500;margin:0 0 18px}

/* generic prose + aside layout */
.ops-cols{display:grid;grid-template-columns:1.6fr .9fr;gap:44px;align-items:start}
.ops-aside{background:var(--ops-mist);border:1px solid var(--ops-line);border-radius:12px;padding:20px 22px}
.ops-aside h3{font-family:var(--ops-disp);font-size:19px;margin:0 0 8px}
.ops-dl{margin:0}
.ops-dl dt{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ops-mut);margin-top:12px}
.ops-dl dd{margin:2px 0 0;font-size:15.5px;color:var(--ops-ink);font-weight:500}
.ops-aside .ops-dl dt:first-child{margin-top:0}

/* "see also" link row */
.ops-seelist{display:flex;flex-wrap:wrap;gap:12px}
.ops-seelist a{background:var(--ops-mist);border:1px solid var(--ops-line);border-radius:999px;padding:9px 16px;font-weight:600;color:var(--ops-wine);font-size:14.5px}
.ops-seelist a:hover{background:var(--ops-teal-soft);border-color:var(--ops-teal)}

/* painting page title bits */
.ops-work aside h1{font-size:34px;line-height:1.1;margin:4px 0 2px}
.ops-byline{font-size:16px;color:var(--ops-mut);margin:0 0 18px}
.ops-credit{font-size:12.5px;color:var(--ops-mut);margin:12px 0 0;line-height:1.5}

/* artist dates row */
.ops-artisthead .ops-dates{color:var(--ops-mut)}

/* ---------- Responsive 375 ---------- */
@media(max-width:860px){
  .ops-hero .ops-wrap{grid-template-columns:1fr;gap:26px;padding:30px 20px}
  .ops-hero h1{font-size:33px}
  .ops-work{grid-template-columns:1fr;gap:22px}
  .ops-grid.ops-c4{grid-template-columns:repeat(2,1fr)}
  .ops-grid.ops-c3{grid-template-columns:repeat(2,1fr)}
  .ops-cols{grid-template-columns:1fr;gap:26px}
}
@media(max-width:560px){
  body{font-size:16px}
  .ops-search{display:none}
  .ops-burger{display:block}
  .ops-nav{display:none}
  .ops-hero h1{font-size:28px}
  .ops-hero .ops-herowall{aspect-ratio:3/2}
  .ops-banner{height:188px}
  .ops-artisthead h1{font-size:28px}
  .ops-worktitle h1{font-size:27px}
  .ops-sechead h2,.ops-prose h2{font-size:22px}
  .ops-grid{gap:14px}
  .ops-foot .ops-fgrid{gap:26px}
}

/* ========== ops- extension: page types not in the 3 mockups ========== */

/* inert links (ops-soon): a target not yet published. Reads as plain text,
   never as a dead link; the theme upgrades it to <a> once the target is live. */
.ops-soon{color:inherit;cursor:default;text-decoration:none}
.ops-soon:hover{text-decoration:none}
.ops-seelist .ops-soon{background:var(--ops-mist);border:1px solid var(--ops-line);border-radius:999px;padding:9px 16px;font-weight:600;color:var(--ops-mut);opacity:.75}
.ops-tag .ops-soon{color:inherit}
/* a card whose target is not yet live: same frame, no lift, no pointer */
.ops-card.ops-soon{display:block;cursor:default;opacity:.92}
.ops-card.ops-soon:hover{transform:none;box-shadow:var(--ops-sh)}
.ops-card.ops-soon:hover h3{color:var(--ops-ink)}
.ops-workthumbs .ops-soon{display:block;cursor:default}
.ops-workthumbs .ops-on img,.ops-workthumbs a.ops-on img{border-color:var(--ops-teal);outline:2px solid var(--ops-teal)}

/* generic tag row (inline, outside artist head) */
.ops-tags{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}

/* placeholder when a painting has no public-domain image yet */
.ops-ph{width:100%;aspect-ratio:1/1;background:repeating-linear-gradient(45deg,#efe9dd,#efe9dd 10px,#e7e0d2 10px,#e7e0d2 20px);display:flex;align-items:center;justify-content:center;color:var(--ops-mut);font-size:13px;text-align:center;padding:12px}
.ops-ph span{max-width:80%}
.ops-workimg .ops-ph{aspect-ratio:4/3}

/* artist banner with no image */
.ops-banner-void{height:150px;background:linear-gradient(135deg,var(--ops-wine),var(--ops-teal-dk))}
.ops-banner-void::after{display:none}

/* painting-facts public-domain wrap */
.ops-pdwrap{padding:0 18px 15px}

/* ---------- Index pages (A–Z, hub indexes, guides) ---------- */
.ops-index{max-width:960px}
.ops-index h1{font-size:38px;margin:0 0 4px}
.ops-index-n{color:var(--ops-mut);font-size:14px;margin:0 0 20px;letter-spacing:.02em}
.ops-index .ops-prose{margin-bottom:22px}

/* jump bar */
.ops-az{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 30px;padding:14px;background:var(--ops-mist);border:1px solid var(--ops-line);border-radius:12px;position:sticky;top:0;z-index:5}
.ops-az a,.ops-az span{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;font-weight:700;font-size:14px}
.ops-az a{background:var(--ops-paper);color:var(--ops-teal-dk);border:1px solid var(--ops-line)}
.ops-az a:hover{background:var(--ops-teal);color:#fff;text-decoration:none;border-color:var(--ops-teal)}
.ops-az span{color:#c3bcb0}

.ops-letter{margin:0 0 26px;scroll-margin-top:70px}
.ops-letterh{font-size:30px;color:var(--ops-wine);border-bottom:2px solid var(--ops-wine-soft);padding-bottom:6px;margin:0 0 10px}
.ops-rows{list-style:none;margin:0;padding:0}
.ops-row{display:flex;align-items:baseline;gap:14px;padding:11px 4px;border-bottom:1px solid var(--ops-line);flex-wrap:wrap}
.ops-rowname{font-family:var(--ops-disp);font-weight:600;font-size:18px;color:var(--ops-ink);flex:0 0 auto}
a.ops-rowname:hover{color:var(--ops-wine);text-decoration:none}
.ops-rowmeta{font-size:13.5px;color:var(--ops-mut)}
.ops-rownum{margin-left:auto;white-space:nowrap}

/* ---------- Document pages (About / Privacy / guide body) ---------- */
.ops-doc{max-width:760px}
.ops-doc h1{font-size:38px;margin:0 0 10px}

/* ---------- 404 ---------- */
.ops-404{max-width:620px;text-align:center;padding:70px 22px}
.ops-404 h1{font-size:72px;color:var(--ops-wine);margin:0}
.ops-404 p{color:var(--ops-mut);font-size:18px;margin:8px 0 24px}

/* burger-driven mobile nav (mockup hid .ops-nav on mobile; this reveals it) */
@media(max-width:560px){
  body.ops-nav-open .ops-nav{display:block}
  body.ops-nav-open .ops-nav .ops-wrap{flex-direction:column;gap:0;padding:6px 16px}
  body.ops-nav-open .ops-nav a{display:block;border-bottom:1px solid rgba(255,255,255,.15)}
  .ops-burger[aria-expanded="true"]{background:var(--ops-mist)}
}

/* mobile tweaks for the new types */
@media(max-width:560px){
  .ops-index h1,.ops-doc h1{font-size:27px}
  .ops-letterh{font-size:24px}
  .ops-rowname{font-size:16px}
  .ops-rownum{margin-left:0;flex-basis:100%}
  .ops-az{position:static}
}
