*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#111;--red:#A7012A;--red-lt:#c4183a;--red-dk:#820020;
  --paper:#f5f5f5;--p2:#eee;--p3:#e0e0e0;--white:#fff;--mute:#888;
  --rlt:rgba(0,0,0,.09);--rdk:rgba(255,255,255,.08);
  --fd:'Cormorant Garamond',Georgia,serif;--fb:'Instrument Sans',system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
html{scroll-behavior:smooth}
body{font-family:var(--fb);font-size:15px;line-height:1.6;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:500;height:68px;background:var(--ink);border-bottom:.5px solid var(--rdk)}
.nav-in{max-width:1400px;margin:0 auto;padding:0 48px;height:100%;display:flex;align-items:center;justify-content:space-between}
.nav-logo{display:flex;align-items:center;gap:14px}
.nav-mark{width:34px;height:34px;background:var(--red);display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:16px;font-weight:500;color:#fff;flex-shrink:0}
.nav-name{font-family:var(--fd);font-size:20px;font-weight:500;color:#f5f5f5;line-height:1}
.nav-sub{font-size:10px;color:var(--mute);letter-spacing:1.2px;text-transform:uppercase;margin-top:3px}
.nav-links{display:flex;align-items:center;gap:36px;list-style:none}
.nav-links a{font-size:13px;color:rgba(255,255,255,.5);transition:color .2s}
.nav-links a:hover{color:#fff}
.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{font-size:13px;color:rgba(255,255,255,.35);letter-spacing:.3px}
.nav-auth{display:flex;align-items:center}
.nav-auth-link{font-size:13px;color:rgba(255,255,255,.5);transition:color .2s}
.nav-auth-link:hover{color:#fff}
.nav-auth-account{display:none;align-items:center;gap:6px;font-size:13px;color:rgba(255,255,255,.7);transition:color .2s}
.nav-auth-account:hover{color:#fff}
.nav-auth-icon{width:7px;height:7px;border-radius:50%;background:var(--red);display:inline-block}
.nav-cta{background:var(--red);color:#fff;padding:9px 20px;font-family:var(--fb);font-size:13px;font-weight:500;letter-spacing:.3px;transition:background .2s;white-space:nowrap}
.nav-cta:hover{background:var(--red-lt)}
.nav-back{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.4);transition:color .2s}
.nav-back:hover{color:#fff}
.nav-back svg{width:14px;height:14px}

/* PAGE HEADER */
.ph{background:var(--ink);padding-top:68px;position:relative;overflow:hidden}
.ph::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E")}
.ph-in{max-width:1400px;margin:0 auto;padding:48px 48px 52px;position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end}
.eyebrow{font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--red);font-weight:500;margin-bottom:14px}
.ph h1{font-family:var(--fd);font-size:56px;font-weight:400;color:#f5f5f5;line-height:1;letter-spacing:-1.5px;margin-bottom:14px}
.ph h1 em{font-style:italic;color:var(--red)}
.ph-desc{font-size:14px;color:rgba(255,255,255,.38);line-height:1.75;max-width:360px}

/* Breadcrumb */
.wiz-bc{display:flex;flex-direction:column;gap:6px}
.wbc-step{display:flex;align-items:center;gap:14px;padding:11px 16px;background:rgba(255,255,255,.03);border:.5px solid rgba(255,255,255,.06);cursor:pointer;transition:background .15s,border-color .15s;position:relative}
.wbc-step:hover{background:rgba(255,255,255,.05)}
.wbc-step.active{background:rgba(167,1,42,.1);border-color:rgba(167,1,42,.3)}
.wbc-step.done .wbc-num{background:var(--red);color:#fff;border-color:var(--red)}
.wbc-num{width:26px;height:26px;flex-shrink:0;border-radius:50%;border:.5px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:13px;color:rgba(255,255,255,.4);transition:all .2s}
.wbc-step.active .wbc-num{border-color:var(--red);color:var(--red)}
.wbc-texts{flex:1;min-width:0}
.wbc-title{font-size:13px;color:rgba(255,255,255,.7);font-weight:500}
.wbc-sub{font-size:11px;color:rgba(255,255,255,.28);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wbc-step.active .wbc-title{color:#fff}
.wbc-check svg{width:16px;height:16px;display:none}
.wbc-step.done .wbc-check svg{display:block}
.wbc-arrow{width:14px;height:14px;flex-shrink:0;opacity:.25}
.wbc-step.active .wbc-arrow{opacity:1;color:var(--red)}

/* IMAGE STRIP */
.img-strip{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;height:180px;overflow:hidden}
.is-item{position:relative;overflow:hidden}
.is-item img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.72) saturate(.8);transition:transform .6s var(--ease),filter .3s}
.is-item:hover img{transform:scale(1.04);filter:brightness(.85) saturate(1)}
.is-item::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(to bottom,transparent 50%,rgba(0,0,0,.5) 100%)}
.is-div{position:absolute;top:0;bottom:0;left:0;width:.5px;background:rgba(0,0,0,.4);z-index:2}
.is-cap{position:absolute;bottom:11px;left:13px;z-index:3;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* BODY */
.body-wrap{background:var(--paper)}
.body-in{max-width:1400px;margin:0 auto;padding:48px 48px 80px;display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start}

/* WIZARD PANEL */
.wizard-panel{background:var(--white);border:.5px solid var(--rlt);overflow:hidden}
.step-tabs{display:flex;border-bottom:.5px solid var(--rlt)}
.step-tab{flex:1;padding:16px 12px;text-align:center;cursor:pointer;border-right:.5px solid var(--rlt);position:relative;transition:background .15s;display:flex;flex-direction:column;align-items:center;gap:4px}
.step-tab:last-child{border-right:none}
.step-tab:hover{background:var(--paper)}
.step-tab.active::after{content:'';position:absolute;bottom:-.5px;left:0;right:0;height:2px;background:var(--red)}
.step-tab.done .st-num{background:var(--red);color:#fff;border-color:var(--red)}
.st-num{width:22px;height:22px;border-radius:50%;border:.5px solid var(--p3);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--mute);transition:all .2s}
.step-tab.active .st-num{border-color:var(--red);color:var(--red)}
.st-label{font-size:10.5px;font-weight:500;color:var(--mute);letter-spacing:.3px}
.step-tab.active .st-label,.step-tab.done .st-label{color:var(--ink)}

/* Step pane transitions */
.pane-wrap{position:relative;overflow:hidden}
.step-pane{display:none;padding:40px 48px;animation:none}
.step-pane.active{display:block}
.step-pane.slide-in-right{animation:slideInRight .35s var(--ease) forwards}
.step-pane.slide-in-left{animation:slideInLeft .35s var(--ease) forwards}
.step-pane.slide-out-left{animation:slideOutLeft .35s var(--ease) forwards;position:absolute;top:0;left:0;right:0}
.step-pane.slide-out-right{animation:slideOutRight .35s var(--ease) forwards;position:absolute;top:0;left:0;right:0}
@keyframes slideInRight{from{opacity:0;transform:translateX(32px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideInLeft{from{opacity:0;transform:translateX(-32px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideOutLeft{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-32px)}}
@keyframes slideOutRight{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(32px)}}

.step-pane-title{font-family:var(--fd);font-size:28px;font-weight:400;color:var(--ink);letter-spacing:-.5px;margin-bottom:6px}
.step-pane-sub{font-size:13px;color:var(--mute);margin-bottom:32px}
.step-nav{display:flex;align-items:center;justify-content:space-between;margin-top:36px;padding-top:28px;border-top:.5px solid var(--rlt)}
.btn-prev{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--mute);cursor:pointer;background:none;border:none;font-family:var(--fb);padding:0;transition:color .15s}
.btn-prev:hover{color:var(--ink)}
.btn-prev svg,.btn-next svg{width:14px;height:14px}
.btn-next{display:flex;align-items:center;gap:8px;padding:13px 28px;background:var(--red);color:#fff;border:none;font-family:var(--fb);font-size:13.5px;font-weight:500;cursor:pointer;transition:background .15s;letter-spacing:.3px}
.btn-next:hover{background:var(--red-lt)}

/* Field label style */
.field-head{font-size:11.5px;font-weight:500;text-transform:uppercase;letter-spacing:1px;color:var(--mute);margin-bottom:12px;display:flex;align-items:center;gap:8px}

/* Tooltip trigger */
.tip-btn{width:18px;height:18px;border-radius:50%;border:.5px solid var(--p3);background:var(--p2);display:inline-flex;align-items:center;justify-content:center;font-size:10px;color:var(--mute);cursor:pointer;flex-shrink:0;transition:border-color .15s,background .15s;font-style:normal}
.tip-btn:hover{border-color:var(--red);background:var(--white);color:var(--red)}

/* TOOLTIP POPOVER */
.tooltip-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:800;pointer-events:none}
.tooltip-overlay.active{pointer-events:auto}
.tooltip-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.4);opacity:0;transition:opacity .2s}
.tooltip-overlay.active .tooltip-backdrop{opacity:1}
.tooltip-box{
  position:absolute;background:var(--white);border:.5px solid var(--rlt);
  width:340px;padding:0;overflow:hidden;
  opacity:0;transform:translateY(8px) scale(.97);
  transition:opacity .25s var(--ease),transform .25s var(--ease);
  pointer-events:none;
  box-shadow:0 12px 48px rgba(0,0,0,.12);
}
.tooltip-overlay.active .tooltip-box{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.tip-img{width:100%;height:140px;object-fit:cover;display:block;filter:saturate(.85)}
.tip-body{padding:20px}
.tip-name{font-family:var(--fd);font-size:22px;font-weight:400;color:var(--ink);margin-bottom:6px;letter-spacing:-.3px}
.tip-desc{font-size:13px;color:#555;line-height:1.65;margin-bottom:14px}
.tip-tags{display:flex;gap:8px;flex-wrap:wrap}
.tip-tag{font-size:10px;letter-spacing:.8px;text-transform:uppercase;padding:3px 10px;background:var(--p2);color:var(--mute)}
.tip-tag.green{background:#e8f4e8;color:#2a6b2a}
.tip-tag.red{background:#fce8e8;color:#8b1a1a}
.tip-close{position:absolute;top:10px;right:10px;width:28px;height:28px;background:rgba(0,0,0,.4);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;border-radius:50%}

/* RECOMMENDATION BANNER */
.rec-banner{
  display:none;margin-bottom:24px;padding:14px 18px;
  background:rgba(167,1,42,.05);border:.5px solid rgba(167,1,42,.2);
  border-left:2px solid var(--red);
  animation:fadeIn .4s var(--ease);
}
.rec-banner.show{display:flex;align-items:flex-start;gap:12px}
@keyframes fadeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.rec-icon{font-size:18px;flex-shrink:0;margin-top:1px}
.rec-text{font-size:13px;color:var(--ink);line-height:1.5}
.rec-text strong{color:var(--red)}

/* COST-SAVING TIP */
.saving-tip{
  display:none;margin-top:12px;padding:12px 16px;
  background:rgba(0,120,80,.05);border:.5px solid rgba(0,120,80,.2);
  border-left:2px solid #2a8a4a;
  animation:fadeIn .3s var(--ease);
  font-size:12.5px;color:#1a5a2a;line-height:1.5;
}
.saving-tip.show{display:block}

/* Proof copy toggle */
.proof-toggle-wrap{margin-top:24px;padding:20px;background:var(--paper);border:.5px solid var(--p3)}
.proof-toggle-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.proof-toggle-title{font-size:14px;font-weight:500;color:var(--ink)}
.proof-toggle-price{font-family:var(--fd);font-size:18px;color:var(--red);font-weight:400}
.proof-toggle-desc{font-size:12px;color:var(--mute);margin-bottom:14px;line-height:1.5}
.toggle-row{display:flex;gap:10px}
.toggle-card{flex:1;position:relative;border:.5px solid var(--p3);background:var(--white);padding:14px 16px;cursor:pointer;user-select:none;transition:border-color .15s,background .15s}
.toggle-card:hover{border-color:rgba(167,1,42,.3)}
.toggle-card.selected{border-color:var(--red);background:var(--white)}
.toggle-card.selected::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--red)}
.toggle-card input[type=radio]{display:none}
.toggle-card-label{font-size:13.5px;font-weight:500;color:var(--ink);margin-bottom:3px}
.toggle-card-sub{font-size:11.5px;color:var(--mute);line-height:1.4}
.toggle-card-cost{font-size:11px;color:var(--red-dk);font-weight:500;margin-top:5px}
.proof-timeline{margin-top:12px;display:none;padding:12px 14px;background:rgba(167,1,42,.04);border:.5px solid rgba(167,1,42,.12);align-items:center;gap:0}
.proof-timeline.show{display:flex}
.ptl-step{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1}
.ptl-dot{width:8px;height:8px;border-radius:50%;background:var(--red);flex-shrink:0}
.ptl-label{font-size:10px;color:var(--mute);text-align:center;line-height:1.4}
.ptl-line{flex:1;height:.5px;background:rgba(167,1,42,.25);margin-bottom:16px}

/* Sweet spot */
.sweet-spot{display:none;margin-top:14px;padding:16px;background:rgba(167,1,42,.05);border:.5px solid rgba(167,1,42,.2)}
.sweet-spot.show{display:flex;gap:14px;align-items:flex-start}
.sweet-icon{font-size:20px;flex-shrink:0;margin-top:1px}
.sweet-text{flex:1}
.sweet-title{font-size:13px;font-weight:500;color:var(--ink);margin-bottom:4px}
.sweet-desc{font-size:12px;color:#555;line-height:1.55}
.sweet-btn{margin-top:10px;padding:7px 16px;background:var(--red);color:#fff;border:none;font-size:12px;font-family:var(--fb);cursor:pointer;transition:background .15s;letter-spacing:.2px}
.sweet-btn:hover{background:var(--red-lt)}

/* Eco toggle */
.eco-toggle{margin-top:24px;padding:16px 18px;border:.5px solid var(--p3);background:var(--paper);display:flex;align-items:center;gap:16px;cursor:pointer;transition:border-color .2s,background .2s;user-select:none}
.eco-toggle:hover{border-color:rgba(42,120,60,.4);background:var(--white)}
.eco-toggle.on{border-color:#2a7a3c;background:#f0f8f2;border-left:2px solid #2a7a3c}
.eco-toggle.on .eco-check{background:#2a7a3c;border-color:#2a7a3c}
.eco-toggle.on .eco-check::after{opacity:1}
.eco-icon{font-size:22px;flex-shrink:0}
.eco-body{flex:1}
.eco-title{font-size:14px;font-weight:500;color:var(--ink);margin-bottom:2px}
.eco-desc{font-size:11.5px;color:var(--mute);line-height:1.5}
.eco-check{width:22px;height:22px;border-radius:50%;border:.5px solid var(--p3);background:var(--white);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .2s}
.eco-check::after{content:'✓';font-size:12px;color:#fff;opacity:0;transition:opacity .2s}

/* Design services upsell */
.design-upsell{margin-top:28px;padding:22px;background:rgba(167,1,42,.03);border:.5px solid rgba(167,1,42,.12)}
.design-upsell-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.design-upsell-icon{font-size:26px;flex-shrink:0;margin-top:2px}
.design-upsell-title{font-family:var(--fd);font-size:20px;font-weight:400;color:var(--ink);margin-bottom:4px;letter-spacing:-.3px}
.design-upsell-sub{font-size:12.5px;color:var(--mute);line-height:1.55}
.design-services-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ds-card{border:.5px solid var(--p3);background:var(--white);padding:14px;cursor:pointer;user-select:none;position:relative;transition:border-color .15s,background .15s}
.ds-card:hover{border-color:rgba(167,1,42,.3)}
.ds-card.selected{border-color:var(--red)}
.ds-card.selected::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--red)}
.ds-card input[type=checkbox]{display:none}
.ds-name{font-size:13px;font-weight:500;color:var(--ink);margin-bottom:3px;padding-right:20px}
.ds-desc{font-size:11px;color:var(--mute);line-height:1.4}
.ds-price{font-size:11px;color:var(--red-dk);font-weight:500;margin-top:5px}
.ds-check{position:absolute;top:10px;right:10px;width:16px;height:16px;border-radius:50%;background:var(--p2);display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--mute);transition:all .2s}
.ds-card.selected .ds-check{background:var(--red);color:#fff}

/* FORM ELEMENTS */
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px}
.field-row.cols1{grid-template-columns:1fr}
.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);font-weight:500}
.field input[type=text],.field input[type=number],.field textarea,.field select{padding:0 14px;height:44px;background:var(--paper);border:.5px solid var(--p3);font-family:var(--fb);font-size:14px;color:var(--ink);outline:none;transition:border-color .18s,background .18s;-webkit-appearance:none}
.field textarea{height:auto;padding:12px 14px;resize:vertical}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;cursor:pointer}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--red);background:var(--white)}
.field input::placeholder,.field textarea::placeholder{color:var(--mute);opacity:.55}
.field-hint{font-size:11.5px;color:var(--mute);margin-top:6px}

/* Option cards */
.opt-grid{display:flex;gap:10px;margin-bottom:24px}
.opt-card{flex:1;min-width:0;position:relative;border:.5px solid var(--p3);background:var(--paper);padding:32px 16px 16px;cursor:pointer;user-select:none;transition:border-color .15s,background .15s,transform .15s}
.opt-card:hover{border-color:rgba(167,1,42,.3);background:var(--white);transform:translateY(-1px)}
.opt-card.selected{border-color:var(--red);background:var(--white)}
.opt-card.selected::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--red)}
.opt-card.disabled{opacity:.28;pointer-events:none}
.opt-card input[type=radio]{display:none}
.oc-badge{position:absolute;top:8px;left:8px;right:auto;font-size:8.5px;letter-spacing:.8px;text-transform:uppercase;font-weight:500;padding:2px 7px;background:var(--red);color:#fff}
.oc-badge.out{background:transparent;border:.5px solid var(--p3);color:var(--mute)}
.opt-card.selected .oc-badge.out{border-color:rgba(167,1,42,.3);color:var(--red-dk)}
.oc-icon{font-size:22px;margin-bottom:10px;display:block}
.oc-label{display:block;font-size:14px;font-weight:500;color:var(--ink);margin-bottom:4px}
.oc-sub{font-size:11.5px;color:var(--mute);line-height:1.4}

/* Paper grid */
.paper-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}
.paper-card{position:relative;border:.5px solid var(--p3);background:var(--paper);padding:16px 14px;cursor:pointer;user-select:none;transition:border-color .15s,background .15s,transform .15s}
.paper-card:hover{border-color:rgba(167,1,42,.3);background:var(--white);transform:translateY(-1px)}
.paper-card.selected{border-color:var(--red);background:var(--white)}
.paper-card.selected::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--red)}
.paper-card.hidden{display:none}
.paper-card input[type=radio]{display:none}
.pc-gsm{font-family:var(--fd);font-size:26px;font-weight:400;color:var(--ink);line-height:1}
.pc-name{font-size:12.5px;font-weight:500;color:var(--ink);margin:4px 0 5px}
.pc-desc{font-size:11px;color:var(--mute);line-height:1.4}
.pc-badge{position:absolute;top:9px;right:9px;font-size:9px;letter-spacing:.8px;text-transform:uppercase;padding:2px 7px}
.pc-badge.coated{background:var(--p2);color:#777}
.pc-badge.uncoated{background:var(--p3);color:#666}
.paper-card.selected .pc-badge{background:rgba(167,1,42,.1);color:var(--red-dk)}
.pc-rate{font-size:10px;color:var(--mute);font-weight:500;margin-top:6px}
.pc-rate-cost{font-size:10.5px;font-weight:600;margin-top:4px}
.pc-rate-cost.cheap    {color:#2a7a3c}   /* green   — cheapest   */
.pc-rate-cost.ok       {color:#5a8a2a}   /* lime    — low-mid    */
.pc-rate-cost.pricey   {color:#c47a00}   /* orange  — upper-mid  */
.pc-rate-cost.expensive{color:#c4183a}   /* red     — most expensive */

/* Lam cards */
.lam-cards{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
.lam-card{position:relative;border:.5px solid var(--p3);background:var(--paper);padding:15px 18px;cursor:pointer;user-select:none;display:flex;align-items:center;gap:16px;transition:border-color .15s,background .15s,transform .15s}
.lam-card:hover{border-color:rgba(167,1,42,.3);background:var(--white);transform:translateX(2px)}
.lam-card.selected{border-color:var(--red);background:var(--white)}
.lam-card.selected::after{content:'';position:absolute;top:0;left:0;bottom:0;width:2px;background:var(--red)}
.lam-card input[type=radio]{display:none}
.lam-swatch{width:34px;height:34px;flex-shrink:0;border:.5px solid rgba(0,0,0,.07)}
.lam-swatch.gloss{background:linear-gradient(135deg,#fff 0%,#d8d4cc 40%,#fff 60%,#ccc8c0 100%)}
.lam-swatch.matt{background:#e4e0d8}
.lam-swatch.velvet{background:linear-gradient(135deg,#d4d0c8 0%,#bcb8b0 50%,#ccc8c0 100%)}
.lam-name{font-size:13.5px;font-weight:500;color:var(--ink);margin-bottom:2px}
.lam-desc{font-size:11.5px;color:var(--mute)}
.lam-feel{font-size:10.5px;font-weight:500;margin-top:3px}
.lam-feel.feel-gloss{color:#4a7abf}
.lam-feel.feel-matt{color:#5a6a5a}
.lam-feel.feel-velvet{color:#7a4a8a}

/* Pages */
.pages-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:14px}
.pages-card{border:.5px solid var(--p3);background:var(--paper);padding:18px}
.pages-card-head{font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--mute);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.pdot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.pdot.mono{background:var(--ink)}
.pdot.colour{background:var(--red)}
.pages-card input[type=number]{width:100%;height:52px;padding:0 14px;background:var(--white);border:.5px solid var(--p3);font-family:var(--fd);font-size:32px;font-weight:400;color:var(--ink);outline:none;transition:border-color .18s;-webkit-appearance:textfield;-moz-appearance:textfield}
.pages-card input::-webkit-inner-spin-button,.pages-card input::-webkit-outer-spin-button{-webkit-appearance:none}
.pages-card input:focus{border-color:var(--red)}
.pages-card-unit{font-size:11px;color:var(--mute);margin-top:7px}
.pages-total{padding:11px 16px;background:var(--ink);display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.pages-total-label{font-size:12px;color:rgba(255,255,255,.4)}
.pages-total-val{font-family:var(--fd);font-size:20px;color:#fff}

/* Compact page entry bar */
.page-entry-bar{background:var(--white);border:1.5px solid var(--p3);border-radius:10px;padding:20px 24px;margin-bottom:6px;transition:border-color .2s}
.page-entry-bar:focus-within{border-color:var(--red)}
.page-entry-fields{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.page-entry-field{display:flex;align-items:center;gap:10px}
.page-entry-field input{width:90px;font-size:26px;font-family:var(--fd);font-weight:400;border:1.5px solid var(--p3);border-radius:8px;background:var(--paper);text-align:center;padding:8px 6px;color:var(--ink);outline:none;transition:border-color .2s,background .2s;-webkit-appearance:textfield;-moz-appearance:textfield}
.page-entry-field input::-webkit-inner-spin-button,.page-entry-field input::-webkit-outer-spin-button{-webkit-appearance:none}
.page-entry-field input:focus{border-color:var(--red);background:var(--white)}
.page-entry-field input:not(:placeholder-shown){border-color:var(--ink);background:var(--white)}
.page-entry-field input::placeholder{color:var(--p3);font-size:22px}
.page-entry-label{font-size:12px;color:var(--mute);white-space:nowrap}
.page-entry-sep{font-size:22px;color:var(--p3);font-weight:300;padding:0 2px}
.page-entry-total{font-size:17px;font-weight:600;color:var(--ink);white-space:nowrap;padding-left:6px;font-family:var(--fd)}
.page-entry-hint{font-size:11.5px;color:var(--mute);margin-top:12px;font-style:italic;transition:color .3s}
.page-entry-hint.done{color:var(--red);font-style:normal;font-weight:500}
.page-entry-col{display:flex;flex-direction:column;gap:5px}
.page-entry-col-label{font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;color:var(--mute);display:flex;align-items:center;gap:5px}

/* Spine calculator result */
.spine-result{margin-top:14px;padding:16px 18px;background:var(--paper);border:.5px solid var(--p3);display:flex;align-items:center;gap:16px}
.spine-visual{display:flex;align-items:center;gap:0;flex-shrink:0}
.spine-cover{width:12px;height:52px;background:var(--p3);border:.5px solid #ccc}
.spine-bar{height:52px;background:var(--red);min-width:3px;transition:width .4s var(--ease);display:flex;align-items:center;justify-content:center}
.spine-bar-label{font-size:9px;color:#fff;white-space:nowrap;transform:rotate(90deg);pointer-events:none;opacity:0;transition:opacity .3s}
.spine-bar.wide .spine-bar-label{opacity:1}
.spine-info{flex:1}
.spine-mm{font-family:var(--fd);font-size:28px;font-weight:400;color:var(--ink);line-height:1}
.spine-desc{font-size:11.5px;color:var(--mute);margin-top:3px}

/* Qty */
.qty-row{display:flex;align-items:baseline;gap:10px;margin-bottom:18px}
.qty-big{font-family:var(--fd);font-size:54px;font-weight:400;line-height:1;letter-spacing:-2px;color:var(--ink);transition:color .2s}
.qty-custom-input{font-family:var(--fd);font-size:22px;font-weight:400;width:110px;border:none;border-bottom:1.5px solid var(--p3);background:transparent;color:var(--mute);outline:none;padding:4px 6px;margin-left:12px;transition:border-color .2s;-webkit-appearance:textfield;-moz-appearance:textfield}
.qty-custom-input::-webkit-inner-spin-button,.qty-custom-input::-webkit-outer-spin-button{-webkit-appearance:none}
.qty-custom-input:focus{border-bottom-color:var(--red);color:var(--ink)}
.qty-custom-input::placeholder{font-size:14px;color:var(--p3)}
.qty-unit{font-size:14px;color:var(--mute)}
.qty-slider{width:100%;height:3px;background:var(--p3);-webkit-appearance:none;appearance:none;outline:none;cursor:pointer;margin-bottom:12px}
.qty-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:var(--red);border:2px solid #fff;box-shadow:0 0 0 1px var(--red);cursor:pointer}
.qty-slider::-moz-range-thumb{width:20px;height:20px;background:var(--red);border:2px solid #fff;box-shadow:0 0 0 1px var(--red);cursor:pointer}
.qty-marks{display:flex;justify-content:space-between}
.qty-mark{font-size:10.5px;color:var(--mute)}
.qty-presets{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.qty-preset{padding:6px 14px;font-size:12px;color:var(--mute);background:var(--paper);border:.5px solid var(--p3);cursor:pointer;transition:all .15s;font-family:var(--fb)}
.qty-preset:hover{border-color:var(--red);color:var(--red-dk);background:var(--white)}
.qty-preset.active{border-color:var(--red);background:var(--white);color:var(--red-dk);font-weight:500}

/* Volume chart */
.vol-chart-wrap{margin-top:24px;padding:20px;background:var(--paper);border:.5px solid var(--p3)}
.vol-chart-title{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--mute);margin-bottom:14px}
.vol-bars{display:flex;align-items:flex-end;gap:3px;height:56px;margin-bottom:4px}
.vol-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.vol-bar{width:100%;background:var(--p3);transition:height .5s var(--ease),background .3s;border-radius:1px 1px 0 0;min-height:4px}
.vol-bar.current{background:var(--red)}
.vol-bar.cheaper{background:rgba(167,1,42,.35)}
.vol-labels{display:flex;gap:3px;margin-bottom:2px}
.vol-label-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.vol-qty{font-size:8.5px;color:var(--mute);white-space:nowrap}
.vol-price{font-size:9px;font-weight:500;color:var(--ink);white-space:nowrap}
.vol-price.current{color:var(--red)}
.vol-divider{height:.5px;background:var(--p3);margin-bottom:6px}
.vol-save{margin-top:8px;font-size:11.5px;color:#2a8a4a;font-weight:500}

/* Turnaround */
.ta-cards{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
.ta-card{position:relative;border:.5px solid var(--p3);background:var(--paper);padding:18px 20px;cursor:pointer;user-select:none;display:flex;align-items:center;gap:20px;transition:border-color .15s,background .15s,transform .15s}
.ta-card:hover{border-color:rgba(167,1,42,.3);background:var(--white);transform:translateX(2px)}
.ta-card.selected{border-color:var(--red);background:var(--white)}
.ta-card.selected::after{content:'';position:absolute;top:0;left:0;bottom:0;width:2px;background:var(--red)}
.ta-card input[type=radio]{display:none}
.ta-icon{font-size:22px;flex-shrink:0}
.ta-main{flex:1}
.ta-name{font-size:14px;font-weight:500;color:var(--ink);margin-bottom:3px}
.ta-desc{font-size:11.5px;color:var(--mute);line-height:1.5}
.ta-time{text-align:right;flex-shrink:0}
.ta-days{font-family:var(--fd);font-size:22px;font-weight:400;color:var(--ink);line-height:1}
.ta-days-label{font-size:10.5px;color:var(--mute);margin-top:2px}
.ta-card.selected .ta-days{color:var(--red)}
.ta-premium-badge{display:inline-block;font-size:9px;font-weight:600;letter-spacing:.5px;background:var(--red);color:#fff;padding:2px 6px;border-radius:3px;vertical-align:middle;margin-left:6px;font-family:var(--fb)}

/* Review */
.review-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:28px}
.review-item{background:var(--paper);border:.5px solid var(--p3);padding:14px 16px}
.review-item-label{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--mute);margin-bottom:5px}
.review-item-val{font-size:14px;font-weight:500;color:var(--ink)}
.review-item-val.empty{color:var(--p3);font-style:italic;font-weight:400}
.review-edit{font-size:11.5px;color:var(--red);cursor:pointer;text-decoration:underline;text-underline-offset:2px;display:block;margin-top:4px}

/* Validation hints */
.val-hint{font-size:11.5px;color:var(--red-dk);margin-top:-16px;margin-bottom:16px;display:none}
.val-hint.show{display:block}

/* ═══ SUMMARY PANEL ═══════════════════════════════════════════════════ */
.summ{position:sticky;top:92px;background:var(--ink);display:flex;flex-direction:column;overflow:hidden}
.summ-topbar{background:var(--red);padding:12px 22px;display:flex;align-items:center;justify-content:space-between}
.summ-topbar-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.85);font-weight:500}
.summ-live{display:flex;align-items:center;gap:6px;font-size:10px;color:rgba(255,255,255,.6)}
.live-dot{width:6px;height:6px;background:#fff;border-radius:50%;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* Step dots */
.summ-steps{padding:12px 22px;border-bottom:.5px solid rgba(255,255,255,.05);display:flex;gap:6px;align-items:center}
.ss-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.1);flex-shrink:0;transition:background .2s}
.ss-dot.done{background:var(--red)}
.ss-dot.active{background:rgba(167,1,42,.5);box-shadow:0 0 0 2px rgba(167,1,42,.2)}
.ss-line{flex:1;height:.5px;background:rgba(255,255,255,.06)}
.ss-label{margin-left:10px;font-size:10px;color:rgba(255,255,255,.25)}

/* 3D BOOK PREVIEW */
.book-3d-wrap{padding:24px 22px 20px;border-bottom:.5px solid rgba(255,255,255,.05);display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.book-scene{perspective:600px;flex-shrink:0;padding:4px 8px 8px 4px}
.book-3d{
  width:80px;position:relative;
  transform-style:preserve-3d;
  transform:rotateY(-25deg) rotateX(3deg);
  transition:transform .5s var(--ease);
}
.book-3d:hover{transform:rotateY(-15deg) rotateX(2deg)}
.book-front{
  width:80px;height:110px;
  background:#222;
  border:.5px solid #333;
  position:relative;overflow:hidden;
  transform:translateZ(0px);
  transition:width .4s var(--ease),height .4s var(--ease);
}
.book-front-cover{
  position:absolute;top:0;right:0;bottom:0;left:0;
  background:var(--ink);
  transition:background .3s;
}
.book-front-cover.gloss-finish::after{
  content:'';position:absolute;top:0;right:0;bottom:0;left:0;
  background:linear-gradient(135deg,rgba(255,255,255,.18) 0%,transparent 50%,rgba(255,255,255,.06) 100%);
}
.book-front-cover.matt-finish::after{content:none}
.book-front-cover.velvet-finish::after{
  content:'';position:absolute;top:0;right:0;bottom:0;left:0;
  background:linear-gradient(135deg,rgba(255,255,255,.06) 0%,transparent 100%);
}
.book-cover-lines{position:absolute;top:12px;left:14px;right:10px}
.book-cover-lines span{display:block;height:1px;background:rgba(255,255,255,.12);margin-bottom:7px}
.book-cover-lines span:nth-child(2){width:75%}
.book-cover-lines span:nth-child(3){width:55%}
.book-cover-lines span:nth-child(4){width:85%}
.book-cover-lines span:nth-child(5){width:40%}
.book-cover-title{position:absolute;bottom:12px;left:10px;right:10px;font-family:var(--fd);font-size:11px;color:rgba(255,255,255,.6);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.book-spine-3d{
  position:absolute;top:0;left:0;height:100%;
  background:var(--red);
  transform-origin:left center;
  transform:rotateY(90deg) translateZ(0) scaleX(1);
  transform-style:preserve-3d;
  width:14px;
  transition:width .4s var(--ease),background .3s;
  display:flex;align-items:center;justify-content:center;
}
.book-spine-3d::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.15)}
.book-back{
  position:absolute;top:0;left:0;width:80px;height:110px;
  background:#1a1a1a;
  transform:translateZ(-14px);
  border:.5px solid #2a2a2a;
  transition:transform .4s var(--ease);
}
.book-shadow{
  position:absolute;bottom:-8px;left:5px;right:0;height:12px;
  background:rgba(0,0,0,.25);
  transform:rotateX(90deg) translateY(-6px);
  filter:blur(4px);
}
.book-info-panel{flex:1;min-width:0;padding-top:4px}
.book-title-3d{font-family:var(--fd);font-size:15px;color:#fff;line-height:1.2;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.book-pub-3d{font-size:11px;color:rgba(255,255,255,.3);margin-bottom:12px}
.book-badges{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.bbadge{font-size:9px;letter-spacing:.5px;text-transform:uppercase;padding:2px 7px;background:rgba(255,255,255,.04);border:.5px solid rgba(255,255,255,.08);color:rgba(255,255,255,.3)}
.bbadge.set{background:rgba(167,1,42,.18);border-color:rgba(167,1,42,.35);color:rgba(220,100,120,.95)}
.book-spec-line{font-size:10.5px;color:rgba(255,255,255,.25);line-height:1.6}

/* Spec rows */
.summ-specs{padding:6px 22px 2px}
.spec-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:.5px solid rgba(255,255,255,.04)}
.spec-row:first-child{border-top:.5px solid rgba(255,255,255,.04)}
.spec-key{font-size:11px;color:rgba(255,255,255,.3);display:flex;align-items:center;gap:7px}
.spec-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;background:rgba(255,255,255,.1);transition:background .2s}
.spec-dot.on{background:var(--red)}
.spec-val{font-size:11.5px;color:rgba(255,255,255,.65);font-weight:500;text-align:right;max-width:60%}
.spec-val.empty{color:rgba(255,255,255,.17);font-style:italic;font-weight:400}

/* Pricing */
.price-section{padding:10px 22px 0}
.price-section-label{font-size:9px;letter-spacing:1.8px;text-transform:uppercase;color:rgba(255,255,255,.2);margin-bottom:5px;padding-bottom:5px;border-bottom:.5px solid rgba(255,255,255,.05)}
.price-line{display:flex;justify-content:space-between;align-items:baseline;padding:4px 0;border-bottom:.5px solid rgba(255,255,255,.03)}
.price-line:last-child{border-bottom:none}
.price-line-label{font-size:10.5px;color:rgba(255,255,255,.28)}
.price-line-val{font-size:11px;color:rgba(255,255,255,.55);font-weight:500}
.price-line-val.zero{color:rgba(255,255,255,.17)}
.price-total-block{margin:10px 22px 0;background:rgba(167,1,42,.12);border:.5px solid rgba(167,1,42,.25);padding:14px 16px}
.price-total-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px}
.price-total-row:last-child{margin-bottom:0}
.ptl{font-size:11px;color:rgba(255,255,255,.38)}
.ptv{font-family:var(--fd);font-size:17px;color:rgba(255,255,255,.7);letter-spacing:-.3px}
.price-grand-row{margin-top:10px;padding-top:10px;border-top:.5px solid rgba(167,1,42,.25)}
.pgl{font-size:11px;color:rgba(255,255,255,.5);font-weight:500;margin-bottom:4px}
.pgv{font-family:var(--fd);font-size:28px;color:#fff;letter-spacing:-.5px;line-height:1.1;transition:all .3s var(--ease)}
.pgv-delivery{font-size:10.5px;color:rgba(255,255,255,.3);margin-top:3px}
.ppc{font-size:10.5px;color:rgba(255,255,255,.3);text-align:right;margin-top:4px}
.price-incomplete{font-size:11px;color:rgba(255,255,255,.22);font-style:italic;text-align:center;padding:12px 0}

/* Turnaround badge */
.summ-ta{padding:10px 22px 12px;border-top:.5px solid rgba(255,255,255,.05);display:flex;align-items:center;gap:10px}
.ta-badge{background:rgba(255,255,255,.05);border:.5px solid rgba(255,255,255,.08);padding:5px 12px;font-size:11px;color:rgba(255,255,255,.5)}
.ta-badge.set{background:rgba(167,1,42,.15);border-color:rgba(167,1,42,.3);color:rgba(220,120,130,.9)}

/* CTA */
.summ-cta{padding:12px 22px 22px}
.summ-btn{display:block;width:100%;padding:14px;background:var(--red);color:#fff;border:none;font-family:var(--fb);font-size:13px;font-weight:500;letter-spacing:.3px;text-align:center;cursor:pointer;transition:background .15s}
.summ-btn:hover{background:var(--red-lt)}
.summ-foot{font-size:10px;color:rgba(255,255,255,.18);text-align:center;margin-top:8px;line-height:1.6}
.summ-foot a{color:rgba(200,60,80,.6)}

/* ═══ SUCCESS SCREEN ══════════════════════════════════════════════════ */
.success-screen{
  display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;
  background:var(--ink);
  flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:40px;
}
.success-screen.show{display:flex}
.success-book-anim{
  width:100px;height:140px;position:relative;margin:0 auto 32px;
  animation:bookPrint 1s var(--ease) forwards;
}
@keyframes bookPrint{
  0%{transform:translateY(40px) scale(.8);opacity:0}
  60%{transform:translateY(-8px) scale(1.03)}
  100%{transform:translateY(0) scale(1);opacity:1}
}
.success-book-body{width:100%;height:100%;background:#222;border:.5px solid #333;position:relative;overflow:hidden}
.success-spine{position:absolute;left:0;top:0;bottom:0;width:12px;background:var(--red)}
.success-lines{position:absolute;top:18px;left:18px;right:12px}
.success-lines span{display:block;height:1.5px;background:rgba(255,255,255,.15);margin-bottom:10px}
.success-lines span:nth-child(2){width:70%}
.success-lines span:nth-child(3){width:50%}
.success-check{
  position:absolute;bottom:16px;right:14px;
  width:32px;height:32px;background:var(--red);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  animation:checkPop .4s .8s var(--ease) both;
}
@keyframes checkPop{from{transform:scale(0)}to{transform:scale(1)}}
.success-check svg{width:16px;height:16px}
.success-h{font-family:var(--fd);font-size:48px;font-weight:400;color:#fff;letter-spacing:-1px;margin-bottom:12px;animation:fadeUp .5s .4s var(--ease) both}
.success-sub{font-size:16px;color:rgba(255,255,255,.45);line-height:1.7;max-width:480px;margin:0 auto 32px;animation:fadeUp .5s .55s var(--ease) both}
.success-spec{background:rgba(255,255,255,.04);border:.5px solid rgba(255,255,255,.08);padding:20px 28px;max-width:420px;width:100%;margin:0 auto 28px;animation:fadeUp .5s .65s var(--ease) both;text-align:left}
.success-spec-item{display:flex;justify-content:space-between;padding:7px 0;border-bottom:.5px solid rgba(255,255,255,.06);font-size:13px}
.success-spec-item:last-child{border-bottom:none}
.success-spec-key{color:rgba(255,255,255,.35)}
.success-spec-val{color:rgba(255,255,255,.75);font-weight:500}
.success-close{padding:13px 32px;background:var(--red);color:#fff;border:none;font-family:var(--fb);font-size:13px;font-weight:500;cursor:pointer;animation:fadeUp .5s .8s var(--ease) both}
.success-close:hover{background:var(--red-lt)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* CONFETTI canvas */
#confetti-canvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:901;pointer-events:none;display:none}

/* RESPONSIVE ─────────────────────────────────────────────────────── */
@media(max-width:1100px){
  .img-strip{grid-template-columns:1fr 1fr;height:140px}
  .is-item:nth-child(n+3){display:none}
  .body-in{grid-template-columns:1fr;padding:28px 24px 60px;gap:28px}
  .summ{position:static}
  .ph-in{grid-template-columns:1fr;gap:28px;padding:40px 24px 44px}
  .nav-in{padding:0 24px}
  .wiz-bc{display:none}
}

@media(max-width:640px){
  /* Nav */
  .nav-links{display:none}
  .nav-in{padding:0 16px}

  /* Hero */
  .ph h1{font-size:36px}
  .ph-in{padding:32px 16px 36px}
  .img-strip{display:none}

  /* Body */
  .body-in{padding:16px 16px 48px;gap:20px}

  /* Wizard tabs */
  .step-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .step-tab{flex-shrink:0;padding:12px 14px}
  .st-label{display:none}

  /* Panes */
  .step-pane{padding:22px 16px}
  .step-pane-title{font-size:18px}

  /* Fields */
  .field-row{grid-template-columns:1fr}
  .field label{font-size:12px}

  /* Book type / size / orient cards */
  .opt-grid{flex-direction:column}
  .opt-card{padding:14px 16px}

  /* Lamination — already column, ensure spacing */
  .lam-cards{gap:8px}
  .lam-card{padding:12px 14px}

  /* Proof toggle */
  .proof-toggle-wrap{padding:14px}
  .toggle-row{flex-direction:column;gap:8px}
  .toggle-card{padding:12px 14px}
  /* Proof timeline — hide on mobile, takes too much space */
  .proof-timeline{display:none}

  /* Extras grid — single column on phones */
  .extras-grid{grid-template-columns:1fr 1fr}
  .extra-card{padding:10px 12px}
  .extra-label{font-size:12px}

  /* Inside cover + plate section sub-options */
  #insideCoverSub{padding:10px 12px}
  #insideCoverSub .inside-cover-type-btn{padding:8px 12px;font-size:13px;flex:1}
  #insideCoverSub > div:last-of-type{flex-wrap:wrap}
  #plateSectionSub{padding:10px 12px}
  #plateSectionSub input[type=number]{width:80px}
  #plateSectionSub select{width:100%;margin-top:8px}
  #plateSectionSub > div:last-of-type{flex-direction:column;align-items:flex-start}

  /* Paper cards */
  .paper-grid{grid-template-columns:1fr 1fr}
  .paper-card{padding:12px 10px}
  .pc-gsm{font-size:20px}

  /* Page count inputs */
  .pages-grid{grid-template-columns:1fr}

  /* Turnaround & delivery cards */
  .ta-card{padding:14px 16px;gap:12px}
  .ta-icon{font-size:18px}
  .ta-days{font-size:20px}

  /* Step nav — stack on very small screens */
  .step-nav{flex-direction:column-reverse;gap:10px;align-items:stretch}
  .btn-next{justify-content:center;padding:14px 20px}
  .btn-prev{justify-content:center;padding:12px}

  /* Review grid */
  .review-grid{grid-template-columns:1fr}
  .review-item{padding:10px 0}

  /* Design services grid */
  .design-services-grid{grid-template-columns:1fr}
  .ds-card{padding:12px}

  /* Eco toggle */
  .eco-toggle{padding:12px 14px;gap:12px}

  /* Auth modal */
  #authModal{padding:0;align-items:flex-end}
  #authModal > div{max-width:100%;width:100%;border-radius:0;max-height:92vh;overflow-y:auto}
  #authModal .auth-panel{padding:18px 20px}
  #authModal > div > div:first-child{padding:18px 20px}

  /* Summary — hide the save button on mobile (already submitted via main flow)
     and push it below the wizard using grid order */
  .summ{order:2}
  .wizard-panel{order:1}
  .summ-save-btn{display:none}
}

/* ── Save quote button ────────────────────────── */
.summ-save-btn{
  width:100%;
  background:transparent;
  border:.5px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.45);
  padding:11px;
  font-family:var(--fb);font-size:12.5px;font-weight:500;
  letter-spacing:.5px;cursor:pointer;
  transition:border-color .2s,color .2s,background .2s;
  margin-top:8px;
}
.summ-save-btn:hover{
  border-color:rgba(167,1,42,.5);
  color:rgba(220,140,160,.9);
  background:rgba(167,1,42,.06);
}

/* ── Success screen saved note ─────────────────── */
.success-saved-note{
  display:flex;
  align-items:center;
  gap:8px;
  background:rgba(50,180,100,.1);
  border:.5px solid rgba(50,180,100,.3);
  color:rgba(100,220,150,.9);
  padding:10px 18px;
  font-size:13px;
  font-family:var(--fb);
  margin:0 auto 20px;
  max-width:360px;
}
.success-saved-note svg{
  width:14px;height:14px;
  stroke:rgba(100,220,150,.9);
  flex-shrink:0;
}

/* ── Save status text ──────────────────────────── */
#saveQuoteStatus{
  font-size:11.5px;
  color:rgba(255,255,255,.25);
  text-align:center;
  min-height:16px;
  margin-bottom:4px;
}

/* ── Extras grid ─────────────────────────────── */
.extras-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;margin-top:10px}
.extra-card{border:.5px solid var(--rule-lt);background:var(--paper);padding:12px 14px;cursor:pointer;display:flex;flex-direction:column;gap:4px;position:relative;transition:border-color .15s,background .15s;user-select:none}
.extra-card:hover{border-color:rgba(167,1,42,.3);background:var(--white)}
.extra-card.extra-on{border-color:#A7012A;background:#fff5f7;border-left:2px solid #A7012A}
.extra-check{position:absolute;top:8px;right:8px;width:18px;height:18px;border:.5px solid var(--rule-lt);border-radius:2px;font-size:11px;display:flex;align-items:center;justify-content:center;color:transparent;background:var(--white);transition:all .15s}
.extra-card.extra-on .extra-check{background:#A7012A;border-color:#A7012A;color:#fff}
.extra-label{font-size:13px;font-weight:600;color:var(--ink);padding-right:20px}
.extra-cost{font-size:11px;color:var(--mute)}
.extra-card.extra-on .extra-cost{color:#A7012A;font-weight:600}
.extra-badge{font-size:9px;letter-spacing:.5px;background:var(--ink);color:#fff;padding:1px 5px;border-radius:2px;margin-left:4px;font-weight:700}
.extra-badge-hb{background:#7c3aed}
.inside-cover-type-btn{padding:6px 14px;border:.5px solid var(--rule-lt);background:var(--white);font-size:12px;cursor:pointer;color:var(--mute);transition:all .15s;font-family:inherit}
.inside-cover-type-btn.extra-type-active{background:#A7012A;border-color:#A7012A;color:#fff}