/* ==========================================================================
   Landing pages (SEO/GEO lote 1) - every selector scoped under body.page-landing
   Uses the shared tokens from styles.css: one spacing scale (--sp-*), one radius
   scale (--r-*), DM Sans + one Instrument Serif italic accent per section.
   Sections: hero (dark, photo + mascot), moment, system (+table), workflow,
   fit (for / not for), capabilities bento, integrations (dark), human, proof,
   implementation, faq (shared), related, cta-final (shared).
   Desktop first; tablet (<1200) and phone (<768) overrides at the end.
   ========================================================================== */
body.page-landing { background: var(--c-bg); }
body.page-landing .t-serif { font-family: var(--f-serif); font-style: italic; font-weight: 400; letter-spacing: -0.02em; }
body.page-landing .ld-wrap { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 var(--sp-6); }
body.page-landing .ld-section { padding: var(--sp-10) 0; }
body.page-landing .ld-eyebrow { display: inline-flex; align-items: center; gap: var(--sp-3); font-family: var(--f-switzer); font-weight: 400; font-size: 14px; line-height: 1.4; letter-spacing: 0.3em; text-transform: uppercase; color: var(--c-grey-eyebrow); }
body.page-landing .ld-eyebrow::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--c-purple); flex: none; }
body.page-landing .ld-h2 { font-family: var(--f-dm); font-weight: 300; font-size: 56px; line-height: 1.02; letter-spacing: -0.04em; color: var(--c-ink); max-width: 820px; }
body.page-landing .ld-h3 { font-family: var(--f-dm); font-weight: 400; font-size: 26px; line-height: 1.15; letter-spacing: -0.03em; color: var(--c-ink); }
body.page-landing .ld-lead { font-family: var(--f-general); font-weight: 400; font-size: 21px; line-height: 1.35; letter-spacing: -0.02em; color: rgba(17, 16, 17, 0.72); max-width: 680px; }
body.page-landing .ld-p { font-family: var(--f-satoshi); font-weight: 400; font-size: 18px; line-height: 1.55; color: var(--c-text); }
body.page-landing .ld-p + .ld-p { margin-top: var(--sp-4); }
body.page-landing .ld-p strong { font-weight: 700; color: var(--c-ink); }
body.page-landing .ld-p .t-serif, body.page-landing .ld-list li .t-serif, body.page-landing .ld-step p .t-serif, body.page-landing .ld-cap p .t-serif, body.page-landing .ld-phase p .t-serif, body.page-landing .faq__a .t-serif { font-size: 1.15em; color: var(--c-ink); }
body.page-landing .ld-p code, body.page-landing li code, body.page-landing td code { font-family: var(--f-mono); font-size: 0.9em; padding: 1px 6px; border-radius: var(--r-xs); background: rgba(17, 16, 17, 0.06); }
body.page-landing .ld-head { display: flex; flex-direction: column; gap: var(--sp-5); margin-bottom: var(--sp-8); }
body.page-landing .ld-actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
body.page-landing .btn { text-align: center; }

