/*
Theme Name: NODE Theme
Theme URI: https://node-coffee.com/
Author: NODE
Author URI: https://node-coffee.com/
Description: NODE公式サイト自作テーマ（脱SWELL・A案）。凍結モック 30_制作/サイトモック_20260826/ のB意匠を土台に、
  stall CMS（Code Snippets）・CF7・Site Kit(GA4)をプラグイン層のまま無改造で使い続ける設計。
  詳細=docs/実装計画_テーマ自作.md
Version: 1.0.3
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: node-theme
*/

/* ============================================================
   Day2で判明した重要な設計是正（v1.0.0→v1.0.1）:
   Phase3で本番投入済みのpost_content（HOME/SCHEDULE/CONTACT/プライバシー/特商法の5ページとも）は
   既に style要素内に .nb26{...} を持ち、class="nb26"のdivでラップされる、という完全自己完結型の構造
   （20_システム/official-site/b_design_shared.mjs のNB_STYLEがそのまま出力されている）。
   つまり .hero/.chip/.so-card/.menu-item 等のpost_content内部要素のCSSは、post_content自身が
   持ち込むため、テーマ側で重複定義する必要がない（設計原則1章-3「post_contentは書き換えない」）。
   v1.0.0では誤ってこれらを .nb26 スコープを外した形でテーマ全体に適用しようとしていたが、
   実際のpost_contentの `.nb26 .hero` 等の子孫セレクタとは一致せず的外れだった。
   ここではヘッダー・フッター・レシピ単体（single.php・post_content外の領域）のCSSのみを持つ。
   ============================================================ */

:root{
  --bg:#FFFFFF;
  --bg-card:#FFFFFF;
  --bg-card-today:#FBEFD9;
  --text:#211F1D;
  --text-sub:rgba(33,31,29,0.64);
  --text-faint:rgba(33,31,29,0.65);
  --border:rgba(33,31,29,0.14);
  --border-today:#C8A97E;
  --gold:#C8A97E;
  --gold-deep:#B5945F;
  --on-gold:#211F1D;
  --danger:#b3261e;
  --card-shadow:0 1px 3px rgba(33,31,29,0.07);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;}
/* アンカー着地が固定ヘッダー(実測87px)の裏に潜らぬよう全アンカーにオフセット (v1.0.3・CEO指摘の検証で発見) */
html{scroll-padding-top:100px;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic UI","YuGothic","Meiryo",sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;}
img{max-width:100%;display:block;}

/* .page: header.php/footer.phpが全ページ共通で持つ外枠ラッパー。
   post_content側(.nb26)はmax-width:760pxの独自幅を持つが、モバイル時は
   この.pageのmax-width:480pxに制約される（b.html本来の入れ子構造と一致・意図通り）。 */
.page{max-width:480px;margin:0 auto;position:relative;}
@media (min-width:760px){
  .page{max-width:760px;}
}

/* ---- ヒーロー動画（トップページのみ・front-page.php用。CEO指摘2026-08-29への緊急対応。
   本番B案の現行実装に仕様を合わせる：モバイル4:3・PC 21:9・object-fit:cover・
   ヘッダー直下/本文の前に配置。SWELLの「メインビジュアル」theme_mod相当の代替。） ---- */
.hero-photo-full{width:100%;aspect-ratio:4/3;overflow:hidden;}
.hero-photo-full img,.hero-photo-full video{width:100%;height:100%;object-fit:cover;display:block;}
@media (min-width:760px){
  .hero-photo-full{aspect-ratio:21/9;}
}

/* ---- ヘッダー（白地・logo02黒版・検索/ハンバーガーなし・4タブナビ） ---- */
header.site{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--border);}
.logo-row{display:flex;align-items:center;justify-content:space-between;padding:9px 18px 7px;}
.logo-row .logo{display:inline-flex;text-decoration:none;color:inherit;}
.logo-row .logo svg,.logo-row .logo img{height:20px;width:auto;display:block;}
.logo-row .status-mini{font-size:10.5px;color:var(--gold-deep);border:1px solid var(--border-today);border-radius:20px;padding:3px 9px;letter-spacing:.03em;white-space:nowrap;}
nav.tabbar{display:flex;border-top:1px solid var(--border);}
nav.tabbar a{flex:1 1 20%;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px 8px;color:var(--text-sub);text-decoration:none;font-size:10px;letter-spacing:.01em;}
nav.tabbar a i{font-size:16px;line-height:1;}
nav.tabbar a:active{color:var(--gold-deep);}

/* ---- フッター（ビジネス出店依頼＋規約2リンク） ---- */
footer.site-footer{margin-top:40px;border-top:1px solid var(--border);padding:22px 18px 30px;font-size:11.5px;color:var(--text-sub);}
footer.site-footer .frow{margin-bottom:6px;}
footer.site-footer .frow.legal{font-size:10.5px;}
footer.site-footer .frow.legal a{color:var(--text-sub);text-decoration:underline;}
footer.site-footer .frow.legal .legal-sep{color:var(--text-faint);margin:0 6px;}
footer.site-footer .copy{color:var(--text-faint);font-size:10.5px;margin-top:16px;}

/* ---- レシピ単体（single.php用・post_content外の独自領域のためテーマ側CSSが必要。
   Day1黒判定への対応。目次/パンくず/関連記事の軽量代替＝旧「案B」吸収分） ---- */
.node-recipe-crumb{font-size:11px;color:var(--text-faint);margin:14px 0 6px;padding:0 18px;}
.node-recipe-crumb a{color:var(--text-faint);text-decoration:underline;}
.node-recipe-toc{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:14px 16px;margin:14px 18px 22px;}
.node-recipe-toc .toc-title{font-size:11px;color:var(--gold-deep);letter-spacing:.06em;margin-bottom:8px;font-weight:700;}
.node-recipe-toc ol{margin:0;padding-left:1.2em;font-size:13px;}
.node-recipe-toc li{margin-bottom:4px;}
.node-recipe-toc a{color:var(--text);text-decoration:none;}
.node-recipe-related{margin:32px 18px 0;padding-top:20px;border-top:1px solid var(--border);}
.node-recipe-related .label{font-size:11px;color:var(--text-faint);letter-spacing:.06em;margin-bottom:8px;}
.node-recipe-related a{display:block;font-size:14px;font-weight:700;color:var(--gold-deep);text-decoration:none;margin-bottom:4px;}
.page-head{padding:20px 18px 8px;}
.page-head .kicker{font-size:10.5px;color:var(--gold-deep);letter-spacing:.14em;text-transform:uppercase;}
.page-head h1{font-size:20px;margin:4px 0 0;font-weight:600;}
#node-recipe-content{padding:0 18px 20px;font-size:14px;line-height:1.8;}
#node-recipe-content h2{font-size:17px;margin:28px 0 10px;font-weight:600;}
#node-recipe-content h3{font-size:14px;margin:20px 0 8px;color:var(--gold-deep);}
#node-recipe-content img{border-radius:10px;margin:12px 0;}