/*
Theme Name: Headless Theme
Author: Wordpress
Description: Headless WordPress theme for GraphQL API only
Version: 1.0
*/

body {
  font-family: Arial, sans-serif;
  line-height: 1.8;
}

.content-wrapper {
  max-width: 1100px;
  margin: 40px auto;
  padding: 20px;
  background: #ffffff;
  border: 2px solid ;
}

.post-title {
  text-align: center;
}


.fovero-cta{
          padding-top: 40px!important;
          padding-bottom: 60px!important;
         
      }
 .fovero-cta-gradient{
     padding-top: 40px!important;
          padding-bottom: 60px!important;
          
 }     
 .fovero-cta-gradient-button-text{
    padding-top: 40px!important;
          padding-bottom: 60px!important;
         
 }
      .wp-block-list{
        padding-left: 22px;
        li{
          list-style-type: none;
          position: relative;
          margin-bottom: 10px;
          &:before{
            content: '';
            position: absolute;
            left: -22px;
            top: 5px;
            background-image: url('./assets/image/arrow-right.svg');
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            width: 12px;
            height: 14px;
          }
        }
      }
      .cta-pros-cons-main-class{
        display: grid;
        gap: 22px;
        grid-template-columns: 1fr 1fr;
        
        
        > div{
          &:first-child{
            background: linear-gradient(308.83deg, #C8E6C9 -4.74%, #EFFFD2 93.55%);
          }
          &:last-child{
            background: linear-gradient(313.05deg, #FAC9C9 18.42%, #FFE2D3 98.45%);
          }
          padding: 16px;
          border-radius: 10px;
        }
        .cta-pros-class{        
          text-align: left;
          margin-block: 0 ;
          margin-block: 0 !important;            
          ul{
            li{
              &:before{
                background-image: url('./assets/image/green-check.svg');
                top: 2px;
              }
            }
          }    
        }
        .cta-cons-class{          
          text-align: left;
          margin-block: 0 !important;              
          ul{
            li{
              &:before{
                background-image: url('./assets/image/red-close.svg');
                width: 10px;
                height: 10px;
                top: 4px;
              }
            }
          }      
        }
        .wp-block-heading{
          font-size: 20px;
          font-weight: 600;
          line-height: 1;
          margin-bottom: 11px;
          
        }
        .wp-block-list{
          margin-bottom: 0;
          li{
            line-height: 1.3;
            font-size: 15px;
            &:last-child{
              margin-bottom: 0 !important;
            }
            
          }
        }
      }
      .cta-pattern-main-class{
        background: #985EFF;
        padding: 22px 24px;
        border-radius: 24px;
        > div{
          display: flex;
          align-items: center;
          
        }
        figure{
          margin-bottom: 0;
          
        }
        h2{
          font-size: 32px;
          
        }
        .has-white-background-color{
          background: #fff;
          border-radius: 8px;
          display: block;
        }
        .wp-block-buttons{
          margin-top: 24px !important;
        }
      }
      .cta-pattern-main-class-background{
        background-image: url('./assets/image/cta-bg.jpeg');
        /* background-image: <?php echo get_template_directory_uri(); ?>/assets/image/cta-bg.jpeg; */
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 24px;
        padding: 70px 110px;
        
        .has-white-background-color{
          background: #fff;
          border-radius: 8px;
        }
        h2{
          font-size: 32px;
          
        }
      }
      .cta-pattern-main-class-light-background{
        background-image: url('./assets/image/cta-bg-light.jpeg');
        /* background-image: <?php echo get_template_directory_uri(); ?>/assets/image/cta-bg.jpeg; */
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 24px;
        padding: 70px 110px;
       
        .has-white-background-color{
          background: #fff;
          border-radius: 8px;
        }
        h2{
          font-size: 32px;
          
        }
      }

      .also-read-box{
        background: #DBB2FF;
        padding: 20px 25px;
        border-radius: 10px;
        position: relative;
        &:before{
          content: '';
          position: absolute;
          left: 0;
          top: 0;
          bottom: 0;
          border-radius: 10px 0 0 10px;
          width: 10px;
          background: #673BB7;
        }
        p{
          margin-bottom: 0;
          font-size: 15px;
          text-align: left;
          
          strong{
            font-size: 16px;
            
          }
        }
      }
.wp-block-table tr:first-child th {
          background-color: #673BB7;
          color: #fff;
          text-align: center;
          text-transform: capitalize;
        }
    .wp-block-button__link{
          text-decoration: none;
          color: rgb(152, 94, 255);
          text-transform: capitalize;
          font-weight: 600;
        } 

    .timeline-row {
      position: relative;
      margin: 60px 0;
      display: flex;
      flex-direction: column;
      align-items: center;
    }


    .timeline-card {
      position: relative;
      border: 2px solid #985EFF;
      border-radius: 15px;
      padding: 50px 30px 30px; /* extra top padding so text clears the icon */
      background: #fff;
      width: 100%;
      text-align: center;
    }


    /* Icon sits above the card, centered */
    .timeline-icon-img {
      position: relative;
      z-index: 10;
      margin: 0 0 -60px 0 !important; /* negative bottom margin pulls card up behind icon */
      width: 90px;
      height: 90px;
      display: flex;
      justify-content: center;
    }

    .timeline-icon-img img {
      width: 100%;
      height: 100%;
      display: block;
      border-radius: 50%;
      border: 2px solid #985EFF; /* inner circle */
      background: #fff;        /* white bg so it covers the border line */
      padding: 8px;            /* small gap between icon edge and border */
      box-sizing: border-box;

    }

      .wp-block-quote {
          position: relative;
          border: 6px solid #985EFF;
          border-radius: 20px;
          padding: 40px;
          background: #fff;
          margin-top:40px;
          margin-bottom: 40px;  
          overflow: visible; 
      }

      /* top-left quote */
      .wp-block-quote::before {
        content: "";
        position: absolute;
        top: -28px;   
        left: 40px;   
        width: 100px;  
        height: 65px;
        background: url('./assets/image/quote-1.svg') no-repeat center,#fff;
        background-size: 70px;
        z-index: 1;
      }

      /* bottom-right quote */
      .wp-block-quote::after {
        content: "";
        position: absolute;
        bottom: -28px;
        right: 40px;
        width: 100px;
        height: 60px;
        background: url('./assets/image/quote-2.svg') no-repeat center,#fff;
        background-size: 70px;
        z-index: 1;
      }