/*
Theme Name: Steampunk Studio
Theme URI: https://steampunkdesign.com/
Author: Richard Mueller
Description: The studio site of Steampunk Design (once 3232 Design): the brass device from the 2008 site, the work, the 3232 history and the journal. Source: canopy ~/runbooks/newbox-files/steampunkdesign/ (red's helper, session 9ffdccf5, 2026-10-18).
Version: 1.0.0
Requires PHP: 8.1
License: Proprietary (fonts: SIL OFL, see assets/fonts/FONTS.md)
Text Domain: steampunk-studio
Update URI: https://steampunkdesign.com/no-wporg-updates
*/

@font-face{font-family:"Source Serif 4";src:url(assets/fonts/SourceSerif4-Roman.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(assets/fonts/SourceSerif4-Italic.woff2) format("woff2");font-weight:200 900;font-style:italic;font-display:swap}
@font-face{font-family:"Vollkorn";src:url(assets/fonts/Vollkorn.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Vollkorn";src:url(assets/fonts/Vollkorn-Italic.woff2) format("woff2");font-weight:400 900;font-style:italic;font-display:swap}

:root{
 --ink:#0b0a09;--ink2:#110f0c;--panel:#17140f;--panel2:#1d1913;
 --paper:#efe6d2;--paper2:#e8dcc3;--sheet:#f3ead6;--sheet-ink:#2b241b;--sheet-soft:#6a5c48;--sheet-rule:#d9cbb0;
 --muted:#b9ad95;--dim:#8d8371;--brass:#c9a24a;--brass2:#ecd18a;--brass3:#8a6a2a;--rust:#d0611e;--olive:#9a9b5a;
 --rule:rgba(201,162,74,.24);--rule2:rgba(201,162,74,.12);
 --serif:"Source Serif 4",Georgia,"Times New Roman",serif;--book:"Vollkorn","Iowan Old Style",Georgia,serif;
 --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
 --gut:max(1.25rem,5vw);--wrap:1240px;
 color-scheme:dark;
 --wp--preset--font-family--source-serif-pro:"Source Serif 4",Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--paper);font:300 1.0625rem/1.6 var(--serif);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--brass2);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;line-height:1.1;margin:0;text-wrap:balance}
p{margin:0 0 1em}
.sd-skip{position:absolute;left:-999px;top:0;z-index:100;background:var(--brass);color:var(--ink);padding:.6em 1em;font:600 .9rem var(--sans)}
.sd-skip:focus{left:1rem;top:1rem}
.sd-wrap{max-width:calc(var(--wrap) + 2 * var(--gut));margin:0 auto;padding:0 var(--gut)}
.sd-wrap-narrow{max-width:46rem}
.sd-kicker{font:600 .72rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin:0 0 1.1rem}
.sd-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- header ---------- */
.sd-head{position:relative;z-index:10;border-bottom:1px solid var(--rule2)}
.sd-head-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:84px;padding-top:.75rem;padding-bottom:.75rem}
.sd-brand{display:flex;align-items:center;gap:.85rem;text-decoration:none;min-height:44px}
.sd-brand-eye{width:40px;height:40px;border-radius:50%;flex:none;position:relative;
 background:radial-gradient(circle at 50% 50%,transparent 56%,#6b4f1c 57%,#e4c271 66%,#8a6a2a 78%,#c9a24a 88%,#5b4316 100%);padding:5px;box-shadow:0 2px 10px rgba(0,0,0,.6)}
.sd-brand-eye img{width:100%;height:100%;border-radius:50%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.sd-brand:hover .sd-brand-eye img{transform:rotate(-25deg) scale(1.06)}
.sd-brand-text{display:flex;flex-direction:column;line-height:1.1}
.sd-word{font:500 1.2rem/1.1 var(--serif);letter-spacing:.01em;color:var(--paper)}
.sd-word i{font-style:italic;font-weight:300;color:var(--brass2)}
.sd-sub{font:600 .62rem/1.5 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-top:.3rem}
.sd-nav{display:flex;gap:.25rem}
.sd-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 .9rem;font:500 .95rem/1 var(--sans);text-decoration:none;color:var(--muted);border-radius:999px;transition:color .25s,background .25s}
.sd-nav a:hover{color:var(--paper);background:rgba(255,255,255,.04)}
.sd-nav a[aria-current]{color:var(--brass2);box-shadow:inset 0 0 0 1px var(--rule)}
@media (max-width:640px){
 .sd-head-in{flex-direction:column;align-items:stretch;gap:.35rem;padding-top:.9rem;padding-bottom:.4rem;min-height:0}
 .sd-nav{justify-content:space-between;margin:0 -.5rem}
 .sd-nav a{flex:1;justify-content:center;padding:0 .4rem}
}

/* ---------- buttons, chips ---------- */
.sd-btns{display:flex;flex-wrap:wrap;gap:.7rem}
.sd-btn{display:inline-flex;align-items:center;gap:.6em;min-height:48px;padding:.7em 1.35em;border-radius:999px;font:600 .92rem/1 var(--sans);text-decoration:none;letter-spacing:.01em;
 color:var(--ink);background:linear-gradient(180deg,var(--brass2),var(--brass) 55%,#a8822f);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 20px rgba(201,162,74,.18);transition:transform .2s,box-shadow .2s}
.sd-btn:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 28px rgba(201,162,74,.28)}
.sd-btn-ghost{color:var(--paper);background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px var(--rule)}
.sd-btn-ghost:hover{box-shadow:inset 0 0 0 1px var(--brass);background:rgba(201,162,74,.06)}
.sd-more{display:inline-flex;align-items:center;gap:.4em;min-height:44px;font:600 .9rem/1 var(--sans);color:var(--brass2);text-decoration:none;border-bottom:1px solid transparent}
.sd-more:hover{border-bottom-color:currentColor}

/* ---------- hero (home) ---------- */
.sd-hero{position:relative;isolation:isolate;padding:clamp(2rem,6vw,5rem) 0 clamp(2.5rem,6vw,5.5rem);overflow:hidden}
.sd-hero::before{content:"";position:absolute;inset:-10% 0 0;z-index:-2;pointer-events:none;
 background:radial-gradient(38% 55% at 76% 42%,rgba(208,97,30,.20),transparent 70%),radial-gradient(30% 40% at 6% 95%,rgba(154,155,90,.14),transparent 70%),radial-gradient(28% 32% at 52% 0%,rgba(201,162,74,.10),transparent 70%)}
.sd-hero::after,.sd-band::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.15;pointer-events:none;mix-blend-mode:overlay;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.sd-hero-grid{display:grid;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
@media (min-width:860px){.sd-hero-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)}}
.sd-h1{font-weight:200;font-size:clamp(2.7rem,6.2vw,5.9rem);line-height:.97;letter-spacing:-.028em;margin:0 0 1.5rem;color:var(--paper)}
.sd-h1 span{display:block}
.sd-h1 em{font-style:italic;font-weight:300;color:var(--brass2)}
.sd-lede{font-size:clamp(1.1rem,1.55vw,1.32rem);line-height:1.58;color:var(--muted);max-width:34em;margin:0 0 2rem}
.sd-lede strong{font-weight:500;color:var(--paper)}
.sd-hero-note{margin:1.6rem 0 0;font:500 .78rem/1.5 var(--sans);color:var(--dim);letter-spacing:.02em}
.sd-hero-note a{color:var(--muted)}

/* ---------- the device: the 2008 brass eye, rebuilt from its original layers (577 x 597) ---------- */
.sd-device-wrap{position:relative;justify-self:center;width:min(100%,540px)}
@media (max-width:859px){.sd-device-wrap{width:min(88%,440px);order:-1;margin-bottom:-.5rem}}
.sd-device-wrap::before{content:"";position:absolute;inset:8% 6% 4%;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,rgba(236,209,138,.20),rgba(208,97,30,.08) 60%,transparent);filter:blur(10px)}
.sd-device{position:relative;width:100%;aspect-ratio:577/597;filter:drop-shadow(0 30px 40px rgba(0,0,0,.65))}
.sd-device>*{position:absolute;margin:0;max-width:none}
.dv-orb{left:20.45%;top:19.26%;width:51.13%;height:49.41%;overflow:hidden;background:#000;border-radius:50%}
.dv-eye{position:absolute;inset:0;width:100%;height:100%;opacity:.94;will-change:transform;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.dv-orb::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 50%,transparent 52%,rgba(0,0,0,.55) 78%,#000 100%);pointer-events:none}
.dv-base{left:0;top:0;width:100%;height:100%}
.dv-outer{left:7.97%;top:8.04%;width:75.22%;height:72.70%}
.dv-inner{left:12.82%;top:12.90%;width:64.47%;height:62.31%}
.dv-gearbox{left:84.06%;top:28.14%;width:8.67%;height:39.03%;overflow:hidden}
.dv-gear{position:absolute;width:434%;height:93.13%;left:-344%;top:-12.88%;max-width:none}
.dv-gear.g2{left:-334%;top:19.31%}
.dv-gearmask{left:78.16%;top:22.11%;width:13.34%;height:50.75%}
.dv-polar{left:3.81%;top:2.85%;width:85.96%;height:60.13%;pointer-events:none;opacity:.9}
@media (prefers-reduced-motion:no-preference){
 .dv-outer{animation:sd-spin 140s linear infinite}
 .dv-inner{animation:sd-spin 100s linear infinite reverse}
 .dv-gear{animation:sd-spin 24s linear infinite}
 .dv-gear.g2{animation-direction:reverse}
 .sd-device.js-spin .dv-outer,.sd-device.js-spin .dv-inner,.sd-device.js-spin .dv-gear{animation:none}
}
@keyframes sd-spin{to{transform:rotate(360deg)}}
.sd-device-cap{text-align:center;font:500 .72rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:.6rem 0 0}

/* ---------- sections ---------- */
.sd-sec{padding:clamp(3rem,7vw,6rem) 0;border-top:1px solid var(--rule2);position:relative}
.sd-sec-head{display:grid;grid-template-columns:auto 1fr;gap:.2rem 1.1rem;align-items:baseline;margin-bottom:clamp(1.6rem,3.5vw,2.8rem)}
.sd-num{grid-row:span 2;font:italic 300 clamp(2.2rem,4vw,3.4rem)/1 var(--serif);color:var(--brass);opacity:.85}
.sd-sec-head h2{font-size:clamp(1.8rem,3.4vw,2.8rem);font-weight:300;letter-spacing:-.015em}
.sd-sec-head p{margin:.4rem 0 0;color:var(--muted);font-size:1.05rem}
.sd-sec-foot{margin-top:2rem}

/* work cards (home) */
.sd-cards{display:grid;gap:clamp(1rem,2.4vw,1.8rem);grid-template-columns:1fr}
@media (min-width:640px){.sd-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.sd-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sd-card{position:relative;display:flex;flex-direction:column;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--rule2);border-radius:14px;overflow:hidden;transition:border-color .3s,transform .3s}
.sd-card:hover{border-color:var(--rule);transform:translateY(-2px)}
.sd-card-shot{display:block;aspect-ratio:16/10;overflow:hidden;background:#000;border-bottom:1px solid var(--rule2)}
.sd-card-shot img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.sd-card:hover .sd-card-shot img{transform:scale(1.035)}
.sd-card-body{padding:1.15rem 1.25rem 1.2rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.sd-card .sd-card-meta{font:600 .68rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.sd-card h3{font-size:1.45rem;font-weight:400;letter-spacing:-.01em}
.sd-card h3 a{text-decoration:none}
.sd-card h3 a::after{content:"";position:absolute;inset:0}
.sd-card p{color:var(--muted);font-size:1rem;line-height:1.5;margin:0}
.sd-card-links{margin-top:auto;padding-top:.5rem;display:flex;gap:1.2rem;position:relative;z-index:1}
.sd-card-links a{min-height:44px;display:inline-flex;align-items:center;font:600 .85rem/1 var(--sans);color:var(--brass2);text-decoration:none}
.sd-card-links a:hover{text-decoration:underline;text-underline-offset:.2em}

/* journal teasers */
.sd-notes{display:grid;gap:clamp(1rem,2.4vw,1.8rem);grid-template-columns:1fr}
@media (min-width:900px){.sd-notes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sd-note{position:relative;padding:1.5rem 1.5rem 1.3rem;border-radius:12px;background:var(--sheet);color:var(--sheet-ink);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 18px 40px rgba(0,0,0,.45);
 background-image:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.35),transparent 60%),radial-gradient(140% 120% at 50% 120%,rgba(120,90,40,.16),transparent 60%)}
.sd-note time{font:600 .68rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#8a5a1e}
.sd-note h3{font:500 1.42rem/1.18 var(--book);margin:.5rem 0 .6rem;color:var(--sheet-ink)}
.sd-note h3 a{text-decoration:none}
.sd-note h3 a::after{content:"";position:absolute;inset:0}
.sd-note p{font:400 1.02rem/1.55 var(--book);color:var(--sheet-soft);margin:0}
.sd-note-empty{grid-column:1/-1;max-width:44rem}
.sd-note-empty h3{font-size:1.6rem}

/* the 3232 years (home) */
.sd-years{display:grid;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
@media (min-width:900px){.sd-years{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.sd-years-text p{color:var(--muted);font-size:1.12rem;line-height:1.62;max-width:34em}
.sd-years-text p strong{color:var(--paper);font-weight:500}
.sd-eyes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.sd-eyes figure{margin:0;aspect-ratio:2/1;border-radius:10px;overflow:hidden;background:#000;box-shadow:0 0 0 1px var(--rule),0 12px 28px rgba(0,0,0,.5)}
.sd-eyes img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(.92)}
.sd-eyes figure:hover img{transform:scale(1.06);filter:saturate(1.08)}

/* ---------- page band (inner pages) ---------- */
.sd-band{position:relative;isolation:isolate;padding:clamp(2.2rem,6vw,4.8rem) 0 clamp(1.8rem,4vw,3.2rem);overflow:hidden}
.sd-band::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(40% 70% at 85% 10%,rgba(208,97,30,.16),transparent 70%),radial-gradient(30% 50% at 0% 100%,rgba(154,155,90,.12),transparent 70%)}
.sd-band h1{font-weight:200;font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:1;letter-spacing:-.025em;margin:0 0 1rem}
.sd-band h1 em{font-style:italic;font-weight:300;color:var(--brass2)}
.sd-band .sd-lede{margin-bottom:0}

/* ---------- the sheet: parchment for reading ---------- */
.sd-sheet-wrap{padding:0 var(--gut) clamp(3rem,7vw,6rem)}
.sd-sheet{max-width:46rem;margin:0 auto;background:var(--sheet);color:var(--sheet-ink);border-radius:6px;padding:clamp(1.6rem,5vw,3.6rem) clamp(1.25rem,5vw,3.8rem);
 box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 30px 60px rgba(0,0,0,.55),0 0 0 1px rgba(201,162,74,.25);
 background-image:radial-gradient(120% 60% at 50% 0%,rgba(255,255,255,.4),transparent 60%),radial-gradient(160% 120% at 50% 130%,rgba(120,90,40,.18),transparent 55%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .35 0 0 0 0 .2 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23p)'/%3E%3C/svg%3E")}
.sd-prose{font:400 clamp(1.1rem,1rem + .35vw,1.25rem)/1.72 var(--book);color:var(--sheet-ink)}
.sd-prose>*:first-child{margin-top:0}
.sd-prose p{margin:0 0 1.15em}
.sd-prose h2{font:500 1.45em/1.25 var(--book);margin:1.8em 0 .5em;color:var(--sheet-ink)}
.sd-prose h3{font:600 1.15em/1.3 var(--book);margin:1.5em 0 .4em}
.sd-prose a{color:#8f3a12;text-decoration-thickness:1px;text-underline-offset:.18em}
.sd-prose a:hover{color:#5e2208}
.sd-prose blockquote{margin:1.4em 0;padding:.2em 0 .2em 1.1em;border-left:3px solid var(--brass3);color:var(--sheet-soft);font-style:italic}
.sd-prose ul,.sd-prose ol{padding-left:1.3em;margin:0 0 1.15em}
.sd-prose li{margin:.25em 0}
.sd-prose code{font-size:.86em;background:rgba(120,90,40,.12);padding:.1em .3em;border-radius:3px}
.sd-prose hr{border:0;height:1px;background:var(--sheet-rule);margin:2em 0}
.sd-prose [lang=ja]{font-family:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;line-height:1.95;font-style:normal}
.sd-prose>p:first-of-type::first-letter{float:left;font:italic 500 3.6em/.82 var(--book);margin:.06em .1em 0 0;color:#8a5a1e}
/* the journal plugin's Concepts and Threads, dressed for the sheet (overrides rtm-journal.php's block-theme colours) */
body.single-rtm_journal{--rtm-ink:var(--sheet-ink);--rtm-soft:var(--sheet-soft);--rtm-rule:var(--sheet-rule);--rtm-accent:#8f3a12;--rtm-panel:rgba(120,90,40,.07)}
.sd-prose .rtm-concepts,.sd-prose .rtm-threads{font:400 .9rem/1.55 var(--sans);margin:2.4em 0 0;padding:1.1em 1.25em;background:rgba(120,90,40,.07);border:1px solid var(--sheet-rule);border-radius:8px;color:var(--sheet-ink)}
.sd-prose .rtm-concepts+.rtm-threads{margin-top:1em}
.sd-prose .rtm-concepts h2,.sd-prose .rtm-threads h2{font:600 .72rem/1.4 var(--sans)!important;letter-spacing:.16em;text-transform:uppercase;color:#8a5a1e;margin:0 0 .7em!important}
.sd-prose .rtm-concepts dt{font-weight:600;margin-top:.55em}
.sd-prose .rtm-concepts dd{margin:.1em 0 0;color:var(--sheet-soft)}
.sd-prose .rtm-threads ul{list-style:none;margin:0;padding:0}
.sd-prose .rtm-threads li{padding:.45em 0;border-top:1px solid var(--sheet-rule)}
.sd-prose .rtm-threads li:first-child{border-top:0}
.sd-prose .rtm-threads time,.sd-prose .rtm-threads .rtm-shared{display:block;font-size:.88em;color:var(--sheet-soft)}
.sd-prose .rtm-threads .rtm-none{margin:0;color:var(--sheet-soft)}
.sd-entry-meta{display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;font:600 .7rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin:0 0 1.1rem}
.sd-entry-meta a{text-decoration:none;color:var(--muted)}
.sd-entry-meta a:hover{color:var(--brass2)}
.sd-dek{font:italic 300 clamp(1.15rem,1.8vw,1.45rem)/1.5 var(--serif);color:var(--muted);max-width:38em;margin:0}
.sd-pager{max-width:46rem;margin:2rem auto 0;display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.sd-pager a{display:block;padding:1rem 1.1rem;border:1px solid var(--rule2);border-radius:10px;text-decoration:none;min-height:44px}
.sd-pager a:hover{border-color:var(--rule)}
.sd-pager small{display:block;font:600 .66rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin-bottom:.3rem}
.sd-pager .next{text-align:right;grid-column:2}

/* journal list */
.sd-list{max-width:46rem;margin:0 auto;padding:0 var(--gut) clamp(3rem,7vw,6rem);display:grid;gap:1.1rem}
.sd-list .sd-note h3{font-size:1.6rem}

/* ---------- history ---------- */
.sd-hist{max-width:calc(var(--wrap) + 2 * var(--gut));margin:0 auto;padding:0 var(--gut) clamp(3rem,7vw,6rem)}
.sd-tl{list-style:none;margin:0;padding:0;position:relative}
.sd-tl::before{content:"";position:absolute;left:31px;top:.5rem;bottom:0;width:1px;background:linear-gradient(var(--brass),var(--rule2) 85%,transparent)}
.sd-tl>li{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);gap:1.2rem;padding:0 0 clamp(2.2rem,5vw,3.6rem)}
.sd-yr{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font:500 .95rem/1 var(--serif);color:var(--ink);letter-spacing:.02em;position:relative;z-index:1;
 background:radial-gradient(circle at 35% 30%,#f7e3a6,var(--brass) 45%,#7d5d22 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -3px 6px rgba(0,0,0,.35),0 6px 16px rgba(0,0,0,.5)}
.sd-tl-body{display:grid;gap:1.4rem;align-items:start}
@media (min-width:900px){.sd-tl-body.has-fig{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.sd-tl h2{font-size:clamp(1.6rem,3vw,2.3rem);letter-spacing:-.015em;margin:.6rem 0 .8rem}
.sd-tl p{color:var(--muted);font-size:1.08rem;line-height:1.62;max-width:36em}
.sd-tl p strong{color:var(--paper);font-weight:500}
.sd-tl blockquote{margin:1rem 0;padding:.9rem 1.1rem;border-left:2px solid var(--brass);background:rgba(201,162,74,.05);border-radius:0 8px 8px 0;font:italic 300 1.08rem/1.55 var(--serif);color:var(--paper)}
.sd-tl blockquote cite{display:block;margin-top:.5rem;font:500 .74rem/1.4 var(--sans);font-style:normal;letter-spacing:.06em;color:var(--dim)}
.sd-tl figure{margin:0}
.sd-tl figure img{border-radius:10px;box-shadow:0 0 0 1px var(--rule),0 18px 40px rgba(0,0,0,.55)}
.sd-tl figcaption{font:500 .78rem/1.5 var(--sans);color:var(--dim);margin-top:.6rem}
.sd-tl .sd-eyes{margin-top:.2rem}
.sd-src{font:500 .8rem/1.6 var(--sans)!important;color:var(--dim)!important}
.sd-src a{color:var(--muted)}
@media (max-width:560px){.sd-tl::before{left:21px}.sd-tl>li{grid-template-columns:44px minmax(0,1fr);gap:.9rem}.sd-yr{width:44px;height:44px;font-size:.74rem}}

/* ---------- footer ---------- */
.sd-foot{border-top:1px solid var(--rule2);padding:clamp(2.5rem,5vw,4rem) 0 2rem;background:linear-gradient(180deg,transparent,rgba(201,162,74,.03))}
.sd-foot-grid{display:grid;gap:2rem;grid-template-columns:1fr}
@media (min-width:760px){.sd-foot-grid{grid-template-columns:1.4fr 1fr 1fr}}
.sd-foot h2{font:600 .7rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin:0 0 .8rem}
.sd-foot p{color:var(--dim);font-size:.98rem;max-width:26em}
.sd-foot ul{list-style:none;margin:0;padding:0}
.sd-foot li a{display:inline-flex;align-items:center;min-height:40px;color:var(--muted);text-decoration:none;font-size:1rem}
.sd-foot li a:hover{color:var(--brass2)}
.sd-foot-base{margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid var(--rule2);font:500 .76rem/1.6 var(--sans);color:var(--dim);display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;justify-content:space-between}

/* ---------- work page: the portfolio block sits on the dark band ---------- */
.page-template-default.sd-work main .rtm-pf,.sd-work .rtm-pf{padding-top:0}
.sd-work .rtm-pf .pf-hero{padding-top:clamp(1.5rem,4vw,3.5rem)}

/* ---------- 404 ---------- */
.sd-404{text-align:center;padding:clamp(3rem,10vw,7rem) var(--gut)}
.sd-404 .sd-device-wrap{width:min(70%,300px);margin:0 auto 2rem}
.sd-404 h1{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:200;margin-bottom:1rem}
.sd-404 p{color:var(--muted)}
.sd-404 .sd-btns{justify-content:center;margin-top:1.5rem}

/* reveal on scroll (only when JS marks the page ready and motion is welcome) */
@media (prefers-reduced-motion:no-preference){
 .js-ready [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
 .js-ready [data-reveal].is-in{opacity:1;transform:none}
}
@media (min-width:700px){.sd-tl .sd-eyes{grid-template-columns:repeat(4,minmax(0,1fr));max-width:56rem}}
html body:has(.rtm-pf){background:var(--ink)}
/* rtm-journal.php caps <main> at 40rem on /journal/ (written for a block theme); this theme lays out its own columns */
body.post-type-archive-rtm_journal main#main{max-width:none;margin-left:0!important;margin-right:0!important}