/*
Theme Name: CO2Art Trade
Theme URI: https://trade.co2art.com/
Author: CO2Art
Description: The trade stores' own classic theme — co2art.eu's family look, shared with Quick order (Round 12). One stylesheet, one small script.
Version: 0.3.5
Requires at least: 6.8
Requires PHP: 8.3
Text Domain: co2art-trade
*/
/* Round 12 design plan: docs/research/2026-09-25-trade-stores-front/r12/README.md. The token block below is identical in
   portal/frontend/trade/src/trade.css (Quick order). Rules: forest = an action, moss = you type here, checker blue = not
   yet (the minimum meter). Sentence case everywhere; no capitals, no labels above headings. */
@font-face{font-family:"Montserrat";src:url("assets/fonts/montserrat-latin-wght.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root{
  --ink:#16161d; --text:#2c2f2a; --muted:#5c6457; --hair:#dfe4d8; --hair2:#cdd4c5; --ctl:#8b9484;
  --paper:#ffffff; --mist:#f4f6f1; --moss:#e3efd9; --moss-ink:#1f4204;
  --forest:#306505; --forest-dk:#264f04; --tank:#10240f; --checker:#2d6cdf;
  --warn:#8a5a00; --warn-bg:#fdf6e7; --err:#b3261e; --err-bg:#fdf1f0; --focus:#0b61cd;
  --info-ink:#173a6b; --info-bg:#e9f0fd; --ok-bg:#e6f2dc; --warn-line:#c98a14;
  --r:10px; --rp:16px; --w:1240px; --pad:32px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:"Montserrat",system-ui,sans-serif;font-size:15px;line-height:1.55;color:var(--text);background:var(--paper);
  font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
a{color:var(--forest);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--forest-dk)}
img{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.wrap{max-width:var(--w);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.sr,.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:8px;z-index:60;background:#fff;padding:10px 14px;border:1px solid var(--ink);border-radius:var(--r)}
.skip:focus{left:8px}

/* ---------------------------------------------------------------- type */
h1,h2,h3,.t-page,.t-sec,.t-big,.pp-h1{color:var(--ink);font-weight:650;letter-spacing:-.02em;line-height:1.15;text-wrap:balance}
.t-page{font-size:28px}
.t-sec{font-size:20px}
.t-big{font-size:28px}
.muted{color:var(--muted)}
.small{font-size:13px}
.xs{font-size:12px}
.ink{color:var(--ink)}
.b{font-weight:650}
.crumb{font-size:13px;color:var(--muted);padding:22px 0 6px}
.crumb a{color:var(--muted);text-decoration:none}
.crumb a:hover{color:var(--ink)}
.crumb b{color:var(--ink);font-weight:600}
.lnk{font-weight:600;color:var(--forest);text-decoration:underline}

/* ---------------------------------------------------------------- buttons + fields (co2art.eu: forest, round-slight) */
.btn,.button,button.button,a.button,input.button,.woocommerce-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 22px;background:var(--forest);color:#fff;border:1px solid var(--forest);border-radius:var(--r);
  font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background-color .15s}
.btn:hover,.button:hover{background:var(--forest-dk);border-color:var(--forest-dk);color:#fff}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--hair2)}
.btn.ghost:hover{border-color:var(--ink);background:transparent;color:var(--ink)}
.btn.light{background:#fff;color:var(--ink);border-color:#fff}
.btn.light:hover{background:var(--moss);border-color:var(--moss);color:var(--ink)}
.btn.ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn.ghost-light:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}
.btn.wide{width:100%}
.btn.sm{min-height:36px;padding:0 14px;font-size:14px}
.btn[disabled],.btn.off,.button:disabled,.button.disabled{background:var(--mist);border-color:var(--hair);color:var(--muted);cursor:not-allowed}
label.f,.form-row label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin:0 0 6px}
.form-row .required{color:var(--err);text-decoration:none}
/* every text field — also the ones plugins print without WooCommerce's .input-text (B2BKing's application fields, SalesKing) */
.in,.input-text,.form-row select,.form-row textarea,select.orderby,
.form-row input:not([type=checkbox],[type=radio],[type=hidden],[type=file],[type=submit],[type=button]){width:100%;min-height:44px;padding:0 14px;
  border:1px solid var(--ctl);border-radius:var(--r);background:#fff;color:var(--ink)}
::placeholder{color:var(--muted);opacity:1}
.form-row textarea{padding:10px 14px;min-height:96px}
.in:focus,.input-text:focus,.form-row select:focus,.form-row textarea:focus,
.form-row input:not([type=checkbox],[type=radio],[type=hidden],[type=file],[type=submit],[type=button]):focus{outline:2px solid var(--focus);outline-offset:0;border-color:transparent}
/* WooCommerce's country picker (selectWoo) as one of our fields; body-prefixed because select2.css loads after this file */
body .select2-container .select2-selection--single{height:44px;border:1px solid var(--ctl);border-radius:var(--r);background:#fff}
body .select2-container .select2-selection--single .select2-selection__rendered{line-height:42px;padding:0 40px 0 14px;color:var(--ink)}
body .select2-container .select2-selection--single .select2-selection__placeholder{color:var(--muted)}
body .select2-container .select2-selection--single .select2-selection__arrow{height:42px;width:36px;top:1px;right:4px}
body .select2-container--focus .select2-selection--single,body .select2-container--open .select2-selection--single{outline:2px solid var(--focus);outline-offset:0;border-color:transparent;border-radius:var(--r)}
body .select2-dropdown,body .select2-container--open .select2-dropdown--below,body .select2-container--open .select2-dropdown--above{border:1px solid var(--hair2);border-radius:var(--r);overflow:hidden;background:#fff}
body .select2-container--open .select2-dropdown--below{margin-top:4px}
body .select2-search--dropdown{padding:8px}
body .select2-search--dropdown .select2-search__field{min-height:40px;padding:0 12px;border:1px solid var(--ctl);border-radius:8px}
body .select2-results__option{padding:9px 14px;font-size:14px;color:var(--ink)}
body .select2-container--default .select2-results__option--highlighted[aria-selected],body .select2-container--default .select2-results__option--highlighted[data-selected]{background:var(--moss);color:var(--moss-ink)}
body .select2-container--default .select2-results__option[aria-selected=true],body .select2-container--default .select2-results__option[data-selected=true]{background:var(--mist);color:var(--ink);font-weight:600}
.fld,.form-row{margin:0 0 16px}
.chk,.form-row label.checkbox,.woocommerce-form__label-for-checkbox,.woocommerce-terms-and-conditions-wrapper label{display:flex;gap:10px;
  align-items:flex-start;font-size:14px;font-weight:500;color:var(--text)}
.chk input,.woocommerce-form__label-for-checkbox input{width:18px;height:18px;margin-top:2px;accent-color:var(--forest)}

/* the stepper — moss = you type here (shared with Quick order) */
.step{display:inline-grid;grid-template-columns:36px 54px 36px;height:44px;border-radius:var(--r);background:var(--moss);align-items:center}
.step button{height:100%;border:0;background:none;color:var(--moss-ink);font-size:18px;font-weight:600;cursor:pointer;border-radius:var(--r)}
.step button:hover{background:rgba(48,101,5,.12)}
.step input{border:0;background:#fff;height:34px;width:54px;text-align:center;font-weight:650;color:var(--ink);border-radius:8px;
  -moz-appearance:textfield}
.step input::-webkit-outer-spin-button,.step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.step.zero input{color:var(--muted);font-weight:500}
.step.on{box-shadow:inset 0 0 0 1.5px var(--forest)}
.step button:disabled,.step input:disabled{opacity:.4;cursor:not-allowed}

/* status marks */
.dot{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--forest)}
.dot::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.dot.low{color:var(--warn)}
.chip{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:13px;font-size:12.5px;font-weight:600;background:var(--mist);color:var(--ink)}
.chip.ok{background:var(--moss);color:var(--moss-ink)}
.chip.go{background:#e5edfb;color:#1d4aa1}
.chip.wait{background:var(--warn-bg);color:var(--warn)}

/* notices (ours + WooCommerce's) */
.note,.woocommerce-message,.woocommerce-info,.woocommerce-error{list-style:none;display:flex;gap:14px;align-items:center;justify-content:space-between;
  flex-wrap:wrap;padding:14px 18px;margin:18px 0;background:var(--mist);border-radius:var(--r);font-size:14px;color:var(--ink)}
/* every notification in its own colour, never the cards' grey (Karol 2026-09-27): info blue · success green · warning amber ·
   error red — a tinted box with a bar on the left */
.note,.woocommerce-info{background:var(--info-bg);color:var(--info-ink);box-shadow:inset 4px 0 0 var(--checker)}
.woocommerce-message{background:var(--ok-bg);color:var(--moss-ink);box-shadow:inset 4px 0 0 var(--forest)}
.note.warn{background:var(--warn-bg);color:var(--warn);box-shadow:inset 4px 0 0 var(--warn-line)}
.woocommerce-error{background:var(--err-bg);color:var(--err);box-shadow:inset 4px 0 0 var(--err)}
.note a,.woocommerce-info a:not(.button),.woocommerce-message a:not(.button),.woocommerce-error a:not(.button){color:inherit;font-weight:600}
.woocommerce-error li+li{margin-top:6px}
.woocommerce-notices-wrapper:empty{display:none}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{content:none}
.woocommerce-message .button,.woocommerce-info .button{order:2;min-height:36px;padding:0 14px;font-size:14px}
.note.top{margin-top:24px}

/* the drop-checker meter: blue before the minimum, forest once reached */
.mov{display:grid;gap:8px}
.mov .bar{height:8px;background:var(--hair);border-radius:4px;overflow:hidden}
.mov .bar i{display:block;height:100%;background:var(--checker);border-radius:4px}
.mov.done .bar i{background:var(--forest)}
.mov b{color:var(--ink)}

/* ---------------------------------------------------------------- header (the same component in Quick order) */
.hd{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--hair)}
.admin-bar .hd{top:32px}
.hd .wrap{display:flex;align-items:center;gap:26px;height:68px}
.logo{display:inline-flex;align-items:center;flex:none;min-height:44px}
.logo img{height:40px;width:auto}
.nav{display:flex;gap:4px}
.nav a{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:8px;color:var(--muted);font-weight:550;font-size:15px;text-decoration:none}
.nav a:hover{color:var(--ink);background:var(--mist)}
.nav a[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--forest);border-radius:0}
.icons{display:flex;gap:10px;align-items:center;margin-left:auto}
.hfind{position:relative;width:230px}
.hfind input{width:100%;height:40px;padding:0 12px 0 36px;border:1px solid var(--hair);border-radius:var(--r);background:var(--mist)}
.hfind input:focus{background:#fff}
.hfind svg{position:absolute;left:11px;top:11px;width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2}
.ic{position:relative;display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;color:var(--ink);border-radius:var(--r)}
.ic:hover{background:var(--mist);color:var(--ink)}
.ic svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.8}
button.ic{border:0;background:none;cursor:pointer}
.bag{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 14px 0 12px;border:1px solid var(--hair2);border-radius:20px;
  color:var(--ink);text-decoration:none;font-weight:600;font-size:14px}
.bag:hover{border-color:var(--ink);color:var(--ink)}
.bag svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.8}
.bag .drop{width:9px;height:9px;border-radius:50%;background:var(--checker)}
.bag .drop.ok{background:var(--forest)}
.bag .n{color:var(--muted);font-weight:500}
.burger{display:none}

/* ---------------------------------------------------------------- the tank: the one photographic band */
.tank{position:relative;color:#fff;background:var(--tank) center/cover no-repeat;isolation:isolate}
.tank::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(9,24,8,.86) 0%,rgba(9,24,8,.62) 42%,rgba(9,24,8,.12) 78%)}
.tank h1,.tank h2{color:#fff}
.tank-hero{background-image:url("assets/img/tank-bubbles.jpg");min-height:560px;display:flex;align-items:center}
.tank-hero .wrap{width:100%}
.tank-copy{max-width:560px}
.tank-copy h1{font-size:46px;font-weight:700;letter-spacing:-.03em;line-height:1.05}
.tank-copy p{font-size:18px;line-height:1.5;color:rgba(255,255,255,.86);margin:18px 0 28px;max-width:46ch}
.ctas{display:flex;gap:12px;flex-wrap:wrap}
.tank-band{background-image:url("assets/img/tank-calm.jpg");background-position:center 60%}
.tank-band .wrap{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;min-height:220px;padding-top:40px;padding-bottom:34px}
.tank-band h1{font-size:34px;font-weight:700;letter-spacing:-.03em}
.tank-band .who{font-size:14px;color:rgba(255,255,255,.78);margin-top:6px}
.facts{display:flex;gap:34px;flex-wrap:wrap}
.facts div{font-size:13px;color:rgba(255,255,255,.78);line-height:1.35}
.facts b{display:block;font-size:20px;font-weight:650;color:#fff;letter-spacing:-.01em}

/* ---------------------------------------------------------------- landing (signed out) */
.range{padding-top:64px;padding-bottom:24px}                       /* top + bottom only — the .wrap keeps its side gutter (phone) */
.range h2,.reasons h2,.apply h2{font-size:28px}
.range .sub{color:var(--muted);margin-top:6px;max-width:60ch}
.tiles{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:auto auto;gap:18px;margin-top:28px}
.tile{position:relative;display:flex;align-items:center;justify-content:center;border-radius:var(--rp);overflow:hidden;background:var(--mist);
  text-decoration:none;color:var(--ink);min-height:300px;padding:18px 18px 54px}
.tile img{width:100%;height:100%;max-height:340px;object-fit:contain;mix-blend-mode:multiply}
.tile.big{grid-row:span 2;padding:30px 30px 64px}
.tile.big img{max-height:620px}
.tile:hover span{background:var(--ink);color:#fff}
.tile span{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.94);padding:8px 12px;border-radius:var(--r);font-weight:600;font-size:14px}
.reasons{padding-top:40px;padding-bottom:20px}
.reasons .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:22px}
.reasons h3{font-size:17px;margin-bottom:6px}
.reasons p{color:var(--muted)}
.apply{margin:40px auto 80px;display:grid;grid-template-columns:1fr 360px;align-items:center;gap:40px;background:var(--mist);border-radius:var(--rp);
  padding:40px 44px}
.apply p{color:var(--muted);margin:10px 0 22px;max-width:52ch}
.apply img{border-radius:var(--r);mix-blend-mode:multiply}

/* ---------------------------------------------------------------- shop */
.subbar{border-bottom:1px solid var(--hair);background:#fff}
.subbar .wrap{display:flex;align-items:center;gap:24px;min-height:62px}
.cats{display:flex;gap:6px;flex-wrap:wrap}
.cats a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:18px;color:var(--ink);font-size:14px;font-weight:550;
  text-decoration:none;border:1px solid var(--hair)}
.cats a:hover{border-color:var(--ink)}
.cats a[aria-current]{background:var(--ink);border-color:var(--ink);color:#fff}
.find{margin-left:auto;position:relative;width:300px}
.find .in{padding-left:38px;min-height:40px;background:var(--mist);border-color:var(--hair)}
.find svg{position:absolute;left:12px;top:11px;width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2}
.views{display:none}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 24px;padding:30px 0 70px}
.grid.flush{padding-top:0}
.card{display:flex;flex-direction:column}
.card .ph{display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;padding:22px;background:var(--mist);border-radius:var(--rp)}
.card .ph img{max-height:100%;width:auto;object-fit:contain;mix-blend-mode:multiply}
.card h3{font-size:15px;font-weight:600;letter-spacing:-.005em;line-height:1.35;margin-top:14px;min-height:40px}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.card .sku{font-size:12.5px;color:var(--muted);margin-top:3px}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:8px}
.price b{font-size:19px;font-weight:700;color:var(--ink)}
.price .rrp{font-size:13px;color:var(--muted)}
.card .last{font-size:12.5px;color:var(--muted);margin-top:4px}
.card .last b{color:var(--ink);font-weight:650}
.card .buy{display:flex;gap:8px;margin-top:14px;align-items:center}
.card .buy .btn{flex:1;padding:0 12px}
.srch{margin:26px 0 0}
.empty{padding:40px 0;color:var(--muted)}
.woocommerce-pagination ul{list-style:none;display:flex;gap:6px;justify-content:center;padding:10px 0 50px}
.woocommerce-pagination a,.woocommerce-pagination span{display:inline-flex;min-width:40px;min-height:40px;align-items:center;justify-content:center;
  border:1px solid var(--hair);border-radius:var(--r)}

/* ---------------------------------------------------------------- product */
.pp-top{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;padding:6px 0 56px}
.gal .main{display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;background:var(--mist);border-radius:var(--rp);padding:40px}
.gal .main img{max-height:100%;width:auto;object-fit:contain;mix-blend-mode:multiply}
.gal .thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:10px}
.gal .thumbs .th{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;padding:6px;background:var(--mist);border:0;border-radius:var(--r);cursor:pointer}
.gal .thumbs .th[aria-current=true]{box-shadow:inset 0 0 0 2px var(--forest)}
.gal .thumbs .th img{max-height:100%;width:auto;mix-blend-mode:multiply}
.pp-h1{font-size:30px;font-weight:700;letter-spacing:-.025em}
.pbox{display:flex;gap:28px;align-items:flex-end;margin:18px 0 8px;flex-wrap:wrap}
.pbox small{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-bottom:2px;letter-spacing:0}
.pbox .tp{font-size:28px;font-weight:700;color:var(--ink);letter-spacing:-.02em}
.pbox .rp{font-size:16px;color:var(--muted)}
.vm{border-collapse:collapse;width:100%;margin:20px 0 6px}
.vm th{font-size:13px;font-weight:600;color:var(--muted);text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--hair2)}
.vm th[scope=row]{font-size:14px;color:var(--ink);border-bottom:1px solid var(--hair)}
.vm th[scope=row] small{display:block;font-weight:500;margin-top:2px}
.vm td{padding:10px 12px 10px 0;border-bottom:1px solid var(--hair);vertical-align:middle}
.vm .pp2{display:block;font-size:12.5px;color:var(--muted);margin-top:5px}
.sw{display:inline-flex;align-items:center;gap:9px;font-weight:600;color:var(--ink);font-size:14px}
.sw i{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.addrow{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:18px}
.meta{margin-top:26px;border-top:1px solid var(--hair);padding-top:16px;font-size:14px;display:grid;grid-template-columns:110px 1fr;gap:6px}
.meta dt{color:var(--muted)}
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--hair);margin-top:6px}
.tabs a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;color:var(--muted);font-weight:600;text-decoration:none}
.tabs a[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--forest)}
.tabbody{max-width:760px;margin:26px 0 60px}
.tabbody ul{margin:10px 0 0 18px}
.tabsec{scroll-margin-top:100px}
.tabsec+.tabsec{margin-top:30px;padding-top:26px;border-top:1px solid var(--hair)}
.tabsec h2{font-size:20px;margin-bottom:12px}
.tabsec table{border-collapse:collapse;width:100%}
.tabsec th,.tabsec td{text-align:left;padding:8px 10px 8px 0;border-bottom:1px solid var(--hair)}
.rel h2{margin:10px 0 0}

