/* Mole Mall Portal v4
   Keep the existing Mole Mall visual language. This layer only improves hierarchy,
   density, discovery and card thumbnails. */
.portal-v4 { --v4-ink:#173a31; --v4-ink-soft:#52675f; --v4-paper:#f4f0e6; --v4-card:#fffdf8; --v4-line:#d9d4c6; --v4-moss:#6f8b74; --v4-moss-soft:#e7eee5; --v4-night:#123a31; }
.portal-v4 main { background:var(--v4-paper); }
.portal-v4-shell { width:min(1180px,calc(100% - 32px)); margin:0 auto; padding:38px 0 70px; color:var(--v4-ink); }
.portal-v4-hero { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr); gap:28px; align-items:stretch; margin:0 0 24px; }
.portal-v4-hero>div:first-child,.portal-v4-now { border:1px solid var(--v4-line); background:rgba(255,253,248,.78); border-radius:20px; }
.portal-v4-hero>div:first-child { padding:38px 42px; position:relative; overflow:hidden; }
.portal-v4-hero>div:first-child:after { content:""; position:absolute; width:190px;height:190px;border-radius:50%;right:-72px;top:-90px;background:var(--v4-moss-soft);opacity:.8; }
.portal-v4-kicker,.portal-v4-section-head p:first-child,.portal-v4-network> .portal-v4-section-head p:first-child,.portal-v4-directory-callout>div>p:first-child { margin:0 0 9px; font-size:11px; font-weight:800; letter-spacing:.16em; color:var(--v4-moss); }
.portal-v4-hero h1 { margin:0; font-size:clamp(36px,5vw,67px); line-height:1.04; letter-spacing:-.045em; color:var(--v4-ink); }
.portal-v4-lead { max-width:700px; margin:22px 0 0; font-size:15px; line-height:1.9; color:var(--v4-ink-soft); }
.portal-v4-stats { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }
.portal-v4-stats span { border:1px solid var(--v4-line); background:#fff; border-radius:999px; padding:8px 12px; font-size:12px; color:var(--v4-ink-soft); }
.portal-v4-stats b { color:var(--v4-ink); }
.portal-v4-now { padding:20px; display:flex; flex-direction:column; }
.portal-v4-now>p { margin:0 0 10px; font-size:10px; font-weight:800; letter-spacing:.15em; color:var(--v4-moss); }
.portal-v4-now a { display:grid; grid-template-columns:auto 1fr auto; gap:9px; align-items:center; min-height:54px; padding:11px 5px; border-top:1px solid var(--v4-line); color:var(--v4-ink); text-decoration:none; font-weight:700; }
.portal-v4-now a span { min-width:42px; padding:4px 7px; border-radius:999px; background:var(--v4-moss-soft); color:var(--v4-moss); font-size:10px; text-align:center; }
.portal-v4-now a i { font-style:normal; transition:transform .18s ease; }
.portal-v4-now a:hover i { transform:translateX(3px); }

.portal-v4-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:center; margin:28px 0 22px; }
.portal-v4-filter { display:flex; flex-wrap:wrap; gap:7px; }
.portal-v4-filter button { appearance:none; border:1px solid var(--v4-line); background:var(--v4-card); color:var(--v4-ink-soft); border-radius:999px; padding:9px 14px; font:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.portal-v4-filter button.is-active { background:var(--v4-night); color:#fff; border-color:var(--v4-night); }
.portal-v4-all-link { color:var(--v4-ink); font-size:13px; font-weight:700; text-decoration:none; white-space:nowrap; }
.portal-v4-all-link span { display:inline-block; margin-left:4px; }

.portal-v4-section { padding:28px 0; }
.portal-v4-section-head { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:16px; }
.portal-v4-section-head h2 { margin:0; color:var(--v4-ink); font-size:clamp(24px,3vw,34px); letter-spacing:-.035em; }
.portal-v4-section-head>p { max-width:450px; margin:0; color:var(--v4-ink-soft); font-size:13px; line-height:1.7; text-align:right; }

.portal-v4-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.portal-card { min-width:0; }
.portal-card--feature { grid-column:span 2; }
.portal-card__hit { min-height:152px; height:100%; display:grid; grid-template-columns:82px minmax(0,1fr) auto; gap:15px; align-items:center; padding:15px; border:1px solid var(--v4-line); border-radius:16px; background:var(--v4-card); color:var(--v4-ink); text-decoration:none; transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease; }
.portal-card--feature .portal-card__hit { grid-template-columns:118px minmax(0,1fr) auto; min-height:180px; background:linear-gradient(135deg,#fffdf8 0%,#edf3e9 100%); }
.portal-card__hit:hover { transform:translateY(-2px); border-color:#aeb9aa; box-shadow:0 8px 24px rgba(36,58,48,.07); }
.portal-card__thumb { width:82px;height:82px;border-radius:13px;overflow:hidden;background:#ece8de;border:1px solid rgba(23,58,49,.08);display:grid;place-items:center; }
.portal-card--feature .portal-card__thumb { width:118px;height:118px; }
.portal-card__thumb img { width:100%;height:100%;object-fit:cover;display:block; }
.portal-card__body { min-width:0; display:flex; flex-direction:column; gap:5px; }
.portal-card__body small { color:var(--v4-moss); font-size:9px; line-height:1.35; letter-spacing:.11em; font-weight:800; text-transform:uppercase; }
.portal-card__body strong { font-size:17px; line-height:1.25; letter-spacing:-.02em; }
.portal-card--feature .portal-card__body strong { font-size:22px; }
.portal-card__body>span:last-child { color:var(--v4-ink-soft); font-size:12px; line-height:1.55; }
.portal-card__hit>i { font-style:normal; font-size:17px; align-self:end; padding-bottom:2px; }
.portal-card[hidden] { display:none !important; }

.portal-v4-section--compact { padding-top:38px; }
.portal-v4-small-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--v4-line); border-radius:16px; overflow:hidden; background:var(--v4-card); }
.portal-v4-small-links a { display:grid; grid-template-columns:1fr auto; gap:3px 12px; padding:17px 18px; color:var(--v4-ink); text-decoration:none; border-right:1px solid var(--v4-line); border-bottom:1px solid var(--v4-line); }
.portal-v4-small-links a:nth-child(3n) { border-right:0; }
.portal-v4-small-links a:nth-last-child(-n+3) { border-bottom:0; }
.portal-v4-small-links b { font-size:13px; }
.portal-v4-small-links span { color:var(--v4-ink-soft); font-size:11px; grid-column:1; }
.portal-v4-small-links i { grid-column:2; grid-row:1/3; align-self:center; font-style:normal; }

.portal-v4-network { padding:42px 0 28px; }
.portal-v4-network-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.portal-v4-network-grid a { display:grid; grid-template-columns:1fr auto; gap:4px 12px; min-height:92px; padding:17px; border-radius:14px; background:var(--v4-night); color:#f5f1e8; text-decoration:none; }
.portal-v4-network-grid b { font-size:14px; }
.portal-v4-network-grid span { grid-column:1; color:#c9d8d1; font-size:11px; }
.portal-v4-network-grid i { grid-column:2;grid-row:1/3;align-self:center;font-style:normal; }

.portal-v4-directory-callout { display:grid; grid-template-columns:120px minmax(0,1fr); gap:24px; align-items:center; margin-top:36px; padding:26px; border:1px solid var(--v4-line); border-radius:20px; background:#fffdf8; }
.portal-v4-directory-callout img { width:120px;height:120px;border-radius:18px;object-fit:cover; }
.portal-v4-directory-callout h2 { margin:0 0 10px; font-size:25px; color:var(--v4-ink); }
.portal-v4-directory-callout p { margin:0 0 14px; color:var(--v4-ink-soft); line-height:1.7; font-size:13px; }
.portal-v4-directory-callout a { color:var(--v4-ink); font-weight:800; text-decoration:none; }

@media(max-width:980px){
  .portal-v4-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portal-card--feature{grid-column:span 1}
  .portal-card--feature .portal-card__hit{grid-template-columns:82px minmax(0,1fr) auto;min-height:152px}
  .portal-card--feature .portal-card__thumb{width:82px;height:82px}
  .portal-card--feature .portal-card__body strong{font-size:17px}
  .portal-v4-network-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .portal-v4-shell{width:min(100% - 22px,1180px);padding-top:20px}
  .portal-v4-hero{grid-template-columns:1fr;gap:10px}
  .portal-v4-hero>div:first-child{padding:28px 22px}
  .portal-v4-toolbar{align-items:flex-start;flex-direction:column}
  .portal-v4-section-head{align-items:flex-start;flex-direction:column;gap:7px}
  .portal-v4-section-head>p{text-align:left}
  .portal-v4-small-links{grid-template-columns:1fr}
  .portal-v4-small-links a,.portal-v4-small-links a:nth-child(3n),.portal-v4-small-links a:nth-last-child(-n+3){border-right:0;border-bottom:1px solid var(--v4-line)}
  .portal-v4-small-links a:last-child{border-bottom:0}
  .portal-v4-network-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .portal-v4-grid{grid-template-columns:1fr}
  .portal-card__hit,.portal-card--feature .portal-card__hit{grid-template-columns:68px minmax(0,1fr) auto;min-height:124px;padding:12px;gap:12px}
  .portal-card__thumb,.portal-card--feature .portal-card__thumb{width:68px;height:68px;border-radius:11px}
  .portal-card__body strong,.portal-card--feature .portal-card__body strong{font-size:16px}
  .portal-v4-directory-callout{grid-template-columns:72px minmax(0,1fr);gap:15px;padding:18px}
  .portal-v4-directory-callout img{width:72px;height:72px;border-radius:12px;align-self:start}
  .portal-v4-directory-callout h2{font-size:20px}
}