#oe-root,
#oe-inline {
--oe-paper: #fff;
--oe-soft: #f4f4f4;
--oe-ink: #333;
--oe-ink-strong: #000;
--oe-muted: #6b6b6b;
--oe-line: #e2e2e2;
--oe-line-strong: #c4c4c4;
--oe-red: #cd2424;
--oe-red-dark: #b31d1d;
--oe-red-soft: #fbeaea;
--oe-font: "Raleway", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
} #oe-root {
position: fixed;
inset: 0;
z-index: 100001;
display: flex;
align-items: flex-start;
justify-content: center;
overflow-y: auto;
background: rgba(0, 0, 0, 0.45);
padding: max(40px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px))
max(40px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
} #oe-root[hidden] {
display: none;
} html.oe-lock,
html.oe-lock body {
overflow: hidden;
} html.oe-lock-gutter {
scrollbar-gutter: stable;
} #oe-root .oe {
all: initial;
display: block;
box-sizing: border-box;
position: relative;
width: 100%;
max-width: 734px;
margin: auto 0;
border-radius: 12px;
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.03);
background: var(--oe-paper);
color: var(--oe-ink);
font-family: var(--oe-font);
font-size: 15px;
line-height: 1.5;
text-align: left;
} #oe-root :where(:not(svg *)),
#oe-inline :where(:not(svg *)) {
all: revert;
box-sizing: border-box;
margin: 0;
padding: 0;
} #oe-root :where(button, input, textarea),
#oe-inline :where(button) {
font-family: inherit;
color: inherit;
}
#oe-root button {
cursor: pointer;
} #oe-root svg * {
fill: none;
stroke: none;
stroke-width: 0;
transform: none;
}
#oe-root .oe :focus-visible,
#oe-inline :focus-visible {
outline: 2px solid var(--oe-red);
outline-offset: 2px;
}
#oe-root .oe-in {
display: flex;
flex-direction: column;
gap: 22px;
padding: 95px;
}
#oe-root .oe-close {
position: absolute;
top: 29px;
right: 45px;
display: grid;
place-items: center;
width: 40px;
height: 40px;
padding: 0;
border: 0;
background: transparent;
}
#oe-root .oe-close svg {
width: 18px;
height: 18px;
} #oe-root .oe-close path {
stroke: var(--oe-red);
stroke-width: 2.2;
stroke-linecap: round;
} #oe-root .oe-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
padding-right: 0;
} #oe-root .oe-eyebrow,
#oe-inline .oe-eyebrow {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
font-weight: 700;
line-height: 1.5;
letter-spacing: 1px;
text-transform: uppercase;
color: var(--oe-ink);
}
#oe-root .oe-eyebrow::before,
#oe-inline .oe-eyebrow::before {
content: "";
flex: none;
width: 30px;
height: 1px;
background: var(--oe-red);
}
#oe-root .oe-owner {
margin: 4px 0 0 42px;
font-size: 12.5px;
color: var(--oe-muted);
}
#oe-root .oe-lang {
display: flex;
flex: none;
border: 1px solid var(--oe-line-strong);
}
#oe-root .oe-lang button {
padding: 6px 10px;
border: 0;
background: transparent;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
color: var(--oe-muted);
}
#oe-root .oe-lang button[aria-pressed="true"] {
background: var(--oe-ink);
color: #fff;
} #oe-root .oe-step {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 38px;
}
#oe-root .oe-dial {
flex: none;
width: 52px;
height: 52px;
}
#oe-root .oe-dial .rim {
fill: none;
stroke: var(--oe-ink);
stroke-width: 1.2;
}
#oe-root .oe-dial .tick {
stroke: var(--oe-line-strong);
stroke-width: 1.6;
stroke-linecap: round;
}
#oe-root .oe-dial .tick.on {
stroke: var(--oe-ink);
}
#oe-root .oe-dial .hand {
stroke: var(--oe-red);
stroke-width: 1.6;
stroke-linecap: round;
transform-origin: 26px 26px;
transition: transform 0.55s cubic-bezier(0.3, 1.5, 0.5, 1);
}
#oe-root .oe-dial .pin {
fill: var(--oe-ink);
}
#oe-root .oe-title {
font-size: 40px;
font-weight: 700;
line-height: 1.05;
color: var(--oe-ink);
text-wrap: balance;
} #oe-root .oe-title:focus {
outline: none;
}
#oe-root .oe-sub {
margin-top: 4px;
font-size: 14.5px;
color: var(--oe-muted);
}
#oe-root .oe-body {
display: flex;
flex-direction: column;
gap: 14px;
min-width: 0;
}
#oe-root .oe-results {
display: flex;
flex-direction: column;
gap: 14px;
} #oe-root .oe-opts {
display: flex;
flex-direction: column;
gap: 8px;
}
#oe-root .oe-opt {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 2px;
width: 100%;
padding: 14px 18px;
border: 1px solid var(--oe-line-strong);
border-radius: 0;
background: var(--oe-paper);
text-align: left;
}
#oe-root .oe-opt b {
font-size: 15.5px;
font-weight: 700;
}
#oe-root .oe-opt span {
font-size: 13.5px;
color: var(--oe-muted);
}
#oe-root .oe-chips {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
#oe-root .oe-chip {
padding: 9px 14px;
border: 1px solid var(--oe-line-strong);
border-radius: 0;
background: var(--oe-paper);
font-size: 14px;
line-height: 1.25;
text-align: left;
}
#oe-root .oe-opt:hover,
#oe-root .oe-chip:hover {
border-color: var(--oe-ink);
}
#oe-root .oe-opt[aria-pressed="true"],
#oe-root .oe-chip[aria-pressed="true"] {
border-color: var(--oe-ink);
background: var(--oe-ink);
color: #fff;
}
#oe-root .oe-opt[aria-pressed="true"] span {
color: #d6d6d6;
}
#oe-root .oe-grid2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 6px;
}
#oe-root .oe-grid2 .oe-chip {
padding: 11px 14px;
}
#oe-root .oe-field {
display: flex;
flex-direction: column;
gap: 6px;
}
#oe-root .oe-label {
font-size: 13px;
font-weight: 700;
letter-spacing: 0.5px;
text-transform: uppercase;
color: var(--oe-ink);
} #oe-root .oe-input {
display: block;
width: 100%;
height: 66px;
padding: 0 20px;
border: 1px solid var(--oe-ink);
border-radius: 0;
outline: 0;
background: var(--oe-paper);
font-size: 15px;
line-height: 1.4;
}
#oe-root .oe-input::placeholder {
font-size: 14px;
text-transform: uppercase;
color: #757575;
opacity: 1;
}
#oe-root textarea.oe-input {
height: auto;
min-height: 120px;
padding: 20px;
resize: vertical;
}
#oe-root .oe-list {
max-height: 230px;
padding: 10px;
border: 1px solid var(--oe-line);
overflow: auto;
}
#oe-root .oe-link {
align-self: flex-start;
padding: 0;
border: 0;
background: none;
font-size: 14px;
font-weight: 600;
text-decoration: underline;
text-decoration-color: var(--oe-red);
text-underline-offset: 4px;
color: var(--oe-ink);
}
#oe-root .oe-check {
display: flex;
align-items: center;
gap: 10px;
font-size: 14.5px;
cursor: pointer;
}
#oe-root .oe-check input {
flex: none;
width: 18px;
height: 18px;
accent-color: var(--oe-red);
}
#oe-root .oe-hint {
padding: 10px 14px;
background: var(--oe-soft);
font-size: 13.5px;
color: var(--oe-muted);
}
#oe-root .oe-from {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
padding: 10px 14px;
background: var(--oe-soft);
font-size: 14px;
}
#oe-root .oe-warn {
font-size: 13.5px;
color: var(--oe-red);
} #oe-root .oe-foot {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 10px;
}
#oe-root .oe-btn,
#oe-inline .oe-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 62px;
padding: 0 30px;
border: 1px solid var(--oe-ink);
border-radius: 0;
background: var(--oe-paper);
font-family: var(--oe-font);
font-size: 14px;
font-weight: 700;
letter-spacing: 0.02em;
text-decoration: none;
text-transform: uppercase;
color: var(--oe-ink);
cursor: pointer;
}
#oe-root .oe-btn:hover,
#oe-inline .oe-btn:hover {
background: var(--oe-soft);
color: var(--oe-ink);
}
#oe-root .oe-btn.main {
background: var(--oe-ink);
color: #fff;
}
#oe-root .oe-btn.main:hover {
background: var(--oe-ink-strong);
color: #fff;
}
#oe-root .oe-btn.cta {
width: 100%;
border-color: var(--oe-red);
background: var(--oe-red);
font-size: 15px;
color: #fff;
}
#oe-root .oe-btn.cta:hover {
border-color: var(--oe-red-dark);
background: var(--oe-red-dark);
color: #fff;
} #oe-root .oe-tags {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
#oe-root .oe-tag {
padding: 3px 10px;
border: 1px solid var(--oe-line-strong);
font-size: 12.5px;
font-weight: 600;
}
#oe-root .oe-block {
display: flex;
flex-direction: column;
gap: 8px;
}
#oe-root .oe-rows {
display: flex;
flex-direction: column;
}
#oe-root .oe-row {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 16px;
padding: 11px 0;
border-bottom: 1px solid var(--oe-line);
}
#oe-root .oe-row:first-child {
border-top: 1px solid var(--oe-line);
}
#oe-root .oe-row .n {
min-width: 0;
}
#oe-root .oe-row .p {
white-space: nowrap;
font-variant-numeric: lining-nums tabular-nums;
}
#oe-root .oe-row.main .n {
font-weight: 600;
}
#oe-root .oe-row.main .p {
font-weight: 700;
color: var(--oe-ink-strong);
}
#oe-root .oe-row .p.soft {
text-align: right;
white-space: normal;
color: var(--oe-muted);
}
#oe-root .oe-tip {
padding: 12px 16px;
border-left: 2px solid var(--oe-red);
background: var(--oe-soft);
font-size: 14.5px;
}
#oe-root .oe-tip b {
display: block;
margin-bottom: 2px;
font-size: 12px;
letter-spacing: 1px;
text-transform: uppercase;
}
#oe-root .oe-tip.urgent {
background: var(--oe-red-soft);
}
#oe-root .oe-tip.urgent b {
color: var(--oe-red);
}
#oe-root .oe-perks {
display: flex;
flex-wrap: wrap;
gap: 8px 22px;
list-style: none;
font-size: 14.5px;
}
#oe-root .oe-perks li {
display: flex;
align-items: center;
gap: 10px;
}
#oe-root .oe-perks li::before {
content: "";
flex: none;
width: 18px;
height: 1px;
background: var(--oe-red);
}
#oe-root .oe-premium {
padding: 12px 16px;
border: 1px solid var(--oe-ink);
font-size: 14.5px;
}
#oe-root .oe-msg {
padding: 12px 14px;
background: var(--oe-soft);
font-family: inherit;
font-size: 13.5px;
white-space: pre-wrap;
}
#oe-root .oe-copy {
align-self: flex-start;
padding: 4px 10px;
border: 1px solid var(--oe-line-strong);
background: var(--oe-paper);
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
}
#oe-root .oe-contacts {
display: grid;
grid-template-columns: auto 1fr;
gap: 6px 16px;
font-size: 14.5px;
}
#oe-root .oe-contacts dt {
color: var(--oe-muted);
}
#oe-root .oe-contacts dd {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 4px 12px;
}
#oe-root .oe-tel {
text-decoration: none;
color: inherit;
}
#oe-root .oe-fine {
font-size: 12.5px;
color: var(--oe-muted);
}  #oe-inline {
all: initial;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 16px 32px;
margin: 48px 0 8px;
padding: 28px 32px;
background: var(--oe-soft);
font-family: var(--oe-font);
font-size: 15px;
line-height: 1.5;
text-align: left;
color: var(--oe-ink);
} #oe-inline.oe-inline--top {
flex: 0 0 100%;
width: 100%;
margin: 0;
} #oe-inline.oe-inline--contrast {
background: var(--oe-paper);
}
#oe-inline .oe-inline-text {
display: flex;
flex: 1 1 320px;
flex-direction: column;
gap: 6px;
min-width: 0;
}
#oe-inline .oe-inline-text .oe-eyebrow {
margin: 0;
font-size: 14px;
}
#oe-inline .oe-inline-text p {
margin: 0 0 0 42px;
font-size: 15px;
line-height: 1.5;
color: var(--oe-ink);
}
#oe-inline .oe-btn {
flex: none;
border-color: var(--oe-red);
background: var(--oe-red);
color: #fff;
}
#oe-inline .oe-btn:hover {
border-color: var(--oe-red-dark);
background: var(--oe-red-dark);
color: #fff;
}   @media (min-width: 1600px) {
#oe-root .oe-input {
height: 80px;
}
#oe-root .oe-btn {
min-height: 74px;
}
#oe-root .oe-close {
top: 31px;
}
} @media (max-width: 991px) {
#oe-root .oe {
max-width: 670px;
}
#oe-root .oe-in {
padding: 60px;
}
#oe-root .oe-close {
top: 24px;
right: 41px;
}
#oe-root .oe-head {
padding-right: 28px;
}
#oe-root .oe-title {
font-size: 35px;
}
}
@media (max-width: 699px) {
#oe-root .oe-title {
font-size: 28px;
}
} @media (max-width: 575px) {
#oe-root {
padding-top: max(12px, env(safe-area-inset-top, 0px));
padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
}
#oe-root .oe {
max-width: 340px;
}
#oe-root .oe-in {
padding: 40px;
}
#oe-root .oe-close {
top: 14px;
right: 9px;
} #oe-root .oe-head {
flex-direction: column;
gap: 10px;
padding-right: 16px;
}
#oe-root .oe-title {
font-size: 20px;
}
#oe-root .oe-step {
margin-bottom: 18px;
}
#oe-root .oe-input {
height: 45px;
}
#oe-inline {
padding: 22px 18px;
}
#oe-inline .oe-inline-text p {
margin-left: 0;
}
#oe-inline .oe-btn {
width: 100%;
}
}
@media (max-width: 420px) {
#oe-root .oe-grid2 {
grid-template-columns: 1fr;
}
#oe-root .oe-foot .oe-btn {
flex: 1 1 auto;
padding: 0 18px;
}
}
@media (prefers-reduced-motion: reduce) {
#oe-root .oe-dial .hand {
transition: none;
}
}