/* =============================================================
   EXPERIENCE PAGE STYLES
   -------------------------------------------------------------
   Three-card grid + per-card Gravity Forms popup modal.

   The cards use the same magenta->pink gradient as the site's
   primary CTA (see .thank-you-button) so they feel native to
   the existing design language. The popup is a centered modal
   with a soft overlay and respects mobile widths.
   ============================================================= */

/* --- Page wrapper ------------------------------------------ */
.c2h-experience-page {
    padding: 60px 0 80px;
    background: #f8f9fb;
}

.c2h-experience-wrap {
    max-width: 1180px;
    margin: 0 auto;
}

.c2h-experience-header {
    text-align: center;
    margin-bottom: 48px;
}

.c2h-experience-title {
    margin: 0 0 12px;
    font-size: clamp(32px, 5vw, 56px);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.c2h-experience-subtitle {
    margin: 0 auto;
    max-width: 640px;
    color: #4a4f57;
    font-size: 16px;
    line-height: 1.6;
}

/* --- Grid -------------------------------------------------- */
.c2h-experience-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

@media (max-width: 991px) {
    .c2h-experience-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

/* --- Card -------------------------------------------------- */
.c2h-experience-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: #ffffff;
    border-radius: 20px;
    /* Slightly less top padding because the image now bleeds to the
       card's top edge (see .c2h-experience-card__image). */
    padding: 20px;
    overflow: hidden;     /* clip the image to the rounded corners */
    box-shadow: 0 6px 24px rgba(16, 17, 22, 0.06);
    border: 1px solid #ececef;
    transition: transform .25s ease, box-shadow .25s ease;
}

.c2h-experience-card:hover {
/*     transform: translateY(-4px); */
    box-shadow: 0 14px 36px rgba(16, 17, 22, 0.10);
}

.c2h-experience-card__icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #FF79C9 0%, #FF47B4 100%);
    color: #fff;
    font-size: 28px;
    margin-bottom: 22px;
    box-shadow: 0 8px 20px rgba(255, 71, 180, 0.25);
}

/* Image-card layout: featured image at the top of each card.
   The image area is a 16:10 rectangle that bleeds to the card's
   top corners. When the <img> has a valid src it fills the area
   (object-fit: cover). When src is empty, the area shows a
   neutral light-gray placeholder so the card structure is still
   visible — the user can drop in their own image later. */
.c2h-experience-card__image {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    margin: 0 0 0;                /* sits flush against the card's rounded top */
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    overflow: hidden;
    background: #eef0f3;          /* neutral placeholder when <img> has no src */
	border-radius: 10px;
}

.c2h-experience-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}

.c2h-experience-card:hover .c2h-experience-card__image img {
/*     transform: scale(1.04); */
}

.c2h-experience-card__title {
    margin: 20px 0 12px;
    font-size: 24px;
    font-weight: 800;
	line-height: 1.2;
}

.c2h-experience-card__desc {
    margin: 0 0 26px;
    color: #4a4f57;
    font-size: 15px;
    line-height: 1.6;
    flex-grow: 1;
}

.c2h-experience-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 180px;
    padding: 14px 24px;
    border: 1px solid #fff;
    border-radius: 12px;
    background: linear-gradient(180deg, #FF79C9 0%, #FF47B4 100%);
    color: #ffffff !important;
    font-size: 15px;
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none !important;
    letter-spacing: 0.02em;
    cursor: pointer;
/*     box-shadow: 0 8px 20px rgba(255, 71, 180, 0.25); */
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

/* .c2h-experience-card__btn:hover,
.c2h-experience-card__btn:focus {
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(255, 71, 180, 0.35);
    filter: brightness(1.03);
    outline: none;
} */
.c2h-experience-card__btn:hover,
.c2h-experience-card__btn:focus {
    outline: none;
	background: linear-gradient(#ffffff, #ffffff) padding-box, linear-gradient(to right, rgb(236 0 140 / 25%), #EC008C) border-box !important;
    border: 1px solid #0000 !important;
    color: #101115 !important;
}

.c2h-experience-card__btn:active {
    transform: translateY(0);
}

.c2h-experience-card__btn i {
    transition: transform .2s ease;
	display: none;
}

.c2h-experience-card__btn:hover i {
    transform: translateX(3px);
}

/* --- Popup ------------------------------------------------- */
.c2h-experience-popup {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.c2h-experience-popup.is-open {
    display: flex;
}

.c2h-experience-popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(16, 17, 22, 0.55);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    animation: c2hExperienceFadeIn .2s ease-out;
}

.c2h-experience-popup__dialog {
    position: relative;
    width: 100%;
    max-width: 640px;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    background: #ffffff;
    border-radius: 20px;
    padding: 36px 32px 32px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.30);
    animation: c2hExperiencePopIn .25s cubic-bezier(.2,.9,.3,1.1);
}

@media (max-width: 600px) {
    .c2h-experience-popup__dialog {
        padding: 28px 20px 24px;
    }
}

.c2h-experience-popup__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: #f1f1f3;
    color: #101116;
    font-size: 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .2s ease, transform .2s ease;
	z-index: 9;
}

