/* ═══════════════════════════════════════
TOKENS
═══════════════════════════════════════ */
:root {
--gold: #bf9b45;
--gold-hi: #d4af60;
--gold-lt: #e8c97a;
--gold-pale: #f2e4c0;
--gold-dim: rgba(191, 155, 69, 0.14);
--gold-line: rgba(191, 155, 69, 0.22);
--black: #080808;
--dark: #0e0e0e;
--dark2: #141414;
--forest: #0d1f15;
--forest2: #152a1e;
--cream: #f5f0e8;
--c60: rgba(245, 240, 232, 0.95);
--c30: rgba(245, 240, 232, 0.6);
--max: 1240px;
--px: 80px;
}

/* ═══════════════════════════════════════
RESET
═══════════════════════════════════════ */
*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
background: var(--black);
color: var(--cream);
font-family: 'Jost', system-ui, sans-serif;
font-weight: 300;
overflow-x: hidden;
-webkit-font-smoothing: antialiased;
}
a {
text-decoration: none;
color: inherit;
}
::-webkit-scrollbar {
width: 3px;
}
::-webkit-scrollbar-track {
background: var(--black);
}
::-webkit-scrollbar-thumb {
background: var(--gold);
}

/* ═══════════════════════════════════════
LAYOUT
═══════════════════════════════════════ */
.wrap {
max-width: var(--max);
margin: 0 auto;
padding: 0 var(--px);
}

/* ═══════════════════════════════════════
TYPE
═══════════════════════════════════════ */
.eyebrow {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 5px;
text-transform: uppercase;
color: var(--gold-hi);
display: block;
}
.rule {
display: flex;
align-items: center;
justify-content: center;
gap: 16px;
margin: 18px 0;
}
.rule::before,
.rule::after {
content: '';
height: 1px;
width: 44px;
background: var(--gold-line);
}
.rule-pip {
color: var(--gold);
font-size: 12px;
}
.hl {
font-family: 'Cinzel', serif;
font-size: clamp(36px, 5vw, 64px);
font-weight: 600;
line-height: 1.06;
color: #fff;
letter-spacing: -0.01em;
}
.hl .g {
color: var(--gold-hi);
}
.body-i {
font-family: 'Cormorant Garamond', serif;
font-size: clamp(18px, 2.2vw, 22px);
font-style: italic;
line-height: 1.85;
color: var(--c60);
}
.hair {
width: 56px;
height: 1px;
background: linear-gradient(90deg, transparent, var(--gold), transparent);
opacity: 0.6;
}
.hc {
margin: 0 auto;
}

/* ═══════════════════════════════════════
BUTTONS
═══════════════════════════════════════ */
.btn {
display: inline-block;
font-family: 'Cinzel', serif;
font-size: 10px;
letter-spacing: 4px;
text-transform: uppercase;
transition: all 0.35s cubic-bezier(0.22, 0.68, 0, 1);
cursor: pointer;
}
.btn-fill {
background: linear-gradient(135deg, var(--gold) 0%, var(--gold-hi) 60%, var(--gold) 100%);
background-size: 200%;
color: #0a0800;
padding: 18px 52px;
}
.btn-fill:hover {
background-position: 100%;
transform: translateY(-3px);
box-shadow: 0 20px 56px rgba(191, 155, 69, 0.38);
}
.btn-ghost {
border: 1px solid var(--gold-line);
color: var(--gold-hi);
padding: 18px 52px;
background: transparent;
}
.btn-ghost:hover {
border-color: var(--gold);
background: var(--gold-dim);
transform: translateY(-3px);
}

/* ═══════════════════════════════════════
REVEAL
═══════════════════════════════════════ */
.r {
opacity: 0;
transform: translateY(40px);
transition:
    opacity 0.9s cubic-bezier(0.22, 0.68, 0, 1.2),
    transform 0.9s cubic-bezier(0.22, 0.68, 0, 1.2);
}
.r.in {
opacity: 1;
transform: translateY(0);
}
.d1 {
transition-delay: 0.12s;
}
.d2 {
transition-delay: 0.24s;
}
.d3 {
transition-delay: 0.36s;
}

