/* Editorial visuals for the homepage; application screens keep their own styles. */
#productHome .hero-intro { width: 680px; max-width: 56%; margin-top: 34px; color: #d4d2cb; font-size: 18px; line-height: 1.9; }
#productHome .hero-intro p { margin: 0; text-wrap: pretty; }
#productHome .hero-intro p + p { margin-top: 16px; }
#productHome .hero-personal-contact { display: block; width: fit-content; max-width: 100%; margin-top: 8px; color: #c7c4bc; font-size: 17px; line-height: 1.8; }
#productHome .hero-personal-contact strong { color: var(--orange-2); font-weight: 700; white-space: nowrap; }
#productHome .hero-personal-contact:focus-visible { outline: 2px solid var(--orange); outline-offset: 5px; }
#productHome .intro-service { white-space: nowrap; }
#productHome .hero-inline-brand { display: inline-flex; align-items: center; gap: 7px; margin: 0 4px; color: var(--ink); font-weight: 800; vertical-align: baseline; white-space: nowrap; }
#productHome .hero-inline-brand > span { display: inline-grid; place-items: center; width: 23px; height: 23px; color: #171713; background: var(--orange); border-radius: 5px; font-size: 15px; line-height: 1; font-weight: 650; }
#productHome .hero-principle { margin-top: 30px; }
#productHome.home-motion-ready .hero-content > .hero-intro { animation: home-hero-enter 850ms cubic-bezier(.22,1,.36,1) 290ms both; }

#productHome .resource-heading-layout { position: relative; isolation: isolate; display: flex; align-items: center; min-height: 360px; margin-bottom: 44px; overflow: hidden; }
#productHome .resource-heading-layout .home-section-heading { position: relative; z-index: 2; margin-bottom: 0; max-width: 46%; }
#productHome .resource-scene { position: absolute; z-index: 0; top: 0; right: 0; width: 85%; height: 100%; margin: 0; overflow: hidden; border-radius: 0; pointer-events: none; -webkit-mask-image: linear-gradient(90deg,transparent 0%,#000 35%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 25%,#000 70%,transparent 100%); mask-image: linear-gradient(90deg,transparent 0%,#000 35%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 25%,#000 70%,transparent 100%); -webkit-mask-composite: source-in; mask-composite: intersect; }
#productHome .resource-scene img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 76% 52%; filter: saturate(.72) brightness(.85); animation: editorial-photo-breathe 16s ease-in-out infinite alternate; animation-play-state: paused; }
#productHome .resource-scene::after { position: absolute; inset: 0; content: ""; pointer-events: none; background: linear-gradient(90deg,rgba(0,0,0,.35),transparent 70%); }
#productHome .resource-line { transition: border-color 250ms ease, box-shadow 250ms ease; }
#productHome .speech-ornament { display: none; }

#productHome .speech-feature-visual { display: grid; grid-template-columns: minmax(0,1fr) 56px minmax(0,1fr); align-items: center; gap: 28px; margin-top: 80px; padding: 26px 10px 8px; }
#productHome .feature-slide-stack { position: relative; min-width: 0; padding: 40px 0; align-self: center; }
#productHome .feature-slide-stack img { width: 94%; height: auto; display: block; border-radius: 7px; box-shadow: 0 25px 65px rgba(0,0,0,.35); }
#productHome .feature-slide-back { position: absolute; top: 50%; left: 6%; opacity: .65; transform: translateY(-50%) rotate(5deg); }
#productHome .feature-slide-front { position: relative; top: auto; left: 0; transform: rotate(-3deg); }
#productHome .feature-source-label { position: absolute; bottom: 0; left: 4px; color: #c6c3ba; font-size: 15px; letter-spacing: .04em; }
#productHome .feature-convert-arrow { display: grid; place-items: center; justify-self: center; align-self: center; width: 48px; height: 48px; color: var(--orange-2); font-size: 38px; font-weight: 400; line-height: 1; text-align: center; }
#productHome .feature-script-sheet { position: relative; min-width: 0; overflow: hidden; padding: 30px 32px 24px; background: linear-gradient(135deg,#353530,#242521); border: 1px solid rgba(255,255,255,.15); border-radius: 12px; box-shadow: 0 28px 60px rgba(0,0,0,.22); }
#productHome .feature-script-sheet::after { position: absolute; top: -60%; bottom: -60%; width: 70%; left: -90%; content: ""; pointer-events: none; background: linear-gradient(90deg,transparent,rgba(255,180,100,.045),transparent); transform: rotate(22deg); animation: editorial-sheet-light 9s ease-in-out infinite; animation-play-state: paused; }
#productHome .feature-sheet-heading { display: flex; align-items: center; gap: 12px; padding-bottom: 22px; border-bottom: 1px solid rgba(255,255,255,.1); }
#productHome .feature-sheet-heading strong { color: #f7f4ed; font-size: 20px; }
#productHome .feature-page-mark { width: 28px; height: 31px; display: grid; place-items: center; border: 1px solid rgba(255,154,69,.6); color: var(--orange-2); border-radius: 3px; font-size: 17px; }
#productHome .feature-status-dot { width: 6px; height: 6px; margin-left: auto; background: var(--orange-2); border-radius: 50%; box-shadow: 0 0 15px rgba(255,154,69,.4); }
#productHome .feature-script-block { margin-top: 21px; }
#productHome .feature-script-block > b { color: #c8c5bc; font-size: 14px; font-weight: 650; }
#productHome .feature-text-lines { display: grid; gap: 8px; margin-top: 11px; }
#productHome .feature-text-lines i { display: block; height: 5px; width: 100%; border-radius: 3px; background: rgba(242,235,221,.16); }
#productHome .feature-text-lines i:last-child { width: 76%; }
#productHome .feature-script-block:nth-of-type(3) .feature-text-lines i:last-child { width: 88%; }
#productHome .feature-audio { display: flex; gap: 16px; align-items: center; margin-top: 25px; padding-top: 21px; border-top: 1px solid rgba(255,255,255,.1); color: #d0c9ba; font-size: 14px; }
#productHome .feature-audio-wave, #productHome .coaching-sound-wave { display: inline-flex; height: 28px; gap: 4px; align-items: center; color: var(--orange-2); }
#productHome .feature-audio-wave i, #productHome .coaching-sound-wave i { width: 3px; height: 70%; border-radius: 2px; background: currentColor; animation: editorial-speech-wave 1.8s ease-in-out infinite; animation-play-state: paused; }
#productHome .feature-audio-wave i:nth-child(2n), #productHome .coaching-sound-wave i:nth-child(2n) { height: 100%; animation-delay: -.4s; }
#productHome .feature-audio-wave i:nth-child(3n), #productHome .coaching-sound-wave i:nth-child(3n) { height: 45%; animation-delay: -.8s; }
#productHome .feature-audio-wave i:nth-child(4n), #productHome .coaching-sound-wave i:nth-child(4n) { animation-delay: -1.2s; }
#productHome .story-flow { margin-top: 92px; }
#productHome .story-flow p { max-width: none; text-wrap: balance; }

