/* Page: Установка тахографа (template-tachograph-install.php) — scoped styles */

.ti-page{background:#fff}
#ti-lead{scroll-margin-top:130px}
.ti-page .container{position:relative}
.ti-page h1,.ti-page h2,.ti-page h3{color:var(--market-text)}
/* shared dark card must keep its white title */
.ti-page .adv-card--dark h2,.ti-page .adv-card--dark h3{color:#fff}
.ti-page p{margin:0}
.ti-section{padding:44px 0}
.ti-section--flush{padding:22px 0}
.ti-h2{font-size:clamp(26px,2.6vw,34px);line-height:1.12;letter-spacing:-0.01em;margin:0 0 20px}

/* Breadcrumbs above the banner (white page background) */
.ti-crumbs-wrap{padding-top:24px;margin-bottom:16px}
.ti-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:#7a828e;list-style:none;padding:0;margin:0}
.ti-crumbs li{display:inline-flex;align-items:center;gap:8px}
.ti-crumbs li + li::before{content:'→';color:#b6bcc6}
.ti-crumbs a:hover{color:var(--market-red)}
.ti-crumbs [aria-current="page"]{color:var(--market-text);font-weight:600}

/* 1. Hero card in the shared container */
.ti-hero-band{padding-bottom:38px}
.ti-hero{position:relative;overflow:hidden;border-radius:20px;color:#fff;background:#14161a;min-height:360px;display:flex;align-items:center}
.ti-hero__media{position:absolute;inset:0;z-index:0;pointer-events:none}
.ti-hero__media picture,.ti-hero__media img{display:block;width:100%;height:100%}
.ti-hero__media img{object-fit:cover;object-position:78% center}
.ti-hero::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(13,15,19,.96) 0%,rgba(13,15,19,.93) 34%,rgba(13,15,19,.66) 58%,rgba(13,15,19,.22) 82%,rgba(13,15,19,.05) 100%)}
.ti-hero__inner{position:relative;z-index:2;padding:44px 48px;max-width:52%}
.ti-hero h1{font-size:clamp(30px,2.6vw,42px);line-height:1.1;letter-spacing:-0.015em;margin:0 0 14px;color:#fff}
.ti-hero h1 span{white-space:nowrap}
.ti-hero__lead{font-size:16px;line-height:1.5;color:rgba(255,255,255,.9);margin:0 0 22px}
.ti-hero__actions .btn{min-height:48px;border-radius:6px;padding:0 26px;font-size:14.5px}
.ti-hero__perks{display:flex;flex-wrap:wrap;gap:14px 20px;margin:22px 0 10px;list-style:none;padding:0}
.ti-hero__perks li{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#fff}
.ti-hero__perks .ui-icon{color:var(--market-red);width:18px;height:18px}
.ti-hero__note{font-size:13px;color:rgba(255,255,255,.78)}

/* 2. Drive Base offer */
.ti-offer{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:0;border:1px solid #e4e7ec;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(17,24,39,.05)}
.ti-offer__media{background:#fff;display:grid;place-items:center;padding:30px;border-right:1px solid #eef0f3}
.ti-offer__media picture{display:block;width:100%;max-width:560px}
.ti-offer__media img{display:block;width:100%;height:auto;object-fit:contain}
.ti-offer__body{padding:30px 32px}
.ti-badge{display:inline-block;background:var(--market-red);color:#fff;font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 12px;margin-bottom:12px}
.ti-offer__name{font-size:28px;margin:0 0 2px}
.ti-offer__caption{font-size:14px;color:#6b7280;margin:0 0 16px}
.ti-offer__price{font-size:38px;font-weight:900;letter-spacing:-0.01em;color:var(--market-text);margin:0 0 18px;line-height:1}
.ti-offer__price small{display:block;font-size:12.5px;font-weight:600;color:#6b7280;letter-spacing:0;margin-top:6px}
.ti-offer__list{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:9px}
.ti-offer__list li{position:relative;padding-left:24px;font-size:14px;font-weight:600;color:#2c313a}
.ti-offer__list li::before{content:'✓';position:absolute;left:0;top:0;color:var(--market-red);font-weight:900}
.ti-offer__actions{display:flex;gap:12px;flex-wrap:wrap}
.ti-offer__actions .btn{min-height:44px;border-radius:6px;font-size:14px}
.ti-btn-red-outline{border:1px solid var(--market-red);color:var(--market-red);background:#fff}
.ti-btn-red-outline:hover{background:var(--market-red);color:#fff}
.ti-btn-red-outline i{font-style:normal;transition:transform .16s ease}
.ti-btn-red-outline:hover i{transform:translateX(3px)}
.ti-discount{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:14px;padding:12px 18px;border:1px dashed #ffb8be;border-radius:10px;background:#fff5f6;color:#9e0008;font-size:14px;font-weight:800}
.ti-discount .ui-icon{color:var(--market-red)}
.ti-page .ti-warranty{margin-top:16px}
.ti-page .documents-section{margin-bottom:6px}

/* 3. Plate check (placeholder) */
.ti-check{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;border-radius:12px;padding:30px 32px;background:linear-gradient(135deg,#15171b 0%,#1c2026 60%,#2a1114 100%);color:#fff}
.ti-check h2{color:#fff;font-size:clamp(22px,2.2vw,28px);margin:0 0 8px}
.ti-check > .ti-check__body > p{color:rgba(255,255,255,.78);font-size:14px;max-width:560px;margin-bottom:18px}
.ti-check__form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start}
.ti-check__field textarea{width:100%;min-height:74px;resize:vertical;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(255,255,255,.06);color:#fff;padding:11px 13px;font:inherit;font-size:14px}
.ti-check__field textarea::placeholder{color:rgba(255,255,255,.42)}
.ti-check__field textarea:disabled,.ti-check__submit .btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}
.ti-check__submit{display:grid;gap:8px;justify-items:stretch}
.ti-check__submit .btn{border-radius:6px;min-height:44px;font-size:14px}
.ti-check__soon{font-size:11.5px;color:rgba(255,255,255,.66);text-align:center}
.ti-check__aside{display:grid;gap:12px;align-content:center}
.ti-check__tip{display:flex;gap:12px;align-items:flex-start;border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:13px 15px;background:rgba(255,255,255,.05)}
.ti-check__tip-icon{flex:0 0 auto;color:var(--market-red)}
.ti-check__tip b{display:block;font-size:13.5px;margin-bottom:2px}
.ti-check__tip small{display:block;font-size:12px;color:rgba(255,255,255,.66);line-height:1.35}

/* 4. Works (empty component) */
.ti-works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ti-work{border:1px solid #e4e7ec;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 5px 16px rgba(17,24,39,.04)}
.ti-work__photo{height:170px;display:grid;place-items:center;background:#f4f5f7;color:#b3b9c4}
.ti-work__photo .ui-icon{width:28px;height:28px}
.ti-work__body{padding:14px 16px}
.ti-work__body small{display:block;font-size:12.5px;color:#6b7280;line-height:1.4}

/* 5. Process — vertical numbered steps */
.ti-process__intro{font-size:14.5px;line-height:1.55;color:#6b7280;max-width:860px;margin:0 0 22px}
.ti-process{display:grid;gap:0;position:relative;max-width:900px}
.ti-process__step{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 18px;padding-bottom:26px}
.ti-process__step:last-child{padding-bottom:0}
.ti-process__step::before{content:'';position:absolute;left:21px;top:46px;bottom:0;width:2px;background:#e4e7ec}
.ti-process__step:last-child::before{display:none}
.ti-process__num{position:relative;z-index:1;width:44px;height:44px;border-radius:50%;background:var(--market-red);color:#fff;font-weight:900;font-size:17px;display:grid;place-items:center;flex:0 0 44px}
.ti-process__body{padding-top:7px}
.ti-process__body h3{font-size:18px;margin:0 0 8px}
.ti-process__body p{font-size:14px;line-height:1.55;color:#5b6472;margin:0 0 8px}
.ti-process__body p:last-child{margin-bottom:0}
.ti-process__body ul{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:6px}
.ti-process__body li{position:relative;padding-left:24px;font-size:14px;line-height:1.5;color:#5b6472}
.ti-process__body li::before{content:'';position:absolute;left:0;top:7px;width:9px;height:9px;border-radius:50%;background:var(--market-red)}
.ti-process__body b{color:#2c313a}
.ti-steps__links{margin-top:22px;font-size:13.5px;color:#6b7280}
.ti-steps__links a{color:var(--market-red);font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#ffc9cd}
.ti-steps__links a:hover{color:var(--market-red-dark)}

/* 3b. Plate-check results */
.ti-check__results{display:grid;gap:10px;margin-top:16px}
.ti-check__row{border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:12px 15px;background:rgba(255,255,255,.05);display:grid;gap:3px}
.ti-check__row b{font-size:14px;letter-spacing:.02em}
.ti-check__row span{font-size:13px;color:rgba(255,255,255,.75)}
.ti-check__row--danger b{color:#ff8585}
.ti-check__row--warning b{color:#ffc966}
.ti-check__row--ok b{color:#7fe0a3}
.ti-check__row--muted b{color:#aeb6c2}
.ti-check__row--ok span,.ti-check__row--danger span,.ti-check__row--warning span,.ti-check__row--muted span{color:rgba(255,255,255,.78)}
.ti-check__loading{font-size:13.5px;color:rgba(255,255,255,.7)}
.ti-check__source{margin-top:12px;font-size:12px;color:rgba(255,255,255,.55)}
.ti-check__source a{color:rgba(255,255,255,.75);text-decoration:underline;text-underline-offset:2px}
.ti-check__source a:hover{color:#fff}

/* 6. Docs given */
.ti-given{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:26px;align-items:center;border:1px solid #e4e7ec;border-radius:12px;padding:30px 32px;background:#fff;box-shadow:0 10px 30px rgba(17,24,39,.05)}
.ti-given h2{font-size:clamp(22px,2.2vw,28px);margin:0 0 10px}
.ti-given__body > p{font-size:14.5px;color:#6b7280;max-width:520px;margin-bottom:16px}
.ti-given__list li{font-size:13.5px}
.ti-given__media picture{display:block}
.ti-given__media img{display:block;width:100%;height:230px;object-fit:cover;border-radius:10px}

/* 7. Mobile install banner */
.ti-mobile{position:relative;overflow:hidden;border-radius:12px;min-height:300px;color:#fff;display:flex;align-items:center}
.ti-mobile__media{position:absolute;inset:0;z-index:0}
.ti-mobile__media picture,.ti-mobile__media img{display:block;width:100%;height:100%}
.ti-mobile__media img{object-fit:cover;object-position:70% center}
.ti-mobile::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,12,16,.92) 0%,rgba(10,12,16,.72) 38%,rgba(10,12,16,.12) 76%)}
.ti-mobile__body{position:relative;z-index:2;padding:34px 36px;max-width:600px}
.ti-mobile__body h2{color:#fff;font-size:clamp(24px,2.4vw,32px);margin:0 0 10px}
.ti-mobile__body p{color:rgba(255,255,255,.86);font-size:15px;max-width:440px}

/* 8. Fleet */
.ti-fleet{border-radius:12px;border:1px solid #e4e7ec;background:#fff;padding:32px;box-shadow:0 10px 30px rgba(17,24,39,.05)}
.ti-fleet h2{font-size:clamp(24px,2.4vw,30px);margin:0 0 8px}
.ti-fleet__lead{font-size:15px;color:#6b7280;margin:0 0 20px}
.ti-fleet__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-bottom:22px}
.ti-fleet__card{border:1px solid #eceef2;border-radius:10px;padding:16px;display:grid;gap:6px;background:#fafbfc}
.ti-fleet__icon{color:var(--market-red)}
.ti-fleet__card b{font-size:14.5px}
.ti-fleet__card small{font-size:12.5px;color:#6b7280;line-height:1.45}
.ti-fleet .btn{min-height:44px;border-radius:6px;font-size:14px}

/* 9. Shared advantages block: compact paddings on this page */
.ti-page .advantages-section{padding:22px 0}
/* Shared documents block: keep site look, no h2 duplication fix needed */
.ti-page .documents-section{padding:30px 0 34px}

/* 10. Warranty compact */
.ti-warranty{display:flex;align-items:center;gap:16px;border:1px solid #e4e7ec;border-radius:12px;background:#f7f8fa;padding:16px 22px}
.ti-warranty__icon{flex:0 0 auto;color:var(--market-red);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #ffd5d8}
.ti-warranty b{display:block;font-size:15px;margin-bottom:2px}
.ti-warranty small{display:block;font-size:13px;color:#6b7280}

/* 12. FAQ accordion (details/summary) */
.ti-faq{display:grid;grid-template-columns:1fr;gap:10px;max-width:860px}
.ti-faq details{background:#fff;border:1px solid #e4e7ec;border-radius:10px}
.ti-faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none;padding:14px 16px;font-size:14.5px;font-weight:800;color:var(--market-text)}
.ti-faq summary::-webkit-details-marker{display:none}
.ti-faq summary::after{content:'';flex:0 0 10px;width:10px;height:10px;border-right:2px solid #9aa2ae;border-bottom:2px solid #9aa2ae;transform:rotate(45deg);transition:transform .16s ease}
.ti-faq details[open] summary::after{transform:rotate(-135deg)}
.ti-faq summary:hover{color:var(--market-red)}
.ti-faq details p{padding:0 16px 14px;font-size:13.5px;line-height:1.55;color:#6b7280}

/* 13. Final lead */
.ti-lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:30px;border-radius:12px;padding:34px 36px;background:linear-gradient(135deg,#15171b 0%,#1c2026 60%,#2a1114 100%);color:#fff}
.ti-lead__text h2{color:#fff;font-size:clamp(24px,2.4vw,30px);margin:0 0 8px}
.ti-lead__text > p{color:rgba(255,255,255,.82);font-size:14.5px;margin-bottom:14px}
.ti-map-card{grid-column:1/-1;position:relative;height:340px;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:#e8ebef}
.ti-map-card iframe{display:block;border:0;width:100%;height:100%}
.ti-lead__form{display:grid;gap:12px;background:#fff;color:var(--market-text);border-radius:12px;padding:22px;box-shadow:0 18px 46px rgba(0,0,0,.28)}
.ti-lead__form label{display:grid;gap:6px;font-size:13px;font-weight:800;color:#252a32}
.ti-lead__form input:not([type=checkbox]),.ti-lead__form textarea{width:100%;border:1px solid #dfe3ea;border-radius:9px;padding:10px 12px;font:inherit;font-size:14px;color:#15171b;background:#fff}
.ti-lead__form input:focus,.ti-lead__form textarea:focus{outline:3px solid rgba(214,7,18,.16);border-color:var(--market-red)}
.ti-req{color:var(--market-red)}
.ti-consent{grid-template-columns:auto 1fr;align-items:start;gap:9px!important;font-weight:600!important;font-size:12.5px!important;color:#4b5563!important}
.ti-consent input{margin-top:2px;width:15px;height:15px;accent-color:var(--market-red)}
.ti-lead__form .btn{min-height:44px;border-radius:9px;font-size:14px;width:100%}
.ti-lead__form .lead-form__message{font-size:13px;border-radius:9px;padding:10px 12px}
.ti-lead__form .lead-form__message--ok{background:#e8f7ee;color:#116733}
.ti-lead__form .lead-form__message--error{background:#fdecec;color:#991b1b}
.lead-form__trap{position:absolute;left:-9999px}

/* Responsive */
@media (max-width:1100px){
  .ti-check{grid-template-columns:1fr}
  .ti-check__form{grid-template-columns:1fr}
}
@media (max-width:980px){
  .ti-offer,.ti-given,.ti-lead{grid-template-columns:1fr}
  .ti-given__media img{height:280px}
  .ti-fleet__grid{grid-template-columns:1fr 1fr}
  .ti-works{grid-template-columns:1fr 1fr}
  .ti-hero__inner{max-width:70%}
}
@media (max-width:768px){
  .ti-section{padding:30px 0}
  .ti-hero{min-height:0;border-radius:16px}
  .ti-hero__media{inset:auto 0 0 0;height:38%}
  .ti-hero__media img{object-position:78% 88%}
  .ti-hero::before{background:linear-gradient(180deg,rgba(13,15,19,.97) 0%,rgba(13,15,19,.96) 55%,rgba(13,15,19,.9) 72%,rgba(13,15,19,.66) 88%,rgba(13,15,19,.55) 100%)}
  .ti-hero__inner{max-width:none;padding:26px 24px 34px}
  .ti-hero__perks{flex-direction:column;gap:10px}
  .ti-check__aside{grid-template-columns:1fr 1fr;grid-auto-flow:column}
  .ti-mobile__body{padding:26px 22px}
  .ti-mobile{min-height:250px}
  .ti-mobile::before{background:linear-gradient(180deg,rgba(10,12,16,.94) 0%,rgba(10,12,16,.55) 55%,rgba(10,12,16,.18) 100%)}
  .ti-map-card{height:280px}
}
@media (max-width:620px){
  .ti-fleet__grid,.ti-works,.ti-check__aside{grid-template-columns:1fr;grid-auto-flow:row}
  .ti-process__step{grid-template-columns:36px minmax(0,1fr);gap:0 14px}
  .ti-process__num{width:36px;height:36px;font-size:15px}
  .ti-process__step::before{left:17px;top:40px}
  .ti-offer__media{padding:22px}
  .ti-offer__body{padding:22px}
  .ti-given{padding:22px}
  .ti-fleet{padding:22px}
  .ti-lead{padding:24px}
  .ti-hero__actions .btn,.ti-offer__actions .btn,.ti-check__submit .btn{width:100%}
}