/* base button */
.btn-base > a {
    border-radius: 50px;
    padding: 10px 20px;
    font-size: 16px;
    display: inline-block;
    text-decoration: none;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.btn-contact > a {
    background-color: var(--color-yellow);
    color: var(--color-black);
}

.btn-contact > a:hover {
    background-color: var(--color-yellow-hover);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.btn-cta > a {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.btn-cta > a:hover {
    background-color: var(--color-blue-hover);
    color: var(--color-white);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* Smooth animated button on hover and click. */
.animated-button, .wpcf7-submit {
    border: none;
    padding: 4px 25px;
    border-radius: 999px;
    font-size: 18px;
    font-weight: bold;
    color: var(--color-blue);
    cursor: pointer;
    position: relative;
    box-shadow: 0 5px 0 #449dd9;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    margin-left: 30px;
    background-color: var(--color-yellow);
}

.animated-button:hover, .wpcf7-submit:hover {
    transform: translateY(2px);
    box-shadow: 0 2px 0 var(--color-yellow-hover);
}

.animated-button:active, .wpcf7-submit:active {
    transform: translateY(4px);
    box-shadow: 0 0 0 var(--color-yellow-hover);
}

.animated-button span {
    text-shadow: 
        1px 1px var(--color-yellow-hover),
        -1px 1px var(--color-white);
}

/* blue heading titles in all sections */
.main-section-heading {
    margin-bottom: 20px;
    color: var(--color-blue);
}

/* service box in home page */
.o-services {
    position: relative;
    width: 100%;
}
  
.o-services > div {
    border: 1px solid var(--color-blue);
    padding: 20px;
}

.o-services::-webkit-scrollbar{
    width:0;
    background:0 ;
}
  
.o-services__right-cards {
    overflow-y: scroll;
    -ms-overflow-style: scroll;
}
  
.m-icon-card {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    margin-bottom: 20px;
    cursor: pointer;
}
  
.m-icon-card--with-arrow {
    padding: 20px;
    background: var(--color-white);
    border: 1px solid #f0f0f0;
    -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .05);
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset;
}
  
.m-icon-card--with-arrow:hover {
    background: var(--color-card-hover);
    border: 1px solid var(--color-blue);
}

.m-icon-card--with-arrow .m-icon-card__name {
    min-height: 60px;
    font-size: 1.25rem;
}
  
.m-icon-card__name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 120%;
    margin: 0 0 20px 0;
}
  
.m-icon-card__label {
    font-size: var(--body-text-size);
    font-weight: 400;
    line-height: 1.25rem;
    margin-bottom: 0;
}

svg:not(:root) {
    overflow: hidden;
}
  
.m-icon-card--with-arrow .m-icon-card__wrap .a-button {
    display: block;
}
  
.o-services__desc {
    font-size:var(--body-text-size);
    font-weight:400;
    margin-bottom:30px
}

/* back to top button  */
.backTotop {
    width: 70px;
    height: 70px;
    position: fixed;
    right: 30px;
    bottom: 120px;
    background: var(--color-blue-light);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--white);
    opacity: 0;
    z-index: 10;
}

.backTotop:hover {
	  background: var(--color-blue);
}

.backTotop.active {
	  opacity: 1;
}


/* Form CSS */
.wpcf7-submit {
    width: 150px;
    margin-left: 0;
}

.wpcf7-form-control-wrap textarea {
    height: 120px;
}

.wpcf7-form-control-wrap input,
.wpcf7-form-control-wrap textarea {
    border-radius: 5px;
    border: none;
    padding: 3px 5px;
}

.wpcf7-form label {
  color: var(--color-yellow);
}

.wpcf7-form > p:nth-child(3) > label:nth-child(3) {
  margin-top: 1rem;
}

.wpcf7-form {
  padding-right: 30px;
}

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea, .wpcf7 select {
  width: 100%;
  box-sizing: border-box;
}

/* Floating CTA on sidebar*/
.cta-card {
  position:relative;
  width:240px;
  margin: 7rem auto 2rem; 
  padding:90px 15px 30px;
  background: var(--color-white);
  border:1px solid var(--color-blue);
  border-radius:14px;
  box-shadow: -30px 30px 25px -18px rgba(0, 0, 0, .30);
  text-align:center;
}

.bubble-logo {
  position:absolute;
  top:-68px;
  left:-42px;
  width:200px;
}

.bubble-logo img {
  width:100%;
  height:auto;
  display:block;
}

.lead-line {
  color:var(--color-blue);
  font-size:18px;
  font-weight:600;
  margin:0 0 26px;
}

.cta-text {
  font-size:42px;
  font-weight:800;
  line-height: 1.1;
  margin:0;
  color: var(--color-blue);
}

/* ---------- FIXED CTA STATE (toggled by JS) ---------- */
.fixed-cta {
  position:fixed !important;
  right:24px;
  bottom:22vh;               
  z-index:1000;
  transform:translateY(20px);
  opacity:0;
  transition:transform .35s ease,opacity .35s ease;
}

.fixed-cta.fixed-ready {
  transform:translateY(0);
  opacity:1;
}

.grid-container {
  position: relative; 
}

/* grid cards */
.category-content-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 5rem;
    row-gap: 3rem;
    margin-top: 40px;
}

