/* Editorial comparison pages: the same quiet, illustrated language as our field guides. */
.comparison-page { --comparison-green:#173c31; background:#f8f5ee; color:#173c31; max-width:1240px; margin:24px auto; border:1px solid #dfd9cc; border-radius:14px; overflow-x:clip; }
.comparison-page .container { width:auto; max-width:none; margin-inline:0; padding-inline:44px; }
.comparison-page .site-header { background:transparent; border-bottom:1px solid #e6e0d5; }
.comparison-page .site-header .nav { padding:20px 44px; }
.comparison-page .site-header .glottie-brand { color:#173c31; }
.comparison-page .comparison-brand > img { display:none; }
.comparison-page .comparison-brand .glottie-wordmark { font-size:30px; }
.comparison-page .pair-nav-actions { gap:22px; }
.comparison-page .comparison-hero { display:grid; grid-template-columns:1fr 1fr; padding:0; background:transparent; color:#173c31; border-bottom:1px solid #e6e0d5; }
.comparison-hero > .container { padding:34px 40px 42px; min-width:0; align-self:center; }
.comparison-hero h1 { font-size:clamp(39px,4.1vw,59px); line-height:1.04; margin-bottom:22px; letter-spacing:-.035em; }
.comparison-hero .eyebrow { color:#ad603d; margin:22px 0 16px; font-size:11px; letter-spacing:.1em; }
.comparison-hero .comparison-back { color:#687166; font-size:12px; }
.comparison-hero .comparison-lead { color:#4e594f; font-size:17px; line-height:1.7; }
.comparison-hero .comparison-byline { color:#697267; font-size:11px; margin:22px 0; }
.comparison-hero .comparison-actions { gap:16px; margin-top:24px; }
.comparison-hero .comparison-actions > a:not(.app-store-badge) { font-size:12px; }
.comparison-photo { margin:0; position:relative; min-width:0; min-height:570px; overflow:hidden; }
.comparison-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:55% center; }
.comparison-page .comparison-apps { gap:15px; margin:25px 0 20px; align-items:center; }
.comparison-page .comparison-app { gap:6px; }
.comparison-page .comparison-app img { width:52px; height:52px; border-radius:12px; box-shadow:0 3px 10px #173c3112; }
.comparison-page .comparison-app figcaption { font-size:10px; }
.comparison-page .comparison-versus { height:52px; font-size:18px; color:#9b7956; align-self:start; }
.comparison-page .comparison-content { padding-top:0; padding-bottom:35px; }
.comparison-verdict { gap:0; border-bottom:1px solid #dfd9cc; }
.comparison-page .comparison-verdict > div { border:0; border-radius:0; background:transparent; padding:32px 28px 32px 0; }
.comparison-page .comparison-verdict > div + div { border-inline-start:1px solid #e6e0d5; padding-inline:28px 0; }
.comparison-verdict h2 { font-size:29px; margin:12px 0; }
.comparison-verdict p:last-child { font-size:15px; line-height:1.75; }
.comparison-content .eyebrow,.comparison-directory .eyebrow { font-size:11px; color:#ad603d; letter-spacing:.09em; }
.comparison-section { padding-top:38px; }
.comparison-section h2,.comparison-directory > h2,.comparison-more > h2 { font-size:34px; margin-bottom:20px; }
.comparison-table-scroll { border-radius:3px; background:transparent; }
.comparison-table-scroll table { font-size:14px; }
.comparison-table-scroll th,.comparison-table-scroll td { padding:18px 20px; }
.comparison-table-scroll thead { background:#e9ecdf; }
.comparison-table-scroll tbody td:nth-child(2) { background:#f0f1e7; }
.comparison-article { max-width:none; }
.comparison-narrative { display:grid; grid-template-columns:1fr; border-bottom:1px solid #e6e0d5; padding-block:36px; }
.comparison-section-copy { max-width:800px; }
.comparison-section-copy > p:not(.eyebrow) { color:#525d52; font-size:16px; line-height:1.85; }
.comparison-narrative:has(.comparison-inline-photo) { grid-template-columns:.85fr 1.15fr; gap:38px; align-items:center; }
.comparison-inline-photo { margin:0; align-self:stretch; min-height:300px; position:relative; overflow:hidden; border-radius:3px; }
.comparison-inline-photo img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; }
.comparison-faq details { padding:17px 0; }
.comparison-faq summary { font-size:16px; font-weight:400; }
.comparison-faq details p { font-size:15px; }
.comparison-method { background:transparent; border-top:1px solid #dfd9cc; border-radius:0; padding:25px 0 0; margin-top:35px; font-size:12px; }
.comparison-method ol { columns:2; column-gap:44px; padding-inline-start:20px; }
.comparison-method li { break-inside:avoid; overflow-wrap:anywhere; }
.comparison-page .comparison-cta { background:#eee5d8; color:#173c31; padding:36px; border-radius:8px; margin:40px 0; min-height:230px; position:relative; overflow:hidden; }
.comparison-content .comparison-cta .eyebrow { color:#ad603d; }
.comparison-cta h2 { font-size:38px; margin:15px 0; }
.comparison-cta > p,.comparison-cta > h2,.comparison-cta > .comparison-actions { max-width:75%; position:relative; }
.comparison-cta > p { font-size:15px; line-height:1.7; }
.comparison-cta .comparison-reading { color:#525d52; font-size:12px; }
.comparison-ornament { object-fit:contain; }
.comparison-cta > .comparison-ornament { position:absolute; inset-inline-end:-15px; bottom:5px; width:250px; height:270px; opacity:.9; }
.comparison-cards { gap:24px; }
.comparison-cards > a { border:0; border-radius:0; background:transparent; padding:0 0 20px; gap:13px; border-bottom:1px solid #dfd9cc; }
.comparison-card-photo { margin:0 0 8px; overflow:hidden; aspect-ratio:1.6; border-radius:3px; }
.comparison-card-photo img { width:100%; height:100%; object-fit:cover; transition:transform .25s; }
.comparison-cards > a:hover .comparison-card-photo img { transform:scale(1.025); }
.comparison-cards h3 { font-size:28px; }
.comparison-cards p { font-size:14px; }
.comparison-directory { padding-block:36px; }
.comparison-principle { border-top:1px solid #dfd9cc; margin-top:40px; padding-top:30px; max-width:none; font-size:16px; }
.comparison-principle > .comparison-ornament { float:inline-end; width:190px; height:220px; margin-inline-start:35px; }
.comparison-principle h2 { font-size:32px; }
.comparison-index-hero .comparison-photo { min-height:500px; }
.comparison-page .footer-rich { background:transparent; border-top:1px solid #dfd9cc; }
@media(max-width:760px) {
 .comparison-page { margin:8px; border-radius:10px; }
 .comparison-page .container { padding-inline:22px; }
 .comparison-page .site-header .nav { padding:17px 20px; }
 .comparison-page .pair-nav-actions { gap:12px; }
 .comparison-page .comparison-hero { grid-template-columns:1fr; }
 .comparison-hero > .container { padding:27px 22px 30px; }
 .comparison-hero h1 { font-size:42px; }
 .comparison-hero .comparison-lead { font-size:16px; }
 .comparison-photo,.comparison-index-hero .comparison-photo { min-height:0; height:300px; }
 .comparison-photo img { object-position:center; }
 .comparison-verdict { grid-template-columns:1fr; }
 .comparison-page .comparison-verdict > div { padding:26px 0; }
 .comparison-page .comparison-verdict > div + div { border-inline-start:0; border-top:1px solid #e6e0d5; padding:26px 0; }
 .comparison-section h2,.comparison-directory > h2,.comparison-more > h2 { font-size:30px; }
 .comparison-table-scroll th,.comparison-table-scroll td { padding:16px; }
 .comparison-narrative:has(.comparison-inline-photo) { grid-template-columns:1fr; gap:25px; }
 .comparison-inline-photo { min-height:230px; }
 .comparison-method ol { columns:1; }
 .comparison-page .comparison-cta { padding:26px 22px 140px; }
 .comparison-cta > p,.comparison-cta > h2,.comparison-cta > .comparison-actions { max-width:100%; }
 .comparison-cta h2 { font-size:34px; }
 .comparison-cta > .comparison-ornament { width:155px; height:165px; bottom:-12px; inset-inline-end:15px; }
 .comparison-principle > .comparison-ornament { width:110px; height:140px; margin-inline-start:15px; }
}
@media(prefers-reduced-motion:reduce) { .comparison-card-photo img { transition:none; } }
.comparison-page .pair-nav-home,.comparison-page .locale-switcher summary { color:#173c31; }
.comparison-page .site-header .nav { min-height:72px; }