.c2h-experience-popup__close:hover,
.c2h-experience-popup__close:focus {
    background: #e5e5e8;
    transform: rotate(90deg);
    outline: none;
}

.c2h-experience-popup__title {
    margin: 0 0 18px;
    padding-right: 40px;
    font-size: 24px;
    font-weight: 700;
    color: #101116;
    font-family: 'Cal Sans', 'Plus Jakarta Sans', 'Inter', sans-serif;
}

.c2h-experience-popup__body {
    color: #101116;
}

/* Re-skin the embedded Gravity Form so it picks up the page palette. */
.c2h-experience-popup__body .gform_wrapper {
    margin: 0;
}

.c2h-experience-popup__body .gform_wrapper .gform_title {
    display: none;
}

.c2h-experience-popup__body .gform_wrapper .gform_description {
    display: none;
}

.c2h-experience-popup__body .gform_wrapper .gform_body .gfield_label {
    font-weight: 600;
    color: #101116;
}

.c2h-experience-popup__body .gform_wrapper input[type="text"],
.c2h-experience-popup__body .gform_wrapper input[type="email"],
.c2h-experience-popup__body .gform_wrapper input[type="tel"],
.c2h-experience-popup__body .gform_wrapper input[type="number"],
.c2h-experience-popup__body .gform_wrapper input[type="url"],
.c2h-experience-popup__body .gform_wrapper textarea,
.c2h-experience-popup__body .gform_wrapper select {
    width: 100%;
    border: 1px solid #d8d9de;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 15px;
    background: #fff;
}

.c2h-experience-popup__body .gform_wrapper input:focus,
.c2h-experience-popup__body .gform_wrapper textarea:focus,
.c2h-experience-popup__body .gform_wrapper select:focus {
    border-color: #FF47B4;
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 71, 180, 0.15);
}

.c2h-experience-popup__body .gform_wrapper .gform_footer input[type="submit"],
.c2h-experience-popup__body .gform_wrapper .gform_footer button,
.c2h-experience-popup__body .gform_wrapper .gform_footer .gform_button {
    background: linear-gradient(180deg, #FF79C9 0%, #FF47B4 100%);
    color: #fff !important;
    border: 0;
    border-radius: 12px;
    padding: 12px 28px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(255, 71, 180, 0.25);
}

.c2h-experience-popup__loading {
    color: #6a6f78;
    font-size: 14px;
    padding: 20px 0;
    text-align: center;
}

.c2h-experience-popup__empty {
    color: #4a4f57;
    font-size: 15px;
    line-height: 1.6;
    padding: 12px 0;
    text-align: center;
}

/* Body scroll lock when a popup is open. */
body.c2h-experience-popup-open {
    overflow: hidden;
}

@keyframes c2hExperienceFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes c2hExperiencePopIn {
    from { opacity: 0; transform: translateY(20px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0)    scale(1); }
}


/* ==========================================
   Come2Holiday Experience Form
   Gravity Forms #11
========================================== */

/* Wrapper */

#gform_wrapper_11{
    max-width:760px;
    margin:0 auto;
}

/* Heading */

#gform_wrapper_11 .gform_heading{
    margin-bottom:18px;
}

#gform_wrapper_11 .gform_title{
    margin:0;
    font-size:42px;
    font-weight:700;
    line-height:1.15;
    color:#111827;
}

/* Labels */

#gform_wrapper_11 .gfield_label{

    display:block;

    margin-bottom:6px !important;

    font-size:14px;
    font-weight:600;
    line-height:1.4;

    color:#111827;
}

/* Required */

