/* ════════ UltrasZone, SEO Landing Pages ════════ */

.seo-hero{
  position:relative; overflow:hidden;
  padding:150px 56px 60px;
  background:#0a0a0a; color:#fff;
}
.seo-hero::before{
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:60px 60px; pointer-events:none;
}
.seo-hero .seo-crumb{ position:relative; margin-bottom:26px; }
.seo-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:.66rem; letter-spacing:4px; text-transform:uppercase;
  color:var(--cyan2); margin-bottom:18px; position:relative;
}
.seo-eyebrow::before{ content:''; width:26px; height:2px; background:var(--cyan); box-shadow:0 0 8px var(--cyan); }
.seo-h1{
  font-family:'Karantina','Heebo',sans-serif; font-weight:700;
  font-size:clamp(3rem,7vw,6rem); line-height:.92; letter-spacing:.5px;
  color:#fff; position:relative; max-width:16ch;
}
.seo-h1 .accent{ color:var(--cyan2); text-shadow:0 0 34px var(--glow); }
.seo-hero-sub{
  position:relative; margin-top:22px; max-width:60ch;
  font-size:1.02rem; line-height:1.8; color:rgba(255,255,255,.6);
}
.seo-hero-actions{ position:relative; margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
.seo-hero-actions .btn-outline{ border-color:rgba(255,255,255,.3); color:#fff; }
.seo-hero-actions .btn-outline:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.6); }

/* breadcrumb */
.seo-crumb{ font-size:.68rem; letter-spacing:1.5px; text-transform:uppercase; color:rgba(255,255,255,.4); }
.seo-crumb a{ color:rgba(255,255,255,.55); text-decoration:none; transition:color .2s; }
.seo-crumb a:hover{ color:var(--cyan2); }
.seo-crumb i{ color:rgba(255,255,255,.25); font-style:normal; margin:0 4px; }
.seo-crumb span{ color:#fff; }

/* body prose */
.seo-body{ padding:64px 56px; max-width:860px; }
.seo-body h2{
  font-family:'Karantina','Heebo',sans-serif; font-weight:700;
  font-size:clamp(1.8rem,3.4vw,2.6rem); letter-spacing:.5px;
  color:var(--black); margin:44px 0 18px;
}
.seo-body h2:first-child{ margin-top:0; }
.seo-body h3{
  font-family:'Karantina','Heebo',sans-serif; font-weight:700;
  font-size:1.5rem; color:var(--black); margin:30px 0 12px;
}
.seo-body p{ font-size:1rem; line-height:1.9; color:var(--muted); margin-bottom:20px; }
.seo-body p strong{ color:var(--ink); }
.seo-body ul{ margin:0 0 22px; padding-inline-start:22px; }
.seo-body li{ font-size:1rem; line-height:1.8; color:var(--muted); margin-bottom:10px; }
.seo-body a.inline{ color:var(--cyan2); text-decoration:none; border-bottom:1px solid rgba(0,212,232,.3); }
.seo-body a.inline:hover{ border-color:var(--cyan2); }

/* highlight callout */
.seo-callout{
  background:var(--off); border-inline-start:3px solid var(--cyan2);
  padding:22px 26px; margin:28px 0; font-size:.98rem; line-height:1.8; color:var(--ink);
}

/* stat row */
.seo-stats{ display:flex; flex-wrap:wrap; gap:40px; margin:34px 0; }
.seo-stat .n{ font-family:'Bebas Neue','Karantina',sans-serif; font-size:2.6rem; color:var(--cyan2); text-shadow:0 0 16px var(--glow); line-height:1; }
.seo-stat .l{ font-size:.6rem; letter-spacing:2.5px; text-transform:uppercase; color:var(--muted); margin-top:6px; }

/* product section reuse */
.seo-products{ padding:24px 56px 72px; }
.seo-products .products-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }

