/* Базовый макет. Ниже идут переопределения тем, адаптивности и формы; порядок каскада значим. */
:root{--bg:#0b0d0f;--panel:#13171a;--panel2:#191f23;--line:#2a3135;--text:#f3f5f4;--muted:#a7b0b3;--lime:#c8ff35;--lime2:#9fd51e;--red:#ff6b5b;--radius:22px;}
    *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.45;font-size:16px} a{color:inherit;text-decoration:none} button,input,select{font:inherit} button{cursor:pointer;border:0} .wrap{max-width:1180px;margin:auto;padding:0 28px}
    .topbar{border-bottom:1px solid rgba(255,255,255,.09);background:rgba(11,13,15,.88);backdrop-filter:blur(12px);position:sticky;top:0;z-index:20}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:-.02em}.brand-mark{width:34px;height:34px;border-radius:11px;background:var(--lime);display:grid;place-items:center}.brand-mark svg{width:24px}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:500;letter-spacing:.02em}.navlinks{display:flex;gap:26px;color:#c7ced0;font-size:14px}.navlinks a:hover{color:var(--accent)}.nav-right{display:flex;align-items:center;gap:18px}.phone{font-weight:750;white-space:nowrap}.phone span{display:block;color:var(--muted);font-size:11px;font-weight:500;text-align:right}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:13px;padding:13px 18px;font-weight:750;transition:.2s ease}.btn-primary{background:var(--lime);color:#0b0d0f}.btn-primary:hover{background:#d8ff71;transform:translateY(-1px)}.btn-ghost{border:1px solid var(--line);color:var(--text);background:transparent}.btn-ghost:hover{border-color:#79868b;background:#1b2226}
    .hero{padding:52px 0 34px;background:radial-gradient(850px 450px at 8% 0%,rgba(200,255,53,.11),transparent 68%),radial-gradient(600px 400px at 90% 20%,rgba(69,99,110,.18),transparent 68%)}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:46px;align-items:center}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.dot{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 5px rgba(200,255,53,.1)}h1{font-size:clamp(42px,5.7vw,75px);line-height:.98;letter-spacing:-.055em;margin:16px 0 22px;max-width:700px}h1 em{font-style:normal;color:var(--accent)}.lead{font-size:19px;color:#c8d0d2;max-width:600px;margin:0 0 28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.proof-row{display:flex;gap:22px;flex-wrap:wrap;margin-top:32px;color:var(--muted);font-size:13px}.proof-row strong{display:block;color:var(--text);font-size:17px;margin-bottom:2px}.hero-visual{position:relative;min-height:480px;border-radius:28px;overflow:hidden;background:#151b1e;border:1px solid rgba(255,255,255,.12);box-shadow:0 30px 80px rgba(0,0,0,.32)}.hero-visual img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:.63;filter:saturate(.82) contrast(1.05)}.hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,10,11,.05) 12%,rgba(7,10,11,.85) 86%)}.visual-copy{position:absolute;z-index:2;left:28px;right:28px;bottom:26px}.visual-copy h2{font-size:28px;line-height:1.05;letter-spacing:-.03em;margin:0 0 10px}.visual-copy p{color:#c1c9ca;margin:0;font-size:14px;max-width:310px}.floating-badge{position:absolute;z-index:3;top:22px;right:22px;background:rgba(11,13,15,.76);border:1px solid rgba(200,255,53,.45);border-radius:14px;padding:12px 14px;font-size:12px;color:#eaf8c1}.floating-badge b{display:block;color:var(--accent);font-size:19px}
    .estimate-card{margin-top:22px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:0 18px 45px rgba(0,0,0,.22)}.estimate-card h3{margin:0 0 5px;font-size:20px;letter-spacing:-.02em}.estimate-card .hint{color:var(--muted);font-size:13px;margin-bottom:17px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:12px;color:var(--muted)}.field input,.field select{background:#0c1012;border:1px solid var(--line);border-radius:11px;color:var(--text);padding:12px 11px;outline:none}.field input:focus,.field select:focus{border-color:var(--accent)}.full{grid-column:1/-1}.estimate-card .btn{width:100%;margin-top:14px}.micro{font-size:11px;color:#7f8b8e;text-align:center;margin:10px 0 0}.result{display:none;margin-top:14px;padding:13px 14px;border-radius:13px;background:rgba(200,255,53,.1);border:1px solid rgba(200,255,53,.4);color:#eaffb4;font-size:14px}.result strong{display:block;color:var(--accent);font-size:20px;margin-top:2px}
    .trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#101416}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:20px 0}.trust-item{display:flex;gap:11px;align-items:flex-start}.trust-icon{width:28px;height:28px;border-radius:9px;background:rgba(200,255,53,.12);color:var(--accent);display:grid;place-items:center;font-weight:800;flex:none}.trust-item b{display:block;font-size:14px}.trust-item span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
    section{padding:82px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:30px}.kicker{font-size:12px;color:var(--accent);font-weight:800;letter-spacing:.12em;text-transform:uppercase}.section-head h2{font-size:clamp(30px,4vw,48px);line-height:1.03;letter-spacing:-.045em;margin:9px 0 0;max-width:640px}.section-head p{color:var(--muted);max-width:350px;margin:0}.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.case{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:21px}.case-top{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-size:12px}.case h3{margin:19px 0 4px;font-size:22px}.case p{color:var(--muted);font-size:14px;margin:0 0 20px}.price-row{display:flex;align-items:end;justify-content:space-between;border-top:1px solid var(--line);padding-top:15px}.price-row span{font-size:12px;color:var(--muted)}.price-row strong{color:var(--accent);font-size:24px;letter-spacing:-.03em}
    .service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.service{background:#121719;border:1px solid var(--line);border-radius:16px;padding:18px;min-height:146px;transition:.2s}.service:hover{border-color:#53636a;transform:translateY(-2px)}.service .num{color:var(--accent);font-weight:800;font-size:12px}.service h3{font-size:17px;margin:24px 0 6px}.service p{color:var(--muted);font-size:13px;margin:0}.compare{display:grid;grid-template-columns:1fr 1fr;gap:14px}.compare-card{border-radius:20px;border:1px solid var(--line);padding:24px;background:var(--panel)}.compare-card.highlight{background:linear-gradient(145deg,rgba(200,255,53,.12),rgba(19,23,26,.9) 55%);border-color:rgba(200,255,53,.5)}.compare-card h3{margin:0 0 16px;font-size:20px}.compare-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}.compare-list li{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:10px;font-size:14px}.compare-list li span{color:var(--muted)}.compare-list li b{font-weight:700;text-align:right}.faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}.faq details{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}.faq summary{cursor:pointer;font-weight:700}.faq p{color:var(--muted);font-size:14px;margin:12px 0 2px}
    .cta{padding:0 0 82px}.cta-box{border-radius:26px;background:var(--lime);color:#0b0d0f;padding:38px 42px;display:flex;justify-content:space-between;align-items:center;gap:30px}.cta-box h2{font-size:clamp(30px,4vw,52px);letter-spacing:-.05em;line-height:1;margin:0 0 12px;max-width:630px}.cta-box p{margin:0;color:#29320f;max-width:560px}.cta-box .btn{background:#0b0d0f;color:var(--accent);white-space:nowrap}.footer{border-top:1px solid var(--line);padding:28px 0 36px;color:var(--muted);font-size:13px}.footer-row{display:flex;justify-content:space-between;gap:20px;align-items:center}.footer a:hover{color:var(--text)}
    @media(max-width:950px){.navlinks{display:none}.hero-grid{grid-template-columns:1fr}.hero-visual{min-height:380px}.trust-grid{grid-template-columns:repeat(2,1fr)}.service-grid{grid-template-columns:repeat(2,1fr)}.cases{grid-template-columns:1fr 1fr}.cta-box{align-items:flex-start;flex-direction:column}}
    @media(max-width:620px){.wrap{padding:0 17px}.nav{height:68px}.phone{display:none}.hero{padding-top:36px}h1{font-size:45px}.lead{font-size:17px}.hero-visual{min-height:330px}.fields{grid-template-columns:1fr}.full{grid-column:auto}.trust-grid,.cases,.compare,.faq{grid-template-columns:1fr}.service-grid{grid-template-columns:1fr 1fr}.section-head{display:block}.section-head p{margin-top:15px}.cta-box{padding:28px 22px}.footer-row{align-items:flex-start;flex-direction:column}}

/* Theme palette: lime remains the button fill; accent text uses a darker green on white. */
:root { color-scheme: dark; --accent: #c8ff35; }
:root[data-theme="light"] { color-scheme: light; --bg: #ffffff; --panel: #f6f7f8; --panel2: #edf0f2; --line: #d3dadd; --text: #172026; --muted: #53636b; --accent: #486500; }
[data-theme="light"] .topbar { background: rgb(255 255 255 / 92%); border-color: var(--line); }
[data-theme="light"] .navlinks, [data-theme="light"] .lead { color: #43535c; }
[data-theme="light"] .navlinks a:hover { color: var(--accent); }
[data-theme="light"] .btn-ghost:hover { background: #edf0f2; }
[data-theme="light"] .field input, [data-theme="light"] .field select { background: #fff; }
[data-theme="light"] .field input::placeholder { color: #68767e; }
[data-theme="light"] .micro { color: #59686f; }
[data-theme="light"] .trust-strip { background: #f5f7f3; }
[data-theme="light"] .service { background: #f6f7f8; }
[data-theme="light"] .compare-card.highlight { background: linear-gradient(145deg, #eef8d7, #f6f7f8 65%); border-color: #a1ba69; }
[data-theme="light"] .compare-list li { border-color: var(--line); }
[data-theme="light"] .result { background: #edf7d8; border-color: #a1ba69; color: #344810; }
[data-theme="light"] .estimate-card { box-shadow: 0 18px 45px rgb(25 45 35 / 8%); }
.visual-copy h2 { color: #f3f5f4; }
.floating-badge b, .cta-box .btn { color: var(--lime); }
.nav { gap: 18px; }
.navlinks { gap: 18px; flex-shrink: 0; }
.nav-right { gap: 12px; }
.nav-right > .btn { white-space: nowrap; }
@media (max-width: 1100px) { .navlinks { display: none; } }
@media (max-width: 620px) { .nav { gap: 10px; } .nav-right { gap: 10px; } .nav-right > .btn { padding: 12px 10px; font-size: 12px; } .theme-toggle { flex-basis: 64px; width: 64px; --font-size: 13px; } .brand { gap: 8px; } .brand small { font-size: 9px; } }
@media (max-width: 370px) { .nav .brand-mark { display: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

.hero-grid > div { min-width: 0; }
@media (max-width: 620px) { h1 { font-size: clamp(34px, 10.5vw, 45px); } .brand { flex-shrink: 0; } }
@media (max-width: 400px) { .nav .brand small { display: none; } .nav-right { gap: 8px; } }


/* Компактная форма: hidden управляется main.js, поздний блок задаёт положение внутри hero. */
.request-panel { padding: 12px 0; background: var(--panel); border-bottom: 1px solid var(--line); scroll-margin-top: 76px; }
.request-panel[hidden], #request-form[hidden] { display: none; }
.request-inner { position: relative; }
.request-panel h2 { margin: 0 0 8px; font-size: 18px; line-height: 1.2; }
.request-close { position: absolute; right: 28px; top: -5px; padding: 3px 10px; }
#request-form { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; align-items: end; }
#request-form .fields { grid-column: 1 / -1; grid-template-columns: 1.3fr .65fr .8fr 1.1fr 1.1fr 1.1fr; gap: 10px; }
#request-form .field { min-width: 0; gap: 3px; }
#request-form input, #request-form select, #request-form textarea { min-width: 0; width: 100%; height: 36px; padding: 7px 9px; font: inherit; font-size: 13px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--bg); }
#request-form .comment-field { grid-column: 1 / -1; }
#request-form .comment-field textarea { resize: vertical; height: clamp(72px, 9vw, 110px); min-height: 72px; line-height: 1.5; }
#request-form .micro { margin: 0; text-align: left; align-self: center; }
.request-submit { padding: 7px 16px; font-size: 13px; }
.request-submit:disabled { cursor: wait; opacity: .65; }
#request-status { margin: 6px 0 0; font-size: 13px; }
#request-status:empty { display: none; }
@media(max-width:950px) { #request-form .fields { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media(max-width:620px) {
 .request-panel { scroll-margin-top:68px; }
 #request-form .fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 10px; }
 #request-form input, #request-form select, #request-form textarea { font-size:16px; height:40px; }
 .request-close { right:17px; }
 #request-form { grid-template-columns:1fr; }
 .request-submit { min-height:40px; }
}

/* The form expands beneath the request card, across the hero width. */
.hero-grid { row-gap: 12px; align-items: start; }
.request-panel { position: relative; grid-column: 1 / -1; padding: 14px 18px; border: 1px solid var(--line); border-radius: 16px; }
@media(max-width:360px) { #request-form .fields, .service-grid { grid-template-columns: minmax(0,1fr); } }
.request-close { right: 0; }

/* Price explanation */
.price-details-link { color: #d8ff71; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.price-details-link:hover { color: #fff; }
.price-details-link:focus-visible, .price-dialog button:focus-visible { outline: 2px solid var(--accent, #c8ff35); outline-offset: 4px; }
.price-dialog { width: min(660px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 32px; border: 1px solid var(--line); border-radius: 22px; background: var(--panel); color: var(--text); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 24px 80px #0006; }
.price-dialog::backdrop { background: rgb(0 0 0 / 65%); }
body:has(.price-dialog[open]) { overflow: hidden; }
.price-dialog h2 { font-size: clamp(24px, 4vw, 30px); line-height: 1.15; margin: 0 32px 20px 0; letter-spacing: -.025em; }
.price-dialog h3 { font-size: 18px; margin: 24px 0 10px; }
.price-dialog p { color: var(--muted); font-size: 15px; line-height: 1.65; margin: 0 0 14px; }
.price-dialog .price-dialog-summary { color: var(--text); border-top: 1px solid var(--line); padding-top: 18px; }
.price-dialog-close { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 10px; background: var(--panel2); color: var(--text); }
@media (max-width: 600px) { .price-dialog { padding: 24px 20px; } }

/* Чекбокс согласия и отдельная страница /privacy используют общую палитру. */
.privacy-consent { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--muted); line-height: 1.4; }
#request-form .privacy-consent input { appearance: auto; flex: 0 0 18px; width: 18px; height: 18px; margin: 0; padding: 0; accent-color: var(--accent); }
.privacy-consent a { text-decoration: underline; text-underline-offset: 2px; color: var(--text); }
.privacy-page { max-width: 800px; padding-top: 36px; padding-bottom: 48px; }
.privacy-page h1 { font-size: clamp(28px, 5vw, 44px); line-height: 1.1; }
.privacy-page h2 { font-size: 22px; margin-top: 28px; }

/* Диалог фото наследует price-dialog; карточки и класс has-photo создаёт main.js. */
.photo-open { min-height: 36px; padding: 8px 10px; border: 1px dashed var(--accent); border-radius: 9px; background: var(--panel2); color: var(--text); text-align: left; font-size: 12px; }
.photo-field small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.photo-dialog { width: min(820px, calc(100% - 24px)); }
.photo-optional { display: block; color: var(--accent); font-size: 12px; font-weight: 700; margin: 0 35px 12px 0; }
.photo-dialog .photo-benefit { padding: 14px 16px; background: var(--panel2); border-radius: 12px; font-size: 13px; }
.photo-dialog .photo-format { font-size: 12px; }
.photo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.photo-slot { min-width: 0; display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid var(--line); border-radius: 14px; }
.photo-slot.has-photo { border-color: var(--accent); }
.photo-preview { height: 90px; display: grid; place-items: center; border-radius: 8px; background: var(--panel2); overflow: hidden; }
.photo-preview span { color: var(--muted); font-size: 28px; }
.photo-preview img { width: 100%; height: 90px; object-fit: contain; }
.photo-slot b { font-size: 12px; min-height: 35px; }
.photo-slot small { font-size: 10px; color: var(--muted); }
.photo-select { position: relative; display: block; text-align: center; padding: 8px 4px; border: 1px solid var(--line); border-radius: 8px; font-size: 12px; cursor: pointer; }
.photo-select input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.photo-select:focus-within, .photo-open:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.photo-remove { background: transparent; color: var(--muted); text-decoration: underline; padding: 4px; font-size: 12px; }
.photo-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; }
.photo-footer span { font-size: 12px; color: var(--muted); }
.photo-dialog #photo-error { color: var(--red); font-size: 13px; margin-top: 12px; }
.photo-dialog [hidden] { display: none; }
@media(max-width:620px) { .photo-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .photo-dialog { padding: 24px 16px; } }

/* Book toggle: adapted from Halil Nuroglu. Shadow reveal: inspired by Giana. */
.estimate-card .request-toggle { justify-content: space-between; padding: 14px 18px; min-height: 80px; text-align: left; perspective: 600px; border: 1px solid transparent; overflow: hidden; }
.request-toggle-copy { display: grid; gap: 4px; }
.request-toggle-label { font-size: 16px; letter-spacing: -.02em; }
.request-toggle-note { font-size: 11px; font-weight: 500; opacity: .7; }
.request-book { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 4px; flex: 0 0 46px; height: 46px; padding: 12px; border-radius: 10px; background: #0b0d0f; box-shadow: 0 4px 10px #0002; transform: rotateY(0deg); transition: transform .5s cubic-bezier(.22,.75,.2,1), background .5s; }
.request-book span { display: block; width: 22px; height: 3px; border-radius: 2px; background: var(--lime); transition: transform .5s cubic-bezier(.22,.75,.2,1); }
.request-toggle.is-open .request-book { transform: rotateY(180deg); }
.request-toggle.is-open .one { transform: translate(7px,7px) rotate(60deg); }
.request-toggle.is-open .two { transform: rotate(75deg); }
.request-toggle.is-open .three { transform: translate(-7px,-7px) rotate(90deg); }
.estimate-card .request-toggle:hover { transform: none; box-shadow: inset 0 -80px 0 #d8ff71, 0 8px 20px -12px #c8ff3580; }
.estimate-card .request-toggle.is-opening { background: var(--lime); transform: none; }
.estimate-card .request-toggle.is-open:not(.is-opening) { background: var(--panel2); color: var(--text); border-color: var(--line); box-shadow: inset 3px 0 0 var(--accent); }
.request-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.request-panel { isolation: isolate; border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); box-shadow: 6px 6px 0 color-mix(in srgb, var(--accent) 25%, transparent); }
.request-panel::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: var(--lime); opacity: 0; transform-origin: right; }
.request-reveal { animation: request-shadow-open .45s cubic-bezier(.22,.75,.2,1) both; }
.request-reveal::before { animation: request-fill-open .42s cubic-bezier(.22,.75,.2,1) both; }
.request-reveal .request-inner { animation: request-content-open .4s .08s both; }
@keyframes request-shadow-open { from { transform: translateY(10px); box-shadow: 0 0 0 transparent; } to { transform: translateY(0); box-shadow: 6px 6px 0 color-mix(in srgb, var(--accent) 25%, transparent); } }
@keyframes request-fill-open { 0% { opacity: .9; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(0); } }
@keyframes request-content-open { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.request-submit { transition: box-shadow .25s, transform .25s; }
.request-submit:hover { box-shadow: inset 0 -3.5em 0 #d8ff71, 0 6px 12px -8px #c8ff35; }
@media(max-width:620px) { .estimate-card .request-toggle { padding: 12px 14px; } .request-toggle-label { font-size: 15px; } .request-panel { box-shadow: 3px 3px 0 color-mix(in srgb, var(--accent) 25%, transparent); } }
@media(prefers-reduced-motion:reduce) { .request-book, .request-book span { transition: none; } .request-reveal, .request-reveal::before, .request-reveal .request-inner { animation: none; } }

/* Рестайлинг: нейтральная база, один оранжевый акцент и редакционная сетка.
   DOM-контракты формы и предпросмотра остаются прежними. */
:root { --bg:#0f1115; --panel:#181b21; --panel2:#22262e; --line:#363b45; --text:#f5f7fa; --muted:#b1b7c2; --accent:#ff6a00; --action:#c64e00; --action-hover:#ad4300; --lime:var(--action); --lime2:var(--action-hover); --radius:8px; }
:root[data-theme="light"] { --bg:#f5f7fa; --panel:#fff; --panel2:#e9ecf0; --line:#cbd0d8; --text:#171a20; --muted:#555e6d; --accent:#b94700; }
/* Для белого текста CTA используем более глубокий оттенок того же оранжевого.
   Старые --lime/--lime2 оставлены как алиасы для прежних правил и анимаций. */
body { line-height:1.55; }
.wrap { max-width:1360px; padding-inline:40px; }
.topbar, [data-theme="light"] .topbar { background:var(--bg); border-color:var(--line); }
.nav { height:88px; }
.brand { color:var(--text); }
.brand-mark { border-radius:5px; background:var(--text); }
.brand-mark svg path, .brand-mark svg circle { fill:var(--bg); }
.theme-toggle .face svg { --glow:#f5f7fa; }
.navlinks, [data-theme="light"] .navlinks { color:var(--muted); }
.btn { border-radius:5px; min-height:48px; font-size:14px; }
.btn-primary { background:var(--action); color:#fff; }
.btn-primary:hover { background:var(--action-hover); transform:none; }
.btn-ghost:hover, [data-theme="light"] .btn-ghost:hover { background:var(--panel2); }
.hero { padding:64px 0 48px; background:none; }
.hero-grid { grid-template-columns:1.05fr 1fr; gap:32px 56px; align-items:center; }
.eyebrow { font-size:12px; font-weight:600; letter-spacing:.12em; color:var(--muted); }
.dot { display:none; }
h1 { font-size:clamp(44px,5.3vw,76px); line-height:1.04; letter-spacing:-.055em; margin:25px 0; font-weight:650; }
h1 em { color:var(--text); }
.lead, [data-theme="light"] .lead { font-size:18px; color:var(--muted); max-width:540px; }
.hero-actions { gap:12px; }
.hero-actions .btn-primary { padding:17px 22px; }
.proof-row { display:grid; grid-template-columns:1fr; gap:10px; margin-top:30px; font-size:14px; }
.proof-row > div { border-bottom:1px solid var(--line); padding-bottom:10px; display:flex; justify-content:space-between; gap:16px; }
.proof-row strong { font-size:14px; font-weight:600; margin:0; }
.hero-visual { min-height:430px; border-radius:8px 8px 0 0; box-shadow:none; border:0; }
.hero-visual img { opacity:1; filter:saturate(.65); object-position:center; }
.hero-visual:after { background:linear-gradient(180deg,transparent 25%,#0c1523ed 100%); }
.visual-copy { left:28px; right:28px; bottom:26px; }
.visual-copy h2 { font-size:27px; max-width:380px; line-height:1.15; }
.visual-copy p { max-width:440px; color:#d4deea; font-size:14px; }
.price-details-link { color:var(--accent); white-space:normal; }
.estimate-card, [data-theme="light"] .estimate-card { margin:0; border:1px solid var(--line); border-top:0; border-radius:0 0 8px 8px; padding:24px; box-shadow:none; }
.estimate-card h3 { font-size:22px; }
.estimate-card .hint { font-size:14px; margin:6px 0 14px; }
.estimate-card .request-toggle { min-height:64px; margin:0; border-radius:5px; }
.estimate-card .request-toggle:hover, .request-submit:hover { background:var(--action-hover); box-shadow:none; }
.estimate-card .request-toggle.is-open:not(.is-opening):hover { background:var(--panel2); box-shadow:inset 3px 0 0 var(--accent); }
.request-book { background:#0f1115; box-shadow:none; }
.request-book span { background:#f5f7fa; }
.request-toggle-note { font-size:12px; opacity:1; }
.trust-strip, [data-theme="light"] .trust-strip { background:var(--panel); }
.trust-grid { padding-block:26px; gap:24px; }
.trust-icon { border-radius:0; background:none; border-left:2px solid var(--accent); }
.trust-item span { font-size:14px; }
section { padding:80px 0; }
.section-head { margin-bottom:36px; align-items:start; }
.section-head h2 { font-size:clamp(32px,3.8vw,52px); font-weight:600; line-height:1.1; }
.kicker { font-size:12px; letter-spacing:.14em; color:var(--muted); }
.service-grid { gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.service, [data-theme="light"] .service { min-height:220px; border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:0; background:transparent; padding:26px; }
.service:hover { background:var(--panel); transform:none; }
.service .num { font-size:14px; font-weight:500; color:var(--muted); }
.service h3 { font-size:20px; font-weight:600; margin:32px 0 12px; line-height:1.2; }
.service p { font-size:16px; }
#how .service-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
#how .service { padding:22px 18px; }
#how .service h3 { font-size:18px; }
#how .service p { font-size:14px; }
#services, #cases { border-top:1px solid var(--line); }
.case { border-radius:6px; padding:28px; }
.case-top, .price-row span { font-size:14px; }
.case h3 { font-size:34px; margin:28px 0 10px; }
.case p { font-size:16px; }
.price-row { gap:12px; }
.price-row strong { color:var(--text); }
.compare-card { border-radius:6px; padding:30px; }
.compare-card.highlight, [data-theme="light"] .compare-card.highlight { background:var(--panel2); border-color:var(--line); }
.compare-list li { border-color:var(--line); font-size:16px; }
.faq { gap:0 32px; }
.faq details { border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; padding:24px 0; }
.faq p { font-size:16px; }
.cta-box { border-radius:8px; padding:44px; background:var(--panel); color:var(--text); border:1px solid var(--line); }
.cta-box p { color:var(--muted); }
.cta-box .btn { background:var(--action); color:#fff; }
.cta-box .btn:hover { background:var(--action-hover); }
.cta-box h2 { font-weight:600; line-height:1.08; }
.request-panel { padding:24px; border-radius:8px; }
#request-form input, #request-form select, #request-form textarea { font-size:16px; height:44px; }
#request-form textarea { min-height:88px; }
.field label, .privacy-consent, .photo-open, #request-status, .photo-slot b { font-size:14px; }
.photo-field small, .photo-slot small { font-size:12px; }
:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
@media(max-width:1100px) { .hero-grid { gap:32px; } #how .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .proof-row > div { display:block; } }
@media(max-width:950px) { .hero-grid { grid-template-columns:1fr; } .hero-grid > div:first-child { max-width:720px; } .hero-visual { min-height:440px; } h1 { max-width:750px; } .proof-row { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:620px) { .wrap { padding-inline:20px; } .nav { height:74px; } .hero { padding:36px 0; } h1 { font-size:clamp(38px,10.8vw,60px); } .hero-actions { flex-direction:column; align-items:stretch; } .proof-row { grid-template-columns:1fr; } .proof-row > div { display:flex; } .hero-visual { min-height:380px; } .visual-copy { left:22px; right:22px; } .visual-copy h2 { font-size:25px; } .estimate-card { padding:20px; } section { padding:52px 0; } .section-head h2 { font-size:34px; } #how .service-grid, .service-grid { grid-template-columns:1fr; } .service, #how .service { min-height:auto; padding:24px; } .service h3 { margin-top:14px; } .request-panel { padding:20px 14px; } .request-panel h2 { padding-right:34px; } .compare-list li { flex-direction:column; gap:4px; } .compare-list li b { text-align:left; } .cta-box { padding:30px 24px; } .nav-right > .btn { font-size:14px; } .brand small { display:none; } .trust-grid { padding-inline:20px; } }

/* Якоря учитывают высоту закреплённой шапки в обеих компоновках. */
main section[id] { scroll-margin-top:88px; }
@media(max-width:620px) { main section[id] { scroll-margin-top:74px; } }

/* Фото пользователя показываем целиком: подпись под ним не закрывает номер и кузов.
   .hero-visual остаётся источником геометрии для предпросмотра цены. */
.hero-visual { min-height:0; background:var(--panel); }
.hero-visual img { position:static; display:block; width:100%; height:auto; filter:none; }
.hero-visual::after { display:none; }
.visual-copy { position:static; padding:24px; }
.visual-copy h2 { color:var(--text); }
.visual-copy p { color:var(--muted); }
.visual-copy .price-details-link { color:var(--accent); }
@media(max-width:620px) { .visual-copy { padding:20px; } }

/* Изолируем раскрытие ситуаций от глобального оформления details в FAQ.
   Нативное состояние open обеспечивает клавиатуру и работу без JavaScript. */
#services .services-disclosure { padding: 0; border: 0; border-radius: 0; background: transparent; margin: 0; }
#services .services-toggle { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 64px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); color: var(--text); font-size: 16px; font-weight: 750; cursor: pointer; list-style: none; }
#services .services-toggle::-webkit-details-marker { display: none; }
#services .services-toggle::after { content: none; }
#services .services-toggle:hover { border-color: var(--accent); }
#services .services-toggle:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }

#services .services-label-open { display: none; }
#services .services-disclosure[open] .services-label-closed { display: none; }
#services .services-disclosure[open] .services-label-open { display: inline; }
#services .services-disclosure[open] .request-book { transform: rotateY(180deg); }
#services .services-disclosure[open] .request-book .one { transform: translate(7px,7px) rotate(60deg); }
#services .services-disclosure[open] .request-book .two { transform: rotate(75deg); }
#services .services-disclosure[open] .request-book .three { transform: translate(-7px,-7px) rotate(90deg); }
#services .services-disclosure > .service-grid { margin-top: 20px; }

/* Описание и summary имеют общую ширину: управление раскрытием связано
   с поясняющим текстом, а сама сетка карточек сохраняет ширину секции. */
#services .section-head { align-items: end; margin-bottom: 16px; }
#services .section-head > p { flex: 0 0 350px; width: 350px; }
#services .services-toggle { width: 350px; max-width: 100%; margin-left: auto; padding: 10px 12px 10px 20px; }
@media (max-width: 620px) {
  #services .section-head > p { width: auto; max-width: none; }
  #services .services-toggle { width: 100%; margin-left: 0; }
}

/* Без JS все пять сделок остаются обычной сеткой. Только готовая карусель
   ограничивает область просмотра; ширину карточки задаёт число видимых слайдов. */
#cases .deals-carousel { --visible-deals: 3; }
#cases .deals-carousel.is-ready .deals-viewport { overflow: hidden; }
#cases .deals-carousel.is-ready .cases { display: flex; gap: 14px; }
#cases .deals-carousel.is-ready .case { flex: 0 0 calc((100% - (var(--visible-deals) - 1) * 14px) / var(--visible-deals)); min-width: 0; }
#cases .case-top { flex-wrap: wrap; }
#cases .case .price-row { flex-wrap: wrap; gap: 10px; }
#cases .case .price-row strong { font-size: 22px; }
.deals-source { color: var(--muted); font-size: 13px; line-height: 1.6; margin-top: 20px; max-width: 850px; }
.deals-source a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
@media(max-width:950px) { #cases .deals-carousel { --visible-deals: 1; } }
@media(max-width:620px) { #cases .deals-carousel { --visible-deals: 1; } }

/* Одна таблица вместо двух списков: сравниваемые значения всегда рядом.
   На телефоне критерий занимает отдельную строку, значения остаются в двух колонках. */
.sale-comparison { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; color: var(--text); background: var(--bg); }
.sale-comparison th, .sale-comparison td { padding: 20px 24px; text-align: left; vertical-align: top; line-height: 1.45; overflow-wrap: break-word; }
.sale-comparison thead th { background: var(--panel); font-size: 20px; font-weight: 650; border-bottom: 1px solid var(--line); }
.sale-comparison thead th:first-child { width: 22%; background: var(--bg); color: var(--muted); font-size: 13px; font-weight: 500; vertical-align: middle; }
.sale-comparison thead th:nth-child(2) { background: var(--bg); box-shadow: inset 0 3px 0 var(--accent); }
.sale-comparison thead th:nth-child(3) { background: var(--panel); }
.sale-comparison thead small { display: block; margin-top: 4px; color: var(--muted); font-size: 13px; font-weight: 400; }
.sale-comparison tbody th { background: var(--bg); font-size: 14px; font-weight: 500; color: var(--muted); }
.sale-comparison tbody td { font-size: 16px; }
/* Заголовки и критерии продолжают заливку выкупа во всех размерах экрана.
   В тёмной теме выкуп чёрный, самостоятельная продажа — серая. */
.sale-comparison tbody td:nth-child(2) { background: var(--bg); }
.sale-comparison tbody td:nth-child(3) { background: var(--panel); }
/* В светлой теме выкуп и критерии светло-серые, самостоятельная продажа белая. */
[data-theme="light"] .sale-comparison thead th:first-child,
[data-theme="light"] .sale-comparison thead th:nth-child(2),
[data-theme="light"] .sale-comparison tbody th,
[data-theme="light"] .sale-comparison tbody td:nth-child(2) { background: var(--bg); }
[data-theme="light"] .sale-comparison thead th:nth-child(3),
[data-theme="light"] .sale-comparison tbody td:nth-child(3) { background: var(--panel); }
.sale-comparison tbody tr:not(:last-child) > * { border-bottom: 1px solid var(--line); }
.sale-comparison tr > * + * { border-left: 1px solid var(--line); }
.comparison-note { margin: 18px 0 0; max-width: 920px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.comparison-note strong { color: var(--text); font-weight: 600; }
@media(max-width:620px) {
  .sale-comparison { display: block; border-radius: 12px; }
  .sale-comparison thead, .sale-comparison tbody { display: block; }
  .sale-comparison tr { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .sale-comparison thead th:first-child { position: absolute; width: 1px; height: 1px; padding: 0; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
  .sale-comparison thead th { padding: 15px 12px; font-size: 16px; }
  .sale-comparison thead small { font-size: 11px; }
  .sale-comparison thead th:nth-child(2) { border-left: 0; }
  .sale-comparison tbody th { grid-column: 1 / -1; padding: 10px 12px 6px; font-size: 12px; }
  .sale-comparison tbody td { padding: 12px; font-size: 14px; }
  .sale-comparison tbody td:nth-child(2) { border-left: 0; }
  .sale-comparison tbody tr:not(:last-child) > th { border-bottom: 0; }
}

/* Горизонтальный свайп остаётся карусели; вертикальная прокрутка и масштаб — браузеру. */
#cases .deals-carousel.is-ready { touch-action: pan-y pinch-zoom; user-select: none; }

/* Боковые кнопки занимают собственные поля и не перекрывают текст сделок. */
#cases .deals-carousel { position: relative; }
#cases .deals-arrow { display: none; }
@media(min-width:621px) {
  #cases .deals-carousel.is-ready { padding-inline: 52px; }
  #cases .is-ready .deals-arrow { display: grid; place-items: center; position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 48px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); color: var(--text); font: inherit; font-size: 24px; cursor: pointer; }
  #cases .deals-prev { left: 0; }
  #cases .deals-next { right: 0; }
  #cases .deals-arrow:hover { border-color: var(--lime); color: var(--lime); }
  #cases .deals-arrow:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
}

/* Общие строки всех карточек: перенос в одной не сдвигает цену у соседей. */
#cases .deals-carousel.is-ready .cases {
  display: grid;
  grid-template-columns: none;
  grid-template-rows: repeat(4, auto);
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - (var(--visible-deals) - 1) * 14px) / var(--visible-deals));
  gap: 0 14px;
}
#cases .deals-carousel.is-ready .case {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 4;
  row-gap: 0;
}
#cases .deals-carousel.is-ready .case-top { align-content: start; }
#cases .deals-carousel.is-ready .price-row { align-content: start; }

/* На телефоне условия и четыре этапа остаются сетками 2×2.
   Длинные слова переносятся внутри ячейки, не расширяя страницу. */
@media(max-width:620px) {
  .trust-grid, #how .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .trust-grid { gap:20px 14px; }
  .trust-item { flex-direction:column; align-items:flex-start; gap:8px; min-width:0; }
  .trust-item > div:last-child, #how .service { min-width:0; overflow-wrap:anywhere; }
  #how .service { padding:18px 12px; min-height:0; }
}
/* Без активной карусели сохраняем одну колонку до того же порога.
   В карусели ширину и доступность синхронно задаёт --visible-deals. */
@media(max-width:950px) {
  #cases .deals-carousel:not(.is-ready) .cases { grid-template-columns:minmax(0,1fr); align-items:start; }
}

/* viewport-fit=cover убирает автоматические поля Safari при повороте iPhone.
   Фон шапки доходит до края; безопасные отступы оставляем внутри, а не в top.
   max сохраняет обычные поля на устройствах без выреза. */
:root { --page-gutter:40px; --header-height:88px; }
@media(max-width:620px) { :root { --page-gutter:20px; --header-height:56px; } }
html { background:var(--bg); }
.wrap {
  padding-left:max(var(--page-gutter), env(safe-area-inset-left, 0px));
  padding-right:max(var(--page-gutter), env(safe-area-inset-right, 0px));
}
.topbar { top:0; padding-top:env(safe-area-inset-top, 0px); }
.topbar .nav { height:var(--header-height); }
main section[id], .request-panel {
  scroll-margin-top:calc(var(--header-height) + env(safe-area-inset-top, 0px));
}
.footer { padding-bottom: max(36px, env(safe-area-inset-bottom, 0px)); }

/* При повороте телефон шире мобильного breakpoint, но высоты по-прежнему мало.
   Убираем второстепенные подписи; кнопкам оставляем область нажатия 44 px.
   Общая переменная высоты также уменьшает отступ при переходе к якорям. */
@media(max-width:620px), (max-width:1000px) and (max-height:500px) and (orientation:landscape) {
  .topbar .nav { gap:10px; }
  .topbar .brand { gap:8px; font-size:15px; }
  .topbar .brand-mark { width:28px; height:28px; }
  .topbar .brand small, .topbar .phone { display:none; }
  .topbar .nav-right { gap:8px; }
  .topbar .theme-toggle { flex-basis:64px; width:64px; height:44px; --font-size:13px; }
  .topbar .nav-right > .btn { min-height:44px; padding:8px 12px; font-size:13px; }
}
@media(max-width:1000px) and (max-height:500px) and (orientation:landscape) {
  :root { --header-height:52px; }
}

/* Публикуемые CMS-блоки: скрытие сильнее сетки; отзывы без неподтверждённых рейтингов. */
[hidden]{display:none!important}.cms-reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.cms-review{padding:24px;background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow-wrap:anywhere}.cms-review p{white-space:pre-wrap}.cms-review time{display:block;margin-bottom:12px}@media(max-width:750px){.cms-reviews{grid-template-columns:1fr}}

.cms-catalog-links{display:flex;gap:24px;flex-wrap:wrap;padding-block:24px}.cms-catalog-links a{color:var(--text);text-decoration:underline}