/* Kings & Queens - the checkout (on top of main.css): "The Showroom", layout 5 of the five Jeff compared (14-10-2026).
   The watch lit in a dark showroom on the left (a hero card on a phone), one page of paper on the right; WooCommerce's classic
   checkout names kept. Everything is scoped under .co / .co-*, plus body[data-page="checkout"] for the enclosed page. */

/* ---------- the page: the checkout is enclosed, so the site's header, footer and progress bar stand down ---------- */
body[data-page="checkout"] .hdr,
body[data-page="checkout"] .foot,
body[data-page="checkout"] .progress,
body[data-page="checkout"] .ct-drawer,
body[data-page="checkout"] .ct-scrim{display:none!important}
html.co-native .cursor{opacity:0;transition:opacity calc(var(--beat)*2) linear}   /* the crown cursor stays in the showroom; the paper gets the system's */
.admin-bar .co-hd{top:var(--wp-admin--admin-bar--height,32px)}                    /* signed in to WordPress: the head clears its bar */

.co{
  --co-card:#FFFDF9;
  --co-line:rgba(18,21,18,.085);
  --co-line2:rgba(18,21,18,.15);
  --co-field:rgba(18,21,18,.22);
  --co-bad:#9a3f2f;
  --co-lift:0 1px 2px rgba(13,26,19,.05),0 12px 30px -20px rgba(13,26,19,.3);
  --co-room:45%;
  --co-w:540px;                           /* the form's column */
  --co-hd:88px;                           /* the header's height */
  --co-nh:clamp(220px,calc(100vh - 590px),430px);   /* the niche's height on a wide screen: what the summary leaves */
  color:var(--ink);
}
.co [hidden]{display:none!important}
.co .co-sr,.co .screen-reader-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.co :focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.co-sprite{position:absolute;width:0;height:0;overflow:hidden}
.co svg.i{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
@media (pointer:fine){
  .co .co-desk,.co .co-hd-r,.co .co-paybar{cursor:auto}
  .co .co-desk a,.co .co-desk button,.co .co-desk label,.co .co-desk select,.co .co-hd-r a,.co .co-desk input[type=checkbox],.co .co-desk input[type=radio]{cursor:pointer}
  .co .co-desk .input-text{cursor:text}
}

/* ---------- the frame: showroom | desk ---------- */
.co-app{position:relative;display:grid;grid-template-columns:var(--co-room) minmax(0,1fr);min-height:100vh;background:var(--paper)}

/* the enclosed header: the wordmark over the dark, "Secure checkout" and help over the paper */
.co-hd{position:absolute;left:0;right:0;top:0;z-index:6;height:var(--co-hd);display:grid;grid-template-columns:var(--co-room) minmax(0,1fr);align-items:center;pointer-events:none}
.co-hd > *{pointer-events:auto}
.co-wm{justify-self:start;display:block;width:clamp(176px,13vw,232px);margin-left:var(--m);transition:opacity calc(var(--beat)*2) linear}
.co-wm img{display:block;width:100%;height:auto}
.co-wm:hover{opacity:.78}
.co-hd-r{justify-self:center;width:min(var(--co-w),calc(100% - var(--m)*2));display:flex;align-items:center;justify-content:space-between;gap:20px}
.co-secure{display:inline-flex;align-items:center;gap:10px;font:500 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--graphite)}
.co-secure svg.i{width:16px;height:16px;color:var(--bronze)}
.co-help{display:inline-flex;align-items:center;gap:18px;font:400 14px/1 var(--sans);color:var(--graphite)}
.co-help-q{color:var(--taupe)}
.co-help a{display:inline-flex;align-items:center;gap:7px;min-height:44px;color:var(--ink);transition:color calc(var(--beat)*2) linear}
.co-help a:hover{color:var(--bronze)}
.co-help svg.i{width:15px;height:15px;color:var(--bronze)}