/* faq */
.seo-faq{ padding:64px 56px; background:var(--off); }
.seo-faq-list{ max-width:820px; }
.seo-faq-item{ border-bottom:1px solid var(--light); }
.seo-faq-item summary{
  cursor:pointer; list-style:none; padding:20px 0;
  font-family:'Karantina','Heebo',sans-serif; font-weight:700; font-size:1.25rem;
  color:var(--black); display:flex; justify-content:space-between; align-items:center; gap:16px;
}
.seo-faq-item summary::-webkit-details-marker{ display:none; }
.seo-faq-item summary::after{ content:'+'; color:var(--cyan2); font-size:1.6rem; line-height:1; transition:transform .2s; }
.seo-faq-item[open] summary::after{ transform:rotate(45deg); }
.seo-faq-item p{ padding:0 0 22px; font-size:.98rem; line-height:1.85; color:var(--muted); margin:0; }

/* ── related links, quiet footnote row (no white boxes) ── */
.seo-related{
  padding:26px 56px 34px;
  border-top:1px solid var(--light);
  opacity:.72; transition:opacity .25s ease;
}
.seo-related:hover{ opacity:1; }
/* headings inside the related strip stay small and unobtrusive */
.seo-related .section-label{ font-size:.56rem; letter-spacing:2.5px; color:var(--muted); opacity:.7; margin:0 0 4px; }
.seo-related .section-title{
  font-family:'Heebo',sans-serif; font-weight:600;
  font-size:.74rem !important; letter-spacing:1.6px; text-transform:uppercase;
  color:var(--muted); margin:0 0 12px !important; line-height:1.4;
  border-bottom:0 !important; padding-bottom:0 !important; text-shadow:none !important;
}
.seo-related .section-title::after,
.seo-related .section-label::after,
.seo-related .section-label::before{ display:none !important; }

.seo-chips{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 0; margin-top:6px; }
.seo-chip{
  display:inline-block; padding:2px 0; background:none !important;
  border:0 !important; box-shadow:none !important;
  font-size:.74rem; line-height:1.7; color:var(--muted); opacity:.85;
  text-decoration:none; transition:color .2s,opacity .2s;
}
/* thin separator between links instead of white boxes */
.seo-chip + .seo-chip::before{
  content:'·'; color:rgba(255,255,255,.22); margin:0 10px; display:inline-block;
}
.seo-chip:hover{ color:var(--cyan2); opacity:1; text-decoration:underline; text-underline-offset:3px; }

/* CTA band */
.seo-cta{
  padding:80px 56px; text-align:center; background:var(--black); color:#fff; position:relative; overflow:hidden;
}
.seo-cta::before{
  content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:60px 60px; pointer-events:none;
}
.seo-cta h2{ position:relative; font-family:'Karantina','Heebo',sans-serif; font-weight:700; font-size:clamp(2rem,4vw,3.2rem); color:#fff; margin-bottom:14px; }
.seo-cta p{ position:relative; color:rgba(255,255,255,.55); max-width:52ch; margin:0 auto 28px; line-height:1.8; }
.seo-cta .btn-primary{ position:relative; background:var(--cyan2); color:#000; }
.seo-cta .btn-primary:hover{ box-shadow:0 0 30px var(--glow); }

@media(max-width:900px){
  .seo-hero{ padding:110px 22px 44px; }
  .seo-body{ padding:48px 22px; }
  .seo-products{ padding:16px 22px 56px; }
  .seo-products .products-grid{ grid-template-columns:repeat(2,1fr); }
  .seo-faq{ padding:48px 22px; }
  .seo-related{ padding:22px 22px 28px; }
  .seo-cta{ padding:60px 22px; }
  .seo-stats{ gap:26px; }
}

/* gift picks cards */
.seo-picks{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:22px 0 8px; }
.seo-pick{
  display:flex; flex-direction:column; gap:8px;
  background:var(--off); border:1px solid var(--light);
  padding:24px; text-decoration:none; transition:border-color .2s,box-shadow .2s,transform .2s;
}
.seo-pick:hover{ border-color:var(--cyan2); box-shadow:0 0 18px var(--glow); transform:translateY(-2px); }
.seo-pick-name{ font-family:'Karantina','Heebo',sans-serif; font-weight:700; font-size:1.5rem; color:var(--black); }
.seo-pick-blurb{ font-size:.9rem; line-height:1.7; color:var(--muted); flex:1; }
.seo-pick-cta{ font-size:.72rem; letter-spacing:2px; text-transform:uppercase; color:var(--cyan2); font-weight:700; }
@media(max-width:900px){ .seo-picks{ grid-template-columns:1fr; } }