/* ============================================================
   TECH AI MAGAZINE 2026 — COMPONENT & LAYOUT STYLES
   Reproduces the design prototype (landing + article) as classes.
   Pages render on a light editorial surface (.theme-light) with
   dark and cyan feature bands, per the design.
   ============================================================ */

/* ---- Page shell ---- */
body.taim { background:#fff; color:var(--text-body); font-family:var(--font-sans); }
.taim-wrap { background:#fff; min-height:100vh; }
.taim-container { max-width:1280px; margin:0 auto; padding-left:40px; padding-right:40px; }
.taim-narrow { max-width:840px; margin:0 auto; padding-left:40px; padding-right:40px; }
.taim-mid { max-width:1080px; margin:0 auto; padding-left:40px; padding-right:40px; }

/* ---- Eyebrow (mono kicker with cyan rule) ---- */
.taim-eyebrow { display:inline-flex; align-items:center; gap:12px; font-family:var(--font-mono); font-size:12px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--cyan-600); }
.taim-eyebrow::before { content:""; width:28px; height:2px; background:var(--cyan-500); flex:0 0 auto; }
.taim-eyebrow.on-dark { color:var(--cyan-400); }
.taim-eyebrow.on-dark::before { box-shadow:var(--glow-sm); }
.taim-eyebrow.on-cyan { color:rgba(255,255,255,.85); }
.taim-eyebrow.on-cyan::before { background:#fff; }

/* ---- Promo bar ---- */
.taim-promo { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; background:#05070A; color:#fff; padding:9px 24px; font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; text-align:center; }
.taim-promo b { font-weight:600; }
.taim-promo a { text-decoration:none; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--cyan-400); border-bottom:1.5px solid var(--cyan-400); padding-bottom:1px; }

/* ---- Nav ---- */
.taim-nav { position:sticky; top:0; z-index:100; display:flex; align-items:center; gap:30px; padding:0 40px; height:90px; background:rgba(255,255,255,.82); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--border); }
.taim-nav__brand { display:flex; align-items:center; text-decoration:none; }
.taim-nav__menu { display:flex; gap:2px; margin-left:6px; }
.taim-nav__menu a { padding:9px 13px; font-size:13.5px; font-weight:600; text-decoration:none; color:var(--text-muted); border-radius:var(--radius-sm); transition:color var(--dur-base) var(--ease-out); }
.taim-nav__menu a:first-child, .taim-nav__menu a.current { color:var(--text-strong); }
.taim-nav__menu a:hover { color:var(--cyan-600); }
.taim-nav__right { margin-left:auto; display:flex; align-items:center; gap:16px; }
.taim-iconbtn { background:none; border:none; color:var(--text-muted); cursor:pointer; display:flex; padding:4px; transition:color var(--dur-base) var(--ease-out); }
.taim-iconbtn:hover { color:var(--cyan-600); }

/* ---- Logo lockup (wordmark) ---- */
.taim-logo { display:inline-flex; align-items:center; gap:9px; font-family:var(--font-display); font-size:22px; letter-spacing:.02em; text-transform:uppercase; color:var(--ink-950); line-height:1; }
.taim-logo .mono { position:relative; display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; background:#000; border-radius:7px; color:#fff; font-family:var(--font-display); font-size:20px; }
.taim-logo .mono i { font-style:normal; }
.taim-logo .mono .dot { position:absolute; top:7px; right:8px; width:5px; height:5px; border-radius:50%; background:var(--cyan-500); box-shadow:var(--glow-sm); }
.taim-logo .wm-ai { color:var(--cyan-600); font-style:italic; }
.taim-logo.on-dark { color:#fff; }
.taim-logo.on-dark .mono { background:#fff; color:#000; }

/* ---- Buttons ---- */
.taim-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; font-family:var(--font-sans); font-weight:700; text-decoration:none; border-radius:var(--radius-md); cursor:pointer; border:1px solid transparent; transition:transform var(--dur-fast) var(--ease-out), background var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); white-space:nowrap; }
.taim-btn:active { transform:scale(.98); }
.taim-btn--sm { height:36px; padding:0 16px; font-size:13px; }
.taim-btn--lg { height:54px; padding:0 26px; font-size:15px; }
.taim-btn--md { height:44px; padding:0 22px; font-size:14px; }
.taim-btn--ink { background:var(--ink-950); color:#fff; }
.taim-btn--ink:hover { background:#000; color:#fff; box-shadow:var(--shadow-md); }
.taim-btn--outline { background:transparent; color:var(--ink-950); border-color:var(--border-strong); }
.taim-btn--outline:hover { border-color:var(--border-cyan); color:var(--cyan-600); }
.taim-btn--outline.on-dark { color:#fff; border-color:rgba(255,255,255,.35); }
.taim-btn--outline.on-dark:hover { border-color:var(--cyan-500); color:var(--cyan-400); }
.taim-btn--secondary { background:var(--cyan-500); color:var(--black); }
.taim-btn--secondary:hover { background:var(--cyan-400); box-shadow:var(--glow-md); }
.taim-btn--full { width:100%; }
.taim-btn svg { display:block; }

/* ---- Section heads ---- */
.taim-sechead { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:28px; flex-wrap:wrap; gap:14px; }
.taim-sechead h2 { font-size:34px; margin:12px 0 0; color:var(--ink-950); letter-spacing:-.02em; }
.taim-sechead--center { display:block; text-align:center; margin-bottom:30px; }
.taim-sechead--center .taim-eyebrow { justify-content:center; }
.taim-showmore { font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--cyan-600); text-decoration:none; display:inline-flex; align-items:center; gap:7px; }
.taim-showmore:hover { color:var(--cyan-700); }

/* ---- Hero ---- */
.taim-hero { position:relative; overflow:hidden; background:radial-gradient(120% 90% at 82% 12%, rgba(0,176,240,.16), rgba(0,176,240,0) 55%), linear-gradient(180deg,#F4F8FC,#FFFFFF); border-bottom:1px solid var(--border); }
.taim-hero__grid { display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; padding-top:64px; padding-bottom:72px; }
.taim-hero h1 { font-size:56px; line-height:1.02; letter-spacing:-.03em; margin:18px 0; color:var(--ink-950); }
.taim-hero h1 .accent { color:var(--cyan-600); }
.taim-hero__lede { font-size:18px; color:var(--text-muted); line-height:1.55; max-width:520px; margin:0 0 28px; }
.taim-hero__actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.taim-hero__stats { display:flex; gap:34px; margin-top:36px; }
.taim-stat-num { font-family:var(--font-display); color:var(--ink-950); }
.taim-stat-lbl { font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); }
.taim-hero__cover { position:relative; display:flex; justify-content:center; }
.taim-hero__cover .glow { position:absolute; inset:6% -4% -8% 8%; border-radius:20px; background:linear-gradient(150deg,var(--cyan-500),var(--cyan-700) 55%,var(--ink-900)); transform:rotate(4deg); box-shadow:0 40px 80px rgba(0,176,240,.32); }
.taim-hero__cover a { position:relative; display:block; border-radius:8px; overflow:hidden; box-shadow:0 30px 60px rgba(10,14,20,.34); border:1px solid rgba(255,255,255,.5); }
.taim-hero__cover img { display:block; width:330px; max-width:42vw; height:auto; }
.taim-hero__badge { position:absolute; top:-14px; right:2%; z-index:2; display:inline-flex; align-items:center; height:30px; padding:0 14px; font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--black); background:var(--cyan-500); border-radius:var(--radius-pill); box-shadow:var(--glow-sm); }

/* ---- Article cards (grid) ---- */
.taim-cards { display:grid; gap:22px; }
.taim-cards--3 { grid-template-columns:repeat(3,1fr); }
.taim-cards--5 { grid-template-columns:repeat(5,1fr); gap:16px; }
.taim-card { text-decoration:none; display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out); }
.taim-card:hover { transform:translateY(-3px); border-color:var(--border-cyan); box-shadow:var(--shadow-lg); }
.taim-card__media { position:relative; height:184px; overflow:hidden; }
.taim-card--sm .taim-card__media { height:118px; }
.taim-card__media img { width:100%; height:100%; object-fit:cover; }
.taim-card__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(5,7,10,.7)); }
.taim-card--sm .taim-card__media::after { background:linear-gradient(180deg,transparent 40%,rgba(5,7,10,.7)); }
.taim-card__cat { position:absolute; left:14px; top:14px; z-index:1; display:inline-flex; align-items:center; height:24px; padding:0 10px; font-family:var(--font-mono); font-size:11px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--cyan-600); border-radius:var(--radius-pill); }
.taim-card__body { padding:20px; display:flex; flex-direction:column; flex:1; }
.taim-card--sm .taim-card__body { padding:16px; }
.taim-card__body h3 { font-size:19px; line-height:1.22; margin:0 0 14px; color:var(--ink-950); }
.taim-card--sm .taim-card__body h3 { font-size:15px; line-height:1.28; margin:0; }
.taim-card__meta { margin-top:auto; display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11px; color:var(--text-faint); letter-spacing:.04em; }
.taim-card__meta .by { color:var(--text-body); }

