/* Sovereign Gallery — volta.quest. Mobile-first. Fonts self-hosted, no third-party requests. */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/cormorant-garamond-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:300;font-display:swap;src:url(/fonts/cormorant-garamond-latin-300-italic.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-latin-wght-normal.woff2) format("woff2")}

:root{
  --obsidian:#07080a;--basalt:#101215;--graphite:#1a1d22;--line:#262a31;
  --champagne:#c9b48a;--champagne-dim:#8f7f5f;--copper:#b87650;
  --ivory:#ede8dd;--mist:#9a9da5;
  --serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Inter",-apple-system,"SF Pro Text","Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --pad:clamp(1.25rem,5vw,4rem);--max:72rem;
}
*{box-sizing:border-box;margin:0}
html{background:var(--obsidian);color:var(--ivory);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:300;font-size:1.0625rem;line-height:1.7;min-height:100svh;overflow-x:hidden;
  padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);-webkit-font-smoothing:antialiased}
img,svg,picture{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
:focus-visible{outline:1px solid var(--champagne);outline-offset:4px}
::selection{background:var(--champagne);color:var(--obsidian)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--champagne);color:var(--obsidian);padding:.7rem 1rem;z-index:100}
.skip:focus{left:0}

/* Header */
.bar{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:calc(.9rem + env(safe-area-inset-top)) var(--pad) .9rem;background:linear-gradient(var(--obsidian),rgba(7,8,10,0));
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.mark{font-family:var(--serif);font-weight:400;letter-spacing:.26em;text-transform:uppercase;font-size:.8rem;color:var(--ivory);min-height:44px;display:flex;align-items:center}
.mark b{color:var(--champagne);font-weight:400}
.mark .co{display:none}
@media(min-width:34rem){.mark .co{display:inline}}
.bar nav{display:flex;align-items:center;gap:clamp(.9rem,2.5vw,2rem)}
.bar nav a,.bar summary{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);min-height:44px;display:flex;align-items:center;cursor:pointer;list-style:none;transition:color .3s}
.bar nav a:hover,.bar summary:hover,.bar nav a[aria-current]{color:var(--champagne)}
.bar summary::-webkit-details-marker{display:none}
.nav-links{display:none}
.nav-drop{position:relative}
.nav-drop summary{gap:.35rem}
.nav-drop .caret{font-size:.6rem;color:var(--champagne-dim);transition:transform .25s}
.nav-drop[open] .caret{transform:rotate(180deg);color:var(--champagne)}
.drop-panel{position:absolute;top:100%;left:-1rem;min-width:16.5rem;background:rgba(16,18,21,.98);border:1px solid var(--line);padding:.6rem 0;display:grid;gap:0;box-shadow:0 18px 40px rgba(0,0,0,.65);z-index:70}
.drop-panel a{padding:.55rem 1.2rem;min-height:40px;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ivory);display:flex;align-items:center;gap:.75rem;white-space:nowrap}
.drop-panel a span{font-family:var(--serif);color:var(--champagne);font-size:.85rem;letter-spacing:.08em}
.drop-panel a:hover{background:var(--graphite);color:var(--champagne)}
.drop-panel a.drop-all{border-top:1px solid var(--line);margin-top:.3rem;padding-top:.7rem;color:var(--champagne)}
.menu{position:relative}
.menu[open]>.sheet{display:flex}
.sheet{display:none;position:fixed;inset:0;z-index:60;background:var(--obsidian);flex-direction:column;justify-content:center;gap:.3rem;padding:var(--pad);overflow-y:auto}
.sheet a{font-family:var(--serif);font-size:clamp(1.6rem,6vw,2.3rem);font-weight:300;letter-spacing:0;text-transform:none;color:var(--ivory);min-height:48px}
.sheet .sheet-sub{display:grid;grid-template-columns:1fr 1fr;gap:.2rem 1rem;padding:.4rem 0 .6rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:.2rem 0}
.sheet .sheet-sub a{font-family:var(--sans);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--champagne);min-height:40px}
.sheet .x{background:none;border:0;font-weight:300;position:absolute;top:calc(.9rem + env(safe-area-inset-top));right:var(--pad);font-family:var(--sans);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:flex-end;cursor:pointer}
@media(min-width:60rem){.nav-links{display:flex;align-items:center;gap:clamp(.8rem,1.4vw,1.8rem)}.menu{display:none}}

