  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
}
:root{
  /* color */
    --btn-icon-submenu-underline-color:#FF782E;
    --orange-link-in-white-background-color:#B9430C;
    --description-and-paragraph-color:#526170;
    --title-and-menu-and-topbar-color:#102A3A;
    --card-borders-and-dividers-color:#DCE4EB;
    --footer-background-color:#0B2233;
    --background-and-header-cards-color:#FFFFFF;
    --background-for-work-part:#EDF4FA;
    --base-text-color:#526170;
    --h1-to-h6-color:#102A3A;
    --links-in-white-background-color:#B9430C;
    --links-hover:#96360A;
    --text-selection-background-color:#102A3A;
    --selected-text-color:#FFFFFF;
    --borders-color:#DCE4EB;
    --footer-text-and-color:#CBD5E1;
    --btn-hover-color:#FF934F;
    --placeholder-color:#64748B;
    --success-message-color:#166534;
    --success-message-background-color:#F0FDF4;
    --eror-message-color:#B91C1C;
    --eror-message-background-color:#FEF2F2;
           --white: #fff;
        --black: #111;
        --purple: rgb(62, 7, 72);
        --purple-a: rgba(62, 7, 72, 0.97);
        --yellow: #ffeb00;
        --border: #e5e5e5;
        --header-h: 70px;
        --transition: 0.25s ease;
    /* font-size */
    --text-small:clamp(0.875rem,calc(0.8rem + 0.3vw), 1rem); 
}
h1,h2,h3,h4,h5,h6{
    color: var(--h1-to-h6-color);line-height: 1.3;
}
h1{
  font-size: clamp(2rem, calc(1.2rem + 3.2vw), 4rem);
}
h2{
  font-size: clamp(1.75rem, calc(1.25rem + 1.6vw), 2.5rem);
}
h3{
  font-size: clamp(1.25rem, calc(1rem + 1vw), 1.75rem);
}
h4{
  font-size: clamp(1.125rem, calc(1rem + 0.6vw), 1.5rem);
}
h5{
  font-size: clamp(1rem, calc(0.9rem + 0.4vw), 1.25rem);
}
h6{
  font-size: clamp(1rem, calc(0.95rem + 0.2vw), 1.125rem);
}
p{
  font-size: clamp(1rem,calc(0.95rem + 0.2vw), 1.125rem);
  line-height: 1.7;
}
span{
  font-size: var(--text-small);
  line-height: 1.6;
}
button,input,select,textarea{
  font-size: 1rem;
}
label,small{
  font-size: var(--text-small);
}
img,video{
  display: block;
  max-width: 100%;
  height: auto;
}
.transflow-web-header{
    background:var(--title-and-menu-and-topbar-color);
    width: 100%;
}
.header-topbar{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    font-size: 12px;
}
.transflow-lang-switcher{
    display: flex;
    gap: 15px;
    /* font-weight: 500; */
    line-height: 1.5;
}
.lang-icon img{
    width: 25px;
    height: 25px;
}
.transflow-lang-switcher ul{
    display: flex;
    align-items: center;
    gap: 15px;
}
.lang-divider{
    color:var(--background-and-header-cards-color);
    width: 10px;
}
.topbar-tagline-text, .transflow-lang-switcher ul li a{
    color: var(--background-and-header-cards-color);
}
.transflow-lang-switcher a:hover{
    color: var(--btn-hover-color);
}
.transflow-lang-switcher a:focus-visible{
    color: var(--btn-hover-color);
    outline: 2px solid var(--btn-hover-color);
    outline-offset:3px ;
    border-radius: 2px;
}
.header{
    background: var(--background-and-header-cards-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 15px;
}
.transflow-web-header-logo a img {
    display: block;
    width: 160px;
}
.transflow-web-menu ul{
    display: flex;
    gap: 10px;
}
.transflow-web-menu ul li{
    margin: 0 20px;
    /* font-weight: 600; */
}
.transflow-web-menu ul li a{
    color: var(--title-and-menu-and-topbar-color);
    position: relative;
    display: inline-block;
    padding-bottom: 6px;
    border-bottom: 2px solid;
}
.transflow-web-menu ul li a:hover{
    color: var(--links-in-white-background-color);
}
 .transflow-web-menu ul li a.active{
    border-bottom-color: var(--btn-icon-submenu-underline-color);
 }
.transflow-web-menu ul li ul{
    display: none;
}
  .current-path{
        display: flex;
        gap: 10px;
        margin-bottom: 20px;
        align-items: center;
    }
    .current-path a{
        color: red;
    }
    .current-path a:hover{
        color: blue;
    }
    .current-path span{
        font-size: 20px;
    }
.requests-link{
    min-width: 170px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.4;
    border-radius: 4px;
     background: var(--btn-icon-submenu-underline-color);
     white-space: nowrap;
}
.requests-link:hover{
    background-color: var(--btn-hover-color);
    transition: background-color .2s ease;
}
.requests-link img{
    display: block;
    width: 18px;
    height: 18px;
}
.requests-link a{
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--background-and-header-cards-color);
}
.home-page-banner-all{
    position: relative;
    width: 100%;
    height: auto;
}
.home-page-banner .home-page-banner-img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.home-page-banner-content{
    position: absolute;
    top: 50%;
    left: 8%;
    transform: translateY(-50%);
    width: 44%;
    max-width: 560px;
    color: var(--background-and-header-cards-color);
}
.banner-label{
    margin: 0 0 14px;
    font-size: 11px;
    letter-spacing: 2px;
    color: var(--background-and-header-cards-color);
}
.home-page-banner-content h1{
    color: var(--background-and-header-cards-color);
    margin: 0 0 16px;
    font-size: clamp(28px,4vw,60px);
    line-height: 1.08;
}
.banner-description{
    max-width: 390px;
    margin: 0 0 24px;
    font-size: 16px;
    line-height: 1.6;
}
.transflow-web-banner-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.banner-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: var(--btn-icon-submenu-underline-color);
    color: var(--background-and-header-cards-color);
    font-size: 14px;
    /* font-weight: 600; */
    gap: 5px;
}
.home-page-banner {
  position: relative;
  overflow: hidden;
}
@media (max-width: 768px) {

  /* ===== Corner ===== */
  .banner-corner {
    position: absolute;

    top: 18%;
    left: 5%;

    width: clamp(45px, 14vw, 70px);
    height: auto;

    margin: 0;
    transform: none;
    z-index: 2;
  }


  /* ===== Slogan ===== */
  .banner-slogan {
    position: absolute;

    left: 5%;
    bottom: 8%;
    top: auto;

    width: min(90%, 360px);
    max-width: calc(100% - 40px);

    margin: 0;
    transform: none;

    font-size: clamp(0.75rem, 3.2vw, 0.95rem);
    line-height: 1.5;

    z-index: 2;
  }
}
.banner-btn:hover{
    background-color: var(--btn-hover-color);
    transition: background-color 0.2s ease;
}
.banner-btn-outline{
    border-color: var(--background-and-header-cards-color);
    background: transparent;
    color: var(--background-and-header-cards-color);
}

