.bx{ background:var(--v2-bg, #f6f1ec); padding-bottom:72px; }
.bx-hero .v2-hero__art img{ object-position:70% 50%; }
.bx-hero__stats{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.bx-hero__stats span{ display:inline-flex; align-items:center; gap:8px; height:34px; padding:0 13px; border:1px solid var(--v2-border); border-radius:999px; background:rgba(255,253,248,.75); backdrop-filter:blur(4px); color:#3a2e30; font-size:.84rem; font-weight:500; }
.bx-hero__stats i{ color:var(--v2-primary); font-size:.8rem; }

.bx-bar{ position:relative; z-index:2; margin-top:-40px; }
.bx-chips{ display:flex; gap:8px; padding:6px; overflow-x:auto; scrollbar-width:none; border:1px solid var(--v2-border); border-radius:14px; background:var(--v2-card); box-shadow:var(--v2-shadow); width:max-content; max-width:100%; }
.bx-chips::-webkit-scrollbar{ display:none; }
.bx-chips a{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 14px; border-radius:10px; color:#5a4c4e; font-size:.9rem; font-weight:500; white-space:nowrap; transition:background .15s, color .15s; }
.bx-chips a i{ font-size:.8rem; color:#a8999a; transition:color .15s; }
.bx-chips a b{ min-width:22px; height:20px; padding:0 6px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:var(--v2-muted-bg); color:var(--v2-muted); font-size:.72rem; font-weight:600; }
.bx-chips a:hover{ background:var(--v2-muted-bg); color:var(--v2-fg); }
.bx-chips a.is-active{ background:var(--v2-primary); color:#fff; }
.bx-chips a.is-active i{ color:#e8d3d2; }
.bx-chips a.is-active b{ background:rgba(255,255,255,.18); color:#fff; }

.bx-list{ margin-top:36px; transition:opacity .2s ease; }
.bx-list.is-loading{ opacity:.45; pointer-events:none; }
.bx-list.is-entering > *{ animation:bxIn .45s cubic-bezier(.16,1,.3,1) both; }
.bx-list.is-entering > *:nth-child(2){ animation-delay:.04s; }
.bx-list.is-entering > *:nth-child(3){ animation-delay:.08s; }
@keyframes bxIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.bx-list__head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:16px; }
.bx-list__head h2{ margin:0; font:700 1.4rem 'Inter', sans-serif; letter-spacing:-.025em; color:var(--v2-fg); }
.bx-list__head span{ color:var(--v2-muted); font-size:.88rem; }

.bx-pill{ display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 10px; border:1px solid var(--v2-border); border-radius:999px; background:var(--v2-surface); color:#5a4c4e; font-size:.76rem; font-weight:600; }
.bx-pill--soft{ background:var(--v2-primary-soft); border-color:transparent; color:var(--v2-primary); }
.bx-pill--soft i{ font-size:.66rem; }
.bx-pill--float{ position:absolute; left:12px; top:12px; background:rgba(255,253,248,.92); backdrop-filter:blur(4px); }
.bx-meta{ display:flex; flex-wrap:wrap; gap:6px; }
.bx-foot{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 16px; color:var(--v2-muted); font-size:.82rem; }
.bx-foot span{ display:inline-flex; align-items:center; gap:7px; }
.bx-foot i{ font-size:.78rem; color:#a8999a; }

.bx-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; }
.bx-post{ display:flex; flex-direction:column; overflow:hidden; color:var(--v2-fg); transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, border-color .2s; }
.bx-post:hover{ transform:translateY(-3px); border-color:var(--v2-border-strong); box-shadow:var(--v2-shadow-lg); }
.bx-post__media{ position:relative; aspect-ratio:16 / 10; background:var(--v2-muted-bg); overflow:hidden; display:flex; align-items:center; justify-content:center; color:#b3a3a0; font-size:1.6rem; }
.bx-post__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.bx-post:hover .bx-post__media img{ transform:scale(1.04); }
.bx-post__body{ flex:1; display:flex; flex-direction:column; gap:10px; padding:18px; }
.bx-post__body h3{ margin:0; font:650 1.04rem/1.4 'Inter', sans-serif; letter-spacing:-.015em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.bx-post__body p{ margin:0; color:#7d6f6c; font-size:.88rem; line-height:1.6; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.bx-post .bx-foot{ margin-top:auto; padding-top:12px; border-top:1px solid var(--v2-muted-bg); }
.bx-post__go{ margin-left:auto; color:#b3a3a0 !important; transition:transform .2s, color .2s; }
.bx-post:hover .bx-post__go{ transform:translateX(3px); color:var(--v2-primary) !important; }

.bx-grid--bento{ grid-auto-flow:dense; }
.bx-grid--bento .bx-post:not(.bx-post--lead) .bx-post__media{ aspect-ratio:16 / 9; }
.bx-grid--bento .bx-post:not(.bx-post--lead) .bx-post__body p{ -webkit-line-clamp:2; }
.bx-post--lead{ grid-column:span 2; grid-row:span 2; }
.bx-post--lead .bx-post__media{ flex:1; aspect-ratio:auto; min-height:300px; }
.bx-post--lead .bx-post__body{ flex:0 0 auto; gap:12px; padding:24px 26px; }
.bx-post--lead .bx-post__body h3{ font-size:clamp(1.3rem, 2vw, 1.65rem); line-height:1.25; letter-spacing:-.025em; -webkit-line-clamp:3; }
.bx-post--lead .bx-post__body p{ font-size:.95rem; color:#5a4c4e; -webkit-line-clamp:3; }
.bx-post--lead .bx-pill--float{ background:var(--v2-primary); border-color:var(--v2-primary); color:#fff; }
.bx-post--lead .bx-pill--float i{ font-size:.66rem; color:#e8d3d2; }
.bx-read{ margin-left:auto; color:var(--v2-primary) !important; font-weight:600; }
.bx-read i{ color:inherit !important; transition:transform .2s; }
.bx-post--lead:hover .bx-read i{ transform:translateX(3px); }

.bx-pager{ display:flex; justify-content:center; gap:6px; margin-top:28px; }
.bx-pager a{ min-width:40px; height:40px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--v2-border); border-radius:10px; background:var(--v2-card); color:#3a2e30; font-weight:600; font-size:.9rem; box-shadow:var(--v2-shadow-sm); transition:background .15s, border-color .15s; }
.bx-pager a:hover{ background:var(--v2-muted-bg); }
.bx-pager a.is-active{ background:var(--v2-fg); border-color:var(--v2-fg); color:#fff; }
.bx-pager a.is-disabled{ opacity:.4; pointer-events:none; }
.bx-pager i{ font-size:.75rem; }

.bx-empty{ display:flex; flex-direction:column; align-items:center; gap:10px; padding:48px 24px; text-align:center; }
.bx-empty h3{ margin:6px 0 0; font:700 1.1rem 'Inter', sans-serif; }
.bx-empty p{ margin:0 0 8px; max-width:420px; color:var(--v2-muted); line-height:1.6; }

.bx-guides{ margin-top:64px; }
.bx-guides__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.bx-guides__head h2{ margin:0 0 4px; font:700 1.4rem 'Inter', sans-serif; letter-spacing:-.025em; color:var(--v2-fg); }
.bx-guides__head p{ margin:0; color:var(--v2-muted); font-size:.92rem; }
.bx-guides__grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:18px; }
.bx-guide{ display:flex; flex-direction:column; overflow:hidden; color:var(--v2-fg); transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, border-color .2s; }
.bx-guide:hover{ transform:translateY(-3px); border-color:var(--v2-border-strong); box-shadow:var(--v2-shadow-lg); }
.bx-guide__media{ position:relative; aspect-ratio:4 / 3; overflow:hidden; background:#f6f1ec; border-bottom:1px solid var(--v2-muted-bg); }
.bx-guide__media img{ display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.bx-guide:hover .bx-guide__media img{ transform:scale(1.04); }
.bx-guide__count{ position:absolute; z-index:2; left:12px; top:12px; display:inline-flex; align-items:center; height:24px; padding:0 9px; border-radius:999px; background:rgba(255,253,248,.9); border:1px solid var(--v2-border); color:#5a4c4e; font-size:.72rem; font-weight:600; }
.bx-guide__body{ flex:1; display:flex; flex-direction:column; gap:6px; padding:16px 18px 18px; }
.bx-guide__body > small{ color:var(--v2-primary); font:600 .7rem 'Inter', sans-serif; letter-spacing:.09em; text-transform:uppercase; }
.bx-guide__body h3{ margin:0; font:650 1.02rem/1.35 'Inter', sans-serif; letter-spacing:-.015em; }
.bx-guide__body p{ margin:0 0 8px; color:#7d6f6c; font-size:.86rem; line-height:1.55; }
.bx-guide__foot{ margin-top:auto; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; padding-top:12px; border-top:1px solid var(--v2-muted-bg); }
.bx-guide__price{ display:flex; flex-direction:column; font-weight:700; font-size:.95rem; color:var(--v2-fg); font-variant-numeric:tabular-nums; }
.bx-guide__price small{ font-size:.7rem; font-weight:500; color:var(--v2-muted); }
.bx-guide__go{ margin-left:auto; display:inline-flex; align-items:center; gap:7px; color:var(--v2-primary); font-size:.84rem; font-weight:600; white-space:nowrap; }
.bx-guide__go i{ font-size:.7rem; transition:transform .2s; }
.bx-guide:hover .bx-guide__go i{ transform:translateX(3px); }

@media (max-width: 1080px){
    .bx-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
    .bx-post--lead{ grid-column:1 / -1; grid-row:auto; }
    .bx-post--lead .bx-post__media{ flex:none; aspect-ratio:16 / 8; min-height:0; }
    .bx-guides__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 760px){
    .bx-hero__stats span:last-child{ display:none; }
    .bx-bar{ margin-top:-30px; }
    .bx-grid{ grid-template-columns:minmax(0,1fr); gap:14px; }
    .bx-guides__head{ flex-direction:column; align-items:flex-start; }
    .bx-guides__grid{ grid-template-columns:minmax(0,1fr); gap:14px; }
    .bx-post--lead .bx-post__media{ aspect-ratio:16 / 10; }
    .bx-post--lead .bx-post__body{ padding:18px; }
}
@media (prefers-reduced-motion: reduce){ .bx *{ transition:none !important; animation:none !important; } }