/*
 * pages.css: the design's own styling, as classes. The export styled every element inline; the
 * build (.claude/skills/reblock_site/build.py, sources in .reblock/src) moved each style attribute
 * into a class rule below, verbatim. This head holds what the export set outside its elements:
 *   1. The pages' own <style> blocks, per page through body classes (lb-page-home, lb-page-legal).
 *   2. The wrappers the templates draw (the export's <main class="lau"> and <div class="lau">).
 * Fixes for block markup are at the end of the file.
 */

/* 1. The pages' <style> blocks ------------------------------------------------------------- */

/* Every page. */
body {
	margin: 0;
	background: var(--surface);
}

/* index.html: links take the text colour; the questions open with a turning plus. Written with
   :where() so the design's inline link styles (now classes) still win, as they did. */
:where(body.lb-page-home) a {
	color: inherit;
}

:where(body.lb-page-home) a:focus-visible,
:where(body.lb-page-home) summary:focus-visible {
	outline: 3px solid var(--focus);
	outline-offset: 3px;
}

:where(body.lb-page-home) summary {
	cursor: pointer;
	list-style: none;
}

:where(body.lb-page-home) summary::-webkit-details-marker {
	display: none;
}

:where(body.lb-page-home) details[open] summary .plus {
	transform: rotate(45deg);
}

:where(body.lb-page-home) .plus {
	transition: transform .2s ease;
}

/* privacy.html and terms.html (and every page without a design of its own): indigo links. */
:where(body.lb-page-legal) a {
	color: var(--action);
}

:where(body.lb-page-legal) a:hover {
	color: var(--action-pressed);
}

:where(body.lb-page-legal) a:focus-visible {
	outline: 3px solid var(--focus);
	outline-offset: 3px;
}

/* The legal text's <strong style="font-weight: 600">: a block's rich text keeps no inline style. */
.lb-legal strong {
	font-weight: 600;
}

/* 2. The templates' wrappers ---------------------------------------------------------------- */

/* index.html: <main data-theme="light" class="lau" style="…">. Light is already the :root theme. */
.lb-main {
	box-sizing: content-box;
	background: var(--surface);
	color: var(--ink);
	font-family: var(--font-sans);
	overflow-x: clip;
}

/* privacy.html, terms.html: <div data-theme="light" class="lau" style="…"> around header, main
   and footer. */
.lb-shell {
	box-sizing: content-box;
	background: var(--surface);
	color: var(--ink);
	font-family: var(--font-sans);
}

/* ==== The design's inline styles, as classes (written by build.py from .reblock/src) ==== */

