/* Protect Your Glass — démonstration B2B indépendante du configurateur. */
.pyg-b2b .pyg-b2b__demo{padding:48px 0 64px}
.pyg-b2b .pyg-b2b__demo [hidden]{display:none!important}
.pyg-b2b .pyg-b2b__demo-tabs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 24px}
.pyg-b2b .pyg-b2b__demo-tab{appearance:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 22px;border:2px solid #151515;border-radius:40px;background:#fff;color:#151515;font:700 14px/1.2 var(--body,'Inter',sans-serif);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.pyg-b2b .pyg-b2b__demo-tab:hover{border-color:var(--p,#D30085)}
.pyg-b2b .pyg-b2b__demo-tab.is-active{background:var(--p,#D30085);border-color:var(--p,#D30085);color:var(--y,#E9FF3B)}
.pyg-b2b .pyg-b2b__demo-tab:focus-visible,.pyg-b2b .pyg-b2b__demo-swatch:focus-visible,.pyg-b2b .pyg-b2b__demo-ink:focus-visible{outline:3px solid var(--p,#D30085);outline-offset:4px}
.pyg-b2b .pyg-b2b__demo-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:26px;align-items:stretch}
.pyg-b2b .pyg-b2b__demo-visual{min-width:0;display:flex;flex-direction:column;gap:12px}
.pyg-b2b .pyg-b2b__demo-stage{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:30px;background:#fff;border:1px solid #e5e5e5;isolation:isolate}
.pyg-b2b .pyg-b2b__demo-canvas,.pyg-b2b .pyg-b2b__demo-fallback{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.pyg-b2b .pyg-b2b__demo-logo{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:translate(-50%,-50%);background:transparent!important;-webkit-mask:none!important;mask:none!important;pointer-events:none;text-align:center;font:900 clamp(10px,1.25vw,21px)/.98 var(--body,Inter,sans-serif);letter-spacing:-.035em;text-shadow:0 0 1px rgba(0,0,0,.17)}
.pyg-b2b .pyg-b2b__demo-logo span{display:block;color:inherit!important;font:inherit!important;letter-spacing:inherit!important;line-height:inherit!important;background:transparent!important}
.pyg-b2b .pyg-b2b__demo-logo-canvas{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;object-fit:contain;background:transparent!important;pointer-events:none}
.pyg-b2b .pyg-b2b__demo-tag{position:absolute;top:18px;left:18px;z-index:3;max-width:calc(100% - 36px);padding:9px 13px;border-radius:40px;background:var(--y,#E9FF3B);font:800 10px/1.2 var(--body,'Inter',sans-serif);letter-spacing:.06em;text-transform:uppercase;color:#111}
.pyg-b2b .pyg-b2b__demo-note{font-size:11px!important;color:#626262;line-height:1.5!important}
.pyg-b2b .pyg-b2b__demo-panel{min-width:0;display:flex;flex-direction:column;gap:0;padding:32px;border:1px solid #e5e5e5;border-radius:30px;background:#fff}
.pyg-b2b .pyg-b2b__demo-kicker{display:inline-block;margin:0 0 12px;color:var(--p,#D30085);font:800 11px/1.2 var(--body,'Inter',sans-serif);letter-spacing:.1em}
.pyg-b2b .pyg-b2b__demo-panel h3{font-size:29px!important;line-height:1.13!important;text-align:left!important;margin:0 0 12px!important}
.pyg-b2b .pyg-b2b__demo-panel-intro{margin:0 0 26px!important;color:#555;max-width:450px}
.pyg-b2b .pyg-b2b__demo-field{min-width:0;margin:0 0 24px;padding:0;border:0}
.pyg-b2b .pyg-b2b__demo-legend{display:block;float:none;width:100%;margin:0 0 13px;padding:0;color:#111;font:800 12px/1.3 var(--body,'Inter',sans-serif);letter-spacing:.03em;text-transform:uppercase}
.pyg-b2b .pyg-b2b__demo-swatches{display:flex;flex-wrap:wrap;gap:14px 12px}
.pyg-b2b .pyg-b2b__demo-swatch{appearance:none;display:flex;flex-direction:column;align-items:center;gap:6px;width:59px;min-height:68px;padding:0;border:0;background:transparent;color:#333;cursor:pointer}
.pyg-b2b .pyg-b2b__demo-swatch-circle{display:block;flex:0 0 39px;width:39px;height:39px;border:2px solid #dedede;border-radius:50%;box-shadow:0 0 0 3px #fff;transition:box-shadow .15s,transform .15s}
.pyg-b2b .pyg-b2b__demo-swatch:hover .pyg-b2b__demo-swatch-circle{transform:scale(1.07)}
.pyg-b2b .pyg-b2b__demo-swatch.is-selected .pyg-b2b__demo-swatch-circle{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--p,#D30085)}
.pyg-b2b .pyg-b2b__demo-swatch-circle.is-transparent{background:linear-gradient(135deg,#fff 0 47%,#D30085 48% 52%,#fff 53% 100%);border-color:#b7b7b7}
.pyg-b2b .pyg-b2b__demo-swatch-name{font:500 10px/1.25 var(--body,'Inter',sans-serif);text-align:center}
.pyg-b2b .pyg-b2b__demo-inks{display:flex;flex-wrap:wrap;gap:9px}
.pyg-b2b .pyg-b2b__demo-ink{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:41px;padding:8px 14px;border:2px solid #e5e5e5;border-radius:30px;background:#fff;color:#111;font:700 12px/1.2 var(--body,'Inter',sans-serif);cursor:pointer}
.pyg-b2b .pyg-b2b__demo-ink:hover{border-color:var(--p,#D30085)}
.pyg-b2b .pyg-b2b__demo-ink.is-selected{border-color:var(--p,#D30085);background:#fff1fa}
.pyg-b2b .pyg-b2b__demo-ink-dot{width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.2);background:var(--demo-dot,#111)}
.pyg-b2b .pyg-b2b__demo-bottom{margin-top:auto;padding-top:18px;border-top:1px solid #ececec}
.pyg-b2b .pyg-b2b__demo-recap{display:flex;align-items:center;gap:9px;margin:0 0 17px;font:600 12px/1.5 var(--body,'Inter',sans-serif);color:#555}
.pyg-b2b .pyg-b2b__demo-recap:before{content:"";width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:var(--p,#D30085)}
.pyg-b2b .pyg-b2b__demo-cta{display:flex!important;width:100%;justify-content:center;text-align:center}
.pyg-b2b .pyg-b2b__demo-disclaimer{margin:11px 0 0!important;color:#666;font-size:11px!important;text-align:center}
@media(max-width:1050px){
.pyg-b2b .pyg-b2b__demo-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.pyg-b2b .pyg-b2b__demo-panel{padding:24px}
.pyg-b2b .pyg-b2b__demo-panel h3{font-size:25px!important}
.pyg-b2b .pyg-b2b__demo-swatches{gap:13px 8px}
}
@media(max-width:767px){
.pyg-b2b .pyg-b2b__demo{padding:35px 0 46px}
.pyg-b2b .pyg-b2b__demo-tabs{flex-wrap:nowrap;gap:8px;overflow-x:auto;padding:0 2px 7px;margin:0 0 14px;scrollbar-width:thin}
.pyg-b2b .pyg-b2b__demo-tab{flex:0 0 auto;min-height:40px;padding:8px 15px;font-size:12px}
.pyg-b2b .pyg-b2b__demo-grid{grid-template-columns:minmax(0,1fr);gap:16px}
.pyg-b2b .pyg-b2b__demo-stage{border-radius:24px}
.pyg-b2b .pyg-b2b__demo-tag{top:12px;left:12px;font-size:9px;padding:7px 10px}
.pyg-b2b .pyg-b2b__demo-panel{padding:21px 18px;border-radius:24px}
.pyg-b2b .pyg-b2b__demo-panel h3{font-size:24px!important}
.pyg-b2b .pyg-b2b__demo-panel-intro{margin-bottom:20px!important}
.pyg-b2b .pyg-b2b__demo-field{margin-bottom:20px}
.pyg-b2b .pyg-b2b__demo-swatch{width:53px}
.pyg-b2b .pyg-b2b__demo-swatch-circle{width:35px;height:35px;flex-basis:35px}
.pyg-b2b .pyg-b2b__demo-bottom{padding-top:15px}
}
@media(prefers-reduced-motion:reduce){
.pyg-b2b .pyg-b2b__demo-tab,.pyg-b2b .pyg-b2b__demo-swatch-circle{transition:none}
}
.pyg-b2b .pyg-b2b__demo-swatches.is-fabric{gap:8px;align-items:flex-start}
.pyg-b2b .pyg-b2b__demo-swatches.is-fabric .pyg-b2b__demo-swatch{width:31px;min-height:31px;flex:0 0 31px}
.pyg-b2b .pyg-b2b__demo-swatches.is-fabric .pyg-b2b__demo-swatch-circle{width:30px;height:30px;flex:0 0 30px;border-radius:7px;box-shadow:none}
.pyg-b2b .pyg-b2b__demo-swatches.is-fabric .pyg-b2b__demo-swatch.is-selected .pyg-b2b__demo-swatch-circle{border-color:var(--p,#D30085);box-shadow:0 0 0 2px rgba(211,0,133,.25)}
.pyg-b2b .pyg-b2b__demo-color-selection{margin:12px 0 0!important;color:#555;font:600 12px/1.45 var(--body,'Inter',sans-serif)!important}
.pyg-b2b .pyg-b2b__demo-custom{margin-top:18px;padding-top:17px;border-top:1px solid #ececec}
.pyg-b2b .pyg-b2b__demo-custom-label{display:block;margin-bottom:10px;font:800 11px/1.3 var(--body,'Inter',sans-serif);letter-spacing:.03em;color:#222}
.pyg-b2b .pyg-b2b__demo-custom-controls{display:flex;align-items:center;gap:12px}
.pyg-b2b .pyg-b2b__demo-color-picker{flex:0 0 52px;width:52px;height:48px;padding:3px;border:2px solid #dedede;border-radius:11px;background:#fff;cursor:pointer}
.pyg-b2b .pyg-b2b__demo-color-picker::-webkit-color-swatch-wrapper{padding:2px}
.pyg-b2b .pyg-b2b__demo-color-picker::-webkit-color-swatch{border:0;border-radius:6px}
.pyg-b2b .pyg-b2b__demo-color-help{max-width:230px;color:#555;font:500 12px/1.4 var(--body,'Inter',sans-serif)}
.pyg-b2b .pyg-b2b__demo-color-picker:focus-visible{outline:3px solid var(--p,#D30085);outline-offset:3px}
@media(max-width:767px){.pyg-b2b .pyg-b2b__demo-swatches.is-fabric{gap:7px}}