/* DiaformRX DE site-2 | prefix: dfe | layout: flat-borders | font: Rubik */

:root{
--dfe-red:#C41B1B;--dfe-red-dk:#9E1515;--dfe-blue:#3A6A94;--dfe-blue-hv:#2E567A;
--dfe-bg:#FFFFFF;--dfe-bg-alt:#F5F7FA;--dfe-surf:#EDF1F5;
--dfe-ink:#1A1A2E;--dfe-ink-sec:#4A4A5A;--dfe-ink-mut:#7A7A8A;
--dfe-line:#D4DCE6;--dfe-ok:#2E8B57;--dfe-warn:#E8913A;
--dfe-hdr-bg:#1A2744;--dfe-hdr-txt:#FFFFFF;
--dfe-ft-bg:#141E33;--dfe-ft-txt:#B8C4D4;
--dfe-star:#F5A623;--dfe-price-old:#999999;
--dfe-card-bg:#FFFFFF;--dfe-faq-bg:#F5F7FA;
--dfe-discl-bg:#FFF3E0;--dfe-discl-brd:#E8913A;
--dfe-font:'Rubik',sans-serif;--dfe-container:1120px;--dfe-gap:20px;--dfe-pad:56px 0;
}

/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--dfe-font);color:var(--dfe-ink);background:var(--dfe-bg);line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--dfe-blue);text-decoration:none;transition:color .25s}
a:hover{color:var(--dfe-blue-hv)}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}

/* === CONTAINER === */
.dfe-wrap{max-width:var(--dfe-container);margin:0 auto;padding:0 20px}

