/* Mominekodoh Brand Theme v1.0.0 - theme.css */

/* ---------- リセット(最小) ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img,video,svg{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font:inherit;background:none;border:none;cursor:pointer}

html{scroll-behavior:smooth}
html,body{overflow-x:clip}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

body{
  font-family:var(--mnk-font);
  font-size:var(--mnk-fs-body);
  line-height:var(--mnk-lh);
  color:var(--mnk-text);
  background:var(--mnk-bg);
  -webkit-font-smoothing:antialiased;
}

/* ---------- 共通部品 ---------- */
.mnk-container{max-width:var(--mnk-content-w);margin-inline:auto;padding-inline:calc(var(--mnk-space)*3)}
.mnk-section{padding-block:var(--mnk-section-pad)}
.mnk-section--warm{background:var(--mnk-bg-warm)}
.mnk-section__title{
  font-size:var(--mnk-fs-h2);
  color:var(--mnk-heading);
  letter-spacing:.18em;
  text-align:center;
  font-weight:600;
  margin-bottom:calc(var(--mnk-space)*5);
}
.mnk-lead{max-width:var(--mnk-text-w);margin-inline:auto;text-align:center}

/* ボタン */
.mnk-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  min-height:48px;padding:.6em 2em;
  border:1.5px solid var(--mnk-accent-md);
  border-radius:var(--mnk-radius-pill);
  color:var(--mnk-heading);background:var(--mnk-card);
  letter-spacing:.1em;transition:background .2s;
}
.mnk-btn:hover{background:var(--mnk-accent)}
.mnk-btn--fill{background:var(--mnk-accent);border-color:var(--mnk-accent)}
.mnk-btn--fill:hover{background:var(--mnk-accent-md)}
.mnk-btn .mnk-arrow{width:.9em;height:.9em;stroke:var(--mnk-accent-dp)}
.mnk-more{text-align:center;margin-top:calc(var(--mnk-space)*4)}

:focus-visible{outline:2px solid var(--mnk-accent-dp);outline-offset:2px}

/* ---------- ヘッダー ---------- */
.mnk-header{
  position:fixed;inset-inline:0;top:0;z-index:100;height:60px;
  display:flex;align-items:center;
  background:transparent;transition:background .25s,border-color .25s;
  border-bottom:1px solid transparent;
}
.mnk-header.is-solid{background:var(--mnk-bg);border-color:var(--mnk-line)}
body:not(.home) .mnk-header{background:var(--mnk-bg);border-color:var(--mnk-line);position:sticky}
.mnk-header__inner{
  width:100%;max-width:var(--mnk-content-w);margin-inline:auto;
  display:flex;align-items:center;gap:calc(var(--mnk-space)*3);
  padding-inline:calc(var(--mnk-space)*3);
}
.mnk-logo{display:flex;align-items:center;gap:.6em;font-weight:600;letter-spacing:.2em;color:var(--mnk-heading);white-space:nowrap;min-width:0}
.mnk-logo img,.mnk-logo .mnk-logo__img{height:40px;width:auto;max-width:260px;object-fit:contain}
.mnk-logo__cap{font-weight:600;font-size:var(--mnk-fs-small);letter-spacing:.12em;color:var(--mnk-heading)}
.mnk-logo__cap::before{content:"|";margin-right:.6em;font-weight:400;color:var(--mnk-text)}
/* 全端末共通: メニューはハンバーガーで開閉する白パネル(動画上でも読める) */
.mnk-gnav{
  display:none;position:fixed;inset:60px 0 auto 0;z-index:99;
  background:var(--mnk-bg);border-bottom:1px solid var(--mnk-line);
  padding:calc(var(--mnk-space)*2) 0;max-height:calc(100svh - 60px);overflow-y:auto;
}
.mnk-gnav.is-open{display:block}
.mnk-gnav ul{display:block}
.mnk-gnav a{display:block;text-align:center;letter-spacing:.15em;padding:calc(var(--mnk-space)*1.5)}
.mnk-gnav a:hover{color:var(--mnk-accent-dp);background:var(--mnk-card)}
/* 入れ子メニュー(アコーディオン) */
.mnk-gnav .menu-item-has-children > a::after{
  content:"";display:inline-block;width:.55em;height:.55em;margin-left:.6em;
  border-right:1.5px solid var(--mnk-accent-dp);border-bottom:1.5px solid var(--mnk-accent-dp);
  transform:rotate(45deg) translateY(-2px);transition:transform .2s;
}
.mnk-gnav .menu-item-has-children.is-open > a::after{transform:rotate(225deg) translateY(-2px)}
.mnk-gnav .sub-menu{display:none;background:var(--mnk-card)}
.mnk-gnav .menu-item-has-children.is-open > .sub-menu{display:block}
.mnk-gnav .sub-menu a{font-size:var(--mnk-fs-small);padding:calc(var(--mnk-space)*1.25)}
.mnk-gnav .sub-menu a::before{content:"− ";color:var(--mnk-accent-md)}
/* ボタン群は常に右端(電話→web予約→ハンバーガーの順) */
.mnk-header .mnk-btn--tel,.mnk-header .mnk-btn--fill{margin-left:auto}
.mnk-btn--tel ~ .mnk-btn--fill{margin-left:0}
.mnk-header .mnk-btn--tel{order:7}
.mnk-header .mnk-btn--fill{order:8}
.mnk-header .mnk-btn{min-height:40px;padding:.3em 1.4em;font-size:var(--mnk-fs-small)}
.mnk-btn--tel svg{width:1.1em;height:1.1em;stroke:var(--mnk-accent-dp)}
.mnk-btn--fill svg{width:1.1em;height:1.1em;stroke:var(--mnk-heading);fill:none}

