/* 
  Theme Name: I.Terpo Theme
  Text Domain: I.Terpo Theme
  Version: 9.2;
  Description: Standard Theme - Prework
  Tags: Responsive, Dynamic
  Author: I.Terpo
*/

:root{
  /* Navbar colors [EDIT]*/
  --primary-color: #FFA9F9;
  --primary-color-darker: #ed049c;
  --primary-color-light:rgba(255, 169, 249, 0.33);
  --secondary-color: #FFF7AD;
  --accent-color: #158480;

  --linear-color-main:linear-gradient(100deg,rgba(255, 247, 173, 1) 0%, rgba(255, 169, 249, 1) 100%);


  --header-nav-color: #5e17eb;
  --header-nav-bg: linear-gradient(146deg,rgba(255, 247, 173, 1) 5%, rgba(255, 169, 249, 1) 80%);
}




body {
    background-color: #fff;
	  font-family: 'Cera Pro', sans-serif;
    font-weight: normal; 
}

em, i {
    font-family: 'Cera Pro', sans-serif;
    font-style: italic;  
}

.light-text {
    font-family: 'Cera Pro', sans-serif;
    font-weight: 300;  /* This will load the light version */
}


/* General site styling*/
h1,h2,h3,h4,h5,h6{
  font-family: 'Arimo', sans-serif;
  font-weight: bold;
}


h1, h2{
  color: var(--primary-color-darker);
}




/* Custom Font */

/* Regular */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Regular Italic */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
}

/* Light */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

/* Light Italic */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
}

/* Medium */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

/* Medium Italic */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
}

/* Bold */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

/* Bold Italic */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-BoldItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic;
}

/* Black */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}

/* Black Italic */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
}

/* Thin */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}

/* Thin Italic */
@font-face {
  font-family: 'Arimo';
  src: url('fonts/Arimo-ThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
}

/* ----------------------------- Header ------------------------------------------- */

header{
  background: var(--header-nav-bg);
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 2%;
}

.page-title{
  color: #ed049c;
  font-weight: bold;
}


#menu-wrapper {
    display: flex;
    align-items: center;
    justify-content: end;
    
    padding-left: 2%;
    padding-right: 2%;
}

#logo-primary {
  width: 200px;
  height: auto;

  /* animation */
  transition: transform 0.3s ease-in-out;
  animation: logo-slide-in 0.8s cubic-bezier(0.23, 1, 0.32, 1) 1;
}

