@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;900&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

/* ============================================
   EMBASSY OF YAH - Sacred Design System
   ============================================ */

:root {
  --sacred-gold: #C9A84C;
  --sacred-gold-light: #E8D48B;
  --sacred-gold-dark: #8B6914;
  --deep-earth: #1a1410;
  --warm-earth: #2d2318;
  --spirit-cream: #F5F0E8;
  --spirit-white: #FDFBF7;
  --sacred-green: #4A6741;
  --sacred-green-light: #6B8F5E;
  --sacred-teal: #5B8A8A;
  --sacred-purple: #6B4C7A;
  --sacred-red: #8B3A3A;
  --text-dark: #2C2416;
  --text-medium: #5A4E3C;
  --text-light: #8A7E6C;
}

/* ---- Logos ---- */
.menu-wrapper{display:none;}

.header-light .header-logo{background-image:url(../images/headerlogo.png)!important;}
.header-dark .header-logo{background-image:url(../images/headerlogo.png)!important;}
.header-logo{background-size:auto 33px; width:540px; height:60px; background-position: center;}

.footer-logo{height:185px; background-size:auto 170px;}
.footer-light .footer-logo{background-image:url(../images/logo.png);}
.footer-dark .footer-logo{background-image:url(../images/logo.png);}

.menu-dark.menu-large .menu-logo{background-image:url(../images/logo.png);}
.menu-light.menu-large .menu-logo{background-image:url(../images/logo.png);}
.menu-large .menu-logo{background-size:auto 28px;}

.preloader-dark h1{background:url(../images/logo.png) center center no-repeat; background-size: auto 40px;}
.preloader-light h1{background:url(../images/logo.png) center center no-repeat; background-size: auto 40px;}

/* ---- Preloader ---- */
.preloader-light{background-color: var(--deep-earth);}
.preloader-light p, .preloader-light em{color: var(--sacred-gold-light)!important;}
.preloader-light em{color:rgba(201,168,76,0.5)!important;}

#preloader h1{
  width:100%;
  height:50px;
  background-size:auto 50px;
  margin-top:100px;
}

#preloader em{
  position:fixed;
  width:100%;
  bottom:20px;
  font-style: normal;
  text-align:center;
  font-size:11px;
  line-height:22px;
  font-family: 'Cormorant Garamond', serif;
  letter-spacing: 2px;
}

#preloader p{
  text-align:center;
  font-size:13px;
  font-family: 'Cinzel', serif;
  letter-spacing: 3px;
}

#preloader {
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  background-color: var(--deep-earth);
  z-index:999999999!important;
  pointer-events: none;
  opacity:1;
  transition:all 500ms ease;
}

.hide-preloader{pointer-events: none; opacity:0!important; transition:all 500ms ease;}

#preload-spinner:after, .preload-spinner:after {
  box-shadow:inset var(--sacred-gold) 0 0 0 2px!important;
}

/* ============================================
   SACRED TYPOGRAPHY
   ============================================ */

body {
  font-family: 'Lora', serif !important;
  color: var(--text-dark);
  background-color: var(--spirit-white);
}

h1, h2, h3, .sacred-heading {
  font-family: 'Cinzel', serif !important;
  letter-spacing: 1px;
}

.sacred-body, p {
  font-family: 'Lora', serif;
}

.sacred-accent {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
}

/* ============================================
   HEADER CUSTOMIZATION
   ============================================ */

.header-dark {
  background-color: var(--deep-earth) !important;
  border-bottom: 1px solid rgba(201,168,76,0.2);
}

.header-dark a {
  color: var(--sacred-gold-light) !important;
}

/* ============================================
   HERO SLIDER SACRED STYLING
   ============================================ */

.sacred-hero .cover-content h1 {
  font-family: 'Cinzel', serif !important;
  font-weight: 600;
  letter-spacing: 3px;
  text-shadow: 0 2px 20px rgba(0,0,0,0.5);
  font-size: 26px !important;
  line-height: 1.3;
}

.sacred-hero .cover-content p {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 16px !important;
  font-style: italic;
  letter-spacing: 1px;
  text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}

.sacred-hero .cover-overlay {
  background: linear-gradient(180deg, rgba(26,20,16,0.3) 0%, rgba(26,20,16,0.7) 100%) !important;
  opacity: 1 !important;
}

/* ============================================
   SACRED WELCOME SECTION
   ============================================ */

.sacred-welcome {
  background: linear-gradient(180deg, var(--spirit-white) 0%, var(--spirit-cream) 100%);
  padding: 40px 0 30px;
  text-align: center;
}

.sacred-welcome h1 {
  color: var(--sacred-gold-dark) !important;
  font-size: 22px;
  letter-spacing: 3px;
}

.sacred-welcome h2 {
  color: var(--text-light);
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 1px;
}

.sacred-welcome p {
  color: var(--text-medium);
  line-height: 1.8;
}

