@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600;700&family=Manrope:wght@400;500;600;700&display=swap');

    #aman-hero-01 {
      --aman-gold: #f3bd55;
      --aman-mx: 0;
      --aman-my: 0;
      --aman-honey-x: 0px;
      --aman-honey-y: 0px;
      --aman-balaman-x: 0px;
      --aman-balaman-y: 0px;
      position: relative;
      isolation: isolate;
      min-height: 100vh;
      min-height: 100svh;
      overflow: hidden;
      display: grid;
      place-items: center;
      padding: 110px 24px 80px;
      color: #fff;
      background: #17130b;
      font-family: Manrope, Arial, sans-serif;
    }
    #aman-hero-01, #aman-hero-01 * { box-sizing: border-box; }
    #aman-hero-01 .aman-bg {
      position: absolute;
      inset: -5%;
      z-index: -5;
      background: url("../images/mountains-v2.png") center/cover no-repeat;
      transform: translate3d(calc(var(--aman-mx) * -18px), calc(var(--aman-my) * -12px), 0) scale(1.09);
      will-change: transform;
    }
    #aman-hero-01 .aman-glow {
      position: absolute;
      z-index: -4;
      width: 52vw;
      height: 52vw;
      left: 50%;
      top: 44%;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255,202,100,.23), transparent 65%);
      filter: blur(10px);
      transform: translate3d(calc(-50% + var(--aman-mx) * 10px), calc(-50% + var(--aman-my) * 8px), 0);
    }
    #aman-hero-01 .aman-veil {
      position: absolute;
      inset: 0;
      z-index: -3;
      background: linear-gradient(90deg, rgba(12,10,5,.08), rgba(12,10,5,.22) 31%, rgba(12,10,5,.48) 50%, rgba(12,10,5,.17) 70%, rgba(12,10,5,.06)), linear-gradient(180deg, rgba(8,7,3,.28), transparent 28%, transparent 62%, rgba(8,7,3,.56));
    }
    #aman-hero-01 .aman-product,
    #aman-hero-01 .aman-balaman {
      position: absolute;
      z-index: -1;
      pointer-events: none;
      user-select: none;
      object-fit: contain;
      will-change: transform;
      filter: drop-shadow(0 22px 28px rgba(13,9,2,.32));
    }
    #aman-hero-01 .aman-product {
      left: clamp(-72px, -3vw, -20px);
      bottom: -3.5vh;
      width: clamp(350px, 34vw, 650px);
      transform: translate3d(var(--aman-honey-x), var(--aman-honey-y), 0);
    }
    #aman-hero-01 .aman-balaman {
      right: clamp(-35px, 1.8vw, 34px);
      bottom: -2vh;
      height: min(88vh, 920px);
      max-width: 43vw;
      transform: translate3d(var(--aman-balaman-x), var(--aman-balaman-y), 0);
    }
    #aman-hero-01 .aman-topbar {
      position: absolute;
      inset: 0 0 auto;
      z-index: 5;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 28px clamp(24px, 5vw, 80px);
    }
    #aman-hero-01 .aman-brand {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #fff;
      text-decoration: none;
    }
    #aman-hero-01 .aman-brand-mark {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      border: 1px solid rgba(255,238,190,.7);
      transform: rotate(45deg);
      font: 700 23px/1 "Cormorant Garamond", serif;
    }
    #aman-hero-01 .aman-brand-mark b { transform: rotate(-45deg); }
    #aman-hero-01 .aman-brand-name { font: 700 19px/1 "Cormorant Garamond", serif; letter-spacing: .18em; }
    #aman-hero-01 .aman-brand-name small { display: block; margin-top: 5px; font: 500 8px/1 Manrope, sans-serif; letter-spacing: .3em; color: #e8c98b; }
    #aman-hero-01 .aman-top-link { color: #fff; text-decoration: none; font-size: 12px; text-transform: uppercase; letter-spacing: .16em; }
    #aman-hero-01 .aman-content {
      position: relative;
      z-index: 2;
      width: min(650px, 92vw);
      margin-top: -1vh;
      text-align: center;
      transform: translate3d(calc(var(--aman-mx) * 15px), calc(var(--aman-my) * 11px), 0);
      will-change: transform;
    }
    #aman-hero-01 .aman-eyebrow { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0 0 16px; color: #f7d99e; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .28em; }
    #aman-hero-01 .aman-eyebrow i { width: 34px; height: 1px; background: currentColor; }
    #aman-hero-01 h1 { margin: 0; color: #fff; font: 700 clamp(52px, 7vw, 104px)/.8 "Cormorant Garamond", serif; letter-spacing: -.035em; text-shadow: 0 3px 34px rgba(0,0,0,.48); }
    #aman-hero-01 h1 em { color: var(--aman-gold); font-weight: 600; }
    #aman-hero-01 .aman-lead { max-width: 520px; margin: 28px auto 0; color: rgba(255,255,255,.86); font-size: clamp(14px, 1.25vw, 18px); line-height: 1.7; text-shadow: 0 2px 18px #000; }
    #aman-hero-01 .aman-actions { display: flex; justify-content: center; gap: 12px; margin-top: 30px; }
    #aman-hero-01 .aman-button { display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 52px; padding: 0 24px; border: 1px solid rgba(255,255,255,.4); color: #fff; text-decoration: none; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; transition: .25s ease; }
    #aman-hero-01 .aman-button:hover { transform: translateY(-2px); border-color: #fff; }
    #aman-hero-01 .aman-button-primary { color: #21180a; background: var(--aman-gold); border-color: var(--aman-gold); box-shadow: 0 10px 34px rgba(201,128,23,.28); }
    #aman-hero-01 .aman-button-primary:hover { background: #ffd06f; }
    #aman-hero-01 .aman-bee { position: absolute; z-index: 3; display: block; width: clamp(18px, 1.55vw, 28px); height: auto; pointer-events: none; object-fit: contain; filter: drop-shadow(0 3px 3px rgba(0,0,0,.45)); }
    #aman-hero-01 .aman-bee-one { left: 34%; top: 30%; transform: translate3d(calc(var(--aman-mx) * 32px), calc(var(--aman-my) * 24px), 0) rotate(-8deg); animation: amanFloat 4s ease-in-out infinite; }
    #aman-hero-01 .aman-bee-two { right: 31%; top: 63%; transform: translate3d(calc(var(--aman-mx) * 25px), calc(var(--aman-my) * 18px), 0) scaleX(-1) rotate(-12deg); animation: amanFloat 5.5s 1s ease-in-out infinite; }
    #aman-hero-01 .aman-bee-three { left: 43%; bottom: 13%; transform: translate3d(calc(var(--aman-mx) * 40px), calc(var(--aman-my) * 30px), 0) rotate(-8deg); animation: amanFloat 4.8s .3s ease-in-out infinite; }
    #aman-hero-01 .aman-particles { position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(circle, #ffe4a1 0 1px, transparent 1.6px); background-size: 97px 83px; opacity: .16; animation: amanDrift 16s linear infinite; }
    #aman-hero-01 .aman-scroll,
    #aman-hero-01 .aman-note { position: absolute; bottom: 28px; margin: 0; color: rgba(255,255,255,.65); font-size: 9px; text-transform: uppercase; letter-spacing: .25em; }
    #aman-hero-01 .aman-scroll { left: clamp(24px, 5vw, 80px); display: flex; align-items: center; gap: 10px; }
    #aman-hero-01 .aman-scroll i { width: 32px; height: 1px; background: currentColor; }
    #aman-hero-01 .aman-note { right: clamp(24px, 5vw, 80px); }
    @keyframes amanFloat { 50% { margin-top: -13px; } }
    @keyframes amanDrift { to { background-position: 97px -83px; } }

    @media (max-width: 760px) {
      #aman-hero-01 { padding: 100px 18px 72px; align-items: end; }
      #aman-hero-01 .aman-bg { inset: -3%; background-position: 56% center; transform: translate3d(calc(var(--aman-mx) * -7px), calc(var(--aman-my) * -5px), 0) scale(1.08); }
      #aman-hero-01 .aman-veil { z-index: -2; background: linear-gradient(180deg, rgba(8,7,3,.24), rgba(8,7,3,.06) 30%, rgba(8,7,3,.28) 58%, rgba(8,7,3,.82)); }
      #aman-hero-01 .aman-product { left: -13vw; bottom: 6.5vh; width: 61vw; transform: translate3d(var(--aman-honey-x), var(--aman-honey-y), 0); }
      #aman-hero-01 .aman-balaman { right: -10vw; bottom: 7vh; height: 67vh; max-width: 57vw; transform: translate3d(var(--aman-balaman-x), var(--aman-balaman-y), 0); }
      #aman-hero-01 .aman-topbar { padding: 20px; }
      #aman-hero-01 .aman-top-link { display: none; }
      #aman-hero-01 .aman-content { width: min(430px, 94vw); margin: 0 0 24px; transform: translate3d(calc(var(--aman-mx) * 6px), calc(var(--aman-my) * 5px), 0); }
      #aman-hero-01 h1 { font-size: clamp(46px, 15vw, 72px); }
      #aman-hero-01 .aman-lead { margin-top: 20px; font-size: 13px; max-width: 360px; }
      #aman-hero-01 .aman-actions { margin-top: 22px; }
      #aman-hero-01 .aman-button { min-height: 48px; padding: 0 17px; font-size: 10px; gap: 12px; }
      #aman-hero-01 .aman-bee { width: 20px; }
      #aman-hero-01 .aman-bee-one { left: 24%; top: 29%; }
      #aman-hero-01 .aman-bee-two { right: 21%; top: 49%; }
      #aman-hero-01 .aman-bee-three, #aman-hero-01 .aman-scroll { display: none; }
      #aman-hero-01 .aman-note { right: auto; left: 50%; bottom: 17px; transform: translateX(-50%); white-space: nowrap; font-size: 7px; }
      #aman-hero-01 .aman-eyebrow { font-size: 8px; letter-spacing: .2em; }
      #aman-hero-01 .aman-eyebrow i { width: 18px; }
    }
    @media (max-width: 430px) {
      #aman-hero-01 .aman-product { left: -9vw; bottom: 12vh; width: 64vw; }
      #aman-hero-01 .aman-balaman { right: -7vw; bottom: 13vh; height: 60vh; max-width: 60vw; }
      #aman-hero-01 .aman-content { padding-top: 40vh; margin-bottom: 8px; }
      #aman-hero-01 .aman-actions { flex-direction: column; align-items: center; }
      #aman-hero-01 .aman-button { width: min(260px, 90vw); }
    }
    @media (prefers-reduced-motion: reduce) {
      #aman-hero-01 .aman-bg, #aman-hero-01 .aman-glow, #aman-hero-01 .aman-product, #aman-hero-01 .aman-balaman, #aman-hero-01 .aman-content, #aman-hero-01 .aman-bee { transform: none !important; animation: none !important; }
      #aman-hero-01 .aman-particles { animation: none; }
      #aman-hero-01 .aman-button { transition: none; }
    }