/**
 * Theme Name:  Citizenship of Slovakia Child
 * Template:    base
 * Description: Custom WordPress Theme by Designery
 * Author:      The Designery
 * Author URI:  https://designery.io/
 * Version:     1.0
 * Text Domain: citizenshipofslovakia
 */

/* ___________________________________________________________________________  
    
    This CSS is loaded on top of parent's (Base) style.css
    - header
    - menus
    - archives
    - pagination
    - footer
    - overlays
 ______________________________________________________________________________ */

/* ___________________________________________________________________________  
 	
 	1. LAYOUT
______________________________________________________________________________ */

/**
 * Layout
 * --------------------------------------------------------------------------- */
 
 body {
    --header-height: 5.625rem;
    background-image: var(--wp--preset--gradient--light-blue);
  }
  
  @media screen and (max-width: 1440px) {
    .wrapper {
      padding: 0 var(--wp--preset--spacing--32);
    }
  }
  @media screen and (max-width: 1080px) {
    body {
    }
    .wrapper {
      padding: 0 var(--wp--preset--spacing--40);
    }
  }
  @media screen and (max-width: 781px) {
    body {
      --header-height: 5rem;
    }
    .wrapper {
      padding: 0 var(--wp--preset--spacing--24);
    }
  }
  @media screen and (max-width: 600px) {
    .wrapper {
      padding: 0 var(--wp--preset--spacing--16);
    }
  }
  
  /* Disabled GSAP - show all elements on load */
  body.gsap-disabled:not(.gsap-ready):not(.no-script) .wp-block-group, 
  body.gsap-disabled:not(.gsap-ready):not(.no-script) .wp-block-cover, 
  body.gsap-disabled:not(.gsap-ready):not(.no-script) .wp-block-column {
      opacity: 1;
  }
  
  /* ___________________________________________________________________________  
       
       2. HEADER
  ______________________________________________________________________________ */
  
  /**
   * Header
   * --------------------------------------------------------------------------- */
  
  #header {
  }
  #header.scrolled {                        /* header shows while scrolling up */
    --header-height: 5rem;
    @media screen and (max-width: 600px) { 
      top: 0;
    }
  }
  .header-logo {
    @media screen and (max-width: 600px) {
      max-width: 15.5rem;
      overflow: hidden;
    }
  }
  
  /* ___________________________________________________________________________  
       
       3. CONTENT
  ______________________________________________________________________________ */
  
  /**
   * Content
   * --------------------------------------------------------------------------- */
  /* === Hero === */
  .wp-block-cover.hero {
    @media screen and (max-width: 1080px) {
      padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--64) !important;
    }
    @media screen and (max-width: 781px) {
      padding: var(--wp--preset--spacing--64) var(--wp--preset--spacing--16) !important;
    }
  }
  @media screen and (max-width: 781px) {
    .wp-block-cover.hero, .wp-block-group.reviews{
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      width: 100vw;
      max-width: 100vw;
      border-radius: 0 !important;
    }
  }
  /* === Who can apply === */
  @media screen and (max-width: 1080px) {
    .wp-block-group.who-can-apply img{
      width: 180px !important;
      height: 180px !important;
    }
  }
  @media screen and (max-width: 781px) {
    .wp-block-group.who-can-apply {
      max-width: 456px;
      margin: 0 auto;
    }
    .wp-block-group.who-can-apply .wp-block-columns{
      gap: var(--wp--preset--spacing--40) !important;
    }
    .wp-block-group.who-can-apply .wp-block-column .is-vertical{
      margin-block-start: var(--wp--preset--spacing--20) !important;
      gap: 0.5rem;
    }
  }
  /* === What Do You Gain === */
  .wp-block-group.less-width{
    @media screen and (max-width: 1080px) {
      margin: 0 auto;
      max-width: 702px;
    }
    @media screen and (max-width: 781px){
      max-width: 480px;
    }
  }
  .wp-block-group .cards.what-do-you-gain .wp-block-column{
    @media screen and (max-width: 1080px) {
        padding: var(--wp--preset--spacing--48) var(--wp--preset--spacing--64) !important;
    }
    @media screen and (max-width: 781px) {
      padding: 2.5rem !important;
    }
    @media screen and (max-width: 600px) {
      padding: 2rem !important;
    }
    @media screen and (max-width: 360px) {
      padding: 2.5rem 2rem !important;
    }
  }
  /* === What documents do we need === */
  .wp-block-group .wp-block-columns.has-heading-with-icon .wp-block-group.is-vertical, .wp-block-group.cards.price .wp-block-group.is-vertical {
    width: fit-content;
  }
  .wp-block-group .wp-block-columns.has-heading-with-icon{
    @media screen and (max-width: 1080px) {
      display: flex;
      flex-direction: column;
    }
  }
  .wp-block-group.blue-cards{
    @media screen and (max-width: 1080px) {
      padding: var(--wp--preset--spacing--64) !important;
    }
    @media screen and (max-width: 781px) {
      padding: var(--wp--preset--spacing--48) var(--wp--preset--spacing--64) !important;
    }
    @media screen and (max-width: 600px) {
      padding: var(--wp--preset--spacing--48) var(--wp--preset--spacing--56) !important;
    }
  }
  /* === Price and Whats Included === */
  .wp-block-group.cards.price > *{
    max-width: 610px;
  }
  @media screen and (max-width: 781px) {
    .wp-block-group .wp-block-columns.has-heading-with-icon .wp-block-group img, .wp-block-group.cards.price .wp-block-group.is-vertical img{
      width: 24px !important;
      height: 24px !important;
    }
    .wp-block-group.price .wp-block-group.is-vertical .is-nowrap{
      align-items: flex-start;
    }
  }
  /* ====== 404 ====== */
  .wp-block-group.is-404 {
        padding: var(--wp--preset--spacing--80) 0;
  }
  /* === Privacy Policy === */
  .privacy-group{
    @media screen and (max-width: 1080px) {
      padding-top: var(--wp--preset--spacing--64) !important;
      padding-bottom: 4.5rem !important;
    }
    @media screen and (max-width: 781px) {
      padding-top: var(--wp--preset--spacing--48) !important;
      padding-bottom: var(--wp--preset--spacing--56) !important;
    }
  }
  .privacy-heading{
    @media screen and (max-width: 781px) {
      padding-bottom: var(--wp--preset--spacing--40) !important;
    }
  }
  .privacy-group .wp-block-group .is-vertical{
    @media screen and (max-width: 1080px) {
      gap: 0.5rem !important;
      margin-block-start: var(--wp--preset--spacing--12);
    }
  }

  /* ___________________________________________________________________________  
       
       4. FOOTER
  ______________________________________________________________________________ */

  /* ====== Back to top ====== */
  #back-to-top-button {
    right: calc((100vw - var(--wp--style--global--content-size))/2);
  }
  #back-to-top-button a {
    background: rgba(255, 255, 255, 0.40);
    backdrop-filter: blur(3px);
    border: 3px solid var(--wp--preset--color--primary);
    color: var(--wp--preset--color--primary);
    margin-top: 5rem;
  }
  #back-to-top-button a span {
    font-size: var(--wp--preset--font-size--normal);
  }
  #back-to-top-button a i {
    font-size: 2.75rem;
    margin: 0 -1.1rem;
    position: relative;
  }
  #back-to-top-button a:hover {
    width: 11rem;
    gap: 0.5rem;
  }
  @media (max-width: 781px) {
    #back-to-top-button a:hover {
    width: unset;
    gap: unset;
    }
    #back-to-top-button a {
    margin-top: 3rem;
    }
  }
  
  /* ====== Footer ====== */
  #footer{
    background-color: var(--wp--preset--color--light-blue);
    color: var(--wp--preset--color--black);
  }
  #footer .footer-columns {
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: auto auto auto;
    row-gap: var(--wp--custom--gap);
    justify-content: space-between;
    padding: 0;
  }
  #footer .footer-logo-and-details{
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--20);
  }
  #footer .copyright {
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--wp--preset--spacing--24);
    padding-top: var(--wp--preset--spacing--64);
  }
  #footer .copyright .left,
  #footer .copyright .right {
    display: contents;
  }
  #footer .menu li a{
    display: inline;
  }
  #footer .footer-menus {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--12);
  }
  #footer .footer-menus ul li a{
    display: flex;
    gap: var(--wp--preset--spacing--12);
    align-items: center;
    line-height: 130%;
  }
  #footer .footer-menus ul li a img{
    align-self: first baseline;
  }
  #footer .footer-menus h5{
    padding-top: var(--wp--preset--spacing--12);
  }
  #footer .footer-menus .is-style-no-bullets li{
    margin-bottom: var(--wp--preset--spacing--12);
  }
  @media (max-width: 1080px) {
    #footer .menu-first{
      flex-direction: column;
      gap: var(--wp--preset--spacing--24);
      align-items: flex-start;
    }
    #footer .copyright .right p {
      padding-bottom: var(--wp--preset--spacing--12);
    }
    #footer .copyright {
      grid-template-columns: auto auto;
    }
    #footer .copyright .left,
    #footer .copyright .right {
      flex-direction: column;
      align-items: flex-start;
      gap: var(--wp--preset--spacing--12);
    }
    #footer .copyright .right {
      display: flex;
      flex-direction: column-reverse;
      padding-right: 5.5rem;
    }
    #footer .copyright{
          padding: var(--wp--preset--spacing--32) 0 0;
    }
    #footer .footer-columns {
      grid-template-columns: auto auto;
      padding-right: 8rem;
    }
    #footer .footer-logo-and-details img {
      max-width: 19.5rem;
      overflow: hidden;
    }
  }

 @media (max-width: 900px) {
    #footer .footer-columns{
      grid-template-columns: auto;
      gap: var(--wp--preset--spacing--40);
    }
    #footer .copyright {
      flex-direction: row;
      padding: var(--wp--preset--spacing--40) 0 0;
    }
  }
  @media (max-width: 781px) {
    #footer .footer-columns{
      grid-template-columns: auto auto;
    }
     #footer .copyright .right {
      padding-right: 4.5rem;
    }
  }

  @media (max-width: 720px) {
    #footer .footer-columns{
      display: flex;
      flex-direction: column;
    }
     #footer .copyright .right {
      padding-right: unset;
    }
  }
  @media (max-width: 600px) {
    #footer .footer-columns{
      padding-right: unset;
    }
    #footer .copyright {
      display: flex;
      gap: var(--wp--preset--spacing--40);
      align-items: flex-start;
    }
    #footer .copyright .right {
      align-items: flex-start;
      text-align: left;
    }
    #footer .copyright .left,
    #footer .copyright .right {
      gap: var(--wp--preset--spacing--12);
    }
    #footer .copyright ul {
      padding-bottom: unset;
    }
    #footer .left{
      padding-bottom: var(--wp--preset--spacing--40);
    }
     #footer .footer-logo-and-details img {
      max-width: 15.5rem;
      overflow: hidden;
    }
  }

  #footer{
    @media (max-width: 1080px) {
      padding: 4.5rem  0 var(--wp--preset--spacing--64) 0;
    }
    @media (max-width: 781px) {
      padding: 7.5rem  0 var(--wp--preset--spacing--48) 0;
    }
  }

  /* ___________________________________________________________________________  
     
     5. OVERLAYS
  ______________________________________________________________________________ */

  /* ====== Google Reviews ====== */
  .ti-widget.ti-goog .ti-review-item{
    padding: 0 1.25em !important;
  }
  .ti-widget.ti-goog .ti-widget-container .ti-review-item >.ti-inner{
    border-radius: 16px !important;
    padding: 24px !important;
    min-height: 428px;
    display: flex;
    flex-direction: column;
  }
  .ti-widget .source-Google .ti-review-header::after{
    background-image: none !important;
  }
  .ti-widget.ti-goog .ti-review-header{
    justify-content: center;
  }
  .ti-profile-details .ti-date {
    display: none !important;
  }
  .ti-profile-details p {
    display: none !important;
  }
  .ti-widget.ti-goog .ti-stars{
    display: flex !important;
    flex-direction: row !important;
    gap: 12px !important;
    margin-top: 12px !important;
  }
  .ti-widget.ti-goog .ti-review-item .ti-stars{
    height: 24px !important;
  }
  .ti-widget.ti-goog .ti-star{
    width: 26px !important;
    height: 24px !important;
  }
  .ti-widget.ti-goog .ti-widget-container .ti-name{
    font-size: 1.5em !important;
    font-weight: 600 !important;
  }
  .ti-widget.ti-goog .ti-inner .ti-read-more span{
    font-size: 18px;
    font-weight: 600;
    color: var(--wp--preset--color--black);
    opacity: 1;
  }
  .ti-widget.ti-goog .ti-inner .ti-read-more span:hover{
    text-decoration: none !important;
    color: var(--wp--preset--color--green);
  }
  .ti-widget.ti-goog .ti-inner .ti-review-content{
    font-size: 1.5em !important;
    line-height: 132% !important;
    margin-top: 2em;
    -webkit-line-clamp: 6 !important;
    height: auto !important;
    min-height: auto !important;
  }
  .ti-widget.ti-goog .ti-review-item p{
    margin: 0;
  }
  .ti-read-more-active{
    margin-top: 2em;
  }
  .ti-widget.ti-goog .ti-controls .ti-next::before, .ti-widget.ti-goog .ti-controls .ti-prev::before
  {
    background: var(--wp--preset--color--white) !important;
  }
  .ti-widget.ti-goog .ti-controls .ti-next::after, .ti-widget.ti-goog .ti-controls .ti-prev::after
  {
    background: var(--wp--preset--color--white) !important;
  }
  .ti-read-more-active{
    margin-top: 0;
  }
  /* .ti-widget.ti-goog .ti-inner .ti-read-more span::after {
    content: "";
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='32' fill='none'%3E%3Cpath fill='%2300BF6F' d='M7.93 14.6h13.71l-3.3-3.23c-.28-.28-.41-.6-.41-.97 0-.69.58-1.4 1.43-1.4.38 0 .7.14.98.4l5.69 5.58c.23.23.47.51.47 1.02s-.2.76-.46 1.01l-5.7 5.58c-.27.27-.6.41-.98.41-.85 0-1.43-.71-1.43-1.4 0-.36.13-.69.41-.97l3.3-3.23H7.93c-.79 0-1.43-.63-1.43-1.4 0-.77.64-1.4 1.43-1.4Z'/%3E%3C/svg%3E");
    width: 30px;
    height: 30px;
    position: relative;
    display: inline-block;
    padding-bottom: 8px;
    top: 8px;
    left: 4px;
  } */
  .ti-widget.ti-goog .ti-read-more{
    padding: 0;
  }
  .ti-review-item .source-Google p{
    margin-top: auto;
  }
  .ti-read-more{
    margin-top: 4em;
  }