/*
Theme Name: Hello Elementor SYTE
Theme URI: https://elementor.com/hello-theme/
Description: Child theme for Hello Elementor
Author: Your Name
Template: hello-elementor
Version: 1.0
*/

/* CORRECTIONS
---------------------------- */

/* Force Font Awesome to render correctly in Hello Elementor and Elementor Icon List */
.fa,
.fas,
.far,
.fal,
.fab,
.fa-solid,
.fa-regular,
.fa-brands {
  font-family: "Font Awesome 5 Free" !important;
  font-weight: 900;
}
svg.fa-icon,
.elementor-icon svg {
  display: inline-block !important;
  visibility: visible !important;
}
.elementor-icon-list-icon i,
.elementor-icon-list-icon svg {
  font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands" !important;
  font-weight: 900;
}

/* Hide Hello Elementoor theme header globally */
header.site-header,
.site-header,
#masthead,
.site-header-wrap {
    display: none !important;
}

/* Remove the default white backgrounds */
.page .site-content,
.page .entry-content,
.page .elementor-section-wrap {
    background: transparent !important;
}

/* SYTE STYLES
---------------------------- */

/* Global site header */
.syte-global-header {
 position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background: transparent;
}
.syte-global-header > .elementor-container {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0px;
  padding-right: 0px;
}
.syte-global-header .elementor-widget-image .elementor-widget-container {
  text-align: left;
}
@media (max-width: 1024px) {
  .syte-global-header {
    position: relative;
    background-color: #202020;
  }
	.syte-global-header .elementor-column {
		width: 50% !important;
	}
	.syte-global-header .hfe-nav-menu__toggle {
		margin: 0 !important;
		padding-right:20px;
		text-align: right;
	}
  .syte-global-header .hfe-nav-menu-icon {
    color: #ffffff;
  }
}
/* Offset header for WP admin bar */
body.admin-bar .syte-global-header {
    top: 32px;
}
@media (max-width: 782px) {
  body.admin-bar .syte-global-header {
    top: 46px;
  }
}

/* Site Header: Menu */
.site-navigation ul.menu li ul,
.site-navigation ul.menu li ul li,
.site-navigation ul.menu li ul li a {
	min-width:200px;
}
.site-navigation ul.menu li a,
.site-navigation ul.menu li ul a {
	color: #ffffff;
	border: 1px solid transparent;
}
.site-navigation ul.menu li.menu-button a {
	color: #202020;
	background-color: #DAC644;
	border: 1px solid #DAC644;
}
.site-navigation ul.menu li.menu-button a:hover {
	background-color: #F9E983;
	color: #202020;
	border: 1px solid #DAC644;
}
.site-navigation ul.menu li ul {
	background: #202020;
}
.site-navigation ul.menu li a:hover,
.site-navigation ul.menu li ul a:hover {
	color: #DAC644;
	border: 1px solid #DAC644;
}
.site-navigation ul.menu li ul li {
	border-block-end: none;
}

/* Page Title H1 */
h1.white,
.white {
	color: #ffffff;
}
b.blue,
.blue {
	color: #1962D1;
}
b.gold,
.gold {
	color: #DAC644;
}
/* Heading Labels */
.gold-label {
	background-color: #DAC644;
	padding: 4px 10px;
}
.blue-label {
	background-color: 1962D1;
	padding: 4px 10px;
}

/* Page Title H1 Rotating Words */
.rotating-words {
  display: inline-block;
  position: relative;
  min-width: 11ch;  /* width = longest word (INNOVATION) */
	vertical-align:top;
}

/* HOME - Rotating words */
.rotating-words .word {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
	text-align:left;
}
.rotating-words .word.active {
  opacity: 1;
}

/* Expertise Services Boxes */
.service-card {
	overflow:hidden;
	padding:0 !important;
	margin:10px;
}
.service-card .elementor-widget-wrap {
	padding: 0!important;
	overflow: hidden;
}
.service-card:hover {
	background-color:#1962D1;
}
.service-card img {
	display:block;
	width:100%;
	height:auto;
	transition: transform 0.5s ease;
	transform-origin: center center;
	overflow: hidden;
}
.service-card:hover img {
	transform: scale(1.15);
}
i, svg {
  display: inline-block !important;
  visibility: visible !important;
  width: auto !important;
  height: auto !important;
  opacity: 1 !important;
}

/* CONTACT
---------------------------- */

