/* =========================================================
   MB NOVA COLLECTION — V5 PART 4
   CUSTOM ORDER EXPERIENCE
   ========================================================= */

:root{
  --studio-ink:#171315;
  --studio-paper:#fffdf9;
  --studio-cream:#f6efe6;
  --studio-rose:#b9798c;
  --studio-wine:#5b263b;
  --studio-gold:#b79760;
  --studio-line:rgba(54,31,40,.13);
  --studio-soft:rgba(91,38,59,.07);
  --studio-shadow:0 34px 90px rgba(46,27,35,.12);
}

body.home-v5,
body.order-page,
body.success-page{padding-bottom:0}

body.order-page{
  background:
    radial-gradient(circle at 8% 0%,rgba(197,143,158,.16),transparent 30%),
    radial-gradient(circle at 100% 40%,rgba(183,151,96,.10),transparent 30%),
    #f7f1e9;
}

.order-flow-wrap{max-width:1360px;margin:34px auto 80px;padding:0 24px}
.order-flow-layout{display:grid;grid-template-columns:minmax(330px,430px) minmax(0,1fr);gap:22px;align-items:stretch}

.order-visual-v5{
  min-height:760px;
  position:relative;
  overflow:hidden;
  border-radius:34px;
  background:#282126;
  box-shadow:var(--studio-shadow);
  isolation:isolate;
}
.order-visual-v5>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.78) contrast(.98)}
.order-visual-v5::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(17,13,15,.13),rgba(17,13,15,.08) 35%,rgba(17,13,15,.88) 100%)}
.order-visual-v5::after{content:"";position:absolute;inset:14px;z-index:2;border:1px solid rgba(255,255,255,.24);border-radius:25px;pointer-events:none}
.order-visual-top,.order-visual-copy,.order-visual-foot{position:absolute;z-index:3;left:30px;right:30px;color:#fff}
.order-visual-top{top:30px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800}
.order-visual-top b{display:grid;place-items:center;width:58px;height:34px;border-radius:999px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);font-size:10px}
.order-visual-copy{bottom:112px;max-width:330px}
.order-visual-copy>span{display:block;margin-bottom:12px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#e8cba0;font-weight:900}
.order-visual-copy h2{margin:0;font-family:var(--display);font-size:clamp(38px,4vw,60px);font-weight:600;line-height:.98;letter-spacing:-.035em}
.order-visual-copy p{margin:17px 0 0;color:rgba(255,255,255,.78);font-size:13px;line-height:1.7}
.order-visual-foot{bottom:28px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.22)}
.order-visual-foot strong{display:block;font-family:var(--display);font-size:16px;font-weight:600}
.order-visual-foot small{display:block;margin-top:4px;color:rgba(255,255,255,.66);font-size:10px;letter-spacing:.07em}
.order-monogram{font-family:var(--display);font-size:35px;line-height:1;color:#f2d9b2;letter-spacing:-.08em}

.order-workspace-v5{
  min-width:0;
  border-radius:34px;
  padding:28px clamp(20px,3.2vw,48px) 34px;
  background:rgba(255,253,249,.96);
  border:1px solid rgba(255,255,255,.96);
  box-shadow:var(--studio-shadow);
}

.order-progress-v5{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:34px}
.order-progress-v5 a,.order-progress-v5 span{
  min-width:0;display:flex;align-items:center;gap:9px;padding:11px 12px;border-radius:15px;border:1px solid transparent;color:#9a8e93;background:transparent
}
.order-progress-v5 em{flex:0 0 auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#eee6e8;font-style:normal;font-size:10px;font-weight:900}
.order-progress-v5 b{min-width:0;font-size:10px;line-height:1.2;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.order-progress-v5 .is-complete{color:#6b5860}
.order-progress-v5 .is-complete em{background:#e8dbdf;color:var(--studio-wine)}
.order-progress-v5 .is-active{color:#fff;background:var(--studio-ink);box-shadow:0 12px 24px rgba(23,19,21,.13)}
.order-progress-v5 .is-active em{background:#fff;color:var(--studio-ink)}

.order-workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:end;margin-bottom:28px}
.order-workspace-head .eyebrow{margin-bottom:8px}
.order-workspace-head h1{margin:0;font-family:var(--display);font-size:clamp(38px,5vw,64px);line-height:1;letter-spacing:-.045em;font-weight:600;max-width:740px}
.order-workspace-head p{margin:13px 0 0;color:#70636a;line-height:1.7;font-size:14px;max-width:680px}
.order-save-state{align-self:start;display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px;background:#f4eee9;border:1px solid var(--studio-line);color:#776870;font-size:10px;white-space:nowrap}
.order-save-state i{width:7px;height:7px;border-radius:50%;background:#61a274;box-shadow:0 0 0 4px rgba(97,162,116,.11)}
.order-save-state.is-saving i{background:var(--studio-gold);animation:savePulse .7s infinite alternate}
@keyframes savePulse{to{opacity:.35}}

.inspiration-preview-v5,.model-preview{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 14px;margin-bottom:22px;border:1px solid var(--studio-line);border-radius:18px;background:#f7f1ed
}
.inspiration-preview-v5 img,.model-preview img{width:54px;height:66px;object-fit:cover;border-radius:12px}
.model-preview .inspiration-summary-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--studio-wine);border:1px solid var(--studio-line)}
.inspiration-preview-v5 small,.model-preview small{display:block;color:#887b81;font-size:9px;text-transform:uppercase;letter-spacing:.12em;font-weight:900}
.inspiration-preview-v5 strong,.model-preview strong{display:block;margin-top:4px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inspiration-preview-v5 a,.model-preview a{color:var(--studio-wine);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}

.order-choice-label{display:flex;justify-content:space-between;gap:14px;align-items:flex-end;margin-bottom:12px}
.order-choice-label h2{margin:0;font-family:var(--display);font-size:25px;font-weight:600}
.order-choice-label small{color:#897b81;font-size:10px}
.choice-grid.order-method-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.order-method-grid .choice-card{min-height:132px;position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:15px;padding:20px;border-radius:22px;background:#fff;border:1px solid var(--studio-line);box-shadow:none;text-align:left}
.order-method-grid .choice-card:hover{transform:translateY(-2px);border-color:rgba(91,38,59,.28)}
.order-method-grid .choice-card.selected{background:linear-gradient(145deg,#fff,#f7edef);border-color:var(--studio-wine)!important;box-shadow:0 18px 38px rgba(91,38,59,.10)}
.order-method-grid .choice-icon{width:50px;height:50px;border-radius:17px;background:#f4e9ed;color:var(--studio-wine)}
.order-method-grid .choice-icon svg{width:22px;height:22px}
.order-method-grid strong{font-family:var(--display);font-size:20px;font-weight:600}
.order-method-grid small{display:block;margin-top:5px;color:#7d7076;font-size:10px}
.order-method-grid .choice-check{position:absolute;top:13px;right:13px}

.source-canvas-v5{margin-top:14px;padding:20px;border-radius:24px;background:#f7f1ed;border:1px solid var(--studio-line)}
.source-canvas-v5 .form-section{margin:0;padding:0;border:0;background:transparent}
.source-canvas-v5 .field-shell{background:#fff}
.upload-box{background:#fff!important;border-style:dashed!important}
.preview-grid figure{box-shadow:0 10px 22px rgba(43,26,33,.10)}

.atelier-fieldset{margin-top:16px;padding:22px;border-radius:24px;background:#f8f3ee;border:1px solid var(--studio-line)}
.atelier-fieldset:first-of-type{margin-top:0}
.atelier-fieldset-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.atelier-fieldset-head>div{min-width:0}
.atelier-fieldset-head small{display:block;color:var(--studio-rose);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.16em;margin-bottom:6px}
.atelier-fieldset-head h2{margin:0;font-family:var(--display);font-size:28px;font-weight:600}
.atelier-fieldset-head p{margin:6px 0 0;color:#7c6e74;font-size:11px;line-height:1.55;max-width:520px}
.atelier-fieldset-index{font-family:var(--display);font-size:34px;color:#c8a778;line-height:1}
.atelier-fieldset .form-section{margin:18px 0 0;padding:0;border:0;background:transparent}
.atelier-fieldset .form-section:first-of-type{margin-top:0}
.field-shell{transition:border-color .18s,box-shadow .18s,background .18s}
.field-shell:focus-within{border-color:rgba(91,38,59,.48);box-shadow:0 0 0 4px rgba(91,38,59,.07);background:#fff}
.size-option,.option-button,.mod-option,.mini-choice{transition:transform .16s,border-color .16s,background .16s,color .16s,box-shadow .16s}
.size-option:hover,.option-button:hover,.mod-option:hover,.mini-choice:hover{transform:translateY(-1px)}
.size-option.selected,.option-button.selected,.mod-option.selected,.mini-choice.selected{background:var(--studio-ink)!important;color:#fff!important;border-color:var(--studio-ink)!important;box-shadow:0 10px 20px rgba(23,19,21,.11)}

.customer-grid-v5{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.customer-grid-v5 .full{grid-column:1/-1}
.delivery-options-v5{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.delivery-options-v5.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.delivery-options-v5 .mini-choice{min-height:58px;border-radius:17px;background:#fff;border:1px solid var(--studio-line);font-weight:800}
.privacy-note-v5{display:flex;align-items:flex-start;gap:11px;margin-top:16px;padding:14px 15px;border-radius:17px;background:#fff;border:1px solid var(--studio-line);color:#73666c;font-size:11px;line-height:1.6}
.privacy-note-v5 i{flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f0e5e9;color:var(--studio-wine);font-style:normal}

.order-actions-v5{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:28px;padding-top:22px;border-top:1px solid var(--studio-line)}
.order-actions-v5 .action-button{min-width:260px;min-height:58px;border-radius:18px;background:var(--studio-ink);box-shadow:0 15px 30px rgba(23,19,21,.16)}
.order-actions-v5 .action-button:hover{transform:translateY(-2px);background:var(--studio-wine)}
.order-actions-v5 .action-button:disabled{opacity:.58;cursor:wait;transform:none}
.order-actions-v5 .back-button{position:static;width:auto;height:54px;padding:0 17px;display:flex;gap:9px;border-radius:17px;background:#f6f0eb;border:1px solid var(--studio-line);color:#5f5258}
.order-actions-v5 .back-button span{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.order-actions-v5 .back-button svg{width:18px;height:18px}
.action-button.is-loading span{opacity:.5}
.action-button.is-loading::before{content:"";width:17px;height:17px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:buttonSpin .7s linear infinite}
@keyframes buttonSpin{to{transform:rotate(360deg)}}

.order-trust-v5{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:17px}
.order-trust-v5 span{display:flex;align-items:center;gap:7px;padding:11px;border-radius:14px;background:#fff;border:1px solid var(--studio-line);color:#6f6268;font-size:10px;font-weight:800}
.order-trust-v5 i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#edf5ef;color:#4d8d61;font-style:normal}

.review-passport-v5{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;padding:18px 20px;margin-bottom:16px;border-radius:22px;background:var(--studio-ink);color:#fff}
.review-passport-v5 small{display:block;color:rgba(255,255,255,.58);font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:900}
.review-passport-v5 strong{display:block;margin-top:5px;font-family:var(--display);font-size:25px;font-weight:600}
.review-passport-v5 time{font-size:10px;color:#e4c99f;text-align:right}
.summary-stack-v5{display:grid;gap:12px}
.summary-card{border-radius:22px!important;background:#f8f3ee!important;border:1px solid var(--studio-line)!important;box-shadow:none!important}
.summary-card-title{padding:17px 19px!important;border-bottom:1px solid var(--studio-line)}
.summary-card-title h2{font-family:var(--display);font-size:22px!important;font-weight:600!important}
.summary-card-title a{padding:8px 10px;border-radius:999px;background:#fff;border:1px solid var(--studio-line);font-size:9px!important;text-transform:uppercase;letter-spacing:.09em}
.summary-row{padding:12px 19px!important}
.confirm-box{margin-top:15px!important;border-radius:20px!important;background:#fff!important;border:1px solid rgba(91,38,59,.23)!important}
.confirm-box input{accent-color:var(--studio-wine)}
.final-note-v5{display:flex;gap:10px;align-items:flex-start;margin-top:12px;color:#75676d;font-size:10px;line-height:1.6}
.final-note-v5 i{color:#4f9564;font-style:normal}

.success-main-v5{min-height:calc(100vh - 110px);display:grid;place-items:center;padding:40px 24px 70px}
.success-card-v5{width:min(980px,100%);display:grid;grid-template-columns:.92fr 1.08fr;overflow:hidden;border-radius:36px;background:#fffdf9;box-shadow:var(--studio-shadow);border:1px solid rgba(255,255,255,.95)}
.success-visual-v5{min-height:620px;position:relative;background:#221b1f;overflow:hidden}
.success-visual-v5 img{width:100%;height:100%;object-fit:cover;filter:saturate(.72)}
.success-visual-v5::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,9,.05),rgba(10,8,9,.72))}
.success-visual-copy{position:absolute;z-index:2;left:30px;right:30px;bottom:30px;color:#fff}
.success-visual-copy small{font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:#edcfa1}
.success-visual-copy h2{margin:10px 0 0;font-family:var(--display);font-size:42px;line-height:1;font-weight:600}
.success-content-v5{padding:clamp(30px,5vw,62px);display:flex;flex-direction:column;justify-content:center}
.success-mark-v5{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:#edf4ee;color:#4c8a5e;font-size:25px;box-shadow:0 10px 25px rgba(76,138,94,.12)}
.success-content-v5 h1{margin:22px 0 10px;font-family:var(--display);font-size:clamp(38px,5vw,58px);line-height:1;font-weight:600}
.success-content-v5>p{margin:0;color:#70636a;font-size:14px;line-height:1.75}
.success-order-v5{margin-top:22px;padding:14px 16px;border-radius:16px;background:#f6f0ea;border:1px solid var(--studio-line);font-size:11px;font-weight:800;color:#5e5057}
.success-timeline-v5{display:grid;gap:12px;margin-top:22px}
.success-timeline-v5 div{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--studio-line)}
.success-timeline-v5 b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f0e5e9;color:var(--studio-wine);font-size:10px}
.success-timeline-v5 span{font-size:12px;font-weight:800}
.success-actions-v5{display:flex;gap:10px;margin-top:26px}
.success-actions-v5 .action-button{flex:1;min-height:56px;border-radius:17px;background:var(--studio-ink)}
.success-actions-v5 .secondary-link{display:grid;place-items:center;padding:0 18px;border-radius:17px;border:1px solid var(--studio-line);font-size:11px;font-weight:900}

.order-flow-layout.is-entering .order-visual-v5{animation:visualIn .7s cubic-bezier(.22,.75,.2,1) both}
.order-flow-layout.is-entering .order-workspace-v5{animation:workspaceIn .72s .08s cubic-bezier(.22,.75,.2,1) both}
@keyframes visualIn{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes workspaceIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

html[dir="rtl"] .order-method-grid .choice-card{text-align:right}
html[dir="rtl"] .order-method-grid .choice-check{right:auto;left:13px}
html[dir="rtl"] .order-progress-v5 em{direction:ltr}
html[dir="rtl"] .order-visual-copy{text-align:right}
html[dir="rtl"] .review-passport-v5 time{text-align:left}

@media(max-width:1060px){
  .order-flow-layout{grid-template-columns:320px minmax(0,1fr)}
  .order-visual-v5{min-height:720px}
  .order-progress-v5 b{display:none}
  .order-progress-v5 a,.order-progress-v5 span{justify-content:center;padding:9px}
  .order-workspace-head{grid-template-columns:1fr}
  .order-save-state{justify-self:start}
}

@media(max-width:820px){
  .order-flow-wrap{margin:20px auto 50px;padding:0 14px}
  .order-flow-layout{grid-template-columns:1fr}
  .order-visual-v5{min-height:410px;position:relative}
  .order-visual-copy{bottom:82px;max-width:420px}
  .order-visual-copy h2{font-size:42px}
  .order-visual-foot{bottom:23px}
  .order-workspace-v5{padding:22px 18px 26px;border-radius:28px}
  .order-progress-v5{margin-bottom:26px}
  .order-workspace-head h1{font-size:44px}
  .choice-grid.order-method-grid{grid-template-columns:1fr}
  .customer-grid-v5{grid-template-columns:1fr}
  .customer-grid-v5 .full{grid-column:auto}
  .success-card-v5{grid-template-columns:1fr}
  .success-visual-v5{min-height:330px}
}

@media(max-width:560px){
  .order-flow-wrap{padding:0 9px}
  .order-visual-v5{min-height:355px;border-radius:25px}
  .order-visual-v5::after{inset:9px;border-radius:18px}
  .order-visual-top,.order-visual-copy,.order-visual-foot{left:20px;right:20px}
  .order-visual-top{top:20px}
  .order-visual-copy{bottom:76px}
  .order-visual-copy h2{font-size:35px}
  .order-visual-copy p{font-size:11px;margin-top:11px}
  .order-visual-foot{bottom:18px;padding-top:12px}
  .order-visual-foot small{display:none}
  .order-workspace-v5{border-radius:25px;padding:18px 14px 22px}
  .order-progress-v5{gap:5px}
  .order-progress-v5 a,.order-progress-v5 span{padding:7px}
  .order-progress-v5 em{width:28px;height:28px}
  .order-workspace-head{margin-bottom:22px}
  .order-workspace-head h1{font-size:37px}
  .order-workspace-head p{font-size:12px}
  .order-save-state{display:none}
  .order-method-grid .choice-card{min-height:105px;padding:15px}
  .source-canvas-v5,.atelier-fieldset{padding:16px;border-radius:20px}
  .atelier-fieldset-head h2{font-size:23px}
  .atelier-fieldset-index{font-size:27px}
  .delivery-options-v5,.delivery-options-v5.three{grid-template-columns:1fr}
  .order-actions-v5{position:sticky;bottom:0;z-index:15;margin:24px -14px -22px;padding:13px 14px calc(13px + env(safe-area-inset-bottom));background:rgba(255,253,249,.94);backdrop-filter:blur(16px);border-radius:0 0 25px 25px}
  .order-actions-v5 .action-button{min-width:0;flex:1;min-height:54px;border-radius:16px}
  .order-actions-v5 .back-button{width:54px;padding:0;justify-content:center}
  .order-actions-v5 .back-button span{display:none}
  .order-trust-v5{grid-template-columns:1fr}
  .review-passport-v5{grid-template-columns:1fr}
  .review-passport-v5 time{text-align:left}
  .success-main-v5{padding:18px 9px 45px}
  .success-card-v5{border-radius:26px}
  .success-content-v5{padding:28px 19px 34px}
  .success-actions-v5{flex-direction:column}
  .success-actions-v5 .secondary-link{min-height:52px}
}

@media(prefers-reduced-motion:reduce){
  .order-flow-layout.is-entering .order-visual-v5,.order-flow-layout.is-entering .order-workspace-v5{animation:none}
  *{scroll-behavior:auto!important}
}
#orderStart{scroll-margin-top:112px}
@media(max-width:560px){
  .order-actions-v5{position:static;margin:24px 0 0;padding:18px 0 0;background:transparent;backdrop-filter:none;border-radius:0}
}

/* Reliable native photo picker */
.upload-box{position:relative;cursor:pointer;isolation:isolate;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.upload-input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer!important;z-index:5!important;display:block!important}
.upload-box .upload-plus,.upload-box .upload-copy{position:relative;z-index:1;pointer-events:none}
.upload-box:focus-within{border-color:var(--studio-wine)!important;box-shadow:0 0 0 4px rgba(91,38,59,.08)}