#productHome .home-project-section { padding: 90px 64px 72px; }
#productHome .project-row-editorial { grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 54px; padding: 68px 0; }
#productHome .project-media { position: relative; min-width: 0; overflow: hidden; border-radius: 10px; }
#productHome .project-cases-preview { height: auto; display: block; overflow: visible; border-radius: 0; align-self: center; }
#productHome .project-cases-preview img { position: static; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; display: block; border-radius: 3px; box-shadow: 0 16px 38px rgba(0,0,0,.14); transform: none; animation: none; }
#productHome .project-case-caption { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 18px; color: #c9c5bb; font-size: 14px; line-height: 1.65; }
#productHome .project-case-caption > span:last-child { color: var(--orange-2); font-size: 23px; }
#productHome .project-editorial-copy { min-width: 0; }
#productHome .project-editorial-copy .project-number { display: block; margin-bottom: 20px; font-size: 14px; letter-spacing: .04em; }
#productHome .project-editorial-copy .project-copy h3 { margin-top: 0; font-size: clamp(30px,3vw,43px); line-height: 1.2; }
#productHome .project-editorial-copy .project-copy p { font-size: 17px; line-height: 1.9; text-wrap: balance; }
#productHome .project-editorial-copy .project-points { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 22px; font-size: 14px; }
#productHome .project-editorial-copy .home-text-link { grid-column: auto; min-width: 0; width: 220px; max-width: 100%; margin-top: 28px; font-size: 16px; }
#productHome .project-coaching-preview { height: 330px; border-radius: 0; -webkit-mask-image: linear-gradient(90deg,transparent 0%,#000 12%,#000 85%,transparent 100%),linear-gradient(180deg,transparent,#000 18%,#000 76%,transparent); mask-image: linear-gradient(90deg,transparent 0%,#000 12%,#000 85%,transparent 100%),linear-gradient(180deg,transparent,#000 18%,#000 76%,transparent); -webkit-mask-composite: source-in; mask-composite: intersect; }
#productHome .project-coaching-preview > img { width: 100%; height: 100%; display: block; object-fit: cover; animation: editorial-photo-breathe 16s ease-in-out infinite alternate; animation-play-state: paused; }
#productHome .project-coaching-preview::after { position: absolute; inset: 0; content: ""; pointer-events: none; background: linear-gradient(0deg,rgba(0,0,0,.3),transparent 45%); }
#productHome .coaching-sound-wave { position: absolute; bottom: 25px; left: 26px; z-index: 1; height: 34px; gap: 5px; }
#productHome .project-service-contact { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; padding-top: 38px; color: #bab7af; font-size: 15px; scroll-margin-top: 120px; }
#productHome .project-service-contact strong { color: #f0e6d5; font-size: 17px; font-weight: 650; letter-spacing: .03em; }
#productHome .contact-divider { color: #77776e; }

