/* LUNA mobile consistency fixes — 2026-06-29 */
@media (max-width: 768px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  *, *::before, *::after {
    min-width: 0;
  }

  img, svg, video, canvas {
    max-width: 100% !important;
  }

  /* One identical header/logo on every page */
  nav#nav, body > nav {
    height: var(--nav, 76px) !important;
    min-height: var(--nav, 76px) !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }

  nav .logo,
  nav .logo a {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
  }

  nav .logo img,
  #logo-nav {
    display: block !important;
    width: auto !important;
    height: 62px !important;
    max-width: 56vw !important;
    max-height: 62px !important;
    object-fit: contain !important;
  }

  .mob-menu-btn {
    width: 29px !important;
    height: 21px !important;
    flex: 0 0 29px !important;
  }

  /* Hide the desktop-style yellow ticker on phones */
  .ticker {
    display: none !important;
  }

  /* Universal text containment */
  h1, h2, h3, h4, p, a, span, td, th, label,
  .page-title, .page-desc, .sec-ttl, .svc-name, .svc-desc,
  .pp h1, .bc, .cat-hd h1, .cat-hd p, .ir, .ai-out {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }

  input, select, textarea, button {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Tool pages: force a true one-column mobile layout, including inline grids */
  .page-header-inner {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 2.25rem 1.25rem 2.75rem !important;
  }

  .breadcrumb {
    flex-wrap: wrap !important;
    row-gap: .35rem !important;
    line-height: 1.45 !important;
  }

  .page-eyebrow {
    line-height: 1.55 !important;
  }

  .page-title {
    font-size: clamp(2rem, 10.5vw, 3rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.03em !important;
  }

  .page-desc {
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  .tool-wrap {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1rem !important;
    padding: 2rem 1rem 4rem !important;
  }

  .tcard, .rbx {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.25rem !important;
  }

  .fr2 {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .mg {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .ir {
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }

  .ir span:last-child {
    width: 100% !important;
    text-align: left !important;
  }

  /* Services: the wide last card must stack on phones */
  .services-section,
  .why-section,
  .cta-section {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .svc-grid,
  .why-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .svc-card,
  .svc-card-last {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.5rem 1.25rem !important;
    overflow: hidden !important;
  }

  .svc-card-last {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.5rem !important;
    align-items: stretch !important;
  }

  .svc-card-last .svc-left {
    width: 100% !important;
    min-width: 0 !important;
  }

  .svc-card-last .svc-features {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .65rem !important;
  }

  .svc-name {
    font-size: clamp(1.05rem, 5.6vw, 1.35rem) !important;
    line-height: 1.35 !important;
  }

  .svc-btn,
  .btn-y-lg {
    width: 100% !important;
    text-align: center !important;
  }

  /* Catalog and category pages */
  .page {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .sidebar {
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    height: auto !important;
    overflow: visible !important;
    border-right: 0 !important;
  }

  .sb-title,
  .sb-cat {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .main {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.25rem 1rem 3rem !important;
  }

  .sec-hdr,
  .toolbar,
  .filter-panel,
  .pop-cta {
    flex-wrap: wrap !important;
  }

  .cat-grid {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Product pages */
  .bc {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    white-space: normal !important;
    line-height: 1.55 !important;
  }

  .cat-hd,
  .pp,
  .rel {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .pp {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1.25rem !important;
  }

  .pp h1 {
    font-size: clamp(1.75rem, 8.5vw, 2.4rem) !important;
    line-height: 1.08 !important;
  }

  .pp-spec {
    width: 100% !important;
    table-layout: fixed !important;
  }

  .pp-spec th,
  .pp-spec td {
    overflow-wrap: anywhere !important;
  }

  .pp-cta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .pp-cta a,
  .pp-cta button {
    width: 100% !important;
    text-align: center !important;
  }

  /* Footer also stays inside the viewport */
  footer,
  .footer {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    overflow: hidden !important;
  }

  .footer-links,
  .fl {
    gap: 1rem !important;
  }

  /* Beta notice: compact and readable on phones */
  #beta-banner {
    font-size: 10px !important;
    line-height: 1.35 !important;
    padding: .55rem 2.25rem .55rem .75rem !important;
  }
}

@media (max-width: 420px) {
  nav#nav, body > nav {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  nav .logo img,
  #logo-nav {
    height: 58px !important;
    max-height: 58px !important;
    max-width: 58vw !important;
  }

  .page-title {
    font-size: clamp(1.85rem, 10.5vw, 2.6rem) !important;
  }

  .mg {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* ── Product SEO description block (2026-06-29) ── */
.pp-seo{max-width:1280px;margin:0 auto;padding:.5rem 2rem 3.5rem;color:#444}
.pp-seo h2{font-size:1.2rem;font-weight:800;letter-spacing:-.01em;color:#0a0a0a;margin:0 0 1rem}
.pp-seo p{font-size:14px;line-height:1.7;color:#444;margin:0 0 .9rem;max-width:920px}
.pp-seo .pp-seo-h{font-weight:700;color:#0a0a0a;margin:1.1rem 0 .55rem}
.pp-seo-list{list-style:none;padding:0;margin:0 0 1.1rem;max-width:920px;display:grid;gap:.5rem}
.pp-seo-list li{position:relative;padding-left:1.25rem;font-size:14px;line-height:1.6;color:#444}
.pp-seo-list li::before{content:"—";position:absolute;left:0;color:var(--y,#F5C800);font-weight:700}
.pp-seo-cta{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.25rem;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--bd,#e8e8e8)}
.seo-cta-btn{background:var(--y,#F5C800);color:#0a0a0a;border:none;padding:.85rem 1.8rem;font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.seo-cta-btn:hover{background:#0a0a0a;color:#fff}
.pp-seo-links{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .65rem;font-size:13px;color:var(--mt,#888)}
.pp-seo-links a{color:var(--mt,#888);border-bottom:1px solid var(--bd,#e8e8e8);transition:color .15s,border-color .15s}
.pp-seo-links a:hover{color:#0a0a0a;border-color:#0a0a0a}

@media (max-width:768px){
  .pp-seo{padding:.25rem 1rem 2.5rem !important}
  .pp-seo-cta{flex-direction:column;align-items:stretch}
  .seo-cta-btn{width:100% !important;text-align:center}
  .pp-seo-links{justify-content:flex-start}
}

/* ── Tool-page SEO / help content (2026-06-29) ── */
.tool-seo{max-width:1100px;margin:0 auto;padding:1.5rem 2rem 4rem;color:#444}
.tool-seo h2{font-size:1.4rem;font-weight:800;color:#0a0a0a;margin:2rem 0 1rem;letter-spacing:-.01em}
.tool-seo h2:first-child{margin-top:0}
.tool-seo h3{font-size:1.05rem;font-weight:700;color:#0a0a0a;margin:1.5rem 0 .5rem}
.tool-seo p{font-size:14px;line-height:1.75;margin:0 0 1rem;max-width:880px}
.tool-seo ol,.tool-seo ul{margin:0 0 1rem;padding-left:1.25rem;max-width:880px}
.tool-seo li{font-size:14px;line-height:1.7;margin-bottom:.4rem}
.tool-example{background:var(--gr,#f5f5f5);border-left:3px solid var(--y,#F5C800);padding:1rem 1.25rem;margin:0 0 1.25rem;font-size:13.5px;line-height:1.75;max-width:880px}
.tool-example strong{color:#0a0a0a}
.tool-faq{margin-top:.5rem;max-width:880px}
.tool-faq details{border-bottom:1px solid var(--bd,#e8e8e8);padding:.85rem 0}
.tool-faq summary{font-weight:700;font-size:14px;color:#0a0a0a;cursor:pointer;list-style:none}
.tool-faq summary::-webkit-details-marker{display:none}
.tool-faq summary::before{content:"+ ";color:var(--y,#F5C800);font-weight:800}
.tool-faq details[open] summary::before{content:"– "}
.tool-faq details p{margin:.6rem 0 0;font-size:13.5px;color:#555;line-height:1.7}
.tool-seo-links{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin-top:1.75rem;padding-top:1.25rem;border-top:1px solid var(--bd,#e8e8e8)}
.tool-seo-links a{font-size:13px;font-weight:600;color:#0a0a0a;border-bottom:1px solid var(--bd,#e8e8e8);padding-bottom:1px}
.tool-seo-links a:hover{border-color:#0a0a0a}
@media (max-width:768px){ .tool-seo{padding:1rem 1rem 3rem !important} }
