/* Site header and footer shared by the homepage and the public pages (about, FAQ, pricing, privacy, terms, why phrase-first, start, start-preview).
   Loaded after marketing-launch.css. Colours are fixed here rather than taken from each page's own palette, so the header and footer look identical everywhere.
   The header and footer use the homepage's page width on every page, so the logo and menu never move between pages. */
/* The width and side padding are set here too, so a page without the homepage's own container rule (/start, /start-preview) gets the same header and footer. */
.site-header .container,.site-footer .container{box-sizing:border-box;max-width:1400px;margin-left:auto;margin-right:auto;padding-left:32px;padding-right:32px}
@media(max-width:620px){.site-footer .container{padding-left:20px;padding-right:20px}}

/* ===== Header: Account as a plain link, dark Add to Chrome always shown on desktop (900px and up) ===== */
.nav-links .nav-install{display:inline-flex;align-items:center;min-height:38px;padding:6px 16px 7px;border-radius:999px;background:#1a1614;color:#faf6ee!important;font-weight:500;line-height:1.2;transition:background .2s ease}
.nav-links .nav-install:hover{background:#a8392a}
/* Install buttons carry Google's Chrome logo, unaltered, left of the text (owner decision 19 Oct; see SOURCES.md). Sized as on buttons-preview.html. */
.th-chrome{display:block;flex:none;width:1.05em;height:1.05em}
/* Install buttons always lay the logo and the words out in one centred row, so a page or section rule that changes how its links display cannot stack the logo above the words. */
.cta.desktop-install{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.desktop-install{gap:8px}
.nav-links .nav-install .th-chrome{width:18px;height:18px}
@media(max-width:960px){.nav-links a.nav-account{display:inline}.nav-links a.nav-install{display:inline-flex}}
@media(max-width:899.98px){.nav-links a.nav-install{display:none}}
@media(max-width:900px){.site-header .navbar{padding-left:32px;padding-right:32px}}
@media(max-width:620px){.site-header .navbar{padding-left:20px;padding-right:20px}}

/* ===== Footer: the apps line sits under the tagline; normal footer margins, legal lines closer together ===== */
.site-footer{padding:36px 0 32px}
.footer-grid{row-gap:18px}
.footer-brand-text{display:flex;flex-direction:column;gap:2px}
.footer-apps{font-size:13px;color:#6f655f}
.site-footer .legal{margin-top:0}
@media(max-width:620px){.site-footer{padding:26px 0 22px}}