/*
 Theme Name:   Haalo
 Description:  Child Theme based on Ultra Theme
 Author:       OFF unit
 Author URI:   https://offunit.com
 Template:     themify-ultra
 Version:      1.0.0
*/



/* Variables */
:root { --white: #fff; --black: #353535; --teal: #2f6b71; --green: #5fb0b9; --beige: #be996e; --cream: #feefde; --mint: #b5d8d2; }

/* Fonts 
.tk-avenir-next-lt-pro-condensed { font-family: "avenir-next-lt-pro-condensed",sans-serif; }
.tk-avenir-next-lt-pro { font-family: "avenir-next-lt-pro",sans-serif; }
*/


/* Reset */
body { font-family: "avenir-next-lt-pro", sans-serif; color: var(--black); /*background: url("/wp-content/uploads/2026/06/home-body-background-scaled.png"); background-size: cover; */ 
	/*background:
    radial-gradient(
      circle at 55% 0%,
      rgba(44, 107, 114, 0.95) 0%,
      rgba(79, 150, 163, 0.75) 18%,
      rgba(126, 184, 192, 0.35) 35%,
      transparent 55%
    ),
    linear-gradient(
      135deg,
      #75b8c0 0%,
      #c9d8d4 25%,
      #e8ddd1 40%,
      #f5e8d9 55%,
      #feefde 100%
    ); 	
	
	background:
    radial-gradient(
      circle at 10% 10%,
      rgba(44, 107, 114, 0.85) 0%,
      rgba(95, 170, 183, 0.45) 25%,
      rgba(159, 200, 202, 0.2) 40%,
      transparent 55%
    ),
    linear-gradient(
      135deg,
      #67aeb8 0%,
      #b6d0cf 25%,
      #e2ddd4 40%,
      #f4e8d9 55%,
      #feefde 100%
    );*/
	
	background:
    radial-gradient(
      ellipse at top left,
      #2c6b72 0%,
      #347b85 20%,
      #4d9aa7 35%,
      #7bbbc2 50%,
      rgba(123, 187, 194, 0) 70%
    ),
    linear-gradient(
      135deg,
      #6eb2bb 0%,
      #bfd4d2 30%,
      #e6ddd2 45%,
      #f5e8d9 60%,
      #feefde 100%
    );
}
#headerwrap, #footerwrap {border: none; }
#content { padding:0; }

/* Sticky header hot fix */
.fixed-header .header-bar, .fixed-header .search-button, .fixed-header .header-widget {
    display: block;
}

/* Wrappers */
#footerwrap { background-color: var(--teal); color: var(--white); }
#footerwrap a { color: var(--white); }


/* Main Nav */
#header { padding: 0; }
.header-widget-full { background-color: rgba(255, 255, 255, .0); padding: 1.5em .5em 0; }
#main-nav .current-menu-item>a, #main-nav .current_page_item>a, #main-nav a:hover, #main-nav ul a:hover { color: var(--black); }
#main-nav li { border-right: 1px solid var(--black); }
#main-nav li:last-child { border-right: none; }
#main-nav a { padding: 0 1em; }
#main-nav li:last-child a { padding: 0 0 0 1em; }

#site-logo a img { position: relative; margin-top: -30px; z-index: 3; }

/* Headings */
h1 { font-weight: 300; font-size: 3.2em; }
h2 { font-weight: 400; letter-spacing: .15em; }

.module-fancy-heading .main-head+.sub-head:before { border-top: 0px solid; width: 220px; }

/* Text Stylings */
p, li { font-size: 1.1em; }
.text-align--right { text-align: right; }
.text-align--center { text-align: center; }
.text-transform--uppercase { text-transform: uppercase; }


.button { padding: .5em 1em; text-align: center; text-transform: uppercase; }
.button-color--beige { background-color: var(--beige); color: var(--white); }
.button-color--teal { background-color: var(--teal); color: var(--white); }
.button.full-width { width: 100%; display: block; box-sizing: border-box; margin: 0 auto; }

.color--white { color: var(--white); }
.color--black { color: var(--black); }
.color--teal { color: var(--teal); }
.color--green { color: var(--green); }
.color--beige { color: var(--beige); }
.color--cream { color: var(--cream); }
.color--mint { color: var(--mint); }

.font-size--4_2em { font-size: 4.2em; }
.font-weight--400 { font-weight: 400; }

/* List */
li { margin: 0; }

/* Why Hero Cards */
.why-hero-card { padding: 1em 0; text-align: center; }
.why-hero-card label { font-size: 4.2em; font-weight: 300; color: var(--white); text-align: center; text-transform: uppercase; margin: 0 auto; padding: 0; }
.why-hero-card ul { margin: 0; }
.why-hero-card li { list-style: none; display: inline; color: var(--white); padding: 0 .5em; border-right: 1px solid var(--white); }
.why-hero-card li:last-child { border-right: none; }

/* Testimonial Cards */
.testimonial-wrapper {
    perspective: 1200px;
}

.testimonial-card {
    position: relative;
    width: 75%;
    height: 250px;
    transform-style: preserve-3d;
    animation: rotateTestimonials 20s infinite;
	margin: 0 auto;
}

.testimonial {
    position: absolute;
    inset: 0;
    padding: 40px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    backface-visibility: hidden;
}

.testimonial:nth-child(1) {
    transform: rotateY(0deg) translateZ(200px);
}

.testimonial:nth-child(2) {
    transform: rotateY(120deg) translateZ(200px);
}

.testimonial:nth-child(3) {
    transform: rotateY(240deg) translateZ(200px);
}

.testimonial-quote {
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 20px;
    color: #333;
	font-style: italic;
}

.testimonial-name {
    font-weight: 700;
    color: #111;
	text-align: right;
}

@keyframes rotateTestimonials {
    0%, 25% {
        transform: rotateY(0deg);
    }
    33%, 58% {
        transform: rotateY(-120deg);
    }
    66%, 91% {
        transform: rotateY(-240deg);
    }
    100% {
        transform: rotateY(-360deg);
    }
}
 /* END of Testimonials */

/* Toggle Section */
  .toggle-section {


  }

  .toggle-button {
    background: var(--mint);
    border: none;
	  border-radius: 0;
    padding: .5em 2em;
	  font-size: 1.3em;
	  font-weight: 600;
	  color: var(--black);
    text-align: left;
	  text-transform: uppercase;
	  letter-spacing: .1em;
    cursor: pointer;
    position: relative;
    transition: background 0.3s linear;
	  width: 100%;
  }

  .toggle-button:hover {
    background: #666;
	  color: #fff;
  }

  .toggle-button::after {
    content: "+";
    position: absolute;
    right: 11px;
	  top: 5px;
    font-size: 1.3em;
  }

  .toggle-button.active::after {
    content: "−";
  }

 .toggle-content {
    max-height: 0;
    overflow: hidden;
	  margin: .5em 1em;
    transition: max-height 0.5s ease;
  } 

  .toggle-inner {
    padding: 25px;
  }

/* END OF toggle */

/* Tabs */

/* Hide radio buttons */
.tabs-section input[type="radio"] {
    display: none;
}

/* Tabs Navigation */
.tabs-nav {
    display: flex;
    width: 100%;

}

.tabs-nav label {
    flex: 1;
    text-align: center;
    padding: .5em 24px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.3s ease;
    border-bottom: 3px solid transparent;
	background-color: var(--cream);
	color: var(--black);
	letter-spacing: .1em;
	/*border-bottom-color: var(--teal);*/
}

/* Hover State */
.tabs-nav label:hover {
    background: var(--teal);
	color: var(--cream);
	border-bottom-color: var(--beige);
}

/* Content Area */
.tabs-content {
    width: 100%;
    padding: 40px 0;
	border-bottom: 2px solid var(--teal);
}

.tabs-content h3, .tabs-content h4 { letter-spacing: .05em; font-weight: 500; }

.tab-panel {
    display: none;
    width: 100%;
}


/* Active Tab Styling */
#tab1:checked ~ .tabs-nav label[for="tab1"],
#tab2:checked ~ .tabs-nav label[for="tab2"] {
    border-bottom-color: var(--beige);
    color: var(--cream);
	background-color: var(--teal);
}

