@charset "utf-8";
/* CSS Document */

/* --- Section heading underline: orange accent --- */
.intro h1:after, .section-start h2:after, .footer-contact h2:after {
    background: #f37b56;
    border-radius: 4px;
}
#form1 label {
    transform: none;
    transition: none;
}
#form1 sup {
    color: #f37b56;
    font-size: .75em;
}
#form1 .register-form {
    padding: 48px 54px 56px;
}
/* --- numbered sections --- */
#form1 .cdr-sec + .cdr-sec {
    margin-top: 42px;
    padding-top: 40px;
    border-top: 1px solid #eef0f2;
}
#form1 .cdr-sec-head {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 26px;
}
#form1 .cdr-sec-num {
    flex: none;
    width: 30px;
    height: 30px;
    margin-top: 0;
    border-radius: 50%;
    background: #f37b56;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 14px -4px rgba(243,123,86,.6);
}
#form1 .cdr-sec-text h3 {
    margin: 0;
    font-size: 21px;
    font-weight: 600;
    color: #23262b;
    line-height: 1.2;
}
#form1 .cdr-sec-text p {
    margin: 3px 0 0;
    font-size: 13.5px;
    color: #8a8f99;
}
/* --- labels / hints --- */
#form1 .cdr-label {
    display: block;
    margin-bottom: 9px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: #4a4f57;
}
#form1 .cdr-hint {
    margin: 8px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: #9aa0a6;
}
#form1 .input-item {
    margin-bottom: 24px;
}
#form1 .input-item:last-child {
    margin-bottom: 0;
}
/* --- inputs --- */
#form1 input[type=text], #form1 input[type=email] {
    width: 100%;
    box-sizing: border-box;
    text-transform: none;
    border: 1px solid #dcdde0;
    border-radius: 10px;
    padding: 14px 15px;
    font-size: 15px;
    font-family: "Poppins", sans-serif;
    color: #23262b;
    transition: border-color .2s, box-shadow .2s;
    background: #fff;
}
#form1 input[type=text]:focus, #form1 input[type=email]:focus, #form1 select:focus {
    border-color: #f37b56;
    box-shadow: 0 0 0 3px rgba(243,123,86,.13);
    outline: none;
}
/* --- multi-select drone model --- */
.cdr-ms {
    position: relative;
}
.cdr-ms-toggle {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 52px;
    background: #fff;
    border: 1px solid #dcdde0;
    border-radius: 10px;
    padding: 6px 42px 6px 10px;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s;
}
.cdr-ms.open .cdr-ms-toggle, .cdr-ms-toggle:focus {
    border-color: #f37b56;
    box-shadow: 0 0 0 3px rgba(243,123,86,.13);
}
.cdr-ms-placeholder {
    color: #9aa0a6;
    font-size: 15px;
    padding-left: 5px;
}
.cdr-ms.has-value .cdr-ms-placeholder {
    display: none;
}
.cdr-ms-arrow {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform .2s;
    pointer-events: none;
}
.cdr-ms.open .cdr-ms-arrow {
    transform: translateY(-50%) rotate(180deg);
}
.cdr-ms-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cdr-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fdeee7;
    color: #d95c36;
    border: 1px solid #f8cdbb;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 500;
    padding: 5px 9px;
    line-height: 1.3;
}
.cdr-chip em {
    font-style: normal;
    cursor: pointer;
    display: inline-flex;
    opacity: .65;
}
.cdr-chip em:hover {
    opacity: 1;
}
.cdr-ms-panel {
    display: none;
    position: absolute;
    z-index: 50;
    top: calc(100% + 8px);
    left: 0;
    width: 100%;
    min-width: 320px;
    background: #fff;
    border: 1px solid #e6e8eb;
    border-radius: 12px;
    box-shadow: 0 18px 44px rgba(0,0,0,.15);
    overflow: hidden;
}
.cdr-ms.open .cdr-ms-panel {
    display: block;
}
.cdr-ms-searchbox {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 15px;
    border-bottom: 1px solid #f0f1f3;
    background: #fafbfc;
}
.cdr-ms-searchbox svg {
    flex: none;
}
.cdr-ms-search {
    width: 100%;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 4px 0 !important;
    font-size: 14px;
    outline: none;
    text-transform: none;
}
.cdr-ms-options {
    max-height: 280px;
    overflow-y: auto;
    padding: 6px 0 10px;
}
.cdr-ms-group {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #9aa0a6;
    padding: 12px 16px 5px;
    position: sticky;
    top: 0;
    background: #fff;
}
.cdr-ms-opt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 16px;
    font-size: 14px;
    color: #2b2f36;
    cursor: pointer;
    transition: background .15s;
}
.cdr-ms-opt:hover {
    background: #fdf1ec;
}
.cdr-ms-opt .tick {
    width: 16px;
    height: 16px;
    flex: none;
    opacity: 0;
}
.cdr-ms-opt.selected {
    color: #d95c36;
    font-weight: 500;
    background: #fdeee7;
}
.cdr-ms-opt.selected .tick {
    opacity: 1;
}
.cdr-ms-empty {
    padding: 16px;
    font-size: 13px;
    color: #9aa0a6;
}
/* --- SN rows (floating model label, no placeholder) --- */
.sn-row {
    position: relative;
    margin-bottom: 12px;
}
.sn-row .sn-model {
    position: absolute;
    left: 16px;
    top: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .3px;
    color: #9aa0a6;
    pointer-events: none;
    z-index: 1;
    max-width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sn-row input {
    height: 60px;
    padding-top: 24px !important;
}
/* --- date & destination rows --- */
.dl-row {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
    align-items: stretch;
}
.dl-date-wrap {
    position: relative;
    flex: 1.15;
    min-width: 0;
}
.dl-date-wrap svg {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}
.dl-date {
    width: 100%;
    cursor: pointer;
    background: #fff !important;
}
.dl-dest {
    flex: 1.35;
    min-width: 0;
}
.dl-del {
    flex: none;
    width: 52px;
    border: none;
    background: #f2f3f5;
    color: #8a8f99;
    border-radius: 10px;
    font-size: 20px;
    cursor: pointer;
    transition: all .2s;
    align-items: center;
    justify-content: center;
}
.dl-del:hover {
    background: #fde3d9;
    color: #d95c36;
}
.dl-add {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 10px 20px;
    border: 1px dashed #f3a98e;
    background: #fff7f4;
    color: #e2663f;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 500;
    font-family: "Poppins", sans-serif;
    cursor: pointer;
    transition: all .2s;
}
.dl-add span {
    font-size: 17px;
    line-height: 1;
}
.dl-add:hover {
    background: #f37b56;
    color: #fff;
    border-color: #f37b56;
    border-style: solid;
}
/* --- details grid --- */
.cdr-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
}
.cdr-grid .input-item {
    min-width: 0;
    margin-bottom: 20px;
}
.cdr-select {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    box-sizing: border-box;
    background: #fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 15px center;
    border: 1px solid #dcdde0;
    border-radius: 10px;
    padding: 14px 42px 14px 15px;
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    color: #23262b;
    transition: border-color .2s, box-shadow .2s;
    cursor: pointer;
}
.cdr-select:invalid, .cdr-select option[value=""] {
color: #9aa0a6;
}
/* divider line between most-used countries and the full list */
.cdr-select option.cdr-sep {
    color: #cfd4da;
    background: #fff;
    font-size: 7px;
    line-height: 1;
}
.cdr-select option.cdr-notlisted {
    color: #6b7078;
    font-style: italic;
}
/* --- invalid state --- */
#form1 .cdr-invalid input, #form1 .cdr-invalid select, #form1 .cdr-invalid .cdr-ms-toggle {
    border-color: #e5484d !important;
    background: #fff8f8;
}
#form1 .cdr-invalid .cdr-err {
    display: block;
}
.cdr-err {
    display: none;
    font-size: 12.5px;
    color: #e5484d;
    margin-top: 6px;
}
/* --- submit --- */
#form1 .submit {
    margin-top: 38px;
}
#form1 input[type=submit] {
    width: 100%;
    max-width: 380px;
    display: block;
    margin: 0 auto;
    padding: 16px;
    border: none;
    border-radius: 50px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 2px;
    box-shadow: 0 10px 24px -8px rgba(243,123,86,.7);
    transition: all .25s;
}
#form1 input[type=submit]:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px -8px rgba(243,123,86,.75);
}
/* --- flatpickr range calendar theme --- */
.flatpickr-calendar {
    border: none;
    border-radius: 14px;
    box-shadow: 0 20px 48px rgba(0,0,0,.18);
    font-family: "Poppins", sans-serif;
    overflow: hidden;
    padding-bottom: 6px;
}
.flatpickr-calendar:before, .flatpickr-calendar:after {
    display: none;
}
.flatpickr-months {
    background: #f37b56;
    border-radius: 14px 14px 0 0;
}
.flatpickr-months .flatpickr-month {
    background: transparent;
    color: #fff !important;
    fill: #fff;
    height: 48px;
}
.flatpickr-current-month {
    font-size: 15px;
    font-weight: 600;
    padding-top: 13px;
    color: #fff !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
    background: #f37b56;
    color: #fff !important;
    font-weight: 600;
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
    background: #fff;
    color: #2b2f36;
}
.flatpickr-current-month input.cur-year {
    color: #fff !important;
    font-weight: 600;
}
.flatpickr-current-month span.cur-month {
    color: #fff !important;
}
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
    fill: #fff !important;
    color: #fff !important;
    padding: 15px 12px;
}
.flatpickr-months .flatpickr-prev-month svg, .flatpickr-months .flatpickr-next-month svg {
    fill: #fff !important;
}
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg {
    fill: #ffe1d6 !important;
}
.flatpickr-weekdays {
    background: #fff;
    height: 34px;
}
span.flatpickr-weekday {
    background: transparent;
    color: #9aa0a6;
    font-weight: 600;
    font-size: 12px;
}
.flatpickr-day {
    border-radius: 9px;
    color: #2b2f36;
    font-weight: 500;
}
.flatpickr-day:hover, .flatpickr-day.prevMonthDay:hover, .flatpickr-day.nextMonthDay:hover {
    background: #fdeee7;
    border-color: #fdeee7;
    color: #d95c36;
}
.flatpickr-day.today {
    border-color: #f37b56;
}
.flatpickr-day.today:hover {
    background: #f37b56;
    border-color: #f37b56;
    color: #fff;
}
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange {
    background: #f37b56;
    border-color: #f37b56;
    color: #fff;
    box-shadow: none;
}
.flatpickr-day.inRange {
    background: #fdeee7;
    border-color: #fdeee7;
    color: #d95c36;
    box-shadow: -5px 0 0 #fdeee7, 5px 0 0 #fdeee7;
}
.flatpickr-day.selected.startRange {
    border-radius: 9px 0 0 9px;
}
.flatpickr-day.selected.endRange {
    border-radius: 0 9px 9px 0;
}
.flatpickr-day.selected.startRange.endRange {
    border-radius: 9px;
}
.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover {
    color: #ced2d8;
    background: transparent;
}
.flatpickr-prev-month.flatpickr-disabled, .flatpickr-next-month.flatpickr-disabled {
    display: none;
}

