/* hk-ads.css — house ad units (MasterClass). Markup + placement live in hk-ads.mjs.
   Dark editorial units in MasterClass's own black/white/#E32652, so they read as a
   clearly labelled ad, not as site UI. No images: SVG brand marks + system type. */
.hk-ad { position: relative; display: block; box-sizing: border-box; background: #0b0b0c; color: #fff;
  text-decoration: none !important; border-radius: 6px; overflow: hidden; text-align: left;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased; letter-spacing: 0; transition: transform .15s ease, box-shadow .15s ease; }
/* beat the theme's `.entry-content a` / `a:hover` rules (color, underline, border, shadow) */
.hk-ad, .hk-ad:hover, .hk-ad:focus, .hk-ad:visited,
.entry-content .hk-ad, .entry-content .hk-ad:hover, .entry-content .hk-ad:focus, .entry-content .hk-ad:visited,
.sidebar .hk-ad, .sidebar .hk-ad:hover { color: #fff; border: 0; box-shadow: none !important; background-image: none; text-decoration: none; }
.hk-ad:hover, .hk-ad:focus-visible, .entry-content .hk-ad:hover, .entry-content .hk-ad:focus-visible, .sidebar .hk-ad:hover {
  transform: translateY(-1px); box-shadow: 0 14px 30px -16px rgba(227, 38, 82, .6) !important; outline: none; }
.hk-ad:focus-visible, .entry-content .hk-ad:focus-visible { box-shadow: 0 0 0 3px rgba(227, 38, 82, .55) !important; }
.hk-ad * { box-sizing: border-box; }
.hk-ad svg { display: block; }
.hk-ad__label { position: absolute; top: 8px; right: 10px; font-size: 9px; line-height: 1; letter-spacing: .14em;
  text-transform: uppercase; color: #8d8d93; border: 1px solid #36363c; border-radius: 3px; padding: 3px 5px 2px; }
.hk-ad__brand svg { width: 118px; height: auto; color: #fff; }
.hk-ad__btn { display: inline-flex; align-items: center; gap: 6px; background: #e32652; color: #fff; font-weight: 700;
  font-size: 13px; line-height: 1; padding: 11px 16px; border-radius: 999px; white-space: nowrap; }
.hk-ad__btn--sm { padding: 8px 11px; font-size: 11px; }
.hk-ad__mark { color: #e32652; flex: none; }
.hk-ad__mark svg { width: 100%; height: 100%; }

/* ---- 300x250 (homepage sidebar) ---- */
.hk-ad-widget { margin: 0 0 30px; }
.hk-ad--300 { width: 300px; max-width: 100%; height: 250px; margin: 0 auto; padding: 22px 22px 20px; display: flex; flex-direction: column; }
.hk-ad--300 .hk-ad__head { font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-size: 25px; line-height: 1.1;
  letter-spacing: -.01em; margin-top: 16px; max-width: 240px; text-wrap: balance; }
.hk-ad--300 .hk-ad__sub { font-size: 12.5px; line-height: 1.4; color: #c9c9cf; margin-top: 8px; max-width: 232px; }
.hk-ad--300 .hk-ad__btn { margin-top: auto; align-self: flex-start; }
.hk-ad--300 .hk-ad__wm { position: absolute; right: -16px; bottom: -24px; width: 132px; height: 132px; color: #e32652; opacity: .16; pointer-events: none; }

/* ---- in-article slot ---- */
.hk-ad-slot--inline { display: flex; justify-content: center; margin: 26px 0; clear: both; }
.hk-ad--320 { width: 320px; max-width: 100%; height: 50px; border-radius: 5px; display: flex; align-items: center; gap: 9px; padding: 0 28px 0 11px; }
.hk-ad--320 .hk-ad__label { top: 3px; right: 5px; font-size: 8px; padding: 2px 3px 1px; letter-spacing: .1em; }
.hk-ad--320 .hk-ad__mark { width: 24px; height: 24px; }
.hk-ad__lines { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.hk-ad--320 .hk-ad__t1 { font-size: 12px; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hk-ad--320 .hk-ad__t2 { font-size: 10.5px; line-height: 1.2; color: #b7b7bd; margin-top: 2px; }
.hk-ad--320 .hk-ad__btn { margin-right: -14px; }

/* ---- 728x90 desktop companion (paired with the 320x50 below 800px) ---- */
.hk-ad--728 { width: 728px; max-width: 100%; height: 90px; display: flex; align-items: center; gap: 18px; padding: 0 24px 0 22px; }
.hk-ad--728 .hk-ad__mark { width: 44px; height: 44px; }
.hk-ad--728 .hk-ad__lines { overflow: hidden; }
.hk-ad--728 .hk-ad__t1 { font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-size: 21px; line-height: 1.1; white-space: nowrap; }
.hk-ad--728 .hk-ad__t2 { font-size: 12.5px; line-height: 1.3; color: #c9c9cf; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hk-ad-slot--pair .hk-ad--320 { display: none; }
@media (max-width: 799px) { .hk-ad-slot--pair .hk-ad--728 { display: none; } .hk-ad-slot--pair .hk-ad--320 { display: flex; } }

@media print { .hk-ad-widget, .hk-ad-slot { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .hk-ad { transition: none; } .hk-ad:hover { transform: none; } }
