/* Base, ported from the original prototype's inline <style> block */
body { margin: 0; background: #FFFFFF; color: #0F172A; font-family: "Open Sans", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
* { box-sizing: border-box; }
a { color: #1552B8; text-decoration: none; }
a:hover { color: #103F8C; text-decoration: underline; }
table { border-collapse: collapse; }
summary::-webkit-details-marker { display: none; }
img { max-width: 100%; }
button { font-family: 'Open Sans', sans-serif; }

/* Header dropdown nav */
.navitem { position: relative; }
.navitem > .menu { display: none; position: absolute; top: 100%; left: 0; min-width: 260px; background: #FFFFFF; border: 1px solid #E2E8F0; border-radius: 10px; box-shadow: 0 12px 28px rgba(15,23,42,0.10); padding: 8px; z-index: 60; max-height: calc(100vh - 92px); overflow-y: auto; }
.navitem:hover > .menu, .navitem:focus-within > .menu, .navitem.mtp-open > .menu { display: block; }
.mtp-navtop { font-family: 'Open Sans', sans-serif; font-size: 14.5px; font-weight: 500; color: #334155; background: transparent; border: none; border-radius: 6px; padding: 9px 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.mtp-navtop:hover { background: #F1F5F9; color: #0F172A; text-decoration: none; }
.mtp-navitem { font-family: 'Open Sans', sans-serif; display: block; width: 100%; text-align: left; font-size: 14.5px; font-weight: 500; color: #334155; background: none; border: none; border-radius: 6px; padding: 10px 12px; }
.mtp-navitem:hover { background: #F1F5F9; color: #0F172A; text-decoration: none; }
.mtp-navsub { display: block; font-size: 12.5px; font-weight: 400; color: #64748B; margin-top: 2px; }
.mtp-navlabel { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #64748B; padding: 12px 12px 6px; }
.mtp-cta-btn { font-family: 'Open Sans', sans-serif; font-size: 14.5px; font-weight: 600; color: #FFFFFF !important; background: #1552B8; border-radius: 6px; padding: 10px 18px; margin-left: 8px; display: inline-block; }
.mtp-cta-btn:hover { background: #103F8C; text-decoration: none !important; }

/* Landing page hero */
.mtp-hero-eyebrow-pill { display: inline-block; font-size: 12.5px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: #1552B8; background: #EFF4FE; border: 1px solid #DCE7FB; border-radius: 999px; padding: 7px 16px; margin-bottom: 22px; }
.mtp-hero-btn-primary { font-family: 'Open Sans', sans-serif; display: inline-block; font-size: 15px; font-weight: 600; color: #FFFFFF !important; background: #1552B8; border-radius: 8px; padding: 14px 26px; }
.mtp-hero-btn-primary:hover { background: #103F8C; text-decoration: none !important; }
.mtp-hero-btn-secondary { font-family: 'Open Sans', sans-serif; display: inline-block; font-size: 15px; font-weight: 600; color: #0F172A !important; background: #FFFFFF; border: 1px solid #CBD5E1; border-radius: 8px; padding: 13px 25px; }
.mtp-hero-btn-secondary:hover { background: #F8FAFC; text-decoration: none !important; }
.mtp-quicknav a { font-family: 'Open Sans', sans-serif; font-size: 13.5px; font-weight: 600; color: #334155 !important; background: #FFFFFF; border: 1px solid #E2E8F0; border-radius: 999px; padding: 9px 16px; }
.mtp-quicknav a:hover { border-color: #1552B8; color: #1552B8 !important; text-decoration: none !important; }
.mtp-hero-stat { background: #FFFFFF; padding: 22px; text-align: center; }
.mtp-hero-stat-value { font-size: 26px; font-weight: 700; color: #1552B8; }
.mtp-hero-stat-label { font-size: 13px; color: #64748B; margin-top: 4px; }

/* Footer columns */
.mtp-fcol-h { font-size: 12px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: #0F172A; margin-bottom: 16px; }
.mtp-fcol { display: grid; gap: 11px; align-items: start; justify-items: start; }
.mtp-fcol a { font-size: 14.5px; color: #475569; }
.mtp-fcol a:hover { color: #1552B8; text-decoration: underline; }

/* Quiz / calculator / planner option pills */
.qopt { font-family: 'Open Sans', sans-serif; font-size: 14.5px; font-weight: 500; color: #334155; background: #FFFFFF; border: 1px solid #CBD5E1; border-radius: 6px; padding: 11px 18px; display: inline-block; cursor: pointer; transition: all .12s; }
label:hover .qopt { border-color: #1552B8; }
input[type="radio"] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
input[type="radio"]:checked + .qopt { background: #1552B8 !important; color: #FFFFFF !important; border-color: #1552B8 !important; }
input[type="radio"]:focus-visible + .qopt { outline: 2px solid #1552B8; outline-offset: 2px; }

/* Visually hidden but accessible to screen readers */
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }

/* Native WP comment form, restyled to match the rest of the site */
.comment-respond { background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 12px; padding: 28px 26px; }
.comment-reply-title { font-size: 20px; font-weight: 600; margin: 0 0 18px; }
.comment-form p { margin: 0 0 18px; }
.comment-form label { display: block; font-size: 14px; font-weight: 600; color: #334155; margin-bottom: 6px; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form input[type="number"],
.comment-form textarea {
  width: 100%; max-width: 420px; font-family: 'Open Sans', sans-serif; font-size: 15px; color: #0F172A;
  background: #FFFFFF; border: 1px solid #CBD5E1; border-radius: 8px; padding: 11px 14px;
}
.comment-form textarea { max-width: 100%; min-height: 130px; resize: vertical; }
.comment-form input:focus, .comment-form textarea:focus, .comment-form select:focus { outline: 2px solid #1552B8; outline-offset: 1px; border-color: #1552B8; }
.comment-form select { font-family: 'Open Sans', sans-serif; font-size: 15px; color: #0F172A; background: #FFFFFF; border: 1px solid #CBD5E1; border-radius: 8px; padding: 11px 14px; max-width: 320px; }
.comment-notes, .logged-in-as { font-size: 13.5px; color: #64748B; margin-bottom: 18px; }
.comment-form-cookies-consent { display: flex; align-items: center; gap: 8px; }
.comment-form-cookies-consent label { margin: 0; font-weight: 400; font-size: 13.5px; color: #64748B; }
.comment-form .form-submit { margin: 4px 0 0; }
.comment-form #submit {
  font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 600; color: #FFFFFF; background: #1552B8;
  border: none; border-radius: 8px; padding: 13px 26px; cursor: pointer;
}
.comment-form #submit:hover { background: #103F8C; }
.mtp-honeypot { position: absolute; left: -9999px; top: -9999px; }

/* Brand page tabs */
.mtp-brandtab { font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 600; color: #64748B; background: none; border: none; border-bottom: 2px solid transparent; padding: 12px 4px; margin-bottom: -1px; cursor: pointer; }
.mtp-brandtab.active { color: #1552B8; border-bottom-color: #1552B8; }

/* Read-only star display */
.mtp-stars { letter-spacing: 2px; }

/* Star-rating input on the brand review form (radios stay hidden per the
   global input[type="radio"] rule above; only the adjacent labels are seen) */
.mtp-star-input { display: inline-flex; flex-direction: row-reverse; font-size: 26px; }
.mtp-star-input label { color: #CBD5E1; cursor: pointer; padding: 0 2px; }
.mtp-star-input input:checked ~ label,
.mtp-star-input label:hover,
.mtp-star-input label:hover ~ label { color: #F59E0B; }

/* Generic hover-tinted card/link used across content pages */
.mtp-hover-card:hover { border-color: #1552B8 !important; background: #F8FAFC !important; text-decoration: none !important; }
.mtp-link-btn { cursor: pointer; }

/* Deals table copy button */
.mtp-code-btn { font-family: ui-monospace, monospace; font-size: 14px; font-weight: 600; border-radius: 6px; padding: 9px 14px; text-align: left; cursor: pointer; border: 1px dashed #CBD5E1; background: #F8FAFC; color: #0F172A; }
.mtp-code-btn.copied { color: #15803D; background: #F0FDF4; border-color: #86EFAC; }
.mtp-code-btn[disabled] { color: #94A3B8; background: transparent; border-color: transparent; cursor: default; }

/* Deals filter pills */
.mtp-filter-btn { font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight: 600; border-radius: 999px; padding: 9px 16px; cursor: pointer; background: #FFFFFF; color: #475569; border: 1px solid #CBD5E1; }
.mtp-filter-btn.active { background: #1552B8; color: #FFFFFF; border-color: #1552B8; }

/* Review tabs */
.mtp-tab { font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight: 600; border-radius: 999px; padding: 10px 18px; cursor: pointer; text-decoration: none; display: inline-block; background: #FFFFFF; color: #475569; border: 1px solid #CBD5E1; }
.mtp-tab.active { background: #1552B8; color: #FFFFFF; border-color: #1552B8; }
/* Both rules restated with a class+element combo so they outrank
   .entry-content a:not(.wp-block-button__link) below, which otherwise
   overrides .mtp-tab's own text color wherever this block sits inside
   entry-content (it did — active tabs rendered as blue-on-blue, invisible). */
.entry-content a.mtp-tab { color: #475569; }
.entry-content a.mtp-tab.active { color: #FFFFFF; }

@media (max-width: 640px) {
  h1 { font-size: 34px !important; }

  /* Deals list: stack instead of relying on flex-wrap, which doesn't break
     this particular mix of a shrinkable column plus fixed-width siblings
     reliably at narrow widths. */
  .mtp-deal-row { flex-direction: column !important; align-items: stretch !important; }
  .mtp-deal-row > .mtp-deal-content,
  .mtp-deal-row > .mtp-deal-price,
  .mtp-deal-row > .mtp-deal-code,
  .mtp-deal-row > .mtp-deal-expiry,
  .mtp-deal-row > .mtp-deal-cta {
    flex: none !important;
    width: 100% !important;
  }
  .mtp-deal-row > .mtp-deal-price { font-size: 28px !important; }
}

/* Entry content typography (used by page.php / front-page.php via the_content()) */
.entry-content { max-width: 1180px; margin: 0 auto; padding: 56px 24px 120px; }
/* The hero block breaks out to full viewport width via negative margins; when
   it's the first thing in entry-content, cancel the container's top padding
   so the gradient band sits flush against the header, same as before. */
.entry-content > .mtp-hero-section:first-child { margin-top: -56px; }
.entry-content h1 { font-size: 44px; line-height: 1.15; letter-spacing: -0.02em; font-weight: 600; margin: 8px 0 20px; }
.entry-content h2.wp-block-heading { font-size: 28px; line-height: 1.25; letter-spacing: -0.01em; font-weight: 600; margin: 48px 0 20px; }
.entry-content h2.wp-block-heading:first-child { margin-top: 0; }
.entry-content h3.wp-block-heading { font-size: 20px; font-weight: 600; margin: 32px 0 16px; }
.entry-content p.wp-block-paragraph { font-size: 17px; line-height: 1.85; color: #334155; margin: 0 0 20px; }
.entry-content p.mtp-eyebrow { font-size: 12.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #1552B8; margin: 0 0 14px; }
.entry-content p.mtp-lede { font-size: 19px; line-height: 1.85; color: #334155; margin: 0 0 28px; }
.entry-content ul.wp-block-list, .entry-content ol.wp-block-list { font-size: 16px; line-height: 1.85; color: #475569; padding-left: 20px; margin: 0 0 20px; }
.entry-content .wp-block-details { border: 1px solid #E2E8F0; border-radius: 8px; padding: 22px 24px; margin: 0 0 10px; }
.entry-content .wp-block-details summary { font-size: 16.5px; font-weight: 600; cursor: pointer; }
.entry-content .wp-block-details p { margin: 16px 0 0; font-size: 16px; line-height: 1.85; color: #475569; }
.entry-content .wp-block-buttons { margin: 8px 0 28px; gap: 12px; }
.entry-content .wp-block-button__link { font-family: 'Open Sans', sans-serif; font-size: 14.5px; font-weight: 600; border-radius: 8px; padding: 13px 24px; }
.entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: #1552B8; color: #FFFFFF; }
.entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: #103F8C; }
.entry-content .wp-block-button.is-style-outline .wp-block-button__link { background: #FFFFFF; color: #0F172A; border: 1px solid #CBD5E1; }
.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #F8FAFC; }
.entry-content a:not(.wp-block-button__link) { color: #1552B8; }