/*
Theme Name: Dekoboko Couple
Theme URI: https://example.com/dekoboko-couple
Author: deko-boko
Description: 「ふたり暮らし×お金をかけない幸せ」のためのナチュラル系ブログテーマ。家庭菜園・お金・暮らしの3カテゴリー運用、記事テンプレート、カテゴリー/タグ/検索に対応。
Version: 1.5
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dekoboko
*/
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@500;600;700&family=Zen+Kaku+Gothic+New:wght@400;500;700&family=Noto+Sans+JP:wght@400;500;600&display=swap');

:root{
  --nama:#F3EEE1;         /* 生成り */
  --beige:#E7DCC4;        /* ベージュ */
  --card:#FBF8F1;
  --ink:#2A271F;
  --ink-soft:#5C5849;
  --green:#33422A;        /* 深緑 */
  --green-deep:#1F2818;
  --wood:#8B5A34;         /* 木目 */
  --wood-deep:#5C3C22;
  --rust:#A85D35;         /* accent */
  --line:#DCD0B4;
  --line-soft:#E9E1CC;
  --shadow:0 18px 40px -24px rgba(42,39,31,.35);
  --maxw:1180px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden; max-width:100%; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
body{
  background:var(--nama);
  color:var(--ink);
  font-family:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;
  line-height:1.9;
  font-size:15.5px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100%;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
@media(max-width:640px){ .wrap{padding:0 18px;} }

h1,h2,h3,h4,h5{font-family:'Zen Old Mincho',serif; font-weight:600; color:var(--green-deep);}

/* ---------- growth-ring signature motif ---------- */
.ring{display:inline-block;}
.ring svg circle{fill:none; stroke-width:1.6;}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:80;
  background:rgba(243,238,225,.94);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:20px 0;}
.brand{display:flex; align-items:center; gap:12px;}
.brand-mark{width:34px; height:34px; flex-shrink:0;}
.brand-text{font-family:'Zen Old Mincho',serif; font-size:16.5px; font-weight:600; line-height:1.35;}
.brand-text .en{display:block; font-family:'Noto Sans JP',sans-serif; font-size:10px; font-weight:500; letter-spacing:.16em; color:var(--wood-deep); margin-top:2px;}

.main-nav ul{display:flex; gap:30px;}
.main-nav a{font-size:13.5px; font-weight:500; position:relative; padding-bottom:4px; color:var(--ink);}
.main-nav a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--rust); transition:width .25s ease;}
.main-nav a:hover::after, .main-nav a.active::after{width:100%;}

.header-tools{display:flex; align-items:center; gap:16px;}
.search-btn, .menu-btn{
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border:1px solid var(--line); border-radius:50%;
  color:var(--green-deep); background:transparent; cursor:pointer;
}
.menu-btn{display:none;}

@media(max-width:860px){
  .main-nav{display:none;}
  .menu-btn{display:flex;}
}

/* mobile drawer */
.mobile-nav{
  position:fixed; inset:0; background:rgba(31,40,24,.55); z-index:120;
  opacity:0; pointer-events:none; transition:opacity .25s ease;
}
.mobile-nav.open{opacity:1; pointer-events:auto;}
.mobile-nav-panel{
  position:absolute; top:0; right:0; height:100%; width:78%; max-width:320px;
  background:var(--nama); padding:26px 26px; transform:translateX(100%); transition:transform .3s ease;
  overflow-y:auto;
}
.mobile-nav.open .mobile-nav-panel{transform:translateX(0);}
.mobile-nav-close{width:34px; height:34px; border:1px solid var(--line); border-radius:50%; background:none; margin-bottom:30px;}
.mobile-nav-panel a{display:block; font-family:'Zen Old Mincho',serif; font-size:19px; padding:14px 0; border-bottom:1px solid var(--line-soft); color:var(--green-deep);}

