@charset "UTF-8";
/* =====================================================================
   株式会社千春うなぎ ｜ 公式サイト スタイル
   テイスト：チラシ（3つ折りパンフレット）より
   深い紺 × 金 × 縦組み明朝、艶やかな料理写真
   ===================================================================== */

:root{
  --navy:        #070f1f;
  --navy-2:      #0d1830;
  --navy-3:      #101b34;
  --navy-soft:   #16223e;
  --gold:        #b4992d;
  --gold-2:      #cdb04a;
  --gold-3:      #e7d488;
  --cream:       #f5f0e6;
  --paper:       #faf7f1;
  --ink:         #2a2522;
  --text:        #5f5352;
  --text-soft:   #8a7f7d;
  --line:        #d9d5d4;
  --white:       #ffffff;

  --maxw: 1180px;
  --pad: clamp(20px, 5vw, 64px);

  --serif-jp: "Shippori Mincho B1", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --body-jp:  "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --latin:    "Cormorant Garamond", "Shippori Mincho B1", serif;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:78px; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--body-jp);
  color:var(--text);
  background:var(--paper);
  line-height:1.95;
  font-weight:400;
  letter-spacing:.04em;
  font-feature-settings:"palt";
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
em{ font-style:normal; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }

/* ---------- セクション共通 ---------- */
section{ position:relative; }
.section-light{ background:var(--paper); color:var(--text); padding:clamp(70px,11vw,140px) 0; }
.section-dark{
  background:
    radial-gradient(120% 90% at 80% 0%, #14223f 0%, var(--navy-2) 42%, var(--navy) 100%);
  color:#e8e4dc;
  padding:clamp(70px,11vw,140px) 0;
}
.section-dark::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(115deg, transparent 0 49.6%, rgba(180,153,45,.16) 49.6% 49.85%, transparent 49.85%),
    linear-gradient(115deg, transparent 0 71%, rgba(180,153,45,.10) 71% 71.2%, transparent 71.2%);
  opacity:.6;
}

/* 見出し */
.sec-head{ margin-bottom:clamp(36px,5vw,60px); }
.sec-head-center{ text-align:center; }
.sec-eyebrow{
  font-family:var(--latin);
  letter-spacing:.42em; text-transform:uppercase;
  font-size:.78rem; color:var(--gold); font-weight:600;
  margin-bottom:14px; padding-left:.42em;
}
.sec-title{
  font-family:var(--serif-jp);
  font-weight:700;
  font-size:clamp(1.7rem,4.4vw,2.9rem);
  line-height:1.35; letter-spacing:.08em;
  color:inherit;
}
.section-light .sec-title{ color:var(--ink); }
.sec-head-center .sec-eyebrow{ padding:0; }
.sec-title .accent{ color:var(--gold-2); }
.sec-desc{
  margin-top:20px; max-width:40em;
  font-size:1rem; line-height:2.1; color:inherit; opacity:.92;
}
.sec-head-center .sec-desc{ margin-inline:auto; }
.section-light .sec-desc{ color:var(--text); }

/* ---------- ボタン ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--serif-jp); font-weight:600; letter-spacing:.12em;
  padding:.95em 2.4em; font-size:.95rem; border:1px solid transparent;
  border-radius:2px; cursor:pointer; transition:.4s var(--ease); position:relative;
}
.btn-sm{ padding:.78em 1.9em; font-size:.9rem; }
.btn-block{ width:100%; padding-block:1.05em; }
.btn-gold{
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#1a1407; box-shadow:0 8px 24px -10px rgba(180,153,45,.7);
}
.btn-gold:hover{ filter:brightness(1.08); transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(180,153,45,.8); }
.btn-ghost{ border-color:rgba(231,212,136,.5); color:var(--gold-3); }
.btn-ghost:hover{ background:rgba(231,212,136,.1); border-color:var(--gold-3); }
.btn-dark{ background:var(--navy); color:var(--cream); }
.btn-dark:hover{ background:var(--navy-soft); transform:translateY(-2px); }

/* =====================================================================
   HEADER
   ===================================================================== */
.site-header{
  position:fixed; top:0; left:0; width:100%; z-index:100;
  transition:.45s var(--ease);
  background:linear-gradient(to bottom, rgba(7,15,31,.55), rgba(7,15,31,0));
}
.site-header.scrolled{
  background:rgba(7,15,31,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(180,153,45,.25), 0 10px 30px -18px rgba(0,0,0,.8);
}
.header-inner{
  max-width:1320px; margin-inline:auto;
  display:flex; align-items:center; gap:24px;
  padding:14px clamp(18px,4vw,40px);
  transition:padding .45s var(--ease);
}
.site-header.scrolled .header-inner{ padding-block:9px; }

.brand{ display:flex; align-items:center; gap:12px; margin-right:auto; }
.brand-mark{
  font-family:var(--serif-jp); font-weight:700; color:var(--gold-2);
  font-size:1.45rem; line-height:1;
  border:1px solid rgba(205,176,74,.7); border-radius:4px;
  padding:7px 8px 5px; letter-spacing:.05em;
  background:rgba(7,15,31,.35);
}
.brand-text{ display:flex; flex-direction:column; line-height:1.2; }
.brand-name{ font-family:var(--serif-jp); font-weight:700; color:#fff; font-size:1.12rem; letter-spacing:.14em; }
.brand-sub{ font-family:var(--latin); font-size:.62rem; letter-spacing:.32em; color:var(--gold-3); }

.nav{ display:flex; align-items:center; gap:clamp(14px,1.8vw,30px); }
.nav a{
  font-family:var(--serif-jp); font-size:.95rem; font-weight:500;
  color:#e9e5dc; letter-spacing:.08em; position:relative; padding:6px 2px;
  transition:color .3s;
}
.nav a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--gold-2); transition:width .35s var(--ease);
}
.nav a:hover{ color:var(--gold-3); }
.nav a:hover::after{ width:100%; }
.nav a.active{ color:var(--gold-3); }
.nav a.active::after{ width:100%; }
.nav .nav-cta.active{ background:rgba(205,176,74,.14); }
.nav .nav-cta{
  border:1px solid rgba(205,176,74,.6); border-radius:2px;
  padding:8px 18px; color:var(--gold-3);
}
.nav .nav-cta::after{ display:none; }
.nav .nav-cta:hover{ background:rgba(205,176,74,.14); }

.header-tel{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; }
.header-tel-num{ font-family:var(--latin); font-weight:600; color:var(--gold-3); font-size:1.32rem; letter-spacing:.04em; }
.header-tel-sub{ font-size:.66rem; color:#cfcabf; letter-spacing:.14em; }

.hamburger{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; }
.hamburger span{ width:26px; height:2px; background:var(--gold-3); transition:.35s var(--ease); transform-origin:center; }
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* =====================================================================
   HERO
   ===================================================================== */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  background:var(--navy); overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; background-size:cover; background-position:center 35%;
  transform:scale(1.08); animation:heroZoom 16s var(--ease) forwards;
}
@keyframes heroZoom{ to{ transform:scale(1); } }
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(105deg, rgba(7,15,31,.96) 0%, rgba(7,15,31,.82) 38%, rgba(7,15,31,.42) 70%, rgba(7,15,31,.62) 100%),
    radial-gradient(80% 60% at 20% 50%, rgba(7,15,31,.4), transparent);
}
.hero-rule{ position:absolute; pointer-events:none; opacity:.55; }
.hero-rule-1{ top:0; left:62%; width:1px; height:100%; background:linear-gradient(to bottom,transparent,rgba(205,176,74,.55) 30%, rgba(205,176,74,.15) 100%); transform:skewX(-12deg); }
.hero-rule-2{ top:0; left:78%; width:1px; height:100%; background:linear-gradient(to bottom,transparent,rgba(205,176,74,.3) 50%, transparent); transform:skewX(-12deg); }

