#loader {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  margin-left: -6px;
  background: #C1A873;
  border-radius: 50%;
  animation: pulse 1.5s ease-in-out infinite;
  box-shadow: 0 0 20px rgba(193, 168, 115, 0.4);
  z-index: 9999;
}

@keyframes pulse {
  0%, 100% {transform: scale(1); opacity: 1;}
  50% {transform: scale(1.8); opacity: 0.7;}
}

.content {
  opacity: 0;
  transition: opacity 0.6s ease-in-out;
  width: 100%;
}

.content-visible {
  opacity: 1;
}

/* Theme Toggle Button */
.theme-toggle {
  position: fixed;
  top: 20px;
  right: 20px;
  background: transparent;
  border: 1px solid var(--burnt-gold);
  color: var(--burnt-gold);
  padding: 8px 16px;
  border-radius: 20px;
  font-family: "Cormorant Garamond", serif;
  font-size: 14px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10000;
}

.theme-toggle:hover {
  background: rgba(193, 168, 115, 0.1);
}

/* Light Theme (Default) */
body.light-theme {
  --bg-color: var(--sand-beige);
  --text-color: var(--oud-black);
  --accent-color: var(--oud-black);
  --secondary-color: var(--wood-brown);
  background-color: var(--sand-beige);
  color: var(--oud-black);
}

/* Dark Theme */
body.dark-theme {
  --bg-color: var(--oud-black);
  --text-color: var(--sand-beige);
  --accent-color: var(--burnt-gold);
  --secondary-color: var(--sand-beige);
  background-color: var(--oud-black);
  color: var(--sand-beige);
}

:root {
  --oud-black: #1A1A1A;
  --burnt-gold: #C1A873;
  --wood-brown: #7C5A3A;
  --sand-beige: #EDE3D9;
  --vanilla-cream: #F6F0E7;
  --amber-glow: #D49448;
}


* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Spectral', serif;
  background: var(--bg-color);
  color: var(--text-color);
  margin: 0;
  padding: 60px 15px;
  text-align: center;
  line-height: 1.6;
  transition: background-color 0.6s ease, color 0.6s ease;
}

h1 {
  font-family: "Cinzel", serif;
  font-weight: 600;
  letter-spacing: 0.30em;
  font-size: 48px;
  margin-bottom: 8px;
  text-transform: uppercase;
  color: var(--accent-color);
  transition: color 0.6s ease;
}

h2 {
  font-family: "Cormorant Garamond", serif;
  font-size: 16px;
  font-weight: 500;
  margin-top: -4px;
  letter-spacing: 0.30em;
  text-transform: uppercase;
  color: var(--secondary-color);
  transition: color 0.6s ease;
}

p {
  max-width: 600px;
  margin: 14px auto;
  font-size: 17px;
  color: var(--text-color);
  transition: color 0.6s ease;
  line-height: 22px;
}

.notes {
  letter-spacing: 4px;
  margin-top: 25px;
  font-size: 14px;
  color: var(--secondary-color);
  transition: color 0.6s ease;
}


.hidden-link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  text-decoration: none;
  color: transparent;
  cursor: pointer;
}

strong {
  color: var(--accent-color);
  transition: color 0.6s ease;
}

  @media (max-width: 768px) {
   h1 {font-size: 40px;letter-spacing: 0.28em;}
   h2 {font-size: 13px;letter-spacing: 0.30em;}
  }
  @media (max-width: 600px) {
   h1 {font-size: 37px;letter-spacing: 0.23em;}
   h2 {font-size: 12px;letter-spacing: 0.26em;}
  }
  @media (max-width: 480px) {
   h1 {font-size: 37px;letter-spacing: 0.23em;}
   h2 {font-size: 12px;letter-spacing: 0.26em;}
  }


