/* style_a.css — A「上質な催事」＝エディトリアル × ハンドクラフト（04_仕様_A.md）
   茜は予約の動線だけ（ボタン・②の価格・①の日付・⑥の特典番号）。見出し上の文様は藍。 */
:root{
  --page:#E6DDCD; --ground:#F4EDE1; --paper:#FBF8F2; --deep:#2B2320;
  --ink:#2A2420; --ink-2:#5E5249; --on-deep:#F4EDE1; --on-deep-2:#CDBFAA;
  --madder:#9E2F1E; --madder-d:#7E2416; --indigo:#27425F; --line:#8E7C66; --line-soft:#C9BBA5; --ochre:#B07A2A;
  --f-head:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
  --f-body:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;
  --f-num:"Cormorant Garamond","Times New Roman",serif;
  --tbc-fg:#5E5249; --tbc-bg:#FBF8F2; --tbc-line:#8E7C66;
  --note-bg:#FBF8F2; --note-bar:2px solid #8E7C66;
  --care-collapse:0; --link:#27425F;
}
.vb{display:none!important}
.lp{background:var(--ground) url(parts/p03_wool.svg) repeat 0 0/240px 240px}
.border-band{display:block;height:8px;background:url(parts/p01_border_a_thin.svg) repeat-x 0 0/24px 8px}
.border-band.thick{height:16px;background-image:url(parts/p01_border_a_thick.svg);background-size:48px 16px}

/* 見出しの段 */
h1,h2,h3{font-family:var(--f-head);font-weight:700;color:var(--ink)}
h2{font-size:28px;line-height:1.45;letter-spacing:.04em}
h3{font-size:21px;line-height:1.5;font-weight:600;letter-spacing:.03em}
.eyebrow{display:flex;align-items:center;gap:10px;font-family:var(--f-num);font-style:italic;font-weight:500;font-size:16px;line-height:1.4;letter-spacing:.12em;color:var(--ink-2);margin-bottom:8px}
.eyebrow::before{content:"";width:12px;height:12px;flex:none;background:url(parts/p02_motif_indigo.svg) no-repeat 0 0/12px 12px}
.sec-lead{font-size:19px;line-height:1.8;margin-top:18px}
.sec{--pad-t:48px;--pad-b:56px}
.s-perk,.s-care,.s-gift,.s-info{--pad-t:64px;--pad-b:64px}

/* ボタン（P08） */
.btn{background:var(--madder);color:var(--paper);border-radius:4px;box-shadow:inset 0 -3px 0 var(--madder-d);font-family:var(--f-body);padding:0 44px 3px}
.btn::after{content:"";position:absolute;right:18px;top:50%;width:18px;height:12px;margin-top:-7px;background:url(parts/arrow_a.svg) no-repeat center/18px 12px}
.btn:active{box-shadow:inset 0 -1px 0 var(--madder-d)}
.cta-label{color:var(--ink)}
.cta-label::before{content:"";display:inline-block;width:8px;height:8px;margin:0 8px 2px 0;background:url(parts/p02_motif_line.svg) no-repeat 0 0/8px 8px}

/* ① 最初の画面：写真の面／生成りの面の2段（A1） */
.s-hero{padding:0}
.hero-photo img{width:100%;height:226px;object-fit:cover;object-position:50% 92%}
.hero-body{padding:12px 20px 0}
.kicker{font-size:16px;font-weight:700;letter-spacing:.1em;line-height:24px;color:var(--ink)}
.s-hero h1{margin-top:2px}
.maker{display:block;font-size:17px;font-weight:600;line-height:24px;letter-spacing:.08em;color:var(--ink)}
.host-line{position:absolute;right:20px;margin-top:2px;font-size:16px;font-weight:700;line-height:24px;color:var(--ink-2)}
.event{display:block;margin-top:4px;font-size:35px;line-height:1.24;font-weight:800;letter-spacing:.06em}
.when{margin-top:10px}
.when>div{display:flex;align-items:baseline;gap:12px}
.when dt{font-size:16px;font-weight:700;color:var(--ink-2);flex:none;width:2.4em;line-height:1.6}
.w-date dd{font-family:var(--f-num);font-weight:600;font-variant-numeric:lining-nums;color:var(--madder);line-height:40px}
.w-date .dn{font-size:32px;letter-spacing:.02em}
.w-date .dw{font-family:var(--f-body);font-size:16px;font-weight:700;color:var(--ink)}
.w-date .dd{font-size:24px;margin:0 6px;color:var(--ink-2)}
.w-venue dd{font-size:16px;font-weight:700;line-height:1.6}
.hero-perk{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:baseline;column-gap:10px;line-height:1.5}
.hp-lab{font-size:16px;font-weight:700;color:var(--ink-2)}
.hp-main{font-size:16px;font-weight:700}
.hp-was{font-family:var(--f-num);font-size:21px;font-weight:600;margin-left:6px;font-variant-numeric:lining-nums}
.hp-now{font-family:var(--f-num);font-size:27px;font-weight:600;color:var(--madder);font-variant-numeric:lining-nums;margin-left:2px}
.s-hero .cta{margin-top:8px}
.s-hero .cta-label{margin-bottom:8px}

