/* A visible evolution of Arabtrix's gold, purple and midnight surfaces. */
.arabtrix-site .arabtrix-home {padding-top:4px}
.arabtrix-site .arabtrix-hero {border:0;border-radius:24px;background:#101521;box-shadow:0 24px 64px #0003}
.arabtrix-site .arabtrix-hero>h1 {top:22px;inset-inline-start:36px;letter-spacing:0;font-size:12px;color:#ffe59c}
.arabtrix-site .arabtrix-hero-slide {min-height:540px;display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:48px;padding:76px 42px 100px;align-items:center}
.arabtrix-site .arabtrix-hero-slide[hidden] {display:none}
.arabtrix-site .arabtrix-hero-slide:after {background:linear-gradient(270deg,#0b101bf5 5%,#0b101bd9 46%,#0b101b60),linear-gradient(0deg,#101521,transparent 65%)}
.arabtrix-site .arabtrix-hero-slide .arabtrix-hero-art {opacity:.85}
.arabtrix-site .arabtrix-hero-slide .arabtrix-hero-copy {max-width:710px;min-width:0}
.arabtrix-site .arabtrix-hero-slide h2 {font-size:clamp(26px,3.3vw,46px);font-weight:800;line-height:1.6;white-space:normal;text-wrap:balance;margin:18px 0 12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.arabtrix-site .arabtrix-feature-label {display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:0;border-radius:7px;background:#ffc10713;color:#ffe39a;font-size:11px}
.arabtrix-feature-label svg {width:15px;height:15px}
.arabtrix-hero-facts {display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}
.arabtrix-hero-facts span {color:#d2d8e2;font-size:12px;padding:3px 10px;border:0;border-radius:999px;background:#ffffff09}
.arabtrix-site .arabtrix-hero p {font-size:14px;line-height:1.95;color:#bdc6d3;max-width:610px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:24px}
.arabtrix-site .arabtrix-feature-poster {position:relative;display:block;justify-self:center;width:100%;aspect-ratio:2/3;overflow:hidden;border:0;border-radius:16px;box-shadow:0 24px 55px #0008;transform:rotate(-4deg);color:#fff;background:#171c29}
.arabtrix-feature-poster img {display:block;width:100%;height:100%;object-fit:cover}
.arabtrix-feature-poster>span {position:absolute;bottom:0;inset-inline:0;padding:28px 10px 15px;background:linear-gradient(transparent,#000d);display:flex;gap:8px;align-items:center;justify-content:center;font-size:12px}
.arabtrix-site .arabtrix-hero-controls {bottom:22px;left:32px;gap:10px;padding:5px;border:0;background:#0a101b90;border-radius:999px}
.arabtrix-site .arabtrix-hero-controls button {width:38px;height:38px;min-width:38px;background:#ffffff0c}
.arabtrix-hero-controls button svg {width:24px;height:24px}
.arabtrix-site .arabtrix-browse-tiles {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:28px 0 38px;padding:0}
.arabtrix-site .arabtrix-browse-tiles>a {position:relative;display:flex;align-items:center;gap:16px;min-width:0;min-height:105px;padding:20px;border:0;border-radius:16px;background:linear-gradient(120deg,#171d2a,#121721);white-space:normal;text-decoration:none;box-shadow:inset 0 1px #ffffff04}
.arabtrix-site .arabtrix-browse-tiles>a:nth-child(3n+2) {background:linear-gradient(120deg,#241b35,#161521)}
.arabtrix-site .arabtrix-browse-tiles>a:nth-child(3n) {background:linear-gradient(120deg,#252219,#171821)}
.arabtrix-browse-icon,.arabtrix-shelf-icon {display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:13px;color:#ffd66d;background:#ffd66d12;border:0}
.arabtrix-browse-tiles>a:nth-child(3n+2) .arabtrix-browse-icon {color:#c1a0ff;background:#a775ff15;border-color:#a775ff30}
.arabtrix-browse-icon svg {width:24px;height:24px}
.arabtrix-browse-tiles strong {display:block;font-size:16px;color:var(--arabtrix-text);font-weight:800}
.arabtrix-browse-tiles small {display:block;font-size:11px;color:var(--arabtrix-muted);margin-top:5px;line-height:1.7}
.arabtrix-browse-arrow {margin-inline-start:auto;color:var(--arabtrix-muted)}
.arabtrix-browse-arrow svg {width:18px;height:18px}
.arabtrix-site section.arabtrix-home-shelf {padding:0 20px 20px;border:0;border-radius:12px;background:var(--arabtrix-panel);margin-block:24px}
.arabtrix-home-shelf .arabtrix-section-head {justify-content:flex-start;gap:12px;border-bottom:0;border-radius:11px 11px 0 0;background:#ffffff03;padding:14px 20px;margin:0 -20px 20px;min-height:74px}
.arabtrix-home-shelf .arabtrix-section-head>div {min-width:0}
.arabtrix-home-shelf .arabtrix-section-head .arabtrix-more {margin-inline-start:auto}
.arabtrix-site .arabtrix-home-shelf h2 {font-size:20px;line-height:1.5;margin:0}
.arabtrix-home-shelf .arabtrix-section-head .arabtrix-eyebrow {display:none}
.arabtrix-home-shelf .arabtrix-shelf-icon {width:36px;height:36px;border-radius:8px}
.arabtrix-home-shelf .arabtrix-shelf-icon svg {width:20px;height:20px}
.arabtrix-site .arabtrix-more {padding:9px 14px;border:0;border-radius:9px;background:var(--arabtrix-panel);font-size:12px}
/* Preserve the original poster-and-title cards, without an outer frame. */
.arabtrix-site .arabtrix-card-art {border:0}
.arabtrix-site .arabtrix-latest-episode {background:#171d29;border:0;border-radius:14px;padding:10px;gap:14px}
.arabtrix-site .arabtrix-latest-episode .arabtrix-episode-art {border-radius:8px}
html[data-arabtrix-mode=light] .arabtrix-site :is(.arabtrix-latest-episode,.arabtrix-home-shelf) {background:var(--arabtrix-panel);border-color:#211a3814;box-shadow:0 6px 22px #32205008}
html[data-arabtrix-mode=light] .arabtrix-site .arabtrix-browse-tiles>a {background:linear-gradient(120deg,#fff,#f4f1fb);border-color:#211a3818}
html[data-arabtrix-mode=light] .arabtrix-browse-icon,html[data-arabtrix-mode=light] .arabtrix-shelf-icon {color:#775615;background:#a77a1510;border-color:#a77a1525}
@media(max-width:1100px) {
  .arabtrix-site .arabtrix-hero-slide {grid-template-columns:minmax(0,1fr) 190px;gap:30px;padding-inline:30px}
  .arabtrix-site section.arabtrix-home-shelf {padding:0 20px 20px}
}
@media(max-width:700px) {
  .arabtrix-site .arabtrix-hero {border-radius:18px}
  .arabtrix-site .arabtrix-hero>h1 {inset-inline-start:22px;top:20px}
  .arabtrix-site .arabtrix-hero-slide {min-height:0;grid-template-columns:minmax(0,1fr) 92px;gap:18px;padding:65px 22px 90px;align-items:start}
  .arabtrix-site .arabtrix-hero-slide .arabtrix-hero-copy {display:contents}
  .arabtrix-feature-label {grid-column:1}
  .arabtrix-site .arabtrix-feature-poster {grid-column:2;grid-row:1/3;transform:rotate(-3deg);margin-top:6px;border-radius:10px}
  .arabtrix-feature-poster>span {display:none}
  .arabtrix-site .arabtrix-hero-slide h2 {grid-column:1;font-size:23px;line-height:1.7;margin:0;-webkit-line-clamp:3}
  .arabtrix-hero-facts {grid-column:1/-1;margin:0;gap:6px}
  .arabtrix-site .arabtrix-hero p {grid-column:1/-1;font-size:12px;margin:0;-webkit-line-clamp:2}
  .arabtrix-site .arabtrix-hero .arabtrix-actions {grid-column:1/-1;gap:8px;margin:0}
  .arabtrix-site .arabtrix-hero .arabtrix-actions a {font-size:12px;padding:11px;min-height:44px;flex:1;justify-content:center}
  .arabtrix-site .arabtrix-feature-label {font-size:9px;padding:5px 8px;gap:5px;width:fit-content}
  .arabtrix-site .arabtrix-hero-controls {bottom:16px;left:20px}
  .arabtrix-site .arabtrix-browse-tiles {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0 26px}
  .arabtrix-site .arabtrix-browse-tiles>a {display:grid;grid-template-columns:34px minmax(0,1fr);padding:14px 12px;gap:10px;min-height:100px;align-items:center}
  .arabtrix-browse-icon {width:34px;height:34px;border-radius:9px}
  .arabtrix-browse-icon svg {width:18px;height:18px}
  .arabtrix-browse-tiles strong {font-size:13px}
  .arabtrix-browse-tiles small {font-size:9px}
  .arabtrix-browse-arrow {display:none}
  .arabtrix-site section.arabtrix-home-shelf {padding:0 12px 14px;border-radius:12px;margin-block:20px}
  .arabtrix-shelf-icon {width:36px;height:36px;border-radius:10px}
  .arabtrix-shelf-icon svg {width:19px;height:19px}
  .arabtrix-home-shelf .arabtrix-section-head {gap:8px;padding:12px;margin:0 -12px 14px;min-height:68px}
  .arabtrix-site .arabtrix-home-shelf h2 {font-size:16px}
  .arabtrix-home-shelf .arabtrix-shelf-icon {width:28px;height:32px;background:none;border:0}
  .arabtrix-home-shelf .arabtrix-section-head .arabtrix-more {min-height:44px;padding-inline:8px}
  .arabtrix-home-shelf .arabtrix-eyebrow {font-size:9px}
  .arabtrix-site .arabtrix-more {padding:7px 9px;font-size:10px;gap:5px}
  .arabtrix-site .arabtrix-home-shelf .arabtrix-grid {gap:14px 10px}
}

/* Overlapping grid cells reserve the tallest slide, so headings never move the page. */
.arabtrix-site .arabtrix-hero {display:grid}
.arabtrix-site .arabtrix-hero-slide {grid-area:1/1;min-width:0;opacity:1;visibility:visible;transition:opacity 260ms var(--arabtrix-ease-out),visibility 0s}
.arabtrix-site .arabtrix-hero-slide[hidden] {display:grid!important;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 260ms var(--arabtrix-ease-out),visibility 0s 260ms}
.arabtrix-site .arabtrix-hero-slide .arabtrix-hero-copy {opacity:1;transform:none;transition:opacity 220ms var(--arabtrix-ease-out),transform 260ms var(--arabtrix-ease-out)}
.arabtrix-site .arabtrix-hero-slide[hidden] .arabtrix-hero-copy {opacity:0;transform:translateY(12px)}
.arabtrix-site .arabtrix-feature-poster {opacity:1;transition:opacity 220ms var(--arabtrix-ease-out),transform 280ms var(--arabtrix-ease-out)}
.arabtrix-site .arabtrix-hero-slide[hidden] .arabtrix-feature-poster {opacity:0;transform:translateX(-14px) rotate(-4deg) scale(.96)}
@media(max-width:700px) {
  .arabtrix-site .arabtrix-hero-slide[hidden] .arabtrix-feature-poster {transform:translateX(-10px) rotate(-3deg) scale(.96)}
}
@media(prefers-reduced-motion:reduce) {
  .arabtrix-site .arabtrix-hero-slide,.arabtrix-site .arabtrix-hero-slide[hidden] {transition:opacity 120ms ease,visibility 0s!important}
  .arabtrix-site .arabtrix-hero-slide[hidden] .arabtrix-hero-copy {transform:none}
  .arabtrix-site .arabtrix-feature-poster {transition:opacity 120ms ease!important}
  .arabtrix-site .arabtrix-hero-slide[hidden] .arabtrix-feature-poster {transform:rotate(-4deg)}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce) {
  .arabtrix-site .arabtrix-hero-slide[hidden] .arabtrix-feature-poster {transform:rotate(-3deg)}
}
html[data-arabtrix-input=keyboard] .arabtrix-site :is(.arabtrix-hero-slide,.arabtrix-feature-poster) {transition:none!important}

/* Controls have an outline; the content surfaces around them remain borderless. */
.arabtrix-site :is(.arabtrix-button,a.Button,.arabtrix-more,.arabtrix-platform-links a,.arabtrix-active-filters a,.arabtrix-season-links a,.arabtrix-pagination li>*) {
  border:1px solid var(--arabtrix-line);
  border-radius:10px;
  min-height:44px;
  text-decoration:none;
}
.arabtrix-site .arabtrix-button.arabtrix-primary {border-color:var(--arabtrix-gold)}
.arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles) {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  min-width:0;
  max-width:100%;
}
.arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles)>a {
  flex:0 1 auto;
  min-width:0;
  max-width:100%;
  min-height:46px;
  justify-content:center;
  padding:11px 20px;
  border:1px solid var(--arabtrix-line);
  border-radius:10px;
  background:var(--arabtrix-panel);
  color:var(--arabtrix-text);
  line-height:1.5;
  white-space:normal;
  overflow-wrap:anywhere;
  text-align:center;
  text-decoration:none;
}
.arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles)>a[aria-current=page] {
  border-color:var(--arabtrix-gold);
  background:color-mix(in srgb,var(--arabtrix-gold) 12%,var(--arabtrix-panel));
  color:var(--arabtrix-gold);
}
.arabtrix-site :is(.arabtrix-discover:not(.arabtrix-browse-tiles)>a,.arabtrix-more,.arabtrix-platform-links a,.arabtrix-active-filters a,.arabtrix-season-links a,.arabtrix-pagination a):focus-visible {
  outline:2px solid var(--arabtrix-gold);
  outline-offset:3px;
}
@media(hover:hover) and (pointer:fine) {
  .arabtrix-site :is(.arabtrix-discover:not(.arabtrix-browse-tiles)>a,.arabtrix-more,.arabtrix-platform-links a,.arabtrix-active-filters a,.arabtrix-season-links a,.arabtrix-pagination a):hover {
    border-color:var(--arabtrix-gold);
    color:var(--arabtrix-gold);
  }
}
@media(max-width:700px) {
  .arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles) {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles)>a {width:100%;padding:10px 6px;font-size:12px}
}
@media(max-width:360px) {
  .arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles) {grid-template-columns:repeat(2,minmax(0,1fr))}
  .arabtrix-site .arabtrix-discover:not(.arabtrix-browse-tiles)>a:last-child {grid-column:1/-1}
}
