/* October 9 review: quieter surfaces, one case-study media stage. */
.oci-direction .o-hero-title>.o-hero-summary {background:rgba(210,211,205,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#111214;border:1px solid rgba(17,18,20,.16);box-shadow:0 16px 40px #1112140d}
.oci-direction .o-m-quote-word {opacity:1;color:color-mix(in srgb,#171819 calc(var(--o-quote-progress,1)*100%),#83847e);transform:none;transition:color .14s linear}
.oci-direction .o-quote blockquote p{font:inherit;line-height:inherit;max-width:none;margin:0 0 .9em}
.oci-direction .o-quote-context{font-size:1rem;line-height:1.5;max-width:48em;margin:0 0 1.5rem;color:#50524e}
.oci-direction .o-case-value{padding-top:30px}
.oci-direction .o-case-value header{max-width:1100px;margin-bottom:3rem}
.oci-direction .o-case-value header p{max-width:46em;font-size:clamp(1.25rem,1.65vw,1.6rem);line-height:1.5}
.oci-direction .o-case-project{padding-top:clamp(32px,3vw,48px)}
.oci-direction .o-case-principle{max-width:35em;margin:clamp(40px,5vw,80px) auto 0;font-size:clamp(1.6rem,2.5vw,2.6rem);text-align:center;line-height:1.25}
.oci-direction .o-product-player{margin:0;background:#d4d4d0;padding:clamp(12px,2vw,32px)}
.oci-direction .o-product-player video{display:block;width:min(100%,1120px);height:auto;aspect-ratio:2768/2160;object-fit:contain;background:#fff;margin:auto}
.oci-direction .o-product-player figcaption{display:flex;justify-content:space-between;gap:1rem;padding-top:1rem;font-size:1rem;line-height:1.5;text-transform:none;color:#353631}
.oci-direction .o-product-player a{text-underline-offset:4px;color:inherit}
.oci-direction .o-product-player .o-video-error{margin-top:1rem;font-size:1.1rem;color:#111214}
.oci-direction .o-tour summary{padding:1.4rem 0;border-top:1px solid var(--o-line);border-bottom:1px solid var(--o-line);font-size:1.2rem;cursor:pointer}
.oci-direction .o-tour[open] summary{margin-bottom:1.5rem}
.oci-direction .o-case-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,64px)}
.oci-direction .o-case-index article{border-top:1px solid var(--o-line);padding:1.4rem 0 0;display:block}
.oci-direction .o-case-index h3{font-size:clamp(1.7rem,2.5vw,2.7rem);line-height:1.12;letter-spacing:-.035em;margin:1.5rem 0}
.oci-direction .o-case-index p{font-size:clamp(1.1rem,1.35vw,1.4rem);line-height:1.55}
@media(max-width:760px){.oci-direction .o-case-index{grid-template-columns:1fr}.oci-direction .o-product-player figcaption{display:block}.oci-direction .o-product-player figcaption a{display:inline-block;margin-top:.7rem}.oci-direction .o-hero-title>.o-hero-summary{background:rgba(210,211,205,.94)}}
@media(prefers-reduced-motion:reduce){.oci-direction .o-m-quote-word{color:#171819!important;transition:none}}
@media print{.oci-direction .o-m-quote-word{color:#171819!important}}

/* Native-resolution case demonstration with its commercial context. */
.oci-direction .o-case-video-layout{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);gap:clamp(32px,4vw,72px);align-items:center}
.oci-direction .o-case-video-layout .o-product-player{padding:0;background:transparent;min-width:0}
.oci-direction .o-case-video-layout .o-product-player video{width:100%;max-width:none;border:1px solid #c4c5be;box-shadow:0 12px 36px #1112140b}
.oci-direction .o-case-video-layout .o-product-player figcaption{font-size:1rem;gap:16px;flex-wrap:wrap}
.oci-direction .o-case-video-copy{min-width:0;color:#20211d}
.oci-direction .o-case-video-copy>.o-label{display:block;margin-bottom:1.4rem;color:var(--o-blue)}
.oci-direction .o-case-video-copy h2{font-size:clamp(2rem,3vw,3.3rem);line-height:1.06;letter-spacing:-.045em;margin:0 0 1.5rem;color:var(--o-blue)}
.oci-direction .o-case-video-copy p{font-size:clamp(1.05rem,1.2vw,1.25rem);line-height:1.5;max-width:40em;margin:0}
.oci-direction .o-case-outcomes{list-style:none;padding:0;margin:1.8rem 0}
.oci-direction .o-case-outcomes li{border-top:1px solid #b8bab1;padding:1rem 0}
.oci-direction .o-case-outcomes h3{font-size:clamp(1.15rem,1.4vw,1.4rem);line-height:1.25;letter-spacing:-.015em;margin:0 0 .4rem;font-weight:600}
.oci-direction .o-case-video-copy>.o-action{font-size:1rem;margin-top:0}
@media(max-width:1100px){.oci-direction .o-case-video-layout{grid-template-columns:1fr;gap:36px}.oci-direction .o-case-video-copy{max-width:800px}.oci-direction .o-case-video-copy h2{font-size:clamp(2.1rem,5vw,3.3rem)}.oci-direction .o-case-video-copy p{font-size:1.15rem}.oci-direction .o-case-video-layout .o-product-player video{max-width:100%}}

/* A brief homepage introduction, with benefits beside native-resolution product footage. */
.oci-direction .o-home-product { padding:clamp(48px,6vw,96px) 5vw; }
.oci-direction .o-home-product-value > header { display:block; margin:0 0 24px; padding:0; }
.oci-direction .o-home-product-value > header .o-label { display:block; margin-bottom:18px; }
.oci-direction .o-home-product-value > header h2 { font-size:clamp(2.2rem,3.2vw,3.6rem); line-height:1.08; }
.oci-direction .o-home-product-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:clamp(32px,4vw,72px); align-items:start; }
.oci-direction .o-home-product figure { width:100%; margin:0; min-width:0; }
.oci-direction .o-home-product figure > video { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; border:1px solid #11121426; }
.oci-direction .o-home-product figcaption { font:400 16px/1.5 'DM Sans',Arial,sans-serif; text-transform:none; padding-top:12px; }
.oci-direction .o-home-product-value { min-width:0; }
.oci-direction .o-home-product-intro { font-size:clamp(1.3rem,1.75vw,1.7rem); line-height:1.45; max-width:34ch; margin:0 0 28px; }
.oci-direction .o-home-product-benefits { list-style:none; padding:0; margin:0 0 28px; display:grid; gap:24px; }
.oci-direction .o-home-product-benefits h3 { font-size:clamp(1.2rem,1.5vw,1.5rem); line-height:1.25; margin:0 0 7px; letter-spacing:-.025em; }
.oci-direction .o-home-product-benefits p { font-size:18px; line-height:1.5; max-width:38ch; margin:0; color:#292b3a; }
.oci-direction .o-home-product-value .o-action { text-transform:none; font:500 18px/1.4 'DM Sans',Arial,sans-serif; min-height:48px; }
@media(max-width:900px) {
 .oci-direction .o-home-product-layout { grid-template-columns:minmax(0,1fr); gap:28px; }
 .oci-direction .o-home-product-intro,.oci-direction .o-home-product-benefits p { max-width:50ch; }
 .oci-direction .o-home-product-benefits { gap:20px; }
}