:root { color-scheme: light; font-family: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; color: #24382d; background: #f6f6f0; font-synthesis: none; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { margin: 0; -webkit-text-size-adjust: 100%; }
a { color: inherit; -webkit-tap-highlight-color: transparent; }
a:focus-visible { outline: 3px solid #758d54; outline-offset: 5px; }
h1, h2, p { margin: 0; }
.portal-skip { position: fixed; left: 12px; top: -100px; z-index: 90; padding: 12px 20px; color: #fff; background: #173e30; }
.portal-skip:focus { top: 8px; }
.portal-main { width: min(1120px, calc(100% - 64px)); margin: 0 auto; }
.portal-main:focus { outline: none; }
.portal-intro { position: relative; padding: 67px 0 42px; }
.portal-eyebrow { display: flex; align-items: center; gap: 9px; color: #607259; font-size: 12px; letter-spacing: .12em; }
.portal-eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: #8c9d65; }
.portal-intro h1 { margin-top: 20px; font-family: Georgia, "Songti SC", "SimSun", serif; font-size: clamp(36px, 4.4vw, 55px); letter-spacing: .035em; line-height: 1.48; font-weight: 600; }
.portal-intro h1 span { color: #758351; }
.portal-lead { margin-top: 20px; color: #6a7467; font-size: 15px; line-height: 1.9; }
.portal-guide { position: absolute; right: 0; bottom: 47px; display: flex; align-items: center; gap: 24px; color: #6d786b; font-size: 12px; }
.portal-guide span { font-size: 20px; }
.portal-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.portal-card { display: flex; flex-direction: column; min-width: 0; color: inherit; text-decoration: none; background: #fff; border: 1px solid #e1e5d9; border-radius: 10px; overflow: hidden; transition: border-color .2s, box-shadow .2s, transform .2s; }
.portal-card:hover { border-color: #acb99c; box-shadow: 0 12px 28px #24382d0b; transform: translateY(-3px); }
.portal-card__image { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #fff; border-bottom: 1px solid #eef0e8; }
.portal-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.portal-card--cat .portal-card__image img { object-fit: contain; padding: 28px 42px 18px; }
.portal-card:hover .portal-card__image img { transform: scale(1.025); }
.portal-card__category { position: absolute; bottom: 15px; left: 23px; padding: 6px 10px; border-radius: 4px; font-size: 11px; color: #425b42; background: #f3f6eeed; border: 1px solid #e0e8db; }
.portal-card--smoke .portal-card__category { color: #fff; border-color: #ffffff40; background: #183a2cc4; backdrop-filter: blur(6px); }
.portal-card__copy { flex: 1; padding: 25px 27px 22px; }
.portal-card__heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.portal-card__heading h2 { font-size: 25px; letter-spacing: .025em; font-weight: 650; }
.portal-card__arrow { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #e0e6da; border-radius: 50%; color: #4f6a45; font-size: 20px; }
.portal-card__copy > p { margin-top: 13px; color: #727b6e; font-size: 13px; line-height: 1.95; }
.portal-card__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 15px; margin-top: 25px; padding-top: 18px; border-top: 1px solid #e9ede3; font-size: 11px; }
.portal-card__bottom > span { color: #8b9286; }
.portal-card__bottom strong { font-size: 12px; font-weight: 600; color: #3d5b39; white-space: nowrap; }
.portal-card__bottom strong span { margin-left: 8px; }
.portal-note { text-align: center; padding: 38px 0 46px; color: #929989; font-size: 12px; line-height: 1.9; }
.portal-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; max-width: 1120px; margin: 0 auto; border-top: 1px solid #dfe4d7; padding: 24px 0 30px; font-size: 12px; color: #8a9381; }
.portal-footer a { text-decoration: none; }
.portal-footer > a:first-child { color: #53674b; font-weight: 600; font-size: 14px; letter-spacing: -.02em; }
.portal-mobile-break { display: none; }
@media (min-width: 900px) { .portal-intro h1 br { display: none; } }
@media (max-width: 760px) {
  .portal-main { width: calc(100% - 36px); }
  .portal-intro { padding: 38px 3px 29px; }
  .portal-intro h1 { font-size: 38px; margin-top: 16px; }
  .portal-lead { font-size: 13px; margin-top: 15px; }
  .portal-guide { position: static; margin-top: 22px; gap: 13px; font-size: 11px; }
  .portal-guide span { font-size: 16px; }
  .portal-columns { grid-template-columns: 1fr; gap: 23px; }
  .portal-card__image { aspect-ratio: 16 / 9; }
  .portal-card__copy { padding: 22px 22px 20px; }
  .portal-card__heading h2 { font-size: 23px; }
  .portal-card__bottom { margin-top: 20px; gap: 12px; }
  .portal-note { padding: 29px 0 33px; font-size: 11px; }
  .portal-footer { margin: 0 18px; padding: 20px 3px 26px; gap: 10px; font-size: 10px; }
  .portal-footer > a:first-child { font-size: 12px; }
  .portal-mobile-break { display: inline; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .portal-card, .portal-card__image img { transition: none; } }