/* contact-faq-gallery.css — サブページ・ヒーロー（contact / faq / gallery）
   pages/*.css の完全一致ルールを抽出（保有ページの集合が同一のものだけ）。
   読込順は inc/assets.php が固定する。 */

:root {
            --slate: #2e3a3e; --slate-soft: rgba(46,58,62,.66); --paper: #f7f4f0; --cream: #f6f1ee;
            --gold: #c19a5e; --gold-pastel: #e3bf8d; --vermilion: #b08a57; --sumi: #2e3a3e;
            --kinari: #2e3a3e; --ink: #2e3a3e; --line: rgba(46,58,62,.14);
            --nav-height: 78px; --padding-container: 20px;
        }
body {
            background-color: var(--paper); color: var(--slate); overflow-x: hidden;
            font-family: "Lato", "Noto Serif JP", sans-serif; font-weight: 400; -webkit-font-smoothing: antialiased;
        }
.kv-mark { border-radius: 9999px !important; display: inline-block; width: .5rem; height: .5rem; background: var(--gold-pastel); }
.h1 { font-family: "Vollkorn", serif; font-weight: 500; line-height: 1.04; letter-spacing: .005em; color: var(--slate); font-size: clamp(2.6rem, 6vw + .2rem, 7rem); }
.h2 { font-family: "Vollkorn", serif; font-weight: 600; line-height: 1.08; letter-spacing: .005em; color: var(--slate); font-size: clamp(2rem, 3.6vw + 1rem, 4rem); }
.h3-row { font-family: "Vollkorn", serif; font-weight: 600; line-height: 1.1; color: var(--slate); font-size: clamp(2rem, 3vw + 1rem, 3.5rem); }
.kicker { font-family: "Lato", sans-serif; font-size: 11px; letter-spacing: .28em; font-weight: 700; color: var(--gold); text-transform: uppercase; }
.kv-kicker { font-family: "Lato", sans-serif; font-size: 10px; letter-spacing: 0.3em; font-weight: 700; color: var(--paper); opacity: .8; text-transform: uppercase; }
.navbtn { display: flex; align-items: center; gap: 12px; background: none; border: 0; color: inherit; cursor: pointer; font-family: "Lato", sans-serif; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; padding: 8px 0; min-height: 44px;   /* タップ領域の確保 */ }
.menu__panel { position: absolute; top: 0; right: 0; height: 100%; width: min(460px, 90vw); background: var(--ink); color: var(--cream); transform: translateX(100%); transition: transform .6s cubic-bezier(.7,0,.2,1); padding: calc(var(--nav-height) + 20px) var(--padding-container) 40px; display: flex; flex-direction: column; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.menu__close { position: absolute; top: 12px; right: calc(var(--padding-container) - 14px); background: none; border: 0; color: var(--cream); cursor: pointer; font-family: "Lato", sans-serif; letter-spacing: .28em; font-size: 12px; text-transform: uppercase;
            /* タップ領域を 44px 以上確保する（文字サイズは変えない） */
            padding: 14px; min-height: 44px; display: inline-flex; align-items: center; }
.menu__kick { font-family: "Lato", sans-serif; letter-spacing: .36em; font-size: 11px; color: var(--gold-pastel); text-transform: uppercase; margin-bottom: 22px; }
.menu__nav a { display: flex; align-items: baseline; gap: 16px; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.1); font-family: "Vollkorn", serif; font-size: 24px; font-weight: 600; transition: color .3s, padding-left .3s; }
.menu__cta a { font-family: "Lato", sans-serif; letter-spacing: .2em; font-size: 12px; text-transform: uppercase; border: 1px solid rgba(255,255,255,.4); padding: 14px 26px; transition: background .3s, color .3s; }
.site-header.is-scrolled { background: rgba(247,244,240,.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 1px 0 rgba(46,58,62,.10); }
.site-footer { transform: translateY(110%); opacity: 0; pointer-events: none; transition: transform .35s ease, opacity .35s ease; }
.subhero { position: relative; width: 100%; min-height: clamp(440px, 72vh, 680px); display: flex; align-items: center; justify-content: center; overflow: hidden; background: #e7e3dc; padding-top: var(--nav-height); }
.subhero__bg { position: absolute; inset: 0; z-index: 0; }
.subhero__bg img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); }
.subhero__grade { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(120% 90% at 50% 46%, rgba(30,40,44,.28) 0%, rgba(30,40,44,.42) 62%, rgba(30,40,44,.2) 100%), linear-gradient(0deg, rgba(30,40,44,.55) 0%, rgba(30,40,44,.12) 34%, rgba(30,40,44,0) 60%, rgba(30,40,44,.32) 100%); }
.subhero__in { position: relative; z-index: 2; text-align: center; width: min(92vw, 60rem); padding: 0 var(--padding-container); }
.subhero .kicker { color: var(--gold-pastel); }
.subhero__title { font-family: "Vollkorn", serif; font-weight: 500; color: #fff; line-height: 1.05; letter-spacing: .01em; font-size: clamp(2.6rem, 6vw, 5.2rem); text-shadow: 0 2px 28px rgba(20,26,30,.4); }
.subhero__lead { margin: clamp(1.4rem,3vw,2rem) auto 0; max-width: 44ch; font-family: "Lato", sans-serif; font-weight: 300; font-size: clamp(.85rem,1.05vw,1rem); line-height: 2; color: rgba(255,255,255,.9); text-shadow: 0 1px 14px rgba(20,26,30,.4); }
.subhero__title { text-wrap: balance; }
.subhero__in > * { opacity: 0; transform: translateY(16px); animation: heroIn .9s cubic-bezier(.2,.7,.2,1) forwards; }
.subhero__in > *:nth-child(1) { animation-delay: .12s; }
.subhero__in > *:nth-child(2) { animation-delay: .26s; }
.subhero__in > *:nth-child(3) { animation-delay: .4s; }
@keyframes heroIn { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .subhero__in > * { animation: none; opacity: 1; transform: none; } }