/*
Theme Name: cafe ROCHE
Theme URI: https://caferoche.example/
Description: 自家焙煎珈琲工房 ロッシュ のオリジナルテーマ（北九州市小倉のカフェ・喫茶店）。
Author: cafe ROCHE
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: caferoche
*/

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { overflow-x: hidden; }
body { background: #FBF7F1; }
::selection { background: #A9501E; color: #fff; }
.rc-page { font-family: 'Zen Kaku Gothic New', sans-serif; color: #40301F; background: #FBF7F1; -webkit-font-smoothing: antialiased; }
body.rc-noscroll { overflow: hidden; }
a { color: #A9501E; }
a:hover { color: #7d3a15; }
.rc-burger { position: fixed; top: 24px; right: 30px; z-index: 70; width: 58px; height: 58px; border-radius: 50%; border: none; background: #76481e; color: #F3E9D9; box-shadow: 0 12px 32px -8px rgba(0,0,0,0.5); cursor: pointer; display: flex; align-items: center; justify-content: center; transform: translateY(-130%); opacity: 0; pointer-events: none; transition: transform 0.45s cubic-bezier(0.22,1,0.36,1), opacity 0.4s ease, background 0.2s ease; }
.rc-burger.show { transform: translateY(0); opacity: 1; pointer-events: auto; }
.rc-burger.menu-open { background: #A9501E; }
.rc-overlay { position: fixed; inset: 0; z-index: 65; background: rgba(58,34,22,0.97); backdrop-filter: blur(4px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.4s ease, visibility 0.4s ease; }
.rc-overlay.open { opacity: 1; visibility: visible; pointer-events: auto; }
.rc-overlay-brand { position: absolute; top: 40px; left: 50%; transform: translateX(-50%); text-align: center; }
.rc-overlay-nav { display: flex; flex-direction: column; align-items: center; gap: 2px; font-family: 'Zen Old Mincho', serif; }
.rc-overlay-nav a { text-decoration: none; color: #F3E9D9; font-size: 18px; letter-spacing: 0.14em; padding: 10px 40px; }
.rc-overlay-social { display: flex; align-items: center; gap: 22px; margin-top: 34px; }
/* Contact Form 7 */
.rc-cf7 form.wpcf7-form { display: block; }
.rc-cf7 p { margin: 0 0 18px; }
.rc-cf7 label { display: block; font-size: 13.5px; color: #40301F; margin-bottom: 8px; }
.rc-cf7 input.wpcf7-form-control:not([type=submit]), .rc-cf7 textarea.wpcf7-form-control, .rc-cf7 select.wpcf7-form-control { width: 100%; font-family: inherit; font-size: 15px; color: #40301F; background: #FCFAF6; border: 1px solid #E0D4BF; border-radius: 4px; padding: 13px 15px; box-sizing: border-box; }
.rc-cf7 input.wpcf7-form-control:focus, .rc-cf7 textarea.wpcf7-form-control:focus { outline: none; border-color: #A9501E; box-shadow: 0 0 0 3px rgba(169,80,30,0.12); }
.rc-cf7 .wpcf7-submit { font-family: 'Zen Kaku Gothic New', sans-serif; background: #A9501E; color: #fff; font-size: 15px; letter-spacing: 0.1em; border: none; border-radius: 999px; padding: 15px 60px; cursor: pointer; margin-top: 6px; }
/* article + pagination */
.rc-article h2 { font-family: 'Zen Old Mincho', serif; font-size: 20px; font-weight: 600; margin: 34px 0 14px; color: #40301F; }
.rc-article h3 { font-family: 'Zen Old Mincho', serif; font-size: 17px; font-weight: 600; margin: 28px 0 12px; color: #40301F; }
.rc-article p { margin: 0 0 20px; }
.rc-article img { max-width: 100%; height: auto; border-radius: 4px; }
.page-numbers { min-width: 38px; height: 38px; padding: 0 6px; border-radius: 999px; border: 1px solid #C9B49A; color: #6B5844; display: inline-flex; align-items: center; justify-content: center; font-family: 'Cormorant Garamond', serif; font-size: 15px; text-decoration: none; }
.page-numbers.current { background: #40301F; color: #F3E9D9; border-color: #40301F; }
a.page-numbers:hover { background: #F4E9D8; }


/* ============ home ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  @media (max-width: 600px) { .rc-pbr { display: none; } .rc-mleft { text-align: left !important; } section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; } }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  @media (max-width: 600px) { .rc-mleft { text-align: left !important; } }
  .rc-mimg { display: block; transition: transform 0.7s cubic-bezier(0.22,1,0.36,1); }
  a:hover .rc-mimg { transform: scale(1.06); }
  .rc-mveil { position: absolute; inset: 0; background: #FBF7F1; opacity: 0; transition: opacity 0.5s ease; pointer-events: none; }
  a:hover .rc-mveil { opacity: 0.14; }
  .rc-marrow { transition: background 0.35s ease, border-color 0.35s ease, color 0.35s ease; }
  a:hover .rc-marrow { background: #A9501E; border-color: #A9501E; }
  a:hover .rc-marrow span { color: #fff; }
  @keyframes rocheFade { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-access-deco { top: 0 !important; bottom: auto !important; height: auto !important; width: 70% !important; }
    .rc-kodawari-deco { top: 0 !important; bottom: auto !important; height: auto !important; width: 70% !important; }
    .rc-beans-text { padding: 64px 24px !important; }
    #beans > .rc-beans { padding-left: 0 !important; padding-right: 0 !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid3, .rc-grid2, .rc-beans, .rc-grid-footer { grid-template-columns: 1fr !important; }
    .rc-grid4 { grid-template-columns: repeat(2, 1fr) !important; }
    .rc-grid-footer { gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-hero { height: 600px !important; }
    .rc-ghost { font-size: 60px !important; }
    .rc-news { padding: 34px 22px 36px !important; }
    .rc-news-item { flex-wrap: wrap !important; row-gap: 9px !important; font-size: 13px !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-lead { font-size: 23px !important; }
    .rc-news-text { flex: 1 0 100% !important; }
    .rc-collage { width: 100% !important; min-height: 0 !important; padding: 16px 22px 44px !important; }
    .rc-collage > img, .rc-collage > image-slot { position: static !important; width: 100% !important; height: auto !important; aspect-ratio: 3 / 2; margin: 0 0 16px !important; transform: none !important; display: block !important; }
    .rc-collage-text { position: static !important; width: 100% !important; }
    .rc-pad { padding-left: 24px !important; padding-right: 24px !important; }
  }

/* ============ kodawari ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  @media (max-width: 600px) { .rc-pbr { display: none; } .rc-mleft { text-align: left !important; } section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; } }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid-footer { grid-template-columns: 1fr !important; gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-ghost { font-size: 60px !important; margin-top: 2px !important; }
    .rc-collage { width: 100% !important; min-height: 0 !important; padding: 16px 0 44px !important; }
    .rc-collage > img, .rc-collage > image-slot { position: static !important; height: auto !important; aspect-ratio: 3 / 2; margin: 0 0 16px !important; transform: none !important; display: block !important; }
    .rc-collage > :nth-child(1) { width: 90% !important; margin-left: 0 !important; margin-right: auto !important; margin-top: 30px !important; }
    .rc-collage > :nth-child(2) { width: 75% !important; margin-left: auto !important; margin-right: 0 !important; margin-bottom: 30px !important; }
    .rc-collage > image-slot { position: relative !important; inset: auto !important; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; aspect-ratio: auto !important; overflow: hidden !important; }
    .rc-collage > image-slot:nth-child(1) { height: 60vw !important; }
    .rc-collage > image-slot:nth-child(2) { height: 50vw !important; }
    .rc-collage-text { position: static !important; width: 100% !important; padding: 0 24px !important; margin-top: 0 !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-page .rc-lead { font-size: 23px !important; }
    .rc-sech { font-size: 18px !important; }
    .rc-blend-name { font-size: 14px !important; white-space: nowrap !important; flex-shrink: 0 !important; }
    .rc-blend-desc { font-size: 11px !important; white-space: nowrap !important; }
  }

/* ============ menu ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  @media (max-width: 600px) { .rc-pbr { display: none; } }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  .rc-cake-cap { font-family: 'Zen Old Mincho', serif; font-size: 12.5px; color: #40301F; text-align: center; margin-top: 10px; letter-spacing: 0.04em; }
  @media (max-width: 600px) {
    .rc-cakes { display: flex !important; grid-template-columns: none !important; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; gap: 14px !important; padding-bottom: 10px; scrollbar-width: none; }
    .rc-cakes::-webkit-scrollbar { display: none; }
    .rc-cakes > figure { flex: 0 0 74% !important; scroll-snap-align: center; }
    .rc-mleft { text-align: left !important; }
    section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; }
    .rc-cold-imgs img, .rc-cake2x2 img { height: auto !important; aspect-ratio: 1 / 1 !important; }
    [style*="padding: 5px 15px"] { font-size: 12px !important; padding: 4px 12px !important; }
  }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid-footer { grid-template-columns: 1fr !important; gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-ghost { font-size: 60px !important; margin-top: 2px !important; }
    .rc-menu-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-mname { font-size: 16px !important; }
    .rc-mdesc { font-size: 12px !important; }
    .rc-price { font-size: 17px !important; }
  }

/* ============ beans ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  @media (max-width: 600px) { .rc-pbr { display: none; } .rc-mleft { text-align: left !important; } section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; } [style*="padding: 5px 15px"] { font-size: 12px !important; padding: 4px 12px !important; } }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid-footer { grid-template-columns: 1fr !important; gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-ghost { font-size: 60px !important; margin-top: 2px !important; }
    .rc-taste { grid-template-columns: 1fr !important; }
    .rc-gift { flex-direction: column-reverse !important; }
    .rc-gift-img { flex: 0 0 auto !important; width: 100% !important; }
    .rc-taste-icon { display: none !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-mname { font-size: 15.5px !important; }
    .rc-mdesc { font-size: 12px !important; }
    .rc-price { font-size: 17px !important; }
  }

/* ============ access ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  @media (max-width: 600px) { .rc-mleft { text-align: left !important; } section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; } }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid-footer { grid-template-columns: 1fr !important; gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-ghost { font-size: 60px !important; margin-top: 2px !important; }
    .rc-info2 { grid-template-columns: 1fr !important; }
    .rc-access3 { grid-template-columns: 1fr !important; }
    .rc-gallery { display: flex !important; grid-template-columns: none !important; column-count: unset !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; gap: 12px !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; padding-bottom: 6px !important; }
    .rc-gallery::-webkit-scrollbar { display: none !important; }
    .rc-gcol { display: contents !important; }
    .rc-gitem { grid-column: auto !important; margin: 0 !important; flex: 0 0 82% !important; scroll-snap-align: center !important; }
    .rc-gitem img { height: 300px !important; }
    .rc-gnav { display: flex !important; }
    .rc-gdots { display: flex !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-lead { font-size: 23px !important; }
  }

/* ============ news ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  @media (max-width: 600px) { section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; } }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid-footer { grid-template-columns: 1fr !important; gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-ghost { font-size: 60px !important; margin-top: 2px !important; }
    .rc-news-row { flex-wrap: wrap !important; row-gap: 10px !important; }
    .rc-news-title { flex: 1 0 100% !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-lead { font-size: 23px !important; }
  }

/* ============ contact ============ */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  html { overflow-x: hidden; }
  body { background: #FBF7F1; }
  ::selection { background: #A9501E; color: #fff; }
  .rc-arw { display: inline-block; transition: transform 0.25s ease; }
  a:hover .rc-arw { transform: translateX(4px); }
  @media (max-width: 600px) { .rc-mleft { text-align: left !important; } section > div[style*="max-width"] { padding-left: 24px !important; padding-right: 24px !important; } .rc-callbox { flex-direction: column !important; gap: 6px !important; border-radius: 20px !important; padding: 16px 26px !important; text-align: center !important; } .rc-form { padding-left: 15px !important; padding-right: 15px !important; } }
  .rc-input { width: 100%; font-family: 'Zen Kaku Gothic New', sans-serif; font-size: 14.5px; color: #40301F; background: #FFFFFF; border: 1px solid #DCC9AC; border-radius: 4px; padding: 13px 15px; }
  .rc-input:focus { outline: none; border-color: #A9501E; box-shadow: 0 0 0 3px rgba(169,80,30,0.12); }
  .rc-input::placeholder { color: #B7A88F; }
  @media (max-width: 960px) {
    .rc-topnav { display: none !important; }
    .rc-burger { transform: translateY(0) !important; opacity: 1 !important; pointer-events: auto !important; }
    .rc-grid-footer { grid-template-columns: 1fr !important; gap: 36px !important; }
    .rc-label { width: 150px !important; left: 16px !important; padding: 18px 12px 20px !important; }
    .rc-label img { width: 120px !important; height: 120px !important; margin-top: 10px !important; }
    .rc-ghost { font-size: 60px !important; margin-top: 2px !important; }
    .rc-form2 { grid-template-columns: 1fr !important; }
    .rc-page p, .rc-page td, .rc-page li { font-size: 13px !important; }
    .rc-lead { font-size: 23px !important; }
  }

/* mobile: news date 35% / category 65%, left aligned */
@media (max-width: 600px) {
  .rc-news-row { gap: 10px 0 !important; }
  .rc-news-item { gap: 10px 0 !important; }
  .rc-news-row > span:first-child, .rc-news-item > span:first-child { width: 30% !important; text-align: left !important; }
}

/* CF7 two-column layout (paste-in form) */
.rc-cf7 .rc-form2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.rc-cf7 .rc-form2 > p { margin: 0; }
@media (max-width: 600px) { .rc-cf7 .rc-form2 { grid-template-columns: 1fr; } }

@media (max-width: 600px) { .rc-ig-grid { max-width: 380px !important; } }

.rc-ig-tile img { transition: transform 0.5s cubic-bezier(0.22,1,0.36,1); }
.rc-ig-tile:hover img { transform: scale(1.06); }