/* Home page (index.html) only: the hero start box, the hero spacing, and the header fit between 992 and 1299 px. */
/* ===== The start box (same idea as the phase 1 box of the home page): one field, one button, a tag that shows what we read ===== */
.if-start { max-width: 620px; margin: 0 0 22px; text-align: left; }
.if-start-row { display: flex; gap: 8px; }
.if-start-field { position: relative; flex: 1 1 auto; min-width: 0; }
.if-start-field input { width: 100%; min-height: 52px; padding: 12px 16px; font-size: 16px; line-height: 1.3; border: 2px solid transparent; border-radius: 8px; background: #fff; color: #353535; }
.if-start-field input::placeholder { color: #6b7280; opacity: 1; }
.if-start-field.has-tag input { padding-right: 64px; }
.if-start-field input:focus { outline: none; border-color: rgb(237 191 74); box-shadow: 0 0 0 3px rgba(237, 191, 74, .35); }
.if-start-field input[aria-invalid="true"] { border-color: #c0392b; }
.if-start-kind { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); padding: 4px 6px; font-size: 11px; font-weight: 700; line-height: 1; letter-spacing: .06em; color: #353535; background: #f3e3b3; border-radius: 4px; pointer-events: none; }
.if-start-kind:empty { display: none; }
.if-signedin .if-start-btn { display: inline-block; max-width: 100%; text-decoration: none; text-align: center; white-space: normal; overflow-wrap: anywhere; }
.if-start-btn { flex: 0 0 auto; margin: 0; padding: 12px 22px; font-size: 15px; font-weight: 800; line-height: 1.3; border: 0; border-radius: 8px; background: rgb(237 191 74); color: #353535; cursor: pointer; }
.if-start-btn:hover, .if-start-btn:focus { background: #f5cf6a; color: #353535; }
.if-start-btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.if-start-btn[disabled] { opacity: .7; cursor: progress; }
.if-start-msg, .if-start-trust { display: block; width: fit-content; max-width: 100%; margin: 10px 0 0; padding: 6px 10px; color: #fff; background: rgba(0, 0, 0, .6); border-radius: 8px; }
.if-start-msg { font-size: 14px; line-height: 1.45; font-weight: 700; background: #8f1d12; }
.if-start-msg[hidden] { display: none; }
.if-start-trust { font-size: 13px; font-weight: 700; }
.if-start-trust span::before { content: "\2713"; margin-right: .35em; color: #7be3a0; font-weight: 800; }
.if-start-trust span + span { margin-left: .9em; }
.if-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media all and (max-width: 780px) {
    .if-start { margin-left: auto; margin-right: auto; text-align: center; }
    .if-start-msg, .if-start-trust { margin-left: auto; margin-right: auto; }
    .ud-hero-content p.ud-hero-desc { text-align: center !important; }
    .ud-hero-content h1 { text-align: center !important; }
}
/* the live page keeps a tall gap under the title for the hero picture; here the box sits there, so close it up */
.ud-hero .if-hero-title { margin-bottom: 24px; }
.ud-hero { padding-bottom: 40px; }
.ud-hero p.ud-hero-desc { margin-bottom: 20px; }
@media all and (max-width: 780px) {
    .ud-hero { padding-top: 110px; padding-bottom: 28px; }
    .ud-hero .if-hero-title { margin-bottom: 14px; }
    .ud-hero p.ud-hero-desc { font-size: 15px; line-height: 22px; margin-bottom: 14px; }
}
@media all and (max-width: 599px) {
    .if-start-row { flex-direction: column; }
    .if-start-btn { width: 100%; padding: 14px 16px; }
    .if-start-field input::placeholder { font-size: 14px; }
}

/* the live header is wider than a 1200 px window once the "Încearcă gratis!" button is shown (signed-out visitor): tighten the menu there */
@media all and (min-width: 992px) and (max-width: 1299px) {
    .ud-header .navbar-nav .nav-item { padding: 0 8px; }
    .ud-header .navbar-brand { margin-right: 8px; }
}