/* ---- Latest issues carousel (dark) ---- */
.taim-issues { background:linear-gradient(180deg,var(--ink-950),var(--ink-850)); border-top:1px solid var(--border); }
.taim-issues__inner { padding-top:58px; padding-bottom:64px; }
.taim-issues .taim-sechead--center h2 { color:#fff; font-size:32px; }
.taim-coverflow { position:relative; height:460px; margin-top:8px; perspective:1400px; }
.taim-coverflow__stage { position:absolute; inset:0; }
.taim-cf-card { position:absolute; top:50%; left:50%; width:300px; height:410px; border-radius:10px; overflow:hidden; cursor:pointer; border:1px solid rgba(255,255,255,.12); transition:transform .6s var(--ease-out), opacity .6s, filter .6s, box-shadow .6s; will-change:transform,opacity; }
.taim-cf-card img { width:100%; height:100%; object-fit:cover; display:block; }
.taim-cf-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:40%; background:linear-gradient(180deg,transparent,rgba(5,7,10,.55)); }
.taim-coverflow__cta { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:50; }
.taim-issues__nav { display:flex; align-items:center; justify-content:center; gap:24px; margin-top:26px; }
.taim-navbtn { width:46px; height:46px; border-radius:50%; background:transparent; border:1px solid var(--border-strong); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:border-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out); }
.taim-navbtn:hover { border-color:var(--cyan-500); color:var(--cyan-400); }
.taim-dots { display:flex; gap:9px; }
.taim-dots button { width:9px; height:9px; border-radius:999px; background:rgba(255,255,255,.3); border:none; padding:0; cursor:pointer; transition:all .3s var(--ease-out); }
.taim-dots button.active { width:26px; background:var(--cyan-500); box-shadow:var(--glow-sm); }

