/* 限量版 — 匹配参考图样式：
   图片左上角叠加 NEW 徽章、图片有浅灰边框、简介文字无链接、价格+收藏固定底部 */

.body-new-arrivals { background: #fff; }

.na-main {
    background: #fff;
    min-height: calc(100vh - 100px);
}

.na-page {
    max-width: 1280px;
    margin: 0 auto;
    padding: 56px 48px 100px;
    box-sizing: border-box;
}

/* ---- 页头 ---- */
.na-page-head { margin-bottom: 40px; }

.na-page-title {
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "MS PMincho", "Noto Serif JP", serif;
    font-size: clamp(26px, 3vw, 34px);
    font-weight: 600;
    color: #111;
    letter-spacing: 0.06em;
    margin: 0;
    line-height: 1.2;
}

/* ---- 四列网格 ---- */
.na-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 52px 32px;
    align-items: start;
}

@media (max-width: 1100px) { .na-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px)  {
    .na-grid { grid-template-columns: repeat(2, 1fr); gap: 36px 20px; }
    .na-page { padding: 32px 20px 80px; }
}

/* ---- 单卡 ---- */
.na-card { text-align: left; }

/* 图片 + NEW 叠加 */
.na-card__media {
    display: block;
    text-decoration: none;
    color: inherit;
}

.na-card__imgbox {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #fff;
    overflow: visible;
}

.na-card__imgbox img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    border: none;
    box-sizing: border-box;
}

/* NEW 徽章：绝对定位于图片左上角 */
.na-card__new {
    position: absolute;
    top: -8px;
    left: -8px;
    z-index: 2;
    background: #000;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 5px 13px;
    line-height: 1;
    font-family: "Helvetica Neue", Arial, sans-serif;
    display: inline-block;
}

/* 文字区 */
.na-card__body { margin-top: 18px; }

.na-card__intro {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.65;
    color: #111;
    /* 简介文字不设链接，直接段落 */
}

.na-card__media--static {
    cursor: default;
}

/* 底部：价格 + 收藏（与首页人気 popular-price-row 同逻辑） */
.na-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 4px;
    padding-top: 6px;
}

.na-card__prices {
    flex: 1;
    min-width: 0;
}

.na-card__price {
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
    font-size: 15px;
    color: #111;
    letter-spacing: 0.01em;
    line-height: 1.5;
}

.na-card__price--empty {
    color: #999;
}

/* 收藏：与首页 inline .popular-price-row 同色 #C9A86C（勿用 .na-card__fav，模板已是 .heart-icon-new） */
.na-card .heart-icon-new,
.na-pop-card .heart-icon-new {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    vertical-align: middle;
    padding: 0;
    background: transparent;
    border: none;
    outline: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.na-card .heart-icon-new:hover,
.na-pop-card .heart-icon-new:hover {
    opacity: 0.85;
    transform: scale(1.06);
}

.na-card .heart-icon-new svg,
.na-pop-card .heart-icon-new svg {
    width: 28px;
    height: 28px;
    color: #C9A86C;
}

.na-card .heart-icon-new svg .heart-circle,
.na-card .heart-icon-new svg .heart-path,
.na-pop-card .heart-icon-new svg .heart-circle,
.na-pop-card .heart-icon-new svg .heart-path {
    fill: none;
    stroke: #C9A86C;
    stroke-width: 1;
}

.na-card .heart-icon-new.liked svg .heart-circle,
.na-pop-card .heart-icon-new.liked svg .heart-circle {
    fill: none;
    stroke: #C9A86C;
}

.na-card .heart-icon-new.liked svg .heart-path,
.na-pop-card .heart-icon-new.liked svg .heart-path {
    fill: #C9A86C;
    stroke: #C9A86C;
}

/* ---- 空状态 ---- */
.na-empty {
    text-align: center;
    padding: 80px 20px;
    color: #666;
    font-size: 14px;
}

.na-empty__link {
    display: inline-block;
    margin-top: 20px;
    color: #111;
    font-size: 13px;
    text-decoration: underline;
}

.na-empty__link:hover { opacity: 0.7; }

/* ---- 人気 TOP8（4列・カテゴリタグ・本体価格のみ） ---- */
.na-popular {
    margin-top: 72px;
    padding-top: 56px;
}

.na-popular__head {
    margin-bottom: 40px;
    text-align: center;
}

.na-popular__title {
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "MS PMincho", "Noto Serif JP", serif;
    font-size: clamp(22px, 2.5vw, 28px);
    font-weight: 600;
    color: #111;
    letter-spacing: 0.08em;
    margin: 0 0 10px;
    line-height: 1.3;
}

.na-popular__subtitle {
    margin: 0;
    font-size: 13px;
    color: #666;
    letter-spacing: 0.04em;
}

.na-popular__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 48px 28px;
    align-items: start;
}

