/* Advertising stays bounded and separate from editorial content. */
.media-ad-slot[hidden], .advertising-directory[hidden] { display: none !important; }
.media-ad-slot { margin: 42px 0 10px; }
.media-ad {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(174, 167, 213, .18);
  border-radius: 16px;
  background: linear-gradient(115deg, rgba(18, 18, 38, .97), rgba(8, 15, 28, .97));
  color: #f4f2fa;
}
.media-ad__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 12px;
  padding: 12px 22px 0;
  font-size: 11px;
  line-height: 1.5;
  color: #a9aec0;
}
.media-ad__label { flex: 0 0 auto; letter-spacing: .08em; text-transform: uppercase; color: #c8c7d3; }
.media-ad__advertiser { overflow-wrap: anywhere; }
.media-ad__link { display: grid; align-items: center; padding: 17px 22px 22px; gap: 28px; border-radius: 12px; }
.media-ad--illustrated .media-ad__link { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.media-ad__picture { display: block; min-width: 0; overflow: hidden; border-radius: 9px; background: rgba(0, 0, 0, .2); }
.media-ad__picture img { display: block; width: 100%; height: 154px; object-fit: contain; }
.media-ad__copy { min-width: 0; }
.media-ad__title { margin: 0 0 8px; font: 700 clamp(18px, 2.1vw, 23px)/1.25 Arial, Helvetica, sans-serif; letter-spacing: -.025em; overflow-wrap: anywhere; }
.media-ad__description { max-width: 58ch; margin: 0; color: #bcc1d1; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.media-ad__action { display: inline-flex; align-items: center; gap: 14px; margin-top: 15px; color: #d2c4f7; font-size: 12px; font-weight: 700; }
.media-ad__arrow { font-size: 17px; }
.media-ad__link:hover .media-ad__action { color: #8fe2ef; }
.media-ad__link:focus-visible, .advertising-page a:focus-visible { outline: 2px solid #82dcf1; outline-offset: -4px; }
.media-ad__disclosure { margin: 0; padding: 10px 22px 13px; border-top: 1px solid rgba(174, 167, 213, .1); color: #a9aec0; font-size: 10px; line-height: 1.6; overflow-wrap: anywhere; }
.media-ad--catalog .media-ad__picture img { height: 108px; }
.media-ad--catalog .media-ad__link { gap: 24px; }
.media-ad--catalog.media-ad--illustrated .media-ad__link { grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); }
.media-ad--catalog .media-ad__title { font-size: 19px; }

/* All cards share one grid cell: the tallest reserves space, avoiding layout shifts.
   Only the active card's image is requested; inactive links cannot receive focus. */
.media-ad-carousel { min-width: 0; }
.media-ad-carousel__slides { display: grid; isolation: isolate; }
.media-ad-carousel__slide { grid-area: 1 / 1; min-width: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .24s ease, visibility 0s linear .24s; }
.media-ad-carousel__slide.is-active { z-index: 1; opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; }
.media-ad-carousel__controls { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 5px; padding-top: 7px; }
.media-ad-carousel__controls[hidden] { display: none; }
.media-ad-carousel__button { display: inline-flex; justify-content: center; align-items: center; min-width: 44px; min-height: 44px; padding: 8px 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #aeb3c7; font: 500 14px/1.3 Arial, Helvetica, sans-serif; cursor: pointer; }
.media-ad-carousel__button:hover { border-color: rgba(174, 167, 213, .18); background: rgba(174, 167, 213, .07); color: #f4f2fa; }
.media-ad-carousel__button:focus-visible { outline: 2px solid #82dcf1; outline-offset: -3px; }
.media-ad-carousel__pause { min-width: 104px; font-size: 11px; }
.media-ad-carousel__count { min-width: 48px; color: #9299ae; font-size: 11px; text-align: center; font-variant-numeric: tabular-nums; }
.media-ad-carousel__announcement { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.media-ad-carousel .media-ad__picture { height: 154px; }
.media-ad-carousel .media-ad--catalog .media-ad__picture { height: 108px; }
.media-ad-carousel .media-ad__picture img[hidden] { display: none; }
.media-ad__picture--unavailable { display: grid; place-items: center; }
.media-ad__image-fallback { padding: 12px; color: #9299ae; font-size: 11px; text-align: center; }

.advertising-page { background: #060712; }
.advertising-page::before { display: none; }
.advertising-main { overflow: hidden; padding: calc(var(--site-header-height, 88px) + 34px) 0 88px; background: radial-gradient(ellipse at 82% 12%, rgba(111, 65, 184, .17), transparent 33%), radial-gradient(ellipse at 6% 34%, rgba(41, 126, 148, .08), transparent 26%); }
.advertising-shell { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.advertising-breadcrumb { display: inline-flex; gap: 10px; color: #a5a8be; font-size: 12px; line-height: 1.7; }
.advertising-breadcrumb:hover { color: #fff; }
.advertising-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: center; gap: 70px; padding: 56px 0 65px; }
.advertising-kicker { margin: 0 0 23px; color: #bb9ee9; font-size: 10px; font-weight: 700; letter-spacing: .22em; line-height: 1.7; text-transform: uppercase; }
.advertising-hero h1 { max-width: 620px; margin: 0; font: 700 clamp(38px, 5.2vw, 65px)/1.05 Arial, Helvetica, sans-serif; letter-spacing: -.055em; overflow-wrap: anywhere; }
.advertising-hero__intro { max-width: 510px; margin: 24px 0 27px; color: #b9bdce; font-size: 15px; line-height: 1.85; white-space: pre-line; overflow-wrap: anywhere; }
.advertising-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 23px; }
.advertising-button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 25px; padding: 13px 20px; border: 1px solid #ad8ee1; border-radius: 8px; background: #c7abea; color: #160c25; font-size: 12px; font-weight: 700; line-height: 1.4; }
.advertising-button:hover { background: #d6bcf4; border-color: #d6bcf4; }
.advertising-text-link { padding: 10px 0; color: #cbcbda; font-size: 12px; }
.advertising-text-link:hover { color: #a1e3ec; }
.advertising-note { margin: 16px 0 0; color: #959caf; font-size: 11px; line-height: 1.7; }

/* A purely decorative layout study, never presented as an actual advertiser. */
.advertising-study { position: relative; margin: 0; padding: 25px; border: 1px solid rgba(173, 145, 221, .23); border-radius: 20px; background: linear-gradient(140deg, rgba(29, 26, 49, .86), rgba(11, 17, 28, .9)); box-shadow: 0 26px 70px rgba(0, 0, 0, .16); }
.advertising-study__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; color: #efedf6; font-size: 11px; font-weight: 700; letter-spacing: .2em; }
.advertising-study__dots { width: 38px; height: 4px; border-radius: 2px; background: #9c9cad; box-shadow: -47px 0 0 #454457; }
.advertising-study__story { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 9px; }
.advertising-study__panel { position: relative; height: 139px; overflow: hidden; border: 1px solid rgba(255, 255, 255, .07); border-radius: 5px; background: linear-gradient(165deg, #282449, #141427); }
.advertising-study__panel::before { content: ''; position: absolute; width: 62px; height: 150px; bottom: -35px; left: 12%; border-radius: 60% 60% 0 0; transform: rotate(25deg); background: linear-gradient(150deg, #4d396f, #292443); }
.advertising-study__panel:nth-child(2) { background: linear-gradient(160deg, #1e3743, #101a25); }
.advertising-study__panel:nth-child(2)::before { left: 25%; background: linear-gradient(150deg, #356576, #1b3543); transform: rotate(-23deg); }
.advertising-study__panel:nth-child(3) { background: linear-gradient(155deg, #483547, #211828); }
.advertising-study__panel:nth-child(3)::before { left: 31%; background: linear-gradient(150deg, #835875, #443348); }
.advertising-study__lines { height: 4px; width: 68%; margin: 17px 0 24px; border-radius: 4px; background: #39384d; box-shadow: 0 9px 0 #232336; }
.advertising-study__banner { display: flex; align-items: center; gap: 14px; padding: 13px; border: 1px solid rgba(168, 152, 202, .27); border-radius: 7px; background: #191827; }
.advertising-study__mark { display: grid; place-items: center; flex: 0 0 44px; height: 44px; border-radius: 6px; color: #b7a1dd; background: #302a42; font-size: 26px; }
.advertising-study__banner div { flex: 1; }
.advertising-study__banner small { display: block; margin-bottom: 4px; font-size: 8px; font-weight: 400; color: #a5a2b6; letter-spacing: .08em; text-transform: uppercase; }
.advertising-study__banner strong { display: block; color: #e3dfed; font-size: 12px; line-height: 1.5; }
.advertising-study__banner > span:last-child { color: #b6a3d4; font-size: 18px; }
.advertising-study figcaption { margin-top: 18px; color: #9399ad; font-size: 10px; line-height: 1.6; }

.advertising-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; padding: 27px 0 30px; border-top: 1px solid #242437; border-bottom: 1px solid #242437; }
.advertising-principles article { display: flex; align-items: flex-start; gap: 12px; }
.advertising-principles__icon { display: grid; place-items: center; flex: 0 0 27px; height: 27px; color: #a4d5df; border: 1px solid #33404c; border-radius: 50%; font-size: 13px; }
.advertising-principles h2 { margin: 2px 0 7px; font-size: 13px; font-weight: 700; }
.advertising-principles p { margin: 0; color: #a5abba; font-size: 11px; line-height: 1.75; }
.advertising-section { padding-top: 69px; scroll-margin-top: 110px; }
.advertising-section-heading { display: flex; justify-content: space-between; gap: 25px; align-items: end; margin-bottom: 25px; }
.advertising-section-heading h2 { margin: 0; font-size: clamp(26px, 3vw, 35px); line-height: 1.2; letter-spacing: -.035em; }
.advertising-section-heading .advertising-kicker { margin-bottom: 12px; }
.advertising-section-heading > p { max-width: 350px; margin: 0 0 3px; color: #aeb2c3; font-size: 12px; line-height: 1.75; }
.advertising-formats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.advertising-format { min-width: 0; padding: 23px; border: 1px solid #2b293e; border-radius: 13px; background: linear-gradient(155deg, #12121f, #0c101d); }
.advertising-format__number { color: #b49bd8; font-size: 11px; letter-spacing: .12em; }
.advertising-format h3 { margin: 18px 0 11px; font-size: 20px; font-weight: 700; letter-spacing: -.03em; }
.advertising-format p { margin: 0 0 20px; color: #acb0c1; font-size: 12px; line-height: 1.8; }
.advertising-format__meta { display: block; padding-top: 15px; border-top: 1px solid #272839; color: #ced0df; font-size: 10px; line-height: 1.7; }
.advertising-format__meta b { color: #a5d2dc; font-weight: 400; }
.advertising-process { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; counter-reset: advertising-step; margin: 0; padding: 6px 0 0; gap: 32px; }
.advertising-process li { counter-increment: advertising-step; position: relative; padding: 0 0 0 40px; }
.advertising-process li::before { content: counter(advertising-step, decimal-leading-zero); position: absolute; left: 0; top: 2px; color: #8c8ca9; font-size: 12px; }
.advertising-process h3 { margin: 0 0 10px; color: #e9e6f3; font-size: 14px; }
.advertising-process p { margin: 0; color: #a8aec0; font-size: 12px; line-height: 1.8; }
.advertising-materials { margin: 28px 0 0; padding: 16px 20px; border-left: 2px solid #5c5379; border-radius: 0 6px 6px 0; background: #111320; color: #b1b6c7; font-size: 12px; line-height: 1.8; }
.advertising-materials strong { color: #e1dced; }
.advertising-directory .media-ad-slot { display: grid; gap: 18px; margin: 0; }
.advertising-contact { display: flex; align-items: center; justify-content: space-between; gap: 36px; margin-top: 68px; padding: 33px 37px; border: 1px solid #423650; border-radius: 14px; background: linear-gradient(115deg, #21182e, #111724); }
.advertising-contact h2 { margin: 0 0 12px; font-size: clamp(25px, 3vw, 34px); font-weight: 700; letter-spacing: -.04em; }
.advertising-contact p { max-width: 600px; margin: 0; color: #b8b7c8; font-size: 12px; line-height: 1.8; }
.advertising-contact .advertising-button { flex: 0 0 auto; }

@media (min-width: 1500px) {
  .home-page .media-ad-slot { max-width: 1160px; margin-inline: auto; }
}
@media (max-width: 900px) {
  .advertising-hero { gap: 34px; }
  .advertising-study { padding: 20px; }
  .advertising-study__panel { height: 105px; }
  .advertising-principles { gap: 20px; }
  .advertising-formats { gap: 12px; }
  .advertising-format { padding: 19px; }
  .advertising-contact { padding: 28px; }
}
@media (max-width: 700px) {
  .advertising-shell { width: calc(100% - 32px); }
  .advertising-main { padding-top: calc(var(--site-header-height, 72px) + 25px); padding-bottom: 52px; }
  .advertising-hero { grid-template-columns: 1fr; gap: 36px; padding: 34px 0 39px; }
  .advertising-hero h1 { max-width: 540px; font-size: clamp(39px, 8vw, 56px); }
  .advertising-hero__intro { margin-top: 20px; font-size: 14px; }
  .advertising-study { max-width: 480px; width: 100%; padding: 23px; }
  .advertising-study__panel { height: 115px; }
  .advertising-principles { grid-template-columns: 1fr; gap: 23px; padding: 28px 0; }
  .advertising-principles p { font-size: 12px; }
  .advertising-section { padding-top: 44px; }
  .advertising-section-heading { display: block; margin-bottom: 23px; }
  .advertising-section-heading > p { max-width: 100%; margin-top: 14px; }
  .advertising-formats { grid-template-columns: 1fr; gap: 12px; }
  .advertising-format { padding: 23px; }
  .advertising-format h3 { margin-top: 13px; }
  .advertising-process { grid-template-columns: 1fr; gap: 26px; }
  .advertising-process p { max-width: 450px; }
  .advertising-contact { display: block; margin-top: 43px; padding: 27px 23px; }
  .advertising-contact .advertising-button { margin-top: 22px; }
}
@media (max-width: 600px) {
  .media-ad-slot { margin-top: 30px; }
  .media-ad__meta { padding: 12px 16px 0; gap: 5px 10px; }
  .media-ad__link, .media-ad--illustrated .media-ad__link, .media-ad--catalog.media-ad--illustrated .media-ad__link { grid-template-columns: 1fr; gap: 16px; padding: 15px 16px 18px; }
  .media-ad__picture img, .media-ad-carousel .media-ad__picture { height: 145px; }
  .media-ad--catalog .media-ad__picture img { height: 108px; }
  .media-ad__title, .media-ad--catalog .media-ad__title { font-size: 18px; }
  .media-ad__description { font-size: 12px; }
  .media-ad__disclosure { padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .advertising-page { scroll-behavior: auto; }
  .media-ad-carousel__slide { transition: none; }
}