/* Layout: a gallery of porcelain bays for cut stones, broken by deep "vault" bands for origin and rough. Left-aligned editorial type, specs in mono like a parcel ledger. */
:root{
  --paper:#F1F1EE;          /* identical to the studio ground behind every stone photo */
  --paper-2:#E7E8E3;
  --ink:#121714;
  --ink-2:#434B46;
  --mute:#767E78;
  --line:#D4D7D0;
  --vault:#0D110F;
  --vault-2:#161B18;
  --on-vault:#E6E8E2;
  --on-vault-mute:#97A099;
  --vault-line:#2A312D;
  --tsav:#1D6A3B;
  --ruby:#8A1C2D;
  --m0:#FFF5DC; --m1:#EED592; --m2:#C69A45; --m3:#8B6324; --m4:#4A3311;   /* metal, highlight → deep reflection; switched by the jewellery control */
  --f-display:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
  --f-body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --gut:max(16px, env(safe-area-inset-left, 0px));
  --gutr:max(16px, env(safe-area-inset-right, 0px));
  --wrap:1240px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--paper)}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--tsav);outline-offset:3px}
.band{padding-left:var(--gut);padding-right:var(--gutr)}
.wrap{max-width:var(--wrap);margin:0 auto}
.eyebrow{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.vault .eyebrow{color:var(--on-vault-mute)}
h1,h2,h3{font-family:var(--f-display);font-weight:400;letter-spacing:-.01em;text-wrap:balance;margin:0}
h2{font-size:clamp(34px,4.6vw,60px);line-height:1.04}
h3{font-size:26px;line-height:1.15}
p{margin:0}
.lede{font-size:18px;color:var(--ink-2);max-width:56ch}
.vault .lede{color:var(--on-vault-mute)}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.btn{display:inline-flex;align-items:center;gap:10px;font:500 13px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:16px 26px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:transparent;color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.vault .btn{background:var(--on-vault);color:var(--vault);border-color:var(--on-vault)}
.vault .btn:hover{background:transparent;color:var(--on-vault)}
.vault .btn.ghost{background:transparent;color:var(--on-vault)}
.link{font:500 12.5px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:5px;background:none;border-top:0;border-left:0;border-right:0;color:inherit;cursor:pointer}

/* nav */
header.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:68px}
.mark{display:flex;flex-direction:column;text-decoration:none;line-height:1}
.mark img{display:block;height:36px;width:auto}
.mark b{font-family:var(--f-display);font-weight:400;font-size:21px;letter-spacing:.34em}
.mark span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.32em;color:var(--mute);margin-top:6px}
.nav nav{display:flex;gap:28px}
.nav nav a{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--ink-2)}
.nav nav a:hover{color:var(--ink)}
.sel-pill{font-family:var(--f-mono);font-size:12px;border:1px solid var(--ink);padding:9px 14px;text-decoration:none;white-space:nowrap}
.sel-pill em{font-style:normal;display:inline-block;min-width:1.2em;text-align:center}
/* once something is in the enquiry: bright fill and a live dot */
.sel-pill{position:relative;color:var(--ink);transition:background .25s,color .25s,border-color .25s}
.sel-pill.has{background:var(--tsav);border-color:var(--tsav);color:#fff}
.sel-pill.has::after{content:"";position:absolute;top:-5px;right:-5px;width:10px;height:10px;border-radius:50%;background:#E0354F;box-shadow:0 0 0 2px var(--paper);animation:selPing 2s ease-out infinite}
.sel-pill.bump{animation:selBump .45s ease-out}
@keyframes selPing{0%{box-shadow:0 0 0 2px var(--paper),0 0 0 2px rgba(224,53,79,.55)}70%{box-shadow:0 0 0 2px var(--paper),0 0 0 10px rgba(224,53,79,0)}100%{box-shadow:0 0 0 2px var(--paper),0 0 0 10px rgba(224,53,79,0)}}
@keyframes selBump{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.sel-pill.has::after,.sel-pill.bump{animation:none}}
.menu-btn{display:none;background:none;border:1px solid var(--line);padding:9px 12px;font:500 12px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);cursor:pointer}
@media (max-width:900px){.menu-btn{display:inline-block}.nav nav{display:none;position:absolute;left:0;right:0;top:68px;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:8px max(16px,env(safe-area-inset-right,0px)) 16px max(16px,env(safe-area-inset-left,0px))}.nav nav.open{display:flex}.nav nav a{padding:14px 0;border-top:1px solid var(--line)}.nav .right{display:flex;gap:8px;align-items:center}}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* hero */
.hero{padding-block:clamp(56px,9vw,120px) 0}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:end}
.hero h1{font-size:clamp(46px,7.4vw,104px);line-height:.98;letter-spacing:-.02em}
.hero h1 i{font-style:italic;color:var(--tsav)}
.hero h1 .r{color:var(--ruby)}
.hero-side{display:grid;gap:28px;padding-bottom:10px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-plate{margin-top:clamp(40px,6vw,72px);position:relative}
.trip{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:12px}.trip img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover}.trip img:first-child{aspect-ratio:auto}
.plate-cap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;border-top:1px solid var(--line);padding-block:14px 0;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;color:var(--mute);text-transform:uppercase}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr;gap:28px}}@media (max-width:620px){.trip{grid-template-columns:1fr 1fr}.trip img:first-child{grid-column:1/-1;aspect-ratio:4/3}}