.QuoteTracker{
    position: relative;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 24px;
    margin-top: -30px;
    margin: 0 auto;
    padding: 0 24px;
    padding: 20px 24px;
    background: var(--background-and-header-cards-color);
    border: 1px solid var(--card-borders-and-dividers-color);
    border-radius: 6px;
    box-shadow: 0 10px 30px rgb(16 42 58 / 10%);
}
.QuoteTracker-container{
    width: 80%;
    max-width: 1200px;
    min-height: 76px;
    margin: 0 auto;
    margin-top: -60px;
    padding: 16px 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    background: var(--background-and-header-cards-color);
    border-radius: 8px;
}
.QuoteTrackerInto h2{
    margin:  0  0 5px;
    color: var(--h1-to-h6-color);
    font-size: 16px;
}
.QuoteTrackerInto p{
    margin: 0;
    color: #526170;
    font-size: 12px;
    line-height: 1.5;
}
.quote-track-form{
    flex: 1.5;
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    align-items: end;
    gap: 12px;
}
.track-field{
    min-width: 0;
}
.track-field label{
    display: none;
}
.track-field input{
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #8293A3;
    border-radius: 3px;
    background: var(--background-and-header-cards-color);
    color: var(--h1-to-h6-color);
    font: inherit;
    font-size: 14px;
}
.track-field .tracking-code{
    background-image: url('./../images/icons/gray/barcode-gray.svg');
    background-repeat: no-repeat;
    background-position: 12px center;
    padding-left: 40px;
    background-size: 18px 18px;   
}
.track-field input::placeholder{
    color: var(--placeholder-color);
   font-size: 16px;
   /* font-weight: 600; */
}
.quote-track-form button{
    min-height: 44px;
    padding: 10px 18px;
    border: 0;
    border-radius: 3px;
    background: var(--h1-to-h6-color);
    color: var(--background-and-header-cards-color);
    font: inherit;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}