#gform_wrapper_11 .gfield_required,
#gform_wrapper_11 .gfield_required_text{

    color:#9ca3af !important;

    font-size:11px;

    font-weight:500;
}

/* Grid — 2 column layout for the whole form (desktop + tablet).
   Same column widths / gaps are reused at every breakpoint so
   Date/Time, Email/Phone, and Name (First/Last) all line up. */

#gform_wrapper_11 .gform_fields{

    display:grid !important;

    grid-template-columns:repeat(2,minmax(0,1fr)) !important;

    column-gap:14px !important;

    row-gap:18px !important;

    align-items:flex-start !important;
}

#gform_wrapper_11 .gfield{

    margin:0 !important;

    align-self:flex-start !important;

    width:auto !important;

    float:none !important;
}

/* Name (full width row, but its two sub-inputs split into the
   same 2-column layout so they line up with Date and Email below). */

#gform_wrapper_11 #field_11_1{

    grid-column:1 / -1 !important;

    width:100% !important;

    padding:0 !important;

    margin:0 !important;

    box-sizing:border-box !important;
}

#gform_wrapper_11 #field_11_1 .ginput_container,
#gform_wrapper_11 #field_11_1 .ginput_container_name{

    display:grid !important;

    grid-template-columns:repeat(2,minmax(0,1fr)) !important;

    column-gap:14px !important;

    width:100% !important;

    margin-left:0 !important;

    margin-right:0 !important;
}

#gform_wrapper_11 #field_11_1 .name_first,
#gform_wrapper_11 #field_11_1 .name_last{

    flex:none !important;

    width:100% !important;

    max-width:100% !important;

    min-width:0 !important;

    padding:0 !important;

    margin:0 !important;

    box-sizing:border-box !important;
}

/* Half-width pairs line up with the 2-column grid above. */

#gform_wrapper_11 #field_11_6,
#gform_wrapper_11 #field_11_14,
#gform_wrapper_11 #field_11_5,
#gform_wrapper_11 #field_11_7{

    grid-column:span 1 !important;

    width:100% !important;

    min-width:0 !important;
}

/* Full-width rows: the HTML block, Description/textarea, and any
   generic fields without an explicit column class. */

#gform_wrapper_11 #field_11_8,
#gform_wrapper_11 #field_11_9,
#gform_wrapper_11 #field_11_10,
#gform_wrapper_11 #field_11_11,
#gform_wrapper_11 #field_11_12,
#gform_wrapper_11 #field_11_13,
#gform_wrapper_11 #field_11_15,
#gform_wrapper_11 #field_11_16{

    grid-column:1 / -1 !important;

    width:100% !important;
}

#gform_wrapper_11 .gfield--width-full,
#gform_wrapper_11 .gfield--width-full .ginput_container{

    grid-column:1 / -1 !important;

    width:100% !important;
}

/* Inputs */

#gform_wrapper_11 input[type="text"],
#gform_wrapper_11 input[type="email"],
#gform_wrapper_11 input[type="tel"],
#gform_wrapper_11 input[type="number"],
#gform_wrapper_11 select,
#gform_wrapper_11 textarea{

    width:100%;

    background:#fff;

    border:1px solid #d9e0ea;

    border-radius:12px;

    color:#111827;

    font-size:14px;

    box-shadow:none;

    transition:.25s ease;
}

/* Input Height */

#gform_wrapper_11 input[type="text"],
#gform_wrapper_11 input[type="email"],
#gform_wrapper_11 input[type="tel"],
#gform_wrapper_11 input[type="number"],
#gform_wrapper_11 select{

    height:46px;

    padding:0 14px;
}

/* Textarea */

#gform_wrapper_11 textarea{

    min-height:110px;

    padding:14px;

    resize:vertical;
}

/* Placeholder */

#gform_wrapper_11 input::placeholder,
#gform_wrapper_11 textarea::placeholder{

    color:#9ca3af;
}

/* Focus */

#gform_wrapper_11 input:focus,
#gform_wrapper_11 textarea:focus,
#gform_wrapper_11 select:focus{

    outline:none;

    border-color:#8CC63E;

    box-shadow:0 0 0 3px rgba(140,198,62,.12);
}

/* Date */

#gform_wrapper_11 .ginput_container_date{

    position:relative;
}

#gform_wrapper_11 .ginput_container_date input{

    cursor:pointer;
}
/* ==========================================
   Time Dropdown
========================================== */