/* ---------- Hero ---------------------------------------------------------- */
body.page-landing .ld-hero { position: relative; background: var(--c-dark); color: var(--c-bg); overflow: hidden; padding: 150px 0 var(--sp-10); }
body.page-landing .ld-hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.32; }
body.page-landing .ld-hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12, 17, 17, 0.96) 0%, rgba(12, 17, 17, 0.82) 45%, rgba(12, 17, 17, 0.35) 100%); }
body.page-landing .ld-hero__glow { position: absolute; right: -10%; top: 10%; width: 60%; height: 90%; background: var(--g-green-glow); opacity: 0.35; pointer-events: none; }
body.page-landing .ld-hero__pattern { position: absolute; inset: 0; background: url("../assets/rR6HYXBrMmX4cRpXfXUOvpvpB0.png") repeat 0 0 / 256px 256px; opacity: 0.05; pointer-events: none; }
body.page-landing .ld-hero .ld-wrap { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: var(--sp-8); align-items: center; }
body.page-landing .ld-hero__pill { display: inline-flex; align-items: center; gap: var(--sp-2); padding: 8px 16px; border-radius: var(--r-pill); border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.06); font-family: var(--f-mono); font-weight: 500; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-bg); }
body.page-landing .ld-hero__pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c-green); box-shadow: 0 0 12px var(--c-green); }
body.page-landing .ld-hero__title { margin-top: var(--sp-5); font-family: var(--f-dm); font-weight: 300; font-size: 68px; line-height: 1; letter-spacing: -0.05em; color: #f4f2ef; }
body.page-landing .ld-hero__sub { margin-top: var(--sp-5); max-width: 640px; font-family: var(--f-general); font-weight: 400; font-size: 20px; line-height: 1.35; letter-spacing: -0.015em; color: rgba(249, 247, 246, 0.86); }
body.page-landing .ld-hero__sub strong { color: #fff; font-weight: 500; }
body.page-landing .ld-hero__sub .t-serif { color: var(--c-green); }
body.page-landing .ld-hero__actions { margin-top: var(--sp-6); }
body.page-landing .ld-hero .btn--green { box-shadow: rgba(132, 255, 31, 0.32) 0px 8px 20px 0px; }
body.page-landing .ld-hero .btn--ghost { display: inline-flex; align-items: center; justify-content: center; height: 50px; padding: 0 28px; border-radius: var(--r-pill); border: 1px solid rgba(255, 255, 255, 0.22); color: #fff; font-family: var(--f-is); font-size: 15px; line-height: 26px; transition: background 0.2s var(--ease-out); }
body.page-landing .ld-hero .btn--ghost:hover { background: rgba(255, 255, 255, 0.08); }
body.page-landing .ld-hero__visual { position: relative; display: flex; justify-content: center; align-items: flex-end; min-height: 520px; }
body.page-landing .ld-hero__card { position: absolute; left: 0; right: 0; bottom: 0; height: 78%; border-radius: var(--r-lg); background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); overflow: hidden; }
body.page-landing .ld-hero__card img { width: 100%; height: 100%; object-fit: cover; opacity: 0.9; }
body.page-landing .ld-hero__mascot { position: relative; width: 420px; max-width: 100%; height: auto; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.45)); }
body.page-landing .ld-hero__trust { position: relative; grid-column: 1 / -1; margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: 1px solid rgba(255, 255, 255, 0.1); display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-5) var(--sp-7); }
body.page-landing .ld-hero__trust p { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(249, 247, 246, 0.55); }
body.page-landing .ld-hero__trust img { height: 34px; width: auto; filter: brightness(0) invert(1); opacity: 0.75; }
body.page-landing .ld-hero__trust span { font-family: var(--f-dm); font-weight: 500; font-size: 15px; color: rgba(249, 247, 246, 0.8); }

