/* 247foodcheck.com — teal theme, mobile-first */
:root{
  --primary:#0e7490; --secondary:#06b6d4; --bg:#f0fdff; --ink:#0f2a33;
  --muted:#4b6570; --card:#ffffff; --line:#cdeef5;
  --safe:#16a34a; --caution:#d97706; --avoid:#dc2626; --danger:#1f2937;
  --safe-bg:#f0fdf4; --caution-bg:#fffbeb; --avoid-bg:#fef2f2; --danger-bg:#f3f4f6;
  --cta:#ff9900; --cta-hover:#e68a00; --cta-ink:#331b00;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.65;font-size:17px}
a{color:var(--primary)}
a:hover{color:var(--secondary)}
img{max-width:100%}
.container{max-width:820px;margin:0 auto;padding:0 16px}

/* header / nav */
.site-header{background:var(--primary);color:#fff;padding:10px 0}
.site-header .container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.logo{color:#fff;text-decoration:none;font-weight:800;font-size:1.15rem;letter-spacing:-.01em}
.logo span{color:#a5f3fc}
.nav{display:flex;gap:14px;flex-wrap:wrap;font-size:.92rem}
.nav a{color:#e0f7fc;text-decoration:none;font-weight:600}
.nav a:hover{color:#fff;text-decoration:underline}

/* disclaimer banner */
.disclaimer-banner{background:#ecfeff;border-bottom:1px solid var(--line);font-size:.8rem;color:var(--muted);padding:7px 0;text-align:center}

/* breadcrumbs */
.crumbs{font-size:.82rem;color:var(--muted);margin:14px 0 4px}
.crumbs a{color:var(--muted)}

h1{font-size:1.65rem;line-height:1.25;margin:.4em 0 .5em;letter-spacing:-.01em}
h2{font-size:1.25rem;margin:1.6em 0 .5em;color:var(--primary)}
h3{font-size:1.05rem;margin:1.2em 0 .4em}
.updated{font-size:.8rem;color:var(--muted);margin-bottom:14px}

/* verdict box — first thing visible */
.verdict-box{border-radius:14px;padding:20px 18px;margin:14px 0 22px;border:2px solid;box-shadow:0 2px 10px rgba(14,116,144,.07)}
.verdict-box.safe{background:var(--safe-bg);border-color:var(--safe)}
.verdict-box.safe_if_cooked{background:var(--safe-bg);border-color:var(--safe)}
.verdict-box.caution{background:var(--caution-bg);border-color:var(--caution)}
.verdict-box.avoid{background:var(--avoid-bg);border-color:var(--avoid)}
.verdict-box.danger{background:var(--danger-bg);border-color:var(--danger)}
.verdict-label{font-weight:800;font-size:1.05rem;letter-spacing:.03em;display:flex;align-items:center;gap:8px}
.verdict-box.safe .verdict-label,.verdict-box.safe_if_cooked .verdict-label{color:var(--safe)}
.verdict-box.caution .verdict-label{color:var(--caution)}
.verdict-box.avoid .verdict-label{color:var(--avoid)}
.verdict-box.danger .verdict-label{color:var(--danger)}
.verdict-one-liner{margin:.55em 0 0;font-size:1.02rem}

/* quick facts */
.facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}
@media(min-width:560px){.facts{grid-template-columns:repeat(3,1fr)}}
.fact{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 12px}
.fact b{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:3px}
.fact span{font-weight:700;font-size:1rem}

.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:14px 0}
.card.exception{border-left:4px solid var(--secondary)}
.card.warn{border-left:4px solid var(--avoid)}

/* steps */
ol.steps{padding-left:0;counter-reset:s;list-style:none;margin:14px 0}
ol.steps li{counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:12px 14px 12px 52px;margin:8px 0;position:relative}
ol.steps li::before{content:counter(s);position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;
  background:var(--primary);color:#fff;font-weight:700;font-size:.85rem;display:flex;align-items:center;justify-content:center}

/* FAQ */
.faq details{background:var(--card);border:1px solid var(--line);border-radius:10px;margin:8px 0;padding:0}
.faq summary{cursor:pointer;font-weight:700;padding:13px 15px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--secondary);font-weight:800}
.faq details[open] summary::after{content:"\2013"}
.faq .a{padding:0 15px 13px;color:var(--ink)}

/* affiliate */
.aff{background:linear-gradient(135deg,#ecfeff,#f0fdff);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:22px 0}
.aff h2{margin-top:0}
.aff .aff-note{font-size:.75rem;color:var(--muted);margin-top:10px}
a.amz-btn{display:inline-flex;align-items:center;min-height:44px;background:var(--cta);color:var(--cta-ink);font-weight:700;text-decoration:none;border:1.5px solid #995c00;box-shadow:0 2px 6px rgba(230,138,0,.35);transition:background .15s,transform .1s;
  padding:10px 16px;border-radius:9px;margin:6px 8px 0 0;font-size:.92rem}
a.amz-btn:hover{background:var(--cta-hover);color:var(--cta-ink);transform:translateY(-1px)}
a.amz-btn:focus-visible{outline:3px solid var(--primary);outline-offset:2px}

/* related grids */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
@media(min-width:640px){.grid{grid-template-columns:repeat(3,1fr)}}
.grid a{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:11px 13px;
  text-decoration:none;font-weight:600;font-size:.9rem;color:var(--primary)}
.grid a:hover{border-color:var(--secondary)}
.grid a .v{margin-right:6px}

.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.pill{background:#e0f7fc;color:var(--primary);border-radius:99px;padding:6px 13px;font-size:.85rem;font-weight:700;text-decoration:none}
.pill:hover{background:var(--secondary);color:#fff}

/* homepage hero */
.hero{background:linear-gradient(160deg,var(--primary),#155e75 70%);color:#fff;padding:44px 0 40px;text-align:center}
.hero h1{color:#fff;font-size:2rem;margin:0 0 .3em}
.hero p{color:#cffafe;max-width:560px;margin:0 auto;font-size:1.05rem}
.search-box{max-width:520px;margin:22px auto 0;position:relative}
.search-box input{width:100%;padding:14px 16px;border-radius:12px;border:0;font-size:1rem;box-shadow:0 4px 18px rgba(0,0,0,.18)}
#search-results{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.16);max-height:320px;overflow:auto;text-align:left;z-index:50;display:none}
#search-results a{display:block;padding:10px 14px;text-decoration:none;color:var(--ink);border-bottom:1px solid #eef7f9;font-size:.93rem}
#search-results a:hover{background:#ecfeff}
#search-results .t{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-left:6px}

section.home-block{margin:34px 0}
table{width:100%;border-collapse:collapse;background:var(--card);border-radius:10px;overflow:hidden;font-size:.93rem}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
th{background:#e0f7fc;color:var(--primary);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}

/* footer */
.site-footer{background:#0b3947;color:#bfe8f2;margin-top:52px;padding:32px 0 26px;font-size:.86rem}
.site-footer a{color:#a5f3fc;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.footer-cols{display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:640px){.footer-cols{grid-template-columns:2fr 1fr 1fr}}
.footer-cols h4{color:#fff;margin:0 0 8px;font-size:.92rem}
.footer-cols ul{list-style:none;margin:0;padding:0}
.footer-cols li{margin:4px 0}
.footer-bottom{border-top:1px solid #155e75;margin-top:22px;padding-top:14px;font-size:.78rem;color:#8fd3e3}

/* cookie banner */
#cookie-banner{position:fixed;bottom:0;left:0;right:0;background:#0b3947;color:#e0f7fc;padding:13px 16px;
  font-size:.85rem;display:none;z-index:100;box-shadow:0 -4px 16px rgba(0,0,0,.2)}
#cookie-banner .container{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between}
#cookie-banner button{background:var(--secondary);color:#00303c;border:0;border-radius:8px;padding:9px 18px;font-weight:700;cursor:pointer}
#cookie-banner a{color:#a5f3fc}

.medical-note{font-size:.8rem;color:var(--muted);border-top:1px dashed var(--line);margin-top:34px;padding-top:12px}
.src{font-size:.82rem;color:var(--muted)}

/* — affiliate/monetisation overhaul additions — */
.affiliate-disclosure{font-size:.78rem;color:#64748b;margin:0 0 .6rem}
.ad-slot{min-height:0}
#cookie-banner .cb-btns{display:flex;gap:8px;flex-shrink:0}
#cookie-banner button.cb-accept{background:#06b6d4;color:#06323d;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-weight:700}
#cookie-banner button.cb-decline{background:transparent;color:#fff;border:1px solid #fff;padding:8px 16px;border-radius:6px;cursor:pointer}
.ctx-note{background:#f0fdff;border-left:3px solid #06b6d4;padding:.6rem .9rem;border-radius:0 8px 8px 0;font-size:.95rem}
.ctx-note a{font-weight:600}
.rel-tools{margin-bottom:.2rem}
.contact-form{max-width:480px;margin:1rem 0}
.contact-form label{display:block;margin:.7rem 0;font-weight:600}
.contact-form input,.contact-form textarea{width:100%;padding:.6rem;border:1px solid #cbd5e1;border-radius:8px;font:inherit;margin-top:.25rem}
.contact-form button{background:#0e7490;color:#fff;border:none;padding:.65rem 1.4rem;border-radius:8px;font-weight:700;cursor:pointer;margin-top:.4rem}
.contact-form button:hover{background:#06b6d4}


/* — affiliate primary pick (post-verdict intent moment) — */
.aff-primary{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--card);
  border:1px solid var(--line);border-left:4px solid var(--cta);border-radius:12px;
  padding:14px 16px;margin:18px 0}
.aff-primary .ap-text{flex:1 1 260px;font-size:.95rem}
.aff-primary .amz-btn{flex-shrink:0}
.ap-disc{display:block;font-size:.72rem;color:var(--muted);margin-top:4px}

/* — skin precision pass — */
@media(min-width:560px){h1{font-size:1.95rem}}
.verdict-label{font-size:1.12rem}
.verdict-one-liner{font-size:1.06rem}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--secondary);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* — affiliate deep-dive: product cards & inline links — */
.aff{border:1px solid #fde8c8;background:linear-gradient(135deg,#fffdf7,#fff8ec)}
.aff h2{display:flex;align-items:center;gap:8px}
.aff-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:12px}
.aff-card{background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:7px;transition:border-color .15s,box-shadow .15s,transform .15s}
.aff-card:hover{border-color:var(--cta);box-shadow:0 8px 22px rgba(230,138,0,.22);transform:translateY(-2px)}
.aff-card h3{margin:0;font-size:1.02rem;color:var(--ink)}
.aff-card p{margin:0;font-size:.84rem;color:var(--muted);flex:1;line-height:1.45}
.aff-card .amz-btn{justify-content:center;width:100%;margin:6px 0 0;box-sizing:border-box}
a.amz-inline{color:var(--primary);font-weight:600;text-decoration:underline;text-decoration-color:var(--cta);text-decoration-thickness:2px;text-underline-offset:3px}
a.amz-inline:hover{color:#995c00;text-decoration-color:#995c00}
.inline-tip{background:#fff8ec;border:1px solid #fde8c8;border-radius:10px;padding:10px 14px;font-size:.93rem}
@media(max-width:480px){.aff-grid{grid-template-columns:1fr}}

/* — v5 affiliate + best-of additions — */
.amz-card{background:linear-gradient(160deg,#fff,#fdf9f2);border:1px solid #f0d9b0;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;transition:transform .15s,box-shadow .15s,border-color .15s}
.amz-card:hover{transform:translateY(-3px);border-color:#ff9900;box-shadow:0 8px 20px rgba(255,153,0,.22)}
.amz-badge{align-self:flex-start;background:#232f3e;color:#ff9900;font-weight:700;font-size:.68rem;letter-spacing:.06em;padding:3px 8px;border-radius:4px}
.amz-title{font-weight:700;line-height:1.3;margin:0}
.amz-benefit{font-size:.85rem;color:#555;margin:0;flex:1}
.amz-cta{margin-top:auto;display:block;text-align:center;font-weight:700;color:#111;background:linear-gradient(180deg,#ffd814,#ff9900);border-radius:8px;padding:10px 12px;text-decoration:none}
.amz-cta:hover{background:linear-gradient(180deg,#f7ca00,#e68900)}
.awin-cta{background:linear-gradient(180deg,#06b6d4,#0e7490);color:#fff}
.awin-cta:hover{background:linear-gradient(180deg,#0ea5c9,#0c6680)}
.amz-inline{color:#b45309;text-decoration:underline;text-decoration-color:#f59e0b;text-underline-offset:2px;font-weight:600}
.awin-inline{color:#0e7490;text-decoration:underline;text-decoration-color:#06b6d4;text-underline-offset:2px;font-weight:600}
.bestof-list{display:flex;flex-direction:column;gap:16px;margin:1.2rem 0}
.bestof-item{display:flex;gap:14px;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:14px;align-items:flex-start}
.bestof-rank{background:#0e7490;color:#fff;font-weight:800;font-size:1.1rem;border-radius:8px;padding:6px 12px;flex-shrink:0;min-width:38px;text-align:center}
.bestof-body{flex:1}
.bestof-body h3{margin:0 0 4px;font-size:1rem}
.bestof-body p{margin:0 0 8px;font-size:.9rem;color:#444}
.bestof-body .amz-cta,.bestof-body .awin-cta{display:inline-block;padding:7px 14px;font-size:.88rem;border-radius:6px}
.verdict-awin-link{margin:.4rem 0 0;font-size:.93rem}

/* ============================================================
   AFFILIATE CARDS — mandatory verbatim block (SITE_BUILD_STANDARDS v3.1,
   MASTER_UPLOAD Section C §10). Do not remove without updating that doc.
   ============================================================ */
.amz-card {
  background: linear-gradient(135deg, #ffffff 0%, #fdf9f2 100%);
  border: 1px solid #f0d9b0;
  border-radius: 12px;
  padding: 20px 24px;
  margin: 24px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.amz-card:hover {
  box-shadow: 0 6px 18px rgba(0,0,0,0.10);
  transform: translateY(-2px);
}
.amz-card .amz-badge,
.amz-card .merchant-badge {
  font-size: 0.70rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: #b07d2e;
}
.amz-card .amz-title,
.amz-card .card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
  line-height: 1.3;
}
.amz-card .amz-desc,
.amz-card .amz-benefit,
.amz-card .card-benefit {
  font-size: 0.90rem;
  color: #4a4a4a;
  margin: 0;
  line-height: 1.5;
}
.amz-card .amz-cta,
.amz-card .cta-btn {
  display: inline-block;
  background: linear-gradient(135deg, #ffd814 0%, #ff9900 100%);
  color: #111;
  font-weight: 800;
  font-size: 0.88rem;
  padding: 10px 22px;
  border-radius: 8px;
  text-decoration: none;
  align-self: flex-start;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
}
.amz-card .amz-cta:hover,
.amz-card .cta-btn:hover {
  background: linear-gradient(135deg, #f0c800 0%, #e87722 100%);
}
/* AWIN merchant cards — green-tinted badge to distinguish from Amazon */
.awin-card {
  background: linear-gradient(135deg, #ffffff 0%, #fdf9f2 100%);
  border: 1px solid #f0d9b0;
  border-radius: 12px;
  padding: 20px 24px;
  margin: 24px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.awin-card:hover {
  box-shadow: 0 6px 18px rgba(0,0,0,0.10);
  transform: translateY(-2px);
}
.awin-card .merchant-badge {
  font-size: 0.70rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: #2a7a3b;
}
.awin-card .card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
  line-height: 1.3;
}
.awin-card .card-benefit {
  font-size: 0.90rem;
  color: #4a4a4a;
  margin: 0;
  line-height: 1.5;
}
.awin-card .cta-btn {
  display: inline-block;
  background: #e87722;
  color: #fff;
  font-weight: 800;
  font-size: 0.88rem;
  padding: 10px 22px;
  border-radius: 8px;
  text-decoration: none;
  align-self: flex-start;
  transition: background 0.2s ease;
}
.awin-card .cta-btn:hover {
  background: #c9661a;
}

/* ============================================================
   CJ CARD — added per MASTER_UPLOAD v5.71 Section C §10 (V5.31).
   Distinct blue badge — CJ merchants (BVC/CPC/HealthLabs) no longer
   fall back to .amz-card's gold Amazon styling.
   ============================================================ */
.cj-card {
  background: linear-gradient(135deg, #ffffff 0%, #fdf9f2 100%);
  border: 1px solid #f0d9b0;
  border-radius: 12px;
  padding: 20px 24px;
  margin: 24px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.cj-card:hover {
  box-shadow: 0 6px 18px rgba(0,0,0,0.10);
  transform: translateY(-2px);
}
.cj-card .merchant-badge {
  font-size: 0.70rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: #1d5fae;
}
.cj-card .card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0;
  line-height: 1.3;
}
.cj-card .card-benefit {
  font-size: 0.90rem;
  color: #4a4a4a;
  margin: 0;
  line-height: 1.5;
}
.cj-card .cta-btn {
  display: inline-block;
  background: #1d5fae;
  color: #fff;
  font-weight: 800;
  font-size: 0.88rem;
  padding: 10px 22px;
  border-radius: 8px;
  text-decoration: none;
  align-self: flex-start;
  transition: background 0.2s ease;
}
.cj-card .cta-btn:hover {
  background: #164a8a;
}
/* Canonical .amz-inline — supersedes earlier duplicate rules above via
   cascade order (last rule wins on equal specificity), per verbatim spec */
.amz-inline {
  color: #b45309;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  font-weight: 500;
}
.amz-inline:hover {
  color: #92400e;
}

/* Visible credential line — Section 16 structural gap, Section 9 policy */
.credential-line{font-size:.78rem;color:#64748b;margin:0 0 1rem;font-style:italic}
