/* Light theme overlay — loaded after style.css (theme=light build only).
   "Molten Forge" on warm paper: ink text, ember accents, dark charcoal footer. */
:root{
  --bg:#f7f4ee; --bg-2:#efeae0; --panel:#ffffff; --panel-2:#f3eee5;
  --line:#e2dbcd; --line-2:#cfc6b4;
  --text:#17181b; --muted:#5a564e; --dim:#8a8578;
  --amber:#b4520a; --ok:#177a42;
}
::selection{background:#ffb02e;color:#140800}

/* header */
.site-header::before{background:rgba(247,244,238,.8)}
.site-header.scrolled::before{background:rgba(247,244,238,.95)}
.logo{background:transparent;padding:0}
.dd{box-shadow:0 24px 50px rgba(60,40,10,.18)}

/* hero */
.hero::before{background:
  radial-gradient(60% 55% at 80% 72%,rgba(255,106,26,.30),transparent 70%),
  radial-gradient(40% 40% at 92% 100%,rgba(255,176,46,.35),transparent 70%),
  linear-gradient(180deg,#f7f4ee 0%,#f2ebdf 100%)}
.hero::after{opacity:.55}
.hero h1{color:#17181b}
.hero h1 em{filter:drop-shadow(0 6px 22px rgba(255,106,26,.28))}
.hero p.lede{color:#3b3832}
.btn-ghost{border-color:#b9ae98;color:#17181b}
.btn-ghost:hover{background:#17181b;border-color:#17181b;color:#fff}

/* sections */
.stats{background:#fff}
.features{box-shadow:0 20px 50px -30px rgba(80,50,10,.25)}
.feature::before{background:radial-gradient(80% 60% at 50% 120%,rgba(255,106,26,.22),transparent 70%)}
.feature:hover h3 a{color:#b4520a}
.work{background:var(--bg-2)}
.work-card{background:#fff;aspect-ratio:auto;display:flex;flex-direction:column;overflow:hidden;transition:border-color .3s,box-shadow .3s,transform .3s var(--ease)}
.work-card:hover,.work-card:focus-visible{border-color:#ff6a1a;box-shadow:0 18px 40px -22px rgba(120,60,10,.4);transform:translateY(-4px)}
.work-card img{height:auto;aspect-ratio:1/1;object-fit:contain;padding:14px;background:#fff;filter:none;border-bottom:1px solid var(--line)}
.work-card:hover img,.work-card:focus-visible img{transform:scale(1.04);filter:none}
.work-card .cap,.work-card:hover .cap,.work-card:focus-visible .cap{position:static;inset:auto;background:none;padding:22px 24px 26px;justify-content:flex-start;flex:1}
.work-card h3{color:#17181b}
.work-card p,.work-card:hover p,.work-card:focus-visible p{color:#3b3832;max-height:none;opacity:1;margin:6px 0 0}
.work-card .tag{color:#b4520a}
.work-ico{height:170px;display:grid;place-items:center;color:#b4520a;border-bottom:1px solid var(--line);background:radial-gradient(70% 120% at 50% 130%,rgba(255,106,26,.22),transparent 70%),#fff7ec;transition:background .4s}
.work-ico svg{width:84px;height:84px;transition:transform .5s var(--ease)}
.work-card:hover .work-ico svg,.work-card:focus-visible .work-ico svg{transform:scale(1.12) rotate(-4deg)}
.work-card:hover .work-ico{background:radial-gradient(70% 120% at 50% 130%,rgba(255,106,26,.38),transparent 70%),#fff1de}
.cta-band{background:radial-gradient(70% 140% at 50% 130%,rgba(255,106,26,.30),transparent 70%),var(--bg-2)}

/* inner pages */
.page-hero{background:radial-gradient(50% 120% at 100% 100%,rgba(255,106,26,.20),transparent 70%),#efeae0}
.prose>p:first-child,.prose>p.lead{color:#2a2823}
.prose p,.prose li,td{color:#3b3832}
th{background:#efe8da;color:#8f3f06;border-bottom-color:var(--line-2)}
tbody tr:hover td{background:rgba(255,106,26,.07)}
table.compare td:last-child{background:rgba(23,122,66,.07)}
.alloy:hover,.card:hover{box-shadow:0 18px 40px -22px rgba(120,60,10,.35)}
.alloy .tags span{border-color:#e3c9a8;background:#fff6e8;color:#8f3f06}
.chip{background:#fff}
.chip:hover{border-color:#17181b;color:#17181b}
.timeline li.lit .n{box-shadow:0 0 0 6px rgba(255,106,26,.14),0 0 22px rgba(255,106,26,.35);color:#b4520a}
.timeline h3{color:#17181b}
.side a.on{background:linear-gradient(90deg,rgba(255,106,26,.14),transparent)}
.field input:focus,.field textarea:focus{box-shadow:0 0 0 3px rgba(255,106,26,.22)}
.to-top{background:#fff}

/* footer stays dark for anchoring; re-scope tokens inside it */
.site-footer{--text:#ece8e2;--muted:#a8a39b;--dim:#77736c;--line:#2b2f35;--amber:#ffb02e;background:#15171a;border-top:0}
.site-footer li a{color:#ece8e2}
.site-footer li a:hover{color:#ffb02e}
.copy a{color:#a8a39b}

/* ---------- contact form (PHP): captcha, honeypot, server messages ---------- */
.field.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.cap-row{display:flex;align-items:center;gap:12px}
.cap-q{font-family:var(--f-display);font-size:1.8rem;font-weight:600;letter-spacing:.06em;color:#17181b;background:#fff7ec;border:1px dashed #d9a574;padding:8px 18px;border-radius:3px;white-space:nowrap;user-select:none}
.cap-row input{max-width:120px;text-align:center;font-size:1.2rem}
.fmsg.ok{border-left-color:var(--ok);background:#effaf3;color:#14532d;margin-bottom:18px}
.fmsg.err{border-left-color:#c0391b;background:#fff1ed;color:#7a1f0c;margin-bottom:18px}
.fmsg.err ul{margin:0;padding-left:18px}

/* ---------- rich hero (inner pages) ---------- */
.hero2{position:relative;overflow:hidden;isolation:isolate;border-bottom:1px solid var(--line);background:
  radial-gradient(55% 90% at 90% 30%,rgba(255,106,26,.24),transparent 70%),
  radial-gradient(40% 60% at 100% 100%,rgba(255,176,46,.32),transparent 70%),
  linear-gradient(180deg,#faf7f1,#f1eadd)}
.hero2 canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero2::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;opacity:.5;-webkit-mask-image:radial-gradient(70% 90% at 25% 40%,#000,transparent);mask-image:radial-gradient(70% 90% at 25% 40%,#000,transparent)}
.hero2::before{content:"";position:absolute;left:0;bottom:-1px;height:3px;width:min(40%,420px);background:var(--glow);z-index:1}
.h2-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:40px;align-items:center;padding-top:clamp(52px,7vw,96px);padding-bottom:clamp(56px,8vw,104px)}
.h2-copy .mono{display:block;margin:6px 0 14px}
.hero2 h1{font-size:clamp(2.7rem,6.6vw,5.8rem);text-transform:uppercase;line-height:.93;margin:0 0 .25em;color:#17181b}
.hero2 .sub{font-family:var(--f-display);font-weight:600;font-size:clamp(1.35rem,2.5vw,2rem);line-height:1.15;color:#b4520a;margin:0 0 .6em;letter-spacing:.02em}
.hero2 .lead{font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.6;color:#2a2823;max-width:660px;margin:0 0 28px}
.hero2 .lead a{border-bottom:1px solid rgba(180,82,10,.5)}
.hero2 .actions{display:flex;flex-wrap:wrap;gap:12px}
.jump{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line-2)}
.jump .mono{margin:0 8px 0 0;color:#8a8578}
.jump a{font-size:.88rem;font-weight:500;color:#17181b;background:rgba(255,255,255,.7);border:1px solid var(--line-2);padding:6px 14px;border-radius:99px;transition:all .25s}
.jump a:hover{background:#17181b;border-color:#17181b;color:#fff}
.h2-art{position:relative;aspect-ratio:1/1;max-width:420px;width:100%;justify-self:end;color:#b9ac94}
.h2-art svg{width:100%;height:100%;overflow:visible}
.h2-art .idx{position:absolute;left:0;top:-4px;z-index:2;font-family:var(--f-display);font-weight:600;font-size:clamp(3.4rem,7vw,6rem);line-height:1;color:transparent;-webkit-text-stroke:1.5px #17181b}
.h2-art .idx small{font-size:.38em;-webkit-text-stroke:0;color:#8a8578;margin-left:6px;letter-spacing:.05em}
.spin-a{transform-origin:200px 200px;animation:spin 60s linear infinite}
.spin-b{transform-origin:200px 200px;animation:spin 40s linear infinite reverse}
@keyframes spin{to{transform:rotate(360deg)}}
.h2-side{display:grid;gap:14px;justify-self:end;width:100%;max-width:420px}
.cards2{display:grid;gap:14px}
.qc{display:block;background:rgba(255,255,255,.85);border:1px solid var(--line-2);padding:22px 24px;color:#17181b;position:relative;transition:transform .3s var(--ease),box-shadow .3s}
.qc::before{content:"";position:absolute;left:-1px;top:-1px;width:56px;height:3px;background:var(--glow)}
.qc:hover{transform:translateY(-3px);box-shadow:0 16px 36px -20px rgba(120,60,10,.4);color:#17181b}
.qc b{display:block;font-family:var(--f-display);font-size:1.6rem;font-weight:600;line-height:1.15;margin-top:6px}
.rich .prose>p:first-child{font-size:1rem;line-height:1.65;color:#3b3832}
.rich .prose h2{scroll-margin-top:140px}
.rich .prose>ul:first-child{margin-top:0}
@media(max-width:900px){
  .h2-grid{grid-template-columns:minmax(0,1fr)}
  .h2-art{max-width:220px;justify-self:start;margin-top:8px}
  .h2-side{justify-self:stretch;max-width:none}
}
@media(prefers-reduced-motion:reduce){.spin-a,.spin-b{animation:none}}