/* ② 予約特典：額装の札（P04） */
.perk-card{position:relative;margin-top:28px;padding:30px 24px 26px;background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column}
.perk-card::before{content:"";position:absolute;inset:6px;border:1px solid rgba(142,124,102,.55);pointer-events:none}
.perk-card::after{content:"";position:absolute;inset:3px;pointer-events:none;background:
  url(parts/p02_motif_line.svg) no-repeat 0 0/8px 8px, url(parts/p02_motif_line.svg) no-repeat 100% 0/8px 8px,
  url(parts/p02_motif_line.svg) no-repeat 0 100%/8px 8px, url(parts/p02_motif_line.svg) no-repeat 100% 100%/8px 8px}
.pc-visual{display:contents}
.pc-img{order:1;width:100%;aspect-ratio:1/1;object-fit:cover}
.pc-cap{order:6;margin-top:14px;font-size:16px;line-height:1.6;color:var(--ink-2)}
.pc-name{order:3;margin-top:22px;font-family:var(--f-head);font-weight:600;font-size:23px;letter-spacing:.06em;text-align:center}
.pc-price{order:4;margin-top:4px;display:flex;align-items:baseline;justify-content:center;gap:6px;font-variant-numeric:lining-nums}
.pc-was{font-family:var(--f-num);font-size:26px;font-weight:600;color:var(--ink);font-variant-numeric:lining-nums}
.pc-wo{font-size:17px;font-weight:700}
.pc-now{font-family:var(--f-num);font-size:52px;line-height:1.1;font-weight:600;color:var(--madder)}
.pc-terms{order:5;margin-top:14px;display:flex;justify-content:center;border-top:1px solid var(--line);padding-top:14px}
.pc-terms li{font-size:16px;font-weight:700;padding:0 14px}
.pc-terms li+li{border-left:1px solid var(--line)}

/* ③ 全幅写真＋数字3つ（罫で区切る） */
.about-photo{margin:28px -20px 0}
.about-photo img{width:100%;height:300px;object-fit:cover}
.about-h3{margin-top:40px;font-size:24px}
.s-about .lead{margin-top:16px;font-size:19px;line-height:1.85}
.facts{margin-top:32px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts li{padding:18px 4px 16px;text-align:center}
.facts li+li{border-left:1px solid var(--line)}
.facts b{display:block;font-size:16px;font-weight:700;line-height:1}
.facts .fn{font-family:var(--f-num);font-weight:600;font-size:38px;font-variant-numeric:lining-nums;margin-right:2px;color:var(--indigo)}
.facts .fn.fn-w{font-size:31px}
.facts .fl{display:block;margin-top:10px;font-size:16px;line-height:1.4;color:var(--ink-2)}
.facts-note{margin-top:10px;font-size:16px;color:var(--ink-2)}

/* ④ 工程の帯：番号＋写真を左右にずらす */
.chap{margin:52px 0 6px;font-size:22px}
.chap-e{display:block;font-family:var(--f-num);font-style:italic;font-weight:500;font-size:16px;letter-spacing:.14em;color:var(--ink-2);margin-bottom:2px}
.s-care .border-band.thick{margin:56px -20px 0}
.care{margin-top:40px}
.care figure{width:94%;margin-left:-20px}
.care-grid .care:nth-child(even) figure{margin-left:auto;margin-right:-20px}
.care-grid~.care-grid .care:nth-child(odd) figure{margin-left:auto;margin-right:-20px}
.care-grid~.care-grid .care:nth-child(even) figure{margin-left:-20px;margin-right:0}
.care figure img{width:100%;aspect-ratio:3/2;object-fit:cover}
.care-b{position:relative;padding-top:14px}
.care .no{font-family:var(--f-num);font-weight:600;font-size:30px;line-height:1;color:var(--indigo);font-variant-numeric:lining-nums;letter-spacing:.04em}
.care h3{margin-top:6px;font-size:22px}
.care-lead{margin-top:8px;font-size:17px;line-height:1.75}
.care-sub{margin-top:10px;font-size:16px;color:var(--ink-2)}
.more{margin-top:14px;padding:14px 16px 12px;background:var(--paper);border-left:2px solid var(--line)}
.more summary{pointer-events:none;font-size:16px;font-weight:700;color:var(--ink-2);line-height:1.6}
.more ul{margin-top:6px}
.more li{position:relative;padding-left:18px;font-size:16px;line-height:1.7}
.more li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;background:url(parts/p02_motif_line.svg) no-repeat 0 0/8px 8px}

