/*
Theme Name: Komik Universe Redirect
Theme URI: https://komik-universe.hatchable.site/
Author: Komik Universe
Description: Tema WordPress landing page pengalihan bergaya dark comic/anime.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: komik-universe-redirect
*/
:root{--bg:#08090d;--card:rgba(18,19,27,.88);--line:rgba(255,255,255,.08);--muted:rgba(255,255,255,.58);--accent:#a78bfa;--accent-2:#7c3aed}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#08090d;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.site-bg{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 18%,rgba(124,58,237,.22),transparent 32%),radial-gradient(circle at 82% 12%,rgba(59,130,246,.14),transparent 28%),radial-gradient(circle at 50% 92%,rgba(167,139,250,.10),transparent 30%),linear-gradient(180deg,#090a10 0%,#06070a 100%)}
.site-bg:after{content:"";position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 82%)}
.redirect-wrap{position:relative;z-index:1;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:48px 20px}
.redirect-shell{width:100%;max-width:672px}
.topbar{margin-bottom:32px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-weight:800;letter-spacing:-.02em}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--accent-2),var(--accent));font-size:12px;box-shadow:0 10px 35px rgba(124,58,237,.35)}
.status-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03);color:rgba(255,255,255,.62);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.09em}
.status-dot{width:7px;height:7px;border-radius:999px;background:#8bffb2;box-shadow:0 0 12px #8bffb2}
.hero-card{border:1px solid var(--line);border-radius:28px;padding:clamp(24px,5vw,48px);background:linear-gradient(180deg,rgba(22,23,32,.95),rgba(13,14,20,.92));box-shadow:0 35px 100px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(18px)}
.eyebrow{font-size:12px;letter-spacing:.18em;font-weight:800;color:var(--accent);margin-bottom:16px}
h1{margin:0;font-size:clamp(38px,7vw,80px);line-height:.98;letter-spacing:-.055em;font-weight:900}
h1 span{color:#c4b5fd}
.lead{max-width:52ch;margin:22px 0 0;color:var(--muted);font-size:16px;line-height:1.75}
.target-card{display:flex;align-items:center;gap:16px;margin-top:28px;padding:16px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.025);border-radius:18px}
.target-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:rgba(167,139,250,.10);color:#c4b5fd;font-size:19px;flex:0 0 auto}
.target-label{font-size:10px;font-weight:800;letter-spacing:.13em;color:rgba(255,255,255,.35)}
.target-value{margin-top:3px;color:rgba(255,255,255,.85);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.primary-btn{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;margin-top:16px;padding:16px 18px;border-radius:16px;text-decoration:none;font-weight:800;color:#fff;background:linear-gradient(135deg,#7c3aed,#9f67ff);box-shadow:0 16px 36px rgba(124,58,237,.28);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
.primary-btn:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(124,58,237,.36);filter:brightness(1.05);color:#fff}
.primary-btn .arrow{font-size:21px}
.helper{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;color:rgba(255,255,255,.38);font-size:13px}
.helper strong{color:rgba(255,255,255,.7)}
.info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.mini-card{display:flex;gap:12px;padding:17px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}
.mini-icon{flex:0 0 auto;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.05);color:#c4b5fd;font-weight:900}
.mini-card h2{margin:1px 0 4px;font-size:14px;font-weight:800;color:#fff}
.mini-card p{margin:0;color:rgba(255,255,255,.42);font-size:12px;line-height:1.5}
.redirect-footer{margin-top:32px;text-align:center;color:rgba(255,255,255,.35);font-size:12px}
@media(max-width:640px){.info-grid{grid-template-columns:1fr}.hero-card{border-radius:24px}.target-value{font-size:13px}}