/* Individual commercial landing pages only. Nothing here is loaded on /. */
:root {
    /* Derive a neutral canvas from the existing white surface and charcoal text.
       This stylesheet is loaded only by the four individual landing templates. */
    --color-bg: var(--color-surface);
    --color-bg-alt: color-mix(in srgb, var(--color-text) 3%, var(--color-surface));
    --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
    --color-border-dark: color-mix(in srgb, var(--color-text) 20%, var(--color-surface));
    --color-text-inverse: var(--color-surface);
}
.lp-page { color: var(--color-text); }
.lp-page *, .lp-page *::before, .lp-page *::after { box-sizing: border-box; }
.lp-page .lp-wrap { width: min(1240px, calc(100% - 5rem)); margin-inline: auto; }
.lp-page h1, .lp-page h2 { font-weight: 600; letter-spacing: -0.052em; text-wrap: balance; }
.lp-page h1 { font-size: clamp(2.75rem, 4.8vw, 4.5rem); line-height: 1.04; margin: 0 0 1.6rem; }
.lp-page h1 em { display: block; color: var(--color-text-secondary); font-style: normal; }
.lp-page h2 { font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1.12; }
.lp-page h3 { font-size: 1.05rem; letter-spacing: -0.025em; line-height: 1.45; }
.lp-page p { color: var(--color-text-secondary); line-height: 1.75; }
.lp-page .lp-eyebrow { color: var(--color-accent-hover); font-size: 0.6875rem; letter-spacing: 0.12em; font-weight: 700; text-transform: uppercase; margin: 0 0 1.25rem; }
.lp-page .seo-breadcrumbs { width: min(1240px, calc(100% - 5rem)); max-width: none; padding: 112px 0 0; }
.lp-page .seo-breadcrumbs-list { font-size: 0.6875rem; flex-wrap: wrap; row-gap: 0.4rem; }
.lp-hero { padding: 2.75rem 0 3.5rem; }
.lp-hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.lp-hero-copy { min-width: 0; padding: 1rem 0; }
.lp-hero-copy > p:not(.lp-eyebrow):not(.lp-reassurance) { max-width: 540px; font-size: 1rem; line-height: 1.8; }
.lp-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem; margin-top: 1.9rem; }
.lp-actions .btn { min-height: 48px; border-radius: 6px; padding: 0.9rem 1.1rem; font-size: 0.8125rem; gap: 0.75rem; }
.lp-page .lp-text-link { display: inline-flex; align-items: center; gap: 0.6rem; color: inherit; text-decoration: none; font-size: 0.8125rem; font-weight: 600; }
.lp-text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
.lp-page .lp-reassurance { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 1rem; font-size: 0.625rem; }
.lp-reassurance i { color: var(--color-accent-hover); }
.lp-photo { position: relative; min-width: 0; height: 490px; border-radius: 12px; background: var(--color-bg-dark); margin: 0; overflow: hidden; }
.lp-photo > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-photo-stamp { position: absolute; top: 1.25rem; left: 1.25rem; width: 52px; height: 52px; display: grid; place-items: center; font-size: 1.7rem; border-radius: 50%; background: var(--color-bg); color: var(--color-text); }
.lp-photo figcaption { position: absolute; bottom: 1.25rem; left: 1.25rem; right: 1.25rem; padding: 1.1rem 1.25rem; border-radius: 6px; background: var(--color-bg); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.lp-photo figcaption strong { font-size: 1rem; font-weight: 600; letter-spacing: -0.03em; }
.lp-photo figcaption span { display: block; font-size: 0.625rem; color: var(--color-text-secondary); margin-top: 0.25rem; }
.lp-photo figcaption > i { color: var(--color-accent-hover); font-size: 1.5rem; flex-shrink: 0; }
.lp-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-block: 1.75rem 2.5rem; gap: 2rem; border-top: 1px solid var(--color-border); }
.lp-benefits > div { display: flex; gap: 0.9rem; align-items: center; }
.lp-benefits i { color: var(--color-accent-hover); font-size: 1.6rem; }
.lp-benefits strong { display: block; color: var(--color-text); font-size: 0.75rem; font-weight: 600; margin-bottom: 0.3rem; }
.lp-benefits span { color: var(--color-text-secondary); font-size: 0.6875rem; }
.lp-jump { border-block: 1px solid var(--color-border); background: var(--color-bg); }
.lp-jump .lp-wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.lp-jump-label { font-size: 0.625rem; color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: 0.08em; }
.lp-jump a { display: inline-flex; align-items: center; gap: 1rem; padding: 1.2rem 0; font-size: 0.75rem; color: var(--color-text); text-decoration: none; }
.lp-jump a:hover { color: var(--color-accent-hover); }
.lp-jump i { font-size: 0.8rem; }
.lp-page [id] { scroll-margin-top: 108px; }
.lp-section { padding: 6rem 0; }
.lp-section--soft { background: var(--color-bg-alt); }
.lp-section--dark { background: var(--color-bg-dark); color: var(--color-text-inverse); }
.lp-section--dark h2, .lp-section--dark h3 { color: inherit; }
.lp-section--dark p { color: color-mix(in srgb, var(--color-text-inverse) 70%, transparent); }
.lp-section--dark .lp-eyebrow, .lp-section--dark .lp-step-number { color: var(--color-accent); }
.lp-heading { display: grid; grid-template-columns: 1.2fr 0.8fr; align-items: end; gap: 4rem; margin-bottom: 3rem; }
.lp-heading h2 { max-width: 700px; }
.lp-heading > p { font-size: 0.9375rem; max-width: 420px; }
.lp-workflow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; }
.lp-workflow article { border-top: 1px solid color-mix(in srgb, var(--color-text-inverse) 25%, transparent); padding-top: 1.25rem; min-width: 0; }
.lp-step-number { font-size: 0.625rem; font-weight: 600; letter-spacing: 0.06em; display: flex; justify-content: space-between; margin-bottom: 1.5rem; }
.lp-step-number i { font-size: 1.15rem; }
.lp-workflow h3 { margin-bottom: 0.75rem; }
.lp-workflow p { font-size: 0.8125rem; }
.lp-capabilities { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 3rem; row-gap: 2.5rem; }
.lp-capabilities article { padding: 1.5rem 0 0; border-top: 1px solid var(--color-border-dark); }
.lp-capabilities article > i { display: block; color: var(--color-accent-hover); font-size: 1.5rem; margin-bottom: 1.1rem; }
.lp-capabilities h3 { margin-bottom: 0.65rem; }
.lp-capabilities p { font-size: 0.8125rem; }
.lp-capabilities a { color: inherit; text-underline-offset: 3px; }
.lp-proof-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: end; margin-bottom: 2.5rem; }
.lp-proof-intro > div > p:last-child { font-size: 0.9375rem; margin-top: 1.2rem; }
.lp-proof-intro ul { list-style: none; padding: 0; display: grid; gap: 0.8rem; }
.lp-proof-intro li { display: flex; gap: 0.7rem; color: var(--color-text-secondary); font-size: 0.8125rem; line-height: 1.7; }
.lp-proof-intro li i { color: var(--color-accent-hover); margin-top: 0.25rem; }
.lp-product-proof { padding: 0.45rem; border: 1px solid var(--color-border-dark); border-radius: 12px; background: var(--color-bg); box-shadow: 0 18px 40px color-mix(in srgb, var(--color-text) 6%, transparent); }
.lp-window-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.65rem 0.8rem 1rem; font-size: 0.625rem; color: var(--color-text-secondary); }
.lp-window-bar i { margin-right: 0.3rem; }
.lp-product-proof .la-screen { border-radius: 6px; box-shadow: none; }
.lp-product-proof .la-screen--hero .la-screen-link { max-height: none; }
.lp-product-proof .la-screen-sample { display: none; }
.lp-aside-proof { padding: 1.5rem; border: 1px solid var(--color-border); background: var(--color-bg-alt); border-radius: 12px; min-width: 0; }
.lp-aside-proof .la-screen img { min-width: 600px; max-width: none; }
.lp-aside-proof .la-screen { border-radius: 6px; box-shadow: var(--marketing-proof-shadow); }
.lp-aside-proof .la-screen-link { max-height: 320px; }
.lp-aside-proof .la-screen figcaption { display: none; }
.lp-aside-label { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-secondary); margin-bottom: 1.25rem; }
.lp-aside-proof > p { font-size: 0.6875rem; margin-top: 1rem; }
.lp-aside-points { margin-top: 1.25rem; display: grid; gap: 0.65rem; list-style: none; padding: 0; }
.lp-aside-points li { display: flex; gap: 0.6rem; align-items: center; font-size: 0.75rem; }
.lp-aside-points i { color: var(--color-accent-hover); }
.lp-migration { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 6rem; align-items: center; }
.lp-migration p { margin-top: 1.25rem; font-size: 0.9375rem; }
.lp-migration .lp-text-link { margin-top: 1.25rem; }
.lp-migration ol { list-style: none; counter-reset: migration; padding: 0; }
.lp-migration li { counter-increment: migration; display: grid; grid-template-columns: 2rem 1fr; gap: 1rem; border-top: 1px solid var(--color-border-dark); padding: 1.5rem 0; color: var(--color-text-secondary); font-size: 0.8125rem; line-height: 1.75; }
.lp-migration li::before { content: '0' counter(migration); font-size: 0.6875rem; color: var(--color-accent-hover); }
.lp-roles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; padding-top: 2rem; margin-top: 2.75rem; border-top: 1px solid var(--color-border); }
.lp-roles h3 { font-size: 0.8125rem; margin-bottom: 0.5rem; }
.lp-roles p { font-size: 0.75rem; }
.lp-faq { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 6rem; }
.lp-faq > div > p:not(.lp-eyebrow) { font-size: 0.875rem; margin: 1.25rem 0; }
.lp-accordion { border-top: 1px solid var(--color-border-dark); }
.lp-accordion details { border-bottom: 1px solid var(--color-border); }
.lp-accordion summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.3rem 0; cursor: pointer; font-size: 0.8125rem; font-weight: 600; list-style: none; }
.lp-accordion summary::-webkit-details-marker { display: none; }
.lp-accordion summary::after { content: '+'; color: var(--color-accent-hover); font-size: 1.2rem; font-weight: 400; }
.lp-accordion details[open] summary::after { content: '−'; }
.lp-accordion details > div { font-size: 0.8125rem; color: var(--color-text-secondary); line-height: 1.8; padding: 0 1rem 1.3rem 0; }
.lp-accordion a { color: inherit; text-underline-offset: 3px; }
.lp-related { border-top: 1px solid var(--color-border); padding: 2rem 0; }
.lp-related > div > div { display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; }
.lp-related a { color: var(--color-text); text-decoration: none; font-size: 0.75rem; }
.lp-related a:hover { text-decoration: underline; }
.lp-related a i { margin-left: 0.5rem; color: var(--color-accent-hover); }
.lp-final { background: var(--color-bg-dark); padding: 5rem 0; color: var(--color-text-inverse); }
.lp-final .lp-wrap { display: grid; grid-template-columns: 1.2fr 1fr; gap: 4rem; align-items: center; }
.lp-final h2 { color: inherit; }
.lp-final .lp-eyebrow { color: var(--color-accent); }
.lp-final p { color: color-mix(in srgb, var(--color-text-inverse) 72%, transparent); font-size: 0.875rem; margin-top: 1rem; }
.lp-final .lp-actions { margin-top: 0; }
.lp-final .lp-price-note { font-size: 0.625rem; }
.lp-price-note a { color: inherit; text-underline-offset: 3px; }
.lp-page a:focus-visible, .lp-page summary:focus-visible { outline: 2px solid var(--color-accent-hover); outline-offset: 5px; }
@media (max-width: 1000px) {
    .lp-page .lp-wrap, .lp-page .seo-breadcrumbs { width: calc(100% - 3rem); }
    .lp-hero-grid { gap: 2rem; }
    .lp-photo { height: 440px; }
    .lp-heading, .lp-proof-intro { gap: 2.5rem; }
    .lp-migration, .lp-faq { gap: 3rem; }
    .lp-capabilities { gap: 2rem; }
    .lp-jump-label { display: none; }
}
@media (max-width: 760px) {
    .lp-page .lp-wrap, .lp-page .seo-breadcrumbs { width: calc(100% - 2.5rem); }
    .lp-page .seo-breadcrumbs { padding-top: 98px; }
    .lp-hero { padding: 2rem 0; }
    .lp-hero-grid { grid-template-columns: 1fr; gap: 1.75rem; }
    .lp-hero-copy { padding: 0; }
    .lp-page h1 { font-size: clamp(2.45rem, 9.2vw, 3.8rem); letter-spacing: -0.055em; }
    .lp-hero-copy > p:not(.lp-eyebrow):not(.lp-reassurance) { font-size: 0.9375rem; }
    .lp-page .lp-eyebrow { font-size: 0.625rem; margin-bottom: 1rem; }
    .lp-actions { gap: 1rem; margin-top: 1.5rem; }
    .lp-actions .btn, .lp-page .lp-text-link { font-size: 0.75rem; }
    .lp-page .lp-reassurance { font-size: 0.625rem; }
    .lp-photo { height: 330px; }
    .lp-photo figcaption { bottom: 1rem; left: 1rem; right: 1rem; padding: 0.85rem 1rem; }
    .lp-photo-stamp { top: 1rem; left: 1rem; width: 44px; height: 44px; }
    .lp-photo figcaption strong { font-size: 0.875rem; }
    .lp-benefits { grid-template-columns: 1fr; gap: 1.25rem; padding-block: 1.75rem; }
    .lp-jump .lp-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.5rem; }
    .lp-jump a { font-size: 0.6875rem; justify-content: space-between; padding: 0.9rem 0; }
    .lp-jump a:nth-of-type(n+3) { border-top: 1px solid var(--color-border); }
    .lp-section { padding: 3.5rem 0; }
    .lp-heading, .lp-proof-intro, .lp-migration, .lp-faq, .lp-final .lp-wrap { grid-template-columns: 1fr; gap: 1.75rem; }
    .lp-heading { margin-bottom: 2rem; }
    .lp-heading > p { font-size: 0.875rem; }
    .lp-workflow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem; }
    .lp-workflow h3 { font-size: 0.9375rem; }
    .lp-workflow p { font-size: 0.75rem; }
    .lp-step-number { margin-bottom: 1rem; }
    .lp-capabilities { grid-template-columns: 1fr; gap: 1.5rem; }
    .lp-capabilities article { display: grid; grid-template-columns: 1.75rem 1fr; gap: 0.5rem 0.75rem; }
    .lp-capabilities article > i { grid-row: span 2; font-size: 1.35rem; }
    .lp-capabilities h3 { margin: 0; }
    .lp-capabilities p { grid-column: 2; }
    .lp-product-proof { padding: 0.3rem; }
    .lp-window-bar { font-size: 0.5625rem; gap: 0.5rem; padding: 0.6rem 0.5rem 0.8rem; }
    .lp-window-bar > span:first-child { display: none; }
    .lp-product-proof .la-screen--hero .la-screen-link { height: 280px; }
    .lp-roles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
    .lp-aside-proof { padding: 1rem; }
    .lp-aside-proof .la-screen-link { height: 270px; }
    .lp-faq { gap: 2rem; }
    .lp-final { padding: 3.5rem 0; }
    .lp-final .lp-actions { margin-top: 0.5rem; }
}
@media (max-width: 370px) {
    .lp-workflow { grid-template-columns: 1fr; }
    .lp-photo { height: 280px; }
}
@media (prefers-reduced-motion: reduce) {
    .lp-page *, .lp-page *::before, .lp-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}