/* Soft Sage + Deep Olive: the site's shared colour system. */
:root {
  --sage: #acc8a2;
  --olive: #1a2517;
  --paper: #f5f8f2;
  --ink: var(--olive);
  --green: var(--olive);
  --muted: #4b5c45;
  --line: #cedbc8;
  --sage-tint: #e4eddf;
  --sage-shade: #44613c;
}
::selection { background: var(--sage); color: var(--olive); }
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible {
  outline-color: var(--sage-shade);
}
.preview-note,.primary,.filter.active,.library-filters button.active,
.save-pick[aria-pressed=true] { background: var(--olive); color: var(--sage); }
.preview-note span { opacity: 1; }
.primary:hover { background: var(--sage-shade); color: var(--paper); }
h1 em,.nav-trigger.current,.nav-home.current { color: var(--sage-shade); }
.outline,.quiet-link,.tile-arrow,.caption-icon { border-color: #7a9470; }
.outline:hover,.saved-count,.tags span { background: var(--sage-tint); color: var(--olive); }
.header nav a:hover,.quiet-link:hover,.compare-button,.card-kicker,
.tile-copy .eyebrow,.pick-copy>.eyebrow,.breadcrumb,.article-meta,
.article-disclosure>span,.article-jumps span,.profile-facts>span,
.profile-number,.profile-check ul { color: var(--muted); }
.mega-menu,.search,dialog,.compare-bar { background: var(--paper); }
.mega-links a:hover,.finder-options a:hover,.filter:hover {
  background: var(--sage); color: var(--olive);
}
.library,.comparison-section { background: var(--sage); --line: #8faa85; }
.library p,.directory-title>span,.directory-link>span:last-child {
  color: #34462e;
}
.library-filters,.directory-title,.directory-link { border-color: #8faa85; }
.library-filters button:not(.active):hover,.directory-link:hover {
  background: #bdd4b5; color: var(--olive);
}
.library .search { border-color: #8faa85; }
.search input::placeholder { color: var(--muted); opacity: 1; }
.tile-art,.pick-art,.article-art,.product-art.sage { background: var(--sage); }
.tile-art.sand,.pick-art.sand,.article-art.sand,.product-art.sand {
  background: #e1e9d9;
}
.tile-art.blue,.pick-art.blue,.article-art.blue,.product-art.blue {
  background: #c7d9c1;
}
.tile-art.rose,.pick-art.rose,.article-art.rose,.product-art.rose {
  background: #d6e3ce;
}
.ribbon,.save-pick { background: var(--paper); color: var(--olive); border-color: #8faa85; }
.article-jumps,.profile-check { background: var(--sage-tint); }
.comparison-section thead th { background: var(--olive); color: var(--sage); }
.comparison-section tbody tr:last-child a { color: var(--olive); text-decoration: underline; }
.sleeper-scene .art-heading,.sleeper-scene .art-index,
.sleeper-scene .art-caption,.sleeper-scene .art-script { color: var(--olive); }
.new-footer {
  width: 100%;
  padding-inline: max(50px, calc((100% - 1280px) / 2));
  background: var(--olive);
  color: var(--sage);
  border-color: var(--olive);
}
.new-footer p,.new-footer small { color: var(--sage); }
.new-footer a:focus-visible { outline-color: var(--sage); }
.new-footer .brand-mark path:first-child { fill: var(--sage); stroke: var(--sage); }
.new-footer .brand-mark path:nth-child(2) { stroke: var(--olive); }
.new-footer .brand-mark path:last-child { fill: var(--olive); }
@media(max-width:1100px) { .new-footer { padding-inline: 28px; } } @media(max-width:580px) { .new-footer { padding-inline: 18px; } }

/* Copyright and affiliate disclosure. */
.new-footer{flex-direction:column;align-items:flex-start;justify-content:flex-start}.new-footer .footer-legal{width:100%;max-width:none;text-align:left;overflow-wrap:anywhere}.new-footer .footer-legal p{font-size:14px;line-height:1.8}.new-footer .footer-legal p+p{margin-top:6px}

/* Full site name with a closer tagline. */
.brand-sub{margin-top:5px}.brand-name{display:block;min-width:0}.header-main{gap:16px}.header-main .brand{min-width:0}.header-right{flex-shrink:0}@media(max-width:580px){.header-main .brand{font-size:clamp(18px,4.8vw,23px)}.header-main .brand-mark{width:32px;height:32px}.header-main .header-right{gap:10px}.header-main .brand-sub{letter-spacing:.8px}.new-footer .brand{font-size:23px}}

/* Compact navigation with consistently aligned chevrons and a clear finder CTA. */
.main-nav{justify-content:center;gap:34px}
.nav-trigger{gap:10px;padding-inline:0;line-height:1.4}
.nav-chevron{display:inline-block;flex:none;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-4px;transition:transform .18s ease}
.nav-trigger[aria-expanded=true] .nav-chevron{transform:rotate(225deg);margin-top:4px}
.header-right .saved-open{min-width:44px;min-height:44px;justify-content:center;gap:7px;font-size:22px}
.finder-cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 25px;border:1px solid var(--olive);border-radius:999px;background:var(--olive);color:var(--sage);font-size:13px;font-weight:600;line-height:1.4;white-space:nowrap;box-shadow:0 4px 12px #1a251714;transition:background .18s ease,box-shadow .18s ease}
.finder-cta:hover{background:#2d4025;box-shadow:0 5px 16px #1a251726}
@media(max-width:1050px){.main-nav{gap:26px}}
@media(max-width:760px){.header-main{height:auto;min-height:94px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;padding-block:16px}.header-main .brand{grid-column:1;grid-row:1}.header-right{display:contents}.mobile-toggle{grid-column:2;grid-row:1;min-width:44px;min-height:44px}.header-right .saved-open{grid-column:2;grid-row:2}.header-right .finder-cta{grid-column:1;grid-row:2;width:100%;min-height:44px}.main-nav .nav-trigger{padding-inline:0}.nav-chevron{margin-right:4px}}

/* Homepage buying guide, based on the SEC 2 buying-guide topics. */
.choosing-guide{padding-block:76px 66px;scroll-margin-top:110px;background:var(--paper)}
.choosing-guide-intro{width:100%;margin-bottom:38px}
.choosing-guide-intro h2{font-size:clamp(34px,4vw,50px);line-height:1.08;margin:14px 0 20px;max-width:none;text-wrap:balance}
.choosing-guide-intro>p{font-size:15px;line-height:1.8;max-width:none}
.choosing-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:54px;row-gap:30px}
.choosing-guide-grid article{display:flex;gap:16px;border-top:1px solid var(--line);padding-top:24px}
.choosing-step{font-family:var(--serif);font-size:28px;line-height:1.2;color:var(--sage-shade);flex:none}
.choosing-guide h3{font-size:18px;font-weight:550;line-height:1.4;margin:0 0 10px}
.choosing-guide-grid p{font-size:14px;line-height:1.8}
.choosing-guide p a{color:var(--olive);text-decoration:underline;text-decoration-color:#859e79;text-underline-offset:3px}
.choosing-guide p a:hover{color:var(--sage-shade);text-decoration-color:currentColor}
.choosing-guide-check{margin-top:36px;padding:22px 26px;border-radius:6px;background:var(--sage-tint);display:flex;align-items:baseline;gap:26px}
.choosing-guide-check strong{white-space:nowrap;font-size:14px;font-weight:600}
.choosing-guide-check p{font-size:13px;line-height:1.8}
.choosing-guide .choosing-guide-sources{font-size:11px;line-height:1.9;margin-top:20px}
@media(max-width:760px){.choosing-guide{padding-block:48px}.choosing-guide-grid{grid-template-columns:1fr;gap:24px}.choosing-guide-intro{margin-bottom:26px}.choosing-guide-check{display:block;padding:20px}.choosing-guide-check p{margin-top:7px}.choosing-guide h3{font-size:18px}.choosing-guide-grid article{gap:12px}}

/* Searchable homepage FAQ. Native disclosures remain usable without JavaScript. */
.home-faq{background:var(--sage-tint);border-top:1px solid var(--line);padding-block:72px;scroll-margin-top:110px}
.home-faq-intro h2{font-size:clamp(34px,4vw,50px);line-height:1.1;text-wrap:balance;margin-bottom:20px}
.home-faq-intro>p{font-size:15px;line-height:1.8}
.home-faq-tools{margin-top:30px}
.home-faq-search-row{display:flex;align-items:flex-end;gap:18px}
.home-faq-search{display:block;flex:1;font-size:12px;font-weight:600;min-width:0}
.home-faq-search input{display:block;width:100%;margin-top:8px;min-height:48px;border:1px solid #91a786;border-radius:6px;padding:12px 16px;background:var(--paper);color:var(--olive);font-size:14px;font-weight:400}
.home-faq-search input::placeholder{color:var(--muted);opacity:1}
.home-faq-toggle,.home-faq-empty button{min-height:48px;background:var(--olive);color:var(--sage);padding:12px 22px;border-radius:6px;font-size:13px;font-weight:600}
.home-faq-toggle:disabled{opacity:.5;cursor:default}
.home-faq-filters{display:flex;flex-wrap:wrap;gap:8px;margin-block:18px}
.home-faq-filters button{min-height:40px;border:1px solid #91a786;border-radius:999px;background:transparent;padding:8px 14px;font-size:12px;line-height:1.5}
.home-faq-filters button[aria-pressed=true]{background:var(--olive);border-color:var(--olive);color:var(--sage)}
.home-faq-filters span{margin-left:5px}
.home-faq-count{font-size:12px}
.home-faq-group{display:grid;grid-template-columns:210px minmax(0,1fr);gap:36px;margin-top:42px;scroll-margin-top:110px}
.home-faq-group>h3{font-family:var(--serif);font-size:30px;font-weight:400;line-height:1.15;padding-top:18px}
.home-faq-group>h3>span{display:block;font-family:var(--sans);font-size:11px;color:var(--muted);margin-top:10px}
.home-faq-item{border-top:1px solid #a6b69e;scroll-margin-top:110px}
.home-faq-item:last-child{border-bottom:1px solid #a6b69e}
.home-faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 4px;cursor:pointer;list-style:none}
.home-faq-item summary::-webkit-details-marker{display:none}
.home-faq-item summary::after{content:'+';font-size:24px;font-weight:400;line-height:1;flex:none;width:22px;text-align:center}
.home-faq-item[open] summary::after{content:'−'}
.home-faq-item h4{font-size:15px;font-weight:550;line-height:1.6;margin:0}
.home-faq-answer{padding:0 38px 22px 4px}
.home-faq-answer>p{font-size:14px;line-height:1.85}
.home-faq-answer a{color:var(--olive);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#78916d}
.home-faq-answer a:hover{color:var(--sage-shade);text-decoration-color:currentColor}
.home-faq-answer .home-faq-related{font-size:12px;margin-top:12px}
.home-faq-answer .home-faq-source{font-size:11px;margin-top:9px}
.home-faq-empty{padding:36px 0}
.home-faq-empty h3{font-size:22px;margin-bottom:8px}
.home-faq-empty button{margin-top:16px}
@media(max-width:900px){.home-faq-group{grid-template-columns:170px minmax(0,1fr);gap:24px}}
@media(max-width:760px){.home-faq{padding-block:48px}.home-faq-group{display:block;margin-top:30px}.home-faq-group>h3{font-size:28px;padding-top:0;margin-bottom:18px}.home-faq-group>h3>span{margin-top:7px}.home-faq-search-row{display:block}.home-faq-toggle{margin-top:12px;min-height:44px}.home-faq-filters{gap:7px}.home-faq-filters button{padding:8px 12px}.home-faq-item summary{padding-block:18px;gap:12px}.home-faq-answer{padding-right:4px}.home-faq-item h4{font-size:15px}}

/* Five distinct, descriptive guide collections. */
.library-browser{padding-block:25px 32px;scroll-margin-top:110px}
.library-browser-top{display:flex;justify-content:space-between;align-items:center;gap:30px}
.library-browser-title{font-size:21px;font-weight:550;color:var(--olive);margin-bottom:4px}
.library-browser-top>div>p:last-child{font-size:13px}
.collection-search{display:block;font-size:11px;font-weight:600;flex:0 1 370px;min-width:0}
.collection-search input{display:block;width:100%;min-height:46px;border:1px solid #91a786;border-radius:6px;background:transparent;color:var(--olive);padding:11px 14px;margin-top:6px;font-size:13px;font-weight:400}
.collection-search input::placeholder{color:var(--muted);opacity:1}
.collection-jumps{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.collection-jumps a{display:inline-flex;align-items:center;gap:13px;min-height:44px;padding:10px 18px;border:1px solid var(--line);border-radius:999px;font-size:13px;background:var(--paper);transition:background .15s ease,border-color .15s ease}
.collection-jumps a span{font-size:10px;color:var(--sage-shade)}
.collection-jumps a:hover{background:var(--sage-tint);border-color:#91a786}
.collection-search-status{display:flex;align-items:center;gap:18px;margin-top:14px;min-height:25px}
.collection-search-status p{font-size:11px}
.collection-search-status button{background:none;text-decoration:underline;text-underline-offset:3px;font-size:12px;padding:4px 0}
.guide-collection{padding-block:64px;scroll-margin-top:100px;border-top:1px solid var(--line)}
.collection-needs,.collection-brands{background:var(--sage-tint)}
.collection-types,.collection-feel{background:var(--paper)}
.collection-materials{background:#edf3e8}

.collection-heading{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.85fr);gap:60px;align-items:center;margin-bottom:34px}
.collection-index{display:flex;align-items:center;gap:12px;color:var(--olive);font-size:11px;line-height:1.4;margin-bottom:13px}
.collection-index>span:first-child{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid #91a786;border-radius:50%;font-size:12px}
.collection-heading h2{font-size:clamp(40px,4.5vw,58px);line-height:1.05;margin-bottom:17px}
.collection-description{font-size:15px;line-height:1.8;color:var(--olive);max-width:640px}
.collection-insight{display:flex;align-items:center;gap:18px;padding:22px;border:1px solid #c1d1b8;border-radius:14px;background:#f5f8f2b3}
.collection-insight svg{width:76px;height:76px;flex:none;fill:none;stroke:var(--olive);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.collection-insight strong{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
.collection-insight p{font-size:12px;line-height:1.75}
.collection-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
.collection-panel{min-width:0;padding:22px 22px 8px;border:1px solid #c1d1b8;border-radius:12px;background:var(--paper)}
.collection-panel>h3{font-size:13px;font-weight:600;line-height:1.5;margin:0 0 12px}
.collection-card{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:19px 0;min-height:98px;transition:color .15s ease}
.collection-card-copy{display:block;min-width:0}
.collection-card-title{display:block;font-size:16px;font-weight:500;line-height:1.35;margin-bottom:6px}
.collection-card-description{display:block;font-size:12px;line-height:1.65;color:var(--muted)}
.collection-card-arrow{display:flex;align-items:center;justify-content:center;flex:none;width:27px;height:27px;border:1px solid var(--line);border-radius:50%;font-size:14px;transition:background .15s ease,color .15s ease}
.collection-card:hover .collection-card-title{text-decoration:underline;text-underline-offset:4px}
.collection-card:hover .collection-card-arrow{background:var(--olive);color:var(--sage);border-color:var(--olive)}
.collection-types .collection-panels{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.collection-types .collection-panel{padding-inline:18px}
.collection-brands .collection-panels{display:block}
.collection-brands .collection-panel{border:0;padding:0;background:none}
.collection-brands .collection-panel>h3{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.collection-brands .collection-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.collection-brands .collection-card{display:flex;align-items:center;justify-content:center;text-align:center;position:relative;padding:24px;min-height:160px;border:1px solid #c1d1b8;border-radius:12px;background:#fff;transition:border-color .2s ease,box-shadow .2s ease}
.collection-brand-logo{display:flex;align-items:center;height:82px;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.collection-brand-logo img{display:block;width:auto;height:auto;max-width:min(168px,100%);max-height:60px;object-fit:contain;object-position:left center}
.collection-brands .collection-card-copy{width:100%;padding:0}
.collection-brands .collection-card-arrow{position:absolute;right:12px;bottom:12px}
.collection-brands .collection-card:hover,.collection-brands .collection-card:focus-visible{border-color:var(--sage-shade);box-shadow:0 8px 24px #1a251712}
.collection-brands .collection-card:hover .collection-card-title{color:var(--sage-shade)}
.collection-brands .collection-card-title{font-family:var(--serif);font-size:26px;font-weight:400;letter-spacing:-.5px;margin-bottom:9px}
.library-browser #no-guides{padding-top:24px}
.library-browser #no-guides h3{font-size:23px;margin-bottom:8px}
.library-browser #no-guides button{margin-top:15px}
@media(max-width:1050px){.collection-heading{gap:28px;grid-template-columns:minmax(0,1.3fr) minmax(270px,1fr)}.collection-insight{padding:18px;gap:12px}.collection-insight svg{width:55px;height:55px}.collection-types .collection-panels{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-panels{gap:14px}.collection-panel{padding-inline:16px}.collection-brands .collection-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.library-browser{padding-block:20px 26px}.library-browser-top{display:block}.collection-search{margin-top:20px}.collection-jumps{gap:8px;margin-top:20px}.collection-jumps a{padding:9px 12px;font-size:12px;gap:9px}.guide-collection{padding-block:42px}.collection-heading{grid-template-columns:1fr;gap:22px;margin-bottom:24px}.collection-description{font-size:14px}.collection-insight{max-width:none;gap:16px}.collection-insight svg{width:56px;height:56px}.collection-panels,.collection-types .collection-panels{grid-template-columns:1fr;gap:16px}.collection-panel{padding:20px 20px 6px}.collection-card{min-height:86px;padding-block:17px}.collection-card-title{font-size:16px}.collection-card-description{font-size:13px}.collection-brands .collection-cards{gap:12px}.collection-brands .collection-card{padding:20px 16px;min-height:130px;align-items:center}.collection-brands .collection-card-title{font-size:24px}.collection-brands .collection-card-description{font-size:12px}.collection-brands .collection-card-arrow{display:none}}
@media(max-width:380px){.collection-brands .collection-cards{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.collection-jumps a,.collection-card,.collection-card-arrow{transition:none}}
@media(max-width:760px){.collection-brands .collection-card-copy{padding-right:0}}

@media(max-width:760px){.mega-menu .mega-intro{display:block;padding:4px 4px 14px}.mega-intro>.eyebrow,.mega-intro>h2,.mega-intro>p{display:none}.mega-intro>.quiet-link{font-size:12px;text-decoration:underline;text-underline-offset:4px}}