/* ---------- Moment (scene) ------------------------------------------------ */
body.page-landing .ld-moment .ld-wrap { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: var(--sp-8); align-items: center; }
body.page-landing .ld-moment__photo { position: relative; border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 4 / 5; background: var(--c-dark); }
body.page-landing .ld-moment__photo img { width: 100%; height: 100%; object-fit: cover; }
body.page-landing .ld-moment__time { position: absolute; left: var(--sp-5); top: var(--sp-5); padding: 8px 14px; border-radius: var(--r-pill); background: rgba(12, 17, 17, 0.72); backdrop-filter: blur(6px); color: #fff; font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.06em; }
body.page-landing .ld-moment__text .ld-p { font-size: 20px; line-height: 1.5; }
body.page-landing .ld-moment__text .ld-p .t-serif { font-size: 1.15em; color: var(--c-ink); }

/* ---------- System (answer + table + chat) -------------------------------- */
body.page-landing .ld-system { background: var(--c-white); border-radius: 70px 70px 0 0; }
body.page-landing .ld-system .ld-wrap { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: var(--sp-8); align-items: start; }
body.page-landing .ld-system__text > .ld-p:first-of-type { font-size: 21px; line-height: 1.5; color: var(--c-ink); }
body.page-landing .ld-system__chat { position: sticky; top: 120px; border-radius: var(--r-lg); overflow: hidden; background: var(--c-panel); padding: var(--sp-6); display: flex; justify-content: center; }
body.page-landing .ld-system__chat img { width: 100%; max-width: 420px; border-radius: var(--r-md); box-shadow: var(--sh-float); }
body.page-landing .ld-table { width: 100%; margin-top: var(--sp-6); border-collapse: separate; border-spacing: 0; border: 1px solid var(--c-line); border-radius: var(--r-md); overflow: hidden; font-family: var(--f-dm); font-size: 15px; line-height: 1.4; }
body.page-landing .ld-table th { text-align: left; padding: 14px 16px; background: var(--c-panel); font-weight: 600; color: var(--c-ink); border-bottom: 1px solid var(--c-line); }
body.page-landing .ld-table td { padding: 14px 16px; border-bottom: 1px solid var(--c-line); color: var(--c-text); vertical-align: top; }
body.page-landing .ld-table tr:last-child td { border-bottom: 0; }
body.page-landing .ld-table td:first-child { font-weight: 600; color: var(--c-ink); }
body.page-landing .ld-table-scroll { overflow-x: auto; margin-top: var(--sp-6); }
body.page-landing .ld-table-scroll .ld-table { margin-top: 0; min-width: 560px; }

/* ---------- Workflow ------------------------------------------------------ */
body.page-landing .ld-workflow { background: var(--c-white); }
body.page-landing .ld-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); counter-reset: step; }
body.page-landing .ld-step { position: relative; padding: var(--sp-6); border-radius: var(--r-md); background: var(--c-bg); border: 1px solid var(--c-line); display: flex; flex-direction: column; gap: var(--sp-3); }
body.page-landing .ld-step::before { counter-increment: step; content: counter(step, decimal-leading-zero); font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.1em; color: var(--c-grey-mid); }
body.page-landing .ld-step h3 { font-family: var(--f-dm); font-weight: 500; font-size: 22px; line-height: 1.15; letter-spacing: -0.02em; color: var(--c-ink); }
body.page-landing .ld-step p { font-family: var(--f-satoshi); font-size: 16px; line-height: 1.5; color: var(--c-text); }
body.page-landing .ld-step--human { background: var(--c-dark); border-color: var(--c-dark); }
body.page-landing .ld-steps--span .ld-step--human { grid-column: span 2; }
body.page-landing .ld-step--human::before, body.page-landing .ld-step--human p { color: rgba(249, 247, 246, 0.75); }
body.page-landing .ld-step--human h3 { color: var(--c-green); }
body.page-landing .ld-step--human::after { content: "Entra una persona"; position: absolute; right: var(--sp-5); top: var(--sp-5); padding: 4px 10px; border-radius: var(--r-pill); background: var(--c-green); color: var(--c-ink); font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
body.page-landing .ld-split { margin-top: var(--sp-6); display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
body.page-landing .ld-split__item { padding: var(--sp-5) var(--sp-6); border-radius: var(--r-md); background: var(--c-panel); font-family: var(--f-dm); font-size: 16px; line-height: 1.5; color: var(--c-text); }
body.page-landing .ld-split__item strong { display: block; font-weight: 600; color: var(--c-ink); margin-bottom: 4px; }
body.page-landing .ld-split__item--human { background: rgba(64, 254, 119, 0.16); }
body.page-landing .ld-split__item .t-serif { color: var(--c-ink); font-size: 1.1em; }

/* ---------- Fit (for / not for) ------------------------------------------ */
body.page-landing .ld-fit { background: var(--c-bg); }
body.page-landing .ld-fit__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
body.page-landing .ld-fit__card { padding: var(--sp-7); border-radius: var(--r-lg); background: var(--c-white); border: 1px solid var(--c-line); }
body.page-landing .ld-fit__card--no { background: var(--c-panel); }
body.page-landing .ld-fit__card h3 { margin-bottom: var(--sp-5); }
body.page-landing .ld-list { display: flex; flex-direction: column; gap: var(--sp-3); }
body.page-landing .ld-list li { position: relative; padding-left: 30px; font-family: var(--f-satoshi); font-size: 17px; line-height: 1.5; color: var(--c-text); }
body.page-landing .ld-list li::before { content: ""; position: absolute; left: 0; top: 7px; width: 16px; height: 16px; border-radius: 50%; background: var(--c-purple); -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23000'/%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.8' stroke='%23fff' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23000'/%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.8' stroke='%23fff' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px no-repeat; }
body.page-landing .ld-list--no li::before { background: var(--c-grey-mid); -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3Cpath d='M5 8h6' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3Cpath d='M5 8h6' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / 16px no-repeat; }
body.page-landing .ld-list li .t-serif { color: var(--c-ink); }

/* ---------- Capabilities bento ------------------------------------------- */
body.page-landing .ld-caps { background: var(--c-white); }
body.page-landing .ld-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
body.page-landing .ld-cap { padding: var(--sp-6); border-radius: var(--r-md); background: var(--c-bg); border: 1px solid var(--c-line); display: flex; flex-direction: column; gap: var(--sp-4); min-height: 220px; }
body.page-landing .ld-cap__icon { width: 44px; height: 44px; border-radius: var(--r-sm); background: var(--c-dark); display: flex; align-items: center; justify-content: center; }
body.page-landing .ld-cap__icon svg { width: 22px; height: 22px; stroke: var(--c-green); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.page-landing .ld-cap h3 { font-family: var(--f-dm); font-weight: 500; font-size: 21px; line-height: 1.2; letter-spacing: -0.02em; color: var(--c-ink); }
body.page-landing .ld-cap p { font-family: var(--f-satoshi); font-size: 16px; line-height: 1.5; color: var(--c-text); }
body.page-landing .ld-cap--photo { position: relative; padding: 0; overflow: hidden; background: var(--c-dark); border: 0; grid-row: span 2; min-height: 100%; }
body.page-landing .ld-cap--photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Integrations (dark band) ------------------------------------- */
body.page-landing .ld-integ { background: var(--c-dark-2); color: var(--c-bg); }
body.page-landing .ld-integ .ld-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-8); align-items: center; }
body.page-landing .ld-integ .ld-eyebrow { color: rgba(249, 247, 246, 0.6); }
body.page-landing .ld-integ .ld-h2 { color: #f4f2ef; }
body.page-landing .ld-integ .ld-p { color: rgba(249, 247, 246, 0.82); }
body.page-landing .ld-integ .ld-p strong { color: #fff; }
body.page-landing .ld-integ .ld-p a { color: var(--c-green); text-decoration: underline; text-underline-offset: 3px; }
body.page-landing .ld-integ .ld-p .t-serif { color: var(--c-green); }
body.page-landing .ld-integ__visual { border-radius: var(--r-lg); overflow: hidden; background: #000; border: 1px solid rgba(255, 255, 255, 0.08); }
body.page-landing .ld-integ__visual img { width: 100%; height: auto; }
body.page-landing .ld-integ__chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-5); }
body.page-landing .ld-integ__chips span { padding: 8px 14px; border-radius: var(--r-pill); border: 1px solid rgba(255, 255, 255, 0.16); font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(249, 247, 246, 0.8); }

/* ---------- Human --------------------------------------------------------- */
body.page-landing .ld-human { background: var(--c-bg); }
body.page-landing .ld-human .ld-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: var(--sp-8); align-items: center; }
body.page-landing .ld-human__card { padding: var(--sp-7); border-radius: var(--r-lg); background: var(--c-white); border: 1px solid var(--c-line); }
body.page-landing .ld-human__card .ld-p:first-child { margin-bottom: var(--sp-5); }
body.page-landing .ld-human__card .ld-list { margin-bottom: var(--sp-5); }
body.page-landing .ld-human__card .ld-list li::before { background: var(--c-ink); }
body.page-landing .ld-human__mascot { display: flex; justify-content: center; }
body.page-landing .ld-human__mascot img { width: 100%; max-width: 360px; height: auto; }

/* ---------- Proof ---------------------------------------------------------- */
body.page-landing .ld-proof { background: var(--c-white); }
body.page-landing .ld-proof__card { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--sp-7); align-items: center; padding: var(--sp-7); border-radius: var(--r-lg); background: var(--c-bg); border: 1px solid var(--c-line); }
body.page-landing .ld-proof__logo { display: flex; align-items: center; justify-content: center; height: 140px; border-radius: var(--r-md); background: var(--c-white); padding: var(--sp-5); }
body.page-landing .ld-proof__logo img { max-height: 90px; width: auto; max-width: 100%; }
body.page-landing .ld-proof__text .ld-p { font-size: 20px; }
body.page-landing .ld-proof__text .t-serif { color: var(--c-ink); }
body.page-landing .ld-proof__more { margin-top: var(--sp-4); display: flex; flex-wrap: wrap; gap: var(--sp-4); align-items: center; }
body.page-landing .ld-proof__more img { height: 36px; width: auto; opacity: 0.8; }

