.studio-home #roky-warranty { padding: 0 40px 56px; background: #fff; scroll-margin-top: 88px; }
#roky-warranty .roky-warranty-banner { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 64px minmax(0,1fr) 181px; align-items: center; gap: 24px; max-width: 1320px; margin: 0 auto; padding: 28px 32px; border: 1px solid #41413f; border-radius: 14px; background: #222; color: #fff; }
#roky-warranty .roky-warranty-banner::after { content: ''; position: absolute; z-index: -1; inset: 0 0 0 65%; opacity: .16; background-image: radial-gradient(#69c4b4 1px,transparent 1px); background-size: 12px 12px; pointer-events: none; mask-image: linear-gradient(to right,transparent,#000); }
#roky-warranty .roky-warranty-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: #00c7b1; color: #fff; }
#roky-warranty .roky-warranty-icon svg { width: 32px; height: 32px; }
#roky-warranty .roky-warranty-copy { min-width: 0; }
#roky-warranty h2 { margin: 0 0 8px; color: #fff; font: 700 clamp(30px,2.8vw,40px)/1.15 InterVariable,'PingFang HK','Microsoft JhengHei',sans-serif; letter-spacing: -.025em; }
#roky-warranty p { margin: 0; color: #dededb; font-size: 16px; line-height: 1.5; }
.studio-home #roky-warranty .roky-warranty-cta { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 181px; height: 48px; padding: 0 12px; border: 1px solid #00c7b1; border-radius: 5px; background: #00c7b1; color: #fff; font: 700 14px/1.2 InterVariable,'PingFang HK','Microsoft JhengHei',sans-serif; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: background-color .2s,color .2s; }
.studio-home #roky-warranty .roky-warranty-cta:hover { background: #fff; color: #008b7d; border-color: #00c7b1; }
.studio-home #roky-warranty .roky-warranty-cta:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
html[lang^="zh"] #roky-warranty h2 { letter-spacing: normal; }
@media(max-width:1100px) { #roky-warranty .roky-warranty-banner { grid-template-columns: 56px minmax(0,1fr) 181px; gap: 20px; padding: 28px; } #roky-warranty .roky-warranty-icon { width: 56px; height: 56px; } #roky-warranty h2 { font-size: 30px; } }
@media(max-width:900px) { .studio-home #roky-warranty { padding: 0 24px 48px; } }
@media(max-width:700px) { .studio-home #roky-warranty { padding: 0 20px 40px; } #roky-warranty .roky-warranty-banner { grid-template-columns: minmax(0,1fr); padding: 28px 24px; gap: 20px; } .studio-home #roky-warranty .roky-warranty-cta { width: 100%; } #roky-warranty p { font-size: 15px; } #roky-warranty h2 { font-size: 30px; } #roky-warranty .roky-warranty-banner::after { inset-inline-start: 40%; } }
@media(prefers-reduced-motion:reduce) { .studio-home #roky-warranty .roky-warranty-cta { transition: none; } }