/* ハンバーガー(スマホ) */
.mnk-menu-toggle{display:block;width:44px;height:44px;position:relative;order:9;flex-shrink:0}
.mnk-menu-toggle span{
  position:absolute;left:12px;width:20px;height:2px;background:var(--mnk-heading);transition:.25s;
}
.mnk-menu-toggle span:nth-child(1){top:16px}
.mnk-menu-toggle span:nth-child(2){top:22px}
.mnk-menu-toggle span:nth-child(3){top:28px}
.mnk-menu-toggle[aria-expanded="true"] span:nth-child(1){top:22px;transform:rotate(45deg)}
.mnk-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.mnk-menu-toggle[aria-expanded="true"] span:nth-child(3){top:22px;transform:rotate(-45deg)}

/* ---------- ヒーロー ---------- */
.mnk-hero{position:relative;height:100svh;min-height:540px;display:grid;place-items:center;overflow:hidden}
.mnk-hero__media,.mnk-hero__media video,.mnk-hero__img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.mnk-hero__media video{opacity:0;transition:opacity 1.2s}
.mnk-hero__media video.is-ready{opacity:1}
.mnk-hero::after{ /* 白フィルター */
  content:"";position:absolute;inset:0;
  background:var(--mnk-bg);opacity:var(--mnk-hero-tint);
}
.mnk-hero__inner{position:relative;z-index:2;text-align:center;padding-inline:calc(var(--mnk-space)*3)}
.mnk-hero__title{
  font-size:var(--mnk-fs-hero);color:var(--mnk-heading);font-weight:600;
  letter-spacing:var(--mnk-tracking-display);text-indent:var(--mnk-tracking-display);
}
.mnk-hero__title img{margin-inline:auto;width:min(72vw,640px);height:auto;max-height:none}
.mnk-hero__paw{width:22px;height:22px;margin:calc(var(--mnk-space)*2) auto;fill:var(--mnk-accent-dp)}
.mnk-hero__catch{
  display:inline-block;color:var(--mnk-heading);letter-spacing:.15em;font-weight:500;
  margin-bottom:calc(var(--mnk-space)*4);padding:.5em 1.3em;border-radius:var(--mnk-radius);
  background:rgba(254,251,248,.72);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.mnk-hero__nav{
  display:grid;grid-template-columns:repeat(4,minmax(120px,150px));
  gap:calc(var(--mnk-space)*2);justify-content:center;
}
.mnk-hero__nav a{
  display:flex;flex-direction:column;align-items:center;gap:.6em;
  background:var(--mnk-card);border:1px solid var(--mnk-line);
  border-radius:var(--mnk-radius);padding:calc(var(--mnk-space)*3) var(--mnk-space);
  color:var(--mnk-heading);font-size:var(--mnk-fs-small);letter-spacing:.08em;
  transition:transform .2s,border-color .2s;
}
.mnk-hero__nav a:hover{transform:translateY(-3px);border-color:var(--mnk-accent-md)}
.mnk-hero__nav svg{width:32px;height:32px;stroke:var(--mnk-accent-dp);fill:none;stroke-width:1.6}
.mnk-hero__scroll{
  position:absolute;bottom:calc(var(--mnk-space)*3);left:50%;transform:translateX(-50%);z-index:2;
  width:44px;height:44px;border-radius:50%;border:1.5px solid var(--mnk-accent-md);
  display:grid;place-items:center;background:var(--mnk-card);
}
.mnk-hero__scroll svg{width:16px;height:16px;stroke:var(--mnk-accent-dp);fill:none;stroke-width:2}

/* ---------- 猫スロット ---------- */
.mnk-cat{position:absolute;pointer-events:none}
.mnk-cat img{width:100%;height:auto}
.mnk-cat--hero-l{left:4%;bottom:8%;width:clamp(90px,14vw,180px)}
.mnk-cat--hero-r{right:5%;bottom:6%;width:clamp(70px,10vw,130px)}
.mnk-cat--about{width:110px;position:static;margin:calc(var(--mnk-space)*2) auto 0}
.mnk-cat--news{width:80px;position:static;margin:calc(var(--mnk-space)*2) auto 0}
.mnk-section{position:relative}

/* 猫の行列帯 */
.mnk-parade{padding-block:calc(var(--mnk-space)*4);overflow:hidden}
.mnk-parade__row{display:flex;justify-content:center;align-items:flex-end;gap:calc(var(--mnk-space)*4)}
.mnk-parade__row img{width:clamp(48px,7vw,84px);height:auto}
.mnk-parade__line{border-top:1.5px solid var(--mnk-accent-md);max-width:720px;margin:calc(var(--mnk-space)*-1) auto 0}

/* ---------- セクション ---------- */
.mnk-staff-frame{position:relative;background:var(--mnk-card);border:1px solid var(--mnk-line);border-radius:var(--mnk-radius);padding:calc(var(--mnk-space)*3)}
.mnk-peek--top{top:0;right:9%;transform:translateY(-6%);opacity:0}
.mnk-peek--top.is-in{transform:translateY(-58%);opacity:1;transition:transform .6s cubic-bezier(.34,1.56,.64,1),opacity .3s}
@media (prefers-reduced-motion:reduce){
  .mnk-peek--top{transform:translateY(-58%);opacity:1}
}

.mnk-news{max-width:var(--mnk-text-w);margin-inline:auto}
.mnk-news li{border-bottom:1px solid var(--mnk-line)}
.mnk-news a{display:flex;gap:1.5em;padding:calc(var(--mnk-space)*2) var(--mnk-space);align-items:baseline}
.mnk-news a:hover{background:var(--mnk-card)}
.mnk-news time{font-size:var(--mnk-fs-small);color:var(--mnk-accent-dp);white-space:nowrap;font-variant-numeric:tabular-nums}

.mnk-info{text-align:center}
.mnk-info__cap{display:inline-block;font-size:clamp(.72rem,3.2vw,.95rem);letter-spacing:.1em;white-space:nowrap}
.mnk-info__cap::before{content:"|";margin:0 .6em;font-weight:400}
.mnk-info address{font-style:normal;margin-bottom:calc(var(--mnk-space)*2)}
.mnk-info__tel{font-size:1.3rem;letter-spacing:.08em;color:var(--mnk-heading)}
.mnk-map-facade{
  max-width:var(--mnk-text-w);margin:calc(var(--mnk-space)*4) auto 0;
  aspect-ratio:16/9;border:1px solid var(--mnk-line);border-radius:var(--mnk-radius);
  display:grid;place-items:center;background:var(--mnk-card);width:100%;
}
.mnk-map-facade iframe{width:100%;height:100%;border:0;border-radius:var(--mnk-radius)}

/* ---------- フッター ---------- */
.mnk-footer{border-top:1px solid var(--mnk-line);padding-block:calc(var(--mnk-space)*5);text-align:center;font-size:var(--mnk-fs-small)}
.mnk-footer__sns{display:flex;justify-content:center;gap:calc(var(--mnk-space)*3);margin-bottom:calc(var(--mnk-space)*3)}
.mnk-footer__sns a{
  width:52px;height:52px;display:grid;place-items:center;
  border:1.5px solid var(--mnk-accent-md);border-radius:50%;
  color:var(--mnk-accent-dp);transition:background .2s;
}
.mnk-footer__sns a:hover{background:var(--mnk-accent);color:var(--mnk-heading)}
.mnk-footer__sns svg{width:26px;height:26px}
.mnk-footer__nav{margin-bottom:calc(var(--mnk-space)*3)}
.mnk-footer__nav ul{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--mnk-space)*1.5) calc(var(--mnk-space)*4)}
.mnk-footer__nav a{letter-spacing:.1em;padding:.4em .2em;display:inline-block}
.mnk-footer__nav a:hover{color:var(--mnk-accent-dp)}