/* --- responsive --- */
@media(max-width:768px) {
#form1 .register-form {
    padding: 30px 20px 46px;
}
#form1 .cdr-sec + .cdr-sec {
    margin-top: 30px;
    padding-top: 28px;
}
#form1 .cdr-sec-text h3 {
    font-size: 18px;
}
.cdr-grid {
    grid-template-columns: minmax(0, 1fr);
    column-gap: 0;
}
.dl-row {
    flex-wrap: wrap;
}
.dl-date-wrap, .dl-dest {
    flex: 1 1 100%;
}
.dl-del {
    width: 100%;
    height: 42px;
    padding: 0;
}
.cdr-ms-panel {
    min-width: 0;
}
.flatpickr-calendar {
    width: 100% !important;
}
}
/* ============================================================
   Form container — two-tone panels
   left  : white form panel
   right : beige info panel, content vertically centred
   ============================================================ */
.form-shadow {
    display: flex;
    align-items: stretch;
    background: #fff;
}
/* the clearfix pseudo element is unnecessary (and harmful) inside flex */
.form-shadow:after {
    display: none;
}
.register-form {
    float: none;
    width: 70%;
    background: #fff;
    border-radius: 10px 0 0 10px;
}
.form-bg {
    float: none;
    width: 30%;
    height: auto;
    background: #f5f6e8;
    border-radius: 0 10px 10px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 56px 42px;
}
.form-bg .work-hour {
    padding: 0;
}
.form-bg .need-help {
    padding: 44px 0 0;
    margin-top: 44px;
    position: relative;
}
.form-bg .need-help:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: #e3e0d0;
}

