/*
Theme Name: 台灣搖滾映像誌
Theme URI: https://taiwan-rock-visual-zine.vocal-wolf-1805.chatgpt.site/
Author: 台灣搖滾映像誌
Description: 台灣搖滾、Live House、影像專題與娛樂資訊編輯型 WordPress 主題。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: taiwan-rock-zine
*/
:root{--black:#0b0b0b;--paper:#eee9dd;--acid:#dfff00;--red:#ff4035;--grey:#aaa69b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--black);font-family:"Arial Narrow","Noto Sans TC","Microsoft JhengHei",Arial,sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}.wrap{max-width:1380px;margin:auto;padding-left:28px;padding-right:28px}.site-header{background:var(--black);color:#fff;border-bottom:1px solid #444;position:sticky;top:0;z-index:60}.mast{height:84px;display:flex;align-items:center;gap:34px}.logo{display:flex;align-items:center;gap:12px;margin-right:auto}.logo-bolt{width:46px;height:54px;background:var(--acid);color:#111;display:grid;place-items:center;font-size:27px;transform:skew(-6deg)}.logo b{font-size:21px;letter-spacing:.08em}.logo em{font-style:normal;color:var(--acid);margin-left:6px}.logo small{display:block;font-size:8px;letter-spacing:.17em;color:#999}.main-nav{display:flex;gap:24px;font-size:13px}.main-nav a{padding:31px 0;border-bottom:3px solid transparent}.main-nav a:hover{color:var(--acid);border-color:var(--acid)}.header-offer{border:1px solid var(--acid);color:var(--acid);padding:12px 15px;font-weight:800;font-size:12px}.cover-story{min-height:730px;background:var(--black);color:white;display:grid;grid-template-columns:.75fr 1.45fr 60px;padding:45px max(3vw,28px) 55px;gap:28px}.cover-copy{align-self:center;z-index:2}.kicker,.section-mark span,.page-hero>span{color:var(--acid);font-size:11px;letter-spacing:.2em;font-weight:800}.cover-copy h1{font-size:clamp(72px,9vw,130px);line-height:.8;letter-spacing:-.07em;margin:35px 0}.cover-copy h1 i{color:var(--red);font-style:normal;display:inline-block;transform:rotate(-5deg);font-family:serif}.cover-copy p{max-width:440px;color:#c1c1b8;line-height:1.8}.rock-btn{display:inline-flex;gap:8px;align-items:center;color:var(--acid);font-size:11px;letter-spacing:.18em;font-weight:bold;margin-top:25px}.hero-photo{position:relative;min-height:620px;overflow:hidden}.hero-photo img{width:100%;height:100%;object-fit:cover;filter:contrast(1.15) saturate(.85)}.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#ff40352b,transparent 55%,#dfff0026);mix-blend-mode:screen}.sticker{position:absolute;z-index:2;left:-14px;bottom:85px;background:var(--acid);color:#111;padding:20px 25px;font-size:22px;font-weight:900;line-height:1.1;transform:rotate(-7deg);box-shadow:8px 8px 0 var(--red)}.caption{position:absolute;z-index:2;right:12px;bottom:12px;background:#000;color:#fff;padding:8px;font-size:9px;letter-spacing:.18em}.side-type{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;letter-spacing:.35em;color:var(--acid);align-self:center}.ticker{display:flex;gap:34px;align-items:center;overflow:hidden;white-space:nowrap;background:var(--acid);padding:15px 0;font-size:13px;letter-spacing:.18em}.ticker b{font-size:18px}.lead-grid{display:grid;grid-template-columns:1fr 1fr}.lead-grid>article{padding:70px max(5vw,30px);background:var(--red);color:white}.lead-grid h2{font-size:48px;line-height:1.1}.manifesto{padding:80px max(5vw,30px);display:flex;flex-direction:column;justify-content:center}.manifesto p{margin:5px 0;font-size:28px;font-weight:900;border-bottom:2px solid #111;padding:10px 0}.section{padding-top:90px;padding-bottom:90px}.section-mark{display:flex;align-items:end;justify-content:space-between;border-bottom:5px solid #111;padding-bottom:14px;margin-bottom:35px}.section-mark b{font-size:40px}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.post-cover{height:270px;padding:22px;display:grid;grid-template-columns:1fr auto;position:relative;overflow:hidden;background:#171717;color:white}.post-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.post-cover:has(img):after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0009,transparent)}.post-cover span,.post-cover b{position:relative;z-index:2}.post-cover b{font-size:72px;line-height:.8;-webkit-text-stroke:1px var(--acid);color:transparent}.post-card:nth-child(3n+2) .post-cover{background:var(--red);color:#111}.post-card:nth-child(3n) .post-cover{background:var(--acid);color:#111}.post-card>p{font-size:11px;color:#6b685f;letter-spacing:.15em;margin:18px 0 8px}.post-card h3{font-size:25px;line-height:1.3;margin:0 0 10px}.post-card>small{color:#67655e;line-height:1.7}.ent-strip{background:#111;color:#fff;padding:90px max(5vw,30px);display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}.ent-strip h2{font-size:50px;line-height:1;margin:20px 0}.ent-strip p{color:#aaa;line-height:1.8}.ent-links{border-top:1px solid #555}.ent-links a{display:grid;grid-template-columns:55px 1fr 25px;align-items:center;border-bottom:1px solid #555;padding:22px 5px}.ent-links b{color:var(--acid);font-size:24px}.ent-links span{font-size:20px}.scene{display:grid;grid-template-columns:1fr 1fr}.scene-title{background:var(--acid);padding:80px max(5vw,30px)}.scene-title h2{font-size:62px;line-height:1}.timeline{padding:65px max(5vw,30px);background:#d8d2c4}.timeline>div{display:grid;grid-template-columns:80px 1fr;border-top:2px solid #111;padding:24px 0}.timeline b{font-size:24px}.timeline span{font-weight:900}.timeline p{grid-column:2;color:#666}.page-hero{background:#111;color:#fff;padding:105px max(6vw,30px);position:relative;overflow:hidden}.page-hero:after{content:"NOISE";position:absolute;right:-30px;bottom:-50px;font-size:220px;font-weight:900;color:#ffffff07}.page-hero h1{font-size:clamp(58px,8vw,105px);line-height:.9;letter-spacing:-.06em;margin:30px 0;position:relative;z-index:1}.page-hero p{max-width:760px;color:#aaa;line-height:1.9;font-size:18px}.check-grid{display:grid;grid-template-columns:repeat(4,1fr);padding-top:80px;padding-bottom:80px}.check{padding:28px;border-left:2px solid #111}.check:last-child{border-right:2px solid #111}.check b{font-size:42px;color:var(--red)}.check h2{font-size:24px}.check p{color:#666;line-height:1.7}.method{background:var(--red);padding:90px max(7vw,30px);display:grid;grid-template-columns:1fr 1fr;gap:80px}.method h2{font-size:54px;line-height:1}.method p{line-height:1.9}.method li{padding:12px 0;border-bottom:1px solid #111}.article{max-width:900px;margin:90px auto;padding:0 28px}.article h1{font-size:clamp(48px,7vw,82px);line-height:1.03}.article h2{font-size:38px;margin-top:48px}.article p{font-size:17px;line-height:2;color:#514f49}.article blockquote{font-size:27px;font-weight:900;border-left:8px solid var(--red);padding:20px 28px;background:#d8d2c4}.single-cover{width:100%;aspect-ratio:16/10;object-fit:cover}.floating-cta{position:fixed;right:18px;bottom:18px;z-index:70;background:var(--acid);padding:14px 18px;font-size:12px;font-weight:900;box-shadow:7px 7px 0 var(--red)}.site-footer{background:#0b0b0b;color:#fff;padding:75px 0}.footer-top{display:flex;justify-content:space-between;align-items:start;padding-bottom:45px;border-bottom:1px solid #444}.footer-top p{max-width:520px;color:#999;line-height:1.8}.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;padding-top:42px}.footer-col{display:flex;flex-direction:column;gap:12px}.footer-col b{color:var(--acid)}.footer-col a,.footer-col span{color:#aaa;font-size:13px}
@media(max-width:900px){.main-nav{display:none}.mast{height:72px}.cover-story{grid-template-columns:1fr}.side-type{display:none}.hero-photo{min-height:500px}.lead-grid,.ent-strip,.scene,.method{grid-template-columns:1fr}.post-grid{grid-template-columns:1fr}.check-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.wrap{padding-left:18px;padding-right:18px}.logo b{font-size:17px}.header-offer{padding:9px;font-size:10px}.cover-copy h1{font-size:68px}.hero-photo{min-height:390px}.lead-grid h2,.ent-strip h2{font-size:40px}.check-grid{grid-template-columns:1fr}.check{border-left:0;border-top:2px solid #111}.check:last-child{border-right:0}.footer-top{display:block}.footer-grid{grid-template-columns:1fr}.page-hero h1{font-size:58px}}