/* Type */
.eyebrow{font-size:.68rem;letter-spacing:.32em;text-transform:uppercase;color:var(--champagne)}
h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.08;color:var(--ivory)}
h1{font-size:clamp(2.7rem,10.5vw,6.4rem);letter-spacing:-.015em}
h2{font-size:clamp(2rem,6.4vw,3.8rem);letter-spacing:-.01em}
h3{font-size:clamp(1.4rem,3.4vw,1.9rem);font-weight:400}
em,.it{font-style:italic;color:var(--champagne)}
.lede{font-size:clamp(1.05rem,2.4vw,1.28rem);color:var(--mist);max-width:38rem}
p+p{margin-top:1.1em}
.small{font-size:.82rem;color:var(--mist);line-height:1.6}

/* Layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
section{padding:clamp(4.5rem,13vw,9rem) 0;border-top:1px solid var(--line)}
section.first{border-top:0}
.stack>*+*{margin-top:1.5rem}
.stack>h2+*{margin-top:1.8rem}
.cols{display:grid;gap:clamp(2rem,5vw,4rem)}
@media(min-width:60rem){.cols.two{grid-template-columns:1fr 1fr;align-items:center}.cols.three{grid-template-columns:repeat(3,1fr)}}

/* Hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:7rem 0 clamp(3rem,8vw,5rem);overflow:hidden;border-top:0;isolation:isolate}
.hero::before{content:"";position:absolute;inset:-20%;z-index:-2;
  background:radial-gradient(40% 35% at 70% 45%,rgba(201,180,138,.14),transparent 70%),radial-gradient(50% 40% at 20% 80%,rgba(184,118,80,.07),transparent 70%);
  animation:drift 22s ease-in-out infinite alternate}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(7,8,10,.55),rgba(7,8,10,.1) 35%,var(--obsidian) 98%)}
.hero .art{position:absolute;z-index:-1;right:50%;transform:translateX(50%);top:12svh;width:min(88vw,34rem);opacity:.92;
  -webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent 100%);mask-image:radial-gradient(closest-side,#000 55%,transparent 100%)}
.hero .stack{max-width:44rem;position:relative}
@media(min-width:64rem){
  .hero{align-items:center;padding:8rem 0 clamp(4rem,7vw,6rem)}
  .hero .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(18rem,.85fr);align-items:center;gap:clamp(2.5rem,5vw,5rem);width:100%}
  .hero .stack{max-width:none;min-width:0}
  .hero h1{font-size:clamp(3.1rem,4.4vw,5rem)}
  .hero .art{position:relative;z-index:1;right:auto;top:auto;transform:none;width:100%;max-width:34rem;justify-self:end;opacity:.96}
}
.cta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;margin-top:2.2rem}
@keyframes drift{to{transform:translate3d(3%,-2%,0) scale(1.06)}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:.9rem 1.8rem;border:1px solid var(--champagne);color:var(--champagne);
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;background:transparent;cursor:pointer;font-family:var(--sans);font-weight:400;
  transition:background .4s,color .4s}
.btn:hover{background:var(--champagne);color:var(--obsidian)}
.btn.solid{background:var(--champagne);color:var(--obsidian)}
.btn.solid:hover{background:var(--ivory);border-color:var(--ivory)}
.link{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mist);min-height:44px;display:inline-flex;align-items:center;border-bottom:1px solid transparent;transition:color .3s}
.link:hover{color:var(--champagne)}

/* Statements */
.statements{display:grid;gap:0;margin-top:3rem}
.statement{padding:1.6rem 0;border-top:1px solid var(--line)}
.statement h3{margin-bottom:.6rem}
.statement p{color:var(--mist)}
@media(min-width:60rem){.statements{grid-template-columns:repeat(3,1fr);gap:3rem}.statement{border-top:1px solid var(--champagne-dim)}}
.pull{font-family:var(--serif);font-weight:300;font-style:italic;font-size:clamp(1.5rem,4.4vw,2.6rem);line-height:1.25;color:var(--ivory);max-width:48rem}

