#orderpage{background:var(--surface);color:var(--ink)}
#orderpage .order-section{padding:48px 0 80px}
#orderpage .order-back{font-size:14px;text-decoration:none;color:var(--ink)}
#orderpage .order-heading{max-width:720px;margin:36px 0 40px}
#orderpage h1{font:500 clamp(38px,5vw,60px)/1.12 var(--display);margin:14px 0 22px}
#orderpage h1 em{color:var(--rasp)}
#orderpage p{line-height:1.65}
#orderpage .order-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,.8fr);gap:40px;align-items:start}
#orderpage .order-form,#orderpage .order-review{padding:clamp(22px,3vw,40px);background:var(--bg);border:1px solid var(--line);border-radius:20px}
#orderpage fieldset{border:0;padding:0;margin:0 0 30px;min-width:0}
#orderpage legend{font:500 27px/1.25 var(--display);margin-bottom:20px;padding:0}
#orderpage .order-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
#orderpage .order-wide{grid-column:1/-1}
#orderpage label{display:block;font-size:14px;font-weight:600;margin-bottom:9px}
#orderpage input,#orderpage select{width:100%;min-width:0;min-height:48px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--surface);color:var(--ink);font:16px var(--body)}
#orderpage input:focus,#orderpage select:focus{outline:2px solid var(--rasp);outline-offset:2px}
#orderpage .order-help{font-size:13px;margin:10px 0 16px}
#orderpage .order-help a{text-decoration:underline;text-underline-offset:3px;color:var(--ink)}
#orderpage .btn{background:var(--ink)!important;color:var(--surface)!important;min-height:48px;justify-content:center;text-align:center}
#orderpage .order-notice{font-size:13px;margin:20px 0 0;line-height:1.6}
#orderpage .order-summary{padding:32px;background:var(--vanilla);border-radius:20px}
#orderpage .order-summary h2{font:500 38px/1.2 var(--display);margin:20px 0 16px}
#orderpage .order-price{font:500 48px/1.2 var(--display);margin:24px 0}
#orderpage .order-delivery{border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent);padding-top:24px}
#orderpage .order-delivery p{font-size:14px;margin:10px 0 0}
#orderpage .order-review{max-width:none;margin:0}
#orderpage .order-review h2{font:500 34px/1.2 var(--display)}
#orderpage .order-review dl{margin:24px 0}
#orderpage .order-review dl div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;border-bottom:1px solid var(--line);padding:14px 0}
#orderpage .order-review dt{font-weight:600}#orderpage .order-review dd{margin:0;overflow-wrap:anywhere}
#orderpage .order-review .btn{margin-top:24px}
@media(max-width:800px){#orderpage .order-layout{grid-template-columns:1fr;gap:24px}#orderpage .order-summary{grid-row:1}#orderpage .order-heading{margin:28px 0}#orderpage .order-section{padding-top:30px}}
@media(max-width:480px){#orderpage .order-fields{grid-template-columns:1fr}#orderpage .order-review dl div{grid-template-columns:1fr;gap:6px}#orderpage .btn{width:100%}}
#orderpage .order-review{scroll-margin-top:110px}
@media(max-width:800px){#orderpage .order-summary{padding:24px}#orderpage .order-summary h2{margin:12px 0}#orderpage .order-price{margin:16px 0}#orderpage .order-delivery{padding-top:18px}}

#orderpage[data-guide="revelation"] .order-summary{background:var(--night);color:#FFFAF6}
#orderpage[data-guide="revelation"] .order-summary .eyebrow,#orderpage[data-guide="revelation"] .order-summary h2,#orderpage[data-guide="revelation"] .order-price{color:var(--gold)}
#orderpage[data-guide="revelation"] .order-delivery{border-color:color-mix(in srgb,var(--gold) 35%,transparent)}
#orderpage .order-city-field{position:relative}
#order-city-results{position:absolute;left:0;right:0;z-index:30;list-style:none;margin:4px 0 0;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:12px;max-height:260px;overflow:auto;box-shadow:0 12px 28px #2B173522}
#order-city-results li{padding:12px;border-radius:8px;cursor:pointer;font-size:15px}
#order-city-results li:hover,#order-city-results li[aria-selected="true"]{background:var(--vanilla);color:var(--ink)}

#orderpage .order-gift-choice{border-top:1px solid var(--line);padding:22px 0}
#orderpage .order-gift-choice label,#orderpage .order-delivery-choice label{display:flex;gap:12px;align-items:center;cursor:pointer;min-height:44px}
#orderpage input[type="checkbox"],#orderpage input[type="radio"]{width:20px;height:20px;min-height:20px;flex:0 0 20px;accent-color:var(--ink);padding:0}
#orderpage .order-delivery-choice{display:grid;gap:6px;margin:10px 0 20px}
#orderpage #order-gift-fields{background:var(--surface);border-radius:12px;padding:20px}
#orderpage #order-gift-fields legend{padding-top:20px}
#orderpage .order-label{font-weight:600;font-size:14px;margin:20px 0 6px}

#orderpage .order-field-error{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--rasp);font-weight:500}
#orderpage input[aria-invalid="true"]{border-color:var(--rasp);box-shadow:0 0 0 1px var(--rasp)}
#orderpage input{scroll-margin-top:120px}

#orderpage .order-heading{margin:24px 0 28px}
#orderpage #order-gift-fields{display:flow-root;padding:26px;margin-top:8px}
#orderpage #order-gift-fields legend{float:left;width:100%;padding:0;margin:0 0 24px}
#orderpage #order-gift-fields legend+*{clear:both}
#orderpage .order-review dl div{grid-template-columns:140px minmax(0,1fr);gap:18px;padding:13px 0}
#orderpage .order-review dt{font-size:14px}
#orderpage .order-review-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:26px}
#orderpage .order-review-actions .btn{margin:0}
#orderpage .order-edit{background:none;border:0;padding:12px 0;color:var(--ink);font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
#orderpage #order-pay:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
@media(max-width:480px){#orderpage .order-review dl div{grid-template-columns:1fr;gap:4px}#orderpage #order-gift-fields{padding:20px}#orderpage .order-review-actions{gap:10px}}
/* Le fond cadeau suit le contenu, sans marge vide sous le dernier choix. */
#orderpage #order-gift-fields{padding-bottom:20px}
#orderpage #order-gift-fields .order-delivery-choice{margin-bottom:0}
#orderpage #order-gift-fields .order-delivery-choice label{margin-bottom:0}
#orderpage #order-gift-email-field:not([hidden]){margin-top:20px}
#orderpage #order-gift-email-field .order-help:last-child{margin-bottom:0}

/* Même entrée de page que les autres rubriques, sous le menu fixe. */
#orderpage .order-section{padding-top:28px}
#orderpage .order-heading{margin-top:0}
#orderpage .order-heading>.eyebrow{display:flex}
#orderpage h1{margin-top:24px}

/* Commande mobile : choix compact, champs confortables et cadeau lisible. */
@media(max-width:800px){
 #orderpage .order-heading{margin-bottom:22px}
 #orderpage #order-intro{font-size:15px;line-height:1.6}
 #orderpage .order-layout{gap:20px}
 #orderpage .order-summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;padding:20px}
 #orderpage .order-summary>.eyebrow{grid-column:1/-1;margin:0}
 #orderpage .order-summary h2{font-size:30px;margin:0;align-self:center}
 #orderpage .order-summary .order-price{font-size:34px;line-height:1.2;margin:0;align-self:center;white-space:nowrap}
 #orderpage .order-delivery{grid-column:1/-1;padding-top:14px;margin-top:2px;font-size:14px;line-height:1.5}
 #orderpage .order-delivery p{font-size:13px;line-height:1.6;margin-top:6px}
 #orderpage .order-form,#orderpage .order-review{padding:20px;min-width:0}
 #orderpage legend,#orderpage .order-review h2{font-size:25px;line-height:1.2}
 #orderpage .order-review>p{font-size:14px}
 #orderpage .order-fields{gap:16px}
 #orderpage #order-gift-fields{padding:16px}
 #orderpage #order-gift-fields legend{font-size:23px;margin-bottom:20px}
 #orderpage .order-delivery-choice label{gap:10px;font-size:14px;line-height:1.5;min-height:44px}
 #orderpage .order-review dd{font-size:15px;line-height:1.5}
 #orderpage .order-review-actions{flex-direction:column;align-items:stretch;gap:12px}
 #orderpage .order-review-actions button,#orderpage #order-form>button{width:100%;min-height:48px;white-space:normal}
 #orderpage #order-city-results{max-height:min(260px,36svh);overscroll-behavior:contain}
 #orderpage #order-city-results li{min-height:44px;box-sizing:border-box;line-height:1.4;overflow-wrap:anywhere}
}
@media(max-width:360px){
 #orderpage .order-summary,#orderpage .order-form,#orderpage .order-review{padding:16px}
 #orderpage .order-summary h2{font-size:27px}
 #orderpage .order-summary .order-price{font-size:30px}
 #orderpage #order-gift-fields{padding:12px}
 #orderpage legend,#orderpage #order-gift-fields legend{font-size:22px}
}