/* home-hero */
.lau .lb-hero{box-sizing:content-box;background: var(--field);color: var(--on-field);overflow: hidden;padding: 28px clamp(20px, 5vw, 64px) 0}
.lau .lb-hero__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto}
.lau .lb-0a7797{display: flex;align-items: center;min-height: 44px}
.lau .lb-80dbfb{height: 34px;width: auto;display: block}
.lau .lb-hero__row{box-sizing:content-box;display: flex;flex-wrap: wrap;align-items: stretch;gap: 48px 40px;padding-top: clamp(32px, 5vw, 56px)}
.lau .lb-hero__copy{box-sizing:content-box;flex: 1.2 1 400px;min-width: 0;align-self: center;padding-bottom: clamp(16px, 4vw, 72px)}
.lau .lb-hero__title{margin: 0 0 24px;font-size: clamp(40px, 4.4vw, 68px);line-height: 1.08;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-hero__lede{margin: 0 0 32px;max-width: 540px;font-size: clamp(20px, 1.8vw, 23px);line-height: 1.42;font-weight: 300}
.lau .lb-hero__cta{box-sizing:content-box;display: flex;flex-wrap: wrap;align-items: center;gap: 16px 24px}
.lau .lb-f4eeb2,.lau .lb-f4eeb2:hover{display: inline-block;line-height: 0;flex: none}
.lau .lb-8699aa{height: 56px;width: auto;display: block}
.lau .lb-hero__price{margin: 0;font-size: 17px;line-height: 22px;font-weight: 600}
.lau .lb-d7b052{flex: 1 1 360px;min-width: 0;position: relative;height: 680px;max-width: 600px}
.lau .lb-c343bd{position: absolute;right: 2%;top: 0;width: 290px;height: 680px;color: var(--ink);box-sizing: border-box;border: 8px solid var(--lau-ink);border-bottom-width: 0;border-radius: 46px 46px 0 0;background: var(--surface);overflow: hidden;box-shadow: var(--shadow-card)}
.lau .lb-c0eabc{zoom: 0.7;width: 391px;padding: 56px 24px 0;box-sizing: border-box}
.lau .lb-9a9824{margin: 0 0 24px;font-size: 40px;line-height: 44px;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-353e1f{margin: 0 0 12px 8px;font-size: 22px;line-height: 28px;font-weight: 600}
.lau .lb-38df73{margin-bottom: 24px}
.lau .lb-ffc73a{margin: 24px 0 12px 8px;font-size: 22px;line-height: 28px;font-weight: 600}
.lau .lb-f70876{color: var(--action)}
.lau .lb-fa080d{position: absolute;left: -14%;bottom: 0;width: clamp(440px, 122%, 700px);aspect-ratio: 1 / 1;transform: translateY(20%)}

/* home-features */
.lau .lb-features{box-sizing:content-box;padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 64px)}
.lau .lb-features__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto}
.lau .lb-features__title{margin: 0 0 16px;max-width: 760px;font-size: clamp(34px, 3.8vw, 52px);line-height: 1.1;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-features__lede{margin: 0 0 clamp(40px, 5vw, 64px);max-width: 620px;font-size: 20px;line-height: 28px;font-weight: 300}
.lau .lb-features__grid{box-sizing:content-box;display: grid;grid-template-columns: repeat(auto-fit, minmax(max(280px, calc(33.34% - 40px)), 1fr));gap: 48px 40px}
.lau .lb-feature{box-sizing:content-box;color: var(--action)}
.lau .lb-59fcde{width: 32px;height: 32px;display: block;margin-bottom: 16px}
.lau .lb-feature__title{margin: 0 0 6px;color: var(--ink);font-size: 22px;line-height: 28px;font-weight: 600}
.lau .lb-feature__text{margin: 0;color: var(--ink-muted);font-size: 17px;line-height: 25px;font-weight: 300}

/* home-research */
.lau .lb-research{box-sizing:content-box;background: var(--field);color: var(--on-field);padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 64px)}
.lau .lb-research__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto;display: flex;flex-wrap: wrap;gap: 48px clamp(40px, 6vw, 96px);align-items: flex-start}
.lau .lb-research__head{box-sizing:content-box;flex: 1 1 380px;min-width: 0}
.lau .lb-research__title{margin: 0 0 24px;font-size: clamp(34px, 3.8vw, 52px);line-height: 1.12;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-research__lede{margin: 0;max-width: 460px;font-size: 20px;line-height: 28px;font-weight: 300}
.lau .lb-research__list{box-sizing:content-box;flex: 1.3 1 460px;min-width: 0;display: flex;flex-direction: column}
.lau .lb-research__q1{box-sizing:content-box;padding: 0 0 28px;border-bottom: 1px solid var(--lau-wing)}
.lau .lb-research__finding{margin: 0 0 8px;font-size: clamp(20px, 2vw, 24px);line-height: 1.35;font-weight: 300}
.lau .lb-81def8,.lau .lb-81def8:hover{font-size: 15px;line-height: 22px;font-weight: 600}
.lau .lb-research__q2{box-sizing:content-box;padding: 28px 0;border-bottom: 1px solid var(--lau-wing)}
.lau .lb-research__q3{box-sizing:content-box;padding: 28px 0 0}

/* home-onoff */
.lau .lb-onoff{box-sizing:content-box;padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 64px)}
.lau .lb-onoff__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto;display: flex;flex-wrap: wrap;gap: 48px clamp(40px, 6vw, 96px);align-items: center}
.lau .lb-onoff__head{box-sizing:content-box;flex: 1 1 360px;min-width: 0}
.lau .lb-onoff__title{margin: 0 0 16px;font-size: clamp(34px, 3.8vw, 52px);line-height: 1.12;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-onoff__lede{margin: 0;max-width: 460px;font-size: 20px;line-height: 28px;font-weight: 300}
.lau .lb-996de8{flex: 1.4 1 480px;min-width: 0;display: flex;flex-wrap: wrap;justify-content: center;gap: 24px}
.lau .lb-8989e0{zoom: 0.66;flex: none}
.lau .lb-57a35d{box-sizing: border-box;text-align: center}

/* home-pricing */
.lau .lb-pricing{box-sizing:content-box;background: var(--band);padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 64px)}
.lau .lb-pricing__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto;display: flex;flex-wrap: wrap;gap: 48px clamp(40px, 6vw, 96px);align-items: flex-start}
.lau .lb-pricing__head{box-sizing:content-box;flex: 1 1 360px;min-width: 0}
.lau .lb-pricing__title{margin: 0 0 16px;font-size: clamp(34px, 3.8vw, 52px);line-height: 1.12;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-pricing__offer{margin: 0 0 8px;font-size: 22px;line-height: 28px;font-weight: 600}
.lau .lb-pricing__note{margin: 0;max-width: 420px;font-size: 20px;line-height: 28px;font-weight: 300}
.lau .lb-94bc0d{flex: 1.3 1 480px;min-width: 0}
.lau .lb-a5b2a9{padding: 4px 8px;border-bottom: 1px solid var(--hairline)}
.lau .lb-5b751a{display: flex;justify-content: space-between;align-items: center;gap: 16px;min-height: 56px;font-size: 17px;line-height: 22px;font-weight: 600}
.lau .lb-28484b{font-size: 24px;font-weight: 300}
.lau .lb-7c1e62{margin: 0 0 16px;color: var(--ink-muted);font-size: 17px;line-height: 25px;font-weight: 300}
.lau .lb-47dcb6{padding: 4px 8px}

/* home-close */
.lau .lb-close{box-sizing:content-box;background: var(--field);color: var(--on-field);padding: clamp(56px, 7vw, 88px) clamp(20px, 5vw, 64px) 32px;text-align: center}
.lau .lb-close__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto;display: flex;flex-direction: column;align-items: center}
.lau .lb-b6d9d4{width: min(320px, 76vw);aspect-ratio: 1 / 1;margin-bottom: 16px}
.lau .lb-close__title{margin: 0 0 24px;font-size: clamp(44px, 5.6vw, 76px);line-height: 1.06;font-weight: 600;letter-spacing: -0.03em}
.lau .lb-d5ecff,.lau .lb-d5ecff:hover{display: inline-block;line-height: 0;flex: none;margin-bottom: 16px}
.lau .lb-close__price{margin: 0 0 clamp(56px, 7vw, 88px);font-size: 17px;line-height: 22px;font-weight: 600}
.lau .lb-8fe8d3{width: 100%;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;gap: 16px 32px;padding-top: 24px;border-top: 1px solid var(--lau-wing);font-size: 15px;line-height: 20px;font-weight: 300}
.lau .lb-4bccab{height: 26px;width: auto;display: block}
.lau .lb-7cdb22{display: flex;flex-wrap: wrap;gap: 8px 24px}

