/* v0.5: finish the four existing material concepts; scoped to the Hero. */
.hero-material-defs{position:absolute;pointer-events:none}
#top.hero-study .hero-concept-switch button{font-size:.75rem;letter-spacing:.08em;padding:8px 15px;min-height:42px}
#top .artifact-signature{max-width:520px;width:65%}
#top[data-concept=metal] .artifact-signature{max-width:520px;width:65%}
#top[data-concept=vellum] .artifact-signature{width:70%;max-width:540px}
#top[data-concept=binding] .artifact-signature{max-width:540px;width:47%}
.official-logo .cg-vellum,.official-logo .cg-gold{display:none}
.official-logo .logo-relief{display:none;position:absolute;left:-17.5%;top:-17.5%;width:135%;height:135%;mask:url(#cg-official-shape);mask-mode:luminance}
/* Each layer reuses the exact official silhouette, including overlaps. */
#top[data-concept=stone] .official-logo img,#top[data-concept=metal] .official-logo img{display:none}
#top[data-concept=stone] .logo-relief,#top[data-concept=metal] .logo-relief{display:block}
.logo-relief-shadow{background:var(--cut-dark);transform:translate(-.55px,-.65px);opacity:.6}
.logo-relief-highlight{background:var(--cut-light);transform:translate(.55px,.65px);opacity:.65}
.logo-relief-face{background:var(--cut-face)}
/* VELLUM: supplied red-brown seal, marginal ruling, clean archival ink. */
#top[data-concept=vellum] .official-logo .cg-dark,#top[data-concept=vellum] .official-logo .cg-light{display:none}
#top[data-concept=vellum] .official-logo .cg-vellum{display:block;filter:url(#cg-vellum-ink);mix-blend-mode:multiply}
#top[data-concept=vellum] .artifact-emblem{position:relative;padding:22px 8px 12px}
#top[data-concept=vellum] .artifact-emblem::before{content:"";position:absolute;inset:0 -10px;border-top:1px solid #89553655;border-bottom:3px double #89553655;pointer-events:none}
#top[data-concept=vellum] .artifact-emblem figcaption{font-size:.75rem;letter-spacing:.14em;color:#82492d;margin-top:20px}
#top[data-concept=vellum] .manuscript-heading{padding-bottom:14px;margin-bottom:18px}
#top[data-concept=vellum] .manuscript-heading>span:last-child{font-size:.75rem;letter-spacing:.15em}
#top[data-concept=vellum] .hero-artifact{position:relative}
#top[data-concept=vellum] .hero-artifact::after{content:"✧";display:block;text-align:center;font:1.3rem/1 Georgia,serif;color:#8a5836;margin-top:22px}
#top[data-concept=vellum] .glyph-byline{background:#713d29}
/* STONE: one continuous dressed surface, recessed into the original rough slab. */
#top[data-concept=stone] .artifact-body{position:relative;isolation:isolate;margin:32px -10px 10px;padding:45px 30px 30px;gap:6%;grid-template-columns:minmax(0,1fr) 28%}
#top[data-concept=stone] .artifact-body::before{content:"";position:absolute;inset:-7px;z-index:-2;background:linear-gradient(#d8d1bfcc,#c9c4b7dd),url('assets/hero-study/material-stone.webp') center/cover;filter:blur(1.3px);clip-path:polygon(1% 1%,24% .5%,47% 1.3%,73% .4%,99% 1%,99.5% 27%,99% 62%,99.4% 99%,72% 99.4%,40% 98.8%,1% 99%,.4% 68%,1% 33%);mask:linear-gradient(#0000,#000 12px,#000 calc(100% - 12px),#0000),linear-gradient(90deg,#0000,#000 12px,#000 calc(100% - 12px),#0000);mask-composite:intersect}
#top[data-concept=stone] .artifact-body::after{content:"";position:absolute;inset:0;z-index:-1;box-shadow:inset 0 5px 7px #4c463b5c,inset 4px 0 5px #4c463b22,inset 0 -2px 3px #f4ebd399;pointer-events:none;clip-path:polygon(0 1%,100% 0,99.7% 99%,0 100%);background:repeating-linear-gradient(174deg,#6e685a03 0 1px,transparent 1px 6px)}
#top[data-concept=stone] .artifact-type{background:none;padding:0;margin:0}
#top[data-concept=stone] .artifact-metadata,#top[data-concept=stone] .hero-study-caption{background:none}
#top[data-concept=stone] .hero-study-footer{background:none;padding:24px 0;margin:10px 0 0}
#top.hero-study[data-concept=stone]{--cut-face:#303128;--cut-dark:#191d16;--cut-light:#eee9d7}
#top[data-concept=stone] .cut-highlight{transform:translate(.45px,.55px)}
#top[data-concept=stone] .cut-shadow{transform:translate(-.45px,-.55px)}
/* BINDING: supplied gold logo, broken foil reflection, fine pressure edges. */
#top[data-concept=stone] .artifact-body::before{background-image:url('assets/hero-study/dressed-stone-grain.svg'),linear-gradient(#d8d1bfdc,#c9c4b7eb),url('assets/hero-study/material-stone.webp');background-size:240px 240px,cover,cover;background-repeat:repeat,no-repeat,no-repeat;filter:none;mask:linear-gradient(#0000,#000 22px,#000 calc(100% - 22px),#0000),linear-gradient(90deg,#0000,#000 22px,#000 calc(100% - 22px),#0000);mask-composite:intersect}
#top[data-concept=stone] .artifact-body::after{inset:5px;box-shadow:inset 0 3px 4px #4c463b40,inset 2px 0 3px #4c463b22,inset 0 -1px 2px #f4ebd377;clip-path:polygon(0 1%,18% .5%,39% 1%,62% .3%,83% .8%,100% 0,99.6% 24%,100% 57%,99.5% 99%,74% 99.5%,48% 98.8%,25% 99.7%,0 100%,.3% 65%,0 33%)}
#top.hero-study[data-concept=binding]{--cut-face:linear-gradient(172deg,#b18a35 0%,#f6e3a6 18%,#d3aa4d 30%,#9c732a 42%,#f8e8b6 48%,#e2bd65 59%,#ae8533 73%,#f4df9b 86%,#c59c45 100%);--cut-dark:#24070c;--cut-light:#f8e9bb}
#top[data-concept=binding] .official-logo .cg-light,#top[data-concept=binding] .official-logo .cg-dark{display:none}
#top[data-concept=binding] .official-logo .cg-gold{display:block;filter:url(#cg-gold-ink);mix-blend-mode:normal}
#top[data-concept=binding] .logo-relief-highlight{display:block;background:linear-gradient(165deg,#fff0b9a6,transparent 30%,#fff2c4bd 47%,transparent 60%,#ffe6a186);transform:none;mix-blend-mode:screen;opacity:.55}
#top[data-concept=binding] .logo-relief-shadow{display:block;background:#240810;transform:translate(.7px,1px);opacity:.85}
#top[data-concept=binding] .cg-gold{z-index:1}
#top[data-concept=binding] .logo-relief-highlight{z-index:2}
#top[data-concept=binding] .cut-face{background-image:repeating-linear-gradient(102deg,#fff7d41a 0 .5px,#58371012 .5px 1px,transparent 1px 4px),var(--cut-face);box-shadow:none}
#top[data-concept=binding] .cut-highlight{transform:translate(.6px,.8px);opacity:.65}
#top[data-concept=binding] .cut-shadow{transform:translate(-.6px,-.8px);opacity:.85}
#top[data-concept=binding] .hero-artifact{outline:none;border-color:#d9bb765c;margin:28px 0 0;padding:26px 22px}
#top[data-concept=binding] .artifact-body{gap:20px}
#top[data-concept=binding] .artifact-emblem{width:210px}
/* METAL: recover platinum brilliance without enlarging delicate outlines. */
#top.hero-study[data-concept=metal]{--cut-face:linear-gradient(173deg,#c1c7c9 0%,#f8faf5 19%,#a1aeb4 31%,#eef2ed 43%,#fffff7 49%,#9caab0 61%,#e8ece6 78%,#c1cbcb 100%);--cut-light:#fffff3;--cut-dark:#0b1218;--hero-ink:#edece1}
#top[data-concept=metal] .cut-highlight{transform:translate(-.45px,-.55px);opacity:.8}
#top[data-concept=metal] .cut-shadow{transform:translate(.65px,.8px);opacity:.8}
#top[data-concept=metal] .logo-relief-shadow{transform:translate(.65px,.8px);opacity:.8}
#top[data-concept=metal] .logo-relief-highlight{transform:translate(-.45px,-.55px);opacity:.8}
#top[data-concept=metal] .artifact-emblem{padding:0}
@media(max-width:1100px){#top.hero-study .hero-concept-switch button{padding:8px 10px}}
@media(max-width:760px){#top.hero-study .hero-concept-switch button{font-size:.6875rem;letter-spacing:.04em;padding:7px 5px;min-height:44px}#top .artifact-signature,#top[data-concept=vellum] .artifact-signature,#top[data-concept=metal] .artifact-signature{width:95%;max-width:370px}#top[data-concept=binding] .artifact-signature{width:100%}#top[data-concept=stone] .artifact-body{grid-template-columns:1fr;margin:24px -4px 10px;padding:28px 15px 24px;gap:26px}#top[data-concept=stone] .artifact-type{padding:0;margin:0}#top[data-concept=stone] .artifact-emblem{width:210px}#top[data-concept=vellum] .artifact-emblem{width:220px;margin-right:8px}#top[data-concept=vellum] .artifact-emblem figcaption{font-size:.625rem}#top[data-concept=binding] .hero-artifact{padding:22px 13px}#top[data-concept=binding] .artifact-emblem{width:195px}#top[data-concept=binding] .cut-highlight,#top[data-concept=stone] .cut-highlight{transform:translate(.3px,.4px)}#top[data-concept=binding] .cut-shadow,#top[data-concept=stone] .cut-shadow{transform:translate(-.3px,-.4px)}}
