@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap');
/* Rent Agro: спільне для всіх сторінок (поп-апи, фільтри, вкладки). Підключається після інлайн-стилів. */
:root{--green-dark:#2C441F}
[hidden]{display:none!important}
.cards[data-live="wait"]{visibility:hidden} /* картки першого екрана чекають даних з панелі */
.cards .c-none{grid-column:1/-1;align-self:center;justify-self:center;max-width:32em;margin:auto;padding:1.4em 1.6em;text-align:center;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9);border-radius:1em;font:400 .95em/1.45 Roboto,sans-serif;color:#3d3d3d}
.cards .c-none b{display:block;font:700 1.35em/1.15 Oswald,sans-serif;text-transform:uppercase;color:#16240E;margin-bottom:.35em}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px;opacity:0}
.f-err{background:#FBEDE8;border:1px solid #F0C4B6;color:#8A2E18;border-radius:.7em;padding:.7em .9em;
  font:400 .92em/1.45 Roboto,sans-serif;margin:.1em 0 .7em}
.f-err a{color:inherit;font-weight:700;white-space:nowrap}
form [type=submit]:disabled{opacity:.7;cursor:progress}
@media (max-width:760px){.fi input,.fi select,.fi textarea{font-size:16px!important}} /* iOS не зумить поле */

/* два номери в шапці */
.tel .tels{display:flex;flex-direction:column;gap:.12em;line-height:1.1}
.tel .tels a{color:inherit;text-decoration:none;white-space:nowrap}
.tel .tels a:hover{color:#3A5622}
.hdr:not(.shdr) .tel .tels{font-size:.8em}
.shdr .tel .tels,.fhdr .tel .tels{font-size:.9em}
a.logo,a.logo2,a.tel{text-decoration:none}
/* лого першого екрана Oswald, як у плаваючій шапці і на внутрішніх сторінках */
.hdr .logo{font-family:Oswald,'Roboto Condensed',sans-serif}
#catalog,#steps,#apply,#req{scroll-margin-top:6em}
/* меню першого екрана стало довшим на «Головна» і «Актуальні замовлення»: без розтягу по X, щоб не налазило на телефон */
@media (min-width:761px){.hdr:not(.shdr) .nav{transform:translateY(-50%);gap:1em}}

/* фільтри: нативний select / календар прозорим шаром поверх чипа, клікабельний увесь чип */
.chip{position:relative}
.chip>select,.chip>input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;
  border:0;margin:0;padding:0;font-size:16px;-webkit-appearance:none;appearance:none}
/* нативний список і календар не відкриваються: клік ловить обгортка, відкривається .pop з site.js */
.chip>select,.chip>input,.fi>select,.fi>input[data-date],.sel>select,.sel>input{pointer-events:none}
.fi:has(>select),.fi:has(>input[data-date]),.sel{cursor:pointer}
.sel{position:relative;min-width:0}
.chip .caret,.chip .c{transition:rotate .18s}
.chip.open{border-color:#9CC27A;box-shadow:0 0 0 3px rgba(156,194,122,.25)}
.chip.open .caret,.chip.open .c{rotate:180deg}
.fi.open>select,.fi.open>input,.sel.open>select,.sel.open>input{border-color:#9CC27A!important;box-shadow:0 0 0 3px rgba(156,194,122,.25)}

/* ── випадайка і календар у стилі сайту ─────────────── */
.pop{position:fixed;z-index:1000;background:#FFFDF8;border:1px solid #EFE7D8;border-radius:1em;padding:.4em;
  box-shadow:0 1.2em 2.8em rgba(70,58,32,.18),0 .2em .6em rgba(70,58,32,.06);overflow:auto;scrollbar-width:none;
  font:400 15px/1.25 Roboto,system-ui,sans-serif;color:#1d1d1b;animation:popIn .16s ease-out}
.pop::-webkit-scrollbar{display:none}
@keyframes popIn{from{opacity:0;translate:0 -.35em}to{opacity:1;translate:0 0}}
.pop-list{display:grid;gap:2px}
.pop-2{grid-template-columns:1fr 1fr;column-gap:.3em;width:min(25em,calc(100vw - 16px))}
.pop-2 .pop-o:first-child{grid-column:1/-1}
@media (min-width:700px){.pop-2{grid-template-columns:repeat(3,1fr);width:35em}}
.pop-o{display:flex;align-items:center;justify-content:space-between;gap:.6em;width:100%;text-align:left;border:0;
  background:transparent;border-radius:.6em;padding:.72em .85em;font:inherit;color:inherit;cursor:pointer;white-space:nowrap}
.pop-o:hover,.pop-o:focus-visible{background:#F2F8EB;outline:0}
.pop-o.on{background:#3A5622;color:#fff;font-weight:500}
.pop-o.on::after{content:'';width:.8em;height:.42em;border:solid #E3B75C;border-width:0 0 2px 2px;rotate:-45deg;translate:0 -.12em;flex:none}
.pop-cal{width:19.5em;padding:.9em}
.cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:.55em}
.cal-h b{font:700 1.15em/1 Oswald,sans-serif;text-transform:uppercase;letter-spacing:.02em;color:#16240E}
.cal-n{width:2.2em;height:2.2em;border:1px solid #EFE7D8;background:#fff;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .16s}
.cal-n:hover:not(:disabled){background:#F2F8EB}
.cal-n svg{width:1em;height:1em;stroke:#3A5622;stroke-width:2.2;fill:none}
.cal-n:disabled{opacity:.35;cursor:default}
.cal-w,.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.cal-w span{font:500 .75em/2.2 Roboto,sans-serif;color:#8A8D84;text-transform:uppercase}
.cal-g button{aspect-ratio:1;border:0;background:transparent;border-radius:.6em;font:inherit;color:#1d1d1b;cursor:pointer}
.cal-g button:hover:not(:disabled),.cal-g button:focus-visible{background:#F2F8EB;outline:0}
.cal-g button.now{box-shadow:inset 0 0 0 1.5px #E3B75C;font-weight:500}
.cal-g button.on{background:#3A5622;color:#fff;font-weight:500;box-shadow:none}
.cal-g button:disabled{color:#CFC7B4;cursor:default}
.cal-f{display:flex;justify-content:flex-end;margin-top:.5em;border-top:1px solid #F0E9DC;padding-top:.5em}
.cal-f button{border:0;background:transparent;color:#3A5622;font:500 .92em/1 Roboto,sans-serif;padding:.6em .8em;border-radius:.5em;cursor:pointer}
.cal-f button:hover{background:#F2F8EB}
.chip.set{border-color:#9CC27A;background:#F4F9EE}
.chip.set span{color:#2C441F;font-weight:500}
@media (max-width:760px){.sec2 .filters .chip{width:100%}}
.chip:focus-within{border-color:#9CC27A;box-shadow:0 0 0 3px rgba(156,194,122,.25)}

/* кнопка «Додати техніку» */
.addbtn{display:inline-flex;align-items:center;gap:.55em;background:#3A5622;color:#fff;border-radius:.65em;
  padding:.95em 1.5em;font:500 1em/1 Roboto,system-ui,sans-serif;text-decoration:none;white-space:nowrap;
  box-shadow:0 .45em 1.1em rgba(61,90,44,.28);transition:background .18s,translate .18s}
.addbtn:hover{background:#2C441F;translate:0 -2px}
.addbtn svg{width:1.15em;height:1.15em;stroke:#E3B75C;stroke-width:2.4;fill:none}
.addbtn.ghost{background:#fff;color:#2C441F;border:1.5px solid #3A5622;box-shadow:0 .3em .9em rgba(90,75,45,.08)}
.addbtn.ghost:hover{background:#3A5622;color:#fff}

/* каталог на головній */
.cathead{display:flex;align-items:flex-end;justify-content:space-between;gap:1.2em 2em;flex-wrap:wrap;margin-bottom:1.9em}
.cathead .lead{margin-bottom:0!important}
.mc .foot{grid-template-columns:1fr}
.empty .reset,.oempty .reset{display:inline-block;margin-left:1em;color:#3A5622;font:500 .98em/1 Roboto,sans-serif}

/* порожній стан на сторінці замовлень */
.oempty{background:#fff;border:1px solid #F0E9DC;border-radius:1em;padding:1.6em 1.6em 1.7em;text-align:center;
  max-width:46em;margin:0 auto;box-shadow:0 .4em 1em rgba(90,75,45,.06)}
.oempty b{display:block;font:700 1.28em/1.3 Roboto,sans-serif;color:#16240E;margin-bottom:.35em}
.oempty p{color:#4a4a4a;margin-bottom:1.1em}
.pacts{display:flex;flex-wrap:wrap;align-items:center;gap:.8em}

/* «Як це працює»: дві вкладки */
.stephead{margin-bottom:1.4em!important}
.tabs{display:inline-flex;gap:.35em;background:#fff;border:1px solid #EFE7D8;border-radius:99px;padding:.35em;
  margin:0 0 2.4em;box-shadow:0 .4em 1em rgba(120,100,60,.08)}
.tab{border:0;background:transparent;border-radius:99px;padding:.85em 1.6em;font:500 1.02em/1 Roboto,sans-serif;
  color:#3d3d3d;cursor:pointer;transition:background .18s,color .18s}
.tab:hover{color:#2C441F}
.tab.on{background:#3A5622;color:#fff}
@media (max-width:620px){.tabs{display:flex}.tab{flex:1;padding:.85em .5em;font-size:.95em;min-height:44px}}
/* на телефоні кнопки під палець не нижчі за 44 px */
@media (max-width:640px){.mc .go{height:44px;font-size:15px}}

/* select у формах заявки */
.fi select{width:100%;-webkit-appearance:none;appearance:none;background:rgba(255,255,255,.62);
  border:1px solid rgba(160,150,120,.22);border-radius:.8em;padding:1em 1.1em 1em 3em;font:400 1.02em/1.3 Roboto,sans-serif;color:#1d1d1b}
.fi select:invalid{color:#8A8D84}
.fi select:focus{outline:0;background:#fff;border-color:#B4D68C}

/* ── картка замовлення за макетом 13.09 (розміри з макета при 1672px, 1em = 17.42px) ── */
.ogrid{gap:1.2em .98em!important}
.ogrid .oc{padding:.25em;border-radius:.69em;background:#FEFEFE;border:1px solid #F0EADF;
  box-shadow:0 .45em 1.3em rgba(90,75,45,.08)}
.ogrid .oc .oph{position:relative;aspect-ratio:450/110;border-radius:.57em .57em .4em .4em;overflow:hidden;background:#E9E1CF}
.ogrid .oc .oph img{width:100%;height:100%;object-fit:cover;display:block}
.ogrid .oc .st{position:absolute;left:1.15em;top:1.15em;display:inline-flex;align-items:center;gap:.57em;margin:0;
  background:rgba(238,244,226,.95);border:1px solid rgba(199,222,177,.9);color:#355121;border-radius:99px;
  padding:.63em .96em .63em .88em;font:400 .75em/1 Roboto,sans-serif;box-shadow:0 .2em .6em rgba(40,50,20,.12)}
.ogrid .oc .st i{width:.92em;height:.92em;border-radius:50%;background:radial-gradient(circle,#B9DDA0 0 26%,#569E3C 30%)}
.ogrid .oc .ob{padding:0 .63em .38em;display:flex;flex-direction:column;flex:1}
.ogrid .oc h3{font:700 1.31em/1.1 'Roboto Condensed',Oswald,sans-serif;text-transform:uppercase;color:#111;margin:.55em 0 .1em .2em;letter-spacing:.005em}
.ogrid .oc .need{font:400 .86em/1.3 Roboto,sans-serif;color:#616770;margin:0 0 .85em .25em}
.ogrid .oc .meta{display:grid;grid-template-columns:1fr 1.104fr 1.042fr;gap:.4em;padding:0 0 .78em .52em;margin:0 0 .37em;border-bottom:1px solid #ECE5D8}
.ogrid .oc .meta div{display:flex;align-items:center;gap:.8em;font:400 .72em/1.2 Roboto,sans-serif;color:#636B74}
.ogrid .oc .meta span{display:block}
.ogrid .oc .meta b{display:block;font:500 1.12em/1.25 Roboto,sans-serif;color:#111;margin:0;white-space:nowrap}
.ogrid .oc .oi{width:1.45em;height:1.45em;flex:none;fill:none;stroke:#E3920F;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin:0}
.ogrid .oc .oi.ear{width:1.35em;height:2.25em;margin-top:.3em}
/* шпилька по центру двох рядків і 14x20 як у макеті (контур займає ~14/24 ширини рамки); календар по верху підпису */
.ogrid .oc .oi.pin{width:2.08em;height:2.08em;margin:0 -.45em}
.ogrid .oc .oi.cal{align-self:flex-start;margin-top:.1em}
.ogrid .oc .oi .f{fill:#E3920F;stroke:none}
.ogrid .oc .rate{display:flex;align-items:center;justify-content:center;gap:.8em;height:3.52em;margin:0 0 .15em;
  background:#F6F7F0;border-radius:.75em;font:400 .75em/1 Roboto,sans-serif;color:#2C4B21;text-align:center}
.ogrid .oc .rate .coins{width:1.5em;height:1.6em;flex:none;margin-left:.3em}
.ogrid .oc .rate b{font:700 2.14em/1 Roboto,sans-serif;color:#111;margin:0;vertical-align:baseline}
.ogrid .oc .rate em{font:400 1.22em/1 Roboto,sans-serif;color:#2d2a22;font-style:normal;margin:0}
.ogrid .oc .go{display:flex;align-items:center;justify-content:center;gap:.75em;height:2.1em;margin-top:auto;
  background:#345523;color:#fff;border-radius:.4em;font:700 .86em/1 Roboto,sans-serif;text-decoration:none;transition:background .18s}
.ogrid .oc .go{height:2.52em}
.ogrid .oc .go:hover{background:#2A461C}
.ogrid .oc .arr{width:1.05em;height:1.05em;fill:none;stroke:#D8BD68;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:760px){
  .ogrid .oc .meta{grid-template-columns:1fr;gap:.6em}
  .ogrid .oc .meta div{font-size:.9em;align-items:center}
  .ogrid .oc .meta span{display:flex;align-items:baseline;gap:.4em}
  .ogrid .oc .meta b{display:inline}
  .ogrid .oc .oi.ear{width:1.45em;height:1.6em;margin:0}
}
@media (max-width:640px){
  .ogrid .oc .oph{aspect-ratio:450/160}
  .ogrid .oc .st{left:.8em;top:.8em;font-size:.9em}
  .ogrid .oc .need{font-size:.95em}
  .ogrid .oc .rate{height:auto;padding:.8em .6em;flex-wrap:wrap;font-size:.92em}
  .ogrid .oc .go{height:46px;font-size:15px}
  .shdr .cta{min-height:44px}
  .shdr .burger{width:44px;height:44px;padding:0 10px}
  .chip,.more a{min-height:44px}
}

/* ширина контенту внутрішніх сторінок як у макеті: шапка 85em, контент 86.4em */
@media (min-width:1101px){.shdr{max-width:85em!important}.in{max-width:86.4em}}

/* сторінка замовлень: ритм над картками як у макеті (текст, кнопки й фільтри дрібніші, щільніше) */
@media (min-width:1101px){
  .p-orders .phero p{font-size:.86em;line-height:1.47;margin-bottom:.8em}
  .p-orders .livepill{font-size:.82em;padding:.78em 1.15em}
  .p-orders .livepill i{outline:.54em solid rgba(120,185,100,.2);margin:0 .2em 0 .35em}
  .p-orders .pacts .addbtn{font-size:.93em;padding:.76em 1.1em}
  .p-orders .phero{padding-bottom:.6em}
  .p-orders .pherogrid{align-items:end}
  .p-orders .pshot{height:16em;margin-bottom:.6em;border-radius:15em 0 0 1.2em;border-right:0;
    margin-right:calc((min(100vw, 86.4em) - 100vw) / 2 - 2.6em);
    -webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
  .p-orders .pshot img{border-radius:14.7em 0 0 1em}
  .p-orders .fbar{padding:.45em 0 .82em}
  .p-orders .chip{font-size:.86em;padding:.72em 1em}
}

/* великий колосок ліворуч від карток замовлень */
.obody{position:relative}
.obody .stalk{position:absolute;top:1.38em;left:calc(50% - 43.2em + 2.6em - 6.26em);width:6.14em;pointer-events:none}
@media (max-width:1259px){.obody .stalk{display:none}}

/* реквізити на контактах */
.req b{color:#16240E;font-weight:500}

/* ── поп-ап ─────────────────────────────────────────── */
.dlg{border:0;padding:0;margin:auto;border-radius:1.4em;width:min(31em,calc(100vw - 24px));max-height:calc(100dvh - 24px);
  background:#FBF6EC;color:#16240E;box-shadow:0 2em 5em rgba(20,30,10,.35);overflow:auto;
  font:400 clamp(14px,calc(100vw/1536*16),17px)/1.5 Roboto,system-ui,sans-serif}
.dlg::backdrop{background:rgba(22,36,14,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.dlg[open]{animation:dlgIn .28s cubic-bezier(.22,.68,.28,1)}
@keyframes dlgIn{from{opacity:0;translate:0 1em}to{opacity:1;translate:0 0}}
.dlg-in{position:relative;padding:1.9em 1.8em 1.5em}
.dlg-x{position:absolute;right:.8em;top:.8em;width:2.5em;height:2.5em;border:0;border-radius:50%;background:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 .2em .6em rgba(90,75,45,.14)}
.dlg-x svg{width:1.05em;height:1.05em;stroke:#16240E;stroke-width:2.2;fill:none}
.dlg-cap{font:700 .8em/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.16em;color:#C98A1C;margin-bottom:.6em}
.dlg-h{font:700 2em/1.05 Oswald,sans-serif;text-transform:uppercase;color:#16240E;margin:0 2.2em .4em 0}
.dlg-ctx{display:inline-block;background:#EDF5E3;border:1px solid #C7DEB1;color:#3F6118;border-radius:.6em;
  padding:.45em .8em;font-size:.92em;line-height:1.35;margin-bottom:.8em}
.dlg-ctx:empty{display:none}
.dlg-lead{color:#4a4a4a;font-size:.98em;margin:0 0 1.1em}
.dlg-f{display:grid;gap:.6em}
.dlg-f .r2{display:grid;grid-template-columns:1fr 1fr;gap:.6em}
.dlg-f input,.dlg-f select,.dlg-f textarea{width:100%;min-width:0;background:#fff;border:1px solid #E7DECB;border-radius:.7em;
  padding:.9em 1em;font:400 16px/1.3 Roboto,sans-serif;color:#1d1d1b;-webkit-appearance:none;appearance:none}
.dlg-f select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8D84' stroke-width='2.4'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right .9em center/.85em;padding-right:2.3em}
.dlg-f select:invalid{color:#8A8D84}
.dlg-f textarea{min-height:4.8em;resize:vertical}
.dlg-f input:focus,.dlg-f select:focus,.dlg-f textarea:focus{outline:0;border-color:#9CC27A;box-shadow:0 0 0 3px rgba(156,194,122,.25)}
.dlg-send{margin-top:.3em;height:3.3em;width:100%;border:0;border-radius:.7em;background:#3A5622;color:#fff;
  font:500 1.05em/1 Roboto,sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.55em;transition:background .18s}
.dlg-send:hover{background:#2C441F}
.dlg-send svg{width:1.15em;height:1.15em;stroke:#E3B75C;stroke-width:1.9;fill:none}
.dlg-ok{text-align:center;padding:.4em 0 .2em}
.dlg-ok i{width:3.6em;height:3.6em;margin:0 auto .9em;border-radius:50%;background:#3A5622;display:flex;align-items:center;justify-content:center}
.dlg-ok i svg{width:1.7em;height:1.7em;stroke:#fff;stroke-width:2.6;fill:none}
.dlg-ok b{display:block;font:700 1.6em/1.1 Oswald,sans-serif;text-transform:uppercase;margin-bottom:.4em}
.dlg-ok p{color:#4a4a4a;margin:0 0 1.2em}
.dlg-tel{margin-top:1.1em;padding-top:.95em;border-top:1px solid #EDE5D6;font-size:.92em;color:#6F726A;
  display:flex;flex-wrap:wrap;align-items:center;gap:.35em 1em}
.dlg-tel a{color:#16240E;font-weight:500;text-decoration:none;white-space:nowrap}
.dlg-tel a:hover{color:#3A5622}
@media (max-width:480px){.dlg-in{padding:1.6em 1.2em 1.3em}.dlg-f .r2{grid-template-columns:1fr}.dlg-h{font-size:1.7em}}

/* логотип Rent Agro з пакета клієнта 19.09 (картинка замість svg-колоска і тексту) */
.logo img,.logo2 img{display:block;width:auto;height:2.1em}
.hdr .logo img{height:1.95em}
.ftr .logo2 img{height:2.2em}

/* логотип Rent Agro з пакета клієнта 19.09 (картинка замість svg-колоска і тексту) */
.logo img,.logo2 img{display:block;width:auto;height:2.1em}
.hdr .logo img{height:1.95em}
.ftr .logo2 img{height:2.2em}