/* OEM phone composition. All existing content and native interactions stay available. */
@media(max-width:760px){
 html body[data-home-direction] #main .om-page{--om-pad:6%}
 html body[data-home-direction] #main .om-hero{display:block;height:auto;min-height:0;padding:26px 6% 22px;background:#f8cddd}
 html body[data-home-direction] #main .om-hero-copy{width:100%;max-width:none;padding:0}
 html body[data-home-direction] #main .om-hero h1{font-size:clamp(28px,8.3vw,36px);line-height:1.13;letter-spacing:-.035em;text-wrap:balance}
 html body[data-home-direction] #main .om-hero-copy>p{font-size:14px;line-height:1.6;margin-top:14px;max-width:38ch}
 html body[data-home-direction] #main .om-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:18px}
 html body[data-home-direction] #main .om-actions .om-action{width:100%;min-width:0;min-height:48px;padding:11px 12px;font-size:12px;gap:6px;justify-content:center;text-align:center;border-radius:8px;line-height:1.4;text-wrap:balance}
 html body[data-home-direction] #main .om-hero-scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:auto;gap:8px 14px;margin-top:12px;padding:0;overflow:visible}
 html body[data-home-direction] #main .om-hero-scene:before{inset:4% 0 100px 12%;border-radius:55% 55% 4px 4px}
 html body[data-home-direction] #main .om-hero-art{position:relative;grid-column:1/-1;inset:auto;bottom:auto;right:auto;width:100%;height:clamp(245px,70vw,300px);max-height:none;aspect-ratio:auto;object-fit:contain}
 html body[data-home-direction] #main .om-model{position:static;display:block;min-width:0;max-width:none;white-space:normal;text-align:start;font-size:13px;line-height:1.4;padding-top:8px;border-top:1px solid #08276e25}
 html body[data-home-direction] #main .om-model-kind{font-size:12px!important;line-height:1.5;max-width:none;white-space:normal;overflow-wrap:normal;font-weight:400;margin-top:3px}
 html body[data-home-direction] #main .om-art-note{position:static;grid-column:1/-1;max-width:none;background:transparent;padding:3px 0 0;margin:0;font-size:12px!important;line-height:1.5;color:#45566c}
 html body[data-home-direction] #main .om-scope{padding:22px 6% 28px}
 html body[data-home-direction] #main .om-scope>div{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 12px}
 html body[data-home-direction] #main .om-scope a{font-size:13px;line-height:1.45;gap:9px;padding:0;min-height:44px;border:0}
 html body[data-home-direction] #main .om-scope a:last-child{grid-column:1/-1;border-top:1px solid #08276e18;padding-top:13px}
 html body[data-home-direction] #main .om-scope-icon{width:32px;height:32px;font-size:24px}
 html body[data-home-direction] #main .om-section{padding-block:32px}
 html body[data-home-direction] #main .om-custom{display:block;padding:26px 0 8px}
 html body[data-home-direction] #main .om-custom>header{padding-inline:6%;margin-bottom:18px}
 html body[data-home-direction] #main .om-custom h2{font-size:clamp(26px,7.3vw,32px);line-height:1.2}
 html body[data-home-direction] #main .om-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible;width:88%;margin:0 auto 20px;padding:4px;background:#f1ece8;border:0;border-radius:12px}
 html body[data-home-direction] #main .om-tabs button{min-width:0;min-height:62px;white-space:normal;overflow-wrap:normal;hyphens:auto;padding:9px 4px;font-size:12px!important;line-height:1.4;text-align:center;text-wrap:balance;border:0;border-radius:8px;color:#45566c;background:transparent}
 html body[data-home-direction] #main .om-tabs button[aria-selected=true]{background:#fffdf7;color:#08276e;font-weight:750;box-shadow:0 2px 7px #08276e15}
 html body[data-home-direction] #main .om-custom-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
 html body[data-home-direction] #main .om-custom-media>img{border-radius:24px 0 0 0}
 html body[data-home-direction] #main .om-custom-copy{padding:0 6% 18px}
 html body[data-home-direction] #main .om-custom-copy h3{font-size:24px;line-height:1.25;margin-bottom:12px}
 html body[data-home-direction] #main .om-custom-copy>p{font-size:15px;line-height:1.65}
 html body[data-home-direction] #main .om-artwork-references{margin-top:12px;padding:24px 6% 10px;border-top:1px solid #08276e18}
 html body[data-home-direction] #main .om-artwork-cards{gap:0}
 html body[data-home-direction] #main .om-artwork-card{border:0;border-bottom:1px solid #08276e20;border-radius:0;background:transparent;box-shadow:none;padding:18px 0;gap:16px;grid-template-columns:minmax(80px,.8fr) minmax(0,1.5fr)}
 html body[data-home-direction] #main .om-artwork-card:hover{box-shadow:none;background:#fff9ed}
 html body[data-home-direction] #main .om-artwork-thumb{border-radius:9px}
 html body[data-home-direction] #main .om-artwork-card-copy{min-width:0}
 html body[data-home-direction] #main .om-artwork-card-copy strong{font-size:16px;line-height:1.4}
 html body[data-home-direction] #main .om-artwork-card-copy>span{font-size:13px;line-height:1.6}
 html body[data-home-direction] #main .om-process{background:#fbeaf0}
 html body[data-home-direction] #main .om-process-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;padding:0 12px 10px 48px;margin-top:22px;font-size:12px;line-height:1.5;color:#45566c}
 html body[data-home-direction] #main .om-process-head>span:first-child{display:none}
 html body[data-home-direction] #main .om-process ol{margin-top:0}
 html body[data-home-direction] #main .om-process li{background:transparent;padding-block:18px;row-gap:10px;align-items:start}
 html body[data-home-direction] #main .om-process li h3{font-size:17px;line-height:1.4}
 html body[data-home-direction] #main .om-process li>p{font-size:13px;line-height:1.6}
 html body[data-home-direction] #main .om-process li>p>small{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 html body[data-home-direction] #main .om-process .om-approval{background:#fff1bd;border-radius:8px}
 html body[data-home-direction] #main .om-routes article{padding-block:22px}
 html body[data-home-direction] #main .om-faq details{border:0;border-bottom:1px solid #08276e24;border-radius:0;padding:16px 0;background:transparent}
 html body:has(.om-page) .side-tools{position:relative;inset:auto;left:auto;right:auto;top:auto;bottom:auto;display:flex;align-items:flex-end;justify-content:center;margin:0;padding:16px 6%;background:#fffdf7;border-top:1px solid #08276e18;transform:none}
 html body:has(.om-page) .side-tools .quick-trigger{min-height:44px;min-width:132px;width:auto;padding:10px 18px;box-shadow:none;border-radius:8px;writing-mode:horizontal-tb;font-size:13px}
 html body:has(.om-page) .site-footer{padding-bottom:calc(32px + env(safe-area-inset-bottom))}
}

@media(max-width:760px){html body[data-home-direction] #main .om-scope a{display:grid;grid-template-columns:32px minmax(0,1fr);white-space:normal;overflow-wrap:anywhere;hyphens:auto;min-width:0}}
@media(max-width:360px){html body[data-home-direction] #main .om-scope>div{grid-template-columns:minmax(0,1fr);gap:12px}html body[data-home-direction] #main .om-scope a{font-size:14px}}

/* Mobile OEM hero follows the product-page reading sequence: title, product, explanation, action. */
@media(max-width:760px){
 html body[data-home-direction] #main .om-hero{display:flex;flex-direction:column;padding:28px 6% 24px;gap:0}
 html body[data-home-direction] #main .om-hero-copy{display:contents}
 html body[data-home-direction] #main .om-hero h1{order:0;font-size:30px;line-height:1.18;letter-spacing:-.03em;margin:0;max-width:100%}
 html[data-script=cjk] body[data-home-direction] #main .om-hero h1{font-size:28px;line-height:1.25;letter-spacing:0}
 html body[data-home-direction] #main .om-hero-scene{order:1;width:100%;margin-top:18px;gap:8px 14px}
 html body[data-home-direction] #main .om-hero-art{height:clamp(220px,64vw,275px)}
 html body[data-home-direction] #main .om-hero-scene:before{inset:2% 0 96px 14%;border-radius:55% 55% 8px 8px}
 html body[data-home-direction] #main .om-model{font-size:12px;padding-top:7px}
 html body[data-home-direction] #main .om-hero-copy>p{order:2;margin:16px 0 0;font-size:14px;line-height:1.6;max-width:none}
 html body[data-home-direction] #main .om-actions{order:3;width:100%;margin-top:16px}
 html body[data-home-direction] #main .om-actions .om-action{min-height:48px;padding:11px 9px}
 html body[data-home-direction] #main .om-scope{padding-top:18px;padding-bottom:22px}
}