/* Feature pages: alternating screenshot / text rows and hub card grid */
.feat-page .page-head{padding-bottom:16px}
.feat-back{margin:0;font-size:.95rem}
.feat-back a{text-decoration:none}
.feat-row{display:flex;align-items:center;gap:48px;margin:0 auto 56px;max-width:920px}
.feat-row:nth-of-type(even){flex-direction:row-reverse}
.feat-shot{flex:0 0 340px;margin:0}
.feat-shot img{width:100%;height:auto}
.feat-text{flex:1 1 auto;min-width:0}
.feat-text h2,.feat-page .feat-related h2,.feat-note h2,.feat-cta h2{text-align:left;font-size:1.5rem;margin:0 0 12px;color:var(--accent)}
.feat-text p{margin:0 0 12px;color:var(--text);font-size:1.05rem;line-height:1.6}
.feat-text ul{margin:0 0 12px;padding-left:20px;color:var(--text)}
.feat-text li{margin:6px 0}
.feat-note,.feat-cta{max-width:920px;margin:0 auto 32px}
.feat-related{max-width:920px;margin:0 auto 32px}
.feat-related ul{padding-left:20px;margin:0}
.feat-related li{margin:6px 0}
.feat-cta-btns{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0 0}
.feat-pn{display:flex;justify-content:space-between;gap:12px;max-width:920px;margin:0 auto;flex-wrap:wrap}
.feat-grid{list-style:none;padding:0;margin:0 0 40px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.feat-card{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--text);background:rgba(var(--card-rgb),.82);border:1px solid rgba(var(--accent-rgb),.3);border-radius:var(--radius);overflow:hidden;box-shadow:0 0 18px -8px rgba(var(--accent-rgb),.45);transition:transform .15s,box-shadow .15s}
.feat-card:hover,.feat-card:focus-visible{transform:translateY(-3px);box-shadow:0 0 26px -6px rgba(var(--accent-rgb),.8)}
.feat-thumb{display:block;padding:14px 14px 0;background:linear-gradient(180deg,rgba(var(--accent-rgb),.16),rgba(var(--accent-rgb),.03));border-bottom:1px solid rgba(var(--accent-rgb),.3)}
.feat-card img{display:block;width:100%;height:auto;aspect-ratio:780/620;object-fit:contain}
.feat-card-text{display:block;padding:16px 18px 18px}
.feat-card h2{text-align:left;font-size:1.15rem;margin:0 0 6px;color:var(--accent)}
.feat-card p{margin:0;color:var(--muted);font-size:.95rem}
@media (max-width:700px){
 .feat-row,.feat-row:nth-of-type(even){flex-direction:column;gap:20px;margin-bottom:44px}
 .feat-shot{flex:none;width:min(320px,100%)}
 .feat-text h2{font-size:1.3rem}
}
