/* Homepage content shares the portfolio's glass surfaces and motion system. */
.hero-copy h1 { margin-block-end: .8rem; }
.hero-copy h1 > .role {
  display: block;
  margin-block-start: .95rem;
  font: 700 clamp(.96rem, 1.55vw, 1.32rem)/1.3 var(--sans);
  letter-spacing: normal;
  text-transform: none;
}
.hero-copy .hero-statement { color: var(--ink); font-weight: 700; text-wrap: pretty; }
.hero-copy .intro,
[lang="ar"] .hero-copy .intro {
  max-width: 44ch;
  margin-block-start: .5rem;
  font-size: clamp(.9rem, 1.15vw, 1.04rem);
  text-wrap: pretty;
}
.hero-paths {
  grid-column: 1 / -1;
  justify-self: center;
  inline-size: min(100%, 33rem);
  margin-block-start: clamp(1.1rem, 3vw, 2.5rem);
}
.hero-stage:has(.hero-paths) .hero-index { grid-area: 1 / 2; }
.hero-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.65rem, 1.6vw, 1.15rem);
}
.hero-actions .audience-button {
  position: relative;
  min-height: clamp(3.5rem, 5vw, 4.25rem);
  padding: .55rem clamp(.6rem, 1.5vw, 1.3rem);
  border-color: var(--audience-rim);
  background:
    radial-gradient(ellipse at 23% -22%, #fff7, transparent 69%),
    linear-gradient(155deg, var(--audience-fill), var(--audience-base));
  font-size: clamp(.9rem, 1.6vw, 1.2rem);
  line-height: 1.3;
  text-align: center;
  box-shadow: inset 0 1px 1px #fff8, inset 0 -2px 3px #0005, 0 4px 15px #0005;
  --hover-border: var(--audience-rim);
  --hover-glow: var(--audience-glow);
}
.audience-button[data-audience-path="brands"] {
  --audience-rim: #ff9a8c;
  --audience-fill: #9c403a;
  --audience-base: #38191d;
  --audience-glow: #ff695a8f;
}
.audience-button[data-audience-path="creators"] {
  --audience-rim: #a0eedb;
  --audience-fill: #2d625a;
  --audience-base: #142b2d;
  --audience-glow: #79e8d47a;
}
.audience-button::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: 0 0 24px 3px var(--audience-glow);
  opacity: .53;
}
@media (prefers-reduced-motion: no-preference) {
  .audience-button::after { animation: audience-breathe 4s ease-in-out infinite; }
  .audience-button[data-audience-path="creators"]::after { animation-delay: -2s; }
  @keyframes audience-breathe {
    0%, 100% { opacity: .33; transform: scale(.98); }
    50% { opacity: .86; transform: scale(1.03); }
  }
}
.hero-aux, .detail-course-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--control-gap);
}
.hero-aux { justify-content: center; margin-block-start: clamp(.8rem, 1.5vw, 1.1rem); }
.hero-aux .text-link { min-height: 44px; padding-inline: .75rem; font-size: .83rem; }
.detail-course-links { margin-block-start: 1rem; }
@media (max-width: 420px) {
  .hero-stage:has(.hero-paths) .portrait { width: 89%; margin-top: 22px; }
}
@media (max-width: 360px) {
  .hero-stage:has(.hero-paths) .hero-copy h1 { font-size: 3.6rem; }
  [lang="ar"] .hero-stage:has(.hero-paths) .hero-copy h1 { font-size: 3.35rem; }
}