/* Show Selected Content */
#tab1:checked ~ .tabs-content .tab-panel-1,
#tab2:checked ~ .tabs-content .tab-panel-2 {
    display: block;
}

/* END of Tabs */

/* Brand Infinte Carousel */
.brand-carousel {
  overflow: hidden;
  width: 100%;
  padding: 20px 0;
  background: var(--white);
}

.carousel-track {
  display: flex;
  width: max-content;
  animation: scroll 60s linear infinite;
}

.brand {
  flex: 0 0 auto;
  width: 180px;
	height: 180px;
  margin: 0 40px;
  display: flex;
	
  align-items: bottom;
  justify-content: center;
	overflow: hidden;
}

.brand img {
  max-width: 100%;
  max-height: 100%;
	object-fit: contain;
/*  filter: grayscale(100%);
  opacity: 0.7;
  transition: all 0.3s ease;
}

.brand img:hover {
  filter: grayscale(0%);
  opacity: 1;*/
}

/* animation */
@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* pause on hover */
.brand-carousel:hover .carousel-track {
  animation-play-state: paused;
}

/* End of Carousel */

/* Patients links buttons */
.patient-forms {
  max-width: 980px;
  margin: 0 auto;
  padding: 2em;
}

.forms-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.form-card {
  background: var(--white);
  /*min-height: 95px;*/
  padding: 1.5em 1em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
	font-size: 1.5em;
	font-weight: 600;
  color: var(--teal);
  transition: all .3s ease;
  box-shadow: 0 4px 15px rgba(0,0,0,.05);
}

.form-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px rgba(0,0,0,.12);
}

.arrow {
  font-size: 2em;
  line-height: 1;
  color: var(--teal);
  transition: transform .3s ease;
}

.form-card:hover .arrow {
  transform: translateX(6px);
}

.form-card.cta {
  background: var(--teal);
  color: var(--white);
}

.form-card.cta .arrow {
  color: var(--beige);
}

/* Tablet */
@media (max-width: 900px) {
  .forms-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile */
@media (max-width: 600px) {
  .forms-grid {
    grid-template-columns: 1fr;
  }

  .form-card {
    min-height: 80px;
    font-size: 18px;
  }
}

/* END Of Patients buttons */