/* Shared v3 inner-page styles: page hero, post cards, filters, pagination. */
:root{--cyan:#65ceff;--card:#06151fcc}
body.inner{--accent:#65ceff;overflow-x:hidden}
.inner main{min-height:60vh}
.eyebrow.c{color:var(--accent)}
.pg-hero{position:relative;isolation:isolate;overflow:hidden;border-bottom:1px solid var(--line);padding:64px 0 46px}
.pg-hero:before{content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse 60% 90% at 85% 0%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 70%),radial-gradient(ellipse 40% 60% at 0% 100%,#0a2a3a80,transparent),url('assets/hero-sky.webp') center 30%/cover;opacity:.55}
.pg-hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--bg),transparent 60%),repeating-linear-gradient(90deg,#65ceff08 0 1px,transparent 1px 64px),repeating-linear-gradient(0deg,#65ceff08 0 1px,transparent 1px 64px)}
.crumbs{display:flex;gap:8px;font-size:13px;color:#8ca3b1;margin-bottom:18px;flex-wrap:wrap}.crumbs a:hover{color:var(--accent)}
.pg-hero h1{font-size:clamp(36px,5vw,72px);margin:0 0 14px}
.pg-hero h1 em{font-style:normal;color:var(--accent);text-shadow:0 0 30px color-mix(in srgb,var(--accent) 50%,transparent)}
.pg-intro{max-width:760px;font-size:18px;color:#c6d4dd;margin:0}
.pg-stats{display:flex;gap:28px;margin-top:26px;flex-wrap:wrap}
.pg-stats div{display:flex;flex-direction:column}.pg-stats b{font-size:26px;letter-spacing:-.03em}.pg-stats span{font-size:12px;color:#8ca3b1;letter-spacing:.12em;text-transform:uppercase}
/* toolbar */
.toolbar{position:sticky;top:96px;z-index:20;background:#030e15e8;backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.toolbar .wrap{display:flex;gap:12px;align-items:center;padding:12px 0;flex-wrap:wrap}
.fchips{display:flex;gap:7px;flex-wrap:wrap}
.fchips button,.seg button{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;padding:7px 13px;border:1px solid color-mix(in srgb,var(--c,var(--accent)) 35%,var(--line));border-radius:99px;background:#03111a;color:#c7d6df;transition:.18s}
.fchips button i{width:7px;height:7px;border-radius:50%;background:var(--c,var(--accent))}
.fchips button small{opacity:.65;font-size:11px}
.fchips button[aria-pressed=true]{background:var(--c,var(--accent));border-color:var(--c,var(--accent));color:#03121a}.fchips button[aria-pressed=true] i{background:#03121a}
.seg{display:flex;border:1px solid var(--line);border-radius:99px;padding:3px;gap:2px}.seg button{border:0;padding:6px 12px}.seg button[aria-pressed=true]{background:var(--accent);color:#03121a}
.tb-right{margin-left:auto;display:flex;gap:10px;align-items:center}
.sel{height:36px;border:1px solid var(--line);border-radius:99px;background:#03111a;color:#c7d6df;padding:0 12px;font:600 12.5px Inter,sans-serif}
.vt button{width:36px;height:36px;padding:0;justify-content:center}
.count{font-size:13px;color:#8ca3b1}.count b{color:var(--accent)}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;padding:30px 0 10px}
.grid.list{grid-template-columns:1fr}.grid.list .pc{flex-direction:row}.grid.list .pc-img{flex:0 0 300px;aspect-ratio:16/9}
.pc{display:flex;flex-direction:column;border:1px solid #1a3644;border-radius:14px;overflow:hidden;background:#05141d;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s}
.pc:hover,.pc:focus-visible{transform:translateY(-6px);border-color:var(--c);box-shadow:0 18px 40px #000b,0 0 26px color-mix(in srgb,var(--c) 25%,transparent)}
.pc-img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 30%,#05141d),#05141d)}
.pc-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}.pc:hover .pc-img img{transform:scale(1.06)}
.pc-img em{position:absolute;right:10px;top:10px;font:700 11px/1 Inter,sans-serif;letter-spacing:.08em;font-style:normal;padding:6px 9px;border-radius:6px;background:#020c13d9;color:#fff;border:1px solid #ffffff2a}
.pc-img em.free{background:#19df98;color:#03121a;border-color:#19df98}
.pc-body{display:flex;flex-direction:column;gap:7px;padding:15px 17px 18px;flex:1}
.pc-cat{display:flex;align-items:center;gap:7px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--c);font-weight:650}
.pc-cat i{width:6px;height:6px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
.pc-t{font-size:17px;font-weight:650;line-height:1.3;letter-spacing:-.01em}
.pc-ex{font-size:13.5px;color:#9fb2bf;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pc-m{font-size:12.5px;color:#7f98a6;margin-top:auto;padding-top:4px}
.pc mark{background:color-mix(in srgb,var(--accent) 25%,transparent);color:#fff;border-radius:3px;padding:0 2px}
/* pagination */
.pager{display:flex;gap:8px;justify-content:center;align-items:center;padding:34px 0 80px;flex-wrap:wrap}
.pager button{min-width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:#03111a;color:#c7d6df;font-weight:650;padding:0 12px}
.pager button[aria-current=page]{background:var(--accent);color:#03121a;border-color:var(--accent);box-shadow:0 0 20px color-mix(in srgb,var(--accent) 40%,transparent)}
.pager button:disabled{opacity:.35;cursor:default}.pager button:hover:not(:disabled):not([aria-current]){border-color:var(--accent);color:var(--accent)}
.pager span{color:#6f8796}
/* reveal */
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0)*45ms)}.rv.in{opacity:1;transform:none}
.proto-note{font-size:12px;color:#8ca3b1;border:1px dashed #2a4a5a;border-radius:10px;padding:10px 14px;margin:20px 0}
.proto-note b{color:#f4ce54}
@media(max-width:950px){.toolbar{top:0;position:relative}.tb-right{margin-left:0;width:100%;justify-content:space-between}.grid.list .pc{flex-direction:column}.grid.list .pc-img{flex:none}}
@media(max-width:650px){.pg-hero{padding:40px 0 30px}.pg-intro{font-size:16px}.fchips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;width:100%}.fchips button{flex:none}.grid{grid-template-columns:1fr;gap:16px}.vt{display:none}}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.pc,.pc-img img{transition:none}}

.big-search{display:flex;align-items:center;gap:12px;max-width:760px;margin-top:22px;padding:8px 8px 8px 18px;border:1px solid #2a4a5a;border-radius:14px;background:#020d14d9;transition:border-color .2s,box-shadow .2s}
.big-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 15%,transparent)}
.big-search svg{width:22px;height:22px;color:var(--accent);flex:none}.big-search input{flex:1;min-width:0;background:none;border:0;outline:0;color:#fff;font:500 19px Inter,sans-serif}
@media(max-width:650px){.big-search input{font-size:16px}.big-search .button{padding:12px 14px}}
/* v4 */
.pc-img{position:relative}.pc .nyp{position:absolute;right:8px;top:8px;font:800 10px/1 Inter,Arial,sans-serif;letter-spacing:.08em;padding:5px 7px;border-radius:6px;background:#b87aff;color:#14061f;box-shadow:0 0 14px #b87aff66}
.reco{margin-top:50px;margin-bottom:40px}.reco-head{display:flex;align-items:end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:16px}.reco-head h2{margin:4px 0 0}
.reco-tabs{display:flex;flex-wrap:wrap;gap:8px}.reco-tabs button{border:1px solid #ffffff22;background:#03131c99;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600}
.reco-tabs button[aria-selected="true"]{background:var(--c);border-color:var(--c);color:#02121a}
.reco-row{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(240px,22vw,300px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 16px;scrollbar-width:thin}.reco-row>*{scroll-snap-align:start}
.reco-all{display:grid;place-items:center;border-radius:16px;border:1px dashed var(--c);color:var(--c);font-weight:700;min-height:200px}
@media(max-width:560px){.reco-tabs{flex-wrap:nowrap;overflow-x:auto}}
/* v10: shared "crew" visual: male + female Hackernaut fronts side by side (hackernaut, teams, merch) */
.crew-pair{display:flex;justify-content:center;align-items:flex-end;gap:0;max-width:520px;margin:0 auto;filter:drop-shadow(0 0 26px rgba(0,245,255,.22))}
.crew-pair img{width:50%;max-width:250px;height:auto;display:block}
.crew-pair img+img{margin-left:-4%}
@media(max-width:560px){.crew-pair{max-width:340px}}