#gform_wrapper_11 #field_11_14{

    display:flex;
    flex-direction:column;

    justify-content:flex-start;

    align-self:flex-start !important;

    margin-top:0 !important;
}

#gform_wrapper_11 #field_11_14 > .gfield_label{

    margin-bottom:6px !important;
}

#gform_wrapper_11 #field_11_14 .ginput_container{

    width:100%;

    margin-top:0 !important;
}

#gform_wrapper_11 #field_11_14 select{

    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;

    cursor:pointer;

    padding-right:42px;

    background-color:#fff;

    background-repeat:no-repeat;

    background-position:right 14px center;

    background-size:15px;

    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M5 7l5 5 5-5z'/%3E%3C/svg%3E");
	display: flex;
	align-items: center;
}

/* Keep Date & Time Aligned */

#gform_wrapper_11 #field_11_6,
#gform_wrapper_11 #field_11_14{

    align-self:flex-start !important;

    margin-top:0 !important;
}

/* ==========================================
   Validation
========================================== */

#gform_wrapper_11 .validation_message{

    margin-top:4px;

    color:#d97706;

    font-size:12px;
}

#gform_wrapper_11 .gfield_error input,
#gform_wrapper_11 .gfield_error textarea,
#gform_wrapper_11 .gfield_error select{

    border-color:#f59e0b !important;
}

/* ==========================================
   Submit Button
========================================== */

#gform_submit_button_11{

    width:100%;

    height:48px;

    border:0;

    border-radius:12px;

    background:#8CC63E;

    color:#fff;

    font-size:15px;

    font-weight:700;

    cursor:pointer;

    transition:.25s ease;
}

#gform_submit_button_11:hover{

    background:#7db631;

    transform:translateY(-2px);
}

/* ==========================================
   Popup
========================================== */

.c2h-experience-popup{

    overflow:visible !important;
}

.c2h-experience-popup__dialog{

    width:92%;

    max-width:760px;

    border-radius:20px;
}

.c2h-experience-popup__body{

    padding:24px 28px !important;

    overflow:visible !important;
}

/* ==========================================
   Datepicker
========================================== */

.ui-datepicker,
.flatpickr-calendar{

    z-index:99999999 !important;
}
/* ==========================================
   Tablet
========================================== */

@media (max-width:991px){

    .c2h-experience-popup__dialog{

        width:94%;
        max-width:700px;
    }

    .c2h-experience-popup__body{

        padding:22px !important;
    }

    #gform_wrapper_11{

        max-width:100%;
    }

    #gform_wrapper_11 .gform_title{

        font-size:34px;
    }

}

/* ==========================================
   Mobile
========================================== */

@media (max-width:767px){

    /* Popup */

    .c2h-experience-popup{

        padding:12px !important;
    }

    .c2h-experience-popup__dialog{

        width:95%;
        max-width:95%;

        max-height:90vh;

        margin:auto;

        border-radius:16px;

        overflow:hidden;
    }

    .c2h-experience-popup__body{

        padding:16px !important;

        max-height:90vh;

        overflow-y:auto;
    }

    /* Heading */

    #gform_wrapper_11 .gform_title{

        font-size:26px;

        margin-bottom:8px;
    }

    #gform_wrapper_11 .gform_heading{

        margin-bottom:12px;
    }

    /* =====================================
       Two Column Layout
    ===================================== */

    #gform_wrapper_11 .gform_fields{

        display:grid !important;

        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:10px !important;
    }

    /* Name */

    #field_11_1{

        grid-column:1 / -1 !important;
    }

    /* Date */

    #field_11_6{

        grid-column:1 !important;
    }

    /* Time */

    #field_11_14{

        grid-column:2 !important;
    }

    /* Email */

    #field_11_5{

        grid-column:1 !important;
    }

    /* Phone */

    #field_11_7{

        grid-column:2 !important;
    }

    /* Remaining Fields */

    #field_11_8,
    #field_11_9,
    #field_11_10,
    #field_11_11,
    #field_11_12,
    #field_11_13,
    #field_11_15,
    #field_11_16{

        grid-column:1 / -1 !important;
    }

    /* Labels */

    #gform_wrapper_11 .gfield_label{

        font-size:13px;

        margin-bottom:4px !important;
    }

    #gform_wrapper_11 .gfield_required{

        font-size:10px !important;
    }

    /* Inputs */

    #gform_wrapper_11 input,
    #gform_wrapper_11 select{

        height:40px;

        font-size:13px;

        padding:0 10px;

        border-radius:10px;
    }

    #gform_wrapper_11 textarea{

        min-height:80px;

        padding:10px;

        font-size:13px;
    }

    /* Spacing */

    #gform_wrapper_11 .gfield{

        margin-bottom:10px !important;
    }

    #gform_wrapper_11 .gform_fields{

        row-gap:8px !important;

        column-gap:10px !important;
    }

    /* Button */

    #gform_submit_button_11{

        height:42px;

        font-size:14px;

        border-radius:10px;
    }

}
/* Name sub-fields use the same 2-col grid as the outer form on every
   breakpoint — the base rules above already set this up. The mobile
   block below only tightens the *gap* (font-size, height, padding) so
   inputs fit narrower phones; column structure stays identical. */

