:root{
  --bg:#0a0a0a; --ink:#0f0e0e; --card:#131111;
  --fg:#eae6df; --muted:#9c968c;
  --blood:#8b0000; --blood-bright:#c41e1e;
  --gold:#d4af37; --gold-deep:#c9a227; --gold-dim:rgba(212,175,55,.45);
  --border:rgba(212,175,55,.22);
  --font-gothic:"UnifrakturMaguntia",serif;
  --font-display:"Cinzel",serif;
  --font-sans:"Jost",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
main{position:relative}
main::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;z-index:50;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E")}
section,footer{padding:6rem 1.5rem;position:relative;overflow:hidden}
.wrap{max-width:64rem;margin:0 auto}
.narrow{max-width:42rem;margin:0 auto}
.gold-rule{height:1px;border:0;background:linear-gradient(90deg,transparent,var(--gold-deep) 25%,var(--gold) 50%,var(--gold-deep) 75%,transparent)}
.rule-bottom{position:absolute;left:0;right:0;bottom:0}
.rule-end{margin-top:6rem}
.gold-text{background:linear-gradient(180deg,var(--gold) 0%,var(--gold-deep) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.kicker{font-size:.65rem;letter-spacing:.5em;text-transform:uppercase;color:var(--gold-deep)}
.sec-title{text-align:center}
.sec-title h2{font-family:var(--font-gothic);font-size:clamp(2.2rem,7vw,3rem);font-weight:400;margin-top:.75rem;line-height:1.1}
.ornament{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.25rem}
.ornament .line{height:1px;width:6rem;background:linear-gradient(90deg,transparent,var(--gold-deep),transparent)}
.ornament .diamond{width:8px;height:8px;border:1px solid var(--gold-dim);transform:rotate(45deg)}
/* hero */
#hero{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.glow{position:absolute;top:33%;left:50%;width:36rem;height:36rem;transform:translate(-50%,-50%);border-radius:9999px;background:rgba(139,0,0,.35);filter:blur(120px);pointer-events:none}
.logo{position:relative;width:11rem;height:11rem;border-radius:9999px;border:1px solid var(--gold-dim);object-fit:cover;box-shadow:0 0 60px -10px var(--blood-bright)}
@media(min-width:768px){.logo{width:14rem;height:14rem}}
#hero h1{position:relative;font-family:var(--font-gothic);font-weight:400;font-size:clamp(3rem,11vw,4.75rem);line-height:1;margin-top:2.5rem}
.tagline{position:relative;margin-top:1.5rem;font-size:.8rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.btn{display:inline-block;border:1px solid var(--gold);padding:1rem 2.25rem;font-size:.7rem;letter-spacing:.35em;text-transform:uppercase;color:var(--gold);background:transparent;cursor:pointer;transition:background .5s,color .5s;font-family:inherit}
.btn:hover{background:var(--gold);color:#0a0a0a}
.cta{position:relative;margin-top:2.5rem}
/* watermark */
.watermark{position:absolute;top:50%;left:50%;width:26rem;transform:translate(-50%,-50%);opacity:.05;pointer-events:none}
.bio{margin-top:2.5rem;text-align:center;color:var(--muted)}
.bio .gold-word{color:var(--gold)}
.stats{margin-top:2.5rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;text-align:center}
.stats div{border:1px solid var(--border);padding:1.5rem .5rem}
.stats strong{font-family:var(--font-display);font-weight:400;font-size:1.05rem;color:var(--gold)}
.stats span{display:block;margin-top:.35rem;font-size:.6rem;letter-spacing:.25em;text-transform:uppercase;color:var(--muted)}
/* grids */
.grid{display:grid;gap:1.5rem;margin-top:3.5rem}
@media(min-width:640px){.grid.cols2{grid-template-columns:repeat(2,1fr)}.grid.cols3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid.cols3{grid-template-columns:repeat(3,1fr)}}
.card{border:1px solid var(--border);background:rgba(19,17,17,.6);padding:2rem;height:100%;transition:border-color .5s}
.card:hover{border-color:var(--gold-dim)}
.card svg{width:2.25rem;height:2.25rem;color:var(--gold)}
.card h3{margin-top:1.5rem;font-family:var(--font-display);font-weight:400;font-size:1.2rem;letter-spacing:.05em}
.card p{margin-top:.75rem;font-size:.9rem;color:var(--muted)}
figure{position:relative;overflow:hidden;border:1px solid var(--border);transition:border-color .5s}
figure:hover{border-color:var(--gold)}
figure img{aspect-ratio:3/4;width:100%;object-fit:cover;transition:transform .7s}
figure:hover img{transform:scale(1.1)}
.soon{display:flex;aspect-ratio:3/4;align-items:center;justify-content:center;border:1px dashed var(--border);font-size:.65rem;letter-spacing:.35em;text-transform:uppercase;color:var(--muted)}
/* before after */
.ba{position:relative;aspect-ratio:886/1020;width:100%;max-width:28rem;margin:3.5rem auto 0;cursor:ew-resize;user-select:none;overflow:hidden;border:1px solid var(--gold-dim);touch-action:none}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba .clip{position:absolute;inset:0;clip-path:inset(0 50% 0 0)}
.ba .handle{position:absolute;top:0;bottom:0;width:1px;background:var(--gold);left:50%}
.ba .knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2.5rem;height:2.5rem;border-radius:9999px;border:1px solid var(--gold);background:rgba(10,10,10,.8);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:.9rem}
.tag{position:absolute;top:.75rem;border:1px solid var(--gold-dim);background:rgba(10,10,10,.7);padding:.25rem .75rem;font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold)}
.tag.l{left:.75rem}.tag.r{right:.75rem}
.hint{margin-top:1rem;text-align:center;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
/* testimonials */
.quote{max-width:36rem;margin:3rem auto 0;text-align:center}
.quote p{font-size:1.1rem;font-style:italic;color:var(--muted);min-height:5rem}
.quote .who{margin-top:1rem;font-size:.65rem;letter-spacing:.35em;text-transform:uppercase;color:var(--gold)}
.dots{margin-top:2rem;display:flex;justify-content:center;gap:.75rem}
.dots button{width:9px;height:9px;transform:rotate(45deg);border:1px solid var(--gold);background:transparent;cursor:pointer;padding:0}
.dots button[aria-current="true"]{background:var(--gold)}
/* contact */
.contact{display:grid;gap:3rem;margin-top:3.5rem;max-width:56rem;margin-left:auto;margin-right:auto}
@media(min-width:768px){.contact{grid-template-columns:repeat(2,1fr)}}
.info>div+div{margin-top:1.5rem}
.info .label{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.info a:hover{color:var(--gold)}
.info .val{color:var(--muted)}
form{display:flex;flex-direction:column;gap:1rem}
input,textarea{width:100%;border:1px solid var(--border);background:rgba(19,17,17,.5);padding:.85rem 1rem;font-size:.9rem;color:var(--fg);font-family:inherit;outline:none}
input:focus,textarea:focus{border-color:var(--gold)}
::placeholder{color:var(--muted)}
.copy{margin-top:2rem;text-align:center;font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}