.book-order-page { padding-bottom: 0; color: #f4f1e8; background: radial-gradient(ellipse at 80% 8%, rgba(214,165,85,.09), transparent 42rem), #101510; }
.order-header { grid-template-columns: 1fr auto; gap: 1rem; }
.order-header .brand { color: #101310; }
.order-back { color: #26392d; font-size: .9rem; font-weight: 700; text-decoration: none; }
.order-back:hover { text-decoration: underline; }
.order-main { width: min(1240px, calc(100% - 3rem)); margin: 0 auto; padding: 3rem 0 2.5rem; }
.order-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.75rem; }
.order-heading .eyebrow { margin: 0 0 .7rem; color: #d6a555; letter-spacing: .13em; font-size: .7rem; }
.order-heading h1 { margin: 0; color: #fff7e6; font-size: clamp(1.7rem, 3.5vw, 3rem); line-height: 1.3; font-weight: 800; }
.order-heading h1 span { color: #edc778; font-family: Georgia, serif; font-weight: 500; }
.order-label { flex-shrink: 0; margin: 0; padding: .45rem .9rem; border: 1px solid rgba(214,165,85,.55); border-radius: 999px; color: #f0c878; font-size: .85rem; font-weight: 800; }
.order-poster { margin: 0; }
.order-poster > a { display: block; overflow: hidden; border: 1px solid rgba(214,165,85,.3); border-radius: 1.2rem; background: #000; }
.order-poster img { width: 100%; height: auto; object-fit: contain; }
.order-poster figcaption { padding: .65rem .2rem 1.25rem; color: #b9c2bb; font-size: .8rem; text-align: right; }
.order-panel { display: grid; grid-template-columns: 1fr auto minmax(16rem, 1fr); align-items: center; gap: 2rem; padding: 1.75rem 2rem; border: 1px solid rgba(214,165,85,.28); border-radius: 1.2rem; background: linear-gradient(120deg, rgba(255,255,255,.045), rgba(214,165,85,.045)); }
.order-panel p, .order-panel h2 { margin: 0; }
.order-edition { color: #d6a555; font-size: .7rem; letter-spacing: .14em; font-weight: 800; }
.order-summary h2 { margin: .25rem 0 .4rem; font-size: 1.5rem; }
.order-summary > p:last-child { color: #c0c8c1; font-size: .9rem; }
.order-price strong { display: block; color: #f0c878; font-family: Georgia, serif; font-size: 2.65rem; line-height: 1.25; font-weight: 500; white-space: nowrap; }
.order-price strong span { color: #eee6d7; font-family: Tahoma, sans-serif; font-size: .9rem; }
.order-price p { color: #c0c8c1; font-size: .85rem; }
.order-line { width: 100%; min-height: 3.5rem; text-align: center; }
.order-action p { margin-top: .6rem; color: #b9c2bb; font-size: .75rem; text-align: center; }
.order-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: min(1240px, calc(100% - 3rem)); margin: 0 auto; padding: 1.5rem 0 2rem; border-top: 1px solid rgba(255,255,255,.12); color: #b9c2bb; font-size: .8rem; }
.order-footer a { color: #edc778; text-decoration: none; }
.order-poster > a:focus-visible, .order-back:focus-visible, .order-footer a:focus-visible { outline: 3px solid #f0c878; outline-offset: 5px; }
@media (max-width: 800px) { .order-panel { grid-template-columns: 1fr auto; gap: 1.5rem; } .order-action { grid-column: 1 / -1; } }
@media (max-width: 540px) { .order-header { padding: .8rem 1rem; } .order-header .brand b { font-size: 1rem; } .order-header .brand small { font-size: .5rem; } .order-back { font-size: .75rem; } .order-main { width: calc(100% - 2rem); padding: 1.75rem 0 1.5rem; } .order-heading { display: block; margin-bottom: 1.2rem; } .order-heading .eyebrow { font-size: .55rem; } .order-heading h1 span { display: block; font-size: 2.5rem; } .order-label { display: inline-block; margin-top: 1rem; font-size: .75rem; } .order-poster > a { border-radius: .8rem; } .order-poster figcaption { font-size: .7rem; } .order-panel { gap: 1rem; padding: 1.2rem; } .order-summary h2 { font-size: 1.1rem; } .order-summary > p:last-child { font-size: .75rem; } .order-edition { font-size: .55rem; } .order-price strong { font-size: 2.1rem; } .order-price strong span { display: block; font-size: .75rem; } .order-price p { margin-top: .3rem; font-size: .75rem; } .order-footer { width: calc(100% - 2rem); flex-direction: column; align-items: start; font-size: .7rem; } }