/* ==========================================
   Small Phones
========================================== */

@media (max-width:480px){

    /* Popup */

    .c2h-experience-popup{

        padding:10px !important;
    }

    .c2h-experience-popup__dialog{

        width:96%;
        max-width:96%;

        border-radius:14px;
    }

    .c2h-experience-popup__body{

        padding:14px !important;
    }

    /* Title */

    #gform_wrapper_11 .gform_title{

        font-size:24px;
    }

    #gform_wrapper_11 .gform_heading{

        margin-bottom:10px;
    }

    /* Labels */

    #gform_wrapper_11 .gfield_label{

        font-size:12px !important;

        margin-bottom:4px !important;
    }

    /* Inputs */

    #gform_wrapper_11 input,
    #gform_wrapper_11 select{

        height:38px !important;

        font-size:12px !important;

        padding:0 10px !important;
    }

    #gform_wrapper_11 textarea{

        min-height:75px !important;

        font-size:12px !important;

        padding:10px !important;
    }

    /* Name */

    #field_11_1 .ginput_container_name{

        gap:6px !important;
    }

    /* Date */

    #field_11_6 input{

        font-size:11px !important;
    }

    /* Time */

    #field_11_14 select{

        font-size:11px !important;
    }

    /* Button */

    #gform_submit_button_11{

        height:40px;

        font-size:13px;

        border-radius:10px;
    }

    /* Compact spacing */

    #gform_wrapper_11 .gfield{

        margin-bottom:8px !important;
    }

    #gform_wrapper_11 .gform_fields{

        row-gap:6px !important;

        column-gap:8px !important;
    }

}

/* ==========================================
   Final Polish
========================================== */

/* Smooth Animation */

#gform_wrapper_11 input,
#gform_wrapper_11 textarea,
#gform_wrapper_11 select,
#gform_submit_button_11{

    transition:all .25s ease;
}

/* Hover */

#gform_wrapper_11 input:hover,
#gform_wrapper_11 textarea:hover,
#gform_wrapper_11 select:hover{

    border-color:#cfd8e3;
}

/* Disabled */

#gform_wrapper_11 input:disabled,
#gform_wrapper_11 textarea:disabled,
#gform_wrapper_11 select:disabled{

    background:#f8fafc;
    cursor:not-allowed;
    opacity:.75;
}

/* Placeholder */

#gform_wrapper_11 input::placeholder,
#gform_wrapper_11 textarea::placeholder{

    color:#9ca3af;
    opacity:1;
}

/* Autofill */

#gform_wrapper_11 input:-webkit-autofill,
#gform_wrapper_11 textarea:-webkit-autofill,
#gform_wrapper_11 select:-webkit-autofill{

    -webkit-box-shadow:0 0 0 1000px #fff inset;
    -webkit-text-fill-color:#111827;
}

/* Select */

#gform_wrapper_11 select{

    text-overflow:ellipsis;
}

/* Textarea Counter */

#gform_wrapper_11 .ginput_counter{

    margin-top:6px;

    font-size:12px;

    color:#9ca3af;
}

/* Description */

#gform_wrapper_11 .gfield_description{

    margin-top:4px;

    font-size:12px;

    color:#6b7280;
}

/* Footer */

#gform_wrapper_11 .gform_footer{

    margin-top:12px !important;

    padding-top:4px !important;
}

/* Popup Scrollbar */

.c2h-experience-popup__body{

    scrollbar-width:thin;

    scrollbar-color:#8CC63E #eef2f7;
}

