@layer reset, tokens, base, layout, components, chrome, home, pages, motion, utilities, print;
/* 57-repair.css */
@layer pages {
[data-family="repair"]:not(.rm) { scroll-behavior: smooth; }
[data-family="repair"] .sr-hero { padding-block: clamp(40px, 7vw, 104px) clamp(48px, 6.4vw, 96px); text-align: center; }
[data-family="repair"] .sr-hero__in { display: grid; justify-items: center; }
[data-family="repair"] .sr-hero .crumbs ol { justify-content: center; margin-bottom: clamp(20px, 3vw, 32px); }
[data-family="repair"] .sr-hero__h { max-width: none; }
[data-family="repair"] .sr-hero__h .line { display: inline-block; }
[data-family="repair"] .sr-hero__lead { margin: clamp(16px, 2vw, 24px) auto 0; max-width: 27.5em; color: var(--fg-muted); text-wrap: balance; }
[data-family="repair"] .sr-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; margin: clamp(28px, 3.6vw, 44px) 0 0; padding: 0; list-style: none;
font-family: var(--font-small); font-size: 15px; line-height: 1.3; letter-spacing: -0.01em; color: var(--fg); }
[data-family="repair"] .sr-trust li { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
[data-family="repair"] .sr-trust__ic { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--c-red-tint); color: var(--c-red-text); flex: none; }
[data-family="repair"] .sr-trust__ic .icon { width: 12px; height: 12px; stroke-width: 2.4; }
@media (max-width: 479px) {
[data-family="repair"] .sr-trust { display: grid; grid-template-columns: max-content; justify-content: center; justify-items: start; gap: 10px; font-size: 15px; }
}
[data-family="repair"] .sr-ways { padding-block: clamp(56px, 7vw, 112px); }
[data-family="repair"] .sr-ways__grid { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) {
[data-family="repair"] .sr-ways__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
[data-family="repair"] .sr-way--primary { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
[data-family="repair"] .sr-ways__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: auto auto; gap: 24px; }
[data-family="repair"] .sr-way--primary { grid-column: 1; grid-row: 1 / span 2; }
}
[data-family="repair"] .sr-way { position: relative; overflow: clip; isolation: isolate; display: flex; flex-direction: column; gap: 20px;
border-radius: var(--r-md); background: var(--card); color: var(--fg); padding: clamp(24px, 3vw, 40px); min-height: 248px; }
[data-family="repair"] .sr-way__icon { display: block; color: var(--c-red-text); line-height: 0; }
[data-family="repair"] .sr-way__icon .icon { stroke-width: 1.4; }
[data-family="repair"] .sr-way__copy { margin-top: auto; }
[data-family="repair"] .sr-way__title { font-family: var(--font-lead); font-size: clamp(24px, 2.3vw, 30px); line-height: 1.14; letter-spacing: -0.016em; font-weight: 600; text-wrap: balance; max-width: 14em; }
[data-family="repair"] .sr-way__text { margin-top: 10px; font-size: 17px; line-height: 1.47; color: var(--fg-muted); max-width: 25em; text-wrap: pretty; }
[data-family="repair"] .sr-way__act { display: flex; }
[data-family="repair"] .sr-way__btn .icon { width: 16px; height: 16px; }
[data-family="repair"] .sr-way:not(.sr-way--primary) { box-shadow: var(--shadow-inset); }
[data-family="repair"] .sr-way--primary { background: var(--c-black); padding: clamp(28px, 3.6vw, 56px); gap: 28px; }
[data-family="repair"] .sr-way--primary::before { content: ""; position: absolute; z-index: -1; left: 50%; bottom: -46%; width: 150%; aspect-ratio: 2 / 1; transform: translateX(-50%);
background: radial-gradient(closest-side, var(--c-red-glow), transparent); pointer-events: none; }
[data-family="repair"] .sr-way--primary .sr-way__icon { color: var(--c-red-on-ink); }
[data-family="repair"] .sr-way__month { display: none; }
@media (min-width: 768px) {
[data-family="repair"] .sr-way__month { position: absolute; z-index: -1; top: clamp(28px, 3.6vw, 56px); right: clamp(28px, 3.6vw, 56px); display: grid;
grid-template-columns: repeat(7, 10px); gap: clamp(14px, 1.6vw, 22px); }
[data-family="repair"] .sr-way__month > span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, .16); }
[data-family="repair"] .sr-way__month > .on { background: var(--c-red-on-ink); box-shadow: 0 0 0 6px rgba(255, 105, 97, .14), 0 0 24px rgba(255, 105, 97, .45); }
}
[data-family="repair"] .sr-way--primary .sr-way__title { font-family: var(--font-display); font-size: clamp(32px, 3.9vw, 56px); line-height: 1.06; letter-spacing: -0.022em; max-width: 9em; }
[data-family="repair"] .sr-way--primary .sr-way__text { margin-top: 14px; font-family: var(--font-19); font-size: clamp(17px, 1.5vw, 21px); line-height: 1.45; color: var(--fg-body); max-width: 22em; }
[data-family="repair"] .sr-way--primary .sr-way__btn { height: 52px; padding-inline: 28px; }
@media (min-width: 1024px) { [data-family="repair"] .sr-way--primary { min-height: 540px; } }
@media (min-width: 768px) and (max-width: 1023px) { [data-family="repair"] .sr-way--primary { min-height: 360px; } }
@media (max-width: 767px) {
[data-family="repair"] .sr-way { min-height: 0; gap: 16px; }
[data-family="repair"] .sr-way--primary { gap: 22px; }
[data-family="repair"] .sr-way__copy { margin-top: 4px; }
[data-family="repair"] .sr-way__btn { width: 100%; }
}
[data-family="repair"] .sr-help { display: grid; gap: 0; margin-top: clamp(24px, 3vw, 40px); }
[data-family="repair"] .sr-help__item { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 56px; padding-block: 8px; font-size: 17px; line-height: 1.4; }
[data-family="repair"] .sr-help__item + .sr-help__item { border-top: 1px solid var(--hairline); }
[data-family="repair"] .sr-help__ic { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--c-white); color: var(--fg); box-shadow: var(--shadow-inset); flex: none; }
[data-family="repair"] .sr-help__q { color: var(--fg-muted); }
[data-family="repair"] .sr-help__link { color: var(--link); min-height: 44px; display: inline-flex; align-items: center; }
[data-family="repair"] a.sr-help__link:not(.link-more):hover { text-decoration: underline; text-underline-offset: 4px; }
@media (min-width: 768px) {
[data-family="repair"] .sr-help { grid-template-columns: repeat(2, minmax(0, max-content)); justify-content: center; column-gap: 56px; }
[data-family="repair"] .sr-help__item + .sr-help__item { border-top: 0; }
}
[data-family="repair"] .sr-book { padding-block: clamp(64px, 8vw, 128px); scroll-margin-top: calc(clamp(64px, 8vw, 128px) * -1 + 24px); }
[data-family="repair"] .sr-book__head { margin-bottom: clamp(32px, 4vw, 56px); }
[data-family="repair"] .sr-book__head .t-lead { margin-inline: auto; max-width: 30em; }
[data-family="repair"] .sr-cal { position: relative; isolation: isolate; width: 100%; max-width: 800px; margin-inline: auto; border-radius: var(--r-md); overflow: clip;
background: var(--c-white); box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), var(--shadow-soft); }
[data-family="repair"] .sr-cal__box { position: relative; z-index: 1; }
[data-family="repair"] .CWScheduling { width: 100% !important; max-width: 800px !important; margin: 0 auto; }
[data-family="repair"].js .CWScheduling { height: 1300px !important; min-height: 1300px !important; }
[data-family="repair"] .CWScheduling iframe { width: 100% !important; height: 100% !important; max-width: none !important; border: 0; display: block; visibility: visible; }
@media (max-width: 840px) { [data-family="repair"].js .CWScheduling { height: 1600px !important; min-height: 1600px !important; } }
[data-family="repair"] .CWScheduling { padding: 28px clamp(20px, 4vw, 40px); font-size: 15px; line-height: 1.5; color: var(--fg-muted); text-align: center; }
[data-family="repair"] .CWScheduling > a { color: var(--link); }
[data-family="repair"] .CWScheduling:has(iframe) { padding: 0; font-size: 0; line-height: 0; }
[data-family="repair"] .CWScheduling:has(iframe) > a { display: none; }
[data-family="repair"].js .sr-cal:not(.is-failed) .CWScheduling { visibility: hidden; }
[data-family="repair"] .sr-cal.is-failed .CWScheduling { visibility: visible; height: auto !important; min-height: 0 !important; }
[data-family="repair"] .sr-cal__skel { display: none; }
[data-family="repair"].js .sr-cal:not(.is-ready):not(.is-failed) .sr-cal__skel { display: grid; position: absolute; z-index: 0; inset: 0 0 auto; gap: 28px; padding: clamp(24px, 5vw, 56px); }
[data-family="repair"] .sr-cal__bar { display: flex; justify-content: space-between; gap: 16px; }
[data-family="repair"] .sr-cal__bar { width: 100%; max-width: 560px; justify-self: center; }
[data-family="repair"] .sr-cal__chip { display: block; width: 44%; height: 22px; border-radius: var(--r-pill); background: var(--c-gray-5); }
[data-family="repair"] .sr-cal__chip--short { width: 18%; }
[data-family="repair"] .sr-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: clamp(6px, 1.1vw, 10px); width: 100%; max-width: 560px; justify-self: center; }
[data-family="repair"] .sr-cal__day { height: 8px; margin: 0 22% 6px; border-radius: var(--r-pill); background: var(--c-gray-5); }
[data-family="repair"] .sr-cal__cell { aspect-ratio: 5 / 4; border-radius: 10px; background: var(--c-gray-6); box-shadow: inset 0 0 0 1px var(--c-gray-5); }
[data-family="repair"] .sr-cal__cell--on { background: var(--c-red-tint); box-shadow: inset 0 0 0 1px rgba(215, 0, 21, .22); }
[data-family="repair"] .sr-cal__rows { display: grid; gap: 12px; width: 100%; max-width: 560px; justify-self: center; }
[data-family="repair"] .sr-cal__rows span { display: block; height: 48px; border-radius: 12px; background: var(--c-gray-6); box-shadow: inset 0 0 0 1px var(--c-gray-5); }
[data-family="repair"] .sr-cal__rows span:nth-child(2) { width: 86%; }
[data-family="repair"] .sr-cal__rows span:nth-child(3) { width: 64%; }
@media screen and (prefers-reduced-motion: no-preference) {
[data-family="repair"]:not(.rm) .sr-cal.is-loading .sr-cal__skel > * { animation: sr-breathe 1.6s var(--ease-apple) infinite alternate; }
[data-family="repair"]:not(.rm) .sr-cal.is-loading .sr-cal__grid { animation-delay: .2s; }
[data-family="repair"]:not(.rm) .sr-cal.is-loading .sr-cal__rows { animation-delay: .4s; }
}
@keyframes sr-breathe { from { opacity: 1; } to { opacity: .45; } }
[data-family="repair"] .sr-book__fallback { margin-top: 20px; text-align: center; }
[data-family="repair"] .sr-book__fallback .link-ext { font-size: 15px; }
[data-family="repair"] .sr-status .t-h1 { max-width: 12em; }
[data-family="repair"] .sr-status__act { margin-top: 20px; }
[data-family="repair"] .sr-status__act .btn { --btn-2: var(--c-gray-6); --btn-2-hover-bg: var(--ghost); }
[data-family="repair"] .sr-status__act .btn .icon { width: 16px; height: 16px; }
@media print {
[data-family="repair"] .sr-way--primary::before, [data-family="repair"] .sr-cal__skel { display: none !important; }
[data-family="repair"] .sr-way { border: 1px solid #d2d2d7; break-inside: avoid; min-height: 0 !important; }
[data-family="repair"] .sr-cal { box-shadow: none; border: 1px solid #d2d2d7; }
[data-family="repair"] .CWScheduling { visibility: visible !important; height: auto !important; min-height: 0 !important; }
[data-family="repair"] .CWScheduling iframe { display: none !important; }
[data-family="repair"] .CWScheduling:has(iframe) { font-size: 12pt; line-height: 1.5; padding: 12pt; }
[data-family="repair"] .CWScheduling:has(iframe) > a { display: inline; }
}
}