/* ================= THE SHOWROOM ================= */
.co-room{position:relative;background:var(--hatton);color:var(--vellum)}              /* the dark runs the page's full height... */
.co-room-st{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate}   /* ...and the showroom stays in view */
/* a spotlight on the niche, a little garden green in the dark */
.co-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(58% 46% at 34% 40%,rgba(38,66,45,.78) 0,rgba(26,48,37,.38) 48%,transparent 78%)}
.co-glow:before{content:"";position:absolute;inset:0;background:url(../img/house-office.jpg) 30% center/cover no-repeat;filter:grayscale(1) contrast(1.15) brightness(.9);opacity:0;mix-blend-mode:luminosity;transition:opacity 1.2s linear}
.co-glow:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,26,19,.55),rgba(13,26,19,.25) 38%,rgba(13,26,19,.88));opacity:0;transition:opacity 1.2s linear}
.co-room-in{position:relative;height:100%;width:100%;max-width:720px;margin:0 auto;display:flex;flex-direction:column;justify-content:safe center;gap:clamp(18px,2.4vh,28px);padding:calc(var(--co-hd) + 4px) var(--m) clamp(24px,3.4vh,40px)}
.co-room.is-tall .co-room-in{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
.co-room.is-tall .co-room-in::-webkit-scrollbar{display:none}
.co-room-lab{color:var(--brass)}

/* the piece: the watch on its niche, its name, reference, details and price */
.co-piece{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(22px,2.2vw,40px)}
.co-room.is-reserve{--co-nh:clamp(200px,calc(100vh - 660px),400px)}
.co-room.is-multi{--co-nh:clamp(200px,calc(100vh - 720px),380px)}   /* more than one watch: the lines need the room */
.co-niche{position:relative;height:var(--co-nh);aspect-ratio:4/5;background:radial-gradient(120% 80% at 50% 8%,#fff 0,var(--vellum) 46%,var(--stone) 100%);box-shadow:0 60px 90px -50px rgba(0,0,0,.85),0 0 0 1px rgba(220,198,154,.14)}
.co-niche{margin:11px}
.co-niche:after{content:"";position:absolute;inset:-11px;border:1px solid rgba(220,198,154,.2);pointer-events:none}   /* the vitrine's frame */
/* the showroom's light passing over the glass: once on arrival, once as you pay */
.co-sheen{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.co-sheen:before{content:"";position:absolute;top:-25%;bottom:-25%;left:0;width:42%;background:linear-gradient(100deg,rgba(255,255,255,0) 0,rgba(255,255,255,.08) 30%,rgba(255,255,255,.62) 50%,rgba(255,255,255,.08) 70%,rgba(255,255,255,0) 100%);mix-blend-mode:soft-light;opacity:0;transform:translateX(-170%) skewX(-14deg)}
.co-sheen.go:before{animation:co-sheen 1.9s cubic-bezier(.45,0,.2,1) forwards}
@keyframes co-sheen{0%{opacity:0;transform:translateX(-170%) skewX(-14deg)}18%{opacity:1}82%{opacity:1}100%{opacity:0;transform:translateX(340%) skewX(-14deg)}}
.co-watch{position:absolute;inset:0;margin:auto;height:80%;width:auto;max-width:84%;object-fit:contain;filter:drop-shadow(0 22px 22px rgba(18,21,18,.22)) drop-shadow(0 6px 8px rgba(18,21,18,.12));will-change:transform}
.co-id{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
/* the house's mark: --h is the Rolex lockup's height (1.88:1); a wider mark is drawn shorter by the square root of how much wider it is,
   so the houses weigh alike (Richard Mille's 12:1 wordmark ~40% of the crown's height, 2.6x its width), and never past its column */
.co-brand{--h:clamp(30px,3.6vh,40px);display:block;height:calc(var(--h) / sqrt(var(--ar,1.8829) / 1.8829));aspect-ratio:var(--ar,1.8829);max-width:100%;background:var(--gilt);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:left center;mask-position:left center}
.co-brand.word{aspect-ratio:auto;height:auto;background:none;-webkit-mask:none;mask:none;font:500 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gilt)}
.co-name{display:block;margin-top:clamp(14px,1.8vh,20px);font:400 clamp(36px,3vw,50px)/1 var(--display);letter-spacing:-.014em;color:var(--vellum)}
.co-name em{display:block;margin-top:4px;font-size:.84em;color:var(--brass)}
.co-ref{display:block;margin-top:16px;font:400 11.5px/1.7 var(--mono);letter-spacing:.06em;color:var(--sage)}
.co-ref i{display:block;font-style:normal}
.co-facts{display:block;margin-top:clamp(12px,1.8vh,18px);font:400 14px/1.5 var(--sans);color:rgba(243,238,228,.82);text-wrap:balance}
.co-price{display:block;margin-top:clamp(14px,2vh,22px);font:400 clamp(26px,2.1vw,32px)/1 var(--display);letter-spacing:-.01em;color:var(--gilt);font-feature-settings:'lnum'}

/* the summary (always open on a wide screen) */
.co-sumtog{display:none}
.co-sum-in{display:flex;flex-direction:column;gap:clamp(14px,2vh,20px)}
.co-track{display:block;height:9px;opacity:.55;background:repeating-linear-gradient(90deg,rgba(220,198,154,.75) 0 1px,transparent 1px 60px) left bottom/100% 9px no-repeat,repeating-linear-gradient(90deg,rgba(220,198,154,.4) 0 1px,transparent 1px 12px) left bottom/100% 4px no-repeat}
.co-sum-facts{display:none}
.co .woocommerce-checkout-review-order-table{width:100%;border-collapse:collapse}
.co-room thead th{font-weight:400}
.co-lines:not(.is-multi){display:none}
.co-lines td{padding:8px 0;vertical-align:middle;font:400 14px/1.35 var(--sans);color:rgba(243,238,228,.8)}
.co-lines .product-total{text-align:right;white-space:nowrap}
.co-lines .product-quantity{font-weight:400;color:var(--sage)}
.co-oi{display:flex;align-items:center;gap:12px}
.co-thumb{position:relative;flex:none;width:40px;aspect-ratio:4/5;background:radial-gradient(120% 80% at 50% 8%,#fff 0,var(--vellum) 46%,var(--stone) 100%)}
.co-thumb img{position:absolute;inset:0;margin:auto;height:80%;width:auto;max-width:84%;object-fit:contain}
.co-room tfoot th{padding:7px 0;text-align:left;vertical-align:baseline;font:400 14.5px/1.35 var(--sans);color:rgba(243,238,228,.64)}
.co-room tfoot td{padding:7px 0;text-align:right;vertical-align:baseline;font:400 15px/1.35 var(--sans);color:var(--vellum);font-feature-settings:'tnum'}
.co-code{display:block;margin-top:3px;font:400 11px/1.3 var(--mono);letter-spacing:.06em;color:var(--sage)}
.woocommerce-remove-coupon{margin-left:10px;font:500 11px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brass);transition:color calc(var(--beat)*2) linear}
.woocommerce-remove-coupon:hover{color:var(--gilt)}
.co-free{color:var(--gilt)}
.co-shipnote{display:block;margin-top:2px;font-size:12.5px;color:var(--sage)}
.co-room .order-total > *{padding-top:16px;border-top:1px solid rgba(243,238,228,.14)}
.co-room .order-total th{color:var(--vellum);font-weight:500;vertical-align:middle}
.co-room .order-total td{font:400 clamp(30px,2.4vw,38px)/1 var(--display);letter-spacing:-.012em;font-feature-settings:'lnum'}
.co-room .order-total strong{font-weight:400}
/* a reservation: what is paid today leads */
.co-room .awcdp-due-today > *{padding-top:14px}
.co-room .awcdp-due-today th{color:var(--gilt);font-weight:500}
.co-room .awcdp-due-today td{font:400 clamp(28px,2.2vw,34px)/1 var(--display);color:var(--gilt)}
.co-room.is-reserve .order-total td{font:400 20px/1 var(--display)}
.co-room.is-reserve .order-total th{font-weight:400;color:rgba(243,238,228,.75)}

/* when it arrives (or where to collect it, or the reservation) */
.co-when{display:flex;align-items:flex-start;gap:14px;padding:15px 18px;border-radius:14px;background:rgba(243,238,228,.045);box-shadow:inset 0 0 0 1px rgba(220,198,154,.17)}
.co-when svg.i{width:22px;height:22px;margin-top:1px;color:var(--gilt)}
.co-when p{min-width:0}
.co-when p > b{display:block;font:500 15.5px/1.3 var(--sans);color:var(--vellum)}
.co-when p > span{display:block;margin-top:4px;font:400 13.5px/1.5 var(--sans);color:rgba(243,238,228,.66)}
.co-when p > span b{font-weight:500;color:var(--gilt)}
.co-when .co-where{display:block;margin-top:8px;font:400 11px/1.55 var(--mono);letter-spacing:.04em;color:var(--sage)}

.co-assure{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px}
.co-assure li{display:flex;align-items:center;gap:11px;font:400 13.5px/1.35 var(--sans);color:rgba(243,238,228,.8)}
.co-assure li b{font-weight:500;color:var(--vellum)}
.co-assure svg.i{width:17px;height:17px;color:var(--brass)}
.co-assure a{display:inline-flex;align-items:center;gap:11px;transition:color calc(var(--beat)*2) linear}
.co-assure a:hover{color:var(--gilt)}
/* a short screen keeps the essentials: the piece, the totals, when, and the reassurances */
@media (max-height:860px) and (min-width:1100px){ .co-track,.co-room-lab,.co-when .co-where{display:none} .co-assure{gap:9px 22px} }

/* the reservation: the showroom itself shows through the dark */
.co-room.is-reserve .co-glow:before{opacity:.13}
.co-room.is-reserve .co-sale,.co-desk.is-reserve .co-sale{display:none}   /* a non-refundable deposit: no delivery or returns promises beside it */
.co-room.is-reserve .co-glow:after{opacity:1}

/* ================= THE DESK ================= */
.co-desk{position:relative;min-width:0;display:flex;flex-direction:column;padding:calc(var(--co-hd) + 14px) var(--m) 0}
/* the foot: the site's company line and two policies; its distance lets the payment step scroll to the top */
.co-ft{width:min(var(--co-w),100%);margin:clamp(90px,30vh,320px) auto 0;padding:22px 0 30px;border-top:1px solid var(--co-line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font:400 10.5px/1.6 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--taupe)}
.co-ft nav{display:flex;gap:20px}
.co-ft a{transition:color calc(var(--beat)*2) linear}
.co-ft a:hover{color:var(--ink)}
.co-flow,.co-done{flex:none}
.co-flow,.co-done{width:min(var(--co-w),100%);margin:0 auto}

/* express first */
.co-xp-h{margin-bottom:14px;text-align:center;font:500 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--graphite)}
.co-xp-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.co-xp{display:flex;align-items:center;justify-content:center;gap:5px;height:54px;border-radius:12px;background:#000;color:#fff;font:500 21px/1 -apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif;letter-spacing:-.01em;transition:transform calc(var(--beat)*2) var(--sweep),box-shadow calc(var(--beat)*2) linear}
.co-xp:hover{transform:translateY(-1px);box-shadow:0 14px 26px -16px rgba(0,0,0,.55)}
.co-xp:active{transform:translateY(0)}
.co-apple svg{width:19px;height:23px;margin-top:-5px}
.co-gpay svg{width:21px;height:21px;margin-right:3px}
.co-gpay span{color:#fff}
.co-or{display:flex;align-items:center;gap:16px;margin-top:26px;font:400 13px/1 var(--sans);color:var(--taupe)}
.co-or:before,.co-or:after{content:"";flex:1;height:1px;background:var(--co-line2)}

/* the steps: I Contact, II Delivery, III Payment */
.co-step{margin-top:44px;padding-top:44px;border-top:1px solid var(--co-line)}
#co-contact{margin-top:30px;padding-top:0;border-top:0}
.co-sh{display:flex;flex-wrap:wrap;align-items:last baseline;justify-content:space-between;gap:10px 18px;margin-bottom:22px}
.co-h{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font:400 clamp(28px,2.1vw,32px)/1.05 var(--display);letter-spacing:-.012em;color:var(--ink)}
/* the house's step device: roman numerals, "I / III" as the homepage's progress counts its chapters */
.co-n{font:400 11px/1 var(--mono);letter-spacing:.14em;color:var(--bronze)}
.co-step .co-n:after{content:" / III";color:var(--taupe)}
.co-login-q{font-size:14px;color:var(--graphite)}
.co-login-q a,.co .co-a{color:var(--bronze);transition:color calc(var(--beat)*2) linear}
.co-login-q a:hover,.co .co-a:hover{color:var(--ink)}
.co-who{display:inline-flex;align-items:center;gap:10px;font-size:14px;color:var(--graphite)}
.co-who b{font-weight:500;color:var(--ink)}
.co-av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--hatton);color:var(--gilt);font:400 12px/1 var(--display);letter-spacing:.04em}
.co-stripe{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--graphite)}
.co-stripe svg.i{width:15px;height:15px;color:var(--bronze)}

/* fields: WooCommerce's rows, labels above boxed fields (the account pages' standard) */
.co .form-row{position:relative;display:flex;flex-direction:column;gap:8px;margin:0 0 18px}
.co label{font:500 14px/1.3 var(--sans);color:var(--ink)}
.co .required{text-decoration:none;border:0;color:var(--bronze);font-weight:500}
.co .optional{font-weight:400;color:var(--taupe)}
.co .woocommerce-input-wrapper{position:relative;display:block}
.co .input-text,.co select{display:block;width:100%;height:56px;padding:0 16px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--co-field);font:400 16px/1.2 var(--sans);color:var(--ink);transition:box-shadow calc(var(--beat)*2) linear,background-color calc(var(--beat)*2) linear}
.co textarea.input-text{height:auto;min-height:104px;padding:15px 16px;line-height:1.5;resize:vertical}
.co .input-text::placeholder{color:var(--taupe);opacity:1}
.co .input-text:hover,.co select:hover{box-shadow:inset 0 0 0 1px rgba(18,21,18,.38)}
.co .input-text:focus,.co select:focus{outline:none;box-shadow:inset 0 0 0 1px var(--brass),0 0 0 4px rgba(184,153,95,.2)}
.co .woocommerce-input-wrapper.co-short{max-width:240px}
.co-select select{appearance:none;-webkit-appearance:none;padding-right:48px;cursor:pointer}
.co-select svg.i{position:absolute;right:16px;top:50%;width:18px;height:18px;margin-top:-9px;pointer-events:none;color:var(--graphite)}
/* a field that checks out: a quiet tick; one that does not: ringed, with one line under it */
.co .woocommerce-validated:not(.co-nt) > .woocommerce-input-wrapper:not(.co-select):not(.co-ccw):after{content:"";position:absolute;right:15px;top:50%;width:18px;height:18px;margin-top:-9px;pointer-events:none;background:var(--heritage);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.co .woocommerce-validated > .woocommerce-input-wrapper:not(.co-select) .input-text{padding-right:44px}
.co .woocommerce-invalid .input-text,.co .woocommerce-invalid select{background:#FFFCFA;box-shadow:inset 0 0 0 1.5px var(--co-bad),0 0 0 4px rgba(180,83,63,.09)}
.co .woocommerce-invalid .input-text:focus{box-shadow:inset 0 0 0 1.5px var(--co-bad),0 0 0 4px rgba(180,83,63,.16)}
.co .woocommerce-invalid > label{color:var(--co-bad)}
.checkout-inline-error-message{display:flex;align-items:flex-start;gap:7px;font:400 13.5px/1.4 var(--sans);color:var(--co-bad)}
.checkout-inline-error-message svg.i{flex:none;width:15px;height:15px;margin-top:1px}
.checkout-inline-error-message strong{font-weight:500}

/* first and last name side by side; everything else in one column */
.co-addr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
.co-addr > *{grid-column:1 / -1}
.co-addr > .form-row-first{grid-column:1}
.co-addr > .form-row-last{grid-column:2}

/* links that open a field (address line 2, notes, the coupon): never underlined, a plus or an icon instead */
.co .co-a{display:inline-flex;align-items:center;gap:8px;min-height:32px;font:500 14.5px/1.3 var(--sans);text-align:left}
.co .co-a svg.i{width:16px;height:16px}
.co-more{margin:-6px 0 16px}
.co-reveal{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows calc(var(--beat)*4) var(--sweep),opacity calc(var(--beat)*2) linear,visibility 0s linear calc(var(--beat)*4)}
.co-reveal.open{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows calc(var(--beat)*4) var(--sweep),opacity calc(var(--beat)*3) linear calc(var(--beat)*1)}
.co-reveal-in{min-height:0;overflow:hidden;margin:0 -6px;padding:0 6px}
.co-reveal.open .co-reveal-in{padding-top:6px;margin-top:-6px}
html.static .co-reveal{transition:none}

/* the login (woocommerce_login_form), opened from "Click here to login" */
.co-login{margin-bottom:24px;padding:20px 20px 4px;border-radius:14px;background:var(--co-card);box-shadow:inset 0 0 0 1px var(--co-line2)}
.co-login-go{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:4px 0 16px}
.co .co-login-go .btn{height:52px;padding:0 28px;border-radius:12px}
/* the saved (signed-in) contact and address, shown as a line with Change */
.co-saved{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 18px;border-radius:12px;background:var(--co-card);box-shadow:inset 0 0 0 1px var(--co-line2);font-size:15px;line-height:1.55;color:var(--ink)}
.co-saved span{color:var(--graphite)}
.co-edit{flex:none;font:500 12px/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);min-height:28px;transition:color calc(var(--beat)*2) linear}
.co-edit:hover{color:var(--ink)}
.co-step.is-saved [data-fields]{display:none}

/* ticks */
.co-tick label,.co .woocommerce-SavedPaymentMethods-saveNew label{display:inline-flex;align-items:center;gap:12px;min-height:44px;font:400 15px/1.35 var(--sans);color:var(--ink)}
.co input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:none;display:inline-grid;place-items:center;width:22px;height:22px;margin:0;border-radius:6px;background:#fff;box-shadow:inset 0 0 0 1px var(--co-field);transition:background-color calc(var(--beat)*2) linear,box-shadow calc(var(--beat)*2) linear}
.co input[type=checkbox]:hover{box-shadow:inset 0 0 0 1px rgba(18,21,18,.45)}
.co input[type=checkbox]:checked{background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23DCC69A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:none}
.co input[type=checkbox]:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.woocommerce-account-fields{margin-top:-4px}
.woocommerce-account-fields .form-row{margin:0}

/* II: Deliver | Collect, a sliding switch over WooCommerce's shipping-method radios */
.co-seg{position:relative;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:5px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--co-field)}
.co-seg.is-single{grid-template-columns:minmax(0,1fr)}
.co-seg li{position:relative;z-index:1}
.co-seg input{position:absolute;opacity:0;pointer-events:none}
.co-seg label{display:flex;align-items:center;justify-content:center;gap:10px;height:50px;border-radius:10px;font:500 15px/1 var(--sans);color:var(--graphite);transition:color calc(var(--beat)*3) linear}
.co-seg label:hover{color:var(--ink)}
.co-seg svg.i{width:19px;height:19px}
.co-seg input:checked + label{color:var(--vellum)}
.co-seg input:focus-visible + label{outline:2px solid var(--brass);outline-offset:3px}
.co .co-seg-thumb{position:absolute;z-index:0;left:5px;top:5px;bottom:5px;width:calc(50% - 5px);border-radius:10px;background:var(--ink);box-shadow:0 8px 18px -10px rgba(13,26,19,.6);transition:transform calc(var(--beat)*4) var(--sweep)}
.co-seg[data-on="1"] .co-seg-thumb{transform:translateX(100%)}
.co-seg.is-single .co-seg-thumb{width:calc(100% - 10px);transform:none}
.co-method{display:grid;gap:4px;margin-top:14px;padding:14px 18px 15px;border-radius:12px;background:var(--vellum)}
.co-m-t{font:500 15px/1.4 var(--sans);color:var(--ink)}
.co-m-t .co-fr{float:right;margin-left:12px;font:500 11px/21px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--bronze)}
.co-m-s{font:400 13.5px/1.5 var(--sans);color:var(--graphite)}
.co-m-s b{font-weight:500;color:var(--heritage)}
.co-subh{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin:36px 0 18px}
.co-sub{font:400 23px/1.1 var(--display);color:var(--ink)}
.co-subhint{font-size:13.5px;color:var(--graphite)}

/* the shipping fields, the notes and the coupon (col-2) continue the Delivery step */
.woocommerce-shipping-fields{margin-top:2px}
#ship-to-different-address{font:inherit}
.woocommerce-shipping-fields .co-reveal.open .co-reveal-in{padding-top:18px}
.co-extras{display:grid;gap:2px;margin-top:10px}
.co-extras .co-more{margin:0}
.woocommerce-form-coupon-toggle .woocommerce-info{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;min-height:32px;font-size:14.5px;color:var(--graphite)}
.woocommerce-form-coupon-toggle .woocommerce-info > svg.i{width:16px;height:16px;color:var(--bronze)}
.woocommerce-form-coupon-toggle .co-a{min-height:0}
#co-notes .co-reveal-in,#co-coupon .co-reveal-in{padding-top:12px}
.co-cp-lead{margin-bottom:12px;font-size:14px;color:var(--graphite)}
.co-cp-row{display:flex;gap:10px}
.co-cp-row .woocommerce-input-wrapper{flex:1;min-width:0}
.co-cp-row .btn{height:56px;padding:0 22px;border-radius:12px;flex:none}
.co-cp-ok{display:flex;align-items:center;gap:10px;margin-top:8px;padding:12px 16px;border-radius:12px;background:rgba(38,66,45,.07);font-size:14.5px;color:var(--heritage)}
.co-cp-ok svg.i{width:17px;height:17px}
.co-cp-ok button{margin-left:auto;font:500 11.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--bronze)}
.co-cp-ok button:hover{color:var(--ink)}