@media (max-width: 768px) {
.form-shadow {
    display: block;
}
.register-form {
    width: 100%;
    border-radius: 10px 10px 0 0;
}
.form-bg {
    width: auto;
    border-radius: 0 0 10px 10px;
    padding: 40px 26px 44px;
}
.form-bg .need-help {
    margin-top: 32px;
    padding-top: 32px;
}
}
/* ============================================================
   Your details — labels folded into placeholders
   (labels kept in HTML for accessibility, visually hidden)
   ============================================================ */
#form1 .cdr-grid .cdr-label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}
#form1 .cdr-grid input::placeholder {
 color: #a3a8b0;
 opacity: 1;
}
/* ============================================================
   Drone photos — dashed drop zone + thumbnail previews
   ============================================================ */
#form1 .upload__btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 0;
    padding: 28px 20px 24px;
    background: #fafbfc;
    border: 1.5px dashed #d5d9de;
    border-radius: 12px;
    color: #6b7078;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0;
    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background .2s, box-shadow .2s;
}
#form1 .upload__btn:hover, #form1 .upload__btn.dragover {
    border-color: #f37b56;
    background: #fff8f5;
    box-shadow: 0 6px 18px -10px rgba(243,123,86,.45);
}
#form1 .ub-ico {
    width: 32px;
    height: 32px;
    margin-bottom: 6px;
}
#form1 .ub-title {
    font-size: 14.5px;
    font-weight: 500;
    color: #4a4f57;
}
#form1 .ub-title em {
    font-style: normal;
    font-weight: 600;
    color: #f37b56;
}
#form1 .ub-sub {
    font-size: 12.5px;
    color: #9aa0a6;
}
#form1 .upload__img-wrap {
    display: block;
    margin-top: 12px;
}
#form1 .upload-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
#form1 .upload-list span {
    position: relative;
    display: block;
    width: 86px;
    height: 86px;
    margin: 0;
    border: 1px solid #e6e8ec;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
