:root{
  --navy:#061827;--navy2:#082a45;--blue:#0b4b80;--gold:#d7a43b;--gold2:#f2cf72;--green:#22c878;--green2:#aaffd5;--white:#f8fbff;--ink:#0d1b2a;--muted:#5e6b7a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  background:radial-gradient(circle at 12% 4%,rgba(34,200,120,.18),transparent 30%),radial-gradient(circle at 88% 8%,rgba(242,207,114,.12),transparent 26%),linear-gradient(135deg,#03101d,#06243d 50%,#073728);color:#fff;
}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.055) 36%,transparent 55%);z-index:0}
a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}img{display:block;max-width:100%}
.glass{background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.18);box-shadow:0 22px 55px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.18);backdrop-filter:blur(18px) saturate(140%)}
.topbar{position:fixed;z-index:50;top:12px;left:3vw;right:3vw;height:74px;border-radius:22px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 16px}
.brand img{height:54px;max-width:340px;object-fit:contain}nav{display:flex;align-items:center;gap:24px;font-weight:900}nav a:hover{color:var(--gold2)}
.gold-btn,.dark-btn{border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;padding:12px 22px;font-weight:950}
.gold-btn{color:#171306;background:linear-gradient(180deg,#fee08a,#c99526);box-shadow:0 10px 26px rgba(217,164,59,.28),inset 0 1px rgba(255,255,255,.48)}
.dark-btn{color:#fff;background:rgba(2,12,22,.58);border:1px solid rgba(255,255,255,.26)}.gold-btn.small{height:44px;padding:8px 18px}.gold-btn.big,.dark-btn.big{font-size:16px;padding:14px 24px}
.hero{position:relative;min-height:620px;display:grid;grid-template-columns:1fr 420px;gap:30px;align-items:end;padding:150px 3vw 54px;overflow:hidden}.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.08) contrast(1.08) brightness(.82);z-index:1}.hero-shade{position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,rgba(2,10,18,.96),rgba(4,17,31,.76) 42%,rgba(4,17,31,.30))}.hero-content,.hero-cards{position:relative;z-index:3}.eyebrow{color:var(--gold2);letter-spacing:.2em;font-size:12px;font-weight:950}.hero h1{font-family:Georgia,"Times New Roman",serif;margin:0;font-size:clamp(48px,7vw,96px);line-height:.95;letter-spacing:-.04em}.lead{max-width:700px;color:rgba(255,255,255,.82);font-size:18px;line-height:1.7}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}.hero-cards{display:grid;gap:14px}.mini-card{border-radius:22px;padding:20px;display:grid;grid-template-columns:54px 1fr;gap:4px 14px;align-items:center}.mini-card i{grid-row:span 2;font-size:30px;color:var(--gold2)}.mini-card strong{font-size:20px}.mini-card span{color:rgba(255,255,255,.78)}
.workspace{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;padding:50px 3vw}.quote-panel,.quote-summary{border-radius:28px;padding:24px}.section-heading{margin-bottom:20px}.section-heading.center{text-align:center}.section-heading h2{font-family:Georgia,"Times New Roman",serif;color:var(--gold2);font-size:clamp(30px,4vw,46px);margin:0 0 8px}.section-heading p{margin:0;color:rgba(255,255,255,.76);line-height:1.6}.section-heading.mini{margin-top:28px}
.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}label{display:flex;flex-direction:column;gap:8px;color:var(--green2);font-weight:850;font-size:13px}input,select,textarea{width:100%;border:1px solid rgba(255,255,255,.20);background:rgba(255,255,255,.08);color:#fff;border-radius:14px;padding:12px 13px;outline:none}select option{color:#0d1b2a;background:#fff}textarea{resize:vertical}input:focus,select:focus,textarea:focus{border-color:rgba(242,207,114,.9);box-shadow:0 0 0 4px rgba(242,207,114,.10)}.wide{grid-column:span 2}
.location-block{grid-column:1/-1;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.045));border:1px solid rgba(255,255,255,.18);border-radius:24px;padding:18px}.location-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.location-head h3{margin:0 0 6px;color:var(--gold2);font-family:Georgia,serif;font-size:24px}.location-head p{margin:0;color:rgba(255,255,255,.74);line-height:1.5}.location-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.location-status{margin-top:14px;color:var(--green2);font-weight:850;background:rgba(34,200,120,.10);border:1px solid rgba(170,255,213,.22);padding:12px 14px;border-radius:14px}
.map-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:16px;margin-top:16px}.map-grid h4{margin:0 0 8px;color:var(--gold2);font-family:Georgia,serif}.leaflet-map,.invoice-leaflet-map{width:100%;height:360px;border-radius:18px;overflow:hidden;background:#eef4f8}.map-preview,.route-preview{border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.16)}.route-options-panel{margin-bottom:10px;border-radius:18px;padding:10px;display:flex;gap:10px;flex-wrap:wrap}.route-option-btn{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:16px;padding:10px 14px;cursor:pointer;font-weight:900;display:flex;align-items:center;gap:8px}.route-option-btn.active,.route-option-btn:hover{color:#061827;background:linear-gradient(135deg,var(--green2),var(--gold2))}.route-option-btn small{display:block;font-weight:700;opacity:.75}
.items-table-wrap{overflow:auto;border-radius:18px;border:1px solid rgba(255,255,255,.16)}.items-table,.invoice-table{width:100%;border-collapse:collapse}.items-table th,.items-table td{padding:10px;border-bottom:1px solid rgba(255,255,255,.12);text-align:left;vertical-align:top}.items-table th{color:var(--gold2);font-size:13px}.items-table input{min-width:90px}.items-table textarea{min-width:220px;min-height:48px}.remove-row{border:0;background:rgba(255,70,70,.18);color:#fff;width:38px;height:38px;border-radius:12px;cursor:pointer}.item-actions{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;margin:16px 0 8px}.notes-grid{margin-top:18px}.generate-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.quote-summary{align-self:start;position:sticky;top:104px}.quote-summary h2{margin:0 0 16px;font-family:Georgia,serif;color:var(--gold2)}.summary-line{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.15)}.summary-line.total{font-size:24px;color:var(--gold2)}.quote-summary p{color:rgba(255,255,255,.72);line-height:1.55}.preview-images{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.preview-images img{height:94px;width:100%;object-fit:cover;border-radius:14px}
.invoice-section,.send-section{position:relative;z-index:2;padding:50px 3vw}.invoice-paper{background:#fff;color:var(--ink);max-width:1120px;margin:0 auto;border-radius:18px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.35)}.invoice-head{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:start;border-bottom:3px solid var(--gold);padding-bottom:20px}.invoice-head img{height:88px;max-width:390px;object-fit:contain}.invoice-head p{margin:8px 0 2px;font-weight:850}.invoice-head small{color:var(--muted)}.invoice-meta{text-align:right}.invoice-meta h2{margin:0 0 10px;font-family:Georgia,serif;color:var(--navy2)}.invoice-parties{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:20px 0}.invoice-parties div{background:#f3f7fb;border:1px solid #dde7ef;border-radius:14px;padding:14px}.invoice-parties h3,.invoice-lower h3{margin:0 0 8px;color:var(--blue)}.invoice-parties p{margin:4px 0;color:#334}.invoice-parties a{color:#0b4b80;font-weight:900}.invoice-table th,.invoice-table td{padding:12px;border-bottom:1px solid #dfe8ef;text-align:left}.invoice-table th{background:#061827;color:#fff}
.invoice-route{margin:22px 0;border:1px solid #dfe8ef;border-radius:16px;overflow:hidden}.route-title{background:#061827;color:#fff;padding:14px 16px}.route-title h3{margin:0 0 4px;color:#f2cf72}.route-title p{margin:0;color:#d8e4ef}.route-details{padding:14px 16px;background:#f3f7fb}.route-details p{margin:6px 0;color:#233}.route-details a{color:#0b4b80;font-weight:900}.invoice-map-snapshot{min-height:360px;background:#eef4f8;border-top:1px solid #dfe8ef}.invoice-leaflet-map{height:380px;border-radius:0}
.invoice-lower{display:grid;grid-template-columns:1fr 330px;gap:24px;margin-top:20px}.invoice-lower p{line-height:1.55}.invoice-totals{background:#f3f7fb;border-radius:16px;padding:16px}.invoice-totals p{display:flex;justify-content:space-between;margin:0;padding:10px 0;border-bottom:1px solid #dfe8ef}.invoice-totals .grand{color:var(--navy2);font-size:22px;font-weight:950}.invoice-footer{margin-top:22px;padding-top:16px;border-top:2px solid #dfe8ef;color:#445}
.send-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.send-card{border-radius:26px;padding:24px}.send-card>i{font-size:36px;color:var(--gold2)}.send-card h3{font-family:Georgia,serif;color:#fff;font-size:26px}.send-card p{color:rgba(255,255,255,.72)}
@media(max-width:1100px){.hero,.workspace{grid-template-columns:1fr}.hero-cards{grid-template-columns:repeat(3,1fr)}.quote-summary{position:relative;top:auto}.form-grid{grid-template-columns:repeat(2,1fr)}.map-grid{grid-template-columns:1fr}.send-grid{grid-template-columns:1fr}}
@media(max-width:760px){.topbar{position:relative;left:auto;right:auto;top:auto;margin:10px;flex-wrap:wrap;height:auto}.brand img{max-width:240px}nav{order:3;width:100%;justify-content:center}.hero{padding-top:50px}.hero-cards{grid-template-columns:1fr}.form-grid,.invoice-head,.invoice-parties,.invoice-lower{grid-template-columns:1fr}.wide{grid-column:span 1}.item-actions{grid-template-columns:1fr}.invoice-paper{padding:20px;border-radius:12px}.invoice-meta{text-align:left}.location-grid{grid-template-columns:1fr}}
@media print{body{background:#fff;color:#000}body:before,.no-print,.send-section,.hero,.workspace,.topbar{display:none!important}.invoice-section{padding:0}.invoice-paper{box-shadow:none;max-width:100%;border-radius:0;padding:12px}.invoice-head img{height:70px}.invoice-route{break-inside:avoid;page-break-inside:avoid}.invoice-leaflet-map{height:330px}.leaflet-control-container{display:none!important}a[href]:after{content:""}}


/* Standalone invoice price summary table */
.invoice-price-summary{
  margin:22px 0;
  border:1px solid #dfe8ef;
  border-radius:16px;
  overflow:hidden;
  break-inside:avoid;
  page-break-inside:avoid;
}
.price-summary-title{
  background:#061827;
  color:#fff;
  padding:14px 16px;
}
.price-summary-title h3{
  margin:0 0 4px;
  color:#f2cf72;
  font-family:Georgia,serif;
}
.price-summary-title p{
  margin:0;
  color:#d8e4ef;
}
.price-summary-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
}
.price-summary-table th,
.price-summary-table td{
  padding:14px 16px;
  border-bottom:1px solid #dfe8ef;
  text-align:left;
  font-size:15px;
}
.price-summary-table th{
  color:#0b4b80;
  width:55%;
  background:#f3f7fb;
}
.price-summary-table td{
  text-align:right;
  font-weight:950;
  color:#0d1b2a;
}
.price-summary-table .price-grand th,
.price-summary-table .price-grand td{
  background:#fff6df;
  color:#061827;
  font-size:20px;
  border-bottom:0;
}
@media print{
  .invoice-price-summary{
    margin:16px 0;
  }
  .price-summary-table th,
  .price-summary-table td{
    padding:10px 12px;
  }
}


/* Android/mobile readiness patch for quote system */
html,body{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
img,iframe,video{max-width:100%}
button,a,input,select,textarea{-webkit-tap-highlight-color:rgba(242,207,114,.25)}
input,select,textarea{font-size:16px!important}
.items-table-wrap{-webkit-overflow-scrolling:touch}
@media(max-width:1024px){
  .topbar{position:relative!important;left:auto!important;right:auto!important;top:auto!important;margin:10px!important;width:auto!important;height:auto!important;min-height:68px!important;flex-wrap:wrap!important;border-radius:18px!important;padding:10px 12px!important}
  .brand img{height:48px!important;max-width:240px!important}
  .topbar nav{order:3!important;width:100%!important;justify-content:center!important;flex-wrap:wrap!important;gap:8px!important;padding-top:8px!important}
  .topbar nav a,.topbar button{min-height:44px!important}
  .hero{min-height:auto!important;grid-template-columns:1fr!important;padding:44px 16px 28px!important}
  .hero h1{font-size:clamp(38px,12vw,72px)!important;line-height:.95!important}
  .lead{font-size:16px!important;line-height:1.6!important}
  .hero-cards{grid-template-columns:1fr!important;margin-top:18px!important}
  .workspace{grid-template-columns:1fr!important;padding:28px 14px!important}
  .quote-panel,.quote-summary{padding:16px!important;border-radius:20px!important}
  .quote-summary{position:relative!important;top:auto!important}
  .form-grid,.location-grid,.map-grid,.notes-grid,.invoice-head,.invoice-parties,.invoice-lower,.send-grid{grid-template-columns:1fr!important}
  .location-block,.wide{grid-column:1/-1!important}
  .location-head{flex-direction:column!important;align-items:flex-start!important}
  .location-head .gold-btn{width:100%!important}
  .item-actions{grid-template-columns:1fr!important}
  .item-actions .gold-btn,.item-actions .dark-btn,.generate-row .gold-btn,.generate-row .dark-btn{width:100%!important;min-height:48px!important}
  .items-table{min-width:860px!important}
  .items-table-wrap:before{content:'Swipe table left/right';display:block;color:var(--gold2);font-size:12px;font-weight:900;padding:8px 10px;background:rgba(255,255,255,.06)}
  .leaflet-map,.invoice-leaflet-map{height:310px!important}
  .route-options-panel{overflow-x:auto!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch!important}
  .route-option-btn{flex:0 0 auto!important}
  .invoice-section,.send-section{padding:28px 10px!important}
  .invoice-paper{padding:16px!important;border-radius:14px!important;max-width:100%!important}
  .invoice-meta{text-align:left!important}
  .invoice-table{min-width:760px!important}
  .invoice-paper{overflow-x:auto!important}
  .price-summary-table th,.price-summary-table td{padding:12px 10px!important}
  .invoice-map-snapshot,.invoice-leaflet-map{min-height:300px!important}
  .preview-images{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:520px){
  .brand img{max-width:190px!important}
  .topbar nav a{flex:1 1 90px!important;text-align:center!important;background:rgba(255,255,255,.06)!important;border-radius:14px!important;padding:10px!important}
  .hero h1{font-size:clamp(34px,14vw,54px)!important}
  .section-heading h2{font-size:30px!important;line-height:1.05!important}
  .mini-card{grid-template-columns:44px 1fr!important;padding:14px!important}
  .mini-card i{font-size:24px!important}
  .preview-images img{height:76px!important}
}
@media print{
  html,body{overflow:visible!important}
  .invoice-paper{overflow:visible!important}
  .invoice-table,.items-table{min-width:0!important;width:100%!important}
}


/* FINAL Android cut-off fix: force quote page to fit every phone width */
html, body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}
body{
  min-width:0!important;
}
main, section, header, footer, .workspace, .quote-panel, .quote-summary,
.invoice-section, .send-section, .invoice-paper, .location-block{
  max-width:100%!important;
}
*{
  min-width:0;
}
input, select, textarea, button{
  max-width:100%!important;
}
@media(max-width:768px){
  .topbar{
    width:calc(100% - 20px)!important;
    max-width:calc(100% - 20px)!important;
    overflow:hidden!important;
  }
  .topbar nav{
    display:flex!important;
    overflow-x:auto!important;
    justify-content:flex-start!important;
    -webkit-overflow-scrolling:touch!important;
    white-space:nowrap!important;
  }
  .hero, .workspace, .invoice-section, .send-section{
    width:100%!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  .hero-content, .hero-cards{
    width:100%!important;
  }
  .hero-actions{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .hero-actions a, .hero-actions button{
    width:100%!important;
  }
  .form-grid, .location-grid, .map-grid, .notes-grid, .send-grid,
  .invoice-head, .invoice-parties, .invoice-lower{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
  }
  .location-block, .wide{
    grid-column:1 / -1!important;
    width:100%!important;
  }
  .items-table-wrap{
    width:100%!important;
    overflow-x:auto!important;
    border-radius:16px!important;
  }
  .items-table{
    min-width:680px!important;
    width:680px!important;
  }
  .items-table input{
    min-width:90px!important;
  }
  .items-table textarea{
    min-width:170px!important;
  }
  .invoice-paper{
    width:100%!important;
    overflow:visible!important;
    padding:12px!important;
  }
  .invoice-table{
    width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
    font-size:12px!important;
  }
  .invoice-table th,
  .invoice-table td{
    padding:7px 5px!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .invoice-table th:nth-child(1),
  .invoice-table td:nth-child(1){width:22%!important}
  .invoice-table th:nth-child(2),
  .invoice-table td:nth-child(2){width:34%!important}
  .invoice-table th:nth-child(3),
  .invoice-table td:nth-child(3){width:12%!important}
  .invoice-table th:nth-child(4),
  .invoice-table td:nth-child(4){width:14%!important}
  .invoice-table th:nth-child(5),
  .invoice-table td:nth-child(5){width:18%!important}
  .invoice-parties div,
  .invoice-route,
  .invoice-price-summary,
  .invoice-totals{
    width:100%!important;
    max-width:100%!important;
  }
  .price-summary-table{
    width:100%!important;
    table-layout:fixed!important;
  }
  .price-summary-table th,
  .price-summary-table td{
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .leaflet-map,
  .invoice-leaflet-map,
  .map-preview,
  .route-preview,
  .invoice-map-snapshot{
    width:100%!important;
    max-width:100%!important;
    height:280px!important;
    min-height:280px!important;
  }
  .route-options-panel{
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
  }
  .route-option-btn{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
}
@media(max-width:390px){
  .invoice-paper{
    padding:8px!important;
  }
  .invoice-table{
    font-size:10.5px!important;
  }
  .invoice-table th,
  .invoice-table td{
    padding:5px 3px!important;
  }
  .invoice-meta h2{
    font-size:22px!important;
  }
  .invoice-head img{
    max-width:210px!important;
    height:auto!important;
  }
}
@media print{
  .invoice-table{
    table-layout:fixed!important;
  }
  .invoice-table th,
  .invoice-table td{
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
}