/* Greek page typography: use installed system fonts with full Greek glyph coverage. */
.vw-page-hero-fallback-tint,
.vw-tint-intro,
.vw-tint-visualizer,
.vw-tint-benefits,
.vw-service-gallery,
.vw-tint-cta {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.vw-tint-visualizer { padding: 96px 6vw 104px; border-top: 1px solid #242424; border-bottom: 1px solid #242424; background: #0a0a0a; }
.vw-tint-visualizer-head { margin-bottom: 38px; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(300px,.65fr); gap: 8vw; align-items: end; }
.vw-tint-visualizer-head h2 { margin: 10px 0 0; max-width: 850px; font-size: clamp(2.5rem,4.7vw,5rem); line-height: 1; letter-spacing: -.04em; }
.vw-tint-visualizer-head > p { margin: 0; color: #bcbcbc; font-size: 1rem; line-height: 1.75; }
.vw-tint-stage { position: relative; max-width: 1120px; margin: 0 auto; overflow: hidden; border: 1px solid #242424; background: #0b0b0b; }
.vw-tint-car { display: block; width: 100%; height: auto; margin: 0 auto; }
.vw-tint-glass-layer { --vw-tint-opacity: 0; fill: #03080b; opacity: var(--vw-tint-opacity); transition: opacity .35s ease; pointer-events: none; }
.vw-tint-stage-badge { position: absolute; z-index: 3; top: 18px; left: 18px; display: flex; align-items: center; gap: 10px; }
.vw-tint-stage-badge span { padding: 6px 8px; border: 1px solid rgba(255,255,255,.2); background: rgba(10,10,10,.58); color: #bbb; font-size: .62rem; font-weight: 700; letter-spacing: .14em; backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); }
.vw-tint-stage-badge strong { padding: 5px 8px; background: rgba(10,10,10,.58); color: #fff; font-size: .76rem; font-weight: 500; }
.vw-tint-stage-note { position: absolute; z-index: 3; top: auto; right: 18px; bottom: 5px; max-width: none; padding: 7px 9px; border: 1px solid rgba(255,255,255,.18); background: rgba(22,22,22,.88); color: #f0f0f0; font-size: .67rem; line-height: 1.45; text-align: right; white-space: nowrap; }
.vw-tint-controls { max-width: 1120px; margin: 14px auto 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.31fr); gap: 14px; }
.vw-tint-selector { min-width: 0; display: grid; grid-template-columns: repeat(9,minmax(66px,1fr)); border: 1px solid #282828; overflow: hidden; }
.vw-tint-option { min-height: 64px; padding: 9px 6px 8px; border: 0; border-right: 1px solid #282828; background: #101010; color: #fff; cursor: pointer; transition: background .2s ease,color .2s ease,box-shadow .2s ease; }
.vw-tint-option:last-child { border-right: 0; }
.vw-tint-option span { display: block; font-size: .94rem; font-weight: 600; }
.vw-tint-option small { display: block; margin-top: 4px; color: #727272; font-size: .58rem; line-height: 1.2; }
.vw-tint-option:hover { background: #181818; }
.vw-tint-option:focus-visible { position: relative; z-index: 2; outline: 2px solid #fff; outline-offset: -3px; }
.vw-tint-option.is-active { background: #f3f3f0; color: #080808; box-shadow: inset 0 -3px 0 #080808; }
.vw-tint-option.is-active small { color: #505050; }
.vw-tint-result { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #282828; background: #101010; }
.vw-tint-result-main { grid-column: 1 / -1; padding: 15px 17px; border-bottom: 1px solid #282828; }
.vw-tint-result-main span,.vw-tint-spec span { display: block; color: #707070; font-size: .61rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.vw-tint-result-main strong { display: block; margin-top: 6px; color: #fff; font-size: 1.05rem; line-height: 1.25; }
.vw-tint-result-main em { display: block; margin-top: 3px; color: #c1c1c1; font-size: .78rem; font-style: normal; }
.vw-tint-spec { padding: 13px 15px; border-right: 1px solid #282828; border-bottom: 1px solid #282828; }
.vw-tint-spec:nth-child(3),.vw-tint-spec:last-child { border-right: 0; }
.vw-tint-spec:nth-last-child(-n+2) { border-bottom: 0; }
.vw-tint-spec strong { display: block; margin-top: 6px; color: #fff; font-size: .86rem; }
.vw-tint-visualizer-foot { max-width: 1120px; margin: 20px auto 0; display: flex; justify-content: space-between; align-items: center; gap: 28px; }
.vw-tint-visualizer-foot p { max-width: 720px; margin: 0; color: #777; font-size: .73rem; line-height: 1.6; }

@media (max-width: 1150px) {
    .vw-tint-controls { grid-template-columns: 1fr; }
    .vw-tint-result { grid-template-columns: repeat(4,1fr); }
    .vw-tint-result-main { grid-column: auto; border-right: 1px solid #282828; border-bottom: 0; }
    .vw-tint-spec { border-bottom: 0; }
    .vw-tint-spec:nth-child(3) { border-right: 1px solid #282828; }
}

@media (max-width: 900px) {
    .vw-tint-visualizer-head { grid-template-columns: 1fr; gap: 28px; }
    .vw-tint-selector { display: flex; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; }
    .vw-tint-option { flex: 0 0 78px; }
    .vw-tint-result { grid-template-columns: repeat(2,1fr); }
    .vw-tint-result-main { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid #282828; }
    .vw-tint-spec { border-bottom: 1px solid #282828; }
    .vw-tint-spec:nth-child(3) { border-right: 0; }
    .vw-tint-spec:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (max-width: 680px) {
    .vw-tint-visualizer { padding: 62px 0 72px; }
    .vw-tint-visualizer-head { margin: 0 20px 26px; }
    .vw-tint-car { width: 100%; }
    .vw-tint-stage {
        width: 100%;
        max-width: none;
        margin: 0;
        border-left: 0;
        border-right: 0;
    }
    .vw-tint-stage-badge {
        position: static;
        min-height: 42px;
        box-sizing: border-box;
        padding: 8px 16px;
        gap: 9px;
        flex-direction: row;
        align-items: center;
        border-bottom: 1px solid #242424;
        background: #101010;
    }
    .vw-tint-stage-badge span { font-size: .58rem; }
    .vw-tint-stage-badge strong { font-size: .72rem; }
    .vw-tint-stage-note {
        position: static;
        display: block;
        max-width: none;
        padding: 9px 16px;
        border: 0;
        border-top: 1px solid #242424;
        background: #101010;
        color: #aaa;
        font-size: .68rem;
        line-height: 1.45;
        text-align: left;
        white-space: normal;
    }
    .vw-tint-controls { margin: 14px 16px 0; }
    .vw-tint-option { min-height: 60px; flex-basis: 72px; padding: 8px 5px 7px; }
    .vw-tint-option span { font-size: .9rem; }
    .vw-tint-option small { font-size: .55rem; }
    .vw-tint-result { grid-template-columns: 1fr 1fr; }
    .vw-tint-visualizer-foot { margin: 20px 20px 0; align-items: flex-start; flex-direction: column; }
}

@media (max-width: 460px) {
    .vw-tint-result { grid-template-columns: 1fr; }
    .vw-tint-result-main,.vw-tint-spec { grid-column: auto; border-right: 0 !important; border-bottom: 1px solid #282828 !important; }
    .vw-tint-spec:last-child { border-bottom: 0 !important; }
}
