/* GrandCore COLORS / GOLDEN FORM — OFFLINE EDIT 010: THE BASALT GALLERY
   Change scope: architectural background substrate and shell joinery only.
   Source material: deterministic digital HONED BASALT appearance study (not a photographed
   sample, measured reflectance/normal/roughness nor physically certified stone).
   Materials determine visible identity. Gradients model lighting/occlusion, not hue themes.
   All nine original concept-art identities, links and scripts remain byte-identical to v009.
   Material order: graphite basalt slab -> walnut cabinet recess -> bronze reveal ->
   selected Nero Portoro threshold. All physical construction/thickness remain conceptual.
*/
:root{
 --basalt-slab:url('assets/honed-basalt-slab-panel-v010.webp');
 --portoro-stone:url('assets/material-portoro.webp');
 --cabinet-walnut:url('assets/material-walnut.webp');
 --bronze-joinery:url('assets/material-bronze.webp');
}
html{background-image:var(--basalt-slab);background-repeat:repeat;background-size:1280px 1280px}
body{
 background-image:linear-gradient(90deg,rgba(6,7,7,.24),rgba(8,8,8,.03) 50%,rgba(6,7,7,.24)),var(--basalt-slab)!important;
 background-repeat:repeat!important;
 background-size:auto,1280px 1280px!important;
 background-position:center,center top!important;
}
.texture-grain{opacity:.028;mix-blend-mode:soft-light}
/* Built reception soffit: satin bronze trims anchored to dark walnut panels. */
.site-header{
 background-image:linear-gradient(180deg,rgba(8,8,7,.25) 0%,rgba(8,8,8,.43) 100%),var(--cabinet-walnut)!important;
 background-position:center,center!important;background-size:auto,690px!important;
 border-bottom:5px solid transparent!important;
 border-image:var(--bronze-joinery) 100 / 5px / 0 stretch!important;
 box-shadow:inset 0 -1px 0 rgba(245,224,181,.38),0 6px 30px #0009!important;
}
.site-header:after{
 bottom:4px;height:1px;opacity:.58;
 background:linear-gradient(90deg,transparent,#c7ae847a 13%,#ddc9a8a6 55%,transparent)
}
.mobile-nav{
 background-image:linear-gradient(145deg,rgba(5,6,5,.24),rgba(5,6,5,.54)),var(--cabinet-walnut)!important;
 background-size:auto,650px!important;
}
/* Mineral threshold — Portoro used sparingly and intentionally, not as wallpaper. */
.index-belt{
 background-image:linear-gradient(180deg,rgba(1,1,1,.20),rgba(1,1,1,.47)),var(--portoro-stone)!important;
 background-size:auto,850px!important;
 border-top:2px solid #9a8765a8!important;
 border-bottom:2px solid #927c5aaf!important;
 box-shadow:inset 0 1px 0 rgba(235,209,161,.18),inset 0 -1px 0 rgba(3,3,3,.8),0 9px 17px #0005!important;
}
/* The background itself is a material: visible slab relief across all gallery surfaces. */
.collection{
 position:relative;isolation:isolate;
 background-image:linear-gradient(90deg,rgba(0,0,0,.20),rgba(0,0,0,.035) 45%,rgba(0,0,0,.19)),var(--basalt-slab)!important;
 background-size:auto,1280px 1280px!important;
 background-position:center,center top!important;
 background-repeat:repeat!important;
 border-top:0!important;
 border-bottom:8px solid transparent!important;
 border-image:var(--bronze-joinery) 80 / 8px / 0 stretch!important;
 box-shadow:inset 0 24px 45px #0008,inset 0 -28px 45px #0008!important;
}
/* Narrow bronze slip joints are materially plausible and clarify the containment frame. */
.collection:before,.collection:after{
 content:'';pointer-events:none;position:absolute;top:25px;bottom:26px;width:3px;z-index:0;
 background-image:linear-gradient(90deg,rgba(8,6,4,.8),rgba(210,179,117,.58),rgba(18,12,8,.7)),var(--bronze-joinery);
 background-size:auto,120px;
 box-shadow:1px 0 11px #0008;
}
.collection:before{left:clamp(13px,2.8vw,48px)}
.collection:after{right:clamp(13px,2.8vw,48px)}
.collection>.shell,.collection>.collection-inner{position:relative;z-index:1}
.collection-top{border-bottom:0}
.collection h2{color:#fff5e6!important;text-shadow:0 3px 16px rgba(0,0,0,.9),0 0 40px #0007}
.collection-top p{color:#f3e5ce!important;text-shadow:0 1px 8px #000}
.collection-status{color:#ddd1bd!important}
.filters{border-top:1px solid rgba(204,179,136,.64)}
.filters>button{
 background-image:linear-gradient(140deg,#0a0a09d5,#0b0b0ac1),url('assets/material-steel.webp')!important;
}
.filters>button[aria-pressed=true]{
 background-image:linear-gradient(140deg,rgba(101,78,51,.58),rgba(18,16,12,.51)),var(--bronze-joinery)!important;
}
.search-label{background-image:linear-gradient(140deg,rgba(7,7,6,.62),rgba(18,15,12,.55)),var(--cabinet-walnut)!important}
/* Each exhibition is set in its own ebonized-walnut recessed cabinet, bronze-detailed.
   The project-specific material interiors from Edit 009 remain unchanged. */
.project-grid{gap:26px 24px}
.project-card{
 padding:7px!important;
 background-image:linear-gradient(155deg,rgba(8,6,5,.14),rgba(5,4,3,.35)),var(--cabinet-walnut)!important;
 background-size:auto,430px!important;
 border:1px solid rgba(186,155,108,.66)!important;
 border-radius:0!important;
 box-shadow:0 22px 25px #0009,0 5px 10px #0008,inset 0 0 0 1px #000b,
            inset 0 0 0 5px rgba(188,157,105,.12)!important;
}
.project-card:before{
 inset:7px!important;
 border:2px solid rgba(193,163,113,.75)!important;
 border-image:none!important;
 box-shadow:inset 0 0 0 1px rgba(3,3,3,.9)!important;
 opacity:1!important;
}
.project-card:hover,.project-card:focus-within{
 transform:translateY(-3px)!important;
 box-shadow:0 27px 43px #000c,0 0 0 1px #d9c4999a,inset 0 0 0 1px #000c!important;
}
.card-info{background-blend-mode:normal,normal}
.card-poster{border-bottom-width:7px}
/* True material continues inside the exhibit dialog rather than a flat modal backdrop. */
.exhibit-dialog{
 background-image:linear-gradient(90deg,rgba(0,0,0,.29),rgba(0,0,0,.17)),var(--basalt-slab)!important;
 background-size:auto,1280px 1280px!important;
}
/* Pressed walnut panel wall forms the editorial/method gallery bay. */
.method{
 background-image:linear-gradient(125deg,rgba(4,4,4,.57),rgba(9,7,5,.44) 55%,rgba(0,0,0,.59)),var(--cabinet-walnut)!important;
 background-size:auto,1000px!important;
 border-top:11px solid transparent;
 border-bottom:11px solid transparent;
 border-image:var(--bronze-joinery) 130 / 11px / 0 stretch!important;
 box-shadow:inset 0 21px 45px #0009,inset 0 -21px 45px #0009,0 18px 35px #0009!important;
}
.method h2,.method p{text-shadow:0 2px 14px #000d}
/* The last gallery wall is honed basalt with a measured-looking Portoro threshold. */
.closing{
 background-image:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.045),rgba(0,0,0,.20)),var(--basalt-slab)!important;
 background-size:auto,1280px 1280px!important;
 border-top:12px solid transparent!important;
 border-image:var(--portoro-stone) 170 / 12px / 0 stretch!important;
 box-shadow:inset 0 18px 40px #000b,inset 0 -22px 32px #000a!important;
}
.closing h2,.closing p{text-shadow:0 2px 16px #000e}
.footer{
 background-image:linear-gradient(180deg,rgba(5,4,3,.27),rgba(5,4,3,.48)),var(--cabinet-walnut)!important;
 background-size:auto,820px!important;
 border-top:3px solid #b49c74b5!important;
 box-shadow:inset 0 2px 1px #0009;
}
@media(max-width:900px){
 .collection:before{left:11px}.collection:after{right:11px}
 .project-grid{gap:17px 13px}
 .project-card{padding:5px!important}
 .project-card:before{inset:5px!important}
}
@media(max-width:500px){
 html,body{background-size:900px 900px!important}
 .collection,.closing,.exhibit-dialog{background-size:auto,900px 900px!important}
 .collection:before,.collection:after{width:2px;opacity:.45}
 .collection:before{left:4px}.collection:after{right:4px}
 .project-grid{gap:20px}
 .project-card{padding:6px!important}
 .project-card:before{inset:6px!important}
 .method{border-width:7px!important;border-image-width:7px!important}
}
@media(prefers-reduced-motion:reduce){.project-card{transition:none!important}.project-card:hover{transform:none!important}}