.c2h-experience-popup__body::-webkit-scrollbar{

    width:7px;
}

.c2h-experience-popup__body::-webkit-scrollbar-track{

    background:#eef2f7;

    border-radius:20px;
}

.c2h-experience-popup__body::-webkit-scrollbar-thumb{

    background:#8CC63E;

    border-radius:20px;
}

/* Better Button */

#gform_submit_button_11{

    letter-spacing:.3px;
}

/* Better Name Field */

#gform_wrapper_11 .ginput_container_name{

    align-items:flex-start;
}

/* Better Field Alignment */

#gform_wrapper_11 .gfield{

    position:relative;
}

/* Datepicker */

.ui-datepicker,
.flatpickr-calendar{

    border-radius:12px;

    overflow:hidden;

    box-shadow:0 12px 30px rgba(0,0,0,.12);
}

/* End */

/* ==========================================
   Come2Holiday - Experience Form
   Gravity Form #12
========================================== */

#gform_wrapper_12{
    max-width:760px;
    margin:0 auto;
}

#gform_wrapper_12 .gform_heading{
    margin-bottom:18px;
}

#gform_wrapper_12 .gform_title{
    font-size:42px;
    font-weight:700;
    color:#111827;
    line-height:1.15;
    margin-bottom:0;
}

/* Labels */

#gform_wrapper_12 .gfield_label{
    font-size:14px;
    font-weight:600;
    color:#111827;
    margin-bottom:6px !important;
    line-height:1.4;
}

/* Required */

#gform_wrapper_12 .gfield_required,
#gform_wrapper_12 .gfield_required_text{
    color:#9ca3af !important;
    font-size:11px;
    font-weight:500;
}

/* Field Wrapper — 2-column grid identical to form 11 so both forms
   line up identically across desktop, tablet, and mobile. */

#gform_wrapper_12 .gfield{

    margin:0 !important;

    align-self:start !important;

    width:auto !important;

    float:none !important;
}

#gform_wrapper_12 .gform_fields{

    display:grid !important;

    grid-template-columns:repeat(2,minmax(0,1fr)) !important;

    column-gap:14px !important;

    row-gap:18px !important;

    align-items:start !important;
}

/* Name (full width row, inner 2-col layout matches outer columns). */

#gform_wrapper_12 #field_12_1{

    grid-column:1 / -1 !important;

    width:100% !important;

    padding:0 !important;

    margin:0 !important;

    box-sizing:border-box !important;
}

#gform_wrapper_12 #field_12_1 .ginput_container,
#gform_wrapper_12 #field_12_1 .ginput_container_name{

    display:grid !important;

    grid-template-columns:repeat(2,minmax(0,1fr)) !important;

    column-gap:14px !important;

    width:100% !important;

    margin-left:0 !important;

    margin-right:0 !important;
}

#gform_wrapper_12 #field_12_1 .name_first,
#gform_wrapper_12 #field_12_1 .name_last{

    flex:none !important;

    width:100% !important;

    max-width:100% !important;

    min-width:0 !important;

    padding:0 !important;

    margin:0 !important;

    box-sizing:border-box !important;
}

/* Half-width pairs. */

#gform_wrapper_12 #field_12_6,
#gform_wrapper_12 #field_12_12,
#gform_wrapper_12 #field_12_5,
#gform_wrapper_12 #field_12_7{

    grid-column:span 1 !important;

    width:100% !important;

    min-width:0 !important;
}

/* Full-width rows. */

#gform_wrapper_12 #field_12_2,
#gform_wrapper_12 #field_12_3,
#gform_wrapper_12 #field_12_4,
#gform_wrapper_12 #field_12_8,
#gform_wrapper_12 #field_12_9,
#gform_wrapper_12 #field_12_10,
#gform_wrapper_12 #field_12_11,
#gform_wrapper_12 #field_12_13,
#gform_wrapper_12 #field_12_14,
#gform_wrapper_12 #field_12_15,
#gform_wrapper_12 #field_12_16{

    grid-column:1 / -1 !important;

    width:100% !important;
}

#gform_wrapper_12 .gfield--width-full,
#gform_wrapper_12 .gfield--width-full .ginput_container{

    grid-column:1 / -1 !important;

    width:100% !important;
}

/* Inputs */

