
*{box-sizing:border-box;margin:0;padding:0;}
body{background:#ece9e4;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding:20px 12px;}
.qwrap{background:#fff;border-radius:16px;width:100%;overflow:hidden;box-shadow:0 4px 40px rgba(0,0,0,0.13);}

/* HEADER */
.qhead{padding:16px 24px 0;background:#fff;}
.qbrand{font-size:11px;color:#8b1a2f;text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:10px;}
.qprow{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.qplabel{font-size:12px;color:#bbb;}
.qplabel b{color:#8b1a2f;}
.qbarbg{height:4px;background:#eee;border-radius:4px;}
.qbarfill{height:4px;background:linear-gradient(90deg,#8b1a2f,#c0394f);border-radius:4px;transition:width .4s ease;}

/* BODY */
.qbody{padding:22px 24px 28px;}
.step{display:none;}
.step.active{display:block;}

/* EYEBROW / TITLE */
.qeye{font-size:11px;color:#bbb;text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.qtitle{font-size:17px;font-weight:700;color:#1a1a1a;line-height:1.4;margin-bottom:5px;}
.qsub{font-size:13px;color:#999;margin-bottom:18px;line-height:1.5;}

/* HINT */
.hintbox{display:none;background:#fdf5f6;border-left:3px solid #8b1a2f;border-radius:7px;padding:10px 14px;margin-bottom:15px;font-size:13px;color:#8b1a2f;line-height:1.5;}

/* CARDS GRID */
.ogrid{display:grid;gap:9px;margin-bottom:18px;}
.ogrid.c1{grid-template-columns:1fr;}
.ogrid.c2{grid-template-columns:1fr 1fr;}
.ogrid.c3{grid-template-columns:1fr 1fr 1fr;}

.ocard{border:1.5px solid #e8e8e8;border-radius:10px;cursor:pointer;background:#fff;transition:border-color .15s,background .15s;overflow:hidden;}
.ocard:hover{border-color:#c9a0a8;}
.ocard.sel{border-color:#8b1a2f;background:#fdf8f8;}
.ocard.sel .olabel{color:#8b1a2f;}

/* photo */
.ophoto{width:100%;aspect-ratio:4/3;background:#f4f1ec;display:flex;align-items:center;justify-content:center;font-size:11px;color:#ccc;overflow:hidden;position:relative;}
.ophoto.sq{aspect-ratio:1;}
.ophoto.wide{aspect-ratio:16/7;}
.ophoto img{width:100%;height:100%;object-fit:cover;display:block;}
.ptag{position:absolute;bottom:6px;left:6px;background:rgba(0,0,0,.45);color:#fff;font-size:10px;padding:2px 7px;border-radius:3px;pointer-events:none;}

.oinner{padding:10px 12px 12px;}
.olabel{font-size:13px;font-weight:700;color:#1a1a1a;margin-bottom:3px;line-height:1.3;}
.odesc{font-size:11px;color:#aaa;line-height:1.4;}

/* horizontal card */
.ocard.horiz{display:flex;align-items:stretch;}
.ocard.horiz .ophoto{width:90px;flex-shrink:0;aspect-ratio:unset;border-radius:0;}
.ocard.horiz .oinner{flex:1;display:flex;flex-direction:column;justify-content:center;}

/* checkbox multi */
.ocard.multi{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;}
.ocard.multi .ochk{width:18px;height:18px;border:1.5px solid #ddd;border-radius:4px;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.ocard.multi.sel .ochk{background:#8b1a2f;border-color:#8b1a2f;}
.ocard.multi .otext{flex:1;}

/* multi with photo */
.ocard.multiphoto{display:flex;align-items:stretch;gap:0;}
.ocard.multiphoto .ophoto{width:90px;flex-shrink:0;aspect-ratio:unset;border-radius:0;}
.ocard.multiphoto .mpright{flex:1;display:flex;align-items:flex-start;gap:10px;padding:12px 14px;}
.ocard.multiphoto .ochk{width:18px;height:18px;border:1.5px solid #ddd;border-radius:4px;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.ocard.multiphoto.sel .ochk{background:#8b1a2f;border-color:#8b1a2f;}
.ocard.multiphoto .otext{flex:1;}

/* INPUTS */
.qlabel{font-size:12px;color:#888;margin-bottom:5px;display:block;font-weight:500;}
.qinput{width:100%;padding:12px 14px;border:1.5px solid #e8e8e8;border-radius:8px;font-size:14px;color:#333;background:#fff;margin-bottom:12px;outline:none;transition:border-color .15s;font-family:inherit;}
.qinput:focus{border-color:#8b1a2f;}
textarea.qinput{resize:vertical;min-height:80px;}

/* FILE UPLOAD */
.uploadbox{border:1.5px dashed #ddd;border-radius:8px;padding:16px;text-align:center;cursor:pointer;background:#fafafa;margin-bottom:14px;transition:border-color .15s;}
.uploadbox:hover{border-color:#8b1a2f;}
.uploadbox input{display:none;}
.uploadbox .uico{font-size:22px;margin-bottom:6px;}
.uploadbox .utitle{font-size:13px;font-weight:600;color:#333;margin-bottom:3px;}
.uploadbox .usub{font-size:11px;color:#aaa;}
.uploadbox.has-file{border-color:#8b1a2f;background:#fdf5f6;}
.uploadbox.has-file .utitle{color:#8b1a2f;}

/* BUTTONS */
.btnrow{display:flex;gap:9px;margin-top:4px;}
.btnnext{flex:1;padding:14px 20px;background:#8b1a2f;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;}
.btnnext:hover:not(:disabled){background:#7a1628;}
.btnnext:disabled{background:#ddd;color:#aaa;cursor:not-allowed;}
.btnback{padding:14px 18px;background:#fff;color:#666;border:1.5px solid #e8e8e8;border-radius:8px;font-size:14px;cursor:pointer;transition:border-color .15s;}
.btnback:hover{border-color:#aaa;}

/* SCARCITY */
.scarcity{background:#fdf5f6;border-left:3px solid #8b1a2f;border-radius:7px;padding:10px 14px;margin-bottom:16px;font-size:13px;color:#8b1a2f;font-weight:600;}

/* START */
.shero{position:relative;border-radius:12px;overflow:hidden;margin-bottom:18px;}
.shero-img{width:100%;aspect-ratio:16/7;background:#1c1c1a;display:flex;align-items:center;justify-content:center;font-size:13px;color:#555;overflow:hidden;}
.shero-img img{width:100%;height:100%;object-fit:cover;display:block;}
.shero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.75) 0%,rgba(0,0,0,.2) 100%);border-radius:12px;}
.shero-text{position:absolute;bottom:0;left:0;right:0;padding:22px 20px;}
.seye{font-size:11px;color:#c0394f;text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:8px;}
.stitle{font-size:20px;font-weight:800;color:#fff;line-height:1.35;margin-bottom:6px;}
.ssub{font-size:13px;color:rgba(255,255,255,.75);line-height:1.5;}
.sbadges{display:flex;flex-direction:column;gap:7px;margin-bottom:18px;}
.sbadge{display:flex;align-items:center;gap:10px;padding:10px 13px;background:#f8f5f1;border-radius:8px;font-size:13px;color:#333;border:1px solid #ece9e4;}

/* RESULT */
.resblock{text-align:center;padding:4px 0;}
.resicon{width:54px;height:54px;background:#fdf5f6;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:22px;}
.restitle{font-size:20px;font-weight:800;color:#1a1a1a;margin-bottom:8px;}
.ressub{font-size:13px;color:#888;margin-bottom:20px;line-height:1.5;}
.pricebox{background:#f8f4f5;border-radius:10px;padding:18px 20px;margin-bottom:18px;border:1px solid #e8d8db;}
.pricelabel{font-size:11px;color:#aaa;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;}
.pricevalue{font-size:26px;font-weight:800;color:#8b1a2f;margin-bottom:4px;}
.pricenote{font-size:11px;color:#bbb;}
.msgbtns{display:flex;flex-direction:column;gap:8px;}
.msgbtn{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;transition:opacity .15s;}
.msgbtn:hover{opacity:.88;}
.msgbtn{background:#fff;color:#333;border:1.5px solid #e8e8e8;}
.msgbtn:hover{background:#f8f8f8;}

/* contacts */
.cinput{width:100%;padding:13px 14px;border:1.5px solid #e8e8e8;border-radius:8px;font-size:14px;color:#333;outline:none;margin-bottom:10px;transition:border-color .15s;font-family:inherit;}
.cinput:focus{border-color:#8b1a2f;}
.privacy{font-size:11px;color:#ccc;margin-bottom:16px;}
.divider{display:flex;align-items:center;gap:10px;margin:12px 0;}
.divider:before,.divider:after{content:'';flex:1;height:1px;background:#eee;}
.divider span{font-size:12px;color:#ccc;white-space:nowrap;}
.msgmini{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;}
.mmb{display:flex;align-items:center;justify-content:center;padding:10px;border-radius:8px;font-size:13px;color:#555;text-decoration:none;background:#f8f8f8;border:1.5px solid #e8e8e8;font-weight:500;}
.mmb.vb{border-left:3px solid #7360f2;}
.mmb.tg{border-left:3px solid #29a9eb;}
.mmb.wa{border-left:3px solid #25d366;}

/* messenger attach block */
.attachblock{background:#f4f4f2;border-radius:8px;padding:14px;margin-bottom:14px;}
.attachblock .atitle{font-size:13px;font-weight:600;color:#333;margin-bottom:4px;}
.attachblock .asub{font-size:12px;color:#888;margin-bottom:10px;}
.attachbtns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;}
.abb{display:flex;align-items:center;justify-content:center;padding:9px 6px;border-radius:6px;font-size:12px;color:#555;text-decoration:none;background:#fff;border:1.5px solid #e0e0e0;font-weight:500;}
.abb.vb{border-left:3px solid #7360f2;}
.abb.tg{border-left:3px solid #29a9eb;}
.abb.wa{border-left:3px solid #25d366;}

@media(max-width:480px){
  .qbody{padding:18px 16px 22px;}
  .qhead{padding:14px 16px 0;}
  .ogrid.c3{grid-template-columns:1fr 1fr;}
  .stitle{font-size:17px;}
}
