/* The desktop-format landing pages (compress-pdf, compress-video, heic-to-jpg and their Spanish pairs). Loaded after style.css. */
.seo-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;padding-block:34px 56px}
.seo-hero h1{font-size:clamp(40px,5.2vw,66px);font-weight:620;letter-spacing:-2.6px;line-height:1.06;margin:0 0 24px}
.seo-hero .lead{max-width:520px}
.seo-hero-art{display:flex;justify-content:center}
.seo-hero-art .pip-hero{width:min(100%,360px)}
.seo-demo{padding-block:20px 60px}
.seo-demo .app-demo{transform:none}
.seo-demo .app-footer span:last-child{text-align:right;max-width:46%}
.format-section .seo-detail{display:grid;grid-template-columns:1fr 1fr;gap:48px 80px}
.format-section .seo-block h2{font-size:30px;letter-spacing:-1px;margin:0 0 16px}
.seo-block p,.seo-block li{font-size:15px;line-height:1.65;color:#4f5848}
.seo-block p{margin:0 0 14px}
.seo-block ul{margin:0;padding-left:20px}
.seo-block li+li{margin-top:8px}
.seo-faq .faq{max-width:760px;margin:0 auto}
.seo-faq .section-heading{margin-bottom:30px}
.section.seo-faq h2{font-size:38px;letter-spacing:-1.6px}
.seo-more{padding-block:10px 40px}
.seo-related h2{font-size:20px;letter-spacing:-.4px;margin:0 0 14px}
.seo-related ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0}
.seo-related li+li{margin-top:0}
.seo-related a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:14px;font-weight:600}
.seo-related a:hover{background:var(--sage)}
.seo-more .seo-related{text-align:center}.seo-more .seo-related ul{justify-content:center}
.closing h2{font-size:42px}
.remind{margin-top:18px;max-width:460px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.remind-lead{margin:0 0 10px;font-size:13px;line-height:1.5;color:var(--muted)}
.remind-lead b{color:var(--ink)}
.remind-actions{display:flex;flex-wrap:wrap;gap:8px}
.remind-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--ink);border-radius:var(--r-pill);background:transparent;color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.remind-btn:hover{background:var(--peach)}
.remind-btn:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.remind-said{margin:8px 0 0;min-height:1em;font-size:12px;color:var(--muted)}
@media(max-width:900px){.seo-hero{grid-template-columns:1fr;padding-block:20px 40px}.seo-hero-art{order:-1}.seo-hero-art .pip-hero{width:min(60%,260px)}.format-section .seo-detail{grid-template-columns:1fr;gap:36px}.closing h2{font-size:34px}}
@media(max-width:640px){.seo-hero h1{font-size:38px;letter-spacing:-1.8px}.section.seo-faq h2{font-size:30px}.seo-demo .app-footer{flex-direction:column;gap:6px}.seo-demo .app-footer span:last-child{max-width:none;text-align:left}}
/* Release notes: /releases/ and /es/versiones/. Only the tokens of design/tokens.json (colours and the --r-* radii); the page checks fail on a hex colour or another radius below this line. */
.notes-hero{padding-block:34px 28px}
.notes-hero h1{font-size:clamp(40px,5.2vw,66px);font-weight:620;letter-spacing:-2.6px;line-height:1.06;margin:0 0 24px}
.notes-hero .lead{max-width:640px;margin-bottom:14px}
.notes-shipped{max-width:640px;margin:0 0 14px;font-size:15px;line-height:1.6;color:var(--muted)}
.notes-hero .build-note{margin:0;color:var(--muted)}
.notes-index ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0}
.notes-index a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.notes-index a:hover{background:var(--sage)}
.notes-index a:focus-visible,.notes-more a:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.notes-list{display:grid;gap:20px;padding-block:20px 56px}
.release-entry{max-width:820px;padding:28px 30px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);scroll-margin-top:24px}
.release-entry:target{border-color:var(--accent-ink)}
.release-entry h2{font-size:28px;font-weight:620;letter-spacing:-.8px;line-height:1.15;margin:0 0 14px}
.release-highlights,.release-smaller{margin:0;padding:0}
.release-highlights{list-style:none}
.release-highlights li{padding-block:14px;border-top:1px solid var(--hair)}
.release-highlights li:first-child{border-top:0;padding-top:4px}
.release-highlights li>strong{display:block;font-size:17px;line-height:1.35;color:var(--ink)}
.release-highlights p{margin:6px 0 0;font-size:15px;line-height:1.65;color:var(--muted)}
.release-smaller-heading{margin:18px 0 8px;font-size:14px;font-weight:700;letter-spacing:.2px;color:var(--ink)}
.release-smaller{padding-left:20px}
.release-smaller li{font-size:15px;line-height:1.65;color:var(--muted)}
.release-smaller li+li{margin-top:6px}
.release-entry [lang="en"]{font-weight:600;color:var(--ink)}
.notes-more{padding-block:10px 64px}.notes-more>*{max-width:820px}
.notes-more h2{font-size:24px;letter-spacing:-.6px;margin:0 0 10px}
.notes-more p{margin:0 0 10px;font-size:15px;line-height:1.65;color:var(--muted)}
.notes-more a{display:inline-flex;align-items:center;gap:6px;min-height:44px;text-decoration:underline;text-underline-offset:3px;color:var(--accent-ink)}
@media(max-width:640px){.notes-hero h1{font-size:38px;letter-spacing:-1.8px}.release-entry{padding:22px 20px}.release-entry h2{font-size:24px}}

/* Quick facts and how it works: the table every landing page carries, and the versions table of the release notes. Tokens only. */
.seo-facts,.seo-howto,.notes-table{margin:28px 0 8px}
.notes-table{margin-block:24px}
.seo-facts h2,.seo-howto h2,.notes-table h2{margin:0 0 12px;font-size:19px;line-height:1.25;letter-spacing:-.01em}
.seo-facts .table-scroll,.notes-table .table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--solid)}
.seo-facts .table-scroll:focus-visible,.notes-table .table-scroll:focus-visible{outline:3px solid var(--accent-ink);outline-offset:2px}
.spec-table{width:100%;min-width:640px;border-collapse:collapse;font-size:14px;line-height:1.45;text-align:left}
.spec-table th,.spec-table td{padding:12px 14px;vertical-align:top;border-top:1px solid var(--hair)}
.spec-table thead th{border-top:0;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);background:var(--surface)}
.spec-table tbody th{width:22%;font-weight:650}
.spec-table caption{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.seo-howto ol{margin:0;padding-left:22px}
.seo-howto li{font-size:15px;line-height:1.6}
.seo-howto li+li{margin-top:6px}
