*{margin:0;padding:0;box-sizing:border-box}
:root{
  --orange:#e85d3a;--orange-light:#f4a261;--orange-bg:rgba(232,93,58,0.05);
  --navy:#1d2d3f;--navy-light:#37465f;
  --text-dark:#1a1a1a;--text-body:#2d2d2d;--text-zh:#222;--text-en:#3a3a3a;--text-sub:#555;
  --warm-white:#fafaf8;--warm-bg:#f5f3ef;--warm-gray:#e8e4dd;
}
body{font-family:'Inter','Noto Sans TC',sans-serif;background:var(--warm-white);color:var(--text-dark);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.8}

@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.fade{opacity:0;animation:fadeUp .55s ease forwards}
.d1{animation-delay:.08s}.d2{animation-delay:.14s}.d3{animation-delay:.2s}.d4{animation-delay:.26s}.d5{animation-delay:.32s}.d6{animation-delay:.38s}

/* NAV */
.ta-header{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:100}
.ta-nav{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 40px;min-height:68px}
.ta-logo{max-width:170px;width:100%}
.ta-nav-links{display:flex;align-items:center}
.ta-nav-item{padding:10px 18px;text-decoration:none;font-size:11px;letter-spacing:2.5px;font-weight:600;color:#37465f;opacity:0.6;transition:all .3s;display:inline-flex;flex-direction:column;align-items:center;gap:3px}
.ta-nav-item i{font-size:14px;opacity:0.5;color:#70c1b7}
.ta-nav-item:hover,.ta-nav-item.active{opacity:1;color:#70c1b7;text-decoration:none}

/* HERO */
.guide-hero{
  background:linear-gradient(135deg,var(--navy) 0%,#2d4562 60%,#3a5070 100%);
  padding:64px 40px 60px;text-align:center;color:#fff;
  position:relative;overflow:hidden;
}
.guide-hero::before{
  content:'';position:absolute;top:-60px;right:-60px;
  width:300px;height:300px;border-radius:50%;
  background:rgba(232,93,58,.08);
}
.guide-hero::after{
  content:'';position:absolute;bottom:-80px;left:-40px;
  width:240px;height:240px;border-radius:50%;
  background:rgba(244,162,97,.06);
}
.guide-hero-inner{position:relative;z-index:2;max-width:700px;margin:0 auto}
.guide-hero h1{font-family:'Noto Sans TC',sans-serif;font-size:34px;font-weight:900;letter-spacing:.5px;margin-bottom:6px}
.guide-hero .en-title{font-family:'DM Serif Display',serif;font-size:22px;font-weight:400;color:var(--orange-light);margin-bottom:16px}
.guide-hero .hero-desc{font-family:'Noto Sans TC',sans-serif;font-size:15px;color:rgba(255,255,255,.7);line-height:1.8;max-width:520px;margin:0 auto}

/* BREADCRUMB */
.breadcrumb{max-width:1100px;margin:0 auto;padding:14px 40px 0;font-size:13px;color:#999}
.breadcrumb a{color:#888;text-decoration:none}.breadcrumb a:hover{color:var(--orange)}
.breadcrumb span{margin:0 6px;color:#ccc}

/* GUIDE GRID */
.guide-sec{max-width:1100px;margin:0 auto;padding:40px 40px 48px}
.sec-title-zh{font-family:'Noto Sans TC',sans-serif;font-size:22px;font-weight:900;color:var(--text-dark);margin-bottom:3px}
.sec-title-en{font-family:'DM Serif Display',serif;font-size:16px;font-weight:400;color:var(--orange);margin-bottom:28px}

.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.guide-card{
  background:#fff;border:1px solid #eee;border-radius:16px;
  overflow:hidden;text-decoration:none;color:inherit;
  transition:all .3s;display:flex;flex-direction:column;
}
.guide-card:hover{border-color:var(--orange);transform:translateY(-4px);box-shadow:0 12px 32px rgba(232,93,58,.08)}
.guide-card.live:hover .card-icon{transform:scale(1.1)}

.card-top{
  padding:32px 24px 24px;display:flex;flex-direction:column;
  align-items:center;text-align:center;flex:1;
}
.card-icon{
  width:64px;height:64px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  font-size:28px;margin-bottom:16px;transition:transform .3s;
}
.card-icon--leaflet{background:rgba(232,93,58,.08)}
.card-icon--poster{background:rgba(59,130,246,.08)}
.card-icon--booklet{background:rgba(16,185,129,.08)}
.card-icon--banner{background:rgba(139,92,246,.08)}
.card-icon--rollup{background:rgba(236,72,153,.08)}
.card-icon--calendar{background:rgba(245,158,11,.08)}

.card-name-zh{font-family:'Noto Sans TC',sans-serif;font-size:18px;font-weight:700;color:var(--text-dark);margin-bottom:3px}
.card-name-en{font-family:'Inter',sans-serif;font-size:13px;font-weight:600;color:var(--orange);margin-bottom:10px}
.card-desc{font-family:'Noto Sans TC','Inter',sans-serif;font-size:13px;font-weight:500;color:var(--text-sub);line-height:1.7}

.card-bottom{
  padding:12px 24px;border-top:1px solid #f0eeea;
  display:flex;align-items:center;justify-content:space-between;
}
.card-status{font-family:'Noto Sans TC','Inter',sans-serif;font-size:12px;font-weight:700}
.card-status--live{color:#059669}
.card-status--soon{color:#999}
.card-arrow{font-size:14px;color:var(--orange);transition:transform .2s}
.guide-card:hover .card-arrow{transform:translateX(4px)}

/* COMING SOON OVERLAY */
.guide-card.coming-soon{opacity:.65;pointer-events:none}
.guide-card.coming-soon .card-arrow{display:none}

/* CTA */
.cta-sec{max-width:1100px;margin:0 auto;padding:0 40px 48px}
.cta-inner{background:var(--warm-bg);border:1px solid var(--warm-gray);border-radius:16px;padding:36px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta-text-zh{font-family:'Noto Sans TC',sans-serif;font-size:17px;font-weight:700;color:var(--text-dark);margin-bottom:2px}
.cta-text-en{font-family:'Inter',sans-serif;font-size:14px;font-weight:500;color:var(--text-sub)}
.cta-btn{font-family:'Noto Sans TC','Inter',sans-serif;font-size:14px;font-weight:700;padding:12px 28px;border-radius:8px;text-decoration:none;background:var(--orange);color:#fff;transition:all .2s;white-space:nowrap}
.cta-btn:hover{background:#d04e2e}

/* FOOTER */
.ta-footer{background:var(--navy);color:#fff;padding:40px 40px 24px;margin-top:24px}
.footer-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:36px}
.footer-brand{font-family:'DM Serif Display',serif;font-size:17px;margin-bottom:8px}
.footer-desc{font-family:'Noto Sans TC','Inter',sans-serif;font-size:12px;color:rgba(255,255,255,.5);line-height:1.7;max-width:260px}
.footer-title{font-family:'Noto Sans TC',sans-serif;font-size:11px;font-weight:700;letter-spacing:1.5px;margin-bottom:10px;color:rgba(255,255,255,.85)}
.footer-links{list-style:none;padding:0}
.footer-links li{margin-bottom:6px}
.footer-links a{font-family:'Noto Sans TC','Inter',sans-serif;font-size:12px;color:rgba(255,255,255,.5);text-decoration:none;transition:color .2s}
.footer-links a:hover{color:var(--orange-light)}
.footer-bottom{max-width:1100px;margin:16px auto 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.08);font-size:11px;color:rgba(255,255,255,.3);text-align:center}

/* RESPONSIVE */
@media(max-width:768px){
  .ta-nav{padding:0 20px;min-height:58px}
  .ta-logo{max-width:130px}
  .ta-nav-links{display:none}
  .guide-hero{padding:28px 20px 28px}
  .guide-hero img{min-height:160px;max-height:200px;object-fit:cover;object-position:center 30%}
  .guide-hero h1{font-size:26px}
  .guide-hero .en-title{font-size:18px}
  .breadcrumb{padding:10px 20px 0;font-size:12px}
  .guide-sec{padding:28px 20px 36px}
  .guide-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .card-top{padding:20px 14px 16px}
  .card-icon{width:48px;height:48px;border-radius:12px;font-size:22px;margin-bottom:10px}
  .card-name-zh{font-size:15px}
  .card-name-en{font-size:11px;margin-bottom:6px}
  .card-desc{font-size:11px;line-height:1.5}
  .card-bottom{padding:8px 14px}
  .cta-sec{padding:0 20px 36px}
  .cta-inner{flex-direction:column;text-align:center;padding:28px 20px}
  .ta-footer{padding:32px 20px 20px}
  .footer-inner{grid-template-columns:1fr;gap:24px}
}
@media(min-width:769px) and (max-width:1024px){
  .guide-grid{grid-template-columns:repeat(2,1fr)}
}

/* === Mobile hero full-size override (May 6, v3) === */
@media (max-width:576px){
  .ta-hero-banner img,
  picture > img[src*='hero']{
    max-height:none!important;
    height:auto!important;
    width:100%!important;
    object-fit:contain!important;
    aspect-ratio:2/3;
  }
  .ta-hero-banner{max-height:none!important;height:auto!important}
}
