/* ============================================================
   ROONEY & ROCKY — JUNGLE / WILDLIFE SANCTUARY THEME
   Visual overlay — preserves all existing functionality
   ============================================================ */

/* ---- Global Atmosphere ---- */
body {
  color: var(--cream);
  background: var(--jungle-deep);
}

.page-wrapper {
  background:
    radial-gradient(ellipse 100% 80% at 50% 0%, rgba(45, 90, 69, 0.15) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 90%, rgba(201, 162, 39, 0.04) 0%, transparent 50%),
    var(--jungle-deep);
  position: relative;
}

.page-wrapper::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.035;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(201, 162, 39, 0.8) 1px, transparent 1px),
    radial-gradient(circle at 70% 60%, rgba(255, 255, 255, 0.6) 1px, transparent 1px),
    radial-gradient(circle at 40% 80%, rgba(201, 162, 39, 0.5) 1px, transparent 1px);
  background-size: 200px 200px, 300px 300px, 250px 250px;
  animation: dustFloat 30s linear infinite;
}

@keyframes dustFloat {
  0% { transform: translateY(0); }
  100% { transform: translateY(-200px); }
}

.site-container {
  background: rgba(10, 22, 18, 0.88);
  border: 1px solid var(--glass-border);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(201, 162, 39, 0.08);
  position: relative;
  z-index: 1;
}

/* ---- Scroll Progress ---- */
.scroll-progress { background: rgba(0, 0, 0, 0.4); }
.scroll-progress-bar {
  background: linear-gradient(90deg, var(--gold-antique), var(--gold-light));
  box-shadow: 0 0 12px rgba(201, 162, 39, 0.5);
}

