/* ===== 99CentGigs "Simple" look (2026-10-13) =====
   Two backgrounds only:
   1) the gray title block (same as the "Find Your Next Job, Gig, or Volunteer Spot" block)
   2) the white linen page behind everything else.
   Used on every page EXCEPT the homepage, the Find Work page and the Sign In page. */

html:root body{ background:#efeeea url('/images/linen-white.jpg') repeat !important; background-size:320px auto !important; }

/* The page wrappers must let the linen show through. */
html:root body > .page, html:root body > .doc, html:root body > .wrap, html:root body > main{ background:transparent !important; }

/* ---- Title block: same gray rectangle and same heading as the Find page ---- */
html:root body .sp-band{
  position:relative; display:block; box-sizing:border-box;
  width:100vw; max-width:none; margin:0 calc(50% - 50vw) clamp(18px,2.4vw,32px);
  background:#e0dfd8; color:#0d0d0b;
  padding:clamp(26px,3.4vw,52px) 0 clamp(26px,3.2vw,48px);
}
html:root body .sp-band .sp-in{ max-width:1120px; margin:0 auto; padding:0 24px; box-sizing:border-box; }
html:root body .sp-band .sp-eyebrow{
  margin:0 0 6px; padding:0; border:0; background:none; box-shadow:none;
  font:800 clamp(12px,1.05vw,14px)/1.3 Geist,Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#00843a;
}
html:root body .sp-band h1.sp-h1:not(#_):not(#__):not(#___){
  margin:clamp(6px,1vw,12px) 0 0 !important; padding:0 !important; max-width:none !important; text-align:left !important;
  font-family:Arial,"Liberation Sans",Helvetica,sans-serif !important; font-weight:900 !important; text-transform:none !important;
  font-size:clamp(40px,4.7vw,76px) !important; line-height:.98 !important; letter-spacing:-.025em !important;
  color:#0d0d0b !important; -webkit-text-fill-color:#0d0d0b; text-shadow:none !important; filter:none !important;
  paint-order:stroke fill; -webkit-text-stroke:.07em #e0dfd8; background:none !important;
}
html:root body .sp-band h1.sp-h1 .sp-g{ color:#00843a !important; -webkit-text-fill-color:#00843a; }
html:root body .sp-band .sp-sub{
  margin:clamp(12px,1.5vw,20px) 0 0 !important; padding:0 !important; max-width:62ch; border:0; background:none; box-shadow:none;
  font:600 clamp(15px,1.25vw,18px)/1.45 Geist,Arial,sans-serif !important; letter-spacing:0 !important; text-transform:none !important; color:#2f302c !important; text-align:left !important;
}
html:root body .sp-band .sp-sub a{ color:#00843a; text-decoration:underline; }
html:root body .sp-band .sp-sub b{ font-weight:800; }
html:root body .sp-band .cat-switch{ margin:0 0 clamp(8px,1.2vw,14px) !important; }

/* The site scales page content up on wide screens; the title block opts out so it stays exactly edge to edge. */
html:root body > .sp-band.sp-band{ zoom:1 !important; }
@media (max-width:640px){
  html:root body .sp-band .sp-in{ padding:0 18px; }
}

/* ---- One page background everywhere: the white linen. Beats each page's own patterned background. ---- */
html:root:root:root{ background:#efeeea url('/images/linen-white.jpg') repeat 0 0 / 320px auto !important; }
html:root:root:root body{ background:transparent !important; background-image:none !important; }
html:root:root:root body:not(#_):not(#__){ background:transparent !important; background-image:none !important; }

/* ---- Document pages (Terms, Privacy, Accessibility): plain text on the linen, no paper, parchment or torn edges ---- */
html:root body .doc:not(#_):not(#__):not(#___):not(#____){
  background:none !important; background-image:none !important; box-shadow:none !important; filter:none !important;
}
html:root body .doc::before, html:root body .doc::after{ background:none !important; background-image:none !important; box-shadow:none !important; }

/* ---- FAQ: no paper cards; the questions sit directly on the linen, dividers kept ---- */
html:root body .faq-section .faq-card:not(#_):not(#__){ background:none !important; background-image:none !important; box-shadow:none !important; border:0 !important; }
html:root body .faq-section .faq-card::before, html:root body .faq-section .faq-card::after{ display:none !important; content:none !important; }

/* The paper tops are gone, so the big empty gap above the text goes too. */
html:root body .doc:not(#_):not(#__):not(#___):not(#____){ margin-top:24px !important; margin-bottom:40px !important; }

/* ---- Titles: exactly the size and weight of the "Find Your Next Job, Gig, or Volunteer Spot" title, with tighter spaces between words ---- */
html:root body .sp-band h1.sp-h1:not(#_):not(#__):not(#___){
  word-spacing:-.1em !important; font-weight:400 !important; font-size:clamp(46px,8.4vw,128px) !important; line-height:.93 !important; letter-spacing:-.045em !important;
}
@media (min-width:1025px){
  html:root body .sp-band h1.sp-h1:not(#_):not(#__):not(#___){ font-weight:900 !important; font-size:clamp(54px,4.7vw,86px) !important; line-height:.98 !important; letter-spacing:-.025em !important; }
}

/* ---- FAQ: the section label sits on the left ---- */
html:root body .faq-section-title:not(#_):not(#__):not(#___){ text-align:left !important; margin-left:0 !important; margin-right:auto !important; }

/* ---- Nothing is tilted on purpose any more ---- */
html:root body .faq-contact:not(#_):not(#__){ transform:none !important; }