#form1 .upload-list span img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}
#form1 .upload__img-close {
    width: 22px;
    height: 22px;
    top: 6px;
    right: 6px;
    line-height: 22px;
    background: rgba(35, 38, 43, .55);
}
#form1 .upload__img-close:hover {
    background: #e5484d;
}
#form1 .upload__img-close:after {
    font-size: 12px;
}
/* ============================================================
   Beijing alert block — 1/3 teaser + Read more
   ============================================================ */
.latest-news .news-body {
    position: relative;
    overflow: hidden;
    max-height: 300px;
    transition: max-height .5s ease;
}
.latest-news .news-body:after {
    content: '';
    position: absolute;
    left: -10px;
    right: -10px;
    bottom: 0;
    height: 120px;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 80%);
    pointer-events: none;
    transition: opacity .35s ease;
}
.latest-news .news-body.expanded {
    max-height: 1400px;
}
.latest-news .news-body.expanded:after {
    opacity: 0;
}
.latest-news .news-more {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 14px auto 12px;
    padding: 9px 28px;
    border: 1px solid #c1554c;
    border-radius: 50px;
    background: #fff;
    color: #c1554c;
    font-family: "Poppins", sans-serif;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: .4px;
    cursor: pointer;
    transition: background .25s, color .25s, box-shadow .25s;
}
.latest-news .news-more:hover {
    background: #c1554c;
    color: #fff;
    box-shadow: 0 8px 18px -8px rgba(193,85,76,.6);
}
.latest-news .news-more svg {
    transition: transform .3s ease;
}
.latest-news .news-more.open svg {
    transform: rotate(180deg);
}
/* ============================================================
   Alert attention animations
   1) ribbon: soft breathing glow (background + text)
   2) card: slow light sheen sweeping across
   ============================================================ */
.latest-news .alert-text {
    background: #c1554c;
    animation: alertBreath 2.6s ease-in-out infinite;
}
@keyframes alertBreath {
 0%, 100% {
 filter: brightness(1);
 text-shadow: 0 0 0 rgba(255,255,255,0);
}
 50% {
 filter: brightness(1.22);
 text-shadow: 0 1px 8px rgba(255,255,255,.6);
}
}
.latest-news {
    position: relative;
    overflow: hidden;
}
.latest-news:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(100deg, rgba(193,85,76,0) 24%, rgba(193,85,76,.07) 40%, rgba(255,255,255,.55) 50%, rgba(193,85,76,.07) 60%, rgba(193,85,76,0) 76%);
    transform: translateX(-115%);
    animation: alertSheen 5s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
@keyframes alertSheen {
 0% {
transform: translateX(-115%);
}
 62%, 100% {
transform: translateX(215%);
}
}

@media (prefers-reduced-motion: reduce) {
.latest-news .alert-text,  .latest-news:before {
    animation: none;
}
}