/*
 Theme Name:   Shyinn Child Theme
 Theme URI:    http://themesvila.com/themes-wp/shyinn
 Description:  This is Shyinn Child Theme
 Author:       Masum Billah
 Author URI:   http://getmasum.net
 Template:     shyinn
 Version:      1.3
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:  two-columns, right-sidebar
 Text Domain:  shyinn-child
*/

@import '../shyinn/style.css';

body{
	
	overflow-x: hidden;
}


.service-row-title .col-md-4 {
    display: none;
}
.service-boxes-wrapper section.more_features.section_padding {
    padding-top: 0;
}
.service-boxes-wrapper .row .section-title {
    display: none;
}
.service-boxes-wrapper .row {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.service-boxes-wrapper .row .col-md-4 {
    width: 100% !important;
    float: none !important;
    clear: both;
}
.service-boxes-wrapper .row:before{
    
    display:none;
}
.navbar-header a.custom-logo-link img {
    width: auto;
    height: 90px;
    object-fit: cover;
}
.navbar.navbar-default.navbar-fixed-top.menu-top .container {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.navbar-collapse.collapse {
    margin-left: auto;
}
.navbar.navbar-default.navbar-fixed-top.menu-top .container:before,
.navbar.navbar-default.navbar-fixed-top.menu-top .container:after{
    display: none;
}

.features-parent .wpb_wrapper .single_about i {
    color: #3752dd !important;
}
.features-parent .single_about:hover i {
    background: #3e3e40 none repeat scroll 0 0 !important;
    border: 1px solid #3e3e40 !important;
    color: #fff !important;
}
.single_feature_btn_light {
    background: #385fde none repeat scroll 0 0 !important;
    color: #fff !important;
}    
.single_feature_btn_light:hover {
    background-color: #404042 !important;
}
.service-boxes-wrapper section.more_features .single_more_feature .single_icon span {
    color: #3f3f3f;
}
.service-boxes-wrapper section.more_features .single_more_feature:hover .single_text h3 {
    color: #3a66df;
}
ul#menu-new-main-menu li a:hover {
    color: #3657d8 !important;
}
.everything-need .single_feature i {
    color: #3f3f41 !important;
}
.everything-need .single_feature:hover i {
    background: #3653dd;
    color: #fff !important;
}
.single-pricing .pricing-title p {
    background: #3653dd;
}
.single-pricing .pricing_btn a {
    background: #3759de !important;
    border: 1px solid #3759de !important;
}
.single-pricing .pricing_btn a:hover{
    
    background: #3f3f3f !important;
    border: 1px solid #3f3f3f !important;
    color:#fff;
}
.footer_social.pull-right ul li a:hover {
    color: #3859de;
}
div#contact-form input.wpcf7-submit,
.signup_form button{
    background: #3a61e0 !important;
    color: #fff;
}
div#contact-form input.wpcf7-submit:hover,
.signup_form button:hover{
    background: #3e3e3e !important;
}
.download {
    background: #3962de none repeat scroll 0 0;
}
.pricing-wrappper .our_pricing .col-md-3.col-sm-3.col-xs-12 {
    width: 40%;
    margin: 0 auto;
    transform: translateX(30%);
}
.download-app .download {
    padding: 60px 0 0 !important;
}
.coming-soon-wrapper .download {
    padding: 0px 0 60px !important;
}
.download-app .download_icon h2 {
    margin-bottom: 10px;
}
.coming-soon-wrapper .download .download_icon h2 {
    font-size: 30px;
    font-weight: 400 !important;
    margin-bottom: 30px;
}
/*.coming-soon-wrapper .download .download_icon a {*/
/*    pointer-events: none;*/
/*}*/
.pricing-features {
    text-align: center;
}
.our_pricing > div .col-md-3:nth-of-type(2) .pricing_btn {
    display: none;
}
.pricing-price p > sup {
    font-size: 20px;
    display: inline-block;
    vertical-align: text-bottom;
}
.pricing-price p {
    font-size: 0;
}

.banner-section {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position:relative;
    padding: 280px 0;
}

.banner-title h1 {
    color: #fff;
    font-size: 48px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 64px;
    padding-top: 0px;
    text-transform: capitalize;
    max-width: 670px;
    margin: 0;
}
.banner-content {
    width: 800px;
    z-index: 1;
    position: relative;
}
.img-hand img {
    max-width: 390px;
}
.img-hand {
    position: absolute;
    right: 330px;
    bottom: 0;
}
.btn-banner a {
    background: transparent none repeat scroll 0 0;
    border: 2px solid #fff;
    border-radius: 50px;
    color: #fff;
    display: block;
    padding: 10px 30px;
    margin: 0;
    transition: all 0.3s ease 0s;
    font-size: 17px;
}
.buttons-banner {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 30px;
}
.btn-banner a img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);
    width: 25px;
    margin-right: 4px;
}
.btn-banner.btn-login {
    min-width: 165px;
    text-align: center;
}
.banner-section:before {
    background: rgba(0, 0, 0, 0.4);
    content: "";
    filter: alpha(opacity = 80);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.btn-banner a:hover img {
    filter: invert(0%) sepia(100%) saturate(7500%) hue-rotate(59deg) brightness(105%) contrast(111%);
}
.btn-banner a:hover {
    background-color: #fff;
    color: #000;
}
.vc_column_container>.vc_column-inner {
    padding-left: 0;
    padding-right: 0;
}
html {
    overflow: hidden;
}
.footer .col-md-6,
.footer .col-md-4 {
    visibility: visible !important;
}

.middle-foo-para p {
    color: white;
    text-align: center;
    font-size: 14px;
    padding-top: 10px;
}

section#pricing {
    display: none;
}