#gform_wrapper_12 input[type=text],
#gform_wrapper_12 input[type=email],
#gform_wrapper_12 input[type=tel],
#gform_wrapper_12 input[type=number],
#gform_wrapper_12 textarea,
#gform_wrapper_12 select{

    width:100%;
    height:46px;

    border:1px solid #d9e0ea;
    border-radius:12px;

    background:#fff;

    padding:0 14px;

    font-size:14px;
    color:#111827;

    transition:.25s ease;
    box-shadow:none;
}

/* Textarea */

#gform_wrapper_12 textarea{

    height:110px;
    padding:14px;
    resize:vertical;
}

/* Placeholder */

#gform_wrapper_12 input::placeholder,
#gform_wrapper_12 textarea::placeholder{

    color:#9ca3af;
}

/* Date */

#gform_wrapper_12 .ginput_container_date{
    position:relative;
}

#gform_wrapper_12 .ginput_container_date input{
    cursor:pointer;
}

/* ==========================================
   Time Dropdown
========================================== */

#gform_wrapper_12 #field_12_12{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-self:start !important;
    margin-top:0 !important;
}

#gform_wrapper_12 #field_12_12 > label{
    display:block;
    margin-bottom:6px !important;
    line-height:1.4;
}

#gform_wrapper_12 #field_12_12 .ginput_container{
    width:100%;
    margin-top:0 !important;
}

#gform_wrapper_12 #field_12_12 select{

    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;

    background:#fff;

    padding:0 44px 0 14px;

    cursor:pointer;

    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M5 7l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 14px center;
    background-size:15px;
	display: flex;
	align-items: center;
}

/* Keep Date & Time aligned */

#gform_wrapper_12 #field_12_6,
#gform_wrapper_12 #field_12_12{

    align-self:start !important;
    margin-top:0 !important;
}

/* Validation */

#gform_wrapper_12 .validation_message{

    color:#d97706;
    font-size:12px;
    margin-top:4px;
}

#gform_wrapper_12 .gfield_error input,
#gform_wrapper_12 .gfield_error textarea,
#gform_wrapper_12 .gfield_error select{

    border-color:#f59e0b !important;
}

/* Submit Button */

#gform_submit_button_12{

    width:100%;
    height:48px;

    border:none;
    border-radius:12px;

    background:#8CC63E;
    color:#fff;

    font-size:15px;
    font-weight:700;

    cursor:pointer;

    transition:.25s ease;
}

#gform_submit_button_12:hover{

    background:#7db631;
    transform:translateY(-2px);
}

/* Popup */

.c2h-experience-popup{
    overflow:visible !important;
}

.c2h-experience-popup__dialog{

    width:92%;
    max-width:760px;

    border-radius:20px;
}

.c2h-experience-popup__body{

    padding:24px 28px !important;
    overflow:visible !important;
}

/* Datepicker */

.ui-datepicker,
.flatpickr-calendar{

    z-index:99999999 !important;
}

/* ==========================================
   Tablet
========================================== */

@media (max-width:991px){

    .c2h-experience-popup__dialog{

        width:94%;
        max-width:700px;
    }

    .c2h-experience-popup__body{

        padding:22px !important;
    }

    #gform_wrapper_12{

        max-width:100%;
    }

    #gform_wrapper_12 .gform_title{

        font-size:34px;
    }
}

/* ==========================================
   Mobile
========================================== */