/* Tablet */
@media (max-width: 768px) {
  body {
    padding: 50px 25px;
  }



  p {
    font-size: 17px;
    margin: 20px auto;
  }

  .notes {
    font-size: 13px;
    letter-spacing: 3px;
    margin-top: 20px;
  }

  .theme-toggle {
    top: 15px;
    right: 15px;
    padding: 6px 12px;
    font-size: 12px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  body {
    padding: 60px 20px;
  }
}

/* Small Mobile */
@media (max-width: 480px) {
  body {
    padding: 60px 15px;
  }


  p {
    font-size: 16px;
    margin: 18px auto;
  }

  .notes {
    font-size: 12px;
    letter-spacing: 2px;
  }

  .theme-toggle {
    top: 10px;
    right: 10px;
    padding: 5px 10px;
    font-size: 11px;
  }
}


/* Footer */
.footer-credit {width: 100%;text-align: right;padding: 20px 40px 40px;font-family: "Spectral", serif;font-size: 12px;letter-spacing: 0.05em;opacity: 0.65;transition: color 0.4s ease, opacity 0.4s ease;}
.light-theme .footer-credit {color: #1A1A1A;}
.dark-theme .footer-credit {color: #EDE3D9;}

@media (max-width: 600px) {.footer-credit {padding: 20px 20px 30px;text-align: center;}}

.footer-signature {margin-top: 40px;text-align: center;}
.footer-signature-logo {font-family: "Cinzel", serif;font-size: 33px;letter-spacing: 0.25em;text-transform: uppercase;margin-bottom: 0px;transition: color 0.4s ease;}
.footer-signature-slogan {font-family: "Cormorant Garamond", serif;font-size: 13px;letter-spacing: 0.15em;opacity: 0.85;text-transform: uppercase;transition: color 0.4s ease;}

.light-theme .footer-signature-logo { color: #1A1A1A; }
.light-theme .footer-signature-slogan { color: #7C5A3A; }

.dark-theme .footer-signature-logo {   color: var(--accent-color); }
.dark-theme .footer-signature-slogan {   color: var(--secondary-color); }

@media (max-width: 600px) {.footer-signature-logo { font-size: 24px; }.footer-signature-slogan { font-size: 10px; }
}

.oum-footer {margin-top: 80px;padding: 40px 40px 32px;border: 1px solid rgba(0,0,0,0.08);font-family: "Spectral", serif;transition: background 0.4s ease, color 0.4s ease, border-color 0.4s ease;}

.light-theme .oum-footer {background: #F7F1E8;color: #1A1A1A;border-color: rgba(0,0,0,0.10);}

.dark-theme .oum-footer {background: #1A1A1A;color: #EDE3D9;border-color: rgba(255,255,255,0.14);}

.footer-top {max-width: 1100px;margin: 0 auto 28px;display: flex;flex-wrap: wrap;justify-content: space-between;gap: 40px;}
.footer-col {flex: 1 1 260px;min-width: 220px;}

.footer-col h3 {font-family: "Cormorant Garamond", serif;font-size: 13px;letter-spacing: 0.18em;text-transform: uppercase;margin-bottom: 10px;}
.footer-col p {font-size: 13px;line-height: 1.7;margin: 0 0 10px;}
.footer-link {display: block;font-size: 13px;text-decoration: none;margin-bottom: 4px;letter-spacing: 0.03em;border-bottom: 1px solid transparent;padding-bottom: 2px;transition: border-color 0.25s ease, opacity 0.25s ease;}

.footer-col.footer-follow {text-align: center;}
.footer-social {justify-content: center;}


.light-theme .footer-link {color: #1A1A1A;}
.dark-theme .footer-link {color: #EDE3D9;}

.footer-link:hover {border-color: #C1A873; opacity: 0.8;}


.newsletter-form {margin-top: 14px;display: inline-flex;flex-wrap: wrap;gap: 8px;}
.newsletter-form input[type="email"] {min-width: 240px;padding: 8px 10px;border-radius: 2px;border: 1px solid rgba(0,0,0,0.25);font-size: 13px;outline: none;background: transparent;}
.light-theme .newsletter-form input[type="email"] {color: #1A1A1A;border-color: rgba(0,0,0,0.25);}
.dark-theme .newsletter-form input[type="email"] {color: #EDE3D9;border-color: rgba(255,255,255,0.30);}

.newsletter-form button {padding: 8px 22px;font-size: 12px;letter-spacing: 0.17em;text-transform: uppercase;border-radius: 2px;border: 1px solid #1A1A1A;background: transparent;cursor: pointer;font-family: "Spectral", serif;transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;}
.light-theme .newsletter-form button {color: #1A1A1A;border-color: #1A1A1A;}
.dark-theme .newsletter-form button {color: #EDE3D9;border-color: #C1A873;}
.newsletter-form button:hover {background: #C1A873;color: #1A1A1A;}

.footer-social {margin-top: 10px;display: flex;gap: 16px;align-items: center;}
.social-svg {width: 22px;height: 22px;display: block;transition: opacity 0.25s ease, transform 0.2s ease;}
.light-theme .footer-social a {color: #1A1A1A; }
.dark-theme .footer-social a {color: var(--accent-color);}
.footer-social a:hover .social-svg {opacity: 0.7;transform: translateY(-2px);}

.footer-bottom {max-width: 1100px;margin: 20px auto 0;padding-top: 16px;border-top: 1px solid rgba(0,0,0,0.08);display: contents;justify-content: space-between;font-size: 12px;letter-spacing: 0.06em;text-transform: uppercase;}

.light-theme .footer-bottom {border-color: rgba(0,0,0,0.08);}
.dark-theme .footer-bottom {border-color: rgba(255,255,255,0.16);}
.footer-bottom-left {display: flex;align-items: center;gap: 6px;font-weight: 500;letter-spacing: 0.08em;}
.footer-separator {opacity: 0.4;margin: 0 6px;}
.ship-country,.ship-currency {font-weight: 600;}

.app-downloads {margin-top: 18px;display: flex;justify-content: center;gap: 16px;}
.app-badge {height: 40px;display: block;opacity: 0.9;transition: transform 0.25s ease, opacity 0.25s ease;}
.app-badge:hover {transform: translateY(-3px);opacity: 1;}
.light-theme .app-badge {filter: none;}
.dark-theme .app-badge {filter: brightness(1.2) contrast(1.15);}


.ship-arrow {font-size: 14px;margin-left: 2px;}

.footer-bottom-right {font-size: 13px;color: var(--secondary-color);font-family: 'Spectral', serif;text-align: right;margin-top: 15px;margin-right: 10px;}

@media (max-width: 768px) {.oum-footer {padding: 32px 20px 28px;}.footer-bottom {flex-direction: column;gap: 8px;text-align: left;}.footer-bottom-right {text-align: right;}}