/* Shared look for the plain text pages (FAQ, delivery, about, privacy, 404).
   The home and case pages carry their own styles inside <x-dc>. */
html { -webkit-text-size-adjust: 100%; }
* { box-sizing: border-box; }
body { margin: 0; background: #efe6d2; color: #221c14; font-family: "EB Garamond", Georgia, serif; min-height: 100vh; display: flex; flex-direction: column; }
a { color: #7a1f14; text-decoration: none; }
a:hover { color: #221c14; }
::selection { background: #7a1f14; color: #f6efdd; }

.site-header { display: flex; align-items: center; justify-content: space-between; gap: 18px 24px; flex-wrap: wrap; padding: 22px clamp(18px,4vw,56px); border-bottom: 1px solid rgba(34,28,20,.14); }
.brand { display: flex; align-items: center; gap: 14px; color: #221c14; }
.brand img { display: block; width: 56px; height: auto; }
.brand span { font-family: "Cormorant Garamond", serif; font-size: 24px; letter-spacing: .03em; line-height: 1; }
.site-header nav { display: flex; gap: 8px 22px; flex-wrap: wrap; align-items: center; font-family: "Courier Prime", monospace; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.site-header nav a { color: rgba(34,28,20,.78); display: inline-flex; align-items: center; min-height: 44px; }
.site-header nav a:hover { color: #7a1f14; }
.site-header nav .order { border: 1px solid rgba(34,28,20,.4); padding: 0 16px; color: #221c14; }
.site-header nav .order:hover { background: #7a1f14; border-color: #7a1f14; color: #f8f2e2; }

main { flex: 1; width: 100%; max-width: 780px; padding: clamp(40px,7vw,90px) clamp(18px,4vw,56px); }
.eyebrow { font-family: "Courier Prime", monospace; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: #7a1f14; margin: 0 0 20px; }
h1 { font-family: "Cormorant Garamond", serif; font-weight: 300; font-size: clamp(38px,6vw,66px); line-height: 1.02; margin: 0 0 28px; text-wrap: balance; }
h2 { font-family: "Cormorant Garamond", serif; font-weight: 500; font-size: clamp(24px,2.8vw,30px); line-height: 1.2; margin: 40px 0 10px; }
p, li { font-size: 19px; line-height: 1.6; color: rgba(34,28,20,.84); }
p { margin: 0 0 18px; }
ul { margin: 0 0 18px; padding-left: 1.2em; }
li { margin: 0 0 8px; }
li::marker { color: #7a1f14; }
.lede { font-size: clamp(19px,2vw,22px); }
.small { font-size: 16px; color: rgba(34,28,20,.72); }
.btn { display: inline-block; background: #7a1f14; color: #f8f2e2; font-family: "Courier Prime", monospace; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; padding: 17px 28px; margin-top: 10px; }
.btn:hover { background: #98291a; color: #f8f2e2; }

.site-footer { background: #221c14; padding: clamp(34px,5vw,56px) clamp(18px,4vw,56px); display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; align-items: center; font-family: "Courier Prime", monospace; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: rgba(246,239,221,.7); }
.site-footer nav { display: flex; gap: 18px; flex-wrap: wrap; }
.site-footer a { color: rgba(246,239,221,.78); }
.site-footer a:hover { color: #f6efdd; }
