.project-story { --story-purple: #6556ef; --story-night: #181821; }
.story-video-active .orbi-launcher { visibility: hidden; }
.story-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; padding-top: 30px; color: var(--muted); font-size: .8rem; }
.story-breadcrumbs a { text-decoration: none; }
.story-breadcrumbs a:hover { color: var(--accent-dark); }
.story-hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: end; gap: 50px; padding-block: 45px 34px; }
.story-hero > div { min-width: 0; overflow-wrap: anywhere; }
.story-hero h1 { margin: 18px 0 0; max-width: 820px; font-size: clamp(2.5rem, 5.3vw, 4.4rem); font-weight: 500; line-height: 1.08; color: var(--story-purple); }
.story-client-title { display: block; font-size: .53em; color: var(--ink); margin-bottom: 15px; letter-spacing: -.025em; }
.story-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.story-tags span { border: 1px solid var(--line); border-radius: 999px; padding: 6px 12px; background: white; font-size: .76rem; }
.story-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; }
.story-hero .lead { font-size: 1rem; }
.story-voice-opening { display: grid; grid-template-columns: .9fr 1.1fr; align-items: stretch; background: var(--story-night); border-radius: 25px; overflow: hidden; margin: 12px 0 32px; color: white; }
.story-review-copy { padding: clamp(26px, 3.4vw, 46px); align-self: center; min-width: 0; }
.story-review-copy .eyebrow { color: #c7bfff; }
.story-review-copy .eyebrow::before { background: #a499ff; }
.story-review-copy h2, .story-review-copy blockquote { margin: 18px 0 22px; font-family: var(--display); font-size: clamp(1.7rem, 2.5vw, 2.6rem); line-height: 1.22; letter-spacing: -.035em; font-weight: 500; }
.story-review-copy blockquote::before { content: '“'; color: #a499ff; }
.story-review-copy blockquote::after { content: '”'; color: #a499ff; }
.story-review-copy blockquote strong { font-weight: 700; }
.story-review-copy p { color: #c3c3d2; }
.story-review-visual { position: relative; align-self: center; min-width: 0; background: #101015; }
.story-media { margin: 24px 0 0; min-width: 0; }
.story-media img { width: 100%; height: auto; border-radius: 17px; }
.story-image-link { display: block; }
.story-media figcaption { margin: 10px 0 0; color: var(--muted); font-size: .83rem; line-height: 1.55; }
.story-media--review { margin: 0; }
.story-media--review figcaption { padding: 12px 20px 18px; margin: 0; color: #c3c3d2; }
.story-player { position: relative; background: #101015; border-radius: 16px; overflow: hidden; }
.story-media--review .story-player { border-radius: 0; }
.story-player video { width: 100%; height: auto; max-height: 600px; aspect-ratio: 16 / 10; object-fit: contain; display: block; background: #101015; }
.story-voice-opening .story-player video { min-height: 330px; }
.story-player__play { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%); width: 72px; height: 72px; border: 1px solid #ffffffb3; border-radius: 50%; background: #fffffff0; color: #181821; display: grid; place-items: center; box-shadow: 0 8px 35px #0003; transition: background .2s, scale .2s; }
.story-player__play:hover { background: white; scale: 1.06; }
.story-player__play span { font-size: 24px; margin-left: 4px; }
.story-player__play[hidden] { display: none; }
.story-player__status { margin: 0; position: absolute; left: 16px; right: 16px; bottom: 45px; font-size: .8rem; background: #181821dd; color: white; border-radius: 7px; }
.story-player__status:not(:empty) { padding: 9px 12px; }
.story-duration { position: absolute; top: 15px; right: 16px; background: #17171fd9; color: white; border: 1px solid #ffffff26; padding: 4px 8px; font-size: .72rem; border-radius: 7px; pointer-events: none; }
.story-reviewer { display: flex; align-items: center; gap: 12px; margin-top: 25px; }
.story-reviewer__avatar { display: grid; place-items: center; height: 43px; width: 43px; flex: none; border-radius: 50%; background: #ebe7ff; color: #5142bc; font: 500 1.2rem var(--display); }
.story-reviewer strong, .story-reviewer div > span { display: block; }
.story-reviewer strong { font-size: .87rem; }
.story-reviewer div > span { margin-top: 3px; font-size: .77rem; color: #c3c3d2; }
.story-transcript { margin-top: 25px; font-size: .85rem; }
.story-transcript summary { cursor: pointer; color: #d6d0ff; font-weight: 600; }
.story-transcript .story-prose { padding-top: 15px; max-height: 360px; overflow-y: auto; }
.story-hero-media { padding: 18px 22px; border-radius: 23px; background: #ece9e3; margin-bottom: 43px; }
.story-hero-media .story-media { margin: 0; }
.story-hero-media img { max-height: 450px; object-fit: contain; object-position: top; background: #fff; }
.story-body { display: grid; grid-template-columns: 175px minmax(0, 1fr); gap: 60px; padding-block: 20px 70px; }
.story-toc { align-self: start; position: sticky; top: 110px; font-size: .82rem; }
.story-toc > p { font-weight: 700; color: var(--ink); margin: 0 0 15px; }
.story-toc nav { display: flex; flex-direction: column; gap: 3px; border-left: 1px solid var(--line); }
.story-toc a { text-decoration: none; color: var(--muted); padding: 9px 15px; line-height: 1.45; }
.story-toc a:hover { color: var(--accent-dark); background: #ece9ff; }
.story-content { min-width: 0; }
.story-section { padding-bottom: 40px; scroll-margin-top: 110px; }
.story-section + .story-section { border-top: 1px solid var(--line); padding-top: 38px; }
.story-section h2 { font-size: clamp(1.8rem, 3vw, 2.7rem); font-weight: 500; margin: 14px 0 22px; }
.story-prose { overflow-wrap: anywhere; font-size: 1rem; line-height: 1.8; }
.story-prose p:last-child { margin-bottom: 0; }
.story-prose ul, .story-prose ol { padding-left: 24px; color: var(--muted); margin-block: 18px; }
.story-prose li { padding-left: 5px; margin-block: 8px; }
.story-prose strong { color: var(--ink); }
.story-review-copy .story-prose strong, .story-review-copy .story-prose li { color: #e6e6ef; }
.story-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.story-gallery .story-media { margin: 0; }
.story-gallery .story-player video { min-height: 0; }
.story-review-card { background: var(--story-night); color: white; border-radius: 23px; overflow: hidden; margin-top: 25px; }
.story-review-card .story-review-copy h2, .story-review-card .story-review-copy blockquote { font-size: 1.65rem; }
.story-end-cta { padding: 50px 0; background: #ece9ff; }
.story-end-cta > .container { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.story-end-cta h2 { margin: 13px 0; font-size: clamp(1.8rem, 3vw, 2.5rem); max-width: 650px; font-weight: 500; }
.story-end-cta p { margin: 0; }
.story-preview-notice { background: #ede8d3; color: #65561f; }
.story-preview-notice > .container { display: flex; gap: 20px; justify-content: space-between; flex-wrap: wrap; padding-block: 13px; font-size: .8rem; }
.story-preview-notice a { font-weight: 700; }
.home-client-voices { background: #eeedf7; }
.home-client-reviews { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.home-client-review { --story-night: #181821; display: flex; flex-direction: column-reverse; justify-content: flex-end; border-radius: 23px; overflow: hidden; background: var(--story-night); color: #fff; }
.home-client-review .story-review-copy { width: 100%; padding: 27px 30px 30px; }
.home-client-review .story-review-copy blockquote, .home-client-review .story-review-copy h2 { font-size: 1.55rem; }
.home-client-review .story-review-visual { width: 100%; }
.home-client-review .text-link { margin-top: 24px; font-size: .86rem; }
.home-client-review .story-player video { aspect-ratio: 16 / 9; max-height: 420px; }
.home-client-reviews--single { display: block; }
.home-client-reviews--single .home-client-review { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; }
.home-client-reviews--single .story-review-copy { padding: clamp(28px, 4vw, 50px); }
.home-client-reviews--single .story-review-copy blockquote, .home-client-reviews--single .story-review-copy h2 { font-size: clamp(1.8rem, 2.5vw, 2.5rem); }
.story-card-image { padding: 0; min-height: 220px; display: grid; place-items: center; background: #ece9ff; }
.project-card--story .story-card-image img { width: 100%; aspect-ratio: 1.65; height: auto; object-fit: cover; object-position: top; }
.project-card--story h2 a { text-decoration: none; }
.story-card-monogram { font: 500 6rem var(--display); color: #6556ef; }
@media (max-width: 900px) {
  .story-hero { grid-template-columns: minmax(0, 1fr); gap: 25px; }
  .story-hero h1 { max-width: 800px; }
  .story-body { grid-template-columns: 140px minmax(0, 1fr); gap: 30px; }
  .story-voice-opening { grid-template-columns: 1fr 1fr; }
  .story-voice-opening .story-player video { min-height: 250px; }
  .story-review-copy { padding: 26px; }
  .story-gallery { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .story-breadcrumbs { padding-top: 22px; font-size: .73rem; }
  .story-hero { padding-block: 28px; }
  .story-hero h1 { font-size: clamp(2.3rem, 9vw, 3.5rem); }
  .story-voice-opening { display: flex; flex-direction: column-reverse; }
  .story-review-visual { width: 100%; }
  .story-voice-opening .story-player video { min-height: 0; aspect-ratio: 16 / 10; }
  .story-review-copy h2, .story-review-copy blockquote { font-size: 1.85rem; }
  .story-hero-media { padding: 12px; margin-bottom: 25px; }
  .story-body { display: block; padding-block: 14px 25px; }
  .story-toc { position: static; margin-bottom: 35px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
  .story-toc nav { flex-direction: row; flex-wrap: wrap; border: 0; gap: 8px; }
  .story-toc a { background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; font-size: .75rem; }
  .story-section { padding-bottom: 30px; }
  .story-section + .story-section { padding-top: 30px; }
  .story-prose { font-size: .95rem; }
  .story-end-cta > .container { align-items: start; flex-direction: column; }
  .home-client-reviews { grid-template-columns: 1fr; }
  .home-client-reviews--single .home-client-review { display: flex; }
  .home-client-reviews--single .story-review-copy { padding: 26px; }
  .home-client-review .story-review-copy { padding: 24px; }
  .story-preview-notice > .container { gap: 6px; }
  .story-preview-notice span { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .story-player__play { transition: none; } }