/*! Сторінка «Доставка і оплата» — стилі погодженого макета
   svitlo-delivery-payment. Правила обмежені .svl-delivery: класи
   .hero, .breadcrumbs, .eyebrow вже зайняті на головній і в картці. */

/* Палітра макета. --line у темі — світла лінія на темному тлі,
   а тут сторінка світла, тож значення перевизначаємо локально. */
.svl-delivery{--ink:#111516;--muted:#6e7270;--orange:#f5a313;--orange-deep:#e88a00;
	--paper:#f4f1e9;--soft:#f1f0ec;--line:#dedfd9;color:var(--ink);color-scheme:light;
	background:#fff}
/* Тема тримає темне тло сторінки; ця сторінка світла. */
body.page-template-page-dostavka{background:#fff;color:var(--s-ink,#111516)}
.svl-delivery *{color-scheme:light}

.svl-delivery .hero{background:var(--paper);border-bottom:1px solid var(--line);grid-template-columns:minmax(0,.88fr) minmax(480px,1.12fr);width:100%;min-height:390px;display:grid;overflow:hidden}.svl-delivery .hero-copy{flex-direction:column;justify-content:center;padding:58px 7vw 45px;display:flex;position:relative}.svl-delivery .hero-copy:after{content:"";background:var(--orange);width:78px;height:3px;position:absolute;bottom:0;left:7vw}.svl-delivery .breadcrumbs{color:#8c8f8d;gap:10px;font-size:9px;display:flex;position:absolute;top:20px;left:7vw}.svl-delivery .eyebrow{color:var(--orange-deep);letter-spacing:.28em;margin:0 0 12px;font-size:9px;font-weight:500}.svl-delivery .hero h1{letter-spacing:-.055em;max-width:580px;margin:0;font-family:Manrope,sans-serif;font-size:clamp(48px,4.4vw,68px);font-weight:250;line-height:.98}.svl-delivery .hero h1 span{color:var(--orange)}.svl-delivery .hero-text{color:#565b59;letter-spacing:.025em;max-width:520px;margin:21px 0 0;font-size:14px;font-weight:500;line-height:1.55}.svl-delivery .hero-visual{background:url(/delivery-visual.png) 50%/cover no-repeat;min-height:390px;position:relative}.svl-delivery .hero-visual:after{content:"";background:linear-gradient(90deg,#f4f1e93d,#0000 28%);position:absolute;inset:0}.svl-delivery .delivery-section{background:linear-gradient(#fff 0%,#faf8f2 100%);padding:78px 0 92px}.svl-delivery .section-intro{justify-content:space-between;align-items:flex-end;gap:42px;margin:0 7vw 38px;display:flex}.svl-delivery .section-intro .eyebrow{margin:0 0 5px}.svl-delivery .section-intro h2{letter-spacing:-.045em;max-width:650px;margin:0;font-family:Manrope,sans-serif;font-size:clamp(34px,3.2vw,46px);font-weight:250;line-height:1.05}.svl-delivery .delivery-grid{border-top:3px solid var(--orange);border-bottom:1px solid var(--line);background:#fff;grid-template-columns:repeat(4,1fr);width:100%;display:grid;box-shadow:0 18px 55px #1115160b}.svl-delivery .delivery-card{border-right:1px solid var(--line);min-height:330px;padding:38px clamp(26px,3vw,54px) 42px;transition:background .25s,transform .25s;position:relative}.svl-delivery .delivery-card:last-child{border-right:0}.svl-delivery .delivery-card:hover{background:#fbf7ee;transform:translateY(-3px)}.svl-delivery .card-top{align-items:center;display:flex}.svl-delivery .card-top svg{width:72px;height:72px;color:var(--orange-deep);stroke-width:1.35px;background:linear-gradient(145deg,#fff8e9,#f5ead4);border:1px solid #f0d5a6;border-radius:22px;padding:16px;box-shadow:0 12px 28px #d17e001f}.svl-delivery .delivery-card h3{letter-spacing:-.025em;margin:55px 0 14px;font-family:Manrope,sans-serif;font-size:20px;font-weight:500}.svl-delivery .delivery-card p{color:var(--muted);margin:0;font-size:13px;line-height:1.62}.svl-delivery .installments{border:1px solid #d5d5cf;border-top:4px solid var(--orange);background:#efeee9;grid-template-columns:.92fr 1.08fr;max-width:1270px;margin:0 auto 120px;display:grid;box-shadow:0 24px 70px #11151612}.svl-delivery .installment-aside{color:var(--ink);background:#deddd7;border-right:1px solid #c9cac4;padding:64px 58px;position:relative}.svl-delivery .installment-aside:after{content:"";background:var(--orange);width:86px;height:1px;position:absolute;bottom:62px;left:58px}.svl-delivery .installment-aside h2{letter-spacing:-.05em;max-width:500px;margin:24px 0 0;font-family:Manrope,sans-serif;font-size:48px;font-weight:250;line-height:1.08}.svl-delivery .bank-name{color:#4f5452;margin:24px 0 48px;font-size:13px;font-weight:500}.svl-delivery .provider-legal{border-top:1px solid #bfc1bb;padding-top:25px}.svl-delivery .provider-legal span{color:#797e7b;letter-spacing:.18em;text-transform:uppercase;font-size:9px;display:block}.svl-delivery .provider-legal strong{margin:9px 0;font-size:16px;display:block}.svl-delivery .provider-legal p{color:#666b68;max-width:430px;margin:0;font-size:12px;line-height:1.65}.svl-delivery .installment-content{background:#f5f4ef;padding:64px 58px 48px}.svl-delivery .terms-title{color:#6f7471;letter-spacing:.2em;text-transform:uppercase;margin:0 0 28px;font-size:9px;font-weight:500}.svl-delivery .terms-list{border-top:1px solid #d1d2cc}.svl-delivery .term{border-bottom:1px solid #d8d8d1;grid-template-columns:.9fr 1.1fr;gap:30px;padding:18px 0;display:grid}.svl-delivery .term span{color:var(--muted);font-size:12px}.svl-delivery .term strong{font-size:13px;font-weight:500}.svl-delivery .legal-note{border-left:2px solid var(--orange);color:#696e6b;margin:30px 0 0;padding-left:17px;font-size:10px;line-height:1.7}.svl-delivery .legal-note a{color:#3e4341;text-underline-offset:3px;text-decoration:underline}@media (width<=1180px){.svl-delivery .hero{grid-template-columns:1fr 1fr}.svl-delivery .installments{margin-left:30px;margin-right:30px}}@media (width<=720px){.svl-delivery .hero{grid-template-columns:1fr;min-height:auto}.svl-delivery .hero-copy{min-height:250px;padding:58px 20px 36px}.svl-delivery .breadcrumbs{font-size:8px;top:17px;left:20px}.svl-delivery .hero-copy:after{width:62px;height:3px;left:20px}.svl-delivery .hero h1{font-size:clamp(42px,12vw,52px)}.svl-delivery .hero-text{margin:16px 0 5px;font-size:13px;line-height:1.5}.svl-delivery .hero-visual{background-position:50%;order:2;min-height:220px}.svl-delivery .delivery-section{padding:56px 0 66px}.svl-delivery .section-intro{margin:0 20px 28px;display:block}.svl-delivery .section-intro h2{font-size:36px}.svl-delivery .section-intro>p:last-child{margin-top:22px;font-size:13px}.svl-delivery .delivery-grid{grid-template-columns:1fr}.svl-delivery .delivery-card{border-right:0;border-bottom:1px solid var(--line);grid-template-columns:76px 1fr;align-items:start;column-gap:20px;min-height:235px;padding:28px 20px 30px;display:grid}.svl-delivery .delivery-card:last-child{border-bottom:0}.svl-delivery .card-top{grid-row:1/3}.svl-delivery .card-top svg{border-radius:21px;width:70px;height:70px;padding:16px}.svl-delivery .delivery-card h3{margin:5px 0 12px;font-size:19px}.svl-delivery .delivery-card p{font-size:13px;line-height:1.58}.svl-delivery .delivery-card:hover{transform:none}.svl-delivery .installments{grid-template-columns:1fr;margin:0 14px 78px}.svl-delivery .installment-aside{border-bottom:1px solid #c9cac4;border-right:0;padding:45px 28px 70px}.svl-delivery .installment-aside:after{bottom:36px;left:28px}.svl-delivery .installment-aside h2{font-size:39px}.svl-delivery .bank-name{margin:20px 0 34px}.svl-delivery .installment-content{padding:40px 24px 34px}.svl-delivery .term{grid-template-columns:1fr;gap:7px;padding:15px 0}}@media (width<=380px){.svl-delivery .hero h1{font-size:41px}}

/* ================================================================
   Стикування з темою
   ================================================================ */

/* На головній клас .hero — це слайдер на весь екран: height:calc(100vh-112px)
   і max-height:860px. Тут блок має висоту за вмістом, тож обидва
   значення знімаємо. */
.svl-delivery .hero{height:auto;max-height:none}
/* На головній .hero-copy — це підпис під слоганом слайдера: там задані
   max-width і зовнішні відступи. Тут це ліва колонка блока, тож знімаємо. */
.svl-delivery .hero-copy{max-width:none;margin:0;font-size:inherit;line-height:inherit;color:inherit}

/* Тема фарбує заголовки у світлий колір — сторінка світла. */
.svl-delivery h1,.svl-delivery h2,.svl-delivery h3{color:var(--ink)}
.svl-delivery .hero h1 span{color:var(--orange)}

/* Заглавне фото: окремі файли для десктопа й телефона (ТЗ §6), тому
   замість фону в CSS у розмітці стоїть <picture>. Знімок кладемо
   абсолютно: інакше він задає висоту рядка сітки й розтягує ліву
   колонку — блок виходив удвічі вищим за макет. */
.svl-delivery .hero-visual{background:none;padding:0;overflow:hidden;position:relative}
.svl-delivery .hero-visual picture{position:absolute;inset:0;display:block}
.svl-delivery .hero-visual img{position:absolute;inset:0;width:100%;height:100%;
	object-fit:cover;display:block;max-width:none}

/* Заголовок сторінки не переносимо «балансом» — у макеті звичайне перенесення. */
.svl-delivery h1,.svl-delivery h2,.svl-delivery h3,.svl-delivery p{text-wrap:initial}