/* Production Preview candidate; every design selector is scoped to Home. */
.oc-production-home h1, .oc-production-home h2, .oc-production-home h3{text-wrap: balance;}
.oc-production-home{font-weight: 500;}
.oc-production-home .sample-checks{display: flex; gap: 16px; margin: 8px 0px 18px; color: rgb(241, 211, 148); justify-content: space-between;}
.oc-production-home .sample-checks > span{display: grid; justify-items: center; gap: 7px;}
.oc-production-home .sample-checks svg{width: 32px; height: 32px;}
.oc-production-home .sample-checks b{font-size: 11px; font-weight: 500; color: rgb(255, 255, 255);}
.oc-production-home .sample-visual.oc-sample-carousel strong{font-size: 25px; line-height: 1.5; margin: 18px 0px 8px;}
.oc-production-home .sample-visual.oc-sample-carousel .sample-sub{font-size: 10px;}
.oc-production-home{--navy: #17324d; --ink: #233344; --muted: #596b79; --gold: #c79a45; --gold-ink: #806020; --neutral: #f3f6f6; --blue: #edf3f8; --warm: #faf6ed; --border: #dce4e8; --radius: 18px; --side: 20px; --section: 72px; --content: 1200px; --h1: 34px; --h2: 28px; --h3: 21px;}
.oc-production-home *{box-sizing: border-box; min-width: 0px;}
.oc-production-home{scroll-behavior: auto;}
.oc-production-home{margin: 0px; color: var(--ink); background: rgb(255, 255, 255); font: 16px / 1.85 "Yu Gothic", Meiryo, system-ui, sans-serif; overflow-wrap: break-word;}
.oc-production-home h1, .oc-production-home h2, .oc-production-home h3, .oc-production-home h4, .oc-production-home p{margin: 0px;}
.oc-production-home h1, .oc-production-home h2, .oc-production-home h3, .oc-production-home h4{color: var(--navy); font-weight: 700; letter-spacing: 0.015em;}
.oc-production-home h1{font-size: var(--h1); line-height: 1.45;}
.oc-production-home h2{font-size: var(--h2); line-height: 1.5;}
.oc-production-home h3{font-size: var(--h3); line-height: 1.6;}
.oc-production-home h4{font-size: 18px; line-height: 1.6;}
.oc-production-home a{color: var(--navy); text-underline-offset: 5px;}
.oc-production-home button, .oc-production-home input, .oc-production-home summary{font: inherit;}
.oc-production-home button, .oc-production-home summary, .oc-production-home a{touch-action: manipulation;}
.oc-production-home a, .oc-production-home button, .oc-production-home summary{-webkit-tap-highlight-color: rgb(220, 228, 232);}
.oc-production-home svg{display: block; max-width: 100%; height: auto;}
.oc-production-home button{cursor: pointer;}
.oc-production-home button:disabled{cursor: not-allowed;}
.oc-production-home a:focus-visible, .oc-production-home button:focus-visible, .oc-production-home summary:focus-visible, .oc-production-home input:focus-visible{outline: rgb(33, 106, 171) solid 3px; outline-offset: 4px;}
.oc-production-home [hidden]{display: none !important;}
.oc-production-home .wrap{width: min(var(--content),calc(100% - 2*var(--side))); margin-inline: auto;}
.oc-production-home .section{padding: var(--section) 0; scroll-margin-top: 30px;}
.oc-production-home .neutral{background: var(--neutral);}
.oc-production-home .blue{background: var(--blue);}
.oc-production-home .warm{background: var(--warm);}
.oc-production-home .section-heading{margin: 0px auto 38px; max-width: 850px;}
.oc-production-home .eyebrow{font-size: 14px; line-height: 1.6; font-weight: 700; color: var(--gold-ink); margin-bottom: 18px; letter-spacing: 0.06em;}
.oc-production-home .eyebrow::before{content: ""; display: inline-block; width: 18px; height: 2px; background: var(--gold); vertical-align: middle; margin-right: 10px;}
.oc-production-home .lead{margin: 20px auto 0px; max-width: 44em; color: var(--muted);}
.oc-production-home .note{font-size: 14px; line-height: 1.8; color: var(--muted); margin-top: 20px;}
.oc-production-home .centered{text-align: center;}
.oc-production-home .readable{max-width: 760px; margin: auto;}
.oc-production-home .small-label{font-size: 14px; color: var(--gold-ink); font-weight: 700;}
.oc-production-home .badge{display: inline-block; font-size: 13px; border: 1px solid var(--border); border-radius: 999px; padding: 3px 12px; background: rgb(255, 255, 255); color: var(--muted);}
.oc-production-home .site-header{background: rgb(255, 255, 255); border-bottom: 1px solid rgb(237, 241, 243);}
.oc-production-home .header-wrap{width: calc(100% - 2*var(--side)); max-width: 1440px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 76px; position: relative;}
.oc-production-home .logo{font: 750 27px / 1.2 "Segoe UI", sans-serif; letter-spacing: -1px; text-decoration: none; color: var(--navy); display: inline-flex; align-items: center; min-height: 48px;}
.oc-production-home .logo span{color: var(--gold);}
.oc-production-home .desktop-nav, .oc-production-home .header-cta{display: none;}
.oc-production-home .mobile-menu{border: 0px; margin: 0px;}
.oc-production-home .mobile-menu summary{list-style: none; min-height: 48px; display: flex; align-items: center; gap: 12px; font-size: 13px; cursor: pointer;}
.oc-production-home .mobile-menu summary::-webkit-details-marker{display: none;}
.oc-production-home .mobile-menu summary span{font-size: 23px;}
.oc-production-home .mobile-menu nav{position: absolute; top: 76px; left: 0px; right: 0px; z-index: 10; background: rgb(255, 255, 255); border: 1px solid var(--border); border-radius: 0px 0px 18px 18px; box-shadow: rgba(23, 50, 77, 0.07) 0px 14px 28px; display: grid; padding: 14px 22px;}
.oc-production-home .mobile-menu nav a{display: flex; align-items: center; min-height: 52px; text-decoration: none; border-bottom: 1px solid var(--border); font-size: 15px;}
.oc-production-home .skip{position: fixed; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); z-index: 20;}
.oc-production-home .skip:focus{width: auto; height: auto; clip-path: none; top: 10px; left: 10px; background: rgb(255, 255, 255); padding: 12px;}
.oc-production-home .hero{padding: 56px 0px 48px; background: rgb(255, 255, 255);}
.oc-production-home .hero-grid{display: grid; gap: 40px; align-items: center;}
.oc-production-home .hero-lead{margin-top: 24px; max-width: 36em; line-height: 1.9;}
.oc-production-home .hero .eyebrow{margin-bottom: 20px;}
.oc-production-home .actions{display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 28px;}
.oc-production-home .hero-visual{width: 100%; max-width: 640px; margin: auto;}
.oc-production-home .hero-visual > .gap-scene{width: 100%; max-width: 400px; max-height: 310px; margin: auto;}
.oc-production-home .button{display: inline-flex; justify-content: center; align-items: center; gap: 20px; min-height: 56px; padding: 15px 25px; border: 1px solid var(--navy); border-radius: 14px; text-decoration: none; font-size: 15px; font-weight: 700; line-height: 1.7; max-width: 100%;}
.oc-production-home .primary{color: white; background: var(--navy);}
.oc-production-home .outline{background: rgb(255, 255, 255); color: var(--navy);}
.oc-production-home .text-link{min-height: 48px; display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 700;}
.oc-production-home .section > .wrap > .button{display: flex; width: max-content; margin: 32px auto 0px;}
.oc-production-home .jumpbar{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 14px 0px; gap: 8px;}
.oc-production-home .jumpbar a{display: flex; align-items: center; justify-content: center; text-decoration: none; min-height: 44px; font-size: 13px;}
.oc-production-home .jumpbar a + a{border-left: 1px solid var(--border);}
.oc-production-home .studio{position: relative; background: var(--blue); border-radius: 28px; padding: 24px 16px 18px; isolation: isolate;}
.oc-production-home .studio-label{font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 22px;}
.oc-production-home .studio-work{display: grid; grid-template-columns: 1fr 1.7fr 0.85fr; align-items: center; gap: 8px;}
.oc-production-home .research-paper, .oc-production-home .post-paper, .oc-production-home .phone-paper{background: white; box-shadow: rgba(23, 50, 77, 0.05) 0px 10px 24px;}
.oc-production-home .research-paper{padding: 12px 8px; border: 1px solid var(--border); border-radius: 8px; transform: rotate(-6deg);}
.oc-production-home .research-paper .vb-icon{width: 38px; margin: 12px auto;}
.oc-production-home .research-paper strong{display: block; font-size: 12px; line-height: 1.7;}
.oc-production-home .studio .small-label{font-size: 10px; display: block;}
.oc-production-home .post-paper{padding: 14px 10px; border-radius: 12px; transform: rotate(2deg);}
.oc-production-home .post-paper strong{display: block; font-size: 14px; line-height: 1.8;}
.oc-production-home .paper-art{background: var(--warm); margin: 12px 0px; border-radius: 8px;}
.oc-production-home .paper-art svg{width: 100%;}
.oc-production-home .post-tag{font-size: 10px; display: block; border-top: 1px solid var(--border); padding-top: 10px; margin-top: 10px;}
.oc-production-home .phone-paper{border: 2px solid var(--navy); border-radius: 16px; padding: 9px 6px 16px; transform: rotate(8deg); text-align: center;}
.oc-production-home .phone-notch{width: 22px; height: 3px; background: var(--navy); border-radius: 3px; margin: 0px auto 20px;}
.oc-production-home .phone-paper svg{width: 35px; margin: 0px auto 14px;}
.oc-production-home .phone-paper strong{font-size: 11px; line-height: 1.8; display: block;}
.oc-production-home .phone-paper > span{font-size: 9px; display: block; margin-top: 15px;}
.oc-production-home .paper-lines i, .oc-production-home .phone-lines i{display: block; height: 3px; background: var(--border); margin-top: 8px; border-radius: 3px;}
.oc-production-home .paper-lines i:last-child{width: 65%;}
.oc-production-home .studio-check{display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 26px; background: rgb(255, 255, 255); border-radius: 12px; padding: 12px; font-size: 13px; font-weight: 700;}
.oc-production-home .studio-check svg{width: 25px;}
.oc-production-home .grid{display: grid; gap: 24px;}
.oc-production-home .card{background: white; border: 1px solid var(--border); border-radius: var(--radius); overflow: visible;}
.oc-production-home .card-visual{background: var(--neutral); border-radius: 18px 18px 0px 0px; display: grid; place-items: center; min-height: 210px; padding: 24px;}
.oc-production-home .card-visual svg{width: 180px; max-height: 165px;}
.oc-production-home .card-body{padding: 26px;}
.oc-production-home .card-body p{color: var(--muted); margin-top: 12px;}
.oc-production-home .card-body .text-link{margin-top: 12px;}
.oc-production-home .deliverable{background: var(--warm); padding: 22px; border-radius: 14px; margin-top: 28px; font-size: 15px;}
.oc-production-home .problem-grid{display: grid; gap: 18px;}
.oc-production-home .problem{background: rgb(255, 255, 255); display: flex; align-items: center; gap: 20px; padding: 24px; border-radius: var(--radius);}
.oc-production-home .problem h3{font-size: 20px;}
.oc-production-home .problem p{color: var(--muted); font-size: 15px; margin-top: 8px;}
.oc-production-home .icon-wrap{width: 56px; flex-shrink: 0; background: var(--warm); border-radius: 16px; padding: 8px;}
.oc-production-home .vb-icon{width: 50px; height: 50px;}
.oc-production-home .split{display: grid; gap: 34px; align-items: center;}
.oc-production-home .split h3 + p{margin-top: 18px;}
.oc-production-home .split .button{margin-top: 24px;}
.oc-production-home .large-art{background: var(--blue); border-radius: 28px; padding: 30px;}
.oc-production-home .large-art > svg{width: 100%; max-width: 320px; margin: auto;}
.oc-production-home .service-card{display: grid; gap: 20px; background: var(--neutral); border-radius: 20px; padding: 28px;}
.oc-production-home .service-art{width: 200px; max-width: 100%; margin: auto;}
.oc-production-home .service-card h3{margin: 10px 0px 12px;}
.oc-production-home .service-card p:last-child{color: var(--muted); font-size: 15px;}
.oc-production-home .feature-line{display: flex; gap: 20px; padding: 22px 0px; border-bottom: 1px solid var(--border);}
.oc-production-home .feature-line > span{font: 600 28px / 1.5 "Segoe UI", sans-serif; color: var(--gold-ink);}
.oc-production-home .feature-line p{margin-top: 10px; color: var(--muted);}
.oc-production-home .flow{list-style: none; padding: 0px; margin: 0px; display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 14px;}
.oc-production-home .flow li{position: relative; border-radius: 18px; padding: 24px 14px; background: rgb(255, 255, 255); text-align: center; border: 1px solid var(--border);}
.oc-production-home .flow .vb-icon{margin: 16px auto;}
.oc-production-home .flow h3{font-size: 18px;}
.oc-production-home .flow p{font-size: 13px; color: var(--muted); margin-top: 10px;}
.oc-production-home .step-no{font: 600 16px / 1.5 "Segoe UI", sans-serif; color: var(--gold-ink);}
.oc-production-home .research-diagram{display: grid; grid-template-columns: 1fr 12px 1fr 12px 1fr; gap: 5px; align-items: center; background: rgb(255, 255, 255); border-radius: 24px; padding: 22px 12px; text-align: center;}
.oc-production-home .research-diagram strong, .oc-production-home .research-diagram h3{font-size: 14px; display: block;}
.oc-production-home .research-diagram > span{color: var(--gold-ink);}
.oc-production-home .research-diagram.large{background: transparent;}
.oc-production-home .word-flow{display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 20px; font-size: 14px;}
.oc-production-home .word-flow span{padding: 8px; background: rgb(255, 255, 255); border-radius: 8px;}
.oc-production-home .word-flow b{color: var(--gold-ink);}
.oc-production-home .sample-card{border-radius: 20px; background: rgb(255, 255, 255); border: 1px solid var(--border); padding: 18px;}
.oc-production-home .sample-visual{aspect-ratio: 1 / 1; border-radius: 12px; padding: 24px; display: flex; flex-direction: column; position: relative;}
.oc-production-home .sample-brand{font-size: 11px; letter-spacing: 0.05em;}
.oc-production-home .sample-visual strong{font-size: 29px; line-height: 1.6; margin: auto 0px; letter-spacing: 0.03em;}
.oc-production-home .sample-sub{font-size: 12px;}
.oc-production-home .oc-sample-carousel{background: var(--navy); color: rgb(255, 255, 255);}
.oc-production-home .oc-sample-carousel em{font-style: normal; color: rgb(241, 211, 148);}
.oc-production-home .reel{background: var(--warm); border: 1px solid rgb(234, 221, 189);}
.oc-production-home .reel strong{padding-right: 28px; color: var(--navy);}
.oc-production-home .play-mark{position: absolute; right: 20px; bottom: 60px; width: 45px; height: 45px; display: grid; place-items: center; border: 1px solid var(--gold); border-radius: 50%; color: var(--navy); font-size: 30px;}
.oc-production-home .editorial{background: var(--neutral); border-top: 5px solid var(--gold);}
.oc-production-home .editorial strong{font-size: 24px; border-block: 1px solid rgb(202, 213, 221); padding: 25px 0px;}
.oc-production-home .sample-caption{padding: 24px 6px 12px;}
.oc-production-home .sample-caption h3{margin-top: 12px;}
.oc-production-home .sample-caption p{margin-top: 8px; font-size: 15px; color: var(--muted);}
.oc-production-home .plan{background: var(--neutral); border: 1px solid var(--border); border-radius: 18px; padding: 26px;}
.oc-production-home .plan-no{font: 600 28px / 1.4 "Segoe UI", sans-serif; color: rgb(122, 140, 155);}
.oc-production-home .plan-need{color: var(--gold-ink); font-size: 14px; font-weight: 700; margin: 18px 0px 8px;}
.oc-production-home .plan > p:last-of-type{font-size: 15px; margin-top: 12px; color: var(--muted);}
.oc-production-home .plan .disclosure{margin: 24px 0px 0px; background: rgb(255, 255, 255);}
.oc-production-home .plan summary{font-size: 14px; padding: 14px 35px 14px 16px;}
.oc-production-home .plan .detail-body{padding: 0px 18px 20px; font-size: 14px;}
.oc-production-home .review-block{display: grid; gap: 30px; align-items: center;}
.oc-production-home .review-visual{background: var(--warm); padding: 28px; border-radius: 28px; text-align: center;}
.oc-production-home .review-visual svg{max-width: 250px; margin: auto;}
.oc-production-home .review-visual p{font-weight: 700; font-size: 18px;}
.oc-production-home .checklist{list-style: none; padding: 0px; margin: 0px; display: grid; gap: 0px;}
.oc-production-home .checklist li{display: flex; align-items: center; gap: 18px; padding: 17px 0px; border-bottom: 1px solid var(--border);}
.oc-production-home .checklist svg{width: 30px; height: 30px; color: var(--navy);}
.oc-production-home .checklist span{font-size: 16px; font-weight: 700;}
.oc-production-home .disclosure{border: 1px solid var(--border); border-radius: 14px; background: rgb(255, 255, 255); margin-top: 20px;}
.oc-production-home .disclosure summary{list-style: none; cursor: pointer; position: relative; padding: 20px 52px 20px 22px; font-size: 16px; font-weight: 700; min-height: 58px; color: var(--navy);}
.oc-production-home .disclosure summary::-webkit-details-marker{display: none;}
.oc-production-home .disclosure summary::after{content: "＋"; position: absolute; right: 20px; top: 20px; font-weight: 400;}
.oc-production-home .disclosure[open] > summary::after{content: "−";}
.oc-production-home .detail-body{padding: 2px 24px 26px; max-width: 100%; overflow-wrap: anywhere;}
.oc-production-home .detail-body p + p{margin-top: 16px;}
.oc-production-home .detail-body dt{font-weight: 700; margin-top: 18px;}
.oc-production-home .detail-body dd{margin: 6px 0px 0px; color: var(--muted);}
.oc-production-home .faq-list{max-width: 860px; margin: auto;}
.oc-production-home .faq-list + .disclosure{max-width: 860px; margin: 24px auto 0px;}
.oc-production-home .preserved{max-width: 760px; margin: auto; font-size: 15px;}
.oc-production-home .preserved p, .oc-production-home .preserved ul, .oc-production-home .preserved ol, .oc-production-home .preserved dl{margin: 16px 0px;}
.oc-production-home .preserved h2, .oc-production-home .preserved h3{font-size: 22px; margin: 28px 0px 16px;}
.oc-production-home .preserved h4{margin: 24px 0px 12px;}
.oc-production-home .preserved article{padding: 18px 0px; border-bottom: 1px solid var(--border);}
.oc-production-home .preserved summary{padding: 18px 35px 18px 14px; font-size: 15px;}
.oc-production-home .preserved table{width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 13px;}
.oc-production-home .preserved td, .oc-production-home .preserved th{border: 1px solid var(--border); padding: 8px; overflow-wrap: anywhere;}
.oc-production-home .preserved a{overflow-wrap: anywhere; display: inline-flex; align-items: center; min-height: 44px;}
.oc-production-home .preserved .gap-mobile-plans, .oc-production-home .preserved .vb-comparison-mobile{display: none;}
.oc-production-home .preserved button{padding: 12px; border: 1px solid var(--border); background: var(--neutral); color: var(--muted);}
.oc-production-home .cta-panel{background: white; border: 1px solid rgb(230, 220, 200); border-radius: 28px; padding: 26px;}
.oc-production-home .cta-primary{display: grid; gap: 24px; align-items: center;}
.oc-production-home .cta-art{width: 190px; max-width: 100%; margin: auto;}
.oc-production-home .cta-primary h3{margin: 14px 0px 24px;}
.oc-production-home .cta-primary .button{width: 100%;}
.oc-production-home .cta-secondary{border-top: 1px solid var(--border); margin-top: 30px; padding-top: 26px; display: grid; gap: 26px;}
.oc-production-home .cta-secondary h3{font-size: 18px;}
.oc-production-home .cta-secondary p{font-size: 14px; color: var(--muted); margin: 8px 0px 14px;}
.oc-production-home .cta-secondary button{display: block; width: 100%; min-height: 50px; padding: 12px; border: 1px solid rgb(180, 192, 201); border-radius: 12px; background: rgb(255, 255, 255); color: rgb(89, 107, 121); font-size: 14px;}
.oc-production-home .cta-secondary .note{display: block; margin-top: 8px; font-size: 13px;}
.oc-production-home .site-footer{padding: 54px 0px 24px; background: rgb(255, 255, 255); border-top: 1px solid var(--border);}
.oc-production-home .footer-main{display: grid; gap: 32px;}
.oc-production-home .footer-main p{font-size: 14px; color: var(--muted); margin-top: 14px;}
.oc-production-home .footer-main nav{display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px;}
.oc-production-home .footer-main nav a{font-size: 14px; text-decoration: none; min-height: 48px;}
.oc-production-home .local-note{font-size: 12px; color: var(--muted); border-top: 1px solid var(--border); margin-top: 36px; padding-top: 22px;}
.oc-production-home .form-wrap{max-width: 760px; margin: auto;}
.oc-production-home .form-wrap > p{margin-bottom: 32px;}
.oc-production-home .oc-check-form fieldset{border: 1px solid var(--border); background: white; padding: 24px; border-radius: 18px; margin: 28px 0px; min-width: 0px;}
.oc-production-home .oc-check-form legend{font-weight: 700; font-size: 18px; padding: 0px 8px;}
.oc-production-home .oc-check-form label{display: flex; align-items: flex-start; gap: 12px; padding: 12px 0px; border-bottom: 1px solid var(--border); min-height: 48px;}
.oc-production-home .oc-check-form input{width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--navy); margin: 6px 0px 0px;}
.oc-production-home .oc-check-form small{font-size: 14px; color: var(--muted);}
.oc-production-home .oc-check-form button{background: var(--navy); color: white; border: 0px; border-radius: 14px; min-height: 56px; padding: 16px 26px; font-weight: 700;}
.oc-production-home #errors{color: rgb(145, 45, 45); font-weight: 700; margin: 18px 0px;}
.oc-production-home #result{padding: 26px; background: white; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-top: 4px solid var(--gold); border-radius: 18px; margin: 32px 0px;}
.oc-production-home #result h3{margin: 24px 0px 12px;}
.oc-production-home #result p, .oc-production-home #result li{margin: 12px 0px;}
.oc-production-home #result small{font-size: 14px;}
@media (min-width: 761px){
.oc-production-home{--side: 48px; --section: 104px; --h1: 52px; --h2: 36px; --h3: 24px;}
.oc-production-home .section-heading{text-align: center; margin-bottom: 52px;}
.oc-production-home .hero{padding: 80px 0px 68px;}
.oc-production-home .hero-grid{grid-template-columns: 1fr 1fr; gap: 54px; min-height: 510px;}
.oc-production-home .hero-lead{font-size: 18px;}
.oc-production-home .hero .actions{gap: 20px;}
.oc-production-home .hero-visual > .gap-scene{max-width: 480px; max-height: 430px;}
.oc-production-home .grid.three{grid-template-columns: repeat(3, minmax(0px, 1fr));}
.oc-production-home .grid.two, .oc-production-home .problem-grid{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.oc-production-home .grid.four{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.oc-production-home .split{grid-template-columns: 1fr 1fr; gap: 64px;}
.oc-production-home .service-card{grid-template-columns: 150px 1fr; align-items: center; gap: 26px; padding: 30px;}
.oc-production-home .service-art{width: 150px;}
.oc-production-home .flow{grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px;}
.oc-production-home .flow li{padding: 24px;}
.oc-production-home .research-diagram.large{padding: 24px 60px; gap: 22px;}
.oc-production-home .research-diagram.large h3{font-size: 22px;}
.oc-production-home .review-block{grid-template-columns: 0.8fr 1.2fr; gap: 60px; max-width: 1000px; margin: auto;}
.oc-production-home .checklist{grid-template-columns: 1fr 1fr; gap: 0px 24px;}
.oc-production-home .checklist li{font-size: 15px;}
.oc-production-home .cta-panel{padding: 48px 56px;}
.oc-production-home .cta-primary{grid-template-columns: 240px 1fr; gap: 44px;}
.oc-production-home .cta-art{width: 240px;}
.oc-production-home .cta-primary .button{width: auto; min-width: 310px;}
.oc-production-home .cta-secondary{grid-template-columns: 1fr 1fr; gap: 40px;}
.oc-production-home .footer-main{grid-template-columns: 1fr 1.4fr; gap: 72px;}
.oc-production-home .footer-main nav{grid-template-columns: repeat(3, minmax(0px, 1fr));}
.oc-production-home .jumpbar{padding: 20px 0px;}
.oc-production-home .jumpbar a{font-size: 15px;}
.oc-production-home .studio{padding: 28px 22px 24px;}
.oc-production-home .studio-label{font-size: 16px;}
.oc-production-home .studio-work{gap: 10px;}
.oc-production-home .research-paper{padding: 16px 12px;}
.oc-production-home .research-paper strong{font-size: 15px;}
.oc-production-home .post-paper{padding: 18px 16px;}
.oc-production-home .post-paper strong{font-size: 18px;}
.oc-production-home .studio .small-label{font-size: 12px;}
.oc-production-home .phone-paper{padding: 12px 8px 24px;}
.oc-production-home .phone-paper strong{font-size: 14px;}
.oc-production-home .phone-paper > span{font-size: 10px;}
.oc-production-home .studio-check{font-size: 15px;}
.oc-production-home .sample-visual strong{font-size: 28px;}
.oc-production-home .sample-visual.editorial strong{font-size: 22px;}}

@media (min-width: 1100px){
.oc-production-home .desktop-nav{display: flex; align-items: center; gap: 22px;}
.oc-production-home .desktop-nav a{font-size: 14px; font-weight: 700; min-height: 48px; display: flex; align-items: center; text-decoration: none;}
.oc-production-home .desktop-nav a[aria-current]{text-decoration-line: underline; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: var(--gold); text-underline-offset: 9px;}
.oc-production-home .header-cta{display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 18px; border: 1px solid var(--navy); border-radius: 12px; font-size: 13px; text-decoration: none; font-weight: 700;}
.oc-production-home .mobile-menu{display: none;}
.oc-production-home .header-wrap{min-height: 88px;}
.oc-production-home .grid.four{grid-template-columns: repeat(4, minmax(0px, 1fr));}
.oc-production-home .plan{padding: 24px 20px;}
.oc-production-home .plan h3{font-size: 22px;}
.oc-production-home .flow{grid-template-columns: repeat(6, minmax(0px, 1fr));}
.oc-production-home .flow li{padding: 24px 12px;}
.oc-production-home .flow p{font-size: 13px;}
.oc-production-home .studio .post-paper strong{font-size: 20px;}
.oc-production-home .sample-visual strong{font-size: 31px;}
.oc-production-home .sample-visual.editorial strong{font-size: 25px;}}

@media (max-width: 359px){
.oc-production-home{--side: 16px; --h1: 30px; --h2: 26px;}
.oc-production-home .logo{font-size: 24px;}
.oc-production-home .studio{padding: 20px 10px 14px;}
.oc-production-home .studio-work{gap: 6px;}
.oc-production-home .phone-paper{padding: 8px 4px;}
.oc-production-home .post-paper strong{font-size: 12px;}
.oc-production-home .phone-paper strong{font-size: 10px;}
.oc-production-home .research-paper strong{font-size: 11px;}
.oc-production-home .studio-check{font-size: 12px;}
.oc-production-home .problem{padding: 20px; gap: 14px;}
.oc-production-home .icon-wrap{width: 44px;}
.oc-production-home .problem h3{font-size: 18px;}
.oc-production-home .sample-visual strong{font-size: 26px;}
.oc-production-home .sample-visual.editorial strong{font-size: 22px;}
.oc-production-home .card-body{padding: 22px;}
.oc-production-home .cta-panel{padding: 22px;}
.oc-production-home .cta-primary .button{padding-inline: 12px; font-size: 14px;}
.oc-production-home .checklist span{font-size: 15px;}
.oc-production-home .oc-check-form fieldset{padding: 18px 14px;}}

@media (prefers-reduced-motion: reduce){
.oc-production-home *, .oc-production-home ::before, .oc-production-home ::after{animation: auto ease 0s 1 normal none running none !important; transition: none !important; scroll-behavior: auto !important;}}

.oc-production-home .hero h1 .oc-lb-sentence, .oc-production-home .hero-lead .oc-lb-sentence{display: block;}
@media (max-width: 760px){
.oc-production-home .oc-lb-unit{white-space: nowrap;}
.oc-production-home .hero-copy h1, .oc-production-home .hero-lead{line-break: strict;}}

.oc-production-home .sample-visual.reel > .play-mark{display: flex; align-items: center; justify-content: center; right: 24px; bottom: 28px; transform: none; padding: 4px 0px 0px;}
.oc-production-home .sample-visual.reel > .play-mark--inverse{background: var(--navy); border-color: var(--navy); color: rgb(255, 255, 255);}
.oc-production-home a[aria-disabled="true"]{pointer-events:none;cursor:default;opacity:.55}

/* Verified Wave1/Cocoon collision overrides, Home wrapper only. */
.oc-production-home .site-header{position:static;top:auto;z-index:auto;backdrop-filter:none}
.oc-production-home .site-header,.oc-production-home .hero,.oc-production-home .section,
.oc-production-home .cta-panel,.oc-production-home .site-footer{font-weight:500}
.oc-production-home .hero{position:static;overflow:visible;color:var(--ink)}
.oc-production-home .hero::after{content:none;display:none}
.oc-production-home .hero-grid{position:static;z-index:auto}
.oc-production-home .hero h1{max-width:none;margin-bottom:0}
.oc-production-home .hero-lead{max-width:36em;color:var(--ink);font-size:16px;line-height:1.9}
.oc-production-home .card{padding:0;box-shadow:none}
.oc-production-home .site-footer{color:var(--ink)}
@media(min-width:761px){.oc-production-home .hero-lead{font-size:18px}}


/* Gate A tablet QA: avoid narrow desktop columns at 761-1099px. */
@media (min-width: 761px) and (max-width: 1099px) {
.oc-production-home{--side:32px;--h1:44px;--h2:32px;--h3:22px;}
.oc-production-home .hero-grid{grid-template-columns:minmax(0,1fr);gap:40px;min-height:0;}
.oc-production-home .hero-visual{max-width:520px;}
.oc-production-home .grid.three.samples{grid-template-columns:minmax(0,1fr);}
.oc-production-home .samples .sample-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center;}
.oc-production-home .samples .sample-caption{padding:12px;}
.oc-production-home .sample-visual.reel .sample-sub{padding-right:56px;min-height:48px;display:flex;align-items:center;}
.oc-production-home .footer-main{grid-template-columns:minmax(0,1fr);gap:24px;}
.oc-production-home .footer-main nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px;}
}