.quote-track-form button img{
    display: block;
}
.quote-track-form button:hover{
    background: #1B4056;
}
.transflow-web-header-quote-box{
    width: 48px;
    height: 48px;
}
.transflow-web-header-quote-box img{
    width: 100%;
    height: 100%;
    transform: scale(1.5);
}
.tracking-box-item{
  display:flex;
  justify-content: space-between;
  gap: 15px;
}
 .tf-home-content,
    .tf-site-footer {
      font-family: Arial, Helvetica, sans-serif;
      direction: ltr;
      text-align: left;
      color: var(--title-and-menu-and-topbar-color);
      line-height: 1.6;
    }
    .tf-home-content *,
    .tf-site-footer * {
      box-sizing: border-box;
    }
    .tf-home-content {
      background: #fff;
      display: flow-root;
    }
    .tf-container {
      width: min(1200px, calc(100% - 40px));
      margin-inline: auto;
    }
     .tf-home-content img{
      display: block;
      max-width: 100%;
      width: 100%;
      height: 100%;
      object-fit: contain;
      /* margin-bottom: 15px; */
    } 
    .tf-home-content a,
    .tf-site-footer a {
      text-decoration: none;
    }
    .tf-home-content :is(a, button, input, select):focus-visible,
    .tf-site-footer a:focus-visible {
      outline: 3px solid var(--btn-icon-submenu-underline-color);
      outline-offset: 4px;
    }
    .tf-home-content h2,
    .tf-home-content h3,
    .tf-home-content p,
    .tf-site-footer h2,
    .tf-site-footer p {
      margin: 0;
    }
    .tf-eyebrow {
      margin-bottom: 8px !important;
      color: var(--orange-link-in-white-background-color);
      font-size: 11px;
      /* font-weight: 700; */
      letter-spacing: 2.5px;
      text-transform: uppercase;
    }
    .tf-section-title {
      color: var(--title-and-menu-and-topbar-color);
      font-size: clamp(26px, 3vw, 38px);
      /* font-weight: 700; */
      line-height: 1.15;
      letter-spacing: -1px;
    }
    .tf-section-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      gap: 32px;
      margin-bottom: 24px;
    }
    .tf-section-description {
      max-width: 380px;
      color: var(--base-text-color);
      font-size: 14px;
    }
    .tf-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      min-height: 44px;
      padding: 11px 20px;
      border: 0;
      border-radius: 4px;
      font: inherit;
      font-size: 14px;
      /* font-weight: 700; */
      line-height: 1.4;
      cursor: pointer;
      transition: background-color 180ms ease;
    }
    .tf-button img{
        width: 18px;
    }
    .tf-button-dark {
      background: var(--title-and-menu-and-topbar-color);
      color: #fff;
    }
    .tf-button-dark:hover {
      background: #1b4056;
    }
    .tf-button-orange {
      background: var(--btn-icon-submenu-underline-color);
      color: var(--title-and-menu-and-topbar-color);
    }
    .tf-button-orange:hover {
      background: #ff934f;
    }
    .tf-sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap;
      border: 0;
    }
    .tf-tracker {
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: minmax(270px, 0.95fr) minmax(0, 1.4fr);
      align-items: center;
      gap: 24px;
      margin-top: -36px;
      margin-bottom: 52px;
      padding: 20px 24px;
      background: #fff;
      border: 1px solid #eef1f4;
      border-radius: 7px;
      box-shadow: 0 12px 32px rgb(16 42 58 / 10%);
    }
    .tf-tracker-intro {
      display: flex;
      align-items: center;
      gap: 16px;
      min-width: 0;
    }
    .tf-tracker-icon {
      width: 36px;
      height: 36px;
      flex-shrink: 0;
      object-fit: contain;
    }
    .tf-tracker-intro h2 {
      font-size: 17px;
      line-height: 1.3;
      margin-bottom: 4px;
    }
    .tf-tracker-intro p {
      color: var(--base-text-color);
      font-size: 12px;
    }
    .tf-tracker-form {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
    }
    .tf-input-wrap {
      position: relative;
      min-width: 0;
    }
    .tf-input-icon {
      position: absolute;
      top: 50%;
      left: 12px;
      width: 17px;
      height: 17px;
      color: #64748b;
      transform: translateY(-50%);
      pointer-events: none;
    }
    .tf-input-wrap input,
    .tf-input-wrap select {
      width: 100%;
      min-width: 0;
      min-height: 44px;
      padding: 10px 12px 10px 38px;
      border: 1px solid #8293a3;
      border-radius: 4px;
      background: #fff;
      color: var(--title-and-menu-and-topbar-color);
      font: inherit;
      font-size: 13px;
      line-height: 1.4;
    }
       #tf-origin,#tf-destination,#tf-transport{
        background-image: url('./../images/icons/navy/location-pin-navy.svg');
        background-repeat: no-repeat;
        background-position: 12px center;
        padding-left: 40px;
        background-size: 18px 18px;
    }
    #tf-transport{
        background-image: url('./../images/icons/navy/airplane-navy.svg');
    }
    .tf-input-wrap select {
      padding-right: 28px;
    }
    .tf-input-wrap input::placeholder {
      color: #64748b;
      opacity: 1;
    }
    .tf-services {
      padding-bottom: 36px;
    }
    .tf-service-grid {
      display: flex;
      gap: 20px;
    }
    .tf-service-card {
      display: flex;
      flex-direction: column;
      overflow: hidden;
      border: 1px solid var(--borders-color);
      border-radius: 4px;
      background: #fff;
      width: 100%;
      height: 100%;
    }
    .tf-service-image {
      width: 100%;
      aspect-ratio: 1.95;
      object-fit: cover;
    }
    .tf-service-body {
      display: flex;
      flex: 1;
      flex-direction: column;
      align-items: flex-start;
      margin-bottom: 15px;
    }
    .tf-service-body h3 {
      margin-bottom: 8px;
      font-size: 19px;
      line-height: 1.3;
    }
    .tf-service-body p {
      margin-bottom: 16px;
      color: var(--base-text-color);
      font-size: 14px;
    }
    .tf-service-link {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-top: auto;
      color: var(--orange-link-in-white-background-color);
      font-size: 14px;
      /* font-weight: 700; */
    }
    .tf-service-link .img-box{
        width: 25px;
        height: 25px;
    }
    .tf-service-link:hover {
      text-decoration: underline;
      text-underline-offset: 4px;
    }
    .tf-about {
      display: grid;
      grid-template-columns: 1.1fr 1fr;
      align-items: center;
      gap: 36px;
      padding-bottom: 52px;
    }
    .tf-about-photo {
      position: relative;
      overflow: hidden;
      border-radius: 4px;
      margin: 0;
    }
    .tf-about-photo img {
      width: 100%;
      aspect-ratio: 1.9;
      object-fit: cover;
    }
    .tf-about-photo figcaption {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      padding: 42px 22px 20px;
      background: linear-gradient(transparent, rgb(0 0 0 / 65%));
      color: #fff;
      font-size: 10px;
      /* font-weight: 700; */
      line-height: 1.6;
      letter-spacing: 1.5px;
    }
    .tf-about-copy > p:not(.tf-eyebrow) {
      margin-top: 14px;
      color: var(--base-text-color);
      font-size: 14px;
    }
    .tf-check-list {
      display: grid;
      gap: 12px;
      list-style: none;
      padding: 0;
      margin: 20px 0 0;
    }
    .tf-check-list li {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 14px;
    }
    .tf-check {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 24px;
      height: 24px;
      flex-shrink: 0;
      border-radius: 50%;
      background-color: var(--btn-hover-color);
      color: var(--title-and-menu-and-topbar-color);
      /* font-weight: 700; */
    }
    .tf-process {
      padding: 38px 0 42px;
      background: var(--background-for-work-part);
    }
    .tf-steps {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 32px;
      list-style: none;
      padding: 0;
      margin: 30px 0 0;
    }
    .tf-step {
      display: grid;
      grid-template-columns: auto 52px minmax(0, 1fr);
      align-items: start;
      gap: 14px;
    }
    .tf-step-number {
      color: var(--orange-link-in-white-background-color);
      font-size: 30px;
      /* font-weight: 700; */
      line-height: 1.3;
    }
    .tf-step-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 52px;
      height: 52px;
      border: 1px solid #a8b7c5;
      border-radius: 12px;
    }
    .tf-step-icon svg {
      width: 30px;
      height: 30px;
    }
    .tf-step-copy {
      border-top: 1px solid #cbd5e1;
      padding-top: 12px;
    }
    .tf-step-copy h3 {
      margin-bottom: 8px;
      font-size: 14px;
      line-height: 1.4;
    }
    .tf-step-copy p {
      color: var(--base-text-color);
      font-size: 13px;
      line-height: 1.5;
    }
    .tf-quote {
      padding: 28px 0;
      color: #fff;
      background-color: var(--title-and-menu-and-topbar-color);
      background-image:
        linear-gradient(90deg, rgb(11 34 51 / 85%), rgb(11 34 51 / 94%)),
        url("./../images/home/footerPort.webp");
      background-position: center;
      background-size: cover;
    }
    .tf-quote-grid {
      display: grid;
      grid-template-columns: 1fr 1.1fr auto;
      align-items: center;
      gap: 36px;
    }
    .tf-quote .tf-eyebrow {
      color: #cbd5e1;
    }
    .tf-quote .tf-section-title {
      max-width: 380px;
      color: #fff;
    }
    .tf-quote {
      background-color: #102a3a;
      background-image:
        linear-gradient(
          to right,
          rgba(16, 42, 58, 0.3) 0%,
          rgba(16, 42, 58, 0.45) 35%,
          #102a3a 62%
        ),
        url("./../images/home/footerPort.webp");
      background-size:
        100% 100%,
        auto 100%;
      background-position:
        center,
        left bottom;
      background-repeat: no-repeat;
      padding-block: 24px;
    }
    input[type="email"]{
         background-image: url('./../images/icons/gray/envelope-gray.svg');
        background-repeat: no-repeat;
        background-position: 12px center;
        padding-left: 40px;
        background-size: 18px 18px;
    }
    .tf-quote-copy > p:last-child {
      margin-top: 16px;
      max-width: 400px;
      color: #d4dfe8;
      font-size: 14px;
    }
    .tf-quote-form {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px 16px;
      padding: 20px;
      border: 1px solid var(--borders-color);
      border-radius: 6px;
      background: #fff;
      color: var(--title-and-menu-and-topbar-color);
    }
    .tf-field {
      min-width: 0;
    }
    .tf-field label {
      display: block;
      margin-bottom: 5px;
      font-size: 12px;
      /* font-weight: 600; */
    }
    .tf-quote-form .tf-button {
      grid-column: 1 / -1;
      width: 100%;
    }
    .tf-quote-motto {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 20px;
      font-size: 10px;
      /* font-weight: 700; */
      line-height: 1.8;
      letter-spacing: 2px;
    }
    .tf-quote-motto::before {
      content: "";
      width: 2px;
      height: 36px;
      background: var(--btn-icon-submenu-underline-color);
    }
    .tf-site-footer {
      padding: 30px 0 20px;
      background: #0b2233;
      color: #cbd5e1;
      border-top: 1px solid #304858;
    }
    .tf-footer-grid {
      display: grid;
      grid-template-columns: 1.5fr 0.7fr 0.9fr 1.1fr;
      gap: 40px;
    }
    .tf-footer-logo {
      display: inline-block;
      margin-bottom: 14px;
    }
    .tf-footer-logo img {
      width: 175px;
      height: auto;
    }
    .tf-footer-brand p {
      max-width: 300px;
      font-size: 13px;
    }
    .tf-footer-column h2 {
      margin-bottom: 14px;
      color: #fff;
      font-size: 14px;
    }
    .tf-footer-column ul {
      display: grid;
      gap: 7px;
      padding: 0;
      margin: 0;
      list-style: none;
    }
    .tf-footer-column a {
      color: #cbd5e1;
      font-size: 13px;
    }
    .tf-footer-column a:hover {
      color: #ff934f;
    }
    .tf-footer-contact {
      font-style: normal;
      font-size: 13px;
    }
    .tf-footer-contact p {
      margin-top: 12px;
    }
    .tf-footer-contact a {
      overflow-wrap: anywhere;
      display: block;
    }
    .tf-footer-bottom {
      display: flex;
      justify-content: space-between;
      /* flex-wrap: wrap; */
      gap: 12px;
      margin-top: 32px;
      padding-top: 16px;
      border-top: 1px solid #304858;
      font-size: 11px;
      color: #bdcbd6;
    }
    @media(max-width:768px){
    .banner-description{
      min-width: 195px;
      margin: 0 0 12px;
      font-size: 16px;
      line-height: 1.6;
    }
    .home-page-banner-content{
      position: absolute;
      top: 20%;
      left: 4%;
      transform: translateY(-25%);
      width: 45%;
    }
    .home-page-banner-content h1{
      font-size: 24px;
    }
    .transflow-web-banner-actions{
      display: grid;
    }
    .banner-btn{
      min-height: 40px;
      padding: 10px 4px;
      font-size: 14px;
      /* font-weight: 600; */
    }
    .tracking-box-item{
      display: flex;
      justify-content: space-between;
      margin-bottom: 20px;
    }
    .QuoteTracker{
      gap: 12px;
    }
    .quote-track-form{
      display: block;
    }
    .QuoteTracker-container{
      width: 100%;
      min-height: 60px;
      margin-top: -30px;
      padding: 8px 11px;
      gap: 12px;
      display: block;
    }
    .track-field{
      display: block;
      margin-bottom: 10px;
    }
    .transflow-web-header-quote-box img{
      transform: scale(1.5);
    }
    .QuoteTrackerInto h2{
      font-size: 16px;
    }
    .QuoteTrackerInto p{
      line-height: 1.5;
      font-size: 14px;
    }
    input[type="email"]{
      background-position: 12px center;
      padding-left: 40px;
      background-size: 18px 18px;
    }
    .track-field input::placeholder{
   font-size: 16px;
   /* font-weight: 600; */
}
.quote-track-form button{
  display: flex;
  justify-content: center;
  padding: 10px 9px;
  font-size: 14px;
  gap: 15px;
  width: 100%;
}
.tf-section-header{
  display: block;
}
.tf-service-body{
  padding: 0 20px;
}
.tf-service-grid{
  display: grid;
}
.tf-footer-grid{
  display: block;
  /* flex-wrap: wrap; */
}
.tf-footer-logo{
  margin-bottom: 0;
}
.tf-site-footer .tf-footer-brand{
  width: 100%;
  margin-bottom: 15px;
}
.tf-footer-logo img{
  width: 160px;
  height: auto;
}
.tf-container{
  display: flex;
  flex-wrap: wrap;
}
.tf-steps{
  display: block;
}
.tf-quote .tf-eyebrow{
  font-size: 18px;
}
.tf-quote .tf-section-title{
  font-size: 36px;
}
.all-footer-menu{
  display: flex;
  justify-content: space-between;
}
/* .tf-step{
  display: block;
} */
 .current-path{
  display: flex;
  margin-top: 20px;
  margin-bottom: 0px !important;
 }
}
      html {
        scroll-behavior: smooth;
      }
      body {
        font-family: Arial, sans-serif;
        color: #222;
        background: #fff;
      }
      body.menu-open {
        overflow: hidden;
      }
      a {
        text-decoration: none;
        color: inherit;
      }
      ul {
        list-style: none;
      }
      button {
        font: inherit;
      }
      .topbar {
        min-height: 40px;
        background: var(--purple);
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 6px 20px;
        color: #fff;
      }
      .topbar .tagline {
        font-size: 13px;
      }
      .lang-bar,
      .lang-bar ul {
        display: flex;
        align-items: center;
      }
      .lang-bar {
        gap: 8px;
      }
      .lang-bar ul {
        gap: 9px;
      }
      .lang-bar a {
        color: var(--yellow);
        font-size: 13px;
        /* font-weight: 700; */
      }
      .lang-icon img {
        display: block;
      }
      .web-header {
        position: relative;
        z-index: 1000;
        background: #fff;
        border-bottom: 1px solid var(--border);
      }
      .web-header-container {
        height: var(--header-h);
        display: flex;
        align-items: center;
        padding: 0 20px;
        max-width: 1440px;
        margin: auto;
      }
      .web-logo img {
        display: block;
        width: 160px;
        height: auto;
      }
      .web-navigation {
        margin-left: auto;
        height: 100%;
      }
      .web-navigation-list {
        height: 100%;
        display: flex;
        align-items: center;
      }
      .web-navigation-list-item {
        position: relative;
        height: 100%;
      }
      .web-navigation-link {
        height: 100%;
        padding: 0 14px;
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 15px;
        /* font-weight: 500; */
        white-space: nowrap;
        transition:
          color var(--transition),
          background var(--transition);
      }
      .web-navigation-link:hover,
      .web-navigation-link:focus-visible {
        background: #f5f5f5;
        color: var(--purple);
        outline: none;
      }
      .web-navigation-list-item--has-submenu > .web-navigation-link::after {
        content: "";
        width: 7px;
        height: 7px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg) translateY(-2px);
        transition: transform var(--transition);
      }
      .web-navigation-list-item--has-submenu:hover
        > .web-navigation-link::after,
      .web-navigation-list-item--has-submenu:focus-within
        > .web-navigation-link::after {
        transform: rotate(225deg) translate(-2px, -2px);
      }
      .web-navigation-submenu {
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 220px;
        padding: 8px 0;
        background: var(--purple-a);
        border: 1px solid rgba(255, 255, 255, 0.12);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
        opacity: 0;
        visibility: hidden;
        transform: translateY(8px);
        transition:
          opacity var(--transition),
          visibility var(--transition),
          transform var(--transition);
      }
      .web-navigation-list-item--has-submenu:hover > .web-navigation-submenu,
      .web-navigation-list-item--has-submenu:focus-within
        > .web-navigation-submenu {
        opacity: 1;
        visibility: visible;
        transform: none;
      }
      .web-navigation-sub-link {
        display: flex;
        align-items: center;
        min-height: 46px;
        padding: 12px 18px;
        color: #fff;
        font-size: 14px;
        white-space: nowrap;
        transition:
          background var(--transition),
          color var(--transition);
      }
      .web-navigation-sub-link:hover,
      .web-navigation-sub-link:focus-visible {
        background: var(--yellow);
        color: var(--purple);
        outline: none;
      }
      .web-menu-button {
        display: none;
        margin-left: auto;
        width: 44px;
        height: 44px;
        border: 0;
        background: transparent;
        cursor: pointer;
        align-items: center;
        justify-content: center;
      }
      .web-menu-icon-button {
        position: relative;
        width: 24px;
        height: 18px;
        display: block;
      }
      .web-menu-icon-button::before,
      .web-menu-icon-button::after,
      .web-menu-line-button {
        content: "";
        position: absolute;
        left: 0;
        width: 24px;
        height: 2px;
        background: var(--black);
        transition:
          transform var(--transition),
          top var(--transition),
          opacity var(--transition);
      }
      .web-menu-icon-button::before {
        top: 0;
      }
      .web-menu-line-button {
        top: 8px;
      }
      .web-menu-icon-button::after {
        top: 16px;
      }
      .web-menu-button[aria-expanded="true"] .web-menu-icon-button::before {
        top: 8px;
        transform: rotate(45deg);
      }
      .web-menu-button[aria-expanded="true"] .web-menu-line-button {
        opacity: 0;
      }
      .web-menu-button[aria-expanded="true"] .web-menu-icon-button::after {
        top: 8px;
        transform: rotate(-45deg);
      }
      .mobile-menu-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.48);
        z-index: 998;
      }
      .web-mobile-navigation {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        width: min(88vw, 390px);
        height: 100dvh;
        background: var(--purple-a);
        z-index: 999;
        overflow-y: auto;
        overscroll-behavior: contain;
        box-shadow: -10px 0 35px rgba(0, 0, 0, 0.2);
        transform: translateX(100%);
        transition: transform 0.28s ease;
        color: #fff;
      }
      .web-mobile-navigation.is-open {
        transform: translateX(0);
      }
      .web-mobile-menu-logo {
        min-height: 90px;
        padding: 18px 60px 18px 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
        background: #fff;
      }
      .web-mobile-menu-logo img {
        display: block;
        width: 160px;
        max-width: 100%;
        height: auto;
      }
      .web-mobile-navigation-list-item {
        border-bottom: 1px solid rgba(255, 255, 255, 0.13);
      }
      .web-mobile-navigation-row {
        display: flex;
        width: 100%;
        align-items: stretch;
      }
      .web-mobile-navigation-list-item-link {
        flex: 1;
        min-width: 0;
        min-height: 54px;
        padding: 15px 18px;
        display: flex;
        align-items: center;
        color: #fff;
        font-size: 15px;
        transition:
          background var(--transition),
          color var(--transition);
      }
      .web-mobile-navigation-list-item-link:hover,
      .web-mobile-navigation-list-item-link:focus-visible {
        background: var(--yellow);
        color: var(--purple);
        outline: none;
      }
      .web-mobile-navigation-toggle {
        flex: 0 0 54px;
        width: 54px;
        border: 0;
        border-left: 1px solid rgba(255, 255, 255, 0.13);
        background: transparent;
        color: #fff;
        cursor: pointer;
        font-size: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .web-mobile-navigation-toggle::before {
        content: "+";
      }
      .web-mobile-navigation-toggle[aria-expanded="true"]::before {
        content: "−";
      }
      .web-mobile-navigation-toggle:hover,
      .web-mobile-navigation-toggle:focus-visible {
        background: rgba(255, 255, 255, 0.1);
        outline: none;
      }
      .web-mobile-navigation-submenu {
        display: grid;
        grid-template-rows: 0fr;
        visibility: hidden;
        transition:
          grid-template-rows 0.25s ease,
          visibility 0.25s ease;
        background: rgba(0, 0, 0, 0.12);
      }
      .web-mobile-navigation-submenu > .submenu-inner {
        overflow: hidden;
        min-height: 0;
      }
      .web-mobile-navigation-list-item.is-open
        > .web-mobile-navigation-submenu {
        grid-template-rows: 1fr;
        visibility: visible;
      }
      .web-mobile-navigation-submenu .web-mobile-navigation-list-item-link {
        padding-left: 34px;
      }
      .web-mobile-menu-social-links-container {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 20px 16px;
      }
      .web-mobile-menu-social-links-container a {
        min-height: 42px;
        padding: 10px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 8px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        transition:
          background var(--transition),
          color var(--transition);
      }
      .web-mobile-menu-social-links-container a:hover {
        background: var(--yellow);
        color: var(--purple);
      }
      .web-mobile-menu-foot-copyright {
        padding: 16px;
        border-top: 1px solid rgba(255, 255, 255, 0.15);
        font-size: 12px;
        text-align: center;
        color: rgba(255, 255, 255, 0.7);
      }
      @media (max-width: 767px) {
        *{
          box-sizing: border-box;
          margin: 0;
          padding: 0;
        }
        .topbar {
          padding-inline: 12px;
        }
        .topbar .tagline {
          font-size: 11px;
        }
        .web-header-container {
          height: 64px;
          padding: 0 12px;
          display: flex;
          justify-content: space-between;
        }
        .mobile-mode-header{
          display: flex;
        }
        .web-logo img {
          width: 140px;
        }
        .web-navigation {
          display: none;
        }
        .web-menu-button {
          display: flex;
          order: 1;
        }
        .web-mobile-navigation {
          display: block;
          width: 100%;
        }
        .mobile-menu-backdrop.is-open {
          display: block;
        }

      }
      @media (max-width: 360px) {
        .web-mobile-navigation {
          width: 92vw;
        }
        .web-mobile-navigation-list-item-link {
          font-size: 14px;
        }
        .topbar .tagline {
          max-width: 175px;
        }
      }
      @media (min-width: 768px) {
        .web-mobile-navigation,
        .mobile-menu-backdrop {
          display: none !important;
        }
        body.menu-open {
          overflow: auto;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        *,
        *::before,
        *::after {
          scroll-behavior: auto !important;
          transition-duration: 0.01ms !important;
        }
      }