/* Ital Simple: WordPress and WooCommerce glue only. ib.css (the approved prototype stylesheet) does the design;
   this file maps the markup core blocks and WooCommerce emit onto it. Rules here restate ib.css declarations for
   a different selector, never a different look. AAA rules hold: ink on mint (never white), focus outline 3px ink,
   targets 44px or more, secondary text 7:1. */

/* 0. WordPress wrappers ------------------------------------------------------ */
/* :where() keeps this at zero specificity, so ib.css margins on component groups (.head, .sub, .phead...) win,
   as they do in the prototype. A plain .wp-block-group here zeroed every section head's bottom margin. */
:where(.wp-block-group){margin-block:0}
.wp-block-image,.wp-block-post-featured-image,.wp-block-woocommerce-product-price{margin-block:0}
figure{margin:0}
.wp-site-blocks{overflow-x:clip}
/* ib.css has .page and .tag as component classes; WordPress puts both on <body> (pages, tag archives). */
body.page{background:var(--white)}
body.tag{display:block;min-height:0;padding:0;border-radius:0;background:var(--white);font-size:inherit;font-weight:inherit}
.pt0{padding-top:0}
.narrow{max-width:48rem}
.wp-block-heading a{color:inherit}
.hdr,.ftr{margin-block:0}
.hdr.wp-block-template-part{position:sticky;top:0;z-index:30}
.admin-bar .hdr.wp-block-template-part{top:32px}
@media (max-width:782px){.admin-bar .hdr.wp-block-template-part{top:46px}}