/* ---- Explore More posters ---- */
.taim-posters { display:grid; grid-template-columns:repeat(6,1fr); gap:18px; }
.taim-poster { position:relative; display:block; aspect-ratio:3/4.2; border-radius:var(--radius-lg); overflow:hidden; text-decoration:none; box-shadow:var(--shadow-md); transition:transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.taim-poster:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.taim-poster img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.taim-poster::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(5,7,10,.1) 30%,rgba(5,7,10,.85)); }
.taim-poster__label { position:absolute; left:0; right:0; bottom:16px; z-index:1; text-align:center; font-family:var(--font-display); font-size:17px; letter-spacing:.02em; color:#fff; text-transform:uppercase; }
.taim-poster__label .ai { color:var(--cyan-400); font-style:italic; }

/* ---- AGI + News split ---- */
.taim-split { border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--ink-50); }
.taim-split__grid { display:grid; grid-template-columns:1fr 1fr; gap:56px; padding-top:56px; padding-bottom:56px; }
.taim-split h2 { font-size:26px; margin:12px 0 8px; color:var(--ink-950); letter-spacing:-.02em; }
.taim-hlist { margin-top:8px; }
.taim-hrow { display:flex; gap:16px; padding:16px 0; border-bottom:1px solid var(--border); text-decoration:none; transition:background var(--dur-base) var(--ease-out); }
.taim-hrow:last-child { border-bottom:none; }
.taim-hrow:hover { background:rgba(0,0,0,.02); }
.taim-hrow__thumb { flex:0 0 104px; height:72px; border-radius:var(--radius-md); overflow:hidden; }
.taim-hrow__thumb img { width:100%; height:100%; object-fit:cover; }
.taim-hrow__txt { display:flex; flex-direction:column; justify-content:center; }
.taim-hrow__txt h4 { font-size:16px; line-height:1.28; margin:0; color:var(--ink-950); }
.taim-hrow__by { font-family:var(--font-mono); font-size:11px; color:var(--text-faint); letter-spacing:.04em; margin-top:6px; }
.taim-newsrow { display:flex; gap:14px; align-items:flex-start; padding:16px 0; border-bottom:1px solid var(--border); text-decoration:none; transition:background var(--dur-base) var(--ease-out); }
.taim-newsrow:last-child { border-bottom:none; }
.taim-newsrow:hover { background:rgba(0,0,0,.02); }
.taim-newsrow .dot { flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--cyan-500); margin-top:7px; }
.taim-newsrow h4 { font-size:16px; line-height:1.3; margin:0; color:var(--ink-950); }
.taim-newsrow .meta { font-family:var(--font-mono); font-size:11px; color:var(--text-faint); letter-spacing:.04em; margin-top:6px; display:block; }

