/* Shared public storefront motion. Content remains visible when JavaScript is unavailable. */
.storefront-ui .storefront-stroke-title {
    width: min(100%, 820px);
    line-height: 1;
}

.storefront-ui .storefront-stroke-title-svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

.storefront-ui .storefront-stroke-title-text {
    font-family: Prompt, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 92px;
    font-weight: 600;
    letter-spacing: -1.5px;
    fill: transparent;
    stroke: #75dce8;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1800;
    stroke-dashoffset: 1800;
    paint-order: stroke fill;
    animation: storefront-stroke-draw 2.2s cubic-bezier(0.2, 0.7, 0.2, 1) 0.12s forwards,
        storefront-stroke-fill 0.68s ease 1.95s forwards;
}

.storefront-ui .storefront-stroke-title-text + .storefront-stroke-title-text {
    animation-delay: 0.26s, 2.08s;
}

.storefront-ui .storefront-hero-kicker {
    animation: storefront-hero-focus 0.55s cubic-bezier(0.2, 0.7, 0.2, 1) 0.04s both;
}

.storefront-ui .storefront-hero-lead {
    animation: storefront-hero-focus 0.65s cubic-bezier(0.2, 0.7, 0.2, 1) 0.58s both;
}

.storefront-ui .storefront-hero-actions {
    animation: storefront-hero-focus 0.65s cubic-bezier(0.2, 0.7, 0.2, 1) 0.72s both;
}

.storefront-ui .storefront-hero-assurance {
    animation: storefront-hero-focus 0.72s cubic-bezier(0.2, 0.7, 0.2, 1) 0.84s both;
}

.storefront-ui .storefront-motion-item {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    transition: opacity 0.52s cubic-bezier(0.2, 0.7, 0.2, 1),
        transform 0.52s cubic-bezier(0.2, 0.7, 0.2, 1);
    transition-delay: 0s;
}

.storefront-ui .storefront-motion-item.storefront-motion-delay-1 { transition-delay: 0.05s; }
.storefront-ui .storefront-motion-item.storefront-motion-delay-2 { transition-delay: 0.10s; }
.storefront-ui .storefront-motion-item.storefront-motion-delay-3 { transition-delay: 0.15s; }

.storefront-ui .storefront-motion-item.is-storefront-motion-visible {
    opacity: 1;
    transform: none;
}

@keyframes storefront-stroke-draw {
    to { stroke-dashoffset: 0; }
}

@keyframes storefront-stroke-fill {
    to { fill: #ffffff; stroke: #ffffff; }
}

@keyframes storefront-hero-focus {
    from { opacity: 0; transform: translateY(11px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 700px) {
    .storefront-ui .storefront-stroke-title-text {
        font-size: 78px;
        stroke-width: 1.7;
    }

    .storefront-ui .storefront-motion-item {
        transform: translate3d(0, 12px, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .storefront-ui .storefront-hero-kicker,
    .storefront-ui .storefront-hero-lead,
    .storefront-ui .storefront-hero-actions,
    .storefront-ui .storefront-hero-assurance {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .storefront-ui .storefront-motion-item,
    .storefront-ui .storefront-motion-item.is-storefront-motion-visible {
        opacity: 1;
        transform: none;
        transition: none;
    }
}