/*
 * LoveCannabis.com V2: the only CSS not taken unchanged from Nano. main.css and tokens.css are untouched production copies.
 * Every value comes from a Nano token or matches an existing Nano component value.
 */

/* Header: logo left, theme toggle + one CTA right. The simplified header has no drawer, so Nano's header toggle
   (hidden below 1024px in main.css, because there it lives in the drawer) is shown at every width. */
.site-header .theme-toggle--header { display: inline-flex; }
.header-actions { gap: var(--sp-3); }
.header-cta {
	min-height: 2.5rem;
	padding-inline: 1.25rem;
	border-color: currentColor;
	color: inherit;
}
.has-transparent-header .header-cta:hover { background: #fff; border-color: #fff; color: var(--c-ink); }
/* Inner pages (privacy) have Nano's solid header: the CTA fills with the foreground colour on hover. */
body:not(.has-transparent-header) .header-cta:hover { background: var(--c-fg); border-color: var(--c-fg); color: var(--c-bg); }
@media (max-width: 599px) {
	.site-header__inner { gap: var(--sp-3); }
	.header-actions { gap: var(--sp-1); }
	.header-cta { padding-inline: var(--sp-4); }
}

/* Brand statement: centred, compact, readable measure. */
.statement { padding-block: clamp(4rem, 3rem + 3vw, 6rem); text-align: center; }
.statement__inner { display: grid; justify-items: center; }
.statement .eyebrow { margin-bottom: var(--sp-4); }
.statement__title {
	max-width: 22ch;
	font-size: var(--fs-2xl);
	font-weight: 700;
	line-height: 1.04;
	letter-spacing: -0.032em;
	text-wrap: balance;
}
.statement__text {
	max-width: 36rem;
	margin-top: var(--sp-5);
	font-size: var(--fs-md);
	line-height: 1.65;
	color: var(--c-fg-2);
}
.statement .button { margin-top: var(--sp-6); }
/* V3: two paragraphs, grouped at the same reading width and spaced with Nano's --sp-4. */
.statement__body { display: grid; gap: var(--sp-4); max-width: 36rem; margin-top: var(--sp-5); }
.statement__body .statement__text { margin-top: 0; }
/* V4: paragraphs widened to a ~620px measure (38.75rem); on narrower screens they still fill the container width. */
.statement__body { max-width: 38.75rem; }
.statement__body .statement__text { max-width: none; }
/* V4: "Really" is emphasised with an underline only. The <em> is not italicised. A 3px underline in the heading colour
   (near-black in light mode, near-white in dark mode) follows the word at every width and doesn't affect layout. */
.statement__em {
	font-style: normal;
	text-decoration-line: underline;
	text-decoration-thickness: 3px;
	text-decoration-color: currentColor;
	text-underline-offset: 0.12em;
}

/* Footer: brand left, two links right, copyright below. Link styling matches Nano's .site-footer__col a. */
.site-footer__inner { align-items: center; }
.site-footer__links ul { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-6); margin: 0; padding: 0; list-style: none; }
.site-footer__links a {
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--c-fg);
	text-decoration: none;
}
.site-footer__links a:hover { text-decoration: underline; text-underline-offset: 3px; }
.site-footer__legal { padding-top: var(--sp-5); border-top: 1px solid var(--c-border); }

/* Hero supporting text is balanced so it never leaves a one-word last line. (V5: the V2–V4 lockup scaling for
   "High Grade Only." is removed; "Grow Better." uses Nano's original hero size, as on V1 / LCS.) */
.hero__text { text-wrap: balance; }

/* V3: privacy page. Uses Nano's solid header and its .entry / .container--content content styles. */
.entry__meta { margin-bottom: var(--sp-6); font-size: var(--fs-sm); color: var(--c-muted); }

/* V5.1: light/dark switcher deactivated in the public interface (capability kept).
   Switch: <html data-theme-switcher="off"> in index.html and privacy/index.html. While it is "off":
   - the toggle is display:none, so it is not shown, focusable or announced, and leaves no gap;
   - the head boot script and site.js skip theme-mode, so the page always renders data-theme="light".
   To re-enable: set data-theme-switcher="on" in both pages. Nano's dark tokens and toggle markup are unchanged. */
html[data-theme-switcher="off"] .theme-toggle { display: none; }
/* V5.1: header CTA stays on one line. Below 360px, logo + CTA can't share one line, so the label wraps as before
   rather than causing horizontal scroll. */
@media (min-width: 360px) {
	.header-cta { white-space: nowrap; }
}