/* ---- Page Loader ---- */
.page-loader {
  background: linear-gradient(135deg, #0a1612, #1a3d2f, #0f1f18);
}
.loader-progress { background: var(--gold); }
.loader-text {
  font-family: var(--font-handwritten);
  font-style: italic;
  color: var(--gold-light);
}

/* ---- Typography ---- */
.section-title {
  color: var(--cream);
  letter-spacing: 0.02em;
}

.section-subtitle { color: var(--text-gray); }

/* Use warmer text on dark jungle surfaces for stronger contrast */
.mission-section .section-subtitle,
.story-section .section-subtitle,
.rescue-section .section-subtitle,
.animals-section .section-subtitle,
.founder-section .section-subtitle,
.volunteer-section .section-subtitle,
.transparency-section .section-subtitle,
.gallery-section .section-subtitle,
.contact-section .section-subtitle,
.vol-stories .section-subtitle,
.vol-gallery-section .section-subtitle,
.vol-cta-section .section-subtitle,
.hero-tagline,
.hero-description,
.vol-hero-lead,
.vol-slide-body p,
.story-content p,
.process-step-text,
.bento-card-text,
.volunteer-description,
.contact-description,
.footer-description,
.footer-bottom,
.modal-subtitle {
  color: rgba(245, 240, 230, 0.82);
}

.section-eyebrow {
  color: var(--gold);
  letter-spacing: 3.5px;
}

.section-eyebrow::before {
  background: linear-gradient(90deg, var(--gold-antique), var(--gold-light));
}

.section-header .section-eyebrow::after {
  background: linear-gradient(90deg, var(--gold-antique), var(--gold-light));
}

/* ---- Navbar ---- */
.header { padding: 16px 32px 0; }

.navbar {
  background: rgba(10, 22, 18, 0.75);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(201, 162, 39, 0.12);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.navbar.scrolled {
  background: rgba(8, 16, 13, 0.92);
  border-color: rgba(201, 162, 39, 0.2);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.55);
}

.navbar-logo-text {
  color: var(--cream);
  font-family: var(--font-heading);
  letter-spacing: 0.04em;
}

.nav-link {
  color: rgba(245, 240, 230, 0.7);
}

.nav-link:hover,
.nav-link.active {
  color: var(--gold-light);
  background: rgba(201, 162, 39, 0.1);
}

.hamburger-line { background: var(--cream); }

/* ---- Buttons ---- */
.btn-primary {
  background: linear-gradient(135deg, #1a3d2f, #2d5a45);
  color: var(--cream);
  border: 1px solid rgba(201, 162, 39, 0.35);
  box-shadow: var(--shadow-gold);
}

.btn-primary:hover {
  background: linear-gradient(135deg, #2d5a45, #3d6b52);
  border-color: var(--gold);
  box-shadow: 0 8px 32px rgba(201, 162, 39, 0.35);
  transform: translateY(-3px);
}

.btn-white {
  background: var(--cream);
  color: var(--forest-green);
  border: 1px solid rgba(201, 162, 39, 0.2);
}

.btn-white:hover {
  background: var(--sand);
  box-shadow: var(--shadow-gold);
}

.btn-outline-white {
  color: var(--cream);
  border-color: rgba(201, 162, 39, 0.5);
}

.btn-outline-white:hover {
  background: rgba(201, 162, 39, 0.12);
  border-color: var(--gold);
  color: var(--gold-light);
}

/* ---- HERO — Cinematic Jungle ---- */
.hero {
  background:
    linear-gradient(to bottom, rgba(10, 22, 18, 0.45) 0%, rgba(10, 22, 18, 0.65) 50%, rgba(10, 22, 18, 0.85) 100%),
    linear-gradient(to right, rgba(10, 22, 18, 0.75) 0%, rgba(10, 22, 18, 0.2) 55%, rgba(10, 22, 18, 0.6) 100%),
    url('assets/jungle-hero-bg.png') center center / cover no-repeat;
  border: 1px solid rgba(201, 162, 39, 0.1);
  box-shadow: inset 0 0 120px rgba(0, 0, 0, 0.5);
}

.hero::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 120px;
  background: linear-gradient(to top, rgba(10, 22, 18, 0.9), transparent);
  pointer-events: none;
  z-index: 1;
}

.hero-mesh {
  background:
    radial-gradient(circle at 15% 85%, rgba(201, 162, 39, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 85% 15%, rgba(61, 107, 82, 0.12) 0%, transparent 35%);
}

.hero-circle { background: rgba(201, 162, 39, 0.06); }

.hero-paw { color: rgba(201, 162, 39, 0.2); }
.hero-sparkle { color: rgba(201, 162, 39, 0.35); }

.hero-highlight {
  color: var(--gold-light);
  font-style: italic;
  text-shadow: 0 2px 20px rgba(201, 162, 39, 0.4);
}

.hero-animal {
  border: 3px solid rgba(201, 162, 39, 0.25);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(201, 162, 39, 0.08);
}

.hero-float-card {
  background: rgba(10, 22, 18, 0.82);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(201, 162, 39, 0.2);
  color: var(--cream);
}

.hero-float-card div strong { color: var(--gold-light); }

/* ---- Stats ---- */
.stat-card {
  background: linear-gradient(145deg, #1a3d2f, #0f1f18);
  border: 1px solid rgba(201, 162, 39, 0.2);
  box-shadow: var(--shadow-medium);
}

.stat-card:hover {
  border-color: var(--gold);
  box-shadow: var(--shadow-glow);
}

.stat-number { color: var(--gold-light); }

/* ---- Mission / Bento ---- */
.mission-section {
  background: var(--jungle-dark);
  position: relative;
}

.mission-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(45, 90, 69, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

.bento-card {
  background: rgba(18, 32, 25, 0.85);
  border: 1px solid rgba(201, 162, 39, 0.1);
  color: var(--cream);
  backdrop-filter: blur(8px);
}

.bento-card:hover {
  border-color: rgba(201, 162, 39, 0.35);
  box-shadow: var(--shadow-glow);
}

.bento-card::after {
  background: linear-gradient(135deg, rgba(201, 162, 39, 0.06), transparent);
}

.bento-featured {
  background: linear-gradient(145deg, #1a3d2f 0%, #0f1f18 100%);
  border-color: rgba(201, 162, 39, 0.25);
}

.bento-medium {
  background: rgba(26, 61, 47, 0.5);
}

.bento-small {
  background: rgba(15, 31, 24, 0.9);
}

.bento-small:nth-child(3) {
  background: linear-gradient(135deg, rgba(26, 61, 47, 0.6), rgba(15, 31, 24, 0.9));
}

.bento-card h3 { color: var(--cream); }
.bento-card-text { color: var(--text-gray); }

.bento-featured .bento-card-text,
.bento-medium .bento-card-text,
.bento-small .bento-card-text {
  color: rgba(245, 240, 230, 0.86);
}

.bento-icon {
  background: rgba(201, 162, 39, 0.12);
  color: var(--gold);
}

.bento-arrow {
  background: rgba(201, 162, 39, 0.15);
  color: var(--gold-light);
}

.bento-arrow:hover { background: var(--gold); color: var(--jungle-deep); }

/* ---- Story ---- */
.story-section {
  background:
    linear-gradient(180deg, var(--jungle-dark) 0%, rgba(26, 61, 47, 0.3) 50%, var(--jungle-dark) 100%);
}

.story-content h2 { color: var(--cream); }
.story-content p { color: var(--text-gray); }

.story-section .section-title,
.story-content h2,
.story-badge,
.story-content strong {
  color: var(--gold-light);
}

.story-img {
  border: 3px solid rgba(201, 162, 39, 0.2);
  box-shadow: var(--shadow-strong);
}

.story-badge {
  background: rgba(201, 162, 39, 0.12);
  color: var(--gold-light);
  border: 1px solid rgba(201, 162, 39, 0.25);
}

/* ---- Rescue ---- */
.rescue-section { background: var(--soft-gray); }

.rescue-header .section-title { color: var(--cream); }

.rescue-section .section-title,
.rescue-section .section-eyebrow,
.process-step h3,
.rescue-card h3,
.rescue-card h4 {
  color: var(--gold-light);
}

.process-step {
  background: rgba(18, 32, 25, 0.9);
  border: 1px solid rgba(201, 162, 39, 0.1);
}

.process-step-number {
  background: linear-gradient(135deg, var(--gold-antique), var(--gold-light));
  color: var(--jungle-deep);
}

.process-step h3 { color: var(--cream); }
.process-step-text { color: var(--text-gray); }

.rescue-card {
  background: rgba(18, 32, 25, 0.92);
  border: 1px solid rgba(201, 162, 39, 0.12);
  color: var(--cream);
}

.rescue-card:hover {
  border-color: rgba(201, 162, 39, 0.35);
  box-shadow: var(--shadow-glow);
}

.rescue-card-icon {
  background: rgba(201, 162, 39, 0.1);
  color: var(--gold);
}

.filter-btn {
  background: rgba(18, 32, 25, 0.8);
  color: var(--text-gray);
  border: 1px solid rgba(201, 162, 39, 0.15);
}

.filter-btn.active,
.filter-btn:hover {
  background: rgba(201, 162, 39, 0.15);
  color: var(--gold-light);
  border-color: var(--gold);
}

/* ---- Animals ---- */
.animals-section {
  background:
    linear-gradient(180deg, var(--jungle-dark) 0%, rgba(15, 31, 24, 0.95) 100%);
}

.animal-card {
  background: rgba(18, 32, 25, 0.9);
  border: 1px solid rgba(201, 162, 39, 0.1);
}

.animal-card:hover {
  border-color: rgba(201, 162, 39, 0.35);
  box-shadow: var(--shadow-glow);
}

.animal-info h3 { color: var(--cream); }
.animal-info p { color: var(--text-gray); }

.animals-section .section-title,
.animals-section .section-eyebrow,
.animal-info h3,
.animal-name,
.animal-card strong {
  color: var(--gold-light);
}

.animal-tag {
  background: rgba(201, 162, 39, 0.12);
  color: var(--gold-light);
}

.animal-status {
  background: rgba(74, 124, 89, 0.25);
  color: var(--hope-green);
}

/* ---- Founder ---- */
.founder-section {
  background: var(--soft-gray);
  position: relative;
}

.founder-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 50% 60% at 80% 50%, rgba(201, 162, 39, 0.05) 0%, transparent 70%);
  pointer-events: none;
}

.founder-name { color: var(--cream); }
.founder-name-main { color: var(--gold-light); }
.founder-title { color: var(--gold); }
.founder-story p { color: var(--text-gray); }

.founder-section .section-eyebrow,
.founder-name,
.founder-quote,
.founder-signature {
  color: var(--gold-light);
}

.founder-quote {
  background: rgba(18, 32, 25, 0.8);
  border-left: 3px solid var(--gold);
  color: var(--cream);
}

.founder-stat-num { color: var(--gold-light); }
.founder-stat-label { color: var(--text-gray); }

.founder-badge {
  background: rgba(201, 162, 39, 0.1);
  color: var(--gold-light);
  border: 1px solid rgba(201, 162, 39, 0.25);
}

.founder-ring-outer { border-color: rgba(201, 162, 39, 0.3); }
.founder-ring-inner { border-color: rgba(201, 162, 39, 0.15); }

.founder-portrait {
  border: 3px solid rgba(201, 162, 39, 0.25);
}

.founder-credential {
  background: rgba(10, 22, 18, 0.88);
  color: var(--gold-light);
  border: 1px solid rgba(201, 162, 39, 0.2);
}

/* ---- Volunteer (index) ---- */
.volunteer-section { background: var(--jungle-dark); }

.volunteer-card {
  background: rgba(18, 32, 25, 0.9);
  border: 1px solid rgba(201, 162, 39, 0.1);
}

.volunteer-card::before {
  background: linear-gradient(90deg, var(--gold-antique), var(--gold-light));
}

.volunteer-card:hover {
  border-color: rgba(201, 162, 39, 0.35);
  box-shadow: var(--shadow-glow);
}

.volunteer-card-icon {
  background: rgba(201, 162, 39, 0.1);
  color: var(--gold);
}

.volunteer-card:hover .volunteer-card-icon {
  background: linear-gradient(135deg, var(--gold-antique), var(--gold-light));
  color: var(--jungle-deep);
}

.volunteer-card h3 { color: var(--cream); }
.volunteer-card p { color: var(--text-gray); }
.volunteer-description { color: var(--text-gray); }

.volunteer-section .section-title,
.volunteer-section .section-eyebrow,
.volunteer-card h3 {
  color: var(--gold-light);
}

/* ---- Adoption ---- */
.adoption-section { background: var(--soft-gray); }

.adoption-card {
  background:
    linear-gradient(135deg, rgba(26, 61, 47, 0.95) 0%, rgba(10, 22, 18, 0.98) 100%);
  border: 1px solid rgba(201, 162, 39, 0.2);
}

.adoption-title { color: var(--cream); }
.adoption-text { color: var(--text-gray); }
.adoption-heart, .adoption-paw { color: rgba(201, 162, 39, 0.2); }

.adoption-title,
.adoption-section .section-eyebrow {
  color: var(--gold-light);
}

.adoption-image {
  border: 3px solid rgba(201, 162, 39, 0.2);
}

/* ---- Transparency ---- */
.transparency-section { background: var(--jungle-dark); }

.transparency-card {
  background: rgba(18, 32, 25, 0.9);
  border: 1px solid rgba(201, 162, 39, 0.1);
}

.transparency-card:hover {
  border-color: rgba(201, 162, 39, 0.3);
}

.transparency-icon {
  background: rgba(201, 162, 39, 0.1);
  color: var(--gold);
}

.transparency-card h3 { color: var(--cream); }
.transparency-card p { color: var(--text-gray); }

.transparency-section .section-title,
.transparency-section .section-eyebrow,
.transparency-card h3 {
  color: var(--gold-light);
}

.transparency-statement {
  background: rgba(201, 162, 39, 0.08);
  border: 1px solid rgba(201, 162, 39, 0.2);
  color: var(--gold-light);
}

/* ---- Gallery ---- */
.gallery-section { background: var(--soft-gray); }

.gallery-item {
  border: 2px solid rgba(201, 162, 39, 0.1);
  box-shadow: var(--shadow-soft);
}

.gallery-item:hover {
  border-color: rgba(201, 162, 39, 0.35);
  box-shadow: var(--shadow-glow);
}

.gallery-overlay {
  background: linear-gradient(to top, rgba(10, 22, 18, 0.85) 0%, transparent 60%);
}

/* ---- Contact ---- */
.contact-section {
  background:
    linear-gradient(135deg, rgba(10, 22, 18, 0.95) 0%, rgba(26, 61, 47, 0.9) 50%, rgba(15, 31, 24, 0.95) 100%),
    url('assets/jungle-hero-bg.png') center / cover no-repeat;
  border: 1px solid rgba(201, 162, 39, 0.15);
}

.contact-form-wrap {
  background: rgba(10, 22, 18, 0.75);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(201, 162, 39, 0.15);
}

.contact-detail {
  background: rgba(10, 22, 18, 0.6);
  border: 1px solid rgba(201, 162, 39, 0.1);
}

.contact-detail-icon {
  background: rgba(201, 162, 39, 0.12);
  color: var(--gold);
}

.contact-detail a { color: var(--gold-light); }
.contact-detail a:hover { color: var(--cream); }

.contact-section .contact-title,
.contact-section .contact-heading,
.contact-section .section-eyebrow,
.contact-section strong,
.contact-section .contact-detail strong {
  color: var(--gold-light);
}

.social-link {
  background: rgba(201, 162, 39, 0.1);
  border: 1px solid rgba(201, 162, 39, 0.2);
  color: var(--gold-light);
}

.social-link:hover {
  background: var(--gold);
  color: var(--jungle-deep);
}

.form-group input,
.form-group select,
.form-group textarea {
  background: rgba(10, 22, 18, 0.8);
  border: 1px solid rgba(201, 162, 39, 0.2);
  color: var(--cream);
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.15);
}

.form-group label { color: var(--cream); }
.form-group input::placeholder,
.form-group textarea::placeholder { color: rgba(154, 171, 154, 0.6); }

.form-group label,
.required {
  color: var(--gold-light);
}

.form-success {
  background: rgba(74, 124, 89, 0.2);
  color: var(--hope-green);
  border: 1px solid rgba(74, 124, 89, 0.3);
}

.form-error { color: #e8a87c; }

.process-paw { color: rgba(201, 162, 39, 0.4); }
.process-paw.active { color: var(--gold); }

.rescue-form .form-group input,
.rescue-form .form-group select,
.rescue-form .form-group textarea {
  background: rgba(10, 22, 18, 0.7);
  border-color: rgba(201, 162, 39, 0.2);
  color: var(--cream);
}

/* ---- Footer ---- */
.footer {
  background:
    linear-gradient(to bottom, #0a1612, #060e0b);
  border-top: 1px solid rgba(201, 162, 39, 0.15);
  position: relative;
  overflow: hidden;
}

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

.footer::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 80px;
  background: linear-gradient(to top, rgba(45, 90, 69, 0.08), transparent);
  pointer-events: none;
}

.footer-tagline {
  font-family: var(--font-handwritten);
  font-style: italic;
  color: var(--gold-light);
}

.footer-logo span,
.footer-nav a,
.footer-bottom p {
  color: rgba(245, 240, 230, 0.9);
}

.footer-nav a:hover { color: var(--gold-light); }
.footer-statement { color: var(--gold); }

/* ---- Modal & Lightbox ---- */
.modal-overlay { background: rgba(6, 12, 10, 0.85); }

.modal {
  background: rgba(18, 32, 25, 0.98);
  border: 1px solid rgba(201, 162, 39, 0.2);
  color: var(--cream);
}

.modal-title { color: var(--cream); }
.modal-subtitle { color: var(--text-gray); }

.modal-title,
.modal label {
  color: var(--gold-light);
}

.modal-close {
  background: rgba(201, 162, 39, 0.1);
  color: var(--gold-light);
}

.modal-close:hover { background: var(--gold); color: var(--jungle-deep); }

.lightbox { background: rgba(6, 12, 10, 0.92); }

.lightbox-nav,
.lightbox-close {
  background: rgba(201, 162, 39, 0.15);
  color: var(--gold-light);
  border: 1px solid rgba(201, 162, 39, 0.25);
}

.lightbox-nav:hover,
.lightbox-close:hover {
  background: var(--gold);
  color: var(--jungle-deep);
}

.lightbox-caption { color: var(--cream); }

/* ---- Back to Top ---- */
.back-to-top {
  background: linear-gradient(135deg, #1a3d2f, #2d5a45);
  color: var(--gold-light);
  border: 1px solid rgba(201, 162, 39, 0.3);
  box-shadow: var(--shadow-gold);
}

.back-to-top:hover {
  background: var(--gold);
  color: var(--jungle-deep);
}

/* ---- Volunteer Page Overrides ---- */
.vol-hero {
  background:
    linear-gradient(to bottom, rgba(10, 22, 18, 0.5) 0%, rgba(10, 22, 18, 0.8) 100%),
    url('assets/jungle-hero-bg.png') center / cover no-repeat;
  border-bottom: 1px solid rgba(201, 162, 39, 0.1);
}

.vol-stories { background: var(--jungle-dark); }

.vol-slider-viewport {
  border-color: rgba(201, 162, 39, 0.15);
  background: rgba(15, 31, 24, 0.9);
}

.vol-slide-body h3 { color: var(--cream); }
.vol-slide-tag {
  background: rgba(201, 162, 39, 0.12);
  color: var(--gold-light);
}

.vol-stories .section-title,
.vol-gallery-section .section-title,
.vol-cta-section h2,
.vol-slide-body h3,
.vol-gallery-slide figcaption {
  color: var(--gold-light);
}

.vol-slider-arrow,
.vol-gallery-arrow {
  background: rgba(18, 32, 25, 0.95);
  color: var(--gold-light);
  border-color: rgba(201, 162, 39, 0.25);
}

.vol-slider-arrow:hover,
.vol-gallery-arrow:hover {
  background: var(--gold);
  color: var(--jungle-deep);
}

.vol-dot.is-active,
.vol-gdot.is-active {
  background: linear-gradient(90deg, var(--gold-antique), var(--gold-light));
}

.vol-gallery-section { background: var(--soft-gray); }

.vol-gallery-viewport {
  background: var(--jungle-deep);
  border: 1px solid rgba(201, 162, 39, 0.15);
}

.vol-gallery-slide figcaption {
  background: linear-gradient(to top, rgba(10, 22, 18, 0.9), transparent);
}

.vol-gallery-counter { color: var(--gold); }

.vol-gthumb.is-active {
  border-color: var(--gold);
  box-shadow: var(--shadow-gold);
}

.vol-roles { background: var(--jungle-dark); }
.vol-cta-section { background: var(--soft-gray); }

.vol-cta-card {
  background: linear-gradient(135deg, #0f1f18, #1a3d2f);
  border: 1px solid rgba(201, 162, 39, 0.2);
}

.vol-cta-stats strong { color: var(--gold-light); }

/* ---- Focus States ---- */
:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

/* ---- Reduced Motion ---- */
@media (prefers-reduced-motion: reduce) {
  .page-wrapper::before { animation: none; }
}

/* ---- Mobile ---- */
@media (max-width: 768px) {
  .hero {
    background-position: center 30%;
  }

  .navbar-menu {
    background: rgba(10, 22, 18, 0.97);
    border: 1px solid rgba(201, 162, 39, 0.15);
  }

  .page-wrapper::before { opacity: 0.02; }
}