/*
Theme Name: Éditions Libellula
Theme URI: https://editionslibellula.jp
Author: Kotaro / 書肆リヴェルリ
Description: 書肆リヴェルリ（Éditions Libellula）公式サイト用テーマ。無彩色・和文ゴシック＋欧文セリフを基調にした最小構成のテーマです。
Version: 0.1.0
Requires PHP: 7.4
Text Domain: editions-libellula
*/

:root{
  --ink:#0A0A0A;
  --charcoal:#3A3A3A;
  --stone:#8C8C8C;
  --mist:#D8D8D8;
  --paper:#F4F4F2;
  --white:#FFFFFF;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Zen Kaku Gothic New', sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.el-wrap{ max-width:960px; margin:0 auto; padding:0 28px; }

/* ---- nav (header is unadorned: menu only, no logo) ---- */
.el-nav{
  display:flex; justify-content:center; gap:36px;
  padding:20px; border-bottom:1px solid var(--mist);
  font-size:11px; letter-spacing:.1em; color:var(--charcoal);
}
.el-nav a:hover{ color:var(--ink); }
.el-nav-list{ list-style:none; display:flex; gap:36px; margin:0; padding:0; }
.el-nav-list li{ margin:0; }

.el-frame{ border:1px solid var(--mist); background:var(--white); margin:32px auto; max-width:960px; position:relative; overflow:hidden; }

/* ---- home news block (menu直下・ごく簡潔なお知らせ) ---- */
.el-news{
  display:flex; align-items:center; gap:24px;
  padding:26px 32px; border-bottom:1px solid var(--mist);
}
.el-news-image{ width:46px; height:46px; flex:none; opacity:.85; }
.el-news-image img{ width:100%; height:100%; object-fit:contain; }
.el-news-text{ font-size:12px; line-height:1.9; color:var(--charcoal); }
.el-news-text a{ text-decoration:underline; text-underline-offset:2px; }
.el-news-text a:hover{ color:var(--ink); }
@media (max-width:600px){
  .el-news{ flex-direction:column; align-items:flex-start; gap:14px; }
}

/* ---- publications index (default home content) ---- */
.el-index-row{
  position:relative; display:grid; grid-template-columns:74px 1fr auto auto;
  gap:22px; align-items:center; padding:18px 32px; border-bottom:1px solid var(--mist);
  transition:background .2s;
}
.el-index-row:last-child{ border-bottom:none; }
.el-cover{ width:56px; height:78px; object-fit:cover; background:var(--mist); border:1px solid var(--mist); box-shadow:0 1px 2px rgba(0,0,0,.05), 0 4px 10px rgba(0,0,0,.05); }
.el-index-title{ font-size:14px; font-weight:500; letter-spacing:.02em; line-height:1.4; }
.el-index-title .el-author{ display:block; font-size:11px; color:var(--stone); font-weight:400; margin-top:4px; }
.el-index-meta{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--stone); }
.el-index-price{ font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--ink); }

@media (hover:hover) and (pointer:fine){
  .el-index-row:hover{ background:var(--paper); }
  .el-index-row:hover .el-hover-photo{ opacity:1; transform:translateY(0); }
}
.el-hover-photo{
  position:absolute; left:112px; top:-10px; width:140px; height:98px;
  background:#bdbdbd; background-size:cover; background-position:center;
  opacity:0; transform:translateY(8px); transition:opacity .22s ease, transform .22s ease;
  pointer-events:none; z-index:5; box-shadow:0 8px 24px rgba(0,0,0,.14);
}

/* ---- footer: mark + brand, kept quiet ---- */
.el-footer{
  padding:32px 32px 28px; text-align:center;
  border-top:1px solid var(--mist); background:var(--paper);
}
.el-footer .el-mark{ width:30px; height:30px; margin:0 auto 12px; opacity:.85; }
.el-footer .el-mark img{ width:100%; height:100%; object-fit:contain; }
.el-footer .el-jp{ font-size:11px; font-weight:500; letter-spacing:.1em; color:var(--charcoal); }
.el-footer .el-en{ font-family:'EB Garamond', serif; font-style:italic; font-size:10px; color:var(--stone); margin-top:4px; }
.el-footer .el-util{ margin-top:14px; font-family:'JetBrains Mono', monospace; font-size:9.5px; color:var(--stone); }

