:root{--ink:#192e25;--cream:#f9f6ee;--muted:#4e5d53;--accent:#a03525;--line:#d5dace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--cream);font:1rem/1.6 system-ui,sans-serif}
a{color:inherit;text-underline-offset:.2em}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #aa512e;outline-offset:3px}
.wrap{width:min(1120px,calc(100% - 2.5rem));margin-inline:auto}
header{background:#fffdf8;border-bottom:1px solid #e5e3da}
nav,footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:1.1rem}
.brand{text-decoration:none;font-weight:800;letter-spacing:.11em}
.brand small{color:var(--accent)}
.hero{background:linear-gradient(155deg,#f7f7ee,#e4ede1);color:var(--ink)}
.order-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.hero-grid{max-width:760px;padding-block:clamp(3rem,7vw,6rem)}
.eyebrow{font-weight:750;font-size:.75rem;text-transform:uppercase;letter-spacing:.18em;color:var(--accent);margin:0 0 .8rem}

h1,h2{font-family:Georgia,serif;font-weight:500;line-height:1.04;margin:0 0 .65rem}
h1{font-size:clamp(3rem,8vw,7rem);letter-spacing:-.055em}
h2{font-size:clamp(2.4rem,5vw,4.4rem);letter-spacing:-.04em}
.author{font-size:1.1rem;margin:0;color:#f0c6a5}
.lead{font:clamp(1.5rem,3vw,2.25rem)/1.2 Georgia,serif;margin:1.5rem 0 .75rem}
.hero p:not(.eyebrow){max-width:68ch}
.hero .cover{margin-block:1.5rem 2rem}
.hero h1,.hero .lead,.hero .eyebrow{text-align:center}
.hero .lead{margin-inline:auto}
.actions{display:flex;align-items:center;gap:1rem 1.5rem;flex-wrap:wrap;margin-block:1.7rem}
.button{display:inline-block;background:var(--accent);color:white;border:0;border-radius:.35rem;padding:.85rem 1.15rem;font:inherit;font-weight:750;text-decoration:none;cursor:pointer}
.button:hover{background:#81291d}
.edition{font-size:.88rem;color:var(--muted)}
figure{margin:0}
.cover img{display:block;width:min(100%,365px);height:auto;margin:auto;border-radius:.2rem .5rem .5rem .2rem;box-shadow:14px 20px 40px #19362735}
.section,.order{padding-block:clamp(3rem,7vw,6rem)}
.intro{max-width:68ch;color:var(--muted);margin-bottom:2rem}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.gallery figure{overflow:hidden;border:1px solid #e1e0d6;border-radius:.55rem;background:#fffdf8}
.gallery img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery figcaption{padding:1rem;font-size:.9rem}
.gallery strong{font:1.35rem Georgia,serif}
.order{background:#e9eee5}
.order-grid{grid-template-columns:.75fr 1.25fr;align-items:start}
.price{font:2rem Georgia,serif}
.price small{font: .9rem system-ui,sans-serif;display:block;margin-top:.35rem}
form{background:#fffdf9;border:1px solid var(--line);border-radius:.65rem;padding:clamp(1rem,3vw,2rem)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.wide{grid-column:1/-1}
label{display:block;font-weight:650;font-size:.9rem}
input:not([type=checkbox]),textarea,select{display:block;width:100%;font:inherit;color:inherit;margin-top:.3rem;padding:.65rem;background:white;border:1px solid #a9b3a7;border-radius:.3rem}
textarea{resize:vertical}
.check{display:flex;gap:.4rem;align-items:baseline;margin-bottom:.65rem}
details,.hint{font-size:.88rem;margin-block:1rem}
summary{cursor:pointer}
footer{font-size:.9rem}
[hidden]{display:none!important}
@media(max-width:760px){.order-grid{grid-template-columns:1fr;gap:2rem}.gallery{grid-template-columns:1fr 1fr}.cover img{width:min(68vw,320px)}}
@media(max-width:440px){.wrap{width:calc(100% - 1.5rem)}.fields{grid-template-columns:1fr}.gallery figcaption{padding:.65rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}