@media (max-width: 1100px) {
    .na-popular__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px) {
    .na-popular__grid { grid-template-columns: repeat(2, 1fr); gap: 36px 18px; }
    .na-popular { margin-top: 48px; padding-top: 40px; }
}

.na-pop-card {
    text-align: left;
}

.na-pop-card__media {
    display: block;
    text-decoration: none;
    color: inherit;
}

.na-pop-card__imgbox {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #fff;
}

.na-pop-card__imgbox img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    border: none;
    box-sizing: border-box;
}

.na-pop-card__new {
    position: absolute;
    top: -6px;
    left: -6px;
    z-index: 2;
    background: #000;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 5px 12px;
    line-height: 1;
    font-family: "Helvetica Neue", Arial, sans-serif;
}

.na-pop-card__body {
    margin-top: 16px;
}

.na-pop-card__name-link {
    text-decoration: none;
    color: inherit;
}

.na-pop-card__name-link:hover .na-pop-card__name {
    opacity: 0.65;
}

.na-pop-card__name {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 400;
    color: #111;
    font-family: "Yu Gothic", "YuGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
}

.na-pop-card__tag {
    display: inline-block;
    font-size: 11px;
    color: #333;
    border: 1px solid #ccc;
    padding: 3px 10px;
    margin-bottom: 10px;
    line-height: 1.4;
    letter-spacing: 0.02em;
}

.na-pop-card__price-row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    box-sizing: border-box;
    margin-top: 6px;
    padding-top: 6px;
}

.na-pop-card__price-main {
    margin: 0;
    flex: 1 1 0;
    min-width: 0;
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
    font-size: 13px;
    line-height: 1.5;
    color: #111;
    letter-spacing: 0.02em;
    word-break: break-word;
}

.na-pop-card__price-row .heart-icon-new {
    flex: 0 0 auto;
    align-self: center;
}

/* ============================
   搜索页排序标签（响应式）
   ============================ */
.sort-tabs {
    display: flex;
    gap: 32px;
    margin-bottom: 40px;
    border-bottom: 1px solid #e8e8e8;
    padding: 16px 0 20px;
    position: relative;
}

.sort-tabs a {
    text-decoration: none;
}

.sort-tab {
    font-size: 13px;
    color: #999;
    padding: 4px 0;
    position: relative;
    cursor: pointer;
    transition: color 0.25s;
    white-space: nowrap;
    letter-spacing: 0.02em;
}

.sort-tab:hover { color: #B5975F; }

.sort-tab.active {
    color: #B5975F;
    font-weight: 500;
}

.sort-tab.active::after {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #B5975F;
    z-index: 10;
}

/* 搜索页价格行 */
.na-card__prices {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 6px;
}

.na-card__price-original {
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
    font-size: 12px;
    color: #aaa;
    letter-spacing: 0.01em;
    text-decoration: line-through;
}

.na-card__price {
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
    font-size: 15px;
    color: #111;
    letter-spacing: 0.01em;
    line-height: 1.5;
}

.na-card__price-off {
    font-size: 11px;
    font-weight: 600;
    color: #C9A86C;
    letter-spacing: 0.02em;
    background: rgba(201, 168, 108, 0.1);
    padding: 2px 6px;
    border-radius: 3px;
    line-height: 1.4;
}

/* 移动端响应式 */
@media (max-width: 480px) {
    .sort-tabs {
        gap: 20px;
        margin-bottom: 28px;
        padding: 12px 0 16px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .sort-tabs::-webkit-scrollbar { display: none; }
}