.hero-content{
  position:relative; z-index:2; padding-inline:var(--pad);
  max-width:var(--maxw); margin-inline:auto; width:100%;
  padding-top:90px;
}
.hero-eyebrow{
  font-family:var(--serif-jp); color:var(--gold-3); letter-spacing:.3em;
  font-size:clamp(.8rem,2vw,1rem); margin-bottom:26px;
  opacity:0; animation:fadeUp .9s var(--ease) .35s forwards;
}
.hero-title{ display:flex; align-items:flex-start; gap:.15em; margin-bottom:30px; }
.hero-title-small{
  writing-mode:vertical-rl; font-family:var(--serif-jp); font-weight:600;
  color:var(--gold-3); font-size:clamp(1.1rem,3vw,1.7rem); letter-spacing:.2em;
  margin-top:.5em; opacity:0; animation:fadeRight 1s var(--ease) .55s forwards;
}
.hero-title-main{
  writing-mode:vertical-rl; font-family:var(--serif-jp); font-weight:800;
  color:#fff; font-size:clamp(3.6rem,13vw,7.6rem); line-height:1.02;
  letter-spacing:.06em; text-shadow:0 4px 40px rgba(0,0,0,.6);
  background:linear-gradient(180deg,#ffffff 0%, #f3ecd9 55%, #d9c894 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  opacity:0; animation:fadeRight 1.1s var(--ease) .7s forwards;
}
.hero-lead{
  font-family:var(--serif-jp); color:#eee9df; line-height:2.3;
  font-size:clamp(.95rem,2.2vw,1.15rem); letter-spacing:.08em;
  margin-bottom:38px; max-width:34em;
  opacity:0; animation:fadeUp 1s var(--ease) 1s forwards;
}
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; opacity:0; animation:fadeUp 1s var(--ease) 1.2s forwards; }
.hero-scroll{
  position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:2;
  font-family:var(--latin); letter-spacing:.3em; font-size:.7rem; color:var(--gold-3);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  opacity:0; animation:fadeUp 1s var(--ease) 1.5s forwards;
}
.hero-scroll span{ width:1px; height:46px; background:linear-gradient(to bottom,var(--gold-3),transparent); animation:scrollPulse 2s var(--ease) infinite; }
@keyframes scrollPulse{ 0%,100%{ transform:scaleY(.4); transform-origin:top; opacity:.4 } 50%{ transform:scaleY(1); opacity:1 } }