/* ═══════════════════════════════════════
NAV
═══════════════════════════════════════ */
#nav {
position: fixed;
inset: 0 0 auto;
z-index: 300;
padding: 22px var(--px);
display: flex;
align-items: center;
justify-content: space-between;
transition:
    padding 0.4s,
    background 0.4s,
    border 0.4s;
}
#nav.s {
padding: 13px var(--px);
background: rgba(8, 8, 8, 0.97);
border-bottom: 1px solid var(--gold-line);
backdrop-filter: blur(18px);
}
.nl {
display: flex;
align-items: center;
gap: 14px;
}
.nem {
width: 46px;
height: 46px;
display: flex;
align-items: center;
justify-content: center;
font-family: 'Cinzel', serif;
font-size: 13px;
color: var(--gold);
letter-spacing: 1px;
flex-shrink: 0;
}
.nw {
font-family: 'Cinzel', serif;
font-size: 10px;
letter-spacing: 3px;
text-transform: uppercase;
color: var(--cream);
line-height: 1.7;
}
.nlinks {
display: flex;
gap: 44px;
list-style: none;
}
.nlinks a {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 3px;
text-transform: uppercase;
color: rgba(245, 240, 232, 0.7);
transition: color 0.3s;
}
.nlinks a:hover {
color: var(--gold-hi);
}
.ncta {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 3px;
text-transform: uppercase;
color: #0a0800;
background: var(--gold);
padding: 13px 28px;
transition:
    background 0.3s,
    transform 0.3s;
}
.ncta:hover {
background: var(--gold-lt);
transform: translateY(-2px);
}

