/* Caps the block's own width rather than letting the section's
   background/content stretch full-bleed indefinitely. */
.wp-block-lazyblock-time-line-impact {
  max-width: 1278px;
  margin-left: auto;
  margin-right: auto;
}

.time-line-impact {
  padding: 80px 0;
  background: var(--white, #fff);
}

.time-line-impact__heading {
  margin: 0 0 40px;
  color: #174fa2;
  font-family: 'Montserrat', sans-serif;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__heading {
    font-size: 38px;
    line-height: 49.4px;
  }
}

.time-line-impact__grid {
  display: flex;
  align-items: stretch;
  gap: 35px;
}

.time-line-impact__stats {
  display: grid;
  flex: 1 1 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 35px;
  min-width: 0;
}

.time-line-impact__card {
  position: relative;
  display: flex;
  box-sizing: border-box;
  aspect-ratio: 1 / 1;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  overflow: hidden;
  border-radius: 6px;
  padding: 40px 30px;
  text-align: center;
}

.time-line-impact__stat-number {
  position: relative;
  z-index: 1;
  color: var(--white, #fff);
  font-family: 'Roboto', sans-serif;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.13;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__stat-number {
    font-size: 40px;
  }
}

.time-line-impact__stat-label {
  position: relative;
  z-index: 1;
  max-width: 263px;
  color: var(--white, #fff);
  font-family: 'Roboto', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__stat-label {
    font-size: 16px;
  }
}

/* Words Delivered */

.time-line-impact__card--words {
  background: #386be5;
}

.time-line-impact__card-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  opacity: .4;
  mix-blend-mode: overlay;
  pointer-events: none;
}

.time-line-impact__card-bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

/* Industries Served */

.time-line-impact__card--industries {
  background: linear-gradient(138deg, #ffffff 1.6%, #d8edff 98.4%);
  border: 1px solid #cfe6f9;
}

.time-line-impact__stat-number--navy {
  color: #26348b;
  font-size: 56px;
  font-weight: 500;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__stat-number--navy {
    font-size: 90px;
  }
}

.time-line-impact__stat-label--muted {
  color: #4f5665;
}

.time-line-impact__tags {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.time-line-impact__tag {
  position: absolute;
  color: #1e266d;
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  font-weight: 400;
  opacity: .1;
  transform: translateX(-50%);
  white-space: nowrap;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__tag {
    font-size: 20px;
  }
}

.time-line-impact__tag--1 { top: 50%; left: 16%; }
.time-line-impact__tag--2 { top: 4%; left: 70%; font-size: 22px; }
.time-line-impact__tag--3 { top: 22%; left: 25%; }
.time-line-impact__tag--4 { top: 75%; left: 71%; font-size: 22px; }
.time-line-impact__tag--5 { top: 85%; left: 20%; font-size: 15px; }
.time-line-impact__tag--6 { top: 37%; left: 81%; font-size: 15px; }

@media screen and (min-width: 1200px) {
  .time-line-impact__tag--2,
  .time-line-impact__tag--4 { font-size: 28px; }

  .time-line-impact__tag--5,
  .time-line-impact__tag--6 { font-size: 20px; }
}

/* Pages Ranked */

.time-line-impact__card--pages {
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0;
  padding: 30px 20px 0;
  background: #26348b;
  text-align: left;
}

.time-line-impact__pages-head {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 6px;
  width: 100%;
}

.time-line-impact__stat-number--pages {
  font-size: 34px;
  white-space: nowrap;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__stat-number--pages {
    font-size: 40px;
  }
}

.time-line-impact__pages-head .time-line-impact__stat-label {
  flex: 1 1 auto;
  max-width: 187px;
  text-align: center;
}

.time-line-impact__pages-media {
  position: relative;
  display: block;
  width: calc(100% + 40px);
  margin: 20px -20px 0;
}

.time-line-impact__pages-media img:first-child {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 303 / 232;
  object-fit: contain;
}

.time-line-impact__pages-arrow {
  position: absolute;
  top: 66.5%;
  left: 14.4%;
  width: 3%;
  height: auto;
  transform: rotate(-3.66deg);
}

.time-line-impact__pages-sticker {
  position: absolute;
  color: #000;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  line-height: 1.13;
  white-space: nowrap;
}

.time-line-impact__pages-sticker--label {
  top: 64%;
  left: 17.3%;
  font-size: 8px;
  transform: translate(-50%, -50%) rotate(-4.85deg);
}

.time-line-impact__pages-sticker--value {
  top: 67.4%;
  left: 20.2%;
  font-size: 11px;
  transform: translate(-50%, -50%) rotate(-5.98deg);
}

/* Projects Delivered */

.time-line-impact__card--projects {
  background: radial-gradient(circle at 50% 50%, #7eeadf 0%, #5fe6c6 25%, #40e2bb 50%, #20ddb1 75%, #01d9a6 100%);
  padding: 20px;
}

.time-line-impact__ring {
  --tli-pct: 0;
  position: relative;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: conic-gradient(#fff calc(var(--tli-pct) * 1%), rgba(30, 41, 59, .35) 0);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 15px), #000 calc(100% - 15px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 15px), #000 calc(100% - 15px));
}

.time-line-impact__ring-content {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.time-line-impact__stat-number--projects {
  color: #26348b;
  font-size: 32px;
  font-weight: 700;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__stat-number--projects {
    font-size: 46px;
  }
}

.time-line-impact__stat-label--projects {
  max-width: 140px;
  color: #26348b;
  font-size: 13px;
  line-height: 1.4;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__stat-label--projects {
    font-size: 14px;
  }
}

/* Get Free Content Sample panel */

.time-line-impact__form-panel {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  padding: 33px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  background: #f9fafb;
}

.time-line-impact__form-panel::after {
  position: absolute;
  top: -16px;
  right: -16px;
  width: 96px;
  height: 96px;
  background: #00b6d6;
  filter: blur(46px);
  content: '';
  opacity: .8;
  pointer-events: none;
}

.time-line-impact__form-heading {
  position: relative;
  z-index: 1;
  margin: 0 0 24px;
  color: #174fa2;
  font-family: 'Montserrat', sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.65;
  text-transform: uppercase;
}

@media screen and (min-width: 1200px) {
  .time-line-impact__form-heading {
    font-size: 30px;
  }
}

.time-line-impact__form { position: relative; z-index: 1; }
.time-line-impact__form .wpforms-container { margin: 0 !important; }
.time-line-impact__form .wpforms-field-container { display: flex; flex-direction: column; gap: 40px; }
.time-line-impact__form .wpforms-field { position: relative; margin: 0 !important; padding: 0 !important; }
.time-line-impact__form .wpforms-field-label {
  display: block;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: #174fa2 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
}

.time-line-impact__form .wpforms-required-label { color: inherit !important; }
.time-line-impact__form .wpforms-field input,
.time-line-impact__form .wpforms-field select,
.time-line-impact__form .wpforms-field textarea {
  width: 100% !important;
  min-height: 47px !important;
  padding: 12px 47px 12px 17px !important;
  border: 1px solid #d6dce3 !important;
  border-radius: 12px !important;
  background-color: #fff !important;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .05) !important;
  color: #6b717a !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}

.time-line-impact__form .wpforms-field select {
  appearance: none !important;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7' fill='none'%3E%3Cpath d='M10.849 0.68392C10.849 0.861253 10.7857 1.01959 10.659 1.15892L5.909 5.90892C5.76967 6.04825 5.61133 6.11792 5.434 6.11792C5.25667 6.11792 5.09833 6.04825 4.959 5.90892L0.209 1.15892C0.0696667 1.01959 0 0.861253 0 0.68392C0 0.506587 0.0696667 0.348253 0.209 0.20892C0.348333 0.0695868 0.506667 -8.01086e-05 0.684 -8.01086e-05H10.184C10.3613 -8.01086e-05 10.5197 0.0695868 10.659 0.20892C10.7983 0.348253 10.8617 0.506587 10.849 0.68392Z' fill='%23174FA2'/%3E%3C/svg%3E") !important;
  background-position: calc(100% - 17px) 50% !important;
  background-repeat: no-repeat !important;
  background-size: 11px 7px !important;
}

.time-line-impact__form .wpforms-field input::placeholder,
.time-line-impact__form .wpforms-field textarea::placeholder { color: #6b717a; opacity: 1; }
.time-line-impact__form .wpforms-field input:focus,
.time-line-impact__form .wpforms-field select:focus,
.time-line-impact__form .wpforms-field textarea:focus { border-color: #00b6d6 !important; outline: none !important; }

/* Validation error state — applied via view.js when a required select is
   left empty on submit. */
.time-line-impact__form .wpforms-field select.error { border-color: #f61067 !important; border-width: 2px !important; }
.time-line-impact__form .wpforms-submit-container { margin: 40px 0 0 !important; padding: 0 !important; }

/*
 * Sizing/layout only — .btn-green (added via block.php) owns all visual
 * styling (background gradient, hover transition, border-radius).
 */
.time-line-impact__form .wpforms-submit,
.time-line-impact__form button.wpforms-submit {
  min-width: 241px;
  padding: 17px 30px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 15px !important;
  text-align: center;
}

/* WPForms' own div.wpforms-container-full .wpforms-form button[type="submit"]
   rule outranks .btn-green on specificity alone, so re-assert .btn-green's
   own values (not a different look) with !important — same pattern used in
   sample-modal.css, content-sample.css and lazyblock-content-audit-form. */
.time-line-impact__form .wpforms-submit.btn-green {
  background: linear-gradient(90deg, var(--c1, #00b3dA), var(--c2, #00daa6) 51%, var(--c1, #00b3dA)) var(--x, 0)/ 200% !important;
  --c2: #007dc3;
  --c1: #00e175;
  border: none !important;
  border-radius: 6px !important;
  color: var(--white) !important;
  transition: all 0.5s ease;
}
.time-line-impact__form .wpforms-submit.btn-green:hover {
  --x: 100%;
  color: var(--white) !important;
}
.time-line-impact__form .wpforms-error-container { margin-top: 5px !important; }

/*
 * The stats grid stays a fixed 2-column layout at every width — only the
 * grid vs. form-panel arrangement changes, from side-by-side to stacked.
 * That keeps at least two stat cards per row all the way down to mobile,
 * instead of collapsing to one full-width card per row.
 */
@media screen and (max-width: 1024px) {
  .time-line-impact__grid { flex-direction: column; }
  /*
   * flex: 1 1 0's flex-basis: 0 applies to whichever axis is the flex
   * container's main axis — once .time-line-impact__grid switches to
   * flex-direction: column above, that 0 basis is read as a height of 0
   * with no sibling to grow against, collapsing the panel to near-nothing
   * and clipping the form underneath it via overflow: hidden.
   */
  .time-line-impact__stats,
  .time-line-impact__form-panel { flex: none; width: 100%; }
}

@media screen and (max-width: 576px) {
  .time-line-impact { padding: 55px 0; }
  .time-line-impact__stats { gap: 16px; }
  .time-line-impact__card { padding: 20px 16px; gap: 10px; }
  .time-line-impact__form-panel { padding: 24px 18px; }
  .time-line-impact__form-heading { font-size: 20px; }
}

/*======================================
=            SAMPLE MODAL
======================================*
 * This page never loads blog-components/sample-modal/sample-modal.css, so
 * that stylesheet (same markup, same form #26670) is reproduced verbatim
 * here for the "Get Free Content Sample" gate above. Keep in sync with the
 * blog's copy if either one changes.
 */

.content-sample-carrier-field{
    display:none;
}

.sample-modal{
    position:fixed;
    inset:0;
    z-index:99999;
    display:none;
    align-items:center;
    justify-content:center;
}

.sample-modal.active{
    display:flex;
}

.sample-modal__overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.59);
    backdrop-filter:blur(5px);
}

.sample-modal__wrapper{
    position:relative;
    width:1140px;
    min-height:479px;
    display:flex;
    align-items:stretch;
    border-radius:10px;
    overflow:visible;
    z-index:2;
    padding:10px;
}

.sample-modal__bg{
    position:absolute;
    inset:10px;
    border-radius:10px;
    overflow:hidden;
    z-index:0;
}

.sample-modal__bg img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:10px;
}

.sample-modal__close{
    position:absolute;
    right:10px;
    top:-9px;
    width:32px;
    height:32px;
    border:none;
    background:transparent;
    cursor:pointer;
    z-index:10;
    padding:0;
}

.sample-modal__close img{
    width:100%;
    height:100%;
    display:block;
}

.sample-modal__close:hover{
    opacity:.8;
}

.sample-modal__left{
    position:absolute;
    left:50px;
    top:50%;
    transform:translateY(-50%);
    width:484px;
    background:#fcfcfc;
    border-radius:10px;
    border:8px solid rgba(233,233,233,.72);
    z-index:5;
}

.sample-modal__left--form{
    padding:35px;
}

.sample-modal__form-header{
    display:flex;
    align-items:center;
    gap:15px;
    margin:0 0 25px;
}

.sample-modal__form-header img{
    width:35px;
    height:35px;
    flex-shrink:0;
}

.sample-modal__form-header h3{
    margin:0;
    font-family:'Roboto',sans-serif;
    font-size:28px;
    font-weight:500;
    color:#1e266d;
    line-height:1.13;
}

.sample-modal .wpforms-container{
    margin:0;
}

.sample-modal .wpforms-field{
    padding:0 !important;
    margin:0 0 22px !important;
}

.sample-modal .wpforms-field-label{
    display:flex !important;
    align-items:center;
    gap:5px;
    margin:0 0 5px !important;
    font-family:'Roboto',sans-serif !important;
    font-size:18px !important;
    font-weight:400 !important;
    color:#1e266d !important;
    line-height:27px !important;
}

.sample-modal .wpforms-required-label{
    color:#f61067 !important;
}

.sample-modal input[type="text"],
.sample-modal input[type="email"],
.sample-modal input[type="tel"]{
    width:100% !important;
    height:54px !important;
    border:1px solid #a2c6e4 !important;
    border-radius:6px !important;
    padding:0 15px !important;
    font-family:'Roboto',sans-serif !important;
    font-size:18px !important;
    font-weight:400 !important;
    color:#1e266d !important;
    background:#fcfcfc !important;
    box-shadow:10px 10px 15px rgba(218,233,242,.25) !important;
    max-width:100% !important;
}

.sample-modal input::placeholder{
    color:#969bab;
}

.sample-modal input:focus{
    outline:none;
    border-color:#a2c6e4 !important;
}

.sample-modal .wpforms-submit-container{
    margin:0 !important;
    padding:0 !important;
}

.sample-modal__btn{
    width:100% !important;
    height:auto !important;
    border:none !important;
    border-radius:6px !important;
    padding:17px 40px !important;
    background:linear-gradient(98.5deg,#00daa6 .23%,#00b3da 104.64%) !important;
    color:#fff !important;
    font-family:'Roboto',sans-serif !important;
    font-size:18px !important;
    font-weight:500 !important;
    line-height:25px !important;
    text-align:center;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

.sample-modal .wpforms-submit{
    width:100% !important;
    height:auto !important;
    font-family:'Roboto',sans-serif !important;
    text-align:center;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.sample-modal .wpforms-submit.btn-green{
    background: linear-gradient(90deg, var(--c1, #00b3dA), var(--c2, #00daa6) 51%, var(--c1, #00b3dA)) var(--x, 0)/ 200% !important;
    --c2: #007dc3;
    --c1: #00e175;
    border: none !important;
    border-radius: 6px !important;
    padding: 20px 15px !important;
    color: var(--white) !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    transition: all 0.5s ease;
}
.sample-modal .wpforms-submit.btn-green:hover{
    --x: 100%;
    color: var(--white) !important;
}
@media screen and (min-width: 1200px){
    .sample-modal .wpforms-submit.btn-green{
        font-size: 1.125rem !important;
        padding: 20px 50px !important;
    }
}

.sample-modal .wpforms-submit-spinner{
    display:none !important;
}

.sample-modal__btn:hover{
    opacity:.92;
    color:#fff;
}

.sample-modal__privacy{
    margin:0;
    text-align:center;
    font-family:'Roboto',sans-serif;
    font-size:18px !important;
    font-weight:400;
    color:#969bab;
    line-height:27px;
    width:100%;
}

.sample-modal__privacy a{
    color:#1E266D;
    font-size:18px;
}

.sample-modal__right{
    position:relative;
    z-index:1;
    flex:1;
    display:flex;
    align-items:center;
    flex-direction:column;
    padding-left:570px;
    padding-right:50px;
    padding-top:53px;
    padding-bottom:53px;
}

.sample-modal__right-content{
    display:flex;
    flex-direction:column;
    gap:25px;
    align-items:start;
}

.sample-modal__right h3{
    margin:0;
    font-family:'Poppins',sans-serif;
    font-size:26px;
    font-weight:700;
    color:#fff;
    line-height:normal;
}

.sample-modal__right p{
    margin:0;
    font-family:'Roboto',sans-serif;
    font-size:18px;
    font-weight:400;
    color:#fff;
    line-height:27px;
}

.sample-modal__arrow{
    width:62px;
    height:43px;
}

.sample-modal__summary{
    display:flex;
    gap:15px;
    margin-top:auto;
}

.summary-card{
    width:140px;
    background:#fff;
    border-radius:10px;
    padding:16px 21px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    box-shadow:0 4px 12px rgba(0,0,0,.18);
}

.summary-card:last-child{
    flex:1;
}

.summary-card__icon{
    width:75px;
    height:75px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.summary-card__icon img{
    width:100%;
    height:100%;
}

.summary-card span{
    font-family:'Roboto',sans-serif;
    font-size:18px;
    font-weight:400;
    color:#0e2a72;
    line-height:27px;
    text-align:center;
    white-space:nowrap;
}

.sample-modal__left--success{
    display:none;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:35px;
    height:539px;
}

.sample-modal.success .sample-modal__left--form{
    display:none;
}

.sample-modal.success .sample-modal__left--success{
    display:flex;
}

.sample-modal__success-icon{
    width:75px;
    height:75px;
    margin-bottom:15px;
}

.sample-modal__success-icon img{
    width:100%;
    height:100%;
}

.sample-modal__left--success h3{
    margin:0 0 15px;
    font-family:'Roboto',sans-serif;
    font-size:28px;
    font-weight:500;
    color:#1e266d;
    line-height:1.13;
}

.sample-modal__left--success p{
    margin:0 0 25px;
    font-family:'Roboto',sans-serif;
    font-size:18px;
    font-weight:400;
    color:#969bab;
    line-height:27px;
    text-align:center;
    max-width:400px;
}

@media(max-width:1200px){

    .sample-modal__wrapper{
        width:94%;
    }

    .sample-modal__left{
        width:400px;
        left:30px;
    }

    .sample-modal__right{
        padding-left:460px;
        padding-right:30px;
    }
}

@media(max-width:991px){

    .sample-modal{
        align-items:flex-start;
        overflow-y:auto;
        padding:20px 0;
    }

    .sample-modal__wrapper{
        flex-direction:column;
        width:94%;
        min-height:auto;
        padding:0;
        margin:auto;
    }

    .sample-modal__bg{
        display:none;
    }

    .sample-modal__close{
        right:0;
        top:-40px;
        width:28px;
        height:28px;
    }

    .sample-modal__left{
        position:relative;
        left:auto;
        top:auto;
        transform:none;
        width:100%;
        border-width:4px;
    }

    .sample-modal__left--form{
        padding:28px;
    }

    .sample-modal__left--success{
        height:auto;
        min-height:400px;
        padding:40px 28px;
    }

    .sample-modal__form-header h3{
        font-size:22px;
    }

    .sample-modal__right{
        padding:25px 20px;
        background:linear-gradient(135deg,#0e2a72,#1a4db5);
        border-radius:0 0 10px 10px;
    }

    .sample-modal__right h3{
        font-size:20px;
    }

    .sample-modal__right p{
        font-size:16px;
        line-height:24px;
    }

    .sample-modal__right-content{
        gap:15px;
    }

    .sample-modal__arrow{
        display:none;
    }

    .sample-modal__summary{
        flex-wrap:wrap;
        gap:10px;
        margin-top:20px;
        width:100%;
    }

    .summary-card{
        width:calc(33.33% - 7px);
        padding:12px 10px;
        gap:6px;
    }

    .summary-card:last-child{
        flex:0 0 calc(33.33% - 7px);
    }

    .summary-card__icon{
        width:50px;
        height:50px;
    }

    .summary-card span{
        font-size:14px;
        line-height:20px;
    }

    .sample-modal .wpforms-field-label{
        font-size:16px !important;
        line-height:24px !important;
    }

    .sample-modal input[type="text"],
    .sample-modal input[type="email"],
    .sample-modal input[type="tel"]{
        height:48px !important;
        font-size:16px !important;
    }

    .sample-modal__btn{
        font-size:16px !important;
        padding:14px 30px !important;
    }

    .sample-modal__privacy{
        font-size:14px !important;
        line-height:22px;
    }

    .sample-modal__privacy a{
        font-size:14px;
    }

    .sample-modal__success-icon{
        width:60px;
        height:60px;
    }

    .sample-modal__left--success h3{
        font-size:22px;
    }

    .sample-modal__left--success p{
        font-size:16px;
        line-height:24px;
        max-width:100%;
    }
}

@media(max-width:640px){

    .sample-modal{
        padding:10px 0;
    }

    .sample-modal__wrapper{
        width:92%;
    }

    .sample-modal__close{
        right:0;
        top:-36px;
        width:24px;
        height:24px;
    }

    .sample-modal__left--form{
        padding:22px 18px;
    }

    .sample-modal__left--success{
        padding:30px 18px;
        min-height:350px;
    }

    .sample-modal__form-header{
        gap:10px;
        margin-bottom:20px;
    }

    .sample-modal__form-header img{
        width:28px;
        height:28px;
    }

    .sample-modal__form-header h3{
        font-size:18px;
    }

    .sample-modal__right{
        padding:20px 15px;
    }

    .sample-modal__right h3{
        font-size:18px;
    }

    .sample-modal__right p{
        font-size:14px;
        line-height:22px;
    }

    .sample-modal__right-content{
        gap:10px;
    }

    .sample-modal__summary{
        gap:8px;
        margin-top:15px;
    }

    .summary-card{
        width:100%;
        flex-direction:row;
        padding:10px 15px;
        gap:12px;
    }

    .summary-card:last-child{
        flex:1;
    }

    .summary-card__icon{
        width:40px;
        height:40px;
        flex-shrink:0;
    }

    .summary-card span{
        font-size:14px;
        white-space:normal;
        text-align:left;
    }

    .sample-modal .wpforms-field{
        margin-bottom:16px !important;
    }

    .sample-modal .wpforms-field-label{
        font-size:14px !important;
        line-height:21px !important;
    }

    .sample-modal input[type="text"],
    .sample-modal input[type="email"],
    .sample-modal input[type="tel"]{
        height:44px !important;
        font-size:14px !important;
    }

    .sample-modal__btn{
        font-size:15px !important;
        padding:12px 25px !important;
    }

    .sample-modal__privacy{
        font-size:13px !important;
        line-height:20px;
    }

    .sample-modal__privacy a{
        font-size:13px;
    }

    .sample-modal__success-icon{
        width:50px;
        height:50px;
        margin-bottom:10px;
    }

    .sample-modal__left--success h3{
        font-size:20px;
        margin-bottom:10px;
    }

    .sample-modal__left--success p{
        font-size:14px;
        line-height:22px;
        margin-bottom:20px;
    }
}

@media(max-width:380px){

    .sample-modal__wrapper{
        width:96%;
    }

    .sample-modal__left--form{
        padding:18px 14px;
    }

    .sample-modal__left--success{
        padding:25px 14px;
        min-height:300px;
    }

    .sample-modal__form-header h3{
        font-size:16px;
    }

    .sample-modal__right{
        padding:16px 12px;
    }

    .sample-modal__right h3{
        font-size:16px;
    }

    .sample-modal__right p{
        font-size:13px;
        line-height:20px;
    }

    .summary-card{
        padding:8px 12px;
        gap:8px;
    }

    .summary-card__icon{
        width:32px;
        height:32px;
    }

    .summary-card span{
        font-size:13px;
    }

    .sample-modal input[type="text"],
    .sample-modal input[type="email"],
    .sample-modal input[type="tel"]{
        height:42px !important;
        font-size:13px !important;
    }

    .sample-modal__btn{
        font-size:14px !important;
        padding:11px 20px !important;
    }
}
