:root{
  --black:#060606;
  --ink:#111;
  --white:#f6f1e9;
  --muted:#b9b1a7;
  --red:#c90000;
  --gold:#b9954b;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--black);
  color:#fff;
  font-family:Arial, Helvetica, sans-serif;
}
a{color:inherit;text-decoration:none}
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:18px 5vw;
  background:linear-gradient(to bottom, rgba(0,0,0,.88), rgba(0,0,0,.35), transparent);
  backdrop-filter: blur(8px);
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:13px;
  font-weight:700;
}
.brand img{width:54px;height:54px;object-fit:contain}
nav{
  display:flex;
  gap:34px;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:2px;
}
nav a{opacity:.78}
nav a:hover{opacity:1}
.ig{
  border:1px solid rgba(255,255,255,.22);
  padding:11px 14px;
  border-radius:999px;
  font-size:12px;
  letter-spacing:1px;
}
.hero{
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:36px;
  padding:120px 5vw 60px;
  overflow:hidden;
  background:
    radial-gradient(circle at 75% 35%, rgba(201,0,0,.25), transparent 34%),
    radial-gradient(circle at 20% 80%, rgba(185,149,75,.12), transparent 32%),
    #050505;
}
.eyebrow{
  color:#fff;
  text-transform:uppercase;
  letter-spacing:10px;
  font-size:13px;
  margin:0 0 24px;
}
.eyebrow:after{
  content:"";
  display:inline-block;
  width:58px;
  height:1px;
  background:rgba(255,255,255,.42);
  margin-left:16px;
  vertical-align:middle;
}
.eyebrow.dark{color:#333}
.eyebrow.dark:after{background:#999}
h1{
  margin:0;
  text-transform:uppercase;
  line-height:.9;
  font-size:clamp(58px, 11vw, 140px);
  letter-spacing:-5px;
}
h1 span{
  display:block;
  color:#f4f4f4;
  font-size:clamp(40px, 7vw, 86px);
  letter-spacing:-2px;
}
h1{color:var(--red)}
.lead{
  max-width:560px;
  color:#e5ded4;
  font-size:20px;
  line-height:1.7;
  margin:28px 0;
}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:170px;
  padding:16px 22px;
  border:1px solid rgba(255,255,255,.28);
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:12px;
  font-weight:700;
}
.btn.primary{
  background:var(--red);
  border-color:var(--red);
}
.btn.secondary{background:transparent}
.pill-row{
  display:flex;
  gap:14px;
  margin-top:42px;
  flex-wrap:wrap;
}
.pill-row div{
  border-left:1px solid rgba(255,255,255,.24);
  padding:8px 24px 8px 16px;
}
.pill-row strong{
  display:block;
  text-transform:uppercase;
  letter-spacing:2px;
}
.pill-row span{color:var(--muted);font-size:13px}
.hero-art{
  position:relative;
  min-height:620px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-art img{
  position:relative;
  z-index:2;
  max-height:74vh;
  max-width:80%;
  filter:drop-shadow(0 38px 50px rgba(0,0,0,.65));
}
.glow{
  position:absolute;
  width:420px;height:420px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(201,0,0,.38), transparent 67%);
  filter:blur(15px);
}
.feature-strip{
  background:var(--white);
  color:var(--ink);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid #ddd;
  border-bottom:1px solid #ddd;
}
.feature-strip div{
  padding:30px 26px;
  text-align:center;
  text-transform:uppercase;
  letter-spacing:3px;
  font-size:13px;
  border-right:1px solid #cfc7bd;
}
.product-section{
  background:var(--white);
  color:var(--ink);
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:60px;
  padding:90px 8vw;
  align-items:center;
}
.product-image{
  display:flex;justify-content:center;
}
.product-image img{
  max-height:560px;
  max-width:85%;
  filter:drop-shadow(0 25px 35px rgba(0,0,0,.18));
}
.product-copy h2,.story-section h2,.journal-section h2,.contact-section h2{
  font-size:clamp(36px,5vw,68px);
  text-transform:uppercase;
  line-height:1;
  margin:0 0 24px;
}
.product-copy h2 span{color:var(--red)}
.product-copy p,.story-section p,.journal-section p,.contact-section p{
  font-size:18px;
  line-height:1.7;
  color:#333;
  max-width:680px;
}
.product-copy ul{
  list-style:none;
  padding:0;
  margin:28px 0;
}
.product-copy li{
  padding:10px 0;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:13px;
}
.product-copy li:before{
  content:"✓";
  margin-right:12px;
  color:var(--red);
  font-weight:bold;
}
.dark-btn{background:#050505;color:#fff;border-color:#050505}
.story-section{
  padding:110px 8vw;
  background:
    linear-gradient(rgba(0,0,0,.82),rgba(0,0,0,.82)),
    radial-gradient(circle at 20% 20%, rgba(201,0,0,.25), transparent 30%);
}
.story-section p{color:#ded8cf}
.journal-section{
  background:#f8f5ee;
  color:#111;
  padding:80px 8vw;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:44px;
  align-items:center;
}
.contact-section{
  text-align:center;
  padding:100px 8vw;
  background:#070707;
}
.contact-section p{margin-left:auto;margin-right:auto;color:#ddd}
.contact-links{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:30px;
}
.contact-links a{
  border:1px solid rgba(255,255,255,.22);
  padding:15px 20px;
  border-radius:999px;
}
footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:26px 5vw;
  color:#aaa;
  font-size:12px;
  border-top:1px solid rgba(255,255,255,.1);
}
@media(max-width:900px){
  .site-header{
    position:absolute;
    align-items:flex-start;
  }
  nav{display:none}
  .brand img{width:46px;height:46px}
  .hero{
    grid-template-columns:1fr;
    padding-top:115px;
  }
  .hero-art{min-height:auto}
  .hero-art img{max-height:560px;max-width:88%}
  .feature-strip{grid-template-columns:1fr 1fr}
  .product-section,.journal-section{grid-template-columns:1fr;padding:70px 6vw}
  footer{flex-direction:column}
}
@media(max-width:520px){
  .ig{display:none}
  .eyebrow{letter-spacing:5px;font-size:11px}
  h1{letter-spacing:-2px}
  .lead{font-size:17px}
  .btn{width:100%}
  .feature-strip{grid-template-columns:1fr}
}