/* UPFRONT storefront styling, inspected 2026-10-27.
   Source: upfront.nl, theme 394/styles.css. Assets are served locally.
   Checkout and studio keep their existing interaction and evidence rules. */
@font-face{font-family:'Blender Book';src:url('./fonts/Blender-Book.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Blender Medium';src:url('./fonts/Blender-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Blender Strong';src:url('./fonts/Blender-Strong.woff2') format('woff2');font-weight:900;font-display:swap}
:root{
  --ink:#121212;--accent:#8e0001;--paper:#fff;--soft:#f2f2f2;
  --line:#e4e4e4;--muted:#737373;
  --heading:'Blender Medium',sans-serif;--strong:'Blender Strong',sans-serif;
  --brand-gap:max(16px,2.5vw);
  font-family:'Blender Book',sans-serif;color:var(--ink);background:#fff;
}
body{font:400 16px/1.15 'Blender Book',sans-serif;background:#fff;color:var(--ink);font-synthesis:none}
button,input,select,textarea{font-family:'Blender Book',sans-serif;font-weight:400}
button,a,input,select,summary{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.announcement{height:36px;display:flex;align-items:center;justify-content:center;gap:12px;background:#f2f2f2;color:#121212;font:400 14px/18px 'Blender Book',sans-serif;text-align:center;padding:0 16px}
.announcement>span{color:#b1b1b1}
.checkout-workbench .demo-products{font-size:14px;line-height:20px;background:#f6f6f6;padding:12px 16px;margin:0 0 14px;border-left:2px solid #121212}
.checkout-workbench .topbar{
  height:46px;min-height:46px;display:grid;grid-template-columns:1fr auto 1fr;
  padding:0 var(--brand-gap);gap:20px;border:0;background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);position:sticky;top:0;z-index:10;
  animation:brand-header-in .5s cubic-bezier(0,0,.3,1) both;
}
.checkout-workbench .wordmark{grid-column:2;grid-row:1;font:900 25px/25px 'Blender Strong',sans-serif;letter-spacing:0;color:#121212;padding:0;text-decoration:none;white-space:nowrap}
.checkout-workbench .workbench-nav{grid-column:1;grid-row:1;margin:0;gap:32px;font-weight:400;height:100%;white-space:nowrap}
.checkout-workbench .workbench-nav a{border:0;padding:0;font-size:18px;line-height:22px;position:relative;transition:color .3s}
.checkout-workbench .workbench-nav a::after{content:'';height:1px;background:currentColor;position:absolute;left:0;bottom:-4px;width:0;transition:width .3s}
.checkout-workbench .workbench-nav a:hover::after,.checkout-workbench .workbench-nav a[aria-current]::after{width:100%}
.basket-link{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:8px;font-size:16px;color:var(--ink);text-decoration:none}
.basket-link svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.2}
.checkout-workbench main{max-width:1600px;padding:40px var(--brand-gap) 64px}
.checkout-workbench .intro{gap:40px;align-items:center;margin:0 0 28px}
.checkout-workbench .eyebrow{font:400 12px/16px 'Blender Book',sans-serif;letter-spacing:.04em;margin-bottom:12px;color:var(--muted)}
.checkout-workbench h1{font:500 36px/40px 'Blender Medium',sans-serif;letter-spacing:-.72px;max-width:700px}
.checkout-workbench h2{font:500 24px/28px 'Blender Medium',sans-serif;letter-spacing:-.48px}
.checkout-workbench h3{font:500 28px/32px 'Blender Medium',sans-serif;letter-spacing:-.56px}
.checkout-workbench .intro-note{font-size:16px;line-height:20px;max-width:365px;letter-spacing:-.2px}
.checkout-workbench .connection{font-size:14px;line-height:18px;padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:24px}
.checkout-workbench .connection::before{content:'';display:inline-block;width:5px;height:5px;background:#121212;border-radius:50%;vertical-align:middle;margin-right:8px}
.checkout-workbench .connection.disconnected::before{background:var(--accent)}
.checkout-workbench .layout{grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:40px}
.checkout-workbench .panel{border:0;padding:0;background:#fff}
.checkout-workbench .panel-heading{margin-bottom:18px;min-height:28px}
.checkout-workbench .status-pill{background:#f2f2f2;font:400 14px/18px 'Blender Book',sans-serif;padding:5px 10px}
.checkout-workbench .status-pill.ready{background:#e3e9dc;color:#34512a}
.checkout-workbench .status-pill.attention{background:#f2e9ce;color:#76643a}
.checkout-workbench .camera-stage{background:#f6f6f6;max-height:420px;aspect-ratio:4/3}
.checkout-workbench .scan-corners::before,.checkout-workbench .scan-corners::after{background:#f6f6f6}
.checkout-workbench #camera-placeholder p{font:500 24px/28px 'Blender Medium',sans-serif;margin-top:22px}
.checkout-workbench #camera-placeholder small{font-size:15px;line-height:20px}
.checkout-workbench button,.upfront-studio .primary,.upfront-studio .secondary{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:10px 12px;border:0;border-radius:0;
  background-color:#000;color:#fff;overflow:hidden;
  font:400 18px/22px 'Blender Book',sans-serif;letter-spacing:-.4px;
  background-image:linear-gradient(var(--accent),var(--accent));
  background-size:0 100%;background-position:left center;background-repeat:no-repeat;
  transition:background-size .3s,color .3s,border-color .3s;cursor:pointer;
}
.checkout-workbench button:hover:not(:disabled),.upfront-studio .primary:hover:not(:disabled),.upfront-studio .secondary:hover:not(:disabled){background-color:#000;background-size:100% 100%;color:#fff}
.checkout-workbench button.secondary,.upfront-studio .secondary{background-color:#fff;color:#000;border:1px solid #d0d0d0}
.checkout-workbench button.secondary:hover:not(:disabled),.upfront-studio .secondary:hover:not(:disabled){background-color:#fff;border-color:var(--accent)}
.checkout-workbench button:disabled,.upfront-studio .primary:disabled,.upfront-studio .secondary:disabled{background:#fafafa;color:#737373;border:1px solid #e4e4e4;opacity:1;cursor:not-allowed}
.checkout-workbench .camera-actions{gap:8px;margin-top:12px}
.checkout-workbench .camera-actions button{flex:1 1 calc(50% - 8px)}
.checkout-workbench .small{font-size:14px;line-height:19px}
.checkout-workbench .upload-panel{padding:20px 0;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;margin:24px 0}
.checkout-workbench .upload-panel summary{font:500 22px/26px 'Blender Medium',sans-serif;letter-spacing:-.44px;list-style:none;position:relative;padding-right:30px}
.checkout-workbench .upload-panel summary::-webkit-details-marker{display:none}
.checkout-workbench .upload-panel summary::after{content:'+';position:absolute;right:0;font:400 25px/25px 'Blender Book',sans-serif}
.checkout-workbench .upload-panel[open] summary::after{content:'−'}
.checkout-workbench .upload-panel label:not(.upload-choice){font:400 15px/20px 'Blender Book',sans-serif;margin:18px 0 8px}
.checkout-workbench .upload-panel input[type=text],.checkout-workbench .upload-panel input[type=file],.checkout-workbench .fixture-panel select{font:400 16px/20px 'Blender Book',sans-serif;padding:12px;border:1px solid #d0d0d0;background:#fff;min-height:48px}
.checkout-workbench input[type=file]::file-selector-button{font:400 16px/20px 'Blender Book',sans-serif;border:0;border-right:1px solid #d0d0d0;padding:0 12px 0 0;margin-right:12px;background:#fff;color:#121212;cursor:pointer}
.checkout-workbench input[type=checkbox]{accent-color:#000;width:18px;height:18px;flex-shrink:0}
.checkout-workbench .upload-choice{font-size:15px;line-height:20px;margin:18px 0}
.checkout-workbench #upload-photos{width:100%}
.checkout-workbench #upload-feedback{font-size:14px;line-height:20px;color:var(--muted)}
.checkout-workbench .upload-panel #photo-result{font-size:16px;line-height:22px}
.checkout-workbench #open-upload-studio{display:inline-block;font-weight:400;text-underline-offset:4px;margin-top:4px}
.checkout-workbench .fixture-panel,.checkout-workbench .jev-explanation{border:0;background:#f6f6f6;padding:20px;margin-top:20px}
.checkout-workbench .fixture-panel label{font-weight:400;font-size:16px}
.checkout-workbench .fixture-actions{gap:8px}
.checkout-workbench .reason{font-size:18px;line-height:24px;letter-spacing:-.36px}
.checkout-workbench .basket{position:sticky;top:70px;padding:24px;background:#fafafa}
.checkout-workbench .basket .panel-heading span{font-size:14px}
.checkout-workbench .receipt-banner{font:400 12px/16px 'Blender Book',sans-serif;letter-spacing:.03em;text-align:left;border:0;padding:0;margin:0;color:var(--muted)}
.checkout-workbench .empty-cart{padding:40px 0 48px;font-size:18px;line-height:22px}
.checkout-workbench .cart-line{font-size:18px}
.checkout-workbench .cart-line strong{font:500 18px/22px 'Blender Medium',sans-serif}
.checkout-workbench .total{font:400 16px/20px 'Blender Book',sans-serif;border-top:1px solid #d0d0d0;padding:20px 0 8px}
.checkout-workbench .total strong{font:400 24px/28px 'Blender Book',sans-serif;letter-spacing:-.48px}
.checkout-workbench .runtime-info{margin-top:24px;padding-top:20px}
.checkout-workbench dl{font-size:14px;line-height:18px;gap:10px 16px}
.checkout-workbench footer{padding:24px var(--brand-gap);background:#f2f2f2;border:0;font-size:14px;line-height:20px;letter-spacing:0}
.upfront-studio .studio-header{position:relative;height:46px;padding:0 var(--brand-gap);border:0;background:#fff}
.upfront-studio .studio-wordmark{position:absolute;left:50%;transform:translateX(-50%);font:900 25px/25px 'Blender Strong',sans-serif}
.upfront-studio .studio-header nav{gap:32px}
.upfront-studio .studio-tab{font:400 18px/22px 'Blender Book',sans-serif;transition:color .3s}
.upfront-studio .studio-tab:hover{color:var(--accent)}
.upfront-studio .back-checkout{font-size:16px}
.upfront-studio .studio-intro{padding:40px var(--brand-gap) 32px}
.upfront-studio .studio-intro h1{font:500 36px/40px 'Blender Medium',sans-serif;letter-spacing:-.72px}
.upfront-studio .studio-intro p{font-size:18px;line-height:22px}
.upfront-studio .photo-queue,.upfront-studio .annotation-panel{background:#fafafa}
.upfront-studio .canvas-shell{background:#f6f6f6}
.upfront-studio .photo-row{transition:background-color .3s}
@keyframes brand-header-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){
  .checkout-workbench .layout{gap:24px;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr)}
  .checkout-workbench .workbench-nav,.upfront-studio .studio-header nav{gap:16px}
  .checkout-workbench .workbench-nav a,.upfront-studio .studio-tab{font-size:16px}
  .checkout-workbench .intro{gap:24px}
  .checkout-workbench .intro-note{max-width:280px}
  .upfront-studio .studio-wordmark{position:static;transform:none}
}
@media(max-width:767px){
  .announcement{font-size:12px;gap:8px}
  .checkout-workbench .topbar{height:auto;min-height:46px;grid-template-columns:1fr auto 1fr;row-gap:0}
  .checkout-workbench .wordmark{font-size:22px;line-height:46px}
  .checkout-workbench .workbench-nav{grid-row:2;grid-column:1/-1;justify-content:center;min-height:42px;width:100%;gap:28px;border-bottom:1px solid var(--line)}
  .checkout-workbench .basket-link span{display:none}
  .checkout-workbench main{padding-top:28px}
  .checkout-workbench .intro{display:block;margin-bottom:20px}
  .checkout-workbench h1{font-size:30px;line-height:34px;letter-spacing:-.6px}
  .checkout-workbench .intro-note{max-width:none;margin-top:16px}
  .checkout-workbench .layout{grid-template-columns:1fr;gap:32px}
  .checkout-workbench .basket{position:static;padding:20px;order:2}
  .checkout-workbench .camera-stage{max-height:360px}
  .checkout-workbench .fixture-actions{grid-template-columns:1fr}
  .upfront-studio .studio-header{height:auto;min-height:46px;flex-wrap:wrap;gap:12px;padding-top:12px;padding-bottom:12px}
  .upfront-studio .studio-header nav{order:3;width:100%;justify-content:center}
  .upfront-studio .studio-intro{padding-top:28px}
  .upfront-studio .studio-intro h1{font-size:30px;line-height:34px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
