/* AYMIA / HIKAYEMIZ V3 — photo-led, left-anchored editorial hero.
 * Scope: ONLY .aymia-story; existing site navigation, panels, /apps untouched.
 * Art direction: provided ATELIER is layout inspiration, NOT a font/image source.
 * Portrait: original photo supplied by the site owner; no face edits.
 * Fonts: inherit existing Inter / Swiss editorial token, NO external fonts.
 */
.aymia-story {
  --story-ink: #050505;
  --story-warm-edge: rgba(123, 70, 55, .17);
  --story-photo-width: clamp(345px, 42vw, 590px);
  background: #050505;
}
.aymia-story .story-first-panel {
  position: relative;
  display: flex;
  isolation: isolate;
  min-height: calc(100svh - 84px);
  min-height: calc(100dvh - 84px);
  padding: 0 clamp(32px, 8vw, 142px);
  align-items: center;
  justify-content: flex-end;
  background: #050505;
}
.aymia-story .story-first-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(ellipse 38% 68% at 26% 50%, var(--story-warm-edge) 0%, transparent 78%),
    #050505;
  pointer-events: none;
}
/* Stage has NO visible rectangular boundary. Its right side becomes black. */
.aymia-story .story-portrait-stage {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: min(67vw, 940px);
  z-index: 0;
  overflow: hidden;
  isolation: isolate;
  background: #050505;
  pointer-events: none;
}
/* Secondary, blurred photographic light falloff joins the black canvas. */
.aymia-story .story-portrait-stage::before {
  content: "";
  position: absolute;
  width: var(--story-photo-width);
  height: 96%;
  left: -4vw;
  top: 2%;
  z-index: 0;
  background: url("/images/hikayemiz-portrait-editorial.webp") center 46% / cover no-repeat;
  filter: blur(29px) brightness(.40) saturate(.85);
  opacity: .54;
  -webkit-mask-image: radial-gradient(ellipse 70% 77% at 28% 48%, #000 18%, transparent 100%);
  mask-image: radial-gradient(ellipse 70% 77% at 28% 48%, #000 18%, transparent 100%);
  pointer-events: none;
}
.aymia-story .story-portrait-image {
  position: absolute;
  left: -4vw;
  top: 50%;
  width: var(--story-photo-width);
  height: min(90%, 830px);
  object-fit: cover;
  object-position: 49% 44%;
  transform: translateY(-50%);
  filter: brightness(.73) saturate(.84) contrast(1.06);
  z-index: 1;
  -webkit-mask-image: radial-gradient(
    ellipse 75% 87% at 25% 50%,
    #000 18%,
    rgba(0,0,0,.97) 37%,
    rgba(0,0,0,.84) 52%,
    rgba(0,0,0,.35) 77%,
    transparent 100%
  );
  mask-image: radial-gradient(
    ellipse 75% 87% at 25% 50%,
    #000 18%,
    rgba(0,0,0,.97) 37%,
    rgba(0,0,0,.84) 52%,
    rgba(0,0,0,.35) 77%,
    transparent 100%
  );
}
.aymia-story .story-portrait-veil {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg,
      rgba(5,5,5,.19) 0%,
      rgba(5,5,5,.02) 24%,
      rgba(5,5,5,.05) 34%,
      rgba(5,5,5,.30) 48%,
      rgba(5,5,5,.75) 62%,
      #050505 86%
    ),
    linear-gradient(180deg,
      #050505 0%,
      #050505 8%,
      rgba(5,5,5,.92) 13%,
      rgba(5,5,5,.38) 22%,
      transparent 34%,
      transparent 69%,
      rgba(5,5,5,.38) 83%,
      #050505 100%
    );
  pointer-events: none;
}
/* The editorial title is on the clean black RIGHT, not on the photograph. */
.aymia-story .story-opening {
  position: relative;
  z-index: 4;
  flex: 0 0 auto;
  width: min(34vw, 470px);
  max-width: 100%;
  margin: 0 0 0 auto;
  padding: 0 0 0 8px;
  color: #f5f1ee;
  text-align: left;
  background: transparent;
}
.aymia-story .story-opening .story-kicker {
  margin-bottom: 23px;
  font-weight: 500;
  font-size: clamp(10px, .78vw, 12px);
  letter-spacing: .31em;
  color: rgba(245,241,238,.67);
}
.aymia-story .story-opening h1 {
  font-family: var(--aymia-editorial-font);
  font-size: clamp(29px, 2.72vw, 42px);
  font-weight: 650;
  line-height: 1.15;
  letter-spacing: -.045em;
  text-wrap: balance;
  margin: 0;
}
.aymia-story .story-opening h1 span { display: block; }
.aymia-story .story-opening .story-hero-subtitle {
  max-width: 36ch;
  margin-top: 25px;
  font-size: clamp(13px, .97vw, 15px);
  font-weight: 400;
  line-height: 1.8;
  color: rgba(246,241,236,.72);
}
.aymia-story .story-side-mark {
  color: rgba(245,241,238,.46);
  letter-spacing: .32em;
}
.aymia-story .story-scroll-cue,
.aymia-story .story-hero-index {
  color: rgba(245,241,238,.53);
}
.aymia-story .story-content {
  background: #050505;
}
/* Keep the light pen outside the portrait; no panel-wide mouse glow. */
.aymia-story .story-portrait-stage[data-trail-block] { cursor: default; }
@media (max-width: 1180px) {
  .aymia-story { --story-photo-width: clamp(340px, 47vw, 555px); }
  .aymia-story .story-portrait-stage { width: 62vw; }
  .aymia-story .story-opening { width: min(34vw, 390px); }
}
@media (max-width: 900px) {
  .aymia-story { --story-photo-width: clamp(315px, 47vw, 445px); }
  .aymia-story .story-first-panel { padding: 0 7%; }
  .aymia-story .story-portrait-stage { width: 64vw; }
  .aymia-story .story-portrait-image,
  .aymia-story .story-portrait-stage::before { left: -7vw; }
  .aymia-story .story-opening {
    width: min(41vw, 370px);
    padding-left: 0;
  }
  .aymia-story .story-opening h1 { font-size: clamp(27px, 3.45vw, 34px); }
}
@media (max-width: 600px) {
  .aymia-story { --story-photo-width: clamp(280px, 87vw, 425px); }
  .aymia-story .story-first-panel {
    min-height: calc(100svh - 106px);
    min-height: calc(100dvh - 106px);
    height: auto;
    padding: 0 6%;
    align-items: flex-end;
  }
  .aymia-story .story-portrait-stage {
    width: 100%;
    top: 0;
    bottom: 8%;
  }
  .aymia-story .story-portrait-image {
    width: var(--story-photo-width);
    height: 86%;
    left: -11vw;
    top: 42%;
    object-position: 43% 38%;
    filter: brightness(.65) saturate(.85) contrast(1.07);
  }
  .aymia-story .story-portrait-stage::before {
    width: var(--story-photo-width);
    height: 88%;
    left: -11vw;
  }
  .aymia-story .story-portrait-veil {
    background:
      linear-gradient(90deg, transparent 0%, rgba(5,5,5,.15) 51%, #050505 100%),
      linear-gradient(180deg, #050505 0%, transparent 16%, transparent 43%, #050505 88%);
  }
  .aymia-story .story-opening {
    width: 86%;
    max-width: 335px;
    padding: 0;
    margin: 0 0 clamp(74px, 15vh, 130px) auto;
    text-align: right;
  }
  .aymia-story .story-opening h1 {
    font-size: clamp(27px, 7.3vw, 38px);
    font-weight: 650;
  }
  .aymia-story .story-opening .story-kicker {
    margin-bottom: 15px;
  }
  .aymia-story .story-opening .story-hero-subtitle {
    max-width: 31ch;
    margin: 17px 0 0 auto;
    font-size: 12px;
    line-height: 1.7;
  }
}
/* Motion is optional. The static photo remains visible with reduced motion. */
@media (prefers-reduced-motion: reduce) {
  .aymia-story .story-portrait-image { transform: translateY(-50%); }
  .aymia-story .story-trail-canvas { display: none; }
}

/* HIKAYEMIZ V4 / NUMBERLESS EDITORIAL — ONLY .aymia-story.
   The existing portrait, masks, black background and locked Inter family stay unchanged. */
.aymia-story .story-opening h1 {
  font-family: var(--aymia-editorial-font);
  font-weight: 650;
  letter-spacing: -.046em;
  background: linear-gradient(165deg, #fffaf7 0%, #f4eeeb 53%, #e8dcd5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 1px 2px rgba(0,0,0,.36), 0 5px 26px rgba(245,221,207,.075);
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.25));
}
.aymia-story .story-opening .story-kicker {
  font-weight: 500;
  letter-spacing: .34em;
  color: rgba(240,222,215,.79);
  text-shadow: 0 1px 6px rgba(0,0,0,.32);
}
.aymia-story .story-opening .story-hero-subtitle {
  color: rgba(246,240,236,.8);
  text-shadow: 0 2px 12px rgba(0,0,0,.36);
}
/* Remove the empty number column from the ten-brand editorial index. */
.aymia-story .story-brand {
  grid-template-columns: minmax(195px,.82fr) minmax(290px,1.16fr);
  column-gap: clamp(24px,4.5vw,68px);
}
.aymia-story .story-brand-copy { grid-column: 2; }
.aymia-story .story-trail-canvas { display: none !important; }
@media (max-width: 900px) {
  .aymia-story .story-brand { grid-template-columns: minmax(0,1fr); }
  .aymia-story .story-brand-copy { grid-column: 1; }
}
@media (max-width: 600px) {
  .aymia-story .story-opening h1 { letter-spacing: -.039em; }
  .aymia-story .story-brand { grid-template-columns: 1fr; }
  .aymia-story .story-brand-copy { grid-column: 1; }
}