/* SkyTab Kiosk Case Study - Custom Styles */
/* Orange/Yellow accent color theme */

:root {
  --color-accent: #F8A900;
  --color-background-accent: #F8A900;
}

/* Navigation - Static positioning, shares background with hero */
.navigation {
  position: relative !important;
  background: transparent !important;
  border-bottom: none;
  transform: none !important;
  z-index: 2;
}

.navigation.nav-hidden {
  transform: none !important;
}

.nav-container {
  border-bottom: none;
}

.nav-logo {
  color: white;
}

.nav-link {
  color: rgba(255, 255, 255, 0.8);
}

.nav-link:hover,
.nav-link.active {
  color: white;
}

/* Hero Wrapper - Contains both nav and hero section with shared background */
.hero-wrapper {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #E5A500 0%, #DC6B2F 100%);
}

/* Hero Section - Remove negative margin since nav is not fixed */
.hero-section {
  background: transparent;
  position: relative;
  margin-top: 0 !important;
  z-index: 1;
}

/* Override feature card backgrounds to be solid white */
.case-study-section:not(.section-accent) .feature-card {
  background: white;
  border: 1px solid #E5E5E5;
}

/* Override feature card hover border */
.case-study-section:not(.section-accent) .feature-card:hover {
  border-color: rgba(248, 169, 0, 0.25);
}

/* Override feature card accent bar */
.case-study-section:not(.section-accent) .feature-card::before {
  background: linear-gradient(180deg, #F8A900 0%, transparent 100%);
}

/* Override tag colors */
.tag {
  color: #F8A900;
  border-color: rgba(248, 169, 0, 0.15);
}

.tag:hover {
  color: #F8A900;
  border-color: rgba(248, 169, 0, 0.25);
}

/* Iteration containers */
.iteration-container {
  background-color: #EAEAEA;
  border-radius: 16px;
  padding: var(--spacing-8);
  margin: var(--spacing-8) 0;
}

/* Override text highlights */
.text-highlight-blue {
  color: #F8A900;
}

/* Override text highlights */
::selection {
  background: rgba(248, 169, 0, 0.15);
}

/* Override icon container and Material Icons color */
.case-study-section:not(.section-accent) .feature-card-icon {
  background: rgba(248, 169, 0, 0.15);
  width: 56px;
  height: 56px;
  border-radius: 50%;
}

.case-study-section:not(.section-accent) .feature-card-icon .material-icons {
  color: #F8A900;
  font-size: 24px;
}

/* Orange gradient for accent sections */
.case-study-section.section-accent {
  background: transparent;
}

.case-study-section.section-accent::before {
  background: radial-gradient(
    circle at 30% 40%,
    rgba(255, 218, 122, 0.6) 0%,
    rgba(255, 218, 122, 0.4) 30%,
    rgba(255, 218, 122, 0.2) 60%,
    rgba(255, 218, 122, 0) 100%
  );
}

.case-study-section.section-accent::after {
  background: radial-gradient(
    circle at 60% 50%,
    rgba(255, 138, 81, 0.6) 0%,
    rgba(255, 138, 81, 0.4) 30%,
    rgba(255, 138, 81, 0.2) 60%,
    rgba(255, 138, 81, 0) 100%
  );
}

/* Remove alternating gray backgrounds for this page */
.case-study-section:nth-child(even) {
  background-color: transparent;
}

.case-study-section:nth-child(odd) {
  background-color: transparent;
}

/* Override section divider color */
.section-divider {
  background: rgba(248, 169, 0, 0.2);
}

/* Bento grid feature icons */
.bento-feature .feature-card-icon {
  background: rgba(248, 169, 0, 0.15);
  border-radius: 50%;
}

.bento-feature .feature-card-icon .material-icons {
  color: #F8A900;
}

/* Cards on orange gradient backgrounds */
.case-study-section.section-accent .feature-card {
  background-color: rgba(255, 255, 255, 0.6) !important;
  border: 1px solid rgba(255, 255, 255, 1) !important;
  box-shadow: inset 0 0 40px rgba(255, 255, 255, 1) !important;
}

.case-study-section.section-accent .bento-feature {
  background-color: rgba(255, 255, 255, 0.6) !important;
  border: 1px solid rgba(255, 255, 255, 1) !important;
  box-shadow: inset 0 0 40px rgba(255, 255, 255, 1) !important;
}

.case-study-section.section-accent .feature-card-icon .material-icons {
  color: #F8A900 !important;
}

.case-study-section.section-accent .bento-feature .material-icons {
  color: #F8A900 !important;
}

.case-study-section.section-accent .feature-card-icon {
  background: rgba(248, 169, 0, 0.15) !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
}

.case-study-section.section-accent .bento-feature .feature-card-icon {
  background: rgba(248, 169, 0, 0.15) !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
}

/* Hover effects for cards on orange gradient backgrounds */
.case-study-section.section-accent .feature-card:hover {
  transform: translateY(-8px);
  transition: transform 0.3s ease;
}

.case-study-section.section-accent .bento-feature:hover {
  transform: translateY(-8px);
  transition: transform 0.3s ease;
}

/* Remove gradient line on left edge for cards on orange gradient backgrounds */
.case-study-section.section-accent .feature-card::before {
  display: none !important;
}

.case-study-section.section-accent .bento-feature::before {
  display: none !important;
}