/* ---------- 記事・固定ページ ---------- */
/* 下層ページのヘッダーはsticky(通常フロー内)のため余白追加は不要 */
.mnk-article{position:relative;max-width:var(--mnk-text-w);margin-inline:auto;padding:var(--mnk-section-pad) calc(var(--mnk-space)*3)}
.mnk-article__title{font-size:var(--mnk-fs-h2);color:var(--mnk-heading);letter-spacing:.1em;margin-bottom:calc(var(--mnk-space)*4)}
.mnk-article__meta{font-size:var(--mnk-fs-small);color:var(--mnk-accent-dp);margin-bottom:calc(var(--mnk-space)*3)}
.entry-content>*+*{margin-top:1.4em}
.entry-content h2{font-size:1.3rem;color:var(--mnk-heading);letter-spacing:.1em;border-bottom:1.5px solid var(--mnk-accent-md);padding-bottom:.4em;margin-top:2.2em}
.entry-content h3{font-size:1.1rem;color:var(--mnk-heading);margin-top:1.8em}
.entry-content a{color:var(--mnk-accent-dp);text-decoration:underline;text-underline-offset:.2em}
.entry-content ul{padding-left:1.4em;list-style:disc}
.entry-content ol{padding-left:1.4em;list-style:decimal}
.entry-content img{border-radius:var(--mnk-radius);margin-inline:auto}
.entry-content blockquote{border-left:3px solid var(--mnk-accent);padding-left:1em;color:var(--mnk-text)}
.entry-content table{border-collapse:collapse;width:100%}
.entry-content th,.entry-content td{border:1px solid var(--mnk-line);padding:.5em .8em}
.entry-content th{background:var(--mnk-bg-warm)}

