/* v2026.09.11.9 — card fittings join the illustrated rails and mounted jewels. */
body.je-filigree-page .je-joined-card{
 --je-cap-height:104px;--je-card-bottom:22px;
 display:flex;flex-direction:column;align-items:stretch;gap:0;
 padding:14px 20px var(--je-card-bottom) !important;isolation:isolate;
}
body.je-filigree-page .je-joined-card > :is(.je-card-crest,.je-lace-plaque){
 position:relative !important;display:block !important;flex:none;
 width:calc(100% + 16px) !important;max-width:none;
 height:var(--je-cap-height) !important;min-height:var(--je-cap-height) !important;
 margin:0 -8px 16px !important;border:0 !important;border-radius:0 !important;
 outline:0 !important;box-shadow:none !important;background:transparent !important;
 overflow:visible;pointer-events:none;
}
body.je-filigree-page .je-joined-card > .je-lace-plaque{
 margin-top:auto !important;margin-bottom:0 !important;
}
.je-cap-art{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:1}
.je-cap-rails{
 position:absolute;inset:14px -7px 14px;pointer-events:none;z-index:0;
 border-block:3px double #ad815b;
 background:linear-gradient(90deg,#24bbc42b,transparent 24%,transparent 76%,#24bbc42b);
 box-shadow:0 -2px 0 #06131c,0 -3px 0 #47d9df55,0 2px 0 #06131c,0 3px 0 #47d9df55;
}
.je-cap-rails::before,.je-cap-rails::after{
 content:"";position:absolute;top:-10px;bottom:-10px;width:12px;
 border:3px double #bb926b;border-radius:14px;
 box-shadow:inset 0 0 0 1px #51c8ce77,0 0 0 1px #080f18;
}
.je-cap-rails::before{left:-7px;border-right:0;border-radius:16px 0 0 16px}
.je-cap-rails::after{right:-7px;border-left:0;border-radius:0 16px 16px 0}
body.je-filigree-page .je-joined-card > .je-card-crest::before{left:8%;z-index:2}
body.je-filigree-page .je-joined-card > .je-card-crest::after{right:8%;z-index:2}
body.je-filigree-page .je-joined-card .je-card-crest-gem{z-index:3}
body.je-filigree-page .je-joined-card > .je-lace-plaque::before,
body.je-filigree-page .je-joined-card > .je-lace-plaque::after{top:calc(50% - 6px);z-index:2}
body.je-filigree-page .je-joined-card > .je-lace-plaque .je-lace-glint{z-index:2}
body.je-filigree-page .je-lace-plaque > .je-lace-glint{
 inset:14px -4px auto !important;height:3px;border-radius:0;
}
body.je-filigree-page .je-joined-card .je-lace-glint::before{
 background:linear-gradient(105deg,transparent,#ffe6b52e,transparent);
}
body.je-filigree-page .je-joined-card > .je-motion-jewel{
 position:absolute !important;left:50%;bottom:calc(var(--je-card-bottom) + var(--je-cap-height)/2 - 18px);
 translate:-50% 0;width:36px;height:36px;margin:0 !important;z-index:5 !important;
}
.je-jewel-setting{
 position:absolute !important;left:50%;bottom:calc(var(--je-card-bottom) + var(--je-cap-height)/2 - 28px);
 translate:-50% 0;width:56px;height:56px;border:3px double #e6b880;border-radius:50%;
 background:radial-gradient(circle,#153d46 15%,#07121b 62%);
 box-shadow:inset 0 0 0 2px #07121b,inset 0 0 0 3px #3dd5df,0 0 0 2px #08131b,0 0 0 3px #bc8555,0 5px 10px #000a;
 z-index:4 !important;pointer-events:none;
}
body.je-filigree-page .je-joined-card > :is(.card-head,.social-card-copy,.tool-content){min-width:0}
body.je-filigree-page .je-joined-card .card-head{
 flex-direction:column;align-items:flex-start;gap:10px;margin:0 0 14px;padding:0 0 14px;
 border-bottom:3px double #af825855;
 box-shadow:0 2px 0 #21b8c22b;
}
body.je-filigree-page .je-joined-card .card-head h2{
 width:100%;font-size:clamp(1.3rem,2vw,1.55rem);line-height:1.22;
 overflow-wrap:break-word;word-break:normal;hyphens:none;
}
body.je-filigree-page .je-joined-card .platform{align-self:flex-start}
body.je-filigree-page .je-joined-card > .source-link{align-self:flex-start;margin-block:14px 22px}
body.je-filigree-page .je-joined-card :is(.media-wrap,.social-card-media){
 border:3px double #ba936e;border-radius:12px;
 box-shadow:0 0 0 2px #07131d,0 0 0 3px #39cbd577,0 6px 14px #0006;
}
body.je-filigree-page .je-joined-card .social-card-copy{padding:18px 0 24px}
body.je-filigree-page .je-joined-card .tool-content{padding-bottom:28px}
body.je-filigree-page .je-joined-card > p:last-of-type{margin-bottom:24px}
body.je-filigree-page .je-joined-card .je-unique-frame-card{--je-frame-corner:46px;--je-frame-edge:13px}
body.je-filigree-page .je-joined-card > .je-unique-frame-card{mix-blend-mode:lighten}
/* Existing tool reliefs meet the same copper-and-teal edge treatment. */
body.je-filigree-tool .je-relief-band{
 border-color:#d4a36f;
 box-shadow:inset 0 1px 0 #ffe9c977,inset 0 -1px 0 #ffe9c944,0 -2px 0 #07131c,0 -3px 0 #43cad477,0 2px 0 #07131c,0 3px 0 #43cad477;
}
body[data-unique-page="fretboard"] .opt-item > .je-depth-art{overflow:visible;isolation:isolate}
body[data-unique-page="fretboard"] .opt-item > .je-depth-art::before{
 content:"";position:absolute;inset:20% -4% 10%;z-index:-1;
 border-block:3px double #a9805855;
 box-shadow:0 2px 0 #36c6d244,0 -2px 0 #36c6d244;
}
/* Keep the homepage's existing artwork, tying its card fittings into the rails. */
body[data-unique-page="home"] .je-card-mini-top{
 width:calc(100% - 32px);max-width:440px;height:104px;margin-block:14px 10px;
}
body[data-unique-page="home"] .je-lace-plaque{
 width:calc(100% - 40px) !important;max-width:500px;height:104px;min-height:104px;
 border:0;outline:0;border-radius:0;box-shadow:none !important;background:transparent !important;
}
body[data-unique-page="home"] .je-lace-plaque::before,
body[data-unique-page="home"] .je-lace-plaque::after{top:46px;z-index:2}
body[data-unique-page="home"] :is(.je-card-mini-top,.je-lace-plaque) > svg{z-index:1}
@media(max-width:760px){
 body.je-filigree-page .je-joined-card{--je-cap-height:94px;padding-inline:20px}
 body.je-filigree-page .je-joined-card .je-unique-frame-card{--je-frame-corner:38px;--je-frame-edge:11px}
 body.je-filigree-page .je-joined-card .card-head h2{font-size:1.35rem}
}
/* Compact collection headers — restore the pre-v2026.09.14.1 layout.
   Scoped to six main pages. This block may replace v14.1's appended header
   block, or follow it: specificity is sufficient for either integration.

   Artwork hook: --je-compact-header-art must point to the new frame's SVG
   viewport, never the padded full PNG. The fallback is only the dark panel.
   Actual art placement can be replaced with a disjoint-crop frame layer on
   narrow screens without changing any of the layout values below. */

body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero{
 box-sizing:border-box;position:relative;isolation:isolate;
 display:grid !important;place-items:center !important;text-align:center !important;
 width:min(1440px,calc(100% - 28px));
 margin:14px auto 20px;
 padding:68px clamp(38px,14vw,194px) 44px;
 min-height:252px;height:auto;aspect-ratio:auto;
 overflow:hidden;
 border:1px solid rgba(255,213,168,.7);border-radius:18px;
 background:var(--je-compact-header-art,none) center / 100% 100% no-repeat #080c14 !important;
 box-shadow:0 0 0 2px #080c14,0 0 0 3px rgba(0,229,255,.4),0 0 0 6px #080c14,0 0 0 7px rgba(255,145,77,.35),0 16px 38px rgba(0,0,0,.42),0 0 36px rgba(0,229,255,.09);
}
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero > .je-hero-copy{
 position:relative;z-index:4;margin:0;width:100%;max-width:1040px;min-width:0;
}
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero .home-title{
 font-size:clamp(32px,4.6vw,58px);line-height:1.15;margin:0;
}
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero .home-subtitle{
 font-size:clamp(16px,1.55vw,20px);line-height:1.55;
 margin:18px auto 0;max-width:43rem;padding-inline:10px;color:#d7e0ef;
}
/* Restore the existing animated fittings. Their established sizes, motion,
   and edge positions continue to come from ornamentation-rich.css. */
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero > :is(.je-hero-medallion,.je-hero-pearl){display:block !important;}
/* The replaced frame layer must not show a second image behind the new art.
   Lace corners were already hidden by the original unique-art.css. */
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero > :is(.je-unique-frame,.je-lace-corners){display:none !important;}
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero::before{
 content:"" !important;inset:0 !important;pointer-events:none;
 border:0 !important;border-image:none !important;border-radius:inherit !important;
 opacity:1 !important;
 background:radial-gradient(ellipse at 5.4% 50%,rgba(0,229,255,.14),transparent 16%),radial-gradient(ellipse at 94.6% 50%,rgba(255,145,77,.14),transparent 16%) !important;
 box-shadow:inset 0 1px 0 rgba(255,241,216,.5),inset 0 0 0 4px rgba(0,229,255,.12),inset 0 0 0 7px rgba(255,145,77,.14) !important;
}
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero::after{
 content:"" !important;inset:0 !important;pointer-events:none;
 background:radial-gradient(ellipse at 5.4% 50%,rgba(0,229,255,.25),transparent 23%),radial-gradient(ellipse at 94.6% 50%,rgba(255,145,77,.25),transparent 23%),radial-gradient(ellipse at 50% 0,rgba(255,241,216,.13),transparent 30%) !important;
 box-shadow:none !important;opacity:0 !important;transition:opacity .3s ease;
}
body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero:is(:hover,:focus-within)::after{opacity:1 !important;}
@media(max-width:760px){
 body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero{
  width:calc(100% - 20px);margin-top:10px;
  min-height:0;height:auto;aspect-ratio:auto;
  padding:54px 38px 42px;border-radius:12px;
 }
 body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero .home-title{font-size:clamp(25px,6vw,38px);}
 body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero .home-subtitle{font-size:1rem;line-height:1.5;margin:16px auto 0;}
 body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero::before{background:none !important;border-image:none !important;}
}
/* Original low-height desktop rule changes only the top margin here.
   The later .je-rich-page rules retain 68px/44px padding and subtitle margins. */
@media(max-height:660px) and (min-width:761px){
 body.je-filigree-page:is([data-unique-page="music"],[data-unique-page="art"],[data-unique-page="social"],[data-unique-page="animation"],[data-unique-page="guitar"],[data-unique-page="contact"]) .home-hero{margin-top:10px;}
}

body[data-unique-page="music"] .home-hero{--je-compact-header-art:url("../images/headers/music-compact-v2.svg")}

body[data-unique-page="art"] .home-hero{--je-compact-header-art:url("../images/headers/art-compact-v2.svg")}

body[data-unique-page="social"] .home-hero{--je-compact-header-art:url("../images/headers/socials-compact-v2.svg")}

body[data-unique-page="animation"] .home-hero{--je-compact-header-art:url("../images/headers/animation-compact-v2.svg")}

body[data-unique-page="guitar"] .home-hero{--je-compact-header-art:url("../images/headers/guitar-compact-v2.svg")}

body[data-unique-page="contact"] .home-hero{--je-compact-header-art:url("../images/headers/contact-compact-v2.svg")}

@media(max-width:760px){body[data-unique-page="contact"] .home-hero{--je-compact-header-art:url("../images/headers/contact-compact-v2-mobile.svg")}}

@media(max-width:760px){body[data-unique-page="social"] .home-hero{--je-compact-header-art:url("../images/headers/socials-compact-v2-mobile.svg")}}

@media(max-width:760px){body[data-unique-page="art"] .home-hero{--je-compact-header-art:url("../images/headers/art-compact-v2-mobile.svg")}}

@media(max-width:760px){body[data-unique-page="animation"] .home-hero{--je-compact-header-art:url("../images/headers/animation-compact-v2-mobile.svg")}}

@media(max-width:760px){body[data-unique-page="music"] .home-hero{--je-compact-header-art:url("../images/headers/music-compact-v2-mobile.svg")}}

@media(max-width:760px){body[data-unique-page="guitar"] .home-hero{--je-compact-header-art:url("../images/headers/guitar-compact-v2-mobile.svg")}}
