/* [사이트판 손봄 2026-10-10] */
/* About / Where to Buy / Contact */
.ph-hero{ padding:56px 0 48px; border-bottom:1px solid var(--line); }
@media (min-width:900px){ .ph-hero{ padding:104px 0 88px; } }
.ph-hero .in{ display:grid; gap:20px; max-width:820px; }
.ph-hero .lead{ max-width:640px; }

/* about */
.story{ display:grid; gap:40px; }
.story .media{ aspect-ratio:1/1; overflow:hidden; }
.story .media img{ width:100%; height:100%; object-fit:cover; }
.story .txt{ display:grid; gap:22px; align-content:center; max-width:560px; }
.story .txt p{ font-size:16px; line-height:2; }
.story .txt p:first-child::first-letter{ font-family:'Cormorant Garamond',serif; font-weight:300; font-size:3.4em; float:left; line-height:.86; padding:6px 10px 0 0; color:var(--accent); }
html:is(:lang(ko),:lang(ja),:lang(zh)) .story .txt p:first-child::first-letter{ font-family:inherit; font-size:inherit; float:none; padding:0; line-height:inherit; color:inherit; }
@media (min-width:900px){ .story{ grid-template-columns:1fr 1fr; gap:88px; } .story .txt p{ font-size:17px; } }
.facts{ display:grid; border-top:1px solid var(--line); list-style:none; }
.fact{ display:grid; grid-template-columns:56px 1fr; gap:4px 12px; padding:28px 0; border-bottom:1px solid var(--line); }
.fact .num{ font-size:28px; line-height:1.1; grid-row:span 2; }
.fact h3{ font-size:17px; font-weight:400; }
.fact p{ font-size:14px; color:var(--mute); }
@media (min-width:900px){
  .facts{ grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--line); }
  .fact{ grid-template-columns:1fr; padding:40px 40px 44px 0; border-bottom:0; gap:12px; }
  .fact + .fact{ padding-left:40px; border-left:1px solid var(--line); }
  .fact .num{ font-size:44px; grid-row:auto; }
}

/* where to buy */
.wtb-routes .route-sub{ font-size:13px; color:var(--mute); line-height:1.85; max-width:520px; }
.notes-list{ list-style:none; display:grid; }
.notes-list li{ display:grid; grid-template-columns:28px 1fr; padding:14px 0; border-top:1px solid var(--line); font-size:14px; line-height:1.9; }
.notes-list li:last-child{ border-bottom:1px solid var(--line); }
.notes-list li::before{ content:"—"; color:var(--accent); font-family:'Cormorant Garamond',serif; }
.faq{ border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:44px 1fr 24px; align-items:baseline; gap:8px; padding:20px 0; font-size:16px; font-weight:400; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary .num{ font-size:18px; }
.faq summary::after{ content:"+"; font-family:'Cormorant Garamond',serif; font-size:24px; line-height:1; color:var(--accent); justify-self:end; transition:transform .2s; }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq .ans{ padding:0 0 22px 52px; font-size:14px; line-height:1.95; color:var(--ink); max-width:680px; }
@media (min-width:900px){ .faq .ans{ padding-right:32px; } }

/* contact */
.channels{ display:grid; border-top:1px solid var(--line); }
.channel{ display:grid; gap:10px; padding:32px 0; border-bottom:1px solid var(--line); }
.channel .val{ font-family:'Cormorant Garamond',serif; font-weight:300; font-size:30px; line-height:1.2; color:var(--ink); word-break:break-all; }
.channel .val .ph{ font-size:18px; }
@media (min-width:768px){ .channel .val{ font-size:40px; } }
.channel .btn-row{ margin-top:8px; }
@media (min-width:900px){
  .channels{ grid-template-columns:1fr 1fr; border-bottom:1px solid var(--line); }
  .channel{ padding:44px 48px 48px 0; border-bottom:0; }
  .channel + .channel{ padding-left:48px; border-left:1px solid var(--line); }
}
.tpl{ position:relative; background:var(--paper); border:1px solid var(--line); }
.tpl pre{ margin:0; padding:22px 20px 70px; font-family:var(--body); font-weight:300; font-size:14px; line-height:2; white-space:pre-wrap; color:var(--ink); }
.tpl .btn{ position:absolute; right:12px; bottom:12px; min-height:40px; padding:8px 16px; font-size:13px; }
.kr-note{ display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between; padding:20px; background:var(--warm); font-size:14px; }

/* ---------- 사이트판: 문의 채널 3칸(인스타 · 카카오톡 · 이메일) ---------- */
@media (min-width:900px){
  .channels.c3{ grid-template-columns:repeat(3,1fr); }
  .channels.c3 .channel{ padding:44px 36px 48px 0; }
  .channels.c3 .channel + .channel{ padding-left:36px; }
  .channels.c3 .channel .val{ font-size:32px; }
}