/* ═══════════════════════════════════════
HERO
═══════════════════════════════════════ */
.hero {
min-height: 100vh;
position: relative;
display: flex;
align-items: center;
overflow: hidden;
background: var(--forest);
}
.hbg {
position: absolute;
inset: 0;
background: radial-gradient(ellipse 65% 80% at 72% 50%, rgba(191, 155, 69, 0.07) 0%, transparent 70%), linear-gradient(125deg, #050e09 0%, #0d1f15 45%, #152a1e 100%);
}
.hgrid {
position: absolute;
inset: 0;
background-image: linear-gradient(rgba(191, 155, 69, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(191, 155, 69, 0.035) 1px, transparent 1px);
background-size: 88px 88px;
}
.hvig {
position: absolute;
inset: 0;
background: radial-gradient(ellipse 80% 80% at 50% 50%, transparent 30%, rgba(5, 10, 7, 0.65) 100%);
}
.hcon {
position: relative;
z-index: 2;
padding: 158px var(--px) 100px;
max-width: 700px;
}
.hbadge {
display: inline-flex;
align-items: center;
gap: 14px;
border: 1px solid var(--gold-line);
background: rgba(191, 155, 69, 0.05);
padding: 9px 22px;
margin-bottom: 44px;
animation: fadeUp 0.9s ease both;
}
.hbadge span {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 4px;
color: var(--gold-hi);
text-transform: uppercase;
}
.hpip {
width: 5px;
height: 5px;
background: var(--gold);
border-radius: 50%;
}
.hpre {
font-family: 'Cinzel', serif;
font-size: 11px;
letter-spacing: 6px;
color: var(--gold-hi);
text-transform: uppercase;
display: block;
margin-bottom: 16px;
animation: fadeUp 0.9s 0.1s ease both;
}
.hh1 {
font-family: 'Cinzel', serif;
font-size: clamp(58px, 9vw, 108px);
font-weight: 900;
line-height: 0.94;
color: #fff;
margin-bottom: 30px;
animation: fadeUp 0.9s 0.2s ease both;
letter-spacing: -0.02em;
}
.hh1 .ga {
color: var(--gold-hi);
display: block;
}
.hita {
font-family: 'Cormorant Garamond', serif;
font-size: clamp(20px, 2.8vw, 30px);
font-style: italic;
color: var(--gold-pale);
margin-bottom: 28px;
line-height: 1.5;
animation: fadeUp 0.9s 0.3s ease both;
}
.hbod {
font-size: 16px;
line-height: 1.95;
color: var(--c60);
margin-bottom: 52px;
animation: fadeUp 0.9s 0.42s ease both;
max-width: 500px;
}
.hact {
display: flex;
gap: 18px;
flex-wrap: wrap;
animation: fadeUp 0.9s 0.54s ease both;
}
.haside {
position: absolute;
right: var(--px);
bottom: 80px;
z-index: 2;
display: flex;
flex-direction: column;
gap: 36px;
animation: fadeUp 0.9s 0.68s ease both;
}
.hstat {
text-align: right;
border-right: 2px solid var(--gold);
padding-right: 18px;
}
.hsn {
font-family: 'Cinzel', serif;
font-size: 44px;
color: var(--gold-hi);
line-height: 1;
display: block;
}
.hsl {
font-size: 9px;
letter-spacing: 2px;
text-transform: uppercase;
color: var(--c30);
display: block;
margin-top: 4px;
}

/* Pillars */
.pbar {
background: linear-gradient(90deg, var(--gold) 0%, var(--gold-hi) 50%, var(--gold) 100%);
padding: 22px var(--px);
}
.pbar-in {
max-width: var(--max);
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}
.pi {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 4px;
color: #0a0800;
text-transform: uppercase;
padding: 0 32px;
position: relative;
}
.pi + .pi::before {
content: '—';
position: absolute;
left: -4px;
font-size: 9px;
color: rgba(0, 0, 0, 0.3);
top: 50%;
transform: translateY(-50%);
}

/* ═══════════════════════════════════════
ABOUT
═══════════════════════════════════════ */
.about {
padding: 140px 0;
background: var(--dark);
}
.about-g {
display: grid;
grid-template-columns: 5fr 6fr;
gap: 100px;
align-items: center;
max-width: var(--max);
margin: 0 auto;
padding: 0 var(--px);
}
.av {
position: relative;
}
.av-frame {
aspect-ratio: 3/4;
background: linear-gradient(145deg, var(--forest2), var(--forest));
position: relative;
overflow: hidden;
}
.av-frame::before {
content: '';
position: absolute;
inset: 18px;
border: 1px solid var(--gold-line);
z-index: 1;
pointer-events: none;
}
.av-mono {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
font-family: 'Cinzel', serif;
font-size: 120px;
font-weight: 900;
color: rgba(191, 155, 69, 0.07);
user-select: none;
letter-spacing: -4px;
width: 100%;
height: 100%;
object-fit: cover;
}
.av-call {
position: absolute;
bottom: -26px;
right: -26px;
background: var(--gold);
padding: 28px 32px;
max-width: 230px;
z-index: 2;
}
.av-call p {
font-family: 'Cormorant Garamond', serif;
font-size: 18px;
font-style: italic;
color: #0a0800;
line-height: 1.5;
}
.at .hl {
margin: 18px 0 26px;
}
.at .body-i {
margin-bottom: 16px;
}
.pgrid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2px;
margin-top: 44px;
}
.pg {
background: rgba(191, 155, 69, 0.05);
border: 1px solid var(--gold-line);
padding: 24px 26px;
transition: all 0.35s;
}
.pg:hover {
background: rgba(191, 155, 69, 0.1);
border-color: rgba(191, 155, 69, 0.4);
}
.pg-name {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 2px;
color: var(--gold-hi);
display: block;
margin-bottom: 8px;
text-transform: uppercase;
}
.pg-d {
font-size: 13px;
color: var(--c30);
line-height: 1.7;
}

/* ═══════════════════════════════════════
SCARCITY BANNER
═══════════════════════════════════════ */
.scar {
padding: 72px var(--px);
background: linear-gradient(135deg, var(--forest) 0%, var(--forest2) 100%);
border-top: 1px solid var(--gold-line);
border-bottom: 1px solid var(--gold-line);
}
.scar-in {
max-width: 860px;
margin: 0 auto;
text-align: center;
}
.scar-lbl {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 5px;
color: var(--gold-hi);
text-transform: uppercase;
margin-bottom: 18px;
}
.scar-h {
font-family: 'Cinzel', serif;
font-size: clamp(28px, 4.5vw, 52px);
color: #fff;
line-height: 1.15;
margin-bottom: 16px;
}
.scar-h .g {
color: var(--gold-hi);
}
.scar-sub {
font-family: 'Cormorant Garamond', serif;
font-size: 24px;
font-style: italic;
color: var(--gold-pale);
margin-bottom: 36px;
}
.spots {
display: inline-flex;
align-items: center;
gap: 18px;
background: rgba(191, 155, 69, 0.09);
border: 1px solid var(--gold-line);
padding: 16px 44px;
margin-bottom: 36px;
}
.spots-n {
font-family: 'Cinzel', serif;
font-size: 42px;
color: var(--gold-hi);
font-weight: 700;
line-height: 1;
}
.spots-t {
font-size: 11px;
letter-spacing: 2px;
text-transform: uppercase;
color: var(--c60);
line-height: 1.6;
}

/* ═══════════════════════════════════════
MEMBERSHIP TIERS
═══════════════════════════════════════ */
.mem {
padding: 140px 0;
background: var(--black);
}
.mem-head {
text-align: center;
max-width: 700px;
margin: 0 auto 90px;
padding: 0 var(--px);
}
.mem-head .hl {
margin: 16px 0 24px;
}
.tgrid {
max-width: var(--max);
margin: 0 auto;
padding: 0 var(--px);
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2px;
align-items: start;
}

/* Base card */
.tc {
background: var(--dark2);
border: 1px solid var(--gold-line);
display: flex;
flex-direction: column;
position: relative;
overflow: hidden;
transition:
    transform 0.42s cubic-bezier(0.22, 0.68, 0, 1),
    border-color 0.42s;
}
.tc:hover {
transform: translateY(-10px);
border-color: rgba(191, 155, 69, 0.44);
}
.tc::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: var(--gold-line);
transition: background 0.42s;
}
.tc:hover::before {
background: var(--gold);
}

