/* Gree SEO AIO Audit — global reset + responsive layer.
   The page markup keeps the design's inline styles verbatim; this file only adds
   the document reset (moved out of the source <helmet>) and mobile behaviour. */

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0}
::selection{background:#0E7C6B;color:#fff}

/* Wide data tables scroll sideways instead of crushing their columns on phones */
.wtable{overflow-x:auto;-webkit-overflow-scrolling:touch}
.wtable>div{min-width:640px}

/* 4.3.1 keyword table: two side-by-side columns on desktop, stack on phones.
   Driven by a class (not a [style*=] selector) so it survives Prettier reformatting. */
.kwgrid{display:grid;grid-template-columns:1fr 1fr;word-break:break-word}
.kwgrid *{min-width:0}                       /* let 1fr tracks shrink below content on narrow screens */
.kwgrid>div+div{border-left:1px solid #EFE8DA}
@media (max-width:860px){
  .kwgrid{grid-template-columns:1fr}
  .kwgrid>div+div{border-left:none;border-top:1px solid #EFE8DA}
}

/* ponytail: responsive over inline styles. Attribute selectors match the design's
   grid declarations and collapse the multi-column marketing layouts to one column on
   mobile. Both the compact (no space) and Prettier (space after colon) forms are listed
   so the rules survive a format-on-save. !important beats each element's inline style. */
@media (max-width:860px){
  [style*="grid-template-columns:1.55fr 1fr"],[style*="grid-template-columns: 1.55fr 1fr"],
  [style*="grid-template-columns:1.15fr 0.85fr"],[style*="grid-template-columns: 1.15fr 0.85fr"],
  [style*="grid-template-columns:1fr 1fr"],[style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1.4fr 3fr auto"],[style*="grid-template-columns: 1.4fr 3fr auto"]{
    grid-template-columns:1fr !important;
  }
  /* dial back the two largest type sizes so headings fit narrow screens */
  [style*="font-size:52px"],[style*="font-size: 52px"]{font-size:34px !important}
  [style*="font-size:32px"],[style*="font-size: 32px"]{font-size:24px !important}
}