/* ---------------------------------------------------------------- basket, checkout */
.pg{padding-top:30px;padding-bottom:70px}
.pg-h{margin-bottom:22px}
.content>*+*{margin-top:14px}
.two{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:44px;align-items:start}
.two>*{min-width:0}
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:13px;font-weight:600;color:var(--muted);text-align:left;padding:10px 10px 10px 0;border-bottom:1px solid var(--hair2)}
.tbl td{padding:16px 10px 16px 0;border-bottom:1px solid var(--hair);vertical-align:middle}
.tbl .r{text-align:right}
.tbl .ph{width:84px}
.tbl .ph img{width:68px;height:68px;object-fit:contain;background:var(--mist);border-radius:var(--r);padding:6px;mix-blend-mode:multiply}
.tbl .nm{font-weight:600;color:var(--ink)}
.tbl .nm a{color:var(--ink);text-decoration:none}
.tbl .nm small{display:block;font-weight:500;color:var(--muted);font-size:12.5px;margin-top:2px}
.x{display:inline-flex;width:36px;height:36px;align-items:center;justify-content:center;border-radius:var(--r);color:var(--muted);font-size:20px;text-decoration:none}
.x:hover{background:var(--err-bg);color:var(--err)}
.cart-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:16px}
.cart-actions .coupon summary{cursor:pointer;color:var(--forest);font-weight:600}
.cart-actions .coupon[open]{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cart-actions .coupon .input-text{width:180px}
.sum{background:var(--mist);border-radius:var(--rp);padding:28px;position:sticky;top:92px}
.sum h2{font-size:20px;margin-bottom:16px}
.sum .lns{margin-top:18px}
.sum .ln{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--hair);font-size:14px}
.sum .ln span:first-child{color:var(--muted)}
.sum .tot{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0 4px}
.sum .tot span{font-weight:600;color:var(--ink)}
.sum .tot b{font-size:26px;color:var(--ink);letter-spacing:-.02em}
.wc-proceed-to-checkout{margin-top:14px}
.sum p.xs{margin-top:12px;color:var(--muted)}
.box{border:1px solid var(--hair);border-radius:var(--rp);padding:22px 24px;margin-bottom:18px}
.box h3{font-size:17px;margin-bottom:12px}
.addr{line-height:1.65;color:var(--ink)}
details.fold>summary{display:inline-block;cursor:pointer;margin:12px 0 4px;list-style:none;color:var(--forest);font-weight:600;text-decoration:underline}
details.fold>summary::-webkit-details-marker{display:none}
details.fold[open]>summary{margin-bottom:16px}
.co2t-vat{margin-top:14px}.co2t-vat .form-row{margin-bottom:0}.co2t-vat-note{margin-top:8px}.co2t-vat:has(.b2bking_vat_hidden) .co2t-vat-note{display:none}   /* the VAT number beside Validate VAT, outside the fold */
form.checkout{display:grid;grid-template-columns:minmax(0,1fr) 420px;grid-template-areas:"cust head" "cust review";gap:0 44px;align-items:start}
form.checkout #customer_details{grid-area:cust}
form.checkout #order_review_heading{grid-area:head;background:var(--mist);border-radius:var(--rp) var(--rp) 0 0;padding:28px 28px 0;margin:0;font-size:20px}
form.checkout #order_review{grid-area:review;background:var(--mist);border-radius:0 0 var(--rp) var(--rp);padding:10px 28px 28px}
#customer_details .col-1,#customer_details .col-2{width:auto;float:none}
.woocommerce-shipping-fields h3,.woocommerce-additional-fields h3{font-size:17px;margin:18px 0 12px}
#ship-to-different-address{margin:18px 0 8px}
#ship-to-different-address label{font-size:15px}
.woocommerce-checkout-review-order-table{width:100%;border-collapse:collapse;font-size:14px}
.woocommerce-checkout-review-order-table th,.woocommerce-checkout-review-order-table td{text-align:left;padding:9px 0;border-bottom:1px solid var(--hair);vertical-align:top}
.woocommerce-checkout-review-order-table td:last-child,.woocommerce-checkout-review-order-table th:last-child{text-align:right}
.woocommerce-checkout-review-order-table thead th{color:var(--muted);font-weight:600;font-size:13px}
.woocommerce-checkout-review-order-table .order-total td,.woocommerce-checkout-review-order-table .order-total th{font-size:20px;color:var(--ink);font-weight:700;border-bottom:0;padding-top:16px}
.woocommerce-checkout-review-order-table .product-quantity{color:var(--muted);font-weight:600}
#shipping_method{list-style:none}
#payment{margin-top:18px}
#payment ul.payment_methods{list-style:none;display:grid;gap:10px}
#payment li.wc_payment_method{border:1px solid var(--hair2);border-radius:var(--r);padding:14px 16px;background:#fff}
#payment li.wc_payment_method>label{font-weight:650;color:var(--ink);cursor:pointer}
#payment li.wc_payment_method>input{accent-color:var(--forest)}
#payment .payment_box{margin-top:10px;font-size:13px;color:var(--muted)}
#payment .place-order{margin-top:18px}
#payment #place_order{width:100%;min-height:50px;font-size:16px}
.woocommerce-terms-and-conditions-wrapper{font-size:13px;margin-bottom:12px}
#wcpay-express-checkout-element,.wcpay-express-checkout-wrapper,#wcpay-express-checkout-button-separator,.wc-block-components-express-payment,
#wc-stripe-payment-request-wrapper{display:none!important}
#b2bking_checkout_registration_validate_vat_button{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;margin-top:8px;background:#fff;
  color:var(--ink);border:1px solid var(--hair2);border-radius:var(--r);font-size:14px;font-weight:600;cursor:pointer}