@keyframes fadeUp{ from{ opacity:0; transform:translateY(26px) } to{ opacity:1; transform:none } }
@keyframes fadeRight{ from{ opacity:0; transform:translateX(30px) } to{ opacity:1; transform:none } }

/* =====================================================================
   INTRO
   ===================================================================== */
.intro-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(36px,6vw,90px); align-items:center; }
.vlabel{ font-family:var(--serif-jp); color:var(--gold); letter-spacing:.28em; font-size:.85rem; margin-bottom:18px; }
.intro-head{
  font-family:var(--serif-jp); font-weight:700; color:var(--ink);
  font-size:clamp(2rem,5.5vw,3.4rem); line-height:1.45; letter-spacing:.06em; margin-bottom:30px;
}
.intro-head em{ color:var(--gold); position:relative; }
.lead-text{ font-size:1.02rem; line-height:2.25; margin-bottom:28px; }
.intro-points{ display:flex; flex-direction:column; gap:14px; }
.intro-points li{ display:flex; align-items:baseline; gap:12px; font-family:var(--serif-jp); color:var(--ink); font-size:1.02rem; }
.dot{ flex:none; width:7px; height:7px; margin-top:.55em; background:linear-gradient(135deg,var(--gold-2),var(--gold)); transform:rotate(45deg); }

.intro-photo{ position:relative; }
.intro-photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px; box-shadow:0 30px 60px -28px rgba(0,0,0,.55); }
.intro-photo::before{ content:""; position:absolute; inset:14px -14px -14px 14px; border:1px solid var(--gold); z-index:-1; border-radius:3px; }
.photo-caption{
  position:absolute; bottom:18px; left:18px; right:18px;
  font-family:var(--serif-jp); color:#fff; font-size:.88rem; letter-spacing:.1em;
  text-shadow:0 2px 12px rgba(0,0,0,.8);
}

/* =====================================================================
   青うなぎ
   ===================================================================== */
