/* Springsan Home / Section 10 / Why Choose V1
 * Exclusively scoped to .spr-site .spr-why-choose.
 * Existing common_base.css, Header, Sections 01–09 and later Footer remain untouched.
 */
.spr-site .spr-why-choose {
    --spr10-blue: var(--spr-primary, #439fe0);
    --spr10-font: var(--spr-font, Arial, sans-serif);
    position: relative;
    isolation: isolate;
    width: 100%;
    min-width: 0;
    min-height: clamp(24rem, 31vw, 38rem);
    color: #fff;
    background-color: #1b1b1b;
    overflow: hidden;
}
.spr-site .spr-why-choose__photo {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: -1;
    /* CMS photo is already darkened; no extra overlay/filter is applied. */
}
.spr-site .spr-why-choose__container {
    position: relative;
    z-index: 1;
    padding-top: clamp(3.6rem, 4.75vw, 5.6rem);
    padding-bottom: clamp(3.8rem, 5.25vw, 6.3rem);
}
.spr-site .spr-why-choose__header {
    max-width: 64rem;
    margin-bottom: clamp(2.8rem, 4vw, 4.8rem);
}
.spr-site .spr-why-choose__title {
    margin: 0 0 .7rem;
    color: var(--spr10-blue);
    font: 650 clamp(1.75rem, 2.25vw, 2.65rem)/1.25 var(--spr10-font);
    letter-spacing: -.025em;
    overflow-wrap: anywhere;
}
/* If CMS authors a blue phrase using <span>, the remaining title stays white. */
.spr-site .spr-why-choose__title--has-span { color: #f8f8f8; }
.spr-site .spr-why-choose__title span { color: var(--spr10-blue); }
.spr-site .spr-why-choose__subtitle {
    margin: 0;
    font: 400 clamp(.86rem, 1vw, 1.08rem)/1.7 var(--spr10-font);
    color: #e1e1e1;
    max-width: 57rem;
}
.spr-site .spr-why-choose__advantages {
    max-width: 69rem;
    --bs-gutter-x: clamp(2rem, 4.2vw, 5.8rem);
    --bs-gutter-y: clamp(2.1rem, 3.5vw, 4.1rem);
}
.spr-site .spr-why-choose__column { min-width: 0; }
.spr-site .spr-why-choose__advantage { min-width: 0; }
.spr-site .spr-why-choose__advantage-heading {
    position: relative;
    margin: 0 0 .55rem;
    font: 650 clamp(.96rem, 1.12vw, 1.23rem)/1.5 var(--spr10-font);
}
.spr-site .spr-why-choose__trigger {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .85rem;
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    color: #fafafa;
    text-align: left;
    font: inherit;
    cursor: pointer;
}
.spr-site .spr-why-choose__trigger::after {
    content: "";
    position: absolute;
    top: calc(50% - .5px);
    left: 2.15rem;
    width: .9rem;
    height: 1px;
    background: rgba(122,194,242,.55);
    opacity: .65;
    pointer-events: none;
}
.spr-site .spr-why-choose__node {
    position: relative;
    z-index: 1;
    display: inline-flex;
    width: 2.2rem;
    height: 2.2rem;
    flex: 0 0 2.2rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--spr10-blue);
    border-radius: 50%;
    background: var(--spr10-blue);
    color: #fff;
    font: 650 .72rem/1 var(--spr10-font);
    letter-spacing: .01em;
    transition: background-color .2s, box-shadow .2s, transform .2s;
}
.spr-site .spr-why-choose__advantage-name {
    position: relative;
    z-index: 1;
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
    transition: color .2s;
}
.spr-site .spr-why-choose__advantage-desc {
    max-width: 33rem;
    margin: 0 0 0 3.05rem;
    color: #e7e7e7;
    font: 400 clamp(.82rem, .95vw, 1rem)/1.7 var(--spr10-font);
    overflow-wrap: anywhere;
}
.spr-site .spr-why-choose__trigger:hover .spr-why-choose__advantage-name,
.spr-site .spr-why-choose__trigger:focus-visible .spr-why-choose__advantage-name,
.spr-site .spr-why-choose__advantage.is-selected .spr-why-choose__advantage-name {
    color: var(--spr10-blue);
}
.spr-site .spr-why-choose__trigger:hover .spr-why-choose__node,
.spr-site .spr-why-choose__trigger:focus-visible .spr-why-choose__node,
.spr-site .spr-why-choose__advantage.is-selected .spr-why-choose__node {
    box-shadow: 0 0 0 4px rgba(67,159,224,.22);
    transform: scale(1.05);
}
.spr-site .spr-why-choose__trigger:focus-visible {
    outline: 2px solid var(--spr10-blue);
    outline-offset: 5px;
}
@media (max-width: 991.98px) {
    .spr-site .spr-why-choose { min-height: 0; }
    .spr-site .spr-why-choose__container { padding-top: 3.5rem; padding-bottom: 3.7rem; }
    .spr-site .spr-why-choose__header { margin-bottom: 2.4rem; }
    .spr-site .spr-why-choose__advantages { max-width: 100%; }
}
@media (max-width: 575.98px) {
    .spr-site .spr-why-choose__container { padding-top: 3.1rem; padding-bottom: 3.35rem; }
    .spr-site .spr-why-choose__header { margin-bottom: 2.1rem; }
    .spr-site .spr-why-choose__advantages { --bs-gutter-y: 1.8rem; }
    .spr-site .spr-why-choose__advantage-heading { font-size: 1rem; }
    .spr-site .spr-why-choose__advantage-desc { font-size: .875rem; }
}
@media (prefers-reduced-motion: reduce) {
    .spr-site .spr-why-choose__node, .spr-site .spr-why-choose__advantage-name { transition: none; }
}