/* Featured */
.tc.feat {
background: linear-gradient(160deg, #0f2a1c 0%, #081510 100%);
border-color: var(--gold);
transform: scale(1.03) translateY(-8px);
z-index: 2;
}
.tc.feat:hover {
transform: scale(1.03) translateY(-18px);
}
.tc.feat::before {
background: var(--gold);
}

/* Tier head */
.th {
padding: 44px 44px 36px;
border-bottom: 1px solid var(--gold-line);
}
.tbrow {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 22px;
min-height: 28px;
}
.tpill {
font-family: 'Cinzel', serif;
font-size: 8px;
letter-spacing: 3px;
text-transform: uppercase;
padding: 6px 14px;
}
.tp-g {
background: var(--gold);
color: #0a0800;
}
.tp-o {
border: 1px solid var(--gold-line);
color: var(--gold-hi);
}
.tp-d {
background: var(--black);
border: 1px solid var(--gold-line);
color: var(--gold-hi);
}
.tname {
font-family: 'Cinzel', serif;
font-size: clamp(19px, 2.2vw, 25px);
font-weight: 600;
color: #fff;
margin-bottom: 8px;
line-height: 1.2;
}
.ttag {
font-family: 'Cormorant Garamond', serif;
font-size: 17px;
font-style: italic;
color: var(--c30);
line-height: 1.55;
display: block;
}

/* Divider */
.tdiv {
height: 1px;
background: linear-gradient(90deg, transparent, var(--gold-line), transparent);
margin: 0 44px;
}

/* Features */
.tfl {
padding: 32px 44px;
flex: 1;
}
.tfl-lbl {
font-family: 'Cinzel', serif;
font-size: 8px;
letter-spacing: 3px;
text-transform: uppercase;
color: var(--gold-hi);
margin-bottom: 20px;
}
.tfl ul {
list-style: none;
}
.tfl li {
display: flex;
align-items: flex-start;
gap: 14px;
padding: 11px 0;
border-bottom: 1px solid rgba(191, 155, 69, 0.07);
font-size: 14px;
color: var(--c60);
line-height: 1.55;
}
.tfl li:last-child {
border-bottom: none;
}
.ck {
color: var(--gold-hi);
font-size: 9px;
flex-shrink: 0;
margin-top: 4px;
font-style: normal;
}

/* CTA */
.tcta-w {
padding: 12px 44px 44px;
}
.tcta {
display: block;
width: 100%;
font-family: 'Cinzel', serif;
font-size: 10px;
letter-spacing: 3px;
text-transform: uppercase;
padding: 20px;
text-align: center;
transition: all 0.35s;
cursor: pointer;
border: none;
}
.tcta-fill {
background: linear-gradient(135deg, var(--gold) 0%, var(--gold-hi) 100%);
color: #0a0800;
}
.tcta-fill:hover {
transform: translateY(-3px);
box-shadow: 0 22px 56px rgba(191, 155, 69, 0.4);
}
.tcta-out {
border: 1px solid var(--gold-line);
color: var(--gold-hi);
background: transparent;
}
.tcta-out:hover {
border-color: var(--gold);
background: var(--gold-dim);
transform: translateY(-3px);
}
.tnote {
margin-top: 12px;
font-size: 11px;
text-align: center;
color: var(--c30);
font-style: italic;
}

.mf {
text-align: center;
margin-top: 80px;
padding: 0 var(--px);
}
.mf p {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 4px;
color: var(--gold-hi);
text-transform: uppercase;
margin-bottom: 24px;
}

/* ═══════════════════════════════════════
EXPERIENCE
═══════════════════════════════════════ */
.exp {
padding: 140px 0;
background: linear-gradient(180deg, var(--dark) 0%, var(--forest) 100%);
}
.exp-g {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 100px;
align-items: center;
max-width: var(--max);
margin: 0 auto;
padding: 0 var(--px);
}
.et .hl {
margin: 18px 0 26px;
}
.et .body-i {
margin-bottom: 44px;
}
.es {
display: flex;
flex-direction: column;
gap: 3px;
}
.ec {
background: rgba(8, 8, 8, 0.6);
border: 1px solid var(--gold-line);
padding: 26px 30px;
display: flex;
gap: 20px;
align-items: flex-start;
transition: all 0.4s;
}
.ec:hover {
background: rgba(8, 8, 8, 0.9);
border-color: rgba(191, 155, 69, 0.35);
transform: translateX(6px);
}
.ei {
width: 44px;
height: 44px;
border: 1px solid var(--gold-line);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
transition: border-color 0.4s;
}
.ec:hover .ei {
border-color: var(--gold);
}
.ei svg {
width: 18px;
height: 18px;
stroke: var(--gold-hi);
fill: none;
stroke-width: 1.5;
stroke-linecap: round;
stroke-linejoin: round;
}
.ec h3 {
font-family: 'Cinzel', serif;
font-size: 13px;
color: #fff;
margin-bottom: 5px;
letter-spacing: 0.4px;
}
.ec p {
font-size: 13px;
color: var(--c30);
line-height: 1.8;
}

/* ═══════════════════════════════════════
TESTIMONIALS
═══════════════════════════════════════ */
.testi {
padding: 140px 0;
background: var(--black);
}
.testi-head {
text-align: center;
max-width: 680px;
margin: 0 auto 80px;
padding: 0 var(--px);
}
.testi-head .hl {
margin: 16px 0;
}
.tgrid-t {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2px;
max-width: var(--max);
margin: 0 auto;
padding: 0 var(--px);
}
.tcard {
background: var(--dark2);
border: 1px solid var(--gold-line);
padding: 48px 40px;
position: relative;
display: flex;
flex-direction: column;
transition: border-color 0.4s;
}
.tcard:hover {
border-color: rgba(191, 155, 69, 0.35);
}
.tq {
font-family: 'Cormorant Garamond', serif;
font-size: 140px;
color: var(--gold-hi);
opacity: 0.07;
position: absolute;
top: 0;
left: 22px;
line-height: 1;
pointer-events: none;
}
.tst {
color: var(--gold-hi);
letter-spacing: 3px;
font-size: 11px;
margin-bottom: 22px;
}
.ttext {
font-family: 'Cormorant Garamond', serif;
font-size: 20px;
font-style: italic;
line-height: 1.75;
color: var(--cream);
margin-bottom: 36px;
flex: 1;
position: relative;
z-index: 1;
}
.tan {
font-family: 'Cinzel', serif;
font-size: 12px;
letter-spacing: 1px;
color: var(--gold-hi);
display: block;
margin-bottom: 4px;
}
.tat {
font-size: 12px;
color: var(--c30);
}

/* ═══════════════════════════════════════
APPLICATION
═══════════════════════════════════════ */
.app {
padding: 140px 0;
background: linear-gradient(160deg, var(--forest2) 0%, var(--forest) 40%, var(--dark) 100%);
position: relative;
overflow: hidden;
}
.app-wm {
position: absolute;
font-family: 'Cinzel', serif;
font-size: 380px;
font-weight: 900;
color: rgba(191, 155, 69, 0.03);
right: -40px;
top: 50%;
transform: translateY(-50%);
line-height: 1;
pointer-events: none;
user-select: none;
}
.app-in {
max-width: 860px;
margin: 0 auto;
padding: 0 var(--px);
position: relative;
z-index: 1;
}
.app-head {
text-align: center;
margin-bottom: 60px;
}
.app-head .hl {
margin: 16px 0 22px;
}
.app-head .body-i {
font-size: clamp(17px, 2vw, 21px);
max-width: 640px;
margin: 0 auto;
}
.fshell {
background: rgba(8, 8, 8, 0.72);
border: 1px solid var(--gold-line);
padding: 64px;
backdrop-filter: blur(20px);
}
.fshell-top {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 24px;
flex-wrap: wrap;
padding-bottom: 40px;
margin-bottom: 44px;
border-bottom: 1px solid var(--gold-line);
}
.fstl h3 {
font-family: 'Cinzel', serif;
font-size: 20px;
color: var(--gold-hi);
letter-spacing: 1px;
margin-bottom: 6px;
}
.fstl p {
font-size: 13px;
color: var(--c30);
font-style: italic;
}
.fst-badge {
display: flex;
align-items: center;
gap: 10px;
background: rgba(191, 155, 69, 0.08);
border: 1px solid var(--gold-line);
padding: 12px 20px;
flex-shrink: 0;
font-family: 'Cinzel', serif;
font-size: 8px;
letter-spacing: 2px;
text-transform: uppercase;
color: var(--gold-hi);
}
.fg2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-bottom: 20px;
}
.fg1 {
margin-bottom: 20px;
}
.fg {
display: flex;
flex-direction: column;
gap: 8px;
}
.fg label {
font-family: 'Cinzel', serif;
font-size: 8px;
letter-spacing: 3px;
text-transform: uppercase;
color: var(--gold-hi);
}
.fg input,
.fg select,
.fg textarea {
background: rgba(191, 155, 69, 0.04);
border: 1px solid rgba(191, 155, 69, 0.18);
color: var(--cream);
padding: 16px 20px;
font-family: 'Jost', sans-serif;
font-size: 15px;
font-weight: 300;
outline: none;
width: 100%;
-webkit-appearance: none;
transition:
    border-color 0.3s,
    background 0.3s;
}
.fg input::placeholder,
.fg textarea::placeholder {
color: var(--c30);
}
.fg input:focus,
.fg select:focus,
.fg textarea:focus {
border-color: var(--gold);
background: rgba(191, 155, 69, 0.07);
}
.fg select option {
background: #111;
color: var(--cream);
}
.fg textarea {
resize: vertical;
min-height: 130px;
}
.fbtn {
width: 100%;
margin-top: 36px;
font-family: 'Cinzel', serif;
font-size: 11px;
letter-spacing: 4px;
text-transform: uppercase;
color: #0a0800;
background: linear-gradient(135deg, var(--gold) 0%, var(--gold-hi) 100%);
border: none;
padding: 24px;
cursor: pointer;
transition: all 0.35s;
}
.fbtn:hover {
transform: translateY(-3px);
box-shadow: 0 22px 56px rgba(191, 155, 69, 0.35);
}
.fnote {
text-align: center;
margin-top: 18px;
font-size: 12px;
color: var(--c30);
font-style: italic;
}