/* ---- Top 100 ranking (dark) ---- */
.taim-rank { background:#05070A; border-bottom:1px solid rgba(255,255,255,.1); }
.taim-rank__grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:48px; align-items:start; padding-top:60px; padding-bottom:60px; }
.taim-rank__intro { position:sticky; top:96px; }
.taim-rank__intro h2 { font-family:var(--font-display); font-size:46px; line-height:1; margin:16px 0 14px; color:#fff; text-transform:uppercase; letter-spacing:.01em; }
.taim-rank__intro h2 .accent { color:var(--cyan-400); }
.taim-rank__intro p { font-size:15.5px; color:rgba(255,255,255,.62); line-height:1.6; max-width:380px; margin:0 0 24px; }
.taim-rank__list { display:flex; flex-direction:column; border-top:1px solid rgba(255,255,255,.1); }
.taim-rankrow { display:flex; align-items:center; gap:22px; padding:22px 4px; border-bottom:1px solid rgba(255,255,255,.1); text-decoration:none; transition:background var(--dur-base) var(--ease-out); }
.taim-rankrow:hover { background:rgba(255,255,255,.05); }
.taim-rankrow__n { flex:0 0 auto; width:54px; font-family:var(--font-display); font-size:46px; line-height:.85; color:rgba(255,255,255,.2); text-align:right; }
.taim-rankrow__logo { flex:0 0 auto; width:48px; height:48px; border-radius:var(--radius-md); background:#fff; border:1px solid rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; }
.taim-rankrow__logo span { font-family:var(--font-display); font-size:20px; color:var(--ink-700); }
.taim-rankrow__logo img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:8px; background:#fff; }
.taim-rankrow h3 { font-size:18px; margin:0 0 4px; color:#fff; }
.taim-rankrow p { font-size:13.5px; color:rgba(255,255,255,.62); line-height:1.5; margin:0; max-width:520px; }

/* ---- Stats band (cyan) ---- */
.taim-stats { background:linear-gradient(120deg,var(--cyan-700),var(--cyan-600) 55%,var(--cyan-800)); }
.taim-stats__grid { display:grid; grid-template-columns:1fr 1.4fr; gap:48px; align-items:center; padding-top:56px; padding-bottom:56px; }
.taim-stats h2 { font-family:var(--font-display); font-size:42px; line-height:1.02; margin:16px 0 0; color:#fff; text-transform:uppercase; }
.taim-stats__nums { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.taim-stats__num { font-family:var(--font-display); font-size:64px; line-height:.92; color:#fff; }
.taim-stats__lbl { font-family:var(--font-mono); font-size:12px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.85); margin-top:6px; }

/* ---- Newsletter ---- */
.taim-news { padding-top:64px; padding-bottom:64px; }
.taim-news__card { position:relative; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:44px; display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center; overflow:hidden; box-shadow:var(--shadow-md); }
.taim-news__card::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--cyan-500); }
.taim-news__card h2 { font-size:32px; margin:14px 0 10px; color:var(--ink-950); letter-spacing:-.02em; }
.taim-news__card p { font-size:16px; color:var(--text-muted); line-height:1.55; margin:0; max-width:460px; }
.taim-news__form { display:flex; flex-direction:column; gap:14px; }
.taim-field label { display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:7px; }
.taim-field input { width:100%; height:52px; padding:0 16px; font-size:15px; font-family:var(--font-sans); color:var(--ink-950); background:#fff; border:1px solid var(--border-strong); border-radius:var(--radius-md); transition:border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.taim-field input:focus { outline:none; border-color:var(--cyan-500); box-shadow:var(--glow-sm); }

/* ---- Footer ---- */
.taim-footer { background:#05070A; padding:54px 40px 36px; }
.taim-footer__grid { max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:36px; }
.taim-footer__about p { font-size:14px; color:rgba(255,255,255,.6); line-height:1.6; margin:18px 0 0; max-width:290px; }
.taim-footer__col .h { font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan-400); margin-bottom:14px; }
.taim-footer__col a { display:flex; align-items:center; gap:9px; font-size:14px; color:rgba(255,255,255,.6); padding:5px 0; text-decoration:none; transition:color var(--dur-base) var(--ease-out); }
.taim-footer__col a:hover { color:#fff; }
.taim-footer__bottom { max-width:1280px; margin:36px auto 0; padding-top:24px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-family:var(--font-mono); font-size:11px; color:rgba(255,255,255,.4); letter-spacing:.06em; }

/* ============================================================
   ARTICLE (single) styles
   ============================================================ */
.taim-art-hero { background:radial-gradient(120% 90% at 85% 8%, rgba(0,176,240,.16), rgba(0,176,240,0) 55%), linear-gradient(180deg,#F4F8FC,#FFFFFF); border-bottom:1px solid var(--border); }
.taim-art-hero__inner { padding-top:30px; padding-bottom:40px; }
.taim-backlink { display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--border-strong); color:var(--text-body); padding:8px 14px; border-radius:var(--radius-md); text-decoration:none; font-size:13px; font-weight:600; transition:border-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out); }
.taim-backlink:hover { border-color:var(--border-cyan); color:var(--cyan-600); }
.taim-art-hero h1 { font-size:48px; line-height:1.04; letter-spacing:-.03em; margin:16px 0 14px; color:var(--ink-950); }
.taim-art-hero__lede { font-size:19px; color:var(--text-muted); line-height:1.5; max-width:720px; margin:0; }
.taim-art-feature { max-width:1080px; margin:0 auto; padding:0 40px; }
.taim-art-feature__img { position:relative; height:420px; margin-top:-1px; border-radius:0 0 var(--radius-lg) var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); }
.taim-art-feature__img img { width:100%; height:100%; object-fit:cover; }
.taim-article { max-width:840px; margin:0 auto; padding:36px 40px 72px; }
.taim-art-meta { display:flex; align-items:center; justify-content:space-between; padding-bottom:26px; border-bottom:1px solid var(--border); flex-wrap:wrap; gap:14px; }
.taim-art-meta__author { display:flex; align-items:center; gap:13px; }
.taim-avatar { width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,var(--cyan-700),var(--cyan-500)); display:flex; align-items:center; justify-content:center; color:var(--black); font-weight:800; }
.taim-art-meta__name { font-size:14px; font-weight:700; color:var(--ink-950); }
.taim-art-meta__sub { font-family:var(--font-mono); font-size:11.5px; color:var(--text-faint); letter-spacing:.04em; }
.taim-art-actions { display:flex; gap:9px; }
.taim-sharebtn { display:flex; align-items:center; gap:8px; background:var(--surface-2); border:1px solid var(--border-strong); color:var(--text-body); padding:8px 14px; border-radius:var(--radius-md); cursor:pointer; font-size:13px; font-weight:600; transition:border-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out); }
.taim-sharebtn:hover { border-color:var(--border-cyan); color:var(--cyan-600); }

.article-body { padding:32px 0 8px; }
.article-body p { font-size:17.5px; line-height:1.75; color:var(--ink-800); margin:0 0 24px; }
.article-body > p:first-of-type::first-letter { font-family:var(--font-display); font-size:68px; line-height:.72; float:left; color:var(--cyan-600); margin:6px 14px 0 0; }
.article-body h2 { font-size:27px; letter-spacing:-.02em; color:var(--ink-950); margin:40px 0 14px; }
.article-body h3 { font-size:21px; color:var(--ink-950); margin:32px 0 12px; }
.article-body img { border-radius:var(--radius-md); margin:24px 0; }
.article-body a { color:var(--cyan-700); text-decoration:underline; text-underline-offset:2px; }
.article-body ul, .article-body ol { font-size:17.5px; line-height:1.75; color:var(--ink-800); margin:0 0 24px; padding-left:24px; }
.article-body li { margin:0 0 8px; }
.article-body blockquote { margin:34px 0; padding:6px 0 6px 26px; border-left:2px solid var(--cyan-500); }
.article-body blockquote p { font-family:var(--font-sans); font-weight:700; font-size:26px; line-height:1.25; letter-spacing:-.02em; color:var(--ink-950); margin:0; }

.taim-takeaways { position:relative; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:28px 30px; margin:14px 0 30px; overflow:hidden; box-shadow:var(--shadow-sm); }
.taim-takeaways::before { content:""; position:absolute; top:0; left:0; right:0; height:2px; background:var(--cyan-500); }
.taim-takeaways .h { font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--cyan-600); margin-bottom:16px; }
.taim-takeaways ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.taim-takeaways li { display:flex; gap:12px; align-items:flex-start; font-size:15.5px; color:var(--ink-800); line-height:1.55; }
.taim-takeaways li::before { content:""; flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--cyan-500); margin-top:8px; }

