@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=PT+Serif:ital,wght@0,400;0,700;1,400&display=swap');

:root { --ink:#1f2a24; --muted:#657068; --paper:#f5f0e5; --card:#fffdf8; --line:#d7d0c1; --leaf:#235a42; --moss:#dce8d9; --rust:#bd5b34; --danger:#aa362f; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:var(--paper); color:var(--ink); font-family:"IBM Plex Sans", sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.35; background-image:radial-gradient(#6b736a 0.55px,transparent .55px); background-size:7px 7px; mix-blend-mode:multiply; }
.page-shell { position:relative; max-width:1080px; margin:0 auto; padding:30px 28px 60px; }
.masthead { display:flex; align-items:flex-start; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:22px; }
.brand { display:flex; gap:12px; align-items:baseline; text-decoration:none; color:inherit; }
.brand-mark { font-family:"PT Serif",serif; font-weight:700; font-size:1.48rem; letter-spacing:-.08em; background:var(--ink); color:var(--paper); padding:1px 8px 3px; }
.brand-note,.step-counter { color:var(--muted); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; margin:0; }
.step-counter b { color:var(--rust); }
.hero { margin:88px 0 46px; max-width:560px; animation:rise .6s ease both; }
.eyebrow,.chapter { color:var(--rust); font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; }
h1,h2 { font-family:"PT Serif",serif; margin:0; font-weight:400; letter-spacing:-.045em; }
h1 { font-size:clamp(3.8rem,10vw,7rem); line-height:.84; }
h1 em { color:var(--leaf); }
.hero-copy { color:var(--muted); font-size:1.03rem; max-width:405px; margin:27px 0 0; line-height:1.55; }
.form-card { background:var(--card); border:1px solid var(--line); box-shadow:12px 12px 0 var(--moss); padding:clamp(24px,5vw,52px); animation:rise .7s .1s ease both; }
.form-heading { display:grid; grid-template-columns:38px 1fr; gap:14px; margin-bottom:32px; }
.form-heading h2 { font-size:clamp(1.7rem,4vw,2.5rem); line-height:1; }
.form-heading p { color:var(--muted); margin:8px 0 0; font-size:.92rem; }
.field-label,.field span,fieldset legend { display:block; font-size:.79rem; color:var(--muted); margin-bottom:8px; font-weight:600; letter-spacing:.03em; }
input { width:100%; border:1px solid var(--line); border-radius:0; background:#fffefa; color:var(--ink); font:500 1rem "IBM Plex Sans",sans-serif; padding:14px 15px; outline:none; transition:border-color .2s,box-shadow .2s; }
input:focus { border-color:var(--leaf); box-shadow:0 0 0 3px rgba(35,90,66,.12); }
.phone-row { display:flex; gap:10px; } .phone-row input { min-width:0; }
.primary-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; border:0; background:var(--leaf); color:#fff; font:600 .88rem "IBM Plex Sans",sans-serif; letter-spacing:.04em; padding:0 20px; min-height:51px; cursor:pointer; white-space:nowrap; transition:transform .15s,background .15s; }
.primary-button:hover { transform:translate(-2px,-2px); background:#174630; } .primary-button:disabled { opacity:.55; transform:none; cursor:wait; }
.primary-button i { font-style:normal; font-size:1.35rem; }
.field-hint,.footnote { color:var(--muted); font-size:.78rem; line-height:1.4; }.field-hint { margin:10px 0 0; }
.form-message { min-height:1.3em; color:var(--danger); margin:15px 0 0; font-size:.9rem; }.form-message.ok { color:var(--leaf); }
.delivery-choice,.pickup-choice { border:0; padding:0; margin:0 0 28px; }.choice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.choice-card { position:relative; border:1px solid var(--line); padding:16px 14px; cursor:pointer; min-height:100px; transition:background .2s,border-color .2s; }.choice-card input { position:absolute; opacity:0; inset:0; cursor:pointer; }.choice-card:has(input:checked) { border-color:var(--leaf); background:var(--moss); }.choice-card span { display:block; font-family:"PT Serif",serif; font-size:1.35rem; }.choice-card small { display:block; color:var(--muted); margin-top:7px; }
.fields-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:17px; }.field { display:block; margin-bottom:17px; }.field.wide { max-width:100%; }.conditional-fields { border-left:2px solid var(--rust); padding:20px 0 1px 20px; margin:8px 0 10px; }.pickup-choice { display:flex; flex-wrap:wrap; gap:10px; }.pickup-choice legend { width:100%; }.pickup-choice label { cursor:pointer; }.pickup-choice input { position:absolute; opacity:0; }.pickup-choice span { display:block; border:1px solid var(--line); padding:11px 14px; }.pickup-choice label:has(input:checked) span { background:var(--moss); border-color:var(--leaf); }
.submit-row { display:flex; justify-content:space-between; align-items:center; margin-top:28px; gap:16px; }.text-button { background:none; border:0; border-bottom:1px solid var(--ink); color:var(--ink); padding:0 0 3px; font:500 .85rem "IBM Plex Sans",sans-serif; cursor:pointer; }.text-button:hover { color:var(--rust); border-color:var(--rust); }
.success { border-top:4px solid var(--leaf); padding-top:20px; }.success-stamp { color:var(--leaf); font-weight:600; font-size:.75rem; letter-spacing:.13em; text-transform:uppercase; }.success h2 { font-size:clamp(2.5rem,7vw,4.5rem); margin:10px 0; }.success p { color:var(--muted); max-width:430px; line-height:1.55; margin-bottom:28px; }
.hidden { display:none !important; } .footnote { margin:38px 0 0; text-align:center; }
@keyframes rise { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:640px) { .page-shell { padding:22px 17px 45px; }.brand-note { display:none; }.hero { margin:58px 0 36px; }.form-card { box-shadow:7px 7px 0 var(--moss); }.phone-row { display:block; }.phone-row .primary-button { width:100%; margin-top:10px; }.choice-grid { grid-template-columns:1fr; }.choice-card { min-height:78px; }.fields-grid { grid-template-columns:1fr; gap:0; }.submit-row { align-items:stretch; flex-direction:column-reverse; }.submit-row .primary-button { width:100%; }.conditional-fields { padding-left:14px; } }