/* One header and one footer on every page (audit 2026-09-27, items 1, 2, 6). Moved here unchanged from landing.css
   (the tonyrobbins.com port: header measured 2026-09-19, footer measured 2026-09-20) so the home page and every inner page
   share them. Added: the footer's column headings (the side column's heading, in the side text's grey), the one-button
   checkout forms, and the resets the inner pages need (app.css does not reset lists or paragraphs). */

/* Announcement bar: the reference's height (32 px), white bold text on deep purple (contrast 7:1). */
.announce { background: #5b2a8a; color: #fff; text-align: center; min-height: 32px; display: flex; align-items: center; justify-content: center; padding: 6px var(--gutter); font-family: var(--font-sans); font-weight: var(--fw-semi); font-size: 14px; line-height: 1.3; }
.announce p { margin: 0; }

/* Header: sticky, solid, no change on scroll (measured on the reference). */
.site-header { position: sticky; top: 0; z-index: var(--nav-z); background: var(--canvas); color: #fff; font-family: var(--font-sans); }
.site-header .header-row { height: var(--nav-h); display: flex; align-items: center; justify-content: space-between; gap: var(--stack); }
.site-header .wordmark { font-family: var(--font-sans); font-weight: var(--fw-medium); letter-spacing: .18em; text-transform: uppercase; font-size: var(--fs-sm); text-decoration: none; white-space: nowrap; color: #fff; }
.main-nav { display: none; gap: 32px; }
.main-nav a, .site-header .header-link { font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: var(--fw-regular); text-decoration: none; color: #fff; transition: opacity var(--dur) var(--ease); white-space: nowrap; }
.main-nav a:hover, .site-header .header-link:hover { opacity: var(--hover-fade); }
.site-header .header-right { display: flex; align-items: center; gap: 16px; }
.site-header .header-right .header-link, .site-header .header-right .lang-select, .site-header .header-right .header-link-wrap { display: none; }
.burger { width: 40px; height: 40px; border: 0; background: none; display: grid; place-content: center; gap: 5px; cursor: pointer; padding: 0; }
.burger span { display: block; width: 22px; height: 2px; background: #fff; }
.mobile-nav { display: none; flex-direction: column; align-items: flex-start; gap: 18px; padding: var(--stack) var(--gutter) calc(var(--stack) * 2); border-top: 1px solid var(--hairline-dark); font-family: var(--font-sans); font-size: var(--fs-md); }
.mobile-nav.is-open { display: flex; }
.mobile-nav a { text-decoration: none; color: #fff; }
.mobile-nav .lang-select { margin-top: 6px; }
@media (min-width: 1024px) { .main-nav { display: flex; } .site-header .header-right .header-link, .site-header .header-right .lang-select, .site-header .header-right .header-link-wrap { display: inline-flex; } .burger, .mobile-nav { display: none !important; } }
/* Very small phones (320): the longer button text in es/pt must fit beside the burger (2026-09-27). */
@media (max-width: 359px) { .site-header .header-row { gap: 10px; } .site-header .header-right { gap: 6px; } .site-header .wordmark { letter-spacing: .1em; } .site-header .pill-small { padding-inline: 12px; } }
/* The pill in the header is the reference's white pill on black, on every page. */
.site-header .pill { background: var(--btn-fill); color: var(--btn-ink); border-color: var(--btn-fill); }
.site-header .pill:hover { background: var(--btn-fill-hover); }
/* "Get the kit" is a one-button form posting to /checkout (item 15); "Sign out" too. */
.buy-form { display: inline-flex; margin: 0; }
button.as-link { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; }
.mobile-nav .as-link { font-size: var(--fs-md); color: #fff; }

.lang-select { display: inline-flex; align-items: center; margin: 0; }
.lang-select select { appearance: none; -webkit-appearance: none; background: transparent; color: inherit; border: 1px solid rgba(255,255,255,.35); border-radius: var(--r-pill); padding: 8px 30px 8px 14px; font-family: var(--font-sans); font-size: var(--fs-sm); cursor: pointer; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='white' stroke-width='1.5'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; transition: border-color var(--dur) var(--ease); }
.lang-select select:hover { border-color: rgba(255,255,255,.8); }
.lang-select select option { color: #0b0a0a; }
.site-header label.lang-select, .site-footer label.lang-select { color: #fff; gap: 0; }

/* Footer: the reference's, measured 2026-09-20. Hairline, 80 px top, five 266 px columns (gap 16): links across four, a text column on the right; bottom row: language left, legal centre. Phone: two link columns, blocks stacked, 40/20 px. */
.site-footer { background: var(--canvas); color: #fff; font-family: var(--font-sans); margin: 0; padding: 0; }
.site-footer p { margin: 0; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.footer-grid { display: grid; grid-template-columns: 1fr; column-gap: 16px; border-top: 1px solid var(--canvas-2); padding-top: var(--band-y); padding-bottom: var(--stack); }
.footer-cols { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; row-gap: 12px; }
.footer-col-h { font-family: var(--font-sans); font-weight: var(--fw-medium); font-size: .92rem; line-height: 1.5; color: rgba(255,255,255,.4); margin-bottom: 16px !important; }
.footer-links { font-family: var(--font-sans); font-size: 1rem; line-height: 1.5; font-weight: var(--fw-medium); }
.footer-links li { break-inside: avoid; margin-bottom: 16px; }
.footer-links a { text-decoration: none; color: #fff; transition: opacity var(--dur) var(--ease); }
.footer-links a:hover { opacity: var(--hover-fade); }
.footer-links .footer-also { font-size: .92rem; font-weight: var(--fw-regular); color: rgba(255,255,255,.4); }
.footer-side { border-top: 1px solid var(--canvas-2); margin-top: 8px; padding-top: 24px; font-size: .92rem; line-height: 1.5; }
.footer-side-h { font-family: var(--font-sans); font-weight: var(--fw-medium); margin-bottom: 8px !important; }
.footer-side-h a { text-decoration: none; }
.footer-side-p { color: rgba(255,255,255,.4); max-width: 320px; margin-bottom: 30px !important; }
.footer-bottom { display: grid; gap: 16px; margin-top: 8px; }
.footer-lang .lang-select select { border: 0; padding-left: 0; font-size: 1rem; background-position: right 8px center; }
.footer-legal { font-size: .92rem; line-height: 1.5; }
.footer-legal p:first-child { display: flex; flex-wrap: wrap; gap: 8px 32px; }
.footer-legal a { text-decoration: none; }
.footer-legal p + p { margin-top: 8px; color: rgba(255,255,255,.4); }
@media (min-width: 768px) {
  .footer-grid { grid-template-columns: repeat(4, 1fr); padding-top: var(--band-y-lg); padding-bottom: var(--band-y-lg); }
  .footer-cols { grid-column: 1 / -1; grid-template-columns: repeat(4, 1fr); }
  .footer-side { grid-column: 1 / 3; border-top: 0; margin-top: 24px; padding-top: 0; }
  .footer-bottom { grid-column: 1 / -1; grid-template-columns: subgrid; margin-top: calc(var(--band-y-lg) - 16px); align-items: start; }
  .footer-lang { grid-column: 1; }
  .footer-legal { grid-column: 2 / 4; }
}
@media (min-width: 1200px) { .footer-grid { grid-template-columns: repeat(5, 1fr); } .footer-cols { grid-column: 1 / 5; } .footer-side { grid-column: 5; margin-top: 0; } }