/* Error / success states */
.ferr {
display: none;
background: rgba(180, 50, 50, 0.15);
border: 1px solid rgba(180, 50, 50, 0.3);
color: #f5b8b8;
font-size: 13px;
padding: 14px 20px;
margin-top: 16px;
text-align: center;
letter-spacing: 0.5px;
}
.ferr.show {
display: block;
}

.app-alt {
display: flex;
justify-content: center;
gap: 64px;
margin-top: 56px;
flex-wrap: wrap;
}
.aa {
text-align: center;
}
.aa-l {
font-family: 'Cinzel', serif;
font-size: 8px;
letter-spacing: 3px;
color: var(--gold-hi);
text-transform: uppercase;
display: block;
margin-bottom: 8px;
}
.aa-v {
font-size: 15px;
color: var(--c60);
}
#sm {
display: none;
text-align: center;
padding: 60px 0;
}
#sm .si {
font-family: 'Cinzel', serif;
font-size: 44px;
color: var(--gold-hi);
margin-bottom: 18px;
}
#sm h3 {
font-family: 'Cinzel', serif;
font-size: 24px;
color: var(--gold-hi);
margin-bottom: 14px;
}
#sm p {
font-size: 16px;
color: var(--c60);
line-height: 1.85;
}

/* ═══════════════════════════════════════
FAQ
═══════════════════════════════════════ */
.faq {
padding: 0 0 140px;
background: var(--dark);
}
.fdiv {
display: flex;
align-items: center;
gap: 18px;
justify-content: center;
padding: 80px 0 60px;
}
.fdiv::before,
.fdiv::after {
content: '';
flex: 1;
max-width: 180px;
height: 1px;
background: var(--gold-line);
}
.fdiv span {
color: var(--gold);
font-size: 16px;
font-family: 'Cinzel', serif;
}
.fi {
max-width: 820px;
margin: 0 auto;
padding: 0 var(--px);
}
.fh {
text-align: center;
margin-bottom: 60px;
}
.fh .hl {
margin: 16px 0;
}
.fitem {
border-bottom: 1px solid var(--gold-line);
}
.fbq {
width: 100%;
background: none;
border: none;
color: var(--cream);
font-family: 'Cinzel', serif;
font-size: 14px;
letter-spacing: 0.4px;
text-align: left;
padding: 27px 0;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
transition: color 0.3s;
}
.fbq:hover {
color: var(--gold-hi);
}
.fplus {
font-size: 22px;
color: var(--gold-hi);
flex-shrink: 0;
transition: transform 0.4s;
font-weight: 300;
line-height: 1;
}
.fitem.open .fplus {
transform: rotate(45deg);
}
.fans {
max-height: 0;
overflow: hidden;
transition: max-height 0.5s ease;
}
.fitem.open .fans {
max-height: 500px;
}
.fans-in {
padding-bottom: 28px;
}
.fans-in p {
font-size: 16px;
line-height: 1.95;
color: var(--c30);
}

