.xonik-contact .con-sec { padding: 78px 0; } .xonik-contact .con-sec--dense { padding: 62px 0; } .xonik-contact .con-sec--ink { padding: 104px 0; } .xonik-contact .mech-cols, .xonik-contact .gridcards, .xonik-contact .stages, .xonik-contact .dl-grid, .xonik-contact .faq { margin-top: 30px; } .xonik-contact .deliv-row:first-of-type { margin-top: 30px; } .xonik-contact section + section { border-top: 1px solid var(--line); } .xonik-contact section.band + section:not(.band), .xonik-contact section:not(.band) + section.band, .xonik-contact section.inkbg + section, .xonik-contact section + section.inkbg { border-top: 0; } .xonik-contact .gridcards--3 > div { display: flex; flex-direction: column; } .xonik-contact .gridcards--3 h3 { margin-bottom: 8px; } .xonik-contact .gridcards--3 p:not(.best-if) { flex: 1 0 auto; } .xonik-contact .best-if { font-size: 13px; color: var(--fg-3); margin: 0 0 16px; padding-top: 16px; border-top: 1px solid var(--line); } .xonik-contact .gridcards--3 .cta { display: inline-block; } .xonik-contact .deliv-row.hard h3 { color: var(--terra); } .xonik-contact .dl-grid { grid-column: 1/13; display: grid; grid-template-columns: minmax(280px, 5fr) minmax(320px, 7fr); gap: 0 60px; align-items: start; } .xonik-contact .dl-copy h3 { margin-bottom: 10px; } .xonik-contact .dl-copy p { font-size: 14.5px; max-width: 46ch; } .xonik-contact .dl-form { background: var(--paper); border: 1px solid var(--line); padding: 32px; } @media (max-width: 1000px) { .xonik-contact .dl-grid { grid-template-columns: 1fr; gap: 40px 0; } } .xonik-contact .xonik-form__form { display: grid; gap: 18px; } .xonik-contact .xonik-form__field { margin: 0; display: grid; gap: 8px; } .xonik-contact .xonik-form__field label { font-size: 13px; font-weight: 600; color: var(--fg); } .xonik-contact .xonik-form__field:has([name="sector"]), .xonik-contact .xonik-form__field:has(textarea) { grid-column: 1/-1; } .xonik-contact .xonik-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; } .xonik-contact .xonik-form__input, .xonik-contact input.xonik-form__input, .xonik-contact select.xonik-form__input, .xonik-contact textarea.xonik-form__input { height: 44px; width: 100%; padding: 0 14px; border: 1px solid var(--line); border-radius: 0; background: var(--ground); color: var(--fg); font-family: var(--sans); font-size: 14.5px; -webkit-appearance: none; appearance: none; } .xonik-contact textarea.xonik-form__input { height: auto; min-height: 120px; padding: 12px 14px; resize: vertical; } .xonik-contact select.xonik-form__input { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23646464' stroke-width='1.5'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; } .xonik-contact .xonik-form__input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(27,77,228,.12); } .xonik-contact .xonik-form__submit { background: var(--accent); color: #fff; border: 0; border-radius: 0; height: 46px; width: 100%; font-family: var(--sans); font-size: 12.5px; letter-spacing: .09em; text-transform: uppercase; cursor: pointer; } .xonik-contact .xonik-form__submit:hover { background: #0F3BC4; } .xonik-contact .dl-consent-note { font-size: 12.5px; color: var(--fg-3); margin-top: 12px; } @media (max-width: 1000px) { .xonik-contact .xonik-form__row { grid-template-columns: 1fr; } .xonik-contact .deliv-row { grid-template-columns: 1fr; gap: 8px; } }