@media (max-width:767px){

    /* Popup */

    .c2h-experience-popup{
        padding:12px !important;
    }

    .c2h-experience-popup__dialog{

        width:95%;
        max-width:95%;
        max-height:90vh;

        margin:auto;

        border-radius:16px;

        overflow:hidden;
    }

    .c2h-experience-popup__body{

        padding:16px !important;

        max-height:90vh;

        overflow-y:auto;
    }

    /* Title */

    #gform_wrapper_12 .gform_title{

        font-size:26px;

        margin-bottom:8px;
    }

    #gform_wrapper_12 .gform_heading{

        margin-bottom:12px;
    }

    /* Mobile Two Column Layout */

    #gform_wrapper_12 .gform_fields{

        display:grid !important;

        grid-template-columns:1fr 1fr !important;

        gap:10px !important;
    }

    /* Email */

    #field_12_5{

        grid-column:1;
    }

    /* Phone */

    #field_12_7{

        grid-column:2;
    }

    /* Date */

    #field_12_6{

        grid-column:1;
    }

    /* Time */

    #field_12_12{

        grid-column:2;
    }

    /* Remaining fields full width */

    #field_12_1,
    #field_12_2,
    #field_12_3,
    #field_12_4,
    #field_12_8,
    #field_12_9,
    #field_12_10,
    #field_12_11,
    #field_12_13,
    #field_12_14,
    #field_12_15,
    #field_12_16{

        grid-column:1 / -1;
    }

    /* Labels */

    #gform_wrapper_12 .gfield_label{

        font-size:13px;

        margin-bottom:4px !important;
    }

    /* Inputs */

    #gform_wrapper_12 input,
    #gform_wrapper_12 select{

        height:40px;

        font-size:13px;

        padding:0 10px;

        border-radius:10px;
    }

    #gform_wrapper_12 textarea{

        height:80px;

        font-size:13px;

        padding:10px;
    }

    #gform_wrapper_12 .gfield{

        margin-bottom:10px !important;
    }

    #gform_wrapper_12 .gform_fields{

        row-gap:8px !important;

        column-gap:10px !important;
    }

    /* Button */

    #gform_submit_button_12{

        height:42px;

        font-size:14px;

        border-radius:10px;
    }
}

/* ==========================================
   Small Phones
========================================== */

@media (max-width:480px){

    .c2h-experience-popup{

        padding:10px !important;
    }

    .c2h-experience-popup__dialog{

        border-radius:14px;
    }

    .c2h-experience-popup__body{

        padding:15px !important;
    }

    #gform_wrapper_12 .gform_title{

        font-size:24px;
    }

    #gform_wrapper_12 input,
    #gform_wrapper_12 select{

        height:40px;
    }

    #gform_wrapper_12 textarea{

        height:80px;
    }

    #gform_submit_button_12{

        height:42px;
    }
}

/* ==========================================
   Fix Name Field Mobile
========================================== */

@media (max-width:767px){

    /* Name Field */

    #field_12_1 .ginput_container_name{

        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;

        gap:8px !important;

        align-items:flex-start;
    }

    #field_12_1{

        grid-column:span 2 !important;
    }

    #field_12_1 .name_first,
    #field_12_1 .name_last{

        flex:1 1 calc(50% - 4px) !important;
        width:calc(50% - 4px) !important;
        max-width:calc(50% - 4px) !important;
        min-width:0 !important;
    }

    #field_12_1 input{

        width:100% !important;
        height:40px !important;

        font-size:13px !important;

        padding:0 10px !important;
    }

    /* Date */

    #field_12_6{

        width:100% !important;
    }

    #field_12_6 input{

        width:100% !important;
        height:40px !important;

        font-size:12px !important;

        padding:0 30px 0 10px !important;
    }

    #field_12_6 input::placeholder{

        font-size:12px !important;
    }

    /* Time */

    #field_12_12{

        width:100% !important;
    }

    #field_12_12 select{

        width:100% !important;
        height:40px !important;

        font-size:12px !important;

        padding:0 30px 0 10px !important;
    }

    /* Email */

    #field_12_5 input{

        height:40px !important;

        font-size:13px !important;
    }

    /* Phone */

    #field_12_7 input{

        height:40px !important;

        font-size:13px !important;
    }

    /* Description */

    #field_12_8 textarea{

        min-height:85px !important;

        font-size:13px !important;
    }

    /* Labels */

    #gform_wrapper_12 .gfield_label{

        font-size:13px !important;

        margin-bottom:4px !important;
    }

    #gform_wrapper_12 .gfield_required{

        font-size:10px !important;
    }

    /* Field Spacing */

    #gform_wrapper_12 .gfield{

        margin-bottom:10px !important;
    }

    #gform_wrapper_12 .gform_fields{

        row-gap:8px !important;
    }

    .c2h-experience-card--groceries {
        order: -1;
    }
	
	.c2h-experience-card--groceries .c2h-experience-card__image {
        display: none !important;
    }
	
	.c2h-experience-page {
        padding: 30px 0 0px;
    }
	
	.c2h-experience-title {
        margin: 0 0 10px;
    }
	
	.c2h-experience-header {
        margin-bottom: 20px;
    }
	
	.c2h-experience-card__title {
        margin: 10px 0 10px;
    }
	
	.c2h-experience-card__desc {
        margin: 0 0 10px;
    }

}

/* end */