#df-cordons{width:min(100% - 40px,1180px);margin:36px auto 84px;color:#262322}
#df-cordons .cordon-breadcrumb{font-size:12px;line-height:1.4;letter-spacing:.08em;margin-bottom:24px}
#df-cordons .cordon-breadcrumb a{color:inherit}
#df-cordons .cordon-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,6vw,90px);align-items:start}
#df-cordons .cordon-photo{margin:0;background:#f5f5f5}
#df-cordons .cordon-photo img{display:block;width:100%;height:auto;aspect-ratio:1}
#df-cordons .cordon-info{padding:clamp(6px,3vw,38px) 0}
#df-cordons h1{font-family:"DF Gothic Titres",OffresGothic,Arial,sans-serif;font-size:clamp(27px,3.1vw,41px);font-weight:400;letter-spacing:.035em;line-height:1.14;margin:12px 0 14px}
#df-cordons .cordon-description{max-width:46ch;margin:0 0 22px;line-height:1.55;font-size:14px}
#df-cordons .cordon-label{font-size:12px;font-weight:600;margin-bottom:8px}
#df-cordons .cordon-select{width:min(100%,320px);margin:0 0 20px;position:relative;font-size:13px}
#df-cordons .cordon-select summary{min-height:42px;display:flex;align-items:center;gap:10px;list-style:none;cursor:pointer;background:#fff;border:1px solid #bcb6b2;padding:0 13px;box-sizing:border-box}
#df-cordons .cordon-select summary::-webkit-details-marker{display:none}
#df-cordons .cordon-select summary::after{content:"";margin-left:auto;width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-2px)}
#df-cordons .cordon-select[open] summary::after{transform:rotate(225deg)}
#df-cordons .cordon-dot{width:14px;height:14px;flex:none;border:1px solid #aaa39e;border-radius:50%;background:var(--swatch);box-sizing:border-box}
#df-cordons .cordon-options{position:absolute;z-index:5;top:100%;left:0;right:0;max-height:268px;overflow:auto;background:#fff;border:1px solid #bcb6b2;border-top:0;box-shadow:0 7px 20px #28221d1a;overscroll-behavior:contain}
#df-cordons .cordon-option{appearance:none;display:flex;align-items:center;gap:10px;border:0;background:#fff;color:inherit;font:inherit;text-align:left;width:100%;padding:9px 13px;cursor:pointer;box-sizing:border-box;min-height:36px}
#df-cordons .cordon-option:hover,#df-cordons .cordon-option[aria-pressed=true]{background:#f1eeea}
#df-cordons .cordon-option:focus-visible,#df-cordons summary:focus-visible{outline:1px solid #2b2725;outline-offset:-2px}
#df-cordons .cordon-cta{display:inline-flex;align-items:center;min-height:44px;border:1px solid #292423;padding:0 20px;color:#292423;text-decoration:none;font-size:13px}
@media(max-width:720px){#df-cordons{width:min(100% - 32px,520px);margin:23px auto 48px}#df-cordons .cordon-layout{grid-template-columns:1fr;gap:16px}#df-cordons .cordon-breadcrumb{margin-bottom:14px}}
#df-cordons .cordon-photo{position:relative;touch-action:pan-y pinch-zoom}
#df-cordons .cordon-photo img{user-select:none}
#df-cordons .cordon-views{position:absolute;inset:auto 0 8px;display:flex;justify-content:center;gap:0}
#df-cordons .cordon-view,#df-cordons .cordon-arrow{appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;padding:0}
#df-cordons .cordon-view{width:32px;height:40px}
#df-cordons .cordon-view::before{content:"";width:6px;height:6px;background:#b4b0ad;border-radius:50%}
#df-cordons .cordon-view[aria-pressed=true]::before{background:#292423;width:8px;height:8px}
#df-cordons .cordon-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px}
#df-cordons .cordon-arrow:first-of-type{left:6px}
#df-cordons .cordon-arrow:last-of-type{right:6px}
#df-cordons .cordon-arrow::before{content:"";width:8px;height:8px;border:solid currentColor;border-width:0 1px 1px 0;transform:rotate(-45deg)}
#df-cordons .cordon-arrow:first-of-type::before{transform:rotate(135deg)}
#df-cordons .cordon-arrow:hover{background:#ffffff80;border-radius:50%}
#df-cordons .cordon-info h1{margin-top:0}
#df-cordons .cordon-label{font:inherit;font-size:12px;letter-spacing:.03em;margin-bottom:5px}
#df-cordons .cordon-select{width:min(100%,310px);font:inherit;font-size:14px}
#df-cordons .cordon-select summary{border:0;border-bottom:1px solid #9b958e;background:transparent;min-height:44px;padding:0 8px 0 0;gap:11px}
#df-cordons .cordon-select summary:hover,#df-cordons .cordon-select[open] summary{border-bottom-color:#292423}
#df-cordons .cordon-dot{width:12px;height:12px;border-color:#26232238}
#df-cordons .cordon-options{top:calc(100% + 5px);border:1px solid #d9d5ce;border-radius:4px;box-shadow:0 8px 20px #28221d12;padding:4px;background:#fff}
#df-cordons .cordon-option{border-radius:2px;min-height:41px}
#df-cordons .cordon-option[aria-pressed=true]::after{content:"";margin-left:auto;width:8px;height:4px;border:solid currentColor;border-width:0 0 1px 1px;transform:rotate(-45deg)}
#df-cordons #cordon-status:empty{display:none}
@media(max-width:720px){#df-cordons .cordon-views{bottom:1px}}
