:root {
        --color1: #202a07;
        --color2: #12611b;
        --color3: #ea4888;
        --color4: #f1c879;
        --color5: #f8efe7;
      }

      body {
        background-color: var(--color5);
        color: var(--color1);
        font-family: "Georgia", "Times New Roman", Times, serif; 
        overflow-x: hidden; 
      }

      
      .parallax-bg-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        overflow: hidden;
      }

      .parallax-bg {
        width: 100%;
        height: 120%; 
        object-fit: cover;
        position: absolute;
        top: -10%; 
        left: 0;
        z-index: -1;
        will-change: transform; 
      }

      
      .reveal-on-scroll {
        opacity: 0;
        transform: translateY(40px);
        transition: opacity 1.2s cubic-bezier(0.165, 0.84, 0.44, 1),
          transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition-delay: 0.1s;
      }

      .reveal-on-scroll.is-visible {
        opacity: 1;
        transform: translateY(0);
      }

      
      .deco-shape-1 {
        position: absolute;
        width: 200px;
        height: 200px;
        background-color: var(--color4);
        opacity: 0.2;
        border-radius: 50%;
        filter: blur(20px);
        z-index: -1;
      }

      .deco-line {
        width: 100px;
        height: 2px;
        background-color: var(--color3);
        margin: 20px 0;
      }

      
      .btn {
        display: inline-block;
        padding: 12px 28px;
        background-color: var(--color3);
        color: var(--color5);
        text-decoration: none;
        border: 2px solid var(--color3);
        transition: all 0.3s ease;
        font-weight: bold;
        letter-spacing: 0.5px;
      }
      .btn:hover {
        background-color: transparent;
        color: var(--color3);
      }

      .btn-secondary {
        background-color: var(--color4);
        color: var(--color1);
        border-color: var(--color4);
      }
      .btn-secondary:hover {
        background-color: transparent;
        color: var(--color4);
      }

      
      .complex-layout-1 {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        gap: 20px;
        align-items: center;
      }

      
      #mobile-nav {
        transform: translateX(100%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      }
      #mobile-nav.open {
        transform: translateX(0);
      }