/* ---- the veil (homepage-only, optional per Customizer) ---- */
.el-veil{
  position:absolute; inset:0; z-index:50;
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%);
  cursor:pointer;
  transition:opacity .5s ease, visibility .5s ease;
  opacity:1;
}
.el-veil:hover{ opacity:.62; }
.el-veil.el-veil-gone{ opacity:0; visibility:hidden; pointer-events:none; }
.el-veil-hint{
  position:absolute; top:22px; right:22px; z-index:51;
  font-family:'JetBrains Mono', monospace; font-size:9.5px; letter-spacing:.05em;
  color:rgba(255,255,255,.55); pointer-events:none; transition:opacity .4s ease;
}
.el-veil.el-veil-gone ~ .el-veil-hint{ opacity:0; }

/* ---- veil variant：最初から半透明で、お知らせテキストを載せる ---- */
.el-veil.el-veil-message{ opacity:.6; }
.el-veil.el-veil-message:hover{ opacity:.42; }
.el-veil.el-veil-message.el-veil-gone{ opacity:0; }

.el-veil-message-wrap{
  position:absolute; top:12%; right:6%; width:58%; max-width:640px; text-align:right;
  pointer-events:none;
}
.el-veil-message-tag{
  display:block; font-family:'JetBrains Mono', monospace; font-weight:400; letter-spacing:.05em;
  font-size:11px; margin-bottom:16px; color:rgba(255,255,255,.65); text-align:right;
}
.el-veil-message-link{
  display:block; font-family:'Zen Kaku Gothic New', sans-serif; font-weight:900;
  letter-spacing:-.05em; line-height:.86; color:#fff; pointer-events:auto; text-decoration:none;
}
.el-veil-message-link:hover{ opacity:.8; }
.el-veil-message-plain{ cursor:pointer; }
.el-msg-line{
  font-size:clamp(28px, 6.5vw, 62px); display:block; margin-top:-.05em;
}
.el-msg-line:nth-child(1){ transform:translateX(0); }
.el-msg-line:nth-child(2){ transform:translateX(-2%); }
.el-msg-line:nth-child(3){ transform:translateX(2%); }
.el-msg-line:nth-child(4){ transform:translateX(-2%); }
.el-msg-line:nth-child(5){ transform:translateX(2%); }

@media (max-width:600px){
  .el-veil-message-wrap{ top:8%; right:5%; left:5%; width:auto; }
  .el-msg-line{ font-size:clamp(24px, 10vw, 40px); }
}

/* ---- book detail (single kankobutsu) ---- */
.el-book{ max-width:820px; margin:0 auto; }

