/* HealthWealth100 -- design system. Distinct from HealthyWealthy100 and the Epsilon Organic brand system. Slate & Amber palette, hard square corners throughout, no rounded elements anywhere. */
:root{
  --slate:#2F4858;
  --slate-dark:#1F313C;
  --amber:#E0972D;
  --amber-dark:#B4771F;
  --ink:#1E2328;
  --muted:#6B6C64;
  --paper:#F6F4EE;
  --white:#FFFFFF;
  --line:#DAD5C7;
  --tag-bg:#EFEBDE;
  --maxw:1120px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"PT Serif", Georgia, serif;
  font-size:18px;
  line-height:1.65;
}
h1,h2,h3,h4,.eyebrow,.nav-link,.btn,.tag,.masthead-title{
  font-family:"Archivo", "Helvetica Neue", Arial, sans-serif;
}
img{max-width:100%;display:block;}
a{color:var(--slate-dark);}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

/* Top utility bar: tagline left, date + About Us right */
.topbar{background:var(--ink);color:#fff;font-family:"Barlow Condensed",sans-serif;font-size:13px;letter-spacing:.08em;text-transform:uppercase;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;padding:8px 24px;gap:16px;}
.topbar-tag{color:var(--amber);opacity:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.topbar-right{display:flex;align-items:center;gap:18px;white-space:nowrap;}
.topbar a{color:#fff;text-decoration:none;opacity:.85;}
.topbar a:hover{opacity:1;text-decoration:underline;}
.nav-date{color:#fff;opacity:.65;}
@media(max-width:700px){.nav-date{display:none;} .topbar-tag{font-size:11px;}}

/* Masthead: centered wordmark only, no separate tagline line (lives in topbar) */
.masthead{background:var(--white);}
.masthead .wrap{display:flex;align-items:center;justify-content:center;padding:26px 24px 22px;}
.masthead-title{font-weight:900;font-size:38px;letter-spacing:-.01em;color:var(--ink);text-decoration:none;}
.masthead-title span{color:var(--amber-dark);}

/* Nav: centered row, cream band, small square dividers between links, slate rule beneath */
nav.main-nav{background:var(--tag-bg);border-top:1px solid var(--line);position:sticky;top:0;z-index:100;box-shadow:0 2px 6px rgba(30,35,40,.08);}
nav.main-nav .wrap{display:flex;justify-content:center;flex-wrap:wrap;padding:12px 24px;overflow-x:auto;}
nav.main-nav a{
  font-family:"Barlow Condensed",sans-serif;
  color:var(--slate-dark);
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:15px;
  font-weight:700;
  padding:8px 4px;
  display:inline-block;
}
nav.main-nav a:not(:first-child)::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  background:var(--amber);
  margin:0 22px;
  vertical-align:middle;
}
nav.main-nav a:hover, nav.main-nav a.active{color:var(--amber-dark);}
nav.main-nav::after{content:"";display:block;height:4px;background:var(--slate);}
@media(max-width:700px){nav.main-nav a:not(:first-child)::before{margin:0 12px;} nav.main-nav a{font-size:13px;}}

/* Home hero: logo mark on a white block, on a tag-bg band */
.home-hero-band{background:var(--tag-bg);padding:40px 24px;}
.home-hero-tile{background:var(--white);max-width:1120px;margin:0 auto;padding:72px 48px;display:flex;justify-content:center;box-shadow:0 4px 16px rgba(30,35,40,.06);border:1px solid var(--line);}
.hero-wordmark{display:inline-flex;flex-direction:column;align-items:center;gap:22px;text-align:center;}
.hero-wordmark-line{font-family:"Archivo",sans-serif;font-weight:900;font-size:64px;letter-spacing:-.02em;color:var(--ink);line-height:1;}
.hero-wordmark-line .amber{color:var(--amber-dark);}
.hero-wordmark-rule{width:100%;height:4px;background:var(--slate);}
.hero-wordmark-tag{font-family:"Barlow Condensed",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:16px;color:var(--muted);margin:0;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media(max-width:700px){.home-hero-band{padding:24px 16px;} .home-hero-tile{padding:36px 20px;} .hero-wordmark-line{font-size:34px;} .hero-wordmark-tag{font-size:12px;}}

/* Hero */
.hero{padding:48px 0 8px;}
.hero-eyebrow{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--slate);font-weight:700;}
.hero h1{font-size:44px;line-height:1.08;margin:10px 0 14px;font-weight:900;}
.hero p.dek{font-size:20px;color:var(--muted);max-width:640px;font-family:"PT Serif",serif;}

/* Category color squares (deliberately square, not round) */
.dot{display:inline-block;width:9px;height:9px;border-radius:0;background:var(--slate);margin-right:6px;}
.dot.amber{background:var(--amber-dark);}
.dot.ink{background:var(--ink);}

/* Card grid */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin:32px 0 56px;}
@media(max-width:860px){.grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.grid{grid-template-columns:1fr;}}
.card{background:var(--white);border:1px solid var(--line);display:flex;flex-direction:column;}
.card-art{position:relative;overflow:hidden;height:150px;display:flex;align-items:center;justify-content:center;font-family:"Archivo",sans-serif;font-weight:900;font-size:15px;text-transform:uppercase;letter-spacing:.05em;color:#fff;text-align:center;padding:12px;}
.card-art-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;}
.card-art-label{position:relative;z-index:2;display:inline-flex;align-items:center;}
.card-body{padding:18px 20px 22px;flex:1;display:flex;flex-direction:column;}
.card .eyebrow{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:700;color:var(--amber-dark);margin-bottom:8px;}
.card h3{font-size:20px;line-height:1.25;margin:0 0 10px;}
.card h3 a{color:var(--ink);text-decoration:none;}
.card h3 a:hover{color:var(--slate-dark);}
.card p{color:var(--muted);font-size:15px;margin:0;flex:1;}
.card .meta{font-family:"Barlow Condensed",sans-serif;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:14px;}

/* art color variants */
.art-slate{background:linear-gradient(135deg,#2F4858,#1A2933);}
.art-amber{background:linear-gradient(135deg,#B4771F,#7A4F12);}
.art-ink{background:linear-gradient(135deg,#1E2328,#0C0E10);}

/* Section headers */
.section-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:3px solid var(--ink);padding-bottom:8px;margin-top:48px;}
.section-head h2{font-size:22px;text-transform:uppercase;letter-spacing:.04em;margin:0;font-weight:900;}
.section-head a{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:13px;letter-spacing:.08em;font-weight:600;text-decoration:none;}

/* Article page */
.article-head{padding:36px 0 0;}
.article-head .eyebrow{color:var(--slate);font-weight:700;}
.article-head h1{font-size:38px;line-height:1.12;margin:12px 0 16px;font-weight:900;}
.article-head .dek{font-size:19px;color:var(--muted);}
.byline{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-size:13px;color:var(--muted);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin:20px 0 8px;}
.article-hero-photo{max-width:700px;margin:8px 0 28px;}
.photo-frame{position:relative;}
.photo-frame > img{width:100%;height:auto;display:block;border:1px solid var(--line);}
.photo-logo-chip{position:absolute;bottom:11px;right:11px;display:flex;align-items:center;}
.photo-logo-chip img{width:56px;height:auto;display:block;border:none;filter:drop-shadow(0 1px 3px rgba(30,35,40,.45));}
.photo-credit{font-family:"Barlow Condensed",sans-serif;font-size:12px;color:var(--muted);letter-spacing:.02em;margin:6px 0 0;}
.photo-credit a{color:var(--muted);}
.article-body{max-width:700px;font-size:19px;line-height:1.75;}
.article-body h2{font-size:26px;margin-top:36px;font-weight:900;}
.article-body h3{font-size:21px;margin-top:28px;font-weight:900;}
.article-body p{margin:0 0 20px;}
.article-body ul{margin:0 0 20px;padding-left:22px;}
.article-body li{margin-bottom:8px;}

.callout{background:var(--tag-bg);border-left:4px solid var(--amber-dark);padding:18px 22px;margin:28px 0;max-width:700px;}
.callout .eyebrow{color:var(--amber-dark);}
.callout h4{margin:6px 0 8px;font-size:17px;}
.callout p{margin:0;font-size:16px;color:var(--ink);}
.callout a.btn{margin-top:12px;}

/* Rating badge: 100 point score shown as up to 5 stars, plus the raw score */
.rating{display:flex;align-items:center;gap:10px;margin:2px 0 12px;}
.stars{position:relative;display:inline-block;font-size:20px;line-height:1;letter-spacing:3px;color:#DCD6C7;font-family:Arial,sans-serif;}
.stars .fill{position:absolute;top:0;left:0;overflow:hidden;white-space:nowrap;color:var(--amber-dark);}
.rating-score{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:13px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;}

.btn{display:inline-block;background:var(--slate);color:#fff;text-decoration:none;padding:10px 20px;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.06em;margin-top:4px;border-radius:0;}
.btn:hover{background:var(--slate-dark);}

.disclosure-note{font-size:13px;color:var(--muted);background:var(--tag-bg);border:1px solid var(--line);padding:10px 14px;max-width:700px;margin:20px 0;font-family:"Barlow Condensed",sans-serif;letter-spacing:.02em;}
.fda-note{font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:14px;margin-top:32px;max-width:700px;font-style:italic;}

.ad-slot{max-width:700px;margin:30px 0;padding:26px;text-align:center;border:1px dashed var(--line);color:var(--muted);font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:12px;background:#fff;}

/* Category strip on home */
.cat-strip{display:flex;gap:16px;margin:36px 0;flex-wrap:wrap;}
.cat-pill{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-weight:700;font-size:14px;padding:8px 18px;border:none;text-decoration:none;color:var(--amber);background:var(--slate);border-radius:0;}
.cat-pill:hover{background:var(--slate-dark);color:var(--amber);}

/* Footer */
footer{background:var(--ink);color:#c7c5bc;margin-top:64px;padding:40px 0 24px;}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;}
footer h5{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.1em;font-size:13px;color:#fff;margin:0 0 12px;}
footer a{color:#c7c5bc;text-decoration:none;font-size:14px;line-height:2;}
footer a:hover{color:#fff;}
footer .col{min-width:160px;}
footer .product-inquiry{width:100%;margin-top:24px;padding-top:20px;border-top:1px solid #38404A;font-size:14px;color:#c7c5bc;}
footer .product-inquiry a{color:var(--amber);text-decoration:underline;}
footer .legal{width:100%;margin-top:14px;padding-top:0;font-size:12px;color:#8b8c85;font-family:"Barlow Condensed",sans-serif;letter-spacing:.03em;}

.breadcrumb{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-size:12px;color:var(--muted);margin-top:24px;}
.breadcrumb a{color:var(--muted);}

/* Compare hub cards */
.compare-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:32px 0 56px;}
@media(max-width:860px){.compare-grid{grid-template-columns:1fr;}}
.compare-card{background:var(--white);border:1px solid var(--line);border-top:5px solid var(--amber-dark);padding:26px 24px;display:flex;flex-direction:column;}
.compare-card .eyebrow{color:var(--amber-dark);font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:700;margin-bottom:8px;}
.compare-card h3{font-size:21px;margin:0 0 10px;}
.compare-card .vs-line{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.04em;font-size:14px;color:var(--muted);margin:0 0 14px;font-weight:600;}
.compare-card p{color:var(--muted);font-size:15px;margin:0 0 18px;flex:1;}
.compare-card .btn{align-self:flex-start;background:var(--amber-dark);}
.compare-card .btn:hover{background:#8C5C17;}

/* Side by side comparison table */
.compare-table-wrap{overflow-x:auto;margin:32px 0;border:1px solid var(--line);background:var(--white);}
table.compare-table{border-collapse:collapse;width:100%;min-width:560px;}
table.compare-table th, table.compare-table td{padding:16px 20px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;}
table.compare-table thead th{background:var(--slate);color:#fff;font-family:"Archivo",sans-serif;}
table.compare-table thead th.row-label-head{background:var(--ink);}
table.compare-table thead .product-name{display:block;font-size:18px;font-weight:800;margin-bottom:8px;}
table.compare-table thead .rating{margin:8px 0;justify-content:flex-start;}
table.compare-table thead .rating .stars{color:rgba(255,255,255,.35);}
table.compare-table thead .rating .rating-score{color:#fff;opacity:.85;}
table.compare-table thead .btn{margin-top:6px;background:var(--amber-dark);font-size:12px;padding:8px 14px;}
table.compare-table tbody th{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.04em;font-size:13px;font-weight:700;color:var(--muted);background:var(--tag-bg);white-space:nowrap;position:sticky;left:0;}
table.compare-table tbody td{font-size:15px;color:var(--ink);}
table.compare-table tbody tr:nth-child(even) td{background:#FBFAF6;}
table.compare-table td.best{background:#EFE6D3;font-weight:700;color:var(--amber-dark);}
.compare-table-hint{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-size:11px;color:var(--muted);text-align:right;margin:6px 0 0;display:none;}

/* Top Rated roundup list */
.roundup-list{max-width:760px;margin:24px 0 56px;}
.roundup-item{display:flex;gap:24px;padding:28px 0;border-bottom:1px solid var(--line);}
.roundup-item:first-child{padding-top:8px;}
.roundup-rank{font-family:"Archivo",sans-serif;font-weight:900;font-size:36px;color:var(--line);min-width:56px;line-height:1;}
.roundup-item:nth-child(1) .roundup-rank{color:var(--amber-dark);}
.roundup-body{flex:1;}
.roundup-body h3{font-size:21px;margin:0 0 8px;}
.roundup-body p{color:var(--muted);font-size:15px;margin:8px 0 12px;}
.roundup-links{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.roundup-links a:not(.btn){font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-size:13px;font-weight:600;}
.roundup-links .btn{margin-top:0;}
@media(max-width:600px){.roundup-item{gap:14px;} .roundup-rank{font-size:26px;min-width:34px;}}
@media(max-width:700px){.compare-table-hint{display:block;}}
.compare-crosslink{max-width:700px;margin:20px 0 40px;padding:18px 22px;background:var(--tag-bg);border-left:4px solid var(--slate);}
.compare-crosslink p{margin:0;font-size:15px;}

/* Wellness Pick of the Month */
.wellness-pick{max-width:1120px;margin:36px auto 0;background:var(--white);border:1px solid var(--line);box-shadow:0 4px 16px rgba(30,35,40,.06);}
.wellness-pick-inner{display:flex;gap:28px;padding:32px;align-items:center;}
.wellness-pick-photo{width:220px;height:220px;object-fit:cover;flex-shrink:0;border:1px solid var(--line);}
.wellness-pick-body .eyebrow{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:700;color:var(--amber-dark);margin-bottom:8px;}
.wellness-pick-body h3{font-family:"Archivo",sans-serif;font-weight:900;font-size:24px;margin:0 0 10px;line-height:1.2;}
.wellness-pick-body p{color:var(--muted);font-size:15px;margin:0 0 16px;max-width:58ch;}
.wellness-pick-links{display:flex;gap:12px;flex-wrap:wrap;}
.wellness-pick-links .btn{margin-top:0;}
@media(max-width:700px){.wellness-pick-inner{flex-direction:column;align-items:flex-start;padding:24px;}.wellness-pick-photo{width:100%;height:200px;}}

@media(max-width:700px){
  .masthead-title{font-size:28px;}
  nav.main-nav .wrap{overflow-x:auto;}
  .hero h1{font-size:30px;}
  .article-head h1{font-size:28px;}
}