:root{

  --text:#eee; --muted:#c8c8c8; --accent:#e0c2b2; --bg:#0b0b0d;

}

*{box-sizing:border-box}

html,body{margin:0;height:100%;font-family:Raleway,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}

a{color:inherit;text-decoration:none}

.container{max-width:1100px;margin:0 auto;padding:24px}

/* Header / Menu */

.header{position:fixed;top:0;left:0;right:0;z-index:10;background:linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,0))}

.header .bar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px}

.brand{font-weight:700;letter-spacing:.06em}

.menu-toggle{display:none}

.hamburger{width:28px;height:22px;position:relative;cursor:pointer}

.hamburger span, .hamburger::before, .hamburger::after{

  content:"";position:absolute;left:0;right:0;height:2px;background:var(--text);transition:.25s

}

.hamburger span{top:10px}

.hamburger::before{top:0}

.hamburger::after{bottom:0}

.nav{position:fixed;top:56px;right:16px;background:rgba(0,0,0,.7);backdrop-filter:blur(6px);

     border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px;display:none}

.nav a{display:block;padding:10px 14px;border-radius:8px;color:var(--text)}

.nav a:hover{background:rgba(255,255,255,.06)}

/* checkbox hack to open */

.menu-toggle:checked ~ .nav{display:block}

/* Hero */

.hero{position:relative;height:100vh;overflow:hidden}

.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72) contrast(1.05) saturate(1.05)}

.hero .overlay{position:absolute;inset:0;background:radial-gradient(ellipse at center, rgba(0,0,0,.1) 0%, rgba(0,0,0,.55) 70%)}

.hero .content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;padding:0 20px;max-width:720px}

h1{font-family:"Playfair Display", serif;font-size:clamp(28px,6vw,56px);letter-spacing:.02em;margin:0 0 8px}

.lead{color:var(--muted);font-size:clamp(14px,2.8vw,18px);margin:0 0 18px}

.cta{display:inline-block;padding:10px 18px;border:1px solid var(--accent);border-radius:999px;

     font-size:.95rem;letter-spacing:.03em;background:transparent;color:var(--text);transition:all .25s}

.cta:hover{color:#d8a48f;text-shadow:0 0 12px rgba(216,164,143,.6)}

/* Inner pages */

.page-hero{padding-top:70px;background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));}

.page-title{font-family:"Playfair Display", serif;font-size:38px;margin:10px 0 6px}

.page-sub{color:var(--muted);margin:0 0 24px}

/* Shop cards */

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}

.card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden}

.card img{width:100%;height:240px;object-fit:cover;display:block}

.card .p{padding:12px 14px}

.price{color:#bfe6ff;font-weight:600}

/* Contact / buttons */

.button{display:inline-block;padding:10px 16px;border:1px solid rgba(255,255,255,.18);

        border-radius:10px;margin-right:10px;margin-bottom:10px}

.button:hover{background:rgba(255,255,255,.06)}

.note{font-size:.9rem;color:var(--muted)}

.footer{padding:24px 20px;color:var(--muted);text-align:center;border-top:1px solid rgba(255,255,255,.08);margin-top:40px}
/* About page background */

body.about-page {

  background: url("/images/hero.png") center center / cover no-repeat;

  background-attachment: scroll !important;

  height: auto !important;

  min-height: 100%;

  color: #fff;

}

/* Optional readability panel behind text */

.about-page .container {

  background: rgba(0, 0, 0, 0.45);

  border-radius: 16px;

  padding: 24px;

}
.about-hero {

  background: url("/images/brand-right.png") right center / cover no-repeat #000;

  color: #fff;

  min-height: 100vh;

  display: flex;

  align-items: center;

  padding: 60px 5%;

}

.glass {

  backdrop-filter: blur(12px);

  background: rgba(0, 0, 0, 0.45);

  border-radius: 20px;

  padding: 30px;

  max-width: 700px;

}