/*
Theme Name: NIHON GUIDE (English)
Theme URI: https://nihonguide.com
Author: ryu0514
Description: English Japan travel blog theme — Travel, Food, Culture & Tips for international visitors.
Version: 1.0.0
Tags: blog, travel, japan, english, affiliate
Text Domain: nihonguide
*/

:root {
  --red: #C0392B;
  --ink: #1a1a2e;
  --gray: #6b7280;
  --gray-light: #f3f4f6;
  --border: #e5e7eb;
  --white: #ffffff;
  --accent: #d4a017;
  --travel:  #2980b9;
  --food:    #e67e22;
  --culture: #8e44ad;
  --tips:    #27ae60;
  --font-serif: Georgia, serif;
  --font-sans: 'Helvetica Neue', Arial, sans-serif;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
body { font-family: var(--font-sans); color: var(--ink); background: var(--white); line-height:1.7; font-size:16px; }
a { text-decoration:none; color:inherit; }
img { max-width:100%; height:auto; display:block; }
.screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); }

/* HEADER */
.site-header { background:var(--white); border-bottom:3px solid var(--red); position:sticky; top:0; z-index:100; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.header-inner { max-width:1200px; margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between; height:64px; }
.site-branding { display:flex; align-items:center; gap:10px; }
.logo-circle { width:36px; height:36px; background:var(--red); border-radius:50%; display:flex; align-items:center; justify-content:center; color:white; font-size:13px; font-weight:900; flex-shrink:0; }
.site-title { font-size:20px; font-weight:800; color:var(--ink); letter-spacing:2px; }
.site-title span { color:var(--red); }
.main-navigation ul { list-style:none; display:flex; gap:4px; align-items:center; flex-wrap:wrap; }
.main-navigation ul li a { padding:6px 14px; border-radius:20px; font-size:14px; color:var(--gray); font-weight:500; transition:all .2s; display:block; }
.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a { background:var(--red); color:white; }
.menu-toggle { display:none; background:none; border:none; cursor:pointer; font-size:22px; color:var(--ink); }

/* HERO */
.site-hero { background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%); padding:80px 24px; text-align:center; position:relative; overflow:hidden; }
.site-hero::before { content:'日本'; position:absolute; font-size:280px; font-weight:900; color:rgba(255,255,255,.03); top:50%; left:50%; transform:translate(-50%,-50%); pointer-events:none; }
.hero-tag { display:inline-block; background:var(--red); color:white; padding:4px 14px; border-radius:20px; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:18px; }
.hero-title { font-size:clamp(30px,5vw,54px); color:white; font-family:var(--font-serif); font-weight:700; line-height:1.25; margin-bottom:14px; }
.hero-desc { color:rgba(255,255,255,.65); font-size:17px; max-width:500px; margin:0 auto 28px; }
.hero-cats { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.hero-cat-btn { padding:8px 20px; border-radius:24px; font-size:14px; font-weight:700; border:2px solid rgba(255,255,255,.25); color:white; background:transparent; transition:all .2s; text-decoration:none; display:inline-block; }
.hero-cat-btn:hover { background:rgba(255,255,255,.15); color:white; }

/* CATEGORY LABELS */
.cat-label { display:inline-block; padding:3px 10px; border-radius:4px; font-size:11px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:white; margin-bottom:10px; }
.cat-travel  { background:var(--travel); }
.cat-food    { background:var(--food); }
.cat-culture { background:var(--culture); }
.cat-tips    { background:var(--tips); }
.cat-default { background:var(--red); }

/* LAYOUT */
.site-main { max-width:1200px; margin:0 auto; padding:48px 24px; display:grid; grid-template-columns:1fr 300px; gap:48px; }
@media (max-width:900px) { .site-main { grid-template-columns:1fr; } }

/* FEATURED */
.featured-post { background:var(--white); border-radius:16px; overflow:hidden; box-shadow:0 4px 24px rgba(0,0,0,.08); margin-bottom:40px; display:grid; grid-template-columns:1fr 1fr; transition:transform .2s,box-shadow .2s; }
.featured-post:hover { transform:translateY(-3px); box-shadow:0 10px 36px rgba(0,0,0,.13); }
.featured-post-img { height:280px; overflow:hidden; }
.featured-post-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.featured-post:hover .featured-post-img img { transform:scale(1.04); }
.featured-post-img .no-thumb { width:100%; height:100%; background:linear-gradient(135deg,#1a1a2e,#0f3460); display:flex; align-items:center; justify-content:center; font-size:64px; }
.featured-post-body { padding:32px 28px; display:flex; flex-direction:column; justify-content:center; }
.featured-post-title { font-size:21px; font-family:var(--font-serif); line-height:1.4; margin-bottom:10px; }
.featured-post-title a { color:var(--ink); }
.featured-post-title a:hover { color:var(--red); }
.featured-post-excerpt { color:var(--gray); font-size:14px; margin-bottom:16px; line-height:1.7; }
.post-meta { display:flex; gap:12px; font-size:12px; color:var(--gray); flex-wrap:wrap; }
@media (max-width:640px) { .featured-post { grid-template-columns:1fr; } .featured-post-img { height:200px; } }

/* SECTION TITLE */
.section-heading { font-size:12px; font-weight:800; letter-spacing:3px; text-transform:uppercase; color:var(--gray); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
.section-heading::after { content:''; flex:1; height:1px; background:var(--border); }

/* POST GRID */
.posts-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
@media (max-width:640px) { .posts-grid { grid-template-columns:1fr; } }
.post-card { background:var(--white); border-radius:12px; overflow:hidden; border:1px solid var(--border); transition:transform .2s,box-shadow .2s; display:flex; flex-direction:column; }
.post-card:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.1); }
.post-card-thumb { height:170px; overflow:hidden; }
.post-card-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.post-card:hover .post-card-thumb img { transform:scale(1.05); }
.post-card-thumb .no-thumb { width:100%; height:100%; background:linear-gradient(135deg,#1a1a2e,#0f3460); display:flex; align-items:center; justify-content:center; font-size:48px; }
.post-card-body { padding:16px; flex:1; display:flex; flex-direction:column; }
.post-card-title { font-size:15px; font-family:var(--font-serif); line-height:1.5; margin:8px 0; flex:1; }
.post-card-title a { color:var(--ink); }
.post-card-title a:hover { color:var(--red); }
.post-card-excerpt { font-size:13px; color:var(--gray); margin-bottom:12px; }
.read-more-link { font-size:13px; color:var(--red); font-weight:700; display:inline-flex; align-items:center; gap:4px; margin-top:auto; }

/* PAGINATION */
.pagination { margin-top:40px; display:flex; justify-content:center; gap:8px; flex-wrap:wrap; }
.pagination .page-numbers { padding:8px 16px; border-radius:8px; border:1px solid var(--border); font-size:14px; font-weight:600; color:var(--gray); transition:all .2s; }
.pagination .page-numbers:hover, .pagination .page-numbers.current { background:var(--red); color:white; border-color:var(--red); }

/* SIDEBAR */
.widget { background:var(--white); border:1px solid var(--border); border-radius:12px; overflow:hidden; margin-bottom:24px; }
.widget-title { background:var(--ink); color:white; padding:10px 16px; font-size:12px; font-weight:800; letter-spacing:2px; text-transform:uppercase; margin:0; }
.widget-content { padding:16px; }
.widget ul { list-style:none; }
.widget ul li { padding:8px 0; border-bottom:1px solid var(--border); font-size:13px; }
.widget ul li:last-child { border-bottom:none; }
.widget ul li a { color:var(--ink); font-weight:500; }
.widget ul li a:hover { color:var(--red); }
.affiliate-widget { background:linear-gradient(135deg,#f6d365,#fda085); border-radius:12px; padding:20px; text-align:center; margin-bottom:24px; }
.affiliate-widget .aff-label { font-size:11px; font-weight:700; color:rgba(0,0,0,.4); letter-spacing:1px; text-transform:uppercase; margin-bottom:6px; }
.affiliate-widget h4 { font-size:15px; font-weight:800; color:var(--ink); margin-bottom:4px; line-height:1.4; }
.affiliate-widget small { font-size:12px; color:rgba(0,0,0,.45); display:block; margin-bottom:12px; }
.aff-btn { display:block; background:var(--ink); color:white; padding:10px 16px; border-radius:24px; font-size:13px; font-weight:700; text-align:center; transition:opacity .2s; }
.aff-btn:hover { opacity:.8; color:white; }
.tag-cloud-list { display:flex; flex-wrap:wrap; gap:6px; }
.tag-cloud-list a { padding:4px 10px; background:var(--gray-light); border-radius:20px; font-size:12px; color:var(--gray); transition:all .2s; }
.tag-cloud-list a:hover { background:var(--red); color:white; }

/* SINGLE */
.single-layout { max-width:1200px; margin:0 auto; padding:48px 24px; display:grid; grid-template-columns:1fr 300px; gap:48px; }
@media (max-width:900px) { .single-layout { grid-template-columns:1fr; } }
.breadcrumb { max-width:1200px; margin:0 auto; padding:16px 24px 0; font-size:13px; color:var(--gray); }
.breadcrumb a { color:var(--gray); }
.breadcrumb a:hover { color:var(--red); }
.breadcrumb .sep { margin:0 6px; }
.entry-hero-img { width:100%; height:400px; object-fit:cover; border-radius:16px; margin-bottom:28px; }
.entry-title { font-size:clamp(22px,3.5vw,36px); font-family:var(--font-serif); line-height:1.35; margin:12px 0 16px; }
.entry-meta { display:flex; gap:16px; font-size:13px; color:var(--gray); flex-wrap:wrap; margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid var(--border); }
.entry-content { font-size:16px; line-height:1.9; color:#333; }
.entry-content h2 { font-size:22px; font-family:var(--font-serif); margin:36px 0 14px; padding-left:14px; border-left:4px solid var(--red); }
.entry-content h3 { font-size:18px; margin:28px 0 10px; }
.entry-content p { margin-bottom:18px; }
.entry-content ul, .entry-content ol { margin:0 0 18px 24px; }
.entry-content blockquote { border-left:4px solid var(--red); padding:16px 20px; background:var(--gray-light); border-radius:0 8px 8px 0; margin:24px 0; font-style:italic; color:var(--gray); }
.entry-content img { border-radius:10px; margin:20px 0; }
.entry-content a { color:var(--red); text-decoration:underline; }
.tip-box { background:#fff8e1; border-left:4px solid var(--accent); padding:16px 20px; border-radius:0 8px 8px 0; margin:24px 0; font-size:14px; }
.tip-box strong { display:block; color:var(--accent); margin-bottom:4px; font-size:12px; letter-spacing:1px; text-transform:uppercase; }
.affiliate-inline { background:linear-gradient(135deg,#e8f4f8,#f0f9ff); border:1px solid #bfdbfe; border-radius:12px; padding:20px; margin:28px 0; display:flex; gap:16px; align-items:center; }
.affiliate-inline-icon { font-size:40px; flex-shrink:0; }
.affiliate-inline h4 { font-size:15px; font-weight:700; margin-bottom:4px; }
.affiliate-inline p { font-size:13px; color:var(--gray); margin-bottom:10px; }
.affiliate-inline .aff-link { background:#1d4ed8; color:white !important; text-decoration:none !important; padding:8px 18px; border-radius:20px; font-size:13px; font-weight:700; display:inline-block; }
.entry-tags { margin-top:32px; padding-top:24px; border-top:1px solid var(--border); display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.entry-tags .tags-label { font-size:13px; font-weight:700; color:var(--gray); }
.entry-tags a { padding:4px 12px; background:var(--gray-light); border-radius:20px; font-size:12px; color:var(--gray); transition:all .2s; }
.entry-tags a:hover { background:var(--red); color:white; }
.author-box { background:var(--gray-light); border-radius:12px; padding:24px; margin-top:36px; display:flex; gap:16px; align-items:flex-start; }
.author-avatar { width:64px; height:64px; border-radius:50%; overflow:hidden; flex-shrink:0; background:var(--ink); display:flex; align-items:center; justify-content:center; color:white; font-size:22px; font-weight:900; }
.author-info h4 { font-size:15px; font-weight:800; margin-bottom:4px; }
.author-info p { font-size:13px; color:var(--gray); line-height:1.6; }

/* ARCHIVE */
.archive-header { max-width:1200px; margin:0 auto; padding:40px 24px 0; }
.archive-title { font-size:28px; font-weight:800; font-family:var(--font-serif); margin-bottom:6px; display:flex; align-items:center; gap:12px; }
.archive-desc { font-size:14px; color:var(--gray); }

/* FOOTER */
.site-footer { background:var(--ink); color:rgba(255,255,255,.6); padding:48px 24px 32px; margin-top:64px; }
.footer-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr; gap:32px; margin-bottom:40px; }
@media (max-width:700px) { .footer-inner { grid-template-columns:1fr; } }
.footer-brand p { font-size:14px; line-height:1.7; margin-top:10px; }
.footer-col h4 { color:white; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:14px; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li a { color:rgba(255,255,255,.5); font-size:13px; }
.footer-col ul li a:hover { color:white; }
.footer-bottom { max-width:1200px; margin:0 auto; padding-top:24px; border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between; font-size:12px; flex-wrap:wrap; gap:8px; }
.footer-bottom a { color:rgba(255,255,255,.4); margin-left:16px; }

/* RESPONSIVE */
@media (max-width:768px) {
  .menu-toggle { display:block; }
  .main-navigation { display:none; }
  .main-navigation.toggled { display:block; position:absolute; top:64px; left:0; right:0; background:white; padding:16px; box-shadow:0 8px 24px rgba(0,0,0,.1); }
  .main-navigation.toggled ul { flex-direction:column; }
  .header-inner { position:relative; flex-wrap:wrap; height:auto; padding:12px 24px; }
}
.no-posts { text-align:center; padding:60px 24px; color:var(--gray); }
.error-404 { max-width:600px; margin:80px auto; padding:0 24px; text-align:center; }
.error-404 .error-code { font-size:100px; font-weight:900; color:var(--red); line-height:1; }