/* ⑤ 1大2小のモザイク（明るい紙の地） */
.s-var{background:var(--paper)}
.var{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.var .v-l{grid-column:1/-1}
.var img{width:100%;aspect-ratio:1/1;object-fit:cover}
.var .v-l img{aspect-ratio:5/4}
.var-note{margin-top:12px;font-size:16px;color:var(--ink-2)}

/* ⑥ 3つの束で型を変える */
.gift-head{display:flex;align-items:center;justify-content:space-between}
.gift-group{margin-top:36px}
.g-h{display:flex;align-items:baseline;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line);font-size:21px}
.g-h-n{display:none}
.g-no{display:inline-flex;align-items:baseline;gap:3px;white-space:nowrap}
.g-no-l{font-size:16px;font-weight:700;color:var(--ink-2)}
.g-no-n{font-family:var(--f-num);font-weight:600;font-size:30px;line-height:1;color:var(--madder);font-variant-numeric:lining-nums}
/* 束1＝札を縦に2枚（番号を左の柱に） */
.g1 .gifts{display:grid;gap:10px;margin-top:16px}
.g1 li{background:var(--paper);border:1px solid var(--line);padding:16px 16px 16px 0;display:grid;grid-template-columns:76px 1fr;align-items:center}
.g1 .g-no{flex-direction:column;align-items:center;gap:2px;border-right:1px solid var(--line);padding:2px 0}
.g1 .g-txt{padding-left:16px;font-size:17px;font-weight:700;line-height:1.6}
.g-off{font-family:var(--f-num);font-weight:600;font-variant-numeric:lining-nums;line-height:1;white-space:nowrap}
.g-off .off-n{font-size:40px}.g-off .off-t{font-family:var(--f-body);font-size:20px;margin:0 3px}.g-off .off-u{font-size:22px;margin-left:3px}
/* 束2＝金額を左・特典を右の表 */
.amt li{display:grid;grid-template-columns:112px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.amt .g-no{grid-column:1;grid-row:1}
.amt .g-cond{grid-column:1;grid-row:2;margin-top:4px}
.amt .g-txt{grid-column:2;grid-row:1/3;font-size:17px;line-height:1.6;padding-left:14px;border-left:1px solid var(--line)}
.amt .g-pic{grid-column:1/-1;grid-row:3;width:100%;aspect-ratio:16/10;margin-top:14px}
.g-off-note{color:var(--ink)}
.g-cond{font-size:16px;font-weight:700;line-height:1.4}
.g-cond b{font-family:var(--f-num);font-weight:600;font-size:34px;line-height:1;margin-right:2px;font-variant-numeric:lining-nums}
/* 束3＝線画＋1行（A3） */
.care3 li{display:grid;grid-template-columns:72px 1fr;column-gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.care3 .g-ico{grid-row:1/4;width:72px;height:72px}
.care3 .g-no{align-self:end}
.care3 .g-txt{font-size:17px;line-height:1.6;align-self:start}
.care3 .g-sub{grid-column:2;margin-top:2px;font-size:16px;line-height:1.6;color:var(--ink-2);align-self:start}

/* ⑦ 地を反転（墨茶）＝1面だけ */
.s-voice{background:var(--deep);color:var(--on-deep);--pad-t:56px;--pad-b:64px;--tbc-fg:#CDBFAA;--tbc-bg:transparent;--tbc-line:#CDBFAA;--note-bg:rgba(244,237,225,.06);--note-bar:2px solid #CDBFAA}
.s-voice::before,.s-voice::after{content:"";position:absolute;left:0;right:0;height:8px;background:url(parts/p01_border_a_deep.svg) repeat-x 0 0/24px 8px}
.s-voice::before{top:0}.s-voice::after{bottom:0}
.s-voice h2,.s-voice h3{color:var(--on-deep)}
.s-voice .eyebrow{color:var(--on-deep-2)}
.s-voice .eyebrow::before{background-image:url(parts/p02_motif_ochre.svg)}
.field{margin-top:26px}
.f-main img{width:100%;aspect-ratio:4/5;object-fit:cover}
.f-text{margin-top:20px}
.f-text p{margin-top:8px;color:var(--on-deep)}
.f-sub{margin-top:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.f-sub img{width:100%;aspect-ratio:1/1;object-fit:cover}
.video{margin-top:20px;position:relative}
.video figcaption{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:10px;font-size:16px;color:var(--on-deep-2)}
.q-h{margin-top:48px}
.quote{position:relative;margin-top:22px;padding:34px 0 0}
.quote::before{content:"";position:absolute;left:-2px;top:0;width:44px;height:35px;background:url(parts/p11_quote.svg) no-repeat 0 0/44px 35px}
.quote p{font-family:var(--f-head);font-weight:600;font-size:20px;line-height:1.9;letter-spacing:.02em;color:var(--on-deep)}
.quote figcaption{margin-top:20px;padding-top:16px;border-top:1px solid rgba(205,191,170,.6);display:flex}
.s-voice .map{color:var(--on-deep)}
.q-role{font-size:16px;color:var(--on-deep-2)}
.q-name{font-family:var(--f-num);font-style:italic;font-weight:500;font-size:21px;letter-spacing:.04em}
.s-voice .cta-label{color:var(--on-deep)}
.s-voice .note-tbc{color:var(--on-deep-2)}
.s-voice .cta-label::before{background-image:url(parts/p02_motif_ochre.svg)}

/* ⑧ 大きな年号＋3行の事実 */
.since{display:flex;flex-direction:column;font-family:var(--f-num);color:var(--ink);line-height:1}
.since-e{font-style:italic;font-weight:500;font-size:16px;letter-spacing:.3em;color:var(--ink-2)}
.since-n{font-weight:500;font-size:96px;letter-spacing:.02em;margin-top:4px;font-variant-numeric:lining-nums}
.s-host h2{margin-top:14px;font-size:24px}
.host-lab{font-family:var(--f-head);font-size:20px;font-weight:600;letter-spacing:.06em}
.host-co{color:var(--ink-2)}
.ph-slot{background:var(--paper) url(parts/p03_wool.svg) repeat 0 0/240px 240px;border:1px solid var(--line);color:var(--ink-2)}
.host-dl{margin-top:20px;border-top:1px solid var(--line)}
.host-dl>div{display:grid;grid-template-columns:3.2em 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.host-dl dt{font-size:16px;font-weight:700;color:var(--ink-2);line-height:1.75}
.host-dl dd{font-size:17px}

/* ⑨ 表→3ステップ→締めの札→FAQ */
.s-info{display:flex;flex-direction:column}
.info{order:1}.reserve{order:2}.closing{order:3}.faq-wrap{order:4}
.spec{margin-top:22px;background:var(--paper);border:1px solid var(--line);padding:4px 14px}
.spec>div{display:grid;grid-template-columns:6em 1fr;gap:8px;padding:14px 0;border-bottom:1px solid var(--line)}
.spec>div:last-child{border-bottom:0}
.spec dt{font-size:16px;letter-spacing:0;font-weight:700;color:var(--ink-2);line-height:1.75}
.spec dd{font-size:16px}
.reserve{margin-top:56px}
.reserve>p{margin-top:16px}
.steps{margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;counter-reset:s}
.steps li{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.steps li+li::before{content:"";position:absolute;left:-16px;top:30px;width:24px;border-top:1px dashed var(--line)}
.st-ico{width:72px;height:72px}
.st-n{margin-top:8px;font-family:var(--f-num);font-weight:600;font-size:22px;line-height:1;color:var(--indigo)}
.st-t{margin-top:4px;font-size:16px;font-weight:700;line-height:1.5}
.closing{margin-top:44px;background:var(--paper);border:1px solid var(--line);padding:0 22px 26px;position:relative}
.closing::before{content:"";display:block;height:8px;margin:0 -22px 24px;background:url(parts/p01_border_a_thin.svg) repeat-x 0 0/24px 8px}
.cl-maker{font-family:var(--f-head);font-weight:600;font-size:17px;letter-spacing:.08em;color:var(--ink-2)}
.cl-event{font-family:var(--f-head);font-weight:800;font-size:30px;line-height:1.3;letter-spacing:.05em}
.closing .cta{margin-top:20px}
.faq-wrap{margin-top:56px}
.faq{margin-top:18px;border-top:1px solid var(--line)}
.faq summary{position:relative;padding:16px 40px 16px 0;font-size:17px;font-weight:700;line-height:1.6;border-bottom:1px solid var(--line);min-height:44px}
.faq summary::before,.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:16px;height:1.5px;background:var(--ink-2)}
.faq summary::after{transform:rotate(90deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(0)}
.faq .ans{padding:14px 0 18px;border-bottom:1px solid var(--line);font-size:17px}

/* フッター・固定ボタン */
.foot{padding:0 20px 104px;background:var(--ground)}
.foot .border-band{margin:0 -20px 28px}
.foot-name{font-family:var(--f-head);font-weight:600;font-size:18px;letter-spacing:.06em}
.foot-co{color:var(--ink-2);font-family:var(--f-body);letter-spacing:.04em}
.foot-pp{margin-top:8px;font-size:16px;color:var(--ink-2)}
.dock{background:rgba(244,237,225,.96);border-top:1px solid var(--line)}