.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:56px}
.facts div{padding:22px 20px;border-left:1px solid var(--line);display:grid;gap:4px}
.facts div:first-child{border-left:0;padding-left:0}
.facts b{font-family:var(--f-display);font-weight:400;font-size:30px;line-height:1.1}
.facts span{font-size:13px;color:var(--mute)}
@media (max-width:760px){.facts{grid-template-columns:1fr 1fr}.facts div:nth-child(3){border-left:0;padding-left:0}.facts div:nth-child(n+3){border-top:1px solid var(--line)}}

section.pad{padding-block:clamp(72px,10vw,132px)}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:32px 64px;align-items:end;margin-bottom:56px}
.sec-head .eyebrow{grid-column:1/-1;margin-bottom:-12px}
@media (max-width:860px){.sec-head{grid-template-columns:1fr}}

/* collection */
.coll{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}
.stone{position:relative;display:grid;grid-template-rows:auto 1fr;background:var(--paper-2);min-width:0}
.stone.big{grid-column:span 6}
.stone.small{grid-column:span 6}
.stone .ph{overflow:hidden;background:var(--paper)}
.stone .ph img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.stone:hover .ph img{transform:scale(1.035)}
.stone.small .ph img{aspect-ratio:16/9}
.stone .body{padding:28px 28px 30px;display:grid;gap:14px;align-content:start}
.stone .top{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.stone h3{font-size:clamp(30px,3vw,40px)}
.stone .focus{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border:1px solid currentColor}
.stone.tsav .focus{color:var(--tsav)}
.stone.ruby .focus{color:var(--ruby)}
.stone p{color:var(--ink-2);max-width:52ch}
.spec{display:grid;grid-template-columns:auto 1fr;gap:6px 20px;margin:6px 0 0;font-size:13.5px}
.spec dt{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);padding-top:2px}
.spec dd{margin:0}
.stone.ruby{background:var(--vault);color:var(--on-vault)}
.stone.ruby p,.stone.ruby .spec dd{color:var(--on-vault)}
.stone.ruby .spec dt{color:var(--on-vault-mute)}
.stone.ruby .ph{background:var(--vault)}
.stone.ruby .focus{color:#E07A88}
@media (max-width:860px){.stone.big,.stone.small{grid-column:1/-1}}

/* vault bands */
.vault{background:var(--vault);color:var(--on-vault)}
.m2m{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,96px);align-items:start}
.m2m-img{background:var(--paper);position:sticky;top:96px}
.m2m-img img{width:100%;aspect-ratio:3/4;object-fit:cover}
.m2m-img figcaption{background:var(--vault);padding-top:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--on-vault-mute)}
.steps{list-style:none;margin:48px 0 0;padding:0;counter-reset:s}
.steps li{display:grid;grid-template-columns:72px 1fr;gap:24px;padding:28px 0;border-top:1px solid var(--vault-line);counter-increment:s}
.steps li:last-child{border-bottom:1px solid var(--vault-line)}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--f-mono);font-size:13px;color:var(--on-vault-mute);padding-top:6px}
.steps h3{font-size:24px;margin-bottom:6px}
.steps p{color:var(--on-vault-mute);max-width:54ch}
.steps .where{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#7FBF92;margin-bottom:8px;display:block}
@media (max-width:860px){.m2m{grid-template-columns:1fr}.m2m-img{position:static}.m2m-img img{aspect-ratio:4/5}}

/* inventory */
.toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;align-items:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding-block:14px;margin-bottom:28px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font:500 12px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;padding:10px 14px;border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.chip:hover{border-color:var(--ink)}
.count{font-family:var(--f-mono);font-size:12px;color:var(--mute)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 20px}
@media (max-width:1040px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:720px){.grid{grid-template-columns:repeat(2,1fr);gap:24px 12px}}
.card{display:grid;gap:12px;min-width:0}
.card .img{position:relative;background:var(--paper);border:1px solid var(--line);overflow:hidden}
.card .img img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.card:hover .img img{transform:scale(1.06)}
.card .tag{position:absolute;left:10px;top:10px;font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;background:var(--paper);color:var(--ink);padding:5px 8px;border:1px solid var(--line)}
.card .tag.dark{background:var(--vault);color:var(--on-vault);border-color:var(--vault)}
.card .row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.card .ref{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--mute)}
.card .ct{font-family:var(--f-mono);font-size:13px;font-variant-numeric:tabular-nums}
.card h4{margin:0;font-family:var(--f-display);font-weight:400;font-size:21px;line-height:1.2}
.card .meta{font-size:13px;color:var(--ink-2);line-height:1.45}
.card .act{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:10px}
.card .por{font-size:12px;color:var(--mute)}
.add{font:500 11.5px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;background:none;border:0;border-bottom:1px solid var(--ink);padding:0 0 4px;cursor:pointer;color:var(--ink)}
.add[aria-pressed="true"]{color:var(--tsav);border-color:var(--tsav)}
.add[aria-pressed="true"]::before{content:"✓ "}