/* Instrument / schematics */
.panel{background:linear-gradient(160deg,var(--basalt),var(--obsidian));border:1px solid var(--line);padding:clamp(1.2rem,3vw,2rem);position:relative}
.panel::before{content:"";position:absolute;left:0;top:0;width:3.5rem;height:1px;background:var(--champagne)}
.schem{width:100%;height:auto;color:var(--champagne)}
.schem .ln{stroke:currentColor;stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.schem .dim{stroke:var(--line)}
.schem text{font-family:var(--mono);font-size:10px;letter-spacing:.14em;fill:var(--mist);text-transform:uppercase}
.schem .box{fill:var(--obsidian)}
.schem .blade{transition:transform .7s cubic-bezier(.6,0,.2,1);transform-origin:170px 100px}
.schem .path-on{transition:opacity .5s}
.iso .blade{transform:rotate(-26deg)}
.iso .path-on{opacity:.12}
.iso .state-on{opacity:0}.state-off{opacity:0;transition:opacity .5s}.iso .state-off{opacity:1}.state-on{transition:opacity .5s}
.schem .flow{stroke-dasharray:6 10;animation:flow 2.4s linear infinite;stroke:var(--copper)}
@keyframes flow{to{stroke-dashoffset:-32}}
.cell{fill:var(--champagne);opacity:.18;animation:pulse 5s ease-in-out infinite}
@keyframes pulse{50%{opacity:.7}}
.switch{margin-top:1.2rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.cap{margin-top:1rem;color:var(--mist);font-size:.95rem}
.defs{display:grid;gap:0;margin-top:3rem}
.defs>div{padding:1.4rem 0;border-top:1px solid var(--line)}
.defs dt{font-family:var(--serif);font-size:1.5rem;color:var(--ivory);font-weight:400}
.defs dd{color:var(--mist);margin-top:.4rem}
@media(min-width:60rem){.defs{grid-template-columns:1fr 1fr;column-gap:4rem}}
figure.photo{position:relative}
figure.photo img{width:100%;height:auto}
figure.photo.round img{-webkit-mask-image:radial-gradient(closest-side,#000 60%,transparent);mask-image:radial-gradient(closest-side,#000 60%,transparent)}

/* Environments + tiers */
.env{padding:1.8rem 0;border-top:1px solid var(--line)}
.env .n{font-family:var(--serif);color:var(--champagne-dim);font-size:1.1rem}
.env h3{margin:.4rem 0 .7rem}
.env p{color:var(--mist)}
.tiers{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:3rem}
@media(min-width:48rem){.tiers{grid-template-columns:1fr 1fr}}
@media(min-width:75rem){.tiers{grid-template-columns:repeat(4,1fr)}}
.tier{background:var(--obsidian);padding:clamp(1.5rem,3vw,2.2rem);display:flex;flex-direction:column;gap:1rem;position:relative;transition:background .5s;min-height:22rem}
.tier:hover{background:var(--basalt)}
.tier h3 a{transition:color .3s}
.tier:hover h3 a{color:var(--champagne)}
.tier .price{font-family:var(--serif);font-size:1.7rem;color:var(--champagne);font-weight:300}
.tier .core{color:var(--ivory);font-size:.95rem}
.tier .alloc{margin-top:auto;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--champagne-dim);line-height:1.8;padding-top:1rem;border-top:1px solid var(--line)}
.tier .tier-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:.6rem;padding-top:.9rem;border-top:1px solid var(--line);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--champagne);min-height:44px;transition:color .3s}
.tier .tier-cta::after{content:"";position:absolute;inset:0;z-index:1}
.tier .tier-cta .arr{transition:transform .3s}
.tier:hover .tier-cta{color:var(--ivory)}
.tier:hover .tier-cta .arr{transform:translateX(4px)}
.tier p{color:var(--mist);font-size:.95rem}
.list{list-style:none;padding:0;margin-top:1.5rem}
.list li{padding:.9rem 0;border-top:1px solid var(--line);color:var(--ivory)}
.list li span{display:block;color:var(--mist);font-size:.92rem}
.steps{counter-reset:s;list-style:none;padding:0;margin-top:2.5rem;display:grid;gap:0}
.steps li{counter-increment:s;padding:1.4rem 0 1.4rem 3.2rem;border-top:1px solid var(--line);position:relative;color:var(--mist)}
.steps li::before{content:"0" counter(s);position:absolute;left:0;top:1.35rem;font-family:var(--serif);color:var(--champagne);font-size:1.3rem}
.steps li b{display:block;color:var(--ivory);font-weight:400;font-family:var(--serif);font-size:1.35rem}
@media(min-width:60rem){.steps{grid-template-columns:repeat(4,1fr);gap:2rem}.steps li{border-top:1px solid var(--champagne-dim);padding-left:0;padding-top:3.2rem}.steps li::before{top:1rem}}

/* Forms */
form{display:grid;gap:1.4rem;max-width:40rem}
label,.legend{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mist);display:block;margin-bottom:.5rem}
input,select,textarea{width:100%;min-height:52px;background:var(--basalt);border:1px solid var(--line);color:var(--ivory);padding:.85rem 1rem;
  font:inherit;font-size:1rem;border-radius:0;-webkit-appearance:none;appearance:none}
