/* Figma-only design tokens with no equivalent in reset.css yet.
   Populated incrementally per component as it's hygiened against the Figma
   canonical — see .local/figma-canonical-cache.json. Never redeclare a value
   that already exists in reset.css's :root; reuse that var instead.

   Everything below the GENERATED marker is produced from
   .local/scripts/design-tokens-map.json by the boilerplate's
   generate-design-tokens-css.ts — never hand-edit that block, edit the JSON
   and regenerate instead. */

/* Canonical color/gradient tokens — moved here from css/libraries/reset.css's
   main :root 2026-08-18 (AGENTS.md > Gotchas). This is this project's source
   of truth for these colors; reset.css's "Legacy Root" now aliases its
   exact-value duplicates to var(--name) pointing back at this block instead
   of re-declaring them. LOAD ORDER: this file must be enqueued BEFORE
   reset.css (includes/queue.php — 'reset' is registered with a dependency on
   'theme') or those var() aliases resolve to nothing at first paint. This
   section is hand-authored, not generated — never move it inside the
   GENERATED:design-tokens-map markers below. */
:root {
	--white: #FFFFFF;
	--light-gray-1: #F6F8F9;
	--light-gray-2: #E2E6EB;
	--gray: #A3A3A3;
	--light-blue: #E4EDF1;
	--light-lavender: #D9E0FB;
	--lavander: #7183FF;
	--red: #ED565A;
	--green: #25BD9B;
	--paragraph: #636587;
	--paragraph-o-25: #63658740;
	--header-2: #242954;
	--header-2-o-50: #84879c;
	--black: #1B212B;
	--gradient-blue: linear-gradient(90deg, #35578F 0%, #11203F 100%);
	--gradient-red: linear-gradient(180deg, rgba(237, 86, 90, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%);
	--gradient-button: linear-gradient(90deg, #FF0031 0%, #FF9E80 100%);
	--gradient-lavender: linear-gradient(180deg, rgba(171, 185, 240, 0.50) -17.54%, rgba(217, 217, 217, 0.00) 100%);
	--gradient-pricing: linear-gradient(90deg, #35578F 1.2%, #11203F 99.79%);
	--medium-lavender: #ABB9F0;
	--text-base-color: var(--paragraph);
	--body-color: var(--white);
	--anim-transition: all .3s ease;
}

/* GENERATED:design-tokens-map:BEGIN — do not hand-edit, see design-tokens-map.json */

:root {
	--cards-black-background: #1F1F1E; /* Cards/Black Background */
	--cards-black-inside: #1C1C1C; /* Cards/Black Inside */
	--cards-black-inside-highlight: #2C2C2A; /* Cards/Black Inside Highlight */
	--cards-dark-gray-stroke: #343634; /* Cards/Dark Gray Stroke */
	--cards-gray-icon-text: #797973; /* Cards/Gray Icon & Text */
	--cards-light-red: #FF9295; /* Cards/Light Red */
	--cards-wine: #802A2C; /* Cards/Wine */
	--cards-icon-tile: #262625;
}

:root {
	--sf-pro-text: -apple-system,BlinkMacSystemFont,'Roboto',var(--font-roboto),Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	--sf-pro-display: -apple-system,BlinkMacSystemFont,'Roboto',var(--font-roboto),Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

/* Academy promotional banner title — no matching Figma Text Style */
.academy-banner-title,
.wp-block-blog-blocks-inline-banner h3,
.academy-site-banner .title {
	--ff: var(--sf-pro-text);
	--fs: 4rem;
	--lh: normal;
	--ls: -0.05em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Academy promotional banner supporting copy — no matching Figma Text Style */
.academy-banner-body,
.wp-block-blog-blocks-inline-banner .content > p,
.academy-site-banner .copy {
	--ff: var(--sf-pro-text);
	--fs: 1.8rem;
	--lh: 1.6667em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Hero heading (biggest heading on the page) — no matching Figma Text Style */
.sitio-header1 {
	--ff: var(--sf-pro-text);
	--fs: 4rem;
	--lh: 1.2em;
	--ls: -0.05em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}
@media only screen and (min-width: 64rem) {
	.sitio-header1 {
		--fs: 5.5rem;
		--lh: 1.0909em;
		--ls: -0.0727em;
	}
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-header1 {
	--ff: var(--sf-pro-text);
	--fs: 5.5rem;
	--lh: 1.09em;
	--ls: 0.072em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* forced mobile sizing, ignores viewport — edge cases only */
.mobile-sitio-header1 {
	--ff: var(--sf-pro-text);
	--fs: 4rem;
	--lh: 1.2em;
	--ls: -0.05em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Mid-page section heading — no matching Figma Text Style */
.sitio-header2,
.section-title h2,
.detail-content #faqs>h2 {
	--ff: var(--sf-pro-text);
	--fs: 2.4rem;
	--lh: 1.25em;
	--ls: -0.0833em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}
@media only screen and (min-width: 64rem) {
	.sitio-header2,
	.section-title h2,
	.detail-content #faqs>h2 {
		--fs: 4rem;
		--lh: 1.25em;
		--ls: -0.05em;
	}
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-header2 {
	--ff: var(--sf-pro-text);
	--fs: 4rem;
	--lh: 1.25em;
	--ls: -0.05em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* forced mobile sizing, ignores viewport — edge cases only */
.mobile-sitio-header2 {
	--ff: var(--sf-pro-text);
	--fs: 2.4rem;
	--lh: 1.25em;
	--ls: -0.0833em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Card title / small emphasis heading — no matching Figma Text Style */
.sitio-header3 {
	--ff: var(--sf-pro-text);
	--fs: 2.4rem;
	--lh: 120%;
	--ls: -.1rem;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Card title / small emphasis heading (tighter letter-spacing variant of sitio-header3) — no matching Figma Text Style */
.sitio-header4 {
	--ff: var(--sf-pro-text);
	--fs: 2.4rem;
	--lh: 120%;
	--ls: -.2rem;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Kicker/overline before a Header1 or Header2 (the more common of two real desktop variants — used in both Hero and mid-page H2 groups) — no matching Figma Text Style */
.sitio-eyebrow,
.product-map .section-title p {
	--ff: var(--sf-pro-text);
	--fs: 1.2rem;
	--lh: 1.2em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}
@media only screen and (min-width: 64rem) {
	.sitio-eyebrow,
	.product-map .section-title p {
		--fs: 1.4rem;
		--lh: 1.2em;
		--ls: 0;
	}
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-eyebrow {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: 4.5714em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* forced mobile sizing, ignores viewport — edge cases only */
.mobile-sitio-eyebrow {
	--ff: var(--sf-pro-text);
	--fs: 1.2rem;
	--lh: 5.3333em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* Second real eyebrow variant, only line-height differs from sitio-eyebrow (AUTO vs 64px) — kept as its own token rather than merged, a real design inconsistency, not treated as one 'more correct' than the other — no matching Figma Text Style */
.sitio-eyebrow-alt,
:is(.section-title, .academy-integrations) .text-h1 {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-eyebrow-alt {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* Small caps item label (e.g. a short inline list of feature labels), distinct from the eyebrow — different letter-spacing/line-height shape — no matching Figma Text Style */
.sitio-label {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}
@media only screen and (min-width: 64rem) {
	.sitio-label {
		--fs: 1.6rem;
		--lh: AUTO;
		--ls: 0;
	}
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-label {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* forced mobile sizing, ignores viewport — edge cases only */
.mobile-sitio-label {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* Product Map step label — no matching Figma Text Style */
.product-map-label {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: 120%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* Product Map step subtitle — no matching Figma Text Style */
.product-map-subtitle {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 120%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Clickable topic/category label list (e.g. FAQ topic nav — 'Fit & setup', 'Comparisons', 'Budgets & profitability', 'Integrations & workflow') — no matching Figma Text Style */
.sitio-category {
	--ff: var(--sf-pro-text);
	--fs: 3.2rem;
	--lh: 120%;
	--ls: -0.0625em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}
@media only screen and (min-width: 64rem) {
	.sitio-category {
		--fs: 4rem;
		--lh: 120%;
		--ls: -0.05em;
	}
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-category {
	--ff: var(--sf-pro-text);
	--fs: 4rem;
	--lh: 120%;
	--ls: -0.05em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* forced mobile sizing, ignores viewport — edge cases only */
.mobile-sitio-category {
	--ff: var(--sf-pro-text);
	--fs: 3.2rem;
	--lh: 120%;
	--ls: -0.0625em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* FAQ accordion question (trigger heading) — no matching Figma Text Style */
.sitio-question {
	--ff: var(--sf-pro-display);
	--fs: 1.8rem;
	--lh: 1.4444em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}
@media only screen and (min-width: 64rem) {
	.sitio-question {
		--fs: 2.4rem;
		--lh: 1.0833em;
		--ls: 0;
	}
}

/* forced desktop sizing, ignores viewport — edge cases only */
.desktop-sitio-question {
	--ff: var(--sf-pro-display);
	--fs: 2.4rem;
	--lh: 1.0833em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* forced mobile sizing, ignores viewport — edge cases only */
.mobile-sitio-question {
	--ff: var(--sf-pro-display);
	--fs: 1.8rem;
	--lh: 1.4444em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Body text / card items (product-map) — Figma: Sitio/Paragraph1 */
.sitio-paragraph1,
.section-title p,
.detail-content #faqs>h2+p,
.detail-content #faqs h3,
.detail-content #faqs h3[itemprop="name"],
.detail-content #faqs p,
.detail-content #faqs li,
.detail-content #faqs div div,
.detail-content #faqs div[itemprop="text"] {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 2.6rem;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Client/partner logo caption (trust-bar logo strip, e.g. 'openstax', 'moma', 'playpass') — no matching Figma Text Style */
.sitio-caption-logo {
	--ff: var(--sf-pro-text);
	--fs: 1rem;
	--lh: 6.4em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Header nav bar wordmark / big nav item text (e.g. 'trackingtime.co', desktop nav sidebar page names 'Home', 'Product') — no matching Figma Text Style */
.sitio-nav-wordmark {
	--ff: var(--sf-pro-text);
	--fs: 4rem;
	--lh: AUTO;
	--ls: -0.05em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Feature-list item text (numbered step blurbs, e.g. '01 / Track — Hours arrive structured and ready to use.', also reused for some card labels like 'Time Tracker') — no matching Figma Text Style */
.sitio-feature-item {
	--ff: var(--sf-pro-text);
	--fs: 1.8rem;
	--lh: 1.4444em;
	--ls: -0.0556em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* CTA button label (e.g. 'Get started', 'Start for free', 'Read Our Story') — no matching Figma Text Style */
.sitio-cta,
:is(.wp-block-blog-blocks-inline-banner, .inline-banner) .text-bttn,
.academy-site-banner .cta {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 1.625em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Desktop footer link column text (e.g. 'DMCA Policy', 'Plans & Pricing', 'About Us') — no matching Figma Text Style */
.sitio-footer-link {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: 1.7143em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Desktop nav mega-menu dropdown column header (e.g. 'Company', 'Product') — no matching Figma Text Style */
.sitio-nav-dropdown-header {
	--ff: var(--sf-pro-text);
	--fs: 1.8rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Integrations list item name (e.g. 'Microsoft Teams', 'Asana', 'Slack', 'ClickUp') — no matching Figma Text Style */
.sitio-integrations-item {
	--ff: var(--sf-pro-display);
	--fs: 1.6rem;
	--lh: 1.875em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Product-dropdown link label (nav mega-menu product list, e.g. 'Time Tracker', 'Time Cards', 'Timesheets') — no matching Figma Text Style */
.sitio-product-link {
	--ff: var(--sf-pro-text);
	--fs: 1.2rem;
	--lh: 2.1667em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Blog article body copy (long-form paragraph text on Blog - Desktop pages) — no matching Figma Text Style */
.sitio-blog-body {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 162.5%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Mobile footer/nav column header (e.g. 'Company', 'Help', 'Downloads') — no matching Figma Text Style */
.sitio-column-header-mobile {
	--ff: var(--sf-pro-text);
	--fs: 2rem;
	--lh: 1.3em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Mobile footer link list text (e.g. 'About Us', 'Help Center', 'Developers', 'Blog') — no matching Figma Text Style */
.sitio-footer-link-mobile {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 1.625em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Heavy-weight inline emphasis / short body variant (e.g. 'check out +50 integrations', short testimonial-bio emphasis runs) — no matching Figma Text Style */
.sitio-emphasis {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 120%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Blog/article tag chip label (e.g. 'productivity', 'best practices', 'resources') — no matching Figma Text Style */
.sitio-blog-tag {
	--ff: var(--sf-pro-text);
	--fs: 1rem;
	--lh: 120%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Numbered step indicator (e.g. '01', '02', '03') — no matching Figma Text Style */
.sitio-step-number {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Blog card title (blog index/listing card heading, e.g. 'Legal Requirements for Time Tracking Across the World') — no matching Figma Text Style */
.sitio-blog-card-title {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 120%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Secondary mobile body/paragraph variant, smaller than sitio-paragraph1 (e.g. AutoTrack feature blurb copy) — no matching Figma Text Style */
.sitio-paragraph2-mobile {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: 1.5714em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Pricing comparison table row header (feature name column, e.g. 'Board, timeline, company-wide project view') — no matching Figma Text Style */
.sitio-pricing-header {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 4em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Sticky-bar small CTA button label ('Book a Demo', 'Ask your AI') — no matching Figma Text Style */
.sitio-sticky-cta {
	--ff: var(--sf-pro-text);
	--fs: 1.2rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Desktop footer link-column header (e.g. 'Company', 'Help', 'Downloads', 'Alternatives') — no matching Figma Text Style */
.sitio-footer-column-header {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Desktop footer 'Follow us!' social-block heading — no matching Figma Text Style */
.sitio-footer-follow-heading {
	--ff: var(--sf-pro-display);
	--fs: 1.6rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Desktop footer copyright + legal line ('© 2022 TrackingTime, LLC' / 'Privacy Policy | Terms & Conditions') — no matching Figma Text Style */
.sitio-footer-copyright {
	--ff: var(--sf-pro-display);
	--fs: 1.2rem;
	--lh: 1.3333em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Mobile footer copyright line ('© 2022 TrackingTime, LLC') — no matching Figma Text Style */
.sitio-footer-copyright-mobile {
	--ff: var(--sf-pro-text);
	--fs: 1rem;
	--lh: 3.6em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Mobile footer legal-links block ('Privacy Policy' / 'Terms & Conditions') — no matching Figma Text Style */
.sitio-footer-legal-mobile {
	--ff: var(--sf-pro-display);
	--fs: 1.2rem;
	--lh: 140%;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Language-selector button label ('English') — footer and header alike — no matching Figma Text Style */
.sitio-lang-button {
	--ff: var(--sf-pro-display);
	--fs: 1.2rem;
	--lh: AUTO;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Pricing comparison table row body/detail text (plan-specific detail under a feature row, e.g. '(fixed-fee only)', '+add-on') — no matching Figma Text Style */
.sitio-pricing-body {
	--ff: var(--sf-pro-text);
	--fs: 1.6rem;
	--lh: 4em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* Small subtitle line under a title (team-grid card subtitle, e.g. 'Running both companies'); also the signature of nav dropdown item text — no matching Figma Text Style */
.sitio-subtitle {
	--ff: var(--sf-pro-text);
	--fs: 1.4rem;
	--lh: 1.8571em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* Larger subtitle/role line (team-grid bio role, e.g. 'co-founder') — no matching Figma Text Style */
.sitio-subtitle-lg {
	--ff: var(--sf-pro-text);
	--fs: 1.8rem;
	--lh: 1.4444em;
	--ls: 0;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: uppercase;
}

/* Team-grid bio (clicked state) person name, e.g. 'Eric Tulle' — no matching Figma Text Style */
.team-grid-bio-name {
	--ff: var(--sf-pro-text);
	--fs: 2.4rem;
	--lh: 1.0833em;
	--ls: -0.0417em;
	font-family: var(--ff);
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}

/* GENERATED:design-tokens-map:END */

/* Hand-authored companion to .sitio-header2's extraSelectors above — never
   move inside the GENERATED block. The generator has no font-weight
   emission at all (project rule: never a --fw custom property, see
   AGENTS.md > Gotchas > "Sistema de clases tipográficas"), but the
   section-title module's WYSIWYG <h2> fallback needs font-weight:300 to
   match Figma. Paired 2026-08-25 when the selector itself migrated onto
   extraSelectors (design-tokens-map.json > text.sitio-header2 > note). */
.sitio-header2,
.section-title h2 {
	font-weight: 300;
}