/* UKPeps, member of SPEPS Group. Racing green, brass in details only, paper, ink. Layout after SwissPeps. */
@font-face{font-family:"Libre Caslon";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/caslon-400.woff2) format("woff2")}
@font-face{font-family:"Libre Caslon";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/caslon-400i.woff2) format("woff2")}
@font-face{font-family:"Libre Caslon";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/caslon-700.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/hanken-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2113,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:400;src:url(fonts/jbmono-400.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:600;src:url(fonts/jbmono-600.woff2) format("woff2")}

:root{
  --paper:#F6F3EC;--paper-2:#EDE8DD;--white:#FFFFFF;
  --ink:#1A1F1C;--slate:#4E5751;--stone:#7D847F;
  --green:#0F3D2E;--green-2:#0A2C21;--green-3:#16503D;--green-veil:#E6EEE9;
  --brass:#B8862B;--brass-ink:#7A5916;
  --ok:#1E6B45;--err:#A3271F;--warn:#7A4B0E;--warn-bg:#FAF0DF;
  --line:#DDD6C8;--line-2:#E9E3D7;
  --f:"Hanken Grotesk",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --s:"Libre Caslon",Georgia,"Times New Roman",serif;
  --m:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --r:8px;--r-lg:12px;--r-xl:18px;--wrap:1180px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:var(--green);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--green-3)}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px;border-radius:2px}