textarea{min-height:7rem;resize:vertical}
select{background-image:linear-gradient(45deg,transparent 50%,var(--champagne) 50%),linear-gradient(135deg,var(--champagne) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%,calc(100% - 15px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:2.5rem}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--champagne)}
.chips{display:flex;flex-wrap:wrap;gap:.6rem}
.chips label{margin:0;letter-spacing:.14em;text-transform:none;font-size:.9rem;color:var(--ivory);position:relative}
.chips input{position:absolute;opacity:0;width:1px;min-height:0;height:1px}
.chips span{display:inline-flex;align-items:center;min-height:48px;padding:.5rem 1.1rem;border:1px solid var(--line);cursor:pointer;transition:border-color .3s,color .3s}
.chips input:checked+span{border-color:var(--champagne);color:var(--champagne)}
.chips input:focus-visible+span{outline:1px solid var(--champagne);outline-offset:3px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.status{min-height:1.6rem;font-size:.95rem}
.status.ok{color:var(--champagne)}.status.err{color:#d98b7a}
.done{display:none;padding:2rem;border:1px solid var(--champagne-dim)}
.sent .done{display:block}.sent form{display:none}

/* Footer */
footer{border-top:1px solid var(--line);padding:3.5rem 0 calc(3rem + env(safe-area-inset-bottom))}
footer .wrap{display:grid;gap:2rem}
.fnav{display:flex;flex-wrap:wrap;gap:.2rem 1.6rem}
.fnav a{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mist);min-height:44px;display:inline-flex;align-items:center;transition:color .3s}
.fnav a:hover{color:var(--champagne)}
.fnav a.quiet{color:var(--champagne-dim)}
footer .small{max-width:46rem}

/* Reveal (only when JS is present) */
.js .rv{opacity:0;transform:translate3d(0,22px,0);transition:opacity 1s cubic-bezier(.2,.6,.2,1),transform 1s cubic-bezier(.2,.6,.2,1)}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero::before,.flow,.cell{animation:none}
  .js .rv{opacity:1;transform:none;transition:none}
  .schem .blade,.btn,.tier{transition:none}
}