.el-book-row{ display:grid; grid-template-columns:160px 200px 1fr; gap:40px; padding:48px 32px; border-bottom:1px solid var(--mist); }
.el-cover-block{ width:100%; aspect-ratio:3/4; background:var(--mist); border:1px solid var(--mist); box-shadow:0 2px 4px rgba(0,0,0,.05), 0 10px 24px rgba(0,0,0,.07); }
.el-book-title{ font-size:22px; font-weight:500; margin:0 0 8px; }
.el-book-author{ font-size:13px; color:var(--stone); margin-bottom:18px; }
.el-book-meta{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--stone); line-height:2; }
.el-buy-row{ margin-top:20px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.el-buy-btn{ display:inline-block; padding:10px 22px; border:1px solid var(--ink); font-size:12px; letter-spacing:.08em; color:var(--ink); }
.el-price{ font-family:'JetBrains Mono', monospace; font-size:14px; }

.el-book-col-intro h3{ font-size:12px; letter-spacing:.1em; color:var(--stone); text-transform:uppercase; margin:0 0 14px; font-weight:400; }
.el-book-col-intro p{ font-size:13px; line-height:2; color:var(--charcoal); margin:0 0 1em; }

.el-photo-strip{ display:grid; grid-template-columns:1.4fr 1fr; gap:1px; background:var(--mist); border-bottom:1px solid var(--mist); }
.el-photo-block{ background:var(--mist); aspect-ratio:4/3; background-size:cover; background-position:center; }

.el-content-block{ padding:40px 32px; border-bottom:1px solid var(--mist); text-align:center; }
.el-content-block h3{ font-size:14px; letter-spacing:.1em; color:var(--stone); text-transform:uppercase; margin:0 0 16px; font-weight:400; }
.el-content-block p{ font-size:14px; line-height:2.1; color:var(--charcoal); max-width:560px; margin:0 auto 1em; text-align:left; }
.el-toc{ list-style:none; padding:0; margin:0 auto; max-width:400px; text-align:left; }
.el-toc li{ display:flex; justify-content:space-between; font-size:13px; padding:9px 0; border-bottom:1px dotted var(--mist); color:var(--charcoal); }

.el-press-item{ font-size:13px; line-height:1.9; color:var(--charcoal); padding-left:14px; border-left:2px solid var(--mist); margin:0 auto 16px; max-width:560px; text-align:left; }
.el-press-item a{ text-decoration:underline; text-underline-offset:2px; }
.el-press-item a:hover{ color:var(--ink); }

.el-authors{ max-width:560px; margin:0 auto; text-align:left; }
.el-author-item{ padding:18px 0; border-top:1px dotted var(--mist); }
.el-author-item:first-child{ border-top:none; padding-top:0; }
.el-author-name{ font-size:14px; font-weight:500; color:var(--ink); }
.el-author-reading{ font-size:11px; font-weight:400; color:var(--stone); margin-left:8px; }
.el-author-item p{ font-size:13px; line-height:1.9; color:var(--charcoal); margin:8px 0 0; }

.el-book-cta{ padding:44px 32px 56px; }

/* ---- 見出し（種別＋自由記述）：刊行物個別ページ・記事一覧・記事単体で共通 ---- */
.el-article-type{
  display:inline-block; flex:none; font-family:'JetBrains Mono', monospace; font-size:10px;
  letter-spacing:.04em; color:var(--stone); border:1px solid var(--mist);
  padding:2px 8px; margin-right:10px; vertical-align:middle;
}
.el-article-title{ font-size:14px; color:var(--ink); vertical-align:middle; }

/* ---- 紐付けられた記事（刊行物個別ページ、行の下・目次の上） ---- */
.el-articles-linked{ border-bottom:1px solid var(--mist); }
.el-article-accordion{ border-top:1px solid var(--mist); }
.el-article-accordion:first-child{ border-top:none; }
.el-article-row{
  display:flex; align-items:center; width:100%; text-align:left; background:none; border:none;
  padding:18px 32px; font:inherit; cursor:pointer; color:inherit;
}
.el-article-row:hover{ background:var(--paper); }
.el-article-accordion.is-open .el-article-row{ background:var(--paper); }
.el-article-row .el-article-title{
  flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.el-article-row:focus-visible{ outline:1px solid var(--ink); outline-offset:-1px; }

.el-article-panel{ padding:0 32px 28px; }
.el-article-panel-inner{ max-width:560px; margin:0 auto; text-align:left; }
.el-article-panel p{ font-size:13px; line-height:2; color:var(--charcoal); margin:0 0 1em; }
.el-article-panel h2, .el-article-panel h3, .el-article-panel h4{ font-size:14px; font-weight:500; color:var(--ink); margin:1.6em 0 .6em; }
.el-article-panel ul, .el-article-panel ol{ font-size:13px; line-height:1.9; color:var(--charcoal); margin:0 0 1em; padding-left:1.3em; }
.el-article-panel a{ text-decoration:underline; text-underline-offset:2px; }
.el-article-panel a:hover{ color:var(--ink); }
.el-article-panel img{ max-width:100%; height:auto; margin:1em 0; border:1px solid var(--mist); }
.el-article-panel figure{ margin:1em 0; }
.el-article-panel figcaption{ font-size:11px; color:var(--stone); margin-top:6px; }
.el-article-panel blockquote{ margin:1em 0; padding-left:16px; border-left:2px solid var(--mist); color:var(--stone); font-style:italic; }

/* ---- 記事一覧ページ（home.php） ---- */
.el-article-list-row{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding:20px 32px; border-bottom:1px solid var(--mist);
}
.el-article-list-row:hover{ background:var(--paper); }
.el-article-list-row .el-article-title{
  flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.el-article-list-date{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--stone); flex:none; }

/* ---- 記事単体ページ（single.php） ---- */
.el-article-single .el-article-title{ font-size:20px; font-weight:500; display:block; margin-top:8px; white-space:normal; }
.el-article-date{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--stone); margin-bottom:32px; text-align:center; }
.el-article-single p{ font-size:14px; line-height:2.1; color:var(--charcoal); }
.el-article-single img{ max-width:100%; height:auto; margin:1em 0; }

/* ---- generic page ---- */
.el-page{ padding:64px 32px; max-width:640px; margin:0 auto; }
.el-page h1{ font-size:22px; font-weight:500; margin:0 0 32px; text-align:center; }
.el-page p{ font-size:14px; line-height:2.1; color:var(--charcoal); }

@media (max-width:600px){
  .el-index-row{ grid-template-columns:52px 1fr; grid-template-areas:"cover title" "cover meta"; row-gap:4px; }
  .el-index-price{ display:none; }
  .el-book-row{ grid-template-columns:1fr; gap:24px; }
}

/* ---- 会社概要・書店様へ ページ用パーツ（ページ本文にHTMLとして貼り付けて使用） ---- */
.el-page{ max-width:640px; }
.el-page h2{ font-size:15px; font-weight:500; letter-spacing:.08em; color:var(--charcoal); margin:56px 0 24px; padding-bottom:12px; border-bottom:1px solid var(--mist); text-align:center; }
.el-page h2:first-of-type{ margin-top:0; }

.el-info-table{ width:100%; max-width:480px; margin:0 auto; border-collapse:collapse; font-size:13px; }
.el-info-table th, .el-info-table td{ text-align:left; padding:11px 0; border-bottom:1px dotted var(--mist); font-weight:400; }
.el-info-table th{ width:120px; color:var(--stone); font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.04em; vertical-align:top; }
.el-info-table td{ color:var(--ink); }

.el-steps{ list-style:none; margin:0; padding:0; counter-reset:el-step; }
.el-steps li{ position:relative; padding:0 0 20px 34px; font-size:13px; line-height:1.9; color:var(--charcoal); }
.el-steps li::before{
  counter-increment:el-step; content:counter(el-step);
  position:absolute; left:0; top:0; width:20px; height:20px;
  border:1px solid var(--ink); border-radius:50%;
  font-family:'JetBrains Mono', monospace; font-size:10px;
  display:flex; align-items:center; justify-content:center; color:var(--ink);
}
.el-steps li b{ display:block; color:var(--ink); font-weight:500; margin-bottom:4px; }

.el-cta{ display:inline-block; margin-top:8px; padding:13px 32px; background:var(--ink); color:var(--white) !important; font-size:12px; letter-spacing:.08em; }
.el-cta:hover{ opacity:.85; }
button.el-cta{ border:none; cursor:pointer; font-family:'Zen Kaku Gothic New', sans-serif; }
.el-cta-wrap{ text-align:center; margin-top:36px; }
.el-inline-form{ margin-top:36px; padding-top:36px; border-top:1px solid var(--mist); }

/* ---- Contact Form 7 の見た目をサイトのトーンに合わせる（ゆったり・中央寄せ） ---- */
.wpcf7-form{ max-width:600px; margin:0 auto; font-family:'Zen Kaku Gothic New', sans-serif; }
.wpcf7-form p{ margin:0 0 30px; text-align:center; }
.wpcf7-form label{ display:block; font-size:12px; letter-spacing:.08em; color:var(--stone); margin-bottom:12px; }
.wpcf7-form-control{
  width:100%; border:1px solid var(--mist); background:var(--white);
  padding:18px 20px; font-size:14px; font-family:'Zen Kaku Gothic New', sans-serif;
  color:var(--ink); outline:none; transition:border-color .15s; text-align:left;
}
.wpcf7-form textarea.wpcf7-form-control{ min-height:170px; resize:vertical; }
.wpcf7-form-control:focus{ border-color:var(--ink); }
.wpcf7-form .wpcf7-radio{ display:flex; justify-content:center; gap:32px; }
.wpcf7-form .wpcf7-list-item{ margin:0; }
.wpcf7-form .wpcf7-list-item-label{ font-size:13px; color:var(--charcoal); margin-left:6px; }
.wpcf7-form input[type="submit"]{
  display:block; width:auto; border:none; background:var(--ink); color:var(--white);
  padding:14px 40px; font-size:12px; letter-spacing:.08em; cursor:pointer; transition:opacity .15s;
  margin:44px auto 0;
}
.wpcf7-form input[type="submit"]:hover{ opacity:.85; }
.wpcf7-not-valid-tip{ color:#a33; font-size:11px; margin-top:6px; }
.wpcf7-response-output{ border:1px solid var(--mist) !important; font-size:12px; margin-top:20px !important; padding:12px 14px !important; }
.wpcf7-form.sent .wpcf7-response-output{ border-color:var(--ink) !important; }