/* hume.media — shared page furniture.
   Media queries and print rules cannot be expressed inline, so they live here.
   Layout elements carry data-r="<token> <token>" and these rules target them. */

body { margin: 0; background: #F6F3EC; }
a { color: #16181A; text-decoration: none; }
a:hover { color: #0E5A61; }

/* Content capped on wide screens; section backgrounds stay full-bleed. */
[data-r~="pad"] {
  padding-left: max(56px, calc((100% - 1220px) / 2)) !important;
  padding-right: max(56px, calc((100% - 1220px) / 2)) !important;
}
[data-r~="footpad"] {
  margin-left: max(56px, calc((100vw - 1220px) / 2)) !important;
  margin-right: max(56px, calc((100vw - 1220px) / 2)) !important;
}

@media (max-width: 1080px) {
  [data-r~="split"], [data-r~="lede"] { grid-template-columns: 1fr !important; gap: 48px !important; }
  [data-r~="metaside"] { border-left: 0 !important; border-top: 1px solid #DCCFB6 !important; padding-left: 0 !important; padding-top: 18px !important; }
  [data-r~="cols3"] { grid-template-columns: 1fr 1fr !important; gap: 36px !important; }
}

@media (max-width: 820px) {
  [data-r~="pad"] { padding-left: 24px !important; padding-right: 24px !important; }
  [data-r~="padv"] { padding-top: 60px !important; padding-bottom: 60px !important; }
  [data-r~="cols3"], [data-r~="flow"], [data-r~="trio"], [data-r~="row"], [data-r~="case"] { grid-template-columns: 1fr !important; }
  [data-r~="cols3"] { gap: 40px !important; }
  [data-r~="flow"] { gap: 16px !important; }
  [data-r~="row"] { gap: 6px !important; }
  [data-r~="case"] { gap: 20px !important; }
  [data-r~="trio"] { gap: 0 !important; }
  [data-r~="trio"] > div { border-right: 0 !important; border-bottom: 1px solid #DFDCD4 !important; padding: 14px 0 !important; }
  [data-r~="trio"] > div:last-child { border-bottom: 0 !important; }
  [data-r~="wrap"] { flex-wrap: wrap !important; gap: 14px 22px !important; }
  [data-r~="hide"] { display: none !important; }
  [data-r~="hero"] { font-size: 44px !important; }
  [data-r~="lead"] { font-size: 34px !important; }
  [data-r~="watermark"] { left: -60px !important; width: 340px !important; }
  [data-r~="footpad"] { margin-left: 24px !important; margin-right: 24px !important; }
}