body.page-landing .ld-proof__intro { margin-bottom: var(--sp-6); max-width: 760px; }
body.page-landing .ld-proof__intro .ld-p { font-size: 20px; }
body.page-landing .ld-proof__grid { display: grid; grid-template-columns: 1fr; gap: var(--sp-4); }
body.page-landing .ld-quote { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); border-radius: var(--r-lg); overflow: hidden; background: var(--c-bg); border: 1px solid var(--c-line); }
body.page-landing .ld-quote__video { position: relative; display: block; min-height: 320px; background: var(--c-dark); }
body.page-landing .ld-quote__video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.page-landing .ld-quote__play { position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; border-radius: 50%; background: var(--c-green); display: flex; align-items: center; justify-content: center; box-shadow: rgba(132, 255, 31, 0.32) 0px 8px 20px 0px; }
body.page-landing .ld-quote__play svg { width: 30px; height: 30px; fill: var(--c-ink); margin-left: 4px; }
body.page-landing .ld-quote__body { padding: var(--sp-7); display: flex; flex-direction: column; gap: var(--sp-5); }
body.page-landing .ld-quote__logo { height: 44px; width: auto; align-self: flex-start; }
body.page-landing .ld-quote__text { font-family: var(--f-dm); font-weight: 300; font-size: 24px; line-height: 1.3; letter-spacing: -0.02em; color: var(--c-ink); }
body.page-landing .ld-quote__who { display: flex; align-items: center; gap: var(--sp-3); }
body.page-landing .ld-quote__who img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
body.page-landing .ld-quote__name { font-family: var(--f-dm); font-weight: 600; font-size: 16px; color: var(--c-ink); }
body.page-landing .ld-quote__role { font-family: var(--f-satoshi); font-size: 14px; color: var(--c-grey-mid); }

