:root {
  color-scheme: light;
  --light-beige: #E4DBCE;
  --beige: #B7A693;
  --brown: #3D2615;
  --green: #504F2C;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; color: var(--brown); background: var(--light-beige); font-family: "Trebuchet MS", Arial, sans-serif; line-height: 1.5; }
.page-shell { width: min(100%, 512px); margin: 0 auto; padding: max(32px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)); }
.card { width: 100%; }
.hero { padding: 16px 0 30px; }
.brand-mark { width: 42px; height: 42px; position: relative; margin-bottom: 18px; }
.brand-mark span { position: absolute; width: 27px; height: 34px; border: 1px solid var(--green); border-radius: 50%; transform: rotate(-30deg); left: 3px; top: 3px; }
.brand-mark span:last-child { transform: rotate(30deg); left: 13px; }
.brand-title { font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: clamp(2.4rem, 10vw, 3.5rem); letter-spacing: -.045em; line-height: 1.1; margin: 0; }
.brand-title span { display: block; font-family: "Trebuchet MS", Arial, sans-serif; font-size: .73rem; letter-spacing: .36em; text-transform: uppercase; margin-top: 14px; }
.actions { display: grid; gap: 10px; margin-top: 30px; }
.button, .copy-button { min-height: 52px; padding: 14px 20px; border: 1px solid var(--green); border-radius: 4px; display: flex; align-items: center; justify-content: center; gap: 12px; font: inherit; font-size: .95rem; text-decoration: none; cursor: pointer; transition: background 140ms, transform 140ms; -webkit-tap-highlight-color: transparent; }
.button.primary { color: var(--light-beige); background: var(--green); }
.button.ghost { color: var(--brown); background: transparent; border-color: var(--beige); }
.button-icon { font-size: 1.2rem; line-height: 1; }
.button.primary:hover, .copy-button:hover { background: var(--brown); }
.button.ghost:hover { background: var(--beige); }
.pressable:active { transform: translateY(1px); }
:focus-visible { outline: 2px solid var(--brown); outline-offset: 4px; }
.bank-card { padding: 25px 22px 18px; background: var(--beige); border-radius: 4px; scroll-margin-top: 20px; }
.section-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 24px; }
.eyebrow { margin: 0; font-size: .74rem; text-transform: uppercase; letter-spacing: .16em; font-weight: 700; }
.badge { font-size: .73rem; color: var(--brown); }
.field-label { display: block; font-size: .67rem; letter-spacing: .13em; text-transform: uppercase; margin-bottom: 5px; }
.field-value { margin: 0; font-size: 1.25rem; font-family: Georgia, "Times New Roman", serif; line-height: 1.5; }
.bank-block + .bank-block { margin-top: 21px; }
.iban-row { display: grid; gap: 17px; }
.iban { font-family: "Courier New", monospace; font-size: clamp(.93rem, 3.8vw, 1.15rem); letter-spacing: -.025em; overflow-wrap: anywhere; }
.copy-button { width: 100%; background: var(--brown); color: var(--light-beige); border-color: var(--brown); }
.copy-button:hover { background: var(--green); }
.copy-status { min-height: 1.5em; margin: 9px 0 0; font-size: .78rem; color: var(--green); }
.qr-card { padding: 28px 0 24px; margin-top: 28px; border-top: 1px solid var(--beige); }
.qr-card .section-header { margin-bottom: 20px; }
.qr-wrap { width: 172px; max-width: 100%; margin: 0 auto; padding: 8px; background: white; border-radius: 2px; }
.qr-wrap img { display: block; width: 100%; height: auto; }
.qr-caption { text-align: center; font-size: .75rem; margin: 14px 0 0; overflow-wrap: anywhere; }
.qr-caption span { display: block; }
.footer { padding: 18px 12px 0; border-top: 1px solid var(--beige); font-size: .72rem; line-height: 1.7; text-align: center; color: var(--green); }
.footer p { margin: 0; }
@media (min-width: 700px) { .page-shell { padding-top: 54px; padding-bottom: 42px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }
