/* Shared audience landing-page hero system. */
.hz-hero { position: relative; overflow: hidden; background: var(--stone-50); padding-top: 3.5rem; }
.hz-bg { position: absolute; inset: 0; pointer-events: none; }
.hz-blob { position: absolute; border-radius: 50%; filter: blur(90px); }
.hz-blob-a { width: 34rem; height: 34rem; left: -10rem; top: -11rem; background: radial-gradient(circle, var(--primary-200), transparent 65%); opacity: .6; }
.hz-blob-b { width: 40rem; height: 40rem; right: -12rem; top: -6rem; background: radial-gradient(circle, var(--primary-100), transparent 65%); opacity: .55; }
.hz-blob-c { width: 28rem; height: 28rem; left: 32%; bottom: -14rem; background: radial-gradient(circle, var(--accent-500), transparent 65%); opacity: .22; }
.hz-gridlines { position: absolute; inset: 0;
    background-image: linear-gradient(rgba(13,148,136,.06) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(13,148,136,.06) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: radial-gradient(ellipse 85% 70% at 50% 25%, var(--stone-900) 30%, transparent 100%);
            mask-image: radial-gradient(ellipse 85% 70% at 50% 25%, var(--stone-900) 30%, transparent 100%); }
.hz-wrap { position: relative; z-index: 1; max-width: 76rem; margin: 0 auto; padding: 0 1.25rem; display: grid; gap: 3rem; }
.hz-copy { max-width: 36rem; margin: 0 auto; text-align: left; }
.hz-eyebrow { display: inline-flex; align-items: center; gap: .55rem; background: rgba(13,148,136,.08); border: 1px solid rgba(13,148,136,.25); color: var(--primary-700); font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: .45rem 1rem; border-radius: 999px; margin-bottom: 1.5rem; }
.hz-eyebrow-dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--primary-500); animation: hz-pulse 2.2s ease-in-out infinite; }
.hz-title { font-family: 'Fraunces', 'Noto Serif SC', Georgia, serif; font-weight: 600; font-size: clamp(2.4rem, 1rem + 4.5vw, 4.3rem); line-height: 1.05; letter-spacing: -.02em; color: var(--stone-900); margin-bottom: 1.4rem; }
.hz-title-grad { background: linear-gradient(92deg,var(--primary-600),var(--primary-700)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hz-underline { position: relative; white-space: nowrap; }
.hz-underline svg { position: absolute; left: 0; bottom: -.14em; width: 100%; height: .3em; overflow: visible; }
.hz-underline path { fill: none; stroke: var(--accent-500); stroke-width: 7; stroke-linecap: round; stroke-dasharray: 330; stroke-dashoffset: 330; animation: hz-draw .9s .7s cubic-bezier(.6, 0, .3, 1) forwards; }
.hz-sub { font-size: 1.13rem; line-height: 1.65; color: var(--stone-600); margin-bottom: 2rem; max-width: 33rem; }
.hz-sub strong { color: var(--stone-800); }
.hz-ctas { display: flex; flex-wrap: wrap; gap: .9rem; align-items: center; margin-bottom: 1.4rem; }
.hz-btn-primary { display: inline-flex; align-items: center; gap: .6rem; background: var(--primary-500); color: white; font-weight: 700; font-size: 1.05rem; padding: .95rem 1.8rem; border-radius: 1rem; box-shadow: 0 12px 28px -10px rgba(28,25,23,.32); transition: transform .18s ease, box-shadow .18s ease, background .18s ease; border: none; cursor: pointer; font-family: inherit; }
.hz-btn-primary:hover { background: var(--primary-700); transform: translateY(-2px); box-shadow: 0 18px 34px -10px rgba(28,25,23,.38); }
.hz-btn-primary .hz-arrow { transition: transform .18s ease; }
.hz-btn-primary:hover .hz-arrow { transform: translateX(3px); }
.hz-btn-chat { padding: .8rem 1.4rem; }
.hz-btn-chat .hz-chat-label { font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; }
.hz-proof { font-size: .92rem; line-height: 1.55; color: var(--stone-500); max-width: 30rem; }
.hz-proof strong { color: var(--accent-500); font-weight: 800; }

/* Floating product-UI cards */
.hz-visual { position: relative; max-width: 26rem; width: 100%; margin: 0 auto; display: grid; gap: 1rem; justify-items: start; }
.hz-card { background: rgba(255,255,255,.86); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(28,25,23,.08); border-radius: 1.25rem; box-shadow: 0 24px 48px -24px rgba(28,25,23,.3); padding: 1.25rem 1.4rem; }
.hz-card-main { position: relative; z-index: 2; transform: rotate(-1.5deg); width: 100%; }
.hz-card-head { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.hz-avatar { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: linear-gradient(135deg, var(--primary-500), var(--primary-700)); color: white; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: .9rem; }
.hz-card-head-name { font-weight: 700; color: var(--stone-900); font-size: .95rem; line-height: 1.2; }
.hz-card-head-meta { font-size: .78rem; color: var(--stone-400); }
.hz-ring-row { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.1rem; }
.hz-ring { width: 4.4rem; height: 4.4rem; border-radius: 50%; background: conic-gradient(var(--primary-600) 0 68%, var(--stone-200) 68% 100%); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.hz-ring-inner { width: 3.3rem; height: 3.3rem; border-radius: 50%; background: white; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.15rem; color: var(--primary-700); }
.hz-ring-label { font-size: .84rem; font-weight: 700; color: var(--stone-700); }
.hz-ring-sub { font-size: .76rem; color: var(--primary-600); font-weight: 600; }
.hz-ring-sub i { margin-right: .2rem; }
.hz-bar-label { display: flex; justify-content: space-between; font-size: .75rem; font-weight: 600; color: var(--stone-500); margin-bottom: .35rem; }
.hz-bar { height: .5rem; border-radius: 999px; background: var(--stone-100); overflow: hidden; }
.hz-bar-fill { height: 100%; width: 42%; border-radius: 999px; background: linear-gradient(90deg, var(--primary-500), var(--primary-700)); }
.hz-card-chat { display: flex; gap: .7rem; align-items: flex-start; transform: rotate(2deg); position: relative; z-index: 3; }
.hz-aurora-avatar { width: 2.1rem; height: 2.1rem; border-radius: 50%; background: linear-gradient(135deg, var(--primary-500), var(--primary-700)); color: white; display: flex; align-items: center; justify-content: center; font-size: .78rem; flex-shrink: 0; }
.hz-chat-name { font-size: .7rem; font-weight: 700; color: var(--primary-700); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .2rem; }
.hz-chat-text { font-size: .88rem; color: var(--stone-700); line-height: 1.45; }
.hz-chat-text i { color: var(--accent-500); margin-left: .2rem; }
.hz-chip { display: inline-flex; align-items: center; gap: .5rem; background: rgba(255,255,255,.92); border: 1px solid rgba(28,25,23,.08); border-radius: 999px; padding: .55rem 1rem; font-size: .8rem; font-weight: 700; color: var(--stone-700); box-shadow: 0 12px 24px -14px rgba(28,25,23,.3); }
.hz-chip i { color: var(--primary-600); }
.hz-chip-interview i { color: var(--accent-500); }

/* Grad-pivot marquee */
.hz-marquee { position: relative; z-index: 1; margin-top: 3.5rem; border-top: 1px solid rgba(28,25,23,.08); padding: .95rem 0; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, var(--stone-900) 8%, var(--stone-900) 92%, transparent);
            mask-image: linear-gradient(90deg, transparent, var(--stone-900) 8%, var(--stone-900) 92%, transparent); }
.hz-marquee-track { display: flex; width: max-content; animation: hz-scroll 38s linear infinite; }
.hz-marquee-track > span { display: inline-flex; align-items: center; gap: 2.25rem; padding-right: 2.25rem; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--stone-400); white-space: nowrap; }
.hz-marquee-track i { font-style: normal; color: var(--accent-500); }

/* Shared-body image overlays keep the existing photography in the brand palette. */
.landing-cta-backdrop {
    background-image: linear-gradient(to bottom right,
        color-mix(in srgb, var(--primary-50) 90%, transparent),
        color-mix(in srgb, white 90%, transparent)),
        var(--landing-section-image);
}
.landing-about-backdrop {
    background-image: linear-gradient(to bottom right,
        color-mix(in srgb, var(--primary-50) 70%, transparent),
        color-mix(in srgb, var(--stone-50) 70%, transparent)),
        var(--landing-section-image);
}

/* Motion */
.hz-rise { opacity: 0; animation: hz-rise .8s cubic-bezier(.16, 1, .3, 1) forwards; }
.hz-rise-1 { animation-delay: .05s } .hz-rise-2 { animation-delay: .15s } .hz-rise-3 { animation-delay: .25s }
.hz-rise-4 { animation-delay: .35s } .hz-rise-5 { animation-delay: .45s }
@keyframes hz-rise { from { opacity: 0; transform: translateY(16px) } to { opacity: 1; transform: none } }
@keyframes hz-pulse { 0%, 100% { opacity: 1 } 50% { opacity: .35 } }
@keyframes hz-draw { to { stroke-dashoffset: 0 } }
@keyframes hz-float { 0%, 100% { translate: 0 0 } 50% { translate: 0 -10px } }
@keyframes hz-scroll { to { transform: translateX(-50%) } }

@media (min-width: 1024px) {
    .hz-hero { padding-top: 5rem; }
    .hz-wrap { grid-template-columns: 1.05fr .95fr; align-items: center; gap: 4rem; padding: 0 2rem; }
    .hz-copy { margin: 0; max-width: none; }
    .hz-visual { max-width: none; height: 29rem; display: block; }
    .hz-card-main { position: absolute; top: 4.6rem; left: 1rem; width: 21rem; animation: hz-float 7s ease-in-out infinite; }
    .hz-card-chat { position: absolute; top: 0; right: 0; width: 17rem; animation: hz-float 8s ease-in-out 1.2s infinite; }
    .hz-chip-offer { position: absolute; bottom: 4.6rem; right: 2.5rem; transform: rotate(-2deg); animation: hz-float 6.5s ease-in-out .6s infinite; }
    .hz-chip-interview { position: absolute; bottom: 1rem; left: 3.5rem; transform: rotate(1.5deg); animation: hz-float 7.5s ease-in-out 1.8s infinite; }
}
@media (prefers-reduced-motion: reduce) {
    .hz-rise { opacity: 1; animation: none; }
    .hz-underline path { stroke-dashoffset: 0; animation: none; }
    .hz-card-main, .hz-card-chat, .hz-chip, .hz-eyebrow-dot, .hz-marquee-track { animation: none !important; }
}