/* Online Personal — original layout, typography and estimate component. */
.op-ux { --surface:#f5f6f3; --surface-warm:#fafbf9; }
.op-ux .section { padding-block:64px; }
.op-ux h2 { letter-spacing:-.035em; line-height:1.13; text-wrap:balance; }
.op-ux h1 { text-transform:none; text-wrap:balance; }
.op-ux .button { border-radius:10px; box-shadow:none; min-height:48px; }
.op-ux .section .eyebrow { color:#087a2c; letter-spacing:.09em; font-size:12px; }
.op-ux .service-card,.op-ux .city-service-card,.op-ux .card { border-color:#e3e7e1; border-radius:16px; box-shadow:none; }
.op-ux .service-card { padding:24px; background:#fff; transition:border-color .15s ease,transform .15s ease; }
.op-ux .service-card:hover { border-color:#12c143; transform:translateY(-2px); }
.op-ux .service-card strong { font-size:21px; letter-spacing:-.025em; }
.op-ux .service-card span { line-height:1.5; }
.op-ux .catalog-group { gap:32px; }
.op-ux .home-catalog { background:#f5f6f3; }
.op-ux .home-catalog h2 { max-width:820px; }
.op-ux .home-hero { background:#f7f8f5; color:#191919; min-height:0; padding:62px 0; }
.op-ux .home-hero::before { display:none; }
.op-ux .home-hero__grid { grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); gap:48px; min-height:0; }
.op-ux .home-hero h1 { color:#191919; font-size:clamp(40px,4.6vw,64px); line-height:1.04; letter-spacing:-.05em; margin:14px 0 24px; }
.op-ux .home-hero h1 span { color:#087a2c; }
.op-ux .home-hero .eyebrow { color:#087a2c; letter-spacing:.1em; font-size:12px; }
.op-ux .home-hero .lead { color:#505a53; max-width:590px; font-size:19px; line-height:1.6; }
.op-ux .home-hero__offer { color:#191919; margin-top:26px; }
.op-ux .home-hero__offer strong { font-size:22px; }
.op-ux .home-hero__offer p,.op-ux .home-hero__offer ul { color:#505a53; }
.op-ux .home-hero__offer ul { font-size:13px; font-weight:600; gap:9px 18px; margin:18px 0; }
.op-ux .home-hero__services-link { color:#191919; }
.op-ux .home-hero .button--outline { color:#191919; border:1px solid #ced7cb; background:transparent; }
.op-hero-photo { margin:0; position:relative; align-self:stretch; min-height:410px; border-radius:24px; overflow:hidden; background:#e2e6df; }
.op-hero-photo img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; }
.op-hero-photo figcaption { position:absolute; bottom:18px; left:18px; right:18px; padding:16px 20px; border-radius:12px; color:#191919; background:rgba(255,255,255,.95); font-weight:700; font-size:16px; }
.op-hero-photo figcaption small { display:block; margin-top:4px; color:#5f6862; font-size:13px; font-weight:400; }
.op-ux .service-hero { background:#191919; }
.op-ux .service-hero h1 { font-size:clamp(38px,4.4vw,60px); line-height:1.08; }
.op-ux .service-hero .lead { line-height:1.6; font-size:18px; max-width:740px; }
.op-ux .service-hero .hero__grid > div { padding-block:54px; }
.op-ux .service-hero,.op-ux .service-hero .hero__grid { min-height:460px; }
.op-ux .commercial-offer { box-shadow:none; border-radius:16px; }
.op-calc { scroll-margin-top:24px; background:#fff; }
.op-calc__heading { display:flex; gap:28px; justify-content:space-between; align-items:end; margin-bottom:28px; }
.op-calc__heading h2 { font-size:clamp(28px,3.2vw,42px); margin:8px 0 0; }
.op-calc__heading p { max-width:360px; margin:0; color:#5f6862; }
.op-calc__shell { border:1px solid #dfe5dd; border-radius:22px; overflow:hidden; background:#fff; }
.op-calc__toggle { list-style:none; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:24px 28px; cursor:pointer; font-size:22px; font-weight:750; letter-spacing:-.02em; }
.op-calc__toggle::-webkit-details-marker { display:none; }
.op-calc__toggle::after { content:'+'; font-size:28px; font-weight:400; }
.op-calc__shell[open] > .op-calc__toggle::after { content:'−'; }
.op-calc__toggle small { display:block; margin-top:5px; color:#5f6862; font-size:14px; font-weight:400; letter-spacing:normal; }
.op-calc__grid { display:grid; grid-template-columns:1fr 1fr; }
.op-calc__inputs { padding:30px; display:grid; gap:20px; align-content:start; }
.op-calc__place { margin:0; padding-bottom:15px; border-bottom:1px solid #e5e9e2; font-size:14px; color:#5f6862; }
.op-calc__fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.op-calc label { display:grid; gap:8px; font-size:14px; font-weight:650; }
.op-calc select,.op-calc input[type=number] { width:100%; min-width:0; min-height:48px; padding:12px; font:inherit; font-weight:400; color:#191919; background:#f8faf6; border:1px solid #cbd4c7; border-radius:9px; }
.op-calc__check { display:flex!important; align-items:start; gap:10px!important; font-weight:400!important; cursor:pointer; }
.op-calc input[type=checkbox] { width:20px; height:20px; flex:0 0 auto; accent-color:#087a2c; }
.op-calc__hint { color:#5f6862; font-size:13px; margin:0; }
.op-calc__result { background:#191f1b; color:#fff; padding:34px; display:flex; flex-direction:column; align-items:start; min-width:0; }
.op-calc__eyebrow { color:#9cdda8; text-transform:uppercase; font-size:12px; letter-spacing:.1em; }
.op-calc__amount { display:block; font-size:clamp(30px,3vw,44px); font-weight:750; line-height:1.15; letter-spacing:-.035em; min-height:102px; padding-top:20px; overflow-wrap:anywhere; }
.op-calc__formula { min-height:46px; margin:0 0 16px; font-size:16px; color:#d8e8dc; }
.op-calc__note { margin:0 0 24px; font-size:14px; color:#c2cec5; line-height:1.65; min-height:115px; }
.op-calc__result .button { width:100%; text-align:center; margin-top:auto; }
.op-calc__result .button:disabled { background:#435848; color:#cbd5ce; cursor:not-allowed; }
.op-calc__result a { color:#fff; text-underline-offset:4px; }
.op-calc__result .op-calc__next { margin:14px 0 0; font-size:14px; }
.op-calc__feedback { color:#bcefc7; min-height:40px; font-size:13px; margin:12px 0 0; }
.op-calc__summary { width:100%; margin-top:10px; }
.op-calc__summary summary { font-size:13px; color:#c2cec5; cursor:pointer; }
.op-calc textarea { width:100%; height:180px; margin-top:10px; padding:12px; border:1px solid #839489; border-radius:8px; background:#fff; color:#191919; font:13px/1.5 inherit; resize:vertical; }
.op-calc__fallback { padding:22px 28px; }
.op-calc :is(input,select,textarea,button,summary,a):focus-visible { outline:3px solid #12c143; outline-offset:3px; }
.op-ux .op-steps { background:#f5f6f3; }
@media(min-width:1000px) { .op-ux .header__main { min-height:90px; } }
@media(max-width:760px) {
 .op-ux .section { padding-block:40px; }
 .op-ux .home-hero { padding:34px 0; }
 .op-ux .home-hero__grid { grid-template-columns:1fr; gap:26px; }
 .op-ux .home-hero h1 { font-size:39px; }
 .op-ux .home-hero .lead { font-size:17px; }
 .op-hero-photo { min-height:240px; }
 .op-ux .service-hero .hero__grid > div { padding-block:34px; }
 .op-ux .service-hero h1 { font-size:36px; }
 .op-ux .service-hero .lead { font-size:17px; }
 .op-calc__heading { display:block; }
 .op-calc__heading p { margin-top:14px; }
 .op-calc__grid { grid-template-columns:1fr; }
 .op-calc__inputs,.op-calc__result { padding:22px; }
 .op-calc__toggle { padding:22px; font-size:20px; }
 .op-calc__fields { gap:12px; }
 .op-calc__amount { min-height:94px; font-size:34px; }
 .op-calc__note { min-height:0; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .op-ux * { animation:none!important; transition:none!important; } }