/* header */
.lau .lb-legal-head{box-sizing:content-box;background: var(--band);padding: 28px clamp(20px, 5vw, 64px) clamp(48px, 6vw, 72px)}
.lau .lb-legal-head__in{box-sizing:content-box;max-width: 1240px;margin: 0 auto}
.lau .lb-96187d,.lau .lb-96187d:hover{display: inline-block;line-height: 0}
.lau .lb-legal-head__titles{box-sizing:content-box;max-width: 720px;margin: clamp(48px, 6vw, 72px) auto 0}
.lau .lb-legal-head__h1{margin: 0 0 24px;font-size: clamp(40px, 4.4vw, 60px);line-height: 1.08;font-weight: 600;letter-spacing: -0.03em}

/* privacy-header */
.lau .lb-legal-head__date{margin: 0;color: var(--ink-muted);font-size: 17px;line-height: 25px;font-weight: 300}

/* privacy-body */
.lau .lb-legal-main{box-sizing:content-box;padding: clamp(40px, 5vw, 64px) clamp(20px, 5vw, 64px) clamp(64px, 8vw, 104px)}
.lau .lb-legal{box-sizing:content-box;max-width: 720px;margin: 0 auto;font-size: 18px;line-height: 28px;font-weight: 300}
.lau .lb-legal__p{margin: 0 0 16px}
.lau .lb-legal__h2{margin: 48px 0 12px;font-size: 26px;line-height: 32px;font-weight: 600;letter-spacing: -0.01em}
.lau .lb-legal__ul{margin: 0 0 16px;padding-left: 22px}
.lau .lb-legal__li{margin-bottom: 10px}
.lau .lb-legal__p-last{margin: 0}

/* footer */
.lau .lb-0efeea{background: var(--band);padding: 24px clamp(20px, 5vw, 64px)}
.lau .lb-a2379f{max-width: 1240px;margin: 0 auto;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;gap: 16px 32px;font-size: 15px;line-height: 20px;font-weight: 300}
.lau .lb-024eb5,.lau .lb-024eb5:hover{color: var(--ink)}

/* ==== Block markup fixes ==== */

/* The build gives block wrappers the browser's content-box (the default of the export's divs);
   inside .lau the design's own `.lau *{box-sizing:border-box}` applies, so they are border-box. */
.lau .wp-block-group {
	box-sizing: border-box;
}

/* The footer part inside the inner pages' wrapper gets no box of its own (as at the top level). */
.lb-shell > .wp-block-template-part {
	display: contents;
}

/* Pages without a design: the post title is the band's h1 (the legal pages' h1 rule above), the
   text the legal column's type; WordPress's own blocks get the legal paragraph spacing. */
.lb-legal .entry-content > * {
	margin-block: 0 16px;
}

.lb-legal .entry-content > h2 {
	margin: 48px 0 12px;
	font-size: 26px;
	line-height: 32px;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.lb-legal .entry-content > :last-child {
	margin-bottom: 0;
}

/* A page shorter than the screen (the 404, a short post) keeps the footer at the bottom: the
   wrapper fills the screen (port.css makes .wp-site-blocks a flex column) and its main grows. Its
   children carry no margins, so taller pages (privacy, terms) do not change. */
.wp-site-blocks > .lb-shell {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
}

.lb-shell > main,
.lb-shell > .lb-canvas > main {
	flex: 1 0 auto;
}

/* The Design canvas: the page's blocks (header band, main) sit in core/post-content's div, which
   gets no box of its own, so they stand in the wrapper as the template's did. */
.lb-shell > .lb-canvas {
	display: contents;
}