.category-card, .grid-container > .wp-block-group__inner-container{
    position: relative;
    display:flex;         
    flex-direction:column;
    height:100%;  
}

.category-excerpt {
    margin-bottom: 35px;
}

/* ——— button with line ——— */
.rm-row {
  display:grid;
  grid-template-columns: 1fr auto;   
  align-items:center;                
  margin-top:auto;   
}

.rm-row::before{
  content:"";
  height:1px;
  background:var(--color-blue);              
  grid-column:1;                 
}

.read-more {
  display:inline-block;              
  text-decoration:none;
  grid-column:2;                   
}

.read-more span{
  border:1px solid var(--color-blue);  
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 16px;
  text-decoration: none;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.read-more.btn-blue span {
 background-color: var(--color-blue);
  color: var(--color-white);
}

.read-more:hover span{
  background-color: var(--color-white);
  color: var(--color-blue);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

}

/* main content  */
.content-right {
  padding-right: 60px;
}

/* company we keep section */
.company-we-keep {
  background: linear-gradient(180deg, #ffffff, #d5eaf1, #489dd9);
  padding-bottom: 150px;
  margin-top: 48px;
}

/* company we keep logo swiper */
.swiper.marquee-swiper {
  margin-top: 2.5rem;
}

.swiper-wrapper.marquee-swiper {
  transition-timing-function: linear;
  align-items: center;
}

.swiper-slide.marquee-swiper {
  width: 12rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 25px;
  box-sizing: border-box;
}

/* footer */
footer {
  background: url('../../assets/images/footer-pattern.jpg') no-repeat center top;
  background-size: cover;
  padding: 35px 0;
  font-weight: 300;
}

@media (min-width: 61.25em) {
  .m-icon-card--with-arrow {
    padding-right: 74px;
  }
}
  
@media (min-width: 61.25em) {
  .m-icon-card--with-arrow .m-icon-card__wrap {
    padding-left: 0;
    border-left: 0;
  }
}

@media (min-width: 61.25em) {
  .m-icon-card--with-arrow .m-icon-card__name {
    min-height: unset;
    font-size: 1.625rem;
    padding: 0;
  }
}
  
@media (min-width: 61.25em) {
  .m-icon-card__name {
    font-size: 1.875rem;
    line-height: 2rem;
    margin: 0 0 25px 0;
  }
}

@media (min-width: 61.25em) {
  .m-icon-card__arrow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 50%;
    right: 30px;
    min-width: 14px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: .1s ease-in;
    transition: .1s ease-in;
  }
}
  
@media (min-width:61.25em){
  .o-services{
    margin:48px 0
  }
}

@media (max-width: 767px) {
  .main-section-heading {
    margin-bottom: 10px;
  }

  .content-right {
    padding-right: 12px;
  }

  .company-we-keep {
    padding-bottom: 48px;
  }

  .fixed-cta{
    right:12px;
    bottom:12px;
    width:200px;
  }

  .side-panel {
    margin-top: 48px;
  }
}