.ym-front { background: var(--ym-bg); }
.ym-front > * { width: min(100% - (var(--ym-gutter) * 2), var(--ym-container)); margin-inline: auto; }
.ym-front .ym-hero { width: min(100%, 1440px); }
.ym-hero { position: relative; min-height: 460px; display: flex; align-items: center; overflow: hidden; padding-block: clamp(20px, 4vw, 48px); background: #d8e2d7; }
.ym-hero__media { position: absolute; inset: 0; }
.ym-hero__media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(25,29,24,.12), rgba(25,29,24,0)); }
.ym-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.ym-hero__panel { position: relative; z-index: 1; width: min(520px, calc(100% - 32px)); margin-left: max(var(--ym-gutter), calc((100% - var(--ym-container)) / 2)); padding: clamp(22px, 4vw, 38px); background: rgba(255, 253, 249, .93); border: 1px solid rgba(255,255,255,.8); border-radius: var(--ym-radius-md); box-shadow: var(--ym-shadow); backdrop-filter: blur(7px); }
.ym-hero__panel h1 { margin: 12px 0; font-family: var(--ym-serif); font-size: clamp(28px, 4.2vw, 46px); line-height: 1.35; letter-spacing: .03em; }
.ym-hero__panel p { margin: 0 0 20px; color: #554e48; }
.ym-section { padding-top: clamp(48px, 7vw, 80px); }
.ym-card-grid--four { grid-template-columns: 1fr; }
.ym-area-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.ym-area-card { min-height: 104px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 12px 6px; border: 1px solid var(--ym-border); border-radius: var(--ym-radius-md); color: var(--ym-text); font-size: 13px; font-weight: 700; text-decoration: none; transition: transform .2s ease; }
.ym-area-card:hover { color: var(--ym-text); transform: translateY(-3px); }
.ym-area-card__icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 48% 52% 45% 55%; background: rgba(255,255,255,.65); font-family: var(--ym-serif); font-size: 20px; }
.ym-area-card--1 { background: #e6f0e9; } .ym-area-card--2 { background: #fff0df; } .ym-area-card--3 { background: #e9eff8; } .ym-area-card--4 { background: #f8eadc; } .ym-area-card--5 { background: #f8e5e5; } .ym-area-card--6 { background: #eee8f7; } .ym-area-card--7 { background: #e5f2ef; }
.ym-feature-grid { display: grid; gap: 16px; }
.ym-feature-banner { position: relative; min-height: 230px; overflow: hidden; border-radius: var(--ym-radius-md); color: var(--ym-ink); text-decoration: none; box-shadow: var(--ym-shadow); }
.ym-feature-banner__media { position: absolute; inset: 0; }
.ym-feature-banner__media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(255,246,238,.95) 8%, rgba(255,246,238,.72) 58%, rgba(255,246,238,.15)); }
.ym-feature-banner__media img { width: 100%; height: 100%; object-fit: cover; }
.ym-feature-banner__copy { position: relative; z-index: 1; width: 72%; padding: 28px 22px; }
.ym-feature-banner__copy span { font-size: 12px; }
.ym-feature-banner__copy h3 { margin: 8px 0 0; font-family: var(--ym-serif); font-size: clamp(20px, 3vw, 28px); line-height: 1.45; }
.ym-feature-banner--2 .ym-feature-banner__media::after { background: linear-gradient(90deg, rgba(250,246,232,.96), rgba(250,246,232,.65), rgba(250,246,232,.1)); }
.ym-feature-banner--3 .ym-feature-banner__media::after { background: linear-gradient(90deg, rgba(255,232,234,.95), rgba(255,232,234,.65), rgba(255,232,234,.1)); }
.ym-latest-ranking { display: grid; gap: 32px; padding-bottom: clamp(56px, 8vw, 88px); }
.ym-latest__list { display: grid; gap: 18px; }
.ym-row-card { display: grid; grid-template-columns: 116px 1fr; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid var(--ym-border); }
.ym-row-card__media { aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--ym-radius-sm); }
.ym-row-card__media img { width: 100%; height: 100%; object-fit: cover; }
.ym-row-card__body h3 { margin: 5px 0; font-size: 16px; line-height: 1.5; }
.ym-row-card__body h3 a { color: var(--ym-ink); text-decoration: none; }
.ym-row-card__body p { display: none; margin: 0 0 4px; color: var(--ym-muted); font-size: 13px; }
.ym-ranking { align-self: start; padding: 20px; background: var(--ym-surface); border: 1px solid var(--ym-border); border-radius: var(--ym-radius-md); }
.ym-ranking__list { margin: 0; padding: 0; list-style: none; counter-reset: rank; }
.ym-ranking__list li { counter-increment: rank; border-bottom: 1px solid var(--ym-border); }
.ym-ranking__list li:last-child { border-bottom: 0; }
.ym-ranking__list a { display: grid; grid-template-columns: 30px 64px 1fr; align-items: center; gap: 10px; padding: 12px 0; color: var(--ym-ink); font-size: 13px; font-weight: 700; line-height: 1.5; text-decoration: none; }
.ym-ranking__list a::before { content: counter(rank); font-family: var(--ym-serif); font-size: 22px; text-align: center; }
.ym-ranking__thumb { aspect-ratio: 1; overflow: hidden; border-radius: 6px; }
.ym-ranking__thumb img { width: 100%; height: 100%; object-fit: cover; }
.ym-mission { width: 100% !important; max-width: none; padding: clamp(38px, 6vw, 62px) max(var(--ym-gutter), calc((100% - var(--ym-container)) / 2)); background: linear-gradient(90deg, #fff6ee, #f9ede4); }
.ym-mission > div:first-child { text-align: center; }
.ym-mission__grid { display: grid; gap: 20px; margin-top: 30px; }
.ym-mission__grid p { display: grid; grid-template-columns: 52px 1fr; align-items: center; margin: 0; color: var(--ym-muted); }
.ym-mission__grid p > span { grid-row: 1 / 3; color: #b87768; font-size: 34px; }
.ym-mission__grid strong { color: var(--ym-ink); }