/* ═══════════════════════════════════════
FOOTER
═══════════════════════════════════════ */
footer {
background: #040404;
border-top: 1px solid var(--gold-line);
padding: 90px var(--px) 44px;
}
.fg-grid {
max-width: var(--max);
margin: 0 auto;
display: grid;
grid-template-columns: 2.2fr 1fr 1fr 1fr;
gap: 60px;
margin-bottom: 64px;
}
.fbc {
font-size: 14px;
line-height: 1.95;
color: var(--c30);
margin-top: 20px;
max-width: 300px;
}
.fch {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 3px;
text-transform: uppercase;
color: var(--gold-hi);
margin-bottom: 26px;
}
.fc ul {
list-style: none;
}
.fc li {
margin-bottom: 14px;
}
.fc a {
font-size: 14px;
color: var(--c30);
transition: color 0.3s;
}
.fc a:hover {
color: var(--gold-hi);
}
.fb {
max-width: var(--max);
margin: 0 auto;
border-top: 1px solid var(--gold-line);
padding-top: 36px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 14px;
}
.fcp {
font-size: 12px;
color: var(--c30);
letter-spacing: 1px;
}
.fm {
font-family: 'Cormorant Garamond', serif;
font-style: italic;
font-size: 19px;
color: rgba(191, 155, 69, 0.4);
}