@keyframes logo-slide-in {
  from {
    opacity: 0;
    transform: translateX(-150px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

#logo-primary:hover {
  transform: scale(1.05);
}

.digital-text ul {
  list-style-type: disc !important;
  padding-left: 20px; 
}

.wp-block-list{
  list-style-type: disc !important;
  padding-left: 40px; 
}

/* ----------------------------- Main Menu ------------------------------------------- */

  /* Colors for main menus (top level) */
  .navbar a{
    color: var(--header-nav-color) !important;
    text-decoration: none !important;
    font-weight: bold;
  }

  .navbar {
      padding: 1rem 0;
  }
  
  .navbar-nav {
    gap: 2rem;
  }
  
  .menu-item a{
    color: black;
  }
  
  .dropdown-item {
    color: black !important;
    padding: 0.5rem 1rem;
  }
  
  .dropdown-item:hover {
    background: transparent;
    color: rgb(54, 54, 54) !important;
  }

  .navbar-nav {
    gap: 2rem;
  }
  
  .dropdown-menu {
    display: none;
    background: white;
    border: 1px solid #c7c8c9;
    margin-top: 0;
  }

  .dropdown-menu .menu-item {
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
    margin-bottom: 5px;
  }

  .dropdown-menu .menu-item:last-child {
      border-bottom: none;
  }
  
  /* Show dropdown on hover (desktop only) */
  @media (min-width: 992px) {
    .dropdown:hover > .dropdown-menu {
      display: block;
    }
  
    /* Optional: Add animation */
    .dropdown-menu {
      transition: opacity 0.3s, visibility 0.3s;
    }
  }
  
  /* Mobile menu adjustments */
  @media (max-width: 991.98px) {
    .dropdown-menu {
      position: static !important;
      background: rgba(255, 255, 255, 0.1);
      border: none;
    }
  }
  
  /* Ensure dropdown items are visible */
  .dropdown-item {
    color: black !important;
    padding: 0.5rem 1rem;
  }
  
  .dropdown-item:hover {
    color: #000a59 !important;
    background: transparent;
  }
  
  /* Mobile menu adjustments */
  @media (max-width: 991.98px) {
    .navbar-collapse {
      padding: 1rem;
    }
  }

  /* Menu drop down icon - (without - default is bootstrap)*/
  /* .dropdown-toggle::after {
    content: "+";  
    border-top: none;
    vertical-align: 0;
  } */



/* ----------------------------- Main Menu ------------------------------------------- */


/* -----------------------------
   Scroll Bar 
  -----------------------------*/

body::-webkit-scrollbar {
    width: .2em;
    background-color: var( --primary-color-light);
}

body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

body::-webkit-scrollbar-thumb {
    background-color: var(--primary-color);
    border-radius: 50px;
}









/* EDIT LATER TODO */
/* styled buttons */

.custom-btn-1 a{
  text-decoration: none !important;
  border: 3px solid #fdb813 !important;
  border-radius: 20px !important;
  color: #336667 !important;
  font-weight: bold;
  padding: 5px 15px 5px 15px;
  background-color: transparent!important;
}

.custom-btn-2 a{
	min-width: 200px;
	font-size: 20px !important;
  text-decoration: none !important;
  border: 3px solid #ceac70 !important;
  color: #64afa7 !important;
  font-weight: bold;
  padding: 5px 15px 5px 15px;
  background-color: transparent!important;
}









/* Custom css - Project Page Specific */

.about-fr-text{
  text-align: justify!important;
}

.button-wrapper{
  text-align: right!important;
}

.fr-sepator{
  border-top: 7px solid #004aad;
  opacity: 1;
  width: 100%;
  border-radius: 4px;
  margin: 20px 0;
}

/* global used */

.c-btn-1, .wp-block-button__link, #nf-field-8{
  border: #ed049c 3px solid;
  text-decoration: none;
  padding: 5px 10px;
  color: #5e17eb;
  background: white;

  transition: all 0.5s ease-in-out;
  border-radius: 0px;
  /* Set initial transform for animation to work */
  animation: slide-right-in .3s cubic-bezier(0.23, 1, 0.32, 1) forwards;
  animation-fill-mode: forwards;
}

.c-btn-1:hover{
  border-radius: 10px;
  background-color: #ed049c;
  color: #fff;
  position: relative;
}

.news-boxes h4{
  text-align: center!important;
  color:rgb(70, 70, 70)
}

.news-boxes .uagb-post__inner-wrap{
  background: var(--linear-color-main);
  padding-bottom : 0px !important;
}

.partner-section{
  background:rgba(0, 75, 173, 0.2);
  padding: 50px;
}

.partner-section .partners-header{
  text-align: center;
}

.companies-section{
  background: #fff!important;
  padding: 50px!important;
  place-items: center;
  align-items: center!important;
}



/* Responsive fix: Ensure images are not too small on small screens */
@media (max-width: 600px) {
  .companies-section img {
    min-width: 80px !important;
    width: 80px !important;
    max-width: 100%;
  }

  .companies-section{
    flex-wrap: wrap;
  }
}




/* Mailchimp form */

.wp-block-column > .newsletter-section {
  padding-left: 50px!important;
  padding-right: 50px!important;
}

.wp-block-column.newsletter-section {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-top: 50px;
  padding: 20px 50px; /* shorthand top/bottom + left/right */
  background: #ed049c5c;
}


.newsletter-section-form .form-group{
  display: flex!important;
  flex-wrap: wrap!important;
}

.form-container {
    display: flex;
    justify-content: center; /* horizontal centering */
    align-items: center;    /* vertical centering */
    min-height: 100vh;      /* take full viewport height */
}

/* Style the form layout */
.signup-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center; /* center label text */
}

/* Arrange input and button side by side */
.form-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Style the email input */
.form-group input[type="email"] {
    padding: 10px 20px;
    border-radius: 50px; /* pill shape */
    border: 1px solid #ccc;
    outline: none;
    flex: 1;
}

/* Style the submit button */
.form-group input[type="submit"] {
    padding: 10px 20px;
    border-radius: 50px; /* pill shape */
    border: 1px solid #ccc;
    background-color: white;
    cursor: pointer;
    transition: background-color 0.3s;
}

/* Button hover effect */
.form-group input[type="submit"]:hover {
    background-color: #f0f0f0;
}