/* 一覧 */
.mnk-archive{position:relative;max-width:var(--mnk-text-w);margin-inline:auto;padding:var(--mnk-section-pad) calc(var(--mnk-space)*3)}
.mnk-archive .mnk-news{margin-top:calc(var(--mnk-space)*3)}
.mnk-pagination{display:flex;justify-content:center;gap:var(--mnk-space);margin-top:calc(var(--mnk-space)*4)}
.mnk-pagination .page-numbers{min-width:40px;min-height:40px;display:inline-grid;place-items:center;border:1px solid var(--mnk-line);border-radius:50%}
.mnk-pagination .current{background:var(--mnk-accent);border-color:var(--mnk-accent);color:var(--mnk-heading)}

/* 検索フォーム */
.mnk-search{display:flex;gap:var(--mnk-space);max-width:420px;margin-inline:auto}
.mnk-search input[type=search]{
  flex:1;min-height:44px;padding:.4em 1em;border:1px solid var(--mnk-line);
  border-radius:var(--mnk-radius-pill);background:var(--mnk-card);font:inherit;color:var(--mnk-text);
}

/* サイトマップ */
.mnk-sitemap__block{margin-top:calc(var(--mnk-space)*5)}
.mnk-sitemap__block h2{font-size:1.2rem;color:var(--mnk-heading);letter-spacing:.12em;border-bottom:1.5px solid var(--mnk-accent-md);padding-bottom:.4em;margin-bottom:.8em}
.mnk-sitemap__block ul{padding-left:.2em}
.mnk-sitemap__block li{border-bottom:1px solid var(--mnk-line)}
.mnk-sitemap__block li a{display:inline-block;padding:.5em .2em}
.mnk-sitemap__block li a:hover{color:var(--mnk-accent-dp)}
.mnk-sitemap__block li small{color:var(--mnk-accent-dp);font-size:var(--mnk-fs-small);margin-left:.5em}
.mnk-sitemap__block .children{padding-left:1.2em}
.mnk-sitemap__block .children li:last-child{border-bottom:none}