#productHome .ambient-in-view .feature-script-sheet::after,
#productHome .ambient-in-view .feature-audio-wave i,
#productHome .ambient-in-view .coaching-sound-wave i,
#productHome .resource-scene.ambient-in-view img,
#productHome .project-media.ambient-in-view img { animation-play-state: running; }
@keyframes editorial-photo-breathe { from { transform: scale(1); } to { transform: scale(1.045); } }
@keyframes editorial-sheet-light { 0%,22% { left: -90%; } 72%,100% { left: 140%; } }
@keyframes editorial-speech-wave { 0%,100% { transform: scaleY(.4); opacity: .65; } 50% { transform: scaleY(1); opacity: 1; } }
@media (hover: hover) {
  #productHome .resource-line:hover { border-color: rgba(255,154,69,.45); box-shadow: 0 22px 55px rgba(0,0,0,.22); }
}
@media (max-width: 1050px) {
  #productHome .hero-intro { width: 620px; max-width: 57%; font-size: 17px; }
  #productHome .resource-heading-layout { min-height: 310px; }
  #productHome .resource-library { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #productHome .speech-feature-visual { gap: 16px; grid-template-columns: minmax(0,1fr) 32px minmax(0,1fr); }
  #productHome .feature-convert-arrow { width: 32px; }
  #productHome .feature-script-sheet { padding: 24px; }
  #productHome .home-project-section { padding-right: 40px; padding-left: 40px; }
  #productHome .project-row-editorial { gap: 30px; }
  #productHome .project-coaching-preview { height: 280px; }
}
@media (max-width: 700px) {
  #productHome .hero-intro { width: 100%; max-width: none; margin-top: 26px; font-size: 16px; line-height: 1.9; }
  #productHome .hero-intro p + p { margin-top: 14px; }
  #productHome .hero-personal-contact { font-size: 16px; }
  #productHome .hero-inline-brand { gap: 4px; margin: 0 1px; }
  #productHome .hero-inline-brand > span { width: 20px; height: 20px; font-size: 13px; }
  #productHome .resource-heading-layout { display: block; min-height: 320px; margin-bottom: 30px; padding-top: 20px; }
  #productHome .resource-library { grid-template-columns: minmax(0,1fr); }
  #productHome .resource-heading-layout .home-section-heading { max-width: 100%; }
  #productHome .resource-scene { top: 64px; right: 0; width: 100%; height: 270px; -webkit-mask-image: linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 28%,#000 68%,transparent); mask-image: linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 28%,#000 68%,transparent); }
  #productHome .resource-scene img { object-position: 82% 50%; filter: saturate(.72) brightness(.9); }
  #productHome .resource-scene::after { background: linear-gradient(180deg,rgba(0,0,0,.1),transparent 60%); }
  #productHome .home-resource-section { margin-bottom: 80px; }
  #productHome .home-member-section { padding: 80px 0 76px; }
  #productHome .story-heading { gap: 28px; }
  #productHome .speech-feature-visual { margin-top: 36px; padding: 10px 2px 0; grid-template-columns: minmax(0,1fr); gap: 20px; }
  #productHome .feature-slide-stack { width: 94%; margin: 0 auto; padding: 32px 0; }
  #productHome .feature-convert-arrow { width: 38px; height: 38px; transform: rotate(90deg); line-height: 1; }
  #productHome .feature-script-sheet { padding: 26px; }
  #productHome .feature-sheet-heading strong { font-size: 20px; }
  #productHome .feature-audio { gap: 13px; }
  #productHome .story-flow { margin-top: 48px; }
  #productHome .story-flow article { padding-top: 32px; padding-bottom: 36px; }
  #productHome .story-flow h3 { margin-top: 26px; }
  #productHome .story-outcome { padding-top: 48px; gap: 30px; }
  #productHome .home-project-section { margin-top: 88px; padding: 66px 24px 48px; }
  #productHome .project-row-editorial { grid-template-columns: minmax(0,1fr); gap: 30px; padding: 42px 0 48px; }
  #productHome .project-cases-preview { height: auto; }
  #productHome .project-case-caption { padding-top: 14px; font-size: 14px; }
  #productHome .project-coaching-preview { height: 230px; }
  #productHome .project-editorial-copy .project-copy h3 { font-size: clamp(28px,7.5vw,36px); }
  #productHome .project-editorial-copy .project-copy p { font-size: 16px; }
  #productHome .project-editorial-copy .project-points { gap: 10px 16px; }
  #productHome .project-service-contact { gap: 10px 14px; padding-top: 30px; }
  #productHome .project-service-contact > span:first-child { width: 100%; text-align: center; }
  #productHome .project-service-contact strong { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  #productHome.home-motion-ready .hero-content > .hero-intro,
  #productHome [data-home-ambient] img,
  #productHome .feature-script-sheet::after,
  #productHome .feature-audio-wave i,
  #productHome .coaching-sound-wave i { animation: none; }
}
