/* Tiny Maket — Magazine / blog shared styles (home, category, single share cards/tags/covers). */
.bgimg{background-repeat:no-repeat;background-position:center;mix-blend-mode:multiply;}
.mag-wrap{padding-bottom:60px;}

/* masthead */
.masthead{text-align:center;padding:40px 0 30px;border-bottom:1px solid var(--line);margin-bottom:8px;}
.mast-eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:.74rem;font-weight:800;color:var(--red);letter-spacing:.3px;background:var(--red-soft);padding:6px 14px;border-radius:999px;margin-bottom:16px;}
.mast-eyebrow svg{width:15px;height:15px;}
.masthead h1{font-size:clamp(1.9rem,5.4vw,3rem);font-weight:900;letter-spacing:-1.2px;line-height:1.2;}
.masthead p{color:var(--ink2);font-size:.95rem;margin-top:12px;max-width:540px;margin-inline:auto;line-height:1.8;}

/* section head */
.mag-wrap .sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin:46px 0 20px;flex-wrap:wrap;}
.sec-link{font-size:.8rem;font-weight:700;color:var(--red);display:inline-flex;align-items:center;gap:5px;transition:gap .2s;}
.sec-link svg{width:14px;height:14px;}
.sec-link:hover{gap:9px;}

/* article meta */
.art-meta{display:flex;align-items:center;gap:9px;font-size:.72rem;color:var(--ink3);flex-wrap:wrap;}
.art-meta svg{width:13px;height:13px;}
.art-meta .am-author{font-weight:700;color:var(--ink2);}
.art-meta .dot{opacity:.45;}
.art-meta.small{font-size:.68rem;gap:7px;}

