/* Velora — Noir Atelier · A. Kamen Studio */
html{background:#0b0b0a}
:root{--paper:#0b0b0a;--paper-2:#151514;--ink:#e7d6b0;--ink-soft:#8f866f;--gold:#d8c092;--gold-light:#8a7650;--rule:rgba(216,192,146,.14);--rule-strong:rgba(216,192,146,.4)}
body{background:#0b0b0a}
.mast{background:rgba(11,11,10,.9);border-bottom:0}
.mast-inner{padding-top:22px;padding-bottom:22px}
.mast-brand span{font-family:var(--sans);font-weight:300;font-size:13px;letter-spacing:.6em}
.mast-nav a{color:var(--ink-soft);letter-spacing:.4em;font-weight:400}
.mast-nav a[aria-current="page"]{color:var(--ink);border-bottom-color:transparent}
.hero{padding-top:clamp(84px,14vw,170px);padding-bottom:clamp(70px,10vw,130px)}
.hero-mark{width:clamp(56px,7vw,72px);margin-bottom:clamp(40px,6vw,64px)}
.wordmark{font-family:var(--sans);font-weight:200;font-size:clamp(40px,7.6vw,84px);letter-spacing:.62em;padding-left:.62em;color:var(--ink);line-height:1}
.hero .rule{width:1px;height:46px;background:var(--gold-light);margin:clamp(34px,4vw,46px) auto}
.hero-sub{color:var(--ink);font-weight:400;font-size:10.5px;letter-spacing:.56em;padding-left:.56em}
.hero-by{font-family:var(--sans);font-style:normal;font-weight:400;font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--ink-soft);margin-top:16px}
.hero-copy{font-family:var(--sans);font-weight:300;font-size:13.5px;line-height:1.9;letter-spacing:.04em;max-width:30em;color:var(--ink-soft);margin-top:clamp(40px,5vw,56px)}
.section-head{border-top:0;justify-content:center}
.section-head h2{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.5em;text-transform:uppercase;color:var(--ink)}
.section-head .eyebrow{display:none}
.featured{gap:clamp(4px,.6vw,8px)}
.grid{gap:clamp(28px,3vw,44px) clamp(4px,.6vw,8px)}
.tile-frame{padding:0;border-color:rgba(216,192,146,.12);background:#0b0b0a}
.tile-frame img{background:#151514}
.tile:hover .tile-frame{border-color:rgba(216,192,146,.55)}
.tile:hover img{transform:none;filter:brightness(1.08)}
.tile-frame img{transition:filter .8s var(--ease)}
.tile-cap{font-family:var(--sans);font-weight:400;font-size:9.5px;letter-spacing:.36em;text-transform:uppercase;color:var(--ink-soft);margin-top:16px}
.btn{border:0;border-bottom:1px solid var(--gold-light);padding:10px 2px;color:var(--ink);letter-spacing:.46em;font-weight:400;font-size:10px}
.btn:hover{background:none;color:#fff;border-color:var(--gold)}
.btn .arrow{display:none}
.page-head h1{font-family:var(--sans);font-weight:200;font-size:clamp(26px,4vw,40px);letter-spacing:.5em;padding-left:.5em;text-transform:uppercase}
.page-head p{font-family:var(--sans);font-weight:300;font-size:13px;letter-spacing:.08em}
.page-head .rule{width:1px;height:36px}
.chapter-head{grid-template-columns:1fr;border-top:0;justify-items:center;text-align:center}
.chapter-num{display:none}
.chapter-head h2{font-family:var(--sans);font-weight:300;font-size:13px;letter-spacing:.6em;padding-left:.6em;text-transform:uppercase;margin-top:12px}
.chapter-head p{font-family:var(--sans);font-style:normal;font-weight:300;font-size:12.5px;letter-spacing:.06em;color:var(--ink-soft)}
.chapter.nocturne{background:#0b0b0a;color:var(--ink);border-top:1px solid var(--rule)}
.nocturne .tile-frame{background:#0b0b0a;border-color:rgba(216,192,146,.12)}
.foot{background:#0b0b0a;border-top-color:var(--rule)}
.foot-credit{font-family:var(--sans);font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:400}
.foot-credit a{border-bottom-color:var(--gold-light)}
.foot img{width:24px;height:24px;opacity:.75}
.hero-copy{font-size:14.5px;color:#a89d84}
.chapter-head p,.page-head p{color:#a89d84}
@media (max-width:759px){.page-head h1{letter-spacing:.32em;padding-left:.32em;font-size:24px}}
.piece-visual{padding:0;border-color:rgba(216,192,146,.14)}
.piece-text h1{font-family:var(--sans);font-weight:200;font-size:clamp(26px,3.4vw,40px);letter-spacing:.34em;text-transform:uppercase;line-height:1.25}
.piece-line{font-family:var(--sans);font-weight:300;font-size:14px;line-height:1.9;letter-spacing:.04em;color:#a89d84}
.piece-text .rule{width:1px;height:36px;background:var(--gold-light)}
.piece-spec dt{color:var(--ink-soft)}
.piece-spec div{font-size:10px;letter-spacing:.3em}
.btn-solid{background:transparent;color:var(--ink);border:1px solid var(--rule-strong);padding:16px 30px 16px 34px}
.btn-solid:hover{background:var(--ink);color:#0b0b0a;border-color:var(--ink)}
.btn-solid .arrow{display:inline}
.back{color:var(--ink-soft);letter-spacing:.4em}
.piece-nav a{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.32em;text-transform:uppercase}
.piece-nav small{font-size:9px;letter-spacing:.4em;color:var(--gold-light)}
.view{animation-duration:.9s}
/* Collections of five — equal squares (index) and equal varieties (interior) */
.cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,3.4vw,48px) clamp(8px,1.4vw,20px);padding-bottom:clamp(64px,9vw,112px)}
@media (min-width:760px){.cgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ctile{display:block}
.ctile-frame{position:relative;aspect-ratio:1/1;overflow:hidden;border:1px solid rgba(216,192,146,.12);background:#151514;transition:border-color .6s var(--ease)}
.ctile-frame picture,.ctile-frame img{width:100%;height:100%}
.ctile-frame img{object-fit:cover;object-position:50% 50%;transition:filter .8s var(--ease)}
.ctile:hover .ctile-frame,.ctile:focus-visible .ctile-frame{border-color:rgba(216,192,146,.55)}
.ctile:hover img{filter:brightness(1.08)}
.ctile:focus-visible{outline:none}
.ctile-cap{font-family:var(--sans);font-weight:400;font-size:9.5px;letter-spacing:.36em;text-transform:uppercase;color:var(--ink-soft);margin-top:14px;text-align:center;line-height:1.5}
.crumb{padding-top:clamp(22px,3vw,40px)}
.col-head{padding-top:clamp(28px,5vw,56px)}
.col-head p{margin-top:22px;max-width:28em}
.vgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(28px,3vw,44px) clamp(8px,1.2vw,16px);padding-bottom:clamp(64px,9vw,112px)}
.vgrid .tile{grid-column:span 2}
.vgrid .tile:last-child:nth-child(odd){grid-column:2 / span 2}
@media (min-width:760px){.vgrid{grid-template-columns:repeat(6,minmax(0,1fr))}.vgrid .tile:last-child:nth-child(odd){grid-column:span 2}.vgrid .tile:nth-child(4){grid-column:2 / span 2}}
@media (min-width:1080px){.vgrid{grid-template-columns:repeat(5,minmax(0,1fr))}.vgrid .tile,.vgrid .tile:nth-child(4),.vgrid .tile:last-child:nth-child(odd){grid-column:auto}}
.vgrid .tile-cap{margin-top:14px}
