:root { --ink:#26312e; --muted:#57665f; --paper:#fff; --cream:#f2eee3; --sage:#dbe5da; --sage-deep:#52695d; --terra:#994933; --line:#d9d5c9; --white:#fff; --shadow:0 18px 45px rgba(61,68,57,.08); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.65 Inter,"Segoe UI",Arial,sans-serif; } a { color:inherit; } .skip-link { position:absolute; left:-999px; } .skip-link:focus { left:1rem; top:1rem; z-index:9; background:var(--white); padding:.5rem 1rem; }
.site-header { min-height:82px; display:flex; align-items:center; justify-content:space-between; max-width:1200px; padding:0 28px; margin:auto; } .brand { display:block; flex:0 0 auto; width:154px; height:76px; overflow:hidden; background:url('/assets/brand/junaloo-logo.png') center/contain no-repeat; text-decoration:none; font-size:0; letter-spacing:0; } .brand span { display:none; } nav { display:flex; gap:28px; } nav a, .site-footer a { text-decoration:none; font-size:.9rem; } nav a:hover,.site-footer a:hover,.text-link:hover { color:var(--terra); } .menu-button { display:none; background:none; border:0; font:inherit; }
.hero { min-height:630px; padding:70px max(28px,calc((100vw - 1144px)/2)); display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:60px; background:var(--paper); } .hero-copy { max-width:610px; } .eyebrow { color:var(--terra); font-size:.73rem; letter-spacing:.14em; font-weight:700; text-transform:uppercase; margin:0 0 14px; } h1,h2,h3 { font-family:Georgia,"Times New Roman",serif; font-weight:500; line-height:1.12; } h1 { font-size:clamp(3rem,6vw,5.35rem); margin:0 0 24px; letter-spacing:-.055em; } h2 { font-size:clamp(2rem,3.5vw,3.2rem); margin:0; letter-spacing:-.04em; } h3 { font-size:1.5rem; margin:.4rem 0 .7rem; } .intro { font-size:1.18rem; max-width:540px; color:#45524d; } .button { display:inline-flex; gap:.7rem; align-items:center; background:var(--ink); color:white; border-radius:99px; padding:.82rem 1.2rem; margin-top:16px; text-decoration:none; font-weight:600; } .button:hover { background:var(--terra); }.small-note { color:var(--muted); font-size:.78rem; margin-top:17px; }
.hero-photo { margin:0; min-height:420px; overflow:hidden; background:var(--cream); box-shadow:var(--shadow); }.hero-photo img { display:block; width:100%; height:420px; object-fit:cover; }.hero-photo figcaption,.editorial-visual figcaption { margin-top:10px; color:var(--muted); font-size:.78rem; }
.section { max-width:1144px; margin:auto; padding:110px 28px; }.section-soft { max-width:none; padding-left:max(28px,calc((100vw - 1144px)/2)); padding-right:max(28px,calc((100vw - 1144px)/2)); background:var(--cream); }.section-heading { max-width:640px; margin-bottom:42px; }.card-grid { display:grid; gap:18px; }.four { grid-template-columns:repeat(4,1fr); }.occasion-card { min-height:220px; border-radius:4px; padding:28px 24px; text-decoration:none; transition:transform .2s,box-shadow .2s; }.occasion-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); }.occasion-card span { font-size:.75rem; font-weight:700; color:var(--ink); }.occasion-card p { color:var(--ink); font-size:.91rem; }.peach{background:#ecc9b9}.sage{background:#ceddc9}.butter{background:#eee0b1}.lilac{background:#ddd5e5}
.finder { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; align-items:start; }.finder ol { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }.finder li { display:grid; grid-template-columns:1fr 1.3fr; gap:1.5rem; padding:24px 0; border-bottom:1px solid var(--line); }.finder strong { font-family:Georgia,"Times New Roman",serif; font-size:1.23rem; font-weight:500; }.finder span { color:var(--muted); }
.topic-layout { display:grid; grid-template-columns:1fr 1fr; gap:24px; }.feature-card { min-height:350px; background:var(--sage-deep); color:white; padding:44px; display:flex; flex-direction:column; align-items:flex-start; }.feature-card .category-label,.feature-card p { color:var(--white); }.feature-card h3 { font-size:2.2rem; }.feature-card p { max-width:400px; }.feature-card a { margin-top:auto; }.topic-list { border-top:1px solid var(--line); }.topic-list a,.topic-list-item { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding:24px 6px; text-decoration:none; font-family:Georgia,"Times New Roman",serif; font-size:1.35rem; }.topic-list-item { color:var(--muted); }.topic-list-item small { color:var(--muted); font:700 .7rem/1 Inter,"Segoe UI",Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; }.topic-list b { color:var(--terra); font:2rem/1 Inter,"Segoe UI",Arial,sans-serif; }.split { display:grid; grid-template-columns:1fr 1fr; max-width:none; align-items:end; gap:50px; }.split>p { color:var(--muted); margin:0; }.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.article-grid article { background:var(--white); padding:28px; min-height:280px; display:flex; flex-direction:column; }.article-label,.category-label { font-size:.72rem; color:var(--terra); text-transform:uppercase; letter-spacing:.08em; font-weight:700; }.article-grid h3 { font-size:1.55rem; }.article-grid p:not(.article-label) { color:var(--muted); }.article-grid a { margin-top:auto; text-decoration:none; font-weight:600; }
.methodology { text-align:center; max-width:900px; }.methodology h2 { max-width:760px; margin:auto; }.method-grid { display:grid; grid-template-columns:1fr 1fr; text-align:left; gap:45px; margin:40px 0; }.method-grid p { color:var(--muted); }.text-link { color:var(--terra); font-weight:700; }.site-footer { padding:55px max(28px,calc((100vw - 1144px)/2)); background:#26312e; color:#f5f2e9; }.site-footer>p { color:#c9d0c5; max-width:330px; }.site-footer>div:last-of-type { display:flex; gap:22px; flex-wrap:wrap; margin:22px 0 38px; }.site-footer small { color:#9faf9f; font-size:.75rem; }
@media (max-width:760px) { .site-header { min-height:68px; padding:0 20px; position:relative; }.brand { width:112px; height:56px; }.menu-button { display:block; }.site-header nav { display:none; position:absolute; z-index:3; top:68px; right:15px; left:15px; padding:18px; background:var(--white); box-shadow:var(--shadow); flex-direction:column; }.site-header nav.open{display:flex}.hero{min-height:auto;grid-template-columns:1fr;padding:62px 24px 34px;gap:40px}.hero-art{height:300px;max-width:500px;width:100%;margin:auto}.four,.article-grid{grid-template-columns:1fr 1fr}.two,.finder,.topic-layout,.split,.method-grid{grid-template-columns:1fr;gap:30px}.section{padding:70px 24px}.section-soft{padding-left:24px;padding-right:24px}.finder li{grid-template-columns:1fr;gap:.2rem}.feature-card{min-height:300px;padding:30px}.split{margin-bottom:35px} }
@media (max-width:480px) {h1{font-size:3rem}.four,.two,.article-grid{grid-template-columns:1fr}.hero-art{height:250px}.plate{left:30px;bottom:8px;transform:scale(.8);transform-origin:bottom left}.gift{right:25px;bottom:30px;transform:scale(.78) rotate(7deg);transform-origin:bottom right}.sun{right:20px;top:20px;transform:scale(.78);transform-origin:top right}.cup{left:18px;top:65px;transform:scale(.75) rotate(-8deg)} }
.page-hero { max-width:900px; margin:auto; padding:72px 28px 88px; }.page-hero h1 { max-width:780px; font-size:clamp(2.8rem,5.4vw,4.8rem); }.breadcrumbs { display:flex; flex-wrap:wrap; gap:.55rem; margin:0 0 36px; color:var(--muted); font-size:.84rem; }.breadcrumbs a { color:inherit; }.breadcrumbs a:hover { color:var(--terra); }.hub-intro { max-width:850px; padding-top:70px; padding-bottom:70px; }.hub-intro p,.content-width { max-width:700px; color:var(--muted); font-size:1.05rem; }.occasion-guide { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; padding-top:0; padding-bottom:0; background:var(--line); }.occasion-guide article { background:var(--cream); padding:56px max(28px,calc((100vw - 1144px)/4)); min-height:330px; }.occasion-guide h2 { font-size:clamp(1.9rem,3.2vw,2.8rem); }.occasion-guide p { max-width:480px; color:var(--muted); }.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.idea-cards article,.value-cards article { padding:32px; background:var(--white); border:1px solid var(--line); display:flex; flex-direction:column; }.idea-cards h2 { font-size:1.8rem; }.idea-cards p,.value-cards p { color:var(--muted); }.topic-status { margin-top:auto; padding-top:24px; color:var(--muted); font-size:.84rem; font-weight:700; }.article-page { max-width:780px; margin:auto; padding:70px 28px 110px; }.article-page h1 { font-size:clamp(2.6rem,5.2vw,4.4rem); margin:0 0 28px; }.article-page h2 { margin-top:58px; font-size:clamp(1.8rem,3.3vw,2.6rem); }.article-page p { font-size:1.06rem; }.article-lead { color:#45524d; font-size:1.25rem!important; }.research-note { margin:42px 0; padding:25px 28px; border-top:2px solid var(--terra); background:var(--cream); }.research-note p { margin:.35rem 0 0; color:var(--muted); }.article-meta { margin-top:50px; padding-top:20px; border-top:1px solid var(--line); font-size:.85rem!important; color:var(--muted); }.method-steps { max-width:900px; }.method-steps ol { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }.method-steps li { display:grid; grid-template-columns:minmax(180px,.65fr) 1.35fr; gap:32px; padding:28px 0; border-bottom:1px solid var(--line); }.method-steps strong { font:1.35rem/1.25 Georgia,"Times New Roman",serif; font-weight:500; }.method-steps span { color:var(--muted); }.two-column-copy { display:grid; grid-template-columns:1fr 1fr; gap:70px; max-width:1000px; }.two-column-copy p { color:var(--muted); font-size:1.05rem; }.three { grid-template-columns:repeat(3,1fr); }.value-cards { margin-bottom:34px; }
.occasion-overview { max-width:1144px; }.occasion-overview .section-heading { max-width:720px; margin-bottom:32px; }.occasion-overview .section-heading p:last-child { color:var(--muted); }.occasion-overview__table { border-top:2px solid var(--ink); }.occasion-overview__table>div { display:grid; grid-template-columns:.7fr 1.5fr .8fr; gap:28px; align-items:center; padding:22px 0; border-bottom:1px solid var(--line); }.occasion-overview__head { color:var(--muted); font-size:.76rem; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }.occasion-overview__table strong { font:500 1.32rem/1.2 Georgia,"Times New Roman",serif; }.occasion-overview__table>div:not(.occasion-overview__head)>span { color:var(--muted); }.occasion-overview__table a { color:var(--terra); font-weight:700; text-decoration:none; }.occasion-overview__table a:hover { text-decoration:underline; }
.editorial-visual { margin:0; }.editorial-visual img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; }.family-feature { display:grid; grid-template-columns:1fr .85fr; gap:70px; align-items:center; background:var(--sage); max-width:none; padding-left:max(28px,calc((100vw - 1144px)/2)); padding-right:max(28px,calc((100vw - 1144px)/2)); }.family-feature>div { max-width:560px; }.family-feature .editorial-visual img { aspect-ratio:4/5; }.family-hero { max-width:1144px; margin:auto; padding:70px 28px 100px; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:70px; }.family-hero h1 { font:500 clamp(3rem,5.5vw,5.3rem)/1.05 Georgia,"Times New Roman",serif; letter-spacing:-.04em; margin:0 0 24px; }.family-hero .editorial-visual img { aspect-ratio:16/10; }.room-hero .editorial-visual img { aspect-ratio:3/4; }.family-question-list,.room-principles ol { border-top:1px solid var(--line); }.family-question-list article,.room-principles li { display:grid; grid-template-columns:minmax(220px,.8fr) 1.2fr; gap:40px; padding:28px 0; border-bottom:1px solid var(--line); }.room-principles ol { list-style:none; margin:0; padding:0; }.family-question-list h3,.role-grid h3 { margin:0; font-size:1.55rem; }.family-question-list p,.role-grid p,.room-principles span { margin:0; color:var(--muted); }.family-roles { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; }.role-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.role-grid article { padding:0 0 24px; border-bottom:1px solid var(--line); }.related-guides { padding-top:0; }.room-guides { max-width:none; padding-left:max(28px,calc((100vw - 1144px)/2)); padding-right:max(28px,calc((100vw - 1144px)/2)); }
.role-page-hero { max-width:1144px; margin:auto; padding:70px 28px 100px; display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:center; }.role-page-hero h1 { font:500 clamp(3rem,5.5vw,5.3rem)/1.05 Georgia,"Times New Roman",serif; letter-spacing:-.04em; margin:0 0 24px; }.role-page-hero .editorial-visual img { aspect-ratio:16/10; }.decision-list { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }.decision-list li { display:grid; grid-template-columns:minmax(260px,.8fr) 1.2fr; gap:40px; padding:28px 0; border-bottom:1px solid var(--line); }.decision-list strong { font:500 1.35rem/1.25 Georgia,"Times New Roman",serif; }.decision-list span { color:var(--muted); }
.affiliate-note { margin:42px 0; padding:26px 28px; border:1px solid #dfc291; background:#fff7e9; }.affiliate-note p { margin:.35rem 0 0; color:#4b5751; }.affiliate-note .button { font-size:.92rem; }.affiliate-details { display:block; width:max-content; margin-top:13px; color:var(--terra); font-size:.86rem; font-weight:700; }.affiliate-note__image { margin:18px 0 20px; }.affiliate-note__image img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; }.affiliate-note__image figcaption { margin-top:7px; color:var(--muted); font-size:.72rem; }
.product-facts { margin:36px 0 0; padding:25px 28px; border-top:2px solid var(--ink); background:var(--cream); }.product-facts__label { margin:0 0 17px!important; color:var(--terra)!important; font-size:.76rem!important; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.product-facts dl { margin:0; border-top:1px solid var(--line); }.product-facts dl>div { display:grid; grid-template-columns:minmax(140px,.6fr) 1.4fr; gap:22px; padding:13px 0; border-bottom:1px solid var(--line); }.product-facts dt { font-weight:750; }.product-facts dd { margin:0; color:var(--muted); }.product-facts>p:last-child { margin:16px 0 0; color:var(--muted); font-size:.86rem!important; }
.consent-banner { position:fixed; z-index:20; right:24px; bottom:24px; left:24px; max-width:760px; margin:auto; padding:24px; display:flex; gap:24px; align-items:end; justify-content:space-between; border:1px solid var(--line); background:var(--white); box-shadow:0 16px 45px rgba(38,49,46,.2); }.consent-banner strong { display:block; font:500 1.25rem/1.2 Georgia,"Times New Roman",serif; }.consent-banner p { max-width:480px; margin:.55rem 0; color:var(--muted); font-size:.9rem; }.consent-banner a,.consent-settings { color:var(--terra); font-weight:700; }.consent-banner__actions { display:flex; flex-wrap:wrap; gap:10px; flex:0 0 auto; }.consent-banner button { min-height:42px; padding:0 16px; border:1px solid var(--ink); cursor:pointer; font:700 .86rem/1 Inter,Arial,sans-serif; }.consent-banner__reject { background:var(--white); color:var(--ink); }.consent-banner__accept { background:var(--ink); color:var(--white); }.consent-settings { padding:0; border:0; background:transparent; cursor:pointer; font:700 1rem/1.4 Inter,Arial,sans-serif; text-decoration:underline; }
.article-next { margin:48px 0 8px; padding:30px; background:var(--cream); border-top:1px solid var(--ink); }.article-next h2 { margin:0 0 14px!important; font-size:1.7rem!important; }.article-next p { color:var(--muted); margin:0 0 16px; }.article-next p:last-child { margin-bottom:0; }
@media (max-width:760px) { .page-hero,.article-page{padding:52px 24px 66px}.occasion-guide,.two,.family-feature,.family-hero,.family-roles,.role-page-hero{grid-template-columns:1fr}.occasion-guide article{padding:44px 24px}.three,.role-grid{grid-template-columns:1fr}.two-column-copy{grid-template-columns:1fr;gap:30px}.method-steps li,.family-question-list article,.decision-list li,.product-facts dl>div{grid-template-columns:1fr;gap:.2rem}.idea-cards article{min-height:0;padding:28px 24px}.topic-list a,.topic-list-item{gap:16px}.topic-list-item small{flex:0 0 auto;text-align:right}.hero-photo{min-height:0}.hero-photo img{height:300px}.family-feature{gap:35px;padding-top:70px;padding-bottom:70px}.family-hero,.role-page-hero{padding:52px 24px 66px;gap:36px}.family-question-list article,.decision-list li{padding:24px 0}.family-roles{gap:36px} }
@media (max-width:640px) { .consent-banner { right:14px; bottom:14px; left:14px; display:block; padding:20px; }.consent-banner__actions { margin-top:18px; } }
@media (max-width:760px) { .occasion-overview__head { display:none!important; }.occasion-overview__table>div { grid-template-columns:1fr; gap:9px; padding:24px 0; }.occasion-overview__table a { margin-top:5px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; } }

/* Magazin-Informationsarchitektur: Artikel, Vergleiche, Empfehlungen */
::selection { background:var(--sage); color:var(--ink); }
a:focus-visible,button:focus-visible { outline:3px solid var(--terra); outline-offset:4px; }
.site-header nav a[aria-current="page"] { color:var(--terra); text-decoration:underline; text-underline-offset:7px; }
.section-kicker { color:var(--terra); font-size:.74rem; font-weight:750; letter-spacing:.11em; margin:0 0 16px; text-transform:uppercase; }
.magazine-hero { max-width:1144px; min-height:620px; margin:auto; padding:72px 28px 98px; display:grid; grid-template-columns:.92fr 1.08fr; gap:68px; align-items:center; }
.magazine-hero__copy { max-width:565px; }.magazine-hero__copy h1,.magazine-page-hero h1 { max-width:750px; letter-spacing:-.04em; }.magazine-hero__copy>p:not(.section-kicker),.magazine-page-hero>p:not(.section-kicker) { max-width:570px; color:#45524d; font-size:1.16rem; }
.magazine-hero__image { margin:0; overflow:hidden; background:var(--cream); box-shadow:var(--shadow); }.magazine-hero__image img { display:block; width:100%; min-height:440px; height:440px; object-fit:cover; }.magazine-hero__image figcaption,.family-editorial figcaption { color:var(--muted); font-size:.78rem; margin-top:9px; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:28px; }.plain-link { color:var(--terra); font-weight:700; text-decoration:none; }.plain-link:hover { color:var(--ink); text-decoration:underline; text-underline-offset:5px; }
.magazine-nav { max-width:none; background:var(--cream); padding:76px max(28px,calc((100vw - 1144px)/2)); display:grid; grid-template-columns:.7fr 1.3fr; gap:72px; align-items:start; }.magazine-nav h2 { font-size:clamp(2rem,3.1vw,3rem); }.magazine-nav p { color:var(--muted); max-width:300px; }.magazine-nav__links { border-top:1px solid var(--line); }.magazine-nav__links a { display:grid; grid-template-columns:116px 1fr auto; gap:18px; align-items:center; padding:22px 0; border-bottom:1px solid var(--line); text-decoration:none; }.magazine-nav__links span { color:var(--terra); font-size:.83rem; font-weight:750; }.magazine-nav__links strong { font:500 clamp(1.2rem,2.1vw,1.65rem)/1.2 Georgia,"Times New Roman",serif; }.magazine-nav__links i,.comparison-teaser__list i { color:var(--terra); font-size:1.4rem; font-style:normal; }
.magazine-section { padding-bottom:118px; }.magazine-heading { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:42px; }.magazine-heading h2 { max-width:540px; }.story-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:22px; }.story-card { min-width:0; }.story-card a { display:block; height:100%; text-decoration:none; }.story-card img { display:block; width:100%; height:245px; object-fit:cover; background:var(--cream); }.story-card--feature img { height:332px; }.story-card div { padding:18px 2px 4px; }.story-card p,.editorial-list p { color:var(--terra); font-size:.76rem; font-weight:750; letter-spacing:.04em; margin:0 0 8px; }.story-card h3 { font-size:clamp(1.4rem,2.2vw,2rem); letter-spacing:-.025em; margin:0 0 16px; }.story-card span,.editorial-list span { color:var(--terra); font-size:.9rem; font-weight:700; }.story-card b,.editorial-list b { font-size:1.2rem; }
.comparison-teaser { max-width:none; background:var(--ink); color:var(--white); padding:100px max(28px,calc((100vw - 1144px)/2)); display:grid; grid-template-columns:.85fr 1.15fr; gap:76px; }.comparison-teaser__intro { max-width:490px; }.comparison-teaser__intro h2 { font-size:clamp(2.25rem,4vw,3.8rem); }.comparison-teaser__intro>p:not(.section-kicker) { color:#dfe6dc; }.comparison-teaser .button { background:var(--white); color:var(--ink); }.comparison-teaser .button:hover { color:var(--white); }.comparison-teaser__list { border-top:1px solid rgba(255,255,255,.33); }.comparison-teaser__list a { display:grid; grid-template-columns:1fr auto; gap:12px 22px; padding:24px 0; border-bottom:1px solid rgba(255,255,255,.33); color:var(--white); text-decoration:none; }.comparison-teaser__list strong { font:500 1.48rem/1.2 Georgia,"Times New Roman",serif; }.comparison-teaser__list span { color:#dfe6dc; }.comparison-teaser__list i { grid-row:1/3; grid-column:2; align-self:center; }
.recommendation-strip { display:grid; grid-template-columns:.8fr 1.2fr; gap:72px; align-items:start; }.recommendation-strip__copy p:not(.section-kicker) { color:var(--muted); max-width:480px; }.recommendation-strip__tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.recommendation-strip__tiles a { min-height:190px; padding:23px; background:var(--sage); color:var(--ink); display:flex; flex-direction:column; justify-content:space-between; text-decoration:none; }.recommendation-strip__tiles a:nth-child(2) { background:#eee0b1; }.recommendation-strip__tiles a:nth-child(3) { background:#ecc9b9; }.recommendation-strip__tiles span,.recommendation-board span { color:var(--terra); font-size:.73rem; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }.recommendation-strip__tiles strong { font:500 1.32rem/1.15 Georgia,"Times New Roman",serif; }
.family-editorial { max-width:none; background:var(--cream); padding:105px max(28px,calc((100vw - 1144px)/2)); display:grid; grid-template-columns:.9fr 1.1fr; gap:76px; align-items:center; }.family-editorial>div { max-width:520px; }.family-editorial figure { margin:0; }.family-editorial img { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; }
.magazine-page-hero { max-width:920px; margin:auto; padding:74px 28px 88px; }.magazine-page-hero h1 { font-size:clamp(2.9rem,5.5vw,5.1rem); margin:0 0 24px; }.editorial-list { max-width:1144px; padding-top:0; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.editorial-list article a { display:flex; min-height:100%; flex-direction:column; text-decoration:none; }.editorial-list img { display:block; width:100%; height:260px; object-fit:cover; }.editorial-list article div { padding:20px 0; }.editorial-list h2 { font-size:1.72rem; letter-spacing:-.025em; margin:0 0 18px; }.editorial-list span { margin-top:auto; }.more-topics { display:grid; grid-template-columns:1.1fr repeat(3,1fr); gap:24px; align-items:end; background:var(--cream); max-width:none; padding-left:max(28px,calc((100vw - 1144px)/2)); padding-right:max(28px,calc((100vw - 1144px)/2)); }.more-topics a { border-top:1px solid var(--line); padding-top:18px; color:var(--ink); font:500 1.23rem/1.25 Georgia,"Times New Roman",serif; text-decoration:none; }.more-topics a:hover { color:var(--terra); }
.comparison-page { padding-top:0; }.comparison-page>article { padding:58px 0; border-top:1px solid var(--line); }.comparison-page>article:last-child { border-bottom:1px solid var(--line); }.comparison-page header { display:grid; grid-template-columns:1fr 1fr; gap:42px; margin-bottom:38px; }.comparison-page header h2 { font-size:clamp(1.85rem,3vw,2.8rem); }.comparison-page header span { color:var(--muted); align-self:end; }.decision-table { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }.decision-table>div { min-height:240px; padding:28px; background:var(--white); display:flex; flex-direction:column; }.decision-table strong { font:500 1.38rem/1.2 Georgia,"Times New Roman",serif; }.decision-table p { color:var(--muted); }.decision-table a { margin-top:auto; color:var(--terra); font-weight:700; text-decoration:none; }.comparison-cta { max-width:740px; background:var(--sage); padding:38px; }.comparison-cta p { color:#3f5148; font-size:1.1rem; margin-top:0; }.research-banner { max-width:none; padding-left:max(28px,calc((100vw - 1144px)/2)); padding-right:max(28px,calc((100vw - 1144px)/2)); background:var(--cream); }.research-banner h2 { max-width:600px; }.research-banner>p { max-width:680px; color:var(--muted); }
.recommendation-board { padding-top:0; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.recommendation-board article { min-height:330px; padding:30px; border-top:2px solid var(--ink); background:var(--cream); display:flex; flex-direction:column; }.recommendation-board h2 { margin-top:26px; font-size:1.85rem; }.recommendation-board p { color:var(--muted); }.recommendation-board a { color:var(--terra); font-weight:700; margin-top:auto; text-decoration:none; }.research-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin:36px 0; }.research-steps p { margin:0; }.research-steps strong { display:block; font:500 1.35rem/1.2 Georgia,"Times New Roman",serif; margin-bottom:8px; }.research-steps span { color:var(--muted); }
.recommendation-board .recommendation-board__guide { margin-top:14px; color:var(--ink); font-size:.9rem; }.recommendation-board article:has([rel~="sponsored"]) { background:#fff7e9; }
.recommendation-board__image { margin:18px 0 4px; }.recommendation-board__image img { display:block; width:100%; height:clamp(172px,19vw,238px); aspect-ratio:auto; object-fit:cover; }.recommendation-board__image figcaption { color:var(--muted); font-size:.72rem; margin-top:6px; }
@media (max-width:760px) { .magazine-hero,.magazine-nav,.comparison-teaser,.family-editorial,.recommendation-strip { grid-template-columns:1fr; gap:38px; }.magazine-hero { min-height:0; padding:52px 24px 70px; }.magazine-hero__image img { min-height:0; height:310px; }.magazine-nav,.comparison-teaser,.family-editorial { padding:70px 24px; }.magazine-nav__links a { grid-template-columns:1fr auto; }.magazine-nav__links span { grid-column:1/3; }.story-grid,.editorial-list,.recommendation-board,.research-steps { grid-template-columns:1fr; }.story-card--feature img,.story-card img,.editorial-list img { height:250px; }.magazine-section { padding-bottom:70px; }.magazine-heading { display:block; }.magazine-heading .plain-link { display:inline-block; margin-top:18px; }.comparison-teaser__list a { grid-template-columns:1fr auto; }.recommendation-strip__tiles { grid-template-columns:1fr; }.recommendation-strip__tiles a { min-height:120px; }.family-editorial img { aspect-ratio:16/10; }.magazine-page-hero { padding:52px 24px 66px; }.editorial-list { padding:0 24px 70px; }.more-topics { grid-template-columns:1fr; padding:70px 24px; }.comparison-page { padding:0 24px 70px; }.comparison-page>article { padding:45px 0; }.comparison-page header { grid-template-columns:1fr; gap:14px; margin-bottom:28px; }.decision-table { grid-template-columns:1fr; }.decision-table>div { min-height:0; }.decision-table a { margin-top:14px; }.comparison-cta { padding:28px; }.recommendation-board { padding:0 24px 70px; }.recommendation-board article { min-height:260px; }.research-banner { padding:70px 24px; } }