.demo-banner{position:sticky;top:0;z-index:60;background:#111;color:#f5f5f5;text-align:center;font:600 12px/1.4 system-ui,sans-serif;padding:.55rem .75rem;letter-spacing:.02em}

:root{--background:#0a120e;--foreground:#f2efe6;--mist:#c9c4b4;--cream:#f2efe6;--ink:#08110d;--leaf:#3f8f5b;--leaf-deep:#1f4d34;--violet:#7a4b9a;--amber:#d4a24c;--line:#f2efe624;--panel:#0a120eb8;--font-display:"Fraunces",Georgia,serif;--font-body:"Outfit",system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100%;color:var(--foreground);font-family:var(--font-body);background:radial-gradient(900px 480px at 12% -8%,#7a4b9a38,transparent 55%),radial-gradient(800px 420px at 88% 4%,#3f8f5b2e,transparent 50%),linear-gradient(#101a14 0%,#0a120e 42%,#070d0a 100%);display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.header{position:sticky;top:34px;z-index:40;border-bottom:1px solid rgba(255,255,255,.1);background:var(--panel);backdrop-filter:blur(12px)}
.header .bar{max-width:72rem;margin:0 auto;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo{font-family:var(--font-display);font-size:1.75rem;line-height:1;color:var(--cream)}
.logo small{display:block;margin-top:.15rem;font-family:var(--font-body);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(201,196,180,.7)}
.nav{display:none;gap:1.25rem;font-size:.9rem;color:rgba(201,196,180,.9)}.nav a:hover{color:var(--cream)}
.actions{display:flex;gap:.5rem;align-items:center}
.btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:.5rem;padding:.55rem .85rem;font-size:.875rem;font-weight:600;border:1px solid transparent;transition:.15s}
.btn-leaf{background:var(--leaf);color:var(--cream)}.btn-leaf:hover{background:var(--leaf-deep)}
.btn-amber{background:var(--amber);color:var(--ink)}.btn-amber:hover{filter:brightness(1.1)}
.btn-ghost{border-color:rgba(255,255,255,.15);color:var(--cream)}.btn-ghost:hover{background:rgba(255,255,255,.05)}
.btn-outline{border-color:rgba(255,255,255,.25);color:var(--cream)}.btn-outline:hover{background:rgba(255,255,255,.05)}
.mobile{display:flex;gap:1rem;overflow:auto;border-top:1px solid rgba(255,255,255,.05);padding:.5rem 1rem;font-size:.75rem;color:rgba(201,196,180,.8)}
@media(min-width:768px){.nav{display:flex}.mobile{display:none}.header .bar{padding:.75rem 1.5rem}}
.hero{position:relative;min-height:88vh;overflow:hidden;display:flex;align-items:flex-end}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,.55) 55%,rgba(122,75,154,.25))}
.hero .content{position:relative;max-width:72rem;margin:0 auto;padding:6rem 1rem 4rem}
@media(min-width:768px){.hero .content{padding:6rem 1.5rem 6rem}}
.hero .mark{font-family:var(--font-display);font-size:clamp(3.5rem,10vw,6rem);line-height:1;color:var(--cream)}
.hero h1{margin:1rem 0 0;max-width:22rem;font-size:clamp(1.4rem,3vw,1.875rem);line-height:1.35;font-weight:500;color:var(--cream)}
.hero p{margin:1rem 0 0;max-width:28rem;color:rgba(201,196,180,.85);line-height:1.65}
.cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.section{max-width:72rem;margin:0 auto;padding:4rem 1rem}
@media(min-width:768px){.section{padding:4rem 1.5rem}}
.grid-3{display:grid;gap:1.5rem}@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,1fr)}}
.card{overflow:hidden;border-radius:1rem;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.2)}
.card .media{height:11rem;position:relative}.card .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card .body{padding:1.25rem}.card h2{margin:0;font-family:var(--font-display);font-size:1.25rem;color:var(--cream);font-weight:500}
.card p{margin:.5rem 0 0;font-size:.875rem;line-height:1.6;color:rgba(201,196,180,.75)}
.services{position:relative;overflow:hidden;border-block:1px solid rgba(255,255,255,.1)}
.services img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.services .inner{position:relative;max-width:72rem;margin:0 auto;padding:4rem 1rem}
.services h2{margin:0;font-family:var(--font-display);font-size:clamp(1.75rem,4vw,2.25rem);color:var(--cream)}
.services p{margin:.75rem 0 0;max-width:36rem;color:rgba(201,196,180,.8)}
.footer{margin-top:auto;border-top:1px solid rgba(255,255,255,.1)}
.footer .inner{max-width:72rem;margin:0 auto;padding:2.5rem 1rem;display:flex;flex-direction:column;gap:1rem;font-size:.875rem;color:rgba(201,196,180,.75)}
@media(min-width:768px){.footer .inner{flex-direction:row;align-items:flex-end;justify-content:space-between;padding:2.5rem 1.5rem}}
.footer .mark{font-family:var(--font-display);font-size:1.25rem;color:var(--cream)}
.footer nav{display:flex;flex-wrap:wrap;gap:1rem}
.page-hero{padding:4rem 1rem 1rem;max-width:72rem;margin:0 auto}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);margin:.5rem 0 0;color:var(--cream)}
.form{max-width:24rem;display:grid;gap:.85rem;margin:2rem 0 4rem}
.form label{display:grid;gap:.35rem;font-size:.8rem;color:var(--mist)}
.form input{padding:.7rem .85rem;border-radius:.5rem;border:1px solid rgba(255,255,255,.15);background:rgba(0,0,0,.25);color:var(--cream)}
.inert{font-size:.75rem;color:rgba(201,196,180,.65)}