/* tags */
.tag{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;font-weight:800;padding:5px 11px;border-radius:999px;width:fit-content;line-height:1;}
.tag svg{width:12px;height:12px;}
.tag-red{background:var(--red-soft);color:var(--red);}
.tag-amber{background:rgba(199,154,82,.16);color:#98702e;}
.tag-green{background:rgba(42,157,96,.14);color:#1c7a4a;}
.tag-blue{background:rgba(43,111,176,.13);color:#245e94;}
.tag-purple{background:rgba(126,74,178,.14);color:#653a99;}
.tag-orange{background:rgba(224,122,44,.15);color:#bd6321;}

/* gradient covers */
.cover{position:absolute;inset:0;background-size:cover;background-position:center;}
.cover.bgimg{background-size:78%;}
.gcov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.gcov::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 90% at 28% 18%,rgba(255,255,255,.20),transparent 60%);}
.gcov::after{content:"";position:absolute;width:120px;height:120px;right:-30px;bottom:-34px;border-radius:50%;background:rgba(255,255,255,.08);}
.gcov svg{position:relative;width:38%;height:38%;color:#fff;opacity:.95;filter:drop-shadow(0 5px 12px rgba(0,0,0,.2));}
.g-red{background:linear-gradient(135deg,#f16068,var(--red2));}
.g-amber{background:linear-gradient(135deg,#d9b166,#997231);}
.g-green{background:linear-gradient(135deg,#3fc783,#1c7a4a);}
.g-blue{background:linear-gradient(135deg,#4f92da,#245e94);}
.g-purple{background:linear-gradient(135deg,#9d70d2,#653a99);}
.g-orange{background:linear-gradient(135deg,#ee9a4d,#bd6321);}
.g-slate{background:linear-gradient(135deg,var(--slate2),var(--slate3));}

/* HERO (editor's picks) */
.mag-hero{display:grid;grid-template-columns:1fr;gap:16px;margin:26px 0 8px;}
@media(min-width:920px){.mag-hero{grid-template-columns:1.55fr 1fr;gap:18px;}}
.hero-lead{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;background:var(--sf);text-decoration:none;color:inherit;transition:transform .28s,box-shadow .28s,border-color .28s;}
.hl-media{position:relative;aspect-ratio:16/9;overflow:hidden;background:radial-gradient(120% 120% at 50% 22%,#fff,var(--sf2));}
.hl-media .cover{transition:transform .55s cubic-bezier(.22,.7,.3,1);}
.hl-media .cover.bgimg{background-size:64%;}
.hl-pick{position:absolute;top:15px;right:15px;display:inline-flex;align-items:center;gap:6px;background:rgba(20,22,25,.72);backdrop-filter:blur(6px);color:#fff;font-size:.7rem;font-weight:800;padding:6px 13px;border-radius:999px;}
.hl-pick svg{width:13px;height:13px;color:#E8B23A;}
.hl-body{padding:22px 24px 24px;display:flex;flex-direction:column;gap:12px;flex:1;}
@media(min-width:920px){.hl-body{padding:26px 30px 30px;}}
.hl-body h3{font-size:clamp(1.3rem,2.5vw,1.85rem);font-weight:900;line-height:1.45;letter-spacing:-.4px;}
.hl-body p{color:var(--ink2);font-size:.9rem;line-height:1.9;}
.hero-lead:hover{transform:translateY(-4px);box-shadow:var(--sh2);border-color:var(--line2);}
.hero-lead:hover .cover{transform:scale(1.05);}
.hero-side{display:grid;grid-template-rows:repeat(3,1fr);gap:14px;}
.hero-mini{display:grid;grid-template-columns:104px 1fr;gap:14px;align-items:center;background:var(--sf);border:1px solid var(--line);border-radius:var(--r2);padding:12px;text-decoration:none;color:inherit;transition:transform .25s,box-shadow .25s,border-color .25s;}
.hm-media{position:relative;width:104px;height:88px;border-radius:13px;overflow:hidden;background:radial-gradient(120% 120% at 50% 25%,#fff,var(--sf2));}
.hm-media .cover{transition:transform .5s cubic-bezier(.22,.7,.3,1);}
.hm-body{display:flex;flex-direction:column;gap:7px;min-width:0;}
.hm-body h3{font-size:.92rem;font-weight:800;line-height:1.5;}
.hero-mini:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:var(--line2);}
.hero-mini:hover .cover{transform:scale(1.07);}

/* categories */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
@media(min-width:640px){.cat-grid{grid-template-columns:repeat(3,1fr);}}
.mag-wrap .catcard,.cat-grid .catcard{position:relative;overflow:hidden;border-radius:var(--r3);padding:18px;min-height:132px;display:flex;flex-direction:column;justify-content:space-between;text-decoration:none;color:#fff;background:linear-gradient(140deg,var(--cc1),var(--cc2));box-shadow:0 12px 26px -14px var(--cc2);transition:transform .3s cubic-bezier(.22,.7,.3,1),box-shadow .3s;}
.cat-grid .catcard::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 85% at 82% -5%,rgba(255,255,255,.22),transparent 52%);pointer-events:none;}
.cat-grid .catcard:hover{transform:translateY(-5px);box-shadow:0 18px 34px -14px var(--cc2);}
.cat-bg{position:absolute;left:-18px;bottom:-24px;width:108px;height:108px;opacity:.16;transform:rotate(-10deg);transition:transform .5s cubic-bezier(.22,.7,.3,1);pointer-events:none;}
.cat-bg svg{width:100%;height:100%;}
.cat-grid .catcard:hover .cat-bg{transform:rotate(-10deg) scale(1.15);}
.cat-ic{width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;position:relative;align-self:flex-start;}
.cat-ic svg{width:23px;height:23px;}
.cat-info{position:relative;}
.cat-info h3{font-size:1.05rem;font-weight:800;margin-bottom:3px;line-height:1.3;}
.cat-count{font-size:.73rem;opacity:.88;font-weight:600;}
.cat-red{--cc1:#f26a72;--cc2:#C2151C;}
.cat-amber{--cc1:#e0aa50;--cc2:#a97c2e;}
.cat-green{--cc1:#43ca86;--cc2:#1c7a4a;}
.cat-blue{--cc1:#5296dd;--cc2:#245e94;}
.cat-purple{--cc1:#a074d4;--cc2:#653a99;}
.cat-orange{--cc1:#f0a052;--cc2:#bd6321;}

/* article grid */
.art-grid{display:grid;grid-template-columns:1fr;gap:18px;}
@media(min-width:600px){.art-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:960px){.art-grid{grid-template-columns:repeat(3,1fr);}}
.acard{display:flex;flex-direction:column;background:var(--sf);border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;text-decoration:none;color:inherit;transition:transform .26s,box-shadow .26s,border-color .26s;}
.ac-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:radial-gradient(120% 120% at 50% 25%,#fff,var(--sf2));}
.ac-media .cover{transition:transform .5s cubic-bezier(.22,.7,.3,1);}
.ac-tag{position:absolute;bottom:12px;right:12px;box-shadow:0 4px 12px -4px rgba(0,0,0,.25);}
.ac-body{padding:16px 18px 18px;flex:1;display:flex;flex-direction:column;gap:9px;}
.ac-body h3{font-size:1.02rem;font-weight:800;line-height:1.5;}
.ac-excerpt{font-size:.8rem;color:var(--ink2);line-height:1.8;}
.ac-meta{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:8px;font-size:.7rem;color:var(--ink3);flex-wrap:wrap;}
.ac-meta svg{width:13px;height:13px;}
.ac-updated{color:var(--red);font-weight:800;display:inline-flex;align-items:center;gap:4px;}
.ac-published{color:var(--ink2);font-weight:700;display:inline-flex;align-items:center;gap:4px;}
.ac-new{position:absolute;top:12px;left:12px;background:linear-gradient(135deg,#3fc783,#1c7a4a);color:#fff;font-size:.66rem;font-weight:800;padding:4px 11px;border-radius:999px;box-shadow:0 5px 13px -4px rgba(0,0,0,.35);z-index:2;}
.ac-meta .dot{opacity:.45;}
.ac-read{display:inline-flex;align-items:center;gap:4px;}
.acard:hover{transform:translateY(-5px);box-shadow:var(--sh2);border-color:var(--line2);}
.acard:hover .cover{transform:scale(1.06);}

/* popular list */
.pop-list{display:grid;grid-template-columns:1fr;gap:0 44px;}
@media(min-width:780px){.pop-list{grid-template-columns:1fr 1fr;}}
.popitem{display:grid;grid-template-columns:34px 60px 1fr;gap:13px;align-items:center;padding:15px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:inherit;transition:background .2s;}
.popitem:hover{background:var(--sf2);border-radius:12px;}
.pop-rank{font-size:1.7rem;font-weight:900;color:var(--line2);text-align:center;transition:color .25s;}
.popitem:hover .pop-rank{color:var(--red);}
.pop-thumb{position:relative;width:60px;height:60px;border-radius:13px;overflow:hidden;background:radial-gradient(120% 120% at 50% 25%,#fff,var(--sf2));}
.pop-thumb .cover{transition:transform .5s;}
.popitem:hover .pop-thumb .cover{transform:scale(1.08);}
.pop-body{min-width:0;}
.pop-body h3{font-size:.9rem;font-weight:800;line-height:1.5;}
.pop-views{font-size:.68rem;color:var(--ink3);display:inline-flex;align-items:center;gap:4px;margin-top:4px;}
.pop-views svg{width:12px;height:12px;}

/* newsletter */
.newsletter{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--slate2),var(--slate3));border-radius:var(--r4);padding:44px 30px;text-align:center;color:#fff;margin:48px 0 10px;}
.nl-grain{position:absolute;inset:0;background:repeating-linear-gradient(118deg,rgba(255,255,255,.025) 0 1px,transparent 1px 26px);}
.nl-grain::after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(236,28,37,.22),transparent 65%);top:-120px;left:-60px;}
.nl-inner{position:relative;max-width:500px;margin:0 auto;}
.nl-ic{width:62px;height:62px;border-radius:19px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.nl-ic svg{width:30px;height:30px;color:#fff;}
.newsletter h2{font-size:clamp(1.35rem,3.4vw,1.7rem);font-weight:900;color:#fff;letter-spacing:-.5px;}
.newsletter p{color:rgba(255,255,255,.72);font-size:.9rem;line-height:1.85;margin-top:10px;}
.nl-form{display:flex;gap:10px;max-width:430px;margin:22px auto 0;}
.nl-form input{flex:1;border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);border-radius:13px;padding:13px 16px;color:#fff;font-family:inherit;font-size:.88rem;outline:none;transition:border-color .2s,background .2s;}
.nl-form input::placeholder{color:rgba(255,255,255,.5);}
.nl-form input:focus{border-color:var(--red);background:rgba(255,255,255,.12);}
.nl-form .btn{flex:none;}

/* motion */
body.js-anim .reveal{opacity:0;transform:translateY(26px);transition:opacity .65s cubic-bezier(.22,.7,.3,1),transform .65s cubic-bezier(.22,.7,.3,1);}
body.js-anim .reveal.shown{opacity:1;transform:none;}
@keyframes magIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
body.js-anim .mag-hero{animation:magIn .6s ease both;}

/* pagination (shared) */
.mag-pagination{display:flex;justify-content:center;gap:8px;margin:36px 0 0;flex-wrap:wrap;}
.mag-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--line);border-radius:12px;font-weight:700;font-size:.85rem;color:var(--ink2);background:var(--sf);text-decoration:none;transition:.18s;}
.mag-pagination .page-numbers.current{background:var(--red);border-color:var(--red);color:#fff;}
.mag-pagination a.page-numbers:hover{border-color:var(--red);color:var(--red);}

/* mobile */
@media(max-width:600px){
.masthead{padding:30px 0 24px;}
.mag-wrap .sec-head{margin:36px 0 16px;}
.mag-hero{gap:14px;}
.hero-side{gap:12px;}
.hero-mini{grid-template-columns:92px 1fr;gap:12px;padding:10px;}
.hm-media{width:92px;height:78px;}
.hl-body h3{font-size:1.22rem;}
.cat-grid{gap:10px;}
.cat-grid .catcard{min-height:112px;padding:15px;}
.cat-ic{width:38px;height:38px;}
.cat-ic svg{width:20px;height:20px;}
.cat-info h3{font-size:.95rem;}
.cat-bg{width:90px;height:90px;bottom:-20px;left:-16px;}
.newsletter{padding:34px 22px;border-radius:var(--r3);}
.nl-form{flex-direction:column;}
.nl-form .btn{width:100%;}
}
@media(max-width:400px){
.popitem{grid-template-columns:26px 52px 1fr;gap:10px;}
.pop-thumb{width:52px;height:52px;}
}