/* Editorial pages share the landing's palette and typography. */
.languages { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:6px; padding:0 0 20px; font-size:12px; }
.languages a { padding:9px 12px; border-radius:24px; text-decoration:none; }
.languages a[aria-current] { background:var(--teal); color:white; }
.hero-shell .languages a[aria-current] { background:#d6edda; color:var(--navy); }
.guide-discovery { padding-block:40px 85px; }
.guide-discovery h2 a { text-decoration:none; }
.guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:32px; }
.guide-card { display:flex; flex-direction:column; padding:32px; border-radius:26px; overflow:hidden; background:linear-gradient(135deg,#e7f2e9,#e6f2f2); text-decoration:none; transition:transform .18s,box-shadow .18s; box-shadow:0 12px 34px rgba(6,47,58,.06); }
.guide-card > img { display:block; width:calc(100% + 64px); height:auto; aspect-ratio:16/9; object-fit:cover; margin:-32px -32px 27px; }
.guide-card:nth-child(3n + 2) { background:linear-gradient(135deg,#f2efd9,#eef3e7); }
.guide-card:hover { opacity:1; transform:translateY(-4px); box-shadow:0 18px 42px rgba(6,47,58,.11); }
.guide-card h3 { font-size:25px; line-height:1.25; letter-spacing:-.7px; margin:18px 0 10px; }
.guide-card p { color:var(--muted); font-size:15px; line-height:1.8; margin:0 0 24px; }
.guide-link { color:#126771; margin-top:auto; font-size:14px; font-weight:600; }
.guide-nav { background:var(--navy); color:white; }
.guide-heading { padding-block:26px 48px; }
.guide-heading h1 { font-size:clamp(36px,4.6vw,62px); line-height:1.12; letter-spacing:-2px; max-width:950px; margin:22px 0; }
.guide-heading .section-lead { max-width:790px; }
.guide-hero { margin-top:-12px; margin-bottom:54px; }
.guide-hero img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:32px; box-shadow:0 22px 55px rgba(6,47,58,.12); }
.breadcrumb { display:inline-block; font-size:14px; color:var(--teal); text-decoration:none; margin-bottom:35px; }
.byline { font-size:12px; color:var(--muted); margin-top:24px; }
.article-layout { display:grid; grid-template-columns:minmax(0,720px) minmax(0,330px); gap:70px; align-items:start; padding-bottom:42px; }
.guide-body section { margin-bottom:40px; }
.guide-body h2 { font-size:clamp(25px,2.5vw,32px); letter-spacing:-.8px; line-height:1.25; }
.guide-body p { font-size:17px; line-height:1.85; color:var(--muted); }
.guide-body .reading-source { padding-top:24px; border-top:1px solid #d0e2dd; }
.guide-body .reading-source p { margin:0 0 10px; color:var(--navy); font-size:13px; font-weight:600; }
.guide-body .reading-source ul { margin:0; padding-left:20px; }
.guide-body .reading-source li { color:var(--muted); font-size:13px; line-height:1.7; margin:5px 0; }
.guide-aside nav { padding:24px; background:#eaf2ed; border-radius:24px; }
.guide-aside nav a { display:block; font-size:13px; line-height:1.6; text-decoration:none; margin-top:16px; }
.guide-promo { margin-top:26px; padding:24px; background:linear-gradient(150deg,#dcefdc,#dfeded); border-radius:24px; }
.guide-promo img { width:180px; height:180px; object-fit:contain; margin:-5px auto 20px; }
.guide-promo h2 { font-size:26px; letter-spacing:-.7px; line-height:1.25; }
.guide-promo p { font-size:14px; line-height:1.8; color:var(--muted); }
.article-cta { display:inline-flex; align-items:center; justify-content:center; padding:15px 23px; color:white; background:var(--navy); border-radius:30px; font-size:14px; text-decoration:none; }
/* Focus must remain visible on both the cream page and dark hero. */
body > main a:focus-visible, .footer a:focus-visible { outline-color:var(--teal); }
.hero-shell a:focus-visible { outline-color:#e1ed9b; }
@media(max-width:900px) { .article-layout { grid-template-columns:minmax(0,1fr) 270px; gap:32px; } }
@media(max-width:700px) {
 .languages { justify-content:center; padding-bottom:18px; }
 .hero-shell .hero { padding-top:8px; }
 .guide-grid { grid-template-columns:1fr; gap:16px; }
 .guide-card { padding:25px; }
 .guide-card > img { width:calc(100% + 50px); margin:-25px -25px 24px; }
 .guide-card h3 { font-size:24px; }
 .guide-discovery { padding-block:25px 60px; }
 .guide-heading { padding-block:22px 30px; }
 .guide-heading h1 { font-size:37px; letter-spacing:-1.5px; }
 .guide-hero { margin-top:0; margin-bottom:34px; padding-inline:0; }
 .guide-hero img { border-radius:0; box-shadow:none; }
 .article-layout { display:block; }
 .guide-body p { font-size:16px; }
 .guide-aside nav { display:none; }
 .guide-promo { padding:28px; }
 .guide-promo img { float:right; width:110px; height:110px; margin:0 0 10px 15px; }
 .guide-promo h2 { font-size:26px; }
 .guide-promo .article-cta { clear:both; }
 .hero h1 { font-size:clamp(36px,10.8vw,48px); }
 .footer nav { gap:20px; flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) { .guide-card { transition:none; } .guide-card:hover { transform:none; } }
.answer-card { padding:24px 28px; background:#e3f0e7; border-radius:24px; margin-bottom:38px; }
.answer-card p:last-child { margin-bottom:0; color:var(--navy); }
.example-note { padding:24px 28px; background:#f1efdc; border-radius:24px; }
.example-note h2 { margin-top:0; }
.guide-questions h3 { font-size:20px; line-height:1.4; margin-top:28px; }
.product-discovery { display:grid; grid-template-columns:1fr 1fr; gap:60px; padding-block:40px 70px; }
.product-discovery h2,.product-facts h2,.product-screens h2,.product-editorial h2 { font-size:clamp(28px,3vw,40px); letter-spacing:-1px; line-height:1.2; }
.product-discovery p,.product-editorial p { color:var(--muted); line-height:1.85; }
.product-discovery .article-cta { margin-top:16px; }
.product-discovery dl,.product-facts dl { margin:0; }
.product-discovery dl > div,.product-facts dl > div { padding:22px; background:#eaf2ed; border-radius:18px; margin-bottom:12px; }
.product-discovery dt,.product-facts dt { font-size:15px; font-weight:600; margin-bottom:8px; }
.product-discovery dd,.product-facts dd { margin:0; color:var(--muted); font-size:15px; line-height:1.75; }
.product-facts dl { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-block:28px; }
.product-facts dl > div { margin:0; }
.product-screens { padding-block:70px; }
.product-screens > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:32px; }
.product-screens figure { margin:0; padding:22px; border-radius:28px; background:#e8f0e6; }
.product-screens figure:nth-child(2) { background:#f1efdc; }
.product-screens img { width:100%; height:auto; border-radius:24px; }
.product-screens figcaption { font-size:14px; line-height:1.6; padding-top:20px; }
.product-screens figcaption a { display:block; font-size:12px; margin-top:12px; }
.product-editorial { padding-bottom:60px; max-width:850px; }
@media(max-width:700px) {
 .product-discovery,.product-facts dl { grid-template-columns:1fr; gap:20px; }
 .product-discovery { padding-block:20px 40px; }
 .product-screens > div { grid-template-columns:1fr; }
 .product-screens figure { max-width:330px; margin-inline:auto; width:100%; }
 .product-screens { padding-block:40px; }
 .answer-card,.example-note { padding:22px; }
}