h1,h2,h3,h4{font-family:var(--s);font-weight:400;letter-spacing:-.012em;line-height:1.1;margin:0 0 .5em;text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(2.3rem,5vw,3.9rem)}
h2{font-size:clamp(1.6rem,2.8vw,2.2rem)}
h3{font-size:1.25rem}
em{font-style:italic}
p{margin:0 0 1em;max-width:68ch}
.mono{font-family:var(--m);font-size:.9em;letter-spacing:0}
.muted{color:var(--slate)}
.small{font-size:.88rem}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
.sec{padding-block:clamp(3rem,7vw,5.5rem)}
.sec-tight{padding-block:clamp(1.2rem,3vw,2.2rem) clamp(2.4rem,5vw,3.6rem)}
.sec-top0{padding-top:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hp{position:absolute;left:-9999px}
.h-sm{font-size:1.35rem}
.dot{width:.62rem;height:.62rem;border-radius:2px;flex:none;display:inline-block}
.bead{width:.5rem;height:.5rem;border-radius:50%;background:var(--brass);display:inline-block;flex:none}

/* header + research-use strip (strip under the header, as on SwissPeps) */
.hd{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
.hd .wrap{display:flex;align-items:center;gap:1.6rem;min-height:4.3rem}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--green);margin-right:auto;min-width:0}
.brand svg{width:38px;height:38px;flex:none}
.brand .w{font-family:var(--s);font-weight:700;font-size:1.45rem;letter-spacing:-.01em;line-height:1;display:block}
.brand .g{display:block;font-size:.72rem;color:var(--slate);margin-top:.25rem;letter-spacing:.01em}
.nav{display:flex;gap:1.4rem;font-size:.97rem}
.nav a{color:var(--ink);text-decoration:none;padding:.3rem 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current=page]{border-bottom-color:var(--brass);color:var(--green)}
.cartbtn{display:inline-flex;align-items:center;gap:.45rem;text-decoration:none;color:var(--ink);font-size:.95rem;padding:.45rem .75rem;border:1px solid var(--line);border-radius:var(--r);white-space:nowrap}
.cartbtn:hover{border-color:var(--green);color:var(--green)}
.cart-count{min-width:1.35rem;height:1.35rem;border-radius:99px;background:var(--paper-2);color:var(--slate);font-size:.75rem;display:inline-grid;place-items:center;font-weight:600;padding:0 .3rem}
.cart-count.on{background:var(--green);color:#fff}
.strip{background:var(--paper-2);border-bottom:1px solid var(--line);color:var(--slate);font-size:.82rem;text-align:center;padding:.45rem 1rem;line-height:1.4}
.menu{display:none}
@media (max-width:940px){
  .nav{display:none}
  .menu{display:block;position:relative}
  .menu summary{list-style:none;cursor:pointer;padding:.45rem .75rem;border:1px solid var(--line);border-radius:var(--r);font-size:.95rem}
  .menu summary::-webkit-details-marker{display:none}
  .menu[open] .panel-nav{display:flex}
  .panel-nav{display:none;position:absolute;right:0;top:calc(100% + .5rem);background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:.6rem;flex-direction:column;min-width:14rem;box-shadow:0 12px 30px rgba(15,61,46,.14)}
  .panel-nav a{padding:.6rem .7rem;color:var(--ink);text-decoration:none;border-radius:var(--r)}
  .panel-nav a:hover{background:var(--paper)}
  .hd .wrap{gap:.7rem}
  .brand .g{display:none}
}
@media (max-width:400px){.brand .w{font-size:1.25rem}.brand svg{width:32px;height:32px}.cartbtn,.menu summary{padding:.4rem .55rem;font-size:.9rem}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font:inherit;font-weight:600;font-size:1rem;line-height:1.2;padding:.85rem 1.35rem;border-radius:var(--r);border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.btn-lg{padding:1rem 1.6rem;font-size:1.05rem}
.btn-sm{padding:.55rem .9rem;font-size:.9rem}
.btn-p{background:var(--green);color:#fff}
.btn-p:hover{background:var(--green-2);color:#fff}
.btn-s{background:var(--white);color:var(--green);border-color:var(--green)}
.btn-s:hover{background:var(--green-veil);color:var(--green-2)}
.btn-light{background:var(--paper);color:var(--green)}
.btn-light:hover{background:#fff;color:var(--green-2)}
.btn-block{width:100%}
.btn[disabled]{opacity:.6;cursor:progress}

/* hero, centred as on SwissPeps */
.hero{padding-block:clamp(3rem,8vw,6rem) clamp(1.5rem,4vw,2.5rem);text-align:center}
.hero h1{max-width:18ch;margin-inline:auto}
.hero h1 em{color:var(--green)}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--brass-ink);font-weight:600;margin-bottom:1.1rem}
.eyebrow-d{color:#D9C08A}
.lead{font-size:clamp(1.08rem,1.6vw,1.22rem);color:var(--slate);max-width:40rem;margin:0 auto 2rem}
.cta{display:flex;flex-wrap:wrap;gap:.8rem}
.hero .cta{justify-content:center}
.trust{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.6rem;margin:2rem 0 0;padding:0;list-style:none;font-size:.92rem;color:var(--slate)}
.trust li{display:flex;align-items:center;gap:.5rem}
.hero-photo{margin:clamp(2rem,5vw,3rem) auto 0;max-width:900px;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--line);background:var(--paper-2)}
.hero-photo img{width:100%;height:auto}

/* pillars + metrics band */
.pillar{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.3rem 1.3rem 1.1rem;border-top:3px solid var(--green)}
.pillar h3{font-size:1.2rem;margin-bottom:.4rem}
.pillar p{color:var(--slate);font-size:.95rem;margin:0}
.metrics{background:var(--green);color:#fff}
.metrics dl{margin:0;gap:0}
.metric{padding:1.9rem 1rem;text-align:center;border-left:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column-reverse}
.metric:first-child{border-left:0}
.metric dd{margin:0;font-family:var(--s);font-size:clamp(2rem,4vw,2.8rem);line-height:1;font-variant-numeric:lining-nums}
.metric dt{font-size:.88rem;color:#C9D6CF;margin-top:.6rem}
.metric dd::after{content:"";display:block;width:1.6rem;height:2px;background:var(--brass);margin:.8rem auto 0}

/* section heads + chips */
.shead{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1.6rem;flex-wrap:wrap}
.shead h2{margin:0}
.more{font-weight:600;text-decoration:none}
.more::after{content:" ›"}
.chips{display:flex;flex-wrap:wrap;gap:.55rem}
.chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .95rem;border:1px solid var(--line);border-radius:99px;background:var(--white);color:var(--ink);text-decoration:none;font-size:.93rem}
.chip:hover{border-color:var(--green);color:var(--green)}

/* product grid + card (SwissPeps card: category rule on the left, CAS in mono; DeutschePeps: certificate count) */
.grid{display:grid;gap:1.2rem}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1020px){.g4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{border-left:0;border-top:1px solid rgba(255,255,255,.12)}.metrics dl{grid-template-columns:1fr 1fr}.metric:nth-child(-n+2){border-top:0}}
@media (max-width:520px){.grid.g4,.grid.g3{gap:.7rem}.card-b{padding:.8rem .8rem .9rem}.card h3{font-size:1rem}.card-f{flex-direction:column;align-items:stretch;gap:.5rem}.addbtn{width:100%}}
.card{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--cat,var(--green));border-radius:var(--r-lg);display:flex;flex-direction:column;overflow:hidden;position:relative}
.card:hover{border-color:#C9C0AE;border-left-color:var(--cat,var(--green))}
.tile{aspect-ratio:1/1;display:grid;background:var(--green)}
.tile img{width:100%;height:100%;object-fit:cover}
.card-b{padding:1rem 1.05rem 1.1rem;display:flex;flex-direction:column;gap:.2rem;flex:1}
.card-cas{font-family:var(--m);font-size:.74rem;color:var(--slate);display:flex;align-items:center;gap:.45rem}
.card h3{font-size:1.12rem;margin:.2rem 0 .1rem;line-height:1.22}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0}
.card-cat{font-size:.82rem;color:var(--slate)}
.card-coa{font-size:.8rem;color:var(--green);margin-top:.15rem}
.card-f{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:auto;padding-top:.9rem}
.price{font-weight:700;font-size:1.15rem;font-variant-numeric:tabular-nums lining-nums}
.addbtn{position:relative;z-index:2;font:inherit;font-size:.88rem;font-weight:600;padding:.5rem .9rem;border-radius:var(--r);border:1px solid var(--green);background:var(--white);color:var(--green);cursor:pointer}
.addbtn:hover{background:var(--green);color:#fff}

/* CSS-only product tile until the photos exist: identity colour, name and amount in type, no illustration */
.ph{width:100%;height:100%;background:var(--green);color:var(--paper);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:12%;gap:.35em;position:relative;font-size:clamp(.8rem,1.6vw,1rem);container-type:inline-size}
.ph::before{content:"";position:absolute;inset:7%;border:1px solid rgba(246,243,236,.22);border-radius:6px;pointer-events:none}
.ph-w{font-family:var(--s);font-weight:700;font-size:.9em;color:#D9C08A;letter-spacing:.01em}
.ph-n{font-family:var(--s);font-size:clamp(1.15rem,11cqw,2.6rem);line-height:1.08;text-wrap:balance;margin-top:.15em}
.ph-d{font-family:var(--m);font-size:.95em;color:#C9D6CF}
.ph-r{font-size:.72em;color:#A9BBB2;margin-top:.4em}
.ph-r::before{content:"";display:block;width:2.2em;height:2px;background:var(--brass);margin:0 auto .55em}
.ph-lg .ph-n{font-size:clamp(1.8rem,10cqw,3.6rem)}
.ph-xs{padding:6%;gap:0;font-size:.55rem;border-radius:6px}
.ph-xs::before{display:none}
.ph-xs .ph-n{font-size:.9rem}

/* trust band */
.trustband{background:var(--green-2);color:#E8EFEB;padding-block:clamp(3rem,7vw,5rem)}
.trustband .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.trustband h2{color:#fff}
.tb-lead{color:#C9D6CF;max-width:30rem}
.co-card{display:flex;align-items:center;gap:.8rem;margin-top:1.4rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-lg);padding:.9rem 1.1rem;max-width:26rem}
.co-card svg{width:36px;height:36px;flex:none}
.co-card b{display:block;color:#fff;font-weight:600}
.co-card span{color:#C9D6CF;font-size:.85rem}
.trustlist{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.trustlist li{padding-left:1.4rem;position:relative;color:#E8EFEB}
.trustlist li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;border-radius:50%;background:var(--brass)}
@media (max-width:860px){.trustband .wrap{grid-template-columns:1fr}}

/* how an order works: a real sequence, so numbered */
.steps{list-style:none;padding:0;margin:1.8rem 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2rem;counter-reset:s}
.steps li{counter-increment:s;border-top:2px solid var(--green);padding-top:1rem}
.steps li::before{content:counter(s);font-family:var(--s);font-size:1.4rem;color:var(--brass-ink);display:block;margin-bottom:.3rem;line-height:1}
.steps b{display:block;font-weight:700;margin-bottom:.25rem}
.steps p{font-size:.95rem;color:var(--slate);margin:0}
@media (max-width:860px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.steps{grid-template-columns:1fr}}
.coaband{background:var(--green);color:#E8EFEB;border-radius:var(--r-xl);padding:clamp(1.6rem,4vw,2.8rem);display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center}
.coaband h2{color:#fff}
.coaband p{color:#C9D6CF;margin:0}
.lotform{display:flex;gap:.5rem}
.lotform input{flex:1;min-width:0}
.coaband .lotform input{background:var(--green-2);border-color:#2C5E4C;color:#fff}
.coaband .lotform input::placeholder{color:#9DB3A8}
@media (max-width:860px){.coaband{grid-template-columns:1fr}}

/* forms */
input,select,textarea{font:inherit;color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:6px;padding:.72rem .85rem;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--green);outline-offset:0;border-color:var(--green)}
.field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1rem}
.field label{font-size:.9rem;font-weight:600}
.field small{color:var(--slate);font-size:.8rem}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media (max-width:620px){.row2{grid-template-columns:1fr}}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.9rem;color:var(--slate);margin:.9rem 0;line-height:1.5}
.check input{width:1.1rem;height:1.1rem;flex:none;margin-top:.2rem;accent-color:var(--green)}
.msg{font-size:.92rem;min-height:1.2em;margin:.6rem 0 0}
.msg.err{color:var(--err)}.msg.okm{color:var(--ok)}

/* page heads + prose */
.crumb{font-size:.86rem;color:var(--slate);margin-bottom:1.2rem}
.crumb a{color:var(--slate)}
.pagehead{padding-block:clamp(2.2rem,5vw,3.4rem) 1.4rem}
.pagehead p{color:var(--slate);font-size:1.08rem}
.pagehead-pd{padding-bottom:1rem}
.prose{max-width:46rem}
.prose h2{font-size:1.6rem;margin-top:2.2rem}
.prose h3{font-size:1.2rem;margin-top:1.5rem}
.prose ul,.prose ol{padding-left:1.2rem;max-width:68ch}
.prose li{margin-bottom:.4rem}
.prose .box{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.1rem 1.3rem;margin:1.2rem 0}
.lead-p{font-size:1.12rem;color:var(--slate)}
.inshort{font-size:1.15rem}
.inshort b{color:var(--brass-ink);margin-right:.35rem}
.upd{font-size:.86rem;color:var(--slate)}

/* notices */
.ruo{background:var(--green-veil);border:1px solid #C6D8CE;color:#173F31;border-radius:var(--r);padding:.8rem 1rem;font-size:.9rem}
.warn{background:var(--warn-bg);color:var(--warn);border-radius:var(--r);padding:.8rem 1rem;font-size:.92rem;max-width:46rem}
.vatnote{display:block;font-size:.82rem;color:var(--slate);margin:.2rem 0 0}

/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--white)}
table{border-collapse:collapse;width:100%;font-size:.94rem}
th,td{text-align:left;padding:.7rem .9rem;border-bottom:1px solid var(--line-2);vertical-align:top}
tr:last-child td,tr:last-child th{border-bottom:0}
thead th{font-weight:600;color:var(--slate);font-size:.86rem;background:var(--paper)}
.spec th{width:34%;font-weight:600;color:var(--slate);background:var(--paper)}
th.num,td.num{font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.tag{display:inline-block;font-size:.72rem;padding:.1rem .45rem;border-radius:4px;background:var(--paper-2);color:var(--slate);margin-left:.4rem;vertical-align:middle}
tr.hit td{background:#FBF3DC}

/* product page (SwissPeps order: buy box, pairing, badges, description, specification, certificates, documentation, questions, related) */
.pdp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3.5rem);align-items:start}
.pdp-img{border:1px solid var(--line);border-radius:var(--r-xl);aspect-ratio:1/1;overflow:hidden;position:sticky;top:6rem;display:grid;background:var(--green)}
.pdp-img img{width:100%;height:100%;object-fit:cover}
.pd-cas{font-size:.9rem}
.pdp h1{font-size:clamp(2rem,4vw,3rem);margin:.3rem 0 .5rem}
.pd-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;font-size:.93rem;color:var(--slate);margin:0}
.pd-short{margin-top:1rem;color:var(--slate)}
.pd-price{font-size:2rem;display:block;margin-top:.6rem}
.stock{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;color:var(--ok);background:#E5F1EA;border-radius:99px;padding:.2rem .7rem;margin:.6rem 0 1.1rem}
.stock::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--ok)}
.qty{display:inline-flex;border:1px solid var(--line);border-radius:var(--r);background:var(--white)}
.qty button{font:inherit;width:2.6rem;border:0;background:none;cursor:pointer;font-size:1.1rem;color:var(--ink)}
.qty input{width:3rem;text-align:center;border:0;padding:.6rem 0;font-family:var(--m)}
.buy{display:flex;gap:.7rem;align-items:stretch;flex-wrap:wrap}
.buy .btn-p{flex:1}
.pair{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:1rem 1.1rem;margin-top:1.2rem}
.pair-h{font-weight:700;margin:0 0 .2rem}
.pair .muted{font-size:.88rem;margin-bottom:.5rem}
.pair-n{font-size:.78rem!important;margin:.5rem 0 0!important}
.badges{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1.2rem 0;padding:0;list-style:none;font-size:.86rem;color:var(--slate)}
.badges li{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:.5rem .7rem;display:flex;align-items:center;gap:.5rem}
.badges li::before{content:"";width:.42rem;height:.42rem;border-radius:50%;background:var(--brass);flex:none}
.pd-sec{margin-top:clamp(2.6rem,5vw,3.6rem)}
.narrow{max-width:50rem}
.coa-list{list-style:none;padding:0;margin:1rem 0;display:grid;gap:.6rem}
.coa-i{display:flex;justify-content:space-between;align-items:center;gap:1rem;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:.85rem 1rem}
.vtag{display:inline-block;font-size:.72rem;font-family:var(--m);background:#F4E7C8;color:var(--brass-ink);border-radius:4px;padding:.08rem .4rem;margin-left:.5rem;vertical-align:middle}
.coa-m{font-size:.86rem;margin-top:.15rem}
@media (max-width:860px){.pdp{grid-template-columns:1fr}.pdp-img{position:static}}
@media (max-width:520px){.coa-i{flex-direction:column;align-items:flex-start}}

/* shop with sidebar (SwissPeps) */
.shop{display:grid;grid-template-columns:15rem 1fr;gap:2rem;align-items:start}
.side{position:sticky;top:6rem;display:flex;flex-direction:column;gap:.8rem}
.fgroup{display:flex;flex-direction:column;gap:.3rem}
.fbtn{display:flex;align-items:center;gap:.55rem;text-align:left;font:inherit;font-size:.93rem;padding:.55rem .75rem;border:1px solid transparent;border-radius:var(--r);background:none;color:var(--ink);cursor:pointer}
.fbtn:hover{background:var(--white);border-color:var(--line)}
.fbtn[aria-pressed=true]{background:var(--green);color:#fff}
.count{font-size:.92rem;color:var(--slate);margin-bottom:1rem}
.shop-tools{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;margin-bottom:1.2rem}
.shop-tools input{max-width:24rem}
.shop-tools select{max-width:16rem}
@media (max-width:860px){.shop{grid-template-columns:1fr}.side{position:static}.fgroup{flex-direction:row;flex-wrap:wrap}.fbtn{border-color:var(--line);background:var(--white);border-radius:99px;padding:.45rem .8rem}}

/* certificate library */
.figures{max-width:42rem;margin-bottom:2rem}
.figures h2{font-size:1.3rem}
.figures .spec{border:1px solid var(--line-2)}

/* basket / checkout */
.co{display:grid;grid-template-columns:1.25fr .85fr;gap:2rem;align-items:start}
@media (max-width:900px){.co{grid-template-columns:1fr}}
.panel{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(1.1rem,3vw,1.7rem)}
.line{display:flex;justify-content:space-between;gap:1rem;padding:.35rem 0;font-size:.97rem}
.line.tot{border-top:1px solid var(--line);margin-top:.5rem;padding-top:.8rem;font-weight:700;font-size:1.15rem}
.line-sep{border-top:1px solid var(--line);margin-top:.4rem;padding-top:.6rem}
.line .muted{flex:1}
.okc{color:var(--ok)}
.citem{display:grid;grid-template-columns:4rem 1fr auto;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line-2)}
.citem:last-child{border-bottom:0}
.citem .th{border-radius:var(--r);aspect-ratio:1/1;overflow:hidden;display:grid;background:var(--green)}
.citem .th img{width:100%;height:100%;object-fit:cover}
.citem a{color:var(--ink);text-decoration:none;font-weight:600}
.citem-c{display:flex;gap:.8rem;align-items:center;margin-top:.5rem;flex-wrap:wrap}
.rm{font:inherit;background:none;border:0;color:var(--slate);text-decoration:underline;cursor:pointer;font-size:.86rem;padding:0}
.upsell{display:flex;align-items:center;gap:1.2rem;margin-top:1.4rem;flex-wrap:wrap}
.upsell>div{flex:1;min-width:14rem}
.upsell p{margin:.2rem 0 0}
.stepsbar{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;list-style:none;padding:0;margin:0 0 1.8rem;font-size:.92rem;color:var(--slate);counter-reset:st}
.stepsbar li{display:flex;align-items:center;gap:.5rem}
.stepsbar li::before{content:counter(st);counter-increment:st;width:1.6rem;height:1.6rem;border-radius:50%;display:inline-grid;place-items:center;background:var(--paper-2);font-size:.78rem;font-family:var(--m)}
.stepsbar li.done::before{background:var(--ok);color:#fff;content:"✓"}
.stepsbar li.on{color:var(--ink);font-weight:700}
.stepsbar li.on::before{background:var(--green);color:#fff}
.payset{border:0;padding:0;margin:1.2rem 0 0}
.payset legend{font-weight:700;font-size:.93rem;margin-bottom:.5rem}
.pay{display:flex;flex-direction:column;gap:.5rem;margin:.4rem 0 .8rem}
.pay label{display:flex;gap:.7rem;align-items:center;border:1px solid var(--line);border-radius:var(--r);padding:.8rem .9rem;cursor:pointer;font-size:.97rem}
.pay input{width:auto;accent-color:var(--green)}
.pay label:has(input:checked){border-color:var(--green);background:var(--green-veil)}
.coupon{display:flex;gap:.5rem;margin-top:1rem}
.confirm-lead{font-size:1.12rem}
.bank{margin:0}
.bankrow{display:grid;grid-template-columns:9rem 1fr;gap:.2rem 1rem;font-size:.97rem;padding:.6rem 0;border-bottom:1px solid var(--line-2);align-items:center}
.bankrow:last-child{border-bottom:0}
.bankrow dt{color:var(--slate)}
.bankrow dd{margin:0;font-family:var(--m);word-break:break-word;display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.copy{font:inherit;font-family:var(--f);font-size:.82rem;font-weight:600;border:1px solid var(--green);color:var(--green);background:var(--white);border-radius:6px;cursor:pointer;padding:.25rem .6rem;flex:none}
.copy:hover{background:var(--green-veil)}
@media (max-width:480px){.bankrow{grid-template-columns:1fr}}
.empty{text-align:center;padding:3rem 1rem}
.empty .muted{margin-inline:auto}

/* faq + glossary */
.qa{border-top:1px solid var(--line);max-width:50rem}
.qa details{border-bottom:1px solid var(--line);padding:1rem 0}
.qa summary{cursor:pointer;font-weight:600;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.qa summary::after{content:"+";font-family:var(--m);color:var(--brass-ink)}
.qa details[open] summary::after{content:"−"}
.qa summary::-webkit-details-marker{display:none}
.qa p{margin:.7rem 0 0;color:var(--slate)}
.gl{display:grid;grid-template-columns:16rem 1fr;border-top:1px solid var(--line);max-width:58rem;margin:0}
.gl dt,.gl dd{padding:1rem 0;border-bottom:1px solid var(--line);margin:0}
.gl dt{font-family:var(--s);font-size:1.15rem;padding-right:1.5rem}
.gl dt a{text-decoration:none}
.gl dd{color:var(--slate)}
@media (max-width:700px){.gl{grid-template-columns:1fr}.gl dt{border-bottom:0;padding-bottom:.2rem}.gl dd{padding-top:0}}

/* footer */
.ft{background:var(--green-2);color:#C9D6CF;margin-top:clamp(3rem,7vw,5rem);font-size:.93rem}
.ft a{color:#EEF3F0;text-decoration:none}
.ft a:hover{text-decoration:underline}
.ft-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem;padding-block:3.2rem 2.4rem}
.ft h2{font-family:var(--f);font-size:.95rem;color:#fff;letter-spacing:0;font-weight:700;margin:0 0 .8rem}
.ft ul{list-style:none;padding:0;margin:0;display:grid;gap:.45rem}
.ft-brand{display:flex;align-items:center;gap:.6rem;color:#fff;font-family:var(--s);font-weight:700;font-size:1.45rem;margin-bottom:.9rem}
.ft-brand svg{width:36px;height:36px}
.group{display:inline-flex;align-items:center;gap:.55rem;border:1px solid #2C5E4C;border-radius:99px;padding:.35rem .8rem;color:#EEF3F0;font-size:.8rem;margin-top:.4rem}
.beads{display:inline-flex;align-items:center}
.beads i{width:.42rem;height:.42rem;border-radius:50%;background:#EEF3F0;display:block}
.beads i+i{margin-left:.32rem;position:relative}
.beads i+i::before{content:"";position:absolute;right:100%;top:45%;width:.32rem;height:1px;background:#EEF3F0}
.beads i:last-child{background:var(--brass)}
.pay-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.2rem}
.pay-tags span{font-size:.76rem;border:1px solid #2C5E4C;border-radius:6px;padding:.15rem .5rem;color:#C9D6CF}
.ft-bot{border-top:1px solid #1F4A3B;padding-block:1.2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.83rem;color:#9DB3A8}
@media (max-width:860px){.ft-top{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.ft-top{grid-template-columns:1fr}}

/* overlay (age gate) + toast */
.ov{position:fixed;inset:0;background:rgba(10,44,33,.6);display:grid;place-items:center;z-index:100;padding:1rem}
.modal{background:var(--white);border-radius:var(--r-xl);max-width:32rem;padding:1.8rem;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.modal h2{font-size:1.6rem}
.modal .cta{justify-content:flex-end;margin-top:1.2rem}
.toast{position:fixed;left:50%;bottom:1.4rem;transform:translate(-50%,1rem);opacity:0;background:var(--green-2);color:#fff;padding:.75rem 1.1rem;border-radius:var(--r);font-size:.93rem;z-index:120;transition:opacity .2s,transform .2s;display:flex;gap:1rem;align-items:center;max-width:calc(100vw - 2rem)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast a{color:#fff;font-weight:700}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
sub,sup{font-size:.72em;line-height:0}
@media (max-width:520px){.grid.g4.pillars{grid-template-columns:1fr}h1{font-size:2.15rem}}