/* III: Stripe, in its box */
.wc_payment_methods{list-style:none}
.wc_payment_method{padding:22px 22px 6px;border-radius:18px;background:var(--co-card);box-shadow:var(--co-lift),inset 0 0 0 1px var(--co-line)}
.wc_payment_methods{display:grid;gap:12px}
.wc_payment_method{position:relative}
.wc_payment_method > .input-radio{position:absolute;opacity:0;pointer-events:none}
.wc_payment_method > label{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px;font:400 23px/1.1 var(--display);color:var(--ink)}
/* more than one way to pay: a radio before each title */
.wc_payment_methods:has(> li + li) .wc_payment_method > label{position:relative;padding-left:34px;cursor:pointer}
.wc_payment_methods:has(> li + li) .wc_payment_method > label:before{content:"";position:absolute;left:0;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--co-field);transition:box-shadow calc(var(--beat)*2) var(--sweep)}
.wc_payment_methods:has(> li + li) .wc_payment_method > .input-radio:checked + label:before{box-shadow:inset 0 0 0 6px var(--ink)}
.wc_payment_method > .input-radio:focus-visible + label{outline:2px solid var(--brass);outline-offset:3px}
.payment_box{padding-bottom:16px}
.payment_box p{font-size:14.5px;line-height:1.6;color:var(--graphite)}
.co-marks{display:flex;gap:6px}
.co-mk{display:inline-grid;place-items:center;flex:none;height:24px;min-width:38px;padding:0 6px;border-radius:5px;background:#fff;box-shadow:inset 0 0 0 1px var(--co-line2);font:800 9.5px/1 var(--sans);font-style:normal;letter-spacing:.06em;color:var(--ink)}
.co-mk.visa{color:#1a1f71;font-style:italic;font-size:10px}
.co-mk.amex{background:#2e77bc;color:#fff;box-shadow:none}
.co-mk.mc{grid-auto-flow:column;gap:0}
.co-mk.mc b{width:12px;height:12px;border-radius:50%;background:#eb001b}
.co-mk.mc b + b{margin-left:-5px;background:#f79e1b;mix-blend-mode:multiply}
.co-mk-new{color:var(--bronze)} .co-mk-new svg.i{width:14px;height:14px}
.payment_box{position:relative}
.wc-credit-card-form{border:0;padding:0;margin:0;min-width:0}
.co-ccw .input-text{padding-right:64px;font-variant-numeric:tabular-nums;letter-spacing:.03em}
.co-ccb{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;color:var(--taupe);pointer-events:none}
.co-ccb svg.i{width:22px;height:22px}
.co-cardrow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.co-cardrow .input-text{font-variant-numeric:tabular-nums}
.woocommerce-SavedPaymentMethods{list-style:none;display:grid;gap:10px;margin-bottom:18px}
.woocommerce-SavedPaymentMethods li{position:relative}
.woocommerce-SavedPaymentMethods input{position:absolute;opacity:0;pointer-events:none}
.woocommerce-SavedPaymentMethods label{position:relative;display:flex;align-items:center;gap:14px;min-height:58px;padding:10px 16px 10px 50px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--co-field);font:400 15.5px/1.3 var(--sans)!important;color:var(--ink);transition:box-shadow calc(var(--beat)*2) linear}
.woocommerce-SavedPaymentMethods label:before{content:"";position:absolute;left:17px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--co-field);transition:box-shadow calc(var(--beat)*2) var(--sweep)}
.woocommerce-SavedPaymentMethods input:checked + label{box-shadow:inset 0 0 0 1.5px var(--ink)}
.woocommerce-SavedPaymentMethods input:checked + label:before{box-shadow:inset 0 0 0 6px var(--ink)}
.woocommerce-SavedPaymentMethods input:focus-visible + label{outline:2px solid var(--brass);outline-offset:3px}
.co-cardfields.is-off{display:none}
.woocommerce-SavedPaymentMethods small{display:block;margin-top:2px;font-size:13px;color:var(--graphite)}
.woocommerce-SavedPaymentMethods-saveNew{margin-top:-6px!important}

/* the button, the privacy line, the reassurances */
.co .place-order{margin:26px 0 0}
.woocommerce-privacy-policy-text p{font-size:13px;line-height:1.6;color:var(--graphite)}
.woocommerce-privacy-policy-text a{color:var(--bronze);transition:color calc(var(--beat)*2) linear}
.woocommerce-privacy-policy-text a:hover{color:var(--ink)}
.co .co-place{width:100%;height:64px;margin-top:18px;border-radius:12px;gap:12px;font-size:14px;letter-spacing:.12em}
.co-place svg.i{width:17px;height:17px}
.btn.co-place:hover svg.i{transform:none}
.co-pbar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--hatton);transform:scaleX(0);transform-origin:left}
.co-place.busy{pointer-events:none}
.co-place.busy .co-pbar{transform:scaleX(1);transition:transform 1.2s cubic-bezier(.4,0,.2,1)}
.co-place.busy:before{transform:scaleX(1);transform-origin:left}
.co .co-assure-pay{display:none;margin-top:22px;gap:12px 18px}   /* a wide screen has them in the showroom, beside the button */
.co-assure-pay li{font-size:13px;color:var(--graphite)}
.co-assure-pay li b{color:var(--ink)}
.co-assure-pay svg.i{color:var(--bronze)}
.co-assure-pay a:hover{color:var(--ink)}
.co-nw{white-space:nowrap}

/* the error notice (WooCommerce's woocommerce-error, after Pay): the fields to look at, each a link */
.woocommerce-NoticeGroup-checkout{margin-bottom:30px}
.co-errs{display:flex;align-items:flex-start;gap:14px;padding:18px 20px;border-radius:14px;background:#FBF0EA;box-shadow:inset 0 0 0 1px rgba(154,63,47,.26)}
.co-errs:focus{outline:none}
.co-errs > svg.i{flex:none;width:21px;height:21px;margin-top:1px;color:var(--co-bad)}
.co-errs-t{font:500 15.5px/1.35 var(--sans);color:var(--co-bad)}
.co-errs-s{margin-top:6px;font-size:13.5px;line-height:1.5;color:#6d3a2c}
.co-errs ul{list-style:none;margin-top:5px;font-size:14px;line-height:1.6;color:#6d3a2c}
.co-errs li{display:inline}
.co-errs li:not(:last-child):after{content:"\00A0\00B7  ";color:rgba(154,63,47,.45)}
.co-errs li a{color:#6d3a2c;font-weight:500;white-space:nowrap;transition:color calc(var(--beat)*2) linear}
.co-errs li a:hover{color:var(--co-bad)}

/* processing: the pay button fills; the niche is lit a touch brighter */
.co-app.is-busy .co-niche{box-shadow:0 60px 90px -50px rgba(0,0,0,.85),0 0 0 1px rgba(220,198,154,.4),0 0 70px -10px rgba(220,198,154,.25);transition:box-shadow .8s linear}

/* ================= ORDER RECEIVED ================= */
.co-done{padding-top:6px}
.co-done:focus{outline:none}
.co-seal{display:block;width:58px;height:58px;color:var(--bronze)}
.co-seal svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.co-seal-r{stroke-width:1.1;opacity:.55}
.co-seal-t{stroke-width:1.8}
.co-dh .lab{margin-top:26px;color:var(--bronze)}
.co-dt{margin-top:14px;font:400 clamp(40px,3.5vw,58px)/1.02 var(--display);letter-spacing:-.016em;color:var(--ink)}
.co-dt em{display:block;margin-top:6px;font-size:.62em;line-height:1.1;color:var(--bronze);text-wrap:balance}
.woocommerce-order-overview{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:34px;border-radius:16px;background:var(--co-card);box-shadow:var(--co-lift),inset 0 0 0 1px var(--co-line);overflow:hidden}
.woocommerce-order-overview li{display:flex;flex-direction:column;gap:7px;min-width:0;padding:17px 20px;box-shadow:inset -1px -1px 0 var(--co-line)}
.woocommerce-order-overview li:nth-child(2n){box-shadow:inset 0 -1px 0 var(--co-line)}
.woocommerce-order-overview li.email{grid-column:1 / -1;box-shadow:inset 0 -1px 0 var(--co-line)}
.woocommerce-order-overview li.method{box-shadow:none}
.woocommerce-order-overview li.total{box-shadow:inset -1px 0 0 var(--co-line)}
.woocommerce-order-overview li > span{font:500 10.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--taupe)}
.woocommerce-order-overview strong{font:500 15.5px/1.35 var(--sans);color:var(--ink);overflow-wrap:anywhere}
.woocommerce-order-overview .order strong{font:400 15px/1.35 var(--mono);letter-spacing:.04em}
.woocommerce-order-overview .total strong{font:400 22px/1.1 var(--display)}
.co-next{margin-top:36px}
.co-next ol{list-style:none;display:grid;gap:0;border-top:1px solid var(--co-line)}
.co-next li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:4px 12px;padding:18px 0;border-bottom:1px solid var(--co-line)}
.co-next .co-n{grid-row:1 / span 2;padding-top:3px}
.co-next b{font:500 15.5px/1.35 var(--sans);color:var(--ink)}
.co-next p{font-size:14.5px;line-height:1.55;color:var(--graphite)}
.co-next p a{color:var(--bronze);transition:color calc(var(--beat)*2) linear}
.co-next p a:hover{color:var(--ink)}
.co-next .co-where{display:block;margin-top:4px;font:400 11px/1.6 var(--mono);letter-spacing:.04em;color:var(--taupe)}
.co-dsub{font:400 25px/1.1 var(--display);color:var(--ink)}
.woocommerce-order-details{margin-top:40px}
.woocommerce-table--order-details{width:100%;margin-top:16px;border-collapse:collapse}
.woocommerce-table--order-details td,.woocommerce-table--order-details th{padding:12px 0;border-top:1px solid var(--co-line);text-align:left;vertical-align:middle;font:400 15px/1.4 var(--sans);color:var(--ink)}
.woocommerce-table--order-details tfoot th{font-weight:400;color:var(--graphite)}
.woocommerce-table--order-details td:last-child{text-align:right}
.woocommerce-table--order-details tbody td{padding:14px 0}
.woocommerce-table--order-details .product-name a{color:var(--ink);transition:color calc(var(--beat)*2) linear}
.woocommerce-table--order-details .product-name a:hover{color:var(--bronze)}
.woocommerce-table--order-details .product-quantity{font-weight:400;color:var(--taupe)}
.woocommerce-table--order-details .co-thumb{width:52px;border-radius:6px;overflow:hidden}
.woocommerce-table--order-details tr.co-big > *{font:400 22px/1.1 var(--display)}
.woocommerce-customer-details{margin-top:36px}
.woocommerce-customer-details address{margin-top:14px;font-style:normal;font-size:15.5px;line-height:1.7;color:var(--ink)}
.woocommerce-customer-details address p{color:var(--graphite)}
.co-save{margin-top:40px;padding:24px;border-radius:18px;background:var(--vellum)}
.co-save-in > p:not(.form-row){margin:8px 0 16px;font-size:14.5px;line-height:1.55;color:var(--graphite)}
.co-save-in > p b{font-weight:500;color:var(--ink)}
.co-save .form-row{margin:0}
.co-save .co-cp-ok{margin-top:0}
.co-back{margin-top:34px}
.co-back .co-a svg.i{transition:transform calc(var(--beat)*3) var(--sweep)}
.co-back .co-a:hover svg.i{transform:translateX(4px)}
/* the showroom, once paid: the order's number, the room says when */
.co-app.is-done .co-paybar,.co-app.is-done .woocommerce-remove-coupon{display:none}

/* ================= WOOCOMMERCE'S OWN MARKUP, AS THE THEME DRAWS IT ================= */
/* address line 2 folds away in its own row (WooCommerce's address script sorts the rows by priority); its link sits in line 1's */
.co .form-row > .co-more{display:block;margin:0}
.co .form-row.co-fold{display:grid;grid-template-rows:0fr;gap:0;margin-bottom:0;opacity:0;visibility:hidden;transition:grid-template-rows calc(var(--beat)*4) var(--sweep),margin-bottom calc(var(--beat)*4) var(--sweep),opacity calc(var(--beat)*2) linear,visibility 0s linear calc(var(--beat)*4)}
.co .form-row.co-fold.open{grid-template-rows:1fr;margin-bottom:18px;opacity:1;visibility:visible;transition:grid-template-rows calc(var(--beat)*4) var(--sweep),margin-bottom calc(var(--beat)*4) var(--sweep),opacity calc(var(--beat)*3) linear calc(var(--beat)*1)}
.co-fold-in{min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:8px;margin:0 -6px;padding:0 6px}
.co-fold.open .co-fold-in{margin-top:-6px;margin-bottom:-6px;padding-top:6px;padding-bottom:6px}
html.static .co .form-row.co-fold{transition:none}
/* a country with states: WooCommerce's script makes the county a select, boxed like the country's */
.co select.state_select{appearance:none;-webkit-appearance:none;padding-right:48px;cursor:pointer;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2354524B' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 16px center/18px no-repeat}
/* no way to send it there (an address WooCommerce cannot place) */
.co-seg.is-none{display:block;padding:14px 18px}
.co-noship{font-size:14.5px;line-height:1.5;color:var(--graphite)}
/* WooCommerce's refreshes: no white veil; the showroom's figures dim while they are out */
.co .blockUI.blockOverlay{background:transparent!important;opacity:1!important}
.co-room .woocommerce-checkout-review-order-table{transition:opacity calc(var(--beat)*3) linear}
.co-room.is-updating .woocommerce-checkout-review-order-table{opacity:.5}
.co [aria-busy="true"]:not(.co-place){opacity:.6;pointer-events:none}
/* WooCommerce's notices (a sign-in that failed, a refusal from the server) */
.co .woocommerce-error{list-style:none;display:grid;gap:4px;margin-bottom:24px;padding:16px 20px;border-radius:14px;background:#FBF0EA;box-shadow:inset 0 0 0 1px rgba(154,63,47,.26);font-size:14.5px;line-height:1.5;color:#6d3a2c}
.co .co-errs .woocommerce-error{display:block;margin:5px 0 0;padding:0;border-radius:0;background:none;box-shadow:none;font-size:14px;line-height:1.6}
.co .woocommerce-message,.co .woocommerce-notices-wrapper .woocommerce-info,.co-plain .woocommerce-info{margin-bottom:24px;padding:16px 20px;border-radius:14px;background:rgba(38,66,45,.07);font-size:14.5px;line-height:1.5;color:var(--heritage)}
.co .woocommerce-error a,.co .woocommerce-message a,.co .woocommerce-info a{color:var(--bronze);transition:color calc(var(--beat)*2) linear}
.co .woocommerce-error a:hover,.co .woocommerce-message a:hover,.co .woocommerce-info a:hover{color:var(--ink)}
.co-errs ul.is-full li{display:block}
.co-errs ul.is-full li:not(:last-child):after{content:none}
.co-errs ul.is-full li a{font-weight:400;white-space:normal}
/* order received: the gateway's own words (a bank transfer's instructions and account) */
.co-paynote{margin-top:36px;padding:22px 22px 8px;border-radius:16px;background:var(--co-card);box-shadow:var(--co-lift),inset 0 0 0 1px var(--co-line)}
.co-paynote p{margin-bottom:14px;font-size:14.5px;line-height:1.6;color:var(--graphite)}
.co-paynote h2,.co-paynote h3{margin-bottom:12px;font:400 23px/1.1 var(--display);color:var(--ink)}
.co-paynote h3{font:500 14px/1.3 var(--sans)}
.co-paynote ul{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;margin-bottom:16px}
.co-paynote li{font:500 10.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--taupe)}
.co-paynote li strong{display:block;margin-top:5px;font:400 15px/1.35 var(--mono);letter-spacing:.04em;text-transform:none;color:var(--ink);overflow-wrap:anywhere}
/* WooCommerce's other pages in the checkout's frame (paying an order's balance, a guest's email check): paper, the head and foot */
.co-app.co-plain{grid-template-columns:minmax(0,1fr)}
.co-plain .co-hd{grid-template-columns:minmax(0,1fr) auto;padding:0 var(--m)}
.co-plain .co-wm{margin-left:0}
.co-plain .co-hd-r{justify-self:end;width:auto}
.co-plain .co-flow{padding-top:20px}
.co-plain .shop_table{width:100%;margin-bottom:28px;border-collapse:collapse}
.co-plain .shop_table th,.co-plain .shop_table td{padding:12px 0;border-top:1px solid var(--co-line);text-align:left;vertical-align:middle;font:400 15px/1.4 var(--sans);color:var(--ink)}
.co-plain .shop_table td:last-child,.co-plain .shop_table th:last-child{text-align:right}
.co-plain .shop_table tfoot th{font-weight:400;color:var(--graphite)}
.co-plain .button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:12px;background:var(--ink);color:var(--vellum);font:500 13px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.co-plain #place_order{width:100%;height:64px;margin-top:18px;background:var(--brass);color:var(--hatton)}
.co-plain p{margin-bottom:14px;font-size:15px;line-height:1.6;color:var(--graphite)}

/* ---------- the toast (prototype notes) ---------- */
.co-toast{position:fixed;left:50%;bottom:28px;z-index:85;max-width:min(92vw,440px);padding:13px 18px;border-radius:12px;background:var(--hatton);color:var(--vellum);font:400 14px/1.45 var(--sans);box-shadow:0 24px 50px -24px rgba(0,0,0,.7),inset 0 0 0 1px rgba(220,198,154,.2);opacity:0;transform:translate(-50%,16px);pointer-events:none;transition:opacity calc(var(--beat)*2) linear,transform calc(var(--beat)*4) var(--sweep)}
.co-toast.on{opacity:1;transform:translate(-50%,0)}
.co-paybar{display:none}

/* ================= TABLET AND PHONE: the showroom becomes a hero card at the top ================= */
@media (max-width:1099px){
  .co{--co-hd:62px}
  .co-app{display:block}
  .co-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--co-hd);padding:0 max(16px,var(--m))}
  .co-wm{width:150px;margin:0}
  .co-hd-r{width:auto;justify-self:auto;gap:6px}
  .co-secure{gap:8px;color:rgba(243,238,228,.78);font-size:10.5px}
  .co-secure svg.i{color:var(--gilt)}
  .co-help{gap:0}
  .co-help-q,.co-help a span{display:none}
  .co-help a{justify-content:center;width:44px;height:44px;color:var(--vellum)}
  .co-help svg.i{width:19px;height:19px;color:var(--gilt)}
  .co-room-st{position:relative;height:auto;overflow:visible}
  .co-ft{margin-top:72px;flex-direction:column}
  .co-room-in{max-width:640px;height:auto;justify-content:flex-start;gap:0;padding:calc(var(--co-hd) + 6px) max(16px,var(--m)) 0}
  .co-room-lab{display:none}
  .co-glow{background:radial-gradient(70% 70% at 22% 46%,rgba(38,66,45,.8) 0,rgba(26,48,37,.3) 55%,transparent 85%)}
  .co-piece{gap:20px;padding-bottom:20px}
  .co-niche{height:148px;margin:7px}
  .co-niche:after{inset:-7px}
  .co-brand{--h:26px}
  .co-name{margin-top:12px;font-size:31px}
  .co-name em{display:inline;margin:0 0 0 2px;font-size:.84em}
  .co-ref{margin-top:10px;font-size:10.5px}
  .co-facts,.co-price{display:none}
  .co-sumtog{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:58px;border-top:1px solid rgba(243,238,228,.12);color:var(--vellum)}
  .co-st-l{display:inline-flex;align-items:center;gap:7px;font:500 11.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--gilt);white-space:nowrap}
  .co-st-l svg.i{width:17px;height:17px;transition:transform calc(var(--beat)*3) var(--sweep)}
  .co-st-b{display:none}
  .co-room.open .co-st-a{display:none}
  .co-room.open .co-st-b{display:inline}
  .co-room.open .co-st-l svg.i{transform:rotate(180deg)}
  .co-st-t{display:grid;justify-items:end;gap:4px;font:400 25px/1 var(--display);letter-spacing:-.01em;font-feature-settings:'lnum';white-space:nowrap}
  .co-st-t small{font:500 10px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--sage)}
  .co-sum{display:grid;grid-template-rows:0fr;transition:grid-template-rows calc(var(--beat)*4) var(--sweep)}
  .co-room.open .co-sum{grid-template-rows:1fr}
  .co-sum-in{min-height:0;overflow:hidden;gap:18px}
  .co-room.open .co-sum-in{padding-bottom:24px}
  .co-sum-in > :first-child{margin-top:4px}
  .co-track{display:none}
  .co-sum-facts{display:block;font:400 13.5px/1.5 var(--sans);color:rgba(243,238,228,.7)}
  .co-desk{padding:30px max(16px,var(--m)) 96px}
  .co .co-assure-pay{display:grid}
  .co-step{margin-top:38px;padding-top:38px}
  #co-contact{margin-top:28px}
  .co-paybar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:block;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(251,249,244,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 -1px 0 var(--co-line2);transform:translateY(105%);visibility:hidden;transition:transform calc(var(--beat)*4) var(--sweep),visibility 0s linear calc(var(--beat)*4)}
  .co-paybar.on{transform:none;visibility:visible;transition:transform calc(var(--beat)*4) var(--sweep)}
  html.static .co-paybar{display:none}
  .co .co-paynow{width:100%;height:54px;border-radius:12px;gap:10px;font-size:13.5px}
  .co-paynow svg.i{width:16px;height:16px}
  .co-toast{bottom:calc(84px + env(safe-area-inset-bottom))}
  .co-plain .co-secure{color:var(--graphite)}
  .co-plain .co-help a{color:var(--ink)}
  .co-plain .co-secure svg.i,.co-plain .co-help svg.i{color:var(--bronze)}
  .co-paynote ul{grid-template-columns:minmax(0,1fr)}
  .co-plain .co-desk{padding-top:calc(var(--co-hd) + 14px)}   /* WooCommerce's own pages in the frame: the paper clears the head */
  /* order received, declined: WooCommerce's long sentence at a size to read, not the thank-you's display size */
  .co-dt .woocommerce-thankyou-order-failed{display:block;font-size:26px;line-height:1.25;letter-spacing:-.008em}
}
@media (max-width:520px){
  .co-secure .co-wide{display:none}
  .co-secure{margin-right:4px}
  .co-wm{width:142px}
  .co-niche{height:134px}
  .co-name{font-size:28px}
  .co-name em{display:block;margin:2px 0 0}
  .co-h{font-size:27px}
  .co-xp{height:50px;font-size:19px}
  .co-assure{grid-template-columns:minmax(0,1fr)}
  .co-assure-pay{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wc_payment_method{padding:18px 16px 2px}
  .wc_payment_method > label{font-size:21px}
  .co-cp-row .btn{padding:0 16px}
  .woocommerce-order-overview li{padding:15px 16px}
  .co-save{padding:20px 18px}
  .co-save .co-cp-row{flex-direction:column}
}
/* touch: every link-like control gets a 44px target */
@media (pointer:coarse){
  .co .co-a,.co-login-q a,.co-edit,.co-cp-ok button{min-height:44px;display:inline-flex;align-items:center}
  .woocommerce-remove-coupon{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;margin:-14px 0 -14px 6px}
  .woocommerce-form-coupon-toggle .co-a{min-height:44px}
}
@media (prefers-reduced-motion:reduce){
  .co-reveal,.co .form-row.co-fold,.co-sum,.co-seg-thumb,.co-paybar{transition:none!important}
}
/* ---------- a phone (the mobile pass, 19-10-2026) ---------- */
@media (max-width:900px){
  /* the pay bar on solid paper: iOS repaints a backdrop blur of the page under it on every frame of a scroll */
  .co-paybar{background:var(--paper);-webkit-backdrop-filter:none;backdrop-filter:none}
  .co-plain .shop_table :is(th,td) + :is(th,td){padding-left:14px}   /* WooCommerce's own pages in the frame: the columns keep apart */
  .co-ft > span{text-wrap:balance}                          /* the company line breaks evenly, its number kept with it */
  /* touch: the small links (the wordmark, Help on WhatsApp, the policies) get a 44px target, drawn round them so nothing moves */
  .co-wm,.co-assure a,.co-ft a{position:relative}
  .co-wm:after,.co-assure a:after,.co-ft a:after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:44px;margin-top:-22px}
}
@media (max-width:380px){
  .co-st-t{font-size:21px}                                  /* a six-figure total keeps to the bar beside "Show order summary" */
}
