/* ELB site — mobile optimization. Media-query overrides that inline styles can't express.
   NOTE: the DC runtime re-serializes inline styles as "prop: value" (space after colon,
   spaces after commas, 0 -> 0px). Attribute selectors below MUST match that exact form. */

/* ---------- Header: hamburger (class-based) ---------- */
.elb-hd-burger { display: none; }
.elb-hd-drawer { display: none; }

@media (max-width: 760px) {
  .elb-hd-nav { display: none !important; }
  .elb-hd-burger { display: flex !important; }
  .elb-hd-drawer[data-open="true"] { display: block !important; }
}

/* ---------- Tablet & below ---------- */
@media (max-width: 860px) {
  /* content-wrapper gutters 40 -> 20 */
  [style*="max-width: 1120px"],
  [style*="max-width: 1000px"],
  [style*="max-width: 900px"] { padding-left: 20px !important; padding-right: 20px !important; }

  /* full-bleed hero / page-header sections: drop their own horizontal padding
     (the inner max-width child supplies the 20px gutter) */
  [style*="padding: 104px 40px 108px"] { padding: 54px 0px 58px !important; }
  [style*="padding: 82px 40px 86px"] { padding: 48px 0px 52px !important; }
  [style*="padding: 44px 40px 72px"] { padding: 44px 0px 48px !important; }

  /* collapse two-column layouts to one */
  [style*="grid-template-columns: 1.12fr 0.88fr"],
  [style*="grid-template-columns: 1.1fr 0.9fr"],
  [style*="grid-template-columns: 0.9fr 1.1fr"],
  [style*="grid-template-columns: 1.05fr 0.95fr"],
  [style*="grid-template-columns: 0.88fr 1.12fr"],
  [style*="grid-template-columns: 340px 1fr"],
  [style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: 1fr !important; }

  /* 4-col grids -> 2-col */
  [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr 1fr !important; }

  /* products teaser header: title + "전체 보기" link wrap */
  [style*="align-items: flex-end; justify-content: space-between"] { flex-wrap: wrap !important; }

  /* neutralize fixed max-widths that exceed a phone width (lead paragraphs, hero image) */
  [style*="max-width: 640px"],
  [style*="max-width: 620px"],
  [style*="max-width: 600px"],
  [style*="max-width: 560px"],
  [style*="max-width: 540px"],
  [style*="max-width: 520px"],
  [style*="max-width: 470px"],
  [style*="max-width: 430px"] { max-width: 100% !important; }

  /* big headings */
  [style*="font-size: 54px"] { font-size: 33px !important; }
  [style*="font-size: 46px"] { font-size: 30px !important; }
  [style*="font-size: 44px"] { font-size: 30px !important; }
  [style*="font-size: 34px"] { font-size: 25px !important; }
  [style*="font-size: 32px"] { font-size: 24px !important; }
}

/* ---------- Phone ---------- */
@media (max-width: 540px) {
  body { overflow-x: hidden; }

  /* single column everywhere */
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1.4fr 1fr 1fr 1.2fr"] { grid-template-columns: 1fr !important; }

  /* narrow the label column of definition-style rows */
  [style*="grid-template-columns: 190px 1fr"],
  [style*="grid-template-columns: 170px 1fr"],
  [style*="grid-template-columns: 132px 1fr"] { grid-template-columns: 88px 1fr !important; gap: 14px !important; }

  /* product stickers: fit the card, keep A4 ratio */
  [style*="width: 300px"],
  [style*="width: 280px"] { width: 100% !important; max-width: 300px !important; height: auto !important; }

  /* charts: let wide plots scroll instead of squishing */
  [style*="height: 150px"] { justify-content: flex-start !important; overflow-x: auto !important; }

  /* footer bottom bar wraps */
  [style*="margin: 32px auto 0px"] { flex-wrap: wrap !important; gap: 6px !important; }

  /* headings a touch smaller on phones */
  [style*="font-size: 54px"] { font-size: 30px !important; }
  [style*="font-size: 30px"] { font-size: 24px !important; }
  [style*="font-size: 28px"] { font-size: 23px !important; }
}