
:root{
  --black:#050505;
  --charcoal:#101010;
  --stone:#bfaea3;
  --cream:#fff3dd;
  --gold:#e7c75f;
  --red:#d71920;
  --green:#4cb044;
  --muted:#d9d1c9;
  --line:rgba(255,255,255,.14);
  --shadow:0 24px 60px rgba(0,0,0,.38);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--black);color:#fff;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{width:min(1180px,92vw);margin:0 auto}
.section-pad{padding:38px 0}
.site-header{position:fixed;top:0;left:0;right:0;z-index:10;padding:12px 0;background:linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.2),transparent);backdrop-filter:blur(7px)}
.nav-shell{width:min(1180px,92vw);margin:0 auto;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:999px;background:rgba(0,0,0,.62);padding:6px 16px 6px 12px}
.brand{display:flex;align-items:center}
.brand-logo{height:62px;width:auto;display:block;filter:drop-shadow(0 8px 18px rgba(0,0,0,.45))}
.nav-links{display:flex;gap:24px;font-size:14px;font-weight:800;color:#eee}
.nav-links a{opacity:.82}
.nav-links a:hover{opacity:1;color:var(--gold)}
.hero{position:relative;min-height:72vh;display:flex;align-items:center;padding:88px 0 28px;background:radial-gradient(circle at 75% 40%,rgba(215,25,32,.18),transparent 32%),radial-gradient(circle at 28% 12%,rgba(231,199,95,.1),transparent 28%),linear-gradient(135deg,#050505 0%,#141414 56%,#050505 100%)}
.hero:before{content:"";position:absolute;inset:0;background:url('assets/rockoven-mini-pizza-bases.png') center 72%/110% auto no-repeat;opacity:.04;filter:grayscale(1)}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:42px;background:linear-gradient(transparent,var(--black))}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:.98fr 1.02fr;gap:26px;align-items:center}
.hero-copy{padding-top:8px}
.eyebrow{margin:0 0 12px;color:var(--red);text-transform:uppercase;letter-spacing:.2em;font-size:12px;font-weight:900}
.eyebrow.gold{color:var(--gold)}
h1,h2,h3,p{margin-top:0}
h1{font-family:Playfair Display,serif;font-size:clamp(46px,5.8vw,76px);line-height:.95;margin-bottom:18px;letter-spacing:-.05em}
h2{font-family:Playfair Display,serif;font-size:clamp(30px,3.5vw,48px);line-height:1.04;margin-bottom:14px;letter-spacing:-.035em}
h3{font-family:Cinzel,serif;font-size:20px;line-height:1.14;margin-bottom:10px}
.hero-lead,.section-heading p,.intro-grid p,.story-card p,.contact-card p{font-size:16px;line-height:1.55;color:var(--muted)}
.hero-actions{display:flex;gap:14px;margin:24px 0}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 23px;border-radius:999px;font-weight:900;border:1px solid transparent;transition:.22s ease}
.btn.primary{background:var(--red);box-shadow:0 14px 34px rgba(215,25,32,.3)}
.btn.primary:hover{transform:translateY(-2px);background:#ed242b}
.btn.secondary{border-color:var(--stone);color:var(--cream);background:rgba(255,255,255,.045)}
.proof-strip{display:flex;gap:10px;flex-wrap:wrap}
.proof-strip span{padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.05);font-size:13px;color:var(--cream);font-weight:700}
.hero-showcase{position:relative;min-height:420px}
.hero-pack{position:absolute;filter:drop-shadow(0 28px 40px rgba(0,0,0,.62))}
.pinsa-pack{height:430px;right:11%;top:0;transform:rotate(1.5deg)}
.pizza-pack{height:355px;left:0;bottom:0;transform:rotate(-4deg)}
.intro-band{padding:24px 0;background:linear-gradient(90deg,#111,#1c1310,#111);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.intro-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:center}
.intro-grid h2,.intro-grid p{margin:0}
.section-heading{max-width:760px}
.section-heading.centered{text-align:center;margin:0 auto 18px}
.range-section{padding-top:34px}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.product-card{background:linear-gradient(180deg,#1a1a1a,#0c0c0c);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;height:100%}
.product-image-wrap{height:290px;display:grid;place-items:center;padding:10px 10px 0;background:radial-gradient(circle at 50% 18%,rgba(255,255,255,.1),transparent 55%)}
.product-image-wrap.wide{height:220px}
.product-image-wrap img{height:270px;width:auto;object-fit:contain}
.product-image-wrap.pinsa-range-image img{height:270px}
.product-image-wrap.wide img{height:auto;width:94%;max-height:172px;object-fit:contain}
.product-copy{padding:16px}
.product-copy p{color:var(--muted);line-height:1.55;margin:0}
.centered-copy{text-align:center}
.tag{display:inline-flex;margin-bottom:12px;padding:7px 11px;border:1px solid rgba(229,198,91,.38);border-radius:999px;color:var(--gold);font-size:11px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.tag.green{color:#7be073;border-color:rgba(77,171,71,.5)}
.wide-card{grid-column:1 / -1;max-width:860px;justify-self:center}
.story{background:linear-gradient(180deg,#080808,#15100e)}
.story-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:20px;align-items:stretch}
.story-card,.oven-panel,.contact-card,.usage-box{border:1px solid var(--line);border-radius:28px;background:rgba(255,255,255,.045);box-shadow:var(--shadow)}
.story-card{padding:26px}
.story-card p:last-child{margin-bottom:0}
.oven-panel{padding:18px;background:linear-gradient(135deg,rgba(215,25,32,.14),rgba(229,198,91,.1)),url('assets/rockoven-garlic-herb-pizza-bases.png') center/cover no-repeat;min-height:280px;display:flex;flex-direction:column;justify-content:end;gap:12px;position:relative;overflow:hidden}
.oven-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.84))}
.pillar{position:relative;z-index:1;display:flex;align-items:center;gap:16px;padding:16px;border:1px solid var(--line);border-radius:18px;background:rgba(0,0,0,.58);backdrop-filter:blur(5px)}
.pillar strong{font-family:Cinzel,serif;color:var(--gold);font-size:24px}
.pillar span{font-weight:900}
.quality-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:32px;align-items:center}
.feature-list{display:grid;gap:12px}
.feature{display:flex;gap:14px;padding:16px;border:1px solid var(--line);border-radius:22px;background:#121212}
.feature span{width:14px;height:14px;border-radius:50%;background:var(--red);margin-top:6px;box-shadow:0 0 0 8px rgba(215,25,32,.12);flex:0 0 auto}
.feature h3{margin-bottom:7px}
.feature p{margin:0;color:var(--muted);line-height:1.55}
.usage{padding-top:6px}
.usage-box{padding:30px;display:grid;grid-template-columns:.7fr 1.3fr;gap:24px;align-items:center;background:linear-gradient(135deg,#171717,#090909)}
.usage-box h2{margin:0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}
.steps div{padding:16px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.05);min-height:112px}
.steps strong{display:block;font-family:Cinzel,serif;color:var(--gold);font-size:28px;margin-bottom:10px}
.steps span{font-weight:900;line-height:1.3;display:block}
.contact{padding-top:0}
.contact-card{padding:24px;display:flex;align-items:center;justify-content:space-between;gap:28px;background:linear-gradient(135deg,rgba(215,25,32,.18),rgba(229,198,91,.08))}
.contact-card div{max-width:760px}
.footer{padding:14px 0;border-top:1px solid var(--line);color:#aaa}
.footer-inner{display:flex;justify-content:space-between;gap:20px}
.footer a{color:var(--gold)}
@media (max-width:980px){
  .nav-links{display:none}
  .hero-grid,.intro-grid,.story-grid,.quality-grid,.usage-box{grid-template-columns:1fr}
  .hero-showcase{min-height:430px}
  .pinsa-pack{height:440px;right:8%}
  .pizza-pack{height:355px}
  .product-grid{grid-template-columns:1fr 1fr}
  .wide-card{grid-column:1 / -1;max-width:none}
  .steps{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .section-pad{padding:34px 0}
  .hero{padding-top:92px;min-height:auto;padding-bottom:24px}
  .hero-grid{gap:16px}
  h1{font-size:44px}
  .hero-actions,.contact-card,.footer-inner{flex-direction:column;align-items:flex-start}
  .hero-showcase{min-height:260px}
  .pinsa-pack{height:270px;right:2%}
  .pizza-pack{height:220px;left:-4%}
  .product-grid,.steps{grid-template-columns:1fr}
  .product-image-wrap,.product-image-wrap.wide{height:210px}
  .product-image-wrap img,.product-image-wrap.pinsa-range-image img{height:200px}
  .product-image-wrap.wide img{width:96%;max-height:145px}
  .story-card,.usage-box,.contact-card{padding:24px}
  .nav-shell{border-radius:24px}
  .brand-logo{height:52px}
}