/* ---------- Implementation ------------------------------------------------ */
body.page-landing .ld-impl { background: var(--c-bg); }
body.page-landing .ld-timeline { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--sp-4); counter-reset: phase; }
body.page-landing .ld-phase { padding: var(--sp-6); border-radius: var(--r-md); background: var(--c-white); border: 1px solid var(--c-line); display: flex; flex-direction: column; gap: var(--sp-3); }
body.page-landing .ld-phase::before { counter-increment: phase; content: "Fase " counter(phase); font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-grey-mid); }
body.page-landing .ld-phase h3 { font-family: var(--f-dm); font-weight: 500; font-size: 22px; line-height: 1.15; letter-spacing: -0.02em; color: var(--c-ink); }
body.page-landing .ld-phase p { font-family: var(--f-satoshi); font-size: 16px; line-height: 1.5; color: var(--c-text); }
body.page-landing .ld-impl__note { margin-top: var(--sp-5); }
body.page-landing .ld-impl__note .t-serif { color: var(--c-ink); }

/* ---------- FAQ overrides (shared component) ------------------------------ */
body.page-landing .faq { background: var(--c-white); }

/* ---------- Related -------------------------------------------------------- */
body.page-landing .ld-related { background: var(--c-bg); }
body.page-landing .ld-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
body.page-landing .ld-related__card { display: flex; flex-direction: column; justify-content: space-between; gap: var(--sp-5); min-height: 150px; padding: var(--sp-5) var(--sp-6); border-radius: var(--r-md); background: var(--c-white); border: 1px solid var(--c-line); font-family: var(--f-dm); font-weight: 500; font-size: 19px; line-height: 1.25; letter-spacing: -0.02em; color: var(--c-ink); transition: border-color 0.2s var(--ease-out); }
body.page-landing .ld-related__card:hover { border-color: var(--c-ink); }
body.page-landing .ld-related__card span { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-grey-mid); }

