/* Страница «Конвертер фото» /tools/convert/ и направления: hero, «Какой формат выбрать», направления, каталог, FAQ.
   Сам инструмент — photo-tool/photo-tool.css */
/* hero */
.cvp-hero{background:#000;color:#fff;padding:calc(var(--hdr-h,110px) + 28px) 0 128px}
.cvp-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;font-weight:500;color:#9aa092}
.cvp-crumbs a{color:#9aa092;text-decoration:none}.cvp-crumbs a:hover{color:#fff}.cvp-crumbs [aria-current]{color:#fff}
.cvp-hero-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:40px;margin-top:36px}
.cvp-hero-copy{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:18px}
.cvp-kicker{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--c-lime)}
.cvp-hero h1{margin:0;font-size:clamp(38px,4.6vw,64px);line-height:1.02;font-weight:800;letter-spacing:-.03em;color:#fff;text-wrap:balance}
.cvp-hero h1 span{display:block;margin-top:8px;font-size:.62em;letter-spacing:-.02em;color:var(--c-lime)}
.cvp-hero p{margin:0;max-width:600px;font-size:17px;line-height:1.55;font-weight:500;color:#c9cec2}
.cvp-map{flex:0 0 auto;width:440px;display:flex;flex-direction:column;gap:18px;padding:22px 24px;border-radius:24px;background:#0e0f0d;border:1px solid #23261f}
.cvp-map-row{display:flex;align-items:center;gap:16px}
.cvp-map-t{display:block;margin-bottom:10px;font-size:11px;font-weight:800;letter-spacing:.14em;color:#9aa092}
.cvp-map-from{flex:1 1 0;min-width:0}
.cvp-map-from>div{display:flex;flex-wrap:wrap;gap:6px}
.cvp-map-from span:not(.cvp-map-t){padding:6px 9px;border-radius:8px;background:#1a1c18;border:1px solid #2a2d27;font-family:var(--c-mono);font-size:13px;font-weight:700;color:#e6e9e1}
.cvp-map-arrow{width:24px!important;height:24px!important;color:var(--c-lime)}
.cvp-map-to{flex:0 0 132px}
.cvp-map-to>div{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.cvp-map-to>div span{padding:7px 0;border-radius:8px;background:var(--c-lime);color:var(--c-ink);text-align:center;font-family:var(--c-mono);font-size:13px;font-weight:700}
.cvp-map-to small{display:block;margin-top:8px;font-size:11px;line-height:1.4;color:#9aa092}
.cvp-map-sep{height:1px;background:#23261f}
.cvp-map-ok{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;font-weight:600;color:#c9cec2}
.cvp-map-ok span{display:flex;align-items:center;gap:6px}.cvp-map-ok svg{width:14px;height:14px;color:var(--c-lime);stroke-width:3}
@media(max-width:1079px){.cvp-map{display:none}}

/* какой формат выбрать */
.cvp-formats{background:#fff;padding:56px 0;position:relative;z-index:1;border-top:1px solid #e3eadf;border-bottom:1px solid #e3eadf;box-shadow:0 -10px 24px rgba(11,32,58,.06),0 10px 24px rgba(11,32,58,.06);scroll-margin-top:var(--hdr-h,110px)}
.cvp-formats-row{display:flex;flex-wrap:wrap;gap:32px 64px}
.cvp-formats-l{flex:1 1 300px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.cvp-formats h2,.cvp-routes h2,.cvp-faq h2,.cvp-more-sec h2{margin:0;font-size:clamp(30px,3.2vw,44px);line-height:1.1;font-weight:800;letter-spacing:-.025em}
.cvp-short{align-self:stretch;margin-top:12px;display:flex;flex-direction:column;padding:8px 22px;border-radius:20px;background:var(--c-ink);color:#fff}
.cvp-short-t{padding:14px 0 10px;font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--c-lime)}
.cvp-short>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid #262922;font-size:15px;font-weight:600}
.cvp-short b{font-family:var(--c-mono);font-weight:700}.cvp-short b.is-lime{color:var(--c-lime)}
.cvp-flist{flex:2 1 560px;min-width:0;border-top:1px solid var(--c-line)}
.cvp-frow{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;padding:24px 0;border-bottom:1px solid var(--c-line)}
.cvp-frow>div{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:6px}
.cvp-frow h3{margin:0;font-size:18px;font-weight:800;letter-spacing:-.01em}
.cvp-frow p{margin:0;font-size:15px;line-height:1.55;color:var(--c-ink2)}
.cvp-frow p a{color:var(--c-ink);font-weight:700}
.cvp-fbadge{width:76px;height:56px;flex:none;border-radius:14px;background:var(--c-pale);display:flex;align-items:center;justify-content:center;font-family:var(--c-mono);font-size:18px;font-weight:700}
.cvp-fbadge.is-lime{background:var(--c-lime)}.cvp-fbadge.is-dashed{background:#fff;border:1.5px dashed var(--c-dash)}
.cvp-fbtn{flex:none;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--c-ctl);background:#fff;color:var(--c-ink);display:flex;align-items:center;gap:8px;text-decoration:none;font-size:14px;font-weight:800;white-space:nowrap}
.cvp-fbtn:hover{border-color:var(--c-ink)}
.cvp-fbtn.is-dark{background:var(--c-ink);border-color:var(--c-ink);color:#fff}
.cvp-fbtn svg{width:16px;height:16px}

/* направления */
.cvp-routes{padding:56px 0 40px}
.cvp-routes h2{margin:16px 0 32px}
.cvp-lanes{display:flex;flex-direction:column;gap:14px}
.cvp-lane{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px}
.cvp-lane-t{flex:0 0 150px;font-size:15px;font-weight:800}
.cvp-lane-g{flex:1 1 560px;min-width:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media(max-width:700px){.cvp-lane-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cvp-lane-g a{min-height:60px;padding:0 12px;display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;border:1px solid var(--c-line);border-radius:16px;color:var(--c-ink);text-decoration:none;font-family:var(--c-mono);font-size:16px;font-weight:700}
.cvp-lane-g a:hover{border-color:var(--c-ink)}
.cvp-lane-g a[aria-current]{background:var(--c-ink);color:#fff;border-color:var(--c-ink)}
.cvp-lane-g svg{width:16px;height:16px}

/* обработка каталога */
.cvp-catalog-sec{padding:0 0 56px;scroll-margin-top:var(--hdr-h,110px)}
.cvp-catalog{display:flex;flex-wrap:wrap;align-items:center;gap:32px 48px;padding:clamp(24px,4vw,48px);border-radius:28px;background:var(--c-ink);color:#fff;overflow:hidden}
.cvp-catalog-l{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.cvp-mono-label{font-family:var(--c-mono);font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--c-lime)}
.cvp-catalog h2{margin:0;font-size:clamp(28px,3vw,42px);line-height:1.1;font-weight:800;letter-spacing:-.025em;color:#fff}
.cvp-catalog p{margin:0;max-width:460px;font-size:16px;line-height:1.55;color:#c9cec2}
.cvp-catalog-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:8px}
.cvp-catalog-link{color:#fff;font-size:14px;font-weight:700;text-underline-offset:4px}
.cvp-ba{flex:0 1 400px;min-width:0;display:flex;flex-direction:column;gap:14px;padding:clamp(16px,2vw,22px);border-radius:20px;background:#161814;border:1px solid #23261f}
.cvp-ba-t{font-size:11px;font-weight:800;letter-spacing:.14em;color:#9aa092}
.cvp-ba-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px}
.cvp-ba figure{margin:0;display:flex;flex-direction:column;gap:6px}
.cvp-ba figure>span{width:92px;height:92px;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.cvp-ba figure>span.is-white{background:#fff}
.cvp-ba figure svg{width:70%;height:70%;stroke:none}
.cvp-ba figcaption{font-family:var(--c-mono);font-size:11px;color:#9aa092}
.cvp-ba-row:not(.cvp-ba-before) figcaption{color:#e6e9e1}
.cvp-ba-arrow{display:flex;align-items:center;gap:10px;color:var(--c-lime);font-size:13px;font-weight:700}
.cvp-ba-arrow svg{width:16px;height:16px}
@media(max-width:1079px){.cvp-ba{display:none}}

/* FAQ — как на других страницах (белая секция, 56 px, список до 780 px). #faq — иначе перебьёт общее #faq{background} */
.cvp #faq.cvp-faq{position:relative;z-index:1;background:#fff;padding:56px 0;border-top:1px solid #e3eadf;border-bottom:1px solid #e3eadf;box-shadow:0 -10px 24px rgba(11,32,58,.06),0 10px 24px rgba(11,32,58,.06)}
.cvp-faq-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 40px;margin-bottom:28px}
.cvp-faq-head>div{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.cvp-faq-head p{margin:0;font-size:14px;color:var(--c-mute)}.cvp-faq-head a{color:var(--c-ink);font-weight:700}
.cvp-acc{max-width:780px;border-top:1px solid #e9edf1}
.cvp-acc-item{border-bottom:1px solid #e9edf1}
.cvp-acc h3{margin:0;font-size:inherit}
.cvp-acc button{width:100%;min-height:70px;padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;border:0;background:transparent;text-align:left;font-size:16px;font-weight:700;line-height:1.4;cursor:pointer}
.cvp-acc button i{width:26px;height:26px;flex:none;border-radius:999px;display:flex;align-items:center;justify-content:center;background:var(--c-lime);transition:transform .2s}
.cvp-acc button i svg{width:14px;height:14px;stroke-width:2.5}
.cvp-acc button[aria-expanded=true] i{transform:rotate(45deg)}
.cvp-acc-a p{margin:0;padding:0 46px 20px 0;font-size:15px;line-height:1.6;color:var(--c-ink2)}

/* другие инструменты */
.cvp-more-sec{padding:56px 0}
.cvp-more-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:36px}
.cvp-more-head>div{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.cvp-more-head>span{font-size:14px;font-weight:600;color:var(--c-mute)}
.cvp-more-sec .tl-cards{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:20px}
.cvp-more-sec .tl-card{border-radius:22px;border-color:var(--c-line)}
.cvp-more-sec .tl-card span{color:var(--c-mute)}

/* страницы сжатия, размера, удаления фона (photo_page.html): карточка в hero и «как это работает» */
.cvp-side{width:380px;gap:14px}
.cvp-side-row{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600;color:#e6e9e1}
.cvp-side-row svg{width:22px;height:22px;padding:4px;border-radius:999px;background:var(--c-lime);color:var(--c-ink);stroke-width:3}
.cvp-info h2{margin:16px 0 28px}
.cvp-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:20px}
.cvp-info-item{display:flex;flex-direction:column;gap:8px;padding:24px;border:1px solid var(--c-line);border-radius:20px;background:#fbfcf9}
.cvp-info-item>span{width:32px;height:32px;border-radius:999px;background:var(--c-lime);display:flex;align-items:center;justify-content:center;font-family:var(--c-mono);font-weight:700}
.cvp-info-item h3{margin:6px 0 0;font-size:18px;font-weight:800}
.cvp-info-item p{margin:0;font-size:15px;line-height:1.55;color:var(--c-ink2)}