:root { --bg:#0a0a0a; --surface:#101010; --surface-2:#161616; --line:#2a2a2a; --text:#f2f0eb; --muted:#a8a59e; --gold:#cfb06c; --silver:#c7c9c7; --paper:#e9e5db; }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; background:var(--bg); }
    body { margin:0; background:var(--bg); color:var(--text); font-family:"Avenir Next","Helvetica Neue",Arial,sans-serif; }
    a { color:inherit; text-decoration:none; }
    button { font:inherit; }
    .mono, .eyebrow, .card-code, .price, .label, .footer-meta { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.03em; }
    .site-header { position:sticky; top:0; z-index:20; display:grid; grid-template-columns:1fr auto 1fr; grid-template-rows:auto auto; align-items:center; padding:1.35rem clamp(1.25rem,4vw,4rem) 1.1rem; background:rgba(10,10,10,.86); border-bottom:1px solid rgba(255,255,255,.08); backdrop-filter:blur(18px); }
    .brand { grid-column:2; grid-row:1; justify-self:center; display:block; width:5rem; aspect-ratio:238/115; line-height:0; } .brand-logo { display:block; width:100%; height:100%; object-fit:contain; }
    .nav { grid-column:1/-1; grid-row:2; justify-self:center; display:flex; gap:clamp(1rem,3vw,2.8rem); margin-top:.8rem; } .nav a { position:relative; padding:.35rem 0; color:#d6d4cf; font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; } .nav a::after { content:""; position:absolute; left:50%; bottom:0; width:0; height:1px; background:var(--text); transform:translateX(-50%); transition:width .25s ease; } .nav a:hover::after { width:100%; }
    .member { position:absolute; right:clamp(1.25rem,4vw,4rem); top:1.1rem; display:flex; align-items:center; gap:.55rem; color:#e9e6de; font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; } .member-icon { width:1.35rem; height:1.35rem; display:grid; place-items:center; border:1px solid #68655e; border-radius:50%; font-size:.68rem; }
    .hero { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.04fr) minmax(19rem,.96fr); align-items:stretch; min-height:calc(100svh - 4.6rem); border-bottom:1px solid var(--line); }
    .hero-copy { display:flex; flex-direction:column; justify-content:space-between; padding:clamp(2rem,6vw,6rem) clamp(1.25rem,6vw,6rem); }
    .eyebrow { margin:0; color:var(--gold); font-size:.68rem; text-transform:uppercase; }
    .hero h1 { max-width:8ch; margin:clamp(4rem,13vw,11rem) 0 2.2rem; font-size:clamp(4rem,10vw,10.5rem); line-height:.82; font-weight:500; letter-spacing:-.095em; }
    .hero-sub { max-width:31rem; margin:0; color:var(--muted); font-size:clamp(1rem,1.7vw,1.25rem); line-height:1.5; }
    .hero-bottom { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-top:3.5rem; } .hero-bottom p { margin:0; color:#807e78; font-size:.72rem; line-height:1.5; } .circle-link { width:3.4rem; aspect-ratio:1; display:grid; place-items:center; border:1px solid #56534d; border-radius:50%; font-size:1.15rem; transition:background .2s,color .2s; } .circle-link:hover { background:var(--paper); color:#111; }
    .hero-object { position:relative; min-height:32rem; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at 50% 42%,#28251f 0,#151412 32%,#0a0a0a 70%); }
    .orb { position:absolute; width:48%; aspect-ratio:1; border:1px solid rgba(207,176,108,.3); border-radius:50%; filter:blur(.1px); } .orb-one { transform:translate(-38%,-35%); } .orb-two { transform:translate(45%,42%); }
    .nfc-card { position:relative; z-index:1; width:min(67%,25rem); aspect-ratio:1.586/1; padding:clamp(1rem,2vw,1.7rem); display:flex; flex-direction:column; justify-content:space-between; border-radius:1rem; background:linear-gradient(120deg,#252525 0%,#62605b 24%,#b4ae9f 48%,#373632 67%,#171717 100%); color:#111; box-shadow:1.5rem 2.7rem 4rem rgba(0,0,0,.55), inset 1px 1px 0 rgba(255,255,255,.7); transform:rotate(-10deg); transition:transform .55s cubic-bezier(.2,.8,.2,1); } .hero-object:hover .nfc-card { transform:rotate(-3deg) translateY(-.6rem); }
    .card-top { display:flex; justify-content:space-between; align-items:start; font-size:clamp(1rem,2vw,1.7rem); font-weight:700; letter-spacing:-.13em; } .card-logo { display:block; width:4.4rem; height:auto; aspect-ratio:238/115; object-fit:contain; } .card-chip { width:18%; aspect-ratio:1.45/1; border:1px solid rgba(0,0,0,.45); border-radius:.25rem; background:repeating-linear-gradient(90deg,transparent 0 19%,rgba(0,0,0,.45) 20% 22%,transparent 23% 39%); } .card-bottom { display:flex; align-items:end; justify-content:space-between; font-size:.52rem; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.05em; } .nfc-ring { width:2.5rem; aspect-ratio:1; border:1px solid rgba(0,0,0,.55); border-radius:50%; position:relative; } .nfc-ring::before,.nfc-ring::after { content:""; position:absolute; border:1px solid rgba(0,0,0,.55); border-radius:50%; inset:.28rem; } .nfc-ring::after { inset:.55rem; }
    .stat-rail { position:absolute; right:1.3rem; bottom:1.4rem; color:#8e8a82; font-size:.62rem; writing-mode:vertical-rl; letter-spacing:.12em; }
    .section { padding:clamp(4.5rem,10vw,10rem) clamp(1.25rem,6vw,6rem); border-bottom:1px solid var(--line); }
    .section-heading { display:grid; grid-template-columns:1fr minmax(12rem,2.2fr); gap:2rem; margin-bottom:clamp(3rem,6vw,6rem); } .section-heading h2 { max-width:11ch; margin:0; font-size:clamp(2.2rem,5vw,5rem); font-weight:500; letter-spacing:-.07em; line-height:.94; } .section-heading p { max-width:36rem; margin:0; align-self:end; color:var(--muted); font-size:1.05rem; line-height:1.55; }
    .collection-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); } .collection { min-height:30rem; padding:1.35rem; display:flex; flex-direction:column; justify-content:space-between; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface); transition:background .3s ease; } .collection:hover { background:var(--surface-2); } .collection h3 { margin:0; font-size:1.65rem; font-weight:500; letter-spacing:-.06em; } .collection p { max-width:23rem; margin:.55rem 0 0; color:var(--muted); font-size:.85rem; line-height:1.5; } .collection-visual { position:relative; align-self:center; width:82%; margin:auto 0; aspect-ratio:1.17; display:grid; place-items:center; } .object-card { width:90%; aspect-ratio:1.58/1; border-radius:.75rem; box-shadow:1.2rem 1.8rem 2.6rem rgba(0,0,0,.43); } .gold { background:linear-gradient(125deg,#4b381c,#efca74 45%,#72511d 68%,#f1d68e); transform:rotate(-9deg); } .titanium { background:linear-gradient(125deg,#252c30,#9da7aa 48%,#3f4a4e 70%,#c3cbce); transform:rotate(7deg); } .jade { background:linear-gradient(125deg,#0d2924,#66a58c 48%,#154c3c 72%,#99cdb5); transform:rotate(-5deg); } .object-card::before { content:""; display:block; width:3.8rem; aspect-ratio:238/115; margin:1.1rem; background:url("assets/logo.svg") center/contain no-repeat; } .collection-footer { display:flex; justify-content:space-between; align-items:center; color:#c8c5bd; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; }
    .nfc-section { display:grid; grid-template-columns:minmax(16rem,1fr) minmax(18rem,1.35fr); gap:clamp(3rem,8vw,9rem); background:#dedbd2; color:#111; } .nfc-section .eyebrow { color:#655832; } .nfc-title { margin:1.2rem 0 0; font-size:clamp(2.5rem,5vw,5rem); font-weight:500; letter-spacing:-.08em; line-height:.9; } .nfc-side { display:grid; gap:1rem; align-content:start; } .nfc-side p { margin:0; font-size:1rem; line-height:1.6; color:#3f3e3a; } .tech-list { margin-top:1.5rem; border-top:1px solid #a7a39a; } .tech-item { display:grid; grid-template-columns:1.8rem 1fr; gap:1rem; padding:1.1rem 0; border-bottom:1px solid #a7a39a; } .tech-item b { font-size:.7rem; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-weight:500; } .tech-item span { font-size:.9rem; line-height:1.45; }
    .lab { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,8vw,8rem); } .lab-title { margin:1rem 0 0; font-size:clamp(2.5rem,5vw,5rem); line-height:.9; font-weight:500; letter-spacing:-.075em; } .path { border-top:1px solid var(--line); } .path-step { display:grid; grid-template-columns:3rem 1fr auto; align-items:center; gap:1rem; padding:1.3rem 0; border-bottom:1px solid var(--line); } .path-step b { color:var(--gold); font:500 .68rem ui-monospace,SFMono-Regular,Menlo,monospace; } .path-step h3 { margin:0; font-size:1.05rem; font-weight:500; } .path-step p { margin:.25rem 0 0; color:var(--muted); font-size:.8rem; line-height:1.45; } .path-step span { color:#89867e; font-size:.7rem; text-transform:uppercase; letter-spacing:.07em; }
    .pricing { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); } .pricing-item { min-height:19rem; padding:1.45rem; display:flex; flex-direction:column; border-right:1px solid var(--line); } .pricing-item:last-child { border:0; } .price { margin:auto 0 1rem; color:var(--gold); font-size:1.2rem; } .pricing-item h3 { margin:0; font-size:1.5rem; font-weight:500; letter-spacing:-.06em; } .pricing-item p { margin:.7rem 0 0; color:var(--muted); font-size:.82rem; line-height:1.5; }
    .closing { display:grid; grid-template-columns:1fr auto; align-items:end; gap:2rem; padding-top:clamp(5rem,13vw,13rem); } .closing h2 { max-width:11ch; margin:0; font-size:clamp(3.5rem,8vw,8.5rem); font-weight:500; line-height:.83; letter-spacing:-.1em; } .enquire { min-width:10rem; padding:1rem 1.2rem; display:flex; justify-content:space-between; border-bottom:1px solid #fff; font-size:.76rem; text-transform:uppercase; letter-spacing:.08em; }
    footer { display:grid; grid-template-columns:1fr auto 1fr; gap:1rem; padding:1.5rem clamp(1.25rem,4vw,4rem); border-top:1px solid var(--line); color:#88857e; font-size:.65rem; text-transform:uppercase; } footer span:nth-child(2) { text-align:center; } footer span:last-child { text-align:right; }
    @media (max-width:800px) { .site-header { grid-template-columns:1fr auto 1fr; } .nav { grid-column:1/-1; justify-content:center; } .hero { grid-template-columns:1fr; } .hero-copy { border:0; } .hero h1 { margin-top:5rem; } .hero-object { min-height:29rem; } .section-heading,.nfc-section,.lab { grid-template-columns:1fr; } .collection-grid,.pricing { grid-template-columns:1fr; } .collection { min-height:24rem; } .pricing-item { min-height:14rem; border-right:0; border-bottom:1px solid var(--line); } .pricing-item:last-child { border-bottom:0; } }
    @media (max-width:480px) { .site-header { padding-inline:1rem; } .nav { gap:1rem; } .nav a { font-size:.62rem; } .member { font-size:0; } .hero-copy,.section { padding-inline:1.25rem; } .hero h1 { font-size:4.3rem; } .nfc-card { width:74%; } .closing { grid-template-columns:1fr; } footer { grid-template-columns:1fr; } footer span,footer span:nth-child(2),footer span:last-child { text-align:left; } }
  
/* Shared navigation and stable, locally available typography. */
:root { --header-height:170px; }
html { scroll-padding-top:calc(var(--header-height) + 1rem); }
body { font-family:"Avenir Next","Helvetica Neue",Arial,sans-serif; }
input,select,textarea,button { font:inherit; }
a,button,input,select,textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:2px solid var(--gold); outline-offset:5px; }
.site-header { min-height:var(--header-height); padding:1.8rem clamp(1.25rem,4vw,4rem) 1.45rem; border-bottom:0; }
.brand { width:6.5rem; }
.nav { margin-top:1.4rem; gap:clamp(1.5rem,4vw,3.5rem); }
.nav a { padding:.45rem .1rem; }
.nav a[aria-current="page"] { color:var(--gold); }
.nav a[aria-current="page"]::after { width:100%; background:var(--gold); }
.member { top:2.1rem; }
.skip-link { position:fixed; z-index:100; top:1rem; left:1rem; padding:.8rem 1rem; background:var(--paper); color:#111; transform:translateY(-200%); }
.skip-link:focus { transform:translateY(0); }
.hero { min-height:calc(100svh - var(--header-height)); border-bottom:0; }
.hero-copy { justify-content:center; padding-block:clamp(3.5rem,7vw,7rem); }
.hero h1 { max-width:9ch; margin:0 0 2.2rem; font-size:clamp(4rem,8.2vw,8rem); line-height:.98; letter-spacing:-.065em; font-weight:500; }
.hero-sub { font-size:clamp(1rem,1.4vw,1.2rem); line-height:1.65; }
.hero-bottom { margin-top:3rem; align-items:center; flex-wrap:wrap; }
.hero-object { background:radial-gradient(ellipse at 50% 50%,#24211b 0,#12110f 45%,#0a0a0a 75%); }
.nfc-card { max-width:25rem; }
h1,h2,h3,p { overflow-wrap:break-word; }
.text-link { display:inline-flex; align-items:center; gap:1rem; padding:.7rem 0; border-bottom:1px solid #6d6450; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.text-link:hover { color:var(--gold); border-color:var(--gold); }
.text-link span { font-size:1.1rem; }
.section-heading h2 { line-height:1.02; letter-spacing:-.055em; }
.destination-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.destination { position:relative; display:flex; flex-direction:column; min-height:17rem; padding:1.7rem; background:linear-gradient(150deg,#171612,#101010); border:1px solid var(--line); transition:border-color .2s; }
.destination:hover { border-color:var(--gold); }
.destination h2 { margin:3rem 0 .8rem; font-size:2rem; font-weight:500; letter-spacing:-.05em; }
.destination p { max-width:24ch; color:var(--muted); font-size:.9rem; line-height:1.6; }
.destination-arrow { position:absolute; right:1.5rem; bottom:1.5rem; color:var(--gold); font-size:1.5rem; }
.page-intro { padding-top:clamp(3.5rem,7vw,7rem); padding-bottom:3rem; border:0; }
.page-intro h1 { margin:1.7rem 0; font-size:clamp(3.5rem,7vw,7rem); line-height:1.02; font-weight:500; letter-spacing:-.06em; }
.page-lede { max-width:38rem; color:var(--muted); font-size:clamp(1rem,1.5vw,1.2rem); line-height:1.7; }
.edition-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.edition { min-width:0; }
.edition h2,.edition h3 { margin:.8rem 0; font-size:1.7rem; letter-spacing:-.035em; font-weight:500; }
.edition p:not(.eyebrow) { color:var(--muted); font-size:.92rem; line-height:1.7; }
.edition .text-link { margin-top:.5rem; }
.edition-visual { display:grid; place-items:center; min-height:18rem; background:radial-gradient(ellipse at center,#24221e,#111 75%); margin-bottom:2rem; padding:2rem; }
.small-card { display:flex; flex-direction:column; justify-content:space-between; width:100%; max-width:19rem; aspect-ratio:1.586; padding:1.25rem; border-radius:.65rem; background:linear-gradient(125deg,#33383a,#b4ae9f 48%,#333536); box-shadow:1rem 1.5rem 2rem #0006,inset 1px 1px #ffffff60; transform:rotate(-8deg); }
.small-card img { width:25%; height:auto; }
.small-card span { color:#111; font: .48rem ui-monospace,Menlo,monospace; letter-spacing:.06em; }
[data-finish="satin"] { background:linear-gradient(120deg,#71797b,#d9dcda 48%,#737d80); }
[data-finish="graphite"] { background:linear-gradient(120deg,#161a1c,#454b4d 48%,#15191a); }
.small-card[data-finish="graphite"] span { color:#c9c6bc; }
.quiet-note { margin:1.8rem 0 0; color:#8e8b83; font-size:.75rem; line-height:1.65; }
.collection-section { padding-top:0; }
.collection-scene { position:relative; display:grid; place-items:center; min-height:20rem; margin-bottom:2rem; overflow:hidden; background:radial-gradient(ellipse at center,#27241e,#101010 75%); }
.presentation-box { width:75%; transform:rotate(-9deg); }
.box-lid { display:grid; place-items:center; width:94%; height:5.5rem; margin:0 0 .7rem 1rem; background:linear-gradient(140deg,#302c25,#141310); border:1px solid #4a4232; box-shadow:.5rem .8rem 1rem #0008; }
.box-lid img { width:3.4rem; }
.box-tray { padding:1rem; background:#25231e; border:1px solid #4a4232; box-shadow:.5rem 1rem 1rem #0009; }
.box-tray .small-card { transform:none; padding:1rem; }
.card-fan { position:relative; width:85%; aspect-ratio:1.2; }
.card-fan .small-card { position:absolute; width:84%; left:8%; top:25%; }
.card-fan .small-card:first-child { transform:translate(-.5rem,-3rem) rotate(-19deg); }
.card-fan .small-card:nth-child(2) { transform:translate(.5rem,-1rem) rotate(-3deg); }
.card-fan .small-card:last-child { transform:translate(1rem,1rem) rotate(13deg); }
.desk-stand { position:absolute; width:54%; height:43%; left:12%; top:26%; display:grid; place-items:center; border-radius:.5rem; transform:skewY(-9deg); background:linear-gradient(120deg,#46453e,#a7a698 45%,#353731); box-shadow:1rem 2rem 1rem #0007; }
.desk-stand::after { content:""; position:absolute; bottom:15%; left:10%; width:80%; height:6%; background:#111; box-shadow:0 1px #ddd6; }
.desk-stand img { width:36%; }
.nfc-tag { position:absolute; right:14%; bottom:20%; display:flex; flex-direction:column; align-items:center; justify-content:space-around; width:24%; aspect-ratio:.65; border-radius:1rem; transform:rotate(15deg); background:linear-gradient(130deg,#212526,#626865,#202627); border:1px solid #75776a; box-shadow:.7rem .7rem 1.5rem #000a; }
.nfc-tag img { width:65%; }
.tag-hole { width:.55rem; height:.55rem; border-radius:50%; background:#111; box-shadow:inset 0 1px #aaa6; }
.collection-closing { background:#12110f; }
.collection-closing h2 { font-size:clamp(2rem,4vw,4rem); font-weight:500; letter-spacing:-.04em; margin:0 0 1rem; }
.collection-closing p { color:var(--muted); line-height:1.6; }
.customize-intro { padding-bottom:1rem; }
.customizer-section { padding-top:2rem; }
.customizer { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(2rem,6vw,6rem); align-items:start; }
.preview-column { position:sticky; top:calc(var(--header-height) + 2rem); min-width:0; }
.preview-stage { display:grid; place-items:center; min-height:24rem; padding:3rem 2.5rem; background:radial-gradient(ellipse,#29271f,#121212 75%); overflow:hidden; }
.design-card { position:relative; width:100%; max-width:30rem; aspect-ratio:1.586; border-radius:.85rem; transform:rotate(-5deg); color:#111; background:linear-gradient(120deg,#4d5252,#b4ae9f 48%,#484c49); box-shadow:1rem 2rem 3rem #0009,inset 1px 1px #ffffff80; }
.design-card[data-finish="satin"] { background:linear-gradient(120deg,#777e80,#e2e3de 48%,#899192); }
.design-card[data-finish="graphite"] { color:#e7e3d9; background:linear-gradient(120deg,#1a1d1f,#4b5050 48%,#202325); }
.preview-logo { position:absolute; width:20%; left:8%; top:12%; }
.design-card[data-mark="silver"] .preview-logo { filter:grayscale(1) brightness(1.6); }
.engraving { position:absolute; left:8%; right:8%; bottom:25%; display:grid; gap:.2rem; }
#preview-name { font-size:clamp(.85rem,1.55vw,1.4rem); letter-spacing:.1em; text-transform:uppercase; line-height:1.25; overflow-wrap:anywhere; }
#preview-role { font-size:clamp(.5rem,.8vw,.75rem); line-height:1.3; }
.design-card[data-placement="center"] .engraving { text-align:center; }
.design-card[data-placement="right"] .engraving { text-align:right; }
.preview-nfc,.preview-serial { position:absolute; bottom:9%; font: .48rem ui-monospace,Menlo,monospace; letter-spacing:.08em; }
.preview-nfc { left:8%; }.preview-serial { right:8%; }
.preview-caption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; margin:1rem 0 2rem; color:#9a968c; font-size:.55rem; }
.tap-preview { display:flex; align-items:center; gap:1.2rem; padding-top:1.5rem; border-top:1px solid var(--line); }
.tap-icon { display:grid; place-items:center; min-width:2.8rem; height:2.8rem; border:1px solid #655b42; border-radius:50%; color:var(--gold); font-size:1.3rem; }
.tap-preview p { color:var(--muted); font-size:.85rem; line-height:1.6; margin:.45rem 0 0; overflow-wrap:anywhere; }
.design-form { min-width:0; }
.design-form fieldset { min-width:0; margin:0 0 2rem; padding:0 0 2rem; border:0; border-bottom:1px solid var(--line); }
.design-form legend { display:flex; gap:1rem; margin-bottom:1.4rem; padding:0; font-size:1.1rem; }
.design-form legend span { color:var(--gold); font: .65rem ui-monospace,Menlo,monospace; align-self:center; }
.finish-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.finish-option { position:relative; display:flex; align-items:center; flex-direction:column; gap:.65rem; padding:.9rem .3rem; border:1px solid #3c3a35; cursor:pointer; font-size:.75rem; }
.finish-option:has(input:checked) { border-color:var(--gold); background:#cfb06c0c; }
.finish-option:focus-within { outline:2px solid var(--gold); outline-offset:3px; }
.finish-option input { position:absolute; width:1px; height:1px; opacity:0; }
.finish-swatch { width:2rem; height:2rem; border-radius:50%; border:1px solid #8a8679; }
.finish-swatch.brushed { background:linear-gradient(120deg,#494e4c,#b5b09e,#494f4d); }
.finish-swatch.satin { background:linear-gradient(120deg,#8b9190,#e2e3de,#919896); }
.finish-swatch.graphite { background:linear-gradient(120deg,#181c1e,#555b5c,#1d2323); }
.field { display:block; margin-top:1.1rem; font-size:.75rem; color:#d2cfc6; }
.field input,.field select,.field textarea { display:block; width:100%; min-width:0; margin-top:.6rem; padding:.85rem .9rem; border:1px solid #393833; border-radius:0; background:#141413; color:var(--text); font-size:.88rem; }
.field input::placeholder,.field textarea::placeholder { color:#807c74; }
.field textarea { resize:vertical; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--gold); }
.field-pair { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.optional { color:#8f8b81; font-size:.65rem; margin-left:.5rem; }
.field-help { color:#969184; font-size:.72rem; line-height:1.6; margin:.6rem 0 0; }
.design-actions { display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; }
.button,.secondary-button { min-height:2.9rem; padding:.9rem 1.1rem; border:1px solid var(--gold); font: .64rem ui-monospace,Menlo,monospace; letter-spacing:.05em; text-transform:uppercase; cursor:pointer; }
.button { color:#111; background:var(--gold); display:flex; justify-content:space-between; gap:1.5rem; }
.button:hover { background:#e5c77f; }.secondary-button { color:var(--gold); background:transparent; }
.secondary-button:hover { background:#cfb06c0c; }
.reset-button { margin-left:auto; padding:.7rem .3rem; border:0; background:none; color:#a9a397; font-size:.7rem; text-decoration:underline; cursor:pointer; }
.save-status { min-height:1.5rem; margin:1rem 0; font-size:.8rem; line-height:1.5; color:var(--gold); }
@media(max-width:1000px) { .edition-grid { gap:1.2rem; }.collection-scene { min-height:17rem; }.preview-stage { min-height:20rem; padding:2rem 1.5rem; } }
@media(max-width:800px) { :root{--header-height:153px}.site-header { padding:1.55rem 1rem 1.2rem; }.brand { width:5.8rem; }.member { top:1.9rem; right:1rem; }.nav { margin-top:1.25rem; }.hero-copy { padding-block:3rem; }.hero h1 { margin:0 0 1.5rem; font-size:clamp(3.5rem,11vw,5.5rem); line-height:1; }.hero-object{min-height:27rem}.destination-grid,.edition-grid { grid-template-columns:1fr; gap:2.5rem; }.destination { min-height:15rem; }.destination h2 { margin-top:2rem; }.collection-scene { min-height:22rem; }.edition-visual{min-height:20rem}.page-intro { padding-top:3rem; }.page-intro h1 { font-size:clamp(3.1rem,10vw,5rem); }.customizer { grid-template-columns:1fr; gap:2.5rem; }.preview-column { position:static; }.preview-stage{min-height:21rem;padding:2.5rem 1.5rem}.preview-caption{font-size:.53rem}#preview-name{font-size:1.1rem}#preview-role{font-size:.65rem}.customizer-section{padding-top:1rem}.finish-options{gap:.6rem}.reset-button{margin-left:0} }
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.nfc-card,.hero-object:hover .nfc-card{transform:rotate(-5deg)} }

/* Align Member to the logo's centre without an extra icon. */
.member { position:static; grid-column:3; grid-row:1; align-self:center; justify-self:end; top:auto; right:auto; transform:none; font-size:.74rem; line-height:1; }
.member-icon { display:none; }
@media(max-width:800px) { .member { font-size:.65rem; line-height:1; } }
@view-transition { navigation:auto; }
.site-header { view-transition-name:site-header; }
::view-transition-group(site-header),::view-transition-old(site-header),::view-transition-new(site-header) { animation:none; }

/* Member studio and the public NFC destination. */
[hidden] { display:none!important; }
.member-login { display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(3rem,8vw,9rem); align-items:start; min-height:calc(100svh - var(--header-height)); padding-block:5rem; }
.login-story h1 { margin:1.6rem 0; font-size:clamp(3.4rem,5.8vw,6rem); font-weight:400; letter-spacing:-.06em; line-height:1.02; }
.owner-card { width:15rem; aspect-ratio:1.586; padding:1.4rem; margin-top:3rem; display:flex; flex-direction:column; justify-content:space-between; border-radius:.65rem; background:linear-gradient(120deg,#424747,#b4ae9f 48%,#494d49); transform:rotate(-5deg); box-shadow:1rem 1rem 3rem #0007; }
.owner-card img { width:3.7rem; }.owner-card span { color:#151515; font: .55rem/1.5 ui-monospace,monospace; letter-spacing:.06em; }
.login-panel { padding:2.5rem; border:1px solid #343026; background:linear-gradient(135deg,#191713,#101010); }
.login-panel h2 { margin:1.7rem 0 .7rem; font-size:2.3rem; font-weight:400; letter-spacing:-.04em; }
.login-panel>p:not(.eyebrow) { color:var(--muted); font-size:.9rem; }
.login-panel .button { width:100%; margin-top:2rem; }
.prototype-note { margin-top:2rem; padding:1.2rem; background:#cfb06c08; border-left:2px solid #74613c; color:#a9a294; font-size:.76rem; line-height:1.7; }
.prototype-note b { color:var(--gold); font-weight:500; }.prototype-note p { margin:.4rem 0 0; }
.owner-heading { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:3.5rem clamp(1.25rem,6vw,6rem) 2.5rem; }
.owner-heading h1 { margin:1rem 0; font-size:clamp(2.8rem,5vw,5rem); font-weight:400; letter-spacing:-.055em; line-height:1.1; }.owner-heading p:not(.eyebrow) { color:var(--muted); line-height:1.6; }
.owner-meta { display:flex; justify-content:space-between; gap:1rem; padding:1.2rem clamp(1.25rem,6vw,6rem); border-block:1px solid var(--line); font: .65rem/1.6 ui-monospace,monospace; color:var(--gold); letter-spacing:.06em; }
.owner-workspace { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(2rem,6vw,7rem); padding:3rem clamp(1.25rem,6vw,6rem) 5rem; align-items:start; }
.owner-editor { min-width:0; }.check-field { display:flex; align-items:start; gap:.7rem; margin-top:1.5rem; font-size:.8rem; line-height:1.6; }.check-field input { margin-top:.25rem; accent-color:var(--gold); }
.profile-link-row { margin-bottom:1.2rem; padding:0 1rem .6rem; background:#141412; border:1px solid #302c24; }.link-row-actions { display:flex; gap:.5rem; justify-content:flex-end; padding-top:.5rem; }.link-row-actions button { border:0; background:none; color:var(--gold); cursor:pointer; padding:.5rem; font-size:.75rem; }.link-row-actions button:disabled { opacity:.3; cursor:default; }button:disabled { opacity:.4; cursor:default; }
.share-panel { padding:1.5rem; border:1px solid #74613c; background:#15130e; }.share-panel h2 { font-size:1.3rem; font-weight:400; }.share-panel p { color:var(--muted); font-size:.8rem; line-height:1.6; }.share-panel .design-actions { margin-top:1rem; }.share-panel input { font-size:.7rem; }
.profile-preview-column { position:sticky; top:calc(var(--header-height) + 1.5rem); min-width:0; text-align:center; }.preview-heading { max-width:360px; display:flex; justify-content:space-between; gap:1rem; margin:0 auto 1.1rem; }.preview-heading>span:last-child { font-size:.7rem; color:var(--muted); }.phone-preview { position:relative; width:100%; max-width:360px; height:660px; max-height:calc(100svh - var(--header-height) - 6rem); min-height:390px; border:7px solid #35332e; border-radius:2.4rem; margin:auto; overflow:hidden; background:#101010; box-shadow:0 1.2rem 4rem #0008; }.phone-preview iframe { width:100%; height:100%; border:0; display:block; }.phone-speaker { position:absolute; z-index:2; width:4rem; height:.35rem; background:#46423b; border-radius:1rem; top:.6rem; left:calc(50% - 2rem); }
.public-profile { --profile-bg:#111110; --profile-fg:#eee9df; --profile-muted:#b0a99b; --profile-accent:#d6b87a; --profile-line:#494134; background:var(--profile-bg); color:var(--profile-fg); min-height:100svh; }
.public-profile[data-theme="ivory"] { --profile-bg:#eee9dd; --profile-fg:#292820; --profile-muted:#686353; --profile-accent:#756032; --profile-line:#c4bda8; }
.public-profile[data-theme="forest"] { --profile-bg:#102c27; --profile-fg:#e4eee7; --profile-muted:#a9c0b4; --profile-accent:#d1bd8a; --profile-line:#446158; }
.tap-profile { max-width:480px; margin:auto; padding:3.4rem 1.5rem 1.8rem; text-align:center; }.tap-eyebrow { margin:0 0 2rem; color:var(--profile-muted); font: .55rem ui-monospace,monospace; letter-spacing:.16em; }.profile-avatar { width:5.5rem; height:5.5rem; margin:0 auto 1.5rem; display:grid; place-items:center; border:1px solid var(--profile-accent); border-radius:50%; color:var(--profile-accent); font-size:1.7rem; font-weight:300; letter-spacing:.05em; background:linear-gradient(140deg,#ffffff09,#00000012); }.tap-name { font-size:2.4rem; font-weight:400; letter-spacing:-.05em; line-height:1.1; margin:0 0 .7rem; overflow-wrap:anywhere; }.tap-role { font-size:.9rem; margin:.3rem 0; line-height:1.5; }.tap-company { font-size:.8rem; color:var(--profile-accent); margin:.3rem 0; line-height:1.5; }.tap-location { color:var(--profile-muted); font-size:.7rem; margin:.8rem 0 0; }.tap-bio { color:var(--profile-muted); font-size:.86rem; line-height:1.8; margin:1.6rem 0; white-space:pre-line; }.tap-links { display:grid; gap:.7rem; margin-top:1.6rem; }.tap-link { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:1rem; border:1px solid var(--profile-line); font-size:.8rem; text-align:left; }.tap-link:hover { border-color:var(--profile-accent); }.tap-link span:last-child { color:var(--profile-accent); }.tap-contacts { display:flex; gap:1.8rem; justify-content:center; margin:1.5rem 0; font-size:.8rem; color:var(--profile-accent); }.tap-save { width:100%; padding:1rem; color:var(--profile-bg); background:var(--profile-accent); border:0; cursor:pointer; font-size:.8rem; }.tap-signature { margin-top:3.2rem; display:grid; justify-items:center; gap:.8rem; }.tap-signature img { width:2.5rem; }.tap-signature span { color:var(--profile-muted); font: .45rem ui-monospace,monospace; letter-spacing:.13em; }.profile-message { color:var(--profile-muted); padding:2rem; text-align:center; line-height:1.6; }.profile-message:empty { display:none; }
.public-profile[data-layout="editorial"] .tap-profile { text-align:left; }.public-profile[data-layout="editorial"] .profile-avatar { margin-left:0; border-radius:.7rem; }.public-profile[data-layout="editorial"] .tap-contacts { justify-content:flex-start; }
@media(max-width:1000px) { .login-panel { padding:1.7rem; }.owner-workspace { gap:2rem; padding-inline:1.5rem; }.owner-workspace .field-pair { grid-template-columns:1fr; gap:0; } }
@media(max-width:800px) { .member-login { grid-template-columns:1fr; padding-block:3rem; gap:3rem; }.owner-card { display:none; }.owner-heading { padding-top:2.5rem; flex-wrap:wrap; gap:1rem; }.owner-heading .secondary-button { min-height:2.5rem; }.owner-meta { flex-wrap:wrap; font-size:.55rem; }.owner-workspace { grid-template-columns:1fr; padding-inline:1.25rem; }.profile-preview-column { position:static; grid-row:1; }.phone-preview { height:580px; min-height:0; max-height:none; max-width:340px; }.owner-workspace .field-pair { grid-template-columns:1fr 1fr; gap:1rem; }.owner-editor .prototype-note { margin-bottom:0; } }
@media(max-width:480px) { .owner-workspace .field-pair { grid-template-columns:1fr; gap:0; }.login-story h1 { font-size:3.6rem; }.login-panel { padding:1.5rem; }.profile-link-row { padding-inline:.8rem; }.owner-heading h1 { font-size:2.7rem; } }
#login-status { min-height:1.4rem; color:#ee6b5d; }
/* Login fields use the same quiet border while typing; suppress browser-style
   gold focus rings and red invalid halos in this prototype form. */
#member-login-form input:focus,
#member-login-form input:focus-visible,
#member-login-form input:invalid:focus,
#member-login-form input:invalid:focus-visible {
    outline:none;
    outline-offset:0;
    border-color:#393833;
    box-shadow:none;
}
.checkout-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(22rem,.8fr); gap:clamp(3rem,8vw,9rem); align-items:start; min-height:calc(100svh - var(--header-height)); padding-block:clamp(4rem,8vw,8rem); }
.checkout-layout h1 { margin:1.5rem 0; font-size:clamp(3.5rem,7vw,7rem); font-weight:400; letter-spacing:-.07em; line-height:.95; }
.checkout-panel { padding:2rem; border:1px solid #39352d; background:#141311; }.checkout-product { display:grid; grid-template-columns:8rem 1fr; gap:1.4rem; align-items:center; padding-bottom:1.5rem; margin-bottom:1.5rem; border-bottom:1px solid var(--line); }.checkout-product .small-card { width:100%; transform:rotate(-6deg); }.checkout-product h2 { margin:.5rem 0; font-size:1.5rem; font-weight:400; }.checkout-product p:not(.eyebrow) { color:var(--muted); font-size:.75rem; line-height:1.5; }.checkout-product strong { color:var(--gold); font:1rem ui-monospace,monospace; }.checkout-panel .button { width:100%; margin-top:1.5rem; }.checkout-panel .check-field { color:var(--muted); }.checkout-panel #checkout-status { color:var(--gold); }
@media(max-width:800px){.checkout-layout{grid-template-columns:1fr;gap:2rem;padding-block:3rem}.checkout-panel{padding:1.3rem}.checkout-product{grid-template-columns:7rem 1fr}}
body[data-page="cards"] .nfc-card, body[data-page="cards"] .small-card { cursor:pointer; }
body[data-page="cards"] .nfc-card:focus-visible, body[data-page="cards"] .small-card:focus-visible { outline:2px solid var(--gold); outline-offset:8px; }
.footer-links { display:flex; justify-content:center; gap:1.3rem; flex-wrap:wrap; text-align:center; }
.footer-links a { color:#aaa69d; text-decoration:none; }
.footer-links a:hover { color:var(--gold); }
.legal-page { min-height:calc(100svh - var(--header-height)); padding-top:clamp(5rem,12vw,11rem); }
.legal-page h1 { margin:1.5rem 0; font-size:clamp(3.4rem,7vw,7rem); font-weight:400; letter-spacing:-.07em; line-height:.95; }
@media(max-width:600px){ .footer-links { justify-content:flex-start; text-align:left; gap:.7rem 1rem; } }

/* Homepage material showcase: a full-bleed, video-like 3D study while the
   production video asset is still being prepared. */
body[data-page="index"] .site-header { position:absolute; inset:0 0 auto; width:100%; background:linear-gradient(180deg,rgba(5,6,6,.62),rgba(5,6,6,0)); border-bottom:0; }
body[data-page="index"] .hero { min-height:100svh; display:block; isolation:isolate; background:#080909; }
body[data-page="index"] .hero-object { position:absolute; inset:0; z-index:-1; min-height:0; background:radial-gradient(ellipse at 70% 48%,#4b4840 0,#1b1b19 28%,#0a0b0b 68%); }
body[data-page="index"] .hero-object::before { content:""; position:absolute; inset:-20%; background:linear-gradient(112deg,transparent 30%,rgba(255,255,255,.08) 43%,rgba(222,201,151,.3) 47%,rgba(255,255,255,.04) 52%,transparent 65%); transform:translateX(-55%) skewX(-12deg); animation:metal-sweep 7s ease-in-out infinite; mix-blend-mode:screen; pointer-events:none; }
body[data-page="index"] .hero-object::after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 72% 45%,transparent 0 28%,rgba(0,0,0,.46) 72%,rgba(0,0,0,.82) 100%); pointer-events:none; }
body[data-page="index"] .hero-copy { position:relative; z-index:1; min-height:100svh; width:min(58rem,64%); padding:clamp(8rem,15vw,12rem) clamp(1.25rem,6vw,6rem) clamp(3rem,8vw,8rem); justify-content:center; text-shadow:0 .2rem 1.2rem rgba(0,0,0,.65); }
body[data-page="index"] .hero h1 { font-size:clamp(4rem,8.4vw,9rem); }
body[data-page="index"] .hero-sub { color:#d4d0c7; }
body[data-page="index"] .hero-object .nfc-card { z-index:3; position:absolute; left:62%; top:52%; width:min(68vw,64rem); transform:translate(-50%,-50%) rotate(-14deg) perspective(1000px) rotateY(-16deg); animation:card-float 6s ease-in-out infinite; background:linear-gradient(112deg,#252827 0%,#858b87 25%,#ded8c5 45%,#555b58 59%,#171a1a 100%); box-shadow:2rem 4rem 6rem rgba(0,0,0,.72), inset 1px 1px 0 rgba(255,255,255,.75), inset -1px -1px 0 rgba(0,0,0,.7); }
body[data-page="index"] .hero-object .nfc-card::before { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(116deg,transparent 35%,rgba(255,255,255,.48) 47%,transparent 59%); transform:translateX(-130%); animation:card-glint 5.5s ease-in-out infinite; mix-blend-mode:screen; pointer-events:none; }
body[data-page="index"] .hero-object .card-logo { width:16%; }
body[data-page="index"] .hero-object .card-chip { width:17%; }
body[data-page="index"] .hero-object .nfc-ring { width:3.6rem; }
body[data-page="index"] .hero-object .orb { width:38%; opacity:.45; }
body[data-page="index"] .hero-object .stat-rail { z-index:1; }
@keyframes card-float { 0%,100% { margin-top:0; } 50% { margin-top:-1.4rem; } }
@keyframes card-glint { 0%,24% { transform:translateX(-130%); opacity:0; } 38% { opacity:1; } 58%,100% { transform:translateX(130%); opacity:0; } }
@keyframes metal-sweep { 0%,20% { transform:translateX(-55%) skewX(-12deg); opacity:0; } 38% { opacity:1; } 63%,100% { transform:translateX(55%) skewX(-12deg); opacity:0; } }
@media(max-width:800px) { body[data-page="index"] .hero-copy { width:100%; min-height:100svh; padding-top:clamp(9rem,27vw,12rem); justify-content:flex-start; background:linear-gradient(90deg,rgba(7,8,8,.85),rgba(7,8,8,.28)); } body[data-page="index"] .hero-object .nfc-card { left:59%; top:66%; width:92vw; } body[data-page="index"] .hero-object::after { background:linear-gradient(180deg,rgba(0,0,0,.4),transparent 42%,rgba(0,0,0,.85)); } }
@media(prefers-reduced-motion:reduce) { body[data-page="index"] .hero-object .nfc-card, body[data-page="index"] .hero-object::before, body[data-page="index"] .hero-object .nfc-card::before { animation:none; } }
.card-manifesto { position:relative; min-height:38rem; background:radial-gradient(ellipse at 75% 45%,#29251d 0,#11110f 48%,#0a0a0a 78%); overflow:hidden; }
.card-manifesto::before { content:"10X"; position:absolute; right:clamp(-2rem,4vw,5rem); top:50%; transform:translateY(-50%); color:#cfb06c12; font-size:clamp(16rem,35vw,36rem); line-height:.7; letter-spacing:-.15em; pointer-events:none; }
.card-manifesto .section-heading,.card-manifesto .manifesto-copy,.card-manifesto .manifesto-mark { position:relative; z-index:1; }
.card-manifesto .section-heading { grid-template-columns:1fr 1.4fr; margin-bottom:3rem; }
.card-manifesto .section-heading h2 { max-width:9ch; font-size:clamp(3rem,7vw,7rem); }
.manifesto-copy { max-width:42rem; margin-left:33%; color:#c5c0b5; font-size:clamp(1.1rem,1.7vw,1.45rem); line-height:1.65; }
.manifesto-copy p { margin:0 0 1.4rem; }
.manifesto-copy p:last-child { color:var(--gold); font-style:italic; }
.manifesto-mark { display:flex; align-items:center; justify-content:space-between; max-width:42rem; margin:3rem 0 0 33%; padding-top:1rem; border-top:1px solid #615438; color:var(--gold); font-size:1.5rem; }
.manifesto-mark .mono { font-size:.65rem; letter-spacing:.12em; }
@media(max-width:800px) { .card-manifesto .section-heading { grid-template-columns:1fr; gap:1.5rem; }.manifesto-copy,.manifesto-mark { margin-left:0; }.card-manifesto::before { right:-3rem; top:70%; font-size:15rem; } }

/* One physical envelope across product, collection, checkout and design previews. */
:is(.nfc-card,.small-card,.object-card,.design-card) {
 aspect-ratio:85.6 / 53.98;
 border-radius:3.715% / 5.89%;
 position:relative;
 filter:drop-shadow(0 var(--card-depth, 3px) 0 #656d70);
}

/* Shared menu: centered identity with navigation in the left drawer. */
:root { --header-height:120px; }
.site-header { grid-template-rows:auto; transition:background-color .2s ease,color .2s ease; }
.menu-toggle { grid-column:1; grid-row:1; justify-self:start; display:flex; align-items:center; gap:1rem; min-height:44px; padding:.5rem 0; border:0; background:none; color:inherit; cursor:pointer; }
.menu-stripes { display:grid; gap:5px; width:24px; }
.menu-stripes i { display:block; height:1px; background:currentColor; }
.menu-label { font-size:.7rem; letter-spacing:.08em; }
.site-header .member { top:50%; transform:translateY(-50%); }
.navigation-drawer { position:fixed; inset:0; width:100%; max-width:none; height:100%; max-height:none; margin:0; padding:0; border:0; overflow:clip; background:transparent; color:#eeeae2; }
.navigation-drawer::backdrop { background:#0008; }
.navigation-panel { display:flex; flex-direction:column; width:min(480px,100%); min-height:100%; padding:2.2rem clamp(1.5rem,4vw,3.5rem); background:#17191e; }
.navigation-top { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.navigation-top p { margin:0; font-size:.65rem; text-transform:uppercase; letter-spacing:.15em; }
.menu-close { min-height:44px; display:flex; align-items:center; gap:1rem; border:0; padding:.5rem 0 .5rem 1rem; background:none; cursor:pointer; font-size:.7rem; color:inherit; }
.menu-close span { font-size:1.7rem; font-weight:300; }
.navigation-panel .nav { display:flex; flex-direction:column; align-items:stretch; gap:0; margin:5rem 0; width:100%; }
.navigation-panel .nav a { padding:1.3rem 0; border-bottom:1px solid #383b42; color:#eeeae2; font-size:clamp(1.7rem,3vw,2.5rem); font-weight:300; letter-spacing:-.035em; text-transform:capitalize; }
.navigation-panel .nav a::after { display:none; }
.navigation-panel .nav a:hover,.navigation-panel .nav a[aria-current="page"] { color:#d6c29a; }
.navigation-note { margin:auto 0 0; padding-top:2rem; font-size:.8rem; line-height:1.8; color:#aaa8a3; }
body:has(.navigation-drawer[open]) { overflow:hidden; }
@media(hover:hover) and (pointer:fine) {
}
@media(max-width:800px) { :root { --header-height:104px; } .menu-label { display:none; } .navigation-panel { padding:1.5rem; } }

.site-header { color:#eeeae2; }
.site-header .brand-logo { filter:none; }
.header-actions { grid-column:3; grid-row:1; justify-self:end; display:flex; align-items:center; gap:1rem; }
.header-action { display:grid; place-items:center; width:44px; height:44px; color:inherit; border-radius:50%; transition:background-color .2s ease; }
.header-action svg { width:24px; height:24px; stroke:currentColor; stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round; }
.header-action:hover { background:#ffffff0c; }
@media(max-width:800px) { .header-actions { gap:.15rem; } .header-action { width:38px; height:44px; } .header-action svg { width:22px; height:22px; } }

/* Fixed header geometry: every control shares the same center line. */
.site-header { height:var(--header-height); min-height:var(--header-height); padding-block:0; grid-template-rows:1fr; align-items:center; }
.site-header .brand,.site-header .menu-toggle,.site-header .header-actions { align-self:center; margin-block:0; }
.menu-toggle { width:44px; height:44px; justify-content:center; }
.header-action { flex:0 0 44px; padding:0; border:0; background:transparent; cursor:pointer; }
.header-action svg { display:block; overflow:hidden; flex:none; }
.navigation-panel { width:min(340px,88vw); height:100%; min-height:0; overflow-y:auto; padding:1.6rem 1.8rem; }
.navigation-panel .nav { margin:3rem 0; }
.navigation-panel .nav a { font-size:1.65rem; }
.navigation-drawer[open] .navigation-panel { animation:drawer-in .3s cubic-bezier(.22,.61,.36,1) both; }
.navigation-drawer.is-closing .navigation-panel { animation:drawer-out .22s ease-in both; }
.navigation-drawer[open]::backdrop { animation:backdrop-in .3s ease both; }
.navigation-drawer.is-closing::backdrop { animation:backdrop-out .22s ease both; }
.bag-drawer .navigation-panel { margin-left:auto; width:min(400px,92vw); --drawer-shift:100%; }
.bag-content { margin:2rem 0; }
.bag-empty { color:#aaa8a3; line-height:1.8; font-size:.9rem; }
.bag-item { padding:1.5rem 0; border-bottom:1px solid #383b42; }
.bag-item h3 { margin:0 0 .5rem; font-size:1rem; font-weight:400; }
.bag-item p { color:#aaa8a3; font-size:.8rem; }
.bag-item-controls { display:flex; align-items:center; gap:.8rem; }
.bag-item-controls button { border:1px solid #44474d; background:none; color:inherit; min-width:36px; height:36px; cursor:pointer; }
.bag-item-controls .bag-remove { margin-left:auto; border:0; font-size:.7rem; text-decoration:underline; }
.bag-footer { margin-top:auto; }
.bag-subtotal { display:flex; justify-content:space-between; padding:1.5rem 0; font-size:.9rem; }
.bag-checkout { display:block; text-align:center; padding:1rem; background:#d6c29a; color:#141414; font-size:.8rem; }
.bag-checkout[hidden] { display:none; }
.bag-note,.bag-feedback { font-size:.72rem; line-height:1.6; color:#aaa8a3; }
.add-to-bag { width:100%; margin-bottom:1rem; }
.order-summary { border-block:1px solid #383b42; margin:2rem 0; padding:1rem 0; }
.order-summary p { display:flex; justify-content:space-between; gap:1rem; font-size:.9rem; }
@keyframes drawer-in { from { transform:translateX(var(--drawer-shift,-100%)); } to { transform:translateX(0); } }
@keyframes drawer-out { to { transform:translateX(var(--drawer-shift,-100%)); } }
@keyframes backdrop-in { from { opacity:0; } to { opacity:1; } }
@keyframes backdrop-out { to { opacity:0; } }
@media(max-width:800px) { .header-action { flex-basis:38px; } }

.menu-close { width:40px; height:40px; min-height:40px; justify-content:center; padding:0; flex:none; }
.drawer-kicker { font-size:.5rem!important; letter-spacing:.25em!important; color:#a8a198; }
.navigation-top .drawer-wordmark { margin-top:.6rem; font-size:2.7rem; font-weight:300; line-height:1; letter-spacing:-.1em; color:#d6c29a; }
#navigation-drawer .navigation-panel { background:radial-gradient(ellipse at 0 0,#34322a44,transparent 60%),#121418; }
#navigation-drawer .navigation-top { align-items:flex-start; }
#navigation-drawer .nav { margin-top:3.5rem; gap:.5rem; }
#navigation-drawer .nav a { padding:1.25rem 0 1.5rem; text-transform:none; border-color:#d6c29a22; }
.drawer-link-title { display:flex; justify-content:space-between; align-items:center; font-family:Georgia,serif; font-size:2rem; text-transform:capitalize; }
.drawer-link-title>span { font:1rem Arial,sans-serif; color:#d6c29a; transition:transform .2s; }
.drawer-link-description { display:block; margin-top:.7rem; font-size:.7rem; letter-spacing:.015em; font-weight:400; color:#9c9b98; }
#navigation-drawer .nav a:hover .drawer-link-title>span { transform:translate(3px,-3px); }
#navigation-drawer .navigation-note { border-top:1px solid #d6c29a22; font-family:Georgia,serif; font-size:1rem; color:#bcb4a6; }

/* Typing fields stay quiet; keyboard focus remains visible on navigation controls. */
:is(input,textarea,select):focus,:is(input,textarea,select):focus-visible,
:is(input,textarea,select):invalid { outline:none!important; box-shadow:none!important; border-color:#393833!important; }
.field-error { display:block; color:#c0b8aa; font-size:.75rem; line-height:1.5; letter-spacing:0; margin-top:.4rem; }
.field-error:empty { display:none; }
html { overscroll-behavior-y:none; }
body { overscroll-behavior-y:none; }
.site-header,body[data-page="index"] .site-header { position:fixed; top:0; left:0; right:0; width:100%; }
body:not([data-page="index"]) { padding-top:var(--header-height); }