.editorial-heading,
[lang="ar"] .editorial-heading {
  max-inline-size: 22ch;
  font-size: clamp(2.45rem, 4.65vw, 4.9rem);
  text-wrap: balance;
}
.editorial-intro { max-width: 64ch; margin-block-start: .85rem; color: var(--muted); text-wrap: pretty; }
.editorial-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--panel-gap);
  list-style: none;
  margin: clamp(1.5rem, 3vw, 2.3rem) 0 0;
  padding: 0;
}
.editorial-grid.editorial-sequence { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editorial-card, .editorial-question {
  border: 1px solid var(--glass-edge);
  border-radius: 1.05rem;
  background-image: var(--glass-surface);
  box-shadow: var(--glass-shadow);
}
.editorial-card { padding: clamp(1.15rem, 2.3vw, 1.9rem); }
.editorial-card h3, .editorial-ai h3, .editorial-question h3 {
  font-size: clamp(1.05rem, 1.45vw, 1.35rem);
  line-height: 1.3;
  text-wrap: pretty;
}
.editorial-card p, .editorial-ai p, .editorial-question p { margin-block-start: .65rem; color: var(--muted); text-wrap: pretty; }
.editorial-icon {
  display: block;
  flex: none;
  inline-size: clamp(2rem, 3.2vw, 2.65rem);
  block-size: auto;
  color: #fff;
}
.editorial-card > .editorial-icon, .editorial-card-meta { margin-block-end: .85rem; }
.editorial-card-meta { display: flex; align-items: center; justify-content: space-between; gap: .7rem; }
.editorial-step { color: var(--contrast); }
.editorial-cta { margin-block-start: clamp(1.35rem, 2.5vw, 1.8rem); }
.editorial-service-links { display: flex; flex-wrap: wrap; gap: var(--control-gap); margin-block-start: var(--control-gap); }
.editorial-ai {
  margin-block-start: clamp(1.5rem, 3vw, 2rem);
  padding-inline-start: clamp(.85rem, 2vw, 1.5rem);
  border-inline-start: 1px solid var(--contrast);
}
.editorial-ai p { max-inline-size: 70ch; }
.about-intro > p, .contact-copy { text-wrap: pretty; }
.contact-field textarea::placeholder { color: var(--muted); }

.client-card:has(.client-caption) { grid-template-rows: minmax(0, 1fr) auto; gap: .55rem; }
.client-card:has(.client-caption) .client-logo { height: 100%; max-height: 135px; }
.client-caption {
  max-width: 100%;
  color: #25191a;
  font-weight: 750;
  font-size: clamp(.67rem, 1vw, .92rem);
  line-height: 1.3;
  text-align: center;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.teaching-stats .stat { justify-content: flex-end; }
.teaching-stats .stat.scroll-layer { --layer-depth: 0; }
.course-mini-heading { margin-block: .9rem .25rem; color: var(--contrast); font-size: 1rem; }
.course-module h5 { margin: .68rem 0 0; font-size: clamp(1rem, 1.6vw, 1.28rem); line-height: 1.25; }
.course-cohort > p { max-width: 46ch; margin-block: 0 .65rem; color: var(--muted); }

.editorial-faq { display: grid; gap: var(--control-gap); max-inline-size: 52rem; margin-block-start: 1.5rem; }
.editorial-question summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 48px;
  padding: .8rem clamp(1rem, 2.5vw, 1.45rem);
  border-radius: inherit;
  cursor: pointer;
  list-style: none;
}
.editorial-question summary::-webkit-details-marker { display: none; }
.editorial-question summary span { color: var(--contrast); font-size: 1.25rem; line-height: 1; }
.editorial-question[open] summary span { transform: rotate(45deg); }
.editorial-question summary:is(:hover, :focus-visible) { background-color: var(--hover-tint, #a8352d3d); }
.editorial-question p { margin: 0; padding: 0 clamp(1rem, 2.5vw, 1.45rem) 1rem; }

.home-footer-bottom { flex-wrap: wrap; align-items: center; gap: 1rem; }
.home-footer-identity { display: grid; gap: .3rem; }
.home-footer-identity strong { color: var(--ink); }
.home-footer-links { flex-wrap: wrap; gap: var(--control-gap); font-size: inherit; }

@media (max-width: 1120px) {
  .home-header { grid-template-columns: minmax(0, 1fr); padding-block: .65rem; }
  .home-header .glass-nav { grid-area: 2 / 1 / 3 / -1; }
}
@media (max-width: 900px) {
  .editorial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .home-header .glass-nav a { padding-inline: clamp(.45rem, 1.65vw, .7rem); }
  .hero-artwork .portrait { margin-top: 34px; }
  .hero-copy h1 > .role { margin-block-start: .65rem; }
}
@media (max-width: 560px) {
  .editorial-grid, .editorial-grid.editorial-sequence { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 400px) {
  [lang="en"] .teaching-stats .stat dd { font-size: min(3.15rem, 13vw); }
}
@media (prefers-reduced-motion: no-preference) {
  .editorial-section.scroll-layer { --layer-depth: .26; }
  .editorial-section .scroll-layer { --layer-depth: 0; }
  .editorial-card.is-revealing:not(:focus-within) { filter: none; }
  .editorial-card.is-revealing:not(:focus-within) > * {
    filter: blur(calc((1 - var(--reveal-progress, 0)) * var(--reveal-blur, 12px)));
  }
  .editorial-question summary:is(:hover, :focus-visible) { scale: 1.01; }

  .editorial-card:nth-child(even) { --icon-delay: -1.25s; }
  .editorial-icon[data-glyph="direction"] { --icon-motion: icon-needle; }
  .editorial-icon[data-glyph="motion"] { --icon-motion: icon-keyframe; }
  .editorial-icon[data-glyph="event"] { --icon-motion: icon-pulse; }
  .editorial-icon[data-glyph="campaign"] { --icon-motion: icon-signal; }
  .editorial-icon[data-glyph="game"] { --icon-motion: icon-pulse; }
  .editorial-icon[data-glyph="brief"] { --icon-motion: icon-scan; }
  .editorial-icon[data-glyph="storyboard"] { --icon-motion: icon-pulse; }
  .editorial-icon[data-glyph="production"] { --icon-motion: icon-clap; --icon-origin: 5px 14px; }
  .editorial-icon[data-glyph="audience"] { --icon-motion: icon-pulse; }

  .editorial-card.scroll-layer:not(.is-revealing) .editorial-icon-motion {
    transform-box: view-box;
    transform-origin: var(--icon-origin, 16px 16px);
    animation: var(--icon-motion) 3.6s ease-in-out var(--icon-delay, 0s) infinite;
  }

  @keyframes icon-needle {
    0%, 100% { transform: rotate(-12deg); }
    50% { transform: rotate(16deg); }
  }
  @keyframes icon-keyframe {
    0%, 100% { transform: translate(-2px, 2px); }
    50% { transform: translate(2px, -2px); }
  }
  @keyframes icon-pulse {
    0%, 100% { opacity: .55; }
    50% { opacity: 1; }
  }
  @keyframes icon-signal {
    0%, 100% { transform: translateX(-1px); opacity: .55; }
    50% { transform: translateX(1px); opacity: 1; }
  }
  @keyframes icon-scan {
    0%, 100% { transform: translate(-1px, 0); }
    50% { transform: translate(1px, -1.5px); }
  }
  @keyframes icon-clap {
    0%, 24%, 100% { transform: rotate(0); }
    48%, 64% { transform: rotate(-14deg); }
    80% { transform: rotate(0); }
  }
}