/* New pricing start*/
  :root {
    --purple: #6366f1;
    --purple-dark: #4f46e5;
    --purple-light: #ede9fe;
    --purple-text: #7c3aed;
    --bg: #f1f2f7;
    --white: #ffffff;
    --gray-100: #f1f2f7;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-700: #374151;
    --gray-900: #111827;
    --font: 'Plus Jakarta Sans', sans-serif;
  }

  /* ─────────────────────────────────────────
     Section wrapper
  ───────────────────────────────────────── */
  .pricing-section {
    max-width: 1100px;
    margin: 0 auto;
    padding: 72px 24px 80px;
  }

  /* ─────────────────────────────────────────
     Header
  ───────────────────────────────────────── */
  .section-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--purple);
    margin-bottom: 20px;
  }
  .section-eyebrow svg { width: 15px; height: 15px; flex-shrink: 0; }

  .section-title {
    font-size: clamp(28px, 4.5vw, 42px);
    font-weight: 800;
    text-align: center;
    color: var(--gray-900);
    line-height: 1.15;
    margin-bottom: 14px;
  }
  .section-title .highlight { color: var(--purple); }

  .section-subtitle {
    text-align: center;
    font-size: 15px;
    color: var(--gray-500);
    line-height: 1.7;
    max-width: 540px;
    margin: 0 auto 56px;
  }

  /* ─────────────────────────────────────────
     Pricing cards grid
  ───────────────────────────────────────── */
  .cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: start;
    margin-bottom: 48px;
  }

  .card {
    background: var(--white);
    border-radius: 18px;
    padding: 28px;
    border: 1.5px solid var(--gray-200);
    position: relative;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }
  .card:hover {
    box-shadow: 0 8px 32px rgba(0,0,0,0.08);
    transform: translateY(-2px);
  }

  .card-free    { border-left: 6px solid #94A3B8; }
  .card-support { border-left: 6px solid #195FA4; }
  .card-pro {
    border: 2px solid #534BB7;
    box-shadow: 0 4px 24px rgba(99,102,241,0.15);
  }
  .card-pro:hover { box-shadow: 0 12px 40px rgba(99,102,241,0.22); }

  .popular-badge {
    position: absolute;
    top: -14px;
    right: 24px;
    background: var(--purple);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 5px 14px;
    border-radius: 20px;
  }

  .card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 22px;
  }

  .card-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: var(--gray-100);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  
  span.unique-feature-name {
    color: var(--purple-text);
  }
  
  
  .card-icon svg { width: 20px; height: 20px; color: var(--gray-500); }
  .card-pro .card-icon { background: var(--purple-light); }
  .card-pro .card-icon svg { color: var(--purple); }
  .card-support .card-icon svg { color: var(--purple); }

  .card-badge {
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 20px;
  }
  .badge-free    { background: var(--gray-100); color: var(--gray-500); }
  .badge-support { background: var(--purple-light); color: var(--purple-text); }
  .badge-pro     { background: var(--purple-light); color: var(--purple-text); }

  .card-name {
    font-size: 22px;
    font-weight: 800;
    color: var(--gray-900);
    margin-bottom: 5px;
  }
  .card-tagline {
    font-size: 13px;
    color: var(--gray-400);
    margin-bottom: 22px;
  }
  .card-upto {
    font-size: 11px;
    color: var(--gray-400);
    font-weight: 500;
    margin-bottom: 2px;
  }
  .price-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
  }
  .price-amount {
    font-size: 38px;
    font-weight: 800;
    color: var(--gray-900);
    line-height: 1;
  }
  .price-period {
    font-size: 13px;
    color: var(--gray-400);
    font-weight: 500;
  }
  .price-per-school {
    font-size: 12px;
    color: var(--gray-400);
    margin-bottom: 22px;
  }
  .card-description {
    font-size: 15px;
    color: var(--gray-500);
    line-height: 1.65;
    margin-bottom: 28px;
    min-height: 52px;
  }

  /* ─────────────────────────────────────────
     CTA buttons
  ───────────────────────────────────────── */
  .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px 20px;
    border-radius: 10px;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
  }
  .btn:active { transform: scale(0.98); }

  .btn-ghost {
    background: var(--gray-100);
    color: var(--gray-700);
    border: 1.5px solid var(--gray-200);
  }
  .btn-ghost:hover { background: var(--gray-200); }

  .btn-primary { background: var(--purple); color: #fff; }
  .btn-primary:hover {
    background: var(--purple-dark);
    box-shadow: 0 4px 16px rgba(99,102,241,0.35);
  }

  .btn-pro {
    background: linear-gradient(135deg, var(--purple) 0%, #818cf8 100%);
    color: #fff;
  }
  .btn-pro:hover {
    box-shadow: 0 4px 20px rgba(99,102,241,0.4);
    background: linear-gradient(135deg, var(--purple-dark) 0%, var(--purple) 100%);
    color: #fff;
  }

  .btn-arrow { font-size: 16px; line-height: 1; }

  /* ─────────────────────────────────────────
     Comparison table
  ───────────────────────────────────────── */
  .table-wrapper {
    background: var(--white);
    border-radius: 16px;
    border: 1.5px solid var(--gray-200);
    overflow: hidden;
  }

  .table-hint {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    padding: 12px 24px;
    font-size: 12px;
    color: var(--gray-400);
    border-bottom: 1px solid var(--gray-100);
  }
  .table-hint svg { width: 14px; height: 14px; }

  table { width: 100%; border-collapse: collapse; }
  col.col-feature { width: 46%; }
  col.col-plan    { width: 18%; }

  thead tr { border-bottom: 1.5px solid var(--gray-200); }
  thead th {
    padding: 16px 20px;
    text-align: left;
    font-size: 13px;
    font-weight: 700;
    color: var(--gray-700);
  }
  thead th:not(:first-child) { text-align: center; color: var(--purple); }
  thead th:first-child { color: var(--gray-700); }

  /* Section header rows */
  .section-row td {
    padding: 14px 20px 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: var(--gray-400);
    background: var(--white);
    border-top: 1.5px solid var(--gray-200);
  }
  .section-row:first-child td { border-top: none; }

  /* Feature rows */
  tr.feature-row {
    border-bottom: 1px solid var(--gray-100);
    transition: background 0.15s ease;
    cursor: default;
  }
  tr.feature-row:last-child { border-bottom: none; }
  tr.feature-row:hover { background: #f5f3ff; }

  tbody td {
    padding: 13px 20px;
    font-size: 13.5px;
    color: var(--gray-700);
    vertical-align: middle;
  }
  tbody td:not(:first-child) { text-align: center; }

  .feature-name {
    display: flex;
    align-items: center;
    gap: 11px;
    font-weight: 500;
    color: var(--gray-700);
  }
  .feature-name svg {
    width: 15px;
    height: 15px;
    color: var(--gray-400);
    flex-shrink: 0;
  }

  /* Inline badge (Unlimited Value) */
  .inline-badge {
    display: inline-flex;
    align-items: center;
    background: var(--purple-light);
    color: var(--purple-text);
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
    margin-left: 8px;
    white-space: nowrap;
  }

  /* Check / dash / infinity icons */
  .icon-check, .icon-dash, .icon-infinity {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .icon-check svg   { width: 18px; height: 18px; }
  .icon-dash svg    { width: 20px; height: 6px; }
  .icon-infinity svg { width: 20px; height: 20px; }

  .check-free svg     { color: var(--gray-300); }
  .check-support svg  { color: var(--purple); }
  .check-pro svg      { color: var(--purple); }
  .dash svg           { color: var(--gray-300); }
  .infinity svg       { color: var(--purple); }

  /* Footer note */
  .footer-note {
    text-align: center;
    padding: 24px 20px;
    font-size: 13px;
    color: var(--gray-400);
    border-top: 1px solid var(--gray-100);
  }
  
  .table-wrapper {
    overflow: auto;
    max-width: 100%;
  }
  
  .table-wrapper table {
    width: 100%;
   }

  /* ─────────────────────────────────────────
     Responsive
  ───────────────────────────────────────── */
  @media (max-width: 768px) {
    .cards-grid { grid-template-columns: 1fr; }
    .popular-badge { right: 20px; }
    table { font-size: 12px; }
    thead th, tbody td { padding: 12px; }
  }

/* New pricing end*/



/*.navbar.navbar-default.navbar-fixed-top.menu-top nav#navigation ul li a {*/
/*    color: #000 !important;*/
/*}*/
/*.navbar.navbar-default.navbar-fixed-top.menu-top {*/
/*    background: #00000029;*/
/*}*/

/*----------------------------- Large Screens -------------------------------*/


@media only screen and (max-width :1920px) and (min-width: 1601px) {
    
}

@media only screen and (max-width :1600px) {
    

    .img-hand {
        right: 200px;
    }
    
    
}

@media only screen and (max-width :1440px) and (min-width: 1367px) {
    
}

@media only screen and (max-width :1366px)
{

    .img-hand {
        right: 100px;
    }


   
}

/*----------------------------- Small Laptop -------------------------------*/
@media only screen and (max-width :1280px) {
    
    .img-hand {
        right: 70px;
    }
    
    
}

/*----------------------------- Media 1024 -------------------------------*/
@media only screen and (max-width :1100px){
    
        .img-hand {
        right: 0px;
    }
    .banner-title h1 {
        font-size: 45px;
        line-height: 60px;
    }
    
    
}

/*----------------------------- Media 768 -------------------------------*/
@media only screen and (max-width:999px){
    
    .footer > .container > .row {
        text-align: center;
    }
    .footer .footer_social {
        float: none !important;
    }

}

/*----------------------------- Media Tab -------------------------------*/
@media only screen and (max-width:767px){
    
    html {
        overflow: hidden;
    }
    .navbar-default {
        padding: 20px 10px;
    }
    .navbar.navbar-default.navbar-fixed-top.menu-top .container {
        display: unset;
    }
    .service-row-title section.more_features.section_padding .section-title {
        visibility: visible !important;
    }
    .section-title.text-center {
        visibility: visible !important;
    }
    .footer .row .col-md-6,
    .footer .row .col-md-4 {
        visibility: visible !important;
    }
     .img-hand {
        left: 0;
    }
    .img-hand img {
        max-width: 200px;
        margin: 0 auto;
        display: block;
    }
    .navbar-default .navbar-toggle .icon-bar {
        background-color: #3859de !important;
    }
    .banner-section {
        background-position: center right;
        position: relative;
        padding: 200px 0;
    }
    .banner-content {
        padding-top: 50px;
    }
    .banner-title h1 {
        font-size: 45px;
        line-height: 56px;
    }
}




/*----------------------------- Media Mobile Screen -------------------------------*/
@media only screen and (max-width:576px){
    
    .banner-title h1 {
        font-size: 40px;
        line-height: 58px;
        max-width: 600px;
    }
    .btn-banner a {
        margin: 0;
    }
    .img-hand {
        left: 0;
    }
    .img-hand img {
        max-width: 200px;
        margin: 0 auto;
        display: block;
    }
    .banner-content {
        width: 100%;
    }
    .buttons-banner {
        flex-wrap: wrap;
        gap: 15px;
    }
    .banner-title h1 {
        font-size: 36px;
        line-height: 48px;
        max-width: 100%;
    }
    .btn-banner a {
        padding: 10px 20px;
        margin:0;
        font-size:15px;
    }
    .btn-banner a img {
        width: 22px;
    }
    .banner-section {
        padding: 140px 0;
    }
    .banner-section {
        background-image: url(https://www.studyified.com/wp-content/uploads/2025/06/Studyified-Homepage-Banner-mobile.webp) !important;
    }
    .btn-banner.btn-login {
        min-width: 134px;
        text-align: center;
    }
}    
/*----------------------------- Media Mobile Screen -------------------------------*/
@media only screen and (max-width:479px){
    
        .navbar-default {
            padding: 20px 30px;
        }
        .navbar-header a.custom-logo-link img {
            height: 70px;
            display: block;
        }
        .pricing-wrappper .our_pricing .col-md-3.col-sm-3.col-xs-12 {
            width: 100%;
            margin: 0 auto;
            transform: unset;
        }
        .banner-title h1 {
            font-size: 35px;
            line-height: 48px;
            max-width: 500px;
        }
        .buttons-banner {
            gap: 15px;
            flex-wrap: wrap;
        }
        .btn-banner a {
            padding: 10px 20px;
            font-size: 15px;
            margin: 0;
        }
        .btn-banner a img {
            width: 20px;
        }
        .banner-content {
            padding-top: 40px;
            width: 100%;
        }
        .img-hand img {
            max-width: 180px;
            margin: 0 auto;
            display: block;
        }
        .btn-banner.btn-login {
            min-width: 134px;
        }
        .banner-content {
            padding-top: 150px;
        }
        .banner-section {
            padding: 100px 0;
            background-position: center right -110px;
        }
        
}

/*----------------------------- Media Small Screen -------------------------------*/
@media only screen and (max-width:360px){
    
    
    .service-boxes-wrapper .row {
        grid-template-columns: 1fr;
    }
    
    .banner-title h1 {
        font-size: 32px;
        line-height: 45px;
        max-width: 500px;
        margin: 0;
    }
    .buttons-banner {
        justify-content: center;
    }
    
    
}
/*----------------------------- Media Small Screen -------------------------------*/
@media only screen and (max-width:320px){
    
}