/* Phone and tablet layouts and consistent high-contrast hero labels. */
html[data-layout-concept="onyx-spotlight"] .home-page .hero-copy h1,
html[data-layout-concept="onyx-spotlight"] .home-page .hero-copy h1 span,
html[data-color-preview] .home-page .hero-copy h1,
html[data-color-preview] .home-page .hero-copy h1 span{color:#fff!important}
html[data-layout-concept="onyx-spotlight"] .home-page .hero-visual .orbit .num,
html[data-layout-concept="onyx-spotlight"] .home-page .hero-visual .orbit b,
html[data-layout-concept="onyx-spotlight"] .home-page .hero-visual .orbit small,
html[data-color-preview] .home-page .hero-visual .orbit .num,
html[data-color-preview] .home-page .hero-visual .orbit b,
html[data-color-preview] .home-page .hero-visual .orbit small{color:#fff!important}
html[data-layout-concept="onyx-spotlight"] .home-page .hero-visual .orbit .num,
html[data-color-preview] .home-page .hero-visual .orbit .num{display:block!important;visibility:visible!important;opacity:1!important}
@media(max-width:1024px){.top .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:5px 16px}.top .wrap a[href^="tel:"]{display:inline-block!important;visibility:visible!important;white-space:nowrap}.home-page .hero,.home-page .hero-visual{min-width:0}.home-page .orbit{min-width:0}.home-page .orbit b,.home-page .orbit small{overflow-wrap:anywhere}.home-page .hero-copy,.home-page .hero-visual{max-width:100%}}
@media(max-width:767px){.top .wrap{justify-content:space-between}.top .wrap a{font-size:clamp(12px,3.5vw,15px)}html[data-layout-concept] .home-page .hero>.hero-visual{grid-template-columns:minmax(0,1fr)!important}html[data-layout-concept] .home-page .hero-visual>a.orbit{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px 14px;text-align:left;border-bottom:1px solid #ffffff40;padding:16px 0}html[data-layout-concept] .home-page .hero-visual>a.orbit .num{grid-column:1;grid-row:1}html[data-layout-concept] .home-page .hero-visual>a.orbit b{grid-column:2;grid-row:1}html[data-layout-concept] .home-page .hero-visual>a.orbit small{grid-column:2;grid-row:2}html[data-layout-concept] .home-page .hero-visual>a.orbit>span:last-child:not(.num){display:none}.home-page .hero-visual .visual-label{text-align:left}.color-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.color-option{min-width:0;overflow-wrap:anywhere}}
@media(max-width:360px){.top .wrap{justify-content:flex-start}.top .wrap a{font-size:12px}.color-grid{gap:10px}.color-option{padding:10px}.color-option strong{font-size:14px}}