/* Contact Form 7 layout */
.input_fill_outer {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
/* Default: 50% width fields */
.input_fill_outer .input_fill {
    width: calc(50% - 10px);
}
/* Full-width fields (Subject row) */
.input_fill_outer .input_fill:nth-child(5) {
    width: 100%;
}
/* Message textarea full width */
.input_fill textarea,
.input_fill_outer textarea {
    width: 100%;
}
/* Ensure inputs fill their container */
.input_fill input,
.input_fill textarea {
    width: 100%;
}
/* Mobile stack */
@media (max-width: 768px) {
    .input_fill_outer .input_fill {
        width: 100%;
    }
}


/* Global Site Footer */
.syte-foot-nav li.button a {
	background-color:#DAC644!important;
	color: #202020!important;
	font-weight:bold!important;
	padding:10px!important;
}
.syte-foot-nav li.button a:hover {
	background-color:#F9E983!important;
	color: #202020!important;
}

/* ----------------------------
   SINGLE POST TEMPLATE
---------------------------- */

/* Full-width post wrapper with background image + overlay */
.syte-single-post-fullwidth {
  position: relative;
  width: 100%;
  min-height: 100vh;
  background-color: #ffffff;
  padding: 120px 20px 60px 20px;
  box-sizing: border-box;
  z-index: 0;
}

/* Semi-transparent overlay */
.syte-single-post-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('https://dev-syte-corp.pantheonsite.io/wp-content/uploads/2025/11/bg_light_01.jpg');
  opacity: 0.3;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
  pointer-events: none;
  z-index: 0;
}

/* Inner container for main content + sidebar */
.syte-single-post-inner {
  position: relative;
  display: flex;
  max-width: 1240px;
  margin: 0 auto;
  gap: 40px;
  flex-wrap: wrap;
  z-index: 1;
  box-sizing: border-box;
}

/* Main content column */
.syte-post-main {
  flex: 3 1 700px;
  min-width: 300px;
}

/* Featured Image */
.syte-post-featured-image {
  text-align: center;
  margin-bottom: 40px;
}

.syte-post-featured-image img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* Post Title */
.syte-post-title {
  color: #202020;
  font-family: 'alternate-gothic-extra-cond', sans-serif;
  font-weight: 400;
  font-size: 48px;
  margin-bottom: 10px;
  line-height: 1.2;
}

/* Post Meta Layout */
.syte-post-meta {
  margin-bottom: 30px;
  font-family: 'proxima-nova', sans-serif;
  font-size: 14px;
  line-height: 1.6;
}

/* Date + categories inline, no wrap unless necessary */
.syte-post-date-cats {
  display: inline; /* or inline-flex */
  white-space: nowrap;
  color: #202020;
}

.syte-post-date-cats .syte-post-cats {
  margin-left: 5px;
}

.syte-post-date-cats a {
  color: #1962D1;
  text-decoration: none;
}

.syte-post-date-cats a:hover {
  text-decoration: underline;
}

/* Tags below */
.syte-post-tags {
  display: inline-block;
  margin-top: 5px;
}

.syte-post-tags a {
  color: #1962D1;
  text-decoration: none;
}

.syte-post-tags a:hover {
  text-decoration: underline;
}

.syte-post-tags .syte-tag-icon {
  margin-right: 5px;
}

/* Post Content */
.syte-post-content {
  color: #202020;
  font-family: 'proxima-nova', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.7;
  padding: 20px 0;
}

