@import url("css/base/site.css?v=20260824-mobile-readability");
@import url("css/pages/home.css?v=20260831-seo-heading-structure");
@import url("css/pages/services.css?v=20260815-service-pattern");
@import url("css/pages/price.css");
@import url("css/pages/gallery.css?v=20260814-heading-position");
@import url("css/pages/work-detail.css?v=20260824-before-after");

/* 全ページ共通：アイボリーの画面になじむ、明るいベージュのボタン */
:root {
    --button-soft-bg: #eee2cf;
    --button-soft-border: #d2bfa2;
    --button-soft-text: #3d4d5c;
    --button-soft-hover: #fffdf8;
}

:where(
    .btn-header-contact,
    .floating-contact-button,
    .floating-home-button,
    .hero-consult-link,
    .home-consult-actions a,
    .service-small-jobs a,
    .service-guide-cta a,
    .btn-submit,
    .btn-more,
    .btn-recruit-link,
    .work-detail-back a,
    .work-detail-gallery-nav,
    .works-carousel-nav
) {
    color: var(--button-soft-text) !important;
    border-color: var(--button-soft-border) !important;
    background: var(--button-soft-bg) !important;
    box-shadow: none;
    transition: color .22s ease, background-color .22s ease, border-color .22s ease, transform .22s ease, opacity .22s ease, visibility .22s ease;
}

body:not(.subpage) .floating-contact-button.is-hidden-by-consult {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(14px) scale(.94);
}

:where(
    .btn-header-contact,
    .floating-contact-button,
    .floating-home-button,
    .hero-consult-link,
    .home-consult-actions a,
    .service-small-jobs a,
    .service-guide-cta a,
    .btn-submit,
    .btn-more,
    .btn-recruit-link,
    .work-detail-back a,
    .work-detail-gallery-nav,
    .works-carousel-nav
):hover {
    color: var(--button-soft-text) !important;
    border-color: var(--button-soft-border) !important;
    background: var(--button-soft-hover) !important;
}

:where(
    .btn-header-contact,
    .floating-contact-button,
    .floating-home-button,
    .hero-consult-link,
    .home-consult-actions a,
    .service-small-jobs a,
    .service-guide-cta a,
    .btn-submit,
    .btn-more,
    .btn-recruit-link,
    .work-detail-back a,
    .work-detail-gallery-nav,
    .works-carousel-nav
):focus-visible {
    outline: 3px solid rgba(185, 155, 112, .35);
    outline-offset: 3px;
}

.btn-more .arrow,
.btn-more:hover .arrow {
    background-color: var(--button-soft-text) !important;
}

.btn-more .arrow::after,
.btn-more:hover .arrow::after {
    border-color: var(--button-soft-text) !important;
}