.taim-tags { display:flex; flex-wrap:wrap; gap:8px; padding-top:22px; border-top:1px solid var(--border); }
.taim-tags a { display:inline-flex; align-items:center; height:28px; padding:0 12px; font-size:12.5px; font-weight:600; color:var(--text-body); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); text-decoration:none; transition:border-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out); }
.taim-tags a:hover { border-color:var(--border-cyan); color:var(--cyan-600); }

.taim-authorbox { display:flex; gap:18px; align-items:center; margin-top:34px; padding:24px; background:var(--ink-50); border:1px solid var(--border); border-radius:var(--radius-lg); }
.taim-authorbox .taim-avatar { width:58px; height:58px; font-size:20px; }
.taim-authorbox .l { font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan-600); margin-bottom:5px; }
.taim-authorbox .n { font-size:17px; font-weight:700; color:var(--ink-950); }
.taim-authorbox p { font-size:14px; color:var(--text-muted); line-height:1.55; margin:6px 0 0; }

.taim-related { border-top:1px solid var(--border); background:var(--ink-50); }
.taim-related__inner { padding-top:56px; padding-bottom:56px; }
.taim-related h2 { font-size:28px; margin:12px 0 26px; color:var(--ink-950); letter-spacing:-.02em; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1000px){
  .taim-hero__grid, .taim-split__grid, .taim-rank__grid, .taim-stats__grid, .taim-news__card { grid-template-columns:1fr; }
  .taim-cards--3 { grid-template-columns:repeat(2,1fr); }
  .taim-cards--5 { grid-template-columns:repeat(3,1fr); }
  .taim-posters { grid-template-columns:repeat(3,1fr); }
  .taim-rank__intro { position:static; }
  .taim-stats__nums { grid-template-columns:repeat(2,1fr); }
  .taim-hero h1 { font-size:40px; }
  .taim-art-hero h1 { font-size:34px; }
  .taim-footer__grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .taim-container, .taim-mid { padding-left:20px; padding-right:20px; }
  .taim-narrow, .taim-article { padding-left:20px; padding-right:20px; }
  .taim-nav__menu { display:none; }
  .taim-cards--3, .taim-cards--5, .taim-posters { grid-template-columns:1fr 1fr; }
  .taim-hero__cover img { max-width:70vw; }
  .taim-news__card { padding:28px; }
  .taim-stats__nums { grid-template-columns:1fr 1fr; }
  .taim-footer__grid { grid-template-columns:1fr; }
  .article-body p, .article-body ul, .article-body ol { font-size:16.5px; }
}

