/* =========================================================================
   «Гараж» — the Services, Portfolio and Team modules re-dressed:
   square bevelled cards, the wide face for titles, the HUD mono for
   prices and meta, target corners on photos on hover.
   ========================================================================= */

/* ---- Services -------------------------------------------------------- */

body.gz-body .svc-card {
    border-radius: 0;
    border: 0;
    background: var(--gz-sheen) top / 100% 1px no-repeat, var(--c-surface);
    transition: background-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
html[data-garazh-cards="bevel"] body.gz-body .svc-card {
    clip-path: polygon(0 0, calc(100% - var(--gz-cut)) 0, 100% var(--gz-cut), 100% 100%, var(--gz-cut) 100%, 0 calc(100% - var(--gz-cut)));
}
body.gz-body .svc-card:hover { box-shadow: inset 0 -3px 0 var(--gz-accent); }
body.gz-body .svc-card__media { border-radius: 0; overflow: hidden; }
body.gz-body .svc-card__media img { transition: transform 600ms var(--ease), filter 600ms var(--ease); filter: saturate(0.85) contrast(1.05); }
body.gz-body .svc-card:hover .svc-card__media img { transform: scale(1.05); filter: none; }
body.gz-body .svc-card__title {
    font-family: var(--font-display);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    line-height: 1.2;
}
body.gz-body .svc-card__title a { color: var(--c-text-strong); }
body.gz-body .svc-card__text { color: var(--c-text-muted); }
body.gz-body .svc-card__amount { font-family: var(--gz-hud); font-weight: 700; color: var(--gz-accent); }
body.gz-body .svc-card__unit { font-family: var(--gz-hud); font-size: 0.72rem; color: var(--c-text-muted); }
body.gz-body .svc-card__arrow { border-radius: 0; border-color: var(--c-border-strong); color: var(--c-text-strong); }
body.gz-body .svc-card:hover .svc-card__arrow { background: var(--gz-accent); border-color: var(--gz-accent); color: var(--gz-ink); }
body.gz-body .svc-card__icon { border-radius: 0; background: color-mix(in srgb, var(--gz-accent) 12%, transparent); color: var(--gz-accent); }
body.gz-body .svc-badge {
    border-radius: 0;
    font-family: var(--gz-hud);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
body.gz-body .svc-badge--hit { background: var(--gz-accent); color: var(--gz-ink); }
body.gz-body .svc-badge--new { background: var(--gz-chrome); color: var(--gz-ink); }

/* A mosaic when the count is 2 + 4k (6, 10, 14): two wide cards on top. */
@media (min-width: 64rem) {
    body.gz-body .svc-list--image .svc-grid--4:has(> li:nth-child(4n + 2):last-child) {
        grid-template-columns: repeat(12, minmax(0, 1fr));
    }
    body.gz-body .svc-list--image .svc-grid--4:has(> li:nth-child(4n + 2):last-child) > li { grid-column: span 3; }
    body.gz-body .svc-list--image .svc-grid--4:has(> li:nth-child(4n + 2):last-child) > li:nth-child(-n + 2) { grid-column: span 6; }
    body.gz-body .svc-list--image .svc-grid--4:has(> li:nth-child(4n + 2):last-child) > li:nth-child(-n + 2) .svc-card__media { aspect-ratio: 16 / 8; }
    body.gz-body .svc-list--image .svc-grid--4:has(> li:nth-child(4n + 2):last-child) > li:nth-child(-n + 2) .svc-card__title { font-size: 1.25rem; }
}

/* Service page and prices */
body.gz-body .svc-price-table,
body.gz-body .svc-prices { font-family: var(--font-ui); }
body.gz-body :is(.svc-prices__price, .svc-price__value, .svc-hero__price) { font-family: var(--gz-hud); color: var(--gz-accent); }
body.gz-body :is(.svc-step__num, .svc-steps__num) { border-radius: 0; background: var(--gz-accent); color: var(--gz-ink); font-family: var(--gz-hud); }

/* ---- Portfolio ------------------------------------------------------- */

body.gz-body .pf-card { border-radius: 0; background: transparent; }
body.gz-body .pf-card__media { position: relative; border-radius: 0; overflow: hidden; }
body.gz-body .pf-card__media::after {
    content: '';
    position: absolute;
    inset: 12px;
    pointer-events: none;
    background:
        linear-gradient(var(--gz-accent), var(--gz-accent)) top left / 20px 2px no-repeat,
        linear-gradient(var(--gz-accent), var(--gz-accent)) top left / 2px 20px no-repeat,
        linear-gradient(var(--gz-accent), var(--gz-accent)) bottom right / 20px 2px no-repeat,
        linear-gradient(var(--gz-accent), var(--gz-accent)) bottom right / 2px 20px no-repeat;
    opacity: 0;
    transition: opacity var(--dur) var(--ease), inset 300ms var(--ease);
}
body.gz-body .pf-card:hover .pf-card__media::after { opacity: 1; inset: 18px; }
html[data-garazh-hud="off"] body.gz-body .pf-card__media::after { display: none; }
body.gz-body .pf-card__img { transition: transform 600ms var(--ease); }
body.gz-body .pf-card:hover .pf-card__img { transform: scale(1.04); }
body.gz-body .pf-card__go { border-radius: 0; background: var(--gz-accent); color: var(--gz-ink); }
body.gz-body .pf-card__cats {
    font-family: var(--gz-hud);
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    color: var(--gz-accent);
}
body.gz-body .pf-card__title {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.2;
}
body.gz-body .pf-card__title a { color: var(--c-text-strong); }
body.gz-body .pf-card__meta { font-family: var(--gz-hud); font-size: 0.72rem; color: var(--c-text-faint); }
body.gz-body :is(.pf-filter__btn, .pf-chip) { border-radius: 0; }
body.gz-body :is(.pf-metric__value, .pf-metrics__value) { font-family: var(--font-display); color: var(--gz-accent); }

/* ---- Team ------------------------------------------------------------ */

body.gz-body .team-card {
    border-radius: 0;
    border: 0;
    background: var(--gz-sheen) top / 100% 1px no-repeat, var(--c-surface);
}
html[data-garazh-cards="bevel"] body.gz-body .team-card {
    clip-path: polygon(0 0, calc(100% - var(--gz-cut)) 0, 100% var(--gz-cut), 100% 100%, var(--gz-cut) 100%, 0 calc(100% - var(--gz-cut)));
}
body.gz-body .team-card__media,
body.gz-body .team-card__photo { border-radius: 0; }
body.gz-body .team-card__photo img { filter: grayscale(0.35) contrast(1.05); transition: filter 500ms var(--ease); }
body.gz-body .team-card:hover .team-card__photo img { filter: none; }
body.gz-body .team-card__badge {
    border-radius: 0;
    background: var(--gz-accent);
    color: var(--gz-ink);
    font-family: var(--gz-hud);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
body.gz-body .team-card__name {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
}
body.gz-body .team-card__name a { color: var(--c-text-strong); }
body.gz-body .team-card__position { color: var(--gz-chrome); font-weight: 500; }
body.gz-body .team-card__meta { font-family: var(--gz-hud); font-size: 0.74rem; color: var(--c-text-muted); }
body.gz-body .team-card__meta .cms-icon { color: var(--gz-accent); }
body.gz-body .team-card__actions .cms-btn { width: 100%; padding-inline: 0.8rem; font-size: 0.66rem; }

/* ---- Booking (shared block) -------------------------------------------- */

body.gz-body .cms-block--booking :is(.cms-booking__service, .cms-booking__specialist, .cms-booking__slot, .cms-booking__day) { border-radius: 0; }
body.gz-body .cms-block--booking :is(.cms-booking__step-title, .cms-booking__legend, legend) {
    font-family: var(--gz-hud);
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gz-accent);
}
body.gz-body .cms-block--booking input:checked + * { border-color: var(--gz-accent); box-shadow: inset 0 3px 0 var(--gz-accent); }
