:root{
  --bg:#f6f7f9;
  --card:#ffffff;
  --text:#111827;
  --muted:#6b7280;
  --line:#e5e7eb;
  --shadow: 0 10px 30px rgba(17,24,39,.08);
  --radius: 16px;
  --btn:#111827;
  --btnText:#fff;
}
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:var(--bg);
  color:var(--text);
  overflow:hidden;
}
.topbar{
  position:fixed; top:0; left:0; right:0;
  height:56px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 12px;
  background:rgba(246,247,249,.85);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
  z-index:50;
}
.logo{ height:22px; opacity:.75; }
.topbar .right{ display:flex; gap:8px; align-items:center; }
.lang{ display:flex; gap:6px; }
.lang-btn{
  border:1px solid var(--line);
  background:rgba(255,255,255,.7);
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
  cursor:pointer;
}
.lang-btn.active{
  border-color:#111827;
  background:#111827;
  color:#fff;
}
.icon-btn{
  border:1px solid var(--line);
  background:rgba(255,255,255,.7);
  width:38px; height:38px;
  border-radius:12px;
  cursor:pointer;
  font-size:18px;
  display:grid; place-items:center;
}
.app{
  position:fixed;
  top:56px;
  left:0; right:0;
  bottom:108px;
  display:grid;
  grid-template-columns: 1fr 380px;
  gap:12px;
  padding:12px;
  isolation:isolate;
}
.viewer{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  position:relative;
  min-height:200px;
}
.viewer-placeholder{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:6px;
  color:var(--muted);
}
.ph-title{ font-size:48px; color:#111827; opacity:.15; font-weight:700; }
.ph-sub{ font-size:14px; }
.panel{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex; flex-direction:column;
}
.panel-head{
  padding:14px 14px 10px;
  border-bottom:1px solid var(--line);
  display:flex;
  gap:10px;
  align-items:center;
}
.step-head-main{
  min-width:0;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.step-pill{
  font-size:12px;
  color:var(--muted);
  border:1px solid var(--line);
  padding:6px 10px;
  border-radius:999px;
}
.step-title{
  font-weight:650;
  font-size:14px;
}
.step-inline-price{
  flex:0 0 auto;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid #dbeafe;
  background:#eff6ff;
  color:#1e3a8a;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
.step-inline-price small{
  margin-top:1px;
  font-size:9px;
  line-height:1.1;
  font-weight:650;
  color:#3b5ea7;
}
.panel-body{
  padding:14px;
  overflow:auto;
}
.step-tabs{
  display:flex;
  gap:8px;
  padding:10px 14px 0;
  overflow:auto;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, rgba(248,250,252,.9), rgba(255,255,255,.98));
}
.step-tabs-footer{
  padding:0;
  border-bottom:0;
  background:transparent;
  justify-content:center;
  flex-wrap:nowrap;
  overflow:hidden;
  gap:4px;
}
.step-tabs-footer .step-tab{
  min-width:30px;
  width:30px;
  height:30px;
  padding:0;
  border-radius:9px;
  font-size:11px;
}
.step-tab{
  flex:0 0 auto;
  min-width:42px;
  height:38px;
  border-radius:12px;
  border:1px solid #dbe4f0;
  background:#fff;
  color:#475569;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:all .18s ease;
}
.step-tab:hover{
  border-color:#94a3b8;
  transform:translateY(-1px);
}
.step-tab.active{
  background:#111827;
  border-color:#111827;
  color:#fff;
  box-shadow:0 10px 22px rgba(15,23,42,.22);
}
.card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:rgba(255,255,255,.9);
}
.h1{ font-size:18px; font-weight:750; margin:0 0 6px; }
.p{ font-size:14px; color:var(--muted); margin:0 0 10px; line-height:1.35; }
.row{ display:flex; gap:10px; flex-wrap:wrap; }
.btn{
  border:1px solid var(--line);
  background:#fff;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:600;
}
.btn.primary{
  background:var(--btn);
  border-color:var(--btn);
  color:var(--btnText);
}
.bottomnav{
  position:fixed; left:0; right:0; bottom:0;
  min-height:98px;
  background:rgba(246,247,249,.85);
  backdrop-filter: blur(10px);
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  padding:8px 12px 10px;
  z-index:40;
}
.bottomnav-main{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.bottomnav-center{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
}
.bottomnav .progress{
  display:none;
}
.bottomnav-footer{
  position:static;
  width:100%;
  margin-top:6px;
  text-align:center;
}
.nav-btn{
  width:56px; height:44px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  cursor:pointer;
  font-size:20px;
  display:grid; place-items:center;
}
.nav-btn-strong{
  border-color:#111827;
  box-shadow:0 10px 24px rgba(15,23,42,.16);
}
.nav-btn.primary{
  background:var(--btn);
  border-color:var(--btn);
  color:var(--btnText);
}
.progress{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
}
.progress-title{ font-size:12px; color:var(--muted); }
.progress-sub{ font-size:13px; font-weight:650; }
.bottomnav-link{
  display:inline-block;
  font-size:11px;
  line-height:1.2;
  color:#2563eb;
  text-decoration:none;
  font-weight:700;
}
.bottomnav-link:hover{ text-decoration:underline; }
.sidemenu{
  position:fixed;
  top:0; right:-320px;
  width:320px; height:100%;
  background:var(--card);
  border-left:1px solid var(--line);
  box-shadow:var(--shadow);
  transition:right .25s ease;
  z-index:100;
  display:flex; flex-direction:column;
}
.sidemenu.open{ right:0; }
.sidemenu-header{
  height:56px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 12px;
  border-bottom:1px solid var(--line);
}
.sidemenu-title{ font-weight:750; }
.sidemenu-nav{ padding:12px; display:flex; flex-direction:column; gap:10px; }
.menu-item{
  text-decoration:none;
  color:var(--text);
  border:1px solid var(--line);
  padding:12px;
  border-radius:14px;
  background:#fff;
}
.menu-item-icon{
  width:100%;
  display:flex;
  align-items:center;
  gap:11px;
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.menu-item-icon:hover,
.menu-item-icon[aria-expanded="true"]{ border-color:#93c5fd; background:#eff6ff; }
.menu-item-symbol{
  width:34px;
  height:34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  color:#2563eb;
  background:#dbeafe;
  flex:0 0 auto;
}
.menu-item-symbol svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.menu-item-whatsapp .menu-item-symbol{ color:#15803d; background:#dcfce7; }
.menu-item-phone .menu-item-symbol{ color:#1d4ed8; background:#dbeafe; }
.menu-item-icon strong,.menu-item-icon small{display:block}.menu-item-icon small{margin-top:3px;color:var(--muted);font-size:11px}
.menu-item-icon[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.menu-item-whatsapp[aria-disabled="true"]{ opacity:.55; cursor:not-allowed; }
.backdrop{
  position:fixed; inset:0;
  background:rgba(17,24,39,.35);
  z-index:90;
}
@media (max-width: 980px){
  .app{
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
  }
  .panel{
    position:fixed;
    left:12px; right:12px;
    bottom:90px;
    max-height:48vh;
  }
  .step-head-main{
    flex-wrap:nowrap;
    align-items:center;
    gap:8px;
  }
  .step-inline-price{
    width:auto;
    justify-content:center;
    margin-left:auto;
  }
}


/* Step UI helpers */
.choice{
  flex:1;
  min-width:160px;
  text-align:left;
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.choice .dot{
  width:14px;height:14px;border-radius:999px;
  border:2px solid var(--line);
  margin-top:3px;
}
.choice.active{
  border-color:#111827;
  box-shadow: 0 8px 18px rgba(17,24,39,.10);
}
.choice.active .dot{
  border-color:#111827;
  background:#111827;
}
.grid2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}
@media (max-width: 520px){
  .grid2{ grid-template-columns: 1fr; }
}

.toast{
  position:fixed;
  left:12px; right:12px;
  bottom:78px;
  max-width:560px;
  margin:0 auto;
  background:#111827;
  color:#fff;
  padding:12px 14px;
  border-radius:14px;
  box-shadow: var(--shadow);
  display:none;
  z-index:200;
}
.toast.show{ display:block; }


.preview-wrap{
  margin-top:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.preview-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  border-bottom:1px solid var(--line);
}
.preview-title{
  font-weight:700;
  font-size:13px;
}
.badge{
  font-size:12px;
  color:var(--muted);
  border:1px solid var(--line);
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.7);
}
.preview-canvas{
  width:100%;
  height:200px;
  display:block;
}
.small{
  font-size:12px;
  color:var(--muted);
  margin-top:8px;
}
.toggle-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}


/* Step 4 helpers */
.preview-canvas.tall{ height:220px; }
.option-list{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.option-btn{
  width:100%;
  justify-content:flex-start;
}
.option-btn .sub{
  display:block;
  font-size:12px;
  color:var(--muted);
  font-weight:500;
  margin-top:2px;
}

.panel-line{ opacity:.35; }

.viewer{ position:relative; }
.viewer-canvas{ width:100%; height:100%; display:block; border-radius:18px; }


/* polished contact form */
.field-card{
  border:1px solid var(--line);
  background:#fff;
  border-radius:16px;
  padding:10px 12px;
  box-shadow: 0 6px 18px rgba(17,24,39,.04);
}
.field-card label{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:6px;
  font-weight:600;
}
.pro-input{
  width:100%;
  border:0;
  outline:none;
  background:transparent;
  font-size:15px;
  color:var(--text);
  padding:2px 0;
}
.pro-input::placeholder{ color:#9ca3af; }
.section-subtitle{
  font-size:14px;
  font-weight:700;
  color:#111827;
  margin:14px 0 8px;
}

.phone-row{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:10px;
  align-items:center;
}
.phone-row-wide{
  grid-template-columns:120px minmax(0,1fr);
}
.phone-stack{
  display:grid;
  gap:8px;
}
.phone-help{
  font-size:12px;
  color:var(--muted);
}
.field-span-2{
  grid-column:1/-1;
}
.textarea-input{
  min-height:84px;
  resize:vertical;
}
.phone-code-wrap,
.phone-number-wrap{
  min-width:0;
}
.phone-code{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  padding-right:22px;
  cursor:pointer;
}
.phone-number{
  min-width:0;
}
@media (max-width: 520px){
  .phone-row, .phone-row-wide{
    grid-template-columns:88px minmax(0,1fr);
    gap:8px;
  }
  .phone-code,
  .phone-number{
    font-size:14px;
  }
}


/* mobile/tablet responsive layout */
.viewer-canvas{ touch-action:none; }

@media (max-width: 980px){
  body{ overflow:hidden; }
  .app{
    position:fixed;
    top:56px;
    left:0; right:0; bottom:88px;
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:10px;
  }
  .viewer{
    flex:0 0 42vh;
    min-height:260px;
  }
  .panel{
    position:relative;
    left:auto; right:auto; bottom:auto;
    flex:1 1 auto;
    min-height:0;
    max-height:none;
  }
  .panel-head{
    padding:10px 12px 8px;
    gap:8px;
  }
  .panel-body{
    padding:10px;
    padding-bottom:16px;
  }
  .step-tabs{
    padding:8px 10px 0;
    gap:6px;
  }
  .step-tabs-footer{
    padding:0;
    gap:3px;
  }
  .step-tabs-footer .step-tab{
    min-width:28px;
    width:28px;
    height:28px;
    font-size:10px;
  }
  .step-tab{
    min-width:38px;
    height:34px;
    border-radius:10px;
    font-size:12px;
  }
  .card{
    padding:10px;
    border-radius:12px;
  }
  .option-list{
    gap:8px;
    margin-top:8px;
  }
  .option-btn{
    padding:12px 14px;
    min-height:50px;
  }
  .preview-canvas.tall{ height:190px; }
}

@media (max-width: 980px) and (orientation: landscape){
  .app{
    display:grid;
    grid-template-columns:minmax(0, 56%) minmax(300px, 44%);
    grid-template-rows:1fr;
    gap:10px;
    padding:10px;
  }
  .viewer{
    min-height:unset;
    height:auto;
  }
  .panel{
    min-height:0;
    height:auto;
  }
  .panel-body{
    overflow:auto;
  }
}

@media (max-width: 520px){
  .topbar{
    padding:0 8px;
  }
  .lang{
    gap:4px;
  }
  .lang-btn{
    padding:6px 8px;
    font-size:11px;
  }
  .icon-btn{
    width:34px; height:34px; font-size:16px;
  }
  .panel-head{
    padding:8px 10px 6px;
  }
  .step-pill{
    padding:5px 8px;
  }
  .step-head-main{
    gap:6px;
  }
  .step-title{
    font-size:13px;
    flex:1 1 auto;
    min-width:0;
  }
  .step-inline-price{
    font-size:12px;
    padding:6px 9px;
    flex:0 0 auto;
  }
  .panel-body{
    padding:8px;
    padding-bottom:12px;
  }
  .card{
    padding:8px;
  }
  .option-btn{
    padding:12px 12px;
    border-radius:10px;
  }
  .viewer{
    flex:0 0 40vh;
    min-height:230px;
  }
  .bottomnav{
    min-height:94px;
    padding:6px 8px 8px;
  }
  .bottomnav-main{
    gap:6px;
  }
  .bottomnav-center{
    gap:0;
  }
  .nav-btn{
    width:42px; height:38px;
    border-radius:12px;
    font-size:18px;
    flex:0 0 42px;
  }
  .step-tabs-footer{
    width:100%;
    justify-content:center;
    gap:2px;
    overflow:hidden;
  }
  .step-tabs-footer .step-tab{
    min-width:24px;
    width:24px;
    height:24px;
    border-radius:8px;
    font-size:10px;
  }
  .bottomnav-link{
    font-size:10px;
  }
}

@media (max-width: 980px) and (orientation: portrait){
  :root{
    --mini-card-width: calc(50vw - 12px);
    --mini-card-height: calc((50vw - 12px) * 0.96);
    --mini-solo-height: calc(100vw - 16px);
    --mini-card-expanded-height: 270px;
    --mini-stack-gap: 22px;
  }
  body{
    overflow:auto;
    background:#fff;
  }
  .app{
    position:relative;
    top:56px;
    left:auto;
    right:auto;
    bottom:auto;
    min-height:calc(100vh - 56px);
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:10px 10px 0;
  }
  body.viewer-mini-active .app::before{
    content:"";
    position:fixed;
    top:56px;
    left:0;
    right:0;
    height:calc(var(--mini-card-height) + var(--mini-stack-gap));
    background:#fff;
    z-index:64;
    border-bottom:1px solid rgba(226,232,240,.95);
  }
  body.viewer-mini-active{
    overflow:hidden;
  }
  body.viewer-mini-active .app{
    position:fixed;
    top:56px;
    left:0;
    right:0;
    bottom:98px;
    min-height:unset;
    overflow:hidden;
    padding-top:0;
  }
  body.viewer-mini-active:not(.viewer-mini-with-preview) .app::before{
    height:calc(var(--mini-solo-height) + var(--mini-stack-gap));
  }
  body.viewer-mini-active:not(.viewer-mini-with-preview) .app{
    padding-top:0;
  }
  body.viewer-mini-active.viewer-mini-with-preview .app{
    padding-top:0;
  }
  body.viewer-mini-expanded .app::before{
    height:calc(var(--mini-card-expanded-height) + var(--mini-stack-gap));
  }
  body.viewer-mini-expanded .app{
    padding-top:0;
  }
  body.viewer-mini-expanded.viewer-mini-with-preview .app{
    padding-top:0;
  }
  .viewer{
    flex:0 0 auto;
    height:min(42vh, 380px);
    min-height:240px;
    transition:
      width .22s ease,
      height .22s ease,
      transform .22s ease,
      box-shadow .22s ease,
      border-radius .22s ease,
      top .22s ease,
      left .22s ease;
  }
  .panel{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    flex:none;
    min-height:unset;
  }
  .panel-body{
    overflow:visible;
  }
  body.viewer-mini-active .viewer{
    position:fixed;
    top:64px;
    left:10px;
    width:160px;
    height:102px;
    min-height:102px;
    z-index:74;
    border-radius:18px;
    box-shadow:0 18px 42px rgba(15,23,42,.24);
    cursor:pointer;
  }
  body.viewer-mini-split .viewer{
    top:64px;
    left:8px;
    width:var(--mini-card-width);
    height:var(--mini-card-height);
    min-height:var(--mini-card-height);
    border-radius:16px;
    border:1px solid var(--line);
    background:#fff;
    box-shadow:0 8px 18px rgba(15,23,42,.08);
  }
  body.viewer-mini-active:not(.viewer-mini-with-preview) .viewer{
    top:64px;
    left:8px;
    width:calc(100vw - 16px);
    height:var(--mini-solo-height);
    min-height:var(--mini-solo-height);
    border-radius:16px;
    border:1px solid var(--line);
    background:#fff;
    box-shadow:0 8px 18px rgba(15,23,42,.08);
  }
  body.viewer-mini-expanded .viewer{
    width:calc(100vw - 16px);
    height:var(--mini-card-expanded-height);
    min-height:var(--mini-card-expanded-height);
  }
  body.viewer-mini-expanded.viewer-mini-split .viewer{
    width:calc(100vw - 16px);
    height:var(--mini-card-expanded-height);
    min-height:var(--mini-card-expanded-height);
    border-radius:0 0 18px 18px;
  }
  body.viewer-mini-active .viewer::after{
    content:"3D";
    position:absolute;
    right:10px;
    bottom:10px;
    padding:4px 8px;
    border-radius:999px;
    background:rgba(15,23,42,.82);
    color:#fff;
    font-size:11px;
    font-weight:800;
    letter-spacing:.02em;
    pointer-events:none;
  }
  .mini-photo-dock{
    display:none;
  }
  .mini-photo-canvas{
    width:100%;
    height:100%;
    display:block;
    border-radius:18px;
  }
  body.viewer-mini-focus-3d .viewer{
    width:calc(100vw - 16px);
    height:var(--mini-card-expanded-height);
    min-height:var(--mini-card-expanded-height);
    left:8px;
    right:8px;
    top:64px;
    z-index:120;
    box-shadow:0 18px 40px rgba(15,23,42,.18);
  }
  body.viewer-mini-focus-3d .panel{
    z-index:1;
  }
  body.viewer-mini-with-preview .mini-photo-dock{
    display:block;
    position:fixed;
    top:64px;
    right:8px;
    width:var(--mini-card-width);
    height:var(--mini-card-height);
    z-index:70;
    border-radius:16px;
    border:1px solid var(--line);
    background:#fff;
    overflow:hidden;
    box-shadow:0 8px 20px rgba(15,23,42,.08);
  }
  body.viewer-mini-focus-preview .mini-photo-dock{
    left:8px;
    right:8px;
    width:calc(100vw - 16px);
    height:var(--mini-card-expanded-height);
    top:64px;
    z-index:96;
    box-shadow:0 18px 40px rgba(15,23,42,.18);
  }
  body.viewer-mini-focus-preview .viewer{
    display:none;
  }
  body.viewer-mini-focus-3d .mini-photo-dock{
    display:none;
  }
  body.viewer-mini-active .panel{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    top:auto;
    margin-top:calc(var(--mini-card-height) + var(--mini-stack-gap));
    z-index:auto;
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    max-height:calc(100vh - 56px - var(--mini-card-height) - var(--mini-stack-gap) - 108px);
    background:#fff;
  }
  body.viewer-mini-active:not(.viewer-mini-with-preview) .panel{
    margin-top:calc(var(--mini-solo-height) + var(--mini-stack-gap));
  }
  body.viewer-mini-expanded .panel{
    margin-top:calc(var(--mini-card-expanded-height) + var(--mini-stack-gap));
    max-height:calc(100vh - 56px - var(--mini-card-expanded-height) - var(--mini-stack-gap) - 108px);
  }
  body.viewer-mini-active .panel-head{
    display:none;
  }
  body.viewer-mini-active .panel-body{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    padding-top:10px;
    -webkit-overflow-scrolling:touch;
  }
  body.viewer-mini-with-preview .panel .preview-wrap{
    display:none;
  }
  body.viewer-mini-split .viewer::before,
  body.viewer-mini-with-preview .mini-photo-dock::before{
    position:absolute;
    top:6px;
    left:8px;
    z-index:2;
    padding:2px 7px;
    border-radius:999px;
    background:rgba(15,23,42,.76);
    color:#fff;
    font-size:10px;
    font-weight:800;
    letter-spacing:.02em;
    pointer-events:none;
  }
  body.viewer-mini-split .viewer::before{
    content:"3D";
  }
  body.viewer-mini-with-preview .mini-photo-dock::before{
    content:"Preview";
  }
  body.viewer-mini-split .viewer::after{
    bottom:8px;
    right:8px;
    font-size:10px;
  }
}


/* page scrolling helpers */
html.page-scroll, html.page-scroll body{
  height:auto;
  min-height:100%;
  overflow:auto;
}
.page-wrap{
  min-height:100vh;
  overflow:auto;
}

html.page-scroll, html.page-scroll body{
  height:auto !important;
  min-height:100% !important;
  overflow:auto !important;
}
.page-wrap{
  min-height:100vh;
  overflow:visible !important;
}
.page-wrap .app,
.page-wrap .container{
  position:relative !important;
  overflow:visible !important;
}
.upload-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.switch-row{display:flex;gap:10px;flex-wrap:wrap}
.switch-btn{border:1px solid #e5e7eb;background:#fff;padding:10px 14px;border-radius:12px;cursor:pointer;font-weight:700}
.switch-btn.active{background:#111827;color:#fff;border-color:#111827}
.req-item{border:1px solid #e5e7eb;border-radius:18px;background:#fff;margin-top:14px;overflow:hidden}
.req-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;cursor:pointer}
.req-body{display:none;padding:0 16px 16px}
.req-item.open .req-body{display:block}
.req-arrow{width:38px;height:38px;border:1px solid #e5e7eb;border-radius:12px;display:grid;place-items:center;background:#fff;font-size:18px}
.req-item.open .req-arrow{transform:rotate(90deg)}

.viewer-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 12px 0}
.quote-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
@media print{
  .no-print{display:none !important}
  body{background:#fff !important}
  .print-card{box-shadow:none !important;border-color:#ddd !important}
}

.phone-row-pro{ grid-template-columns: 120px minmax(0,1fr); }
.phone-code-input{ min-width:0; }
#cEmail{ font-size:18px; padding:6px 0; }
#cPhone{ font-size:18px; padding:6px 0; }
#cAddress{ padding:6px 0; }
@media (max-width: 520px){
  .phone-row-pro{ grid-template-columns: 96px minmax(0,1fr); }
  #cEmail, #cPhone{ font-size:16px; }
}