/* One illustrated entry; the entire composition is a single accessible link. */
body[data-page="class-match"]{display:flex;flex-direction:column;min-height:100dvh;background:#f7f3e8}
body[data-page="class-match"]>[data-include]{flex-shrink:0}
body[data-page="class-match"]>.class-match-app{flex:1;display:flex;flex-direction:column;min-width:0}
/* Three Korean letters in the English footer must not fetch a Hangul bundle. */
html[lang="en"] body[data-page="class-match"] a[hreflang="ko"]{font-family:system-ui,sans-serif}
.class-match-entry{position:relative;display:block;overflow:hidden;border-radius:4px;background:#f6f0e3;color:#233d32;text-decoration:none;isolation:isolate}
.class-match-entry__art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;transition:transform 350ms ease}
.class-match-entry::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(248,243,231,.98) 0%,rgba(248,243,231,.95) 32%,rgba(248,243,231,.78) 44%,rgba(248,243,231,0) 62%);z-index:1;pointer-events:none}
.class-match-entry__copy{position:relative;z-index:2;width:51%;padding:40px;box-sizing:border-box}
.class-match-entry__kicker{display:block;color:#6c623e;font-size:11px;font-weight:700;letter-spacing:.06em;margin-bottom:17px}
.class-match-entry h3{font-family:var(--font-display,inherit);font-size:34px;line-height:1.4;letter-spacing:-.045em;word-break:keep-all;margin:0 0 17px;color:#233d32}
.class-match-entry p{font-size:15px;line-height:1.85;word-break:keep-all;color:#415445;margin:0 0 25px}
.class-match-entry__action{display:inline-flex;align-items:center;gap:25px;padding:13px 20px;background:#294e3b;color:#fff;font-size:13px;font-weight:600;line-height:1.5;transition:background-color 160ms ease}
.class-match-entry__meta{display:block;font-size:11px;color:#746e59;margin-top:15px;line-height:1.5}
.class-match-entry:focus-visible{outline:3px solid #294e3b;outline-offset:5px}
.class-match-entry--compact{margin:28px 0 36px}
.class-match-entry--compact .class-match-entry__copy{width:57%;padding:28px}
.class-match-entry--compact h3{font-size:27px}
.class-match-entry--compact p{font-size:14px;margin-bottom:20px}
.class-match-entry--compact .class-match-entry__kicker{margin-bottom:12px}
.class-match-entry--compact .class-match-entry__meta{display:none}
.renewal-features.has-class-match .renewal-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin-top:35px}
/* Text remains selectable and localized; each whole illustration is one link. */
.home-guide-card{display:grid;grid-template-rows:minmax(125px,1fr) auto;position:relative;isolation:isolate;overflow:hidden;width:100%;box-sizing:border-box;min-width:0;min-height:clamp(360px,29vw,400px);border:0;border-radius:4px;background:#183c2d;color:#fff;text-decoration:none;box-shadow:none}
.home-guide-card__art{position:absolute;inset:0;z-index:-1;display:block;width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform 350ms ease}
.home-guide-card__copy{grid-row:2;position:relative;align-self:end;min-width:0;padding:62px 64px 25px 28px;background:linear-gradient(180deg,transparent 0%,rgba(15,43,31,.9) 31%,#102e22 100%)}
.home-guide-card .home-guide-card__tag{display:block;font-size:11px;font-weight:700;line-height:1.6;letter-spacing:.02em;color:#c9edbe;margin:0 0 7px}
.home-guide-card h3{font:700 clamp(21px,1.8vw,27px)/1.4 var(--ff-body);color:#fff9e8;word-break:keep-all;text-wrap:balance;margin:0 0 9px}
.home-guide-card p{font-size:14px;line-height:1.75;color:#f0f3e9;margin:0;word-break:keep-all}
.home-guide-card .home-guide-card__cta{display:block;font-size:11px;font-weight:600;line-height:1.6;color:#d5eac8;margin-top:13px}
.home-guide-card__arrow{position:absolute;right:25px;bottom:27px;font-size:29px;line-height:1;color:#f0f3e9;transition:transform 180ms ease}
.home-guide-card:focus-visible{outline:3px solid #617d43;outline-offset:5px}
.home-guide-card:focus-visible h3{text-decoration:underline;text-underline-offset:5px}
.portal-tool.home-guide-card{min-height:390px}
.home-guide-card--tool .home-guide-card__art{object-position:center top}
.home-guide-card--tool .home-guide-card__copy{padding-top:62px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.home-guide-card:hover .home-guide-card__art{transform:scale(1.018)}.home-guide-card:hover .home-guide-card__arrow{transform:translateX(3px)}.home-guide-card:hover h3{text-decoration:underline;text-underline-offset:5px}}
@media(hover:hover){.class-match-entry:hover .class-match-entry__art{transform:scale(1.018)}.class-match-entry:hover .class-match-entry__action{background:#173d29}}
@media(max-width:760px){
 .class-match-entry::before{display:none}.class-match-entry__art{position:relative;display:block;height:215px;object-position:right center}
 .class-match-entry__copy,.class-match-entry--compact .class-match-entry__copy{width:100%;padding:26px 24px 29px}
 .class-match-entry h3{font-size:28px}.class-match-entry--compact h3{font-size:25px}.class-match-entry p{font-size:14px}
 .renewal-features.has-class-match .renewal-feature-grid{grid-template-columns:1fr;gap:24px;margin-top:28px}
 .home-guide-card,.portal-tool.home-guide-card{min-height:360px}
 .home-guide-card__art{object-position:center top}
 /* Keep horizontal paths, class companions and all four bubbles in view. */
 .home-guide-card__art[data-home-art="traits"],.home-guide-card__art[data-home-art="professions"],.home-guide-card--tool .home-guide-card__art{height:auto;object-fit:contain;object-position:center top}
 .home-guide-card__art[data-home-art="free-play"]{object-position:30% top}
 .home-guide-card__copy{padding:65px 47px 22px 22px}
 .home-guide-card h3{font-size:22px;line-height:1.45}
 .home-guide-card p{font-size:13px;line-height:1.75}
 .home-guide-card__arrow{right:19px;bottom:25px;font-size:25px}
 .home-guide-card--tool .home-guide-card__copy{padding-top:65px}
}
@media(prefers-reduced-motion:reduce){.class-match-entry__art,.class-match-entry__action,.home-guide-card__art,.home-guide-card__arrow{transition:none}.class-match-entry:hover .class-match-entry__art,.home-guide-card:hover .home-guide-card__art{transform:none}}