/* spotlight */
.spot{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.spot article{display:grid;grid-template-columns:1fr 1fr;background:var(--paper-2);min-width:0}
.spot article img{width:100%;height:100%;object-fit:cover;aspect-ratio:1}
.spot .txt{padding:28px;display:grid;gap:14px;align-content:start}
.spot .big-ct{font-family:var(--f-display);font-size:56px;line-height:1}
.spot .big-ct small{font-family:var(--f-mono);font-size:14px;margin-left:6px;color:var(--mute)}
@media (max-width:1040px){.spot{grid-template-columns:1fr}}
@media (max-width:560px){.spot article{grid-template-columns:1fr}}

/* rough */
.rough{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.parcel{background:var(--vault-2);display:grid;grid-template-rows:auto 1fr;min-width:0}
.parcel img{width:100%;aspect-ratio:4/3;object-fit:cover}
.parcel .body{padding:26px;display:grid;gap:14px;align-content:start}
.parcel .kind{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--on-vault-mute)}
.parcel h3{font-size:28px}
.parcel p{color:var(--on-vault-mute);font-size:15px}
.ledger{width:100%;border-collapse:collapse;font-family:var(--f-mono);font-size:12.5px;font-variant-numeric:tabular-nums}
.ledger td{padding:8px 0;border-top:1px solid var(--vault-line);vertical-align:top}
.ledger td:last-child{text-align:right;color:var(--on-vault)}
.ledger td:first-child{color:var(--on-vault-mute);letter-spacing:.04em}
@media (max-width:960px){.rough{grid-template-columns:1fr}.parcel{grid-template-columns:1fr 1fr;grid-template-rows:none}.parcel img{height:100%;aspect-ratio:auto}}
@media (max-width:620px){.parcel{grid-template-columns:1fr}.parcel img{aspect-ratio:4/3}}
.how{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:56px;border-top:1px solid var(--vault-line)}
.how div{padding:24px 24px 0 0;display:grid;gap:8px;align-content:start}
.how b{font-weight:500;font-size:15px}
.how span{color:var(--on-vault-mute);font-size:14px}
@media (max-width:860px){.how{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.how{grid-template-columns:1fr}}
.rough-cta{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;margin-top:56px;padding-top:32px;border-top:1px solid var(--vault-line)}
.rough-cta p{font-family:var(--f-display);font-size:26px;max-width:30ch;line-height:1.25}

/* jewellery */
.jew-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:24px;margin-bottom:40px}
.metal{display:flex;gap:0;border:1px solid var(--ink)}
.metal button{font:500 11.5px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;padding:12px 16px;background:transparent;border:0;cursor:pointer;color:var(--ink);display:flex;align-items:center;gap:8px}
.metal button i{width:12px;height:12px;border-radius:50%;display:inline-block}
.metal button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.jewels{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.jewel{background:var(--paper);border:1px solid var(--line);display:grid;grid-template-rows:auto 1fr;min-width:0}
.jewel svg{width:100%;height:auto;display:block;aspect-ratio:4/5}
.jewel .body{padding:20px 22px 24px;border-top:1px solid var(--line);display:grid;gap:8px;align-content:start}
.jewel h3{font-size:22px}
.jewel .meta{font-size:13px;color:var(--ink-2)}
.jewel .uses{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--mute)}
.jewel .est{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-top:4px;padding-top:12px;border-top:1px solid var(--line)}
.jewel .est span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.jewel .est b{font-weight:600;font-size:15px;color:var(--ink)}
.jewel .est small{font-size:12px;color:var(--ink-2)}
.note{margin-top:20px;font-size:13px;color:var(--mute)}
@media (max-width:1040px){.jewels{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.jewels{grid-template-columns:1fr}}

/* pathways */
.paths{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.path{padding:32px 28px 36px 0;display:grid;gap:16px;align-content:start;border-right:1px solid var(--line);padding-left:28px}
.path:first-child{padding-left:0}
.path:last-child{border-right:0}
.path .who{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.path h3{font-size:30px}
.path ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.path li{font-size:14.5px;color:var(--ink-2);padding-left:18px;position:relative}
.path li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:1px;background:var(--ink)}
@media (max-width:900px){.paths{grid-template-columns:1fr}.path{border-right:0;border-bottom:1px solid var(--line);padding-left:0}}

.terms{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:64px}
.terms div{background:var(--paper);padding:22px;display:grid;gap:6px;align-content:start}
.terms dt{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.terms dd{margin:0;font-size:14px;color:var(--ink-2)}
@media (max-width:900px){.terms{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.terms{grid-template-columns:1fr}}

/* enquiry */
.enq{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,6vw,96px)}
.contact{display:grid;gap:22px;align-content:start}
.contact .line{border-top:1px solid var(--vault-line);padding-top:16px;display:grid;gap:6px}
.contact .line span{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--on-vault-mute)}
.contact .line b{font-weight:400;font-size:17px;user-select:all;word-break:break-all}
.copy{font:500 11px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;background:none;border:1px solid var(--vault-line);color:var(--on-vault);padding:8px 10px;cursor:pointer;justify-self:start}
form{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}
.f{display:grid;gap:8px;min-width:0}
.f.full{grid-column:1/-1}
label,.legend{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--on-vault-mute)}
input,select,textarea{font:400 15px/1.4 var(--f-body);color:var(--on-vault);background:var(--vault-2);border:1px solid var(--vault-line);padding:13px 14px;border-radius:0;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--on-vault-mute)}
textarea{min-height:120px;resize:vertical}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg label{font:500 12px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--on-vault);border:1px solid var(--vault-line);padding:11px 14px;cursor:pointer}
.seg input:checked+label{background:var(--on-vault);color:var(--vault);border-color:var(--on-vault)}
.seg input:focus-visible+label{outline:2px solid #7FBF92;outline-offset:2px}
.selbox{grid-column:1/-1;border:1px dashed var(--vault-line);padding:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:52px}
.selbox .empty{font-size:13px;color:var(--on-vault-mute)}
.stag{font-family:var(--f-mono);font-size:11.5px;border:1px solid var(--vault-line);padding:6px 8px;display:inline-flex;gap:8px;align-items:center;background:var(--vault-2)}
.stag button{background:none;border:0;color:var(--on-vault-mute);cursor:pointer;font-size:14px;line-height:1;padding:0}
.submit-row{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.status{font-size:14px;color:#9FD3AE}
.status.err{color:#F0A3AE}
@media (max-width:860px){.enq{grid-template-columns:1fr}form{grid-template-columns:1fr}}

/* owner pipeline */
.pipe{margin-top:72px;border-top:1px solid var(--vault-line);padding-top:32px}
.pipe-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.pipe-stats{display:flex;gap:28px;flex-wrap:wrap;font-family:var(--f-mono);font-size:12px;color:var(--on-vault-mute)}
.pipe-stats b{color:var(--on-vault);font-weight:500;font-size:20px;display:block;font-family:var(--f-display)}
.tbl{overflow-x:auto}
.tbl table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:760px}
.tbl th{text-align:left;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--on-vault-mute);font-weight:400;padding:10px 12px 10px 0;border-bottom:1px solid var(--vault-line)}
.tbl td{padding:12px 12px 12px 0;border-bottom:1px solid var(--vault-line);vertical-align:top}
.pill{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border:1px solid currentColor;white-space:nowrap}
.pill.investor{color:#E2C46E}.pill.trade{color:#86C7E0}.pill.private{color:#E9A1C9}

footer{background:var(--vault);color:var(--on-vault-mute);border-top:1px solid var(--vault-line)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-block:28px;font-size:12.5px}
footer .mark b{color:var(--on-vault)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:520px){
  .mark img{height:30px}
  .mark b{font-size:17px;letter-spacing:.24em}
  .mark span{font-size:8.5px;letter-spacing:.22em}
  .sel-pill{padding:8px 10px}
  .sel-pill .lbl{display:none}
  .nav .wrap{gap:12px}
  .menu-btn{padding:8px 10px}
}

/* stone detail page */
.card a.img{display:block;text-decoration:none}
.card h4 a{text-decoration:none}
.card h4 a:hover{text-decoration:underline;text-underline-offset:3px}
.more-act{display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-self:start}
.pdp-wrap{padding-block:28px 72px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-bottom:24px}
.crumbs a{text-decoration:none;color:var(--ink-2)}
.crumbs a:hover{color:var(--ink)}
.pdp{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,72px);align-items:start}
.pdp-ph{margin:0;position:relative;background:var(--paper);border:1px solid var(--line);position:sticky;top:92px}
.pdp-ph img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.pdp-ph .tag{position:absolute;left:14px;top:14px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--paper);color:var(--ink);padding:6px 9px;border:1px solid var(--line)}
.pdp-ph .tag.dark{background:var(--vault);color:var(--on-vault);border-color:var(--vault)}
.pdp-txt{display:grid;gap:20px;align-content:start;min-width:0}
.pdp h1{font-size:clamp(38px,5vw,64px);line-height:1.02}
.pdp .big-ct{font-family:var(--f-display);font-size:clamp(56px,7vw,84px);line-height:1}
.pdp .big-ct small{font-family:var(--f-mono);font-size:15px;margin-left:8px;color:var(--mute)}
.pdp .big-ct.sm{font-size:clamp(34px,4vw,48px)}
.pdp-spec{border-top:1px solid var(--ink);padding-top:16px;gap:10px 28px;font-size:14.5px}
.pdp-spec .muted{color:var(--mute);font-family:var(--f-body);font-size:12.5px;margin-left:6px}
.reserved{font-size:14px;border-left:2px solid var(--ruby);padding:4px 0 4px 12px;color:var(--ink-2)}
.pdp-act{display:flex;flex-wrap:wrap;gap:10px}
.pdp-act .sel-n{font-style:normal;font-family:var(--f-mono)}
.btn.add-btn{background:var(--ink);color:var(--paper);border:1px solid var(--ink);padding:16px 26px;font-size:13px;letter-spacing:.12em}
.btn.add-btn:hover{background:transparent;color:var(--ink)}
.btn.add-btn[aria-pressed="true"]{background:var(--tsav);border-color:var(--tsav);color:#fff}
.pdp-next{list-style:none;margin:8px 0 0;padding:0;display:grid;border-top:1px solid var(--line)}
.pdp-next li{display:grid;gap:4px;padding:14px 0;border-bottom:1px solid var(--line)}
.pdp-next b{font-weight:500;font-size:14.5px}
.pdp-next span{font-size:14px;color:var(--ink-2)}
.pdp-pager{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:end;margin-top:56px;padding-top:20px;border-top:1px solid var(--line)}
.pdp-pager a{text-decoration:none;display:grid;gap:6px;min-width:0}
.pdp-pager a b{font-weight:400;font-family:var(--f-display);font-size:19px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdp-pager a:hover b{text-decoration:underline;text-underline-offset:3px}
.pdp-pager .nx{text-align:right}
.pdp-pager .all{font:500 12px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:5px;align-self:center;display:inline-block}
.rel-h{font-size:clamp(26px,3vw,36px)}
@media (max-width:860px){.pdp{grid-template-columns:1fr}.pdp-ph{position:static}}
@media (max-width:560px){.pdp-pager{grid-template-columns:1fr 1fr}.pdp-pager .all{display:none}.pdp-act .btn{flex:1 1 100%;justify-content:center}}

/* photos and titles that open a stone's detail page */
.ph-link{display:block;overflow:hidden;height:100%;cursor:zoom-in}
.ph-link img{display:block;transition:transform .5s ease}
.ph-link:hover img,.ph-link:focus-visible img{transform:scale(1.035)}
.ph-link:focus-visible{outline:2px solid var(--tsav);outline-offset:2px}
.t-link{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s}
.t-link:hover,.t-link:focus-visible{background-size:100% 1px}
@media (prefers-reduced-motion:reduce){.ph-link img,.t-link{transition:none}}

/* Brand garnet (Brand Guidelines v1.0): sections and footer that sit on burgundy.
   Redefines the dark-band tokens locally, so everything built on --vault follows. */
.garnet{
  --vault:#6E1423; --vault-2:#5C0F1C; --vault-line:rgba(217,182,106,.28);
  --on-vault:#FBF7F0; --on-vault-mute:#E6CFC8; --accent:#D9B66A;
  background:var(--vault);color:var(--on-vault)
}
.garnet .eyebrow{color:var(--accent)}
.garnet ::selection{background:#D9B66A;color:#2B2B2B}
footer.garnet{border-top:1px solid var(--vault-line)}
.foot-logo{display:block;height:36px;width:auto}
.garnet .where{color:var(--accent)}

/* enquiry dialog: sending → received / not sent */
.enq-dlg{border:0;padding:40px 36px 32px;width:min(440px,calc(100vw - 32px));background:#FBF7F0;color:#2B2B2B;text-align:center;box-shadow:0 30px 80px rgba(40,6,12,.35)}
.enq-dlg::backdrop{background:rgba(30,6,12,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.enq-dlg h3{font-family:var(--f-display);font-weight:400;font-size:28px;margin:18px 0 10px;color:#6E1423}
.enq-dlg p{font-size:15px;line-height:1.6;color:#4A4340;margin:0 0 24px}
.enq-dlg .btn{background:#6E1423;color:#FBF7F0;border-color:#6E1423}
.enq-dlg .btn:hover{background:transparent;color:#6E1423}
.dlg-icon{width:56px;height:56px;margin:0 auto;color:#B08A3E}
.dlg-icon svg{display:none;width:100%;height:100%}
.enq-dlg[data-state=sending] .i-spin{display:block;animation:dlgSpin 1s linear infinite}
.enq-dlg[data-state=sending] p{margin-bottom:4px}
.enq-dlg[data-state=ok] .i-ok{display:block}
.enq-dlg[data-state=err] .i-err{display:block;color:#A3283B}
.enq-dlg[data-state=ok] .i-ok path{stroke-dasharray:30;stroke-dashoffset:30;animation:dlgTick .45s .1s ease-out forwards}
@keyframes dlgSpin{to{transform:rotate(360deg)}}
@keyframes dlgTick{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.enq-dlg[data-state=sending] .i-spin{animation-duration:3s}.enq-dlg[data-state=ok] .i-ok path{animation:none;stroke-dashoffset:0}}
.enq-dlg[data-state=sending] #dlgClose{display:none}
.f label .opt{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:11px;opacity:.7;margin-left:6px}