*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body.media-page { margin:0; background:#fff; color:#17191d; font-family:Inter,Arial,sans-serif; line-height:1.7; --xeon-title-size:clamp(48px,6.8vw,90px); --media-line:#d1d8df; }
.media-page #main-nav { position:sticky; top:0; }
.media-page main :is(h1,h2,h3,p,blockquote) { margin:0; }
.media-page main a { color:inherit; text-underline-offset:4px; }
.media-page [hidden] { display:none!important; }
.media-page main :is(a,button):focus-visible { outline:2px solid #245cd6; outline-offset:5px; }
.media-wrap { width:min(1280px,calc(100% - 96px)); margin-inline:auto; }
.media-skip { position:fixed; top:10px; left:12px; transform:translateY(-180%); z-index:3000; background:#fff; padding:10px 15px; color:#111; }
.media-skip:focus { transform:none; }
.media-eyebrow,.media-topline>span,.media-channel-nav>a>span:first-child,.media-frame-head,.media-caption-rule,.media-reddit-card-top,.media-reddit-card-bottom { font:10px/1.5 'Share Tech Mono',monospace; letter-spacing:.07em; text-transform:uppercase; }
.media-eyebrow { color:#627184; }
.media-topline { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:27px 0 23px; border-bottom:1px solid var(--media-line); }
.media-topline>a { font-size:12px; text-decoration:none; }
.media-topline>span { color:#687889; }
.media-hero-row { display:grid; grid-template-columns:1.2fr 1fr; gap:70px; align-items:end; padding:48px 0 45px; }
.media-hero h1 { word-spacing:.07em; }
.media-hero-row .media-eyebrow { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.media-eyebrow i { height:5px; width:5px; border-radius:50%; background:#245cd6; }
.media-intro { max-width:375px; justify-self:end; }
.media-intro>p:first-child { font-size:25px; letter-spacing:-.03em; line-height:1.25; }
.media-intro>p:last-child { font-size:13px; color:#616c79; margin-top:20px; line-height:1.85; }
.media-channel-nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-block:1px solid var(--media-line); }
.media-channel-nav>a { display:grid; grid-template-columns:1fr auto; padding:20px 25px; gap:8px 20px; text-decoration:none; border-right:1px solid var(--media-line); transition:background .2s; }
.media-channel-nav>a:first-child { padding-left:0; }
.media-channel-nav>a:last-child { border:0; }
.media-channel-nav>a>span:first-child { grid-column:1 / -1; color:#697788; font-size:9px; }
.media-channel-nav strong { font-size:22px; font-weight:500; letter-spacing:-.04em; }
.media-channel-nav>a:hover { background:#f5f7fa; }
.media-channel-nav>a>span:last-child { align-self:center; }
.media-section { padding-block:56px; border-bottom:1px solid var(--media-line); }
.media-section-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:30px; }
.media-link { display:inline-flex; gap:24px; justify-content:space-between; text-decoration:none; font-size:12px; border-bottom:1px solid #a8b5c4; padding:5px 0; }
.media-link:hover { color:#245cd6!important; border-color:#245cd6; }
.media-feed-layout { display:grid; grid-template-columns:1fr 1.35fr; gap:65px; align-items:start; }
.media-copy h2,.media-video-heading h2 { font-size:clamp(31px,3.4vw,47px); }
.media-copy>p,.media-video-heading p { color:#5f6c7b; font-size:14px; margin-top:22px!important; max-width:430px; }
.media-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }
.media-tags span { border:1px solid #ccd5df; padding:6px 10px; font:10px 'Share Tech Mono',monospace; color:#697889; }
.media-button { display:inline-flex; align-items:center; justify-content:space-between; gap:35px; padding:13px 19px; min-height:48px; font-size:12px; text-decoration:none; background:#17191d; color:white!important; border:1px solid #17191d; }
.media-button:hover { background:#35404e; }
.media-copy .media-button { margin-top:30px; }
.media-caption-rule { display:flex; justify-content:space-between; gap:20px; margin-top:70px; padding-top:15px; border-top:1px solid var(--media-line); color:#7b8b9d; font-size:9px; }
.media-feed-frame { min-width:0; border:1px solid #b6c2cf; background:#f3f5f7; }
.media-frame-head { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:11px 16px; border-bottom:1px solid #c4cdd7; font-size:9px; color:#5d7086; background:#fff; }
.media-instagram-host { display:flex; justify-content:center; padding:22px; min-height:660px; background-image:radial-gradient(#9dadc340 .75px,transparent .75px); background-size:8px 8px; }
.media-instagram-frame { display:block; width:100%; max-width:540px; min-width:0; height:650px; border:1px solid #d2dbe4; background:#fff; }
.media-remote { position:relative; }
.media-remote.is-pending>iframe,.media-remote.is-failed>iframe { visibility:hidden; }
.media-remote-fallback { position:absolute; inset:22px; padding:35px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px solid #c4ceda; background:#fff; }
.media-remote-handle { font-size:clamp(27px,4vw,48px); font-weight:500; letter-spacing:-.05em; margin-top:18px!important; }
.media-remote-status { font-size:12px; max-width:330px; color:#617187; margin:16px 0 25px!important; }
.media-remote-fallback .media-retry { margin-top:15px; }
.media-youtube-host .media-remote-fallback { border-color:#394b62; background:#111821; color:#fff; }
.media-youtube-host .media-remote-fallback :is(.media-eyebrow,.media-remote-status,.media-retry) { color:#a6b9d0; }
.media-youtube-host .media-remote-fallback .media-button { border-color:#a5b8d0; }
.media-embed-fallback { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 20px; padding:12px 17px; border-top:1px solid #d0d8e2; background:#fff; font-size:10px; color:#6c7a8c; }
.media-embed-fallback a { font-size:10px; }
.media-retry { font:inherit; font-size:10px; cursor:pointer; background:none; border:0; padding:7px 0; color:#354d70; }
.media-video-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:28px; }
.media-video-heading p { max-width:500px; }
.media-video-heading .media-button { flex-shrink:0; }
.media-youtube-host { width:100%; aspect-ratio:16 / 9; background:#11161e; }
.media-youtube-host iframe { width:100%; height:100%; display:block; border:0; }
.media-reddit-layout { display:grid; grid-template-columns:1.1fr 1fr; gap:75px; align-items:center; }
.media-reddit-layout .media-copy h2 { font-size:clamp(29px,3.3vw,44px); }
.media-reddit-card { display:flex; flex-direction:column; gap:40px; padding:25px 27px; color:#fff!important; background-color:#12171e; background-image:linear-gradient(#ffffff0a 1px,transparent 1px),linear-gradient(90deg,#ffffff0a 1px,transparent 1px); background-size:25px 25px; border:1px solid #374150; text-decoration:none; }
.media-reddit-card-top,.media-reddit-card-bottom { display:flex; justify-content:space-between; align-items:center; gap:20px; color:#acb9cb; }
.media-reddit-wordmark { font-size:56px; font-weight:600; letter-spacing:-.065em; line-height:1.1; }
.media-reddit-handle { font-size:15px; color:#98adc7; margin-top:10px!important; }
.media-reddit-card-bottom { padding-top:20px; border-top:1px solid #455163; font-size:10px; }
.media-reddit-card:hover { border-color:#8aa5c9; background-color:#1b2635; }
.media-reddit-embed { display:block; width:100%; height:650px; border:0; background:#fff; }
.media-academy { padding:45px 0; margin-top:60px; background:#f3f5f7; border-top:1px solid #d6dde5; }
.media-academy>.media-wrap { display:flex; justify-content:space-between; align-items:center; gap:30px; }
.media-academy h2 { font-size:clamp(27px,3vw,38px); margin-top:12px!important; }
.media-academy p:last-child { color:#637184; font-size:12px; margin-top:16px!important; }
.media-academy .media-button { flex-shrink:0; }
@media(max-width:1100px) {
  .media-wrap { width:calc(100% - 64px); }
  .media-feed-layout { gap:35px; grid-template-columns:1fr 1.4fr; }
  .media-instagram-host { padding:15px; }
  .media-reddit-layout { gap:40px; }
}
@media(max-width:800px) {
  .media-hero-row { grid-template-columns:1fr; gap:28px; }
  .media-intro { justify-self:start; max-width:560px; }
  .media-intro>p:first-child br { display:none; }
  .media-feed-layout { grid-template-columns:1fr; }
  .media-caption-rule { display:none; }
  .media-copy>p { max-width:520px; }
  .media-video-heading { flex-direction:column; align-items:flex-start; gap:22px; }
  .media-reddit-layout { grid-template-columns:1fr; }
  .media-reddit-card { min-height:310px; }
}
@media(max-width:600px) {
  html { scroll-padding-top:90px; }
  .media-wrap { width:calc(100% - 40px); }
  .media-topline { padding:21px 0 19px; }
  .media-topline>a { font-size:11px; }
  .media-topline>span { font-size:9px; }
  .media-hero-row { padding:32px 0; }
  .media-hero-row .media-eyebrow { font-size:9px; }
  .media-intro>p:first-child { font-size:22px; }
  .media-intro>p:last-child { font-size:13px; margin-top:15px; }
  .media-channel-nav>a { padding:15px 10px; gap:7px 5px; grid-template-rows:24px auto; }
  .media-channel-nav>a>span:first-child { font-size:8px; max-width:90px; }
  .media-channel-nav strong { font-size:16px; }
  .media-channel-nav>a>span:last-child { display:none; }
  .media-section { padding-block:35px; }
  .media-section-head { margin-bottom:24px; }
  .media-copy h2,.media-video-heading h2 { font-size:34px; }
  .media-copy>p,.media-video-heading p { font-size:13px; margin-top:17px!important; }
  .media-frame-head { font-size:8px; padding:11px; }
  .media-frame-head>span:last-child { font-size:8px; }
  .media-instagram-host { padding:0; min-height:580px; }
  .media-instagram-frame { height:580px; border:0; }
  .media-remote-fallback { inset:10px; padding:20px 12px; }
  .media-youtube-host { min-height:330px; }
  .media-youtube-host:not(.is-pending):not(.is-failed) { min-height:200px; }
  .media-remote-fallback .media-button { gap:15px; font-size:11px; padding:12px; }
  .media-embed-fallback { padding:11px; gap:5px 12px; }
  .media-reddit-card { padding:22px; }
  .media-reddit-wordmark { font-size:48px; }
  .media-academy { margin-top:35px; padding:32px 0; }
  .media-academy>.media-wrap { flex-direction:column; align-items:flex-start; gap:24px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .media-channel-nav>a { transition:none; } }