/* Drugestan Health Magazine v1.23.0
   Target alignment pass: reference hero, deterministic four-column desktop flow,
   FAQ + comparison in one row, duplicate-action protection and compact lower modules. */
:root{
  --d23-navy:#082e5b;--d23-teal:#0aa29e;--d23-blue:#2d73c9;--d23-green:#168b66;
  --d23-orange:#ed7b21;--d23-violet:#7041bd;--d23-ink:#173a5d;--d23-muted:#63758a;
  --d23-line:#dbe6ef;--d23-soft:#f7fafc;
}

/* ===== Hero: match the approved reference composition ===== */
@media (min-width:1180px){
  .dhm-v22-refine.dhm-v21-refine .dhm-v21-hero{
    grid-template-columns:260px minmax(0,1fr) 370px!important;
    gap:18px!important;padding:14px!important;align-items:stretch!important;
  }
  .dhm-v22-refine .dhm-v21-side-right .dhm-v13-audience-card,
  .dhm-v22-refine .dhm-v21-side-right .dhm-v13-pro-card{display:none!important}
  .dhm-v22-refine .dhm-v21-side-right{gap:10px!important}
  .dhm-v22-refine .dhm-v21-side-right .dhm-visual-frame{aspect-ratio:16/10!important}
  .dhm-v22-refine .dhm-v21-center{padding:0 6px!important}
  .dhm-v22-refine .dhm-single-title{font-size:38px!important;line-height:1.46!important;margin:12px auto 9px!important}
  .dhm-v22-refine .dhm-v13-deck{font-size:15.5px!important;line-height:1.95!important;margin:0 auto 10px!important}
  .dhm-v22-refine .dhm-v22-continue{margin:1px auto 8px!important;padding:6px 11px!important;font-size:12px!important}
  .dhm-v22-refine .dhm-single-meta{padding-top:10px!important;gap:7px 16px!important}
}

