/* MME premium design layer v2 — gearscout */
:root {
  --p-accent: #D4590A; --p-accent2: #F08C45; --p-bg: #1C2418; --p-surface: #252F20;
  --p-display: 'Archivo', system-ui, sans-serif;
  --p-shadow-sm: 0 1px 2px rgba(0,0,0,.25), 0 2px 8px rgba(0,0,0,.18);
  --p-shadow-lg: 0 4px 12px rgba(0,0,0,.30), 0 16px 40px rgba(0,0,0,.28);
  --p-radius: 16px;
}
h1,h2,h3,.hero h1,.best-item-name,.verdict-winner,nav .logo,.site-title {
  font-family: var(--p-display); letter-spacing:-.015em;
}
h1{font-size:clamp(2rem,5.2vw,3.4rem);line-height:1.08;}
h2{font-size:clamp(1.4rem,3.2vw,2.1rem);line-height:1.2;margin-top:2.2em;}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}

/* glass nav */
nav,header nav,.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  background:color-mix(in srgb,var(--p-bg) 78%,transparent)!important;
  border-bottom:1px solid color-mix(in srgb,var(--p-accent) 22%,transparent);}

/* premium hero */
.premium-hero{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:24px;
  align-items:center;overflow:hidden;border-radius:0 0 28px 28px;
  background:
    radial-gradient(900px 420px at 12% -10%, color-mix(in srgb,var(--p-accent) 26%,transparent), transparent 60%),
    radial-gradient(700px 380px at 95% 8%, color-mix(in srgb,var(--p-accent2) 16%,transparent), transparent 55%),
    var(--p-bg);}
.premium-hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1.5px);
  background-size:26px 26px;mask-image:linear-gradient(180deg,#000,transparent 75%);}
.hero-character{width:min(340px,42vw);height:auto;justify-self:center;z-index:1;
  filter:drop-shadow(0 18px 38px rgba(0,0,0,.45));
  animation:p-float 7s ease-in-out infinite;}
@keyframes p-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* cards: depth + lift */
.best-item,.faq-item,article,.card,.review-card,.tool-card,.post-card{
  border-radius:var(--p-radius);box-shadow:var(--p-shadow-sm);
  border:1px solid color-mix(in srgb,var(--p-accent) 14%,transparent);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
.best-item:hover,article:hover,.card:hover,.review-card:hover,.tool-card:hover,.post-card:hover{
  transform:translateY(-4px);box-shadow:var(--p-shadow-lg);
  border-color:color-mix(in srgb,var(--p-accent) 38%,transparent);}

/* verdict box */
.verdict-box{position:relative;border-radius:var(--p-radius);
  border-left:6px solid var(--p-accent)!important;box-shadow:var(--p-shadow-lg);
  background:linear-gradient(135deg,var(--p-surface), color-mix(in srgb,var(--p-surface) 70%,var(--p-bg)))!important;}
.verdict-avatar{position:absolute;top:-22px;right:18px;width:64px;height:64px;border-radius:50%;
  box-shadow:var(--p-shadow-sm);}

/* score pill */
.best-item-score{font-family:var(--p-display);font-weight:700;
  background:linear-gradient(135deg,var(--p-accent),var(--p-accent2));
  -webkit-background-clip:text;background-clip:text;color:transparent;}

/* buttons */
.affiliate-btn,button[type=submit],.btn,.cta{
  background:linear-gradient(135deg,var(--p-accent),color-mix(in srgb,var(--p-accent) 70%,var(--p-accent2)))!important;
  border:none;border-radius:12px;box-shadow:0 4px 14px color-mix(in srgb,var(--p-accent) 35%,transparent);
  transition:transform .18s ease, box-shadow .18s ease;}
.affiliate-btn:hover,.btn:hover,.cta:hover{transform:translateY(-2px);
  box-shadow:0 8px 22px color-mix(in srgb,var(--p-accent) 50%,transparent);}

/* tables */
table{border-collapse:separate;border-spacing:0;border-radius:var(--p-radius);overflow:hidden;
  border:1px solid color-mix(in srgb,var(--p-accent) 18%,transparent);}
thead th{background:color-mix(in srgb,var(--p-accent) 14%,var(--p-surface));}
tbody tr:nth-child(even){background:color-mix(in srgb,var(--p-surface) 55%,transparent);}
tbody tr{transition:background .15s ease;}
tbody tr:hover{background:color-mix(in srgb,var(--p-accent) 10%,var(--p-surface));}

/* imagery */
img{border-radius:10px;}
.mme-prod-img{transition:transform .25s ease;}
.best-item:hover .mme-prod-img{transform:scale(1.06);}

/* scroll reveal */
.p-reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease;}
.p-reveal.visible{opacity:1;transform:none;}

/* mobile */
@media (max-width:760px){
  .premium-hero{grid-template-columns:1fr;text-align:center;padding-bottom:8px;}
  .hero-character{width:min(240px,58vw);order:-1;margin-top:12px;}
  .best-item{flex-wrap:wrap;}
  .affiliate-btn{width:100%;text-align:center;padding:14px 18px;}
}
@media (prefers-reduced-motion:reduce){
  *,.hero-character{animation:none!important;transition:none!important;}
}

/* CONTENT IS NEVER HOSTAGE TO ANIMATION (fix 2026-06-12):
   pages built with scroll-driven fadeUp froze at opacity:0 on anchor
   landings. Sections render always; entrance polish comes from premium2.js
   which is anchor-safe with a 3s failsafe. */
.section{opacity:1!important;transform:none!important;animation:none!important;}