:root{--gold:#c8a652;--goldDeep:#a98b3f;--bg:#000;--text:#f5f5f5;--header-h:72px;--header-gold:#c8a652}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--header-h)}
html,body{height:100%}
section[id],[data-anchor]{scroll-margin-top:var(--header-h)}
body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial}

.journal-preview__inner{margin:0 auto;max-width:1180px;padding:0 20px}
#journal-preview{background:#0a0a0a;color:#f3f3f3;padding:60px 0}
.journal-preview__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:32px;flex-wrap:wrap}
#journal-preview h2{font-family:'Cinzel',"DM Serif Display",serif;font-size:28px;letter-spacing:.04em;margin:0}
.journal-preview__view-all{color:#d7c07a;text-decoration:none;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;transition:text-decoration-color .2s ease,color .2s ease;display:inline-flex;align-items:center;min-height:44px;padding:0 10px;border-radius:6px}
.journal-preview__view-all:hover{color:#e3ce8f;text-decoration:underline}
.journal-preview__grid{display:grid;grid-template-columns:1fr;gap:20px}
.journal-card{background:#111;border:1px solid #1f1f1f;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.6,.2,1),transform .8s cubic-bezier(.2,.6,.2,1);will-change:opacity,transform}
.journal-card.is-visible{opacity:1;transform:translateY(0)}
.journal-card__media{display:block;overflow:hidden}
.journal-card__media img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform .15s ease,filter .15s ease;display:block}
@media (hover:hover){.journal-card__media img{transform-origin:center}}
@media (hover:hover){.journal-card:hover .journal-card__media img{transform:scale(1.01);filter:brightness(1.1)}}
.journal-card__body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:10px}
.journal-card__tag{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:#d7c07a}
.journal-card__title{font-size:19px;line-height:1.3;margin:0}
.journal-card__teaser{font-size:14.5px;line-height:1.5;margin:0;color:#d3d3d3}
.journal-card__link{margin-top:6px;color:#d7c07a;text-decoration:none;font-weight:600;letter-spacing:.04em;display:inline-flex;align-items:center;gap:6px;min-height:44px}
.journal-card__link:hover{text-decoration:underline}

.site-header{
 position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
 padding:12px 24px;background:rgba(0,0,0,.7);backdrop-filter:saturate(110%) blur(6px);
 border-bottom:1px solid rgba(200,166,82,.12);height:72px
}
.site-header .brand img{height:140px;display:block;filter:drop-shadow(0 0 4px rgba(0,0,0,.5));margin-top:-71px}
.nav,.site-nav{display:flex;gap:24px;flex:1;justify-content:center}
.nav a,.site-nav a{color:#ddd;text-decoration:none;font-weight:500;letter-spacing:.02em;position:relative;padding:6px 0;transition:color .25s ease}
.nav a::after,.site-nav a::after{
content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
background:linear-gradient(90deg,transparent,var(--gold),transparent);
transform:scaleX(0);transform-origin:center;transition:transform .25s
}
.nav a:hover::after,.site-nav a:hover::after{transform:scaleX(1)}
.nav a[aria-current="page"],.site-nav a[aria-current="page"]{color:#f3f3f3}
.nav a[aria-current="page"]::after,.site-nav a[aria-current="page"]::after{transform:scaleX(1)}
.site-header .header-cta .btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 18px;border-radius:999px;font-family:'Poppins',sans-serif;font-weight:700;letter-spacing:.03em;font-size:.95rem;line-height:1;text-decoration:none;color:inherit;border:1px solid transparent;transition:transform .08s ease,box-shadow .2s ease,background .25s ease}
.site-header .header-cta .btn:focus-visible{outline:2px solid rgba(255,255,255,.55);outline-offset:2px}
.site-header .header-cta .btn.btn-gold{background:var(--header-gold,var(--gold));color:#111;box-shadow:0 4px 16px rgba(200,166,82,.25),inset 0 0 0 1px rgba(0,0,0,.25)}
.site-header .header-cta .btn.btn-gold:hover{background:linear-gradient(180deg,var(--header-gold,var(--gold)),var(--goldDeep));transform:translateY(-1px);box-shadow:0 6px 18px rgba(200,166,82,.32),inset 0 0 0 1px rgba(0,0,0,.25)}
.site-header .cart-link{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border-radius:999px;background:var(--header-gold,var(--gold));color:#111;font-weight:700;letter-spacing:.03em;box-shadow:0 4px 16px rgba(200,166,82,.25),inset 0 0 0 1px rgba(0,0,0,.25);text-decoration:none;transition:transform .08s ease,box-shadow .2s ease}
.site-header .cart-link:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(200,166,82,.32),inset 0 0 0 1px rgba(0,0,0,.25)}
.site-header .cart-link::after{display:none}
.site-header .cart-link span{font-variant-numeric:tabular-nums}
.header-cta{display:flex;gap:10px;flex-shrink:0}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 18px;border-radius:999px;
text-decoration:none;font-weight:700;letter-spacing:.03em;transition:transform .08s ease,box-shadow .2s ease,background .25s;border:1px solid transparent}
.btn-lg{padding:14px 22px;font-size:1.05rem}
.btn-gold{color:#111;background:var(--gold);box-shadow:0 6px 18px rgba(200,166,82,.25),inset 0 0 0 1px rgba(0,0,0,.25)}
.btn-gold:hover{background:linear-gradient(180deg,var(--gold),var(--goldDeep));transform:translateY(-1px)}
.btn-outline{color:var(--gold);border-color:var(--gold);background:transparent}
.btn-outline:hover{background:rgba(200,166,82,.12)}

.hero{position:relative;min-height:92vh;overflow:hidden;display:grid;place-items:center;padding:96px 20px 56px}

.hero-bg.texture{position:absolute;inset:-4px;background:
radial-gradient(ellipse at 50% 40%,rgba(201,166,82,.08),rgba(0,0,0,0) 55%), url('/images/bg-texture.jpg');
background-size:cover;background-position:center;opacity:.28;filter:contrast(110%) brightness(80%);z-index:-5}
.hero-bg.vignette{position:absolute;inset:-4px;z-index:-4;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.75) 85%)}
.hero-bg.gold-glow{position:absolute;inset:-4px;z-index:-3;background:radial-gradient(ellipse at 50% 45%,rgba(200,166,82,.09),transparent 60%);mix-blend-mode:screen;pointer-events:none}

.hero-video{position:absolute;inset:0;opacity:.18;mix-blend-mode:screen;pointer-events:none;background:radial-gradient(circle at 20% 30%,rgba(200,166,82,.12),transparent 55%),radial-gradient(circle at 70% 60%,rgba(255,255,255,.16),transparent 60%),linear-gradient(130deg,rgba(10,10,10,.95),rgba(0,0,0,.85));overflow:hidden}
.hero-video::before,.hero-video::after{content:"";position:absolute;inset:-40%;background:radial-gradient(ellipse at 30% 40%,rgba(255,255,255,.18),transparent 60%),radial-gradient(ellipse at 70% 60%,rgba(200,166,82,.16),transparent 65%);opacity:.7;filter:blur(12px);animation:heroBackdrops 26s linear infinite}
.hero-video::after{animation:heroBackdropsAlt 30s linear infinite;mix-blend-mode:screen;opacity:.5}

.fog{position:absolute;width:60vw;height:60vh;z-index:-2;pointer-events:none;filter:blur(30px);opacity:.4;animation:drift 28s linear infinite}
.fog-left{left:-10vw;bottom:10vh;animation-delay:-7s}
.fog-right{right:-12vw;top:12vh;animation-delay:-14s}

.embers{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;animation:rise 8s linear infinite}

.hero-content{text-align:center;max-width:920px;padding:0 16px;display:grid;gap:14px;position:relative;z-index:5}
.hero-logo{width:360px;max-width:56vw;margin:0 auto 6px;display:block;filter:drop-shadow(0 8px 40px rgba(200,166,82,.12));
-webkit-mask-image:linear-gradient(-75deg,#000 30%,rgba(0,0,0,0.4) 45%,#000 60%);-webkit-mask-size:200%;animation:shimmer 3.4s linear infinite}

.hero-sub{margin:0;opacity:.9;font-style:italic;font-size:clamp(14px,1.4vw,18px)}
.hero-clarifier{margin:6px auto 10px;max-width:720px;color:#d6d6d6;font-size:clamp(13px,1.2vw,16px)}
.hero-ctas{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

.hero-model{position:absolute;bottom:0;height:min(88vh,900px);object-fit:contain;z-index:-6;filter:drop-shadow(0 20px 50px rgba(0,0,0,.7))}
.hero-model.left{left:0;transform:translateX(-6%)}
.hero-model.right{right:0;transform:translateX(6%)}

@keyframes shimmer{0%{-webkit-mask-position:150% 0}100%{-webkit-mask-position:-50% 0}}
@keyframes drift{0%{transform:translateY(0)}50%{transform:translateY(-30px)}100%{transform:translateY(0)}}
@keyframes rise{0%{transform:translateY(10%);opacity:0}15%{opacity:.7}100%{transform:translateY(-90%);opacity:0}}
@keyframes heroBackdrops{0%{transform:translate3d(-8%,6%,0) scale(1)}50%{transform:translate3d(8%,-6%,0) scale(1.06)}100%{transform:translate3d(-8%,6%,0) scale(1)}}
@keyframes heroBackdropsAlt{0%{transform:translate3d(6%,-5%,0) scale(1.02)}50%{transform:translate3d(-6%,5%,0) scale(.96)}100%{transform:translate3d(6%,-5%,0) scale(1.02)}}

@media (max-width:1024px){
.nav,.site-nav{gap:16px;justify-content:flex-end}
.nav a,.site-nav a{font-size:.92rem}
.site-header .header-cta .btn{padding:8px 14px;font-size:.9rem}
.hero-model{opacity:.95}
.hero-model.left{transform:translateX(-14%) scale(.94)}
.hero-model.right{transform:translateX(14%) scale(.94)}
.hero-logo{width:300px}
}
@media (max-width:720px){
.site-header .header-cta .btn{padding:8px 12px}
.hero{padding-top:120px}
.hero-model{opacity:.25;height:70vh}
.hero-model.left{transform:translateX(-28%)}
.hero-model.right{transform:translateX(28%)}
}

@media (min-width:768px){
  .journal-preview__grid{grid-template-columns:repeat(2,1fr);gap:24px}
}

@media (min-width:992px){
  .journal-card__title{font-size:20px}
}

@media (prefers-reduced-motion: reduce){
.hero-logo,.fog,.embers,.hero-video::before,.hero-video::after{animation:none !important}
}
.collection-hero{padding-top:calc(var(--header-h) + 24px);padding-bottom:48px}
.collection-hero{padding-top:calc(var(--header-h) + 24px + env(safe-area-inset-top))}
.collection-hero h1{margin-top:0}
.site-footer{background:#000;color:#c8a652;border-top:1px solid #c8a652;padding:2rem 1rem;font-size:.875rem}
.footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;align-items:center;text-align:center}
.footer-logo{font-family:'DM Serif Display',serif;font-size:1.25rem}
.footer-links{display:flex;justify-content:center;gap:1.25rem;flex-wrap:wrap}
.footer-links a{color:#c8a652;text-decoration:none;text-transform:uppercase;font-weight:700;letter-spacing:.06em}
.footer-links a:hover{text-decoration:underline}
.footer-copy{color:#c8a652}
@media (max-width:768px){.footer-grid{grid-template-columns:1fr}.footer-copy{margin-top:.5rem}}