/* ═══════════════════════════════════════
FLOATING CTA
═══════════════════════════════════════ */
.fcta {
position: fixed;
bottom: 34px;
right: 34px;
z-index: 200;
opacity: 0;
transform: translateY(16px) scale(0.96);
transition: all 0.45s cubic-bezier(0.22, 0.68, 0, 1);
pointer-events: none;
}
.fcta.show {
opacity: 1;
transform: translateY(0) scale(1);
pointer-events: all;
}
.fcta a {
font-family: 'Cinzel', serif;
font-size: 9px;
letter-spacing: 3px;
text-transform: uppercase;
color: #0a0800;
background: linear-gradient(135deg, var(--gold) 0%, var(--gold-hi) 100%);
padding: 15px 26px;
display: block;
box-shadow:
    0 12px 44px rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(191, 155, 69, 0.2);
transition:
    transform 0.3s,
    box-shadow 0.3s;
}
.fcta a:hover {
transform: translateY(-4px);
box-shadow: 0 18px 56px rgba(191, 155, 69, 0.32);
}

/* ═══════════════════════════════════════
KEYFRAMES
═══════════════════════════════════════ */
@keyframes fadeUp {
from {
    opacity: 0;
    transform: translateY(34px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

/* ═══════════════════════════════════════
RESPONSIVE
═══════════════════════════════════════ */
@media (max-width: 1100px) {
:root {
    --px: 40px;
}
.tgrid {
    grid-template-columns: 1fr;
    max-width: 520px;
}
.tc.feat {
    transform: none;
}
.tc.feat:hover {
    transform: translateY(-10px);
}
}
@media (max-width: 860px) {
:root {
    --px: 22px;
}
#nav {
    padding: 15px var(--px);
}
#nav.s {
    padding: 11px var(--px);
}
.nlinks {
    display: none;
}
.hcon {
    padding: 130px var(--px) 80px;
}
.haside {
    display: none;
}
.hbadge {
    display: none;
}
.about-g {
    grid-template-columns: 1fr;
    gap: 56px;
}
.av-call {
    display: none;
}
.exp-g {
    grid-template-columns: 1fr;
    gap: 56px;
}
.tgrid-t {
    grid-template-columns: 1fr;
}
.fg2 {
    grid-template-columns: 1fr;
}
.fshell {
    padding: 34px 22px;
}
.fshell-top {
    flex-direction: column;
}
.pbar-in {
    gap: 4px 0;
}
.pi {
    padding: 5px 18px;
}
.fg-grid {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
}
.fb {
    flex-direction: column;
    text-align: center;
}
.fcta {
    bottom: 18px;
    right: 18px;
}
.app-alt {
    gap: 32px;
}
}