﻿@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    #mainContent {
        padding-top: 145px;
    }

    .detail-wrapper {
        width: 100%;
        padding: 0 40px;
    }

    .content-top-wrapper {
        width: min(100%, 1040px);
        max-width: none;
        display: grid;
        grid-template-columns: minmax(360px, 440px) minmax(360px, 1fr);
        align-items: center;
        gap: clamp(70px, 8vw, 120px);
    }

    .detail-img-container {
        width: 100%;
        margin-bottom: 0;
        border-radius: 34px;
    }

    .info-content {
        align-items: flex-start;
        text-align: left;
        padding: 30px 0;
    }

    .detail-title {
        font-size: clamp(2.25rem, 3vw, 3.15rem);
        line-height: 1.12;
        margin-bottom: 14px;
    }

    .sub-title {
        max-width: 500px;
        font-size: 1.2rem;
        line-height: 1.55;
        margin-bottom: 24px;
    }

    .detail-price-tag {
        font-size: 2.15rem;
        margin-bottom: 14px;
    }

    .status-container {
        justify-content: flex-start;
        margin: 8px 0 26px;
    }

    .buy-button {
        min-width: 260px;
        margin: 0;
        text-align: center;
    }

    .detail-card {
        width: min(100%, 1040px);
        max-width: none;
        padding: 42px 54px;
        margin-top: 70px;
        border-radius: 30px;
    }

    .process-title-header {
        font-size: 1.4rem;
        margin-top: 26px;
    }

    .step-text,
    .product-intro {
        font-size: 1.12rem;
        line-height: 1.7;
    }
}

.status-tag {
    transform-origin: top right;
    animation: floating-tag 3s ease-in-out infinite;
    display: inline-block;
}

@keyframes floating-tag {
    0%, 100% { transform: rotate(-5deg); }
    50% { transform: rotate(5deg); }
}
