/*
 * O-YAKE Topic Style v1.0.0
 * 表示専用。テーマファイル・投稿本文・DBは変更しません。
 */

:root{
  --ots-ink:#17201d;
  --ots-deep:#0f4f43;
  --ots-green:#0b8a6d;
  --ots-mint:#dff4ed;
  --ots-cream:#f7f3e8;
  --ots-gold:#f2bd4f;
  --ots-card:#fffdf8;
  --ots-line:rgba(23,32,29,.12);
  --ots-muted:#68736e;
  --ots-radius:18px;
  --ots-shadow:0 18px 45px rgba(27,52,45,.12);
}

/* ===== 全体 ===== */
body.oyake-topic-modern-ui{
  color:var(--ots-ink);
  background:
    radial-gradient(circle at 10% 0%, rgba(11,138,109,.08), transparent 25%),
    radial-gradient(circle at 90% 8%, rgba(242,189,79,.08), transparent 22%),
    linear-gradient(180deg,#f6f8f5 0%,#eef4f1 100%) !important;
}

/* ===== 管理バー下のサイトヘッダー ===== */
body.oyake-topic-modern-ui header,
body.oyake-topic-modern-ui #header,
body.oyake-topic-modern-ui .site-header,
body.oyake-topic-modern-ui .header-container{
  background:rgba(255,253,248,.96) !important;
  border-bottom:1px solid rgba(15,79,67,.12);
  box-shadow:0 8px 28px rgba(27,52,45,.06);
}

body.oyake-topic-modern-ui .site-name-text,
body.oyake-topic-modern-ui .site-title,
body.oyake-topic-modern-ui .logo-text,
body.oyake-topic-modern-ui .header-site-title,
body.oyake-topic-modern-ui .logo-header a{
  color:var(--ots-ink)!important;
  letter-spacing:.02em;
}

/* ===== トップのキャッチコピー領域 ===== */
body.oyake-topic-modern-ui .front-top-page,
body.oyake-topic-modern-ui .front-top-page .container,
body.oyake-topic-modern-ui .front-page-type-index,
body.oyake-topic-modern-ui .home .entry-content:first-child{
  position:relative;
}

/* ===== メインコンテンツ ===== */
body.oyake-topic-modern-ui .content-in{
  max-width:1220px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

body.oyake-topic-modern-ui #main,
body.oyake-topic-modern-ui .main{
  border-radius:20px;
}

/* ===== 記事カード ===== */
body.oyake-topic-modern-ui .entry-card,
body.oyake-topic-modern-ui .related-entry-card,
body.oyake-topic-modern-ui .popular-entry-card,
body.oyake-topic-modern-ui .new-entry-card{
  background:var(--ots-card)!important;
  border:1px solid rgba(15,79,67,.10)!important;
  border-radius:16px!important;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(27,52,45,.07);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

body.oyake-topic-modern-ui .entry-card:hover,
body.oyake-topic-modern-ui .related-entry-card:hover,
body.oyake-topic-modern-ui .popular-entry-card:hover,
body.oyake-topic-modern-ui .new-entry-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(27,52,45,.12);
  border-color:rgba(11,138,109,.24)!important;
}

/* ===== 記事ページ ===== */
body.oyake-topic-modern-ui.single .article,
body.oyake-topic-modern-ui.page .article{
  background:rgba(255,253,248,.985)!important;
  border:1px solid rgba(15,79,67,.10);
  border-radius:20px;
  box-shadow:var(--ots-shadow);
  padding-left:clamp(20px,4vw,52px)!important;
  padding-right:clamp(20px,4vw,52px)!important;
}

body.oyake-topic-modern-ui.single .main,
body.oyake-topic-modern-ui.page .main{
  max-width:1020px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* ===== タイトル ===== */
body.oyake-topic-modern-ui .entry-title{
  color:var(--ots-ink)!important;
  line-height:1.42;
  letter-spacing:.005em;
  position:relative;
  padding-bottom:.8em;
}

body.oyake-topic-modern-ui .entry-title::after{
  content:"";
  display:block;
  width:86px;
  height:4px;
  margin-top:.55em;
  border-radius:999px;
  background:linear-gradient(90deg,var(--ots-green),var(--ots-gold));
}

/* ===== h2 ===== */
body.oyake-topic-modern-ui .entry-content h2,
body.oyake-topic-modern-ui .article h2{
  position:relative;
  margin-top:2.2em;
  padding:.82em 1em .82em 1.15em;
  border:0!important;
  border-radius:12px;
  color:#fff!important;
  background:linear-gradient(100deg,var(--ots-deep),#176d5e)!important;
  box-shadow:0 8px 22px rgba(15,79,67,.16);
}

body.oyake-topic-modern-ui .entry-content h2::after,
body.oyake-topic-modern-ui .article h2::after{
  content:"";
  position:absolute;
  right:18px;
  top:50%;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--ots-gold);
  transform:translateY(-50%);
  box-shadow:0 0 0 5px rgba(242,189,79,.15);
}

/* ===== h3 ===== */
body.oyake-topic-modern-ui .entry-content h3,
body.oyake-topic-modern-ui .article h3{
  color:var(--ots-deep)!important;
  background:linear-gradient(90deg,rgba(11,138,109,.08),transparent)!important;
  border-left:5px solid var(--ots-green)!important;
  padding:.45em .7em;
}

/* ===== 本文 ===== */
body.oyake-topic-modern-ui .entry-content p,
body.oyake-topic-modern-ui .article p{
  line-height:1.95;
}

body.oyake-topic-modern-ui .entry-content a,
body.oyake-topic-modern-ui .article a{
  color:#087d66;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

body.oyake-topic-modern-ui .entry-content a:hover,
body.oyake-topic-modern-ui .article a:hover{
  color:#b77d12;
}

/* ===== カテゴリ・タグ ===== */
body.oyake-topic-modern-ui .cat-label,
body.oyake-topic-modern-ui .category,
body.oyake-topic-modern-ui .tag{
  border-radius:999px!important;
  background:rgba(11,138,109,.10)!important;
  color:var(--ots-deep)!important;
  border:1px solid rgba(11,138,109,.12);
}

/* ===== 人気記事・関連記事の見出し ===== */
body.oyake-topic-modern-ui .related-entry-heading,
body.oyake-topic-modern-ui .popular-entry-heading,
body.oyake-topic-modern-ui .new-entry-heading,
body.oyake-topic-modern-ui .widget-title{
  color:var(--ots-ink)!important;
  background:linear-gradient(90deg,rgba(11,138,109,.09),rgba(242,189,79,.08))!important;
  border:1px solid rgba(15,79,67,.08)!important;
  border-radius:12px;
  padding:.65em .9em!important;
}

/* ===== サイドバー ===== */
body.oyake-topic-modern-ui .sidebar .widget,
body.oyake-topic-modern-ui aside .widget,
body.oyake-topic-modern-ui .widget-area .widget{
  background:rgba(255,253,248,.96)!important;
  border:1px solid rgba(15,79,67,.10);
  border-radius:16px;
  box-shadow:0 12px 30px rgba(27,52,45,.08);
  overflow:hidden;
}

/* ===== テーブル ===== */
body.oyake-topic-modern-ui table{
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 8px 22px rgba(27,52,45,.06);
}
body.oyake-topic-modern-ui th{
  background:var(--ots-deep)!important;
  color:#fff!important;
}
body.oyake-topic-modern-ui td{
  background:#fffdf8;
}

/* ===== 引用 ===== */
body.oyake-topic-modern-ui blockquote{
  background:linear-gradient(90deg,#f2fbf7,#fffaf0)!important;
  border-left:4px solid var(--ots-green)!important;
  border-radius:10px;
}

/* ===== ボタン ===== */
body.oyake-topic-modern-ui .wp-block-button__link,
body.oyake-topic-modern-ui .button,
body.oyake-topic-modern-ui input[type="submit"]{
  background:linear-gradient(90deg,var(--ots-deep),var(--ots-green))!important;
  color:#fff!important;
  border:0!important;
  border-radius:999px!important;
  box-shadow:0 8px 18px rgba(15,79,67,.16);
}

/* ===== パンくず ===== */
body.oyake-topic-modern-ui .breadcrumb,
body.oyake-topic-modern-ui .breadcrumb a{
  color:#61716a!important;
}

/* ===== SNS ===== */
body.oyake-topic-modern-ui .sns-share,
body.oyake-topic-modern-ui .sns-follow,
body.oyake-topic-modern-ui .article-footer{
  border-radius:14px;
}

/* ===== フッター ===== */
body.oyake-topic-modern-ui footer,
body.oyake-topic-modern-ui #footer,
body.oyake-topic-modern-ui .site-footer,
body.oyake-topic-modern-ui .footer{
  background:#10211c!important;
  color:#d5ded9!important;
  border-top:4px solid var(--ots-green);
}

/* ===== トップページのヒーローっぽい雰囲気を強化 ===== */
body.oyake-topic-modern-ui.home .main,
body.oyake-topic-modern-ui.home #main{
  background:transparent!important;
  box-shadow:none!important;
}

/* 微細な紙＋ドット感 */
body.oyake-topic-modern-ui::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.18;
  background-image:
    radial-gradient(circle at 1px 1px,rgba(15,79,67,.10) 1px,transparent 1.2px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom,black,transparent 80%);
}

/* ===== PC ===== */
@media (min-width:1024px){
  body.oyake-topic-modern-ui .content-in,
  body.oyake-topic-modern-ui .container,
  body.oyake-topic-modern-ui .site-content{
    max-width:1220px;
    margin-left:auto;
    margin-right:auto;
  }
}

/* ===== スマホ ===== */
@media (max-width:767px){
  body.oyake-topic-modern-ui{
    background-attachment:scroll;
  }

  body.oyake-topic-modern-ui.single .article,
  body.oyake-topic-modern-ui.page .article{
    padding-left:16px!important;
    padding-right:16px!important;
    border-radius:12px;
  }

  body.oyake-topic-modern-ui .entry-title{
    font-size:1.6em;
  }

  body.oyake-topic-modern-ui .entry-content h2,
  body.oyake-topic-modern-ui .article h2{
    font-size:1.2em;
    padding:.72em .8em .72em 1em;
  }
}