/* ウィジェット(最小) */
.mnk-widgets{max-width:var(--mnk-text-w);margin-inline:auto;padding:0 calc(var(--mnk-space)*3) var(--mnk-section-pad)}
.mnk-widgets .widget+.widget{margin-top:calc(var(--mnk-space)*4)}
.mnk-widgets .widget-title{font-size:1rem;color:var(--mnk-heading);letter-spacing:.15em;border-bottom:1px solid var(--mnk-line);padding-bottom:.4em;margin-bottom:.8em}

/* ---------- 猫の顔・覗き演出 ---------- */
/* スロットはJSがセクション境界に自動生成。正面顔1枚を回転・クリップで
   「右から」「左から」「下から」に見せる。素材は顔画像のみでよい。 */
.mnk-peek{
  position:absolute;z-index:3;pointer-events:none;
  width:clamp(56px,7vw,88px);
}
.mnk-peek img{width:100%;height:auto}
.mnk-peek--right{right:0;transform:translateX(100%) rotate(-14deg)}
.mnk-peek--left{left:0;transform:translateX(-100%) rotate(14deg)}
.mnk-peek--bottom{left:50%;bottom:0;transform:translate(-50%,100%)}
.mnk-peek.is-in{transition:transform .6s cubic-bezier(.34,1.56,.64,1)}
.mnk-peek--right.is-in{transform:translateX(34%) rotate(-14deg)}
.mnk-peek--left.is-in{transform:translateX(-34%) rotate(14deg)}
.mnk-peek--bottom.is-in{transform:translate(-50%,42%)}
@media (prefers-reduced-motion:reduce){
  .mnk-peek--right{transform:translateX(34%) rotate(-14deg)}
  .mnk-peek--left{transform:translateX(-34%) rotate(14deg)}
  .mnk-peek--bottom{transform:translate(-50%,42%)}
}
@media (max-width:767.98px){

}