/* ============================================================
   SINGLE MAGAZINE ISSUE
   Light like every other content page — the dark band is a
   front-page section, not a page shell. The cover carries the
   page and reuses the hero's cyan glow; nothing else competes.
   ============================================================ */
.taim-issue { position:relative; overflow:hidden; background:radial-gradient(120% 90% at 82% 12%, rgba(0,176,240,.16), rgba(0,176,240,0) 55%), linear-gradient(180deg,#F4F8FC,#FFFFFF); padding:30px 0 88px; }
.taim-issue__inner { position:relative; z-index:1; }

.taim-issue__body { min-width:0; }  /* grid items default to min-width:auto, which long titles would overflow */
.taim-issue__grid { display:grid; grid-template-columns:minmax(0,380px) minmax(0,1fr); gap:64px; align-items:start; margin-top:24px; }

/* Cover treatment mirrors .taim-hero__cover — same glow, same lift. */
.taim-issue__coverwrap { position:relative; display:flex; justify-content:center; }
.taim-issue__coverwrap .glow { position:absolute; inset:6% -4% -8% 8%; border-radius:20px; background:linear-gradient(150deg,var(--cyan-500),var(--cyan-700) 55%,var(--ink-900)); transform:rotate(4deg); box-shadow:0 40px 80px rgba(0,176,240,.32); }
.taim-issue__cover { position:relative; z-index:1; display:block; width:100%; height:auto; border-radius:8px; box-shadow:0 30px 60px rgba(10,14,20,.34); border:1px solid rgba(255,255,255,.5); }

.taim-issue__title { font-size:48px; line-height:1.04; letter-spacing:-.03em; margin:16px 0 0; color:var(--ink-950); }
.taim-issue__lede { font-size:18px; color:var(--text-muted); line-height:1.55; margin:14px 0 0; max-width:52ch; }

.taim-issue__gate { margin-top:28px; padding-top:28px; border-top:1px solid var(--border); }
.taim-issue__actions { display:flex; flex-wrap:wrap; gap:12px; }
.taim-issue__note { color:var(--text-muted); font-size:13.5px; line-height:1.55; margin:14px 0 0; max-width:46ch; }

.taim-issue__contents { margin-top:36px; }
.taim-issue__contents-label { font-family:var(--font-mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); }
.taim-issue__contents ul { list-style:none; margin:14px 0 0; padding:0; }
.taim-issue__contents li { padding:15px 0 15px 18px; border-left:2px solid var(--border); transition:border-color var(--dur-base) var(--ease-out); }
.taim-issue__contents li:hover { border-left-color:var(--cyan-500); }
.taim-issue__contents h2 { font-size:15px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; margin:0; color:var(--ink-950); }
.taim-issue__contents p { color:var(--text-muted); font-size:14px; line-height:1.6; margin:6px 0 0; max-width:56ch; }

.taim-issue__more { margin-top:72px; padding-top:32px; border-top:1px solid var(--border); }
.taim-issue__morerow { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:18px; }
.taim-issue__mini { display:block; text-decoration:none; }
.taim-issue__mini img { width:100%; height:auto; aspect-ratio:3/4; object-fit:cover; border-radius:var(--radius-sm); border:1px solid var(--border); transition:border-color var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.taim-issue__mini:hover img { border-color:var(--border-cyan); transform:translateY(-3px); }
.taim-issue__mini span { display:block; margin-top:10px; font-size:13px; color:var(--text-body); }
.taim-issue__mini:hover span { color:var(--cyan-600); }

@media (max-width:900px) {
  .taim-issue__grid { grid-template-columns:1fr; gap:38px; }
  .taim-issue__coverwrap { max-width:300px; }
  .taim-issue__title { font-size:34px; }
  .taim-issue__morerow { grid-template-columns:repeat(2,1fr); }
}
@media (prefers-reduced-motion:reduce) {
  .taim-issue__mini img, .taim-issue__contents li { transition:none; }
  .taim-issue__mini:hover img { transform:none; }
}

/* Launch mode: magazine "coming soon" + newsletter inline message */
.taim-issue__soon { }
.taim-issue__soon-tag { display:inline-block; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--cyan-600); border:1px solid var(--border-cyan); border-radius:999px; padding:5px 12px; margin-bottom:14px; }
.taim-news__msg { margin:12px 0 0; font-size:13.5px; min-height:1.2em; }
.taim-news__msg[data-state="ok"] { color:var(--cyan-600); }
.taim-news__msg[data-state="err"] { color:#c0392b; }