/* ---------- Final CTA overrides ------------------------------------------- */
body.page-landing .cta-final__sub { max-width: 640px; margin: 0 auto var(--sp-5); font-family: var(--f-satoshi); font-size: 18px; line-height: 1.5; color: var(--c-text); text-align: center; }
body.page-landing .cta-final__alt { display: block; margin-top: var(--sp-4); font-family: var(--f-dm); font-size: 15px; color: var(--c-ink); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Tablet --------------------------------------------------------- */
@media (max-width: 1199px) {
  body.page-landing .ld-h2 { font-size: 46px; }
  body.page-landing .ld-hero__title { font-size: 54px; }
  body.page-landing .ld-hero .ld-wrap { grid-template-columns: 1fr; }
  body.page-landing .ld-hero__visual { min-height: 0; margin-top: var(--sp-6); }
  body.page-landing .ld-hero__card { height: 70%; }
  body.page-landing .ld-hero__mascot { width: 320px; }
  body.page-landing .ld-steps, body.page-landing .ld-bento, body.page-landing .ld-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.page-landing .ld-steps--span .ld-step--human { grid-column: span 2; }
  body.page-landing .ld-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.page-landing .ld-system .ld-wrap, body.page-landing .ld-integ .ld-wrap, body.page-landing .ld-human .ld-wrap { grid-template-columns: 1fr; }
  body.page-landing .ld-system__chat { position: static; }
  body.page-landing .ld-cap--photo { grid-row: auto; min-height: 260px; }
}

/* ---------- Phone ----------------------------------------------------------- */
@media (max-width: 767px) {
  body.page-landing .ld-wrap { padding: 0 var(--sp-4); }
  body.page-landing .ld-section { padding: var(--sp-8) 0; }
  body.page-landing .ld-h2 { font-size: 36px; }
  body.page-landing .ld-lead { font-size: 18px; }
  body.page-landing .ld-hero { padding-top: 120px; }
  body.page-landing .ld-hero__title { font-size: 40px; letter-spacing: -0.04em; }
  body.page-landing .ld-hero__sub { font-size: 17px; }
  body.page-landing .ld-hero__mascot { width: 240px; }
  body.page-landing .ld-hero .btn, body.page-landing .ld-hero .btn--ghost { width: 100%; }
  body.page-landing .ld-moment .ld-wrap, body.page-landing .ld-fit__grid, body.page-landing .ld-split, body.page-landing .ld-steps, body.page-landing .ld-bento, body.page-landing .ld-timeline, body.page-landing .ld-related__grid, body.page-landing .ld-proof__card { grid-template-columns: 1fr; }
  body.page-landing .ld-moment__photo { aspect-ratio: 4 / 3; }
  body.page-landing .ld-quote { grid-template-columns: 1fr; }
  body.page-landing .ld-quote__video { min-height: 220px; }
  body.page-landing .ld-quote__body { padding: var(--sp-5); }
  body.page-landing .ld-quote__text { font-size: 20px; }
  body.page-landing .ld-system { border-radius: 36px 36px 0 0; }
  body.page-landing .ld-fit__card, body.page-landing .ld-human__card, body.page-landing .ld-proof__card { padding: var(--sp-5); }
  body.page-landing .ld-step--human::after { position: static; align-self: flex-start; }
  body.page-landing .ld-steps--span .ld-step--human { grid-column: auto; }
  body.page-landing .ld-cap--photo { min-height: 220px; }
  body.page-landing .ld-actions .btn { width: 100%; }
}
