/* The public pages, which Intuit's reviewers read: home, privacy, terms and
   disconnected. One light theme in Woolf IT Solutions' colors, in the
   system's own font. Nothing loads from anywhere else. The privacy page
   names every party that sees data, and a font or script host would be one
   more.

   Four text sizes. Page titles are 34px, or 28px on a phone. Headings and
   the lead line are 21px, and the lead line drops to body size on a phone.
   Body text is 17px, and the bar, dates and footer are 14px. */
:root{
  color-scheme:light;
  --ink:#0a1828;       /* headings and strong text */
  --body:#334155;      /* running text */
  --muted:#586377;     /* secondary text, 4.5:1 or better on paper and white */
  --rule:#e2e8f0;      /* hairlines */
  --paper:#f5f7fa;     /* the page behind the cards */
  --surface:#ffffff;
  --blue:#004884;      /* links and the one call to action */
  --blue-deep:#003a6b; /* hover on light */
  --radius:18px;
  --card-shadow:0 1px 2px rgba(10,24,40,.05),0 8px 28px rgba(10,24,40,.06);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{background:var(--paper)}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--paper);color:var(--body);
  font:17px/1.6 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--blue);text-underline-offset:2px}
a:hover{color:var(--blue-deep)}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}
h1{font-size:34px;line-height:1.12;font-weight:600;letter-spacing:-.022em;color:var(--ink);margin:0 0 10px;text-wrap:balance}
h2{font-size:21px;line-height:1.3;font-weight:600;letter-spacing:-.012em;color:var(--ink);margin:40px 0 10px}
p{margin:0 0 14px}
ul{margin:0 0 14px;padding-left:22px}
li{margin-bottom:8px}
li::marker{color:var(--muted)}
strong{color:var(--ink);font-weight:600}

/* The bar is translucent and stays put while the page scrolls under it. */
header.site{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(10,24,40,.08)}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){header.site{background:rgba(255,255,255,.97)}}
header.site .bar{max-width:848px;margin:0 auto;padding:10px 24px;min-height:60px;display:flex;align-items:center;
  justify-content:space-between;gap:6px 24px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;letter-spacing:-.01em;color:var(--ink);line-height:1.3}
.brand img{flex:none;width:26px;height:28px}
.brand span span{font-weight:400;color:var(--muted)}
nav{display:flex;align-items:center;gap:22px;font-size:14px}
nav a{color:var(--body);text-decoration:none;transition:color .15s}
nav a:hover{color:var(--blue)}

/* The page itself. */
main{flex:1;width:100%;max-width:848px;margin:0 auto;padding:56px 24px 72px}
.meta{font-size:14px;color:var(--muted)}
main > h1 + .meta{margin-bottom:28px}

/* The opening of the home and disconnected pages, centered. */
.hero{text-align:center;max-width:680px;margin:8px auto 48px}
.hero h1{margin-bottom:16px}
.eyebrow{font-weight:600;color:var(--blue);margin:0 0 10px}
.lede{font-size:21px;line-height:1.45;color:var(--body);margin:0 auto 28px;max-width:34em;text-wrap:balance}
.cta-row{display:flex;flex-direction:column;align-items:center;gap:12px;margin:0}
a.cta{display:inline-block;background:var(--blue);color:#fff;padding:12px 26px;border-radius:999px;text-decoration:none;
  font-weight:600;line-height:1.3;transition:background-color .15s}
a.cta:hover{background:var(--blue-deep);color:#fff}

/* White cards on the paper. At most three to a page, and never one inside
   another. */
.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:40px 48px;margin:0 0 24px}
.card > :first-child{margin-top:0}
.card > :last-child,.card > div > :last-child{margin-bottom:0}
.card .meta{font-size:17px;color:var(--body)}
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:16px 48px}
.two-up h2{margin-top:0}
/* A document, such as the privacy policy, on one card. */
.prose h2{margin-top:44px}
.prose h2:first-child{margin-top:0}

footer.site{border-top:1px solid var(--rule)}
footer.site .inner{max-width:848px;margin:0 auto;padding:32px 24px 44px;display:flex;align-items:flex-start;gap:28px;
  font-size:14px;line-height:1.6;color:var(--muted)}
footer.site img{flex:none;width:110px;height:40px}
footer.site p{margin:0}
footer.site a{color:var(--muted)}
footer.site a:hover{color:var(--blue)}

code{background:#eef2f6;padding:1px 5px;border-radius:4px;font-size:.88em}

/* Phones. */
@media (max-width:640px){
  header.site .bar{padding:10px 16px}
  .brand{font-size:14px}
  nav{width:100%;gap:20px;padding-left:36px}
  main{padding:36px 16px 48px}
  h1{font-size:28px}
  .hero{margin-bottom:36px}
  .lede{font-size:17px;line-height:1.55}
  .card{padding:28px 22px}
  .two-up{grid-template-columns:1fr;gap:28px}
  footer.site .inner{flex-direction:column;gap:14px;padding:28px 16px 40px}
}