/* Sidebar column */
.syte-post-sidebar {
  flex: 0 0 300px;
  min-width: 250px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* Back Button */
.syte-back-button-wrapper {
  margin-top: 40px;
  text-align: center;
}

.syte-back-button {
  display: inline-block;
  padding: 12px 24px;
  background-color: #DAC644;
  color: #202020;
  text-decoration: none;
  font-family: 'proxima-nova', sans-serif;
  font-size: 14px;
}

.syte-back-button:hover {
  background-color: #F9E983;
  text-decoration: underline;
}

/* Related Posts */
.syte-related-posts-title h2 {
  font-family: 'alternate-gothic-extra-cond', sans-serif;
  font-weight: 400;
  font-size: 24px!important;
  color: #202020;
  margin-bottom: 20px;
}
.syte-related-post-date {
  font-family: 'proxima-nova', sans-serif;
  font-size: 14px;
  color: #1962D1;
  margin-top: 6px;
}

.syte-related-posts-grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.syte-related-post {
  background: #f9f9f9;
  padding: 15px;
  border: 1px solid #c0c0c0;
}

.syte-related-post a {
  text-decoration: none;
  color: #202020;
}
.syte-related-post a:hover {
  text-decoration: none;
  color: #1962D1;
  text-decoration: underline;
}

.syte-related-post img {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}

.syte-related-post h3 {
  font-family: 'alternate-gothic-extra-cond', sans-serif;
  font-size: 20px;
  margin: 0 0 10px;
  font-size:24px;
  line-height: 28px;
}

/* STICKY SIDEBAR - Desktop Only */
@media (min-width: 1025px) {
  .syte-post-sidebar {
    position: sticky;
    top: 120px; /* distance from top of viewport */
    align-self: start; /* ensures it sticks correctly inside flex container */
  }
}

/* MOBILE RESPONSIVENESS */
@media (max-width: 1024px) {
  .syte-single-post-inner {
    flex-direction: column;
  }

  .syte-post-main {
    flex: 1 1 100%;
  }

  .syte-post-sidebar {
    flex: 1 1 100%;
  }

  .syte-related-posts-grid {
    flex-direction: column;
  }
}
/* Hide empty Elementor bottom section on single posts */
body.single-post .syte-comment {
    display: none !important;
}

/* Archive Page Wrapper */
body.archive .syte-global-header,
body.page .syte-global-header {
  background-color: #202020;
}
.syte-archive-fullwidth {
  position: relative;
  width: 100%;
  background-color: #ffffff;
  padding: 120px 20px 60px 20px;
  box-sizing: border-box;
  min-height: 100vh;
  z-index: 0;
}

.syte-archive-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('https://dev-syte-corp.pantheonsite.io/wp-content/uploads/2025/11/bg_light_01.jpg');
  background-repeat: repeat;
  background-size: auto;
  z-index: 0;
}

.syte-archive-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* Archive Title */
.syte-archive-title {
  font-family: 'alternate-gothic-extra-cond', sans-serif;
  font-weight: 400;
  font-size: 36px;
  color: #202020;
  margin: 0;
}

/* Post Item */
.syte-archive-post-item {
  display: flex;
  gap: 30px;
  background: #f9f9f9;
  padding: 20px;
  border: 1px solid #c0c0c0;
}

/* Post Image */
.syte-archive-post-image {
  flex: 0 0 200px;
  max-height: 200px;
  overflow: hidden;
}

.syte-archive-post-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.syte-archive-post-item:hover .syte-archive-post-image img {
  transform: scale(1.05);
}

/* Post Content */
.syte-archive-post-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Post Title */
.syte-archive-post-title {
  font-family: 'alternate-gothic-extra-cond', sans-serif;
  font-weight: 400;
  font-size: 24px!important;
  line-height: 28px!important;
  margin: 0 0 10px;
}

.syte-archive-post-title a {
  color: #202020;
  text-decoration: none;
}

.syte-archive-post-title a:hover {
  color: #1962D1;
  text-decoration: underline;
}

/* Post Meta */
.syte-archive-post-meta {
  font-family: 'proxima-nova', sans-serif;
  font-size: 14px;
  color: #1962D1;
  margin-bottom: 10px;
}

/* Post Excerpt */
.syte-archive-post-excerpt {
  font-family: 'proxima-nova', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #202020;
}

/* Back Button */
.syte-back-button-wrapper {
  margin-top: 40px;
  text-align: center;
}

.syte-back-button {
  display: inline-block;
  padding: 12px 24px;
  background-color: #DAC644;
  color: #202020;
  text-decoration: none;
  font-family: 'proxima-nova', sans-serif;
  font-size: 14px;
}

.syte-back-button:hover {
  background-color: #F9E983;
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 1024px) {
  .syte-archive-post-item {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .syte-archive-post-image {
    width: 100%;
    max-height: 300px;
  }
}

/* Fallback page layout (non-Elementor pages) */
.syte-page {
    background: #ffffff;
    padding: 100px 20px 60px 20px;
}

.syte-page-inner {
    max-width: 1200px;
    margin: 0 auto;
}

/* Page Title */
.syte-page-title {
    font-size: 40px;
    line-height: 46px;
    color: #202020;
    margin-bottom: 30px;
}

/* Page Content */
.syte-page-content {
    font-size: 18px;
    line-height: 1.75;
    color: #202020;
}

/* Improve spacing for common elements */
.syte-page-content p {
    margin-bottom: 1.25em;
}

.syte-page-content h2 {
    font-size: 32px;
    line-height: 38px;
    margin: 50px 0 20px;
}

.syte-page-content h3 {
    font-size: 24px;
    line-height: 30px;
    margin: 40px 0 16px;
}

.syte-page-content ul,
.syte-page-content ol {
    padding-left: 1.5em;
    margin-bottom: 1.5em;
}

.syte-page-content a {
    color: #1962D1;
    text-decoration: underline;
}