#b2bking_checkout_registration_validate_vat_button:disabled{color:var(--forest);cursor:default}
.woocommerce-checkout .b2bking_vat_hidden,.woocommerce-checkout .b2bking_vat_countries_hidden{display:none!important}   /* B2BKing's script toggles these per country */

/* ---------------------------------------------------------------- account */
.acc{display:grid;grid-template-columns:230px minmax(0,1fr);gap:44px;padding:4px 0 40px}
.acc-nav{display:flex;flex-direction:column;gap:2px;position:sticky;top:92px;align-self:start}
.acc-nav a{display:block;padding:10px 14px;border-radius:var(--r);font-size:15px;font-weight:550;color:var(--muted);text-decoration:none}
.acc-nav a:hover{background:var(--mist);color:var(--ink)}
.acc-nav a[aria-current]{background:var(--moss);color:var(--moss-ink)}
.acc-nav a.q{color:var(--forest);margin-top:10px;border-top:1px solid var(--hair);border-radius:0;padding-top:14px}
.acc-h{margin-bottom:18px}
.ords .acts a{margin-left:14px;font-weight:600}
.ords a.ink{text-decoration:none}
.todo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.todo .t{display:block;padding:20px 22px;border-radius:var(--rp);background:var(--mist);text-decoration:none;color:inherit}
.todo .t.pay{background:var(--warn-bg)}
.todo a.t:hover{box-shadow:inset 0 0 0 1px var(--hair2)}
.todo .t p{margin-top:4px}
.todo .act{margin-top:10px}
.woocommerce-Addresses{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.woocommerce-Address{background:var(--mist);border-radius:var(--rp);padding:22px}
.woocommerce-Address-title{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.woocommerce-Address-title h2{font-size:17px}

/* ---------------------------------------------------------------- the buyer's home */
.sec{padding:40px 0 6px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:18px}
.sec-h a{font-weight:600}
.oa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.oa .o{background:var(--mist);border-radius:var(--rp);padding:22px}
.oa .o .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.oa .o .ths{display:flex;gap:8px;margin:14px 0}
.oa .o .ths img{width:54px;height:54px;object-fit:contain;background:#fff;border-radius:var(--r);padding:4px}
.oa .o .ths span{width:54px;height:54px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:var(--r);
  font-size:13px;font-weight:650;color:var(--muted)}
.oa .o .act{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.qo{position:relative;display:flex;align-items:center;gap:30px;margin:44px 0 70px;padding:30px 34px;border-radius:var(--rp);color:#fff;
  background:var(--tank) url("assets/img/tank-calm.jpg") center 70%/cover;isolation:isolate;overflow:hidden}
.qo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(9,24,8,.9),rgba(9,24,8,.45))}
.qo-t{display:block;font-size:20px;font-weight:650;letter-spacing:-.01em;color:#fff;margin-bottom:6px}
.qo p{color:rgba(255,255,255,.8)}
.qo .btn{margin-left:auto}

/* ---------------------------------------------------------------- sign in / apply */
.auth{display:grid;grid-template-columns:1fr 1fr;gap:56px;padding:10px 0 30px}
.auth h2{font-size:24px;margin-bottom:18px}
.auth section+section{padding-left:56px;border-left:1px solid var(--hair)}
.auth .row-act{display:flex;gap:18px;align-items:center;margin-top:18px}
.auth .lead-s{margin:-8px 0 18px;color:var(--muted)}
.auth .chk{margin-top:4px}
.alt{margin-top:26px;padding:20px 22px;background:var(--mist);border-radius:var(--rp)}
/* the application's plugin fields: B2BKing's one-role "User type" stays hidden, as on the old store (its CSS did it; the
   value still posts); the country's label sits on its picker (B2BKing nests a <p> in a <p>) */
.b2bking_registration_roles_dropdown_section_hidden{display:none!important}
.form-row.b2bking_country_or_state{margin-bottom:0}
.register>p.small{margin:-6px 0 18px}
.co2tp-ts{margin:4px 0 16px;min-height:65px}   /* Turnstile (the co2art-trade plugin) — its box keeps its place while it loads */
.alt .btn{margin-top:12px}

/* ---------------------------------------------------------------- footer */
.ft{background:var(--tank);color:rgba(255,255,255,.72);margin-top:0}
.ft .wrap{display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding-top:34px;padding-bottom:30px}
.ft .logo img{height:36px;filter:brightness(0) invert(1);opacity:.92}
.ft .links{display:flex;gap:20px;font-size:14px}
.ft .links a{color:rgba(255,255,255,.8);text-decoration:none}
.ft .links a:hover{color:#fff}
.ft .soc{display:flex;gap:6px;margin-left:auto}
.ft .soc a{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:var(--r);color:rgba(255,255,255,.8)}
.ft .soc a:hover{background:rgba(255,255,255,.08);color:#fff}
.ft .soc svg{width:19px;height:19px;fill:currentColor}
.ft .copy{width:100%;font-size:13px;color:rgba(255,255,255,.55)}

/* ---------------------------------------------------------------- narrower screens */
@media (max-width:1100px){
  .hfind{display:none}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .two{grid-template-columns:minmax(0,1fr) 340px;gap:30px}
  form.checkout{grid-template-columns:minmax(0,1fr) 360px;gap:0 30px}
}
@media (max-width:900px){
  .nav{display:none}
  .burger{display:inline-flex}
  body.nav-open .nav{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:68px;background:#fff;padding:8px 16px 16px;
    border-bottom:1px solid var(--hair);gap:0}
  body.nav-open .nav a{min-height:48px;border-radius:0;border-bottom:1px solid var(--hair)}
  body.nav-open .nav a[aria-current]{box-shadow:inset 3px 0 0 var(--forest);padding-left:14px}
  .hd .wrap{position:relative}
  .tiles{grid-template-columns:1fr 1fr}
  .tile.big{grid-row:auto;grid-column:span 2}
  .tile.big img{aspect-ratio:16/10}
  .apply{grid-template-columns:1fr}
  .apply img{display:none}
}
@media (max-width:760px){
  :root{--pad:16px}
  .hd .wrap{height:60px;gap:8px}
  body.nav-open .nav{top:60px}
  .logo img{height:34px}
  .ic{width:44px;height:44px}
  .bag{height:44px;padding:0 12px}
  .bag .amt{display:none}
  .tank-hero{min-height:520px;align-items:flex-end;background-position:62% center}
  .tank-hero .wrap{padding-bottom:36px}
  .tank::before{background:linear-gradient(0deg,rgba(9,24,8,.92) 10%,rgba(9,24,8,.55) 60%,rgba(9,24,8,.25))}
  .tank-copy h1{font-size:34px}
  .tank-copy p{font-size:16px}
  .tank-band .wrap{min-height:0;padding-top:28px;padding-bottom:24px}
  .tank-band h1{font-size:26px}
  .facts{gap:18px}
  .facts b{font-size:17px}
  .range h2,.reasons h2,.apply h2{font-size:24px}
  .reasons .cols{grid-template-columns:1fr;gap:18px}
  .apply{padding:26px 22px;margin:30px 0 50px}
  .subbar .wrap{flex-wrap:wrap;gap:12px;padding-top:12px;padding-bottom:12px}
  .cats{flex-wrap:nowrap;overflow-x:auto;width:100%}
  .cats a{white-space:nowrap}
  .find{width:100%;margin-left:0}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 14px}
  .card .ph{padding:12px}
  .card h3{font-size:14px}
  .card .buy{flex-direction:column;align-items:stretch}
  .card .buy .step{width:100%;grid-template-columns:44px 1fr 44px}
  .card .buy .step input{width:100%}
  .pp-top{grid-template-columns:1fr;gap:24px}
  .gal .main{padding:22px}
  .pp-h1{font-size:24px}
  .vm .step{grid-template-columns:34px 44px 34px}
  .vm .step input{width:44px}
  .two{grid-template-columns:minmax(0,1fr);gap:26px}
  .sum{position:static}
  .tbl thead{display:none}
  .tbl.cart,.tbl.cart tbody{display:block;width:100%}
  .tbl.cart tr{display:grid;width:100%;grid-template-columns:64px minmax(0,1fr) 40px;grid-template-areas:"ph nm x" "ph st st" "ph tot tot";
    gap:6px 12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--hair)}
  .tbl.cart td{border:0;padding:0}
  .tbl.cart td:nth-child(1){grid-area:ph}
  .tbl.cart td:nth-child(2){grid-area:nm}
  .tbl.cart td:nth-child(3){display:none}
  .tbl.cart td:nth-child(4){grid-area:st}
  .tbl.cart td:nth-child(5){grid-area:tot;text-align:left}
  .tbl.cart td:nth-child(6){grid-area:x;text-align:right}
  .tbl .ph img{width:60px;height:60px}
  form.checkout{grid-template-columns:1fr;grid-template-areas:"cust" "head" "review";gap:0}
  .acc{grid-template-columns:1fr;gap:16px}
  .acc-nav{position:static;flex-direction:row;overflow-x:auto;gap:4px;border-bottom:1px solid var(--hair);padding-bottom:8px}
  .acc-nav a{white-space:nowrap}
  .acc-nav a.q{margin:0;border:0;padding-top:10px}
  .ords .hide-s{display:none}
  .tbl.ords tr{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:12px 0;border-bottom:1px solid var(--hair)}
  .tbl.ords td{border:0;padding:0}
  .tbl.ords td:nth-child(3){grid-column:1/-1}
  .tbl.ords td:last-child{grid-column:1/-1;text-align:left}
  .ords .acts a{margin:0 14px 0 0}
  .todo,.oa{grid-template-columns:1fr}
  .qo{flex-direction:column;align-items:flex-start;padding:26px 22px}
  .qo .btn{margin-left:0}
  .auth{grid-template-columns:1fr;gap:30px}
  .auth section+section{padding-left:0;border-left:0;padding-top:26px;border-top:1px solid var(--hair)}
  .woocommerce-Addresses{grid-template-columns:1fr}
  .ft .soc{margin-left:0}
}
@media (max-width:600px){.admin-bar .hd{top:0}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* contact + cleaned builder pages (Round 12) */
.contact .lede{color:var(--muted);max-width:62ch;margin-top:8px}
.cgrid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:22px;margin:30px 0 20px}
.cgrid section{background:var(--mist);border-radius:var(--rp);padding:26px 26px 24px}
.cgrid .cmain{background:var(--moss)}
.cgrid h2{font-size:17px;margin-bottom:10px}
.cgrid .big{font-size:22px;font-weight:650;letter-spacing:-.01em;margin-bottom:6px}
.cgrid address{font-style:normal;line-height:1.7;color:var(--ink)}
.cgrid .coff p{margin-top:12px;line-height:1.7}
.cacts{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.content .kick{font-size:14px;color:var(--muted);margin-top:26px}
.content h2{font-size:24px;margin-top:6px}
.content h3{font-size:18px;margin-top:22px}
@media (max-width:900px){.cgrid{grid-template-columns:1fr}}
/* short pages (My account, contact): the footer sits at the bottom of the window, never mid-screen */
body{display:flex;flex-direction:column;min-height:100vh}
body>*{flex-shrink:0}
body>.ft{margin-top:auto}
body>.wrap{width:100%}   /* a flex item with margin:auto shrinks to its content — keep the page's full width */
.admin-bar{min-height:calc(100vh - 32px)}
/* the account pages (after T2): one order's view, the lost-password steps, Account details. The builder pages' .content h2 /
   h3 sizes stop here — the account sits inside .content too */
address{font-style:normal}
mark{background:none;color:inherit;font-weight:650}
.acc h2{font-size:20px;margin-top:0}
.acc .woocommerce-Address-title h2,.acc h2.woocommerce-column__title{font-size:17px}
.acc .woocommerce-Address-title{gap:12px;flex-wrap:wrap}
.acc .woocommerce-Address-title .edit{font-size:14px;font-weight:600;white-space:nowrap}
.show-password-input{display:none}   /* WooCommerce's eye toggle needs its own CSS (not loaded) — it printed a stray dot */
.acc h3,.acc .box h3{font-size:17px;margin:0 0 10px}
.ov-crumb{padding-top:0}
.ov-h{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin:4px 0 22px}
.ov-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:10px}
.ov-acts{display:flex;gap:10px;flex-wrap:wrap}
.acc .two.ov{grid-template-columns:minmax(0,1fr) 320px;gap:30px}
.tbl.ord td{padding:12px 10px 12px 0}
.tbl.ord .ph img{width:56px;height:56px}
.ov-plug{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:16px}
.ov-plug:empty{display:none}
.ov-plug .button{min-height:36px;padding:0 14px;font-size:14px;background:transparent;color:var(--ink);border-color:var(--hair2)}
.ov-plug .button:hover{border-color:var(--ink);background:transparent;color:var(--ink)}
.ov-plug br{display:none}
.ov-addr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:26px}
.ov-addr .box{margin:0}
.ov-cust{grid-column:1/-1}
.ov-cust:empty{display:none}
.ov-notes{margin-top:30px}
.ov-notes ol{list-style:none;display:grid;gap:10px;margin-top:12px}
.ov-notes li{background:var(--mist);border-radius:var(--r);padding:14px 16px}
.lp{max-width:480px;margin:10px auto 50px}
.lp .t-page{margin-bottom:8px}
.lp-lead{margin-bottom:22px}
.lp .row-act{display:flex;gap:18px;align-items:center;margin-top:6px}
.woocommerce-EditAccountForm fieldset{border:0;padding:0;margin:26px 0 6px}
.woocommerce-EditAccountForm legend{font-size:17px;font-weight:650;color:var(--ink);margin-bottom:12px;padding:0}
.woocommerce-EditAccountForm em{font-style:normal;font-size:13px;color:var(--muted)}
.woocommerce-EditAccountForm>label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin:10px 0 6px}
.woocommerce-EditAccountForm>input.b2bking_custom_registration_field{width:100%;min-height:44px;padding:0 14px;border:1px solid var(--ctl);border-radius:var(--r);margin-bottom:16px}
.woocommerce-EditAccountForm>br{display:none}
@media (max-width:760px){
  .acc .two.ov,.ov-addr{grid-template-columns:1fr}
  .ov-acts{width:100%}.ov-acts .btn{flex:1}
  .tbl.ord thead{display:none}
  .tbl.ord,.tbl.ord tbody{display:block;width:100%}
  .tbl.ord tr{display:grid;grid-template-columns:60px minmax(0,1fr) auto;grid-template-areas:"ph nm nm" "ph q t";gap:4px 12px;padding:12px 0;border-bottom:1px solid var(--hair)}
  .tbl.ord td{border:0;padding:0}
  .tbl.ord td:nth-child(1){grid-area:ph}.tbl.ord td:nth-child(2){grid-area:nm}
  .tbl.ord td:nth-child(3){grid-area:q;text-align:left;color:var(--muted)}.tbl.ord td:nth-child(3)::before{content:"× "}
  .tbl.ord td:nth-child(4){grid-area:t}
}

/* The thank-you page (woocommerce/checkout/thankyou.php — Karol 2026-09-27): the order view's blocks under "what happens now" */
.ty{padding-top:8px}
.ty-eyebrow{margin:0 0 4px;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--forest)}
.ty .ov-meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
.ty .ov-acts{display:flex;gap:10px;flex-wrap:wrap}
.ty .two.ov{grid-template-columns:minmax(0,1fr) 320px;gap:30px}
.ty-lead{font-size:17px;color:var(--ink);margin:0 0 6px}
.ty-msg{margin:0 0 26px}
.ty-pay{background:var(--moss);border-radius:var(--rp);padding:22px 24px;margin:0 0 28px}
.ty-pay h2{font-size:20px;margin:0 0 8px;color:var(--moss-ink)}
.ty-ref{font-variant-numeric:tabular-nums;background:#fff;border-radius:6px;padding:1px 7px}
.ty-how{margin-top:12px;font-size:15px;color:var(--ink)}
.ty-how p{margin:0 0 8px}
.ty-how h2,.ty-how h3{font-size:16px;margin:12px 0 6px}
.ty-how ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.ty-how ul li{margin:0}
.ty-how ul li strong{font-variant-numeric:tabular-nums}
.ty .ov-addr .box{margin:0}
.ty-help{margin:26px 0 0}
@media (max-width:900px){.ty .two.ov{grid-template-columns:1fr}.ty .ov-acts{width:100%}}

/* The chat button (Karol 2026-09-27): the selling page's — Reamaze loads only after a click (assets/theme.js) */
.chatfab{position:fixed;right:20px;bottom:20px;z-index:90;display:inline-flex;align-items:center;gap:8px;min-height:52px;
  padding:0 22px 0 18px;border:0;border-radius:999px;background:var(--forest);color:#fff;font:inherit;font-weight:600;font-size:15px;
  box-shadow:0 8px 24px rgba(16,36,15,.28);cursor:pointer}
.chatfab:hover{background:var(--forest-dk)}
.chatfab svg{width:22px;height:22px;flex:none}
.chatfab[hidden]{display:none}
@media (max-width:760px){.chatfab{right:12px;bottom:12px;min-height:48px;padding:0 16px 0 13px;font-size:14px}}

/* The tank's moving water (co2t_tank_video — Karol 2026-09-27): the clip under the gradient, the still as poster + background */
.tank-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;pointer-events:none}
.tank-band .tank-v{object-position:center 60%}
.qo .tank-v{object-position:center 70%}
@media (max-width:760px){.tank-hero .tank-v{object-position:62% center}}
@media (prefers-reduced-motion:reduce){.tank-v{display:none}}