/* Studio Pivoine — thème */
:root { --font: "Jost", system-ui, sans-serif; --fg: #4a2a31; --bg: #f6e8e4; --radius: 6px; --accent: #b5566a; --accent-fg: #fff; --accent-ink: #9a3f53;
  --btn-line: #e2c3c3; --btn-bg: #fffaf8; --btn-fg: #4a2a31; --btn-hover-bg: #4a2a31; --btn-hover-fg: #fff; --btn-radius: 4px; }
.petals { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hint { font-family: "Cormorant", serif; font-style: italic; text-transform: none; letter-spacing: .02em; font-size: 1.02rem; }
.face--front { background: linear-gradient(150deg, #fffaf8, #f8e6e2); display: flex; align-items: center; justify-content: center; text-align: center; padding: 6%; }
.face--front::after { content: ""; position: absolute; inset: 14px; border: 1px solid #d9a441; opacity: .6; pointer-events: none; }
.f-in { position: relative; }
.peony { width: 82px; height: 82px; display: block; margin: 0 auto 6px; }
.brand { margin: 0; font-family: "Cormorant", serif; font-weight: 500; font-size: clamp(2.1rem, 6.4vw, 3rem); line-height: 1; letter-spacing: .02em; color: #4a2a31; }
.brand em { color: #b5566a; }
.sub { margin: 10px 0 0; font-size: .74rem; letter-spacing: .32em; text-transform: uppercase; color: #8c6a6f; }
.place { position: absolute; bottom: 26px; left: 0; right: 0; margin: 0; text-align: center; font-family: "Cormorant", serif; font-style: italic; color: #b98a3a; font-size: .98rem; }
.face--back { background: #4a2a31; color: #f6e8e4; padding: 7% 8%; display: flex; }
.face--back::after { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(217, 164, 65, .5); pointer-events: none; }
.b-in { position: relative; display: flex; flex-direction: column; justify-content: space-between; width: 100%; gap: 10px; }
.who { margin: 0; font-family: "Cormorant", serif; font-style: italic; font-size: 1.35rem; color: #e7c27a; }
.prices { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: .86rem; }
.prices li { display: flex; align-items: baseline; gap: 8px; }
.prices li::after { content: ""; order: 1; flex: 1; border-bottom: 1px dotted rgba(246, 232, 228, .35); }
.prices b { order: 2; font-weight: 500; color: #e7c27a; white-space: nowrap; }
.contact { list-style: none; margin: 0; padding: 0; font-size: .8rem; color: #e3cfcb; display: flex; flex-wrap: wrap; gap: 4px 16px; }
.contact a { text-decoration: none; border-bottom: 1px solid rgba(231, 194, 122, .45); }
@media (max-width: 520px) {
  .peony { width: 104px; height: 104px; margin-bottom: 14px; }
  .brand { font-size: 2.8rem; }
  .brand em { display: block; }
  .sub { letter-spacing: .2em; font-size: .7rem; }
  .face--back { padding: 15% 11%; }
  .prices { gap: 10px; }
  .prices li { flex-wrap: wrap; }
  .contact { flex-direction: column; gap: 8px; }
}
