/* Landlord Service Charge Calculator landing page (this page only) */
.tpl-start{padding:18px}
.tpl-actions{display:flex;flex-wrap:wrap;gap:10px 12px}
.tpl-actions .button{min-height:48px;display:inline-flex;align-items:center;gap:8px}
.tpl-actions .button-primary{background:#284de8;border-color:#284de8;box-shadow:0 4px 0 #1830a5}
.tpl-actions .button-primary:hover{background:#203fce}
.tpl-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 16px;margin:16px 0 0;padding:14px 0 0;border-top:1px solid #dbe2f3}
.tpl-facts div{min-width:0}
.tpl-facts dt{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#475467;margin:0 0 3px}
.tpl-facts dd{margin:0;font-size:14px;line-height:1.4;color:#101828;font-weight:600}
.tpl-limit{margin:14px 0 0;font-size:14px;line-height:1.5;color:#344054}
.tpl-limit b{color:#101828}

.tpl-sheet{background:#fff;border:1px solid #dee3da;border-radius:8px;box-shadow:0 14px 28px #2030200d;overflow:hidden}
.tpl-sheet-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 16px;border-bottom:1px solid #eceee8;font-size:13px;color:#475467}
.tpl-sheet-head b{font-size:20px;color:#101828;font-variant-numeric:tabular-nums}
.tpl-costs{list-style:none;margin:0;padding:6px 16px;border-bottom:1px solid #eceee8}
.tpl-costs li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:13px;color:#344054}
.tpl-costs b{font-variant-numeric:tabular-nums;color:#101828;font-weight:600}
.tpl-table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.tpl-table th,.tpl-table td{padding:10px 8px;text-align:right;white-space:nowrap}
.tpl-table th:first-child{text-align:left;padding-left:16px}
.tpl-table td:last-child{padding-right:16px}
.tpl-table thead th{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#475467;background:#f7f8f4}
.tpl-table tbody tr+tr{border-top:1px solid #eceee8}
.tpl-table tbody th{font-weight:700;color:#101828}
.tpl-refund{color:#067647;font-weight:700}
.tpl-due{color:#b42318;font-weight:700}
.tpl-sheet-foot{margin:0;padding:12px 16px;background:#f7f8f4;font-size:13px;line-height:1.5;color:#344054}

.tpl-get{padding-block:8px 36px}
.tpl-get h2{margin:0 0 18px;font-size:28px;letter-spacing:-.02em}
.tpl-get-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.tpl-get article{padding:22px;border:1px solid #dfe3ea;border-radius:12px;background:#fff;min-width:0}
.tpl-get h3{margin:0 0 12px;font-size:18px}
.tpl-get ul{margin:0;padding-left:20px;display:grid;gap:8px;font-size:15px;line-height:1.5;color:#344054}
.tpl-note{margin:14px 0 0;font-size:14px;line-height:1.5;color:#475467}
.tpl-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin-top:16px}
.tpl-row a:not(.button){display:inline-flex;align-items:center;min-height:40px;color:#1d4ed8;font-weight:700;text-decoration:underline;text-underline-offset:2px}
.tpl-row a:focus-visible,.tpl-actions a:focus-visible{outline:3px solid rgba(29,78,216,.5);outline-offset:2px;border-radius:4px}

@media (max-width:760px){
  .tpl-start{padding:14px}
  .tpl-facts{grid-template-columns:1fr 1fr}
  .tpl-get-grid{grid-template-columns:1fr}
  .tpl-get h2{font-size:24px}
  .store-product h1{font-size:32px}
}
@media (max-width:420px){
  .tpl-actions .button{width:100%;justify-content:center}
  .tpl-facts{grid-template-columns:1fr}
  .tpl-table th,.tpl-table td{padding:9px 5px;font-size:12px}
  .tpl-table th:first-child{padding-left:10px}
  .tpl-table td:last-child{padding-right:10px}
  .tpl-get article{padding:18px}
}
@media (max-width:360px){
  .store-product h1{font-size:28px}
  .store-product-example.tpl-preview{padding:14px 10px}
  .tpl-table th,.tpl-table td{padding:8px 3px;font-size:11.5px}
  .tpl-table thead th{font-size:10px;letter-spacing:0}
  .tpl-table th:first-child{padding-left:8px}
  .tpl-table td:last-child{padding-right:8px}
  .tpl-sheet-head,.tpl-costs,.tpl-sheet-foot{padding-left:10px;padding-right:10px}
}
