*{box-sizing:border-box}body{margin:0;background:#10100f;color:#e8e3d8;font:16px/1.6 Arial,sans-serif}a{color:inherit;text-decoration:none}header{height:80px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #34332f}nav{display:flex;gap:28px;font-size:12px;text-transform:uppercase;letter-spacing:.1em}.hero{min-height:80vh;padding:18vh 6vw 8vh;position:relative;display:flex;align-items:end}.hero>.photo{position:absolute;inset:0;opacity:.25}.hero>div:last-child{position:relative;max-width:850px}small{color:#b7a17a;letter-spacing:.15em;font-size:11px}h1,h2,h3{font-family:Georgia,serif;font-weight:400;line-height:1}h1{font-size:clamp(4rem,9vw,8rem);margin:15px 0}h2{font-size:clamp(3rem,6vw,5rem)}i{color:#c7b99e}p{color:#bdb8af;max-width:650px}main>section{padding:110px 6vw;max-width:1500px;margin:auto}.cats{margin-top:45px;border-top:1px solid #383733}.cats article{border-bottom:1px solid #383733}.cat{width:100%;padding:25px 0;background:none;border:0;color:#eee;text-align:left;font:2rem Georgia;display:flex;justify-content:space-between;cursor:pointer}.cat b{color:#b7a17a}.body{display:none;padding-bottom:35px}.body.open{display:block}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid img,.mainimg,.gallery img{width:100%;object-fit:cover}.grid img,.small{aspect-ratio:4/3}.photo{display:grid;place-items:center;background:#211f1c;color:#777;letter-spacing:.1em}.services{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.services div{padding:30px 0;border-top:1px solid #383733}.project{padding:100px 6vw;max-width:1500px;margin:auto}.project>a{display:block;color:#b7a17a;margin-bottom:30px}.project h1{max-width:1000px}.meta{color:#aaa;margin:20px 0 50px}.mainimg{max-height:75vh}.story{display:grid;grid-template-columns:1fr 1.5fr;gap:8vw;padding:100px 0}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;padding-bottom:100px}.gallery img{aspect-ratio:4/3}footer{padding:35px 6vw;border-top:1px solid #383733;color:#888}@media(max-width:750px){nav{display:none}.grid,.services,.story,.gallery{grid-template-columns:1fr}.hero{min-height:80vh;padding:15vh 6vw 7vh}h1{font-size:4rem}.project{padding-top:70px}}

/* =======================
   V6 portfolio themes
   ======================= */
body{transition:background-color .7s ease,color .7s ease,background .7s ease}
body[data-theme="default"]{background:#11110f;color:#e8e3d8}

/* Lighting — warm cream / soft */
body[data-theme="lighting"]{background:#eee6d5;color:#2c2924}
body[data-theme="lighting"] header,
body[data-theme="lighting"] footer{background:#eee6d5;border-color:#d6cbb7}
body[data-theme="lighting"] header a,
body[data-theme="lighting"] nav a,
body[data-theme="lighting"] .cat{color:#342f28}
body[data-theme="lighting"] .cats article{border-color:#d3c5ad}

/* Blacksmithing — forge glow */
body[data-theme="blacksmithing"]{
  background:
    radial-gradient(circle at 15% 15%,rgba(102,33,132,.65),transparent 30%),
    radial-gradient(circle at 55% 35%,rgba(164,32,55,.72),transparent 38%),
    radial-gradient(circle at 82% 55%,rgba(238,92,24,.7),transparent 34%),
    linear-gradient(120deg,#1d1026 0%,#3d162d 30%,#741f28 57%,#b6421e 78%,#1a100d 100%);
  background-attachment:fixed;color:#fff2e9
}
body[data-theme="blacksmithing"] .cats article{border-color:rgba(255,126,65,.62)}
body[data-theme="blacksmithing"] .cat{color:#fff2e9}
body[data-theme="blacksmithing"] .cat b{color:#ff9a61}

/* Sculpture — stone/slate */
body[data-theme="sculpture"]{background:#5e625f;color:#ece9df}
body[data-theme="sculpture"] header,
body[data-theme="sculpture"] footer{background:#4e514f;border-color:#777a75}
body[data-theme="sculpture"] .cats article{border-color:#858780}
body[data-theme="sculpture"] .cat{color:#eeeae1}

/* Architectural — original */
body[data-theme="architectural-metalwork"]{background:#11110f;color:#e8e3d8}

/* Fabrication — industrial */
body[data-theme="fabrication-installation"]{background:#303438;color:#e3e6e8}
body[data-theme="fabrication-installation"] header,
body[data-theme="fabrication-installation"] footer{background:#292c2f;border-color:#555b60}
body[data-theme="fabrication-installation"] .cats article{border-color:#5a6064}
body[data-theme="fabrication-installation"] .cat{color:#e3e6e8}

/* Restoration — aged / earthy */
body[data-theme="restoration"]{background:#332b22;color:#ece5da}
body[data-theme="restoration"] header,
body[data-theme="restoration"] footer{background:#2b241d;border-color:#5e4d3d}
body[data-theme="restoration"] .cats article{border-color:#645444}
body[data-theme="restoration"] .cat{color:#efe6d8}


/* ==========================================================
   V7 slow, flash-free portfolio theme transitions
   ========================================================== */

html { background:#11110f; }

body {
  position:relative;
  isolation:isolate;
  background:#11110f !important;
  color:#e8e3d8;
  transition:color 2.1s ease-in-out;
}

body::before {
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  background:transparent;
  transition:opacity 2.1s ease-in-out;
}

body.theme-fading::before {
  opacity:0 !important;
}

body[data-theme="default"]::before,
body[data-theme="architectural-metalwork"]::before {
  opacity:0;
}

/* Lighting — warm cream / soft */
body[data-theme="lighting"]::before {
  opacity:1;
  background:
    radial-gradient(circle at 18% 28%, rgba(255,250,232,.78), transparent 42%),
    radial-gradient(circle at 82% 70%, rgba(234,213,174,.40), transparent 48%),
    linear-gradient(135deg,#f3ead8 0%,#e7dcc5 100%);
}
body[data-theme="lighting"] { color:#302b24; }
body[data-theme="lighting"] header,
body[data-theme="lighting"] footer {
  background:rgba(238,230,213,.84) !important;
  border-color:#d6cbb7 !important;
}
body[data-theme="lighting"] header a,
body[data-theme="lighting"] nav a,
body[data-theme="lighting"] .cat {
  color:#342f28 !important;
}

/* BLACKSMITHING
   Heat on both edges, fading into charcoal.
   Centre ~50% stays mostly default charcoal.
*/
body[data-theme="blacksmithing"]::before {
  opacity:1;
  background:
    /* LEFT edge: white/yellow -> purple -> orange -> cherry red */
    radial-gradient(ellipse 22% 75% at -3% 50%,
      rgba(255,255,245,.98) 0%,
      rgba(255,238,122,.95) 18%,
      rgba(255,238,122,0) 47%),

    radial-gradient(ellipse 28% 82% at 1% 50%,
      rgba(99,28,135,.92) 0%,
      rgba(99,28,135,.72) 32%,
      rgba(99,28,135,0) 72%),

    radial-gradient(ellipse 32% 88% at 5% 51%,
      rgba(240,94,22,.88) 0%,
      rgba(240,94,22,.64) 34%,
      rgba(240,94,22,0) 75%),

    radial-gradient(ellipse 36% 92% at 9% 52%,
      rgba(154,25,47,.78) 0%,
      rgba(154,25,47,.52) 38%,
      rgba(154,25,47,0) 76%),

    /* RIGHT edge: mirrored/reversed */
    radial-gradient(ellipse 36% 92% at 91% 52%,
      rgba(154,25,47,.78) 0%,
      rgba(154,25,47,.52) 38%,
      rgba(154,25,47,0) 76%),

    radial-gradient(ellipse 32% 88% at 95% 51%,
      rgba(240,94,22,.88) 0%,
      rgba(240,94,22,.64) 34%,
      rgba(240,94,22,0) 75%),

    radial-gradient(ellipse 28% 82% at 99% 50%,
      rgba(99,28,135,.92) 0%,
      rgba(99,28,135,.72) 32%,
      rgba(99,28,135,0) 72%),

    radial-gradient(ellipse 22% 75% at 103% 50%,
      rgba(255,255,245,.98) 0%,
      rgba(255,238,122,.95) 18%,
      rgba(255,238,122,0) 47%),

    linear-gradient(#11110f,#11110f);
}
body[data-theme="blacksmithing"] { color:#f7eee8; }
body[data-theme="blacksmithing"] header,
body[data-theme="blacksmithing"] footer {
  background:rgba(17,17,15,.80) !important;
  border-color:rgba(223,103,57,.40) !important;
}
body[data-theme="blacksmithing"] .cat { color:#fff5ee !important; }

/* Sculpture — stone/slate */
body[data-theme="sculpture"]::before {
  opacity:1;
  background:
    radial-gradient(circle at 20% 20%,rgba(139,145,141,.18),transparent 36%),
    radial-gradient(circle at 76% 68%,rgba(48,54,52,.30),transparent 42%),
    linear-gradient(130deg,#606562,#4c514f);
}
body[data-theme="sculpture"] header,
body[data-theme="sculpture"] footer {
  background:rgba(65,69,67,.84) !important;
}

/* Fabrication — industrial */
body[data-theme="fabrication-installation"]::before {
  opacity:1;
  background:
    linear-gradient(120deg,rgba(255,255,255,.022),transparent 35%),
    linear-gradient(135deg,#353a3e,#282d31);
}
body[data-theme="fabrication-installation"] header,
body[data-theme="fabrication-installation"] footer {
  background:rgba(38,42,45,.86) !important;
}

/* Restoration — aged/earthy */
body[data-theme="restoration"]::before {
  opacity:1;
  background:
    radial-gradient(circle at 15% 35%,rgba(103,73,42,.24),transparent 40%),
    linear-gradient(135deg,#3b3127,#2d2720);
}
body[data-theme="restoration"] header,
body[data-theme="restoration"] footer {
  background:rgba(43,36,29,.86) !important;
}

body header,
body footer {
  transition:background-color 2.1s ease-in-out,border-color 2.1s ease-in-out,color 2.1s ease-in-out;
}

body.theme-fading header,
body.theme-fading footer {
  background:rgba(17,17,15,.92) !important;
}

@media (prefers-reduced-motion: reduce) {
  body,
  body::before,
  body header,
  body footer {
    transition:none !important;
  }
}


/* ==========================================================
   V8 TRUE CROSS-FADE THEMES
   Two fixed background layers cross-fade simultaneously.
   There is NO wait before the next colour begins appearing.
   ========================================================== */

html,
body {
  background:#11110f !important;
}

body {
  position:relative;
  isolation:isolate;
}

/* Disable older pseudo-element theme overlays from V7. */
body::before,
body::after {
  display:none !important;
  content:none !important;
}

.theme-layer {
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:0;
  background:#11110f;
  transition:opacity 3s ease-in-out;
  will-change:opacity;
}

#theme-layer-a {
  opacity:1;
}

/* Default / architectural */
.theme-layer.theme-default,
.theme-layer.theme-architectural-metalwork {
  background:#11110f;
}

/* Lighting — warm soft cream */
.theme-layer.theme-lighting {
  background:
    radial-gradient(circle at 18% 28%, rgba(255,252,238,.82), transparent 42%),
    radial-gradient(circle at 82% 70%, rgba(232,209,166,.38), transparent 48%),
    linear-gradient(135deg,#f4ecd9 0%,#e7dcc5 100%);
}

/* BLACKSMITHING
   Approx. 50% charcoal in the middle.
   LEFT edge -> centre:
   white/yellow heat -> purple -> orange -> cherry red -> charcoal

   RIGHT centre -> edge:
   charcoal -> cherry red -> orange -> purple -> yellow/white
*/
.theme-layer.theme-blacksmithing {
  background:
    linear-gradient(
      90deg,
      #fffdf0 0%,
      #ffe46b 2.5%,
      #6a218f 7%,
      #8d2368 9.5%,
      #ed6b20 14%,
      #b52c31 19%,
      #5f1c25 22%,
      #11110f 25%,

      #11110f 75%,
      #5f1c25 78%,
      #b52c31 81%,
      #ed6b20 86%,
      #8d2368 90.5%,
      #6a218f 93%,
      #ffe46b 97.5%,
      #fffdf0 100%
    );
}

/* Add a subtle darker veil so the edge colours feel like furnace glow,
   not flat rainbow stripes, while keeping centre charcoal. */
.theme-layer.theme-blacksmithing::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      90deg,
      rgba(17,17,15,0) 0%,
      rgba(17,17,15,.12) 12%,
      rgba(17,17,15,.58) 24%,
      rgba(17,17,15,0) 25%,
      rgba(17,17,15,0) 75%,
      rgba(17,17,15,.58) 76%,
      rgba(17,17,15,.12) 88%,
      rgba(17,17,15,0) 100%
    );
}

/* Sculpture — stone/slate */
.theme-layer.theme-sculpture {
  background:
    radial-gradient(circle at 18% 18%,rgba(151,156,151,.16),transparent 34%),
    radial-gradient(circle at 78% 72%,rgba(38,43,42,.30),transparent 42%),
    linear-gradient(135deg,#616662,#4c514f);
}

/* Fabrication — industrial */
.theme-layer.theme-fabrication-installation {
  background:
    linear-gradient(120deg,rgba(255,255,255,.025),transparent 34%),
    linear-gradient(135deg,#373c40,#292e32);
}

/* Restoration */
.theme-layer.theme-restoration {
  background:
    radial-gradient(circle at 15% 35%,rgba(111,77,43,.24),transparent 40%),
    linear-gradient(135deg,#3b3127,#2c261f);
}

/* Text/header colours also transition at the same pace rather than jumping. */
body,
body header,
body footer,
body header a,
body nav a,
body .cat {
  transition:
    color 3s ease-in-out,
    background-color 3s ease-in-out,
    border-color 3s ease-in-out !important;
}

body[data-theme="lighting"] {
  color:#302b24;
}
body[data-theme="lighting"] header,
body[data-theme="lighting"] footer {
  background:rgba(238,230,213,.84) !important;
  border-color:#d6cbb7 !important;
}
body[data-theme="lighting"] header a,
body[data-theme="lighting"] nav a,
body[data-theme="lighting"] .cat {
  color:#342f28 !important;
}

body[data-theme="blacksmithing"] {
  color:#f7eee8;
}
body[data-theme="blacksmithing"] header,
body[data-theme="blacksmithing"] footer {
  background:rgba(17,17,15,.78) !important;
  border-color:rgba(224,105,57,.40) !important;
}
body[data-theme="blacksmithing"] .cat {
  color:#fff5ee !important;
}

body[data-theme="sculpture"] {
  color:#ece9df;
}
body[data-theme="sculpture"] header,
body[data-theme="sculpture"] footer {
  background:rgba(65,69,67,.84) !important;
}

body[data-theme="fabrication-installation"] {
  color:#e3e6e8;
}
body[data-theme="fabrication-installation"] header,
body[data-theme="fabrication-installation"] footer {
  background:rgba(38,42,45,.86) !important;
}

body[data-theme="restoration"] {
  color:#ece5da;
}
body[data-theme="restoration"] header,
body[data-theme="restoration"] footer {
  background:rgba(43,36,29,.86) !important;
}

body[data-theme="default"],
body[data-theme="architectural-metalwork"] {
  color:#e8e3d8;
}
body[data-theme="default"] header,
body[data-theme="default"] footer,
body[data-theme="architectural-metalwork"] header,
body[data-theme="architectural-metalwork"] footer {
  background:transparent !important;
}

@media (prefers-reduced-motion: reduce) {
  .theme-layer,
  body,
  body header,
  body footer,
  body header a,
  body nav a,
  body .cat {
    transition:none !important;
  }
}


/* ==========================================================
   V9 theme refinements
   ========================================================== */

/* Three background layers; all transitions are real opacity fades. */
.theme-layer {
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:0;
  background:#11110f;
  transition:opacity 3.2s ease-in-out;
  will-change:opacity;
}

/*
  BLACKSMITHING — uniform hot-forged steel.
  Dominant yellow/orange heat with irregular darker millscale patches.
  The texture is deliberately non-symmetrical and non-rainbow.
*/
.theme-layer.theme-blacksmithing {
  background:
    /* darker millscale islands */
    radial-gradient(ellipse 22% 18% at 18% 22%, rgba(38,30,27,.72) 0%, rgba(48,34,29,.58) 36%, transparent 70%),
    radial-gradient(ellipse 18% 25% at 43% 38%, rgba(47,36,32,.68) 0%, rgba(54,39,32,.48) 42%, transparent 72%),
    radial-gradient(ellipse 27% 17% at 72% 18%, rgba(38,30,28,.70) 0%, rgba(52,36,30,.50) 38%, transparent 72%),
    radial-gradient(ellipse 16% 22% at 84% 67%, rgba(41,31,28,.66) 0%, rgba(55,38,30,.46) 42%, transparent 73%),
    radial-gradient(ellipse 24% 15% at 27% 76%, rgba(42,31,27,.69) 0%, rgba(59,39,29,.45) 40%, transparent 72%),

    /* cooler red-orange transitions around hot zones */
    radial-gradient(circle at 13% 48%, rgba(255,188,34,.92) 0%, rgba(247,111,20,.72) 30%, transparent 58%),
    radial-gradient(circle at 54% 55%, rgba(255,212,72,.94) 0%, rgba(255,133,26,.70) 33%, transparent 62%),
    radial-gradient(circle at 88% 36%, rgba(255,195,37,.90) 0%, rgba(245,101,18,.70) 30%, transparent 58%),

    /* main heated steel body */
    linear-gradient(125deg,
      #d84d16 0%,
      #f17817 16%,
      #ffb52d 34%,
      #ffd968 50%,
      #f6a127 67%,
      #df5a18 83%,
      #9b301d 100%
    );
}

/* Fine, irregular millscale-like dark mottling */
.theme-layer.theme-blacksmithing::before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.42;
  background:
    radial-gradient(circle at 8% 13%, rgba(27,27,25,.70) 0 1.2%, transparent 2.5%),
    radial-gradient(circle at 24% 31%, rgba(30,28,25,.65) 0 1.8%, transparent 3.4%),
    radial-gradient(circle at 39% 16%, rgba(35,31,27,.60) 0 1.1%, transparent 2.8%),
    radial-gradient(circle at 58% 29%, rgba(28,27,25,.64) 0 1.5%, transparent 3.1%),
    radial-gradient(circle at 76% 12%, rgba(32,29,26,.66) 0 1.4%, transparent 2.8%),
    radial-gradient(circle at 91% 47%, rgba(29,27,25,.70) 0 1.8%, transparent 3.5%),
    radial-gradient(circle at 68% 72%, rgba(34,29,26,.63) 0 1.4%, transparent 3.2%),
    radial-gradient(circle at 44% 82%, rgba(26,26,24,.68) 0 1.6%, transparent 3.4%),
    radial-gradient(circle at 17% 69%, rgba(36,30,26,.65) 0 1.3%, transparent 3%);
  background-size:100% 100%;
}

/* Gentle dark glaze so text remains readable without killing the heated-steel look */
.theme-layer.theme-blacksmithing::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(rgba(17,17,15,.20),rgba(17,17,15,.30));
}

/* Social media link points */
.social-links {
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:28px;
}
.social-links a {
  display:inline-block;
  padding:11px 15px;
  border:1px solid currentColor;
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:11px;
  transition:opacity .25s ease;
}
.social-links a:hover {
  opacity:.65;
}
footer {
  gap:20px;
  flex-wrap:wrap;
}
.footer-social a {
  text-decoration:underline;
  text-underline-offset:3px;
}

@media(max-width:800px){
  .social-links a {
    min-height:44px;
    display:flex;
    align-items:center;
  }
}


/* ==========================================================
   V10 blacksmithing millscale refinement
   More natural, irregular scale concentrated toward the sides.
   Centre stays cleaner / hotter.
   ========================================================== */

.theme-layer.theme-blacksmithing {
  background:
    /* large irregular darker scale zones — mostly outer thirds */
    radial-gradient(ellipse 18% 12% at 8% 18%, rgba(35,29,26,.78) 0%, rgba(47,34,29,.58) 42%, transparent 74%),
    radial-gradient(ellipse 14% 20% at 15% 42%, rgba(39,31,27,.72) 0%, rgba(52,36,30,.52) 40%, transparent 73%),
    radial-gradient(ellipse 21% 13% at 6% 73%, rgba(37,30,27,.76) 0%, rgba(50,34,29,.50) 42%, transparent 72%),
    radial-gradient(ellipse 11% 16% at 22% 84%, rgba(42,32,28,.70) 0%, rgba(58,39,30,.47) 38%, transparent 70%),

    radial-gradient(ellipse 17% 11% at 91% 15%, rgba(34,29,26,.78) 0%, rgba(48,34,29,.55) 41%, transparent 73%),
    radial-gradient(ellipse 13% 19% at 84% 39%, rgba(40,31,27,.72) 0%, rgba(54,37,30,.50) 40%, transparent 72%),
    radial-gradient(ellipse 20% 14% at 95% 68%, rgba(36,30,27,.76) 0%, rgba(51,35,29,.52) 42%, transparent 73%),
    radial-gradient(ellipse 12% 17% at 79% 87%, rgba(43,33,28,.68) 0%, rgba(58,39,30,.46) 38%, transparent 70%),

    /* cooler orange/red shoulders near the sides */
    radial-gradient(circle at 13% 48%, rgba(255,183,29,.90) 0%, rgba(241,102,19,.68) 31%, transparent 61%),
    radial-gradient(circle at 87% 44%, rgba(255,190,33,.90) 0%, rgba(242,104,18,.68) 31%, transparent 61%),

    /* hot central body */
    radial-gradient(ellipse 50% 72% at 50% 50%, rgba(255,222,105,.54) 0%, rgba(255,183,48,.30) 48%, transparent 77%),
    linear-gradient(125deg,
      #d94f16 0%,
      #ef7417 15%,
      #f7a425 31%,
      #ffd25e 48%,
      #ffca4b 58%,
      #f18b1d 72%,
      #d85417 87%,
      #a1341d 100%
    );
}

/* Natural, chipped / torn-looking millscale fragments.
   Mostly positioned in the outer 25% of the page. */
.theme-layer.theme-blacksmithing::before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.58;
  background:
    /* LEFT */
    radial-gradient(ellipse 3.4% 1.6% at 4% 11%, rgba(24,24,22,.90) 0 58%, transparent 72%),
    radial-gradient(ellipse 2.2% 3.8% at 10% 19%, rgba(31,28,25,.82) 0 54%, transparent 70%),
    radial-gradient(ellipse 4.7% 2.1% at 16% 29%, rgba(28,27,24,.86) 0 52%, transparent 69%),
    radial-gradient(ellipse 2.8% 1.5% at 7% 36%, rgba(37,31,27,.84) 0 55%, transparent 70%),
    radial-gradient(ellipse 5.2% 2.4% at 19% 48%, rgba(26,25,23,.88) 0 54%, transparent 70%),
    radial-gradient(ellipse 2.6% 4.4% at 12% 61%, rgba(33,29,25,.85) 0 55%, transparent 71%),
    radial-gradient(ellipse 4.1% 1.9% at 21% 69%, rgba(27,26,24,.86) 0 54%, transparent 70%),
    radial-gradient(ellipse 3.0% 2.2% at 6% 79%, rgba(35,30,26,.84) 0 53%, transparent 70%),
    radial-gradient(ellipse 5.0% 2.1% at 17% 90%, rgba(25,24,22,.88) 0 56%, transparent 72%),

    /* RIGHT */
    radial-gradient(ellipse 3.7% 1.8% at 96% 13%, rgba(24,24,22,.90) 0 58%, transparent 72%),
    radial-gradient(ellipse 2.4% 4.0% at 90% 21%, rgba(31,28,25,.82) 0 54%, transparent 70%),
    radial-gradient(ellipse 4.5% 2.0% at 84% 31%, rgba(28,27,24,.86) 0 52%, transparent 69%),
    radial-gradient(ellipse 2.9% 1.6% at 93% 39%, rgba(37,31,27,.84) 0 55%, transparent 70%),
    radial-gradient(ellipse 5.3% 2.3% at 81% 50%, rgba(26,25,23,.88) 0 54%, transparent 70%),
    radial-gradient(ellipse 2.7% 4.2% at 88% 63%, rgba(33,29,25,.85) 0 55%, transparent 71%),
    radial-gradient(ellipse 4.0% 2.0% at 79% 72%, rgba(27,26,24,.86) 0 54%, transparent 70%),
    radial-gradient(ellipse 3.1% 2.3% at 94% 81%, rgba(35,30,26,.84) 0 53%, transparent 70%),
    radial-gradient(ellipse 4.8% 2.0% at 83% 91%, rgba(25,24,22,.88) 0 56%, transparent 72%),

    /* smaller scattered side flakes */
    radial-gradient(ellipse 1.3% 2.5% at 3% 55%, rgba(29,27,24,.78) 0 52%, transparent 70%),
    radial-gradient(ellipse 1.8% 1.1% at 24% 15%, rgba(40,32,27,.75) 0 50%, transparent 68%),
    radial-gradient(ellipse 1.5% 2.8% at 97% 58%, rgba(29,27,24,.78) 0 52%, transparent 70%),
    radial-gradient(ellipse 1.9% 1.2% at 76% 17%, rgba(40,32,27,.75) 0 50%, transparent 68%);
}

/* Keep the centre visually cleaner while retaining depth at the edges */
.theme-layer.theme-blacksmithing::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,
      rgba(17,17,15,.24) 0%,
      rgba(17,17,15,.10) 18%,
      rgba(17,17,15,0) 31%,
      rgba(17,17,15,0) 69%,
      rgba(17,17,15,.10) 82%,
      rgba(17,17,15,.24) 100%
    );
}


/* ==========================================================
   V11 BLACKSMITHING — USER-SUPPLIED FORGED STEEL IMAGE
   Uses assets/blacksmithing-forged-steel.png directly.
   A charcoal mask preserves a dark central reading area while
   allowing the hot forged scale to remain visible at both sides.
   ========================================================== */

.theme-layer.theme-blacksmithing {
  background-image:
    linear-gradient(
      90deg,
      rgba(17,17,15,.10) 0%,
      rgba(17,17,15,.16) 9%,
      rgba(17,17,15,.38) 20%,
      rgba(17,17,15,.78) 31%,
      rgba(17,17,15,.96) 39%,
      rgba(17,17,15,.985) 46%,
      rgba(17,17,15,.985) 54%,
      rgba(17,17,15,.96) 61%,
      rgba(17,17,15,.78) 69%,
      rgba(17,17,15,.38) 80%,
      rgba(17,17,15,.16) 91%,
      rgba(17,17,15,.10) 100%
    ),
    url("assets/blacksmithing-forged-steel.png") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}

/* Remove the previous procedural millscale layers when this real image is used. */
.theme-layer.theme-blacksmithing::before,
.theme-layer.theme-blacksmithing::after {
  content:none !important;
  display:none !important;
}

/* Slightly deepen the surrounding UI so text stays clear over the photographic heat. */
body[data-theme="blacksmithing"] header,
body[data-theme="blacksmithing"] footer {
  background:rgba(17,17,15,.84) !important;
  border-color:rgba(232,111,39,.38) !important;
}

@media(max-width:800px){
  .theme-layer.theme-blacksmithing {
    /* Keep more of the centre dark on narrow screens. */
    background-image:
      linear-gradient(
        90deg,
        rgba(17,17,15,.18) 0%,
        rgba(17,17,15,.48) 17%,
        rgba(17,17,15,.93) 31%,
        rgba(17,17,15,.99) 42%,
        rgba(17,17,15,.99) 58%,
        rgba(17,17,15,.93) 69%,
        rgba(17,17,15,.48) 83%,
        rgba(17,17,15,.18) 100%
      ),
      url("assets/blacksmithing-forged-steel.png") !important;
    background-position:center center !important;
  }
}


/* ==========================================================
   V12 BLACKSMITHING — ADAPTED HIGH-RES FORGED STEEL IMAGE
   This asset is already composed with a charcoal centre.
   ========================================================== */

.theme-layer.theme-blacksmithing {
  background-image:url("assets/blacksmithing-forged-steel-v12.jpg") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}

.theme-layer.theme-blacksmithing::before,
.theme-layer.theme-blacksmithing::after {
  content:none !important;
  display:none !important;
}

@media(max-width:800px){
  .theme-layer.theme-blacksmithing {
    background-position:center center !important;
    background-size:cover !important;
  }
}


/* ==========================================================
   V13 BLACKSMITHING — ANTHRACITE
   ========================================================== */

.theme-layer.theme-blacksmithing {
  background:#2b2d2f !important;
  background-image:none !important;
  background-color:#2b2d2f !important;
}

.theme-layer.theme-blacksmithing::before,
.theme-layer.theme-blacksmithing::after {
  content:none !important;
  display:none !important;
  background:none !important;
}

body[data-theme="blacksmithing"] {
  color:#f1ece7 !important;
}

body[data-theme="blacksmithing"] header,
body[data-theme="blacksmithing"] footer {
  background:rgba(35,37,39,.92) !important;
  border-color:rgba(232,111,39,.62) !important;
}

/* Retain forge-orange line/border accents */
body[data-theme="blacksmithing"] .cats article {
  border-color:rgba(232,111,39,.66) !important;
}

body[data-theme="blacksmithing"] .cat {
  color:#f3eee9 !important;
}

body[data-theme="blacksmithing"] .cat b {
  color:#f07826 !important;
}

body[data-theme="blacksmithing"] .body {
  border-color:rgba(232,111,39,.52) !important;
}

body[data-theme="blacksmithing"] a {
  text-decoration-color:#f07826;
}

@media(max-width:800px){
  .theme-layer.theme-blacksmithing {
    background:#2b2d2f !important;
    background-image:none !important;
  }
}

/* V14 project photo viewer */
.project-slider{margin:38px 0 48px;outline:none}
.slider-stage{position:relative;width:100%;height:min(72vh,760px);min-height:360px;background:#171715;overflow:hidden}
.slider-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(10px);transition:opacity .55s ease,transform .55s ease;pointer-events:none}
.slider-image.active{opacity:1;transform:translateY(0)}
.slider-controls{position:absolute;right:14px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:7px;padding:7px 5px;background:rgba(17,17,15,.66);backdrop-filter:blur(4px)}
.slider-controls button{width:34px;height:30px;border:0;background:transparent;color:#eee;font-size:19px;cursor:pointer;padding:0}
.slider-count{font-size:10px;letter-spacing:.08em;color:#ddd;white-space:nowrap}
.slider-hint{text-align:right;margin-top:7px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;opacity:.48}
@media(max-width:700px){
 .slider-stage{height:62vh;min-height:300px}
 .slider-controls{right:8px}
 .slider-hint{text-align:center}
}
/* Admin feedback */
.success{padding:12px 14px;margin:15px 0;background:#243328;border:1px solid #49634f}

/* V15 commerce/enquiry presentation */
.project-summary{font-size:.9rem;opacity:.72;margin:.25rem 0 .4rem}
.availability{display:block;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;opacity:.72}
.enquiry-button{display:inline-block;border:1px solid currentColor;padding:11px 17px;text-decoration:none;background:transparent;color:inherit;font:inherit;cursor:pointer}
.enquiry-button.secondary{opacity:.75;margin-left:8px}
.order-panel{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;border-top:1px solid rgba(128,128,128,.35);border-bottom:1px solid rgba(128,128,128,.35);padding:14px 0;margin:0 0 24px}
.order-panel small{width:100%;opacity:.65}
.project-actions{margin-top:28px}
.enquiry-page{max-width:850px;margin:0 auto;padding:100px 24px 80px}
.enquiry-form{display:grid;gap:17px;margin-top:32px}.enquiry-form label{display:grid;gap:7px;font-size:.78rem;letter-spacing:.06em}
.enquiry-form input,.enquiry-form textarea,.enquiry-form select{width:100%;box-sizing:border-box;padding:12px;border:1px solid rgba(128,128,128,.45);background:rgba(255,255,255,.04);color:inherit;font:inherit}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.hp{position:absolute!important;left:-10000px!important}.form-error,.test-note{padding:12px;border:1px solid rgba(180,120,80,.5)}
.project-theme.theme-blacksmithing{background:#2b2d2f;color:#f3f0e9}.project-theme.theme-blacksmithing .enquiry-button{border-color:#f07826}.project-theme.theme-lighting{background:#eee5d2;color:#29261f}
@media(max-width:700px){.form-two{grid-template-columns:1fr}.project-actions .enquiry-button{display:block;margin:9px 0}.enquiry-page{padding-top:70px}}

/* V16 typography + enquiry refinements */
html,body,button,input,textarea,select{font-family:Arial,Helvetica,"Segoe UI",sans-serif}
h1,h2,h3,.cat{font-family:Arial,Helvetica,"Segoe UI",sans-serif}
.enquiry-form select{background:#536675;color:inherit}
.enquiry-form select option{background:#536675;color:#e8e3d8}

/* V16.2 homepage photography */
.hero{background-repeat:no-repeat;background-size:cover}
.maker-photo{margin:2rem 0;max-width:900px}.maker-photo img{display:block;width:100%;height:auto;max-height:680px;object-fit:contain}
.maker-photo-wrap{padding:3rem max(5vw,24px)}

/* V16.3.3 — clickable service titles; 16.2.2 Services layout retained */
#services .services .service-title-link{
  color:inherit;
  text-decoration:none;
  display:block;
  width:100%;
  height:100%;
}
#services .services .service-title-link:hover,
#services .services .service-title-link:focus-visible{
  text-decoration:underline;
  text-underline-offset:.22em;
}

/* V16.3.4 — expandable service details, original Services layout retained */
#services .services .service-title-link.service-toggle{
  appearance:none;-webkit-appearance:none;border:0;background:transparent;
  font:inherit;color:inherit;text-align:inherit;padding:0;margin:0;
  width:100%;height:100%;cursor:pointer;
}
#services .services .service-toggle:hover,
#services .services .service-toggle:focus-visible,
#services .services .service-toggle[aria-expanded="true"]{
  text-decoration:underline;text-underline-offset:.22em;
}
.service-details{border-top:1px solid rgba(255,255,255,.16)}
.service-detail{padding:1.35rem 0 .4rem;max-width:760px}
.service-detail[hidden]{display:none}
.service-detail p{margin:0 0 .8rem;line-height:1.6;opacity:.82}
.service-detail a{color:inherit;font-size:.86rem;text-decoration:none}
.service-detail a:hover,.service-detail a:focus-visible{text-decoration:underline;text-underline-offset:.22em}

/* V16.3.6 project-page theme parity
   Dedicated project pages use the same category treatments as the
   corresponding expandable sections on the homepage. */
body.project-theme { background:transparent; }

body.project-theme.theme-default,
body.project-theme.theme-architectural-metalwork {
  background:#11110f;
  color:#e8e3d8;
}

body.project-theme.theme-lighting {
  background:
    radial-gradient(circle at 18% 28%, rgba(255,252,238,.82), transparent 42%),
    radial-gradient(circle at 82% 70%, rgba(232,209,166,.38), transparent 48%),
    linear-gradient(135deg,#f4ecd9 0%,#e7dcc5 100%);
  color:#302b24;
}
body.project-theme.theme-lighting header,
body.project-theme.theme-lighting footer {
  background:rgba(238,230,213,.84);
  border-color:#d6cbb7;
}
body.project-theme.theme-lighting a { color:inherit; }

body.project-theme.theme-blacksmithing {
  background:#2b2d2f;
  color:#f1ece7;
}
body.project-theme.theme-blacksmithing header,
body.project-theme.theme-blacksmithing footer {
  background:rgba(35,37,39,.92);
  border-color:rgba(232,111,39,.62);
}
body.project-theme.theme-blacksmithing .project>a { color:#ff9a61; }
body.project-theme.theme-blacksmithing .enquiry-button { border-color:#f07826; }

body.project-theme.theme-sculpture {
  background:
    radial-gradient(circle at 18% 18%,rgba(151,156,151,.16),transparent 34%),
    radial-gradient(circle at 78% 72%,rgba(38,43,42,.30),transparent 42%),
    linear-gradient(135deg,#616662,#4c514f);
  color:#ece9df;
}
body.project-theme.theme-sculpture header,
body.project-theme.theme-sculpture footer {
  background:rgba(65,69,67,.84);
}

body.project-theme.theme-fabrication-installation {
  background:
    linear-gradient(120deg,rgba(255,255,255,.025),transparent 34%),
    linear-gradient(135deg,#373c40,#292e32);
  color:#e3e6e8;
}
body.project-theme.theme-fabrication-installation header,
body.project-theme.theme-fabrication-installation footer {
  background:rgba(38,42,45,.86);
}

body.project-theme.theme-restoration {
  background:
    radial-gradient(circle at 15% 35%,rgba(111,77,43,.24),transparent 40%),
    linear-gradient(135deg,#3b3127,#2c261f);
  color:#ece5da;
}
body.project-theme.theme-restoration header,
body.project-theme.theme-restoration footer {
  background:rgba(43,36,29,.86);
}

body.project-theme .photo { background:rgba(0,0,0,.12); }

/* Project pages: use the exact same category theme treatment as the homepage. */
body.project-theme[data-theme="lighting"] {
  background:
    radial-gradient(circle at 18% 28%, rgba(255,252,238,.82), transparent 42%),
    radial-gradient(circle at 82% 70%, rgba(232,209,166,.38), transparent 48%),
    linear-gradient(135deg,#f4ecd9 0%,#e7dcc5 100%);
  color:#302b24;
}
body.project-theme[data-theme="lighting"] header,
body.project-theme[data-theme="lighting"] footer {
  background:rgba(238,230,213,.84) !important;
  border-color:#d6cbb7 !important;
}
body.project-theme[data-theme="lighting"] header a,
body.project-theme[data-theme="lighting"] nav a,
body.project-theme[data-theme="lighting"] .project>a,
body.project-theme[data-theme="lighting"] small {
  color:#342f28 !important;
}
body.project-theme[data-theme="blacksmithing"] {
  background:
    linear-gradient(90deg,
      #fffdf0 0%,#ffe46b 2.5%,#6a218f 7%,#8d2368 9.5%,#ed6b20 14%,#b52c31 19%,#5f1c25 22%,#11110f 25%,
      #11110f 75%,#5f1c25 78%,#b52c31 81%,#ed6b20 86%,#8d2368 90.5%,#6a218f 93%,#ffe46b 97.5%,#fffdf0 100%);
  color:#f7eee8;
}
body.project-theme[data-theme="blacksmithing"] header,
body.project-theme[data-theme="blacksmithing"] footer {
  background:rgba(17,17,15,.78) !important;
  border-color:rgba(224,105,57,.40) !important;
}
body.project-theme[data-theme="blacksmithing"] header a,
body.project-theme[data-theme="blacksmithing"] nav a,
body.project-theme[data-theme="blacksmithing"] .project>a,
body.project-theme[data-theme="blacksmithing"] small { color:#fff5ee !important; }
body.project-theme[data-theme="sculpture"] {
  background:
    radial-gradient(circle at 18% 18%,rgba(151,156,151,.16),transparent 34%),
    radial-gradient(circle at 78% 72%,rgba(38,43,42,.30),transparent 42%),
    linear-gradient(135deg,#616662,#4c514f);
  color:#ece9df;
}
body.project-theme[data-theme="sculpture"] header,
body.project-theme[data-theme="sculpture"] footer { background:rgba(65,69,67,.84) !important; }
body.project-theme[data-theme="fabrication-installation"] {
  background:linear-gradient(120deg,rgba(255,255,255,.025),transparent 34%),linear-gradient(135deg,#373c40,#292e32);
  color:#e3e6e8;
}
body.project-theme[data-theme="fabrication-installation"] header,
body.project-theme[data-theme="fabrication-installation"] footer { background:rgba(38,42,45,.86) !important; }
body.project-theme[data-theme="restoration"] {
  background:radial-gradient(circle at 15% 35%,rgba(111,77,43,.24),transparent 40%),linear-gradient(135deg,#3b3127,#2c261f);
  color:#ece5da;
}
body.project-theme[data-theme="restoration"] header,
body.project-theme[data-theme="restoration"] footer { background:rgba(43,36,29,.86) !important; }
body.project-theme[data-theme="default"],
body.project-theme[data-theme="architectural-metalwork"] { background:#11110f; color:#e8e3d8; }

/* v16.3.8: project theme uses the SAME background layer as homepage.
   This fixed layer is not dependent on homepage JavaScript. */
body.project-theme { background:transparent !important; isolation:isolate; min-height:100vh; }
body.project-theme > .project-theme-background.theme-layer {
  display:block !important; position:fixed; inset:0; z-index:-1;
  opacity:1 !important; pointer-events:none; transition:none;
}
body.project-theme > header, body.project-theme > main, body.project-theme > footer { position:relative; z-index:1; }
body.project-theme[data-theme="lighting"] { color:#302b24; }
body.project-theme[data-theme="lighting"] .meta,
body.project-theme[data-theme="lighting"] .story p { color:#51493d; }
body.project-theme[data-theme="lighting"] .slider-stage { background:#e2d8c5; }
/* Images stay transparent until fully loaded, then fade smoothly. */
body.project-theme .slider-image { opacity:0 !important; transform:translateY(8px); transition:opacity 1.05s ease-in-out,transform 1.05s ease-in-out; }
body.project-theme .slider-image.active.image-ready { opacity:1 !important; transform:translateY(0); }
@media (prefers-reduced-motion:reduce) { body.project-theme .slider-image { transition:none; transform:none; } }

/* v16.3.9 maker biography and project video support */
#about .maker-bio{margin-top:2rem;padding-top:1.25rem;border-top:1px solid currentColor;}
#about .maker-bio h3{font:400 clamp(1.4rem,2.5vw,2rem) Georgia,serif;margin:0 0 .75rem;}
#about .maker-bio p{white-space:normal;}
.project-slider .slider-stage video.slider-image{width:100%;height:100%;object-fit:contain;background:#0e0e0e;}

/* JFJ v16.4.0: mobile gallery and image loading */
html, body { background-color:#202120; }
body[data-theme="lighting"] { background-color:#eee5d2; }
body[data-theme="blacksmithing"] { background-color:#2b2d2f; }
body[data-theme="sculpture"] { background-color:#424744; }
body[data-theme="architectural-metalwork"] { background-color:#11110f; }
body[data-theme="fabrication-installation"] { background-color:#30353a; }
body[data-theme="restoration"] { background-color:#342b23; }
.cats article .grid img { background-color:rgba(80,80,80,.16); display:block; }
body[data-theme="lighting"] .cats article .grid img { background-color:#e2d8c5; }
body[data-theme="blacksmithing"] .cats article .grid img { background-color:#2b2d2f; }
body[data-theme="sculpture"] .cats article .grid img { background-color:#424744; }
body.project-theme .slider-image { transition:opacity .22s ease, transform .22s ease !important; transform:none !important; }
.project-slider .slider-stage { touch-action:pan-y pinch-zoom; overscroll-behavior-x:contain; }
.project-slider img.slider-image.active { pointer-events:auto; cursor:zoom-in; }
.project-slider .slider-controls { flex-direction:row;top:auto;bottom:12px;right:12px;transform:none; }
.project-slider .slider-hint { text-transform:none; letter-spacing:.02em; }
.jfj-lightbox { position:fixed;inset:0;z-index:9999;background:rgba(8,9,9,.97);display:none;align-items:center;justify-content:center;touch-action:pan-y pinch-zoom; }
.jfj-lightbox.open { display:flex; }
.jfj-lightbox img { max-width:100vw;max-height:100dvh;object-fit:contain; }
.jfj-lightbox button { position:absolute;z-index:2;border:0;background:rgba(0,0,0,.55);color:#fff;font:32px Arial,sans-serif;cursor:pointer;min-width:44px;min-height:44px; }
.jfj-lightbox .jfj-close { top:12px;right:12px; }
.jfj-lightbox .jfj-back { left:8px;top:50%;transform:translateY(-50%); }
.jfj-lightbox .jfj-forward { right:8px;top:50%;transform:translateY(-50%); }
body.jfj-lightbox-open { overflow:hidden; }
@media(prefers-reduced-motion:reduce){body.project-theme .slider-image {transition:none !important;}}

/* JFJ v16.4.1: smooth image reveal and crossfade */
.cats article .grid img.jfj-image-fade { opacity:0; transition:opacity .55s ease-in-out; }
.cats article .grid img.jfj-image-fade.jfj-image-loaded { opacity:1; }
body.project-theme .slider-image { transition:opacity .55s ease-in-out !important; transform:none !important; }
body.project-theme .slider-image.active:not(.image-ready) { opacity:0 !important; }
@media (prefers-reduced-motion:reduce) {
 .cats article .grid img.jfj-image-fade {transition:none;}
 body.project-theme .slider-image {transition:none !important;}
}