/* === HEADER === */
.dfe-site-menu{background:var(--dfe-hdr-bg);padding:14px 0;position:sticky;top:0;z-index:100;border-bottom:2px solid var(--dfe-blue)}
.dfe-site-menu .dfe-wrap{display:flex;justify-content:space-between;align-items:center}
.dfe-logo-text{color:var(--dfe-hdr-txt);font-weight:700;font-size:1.25rem;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.dfe-logo-badge{width:30px;height:30px;flex:0 0 auto}
.dfe-logo-word{line-height:1;white-space:nowrap}
.dfe-logo-word span{color:var(--dfe-red)}
.dfe-menu-list ul{display:flex;gap:20px;align-items:center}
.dfe-menu-list a{color:var(--dfe-hdr-txt);font-size:.9rem;font-weight:500;padding:6px 0;border-bottom:2px solid transparent;transition:border-color .25s}
.dfe-menu-list a:hover{border-bottom-color:var(--dfe-red);color:var(--dfe-hdr-txt)}
.dfe-order-link{display:inline-block;background:var(--dfe-red);color:#fff!important;font-weight:600;padding:14px 32px;text-decoration:none;border:2px solid var(--dfe-red);transition:background .25s,border-color .25s}
.dfe-order-link:hover{background:var(--dfe-red-dk);border-color:var(--dfe-red-dk)}
.dfe-site-menu a.dfe-order-link{color:#fff!important;padding:8px 20px;font-size:.85rem}
.dfe-nav-trigger{background:none;border:none;cursor:pointer;display:none;padding:8px}
.dfe-nav-close{display:none;position:absolute;top:16px;right:20px;font-size:1.5rem;color:#fff;cursor:pointer;background:none;border:none;z-index:200}

/* === HERO === */
.dfe-showcase-area{background:linear-gradient(135deg,var(--dfe-hdr-bg) 0%,#1e3052 100%);padding:60px 0 48px;color:var(--dfe-hdr-txt)}
.dfe-showcase-area .dfe-wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);gap:40px;align-items:center}
.dfe-showcase-area h1{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;line-height:1.25;margin-bottom:16px}
.dfe-showcase-copy p{font-size:1rem;line-height:1.7;color:rgba(255,255,255,.88);margin-bottom:12px}
.dfe-showcase-visual img{display:block;width:100%;max-width:min(480px,100%);height:auto;border:2px solid rgba(255,255,255,.15)}

/* === PRICE STRIP === */
.dfe-offer-strip{border:2px dashed var(--dfe-warn);padding:20px;margin-top:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.dfe-offer-strip--section{margin-top:32px;background:var(--dfe-bg-alt)}
.dfe-price-old{font-size:1.1rem;color:var(--dfe-price-old)}
.dfe-price-old s{text-decoration:line-through}
.dfe-price-now{font-size:1.75rem;font-weight:700;color:var(--dfe-red)}
.dfe-promo-flag{background:var(--dfe-warn);color:#fff;font-weight:700;padding:4px 12px;font-size:.85rem;display:inline-block}

/* === SUMMARY TABLE === */
.dfe-snapshot-area{padding:40px 0;background:var(--dfe-bg-alt);border-bottom:1px solid var(--dfe-line)}
.dfe-snapshot-card{border:2px solid var(--dfe-line);padding:0;overflow:hidden}
.dfe-snapshot-title{background:var(--dfe-hdr-bg);color:#fff;padding:14px 20px;font-size:1.1rem;font-weight:600;margin:0}
.dfe-info-grid table{width:100%}
.dfe-info-grid th,.dfe-info-grid td{padding:12px 20px;text-align:left;border-bottom:1px solid var(--dfe-line);font-size:.95rem}
.dfe-info-grid th{background:var(--dfe-surf);font-weight:600;width:35%;color:var(--dfe-ink)}
.dfe-info-grid td{color:var(--dfe-ink-sec)}
.dfe-info-grid tr:last-child th,.dfe-info-grid tr:last-child td{border-bottom:none}
.dfe-score-icons{color:var(--dfe-star);letter-spacing:2px}

/* === TOC === */
.dfe-anchor-nav{padding:28px 0;border-bottom:1px solid var(--dfe-line)}
.dfe-anchor-nav strong{display:block;font-size:1rem;font-weight:600;margin-bottom:12px;color:var(--dfe-ink)}
.dfe-anchor-nav ol{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;list-style:none;counter-reset:toc-step}
.dfe-anchor-nav li{counter-increment:toc-step}
.dfe-anchor-nav li a{display:block;padding:10px 12px 10px 40px;border:1px solid var(--dfe-line);font-size:.9rem;color:var(--dfe-ink-sec);position:relative;transition:border-color .25s,background .25s}
.dfe-anchor-nav li a::before{content:counter(toc-step,decimal-leading-zero);position:absolute;left:12px;top:50%;transform:translateY(-50%);font-weight:700;font-size:.8rem;color:var(--dfe-blue)}
.dfe-anchor-nav li a:hover{border-color:var(--dfe-blue);background:var(--dfe-bg-alt);color:var(--dfe-ink)}

/* === ARTICLE SEGMENTS === */
.dfe-article-segment{padding:56px 0;border-bottom:1px solid var(--dfe-line)}
.dfe-article-segment:nth-child(even){background:var(--dfe-bg-alt)}
.dfe-article-segment h2{font-size:clamp(1.25rem,3vw,1.65rem);font-weight:700;color:var(--dfe-ink);margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid var(--dfe-red)}
.dfe-article-segment h3{font-size:1.15rem;font-weight:600;color:var(--dfe-ink);margin:28px 0 12px}
.dfe-article-segment p{margin-bottom:16px;color:var(--dfe-ink-sec);line-height:1.75}
.dfe-article-segment p:last-child{margin-bottom:0}

/* === INGREDIENT CARDS === */
.dfe-component-card{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:24px;border:2px solid var(--dfe-line);margin-bottom:24px;align-items:start;transition:border-color .25s}
.dfe-component-card:hover{border-color:var(--dfe-blue)}
.dfe-component-card-media{overflow:hidden}
.dfe-component-card-media img{width:100%;height:220px;object-fit:cover;display:block}
.dfe-component-card-body{padding:20px}
.dfe-component-card-body h3{margin-top:0;font-size:1.1rem}
.dfe-component-card-body p{font-size:.95rem}
.dfe-component-card--text-only{grid-template-columns:1fr}
.dfe-component-card--text-only .dfe-component-card-body{padding:24px}

/* === DOSAGE STEPS === */
.dfe-feature-box{border:2px solid var(--dfe-line);padding:24px;margin-bottom:20px;transition:border-color .25s}
.dfe-feature-box:hover{border-color:var(--dfe-blue)}
.dfe-feature-box h3{margin-top:0;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--dfe-line)}

/* numbered steps */
.dfe-guide-points{counter-reset:guide;display:grid;gap:12px;margin:20px 0}
.dfe-guide-points li{counter-increment:guide;padding:14px 16px 14px 52px;border:1px solid var(--dfe-line);position:relative;font-size:.95rem;color:var(--dfe-ink-sec);transition:border-color .25s}
.dfe-guide-points li:hover{border-color:var(--dfe-blue)}
.dfe-guide-points li::before{content:counter(guide);position:absolute;left:14px;top:50%;transform:translateY(-50%);background:var(--dfe-blue);color:#fff;width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.dfe-guide-points li strong{color:var(--dfe-ink);font-weight:600}

/* === REVIEWS === */
.dfe-score-summary{display:flex;align-items:center;gap:12px;padding:20px;border:2px solid var(--dfe-line);margin-bottom:28px;flex-wrap:wrap}
.dfe-score-value{font-size:2.5rem;font-weight:700;color:var(--dfe-red)}
.dfe-score-max{font-size:1.1rem;color:var(--dfe-ink-mut);font-weight:500}
.dfe-score-label{font-size:.9rem;color:var(--dfe-ink-mut)}
.dfe-feedback-list{display:grid;gap:20px}
.dfe-feedback-entry{border:2px solid var(--dfe-line);padding:24px;transition:border-color .25s}
.dfe-feedback-entry:hover{border-color:var(--dfe-blue)}
.dfe-feedback-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.dfe-feedback-head strong{color:var(--dfe-ink);font-size:.95rem}
.dfe-feedback-period{font-size:.8rem;color:var(--dfe-ink-mut);margin-left:auto}
.dfe-feedback-entry blockquote{border-left:3px solid var(--dfe-blue);padding-left:16px;margin:0}
.dfe-feedback-entry blockquote p{font-style:italic;color:var(--dfe-ink-sec);margin-bottom:0}

/* === COMPARISON TABLE === */
.dfe-table-scroll{overflow-x:auto;margin:20px 0}
.dfe-versus-table{width:100%;border:2px solid var(--dfe-line);min-width:640px}
.dfe-versus-table th,.dfe-versus-table td{padding:12px 16px;text-align:left;border:1px solid var(--dfe-line);font-size:.9rem}
.dfe-versus-table thead th{background:var(--dfe-hdr-bg);color:#fff;font-weight:600}
.dfe-versus-table tbody tr:nth-child(even){background:var(--dfe-bg-alt)}
.dfe-versus-table tbody tr:first-child{background:rgba(58,106,148,.06)}
.dfe-versus-table tbody td{color:var(--dfe-ink-sec)}

/* === FAQ === */
.dfe-question-list{display:grid;gap:8px}
.dfe-question-item{border:2px solid var(--dfe-line);transition:border-color .25s}
.dfe-question-item[open]{border-color:var(--dfe-blue)}
.dfe-question-item summary{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;cursor:pointer;user-select:none;font-weight:500;list-style:none}
.dfe-question-item summary::-webkit-details-marker{display:none}
.dfe-question-item summary h3{margin:0;font-size:1rem;font-weight:500;color:var(--dfe-ink);flex:1}
.dfe-faq-chevron{flex-shrink:0;margin-left:12px;transition:transform .25s;color:var(--dfe-ink-mut)}
.dfe-question-item[open] .dfe-faq-chevron{transform:rotate(180deg)}
.dfe-question-answer{padding:0 20px 20px;color:var(--dfe-ink-sec);line-height:1.7}
.dfe-question-answer p{margin-bottom:0}

/* === VERDICT === */
.dfe-summary-verdict{display:grid;grid-template-columns:auto 1fr;gap:28px;border:2px solid var(--dfe-line);padding:28px;align-items:start}
.dfe-verdict-score{text-align:center}
.dfe-verdict-score .dfe-score-value{font-size:3rem;display:block}
.dfe-verdict-score .dfe-score-max{font-size:1.1rem;display:block;margin-bottom:4px}
.dfe-verdict-score .dfe-score-icons{display:block;font-size:1.2rem}
.dfe-verdict-text p{margin-bottom:12px}
.dfe-verdict-cta{margin-top:28px;text-align:center}

/* === AUTHOR === */
.dfe-reviewer-bio{padding:48px 0;border-bottom:1px solid var(--dfe-line)}
.dfe-reviewer-card{display:flex;gap:24px;border:2px solid var(--dfe-line);padding:28px;align-items:start}
.dfe-reviewer-avatar{width:80px;height:80px;object-fit:cover;flex-shrink:0;border:2px solid var(--dfe-line)}
.dfe-reviewer-details strong{display:block;font-size:1.1rem;color:var(--dfe-ink)}
.dfe-reviewer-role{display:block;font-size:.9rem;color:var(--dfe-blue);font-weight:500;margin-bottom:8px}
.dfe-reviewer-details p{color:var(--dfe-ink-sec);font-size:.95rem;margin-bottom:0}

/* === DISCLAIMER === */
.dfe-caution-block{padding:28px 0;background:var(--dfe-discl-bg);border-top:3px solid var(--dfe-discl-brd)}
.dfe-caution-block p{font-size:.9rem;color:var(--dfe-ink-sec);margin-bottom:0}
.dfe-caution-block strong{color:var(--dfe-ink)}

/* === FOOTER === */
.dfe-base-area{background:var(--dfe-ft-bg);color:var(--dfe-ft-txt);padding:48px 0 24px}
.dfe-base-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-bottom:32px}
.dfe-base-col strong{display:block;color:#fff;margin-bottom:12px;font-size:.95rem}
.dfe-base-col ul{display:grid;gap:6px}
.dfe-base-col a{color:var(--dfe-ft-txt);font-size:.9rem;transition:color .25s}
.dfe-base-col a:hover{color:#fff}
.dfe-base-col p{font-size:.85rem;margin-top:8px;line-height:1.6}
.dfe-payment-row{display:flex;flex-wrap:wrap;gap:8px}
.dfe-payment-icon{height:36px;max-width:80px;width:auto;background:#fff;padding:4px 8px;border:1px solid var(--dfe-line)}
.dfe-base-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:20px}
.dfe-base-bottom p{font-size:.8rem;color:var(--dfe-ft-txt);margin-bottom:8px;line-height:1.6}
.dfe-base-bottom p:last-child{margin-bottom:0}

/* === LEGAL PAGES SHARED === */
.dfe-legal-body{padding:48px 0}
.dfe-legal-body h1{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;color:var(--dfe-ink);margin-bottom:8px}
.dfe-legal-body .dfe-legal-meta{font-size:.9rem;color:var(--dfe-ink-mut);margin-bottom:28px}
.dfe-legal-body h2{font-size:1.2rem;font-weight:600;color:var(--dfe-ink);margin:28px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--dfe-line)}
.dfe-legal-body p{color:var(--dfe-ink-sec);margin-bottom:14px;line-height:1.75}

/* === BREADCRUMBS === */
.dfe-trail{padding:12px 0;border-bottom:1px solid var(--dfe-line);background:var(--dfe-bg-alt)}
.dfe-trail ol{display:flex;gap:8px;align-items:center;font-size:.85rem}
.dfe-trail a{color:var(--dfe-blue)}
.dfe-trail li::after{content:'/';color:var(--dfe-ink-mut);margin-left:8px}
.dfe-trail li:last-child::after{display:none}
.dfe-trail li[aria-current]{color:var(--dfe-ink-mut)}

/* ============================================
   RESPONSIVE: mobile-first, 4 breakpoints
   ============================================ */

/* --- Mobile base (<768px) --- */
@media(max-width:767px){
  .dfe-showcase-area .dfe-wrap{grid-template-columns:1fr;text-align:center}
  .dfe-showcase-visual{order:1}
  .dfe-showcase-copy{order:2}
  .dfe-showcase-visual img{max-width:320px;margin:0 auto}
  .dfe-offer-strip{justify-content:center}
  .dfe-menu-list{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(26,39,68,.98);flex-direction:column;justify-content:center;align-items:center;z-index:150;display:none}
  .dfe-menu-list.dfe-menu-open{display:flex}
  .dfe-menu-list ul{flex-direction:column;gap:16px;text-align:center}
  .dfe-menu-list a{font-size:1.1rem}
  .dfe-nav-trigger{display:block}
  .dfe-menu-open~.dfe-nav-close{display:block}
  .dfe-anchor-nav ol{grid-template-columns:1fr}
  .dfe-component-card{grid-template-columns:1fr}
  .dfe-component-card-media img{height:180px}
  .dfe-info-grid th{width:40%}
  .dfe-base-grid{grid-template-columns:1fr}
  .dfe-summary-verdict{grid-template-columns:1fr;text-align:center}
  .dfe-reviewer-card{flex-direction:column;align-items:center;text-align:center}
  .dfe-feedback-period{margin-left:0;width:100%;margin-top:4px}
  .dfe-versus-table{min-width:560px}
}

/* --- Tablet (768px+) --- */
@media(min-width:768px){
  .dfe-anchor-nav ol{grid-template-columns:repeat(2,1fr)}
  .dfe-base-grid{grid-template-columns:repeat(2,1fr)}
}

/* --- Desktop (1024px+) --- */
@media(min-width:1024px){
  .dfe-anchor-nav ol{grid-template-columns:repeat(3,1fr)}
  .dfe-base-grid{grid-template-columns:repeat(4,1fr)}
}

/* --- Wide (1440px+) --- */
@media(min-width:1440px){
  .dfe-wrap{padding:0 32px}
}
