/* Shared page composition, using the existing Zalkap tokens and visual identity. */
[hidden] { display: none !important; }
section, main { scroll-margin-top: calc(var(--header-h) + 24px); }
.header { position: sticky; }
.header__links a[aria-current="page"] { color: var(--c-dark); }
.skip-link { position: fixed; top: 8px; left: 16px; z-index: 1000; background: white; padding: 12px; transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.hero { min-height: 0; padding: 96px 0 72px; }
.hero__brand, .hero__actions { opacity: 1; transform: none; }
.hero__brand { margin-bottom: 20px; font-size: 1rem; }
.hero__title { min-height: 0; font-size: clamp(3rem, 7vw, 6.1rem); letter-spacing: -0.06em; }
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 18% 70%, #9aa0aa2e, transparent 46%), radial-gradient(ellipse at 82% 28%, #bdb3a536, transparent 44%), radial-gradient(ellipse at 50% 50%, #ffffffd9, transparent 56%); }
.hero-description { font-size: clamp(1.05rem, 1.7vw, 1.25rem); line-height: 1.65; max-width: 680px; color: #55575d; margin-top: 28px; }
.hero__actions { margin-top: 32px; }
.hero-note { font-size: 0.8125rem; color: #62656c; margin-top: 28px; }
.hero .eyebrow { margin-bottom: 30px; }
.eyebrow { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: #55575d; margin-bottom: 22px; }
.section { padding: 104px 0; }
.section--roomy { padding: 152px 0; }
.section--compact { padding: 64px 0; }
.section--white { background: var(--c-surface); }
.section--dark { background: var(--c-dark); color: var(--c-inverse); }
.section h2, .contact-card h2 { font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.14; font-weight: 500; letter-spacing: -0.045em; }
.section h3 { font-size: 1.3rem; line-height: 1.35; font-weight: 500; letter-spacing: -0.025em; }
.section-copy { font-size: 1.0625rem; color: #55575d; line-height: 1.75; margin-top: 24px; max-width: 690px; }
.section--dark .section-copy, .section--dark .eyebrow { color: #b8bac1; }
.section-heading { max-width: 800px; margin-bottom: 44px; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 80px); align-items: start; }
.split > div > .section-copy:first-child { margin-top: 0; }
.split .text-link { display: inline-block; margin-top: 24px; }
.text-link { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.text-link:hover { text-decoration-thickness: 2px; }
.small { font-size: 0.875rem; line-height: 1.7; }
.muted { color: #62656c; }
.harness-map { display: grid; gap: 28px; padding-left: 4px; }
.map-layer { font-size: 1.125rem; color: #d7d9df; }
.map-layer--core { font-size: clamp(1.6rem, 3vw, 2.2rem); letter-spacing: -0.03em; color: white; }
.map-detail { color: #b8bac1; line-height: 1.7; max-width: 460px; margin-top: -16px; }
.map-note { font-size: 0.8125rem; color: #9fa3ad; }
.page-hero { padding: 96px 0 76px; }
.page-hero h1 { font-size: clamp(2.7rem, 6.4vw, 5.6rem); line-height: 1.1; letter-spacing: -0.06em; font-weight: 500; }
.actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }
.download-details { order: 1; flex-basis: 100%; margin-top: -4px; font-size: 0.875rem; line-height: 1.7; color: #55575d; }
.cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.usecase-list { display: grid; grid-template-columns: 1fr 1fr; gap: 36px clamp(32px, 6vw, 80px); }
.demo-placeholder { padding: 64px 32px; text-align: center; border-radius: 28px; margin-top: 40px; }
.placeholder-symbol { display: block; font-size: 3rem; color: #626b7c; margin-bottom: 16px; }
.demo-placeholder p { margin-top: 16px; color: #55575d; }
figcaption { font-size: 0.875rem; color: #55575d; margin-top: 20px; }
.demo-media { margin-top: 40px; }
.demo-media img { display: block; width: 100%; height: auto; border-radius: 20px; }
.hero-demo { width: min(100%, 1040px); margin-top: 64px; text-align: left; }
.hero-demo .demo-media { margin-top: 0; }
.notice { color: #424751; font-size: 0.875rem; margin-top: 24px; }
.early-form { min-width: 0; border-radius: 28px; padding: 36px; }
.early-form .notice { margin: 0 0 24px; }
.early-form label { display: block; font-size: 0.875rem; font-weight: 500; margin: 20px 0 8px; }
.early-form input { width: 100%; padding: 13px 14px; font: inherit; border: 1px solid #9298a2; border-radius: 8px; background: white; }
.early-form .small { margin-top: 20px; }
.early-form .btn { margin-top: 24px; width: 100%; }
.early-form .text-link { margin-top: 20px; }
.early-form .small .text-link { margin-top: 0; display: inline; }
button:disabled { cursor: not-allowed; background: #e2e3e5; color: #55575d; }
.questions details { padding: 14px 0; }
.questions summary { cursor: pointer; font-weight: 500; font-size: 1.0625rem; }
.questions p { margin-top: 16px; color: #55575d; }
.update-entry { display: grid; grid-template-columns: 1fr 3fr; gap: 40px; padding: 40px 0; }
.update-entry:first-child { padding-top: 0; }
.update-entry h2 { font-size: clamp(1.5rem, 2.4vw, 2.15rem); }
.update-entry p { margin-top: 20px; color: #55575d; max-width: 750px; }
.update-entry time { display: block; font-size: 0.875rem; }
.update-category { display: inline-block; font-size: 0.75rem; color: #55575d; margin-top: 12px; }
.contact-card h2 { font-size: clamp(1.5rem, 3vw, 2.5rem); overflow-wrap: anywhere; }
.contact-card .small { margin-top: 24px; color: #55575d; }
.email-address { display: flex; align-items: center; gap: 8px; }
.email-address a { min-width: 0; overflow-wrap: anywhere; }
.email-address .text-link { margin-top: 0; }
.email-copy { width: 48px; height: 48px; flex-shrink: 0; display: inline-flex; justify-content: center; align-items: center; border-radius: 8px; color: #62656c; transition: background var(--t-fast), color var(--t-fast); }
.email-copy svg { width: clamp(24px, 0.85em, 34px); height: clamp(24px, 0.85em, 34px); }
.email-copy:hover:not(:disabled) { background: #edf0f5; color: var(--c-dark); }
.email-copy:disabled { background: transparent; color: #62656c; cursor: default; }
.email-copy.is-copied { color: #28734b; }
.email-status, .contact-card .email-status, .early-form .email-status { font-size: 0.75rem; color: #55575d; margin-top: 4px; }
.email-status { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.email-status.is-error { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; }
.contact-email-heading .email-address { font-size: clamp(1.5rem, 3vw, 2.5rem); letter-spacing: -0.035em; }
.early-form .email-contact { margin-top: 24px; }
.early-form .email-address .text-link { margin-top: 0; }
.early-form .signup-consent { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; line-height: 1.6; }
.early-form .signup-consent input { width: 18px; height: 18px; flex-shrink: 0; margin-top: 3px; accent-color: var(--c-dark); }
.early-form .signup-consent .text-link { display: inline; margin-top: 0; }
.signup-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
[data-turnstile] { margin-top: 20px; }
#signup-result:empty { display: none; }
@media (max-width: 600px) { .contact-email-heading .email-address { font-size: clamp(1.15rem, 5.4vw, 1.5rem); } }
.prose { max-width: 820px; }
.prose h2 { font-size: 1.75rem; margin: 40px 0 16px; }
.prose h2:first-child { margin-top: 0; }
.prose p { margin: 16px 0; color: #55575d; line-height: 1.8; }
.prose a { text-decoration: underline; text-underline-offset: 4px; }
/* Typographic composition: statements, feature columns and product hero. */
.lead { font-size: clamp(1.15rem, 1.7vw, 1.375rem); line-height: 1.55; letter-spacing: -0.012em; color: #6b6e75; max-width: 640px; }
.lead strong { font-weight: 500; color: var(--c-dark); }
.statements { display: grid; gap: 32px; }
.section-title { margin-bottom: 56px; }
.section-intro { margin: -36px 0 56px; }
.feature-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 56px clamp(32px, 5vw, 64px); }
.feature-row p { margin-top: 12px; color: #55575d; line-height: 1.7; }
.section-link { display: inline-block; margin-top: 48px; }
.link-row { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 24px; }
.split .link-row .text-link { margin-top: 0; }
.product-hero > * { max-width: 820px; }
.product-tagline { font-size: clamp(1.5rem, 2.6vw, 2.1rem); letter-spacing: -0.03em; line-height: 1.25; margin-top: 14px; }
.cta-panel { text-align: center; padding: clamp(56px, 8vw, 104px) 32px; border-radius: 40px; }
.cta-panel .section-copy { margin: 20px auto 36px; }
.contact-card { padding: 8px 0; }
.footer__top { border-bottom: 0; }
.footer-columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.footer-columns h2 { font-size: 0.875rem; font-weight: 500; margin-bottom: 18px; color: white; }
.footer-columns a { display: block; color: #b3b6be; font-size: 0.8125rem; margin-top: 10px; }
.footer-columns a:hover { color: white; }
.footer__bottom p { color: #a7aab3; }
@media (max-width: 1000px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .footer__top { gap: 32px; }
    .footer-columns { gap: 20px; }
}
@media (max-width: 880px) {
    .section { padding: 72px 0; }
    .section--roomy { padding: 104px 0; }
    .section--compact { padding: 48px 0; }
    .hero { padding: 70px 0 60px; }
    .hero__title { min-height: 0; }
    .split, .usecase-list { grid-template-columns: 1fr; gap: 36px; }
    .feature-row { grid-template-columns: 1fr 1fr; }
    .page-hero { padding: 64px 0; }
    .navigation-ready .header__nav { top: var(--header-h); }
    .header__nav:not(.is-open) { visibility: hidden; }
    body:not(.navigation-ready) .header { height: auto; }
    body:not(.navigation-ready) .header__inner { flex-wrap: wrap; padding-top: 20px; padding-bottom: 20px; }
    body:not(.navigation-ready) .header__nav { visibility: visible; position: static; opacity: 1; transform: none; pointer-events: auto; height: auto; padding: 0; background: none; }
    body:not(.navigation-ready) .header__links { flex-direction: row; flex-wrap: wrap; gap: 6px; max-width: none; }
    body:not(.navigation-ready) .header__links a { font-size: 0.8125rem; padding: 8px; }
    body:not(.navigation-ready) .header__nav-mobile-cta { display: none; }
    .footer-columns { width: 100%; }
}
@media (max-width: 600px) {
    .cards-grid, .feature-row, .usecase-list { grid-template-columns: 1fr; }
    .hero .eyebrow { font-size: 0.65rem; }
    .hero__title { font-size: clamp(2.75rem, 10vw, 4rem); }
    .hero__actions { flex-direction: column; }
    .hero__actions .btn, .actions .btn { width: 100%; }
    .early-form { padding: 24px; }
    .update-entry { grid-template-columns: 1fr; gap: 14px; }
    .footer-columns { grid-template-columns: 1fr 1fr; gap: 28px; }
    .demo-placeholder { padding: 40px 24px; }
    .cta-panel { border-radius: 28px; padding: 48px 22px; }
}