/* 1. Buttons: core/button and WooCommerce buttons look like ib.css .btn --------------- */
.wp-block-button__link,.wp-element-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.8rem 1.6rem;border-radius:var(--pill);background:var(--mint);color:var(--ink);border:0;font:700 1rem/1.2 var(--sans);text-decoration:none;cursor:pointer;transition:background-color .2s,color .2s;touch-action:manipulation}
.wp-block-button__link:hover,.wp-element-button:hover{background:var(--ink);color:#fff}
.wp-block-button__link:focus-visible,.wp-element-button:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:.75rem}
.wp-block-button.caps .wp-block-button__link{text-transform:uppercase;letter-spacing:.12em;font-size:.9375rem;padding-inline:2rem}
.wp-block-button.soft .wp-block-button__link{background:var(--wash);color:var(--green-ink)}
.wp-block-button.soft .wp-block-button__link:hover{background:var(--ink);color:#fff}
.wp-block-button.line .wp-block-button__link{background:var(--white);border:2px solid var(--edge);color:var(--ink)}
.wp-block-button.line .wp-block-button__link:hover{background:var(--ink);color:#fff}
.wp-block-button.block,.wp-block-button.block .wp-block-button__link{width:100%}
.wp-block-button.link .wp-block-button__link{background:none;color:var(--ink);padding:0;min-height:48px;border-radius:0}
.wp-block-button.link .wp-block-button__link:hover{background:none;color:var(--ink);text-decoration:underline}
.link.wp-block-button{display:block;min-height:0}
.acts.wp-block-buttons{gap:1rem 2rem}
.hero .acts.wp-block-buttons{margin-top:2rem}
.tcard .wp-block-buttons{justify-content:center}
.pcard .ft .wp-block-buttons{flex:1}
.pcard .ft .wp-block-button{flex:1}
.pcard .ft .wp-block-button__link{width:100%}
.hdr .wp-block-button__link{min-height:44px;padding:.6rem 1.25rem;letter-spacing:.06em}
.wp-block-button.mx{width:100%}
.wp-block-button.mx .wp-block-button__link{width:100%}
.done .acts.wp-block-buttons{justify-content:center}

/* 2. Header ---------------------------------------------------------------------------- */
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:4.5rem}
.wp-block-navigation.nav{display:none;margin:0;padding:0}
.wp-block-navigation.nav .wp-block-navigation__container{gap:.25rem;flex-wrap:nowrap;padding:0}
@media (min-width:62rem){.wp-block-navigation.nav{display:flex}}
.wp-block-navigation .wp-block-navigation-item__content{padding:0 .7rem;text-decoration:none}
.wp-block-navigation.nav a[aria-current=page]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.4em}
.hdr-r{display:flex;align-items:center;gap:.5rem}
.hdr-r>*{margin:0}
.hic .count[hidden]{display:none}
.menu summary{color:var(--ink)}
.menu summary::before{content:"";flex:none;width:18px;height:18px;background:currentColor;-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'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%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'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E") center/contain no-repeat}
.menu .menu-pop{position:absolute;right:0;top:calc(100% + .5rem);width:min(17rem,calc(100vw - 2rem));padding:.5rem;background:var(--white);border-radius:var(--r);box-shadow:var(--shadow);z-index:40}
.menu .menu-pop ul{position:static;width:auto;margin:0;padding:0;background:none;box-shadow:none;border-radius:0;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:0}
.menu .wp-block-navigation{display:block}
.menu .wp-block-navigation-item{width:100%}
.menu .menu-pop .wp-block-buttons{padding:.5rem .25rem .25rem}
@media (min-width:30rem){.menu .menu-pop .wp-block-buttons{display:none}}
@media (min-width:62rem){.menu{display:none}}

/* 3. Hero, headings, display text ---------------------------------------------------------- */
.hero .burst{display:inline-block;width:.8em;height:.8em;vertical-align:-.05em;margin-left:.15em;background:var(--mint);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M12 17 22 7M12 20h20M12 23l10 10'/%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 40 40' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M12 17 22 7M12 20h20M12 23l10 10'/%3E%3C/svg%3E") center/contain no-repeat}
.wavy::after{content:"";position:absolute;left:-1%;bottom:-.24em;width:102%;height:.3em;background:#5B47D6;-webkit-mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 24" preserveAspectRatio="none" fill="none" stroke="%23000" stroke-width="2.4" stroke-linecap="round"><path d="M2 13C9 7.5 17 5.5 27 7.5S45 19.5 59 19.5 82 7 96 6 113 8.5 118 12.5"/></svg>') center/100% 100% no-repeat;mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 24" preserveAspectRatio="none" fill="none" stroke="%23000" stroke-width="2.4" stroke-linecap="round"><path d="M2 13C9 7.5 17 5.5 27 7.5S45 19.5 59 19.5 82 7 96 6 113 8.5 118 12.5"/></svg>') center/100% 100% no-repeat}
.half h3.big{text-transform:uppercase}
.half p{margin:0}
p.joint{margin:0}
.hero-contact{padding-bottom:3rem}
.hero-contact h1{max-width:14ch}
.hero-contact .lede{color:var(--grey);max-width:34rem}
.blog-head h1,.blog-head .wp-block-query-title{font-size:clamp(2.1rem,7vw,3.1rem);margin-top:.75rem}
.blog-head .wp-block-query-title{color:var(--green)}
.blog-head .wp-block-term-description p{margin:0}
.blog-head p.tag{margin:0 auto}
.blog-sec{padding-top:1.5rem}
.sechead h2{margin:0}
.sechead p{margin:0}

/* 4. Cards in the home patterns ------------------------------------------------------------ */
.ph .wp-block-image{width:100%;height:100%}
.ph .wp-block-image img{width:100%;height:100%;object-fit:cover}
.pcard p.tag,.pcard p.price,.scard-body p{margin:0}
.pcard .row .price{margin:0}
.tcard .box h3{margin-bottom:.75rem}
/* dimensions collage: ib.css targets <picture>; core/image emits <figure> */
.collage .wp-block-image{border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.collage .wp-block-image img{width:100%;height:100%;object-fit:cover}
.collage .wp-block-image:nth-child(1){aspect-ratio:9/10;margin-top:2.5rem}.collage .wp-block-image:nth-child(2){aspect-ratio:9/10}
.collage .wp-block-image:nth-child(3){aspect-ratio:3/4;margin-top:-2.5rem}.collage .wp-block-image:nth-child(4){aspect-ratio:9/10}
@media (min-width:64rem){
  .collage .wp-block-image{margin:0!important}
  .collage .wp-block-image:nth-child(2){grid-column:2;grid-row:1/3;aspect-ratio:9/10;align-self:end}
  .collage .wp-block-image:nth-child(3){grid-column:2;grid-row:3/5;aspect-ratio:3/4}
  .collage .wp-block-image:nth-child(1){grid-column:1;grid-row:2/4;width:14rem;justify-self:end;margin-right:1.5rem!important}
  .collage .wp-block-image:nth-child(4){grid-column:3;grid-row:2/4;width:14rem;justify-self:start;margin-left:1rem!important}
}

/* 5. Article cards (core/query): the first two of every five are large, the rest small ------------ */
.bgrid{list-style:none;margin:0;padding:0}
.bgrid>li{display:flex;margin:0}
.bgrid>li>.bcard{width:100%}
.bcard .ph{display:block}
.bcard .ph .wp-block-post-featured-image{height:100%;margin:0}
.bcard .ph .wp-block-post-featured-image img{width:100%;height:100%;object-fit:cover;object-position:center}
.bcard .ph:empty{display:grid;place-items:center;aspect-ratio:16/9;background:var(--wash)}
.bcard .ph:empty::before{content:"";height:46%;aspect-ratio:1;background:var(--mint);-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='1.1' stroke-linecap='round'%3E%3Cpath d='M7.6 20.5 6.4 6.8a2.3 2.3 0 0 1 4.5-.7l.9 14.2'/%3E%3Cpath d='M16.4 20.5l1.2-13.7a2.3 2.3 0 0 0-4.5-.7l-.9 14.2'/%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='1.1' stroke-linecap='round'%3E%3Cpath d='M7.6 20.5 6.4 6.8a2.3 2.3 0 0 1 4.5-.7l.9 14.2'/%3E%3Cpath d='M16.4 20.5l1.2-13.7a2.3 2.3 0 0 0-4.5-.7l-.9 14.2'/%3E%3C/svg%3E") center/contain no-repeat}
.bcard:has(.ph:empty) .tag a{background:var(--white)}
.bcard .tag{margin:0}
.bcard .tag a,.ptags a,.phead .tag a,.blog-head p.tag{color:var(--ink);text-decoration:none}
.bcard .wp-block-post-terms__separator,.ptags .wp-block-post-terms__separator{display:none}
.bcard .wp-block-post-title{margin:0 0 1rem}
.bcard .wp-block-post-excerpt{margin:0}
.bcard .wp-block-post-excerpt__excerpt{margin:0 0 1rem}
.bcard .wp-block-post-date{color:#fff}
.bcard .meta{display:flex;justify-content:space-between;align-items:center;font-size:.9375rem;font-weight:700}
.bcard .meta .more{color:var(--mint)}
.bcard .meta .more::after{content:" \2192"}
.bgrid>li h3{font-size:1.35rem}
@media (min-width:40rem){.bgrid>li:nth-child(5n+1) h3,.bgrid>li:nth-child(5n+2) h3{font-size:1.75rem}}
@media (min-width:64rem){
  .bgrid>li{grid-column:span 2}
  .bgrid>li:nth-child(5n+1),.bgrid>li:nth-child(5n+2){grid-column:span 3}
  .bgrid>li>.bcard{min-height:0}
  .bgrid>li h3{font-size:1.35rem}
  .bgrid>li:nth-child(5n+1) h3,.bgrid>li:nth-child(5n+2) h3{font-size:1.9rem;line-height:1.2}
  .bgrid--small>li,.bgrid--small>li:nth-child(5n+1),.bgrid--small>li:nth-child(5n+2){grid-column:span 2}
  .bgrid--small>li:nth-child(5n+1) h3,.bgrid--small>li:nth-child(5n+2) h3{font-size:1.35rem;line-height:1.1}
}
.wp-block-query-pagination{justify-content:center;gap:.5rem;margin-top:2rem}
.wp-block-query-pagination a,.wp-block-query-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:0 1rem;border-radius:var(--pill);background:var(--white);border:2px solid var(--line);box-shadow:var(--shadow-sm);font-weight:700;color:var(--ink);text-decoration:none}
.wp-block-query-pagination .current{border-color:var(--green-ink);background:var(--wash)}
/* category chips (core/categories) */
.blog-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:2rem}
.blog-chips .wp-block-categories.chips{display:contents;list-style:none;margin:0;padding:0}
.wp-block-categories.chips li{display:flex;margin:0}
.blog-chips .chip-all,.wp-block-categories.chips a{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:0 1.1rem;border-radius:var(--pill);background:var(--white);border:2px solid var(--line);box-shadow:var(--shadow-sm);font-weight:700;font-size:.9375rem;color:var(--ink);text-decoration:none}
.blog-chips .chip-all[aria-current],.wp-block-categories.chips a[aria-current]{border-color:var(--green-ink);background:var(--wash)}
/* "Featured" is a selection, not a subject: the prototype shows Mind, Spirit and Wealth only (chips and card pills) */
.wp-block-categories.chips li:has(>a[href*="/category/featured/"]){display:none}
/* card and post-header pills: one pill per category, a gap between them; the pill is 28px as drawn, its target
   44px (a transparent ::before), and it sits above the card's stretched title link so it reaches the category */
.bcard .wp-block-post-terms.tag,.phead .wp-block-post-terms.tag{display:flex;flex-wrap:wrap;gap:.5rem;min-height:0;padding:0;background:none;border-radius:0}
.bcard .wp-block-post-terms.tag{right:1.25rem;z-index:3}
.phead .wp-block-post-terms.tag{justify-content:center}
.bcard .wp-block-post-terms.tag a,.phead .wp-block-post-terms.tag a{position:relative;display:inline-flex;align-items:center;min-height:28px;padding:.2rem .7rem;border-radius:var(--pill);background:var(--mint);color:var(--ink);font-size:.875rem;font-weight:700;text-decoration:none}
.bcard .wp-block-post-terms.tag a::before,.phead .wp-block-post-terms.tag a::before{content:"";position:absolute;inset:-8px -4px}
.phead .wp-block-post-terms__separator{display:none}
.wp-block-post-terms.tag a[href*="/category/featured/"]{display:none}

/* 6. Newsletter: MailPoet form as the prototype's .nform, one labelled email pill and a Subscribe button ------
   MailPoet form 1 prints its own card (radial gradient, 40px padding, heading, intro, name and surname fields,
   inline-styled inputs). The theme takes the look back here; the form settings that remove those fields at
   source are on Karim's list (README, "Newsletter"). MailPoet writes its input styles inline, so the overrides
   need !important; its inline border-radius is itself !important, so the pill is drawn on the field's wrapper. */
.news .nform{display:block;max-width:30rem;margin:2rem auto 0}
.news .nform>p:empty,.news .nform>p:not([class]):not(:has(*:not(br))){display:none}
.news .mailpoet_form{background:none!important;border-radius:0!important;padding:0!important;text-align:left;width:100%}
.news form.mailpoet_form{display:grid;grid-template-columns:1fr;gap:.75rem;align-items:end;padding:0!important;margin:0}
@media (min-width:30rem){.news form.mailpoet_form{grid-template-columns:1fr auto}}
.news .mailpoet_form .mailpoet-heading,.news .mailpoet_form .mailpoet_form_paragraph,
.news .mailpoet_paragraph:has(input[autocomplete=given-name]),.news .mailpoet_paragraph:has(input[autocomplete=family-name]){display:none}
.news .mailpoet_paragraph{margin:0!important;min-width:0}
.news .mailpoet_message,.news .mailpoet_paragraph:has(.mailpoet_checkbox),.news .mailpoet_paragraph:has(.mailpoet_segment_label){grid-column:1/-1}
.news .mailpoet_text_label,.news .mailpoet_form label:not(.mailpoet_hp_email_label){display:block;font-weight:700;font-size:.9375rem;margin-bottom:.4rem}
/* Visible label for the email field. MailPoet's "label within input" setting prints no <label>, only a placeholder
   and aria-label="Email Address *"; this caption shows the prototype's "Email address" above the pill until the
   form is switched to a label above the field (then the real label shows and this caption is dropped). */
.news .mailpoet_paragraph:has(input[type=email]:not([name="data[email]"])):not(:has(label))::before{content:"Email address";display:block;font-weight:700;font-size:.9375rem;margin-bottom:.4rem;color:var(--ink)}
.news .mailpoet_paragraph:has(input[type=email]:not([name="data[email]"])){display:flex;flex-direction:column}
.news .mailpoet_paragraph:has(>input.mailpoet_text){position:relative}
.news .mailpoet_form input.mailpoet_text{width:100%!important;min-height:52px!important;padding:.7rem 1.25rem!important;margin:0!important;border:2px solid var(--edge)!important;background:var(--white)!important;color:var(--ink)!important;font:400 1.0625rem/1.4 var(--sans)!important;clip-path:inset(0 round 26px);box-shadow:none}
.news .mailpoet_form input.mailpoet_text::placeholder{color:var(--grey)!important;opacity:1}
/* MailPoet's inline radius (4px !important) cannot be overridden: clip the field to the pill and redraw its
   2px edge with an inset ring on the wrapper, so the edge follows the curve. */
.news .mailpoet_paragraph:has(>input.mailpoet_text)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:52px;border:2px solid var(--edge);border-radius:var(--pill);pointer-events:none}
.news .mailpoet_paragraph:has(>input.mailpoet_text) input.mailpoet_text{border-color:transparent!important}
.news .mailpoet_paragraph:has(>input.mailpoet_text:focus-visible)::after{outline:3px solid var(--ink);outline-offset:3px}
.news .mailpoet_form input.mailpoet_text:focus-visible{outline:0}
.news .mailpoet_form .mailpoet_submit{width:100%!important;min-height:52px!important;padding:.8rem 2.25rem!important;margin:0!important;border:0!important;background:var(--mint)!important;color:var(--ink)!important;font:700 1rem/1.2 var(--sans)!important;cursor:pointer}
.news .mailpoet_form .mailpoet_submit:hover{background:var(--ink)!important;color:#fff!important}
.news .mailpoet_form .mailpoet_form_loading{display:none}
.news .mailpoet_message{font-weight:700;color:var(--ink);padding:0!important}
.news .mailpoet_validate_success{color:var(--green-ink)!important}
.news .mailpoet_validate_error,.news .parsley-errors-list,.news .parsley-required{color:var(--err)!important;font-weight:700;font-size:.9375rem}
.news .parsley-errors-list{list-style:none;margin:.4rem 0 0;padding:0}

/* 7. Footer ------------------------------------------------------------------------------------------ */
.ftr .wp-block-heading{font-size:1rem;letter-spacing:.08em;text-transform:uppercase;margin:0 0 .5rem}
.ftr .wp-block-navigation__container,.ftr .wp-block-list{list-style:none;margin:0;padding:0;gap:0;align-items:flex-start}
.ftr .wp-block-navigation .wp-block-navigation-item__content{padding:0;min-height:44px;display:inline-flex;align-items:center}
.ftr .base p{margin:0}
.ftr .base i{font:500 1.2rem var(--script)}

/* 8. Accordion (core/details) and follow icons ------------------------------------------------------------- */
details.acc>summary{color:var(--ink)}
details.acc>.in{padding:0 1.25rem 1.25rem;color:var(--grey)}
details.acc>.in p{margin:0}
.follow{display:flex;gap:.6rem}
.co aside .card-title{font-size:1.4rem}
.card-title{margin-bottom:.25rem}
.co>.card+aside,.co>aside{margin:0}

/* 9. Forms from plugins (Contact Form 7, WPForms, MailPoet): pill fields, visible labels -------------- */
.wpcf7 form p,.wpforms-field{margin:0 0 1.1rem}
.wpcf7 label,.wpforms-field-label{display:block;font-weight:700;font-size:.9375rem;margin-bottom:.4rem}
.wpcf7 input[type=text],.wpcf7 input[type=email],.wpcf7 input[type=tel],.wpcf7 textarea,.wpforms-field input,.wpforms-field textarea,.wpcf7 select{width:100%;max-width:none}
.wpcf7 textarea,.wpforms-field textarea{border-radius:20px;min-height:7rem;padding:.7rem 1.25rem;border:2px solid var(--edge)}
.wpcf7-submit,.wpforms-submit{min-height:48px;padding:.8rem 1.6rem;border:0;border-radius:var(--pill);background:var(--mint);color:var(--ink);font:700 1rem/1.2 var(--sans);cursor:pointer}
.wpcf7-submit:hover,.wpforms-submit:hover{background:var(--ink);color:#fff}
.wpcf7-not-valid-tip,.wpforms-error{color:var(--err);font-weight:700;font-size:.9375rem}
.wpcf7-response-output{border-radius:var(--r);padding:.75rem 1rem;font-weight:700}

/* 10. Search form (core/search styled as .nform) ----------------------------------------------------------- */
.search-form{margin-top:1.5rem}
.search-form .wp-block-search__label{display:block;font-weight:700;font-size:.9375rem;margin-bottom:.4rem;text-align:left}
.search-form .wp-block-search__inside-wrapper{display:grid;gap:.75rem;border:0;padding:0}
.search-form .wp-block-search__input{min-height:52px;padding:.7rem 1.25rem;border:2px solid var(--edge);border-radius:var(--pill);background:var(--white);color:var(--ink);font:400 1.0625rem/1.4 var(--sans)}
.search-form .wp-block-search__button{min-height:52px;padding-inline:2.25rem;border:0;border-radius:var(--pill);background:var(--mint);color:var(--ink);font:700 1rem/1.2 var(--sans);margin:0}
.search-form .wp-block-search__button:hover{background:var(--ink);color:#fff}
@media (min-width:36rem){.search-form .wp-block-search__inside-wrapper{grid-template-columns:1fr auto}}
/* core/search carries .nform, whose grid (1fr auto) put the label beside the field: the prototype's search form is
   the label above one row of field and button, 30rem wide, centred under the heading. */
.search-form.nform{display:block;max-width:30rem;margin:1.5rem auto 0}
/* search.html: the heading in ink as the prototype (the archive titles' green does not apply here) */
.search-head .wp-block-query-title{color:var(--ink)}
/* search results in two groups, as the prototype: "Articles" (posts and pages as article cards), then "Store"
   (products as shop cards). Both loops hold the same results; each shows only its own type, and a group with
   nothing to show hides its heading. */
.sres-h{font-size:1.5rem;letter-spacing:-.02em;margin:0 0 1.25rem;text-align:left}
.sres-posts>li.type-product,.sres-store>li:not(.type-product){display:none}
.sres-articles:not(:has(.sres-posts>li:not(.type-product)))>.sres-h,.sres-shop:not(:has(.sres-store>li.type-product))>.sres-h{display:none}
.sres-articles:has(.sres-posts>li:not(.type-product)){margin-bottom:2.5rem}

/* 11. Shop cards (WooCommerce product collection and related products) -------------------------------------- */
.wp-block-woocommerce-product-template.sgrid,.sgrid{list-style:none;margin:0;padding:0;display:grid;gap:1.25rem}
.sgrid>li,.sres>li.type-product{position:relative;display:flex;flex-direction:column;width:auto;max-width:none;margin:0;border-radius:var(--r);background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow-sm);overflow:hidden}
.wp-block-woocommerce-product-template.sgrid.is-flex-container>li{width:auto;max-width:none;margin:0}
@media (min-width:36rem){.sgrid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:60rem){.sgrid{grid-template-columns:repeat(3,1fr)}}
.sgrid .ph,.sres .scard-body .ph{display:block;aspect-ratio:1;background:#F3F5F4}
.sgrid .ph img,.sres .scard-body .ph img{width:100%;height:100%;object-fit:cover}
.sgrid .wc-block-components-product-image,.sgrid .wc-block-components-product-image a{display:block;height:100%;margin:0}
.sgrid .bd,.scard-body .bd{display:flex;flex-direction:column;flex:1;padding:1rem 1.1rem 1.1rem}
.sres .scard-body{display:flex;flex-direction:column;flex:1}
.sgrid .bd .cat,.scard-body .bd .cat{margin:0 0 .25rem;font-size:.875rem;font-weight:700}
.sgrid .bd .cat a,.scard-body .bd .cat a{color:var(--green-ink);text-decoration:none}
.sgrid .bd h3,.scard-body .bd h3{font-size:1.15rem;line-height:1.25;margin-bottom:.5rem}
.sgrid .bd h3 a,.scard-body .bd h3 a{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.sgrid .bd h3 a:hover{text-decoration:underline}
.sgrid .bd .desc,.scard-body .bd .desc{color:var(--grey);font-size:.9375rem;margin-bottom:.75rem}
.sgrid .bd .desc p{margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sgrid .bd .price,.scard-body .bd .price{margin:auto 0 .9rem;padding-top:.75rem;border-top:1px solid var(--line);font-size:1.35rem}
.sgrid .wc-block-components-product-price,.scard-body .wc-block-components-product-price{font-weight:800;font-size:1.35rem}
.sgrid .wc-block-components-product-price del{font-weight:400;color:var(--grey)}
.sgrid .wc-block-components-product-button,.scard-body .wc-block-components-product-button{margin:0;width:100%}
.sgrid .wc-block-components-product-button .wp-block-button__link,.scard-body .wc-block-components-product-button .wp-block-button__link{width:100%}
.sgrid .wp-block-button__link.loading{opacity:.7}
.sgrid .added_to_cart{display:block;text-align:center;font-weight:700;min-height:44px;padding-top:.5rem}
.shophead{padding:.5rem 0 1.5rem}
.shophead .wp-block-query-title{font-size:clamp(2.2rem,8vw,3.2rem);margin-bottom:.5rem}
.shophead p,.shophead .wp-block-term-description{color:var(--grey);max-width:38rem;margin:0}
.crumbs.wp-block-woocommerce-breadcrumbs,.wrap>.crumbs{padding:1rem 0 .5rem;font-size:.9375rem}
.crumbs .woocommerce-breadcrumb{margin:0;color:var(--grey);font-size:.9375rem}
.crumbs .woocommerce-breadcrumb a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;color:var(--grey)}
.filters .fgroup .legend{font-weight:700;margin-bottom:.6rem}
.filters .wc-block-product-categories-list{list-style:none;margin:0;padding:0}
.filters .wc-block-product-categories-list-item a{display:flex;align-items:center;min-height:44px;font-weight:700;color:var(--ink);text-decoration:none}
.filters .wc-block-product-categories-list-item a:hover{text-decoration:underline}
.filters .wc-block-product-categories-list-item-count{color:var(--grey);margin-left:.4rem}
.filters .wc-block-product-categories-list-item.wc-block-product-categories-list-item--current>a,.filters [aria-current]{color:var(--green-ink);text-decoration:underline}
.filters h2{margin-bottom:.75rem}
.toolbar .wc-block-product-results-count,.toolbar .woocommerce-result-count{margin:0;color:var(--grey)}
.toolbar .wc-block-catalog-sorting form,.toolbar .woocommerce-ordering{margin:0;display:flex;align-items:center;gap:.6rem}
.toolbar .woocommerce-ordering::before{content:"Sort by";font-weight:700;font-size:.9375rem;white-space:nowrap}
.toolbar select.orderby{width:auto;min-height:48px;padding-right:2.5rem}
.note.sq svg{width:18px;height:18px;flex:none}

/* 12. Product page ---------------------------------------------------------------------------------------- */
.pdp .gal .woocommerce-product-gallery{margin:0;border-radius:var(--r-lg);background:#F1F4F2;padding:clamp(.75rem,3vw,1.5rem);box-shadow:var(--shadow-sm)}
.pdp .gal .woocommerce-product-gallery__image img{border-radius:14px;width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.pdp .gal .flex-control-thumbs{display:flex;gap:.6rem;list-style:none;margin:.75rem 0 0;padding:0}
.pdp .gal .flex-control-thumbs li{width:64px;height:64px}
.pdp .gal .flex-control-thumbs img{width:100%;height:100%;object-fit:cover;border-radius:12px;border:2px solid var(--line);cursor:pointer;opacity:1}
.pdp .gal .flex-control-thumbs img.flex-active{border:3px solid var(--green-ink)}
.buy .cat{color:var(--grey);font-size:.9375rem;margin-bottom:.25rem}
.buy .cat a{color:var(--grey)}
.buy .wp-block-post-title{font-size:clamp(2rem,7vw,2.6rem);letter-spacing:-.03em;margin-bottom:.5rem}
.buy .pr{margin:.75rem 0 1rem}
.buy .pr .wc-block-components-product-price{font-weight:800;font-size:1.85rem}
.buy .short p{color:var(--grey)}
.buy form.cart{margin-top:1.25rem}
.buy table.variations{border:0;margin:0 0 1rem;width:100%}
.buy table.variations th,.buy table.variations td{display:block;padding:0;border:0;text-align:left}
.buy table.variations label{font-weight:700;display:block;margin:1rem 0 .6rem}
.buy .reset_variations{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--ink)}
.buy .woocommerce-variation-price{margin:.5rem 0}
.buy .single_variation_wrap,.buy form.cart:not(.variations_form){display:block}
.buy .woocommerce-variation-add-to-cart,.buy form.cart:not(.variations_form){display:flex;gap:.75rem;align-items:center;padding-top:1.25rem;margin-top:.5rem;border-top:1px solid var(--line)}
.buy .quantity{display:inline-flex;border-radius:var(--pill);background:var(--white);box-shadow:var(--shadow-sm);border:2px solid var(--line)}
.buy .quantity input.qty{width:4rem;min-height:48px;border:0;text-align:center;font-weight:700;background:transparent;border-radius:var(--pill);padding:0}
.buy .single_add_to_cart_button{flex:1;min-height:56px;border:0;border-radius:var(--pill);background:var(--mint);color:var(--ink);font:700 1rem/1.2 var(--sans);cursor:pointer;padding:.8rem 1.6rem}
.buy .single_add_to_cart_button:hover{background:var(--ink);color:#fff}
.buy .single_add_to_cart_button.disabled{opacity:.55;cursor:not-allowed}
@media (min-width:52rem){.pdp{grid-template-columns:1fr 1fr;gap:3rem;align-items:start}}
.pdp-tabs .wc-tabs{display:flex;overflow-x:auto;list-style:none;margin:0;padding:0 .5rem;border-radius:var(--r);background:var(--white);box-shadow:var(--shadow-sm)}
.pdp-tabs .wc-tabs li{flex:none;margin:0}
.pdp-tabs .wc-tabs li a{display:flex;align-items:center;min-height:56px;padding:0 1rem;border-bottom:3px solid transparent;font-weight:700;color:var(--ink);text-decoration:none}
.pdp-tabs .wc-tabs li.active a{color:var(--green-ink);border-bottom-color:var(--green-ink)}
.pdp-tabs .woocommerce-Tabs-panel{margin-top:1.25rem;border-radius:var(--r);background:var(--white);box-shadow:var(--shadow-sm);padding:clamp(1.25rem,4vw,2rem)}
.pdp-tabs .woocommerce-Tabs-panel>h2:first-child{font-size:clamp(1.5rem,4.5vw,1.9rem);letter-spacing:-.02em}
.pdp-tabs .woocommerce-Tabs-panel p,.pdp-tabs .woocommerce-Tabs-panel li{color:var(--grey)}
.pdp-tabs table{width:100%;border-collapse:collapse}
.pdp-tabs th,.pdp-tabs td{padding:.6rem 0;text-align:left;border-bottom:1px solid var(--line)}
.pdp-tabs .comment-form label{display:block;font-weight:700;margin-bottom:.4rem}
.pdp-tabs .comment-form textarea,.pdp-tabs .comment-form input[type=text],.pdp-tabs .comment-form input[type=email]{width:100%}
.also{padding-top:2.5rem;padding-bottom:var(--sec)}
.also .sgrid{margin-top:0}

/* 11b. Home collection (patterns/collection.php): WooCommerce's product template as the prototype's .prods grid of
   .pcard cards. The grid sits on the ul; each li holds one card. The middle card's soft button is the prototype's. */
.wp-block-woocommerce-product-template.prods{list-style:none;margin:0;padding:0}
.wp-block-woocommerce-product-template.prods.is-flex-container>li,.prods>li{display:flex;width:auto;max-width:none;margin:0}
.prods>li>.pcard{flex:1}
.pcard .wc-block-components-product-image,.pcard .wc-block-components-product-image a{display:block;height:100%;margin:0}
.pcard .wp-block-post-title{margin:0 0 .5rem}
.pcard .desc p{margin:0}
.pcard .tag a{color:var(--ink);text-decoration:none}
.pcard .wc-block-components-product-price{font-weight:800;font-size:1.3rem;font-variant-numeric:tabular-nums}
.pcard .wc-block-components-product-price del{font-weight:400;color:var(--grey)}
.pcard .ft .wp-block-read-more{flex:1;display:flex;justify-content:center;text-align:center}
.prods>li:nth-child(2) .pcard .ft .wp-block-button__link{background:var(--wash);color:var(--green-ink)}
.prods>li:nth-child(2) .pcard .ft .wp-block-button__link:hover{background:var(--ink);color:#fff}
.pcard .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 13. Notices (WooCommerce classic and block): icon, words, colour -------------------------------------------- */
.woocommerce-message,.woocommerce-info,.woocommerce-error,.wc-block-components-notice-banner{border:2px solid var(--green-ink);border-radius:var(--r);background:var(--white);color:var(--ink);padding:1rem 1.25rem;margin:0 0 1.25rem;list-style:none;font-weight:700}
.woocommerce-error,.wc-block-components-notice-banner.is-error{border-color:var(--err)}
.woocommerce-error li{margin:0}
.woocommerce-message a.button,.woocommerce-info a.button{float:right;margin-left:1rem}
.woocommerce-error::before,.wc-block-components-notice-banner.is-error>svg{color:var(--err)}
.wc-block-components-notice-banner>svg{fill:currentColor;background:none}

/* 14. Cart, checkout, My account: shared head, cards, fields -------------------------------------------------- */
.co-body{padding-bottom:var(--sec)}
.cohead .wp-block-post-title{font-size:clamp(2rem,7vw,2.6rem);margin:0}
.co-body .wc-block-components-sidebar-layout{gap:1.25rem;margin:0}
.co-body .wc-block-components-main,.co-body .wc-block-components-sidebar{padding:0}
@media (min-width:60rem){.co-body .wc-block-components-sidebar-layout{display:grid;grid-template-columns:1.55fr 1fr;align-items:start}.co-body .wc-block-components-sidebar-layout .wc-block-components-main{width:auto}.co-body .wc-block-components-sidebar-layout .wc-block-components-sidebar{width:auto;position:sticky;top:6rem}}
/* the cart as the prototype's items card + summary card + coupon card */
.co-cart .wp-block-woocommerce-cart-line-items-block,.co-cart .wc-block-cart__main{border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem)}
.co-cart .wc-block-cart-items{border:0;width:100%;border-collapse:collapse}
.co-cart .wc-block-cart-items thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.co-cart .wc-block-cart-items__row{display:grid;grid-template-columns:5rem 1fr auto;gap:0 1rem;align-items:start;padding:1rem 0;border-top:1px solid var(--line)}
.co-cart .wc-block-cart-items__row:first-child{border-top:0;padding-top:0}
.co-cart .wc-block-cart-item__image{grid-row:1/3;padding:0;border:0}
.co-cart .wc-block-cart-item__image img{width:5rem;height:5rem;border-radius:12px;object-fit:cover}
.co-cart .wc-block-cart-item__product{padding:0;border:0}
.co-cart .wc-block-cart-item__total{padding:0;border:0;text-align:right;font-weight:800;font-size:1.15rem}
.co-cart .wc-block-components-product-name{font-weight:800;font-size:1.1rem;color:var(--ink);text-decoration:none;display:inline-flex;min-height:44px;align-items:center}
.co-cart .wc-block-components-product-metadata,.co-cart .wc-block-components-product-details{color:var(--grey);font-size:.9375rem}
.co-cart .wc-block-components-quantity-selector{border-radius:var(--pill);background:var(--white);box-shadow:var(--shadow-sm);border:2px solid var(--line);min-height:48px}
.co-cart .wc-block-components-quantity-selector__button{min-width:44px;min-height:44px;color:var(--ink);opacity:1}
.co-cart .wc-block-cart-item__remove-link{min-height:44px;display:inline-flex;align-items:center;font-weight:700;font-size:.9375rem;color:var(--err);text-decoration:underline}
@media (max-width:30rem){.co-cart .wc-block-cart-items__row{grid-template-columns:4rem 1fr}.co-cart .wc-block-cart-item__image img{width:4rem;height:4rem}}
/* summary and coupon cards */
.co-body .wc-block-cart__sidebar,.co-body .wc-block-checkout__sidebar{border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem)}
.co-body .wc-block-components-totals-wrapper{border-color:var(--line)}
.co-body .wc-block-components-totals-item__label{color:var(--grey)}
.co-body .wc-block-components-totals-footer-item{font-weight:800;font-size:1.2rem}
.co-body .wc-block-components-totals-footer-item .wc-block-components-totals-item__value{font-size:1.6rem}
.co-body .wc-block-components-totals-coupon{border-radius:var(--r);background:var(--page)}
.co-body .wc-block-components-panel__button{min-height:48px;font-weight:700;color:var(--ink)}
.co-body .wc-block-components-totals-coupon__form{gap:.5rem}
.co-body .wc-block-components-button:not(.is-link),.co-body .wc-block-cart__submit-button,.co-body .wc-block-components-checkout-place-order-button{min-height:52px;border-radius:var(--pill);background:var(--mint);color:var(--ink);border:0;font:700 1rem/1.2 var(--sans)}
.co-body .wc-block-components-button:not(.is-link):hover,.co-body .wc-block-cart__submit-button:hover{background:var(--ink);color:#fff}
.co-body .wc-block-components-button .wc-block-components-button__text{color:inherit}
.co-body .wc-block-components-button:focus-visible,.co-body a:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.co-body .wc-block-components-button.is-link{color:var(--ink);font-weight:700}
/* checkout steps sections as cards, tiles for shipping and payment */
.co-checkout .wc-block-components-checkout-step{border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem);margin:0 0 1.25rem;border:0}
.co-checkout .wc-block-components-checkout-step__title{font-size:1.4rem;letter-spacing:-.02em;font-weight:800}
.co-checkout .wc-block-components-checkout-step__description{color:var(--grey);font-size:.9375rem}
.co-checkout .wc-block-components-radio-control__option,.co-checkout .wc-block-components-radio-control-accordion-option{border:2px solid var(--line);border-radius:var(--r);margin-bottom:.75rem;min-height:72px;background:var(--white)}
.co-checkout .wc-block-components-radio-control__option-checked,.co-checkout .wc-block-components-radio-control-accordion-option:has(input:checked){border-color:var(--green-ink);background:var(--wash)}
.co-checkout .wc-block-components-radio-control__input{accent-color:var(--green-ink)}
/* pill fields: WooCommerce keeps its floating label, which stays visible above the text once filled */
.co-body .wc-block-components-text-input input,.co-body .wc-block-components-address-form input,.co-body .wc-block-components-form .wc-block-components-text-input input,.co-body .wc-block-components-textarea,.co-body .wc-blocks-components-select__select,.co-body .wc-block-components-combobox .components-form-token-field__input-container{min-height:52px;border:2px solid var(--edge);border-radius:var(--pill);background:var(--white);color:var(--ink);font:400 1.0625rem/1.4 var(--sans);padding-inline:1.25rem}
.co-body .wc-block-components-textarea{border-radius:20px}
.co-body .wc-block-components-text-input label,.co-body .wc-blocks-components-select__label{color:var(--grey);padding-inline:1.25rem}
.co-body .wc-block-components-text-input.has-error input,.co-body .has-error .wc-blocks-components-select__select{border-color:var(--err)}
.co-body .wc-block-components-validation-error{color:var(--err);font-weight:700}
.co-body input:focus-visible,.co-body select:focus-visible,.co-body textarea:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:none}
.co-body .wc-block-components-checkbox__input{accent-color:var(--green-ink)}

/* 14b. Order received (order-confirmation.html): WooCommerce's order confirmation blocks in the prototype's
   .card.done panel and .co cards (order-confirmed.html). Glue only: the cards, tick and grid come from ib.css. */
.done .wp-block-woocommerce-order-confirmation-status h1{margin:0 0 .5rem}
.co-confirm .wc-block-order-confirmation-summary-list{list-style:none;margin:0 0 1.25rem;padding:0;display:grid;gap:.6rem}
.co-confirm .wc-block-order-confirmation-summary-list-item{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.25rem 1rem}
.co-confirm .wc-block-order-confirmation-summary-list-item__key{color:var(--grey)}
.co-confirm .wc-block-order-confirmation-summary-list-item__value{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.co-confirm h2{font-size:1.4rem;letter-spacing:-.02em;margin:1.25rem 0 .75rem}
.co-confirm .card>h2:first-child,.co-confirm .card>*:first-child h2{margin-top:0}
.co-confirm .wc-block-order-confirmation-totals__table{width:100%;border-collapse:collapse;border:0;margin:0}
.co-confirm .wc-block-order-confirmation-totals__table th,.co-confirm .wc-block-order-confirmation-totals__table td{padding:.7rem 0;border:0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.co-confirm .wc-block-order-confirmation-totals__total{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.co-confirm .wc-block-order-confirmation-totals__table tfoot tr:last-child th,.co-confirm .wc-block-order-confirmation-totals__table tfoot tr:last-child td{border-bottom:0;font-size:1.2rem;font-weight:800}
.co-confirm address{font-style:normal;line-height:1.6}

/* 17. Classic cart, checkout and order received ([woocommerce_cart] / [woocommerce_checkout]) --------------------
   On italbunny.com pages 39 and 40 are Elementor pages whose Shortcode widget prints the classic cart and checkout
   (GOLIVE-2026-11-03.md). This dresses that markup as the prototype's cart.html, checkout.html and order-confirmed.html:
   white cards, labels above pill fields, mint buttons with ink text, line items as rows, stacked tables on a phone.
   Selectors carry .co-body plus WooCommerce's own scope so they outrank woocommerce.css, -layout and -smallscreen. */

/* 17a. Elementor inside the template. Our .cohead is the page title, so Elementor's Heading widget is hidden. This is
   CSS, not PHP: if Elementor is ever switched off the page keeps its title and content. Elementor's section, column
   and widget spacing is zeroed so the cards line up with .wrap, and boxed containers fill the column. */
.co-body .elementor-widget-heading{display:none}
.co-body .elementor-section:has(.elementor-widget-heading):not(:has(.elementor-widget-shortcode)){display:none}
.co-body .elementor .elementor-element.elementor-section,.co-body .elementor .elementor-element.e-con{padding:0;margin:0;background:none;min-height:0}
.co-body .elementor .elementor-section.elementor-section-boxed>.elementor-container{max-width:none}
.co-body .elementor .elementor-column.elementor-element>.elementor-element-populated{padding:0}
.co-body .elementor .elementor-widget.elementor-element:not(:last-child){margin-block-end:0}
.co-body .elementor,.co-body .elementor-shortcode{max-width:100%;min-width:0}
/* woocommerce-blocktheme.css caps the cart and checkout at 1000px (.woocommerce-cart main .woocommerce); the cards
   follow .wrap instead, as on every other page */
main .co-body div.woocommerce,main .co-body .elementor-shortcode div.woocommerce{max-width:none;min-width:0;margin:0}
main .cohead .wp-block-post-title{max-width:none}
.co-body .woocommerce *,.co-body .woocommerce *::before,.co-body .woocommerce *::after{box-sizing:border-box}
.co-body .woocommerce a:not(.button):not(.remove){color:var(--green-ink)}

/* 17b. Cards, and the two-column grid (main 1.55fr, aside 1fr from 60rem, as the prototype's .co) */
.co-cart .woocommerce-cart-form,.co-body .woocommerce .cart-collaterals .cart_totals,.co-checkout .woocommerce-billing-fields,
.co-checkout .woocommerce-shipping-fields,.co-checkout .woocommerce-additional-fields,.co-checkout #order_review,
.co-body .woocommerce form.checkout_coupon,.co-body .woocommerce-order-details,.co-body .woocommerce-customer-details,
.co-body ul.woocommerce-order-overview,.co-body .wc-empty-cart-message{border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem);margin:0 0 1.25rem}
.co-body .wc-empty-cart-message{text-align:center}
.co-body .woocommerce .wc-empty-cart-message .cart-empty{border:0;box-shadow:none;padding:0;margin:0;font-size:1.15rem}
.co-body .woocommerce .wc-empty-cart-message .cart-empty::before{display:none}
.co-body .woocommerce .return-to-shop{text-align:center;margin:0 0 1.25rem}
.co-body .woocommerce h2,.co-body .woocommerce h3{font-size:1.4rem;letter-spacing:-.02em;font-weight:800;margin:0 0 1rem;color:var(--ink)}
.co-body .woocommerce .cart-collaterals,.co-body .woocommerce .cart-collaterals .cart_totals{float:none;width:auto}
.co-body .woocommerce .col2-set,.co-body .woocommerce .col2-set .col-1,.co-body .woocommerce .col2-set .col-2{float:none;width:auto;max-width:none}
@media (min-width:60rem){
  .co-cart .woocommerce:has(.woocommerce-cart-form){display:grid;grid-template-columns:1.55fr 1fr;gap:0 1.25rem;align-items:start}
  .co-cart .woocommerce:has(.woocommerce-cart-form)>*{grid-column:1/-1}
  .co-cart .woocommerce:has(.woocommerce-cart-form)>.woocommerce-cart-form{grid-column:1}
  .co-cart .woocommerce:has(.woocommerce-cart-form)>.cart-collaterals{grid-column:2;position:sticky;top:6rem}
  .co-checkout .woocommerce form.checkout{display:grid;grid-template-columns:1.55fr 1fr;grid-auto-flow:row dense;gap:0 1.25rem;align-items:start}
  /* Everything else (error notices, gateway express buttons, the details cards) stacks in column 1. The heading and
     the order card share column 2 across every row, so the order card starts at the top, not below the first card. */
  .co-checkout .woocommerce form.checkout>*{grid-column:1}
  .co-checkout .woocommerce form.checkout>#order_review_heading,.co-checkout .woocommerce form.checkout>#order_review{grid-column:2;grid-row:1/span 99;align-self:start}
  .co-checkout .woocommerce form.checkout>#order_review{margin-top:2.5rem;position:sticky;top:6rem}
}

/* 17c. Fields: labels above, pill inputs 52px tall, ink text on white */
.co-body .woocommerce form .form-row{padding:0;margin:0 0 1.1rem;display:flex;flex-direction:column;gap:.4rem}
.co-body .woocommerce form .form-row label{font-weight:700;font-size:.9375rem;line-height:1.4;color:var(--ink);margin:0}
.co-body .woocommerce form .form-row .required{color:var(--err);text-decoration:none;border:0}
.co-body .woocommerce form .form-row .optional{color:var(--grey);font-weight:400}
.co-body .woocommerce form .form-row .woocommerce-input-wrapper{display:block;width:100%}
.co-body .woocommerce form .form-row .input-text,.co-body .woocommerce form .form-row select,.co-body .woocommerce form .form-row textarea,
.co-body .woocommerce input.input-text{width:100%;min-height:52px;height:auto;padding:.7rem 1.25rem;border:2px solid var(--edge);border-radius:var(--pill);background:var(--white);color:var(--ink);font:400 1.0625rem/1.4 var(--sans);box-shadow:none;margin:0}
.co-body .woocommerce form .form-row textarea{border-radius:20px;min-height:7rem;height:7rem;resize:vertical}
.co-body .woocommerce form .form-row.woocommerce-invalid .input-text,.co-body .woocommerce form .form-row.woocommerce-invalid select{border-color:var(--err)}
.co-body .woocommerce form .form-row.woocommerce-invalid label{color:var(--err)}
.co-body .woocommerce form .form-row.woocommerce-validated .input-text{border-color:var(--green-ink)}
.co-body .woocommerce .checkout-inline-error-message,.co-body .woocommerce .woocommerce-error-message{color:var(--err);font-weight:700;font-size:.9375rem;margin:.2rem 0 0}
@media (max-width:36rem){.co-body .woocommerce form .form-row-first,.co-body .woocommerce form .form-row-last{float:none;width:100%}}
.co-body .woocommerce input[type=checkbox],.co-body .woocommerce input[type=radio]{width:1.35rem;height:1.35rem;margin:0;accent-color:var(--green-ink);flex:none}
.co-body .woocommerce label.checkbox,.co-body .woocommerce .woocommerce-form__label-for-checkbox{display:flex;align-items:center;gap:.75rem;min-height:44px;font-weight:700;cursor:pointer}
.co-body .woocommerce #ship-to-different-address{font-size:1.1rem;margin:0}
.co-body .woocommerce .select2-container{width:100%!important}
.co-body .woocommerce .select2-container .select2-selection--single{height:auto;min-height:52px;border:2px solid var(--edge);border-radius:var(--pill);background:var(--white)}
.co-body .woocommerce .select2-container .select2-selection--single .select2-selection__rendered{line-height:48px;padding:0 2.75rem 0 1.25rem;color:var(--ink);font-size:1.0625rem}
.co-body .woocommerce .select2-container .select2-selection--single .select2-selection__arrow{height:48px;right:.9rem}
.co-body .woocommerce .select2-container--focus .select2-selection--single,.co-body .woocommerce .select2-container--open .select2-selection--single{outline:3px solid var(--ink);outline-offset:2px}
.select2-container .select2-dropdown{border:2px solid var(--edge);border-radius:20px;overflow:hidden}
.select2-container .select2-results__option{padding:.6rem 1rem;min-height:44px;color:var(--ink)}
.select2-container--default .select2-results__option--highlighted[aria-selected],.select2-container--default .select2-results__option--highlighted[data-selected]{background:var(--green-ink);color:#fff}
.co-body .woocommerce input:focus-visible,.co-body .woocommerce select:focus-visible,.co-body .woocommerce textarea:focus-visible,
.co-body .woocommerce a:focus-visible,.co-body .woocommerce button:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

/* 17d. Buttons: mint pill with ink text (7:1), ink with white text on hover; "Update basket" and "Apply coupon" are
   the outline button */
.co-body .woocommerce a.button,.co-body .woocommerce button.button,.co-body .woocommerce input.button,
.co-body .woocommerce a.button.alt,.co-body .woocommerce button.button.alt,.co-body .woocommerce input.button.alt{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.8rem 1.6rem;border:0;border-radius:var(--pill);background:var(--mint);color:var(--ink);font:700 1rem/1.2 var(--sans);text-decoration:none;text-align:center;cursor:pointer;float:none}
.co-body .woocommerce a.button:hover,.co-body .woocommerce button.button:hover,.co-body .woocommerce input.button:hover,
.co-body .woocommerce a.button.alt:hover,.co-body .woocommerce button.button.alt:hover{background:var(--ink);color:#fff}
.co-body .woocommerce button.button[name=update_cart],.co-body .woocommerce button.button[name=apply_coupon]{background:var(--white);border:2px solid var(--edge);color:var(--ink)}
.co-body .woocommerce button.button[name=update_cart]:hover,.co-body .woocommerce button.button[name=apply_coupon]:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.co-body .woocommerce button.button:disabled,.co-body .woocommerce button.button:disabled[disabled]{opacity:.6;cursor:not-allowed;padding:.8rem 1.6rem}
.co-body .woocommerce .wc-proceed-to-checkout{padding:1rem 0 0}
.co-body .woocommerce .wc-proceed-to-checkout a.checkout-button{display:flex;width:100%;min-height:56px;font-size:1.0625rem;margin:0}

/* 17e. Basket lines (table.cart) as the prototype's .litem rows at every width: no horizontal scroll */
.co-cart .woocommerce table.shop_table.cart,.co-cart .woocommerce table.shop_table.cart tbody{display:block;width:100%;border:0;margin:0;border-radius:0}
.co-cart .woocommerce table.shop_table.cart thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.co-cart .woocommerce table.shop_table.cart tr.cart_item{display:grid;grid-template-columns:5rem minmax(0,1fr) auto;grid-template-areas:"thumb name remove" "thumb price price" "thumb qty sub";gap:.35rem 1rem;align-items:center;padding:1rem 0;border-top:1px solid var(--line)}
.co-cart .woocommerce table.shop_table.cart tr.cart_item:first-child{border-top:0;padding-top:0}
.co-cart .woocommerce table.shop_table.cart td{display:block;padding:0;border:0;background:none;text-align:left!important;min-width:0}
.co-cart .woocommerce table.shop_table.cart td::before{content:none!important;display:none!important}
.co-cart .woocommerce table.shop_table.cart td.product-thumbnail{display:block;grid-area:thumb;align-self:start}
.co-cart .woocommerce table.shop_table.cart td.product-thumbnail img{width:5rem;height:5rem;max-width:none;object-fit:cover;border-radius:12px;display:block}
.co-cart .woocommerce table.shop_table.cart td.product-name{grid-area:name;font-weight:800;font-size:1.1rem;overflow-wrap:anywhere}
.co-cart .woocommerce table.shop_table.cart td.product-name a{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.co-cart .woocommerce table.shop_table.cart td.product-name a:hover{text-decoration:underline}
.co-cart .woocommerce table.shop_table.cart td.product-name dl.variation{margin:0;font-weight:400;font-size:.9375rem;color:var(--grey);display:flex;flex-wrap:wrap;gap:0 .4rem}
.co-cart .woocommerce table.shop_table.cart td.product-name dl.variation :is(dt,dd,dd p){margin:0;float:none;padding:0}
.co-cart .woocommerce table.shop_table.cart td.product-price{grid-area:price;color:var(--grey);font-size:.9375rem}
.co-cart .woocommerce table.shop_table.cart td.product-quantity{grid-area:qty}
.co-cart .woocommerce table.shop_table.cart td.product-subtotal{grid-area:sub;font-weight:800;font-size:1.15rem;text-align:right!important;font-variant-numeric:tabular-nums;white-space:nowrap}
.co-cart .woocommerce table.shop_table.cart td.product-remove{grid-area:remove;align-self:start}
.co-cart .woocommerce table.shop_table.cart tr:not(.cart_item){display:block;border-top:1px solid var(--line);padding-top:1.25rem;margin-top:.25rem}
.co-cart .woocommerce table.shop_table.cart td.actions{display:flex;flex-direction:column;gap:.75rem}
.co-cart .woocommerce table.shop_table.cart td.actions .coupon{float:none;display:flex;gap:.5rem;width:100%;padding:0;margin:0}
.co-cart .woocommerce table.shop_table.cart td.actions .coupon .input-text,.co-cart .woocommerce .woocommerce-cart-form #coupon_code{flex:1;width:auto;min-width:0;float:none;margin:0}
.co-cart .woocommerce table.shop_table.cart td.actions .coupon .button{flex:none;width:auto;float:none}
.co-cart .woocommerce table.shop_table.cart td.actions>.button{width:100%;float:none}
@media (min-width:36rem){.co-cart .woocommerce table.shop_table.cart td.actions{flex-direction:row;justify-content:space-between;align-items:center}.co-cart .woocommerce table.shop_table.cart td.actions .coupon{width:auto;flex:1;max-width:26rem}.co-cart .woocommerce table.shop_table.cart td.actions>.button{width:auto}}
@media (max-width:22.5rem){.co-cart .woocommerce table.shop_table.cart tr.cart_item{grid-template-columns:4rem minmax(0,1fr) auto}.co-cart .woocommerce table.shop_table.cart td.product-thumbnail img{width:4rem;height:4rem}.co-cart .woocommerce table.shop_table.cart td.actions .coupon{flex-direction:column}.co-cart .woocommerce table.shop_table.cart td.actions .coupon .input-text,.co-cart .woocommerce .woocommerce-cart-form #coupon_code{flex:none;width:100%}.co-cart .woocommerce table.shop_table.cart td.actions .coupon .button{width:100%}}
.co-body .woocommerce a.remove{display:grid;place-items:center;width:44px;height:44px;font-size:1.6rem;line-height:1;font-weight:400;border-radius:50%;color:var(--err)!important;background:none;text-decoration:none}
.co-body .woocommerce a.remove:hover{background:var(--err);color:#fff!important}
.co-body .woocommerce .quantity{display:inline-flex}
.co-body .woocommerce .quantity .qty{width:5.5rem;min-height:48px;padding:.4rem .75rem;border:2px solid var(--edge);border-radius:var(--pill);background:var(--white);color:var(--ink);font:700 1.0625rem/1.2 var(--sans);text-align:center}

/* 17f. Totals (cart totals, checkout review, order details): label left in grey, amount right in bold, Total large.
   Rows are flex at every width, so nothing scrolls sideways on a 320px phone. */
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details){display:block;width:100%;border:0;margin:0 0 1rem;border-radius:0;border-collapse:collapse}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details) :is(tbody,thead,tfoot){display:block}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details) tr{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:.25rem 1rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details) :is(th,td){display:block;padding:0;border:0;background:none;width:auto;min-width:0;overflow-wrap:anywhere;line-height:1.5}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details) td::before{content:none!important;display:none!important}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details) th{color:var(--grey);font-weight:400;text-align:left}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table,table.order_details) td{text-align:right!important;font-weight:700;font-variant-numeric:tabular-nums;margin-left:auto}
.co-body .woocommerce :is(table.woocommerce-checkout-review-order-table,table.order_details) thead tr{border-bottom:2px solid var(--line)}
.co-body .woocommerce :is(table.woocommerce-checkout-review-order-table,table.order_details) thead th{font-size:.9375rem;font-weight:700}
.co-body .woocommerce :is(table.woocommerce-checkout-review-order-table,table.order_details) td.product-name{text-align:left!important;font-weight:700;margin-left:0;flex:1}
.co-body .woocommerce :is(table.woocommerce-checkout-review-order-table,table.order_details) td.product-name :is(.product-quantity,dl.variation,.wc-item-meta){font-weight:400;color:var(--grey)}
.co-body .woocommerce :is(table.woocommerce-checkout-review-order-table,table.order_details) td.product-name :is(dl.variation,.wc-item-meta){margin:.2rem 0 0;padding:0;list-style:none;font-size:.9375rem}
.co-body .woocommerce :is(table.woocommerce-checkout-review-order-table,table.order_details) td.product-name :is(dl.variation,.wc-item-meta) :is(dt,dd,p,li,strong){display:inline;margin:0;float:none;font-weight:400}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table) tr.order-total,.co-body .woocommerce table.order_details tfoot tr:last-child{border-bottom:0;padding-top:1rem}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table) tr.order-total :is(th,td),.co-body .woocommerce table.order_details tfoot tr:last-child :is(th,td){font-size:1.2rem;font-weight:800;color:var(--ink)}
.co-body .woocommerce :is(.cart_totals table.shop_table,table.woocommerce-checkout-review-order-table) tr.order-total td{font-size:1.6rem}
.co-body .woocommerce ul#shipping_method,.co-body .woocommerce ul.woocommerce-shipping-methods{list-style:none;margin:0;padding:0;text-align:right}
.co-body .woocommerce ul#shipping_method li{margin:0;padding:0;display:flex;gap:.5rem;justify-content:flex-end;align-items:center}
.co-body .woocommerce .woocommerce-shipping-destination,.co-body .woocommerce .woocommerce-shipping-calculator{font-weight:400;font-size:.9375rem;color:var(--grey);text-align:right;margin:.25rem 0 0}
.co-body .woocommerce .shipping-calculator-button{display:inline-flex;align-items:center;min-height:44px;font-weight:700}
.co-body .woocommerce .shipping-calculator-form{text-align:left;padding-top:.75rem}

/* 17g. Payment methods as the prototype's tiles; the place order button full width */
.co-checkout .woocommerce #payment{background:none;border-radius:0;margin-top:1.25rem}
.co-checkout .woocommerce #payment ul.payment_methods{list-style:none;margin:0;padding:0;border:0}
.co-checkout .woocommerce #payment ul.payment_methods::before,.co-checkout .woocommerce #payment ul.payment_methods::after{content:none}
.co-checkout .woocommerce #payment ul.payment_methods li{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem;min-height:72px;padding:.9rem 1rem;margin:0 0 .75rem;border:2px solid var(--line);border-radius:var(--r);background:var(--white);line-height:1.4;font-weight:400;text-align:left}
.co-checkout .woocommerce #payment ul.payment_methods li:has(>input:checked){border-color:var(--green-ink);background:var(--wash)}
.co-checkout .woocommerce #payment ul.payment_methods li>input.input-radio{margin:0;width:1.4rem;height:1.4rem}
.co-checkout .woocommerce #payment ul.payment_methods li>label{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;min-height:44px;margin:0;font-weight:700;cursor:pointer;color:var(--ink)}
.co-checkout .woocommerce #payment ul.payment_methods li img{max-height:1.6rem;max-width:100%;width:auto;margin:0;vertical-align:middle;box-shadow:none}
.co-checkout .woocommerce #payment div.payment_box{flex-basis:100%;width:100%;margin:.25rem 0 0;padding:1rem;border-radius:12px;background:var(--white);color:var(--ink);font-size:.9375rem;line-height:1.5;border:1px solid var(--line)}
.co-checkout .woocommerce #payment div.payment_box::before{display:none}
.co-checkout .woocommerce #payment div.payment_box p:last-child{margin-bottom:0}
.co-checkout .woocommerce #payment div.form-row{padding:1rem 0 0;margin:0}
.co-checkout .woocommerce #payment #place_order{float:none;width:100%;min-height:56px;font-size:1.0625rem;margin:1rem 0 0}
.co-checkout .woocommerce .woocommerce-privacy-policy-text,.co-checkout .woocommerce .woocommerce-terms-and-conditions-wrapper p{color:var(--grey);font-size:.9375rem}
.co-checkout .woocommerce #order_review_heading{margin:0 0 .75rem}

/* 17h. Classic order received: the thank-you line, the overview as a summary list, then order and address cards */
.co-body .woocommerce-order{border-radius:0;background:none;box-shadow:none;padding:0}
.co-body .woocommerce-order .woocommerce-thankyou-order-received,.co-body .woocommerce .woocommerce-order .woocommerce-notice--success{font-weight:800;font-size:1.3rem;text-align:center;margin:1.5rem 0 1.25rem;border:0;padding:0;background:none}
.co-body .woocommerce .woocommerce-order .woocommerce-notice--success::before{display:none}
.co-body ul.woocommerce-order-overview{list-style:none;display:grid;gap:.6rem}
.co-body .woocommerce ul.woocommerce-order-overview li{float:none;margin:0;padding:0 0 .6rem;border:0;border-bottom:1px solid var(--line);font-size:.9375rem;color:var(--grey);text-transform:none;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.25rem 1rem;line-height:1.4}
.co-body .woocommerce ul.woocommerce-order-overview li:last-child{border-bottom:0;padding-bottom:0}
.co-body .woocommerce ul.woocommerce-order-overview li strong{display:inline;font-size:1rem;color:var(--ink);font-weight:700;text-align:right;overflow-wrap:anywhere}
.co-body .woocommerce-customer-details address{font-style:normal;line-height:1.6;border:0;padding:0;border-radius:0;overflow-wrap:anywhere}
.co-body .woocommerce-customer-details .woocommerce-columns{display:grid;gap:1.25rem}
.co-body .woocommerce .woocommerce-customer-details .woocommerce-columns::before,.co-body .woocommerce .woocommerce-customer-details .woocommerce-columns::after{content:none;display:none}
@media (min-width:44rem){.co-body .woocommerce-customer-details .woocommerce-columns--2{grid-template-columns:1fr 1fr}}
.co-body .woocommerce .woocommerce-customer-details .woocommerce-column{float:none;width:auto}
.co-body .woocommerce .woocommerce-customer-details :is(.woocommerce-customer-details--phone,.woocommerce-customer-details--email){padding-left:0;margin:.25rem 0 0}
.co-body .woocommerce .woocommerce-customer-details :is(.woocommerce-customer-details--phone,.woocommerce-customer-details--email)::before{display:none}

/* 17i. Notices in the classic markup: WooCommerce's icon kept, in our colours, clear of the text */
.woocommerce :is(.woocommerce-message,.woocommerce-info,.woocommerce-error),.woocommerce-notices-wrapper :is(.woocommerce-message,.woocommerce-info,.woocommerce-error){border:2px solid var(--green-ink);border-radius:var(--r);background:var(--white);color:var(--ink);padding:1rem 1.25rem 1rem 3.25rem;margin:0 0 1.25rem;font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.woocommerce .woocommerce-error,.woocommerce-notices-wrapper .woocommerce-error{border-color:var(--err)}
.woocommerce :is(.woocommerce-message,.woocommerce-info)::before{color:var(--green-ink);left:1.1rem;top:1.05rem}
.woocommerce .woocommerce-error::before{color:var(--err);left:1.1rem;top:1.05rem}
.woocommerce :is(.woocommerce-message,.woocommerce-info,.woocommerce-error) a:not(.button){color:var(--green-ink);text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}
.woocommerce :is(.woocommerce-message,.woocommerce-info) .button{float:right;margin:-.25rem 0 0 1rem}
@media (max-width:36rem){.woocommerce :is(.woocommerce-message,.woocommerce-info) .button{float:none;display:flex;width:100%;margin:.75rem 0 0}}

/* 15. My account: log in and register as two cards; dashboard with .acnav ---------------------------------------- */
.acct-body .woocommerce{display:block}
.acct-body .u-columns.col2-set{display:grid;gap:1.25rem}
@media (min-width:44rem){.acct-body .u-columns.col2-set{grid-template-columns:1fr 1fr;align-items:start}}
.acct-body .u-columns .u-column1,.acct-body .u-columns .u-column2{float:none;width:auto;border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem)}
.acct-body .u-columns h2{font-size:1.4rem;letter-spacing:-.02em;margin-bottom:1.25rem}
.acct-body form.woocommerce-form{border:0;padding:0;margin:0}
.acct-body .woocommerce-form-login__submit,.acct-body .woocommerce-form-register__submit,.acct-body .woocommerce-Button,.acct-body button.button{min-height:48px;padding:.8rem 1.6rem;border:0;border-radius:var(--pill);background:var(--mint);color:var(--ink);font:700 1rem/1.2 var(--sans);cursor:pointer}
.acct-body .woocommerce-form-login__submit,.acct-body .woocommerce-form-register__submit{width:100%}
.acct-body .woocommerce-form-login__submit:hover,.acct-body .woocommerce-form-register__submit:hover,.acct-body button.button:hover{background:var(--ink);color:#fff}
.acct-body .woocommerce-form-login__rememberme{display:flex;align-items:center;gap:.75rem;min-height:44px;font-weight:700;margin:.5rem 0 0}
.acct-body .woocommerce-form-login__rememberme input{width:1.35rem;height:1.35rem;accent-color:var(--green-ink)}
.acct-body .woocommerce-LostPassword{text-align:center;font-size:.9375rem;margin:.75rem 0 0}
.acct-body .woocommerce-LostPassword a{display:inline-flex;align-items:center;min-height:44px}
.acct-body .woocommerce-privacy-policy-text p{color:var(--grey);font-size:.9375rem}
.acct-body .woocommerce:has(.woocommerce-MyAccount-navigation){display:grid;gap:1.25rem}
.acct-body .woocommerce-MyAccount-navigation{border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem)}
.acct-body .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.acct-body .woocommerce-MyAccount-navigation a{display:flex;align-items:center;min-height:48px;padding:0 .75rem;border-radius:12px;color:var(--ink);font-weight:700;text-decoration:none}
.acct-body .woocommerce-MyAccount-navigation a:hover,.acct-body .woocommerce-MyAccount-navigation .is-active a{background:var(--wash)}
.acct-body .woocommerce-MyAccount-content{border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem)}
.acct-body .woocommerce-MyAccount-content h2,.acct-body .woocommerce-MyAccount-content h3{font-size:1.4rem;letter-spacing:-.02em}
.acct-body .woocommerce-orders-table{width:100%;border-collapse:collapse}
.acct-body .woocommerce-orders-table th,.acct-body .woocommerce-orders-table td{padding:.7rem .4rem .7rem 0;text-align:left;border-bottom:1px solid var(--line)}
.acct-body .woocommerce-orders-table a.button{display:inline-flex;align-items:center;min-height:44px;padding:0 1rem;border-radius:var(--pill);background:var(--wash);color:var(--green-ink);font-weight:700;text-decoration:none}
.acct-body .woocommerce-Addresses{display:grid;gap:1.25rem}
@media (min-width:60rem){
  .acct-body .woocommerce:has(.woocommerce-MyAccount-navigation){grid-template-columns:1.55fr 1fr;align-items:start}
  .acct-body .woocommerce-MyAccount-content{grid-column:1;grid-row:1;float:none;width:auto}
  .acct-body .woocommerce-MyAccount-navigation{grid-column:2;grid-row:1;float:none;width:auto;position:sticky;top:6rem}
}
/* woocommerce/customer-account block, if used in a header or page */
.wc-block-customer-account a{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--white);color:var(--ink)}
.wc-block-customer-account svg{width:20px;height:20px;fill:currentColor}

/* 16. Legal and plain pages, blog post --------------------------------------------------------------------------- */
.post.wp-block-group .phead .wp-block-post-title,.phead .wp-block-post-title{font-size:clamp(2rem,7.5vw,3.4rem);max-width:20ch;margin:1rem auto .75rem}
.phead .tag{margin:0 auto}
.byline{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;color:var(--grey);font-size:.9375rem}
.byline>*{margin:0}
.byline>*+*::before{content:"\00b7";margin-right:.5rem}
.pfig{margin:1.75rem auto 0;max-width:62rem;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
.pfig img{display:block;width:100%;height:100%;object-fit:cover}
.pgrid.solo{display:block;max-width:62rem}
.pgrid.solo .prose{margin-inline:auto}
.pgrid .toc .box{margin:0}
.pgrid .toc .box h2{font-size:1.1rem;letter-spacing:0}
.pgrid .toc ol{margin:0;padding-left:1.25rem}
.pgrid .toc li{margin:0}
.pgrid .toc a{display:inline-flex;min-height:44px;align-items:center;color:var(--ink);font-weight:700}
.prose figure{margin:1.75rem 0}
.prose img{border-radius:var(--r)}
.prose a{color:var(--green-ink)}
.prose table{width:100%;border-collapse:collapse}
.prose th,.prose td{padding:.6rem;text-align:left;border-bottom:1px solid var(--line)}
.prose>*:first-child{margin-top:0}
.ptags{margin-top:2rem;display:flex;gap:.4rem;flex-wrap:wrap}
.ptags a{display:inline-flex;align-items:center;min-height:44px;padding:.2rem .9rem;border-radius:var(--pill);background:var(--wash);font-size:.875rem;font-weight:700}
.sechead.wp-block-group{display:flex}
.form-note{color:var(--grey)}

/* 16b. Blog (home, index, single, category, tag, archive) ------------------------------------------------------- */
/* the current crumb (added by the blog script from the h1): one line, cut with an ellipsis; the h1 carries it in full */
.crumbs li.cur{display:flex;align-items:center;min-width:0;flex:1 1 8rem}
.crumbs li.cur::before{flex:none}
.crumbs li.cur span{display:block;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:44px}
/* list head: the prototype's spacing (pill, h1, description, then the chips) */
.blog-head.head{margin-bottom:clamp(2rem,5vw,3.5rem)}
.blog-head h1,.blog-head .wp-block-query-title{margin-bottom:1rem}
.blog-head .sub{margin-top:0;margin-bottom:1rem}
.blog-head p.tag{background:var(--mint)}
/* tag names are stored lower case ("law"); the stored name is left alone, the h1 reads as a title */
.blog-head .wp-block-query-title.is-tag{text-transform:capitalize}
/* byline: By {author} . date . read time */
.byline .by{display:flex;gap:.3em}
.byline .by>*{margin:0}
/* post body: old-editor posts are bare p, ul, ol and h4 */
.prose>p{margin:0 0 1rem}
.prose>ul,.prose>ol{margin:0 0 1rem;padding-left:1.25rem}
.prose li>ul,.prose li>ol{margin:.5rem 0 0}
.prose h4{font-size:1.15rem;line-height:1.3;margin:1.75rem 0 .5rem}
.prose h5,.prose h6{font-size:1.05rem;line-height:1.35;margin:1.5rem 0 .5rem}
.prose h2+h3,.prose h3+h4{margin-top:1rem}
.prose img{max-width:100%;height:auto}
.prose .wp-block-embed,.prose iframe{max-width:100%}
.prose .wp-block-embed__wrapper iframe{width:100%}
.prose pre{max-width:100%;overflow-x:auto}
.prose{overflow-wrap:break-word}
/* MailPoet's below-post form puts its own heading margins (!important) inside .prose; keep it a quiet card */
.prose .mailpoet_form h2.mailpoet-heading{margin:0 0 .5rem!important;font-size:1.5rem!important}
/* tags and the next step line up with the text column */
.pgrid.solo .ptags,.pgrid.solo .post-next{max-width:42rem;margin-inline:auto}
.post-next{margin-top:2.5rem;margin-bottom:0;text-align:left}
.post-next h2{margin:0 0 .5rem}
.post-next p{color:var(--grey);margin:0 0 1.25rem}
/* contents box (built from the h2s by the inline script): the prototype's two-column .pgrid from 60rem */
.pgrid.has-toc .toc .box{margin:0}
@media (min-width:60rem){
  .pgrid.has-toc>:not(.toc){grid-column:2}
  .pgrid.has-toc>.toc{grid-column:1;grid-row:1/span 3}
  .pgrid.has-toc>.ptags,.pgrid.has-toc>.post-next{max-width:42rem}
}
.prose h2[id]{scroll-margin-top:6rem}

/* the wavy underline sits clear of the letters (Karim 21 Oct) */
.else h2,.else .wp-block-heading{padding-bottom:.35em}

/* 16:9 blog images (Karim 21 Oct): featured image on top of the dark card */
.bcard .wp-block-post-featured-image{position:relative;aspect-ratio:16/9;margin:0}
.bcard .wp-block-post-featured-image img{width:100%;height:100%;object-fit:cover}

/* 18. MailPoet pop-up: full screen or not at all (Karim, 3 Nov 2026) -----------------------------------------------
   MailPoet prints div#mp_form_popup1.mailpoet_form_popup (fixed, 440px, or the bottom 40% of a phone) and a sibling
   .mailpoet_form_popup_overlay. Its form styles sit on an id selector and in style attributes, hence the !important
   here; functions.php 16 strips the style attributes, adds visible labels, focus handling and Esc. When open it
   covers the whole viewport in ink with the form as a white panel in the middle; page scroll is locked. */
body div.mailpoet_form_popup.active{position:fixed!important;inset:0!important;left:0!important;top:0!important;right:0!important;bottom:0!important;transform:none!important;width:100%!important;min-width:0!important;max-width:none!important;height:100vh!important;height:100dvh!important;max-height:none!important;margin:0!important;padding:4.5rem 1rem 2rem!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--ink)!important;display:grid!important;place-items:center;overflow-y:auto!important;overscroll-behavior:contain;z-index:100001!important;font-family:var(--sans)!important;text-align:left!important}
body .mailpoet_form_popup_overlay.active{background:var(--ink)!important;opacity:1!important;inset:0;height:100vh!important;height:100dvh!important}
html:has(body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account):not(.woocommerce-order-received) div.mailpoet_form_popup.active){overflow:hidden}
div.mailpoet_form_popup form.mailpoet_form{width:100%;max-width:30rem;margin:0;padding:clamp(1.5rem,6vw,2.5rem);border-radius:var(--r-lg);background:var(--white);color:var(--ink);box-shadow:none}
div.mailpoet_form_popup .mailpoet-heading{margin:0 0 .5rem!important;color:var(--ink)!important;font:800 clamp(1.75rem,7vw,2.4rem)/1.1 var(--sans)!important;letter-spacing:-.03em!important;text-align:center!important;text-transform:none}
div.mailpoet_form_popup .mailpoet-heading *{font:inherit!important;color:inherit!important}
div.mailpoet_form_popup .mailpoet_form_paragraph{margin:0 0 1.5rem!important;color:var(--grey)!important;font:400 1rem/1.5 var(--sans)!important;text-align:center!important}
div.mailpoet_form_popup .mailpoet_form_paragraph:not(.last){font:500 1.6rem/1.2 var(--script)!important;color:var(--green-ink)!important}
div.mailpoet_form_popup .mailpoet_form_paragraph *{font:inherit!important;color:inherit!important}
div.mailpoet_form_popup .mailpoet_form_paragraph.last{margin:1.25rem 0 0!important;font-size:.9375rem!important}
div.mailpoet_form_popup .mailpoet_paragraph{margin:0 0 1.1rem!important;line-height:1.4!important}
/* One field, as the newsletter section (section 6): the optional first and last name fields are hidden */
div.mailpoet_form_popup .mailpoet_paragraph:has(input[autocomplete=given-name]),div.mailpoet_form_popup .mailpoet_paragraph:has(input[autocomplete=family-name]){display:none!important}
div.mailpoet_form_popup .ital-mp-label{display:block;margin:0 0 .4rem;font:700 .9375rem/1.3 var(--sans);color:var(--ink)}
div.mailpoet_form_popup input.mailpoet_text{display:block;width:100%!important;min-height:52px;margin:0!important;padding:.7rem 1.25rem!important;border:2px solid var(--edge)!important;border-radius:var(--pill)!important;background:var(--white)!important;color:var(--ink)!important;font:400 1.0625rem/1.4 var(--sans)!important;box-sizing:border-box}
div.mailpoet_form_popup input.mailpoet_text::placeholder{color:var(--grey);opacity:1}
div.mailpoet_form_popup input.mailpoet_submit{display:block;width:100%!important;min-height:52px;margin:.4rem 0 0!important;padding:.8rem 2rem!important;border:0!important;border-radius:var(--pill)!important;background:var(--mint)!important;color:var(--ink)!important;font:700 1.0625rem/1.2 var(--sans)!important;cursor:pointer}
div.mailpoet_form_popup input.mailpoet_submit:hover{background:var(--ink)!important;color:#fff!important}
div.mailpoet_form_popup input:focus-visible{outline:3px solid var(--ink)!important;outline-offset:3px}
div.mailpoet_form_popup .mailpoet_form_close_icon{position:fixed!important;top:.75rem!important;right:.75rem!important;width:44px!important;height:44px!important;margin:0!important;padding:12px!important;border-radius:50%;background:rgba(255,255,255,.12);box-sizing:border-box;z-index:100003!important}
div.mailpoet_form_popup .mailpoet_form_close_icon:hover{background:rgba(255,255,255,.24)}
div.mailpoet_form_popup .mailpoet_form_close_icon:focus-visible{outline:3px solid var(--mint)!important;outline-offset:2px}
div.mailpoet_form_popup .parsley-errors-list,div.mailpoet_form_popup .mailpoet_validate_error,div.mailpoet_form_popup .parsley-required,div.mailpoet_form_popup .parsley-custom-error-message{color:var(--err)!important;font-weight:700;font-size:.9375rem}
div.mailpoet_form_popup .parsley-errors-list{margin:.4rem 0 0;padding:0;list-style:none}
div.mailpoet_form_popup input.parsley-error{border-color:var(--err)!important;color:var(--ink)!important}
div.mailpoet_form_popup input.parsley-success{color:var(--ink)!important}
div.mailpoet_form_popup .mailpoet_validate_success{color:var(--green-ink)!important;font-weight:700}
@media (prefers-reduced-motion:reduce){div.mailpoet_form_popup,.mailpoet_form_popup_overlay{animation:none!important}}
/* Never in the way of a purchase: no pop-up on the basket, checkout, account or order received pages. Same
   specificity as the .active rule above and later, so it wins. */
body.woocommerce-cart div.mailpoet_form_popup,body.woocommerce-cart .mailpoet_form_popup_overlay,
body.woocommerce-checkout div.mailpoet_form_popup,body.woocommerce-checkout .mailpoet_form_popup_overlay,
body.woocommerce-account div.mailpoet_form_popup,body.woocommerce-account .mailpoet_form_popup_overlay,
body.woocommerce-order-received div.mailpoet_form_popup,body.woocommerce-order-received .mailpoet_form_popup_overlay{display:none!important}

/* 19. Mobile header (Karim, 3 Nov 2026): hidden when the visitor lands on the page, slides in while scrolling
   down, slides away while scrolling up. Below 62rem the header is fixed and floats over the page, so it never
   holds space and never leaves a gap. functions.php 16 toggles html.hdr-show; html.hdr-js marks that the script
   runs (without it the header simply stays visible). Desktop keeps the sticky header. */
@media (max-width:61.99rem){
  .hdr.wp-block-template-part,.admin-bar .hdr.wp-block-template-part{position:fixed;top:0;left:0;right:0;z-index:40;box-shadow:0 2px 14px rgba(33,26,53,.14);transition:transform .22s ease}
  html.hdr-js:not(.hdr-show) .hdr.wp-block-template-part{transform:translateY(calc(-100% - 16px));box-shadow:none}
  html.hdr-js .hdr.wp-block-template-part:focus-within,
  html.hdr-js .hdr.wp-block-template-part:has(details[open]){transform:none}
  html:not(.hdr-js) .wp-site-blocks{padding-top:var(--ital-hdr-h,4.5rem)}
}
@media (min-width:601px) and (max-width:782px){body.admin-bar .hdr.wp-block-template-part{top:46px}}
@media (min-width:783px) and (max-width:61.99rem){body.admin-bar .hdr.wp-block-template-part{top:32px}}
@media (prefers-reduced-motion:reduce){.hdr.wp-block-template-part{transition:none}}

/* Nav links are 48px tap targets; centre the text inside them so it lines up with the logo and basket (Karim) */
.hdr .wp-block-navigation-item__content{display:inline-flex;align-items:center}

/* 20. Spacing scale: a little more room than the prototype's base rhythm (Karim, 3 Nov 2026) ---------------------
   Four steps, used for every head on the site, so a change here moves all of them together:
   --sp-eyebrow  pill or category line to its heading
   --sp-head     heading to its subline or lede (prototype 1rem)
   --sp-lede     lede or summary to body text, actions or a form
   --sp-block    a text block to the image or card grid below it (section heads keep ib.css's larger
                 clamp(2rem,5vw,3.5rem) where that is already more) */
:root{--sp-eyebrow:.75rem;--sp-head:1.25rem;--sp-lede:1.75rem;--sp-block:clamp(2rem,5vw,3rem)}
/* section heads (home, blog, archive, related) */
.head h1,.head h2,.head .wp-block-query-title{margin-bottom:var(--sp-head)}
.head{margin-bottom:max(var(--sp-block),clamp(2rem,5vw,3.5rem))}
.head p.tag,.blog-head p.tag,.phead .tag{margin-bottom:var(--sp-eyebrow)}
.blog-head h1,.blog-head .wp-block-query-title{margin-top:0}
/* page heros (home, about, contact, 404) */
.hero h1{margin-bottom:max(var(--sp-head),1.5rem)}
.hero .acts,.hero .acts.wp-block-buttons{margin-top:var(--sp-lede)}
.hero-contact .lede{margin-bottom:0}
/* store and category heads */
.shophead .wp-block-query-title,.shophead h1{margin-bottom:var(--sp-head)}
.shophead{padding-bottom:var(--sp-lede)}
/* post and plain-page heads: pill, title, byline, then the photo */
.phead h1,.phead .wp-block-post-title,.post.wp-block-group .phead .wp-block-post-title{margin:var(--sp-eyebrow) auto var(--sp-head)}
.phead>.wp-block-post-title:first-child,.phead>h1:first-child{margin-top:0}
.pfig,.phead .pfig,.phead .wp-block-post-featured-image{margin-top:var(--sp-block)}
/* checkout, basket and account heads */
.cohead{gap:var(--sp-head)}
/* product summary: category, title, price, description, then the form */
.buy .cat{margin-bottom:var(--sp-eyebrow)}
.buy h1,.buy .wp-block-post-title{margin-bottom:0}
.buy .pr{margin:var(--sp-head) 0}
.buy .short{margin-bottom:0}
.buy form.cart{margin-top:var(--sp-lede)}

/* 21. Shop journey fixes (live check, 3 Nov 2026) ----------------------------------------------------------------
   Each rule answers a fault seen on italbunny.com after the switch (GOLIVE-PAGECHECK-2026-11-03.md). */

/* 21a. Grids. WooCommerce's .wc-block-product-template__responsive.columns-3 outranks .sgrid and .prods, which gave
   two squeezed columns on a phone (store, categories, related) and two columns at 1440 on the home Collection.
   Restated with WooCommerce's own classes in front, at ib.css's breakpoints: 1 column, then 2, then 3. */
.wp-block-woocommerce-product-template.wc-block-product-template__responsive.sgrid{grid-template-columns:1fr;gap:1.25rem}
@media (min-width:36rem){.wp-block-woocommerce-product-template.wc-block-product-template__responsive.sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:60rem){.wp-block-woocommerce-product-template.wc-block-product-template__responsive.sgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.wp-block-woocommerce-product-template.wc-block-product-template__responsive.prods{grid-template-columns:1fr;gap:1.5rem}
@media (min-width:40rem){.wp-block-woocommerce-product-template.wc-block-product-template__responsive.prods{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:64rem){.wp-block-woocommerce-product-template.wc-block-product-template__responsive.prods{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* 21b. Category filter: the count sits on the line of its name, as the prototype's "Men (1)" */
.filters .wc-block-product-categories-list-item{display:flex;flex-wrap:wrap;align-items:center;margin:0}
.filters .wc-block-product-categories-list-item>a{display:inline-flex}
.filters .wc-block-product-categories-list-item-count{margin-left:.4rem}

/* 21c. Card button: the prototype's basket icon before the words */
.sgrid .wc-block-components-product-button .wp-block-button__link::before{content:"";flex:none;width:18px;height:18px;background:currentColor;-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='M5 8h14l-1.2 11.2a2 2 0 0 1-2 1.8H8.2a2 2 0 0 1-2-1.8z'/%3E%3Cpath d='M9 8V6a3 3 0 0 1 6 0v2'/%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='M5 8h14l-1.2 11.2a2 2 0 0 1-2 1.8H8.2a2 2 0 0 1-2-1.8z'/%3E%3Cpath d='M9 8V6a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E") center/contain no-repeat}
.sgrid .wc-block-components-product-button .wp-block-button__link{gap:.5rem;white-space:nowrap}

/* 21d. Gallery as the prototype's .gal: the grey card holds the photo, the 64px thumbnails sit under it on a phone
   (wrapping, never squashed) and down its left side from 52rem. ib.css gives .gal two columns (76px 1fr) for the
   prototype's own markup; the WooCommerce gallery is one element, so .gal is one column and the gallery itself is
   the grid. WooCommerce's float and 25% width rules are beaten by specificity, not !important. */
.pdp .gal{grid-template-columns:minmax(0,1fr)}
/* WooCommerce caps the gallery block at 512px; the photo fills its half of the page as in the prototype */
.pdp .gal .wp-block-woocommerce-product-image-gallery{max-width:none;width:100%;margin:0}
.pdp .gal .woocommerce-product-gallery.images{float:none;width:auto;margin:0;padding:0;background:none;box-shadow:none;border-radius:0;position:relative}
.pdp .gal .woocommerce-product-gallery.images .woocommerce-product-gallery__image{background:#F1F4F2;padding:clamp(.75rem,3vw,1.5rem);border-radius:var(--r-lg);box-sizing:border-box}
.pdp .gal .woocommerce-product-gallery.images .woocommerce-product-gallery__trigger{top:1.25rem;right:1.25rem;z-index:2}
.pdp .gal .woocommerce-product-gallery.images .flex-control-nav.flex-control-thumbs{display:flex;flex-wrap:wrap;gap:.6rem;margin:.75rem 0 0;padding:0;list-style:none}
.pdp .gal .woocommerce-product-gallery.images .flex-control-nav.flex-control-thumbs li{flex:none;float:none;width:64px;height:64px;margin:0;padding:0}
@media (min-width:52rem){
  .pdp .gal .woocommerce-product-gallery.images:has(.flex-control-thumbs){display:grid;grid-template-columns:76px minmax(0,1fr);gap:.75rem;align-items:start}
  .pdp .gal .woocommerce-product-gallery.images:has(.flex-control-thumbs)>.flex-viewport{grid-column:2;grid-row:1}
  .pdp .gal .woocommerce-product-gallery.images .flex-control-nav.flex-control-thumbs{grid-column:1;grid-row:1;flex-direction:column;flex-wrap:nowrap;align-items:center;margin:0;align-self:stretch;height:0;min-height:100%;overflow-y:auto;scrollbar-width:thin}
  .pdp .gal .woocommerce-product-gallery.images .flex-control-nav.flex-control-thumbs li{width:68px;height:68px;padding:2px}
}

/* 21e. Buy box: price at the prototype's size, room under the pay-later line, options as 48px pills */
.buy .pr .wc-block-components-product-price,.buy .pr .wc-block-components-product-price .amount{font-size:1.85rem;font-weight:800;line-height:1.2}
.buy .pr .wc-block-components-product-price del .amount{font-size:1.2rem;font-weight:400;color:var(--grey)}
.buy>.StripeElement{margin:var(--sp-head) 0}
.buy table.variations td.value{padding-bottom:.25rem}
.buy .cfvsw-swatches-container{display:flex;flex-wrap:wrap;gap:.5rem;margin:0}
.buy .cfvsw-swatches-container .cfvsw-swatches-option{display:inline-flex;align-items:center;justify-content:center;min-width:48px!important;min-height:48px!important;margin:0;padding:0 1.1rem;border-radius:var(--pill)!important;border:2px solid var(--line);background:var(--white);box-shadow:var(--shadow-sm);color:var(--ink);font-weight:700;font-size:.9375rem;cursor:pointer}
.buy .cfvsw-swatches-container .cfvsw-swatches-option:hover{border-color:var(--ink)}
.buy .cfvsw-swatches-container .cfvsw-swatches-option.cfvsw-selected-swatch{border-color:var(--green-ink);background:var(--wash)}
.buy .cfvsw-swatches-container .cfvsw-swatches-option:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.buy .cfvsw-swatches-container .cfvsw-swatch-inner{padding:0;font-size:inherit;color:inherit}

/* 21f. Add to basket row: the quantity pill and the button on one line, the express pay buttons on their own line
   below, and while no option is chosen, a line in words saying what is needed (the button alone gave no hint) */
.buy .woocommerce-variation-add-to-cart,.buy form.cart:not(.variations_form){flex-wrap:wrap}
.buy .woocommerce-variation-add-to-cart>:is(#cpsw-payment-request-wrapper,.wcpay-express-checkout-wrapper,#wc-stripe-express-checkout-element,#wc-stripe-express-checkout-button-separator),.buy form.cart>:is(#cpsw-payment-request-wrapper,.wcpay-express-checkout-wrapper,#wc-stripe-express-checkout-element,#wc-stripe-express-checkout-button-separator){order:5;flex-basis:100%;margin:0}
.buy .woocommerce-variation-add-to-cart-disabled::before{content:"Choose your options above to add this to your basket.";order:-1;flex-basis:100%;color:var(--ink);font-weight:700;font-size:.9375rem}

/* 21g. Tabs: one white bar, no grey tab chips; the panel's own "Description" heading repeats the tab name, so it goes */
.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs{display:flex;width:100%;margin:0;padding:0 .5rem;border:0;overflow-x:auto}
.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs::before,.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs::after,.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li::before,.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li::after{content:none;display:none}
.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li{background:none;border:0;border-radius:0;margin:0;padding:0}
.pdp-tabs .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li a{padding:0 1rem}
.pdp-tabs :is(.woocommerce-Tabs-panel--description,.woocommerce-Tabs-panel--additional_information)>h2:first-child{display:none}
/* Additional information: label in ink 700, value in ink, a divider between rows; on a phone the value sits under its
   label so long values (care, fabric) never squeeze into a narrow column */
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes{width:100%;margin:0;border:0;border-collapse:collapse}
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes tr{border-bottom:1px solid var(--line)}
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes tr:last-child{border-bottom:0}
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes :is(th,td){display:block;width:auto;padding:0;border:0;background:none;text-align:left;vertical-align:top;line-height:1.5;color:var(--ink);font-style:normal}
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes th{font-weight:700;padding-top:.85rem}
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes td{padding:.15rem 0 .85rem}
.pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes td p{margin:0;color:var(--ink)}
@media (min-width:36rem){
  .pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes :is(th,td){display:table-cell;padding:.85rem 0}
  .pdp-tabs .woocommerce-Tabs-panel table.woocommerce-product-attributes.shop_attributes th{width:min(40%,14rem);padding-right:1.5rem}
}

/* 21h. Checkout steps: ib.css's order-confirmed .done panel rule also matched .steps li.done, which centred, padded
   and pushed down step 1 */
.steps li.done{text-align:inherit;padding:0;margin:0}

/* 21i. Cart totals: WooPayments' pay-later message has a fixed one-line height; wrapped in our totals card its
   iframe covered "Proceed to checkout" on a phone */
.co-body .cart_totals #payment-method-message{height:auto!important;min-height:0;margin:0 0 1rem}

/* 21j. Option steps (assets/js/shop.js): "1. Choose a colour", then "2. Choose a size"; the picked value shows in the
   heading; a later row waits in a quieter style (dashed outline, grey words at 7:1, still tappable) with "Pick a
   colour first" under its heading; a too-early tap on Add to basket names the missing step beside its row. */
.buy form[data-ib-steps] table.variations th.label{display:none}
.buy form[data-ib-steps] table.variations tr+tr td.value{padding-top:1.25rem}
.buy .ib-step-head{margin:0 0 .6rem;font-weight:700;font-size:1.0625rem;line-height:1.4;color:var(--ink)}
.buy .ib-step-hint{margin:-.35rem 0 .6rem;color:var(--grey);font-size:.9375rem;line-height:1.4}
.buy .ib-step-err{display:flex;align-items:center;gap:.5rem;margin:.75rem 0 0;color:var(--err);font-weight:700;font-size:.9375rem;line-height:1.4}
.buy .ib-step-err::before{content:"!";flex:none;display:grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--err);color:#fff;font-size:.875rem}
.buy .ib-step-err[hidden],.buy .ib-step-hint[hidden]{display:none}
.buy .ib-waiting .cfvsw-swatches-container .cfvsw-swatches-option{background:var(--page);border:2px dashed var(--edge);box-shadow:none;color:var(--grey)}
.buy .ib-waiting .cfvsw-swatches-container .cfvsw-swatches-option:hover{border-style:solid;border-color:var(--ink);color:var(--ink)}
.buy .woocommerce-variation-add-to-cart-disabled[data-ib-need]::before{content:attr(data-ib-need)}
/* WooCommerce hides "Clear" with visibility, which kept a blank 44px line under the swatches */
.buy table.variations .reset_variations[style*=hidden]{display:none}
.buy .woocommerce-Price-currencySymbol{font-size:inherit}

/* 21k. Checkout login reminder (kept, Karim 3 Nov 2026): the "Returning customer?" line is a notice; the form it
   opens is a card of its own above the order form, fields stacked on a phone, Remember me and Log in on one row */
.co-checkout .woocommerce .woocommerce-form-login-toggle .woocommerce-info{margin-bottom:1rem}
.co-checkout .woocommerce form.woocommerce-form-login.login{border:0;border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem);margin:0 0 1.25rem;max-width:40rem}
.co-checkout .woocommerce form.woocommerce-form-login.login>p:first-child{color:var(--grey);margin:0 0 1rem}
.co-checkout .woocommerce form.woocommerce-form-login.login .form-row-first,.co-checkout .woocommerce form.woocommerce-form-login.login .form-row-last{float:none;width:100%}
.co-checkout .woocommerce form.woocommerce-form-login.login .clear{display:none}
.co-checkout .woocommerce form.woocommerce-form-login.login .form-row:has(.woocommerce-form-login__submit){flex-direction:column;align-items:stretch;gap:.75rem}
.co-checkout .woocommerce form.woocommerce-form-login.login .woocommerce-form-login__rememberme{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:.75rem;min-height:44px;margin:0;font-weight:700}
.co-checkout .woocommerce form.woocommerce-form-login.login .woocommerce-form-login__submit{width:100%;min-height:52px;margin:0}
@media (min-width:36rem){.co-checkout .woocommerce form.woocommerce-form-login.login .woocommerce-form-login__submit{width:auto;align-self:flex-start;padding-inline:2.5rem}}

/* 21m. Express pay at checkout (WooPayments' Google / Apple Pay, then Stripe Link): one group above the details, one
   "or" line under it. Each plugin prints its own "— OR —", so the first one is hidden whenever Stripe's follows. */
.co-checkout .woocommerce form.checkout>:is(.wcpay-express-checkout-wrapper,#wc-stripe-express-checkout-element){margin:0 0 .75rem;max-width:100%}
.co-checkout .woocommerce form.checkout>.wcpay-express-checkout-wrapper{flex-direction:column}
.co-checkout .woocommerce :is(#wcpay-express-checkout-button-separator,#wc-stripe-express-checkout-button-separator){align-items:center;gap:.75rem;margin:.5rem 0 1.25rem;color:var(--grey);font-weight:700;font-size:.9375rem;text-align:center}
.co-checkout .woocommerce :is(#wcpay-express-checkout-button-separator,#wc-stripe-express-checkout-button-separator)[style*=block]{display:flex!important}
.co-checkout .woocommerce :is(#wcpay-express-checkout-button-separator,#wc-stripe-express-checkout-button-separator)::before,
.co-checkout .woocommerce :is(#wcpay-express-checkout-button-separator,#wc-stripe-express-checkout-button-separator)::after{content:"";flex:1;height:1px;background:var(--line)}
.co-checkout .woocommerce form.checkout:has(#wc-stripe-express-checkout-element[style*=block]) #wcpay-express-checkout-button-separator{display:none!important}

/* 21n. Empty basket: the message as plain words inside its card (the notice frame inside a card read as two boxes) */
.co-body .woocommerce .wc-empty-cart-message .cart-empty.woocommerce-info,.co-body .woocommerce .wc-empty-cart-message .wc-block-components-notice-banner{border:0;background:none;padding:0;margin:0;justify-content:center;text-align:center;font-size:1.15rem}
.co-body .woocommerce .wc-empty-cart-message .wc-block-components-notice-banner>svg{display:none}
.co-checkout .woocommerce form.woocommerce-form-login.login .lost_password{margin:.25rem 0 0}
.co-checkout .woocommerce form.woocommerce-form-login.login .lost_password a{display:inline-flex;align-items:center;min-height:44px;font-weight:700}

/* 21l. My account (page-my-account.html): the page's lede under the title, and log in as one card when registration
   is off (section 15 covers the two-card log in / register layout and the signed-in dashboard) */
.acct-body .wp-block-post-content>p{color:var(--grey);max-width:38rem;margin:0 0 1.5rem}
.acct-body .woocommerce>h2{font-size:1.4rem;letter-spacing:-.02em;margin:0 0 1rem}
.acct-body .woocommerce>form.woocommerce-form-login,.acct-body .woocommerce>form.lost_reset_password,.acct-body .woocommerce>form.woocommerce-ResetPassword{max-width:34rem;border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow);padding:clamp(1.25rem,4vw,1.75rem);margin:0 0 1.25rem}
.acct-body .woocommerce>h2:has(+form.woocommerce-form-login){max-width:34rem}
.acct-body .woocommerce form .form-row-first,.acct-body .woocommerce form .form-row-last{float:none;width:100%}
.acct-body .woocommerce-MyAccount-content>p:first-child{margin-top:0}
.acct-body .woocommerce-MyAccount-content a:not(.button){color:var(--green-ink)}