:root{--card-ratio:3/4;--grid-columns:3;--grid-gap:clamp(18px,3vw,40px)}
.announce{padding:6px 16px;text-align:center;font-size:.85rem;letter-spacing:.02em;border-bottom:1px solid var(--border);color:var(--muted)}
.site-header{border-bottom:1px solid var(--border)}
.masthead{display:grid;justify-items:center;gap:2px;padding-top:26px;text-align:center}
.logo{font-family:var(--font-heading);font-size:clamp(1.9rem,5vw,2.8rem);text-decoration:none;color:var(--text);font-weight:700}
.logo img{max-height:70px;width:auto}
.masthead-tagline{color:var(--muted);font-size:.92rem}
.nav-row{display:flex;justify-content:center;gap:32px;padding-block:10px 14px}
.site-nav{display:flex;gap:32px}
.site-nav a{text-decoration:none;font-size:.98rem;padding:4px 0;border-bottom:1px solid transparent}
.site-nav a:hover{border-bottom-color:var(--accent)}
.btn{background:transparent;color:var(--text);border-color:var(--text)}
.btn:hover{background:var(--primary);color:var(--on-primary);filter:none}
.hero{position:relative;display:grid;place-items:center;min-height:clamp(320px,60vh,620px);text-align:center;background:var(--surface);overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover}
.hero--image .hero-media::after{content:"";position:absolute;inset:0;background:rgba(20,15,10,.45)}
.hero-body{position:relative;display:grid;gap:18px;justify-items:center;max-width:720px;padding:40px 20px}
.hero h1{font-size:clamp(2.2rem,6.5vw,4rem);font-weight:400}
.hero p{font-size:1.15rem}
.hero--image h1,.hero--image p,.hero--image .hero-link{color:#fff}
.hero-link{padding-bottom:4px;border-bottom:1px solid currentColor;text-decoration:none;font-size:1.05rem}
.section-head{justify-content:center;flex-direction:column;align-items:center;gap:4px;text-align:center;margin-bottom:34px}
.section-head h2{font-weight:400;font-size:clamp(1.6rem,4vw,2.3rem)}
.section-link{color:var(--accent);font-weight:400;font-size:.92rem}
.quote{display:grid;justify-items:center;gap:14px;text-align:center;max-width:760px}
.quote-rule{width:48px;height:1px;background:var(--accent)}
.quote blockquote{margin:0;font-family:var(--font-heading);font-size:clamp(1.3rem,3.5vw,1.9rem);line-height:1.6}
.quote cite{font-style:normal;color:var(--muted)}
.card{text-align:center}
.card-body{display:grid;gap:4px;justify-items:center;padding-top:14px}
.card-title{font-family:var(--font-heading);font-weight:400;font-size:1.15rem}
.price{justify-content:center}
.price-now{font-weight:400;color:var(--accent)}
.product-info .price{justify-content:flex-start}
.badge{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.features li{background:transparent;border-block:1px solid var(--border);border-radius:0;text-align:center}
.site-footer{margin-top:48px;padding-block:44px 24px;border-top:1px solid var(--border)}
.footer-center{display:grid;justify-items:center;gap:8px;text-align:center}
.footer-center a{text-decoration:none}
.footer-name{font-family:var(--font-heading);font-size:1.5rem;font-weight:400}
.footer-rights{margin-top:12px;font-size:.84rem}
@media (max-width:700px){
  :root{--grid-columns:2;--grid-gap:14px}
  .nav-toggle{display:block}
  .nav-row{flex-direction:column;align-items:center;gap:6px}
  .site-nav{display:none;flex-direction:column;align-items:center;gap:4px}
  .site-nav.is-open{display:flex}
}
