@charset "UTF-8";
/* =========================================================
   DOG LUCK — 和（WAFU）レイヤー
   和紙地紋 / 縦書き / 朱印 / 青海波・麻の葉 / 罫
   ========================================================= */

/* ---------- 和紙の地紋（紙の質感） ---------- */
.bespoke {
  background-color: var(--washi);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-attachment: fixed;
}
/* 地紋は淡く。グレースケールnoiseをmultiplyで紙の繊維感に */
.bespoke::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E");
  opacity: 0.04;
  mix-blend-mode: multiply;
}
/* コンテンツは地紋(::after)の上へ。ヘッダーはfixedのまま触らない */
.front, .page-main, .site-footer { position: relative; z-index: 2; }

/* ---------- 朱印（丸い判子） ---------- */
.seal {
  display: inline-grid;
  place-items: center;
  width: 5.4em;
  height: 5.4em;
  border: 2px solid var(--shu);
  border-radius: 50%;
  color: var(--shu);
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 0.9rem;
  letter-spacing: 0.28em;
  writing-mode: vertical-rl;
  text-orientation: upright;
  line-height: 1.25;
  padding: 0.6em 0;
  transform: rotate(-3deg);
  background: rgba(193, 66, 46, 0.04);
}
.seal--on-dark { border-color: #e0735e; color: #e9a18f; background: rgba(224,115,94,.06); }

/* ---------- 縦書き見出し ---------- */
.tate { writing-mode: vertical-rl; text-orientation: mixed; }

/* ---------- 和の kicker（縦の朱罫＋小見出し） ---------- */
.kicker--wa {
  display: inline-flex;
  align-items: center;
  gap: 0.8em;
  font-family: var(--font-serif);
  letter-spacing: 0.3em;
}
.kicker--wa::before {
  content: "";
  width: 1px;
  height: 1.8em;
  background: var(--shu);
}

/* ---------- 青海波（区切り罫） ---------- */
.wa-seigaiha {
  height: 26px;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='20' viewBox='0 0 40 20'%3E%3Cg fill='none' stroke='%238c4a32' stroke-opacity='0.35' stroke-width='1'%3E%3Cpath d='M0 20 A20 20 0 0 1 40 20'/%3E%3Cpath d='M0 20 A13 13 0 0 1 26 20' transform='translate(-6 0)'/%3E%3Cpath d='M0 20 A13 13 0 0 1 26 20' transform='translate(14 0)'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: center;
  opacity: 0.8;
}

/* ---------- 麻の葉（淡い背景装飾・任意セクション） ---------- */
.wa-asanoha-bg {
  position: relative;
}
.wa-asanoha-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='104' viewBox='0 0 60 104'%3E%3Cg fill='none' stroke='%238c4a32' stroke-opacity='0.10' stroke-width='1'%3E%3Cpath d='M30 0 L30 52 M30 52 L60 35 M30 52 L0 35 M30 52 L60 69 M30 52 L0 69 M30 52 L30 104 M0 35 L0 69 M60 35 L60 69 M0 35 L30 0 L60 35 M0 69 L30 104 L60 69'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 60px 104px;
}

/* =========================================================
   HERO — 縦書き仕様
   ========================================================= */
.hero__title-tate { font-family: var(--font-serif); font-weight: 600; margin: 0; text-shadow: 0 2px 30px rgba(0,0,0,.4); }
.hero__title-tate .accent { color: #f0c9a0; }

@media (min-width: 769px) {
  .hero--tate .hero__inner { position: relative; display: block; min-height: 88svh; }
  /* 縦書きタイトル（右・上方） */
  .hero__title-tate {
    position: absolute;
    top: clamp(7rem, 16vh, 11rem);
    right: 0;
    display: flex;
    flex-direction: row-reverse;
    gap: 0.5em;
    font-size: clamp(2.4rem, 4.4vw, 4.2rem);
    line-height: 1;
    letter-spacing: 0.16em;
  }
  .hero__title-tate span { writing-mode: vertical-rl; text-orientation: mixed; }
  /* 朱印（右上のタイトル左隣） */
  .hero--tate .seal { position: absolute; top: clamp(7rem, 16vh, 11rem); right: clamp(7rem, 12vw, 11rem); }
  /* リード＋ボタン（左下） */
  .hero--tate .hero__ground { position: absolute; left: 0; bottom: clamp(3rem, 8vh, 7rem); max-width: 40ch; }
  .hero--tate .hero__scroll { position: absolute; right: 0; bottom: clamp(3rem, 8vh, 7rem); }
}

/* モバイルは横書きフォールバック */
@media (max-width: 768px) {
  .hero--tate .hero__inner { display: flex; flex-direction: column; justify-content: flex-end; gap: 1.4rem; }
  .hero__title-tate { display: flex; flex-direction: column; font-size: clamp(2rem, 9vw, 2.8rem); line-height: 1.3; letter-spacing: 0.05em; }
  .hero--tate .seal { display: none; }
  .hero--tate .hero__scroll { display: none; }
}