/* Sacred Divider */
.sacred-divider {
  text-align: center;
  padding: 15px 0;
  position: relative;
}

.sacred-divider::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 15%;
  right: 15%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--sacred-gold), transparent);
}

.sacred-divider i {
  color: var(--sacred-gold);
  background: var(--spirit-white);
  padding: 0 15px;
  position: relative;
  z-index: 1;
  font-size: 14px;
}

.sacred-divider-dark::before {
  background: linear-gradient(90deg, transparent, rgba(201,168,76,0.4), transparent);
}

.sacred-divider-dark i {
  background: var(--deep-earth);
  color: var(--sacred-gold-light);
}

/* ============================================
   CONTENT STRIP SACRED STYLING
   ============================================ */

.sacred-strip {
  position: relative;
}

.sacred-strip .overlay {
  background: linear-gradient(180deg, rgba(26,20,16,0.75) 0%, rgba(26,20,16,0.85) 100%) !important;
  opacity: 1 !important;
}

.sacred-strip h2 {
  color: var(--sacred-gold-light) !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 3px;
}

.sacred-strip p {
  color: rgba(255,255,255,0.8);
  font-family: 'Lora', serif;
}

/* ============================================
   ICON COLUMNS - PILLARS OF FAITH
   ============================================ */

.sacred-pillars .icon-column {
  text-align: center;
  padding: 20px 15px;
}

.sacred-pillars .icon-column i {
  color: var(--sacred-gold) !important;
  font-size: 32px;
  margin-bottom: 10px;
  display: block;
}

.sacred-pillars .icon-column h1 {
  font-family: 'Cinzel', serif !important;
  font-size: 14px !important;
  letter-spacing: 2px;
  color: var(--text-dark);
  margin-bottom: 8px;
}

.sacred-pillars .icon-column p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-medium);
}

/* ============================================
   SACRED BUTTONS
   ============================================ */

.btn-sacred {
  background: linear-gradient(135deg, var(--sacred-gold-dark), var(--sacred-gold)) !important;
  color: var(--spirit-white) !important;
  border: none !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 2px;
  font-size: 11px !important;
  padding: 12px 30px !important;
  border-radius: 30px !important;
  text-transform: uppercase;
  box-shadow: 0 4px 15px rgba(201,168,76,0.3);
}

.btn-sacred-outline {
  background: transparent !important;
  color: var(--sacred-gold-light) !important;
  border: 1px solid var(--sacred-gold) !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 2px;
  font-size: 11px !important;
  padding: 12px 30px !important;
  border-radius: 30px !important;
  text-transform: uppercase;
}

/* ============================================
   TEACHINGS SECTION
   ============================================ */

.teaching-card {
  background: var(--spirit-white);
  border-radius: 12px;
  padding: 25px 20px;
  margin: 10px 15px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
  border: 1px solid rgba(201,168,76,0.15);
  text-align: center;
  transition: all 300ms ease;
}

.teaching-card i {
  font-size: 28px;
  color: var(--sacred-gold);
  margin-bottom: 12px;
  display: block;
}

.teaching-card h3 {
  font-family: 'Cinzel', serif !important;
  font-size: 14px;
  letter-spacing: 2px;
  color: var(--text-dark);
  margin-bottom: 10px;
}

.teaching-card p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-medium);
  margin: 0;
}

/* ============================================
   TESTIMONIALS / WISDOM QUOTES
   ============================================ */

.sacred-quote h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  font-weight: 300;
  font-size: 20px !important;
  line-height: 1.6 !important;
  color: var(--sacred-gold-light) !important;
}

.sacred-quote .center-stars i {
  color: var(--sacred-gold) !important;
}

/* ============================================
   FOOTER SACRED STYLING
   ============================================ */

.footer-dark {
  background-color: var(--deep-earth) !important;
  border-top: 1px solid rgba(201,168,76,0.2);
}

.footer-dark p {
  color: rgba(201,168,76,0.6) !important;
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
}

.footer-dark .copyright-text {
  font-family: 'Lora', serif;
  font-size: 11px;
  color: rgba(201,168,76,0.3) !important;
}

.footer-socials a {
  background: rgba(201,168,76,0.15) !important;
  border: 1px solid rgba(201,168,76,0.3) !important;
}

.footer-socials a i {
  color: var(--sacred-gold-light) !important;
}

/* ============================================
   MENU SACRED STYLING
   ============================================ */

.menu-dark {
  background-color: var(--deep-earth) !important;
}

.menu-dark .menu-divider {
  color: var(--sacred-gold) !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 2px;
  font-size: 11px;
  border-bottom-color: rgba(201,168,76,0.15) !important;
}

.menu-dark .menu-item strong {
  color: var(--sacred-gold-light) !important;
  font-family: 'Lora', serif !important;
}

.menu-dark .menu-item i {
  color: var(--sacred-gold) !important;
}

.menu-dark .menu-sub-logo {
  color: rgba(201,168,76,0.5) !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  letter-spacing: 2px;
}

