 .mcc-wrap { max-width: 1100px; margin: 0 auto; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.mcc-title { margin: .5rem 0; text-align:center !important;}
.mcc-sub { color: #555; margin: 0 0 1rem;text-align:center !important; padding-bottom:20px;font-weight:500;}
.mcc-panels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.mcc-panel { border: 1px solid #ddd; border-radius: 10px; padding: 14px; background: #fff; position: relative; }
.mcc-panel-header { display: flex; align-items: top; justify-content: space-between; margin-bottom: 8px; min-height:36px;}
.mcc-panel h3 { margin: 0; font-size: 16px; }
.mcc-copy-btn { font-size: 12px; padding: 5px 10px; cursor: pointer; }
.mcc-panel label { display: block; font-size: 13px; margin-bottom: 8px; }
.mcc-panel input[type="text"], .mcc-panel input[type="number"], .mcc-panel textarea { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 6px; }
.mcc-result { margin-top: 10px; font-weight: 600; }
.mcc-footer { border-top: 1px solid #eee; margin-top: 16px; padding-top: 16px; }
.mcc-contact-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; max-width: 600px; }
.mcc-btn { background: #111; color: #fff; border: none; border-radius: 999px; padding: 10px 16px; cursor: pointer; margin-top: 10px; }
.mcc-status { display: inline-block; margin-left: 10px; color: #2f7d32; font-weight: 600; }
@media (max-width: 900px) { .mcc-panels { grid-template-columns: 1fr; } .mcc-contact-grid { grid-template-columns: 1fr; } }

/* 2/1 Buydown styles */
.mcc-buydown { margin: 16px 0; padding: 12px; border: 1px solid #e5e7eb; border-radius: 8px; }
.mcc-buydown-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; align-items: end; }
#mcc-apply-buydown.button { margin-top: 10px; border-radius:35px;font-size:16px;text-transform:none;}
.mcc-buydown-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; margin-top: 10px; }

/* Stylized tooltip */
.mcc-tip { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; margin-left: 6px; border-radius: 50%; font-weight: 700; font-size: 12px; line-height: 1; cursor: help; background: #eef2ff; color: #374151; position: relative; border:1px solid #cccccc;}
.mcc-tip:focus { outline: 2px solid #6366f1; outline-offset: 2px; }
.mcc-tip-bubble { position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); background: #111827; color: #fff; padding: 8px 10px; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.18); font-size: 14px; line-height: 1.4; white-space: normal; opacity: 0; pointer-events: none; transition: opacity .15s ease, transform .15s ease; transform-origin: bottom center; min-width:350px;}
.mcc-tip-bubble::after { content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border-width: 6px; border-style: solid; border-color: #111827 transparent transparent transparent; }
.mcc-tip:hover .mcc-tip-bubble, .mcc-tip:focus .mcc-tip-bubble { opacity: 1; transform: translateX(-50%) translateY(-2px); }


