
:root{
  --navy:#0A2540;
  --navy-2:#102f4f;
  --emerald:#10B981;
  --emerald-dark:#059669;
  --gold:#F59E0B;
  --bg-light:#F8FAFC;
  --text-dark:#1E293B;
  --muted:#64748B;
  --line:#E2E8F0;
  --white:#fff;
  --danger:#b42318;
  --soft-gold:#FFF7E6;
  --soft-emerald:#ECFDF5;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  margin:0;
  background:var(--bg-light);
  color:var(--text-dark);
  line-height:1.55;
}
a{color:inherit}
img{max-width:100%;display:block}
.topbar{
  background:var(--navy);
  color:white;
  border-bottom:4px solid var(--gold);
}
.nav{
  max-width:1180px;
  margin:0 auto;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.logo{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  font-weight:800;
  letter-spacing:.2px;
}
.logo-badge{
  width:44px;height:44px;border-radius:8px;
  display:grid;place-items:center;
  color:var(--navy);
  background:linear-gradient(135deg,var(--gold),#ffd36a);
  font-weight:900;
}
.logo-text small{display:block;color:#CBD5E1;font-weight:500;font-size:.78rem;margin-top:1px}
.navlinks{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.navlinks a{color:#E2E8F0;text-decoration:none;font-weight:700;font-size:.94rem}
.navlinks a:hover{color:white;text-decoration:underline;text-underline-offset:4px}
.container{max-width:1180px;margin:40px auto;padding:0 20px}
.hero-corporate{
  background:var(--navy);
  color:white;
  padding:48px 20px 34px;
  text-align:center;
}
.hero-corporate h1{
  margin:0;
  font-size:clamp(2.1rem,4vw,3.3rem);
  line-height:1.05;
  letter-spacing:.4px;
}
.hero-corporate p{
  margin:14px auto 0;
  max-width:820px;
  color:#E2E8F0;
  font-size:1.15rem;
}
.hero-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px}
.btn,button,.action{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--emerald);
  color:white;
  border:0;
  border-radius:6px;
  padding:13px 18px;
  font-size:1rem;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  transition:background .2s,transform .2s,box-shadow .2s;
  box-shadow:0 6px 14px rgba(16,185,129,.18);
}
.btn:hover,button:hover,.action:hover{background:var(--emerald-dark);transform:translateY(-1px)}
.btn.secondary,button.secondary,.secondary{
  background:white;color:var(--navy);border:1px solid var(--line);box-shadow:none;
}
.btn.secondary:hover,button.secondary:hover,.secondary:hover{background:#F1F5F9;color:var(--navy)}
.photo-strip{
  max-width:1180px;
  margin:-22px auto 34px;
  padding:0 20px;
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:16px;
}
.photo-tile{
  height:190px;
  border-radius:10px;
  overflow:hidden;
  position:relative;
  box-shadow:0 10px 25px rgba(15,23,42,.12);
  background:#ddd;
}
.photo-tile.large{height:250px}
.photo-tile img{width:100%;height:100%;object-fit:cover}
.photo-tile span{
  position:absolute;left:14px;bottom:14px;
  background:rgba(10,37,64,.86);color:white;
  padding:7px 10px;border-radius:6px;
  font-size:.82rem;font-weight:800;
}
.intro-panel{
  background:white;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 4px 12px rgba(15,23,42,.04);
  padding:28px;
  margin-bottom:34px;
}
.intro-panel h2{margin:0 0 8px;color:var(--navy);font-size:1.55rem}
.intro-panel p{margin:0;color:var(--muted);max-width:900px}
.category-title,
.section-title h2{
  color:var(--navy);
  border-bottom:2px solid var(--emerald);
  padding-bottom:10px;
  margin:40px 0 20px;
  font-size:1.35rem;
}
.section-title p{margin-top:-8px;color:var(--muted)}
.grid,.photo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:20px;
  margin-top:20px;
}
.card,.tool-card{
  background:white;
  border-radius:8px;
  padding:24px;
  box-shadow:0 4px 6px rgba(0,0,0,.05);
  text-decoration:none;
  color:var(--text-dark);
  border:1px solid var(--line);
  transition:transform .2s,box-shadow .2s,border-color .2s;
  display:flex;
  flex-direction:column;
  min-height:170px;
  position:relative;
}
.card:hover,.tool-card:hover{
  transform:translateY(-5px);
  box-shadow:0 10px 15px rgba(0,0,0,.1);
  border-color:var(--emerald);
}
.card h3,.tool-card h3{margin:0 0 10px;color:var(--navy);font-size:1.15rem}
.card p,.tool-card p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.45}
.tag,.premium-tag{
  background:var(--gold);
  color:var(--navy);
  font-size:.73rem;
  font-weight:900;
  padding:4px 8px;
  border-radius:999px;
  display:inline-block;
  width:max-content;
  margin-top:auto;
  align-self:flex-start;
}
.tool-icon{font-size:1.7rem;margin-bottom:10px}
.tool-thumb{display:none}
.ad-slot{
  margin:30px 0;
  min-height:96px;
  display:grid;place-items:center;
  border:1px dashed #CBD5E1;
  border-radius:8px;
  background:white;
  color:var(--muted);
  text-align:center;
}
.panel,.calculator-card,.seo-content{
  background:white;
  padding:30px;
  border-radius:10px;
  box-shadow:0 4px 15px rgba(0,0,0,.05);
  margin-bottom:28px;
  border:1px solid var(--line);
}
.tool-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.side-panel{position:sticky;top:18px}
.page-hero{
  margin:-30px -30px 28px;
  padding:24px 30px 26px;
  background:var(--navy);
  color:white;
  border-radius:10px 10px 0 0;
  border-bottom:4px solid var(--gold);
}
.page-hero.image-hero{background:var(--navy);position:relative;overflow:hidden;min-height:190px;display:flex;flex-direction:column;justify-content:flex-end}
.page-hero.image-hero:before{content:"";position:absolute;inset:0;background:rgba(10,37,64,.74);z-index:0}
.page-hero.image-hero>*{position:relative;z-index:1}
.image-market{background:url('img/photos/market.webp') center/cover no-repeat!important}
.image-transport{background:url('img/photos/transport.webp') center/cover no-repeat!important}
.image-momo{background:url('img/photos/momo.webp') center/cover no-repeat!important}
.image-school{background:url('img/photos/school.webp') center/cover no-repeat!important}
.image-construction{background:url('img/photos/construction.webp') center/cover no-repeat!important}
.image-fumigation{background:url('img/photos/fumigation.webp') center/cover no-repeat!important}
.page-hero h1{margin:6px 0 8px;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.1}
.page-hero p{margin:0;color:#E2E8F0;max-width:760px}
.breadcrumb{color:white;text-decoration:none;font-weight:800;font-size:.9rem;opacity:.94}
.breadcrumb:hover{text-decoration:underline;text-underline-offset:4px}
.lead{font-size:1.06rem;color:#475569;max-width:850px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:18px 0}
.field.full{grid-column:1/-1}
label{font-weight:800;display:block;margin-bottom:8px;color:var(--navy)}
input,select,textarea{
  width:100%;
  padding:12px;
  border:2px solid var(--line);
  border-radius:6px;
  font-size:16px;
  background:white;
  outline:none;
  transition:border-color .2s,box-shadow .2s;
  font:inherit;
}
textarea{min-height:130px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--emerald);box-shadow:0 0 0 3px rgba(16,185,129,.08)}
.result,.result-box{margin-top:25px;padding:20px;background:#F8FAFC;border-left:5px solid var(--gold);border-radius:0 6px 6px 0;min-height:20px}
.result:empty{display:none}
.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.metric{background:white;border:1px solid var(--line);border-radius:8px;padding:14px}
.metric span{display:block;color:var(--muted);font-size:.86rem;margin-bottom:4px}
.metric strong{color:var(--navy);font-size:1.15rem}
.note{background:#F8FAFC;border:1px solid var(--line);border-left:5px solid var(--emerald);border-radius:6px;padding:14px;color:#475569;margin:14px 0}
.note.danger{border-left-color:var(--danger);color:var(--danger);background:#fff7f7}
.hint,.muted{color:var(--muted);font-size:.92rem}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;background:white;margin:14px 0}
th,td{border:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}
th{background:#F1F5F9;color:var(--navy)}
.inline-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0}
button.small{padding:9px 12px;font-size:.88rem;width:auto}
.right{text-align:right}.hidden{display:none!important}
.leadbox{border:1px solid var(--line);border-radius:10px;padding:20px;background:var(--soft-emerald);margin-top:28px}
.leadbox h3{margin-top:0;color:var(--navy)}
.copy-message{min-height:120px;margin-top:10px}
.receipt-preview{background:white;padding:24px;border:1px solid var(--line);border-radius:8px}
.source-list{line-height:1.9}
.site-badge,.eyebrow{
  display:inline-block;background:var(--soft-gold);color:#9A5B00;border:1px solid #FDE68A;
  padding:5px 9px;border-radius:999px;font-size:.78rem;font-weight:900;letter-spacing:.02em;text-transform:uppercase;
}
.footer{margin-top:50px;background:var(--navy);color:#CBD5E1;padding:26px 20px;border-top:4px solid var(--gold)}
.footer-inner{max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.92rem}
.footer-grid{align-items:center}
.footer-brand strong{display:block;color:white;font-size:1.05rem;margin-bottom:4px}
.footer-brand span{display:block;color:#CBD5E1;max-width:480px;line-height:1.5}
.footer-credit{text-align:right;display:grid;gap:6px;color:#CBD5E1}
.footer a{color:white;text-decoration:none;font-weight:800}.footer a:hover{text-decoration:underline}
.footer .company-link{color:var(--gold);font-weight:900}
@media(max-width:780px){.footer-credit{text-align:left}}
@media(max-width:780px){
  .nav{align-items:flex-start;flex-direction:column}
  .navlinks{gap:12px}
  .photo-strip{grid-template-columns:1fr;margin-top:18px}
  .photo-tile,.photo-tile.large{height:190px}
  .tool-layout{grid-template-columns:1fr}
  .side-panel{position:static}
  .form-grid{grid-template-columns:1fr}
  .hero-corporate{text-align:left}
  .hero-actions{justify-content:flex-start}
  .container{margin:26px auto}
  .panel{padding:22px}
  .page-hero{margin:-22px -22px 22px;padding:22px}
}
@media print{
  .topbar,.footer,.btn,button,.ad-slot,.page-hero,.leadbox{display:none!important}
  body{background:white}.panel{box-shadow:none;border:0;padding:0}.container{max-width:100%;margin:0;padding:0}
}

/* Invoice / receipt generator upgrade */
.mini-heading{color:var(--navy);font-size:1.05rem;margin:24px 0 10px;border-bottom:1px solid var(--line);padding-bottom:8px}
.compact-form{gap:14px;margin:12px 0 18px}
.entry-table input{min-width:110px}
.entry-table .item-name{min-width:230px}
.entry-table .line-total{font-weight:800;color:var(--navy);white-space:nowrap;background:#F8FAFC}
.invoice-paper{margin-top:24px;border:1px solid #CBD5E1;border-radius:4px;padding:34px;background:white;color:#0F172A;box-shadow:0 10px 30px rgba(15,23,42,.08)}
.invoice-top{display:flex;justify-content:space-between;gap:24px;border-bottom:3px solid var(--navy);padding-bottom:20px;margin-bottom:22px}
.invoice-brand{font-size:1.45rem;font-weight:900;color:var(--navy);letter-spacing:.02em;text-transform:uppercase}
.invoice-sub{color:#9A5B00;font-weight:800;margin-top:2px}.invoice-top p{margin:10px 0 0;color:#475569}.invoice-doc{text-align:right;min-width:190px}.invoice-doc span{display:block;font-size:1.8rem;font-weight:900;text-transform:uppercase;color:var(--navy);line-height:1}.invoice-doc strong{display:block;margin:8px 0;color:#475569}.invoice-doc small{display:inline-block;background:var(--soft-gold);border:1px solid #FDE68A;color:#92400E;border-radius:999px;padding:5px 9px;font-weight:900}.invoice-meta{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px}.invoice-meta>div{background:#F8FAFC;border:1px solid var(--line);border-radius:8px;padding:14px}.invoice-meta b{display:block;color:var(--navy);margin-bottom:6px}.invoice-meta p{margin:0;color:#475569}.invoice-table th{background:var(--navy);color:white}.invoice-table th:first-child,.invoice-table td:first-child{width:44px;text-align:center}.invoice-table th:nth-child(3),.invoice-table td:nth-child(3){text-align:center;width:90px}.invoice-table th:nth-child(4),.invoice-table th:nth-child(5),.invoice-table td:nth-child(4),.invoice-table td:nth-child(5){text-align:right;white-space:nowrap}.invoice-bottom{display:grid;grid-template-columns:1fr 310px;gap:24px;align-items:start;margin-top:18px}.invoice-notes{border-top:1px solid var(--line);padding-top:12px;color:#475569}.invoice-notes b{color:var(--navy)}.totals-table{margin:0}.totals-table td:first-child{font-weight:800;color:#475569}.totals-table td:last-child{text-align:right;font-weight:800;white-space:nowrap}.totals-table .grand td{background:var(--navy);color:white;font-size:1.05rem}.totals-table .balance td{background:#F8FAFC;color:var(--navy)}.invoice-footer-note{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);font-size:.82rem;color:#64748B;text-align:center}
@media(max-width:780px){.invoice-top,.invoice-bottom,.invoice-meta{grid-template-columns:1fr;display:grid}.invoice-doc{text-align:left}.invoice-paper{padding:20px}.entry-table .item-name{min-width:170px}}
@media print{body[data-tool="invoice"] .topbar,body[data-tool="invoice"] .footer,body[data-tool="invoice"] .page-hero,body[data-tool="invoice"] .note,body[data-tool="invoice"] .mini-heading,body[data-tool="invoice"] .compact-form,body[data-tool="invoice"] .entry-table,body[data-tool="invoice"] .inline-actions,body[data-tool="invoice"] .side-panel{display:none!important}body[data-tool="invoice"] .tool-layout{display:block}body[data-tool="invoice"] .panel{box-shadow:none;border:0;padding:0;margin:0}body[data-tool="invoice"] .container{max-width:100%;margin:0;padding:0}body[data-tool="invoice"] #invoicePreview{display:block}.invoice-paper{box-shadow:none;border:0;border-radius:0;padding:0;margin:0}.invoice-footer-note{position:fixed;bottom:0;left:0;right:0}}

.contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 22px}
.contact-cards>div{background:#F8FAFC;border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.contact-cards strong{display:block;color:var(--navy);font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.contact-cards a,.contact-cards span{color:#475569;font-weight:800;text-decoration:none}
.contact-cards a:hover{color:var(--gold-dark)}
@media(max-width:760px){.contact-cards{grid-template-columns:1fr}}


/* Launch polish: clean invoice builder + business listing CTA */
.invoice-page{max-width:1320px}
.invoice-shell{display:grid;grid-template-columns:minmax(0,1fr) 500px;gap:24px;align-items:start}
.invoice-builder-panel,.invoice-preview-panel{overflow:hidden}
.invoice-hero-clean{min-height:168px;margin-bottom:22px}
.compact-note{font-size:.95rem}
.checkbox-field label{display:flex;align-items:center;gap:10px;cursor:pointer}.checkbox-field input{width:auto;min-width:auto}
.invoice-input-table th:nth-child(2),.invoice-input-table th:nth-child(3){width:110px}.invoice-input-table th:nth-child(4){width:140px}.invoice-input-table th:last-child{width:92px}
.entry-table input{min-width:0}.entry-table .item-name{min-width:180px}.entry-table .item-qty,.entry-table .item-price{min-width:90px}
.invoice-preview-panel{position:sticky;top:18px;padding:18px;background:#F8FAFC;border-color:#D9E2EC}
.preview-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.preview-toolbar p{margin:6px 0 0;color:var(--muted);font-size:.88rem}.preview-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.preview-actions button{padding:10px 12px;font-size:.9rem}
#invoicePreview{background:white;border:1px solid #D6DEE8;border-radius:8px;padding:10px;box-shadow:0 12px 30px rgba(15,23,42,.08)}
.invoice-paper{margin:0;border:0;border-radius:6px;padding:26px;background:#fff;color:#0F172A;box-shadow:none;font-size:.88rem;line-height:1.42;min-height:650px}
.invoice-top{display:flex;justify-content:space-between;gap:24px;border-bottom:3px solid var(--navy);padding-bottom:16px;margin-bottom:16px}.invoice-brand{font-size:1.05rem;font-weight:900;color:var(--navy);letter-spacing:.02em;text-transform:uppercase;line-height:1.2}.invoice-sub{color:#9A5B00;font-weight:800;margin-top:3px;font-size:.8rem}.invoice-top p{margin:8px 0 0;color:#475569;font-size:.8rem}.invoice-doc{text-align:right;min-width:150px}.invoice-doc span{display:block;font-size:1.35rem;font-weight:900;text-transform:uppercase;color:var(--navy);line-height:1}.invoice-doc strong{display:block;margin:7px 0;color:#475569;font-size:.82rem}.invoice-doc small{display:inline-block;background:var(--soft-gold);border:1px solid #FDE68A;color:#92400E;border-radius:999px;padding:4px 8px;font-weight:900;font-size:.72rem}.invoice-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}.invoice-meta>div{background:#F8FAFC;border:1px solid var(--line);border-radius:7px;padding:10px}.invoice-meta b{display:block;color:var(--navy);margin-bottom:5px}.invoice-meta p{margin:0;color:#475569}.invoice-table{font-size:.82rem}.invoice-table th{background:var(--navy);color:white}.invoice-table th:first-child,.invoice-table td:first-child{width:38px;text-align:center}.invoice-table th:nth-child(3),.invoice-table td:nth-child(3){text-align:center;width:70px}.invoice-table th:nth-child(4),.invoice-table th:nth-child(5),.invoice-table td:nth-child(4),.invoice-table td:nth-child(5){text-align:right;white-space:nowrap}.invoice-bottom{display:grid;grid-template-columns:1fr 210px;gap:18px;align-items:start;margin-top:14px}.invoice-notes{border-top:1px solid var(--line);padding-top:10px;color:#475569}.invoice-notes b{color:var(--navy)}.totals-table{margin:0;font-size:.82rem}.totals-table td:first-child{font-weight:800;color:#475569}.totals-table td:last-child{text-align:right;font-weight:800;white-space:nowrap}.totals-table .grand td{background:var(--navy);color:white;font-size:.95rem}.totals-table .balance td{background:#F8FAFC;color:var(--navy)}.invoice-footer-note{margin-top:22px;padding-top:12px;border-top:1px solid var(--line);font-size:.72rem;color:#64748B;text-align:center}
.listing-cta{margin:42px 0 4px;background:linear-gradient(135deg,#0A2540,#123C65);color:white;border-radius:12px;padding:30px;border-bottom:4px solid var(--gold);display:flex;align-items:center;justify-content:space-between;gap:22px;box-shadow:0 12px 28px rgba(15,23,42,.12)}
.listing-cta h2{margin:8px 0 8px;font-size:1.55rem}.listing-cta p{margin:0;color:#E2E8F0;max-width:760px}.listing-cta .site-badge{background:#fff;color:#9A5B00}.listing-cta .btn{background:var(--gold);color:var(--navy);box-shadow:none;white-space:nowrap}.listing-cta .btn:hover{background:#FCD34D;color:var(--navy)}
.contact-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:18px 0}.contact-cards>div{border:1px solid var(--line);border-radius:8px;background:#F8FAFC;padding:14px}.contact-cards strong{display:block;color:var(--navy);margin-bottom:4px}.contact-cards a{font-weight:800;color:var(--emerald-dark);text-decoration:none}.contact-cards a:hover{text-decoration:underline}
@media(max-width:1050px){.invoice-shell{grid-template-columns:1fr}.invoice-preview-panel{position:static}.invoice-paper{min-height:auto}}
@media(max-width:780px){.invoice-top,.invoice-bottom,.invoice-meta,.listing-cta{grid-template-columns:1fr;display:grid}.invoice-doc{text-align:left}.invoice-paper{padding:18px}.listing-cta{padding:24px}.preview-toolbar{display:block}.preview-actions{justify-content:flex-start;margin-top:10px}.entry-table .item-name{min-width:150px}}
@media print{
  @page{size:A4;margin:12mm}
  body[data-tool="invoice"]{background:white!important;color:#000!important}
  body[data-tool="invoice"] *{visibility:hidden!important}
  body[data-tool="invoice"] #invoicePreview,body[data-tool="invoice"] #invoicePreview *{visibility:visible!important}
  body[data-tool="invoice"] #invoicePreview{position:absolute!important;left:0!important;top:0!important;width:100%!important;border:0!important;box-shadow:none!important;padding:0!important;background:white!important}
  body[data-tool="invoice"] .invoice-paper{border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin:0!important;min-height:auto!important;font-size:10.8pt!important}
  body[data-tool="invoice"] .invoice-footer-note{position:static!important}
}