.aounagi-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(36px,6vw,80px); align-items:center; }
.aounagi-lead p{ font-size:1.08rem; line-height:2.35; margin-bottom:20px; }
.aounagi-lead strong{ color:var(--gold-3); font-weight:600; }
.aounagi-lead .muted{ color:#b7b2a8; font-size:.98rem; }

.aounagi-photo{ position:relative; }
.aounagi-photo img{ position:relative; z-index:1; width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:3px; box-shadow:0 0 0 1px var(--gold), 0 30px 60px -28px rgba(0,0,0,.7); }
.aounagi-photo::before{ content:""; position:absolute; inset:16px -16px -16px 16px; border:1px solid rgba(205,176,74,.7); border-radius:3px; z-index:0; }

/* =====================================================================
   こだわり
   ===================================================================== */
.kodawari-list{ display:flex; flex-direction:column; gap:clamp(40px,7vw,96px); }
.kdw{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(28px,5vw,70px); align-items:center; }
.kdw-rev .kdw-photo{ order:2; }
.kdw-photo{ position:relative; }
.kdw-photo img{ width:100%; aspect-ratio:16/11; object-fit:cover; border-radius:3px; box-shadow:0 30px 60px -30px rgba(0,0,0,.5); }
.kdw-photo::after{ content:""; position:absolute; width:64px; height:64px; bottom:-12px; right:-12px; background:linear-gradient(135deg,var(--gold-2),var(--gold)); transform:rotate(45deg); opacity:.9; z-index:-1; }
.kdw-rev .kdw-photo::after{ right:auto; left:-12px; }
.kdw-no{ display:block; margin-bottom:14px; }
.kdw-no em{ font-family:var(--latin); font-size:clamp(2.4rem,6vw,3.6rem); font-weight:600; color:var(--gold); line-height:1; letter-spacing:.02em; }
.kdw-no::after{ content:""; display:inline-block; width:46px; height:1px; background:var(--gold); vertical-align:middle; margin-left:16px; margin-bottom:10px; }
.kdw-title{ font-family:var(--serif-jp); font-weight:700; color:var(--ink); font-size:clamp(1.3rem,3vw,1.75rem); line-height:1.5; letter-spacing:.05em; margin-bottom:18px; }
.kdw-body p{ font-size:1.01rem; line-height:2.25; }
.kdw-body strong{ color:var(--gold); font-weight:600; }

/* =====================================================================
   商品紹介
   ===================================================================== */
.product-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,34px); }
.pcard{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(205,176,74,.22); border-radius:4px; overflow:hidden;
  transition:.5s var(--ease);
}
.pcard:hover{ transform:translateY(-6px); border-color:rgba(205,176,74,.55); box-shadow:0 30px 60px -30px rgba(0,0,0,.8); }
.pcard-img{ overflow:hidden; aspect-ratio:4/3; }
.pcard-img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.pcard:hover .pcard-img img{ transform:scale(1.07); }
.pcard-body{ padding:26px 26px 30px; }
.pcard-name{ font-family:var(--serif-jp); font-weight:700; color:#fff; font-size:1.3rem; letter-spacing:.08em; margin-bottom:12px; }
.pcard-desc{ font-size:.92rem; line-height:1.95; color:#c8c3b9; min-height:5.5em; margin-bottom:14px; }
.pcard-price{ font-family:var(--latin); color:var(--gold-3); font-size:2.2rem; font-weight:600; line-height:1; display:flex; align-items:baseline; gap:.1em; }
.pcard-price .yen{ font-size:1.2rem; }
.pcard-price .unit{ font-family:var(--body-jp); font-size:.8rem; color:#a39e94; letter-spacing:.1em; margin-left:.4em; }
.price-note{ margin-top:24px; font-size:.82rem; color:#9b968c; text-align:center; }

.product-info{ display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(28px,4vw,56px); margin-top:clamp(50px,7vw,80px); }
.pinfo-title{ font-family:var(--serif-jp); font-weight:600; color:var(--gold-3); font-size:1.2rem; letter-spacing:.1em; margin-bottom:22px; display:flex; align-items:center; gap:14px; }
.pinfo-title .bar{ width:5px; height:1.1em; background:linear-gradient(180deg,var(--gold-2),var(--gold)); }
.table-wrap{ overflow-x:auto; }
.nutri-table{ width:100%; border-collapse:collapse; font-size:.9rem; min-width:480px; }
.nutri-table th,.nutri-table td{ padding:13px 10px; text-align:center; border-bottom:1px solid rgba(255,255,255,.12); }
.nutri-table thead th{ background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#1a1407; font-weight:600; letter-spacing:.04em; border:0; }
.nutri-table thead th:first-child{ border-radius:3px 0 0 0; }
.nutri-table thead th:last-child{ border-radius:0 3px 0 0; }
.nutri-table .row-h{ text-align:left; font-family:var(--serif-jp); color:#fff; font-weight:500; white-space:nowrap; }
.nutri-table td{ font-family:var(--latin); font-size:1.2rem; color:#e8e4dc; }
.nutri-table td small{ font-family:var(--body-jp); font-size:.66rem; color:#a39e94; margin-left:1px; }
.tiny-note{ font-size:.78rem; color:#9b968c; margin-top:12px; }

.spec-dl{ display:flex; flex-direction:column; }
.spec-dl > div{ display:grid; grid-template-columns:7.5em 1fr; gap:8px; padding:15px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.spec-dl dt{ font-family:var(--serif-jp); color:var(--gold-3); font-size:.92rem; letter-spacing:.06em; }
.spec-dl dd{ font-size:.92rem; line-height:1.9; color:#d4cfc5; }

/* =====================================================================
   お召し上がり方
   ===================================================================== */
.recipe-grid{ display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(36px,6vw,84px); align-items:center; }
.recipe-photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px; box-shadow:0 30px 60px -28px rgba(0,0,0,.5); }
.recipe-photo{ position:relative; }
.recipe-photo::before{ content:""; position:absolute; inset:-14px 14px 14px -14px; border:1px solid var(--gold); z-index:-1; border-radius:3px; }
.steps{ counter-reset:step; display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.steps li{ display:flex; align-items:flex-start; gap:22px; padding:22px 0; border-bottom:1px dashed var(--line); }
.step-no{
  flex:none; width:48px; height:48px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--latin); font-size:1.5rem; font-weight:600; color:var(--gold);
  border:1px solid var(--gold); background:#fff;
}
.steps li p{ font-size:1.02rem; line-height:1.95; padding-top:6px; }
.steps strong{ color:var(--ink); font-weight:700; border-bottom:2px solid var(--gold-3); }
.recipe-tip{
  margin-top:26px; background:linear-gradient(135deg,#fff,#f3ede0);
  border:1px solid var(--gold); border-left-width:4px; border-radius:3px;
  padding:20px 24px; font-size:.98rem; line-height:1.95; color:var(--ink);
}
.tip-label{ display:inline-block; font-family:var(--latin); font-weight:600; letter-spacing:.2em; color:var(--gold); font-size:.78rem; margin-right:10px; }
.recipe-tip strong{ color:var(--gold); font-weight:700; }

/* =====================================================================
   直売所・通販
   ===================================================================== */
.shop-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(22px,3vw,34px); margin-bottom:clamp(36px,5vw,56px); }
.shop-card{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(205,176,74,.22); border-radius:4px;
  padding:clamp(28px,4vw,44px); position:relative;
}
.shop-card-icon{
  width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-family:var(--serif-jp); font-size:1.3rem; color:#1a1407; font-weight:700;
  background:linear-gradient(135deg,var(--gold-2),var(--gold)); margin-bottom:20px;
}
.shop-card h3{ font-family:var(--serif-jp); font-weight:700; color:#fff; font-size:1.4rem; letter-spacing:.08em; margin-bottom:20px; }
.shop-card-text{ font-size:.96rem; line-height:2.1; color:#d4cfc5; margin-bottom:14px; }
.furusato-note{ display:inline-block; font-size:.86rem; color:var(--gold-3); border:1px solid rgba(205,176,74,.4); border-radius:999px; padding:6px 16px; margin-bottom:22px; }
.mini-dl{ margin-bottom:24px; }
.mini-dl > div{ display:grid; grid-template-columns:5.5em 1fr; gap:10px; padding:11px 0; border-bottom:1px solid rgba(255,255,255,.1); }
.mini-dl dt{ font-family:var(--serif-jp); color:var(--gold-3); font-size:.9rem; }
.mini-dl dd{ font-size:.94rem; line-height:1.8; color:#e2ddd3; }
.mini-dl a:hover{ color:var(--gold-3); }
.map-wrap{ border:1px solid rgba(205,176,74,.3); border-radius:4px; overflow:hidden; line-height:0; }
.map-wrap iframe{ filter:grayscale(.2) contrast(1.05); }

/* その他の商品（商品紹介セクション） */
.more-products{ margin-top:clamp(40px,6vw,64px); max-width:840px; margin-inline:auto; }
.more-title{ font-family:var(--serif-jp); font-weight:600; color:var(--gold-3); font-size:1.15rem; letter-spacing:.1em; margin-bottom:18px; display:flex; align-items:center; gap:14px; justify-content:center; }
.more-title .bar{ width:5px; height:1.1em; background:linear-gradient(180deg,var(--gold-2),var(--gold)); }
.more-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(205,176,74,.22); border:1px solid rgba(205,176,74,.22); border-radius:4px; overflow:hidden; }
.more-list li{ background:rgba(8,14,28,.6); padding:22px 20px; text-align:center; }
.more-name{ display:block; font-family:var(--serif-jp); font-weight:600; color:#fff; font-size:1.05rem; letter-spacing:.06em; margin-bottom:8px; }
.more-desc{ display:block; font-size:.84rem; line-height:1.8; color:#b7b2a8; }

/* ギフト・配送のこだわり */
.ship-feature{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,56px); align-items:center; margin-bottom:clamp(36px,5vw,56px); }
.ship-photos{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ship-photos figure{ position:relative; }
.ship-photos img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:3px; box-shadow:0 20px 44px -22px rgba(0,0,0,.7); }
.ship-photos figcaption{ margin-top:10px; font-size:.78rem; color:#b7b2a8; line-height:1.6; text-align:center; }
.ship-title{ font-family:var(--serif-jp); font-weight:700; color:#fff; font-size:clamp(1.3rem,3vw,1.7rem); letter-spacing:.05em; margin-bottom:18px; }
.ship-copy > p{ font-size:.98rem; line-height:2.1; color:#d4cfc5; margin-bottom:20px; }
.ship-points{ display:flex; flex-direction:column; gap:12px; margin-bottom:22px; }
.ship-points li{ display:flex; align-items:baseline; gap:12px; font-family:var(--serif-jp); color:#e8e4dc; font-size:.98rem; line-height:1.7; }
.ship-order{ font-family:var(--serif-jp); color:#e2ddd3; font-size:.95rem; border-top:1px solid rgba(205,176,74,.25); padding-top:18px; }
.ship-order-label{ display:inline-block; color:var(--gold-3); margin-right:12px; }
.ship-order a{ color:#fff; font-weight:600; }
.ship-order a:hover{ color:var(--gold-3); }
.ship-order .sep{ margin:0 10px; color:#6f6a61; }

/* =====================================================================
   卸売
   ===================================================================== */
.wholesale-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(36px,6vw,80px); align-items:center; }
.wholesale-points{ display:flex; flex-direction:column; gap:14px; margin:24px 0; }
.wholesale-points li{ display:flex; align-items:baseline; gap:12px; font-family:var(--serif-jp); color:var(--ink); font-size:1.02rem; line-height:1.8; }
.wholesale-copy .muted{ color:var(--text-soft); font-size:.94rem; margin-bottom:26px; }
.wholesale-copy strong{ color:var(--gold); }
.wholesale-photo img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:3px; box-shadow:0 30px 60px -30px rgba(0,0,0,.5); }
.wholesale-photo{ position:relative; }
.wholesale-photo::after{ content:""; position:absolute; width:70px; height:70px; top:-12px; left:-12px; background:linear-gradient(135deg,var(--gold-2),var(--gold)); transform:rotate(45deg); opacity:.85; z-index:-1; }

/* =====================================================================
   地域貢献 / 動画
   ===================================================================== */
.video-wrap{ max-width:920px; margin-inline:auto; }
.video-frame{ position:relative; aspect-ratio:16/9; border:1px solid rgba(205,176,74,.4); border-radius:4px; overflow:hidden; box-shadow:0 30px 70px -30px rgba(0,0,0,.8); }
.video-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-caption{ text-align:center; margin-top:20px; font-size:.92rem; color:#c8c3b9; }
/* YouTube クリック再生ファサード */
.yt-facade{ position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; cursor:pointer; background:#05090f; overflow:hidden; display:block; }
.yt-thumb{ width:100%; height:100%; object-fit:cover; opacity:.78; transition:.6s var(--ease); }
.yt-facade:hover .yt-thumb{ opacity:.95; transform:scale(1.04); }
.yt-play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:86px; height:86px; border-radius:50%; background:linear-gradient(135deg,var(--gold-2),var(--gold)); box-shadow:0 14px 44px -10px rgba(0,0,0,.85); transition:.4s var(--ease); }
.yt-play::after{ content:""; position:absolute; top:50%; left:54%; transform:translate(-50%,-50%); border-style:solid; border-width:13px 0 13px 23px; border-color:transparent transparent transparent #1a1407; }
.yt-facade:hover .yt-play{ transform:translate(-50%,-50%) scale(1.08); filter:brightness(1.06); }

/* =====================================================================
   会社概要
   ===================================================================== */
.company-wrap{ max-width:760px; margin-inline:auto; }
.company-table{ width:100%; border-collapse:collapse; }
.company-table th,.company-table td{ text-align:left; padding:18px 16px; border-bottom:1px solid var(--line); vertical-align:top; font-size:.98rem; line-height:1.85; }
.company-table th{ width:14em; font-family:var(--serif-jp); font-weight:600; color:var(--ink); letter-spacing:.06em; white-space:nowrap; }
.company-table td{ color:var(--text); }
.company-table tr:first-child th,.company-table tr:first-child td{ border-top:2px solid var(--gold); }
.company-table a:hover{ color:var(--gold); }

/* =====================================================================
   お問い合わせ
   ===================================================================== */
.contact-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,64px); align-items:start; }
.contact-lead{ font-family:var(--serif-jp); color:var(--gold-3); letter-spacing:.1em; font-size:1.05rem; margin-bottom:14px; }
.contact-tel{ font-family:var(--latin); font-weight:600; color:#fff; font-size:clamp(2.3rem,6vw,3rem); line-height:1.1; letter-spacing:.02em; display:inline-block; }
.contact-tel:hover{ color:var(--gold-3); }
.contact-hours{ color:#c8c3b9; font-size:.9rem; letter-spacing:.1em; margin:6px 0 30px; }
.mini-dl-light > div{ border-color:rgba(255,255,255,.12); }

.contact-form{ background:rgba(255,255,255,.04); border:1px solid rgba(205,176,74,.22); border-radius:5px; padding:clamp(24px,4vw,40px); }
.field{ margin-bottom:18px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field label{ display:block; font-family:var(--serif-jp); font-size:.9rem; color:#e2ddd3; margin-bottom:8px; letter-spacing:.05em; }
.req{ font-size:.68rem; color:#1a1407; background:var(--gold-2); border-radius:2px; padding:2px 7px; margin-left:8px; letter-spacing:.05em; vertical-align:1px; }
.field input,.field select,.field textarea{
  width:100%; background:rgba(7,15,31,.5); border:1px solid rgba(255,255,255,.18); border-radius:3px;
  padding:13px 15px; color:#fff; font-family:var(--body-jp); font-size:.96rem; transition:.3s;
}
.field textarea{ resize:vertical; line-height:1.8; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--gold-2); background:rgba(7,15,31,.75); box-shadow:0 0 0 3px rgba(180,153,45,.15); }
.field select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--gold-3) 50%),linear-gradient(135deg,var(--gold-3) 50%,transparent 50%); background-position:calc(100% - 20px) center,calc(100% - 15px) center; background-size:5px 5px,5px 5px; background-repeat:no-repeat; }
.form-note{ font-size:.8rem; color:#a39e94; line-height:1.7; margin-top:14px; }
.form-note.ok{ color:var(--gold-3); }

/* =====================================================================
   FOOTER
   ===================================================================== */
.site-footer{ background:#05090f; color:#cfcabf; padding:clamp(50px,7vw,80px) 0 0; border-top:1px solid rgba(205,176,74,.25); }
.footer-inner{ display:grid; grid-template-columns:1.2fr 1.3fr 1fr; gap:36px; align-items:start; padding-bottom:46px; }
.footer-brand{ display:flex; align-items:center; gap:14px; }
.footer-name{ font-family:var(--serif-jp); font-weight:700; color:#fff; font-size:1.2rem; letter-spacing:.1em; }
.footer-sub{ font-size:.78rem; color:var(--gold-3); letter-spacing:.14em; margin-top:4px; }
.footer-meta p{ font-size:.9rem; line-height:2; }
.footer-meta a:hover{ color:var(--gold-3); }
.footer-nav{ display:flex; flex-wrap:wrap; gap:10px 22px; }
.footer-nav a{ font-family:var(--serif-jp); font-size:.9rem; color:#cfcabf; position:relative; }
.footer-nav a:hover{ color:var(--gold-3); }
.copyright{ text-align:center; font-family:var(--latin); font-size:.74rem; letter-spacing:.16em; color:#6f6a61; padding:22px var(--pad); border-top:1px solid rgba(255,255,255,.07); }

/* to top */
.to-top{
  position:fixed; right:22px; bottom:22px; z-index:90;
  width:46px; height:46px; border-radius:50%;
  background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#1a1407;
  display:flex; align-items:center; justify-content:center; font-size:.8rem;
  box-shadow:0 10px 26px -10px rgba(0,0,0,.6);
  opacity:0; visibility:hidden; transform:translateY(14px); transition:.4s var(--ease);
}
.to-top.show{ opacity:1; visibility:visible; transform:none; }
.to-top:hover{ filter:brightness(1.1); transform:translateY(-3px); }

/* =====================================================================
   reveal アニメーション
   ===================================================================== */
.reveal{ opacity:0; transform:translateY(34px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* =====================================================================
   レスポンシブ
   ===================================================================== */
.sp-br{ display:none; }

@media (max-width:1000px){
  .header-tel{ display:none; }
  .hamburger{ display:flex; }
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(82vw,360px);
    flex-direction:column; align-items:flex-start; justify-content:center; gap:26px;
    background:linear-gradient(160deg,var(--navy-2),var(--navy));
    padding:90px 40px; transform:translateX(100%); transition:transform .5s var(--ease);
    box-shadow:-20px 0 60px -20px rgba(0,0,0,.7); border-left:1px solid rgba(205,176,74,.3);
  }
  .nav.open{ transform:none; }
  .nav a{ font-size:1.15rem; }
  .nav .nav-cta{ margin-top:8px; }

  .intro-grid,.aounagi-grid,.wholesale-grid,.contact-grid{ grid-template-columns:1fr; }
  .kdw,.kdw-rev{ grid-template-columns:1fr; gap:24px; }
  .kdw-rev .kdw-photo{ order:0; }
  .intro-photo{ max-width:440px; margin-inline:auto; }
  .aounagi-photo{ max-width:480px; margin-inline:auto; }
  .wholesale-photo{ max-width:380px; margin-inline:auto; }
  .product-cards{ grid-template-columns:1fr 1fr; }
  .ship-feature{ grid-template-columns:1fr; gap:28px; }
  .ship-photos{ max-width:520px; }
  .footer-inner{ grid-template-columns:1fr; gap:28px; }
  .sp-br{ display:inline; }
}

@media (max-width:640px){
  body{ line-height:1.9; }
  .product-cards,.shop-grid,.field-row{ grid-template-columns:1fr; }
  .more-list{ grid-template-columns:1fr; }
  .pcard-desc{ min-height:0; }
  .brand-sub{ display:none; }
  .compare{ gap:14px; }
  .kdw-body p,.lead-text,.aounagi-lead p{ font-size:.98rem; }
  .steps li{ gap:16px; }
  .step-no{ width:42px; height:42px; font-size:1.3rem; }
  .company-table th{ width:8.5em; font-size:.92rem; }
  .company-table th,.company-table td{ padding:14px 8px; font-size:.92rem; }
  .hero-content{ padding-top:120px; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal{ opacity:1; transform:none; }
  html{ scroll-behavior:auto; }
}

/* =====================================================================
   v3 追加：BtoB（活鰻卸・卸加工・直売所）向けコンポーネント
   ===================================================================== */

/* ダークセクション上の共通テキスト色 */
.section-dark .lead-text{ color:#d8d3c9; }
.intro-points strong{ color:var(--gold); font-weight:700; letter-spacing:.04em; }

/* ---------- 活鰻卸業務（主力事業） ---------- */
.biz-main{
  display:grid; grid-template-columns:1.08fr .92fr;
  gap:clamp(36px,5vw,72px); align-items:start;
  margin-bottom:clamp(44px,6vw,76px);
}
.biz-points{ display:flex; flex-direction:column; gap:13px; margin:8px 0 28px; }
.biz-points li{ display:flex; align-items:baseline; gap:12px; font-family:var(--serif-jp); color:#e8e4dc; font-size:1.02rem; line-height:1.8; }
.biz-points strong{ color:var(--gold-3); font-weight:600; }

.client-block{ margin-bottom:28px; }
.client-label{ font-family:var(--serif-jp); color:var(--gold-3); font-size:.92rem; letter-spacing:.08em; margin-bottom:13px; }
.client-tags{ display:flex; flex-wrap:wrap; gap:9px; }
.client-tags li{
  font-family:var(--serif-jp); font-size:.86rem; color:#e8e4dc; letter-spacing:.04em;
  border:1px solid rgba(205,176,74,.42); border-radius:999px; padding:6px 15px;
}

.biz-photo{ display:flex; flex-direction:column; gap:18px; }
.biz-photo figure{ position:relative; }
.biz-photo img{ width:100%; object-fit:cover; border-radius:3px; box-shadow:0 30px 60px -30px rgba(0,0,0,.7); }
.biz-photo .pf-main img{ aspect-ratio:4/3; box-shadow:0 0 0 1px rgba(205,176,74,.5), 0 30px 60px -30px rgba(0,0,0,.7); }
.biz-photo .pf-sub img{ aspect-ratio:16/9; }
.biz-photo figcaption{ margin-top:9px; font-size:.8rem; color:#b7b2a8; letter-spacing:.06em; line-height:1.6; }

.biz-features{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.5vw,28px); }
.biz-feat{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(205,176,74,.22); border-radius:4px;
  padding:clamp(24px,3vw,34px); transition:.5s var(--ease);
}
.biz-feat:hover{ transform:translateY(-5px); border-color:rgba(205,176,74,.5); box-shadow:0 26px 56px -30px rgba(0,0,0,.8); }
.biz-feat-no{ display:block; font-family:var(--latin); font-size:1.7rem; font-weight:600; color:var(--gold); line-height:1; margin-bottom:14px; }
.biz-feat h3{ font-family:var(--serif-jp); font-weight:700; color:#fff; font-size:1.2rem; letter-spacing:.06em; margin-bottom:12px; }
.biz-feat p{ font-size:.92rem; line-height:1.95; color:#c8c3b9; }

/* ---------- 卸加工業務 ---------- */
.proc-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(36px,6vw,80px); align-items:center; }
.proc-photo{ position:relative; }
.proc-photo img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px; box-shadow:0 30px 60px -28px rgba(0,0,0,.5); }
.proc-photo::before{ content:""; position:absolute; inset:-14px 14px 14px -14px; border:1px solid var(--gold); z-index:-1; border-radius:3px; }
.proc-block{ margin:28px 0; }
.proc-h{ font-family:var(--serif-jp); font-weight:600; color:var(--ink); font-size:1.15rem; letter-spacing:.08em; margin-bottom:16px; display:flex; align-items:center; gap:12px; }
.proc-h .bar{ width:5px; height:1.1em; background:linear-gradient(180deg,var(--gold-2),var(--gold)); }
.proc-list{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.proc-list li{ font-family:var(--serif-jp); font-size:.92rem; color:var(--ink); letter-spacing:.04em; background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 18px; }
.proc-copy .muted{ color:var(--text-soft); font-size:.9rem; line-height:1.9; }

.proc-products{ margin-top:clamp(46px,6vw,76px); }
.proc-products .more-title{ color:var(--ink); }
.product-cards-light{ margin-top:22px; }
.pcard-light{ background:#fff; border:1px solid var(--line); }
.pcard-light:hover{ border-color:var(--gold); box-shadow:0 30px 60px -30px rgba(0,0,0,.22); }
.pcard-light .pcard-name{ color:var(--ink); }
.pcard-light .pcard-desc{ color:var(--text); }

/* ---------- こだわり（ダーク化に伴う色上書き） ---------- */
.section-dark .kdw-title{ color:#fff; }
.section-dark .kdw-body p{ color:#d4cfc5; }
.section-dark .kdw-body strong{ color:var(--gold-3); }

/* ---------- 直売所（ライトセクション・簡潔版） ---------- */
.shop-simple{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(28px,4vw,56px); align-items:center; }
.info-dl{ margin-bottom:26px; }
.info-dl > div{ display:grid; grid-template-columns:6.5em 1fr; gap:12px; padding:15px 2px; border-bottom:1px solid var(--line); }
.info-dl > div:first-child{ border-top:2px solid var(--gold); }
.info-dl dt{ font-family:var(--serif-jp); color:var(--gold); font-size:.95rem; letter-spacing:.06em; }
.info-dl dd{ font-size:.98rem; line-height:1.85; color:var(--ink); }
.info-dl a:hover{ color:var(--gold); }

/* ---------- v3 レスポンシブ ---------- */
@media (max-width:1000px){
  .biz-main,.proc-grid,.shop-simple{ grid-template-columns:1fr; gap:32px; }
  .biz-features{ grid-template-columns:1fr; gap:18px; }
  .biz-photo{ max-width:520px; margin-inline:auto; width:100%; }
  .proc-photo{ max-width:440px; margin-inline:auto; }
}
@media (max-width:640px){
  .client-tags li,.proc-list li{ font-size:.82rem; padding:6px 13px; }
  .biz-points li{ font-size:.96rem; }
}