/* Intentions in motion. Every panel stays readable when enhancement is unavailable. */
.sector-scene { --sector-height: clamp(500px,80svh,900px); }
.sector-scene__visual { height: var(--sector-height); }
.sector-analysis { position: absolute; z-index: 5; right: var(--gutter); top: 2rem; bottom: auto; width: min(310px,calc(100% - var(--gutter) * 2)); margin: 0; border: 0; background: transparent; }
.sector-analysis summary { min-height: 64px; padding: .8rem 1rem; gap: 1.3rem; border: 1px solid #c9a86a99; background: #0b0c0efa; color: #f5f3ed; border-radius: 2px; }
.sector-analysis summary .sector-analysis__label { font-size: .95rem; line-height: 1.4; transform: none; }
.sector-analysis summary .sector-analysis__plus { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; background: var(--gold); color: #08090b; border-radius: 50%; font: 400 1.65rem/1 var(--sans); }
.sector-analysis[open] summary .sector-analysis__label { transform: none; }
.sector-analysis[open] summary .sector-analysis__plus { transform: rotate(45deg); }
.sector-analysis summary:focus-visible { outline: 3px solid #f5dfac; outline-offset: 4px; }
.sector-analysis > div { position: absolute; right: 0; top: calc(100% + 12px); bottom: auto; display: block; width: min(500px,calc(100vw - var(--gutter) * 2)); max-height: calc(var(--sector-height) - 150px); overflow-y: auto; padding: 1.5rem; border: 1px solid #c9a86a66; background: #0b0c0efa; color: #f5f3ed; border-radius: 2px; box-shadow: 0 16px 45px #0003; }
.sector-analysis p { font-size: .98rem; line-height: 1.7; }
.sector-analysis .sector-analysis__surface { color: #d8c39d; margin-bottom: .85rem; }
.sector-scene--commerce .sector-scene__visual { background: #302b25; color: #f5f3ed; }
.sector-scene--commerce .sector-scene__visual::after { background: linear-gradient(90deg,#08090b40,transparent 70%); }
.sector-scene--commerce h3 { max-width: 65%; }
.sector-scene--commerce .sector-scene__visual > img { object-position: 72% center; }

.outcomes { padding-bottom: clamp(4rem,7vw,7rem); }
.outcomes__intro { margin-bottom: 3rem; }
.outcomes__track { position: relative; }
.outcomes__viewport { position: relative; }
.outcomes__list { list-style: none; padding: 0; margin: 0; }
.outcome-panel { position: relative; display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 3rem; padding: 3rem var(--gutter); min-height: 650px; }
.outcome-copy { grid-column: 1; grid-row: 1; position: relative; z-index: 2; }
.outcome-copy h3 { margin: 0; font-size: clamp(2.6rem,4.4vw,4.5rem); font-weight: 400; line-height: 1; letter-spacing: -.045em; }
.outcome-copy h3 span { display: block; margin-bottom: .1em; }
.outcome-copy h3 em { display: block; font: italic 1.5em/1.06 var(--serif); color: #765d31; letter-spacing: -.06em; }
.outcome-copy > p { font-size: clamp(1rem,1.5vw,1.3rem); max-width: 350px; line-height: 1.65; margin: 2rem 0 0; color: #484842; }
.outcome-visual { grid-column: 2; grid-row: 1; min-width: 0; margin: 0; height: 540px; background: #d6ccbd; }
.outcome-visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 78% center; }
.outcome-panel--parfum img { object-position: 85% center; }
.outcome-panel--commerce img { object-position: right center; }
.outcome-panel--eclips img { object-position: 88% center; }
.outcome-panel--memorable img { object-position: 70% center; }
.outcomes__controls { position: absolute; z-index: 5; bottom: 2rem; left: var(--gutter); display: flex; gap: .2rem; }
.outcomes__controls button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; color: #2b2924; }
.outcomes__controls button span { display: block; width: 8px; height: 8px; border: 1px solid #6c6251; border-radius: 50%; }
.outcomes__controls button[aria-pressed='true'] span { width: 24px; height: 5px; background: #765d31; border-color: #765d31; border-radius: 0; }
.outcomes__controls button:focus-visible { outline: 2px solid #765d31; outline-offset: 0; }
.outcomes__after { padding-top: 3rem; }
.outcomes__after > p { margin: 0; color: #65645b; font-size: clamp(1.5rem,3vw,3rem); line-height: 1.35; letter-spacing: -.035em; }
.outcomes__after strong { font-weight: 400; color: #161712; }

@media (prefers-reduced-motion:no-preference) {
 .motion-ready .sector-scene__visual { clip-path: none; }
 .motion-ready .sector-scene__visual > img { clip-path: inset(0 min(var(--inset,0px),24px)); }
 [data-outcomes-ready] { height: 340svh; }
 [data-outcomes-ready] .outcomes__viewport { position: sticky; top: 0; height: 100svh; min-height: 700px; overflow: clip; }
 [data-outcomes-ready] .outcomes__list { position: absolute; inset: 0; }
 [data-outcomes-ready] .outcome-panel { position: absolute; inset: 0; min-height: 0; padding-block: 6rem 8rem; }
 [data-outcomes-ready] .outcome-copy { animation: outcome-arrive .65s cubic-bezier(.2,.7,.2,1) both; }
 [data-outcomes-ready] .outcome-visual { height: min(70svh,650px); transform: perspective(1200px) translate3d(calc((.5 - var(--outcome-local,.5)) * 38px),calc((.5 - var(--outcome-local,.5)) * 60px),0) rotateY(calc((var(--outcome-local,.5) - .5) * 18deg)) rotateZ(calc((var(--outcome-local,.5) - .5) * 8deg)) scale(calc(1.04 - var(--outcome-local,.5) * .08)); box-shadow: 0 26px 60px #29211626; }
 [data-outcomes-ready] .outcome-visual img { animation: outcome-image .65s ease-out both; }
 @keyframes outcome-arrive { from { transform: translateY(30px); clip-path: inset(0 0 100% 0); } to { transform: none; clip-path: inset(-.15em -.1em -.25em); } }
 @keyframes outcome-image { from { opacity: .35; } to { opacity: 1; } }
}
@media (max-width:1000px) {
 .outcome-panel { gap: 1.5rem; }
 .outcome-copy h3 { font-size: clamp(2.5rem,5vw,4.5rem); }
 .outcome-visual { height: 460px; }
}
@media (max-width:700px) {
 .sector-scene { --sector-height: 600px; }
 .sector-scene__copy { padding-bottom: 2.5rem; }
 .sector-analysis { top: 1.25rem; }
 .sector-analysis > div { padding: 1.2rem; }
 .sector-analysis summary { min-height: 62px; }
 .sector-scene--commerce h3 { max-width: 100%; }
 .sector-scene--commerce .sector-scene__visual::after { background: linear-gradient(0deg,#191713fa, #191713a3 38%,transparent 75%); }
 .outcome-panel { grid-template-columns: 1fr; gap: 0; min-height: 0; padding-block: 1rem 4rem; }
 .outcome-visual { grid-column: 1; grid-row: 1; height: 360px; margin-left: 15%; }
 .outcome-copy { grid-column: 1; grid-row: 2; margin-top: 1.5rem; }
 .outcome-copy h3 { font-size: clamp(2.2rem,8vw,3.6rem); }
 .outcome-copy > p { margin-top: 1rem; font-size: 1rem; }
 .outcomes__after { padding-top: 1rem; }
}
@media (max-width:700px) and (prefers-reduced-motion:no-preference) {
 [data-outcomes-ready] .outcome-panel { display: block; padding: 0; }
 [data-outcomes-ready] .outcome-visual { position: absolute; width: 74%; height: 45svh; top: 5svh; right: 0; margin: 0; }
 [data-outcomes-ready] .outcome-copy { position: absolute; bottom: 7.5rem; left: var(--gutter); right: var(--gutter); margin: 0; }
 [data-outcomes-ready] .outcome-copy h3 { font-size: clamp(2.25rem,7.4vw,3rem); }
 [data-outcomes-ready] .outcome-copy h3 em { font-size: 1.5em; }
 [data-outcomes-ready] .outcome-copy > p { max-width: 290px; }
 [data-outcomes-ready] .outcome-visual { transform: perspective(900px) translateY(calc((.5 - var(--outcome-local,.5)) * 30px)) rotateY(calc((var(--outcome-local,.5) - .5) * 12deg)) rotateZ(calc((var(--outcome-local,.5) - .5) * 6deg)); }
}
@media (prefers-reduced-motion:reduce) {
 .outcome-copy, .outcome-visual, .outcome-visual img { animation: none !important; transform: none !important; }
}
@media (forced-colors:active) {
 .sector-analysis summary, .sector-analysis > div { background: Canvas; color: CanvasText; border-color: CanvasText; }
 .sector-analysis .sector-analysis__surface, .sector-analysis summary .sector-analysis__plus { color: CanvasText; }
 .outcomes__controls button[aria-pressed='true'] { outline: 2px solid Highlight; }
}