/* ---------- breadcrumb ---------- */
.crumbs{padding:18px 0; font-size:12px; color:var(--ink-soft); display:flex; gap:8px; flex-wrap:wrap;}
.crumbs a{color:var(--wood-deep);}
.crumbs span.sep{color:#b9b096;}

/* ---------- eyebrow / labels ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-size:11.5px; letter-spacing:.2em; font-weight:600; color:var(--wood-deep);
}
.eyebrow .dot{width:5px; height:5px; border-radius:50%; background:var(--rust);}
.section-head{margin-bottom:44px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.section-head h2{font-size:27px; line-height:1.6; margin-top:12px;}
.section-more{font-size:12.5px; color:var(--wood-deep); white-space:nowrap; padding-bottom:6px; border-bottom:1px solid var(--wood);}

/* ---------- buttons ---------- */
.btn{display:inline-block; padding:14px 30px; font-size:13.5px; font-weight:500; border-radius:2px; transition:all .2s ease; letter-spacing:.03em;}
.btn-primary{background:var(--green-deep); color:#fff;}
.btn-primary:hover{background:var(--rust);}
.btn-ghost{border:1px solid var(--green-deep); color:var(--green-deep);}
.btn-ghost:hover{background:var(--green-deep); color:#fff;}

/* ---------- photo placeholder (swap with real images) ---------- */
.photo{
  position:relative; overflow:hidden; background:var(--beige);
  display:flex; align-items:center; justify-content:center;
}
.photo::before{
  content:""; position:absolute; inset:0;
  background:
    repeating-linear-gradient(115deg, rgba(139,90,52,.10) 0 2px, transparent 2px 26px),
    linear-gradient(160deg, #E7DCC4 0%, #DCCBA4 55%, #C9AE7C 100%);
}
.photo .photo-cap{
  position:relative; z-index:1; font-family:'Noto Sans JP',sans-serif; font-size:11px;
  letter-spacing:.1em; color:var(--wood-deep); background:rgba(251,248,241,.82);
  padding:6px 14px; border-radius:20px;
}

/* ---------- wood-grain divider ---------- */
.wood-divider{height:14px; background:
  repeating-linear-gradient(90deg, var(--wood) 0 3px, var(--wood-deep) 3px 4px, var(--wood) 4px 46px);
  opacity:.9;
}

/* ---------- tag pill ---------- */
.tag-pill{
  display:inline-block; font-size:11px; letter-spacing:.05em; padding:4px 12px;
  border:1px solid var(--wood); border-radius:20px; color:var(--wood-deep);
}
.tag-pill.cat-money{border-color:var(--rust); color:var(--rust);}
.tag-pill.cat-garden{border-color:var(--green); color:var(--green);}
.tag-pill.cat-life{border-color:var(--wood-deep); color:var(--wood-deep);}

/* ---------- post card ---------- */
.card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line); border:1px solid var(--line);}
@media(max-width:900px){ .card-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:600px){ .card-grid{grid-template-columns:1fr;} }

.post-card{background:var(--card); display:flex; flex-direction:column;}
.post-card .photo{aspect-ratio:4/3;}
.post-card-body{padding:22px 22px 26px; display:flex; flex-direction:column; gap:10px; flex:1;}
.post-card-date{font-size:11px; color:#8c8568; letter-spacing:.05em;}
.post-card h3, .post-card h4{font-size:16.5px; line-height:1.6;}
.post-card p{font-size:13px; color:var(--ink-soft); flex:1;}
.post-card-more{font-size:12px; color:var(--wood-deep); margin-top:4px; padding-top:14px; border-top:1px solid var(--line-soft);}

/* ---------- list row (blog list alt / posts) ---------- */
.post-row{
  display:grid; grid-template-columns:150px 1fr auto; gap:26px; align-items:center;
  padding:26px 0; border-bottom:1px solid var(--line);
}
.post-row .photo{aspect-ratio:4/3; border-radius:2px;}
@media(max-width:640px){ .post-row{grid-template-columns:1fr; gap:12px;} .post-row .photo{aspect-ratio:16/9;} }
.post-row-arrow{font-size:12.5px; color:#a39d83; white-space:nowrap;}

/* ---------- profile / about ---------- */
.about-strip{background:var(--green-deep); color:#EDE9D8;}
.about-inner{display:flex; gap:44px; align-items:center; flex-wrap:wrap; padding:64px 0;}
.about-avatar{
  width:96px; height:96px; border-radius:50%; flex-shrink:0;
  background:var(--beige); display:flex; align-items:center; justify-content:center;
  font-family:'Zen Old Mincho',serif; font-size:12px; color:var(--wood-deep); text-align:center; line-height:1.5;
}
.about-text h3{color:#fff; font-size:19px; margin-bottom:10px;}
.about-text p{font-size:13.5px; color:#cfc8ac; max-width:600px;}

/* ---------- footer ---------- */
footer{background:var(--nama); border-top:1px solid var(--line); padding:56px 0 30px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; padding-bottom:40px;}
@media(max-width:760px){ .footer-grid{grid-template-columns:1fr 1fr;} }
.footer-col h5{font-size:12px; letter-spacing:.1em; color:var(--wood-deep); margin-bottom:16px; font-family:'Noto Sans JP',sans-serif; font-weight:600;}
.footer-col a, .footer-col span{display:block; font-size:13px; color:var(--ink-soft); margin-bottom:10px;}
.footer-brand p{font-size:12.5px; color:var(--ink-soft); max-width:280px; margin-top:14px;}
.footer-bottom{border-top:1px solid var(--line); padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:11.5px; color:#9a927a;}

/* ---------- ad / affiliate slot (future) ---------- */
.ad-slot{
  border:1px dashed var(--line); background:var(--beige-tint,#EFE8D4);
  padding:20px; text-align:center; font-size:11.5px; color:#9a927a; letter-spacing:.05em;
  border-radius:2px;
}

/* ---------- search overlay ---------- */
.search-overlay{
  position:fixed; inset:0; background:rgba(31,40,24,.55); z-index:130;
  opacity:0; pointer-events:none; transition:opacity .25s ease;
  display:flex; align-items:flex-start; justify-content:center;
}
.search-overlay.open{opacity:1; pointer-events:auto;}
.search-panel{width:min(620px,92%); background:var(--nama); margin-top:10vh; padding:30px; border-radius:2px; box-shadow:var(--shadow);}
.search-panel input{
  width:100%; border:none; border-bottom:2px solid var(--green-deep); background:transparent;
  font-family:'Zen Old Mincho',serif; font-size:22px; padding:10px 4px; color:var(--ink); outline:none;
}
.search-panel-close{float:right; width:32px; height:32px; border-radius:50%; border:1px solid var(--line); background:none;}
.search-results{margin-top:20px; max-height:50vh; overflow-y:auto;}
.search-results a{display:block; padding:12px 4px; border-bottom:1px solid var(--line-soft); font-size:14px;}
.search-results a span{display:block; font-size:11px; color:#8c8568; margin-top:3px;}
.search-empty{font-size:13px; color:#8c8568; padding:12px 4px;}

/* ---------- utility ---------- */
.section-eyebrow{font-size:12px; letter-spacing:.18em; color:var(--rust); font-weight:600; margin-bottom:14px;}
.pt-0{padding-top:0;}

/* ---------- hero: magazine-cover full-bleed style ---------- */
.hero-cover{
  position:relative;
  width:100%;
  min-height:78vh;
  display:flex;
  align-items:flex-end;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
}
.hero-cover::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(31,40,24,.10) 0%, rgba(31,40,24,.30) 45%, rgba(31,40,24,.82) 100%);
}
.hero-cover-inner{position:relative; z-index:1; padding:64px 0 68px; width:100%; max-width:100%; overflow-wrap:break-word;}
.hero-cover-inner .eyebrow{color:#EFE9D4;}
.hero-cover-inner .eyebrow .dot{background:#D9A066;}
.hero-cover-inner h1{color:#fff; max-width:100%;}
.hero-cover-inner h1 .accent, .hero-cover-inner h1 span{color:#D9A066 !important;}
.hero-cover-inner p.lead{color:#EDE9D8;}
.hero-cover-inner .btn-ghost{border-color:#fff; color:#fff;}
.hero-cover-inner .btn-ghost:hover{background:#fff; color:var(--green-deep);}
@media(max-width:640px){
  .hero-cover{min-height:64vh;}
  .hero-cover-inner{padding:48px 0 44px;}
  .hero-cover-inner h1{font-size:30px !important; line-height:1.5 !important;}
}

/* ---------- WordPress content typography ---------- */
.entry-content{max-width:680px; margin:0 auto; font-size:16px;}
.entry-content p{margin-bottom:26px; color:var(--ink);}
.entry-content h2{font-size:22px; margin:44px 0 18px; line-height:1.6;}
.entry-content h3{font-size:18px; margin:36px 0 14px; line-height:1.6;}
.entry-content img{border-radius:2px; margin:30px 0;}
.entry-content figure{margin:30px 0;}
.entry-content figcaption{font-size:12px; color:#8c8568; margin-top:8px; text-align:center;}
.entry-content ul, .entry-content ol{margin:0 0 26px 22px;}
.entry-content li{margin-bottom:8px;}
.entry-content blockquote{border-left:3px solid var(--wood); padding:4px 22px; color:var(--ink-soft); margin:30px 0; font-style:italic;}
.entry-content a{color:var(--wood-deep); text-decoration:underline; text-underline-offset:3px;}
.entry-content table{width:100%; border-collapse:collapse; margin:26px 0; font-size:14px;}
.entry-content th, .entry-content td{border:1px solid var(--line); padding:10px 14px; text-align:left;}
.alignwide{max-width:920px !important; margin-left:auto !important; margin-right:auto !important;}
.alignfull{max-width:none !important; width:100vw; position:relative; left:50%; right:50%; margin-left:-50vw !important; margin-right:-50vw !important;}

/* ---------- WP pagination ---------- */
.wp-pagination{display:flex; justify-content:center; gap:8px; margin-top:54px; flex-wrap:wrap;}
.wp-pagination a, .wp-pagination span{
  display:inline-flex; align-items:center; justify-content:center; min-width:38px; height:38px;
  border:1px solid var(--line); font-size:13px; color:var(--ink); border-radius:2px; padding:0 10px;
}
.wp-pagination .current{background:var(--green-deep); color:#fff; border-color:var(--green-deep);}

/* ---------- misc ---------- */
.screen-reader-text{position:absolute; left:-9999px;}
.no-results{padding:60px 0; color:#8c8568; font-size:14px;}
.mobile-nav-panel ul{margin:0;}