.dhm-v23-hero-refcards{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;width:100%!important}
.dhm-v23-hero-ref{display:grid!important;grid-template-columns:34px 1fr!important;gap:8px!important;align-items:start!important;
  padding:12px!important;border:1px solid var(--d23-line)!important;border-radius:12px!important;text-decoration:none!important;
  background:#fff!important;box-shadow:0 4px 14px rgba(12,45,78,.04)!important;color:var(--d23-ink)!important;min-width:0!important}
.dhm-v23-hero-ref-icon{display:flex!important;width:32px!important;height:32px!important;align-items:center!important;justify-content:center!important;
  border-radius:9px!important;font-size:17px!important;font-weight:900!important}
.dhm-v23-hero-ref strong{display:block!important;font-size:13px!important;line-height:1.45!important;margin:0 0 3px!important}
.dhm-v23-hero-ref p{font-size:10.8px!important;line-height:1.65!important;color:#647589!important;margin:0!important}
.dhm-v23-hero-science{background:#f0faf7!important;border-color:#cfeae3!important}.dhm-v23-hero-science .dhm-v23-hero-ref-icon{background:#dff5ef!important;color:#078a79!important}
.dhm-v23-hero-compare{background:#f3f7fe!important;border-color:#d7e2f4!important}.dhm-v23-hero-compare .dhm-v23-hero-ref-icon{background:#e4eefc!important;color:#2d73c9!important}

/* ===== Main desktop reading grid: deterministic and compact ===== */
@media (min-width:1180px){
  .dhm-v22-refine .dhm-v16-modules{
    display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:18px!important;align-items:start!important;grid-auto-flow:row dense!important;
  }
  .dhm-v22-refine .dhm-v16-modules > *{min-width:0!important;width:100%!important;margin:0!important}

  /* Scientific body remains readable across the full page. */
  .dhm-v22-refine .dhm-v16-modules > .dhm-v13-main{grid-column:1 / -1!important;order:10!important}

  /* Explicit request: FAQ and comparison share one desktop row. */
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-table-section{
    grid-column:span 2!important;order:20!important;align-self:stretch!important
  }
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-faq-section{
    grid-column:span 2!important;order:20!important;align-self:stretch!important
  }

  /* Four equal support cards in the following rows. */
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-action{grid-column:span 1!important;order:30!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-warning{grid-column:span 1!important;order:30!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-pharmacist-section{grid-column:span 1!important;order:30!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-professional{grid-column:span 1!important;order:30!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-common-mistakes,
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-text,
  .dhm-v22-refine .dhm-v16-modules > .dhm-single-extra:not(.dhm-sync-products):not(.dhm-sync-table-section):not(.dhm-sync-faq-section):not(.dhm-pharmacist-section):not(.dhm-professional){
    grid-column:span 1!important;order:31!important
  }

  /* Commerce + sources use the same compact row language as the target. */
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-products{grid-column:span 2!important;order:40!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-sources,
  .dhm-v22-refine .dhm-v16-modules > #dhm-scientific-sources{grid-column:span 1!important;order:40!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-v13-review-footer{grid-column:span 1!important;order:40!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-v13-related{grid-column:1/-1!important;order:50!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-media{grid-column:span 2!important;order:41!important}

  /* Normalize all card headings and bodies, including old inline legacy rules. */
  .dhm-v22-refine .dhm-v16-modules > * > h2{
    display:block!important;background:transparent!important;border:0!important;box-shadow:none!important;
    color:var(--d23-navy)!important;font-size:21px!important;line-height:1.45!important;font-weight:900!important;
    margin:0 0 9px!important;padding:0!important;min-height:31px!important
  }
  .dhm-v22-refine .dhm-v16-modules > * > .dhm-section-card{
    display:block!important;width:100%!important;box-sizing:border-box!important;margin:0!important;
    min-height:0!important;height:auto!important;padding:17px!important;border:1px solid var(--d23-line)!important;
    border-right:4px solid var(--d23-blue)!important;border-radius:14px!important;background:#fff!important;
    box-shadow:0 6px 18px rgba(16,52,87,.045)!important;color:#3f566d!important;font-size:14px!important;line-height:1.95!important
  }
  .dhm-v22-refine .dhm-sync-table-section > .dhm-section-card,
  .dhm-v22-refine .dhm-sync-faq-section > .dhm-section-card{min-height:330px!important}
  .dhm-v22-refine .dhm-sync-action > .dhm-section-card{background:#f1faf6!important;border-right-color:var(--d23-green)!important}
  .dhm-v22-refine .dhm-sync-warning > .dhm-section-card{background:#fff8ef!important;border-right-color:var(--d23-orange)!important}
  .dhm-v22-refine .dhm-pharmacist-section > .dhm-section-card{background:#f0fbfb!important;border-right-color:var(--d23-teal)!important}
  .dhm-v22-refine .dhm-professional > .dhm-section-card{background:#faf6ff!important;border-right-color:var(--d23-violet)!important}

  /* Table should read like a compact comparison card, not a page-wide sheet. */
  .dhm-v22-refine .dhm-sync-table-wrap{overflow:auto!important;max-height:300px!important;border-radius:10px!important}
  .dhm-v22-refine .dhm-sync-table{font-size:12.5px!important;line-height:1.65!important;min-width:560px!important}
  .dhm-v22-refine .dhm-sync-table th,.dhm-v22-refine .dhm-sync-table td{padding:8px 9px!important}

  /* FAQ uses the same vertical density as the table. */
  .dhm-v22-refine .dhm-sync-faq-section .dhm-section-kicker{font-size:12px!important;margin:0 0 8px!important}
  .dhm-v22-refine .dhm-faq-toggle{min-height:42px!important;padding:8px 10px!important;font-size:12.5px!important}

  /* Product cards: compact horizontal commerce panel within two grid columns. */
  .dhm-v22-refine .dhm-sync-products-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}
  .dhm-v22-refine .dhm-sync-product{padding:10px!important;font-size:11.5px!important;line-height:1.55!important}
  .dhm-v22-refine .dhm-sync-product-main img{max-height:74px!important;object-fit:contain!important}

  /* Seven-line default for editorial cards; existing JS opens the rest. */
  .dhm-v22-refine .dhm-section-card .dhm-collapse-body.is-collapsed{max-height:13.5em!important}
  .dhm-v22-refine .dhm-section-card .dhm-collapse-body.is-collapsed::after{height:42px!important}
}

/* Mid-size desktop/tablet: keep FAQ and comparison paired where possible. */
@media (min-width:900px) and (max-width:1179px){
  .dhm-v23-hero-refcards{grid-template-columns:1fr 1fr!important}
  .dhm-v22-refine .dhm-v16-modules{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:15px!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-v13-main{grid-column:1/-1!important;order:10!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-table-section{grid-column:span 1!important;order:20!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-faq-section{grid-column:span 1!important;order:20!important}
  .dhm-v22-refine .dhm-v16-modules > .dhm-sync-products,.dhm-v22-refine .dhm-v16-modules > .dhm-v13-related{grid-column:1/-1!important}
}

/* Mobile retains the approved vertical reading model; hero reference cards disappear to avoid length. */
@media (max-width:899px){
  .dhm-v23-hero-refcards{display:none!important}
  .dhm-v22-refine .dhm-v21-side-right .dhm-v13-audience-card,
  .dhm-v22-refine .dhm-v21-side-right .dhm-v13-pro-card{display:none!important}
  .dhm-v22-refine .dhm-v16-modules{display:block!important}
  .dhm-v22-refine .dhm-v16-modules > *{width:100%!important;margin:16px 0!important}
  .dhm-v22-refine .dhm-sync-products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
}