.menu-dark .menu-socials a i {
  color: var(--sacred-gold-light) !important;
}

/* ============================================
   SACRED SECTION BACKGROUNDS
   ============================================ */

.bg-sacred-cream {
  background: linear-gradient(180deg, var(--spirit-cream) 0%, var(--spirit-white) 100%);
}

.bg-sacred-dark {
  background: var(--deep-earth);
}

/* ============================================
   CONTACT FORM SACRED STYLING
   ============================================ */

.sacred-contact .menu-contact-title h4 {
  font-family: 'Cinzel', serif !important;
  color: var(--sacred-gold-dark);
  letter-spacing: 2px;
}

.sacred-contact .menu-contact-title h5 {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  color: var(--text-medium);
}

.sacred-contact input,
.sacred-contact textarea {
  border: 1px solid rgba(201,168,76,0.3) !important;
  font-family: 'Lora', serif !important;
  border-radius: 8px !important;
}

.sacred-contact .contactSubmitButton {
  background: linear-gradient(135deg, var(--sacred-gold-dark), var(--sacred-gold)) !important;
  color: var(--spirit-white) !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 2px;
  border-radius: 30px !important;
  border: none !important;
}

/* ============================================
   NOTIFICATION MENU SACRED
   ============================================ */

.menu-notification a strong {
  font-family: 'Cinzel', serif !important;
  font-size: 11px;
  letter-spacing: 1px;
}

.menu-notification a em {
  font-family: 'Cormorant Garamond', serif !important;
}

/* ============================================
   SACRED ANIMATIONS
   ============================================ */

@keyframes sacredGlow {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}

@keyframes sacredFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

.sacred-glow {
  animation: sacredGlow 3s ease-in-out infinite;
}

.sacred-float {
  animation: sacredFloat 4s ease-in-out infinite;
}

/* ============================================
   LINK LIST SACRED
   ============================================ */

.link-list a {
  font-family: 'Lora', serif !important;
}

.link-list a i:first-child {
  color: var(--sacred-gold) !important;
}

/* ============================================
   RESPONSIVE ENHANCEMENTS
   ============================================ */

@media (min-width: 480px) {
  .sacred-hero .cover-content h1 {
    font-size: 30px !important;
  }
  .sacred-hero .cover-content p {
    font-size: 18px !important;
  }
}

/* ============================================
   BACK TO TOP
   ============================================ */

.back-to-top-badge {
  background: var(--sacred-gold-dark) !important;
  color: var(--spirit-white) !important;
  font-family: 'Cinzel', serif !important;
  font-size: 10px !important;
  letter-spacing: 1px;
}

/* ============================================
   DECORATION OVERRIDES
   ============================================ */

.decoration {
  background: linear-gradient(90deg, transparent, rgba(201,168,76,0.2), transparent) !important;
  height: 1px !important;
}

/* ============================================
   SCROLLBAR
   ============================================ */

::-webkit-scrollbar {
  width: 4px;
}

::-webkit-scrollbar-track {
  background: var(--deep-earth);
}

::-webkit-scrollbar-thumb {
  background: var(--sacred-gold);
  border-radius: 2px;
}

/* ============================================
   PAGE CONTENT BACKGROUND
   ============================================ */

#page-content {
  background-color: var(--spirit-white) !important;
}

/* ============================================
   SACRED TIMELINE SECTION
   ============================================ */

.sacred-timeline-item {
  padding: 20px 15px;
  border-left: 2px solid var(--sacred-gold);
  margin-left: 20px;
  margin-bottom: 20px;
  position: relative;
}

.sacred-timeline-item::before {
  content: '';
  position: absolute;
  left: -7px;
  top: 24px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--sacred-gold);
  border: 2px solid var(--spirit-white);
}

.sacred-timeline-item h4 {
  font-family: 'Cinzel', serif !important;
  font-size: 13px;
  letter-spacing: 2px;
  color: var(--sacred-gold-dark);
  margin-bottom: 5px;
}

.sacred-timeline-item p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-medium);
  margin: 0;
}

/* ============================================
   HOMEPAGE CTA OVERRIDE
   ============================================ */

.homepage-cta h1 {
  color: var(--sacred-gold-dark) !important;
  font-family: 'Cinzel', serif !important;
}

.homepage-cta h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  color: var(--text-light) !important;
}

.homepage-cta p {
  color: var(--text-medium);
}

/* ============================================
   CONTENT STRIP OVERRIDE
   ============================================ */

.content-strip {
  border: none !important;
}

.content-strip h2 {
  font-family: 'Cinzel', serif !important;
  letter-spacing: 3px;
}

/* ============================================
   OWL DOTS SACRED
   ============================================ */

.owl-dots .owl-dot span {
  background: rgba(201,168,76,0.3) !important;
}

.owl-dots .owl-dot.active span {
  background: var(--sacred-gold) !important;
}