/* ---------- にゃーにゃーの日(毎月22日・自動) ---------- */
.mnk-nyanday .mnk-hero__paw{animation:mnk-paw 2.4s ease-in-out infinite}
@keyframes mnk-paw{
  0%,100%{transform:rotate(0)}
  10%{transform:rotate(-14deg)}
  20%{transform:rotate(12deg)}
  30%{transform:rotate(0)}
}
.mnk-nyanday .mnk-parade__row img{animation:mnk-march 3s ease-in-out infinite}
.mnk-nyanday .mnk-parade__row img:nth-child(2n){animation-delay:.4s}
.mnk-nyanday .mnk-parade__row img:nth-child(3n){animation-delay:.8s}
@keyframes mnk-march{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
@media (prefers-reduced-motion:reduce){
  .mnk-nyanday .mnk-hero__paw,.mnk-nyanday .mnk-parade__row img{animation:none}
}

/* ---------- タブレット(768〜1199px)だけ大きめに ---------- */
@media (min-width:768px) and (max-width:1199.98px){
  .mnk-hero__nav{grid-template-columns:repeat(4,minmax(150px,200px));gap:calc(var(--mnk-space)*2.5)}
  .mnk-hero__nav a{padding:calc(var(--mnk-space)*4) var(--mnk-space);font-size:1rem;gap:.8em}
  .mnk-hero__nav svg{width:42px;height:42px}
  .mnk-cat--hero-l{width:clamp(150px,20vw,230px)}
  .mnk-cat--hero-r{width:clamp(110px,14vw,170px)}
  .mnk-cat--about{width:140px}
  .mnk-cat--news{width:100px}
  .mnk-peek{width:clamp(72px,9vw,110px)}
}

/* ---------- 下部固定ナビ: スマホ+タブレット(〜1149px) ---------- */
@media (max-width:1149.98px){
  body{padding-bottom:64px} /* 下部ナビ分 */
  .mnk-bottom-nav{
    position:fixed;inset-inline:0;bottom:0;z-index:100;
    display:grid;grid-template-columns:repeat(5,1fr);
    background:var(--mnk-card);border-top:1px solid var(--mnk-line);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .mnk-bottom-nav a{
    display:flex;flex-direction:column;align-items:center;gap:2px;
    padding:8px 2px;font-size:.65rem;color:var(--mnk-heading);min-height:56px;justify-content:center;
  }
  .mnk-bottom-nav svg{width:22px;height:22px;stroke:var(--mnk-accent-dp);fill:none;stroke-width:1.6}
  .mnk-bottom-nav a.is-accent{background:var(--mnk-accent)}
}

/* ---------- タブレット(768〜1149px): ヒーロー要素を拡大 ---------- */
@media (min-width:768px) and (max-width:1149.98px){
  .mnk-hero__title img{width:min(82vw,720px)}
  .mnk-hero__nav{display:none}
  .mnk-cat--hero-l{width:clamp(180px,23vw,300px)}
  .mnk-cat--hero-r{width:clamp(140px,17vw,230px)}
  .mnk-cat--about{width:190px}
  .mnk-cat--news{width:140px}
  .mnk-peek{width:clamp(90px,11vw,140px)}
  .mnk-parade__row img{width:clamp(76px,10vw,128px)}
}

/* ---------- スマホ ---------- */
@media (max-width:767.98px){
  .mnk-logo__cap{display:none}
  /* 店舗情報の見出し: スマホではキャプションを2行目に固定し「|」は出さない */
  .mnk-info__cap{display:block;margin-top:2px}
  .mnk-info__cap::before{content:none}
  .mnk-header .mnk-btn--tel,.mnk-header .mnk-btn--fill{padding:.3em;width:40px;justify-content:center;flex-shrink:0}
  .mnk-header .mnk-btn--tel .mnk-btn__label,.mnk-header .mnk-btn--fill .mnk-btn__label{display:none}
  .mnk-header__inner{gap:calc(var(--mnk-space)*1.5)}
  .mnk-menu-toggle{display:block}
  .mnk-header{background:var(--mnk-bg);border-color:var(--mnk-line)}
  /* 4ボタン廃止に伴い、ヒーローの猫を主役サイズで復帰 */
  .mnk-cat--hero-l{width:clamp(110px,28vw,170px);left:4%;bottom:9%;z-index:2}
  .mnk-cat--hero-r{display:block;width:clamp(85px,22vw,130px);right:5%;bottom:7%;z-index:2}
  .mnk-peek{width:64px}
  /* ヒーロー: スマホ最適化 */
  .mnk-hero{height:auto;min-height:100svh}
  .mnk-hero__inner{padding-top:80px;padding-bottom:72px}
  .mnk-hero__title{font-size:1.9rem}
  .mnk-hero__title img{width:min(86vw,420px);max-height:none}
  .mnk-hero__catch{font-size:.85rem;letter-spacing:.06em;margin-bottom:calc(var(--mnk-space)*3)}
  /* ヒーロー4ボタンはスマホでは非表示(下部ナビと重複するため) */
  .mnk-hero__nav{display:none}
  .mnk-hero__scroll{bottom:calc(var(--mnk-space)*2);width:38px;height:38px}
}
@media (min-width:1150px){
  .mnk-bottom-nav{display:none}
}
