/* Measured against MakaUG's live product pages at 1440px and 390px. */
/* Off Plan: source overseas badge and destination-section geometry. */
.offplan-page-header .info-eyebrow { display: inline-flex; margin: 0; padding: 8px 16px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; background: rgba(255,255,255,.1); color: #fff; font-size: 12px; font-weight: 900; line-height: 16px; letter-spacing: .1em; }
.offplan-page-header + .info-content { padding: 0; background: #f6faf8; }
.offplan-country-directory { padding-block: 48px; }
.offplan-country-directory > .info-eyebrow { margin: 0; font-size: 12px; font-weight: 900; line-height: 16px; letter-spacing: .1em; }
.offplan-country-directory > h2 { margin: 8px 0 0; color: #030712; font-size: 30px; font-weight: 900; line-height: 36px; letter-spacing: normal; }
.offplan-country-directory > p:not(.info-eyebrow) { margin: 8px 0 0; color: #4b5563; font-size: 16px; line-height: 24px; }
.offplan-country-grid { margin-top: 24px; }
.offplan-country-grid > .offplan-empty { min-height: 0; padding: 24px; border: 1px solid #e5e7eb; border-radius: 16px; background: #fff; color: #4b5563; font-size: 14px; line-height: 20px; }
.offplan-country-grid > .offplan-empty p { margin: 0; }
@media (max-width: 767px) { .offplan-page-header .info-lead { line-height: 24px; } }
.broker-title-band .market-container,
.broker-directory-layout,
.broker-register-layout,
#mortgage-content .market-container,
.ai-page-intro .market-container,
.ai-benefit-section .market-container,
.ai-flow-section .market-container,
.ai-workspace,
.service-page-header .market-container,
.service-marketplace-stack,
.service-directory-layout,
.service-register-layout {
  width: min(calc(100% - 32px),1248px);
}
.broker-title-band { padding: 32px 0; }
.broker-title-band .broker-hero > .info-eyebrow { display: none; }
.broker-title-band h1 { margin: 0; font-size: 30px; font-weight: 900; line-height: 36px; letter-spacing: normal; }
.broker-title-band .info-lead { margin: 8px 0 0; font-size: 16px; line-height: 24px; }
.broker-directory-layout { padding-block: 32px; gap: 24px; grid-template-columns: repeat(3,minmax(0,1fr)); }
.broker-directory-layout .broker-directory-main { grid-column: span 2; }
/* Source: MakaUG section-search-shell and broker listing-map-shell. */
body:has(.broker-directory-layout) { background: #f9fafb; }
.broker-directory-layout .broker-filter { gap: 8px; margin: 0 0 20px; padding: 10px; border: 1px solid #dcfce7; border-radius: 8px; background: #f8fafc; box-shadow: 0 10px 28px rgba(15,23,42,.08); }
.broker-directory-layout .broker-search-row { grid-template-columns: minmax(220px,2fr) auto auto; align-items: center; gap: 8px; }
.broker-search-row .broker-search-query { position: relative; }
.broker-search-query > i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: #64748b; font-size: 13px; pointer-events: none; }
.broker-directory-layout .broker-search-query input,
.broker-directory-layout .broker-pill-row select { height: 44px; min-height: 44px; border: 1px solid rgba(148,163,184,.45); border-radius: 8px; background: #fff; color: #111827; font-size: 14px; line-height: 20px; }
.broker-directory-layout .broker-search-query input { padding: 0 13px 0 38px; font-weight: 400; line-height: 21px; }
.broker-directory-layout .broker-search-query input::placeholder { color: #94a3b8; font-weight: 400; opacity: 1; }
.broker-directory-layout .broker-pill-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.broker-directory-layout .broker-pill-row select { padding: 0 10px; font-weight: 700; }
.broker-directory-layout .broker-search-row > button { display: inline-flex; justify-content: center; align-items: center; gap: 7px; height: 44px; min-height: 44px; padding: 0 14px; border: 1px solid #14532d; border-radius: 8px; background: #166534; color: #fff; font-size: 13px; font-weight: 800; line-height: 19.5px; }
.broker-directory-layout .broker-search-row > .broker-secondary-cta { border-color: rgba(22,101,52,.28); background: #fff; color: #14532d; }
.broker-directory-layout .broker-empty { margin: 0; padding: 20px; border: 1px solid #dcfce7; border-radius: 16px; background: #f0fdf4; color: #052e16; }
.broker-directory-layout .broker-empty h2 { margin: 0; font-size: 18px; line-height: 28px; }
.broker-directory-layout .broker-empty p { margin: 8px 0 0; font-size: 14px; line-height: 20px; }
.broker-directory-layout .broker-empty .info-cta { margin-top: 16px; font-size: 14px; }
.broker-directory-layout .broker-map-stack { gap: 12px; }
.broker-directory-layout .broker-directory-map { width: 100%; height: 350px; min-height: 350px; margin: 0; border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.broker-map-panel > p { margin: 8px 0 0; color: #6b7280; font-size: 12px; line-height: 16px; }
.broker-directory-layout .broker-match-card { padding: 12px; border: 1px solid #dcfce7; border-radius: 12px; background: #f0fdf4; }
.broker-directory-layout .broker-match-card h2 { margin: 0; color: #14532d; font-size: 14px; font-weight: 700; line-height: 20px; }
.broker-directory-layout .broker-match-card > p { margin: 4px 0 0; color: #166534; font-size: 12px; line-height: 16px; }
.broker-directory-layout #broker-match-form { display: grid; gap: 8px; margin-top: 8px; }
.broker-directory-layout #broker-match-form label { margin: 0; }
.broker-directory-layout #broker-match-form input:not([type=checkbox]),
.broker-directory-layout #broker-match-form textarea { width: 100%; min-height: 34px; padding: 8px 12px; border: 1px solid #dcfce7; border-radius: 8px; background: #fff; font: inherit; font-size: 12px; font-weight: 400; line-height: 16px; }
.broker-directory-layout #broker-match-form .broker-consent { font-size: 12px; line-height: 16px; }
.broker-directory-layout #broker-match-form .info-cta { min-height: 34px; padding: 8px 12px; border-radius: 8px; font-size: 12px; line-height: 16px; }
@media (max-width: 1023px) {
  .broker-directory-layout .broker-directory-main { grid-column: auto; }
  .broker-directory-layout .broker-search-row { grid-template-columns: 1fr; }
  .broker-directory-layout .broker-pill-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .broker-directory-layout .broker-search-row > button { width: 100%; }
  .broker-directory-layout .broker-map-stack { display: none; }
}
@media (max-width: 520px) { .broker-directory-layout .broker-pill-row { display: none; } }

/* Source: list-choice-modal, not the inline choice gate behind it. */
body.listing-choice-open { overflow: hidden; }
.supply-main .supply-flow { width: min(calc(100% - 32px),864px); padding-block: 40px; }
.listing-inline-gate { padding: 28px; margin-bottom: 28px; border: 1px solid #bbf7d0; border-radius: 24px; background: linear-gradient(135deg,#f0fdf4,#fff); box-shadow: 0 20px 60px rgba(15,23,42,.08); }
.listing-inline-gate[hidden] { display: none; }
.listing-inline-head { display: flex; justify-content: space-between; align-items: start; gap: 16px; margin-bottom: 20px; }
.listing-inline-head .results-kicker { margin: 0; color: #14532d; font-size: 12px; font-weight: 900; line-height: 16px; letter-spacing: .16em; }
.listing-inline-head h2 { margin: 4px 0 0; font-size: 30px; font-weight: 900; line-height: 36px; }
.listing-inline-head p:last-child { max-width: 672px; margin: 8px 0 0; color: #4b5563; font-size: 14px; line-height: 20px; }
.listing-inline-head > button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border: 1px solid #bbf7d0; border-radius: 12px; background: #fff; color: #14532d; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.listing-inline-methods { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 20px; }
.listing-inline-methods > * { padding: 20px; border: 1px solid #bbf7d0; border-radius: 24px; background: #fff; color: #111827; text-align: left; font: inherit; }
.listing-inline-methods > button { cursor: pointer; }
.listing-inline-methods > div { background: linear-gradient(135deg,#166534,#15502f); color: #fff; }
.listing-inline-methods small { font-size: 12px; font-weight: 900; text-transform: uppercase; }
.listing-inline-methods h3 { margin: 4px 0 0; font-size: 20px; font-weight: 900; line-height: 28px; }
.listing-inline-methods p { margin: 4px 0 0; font-size: 14px; font-weight: 400; line-height: 20px; }
.supply-main .listing-path-dialog { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 16px; border: 0; overflow: auto; background: transparent; }
.supply-main .listing-path-dialog:not([open]) { display: none; }
.supply-main .listing-path-dialog[open] { display: flex; align-items: center; justify-content: center; }
.supply-main .listing-path-dialog::backdrop { background: rgba(0,0,0,.6); }
.supply-main .listing-path-panel, .supply-main .listing-path-intro-card { font-size: 16px; font-weight: 400; line-height: 24px; }
.supply-main .listing-path-dialog .listing-path-panel { position: relative; width: 100%; max-width: 720px; max-height: 90vh; margin: 0; padding: 24px; overflow-y: auto; overflow-x: hidden; border: 0; border-radius: 16px; background: #fff; box-shadow: none; }
.supply-main .listing-path-close { position: absolute; top: 16px; right: 16px; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #bbf7d0; border-radius: 50%; background: transparent; color: #4ade80; font-size: 16px; cursor: pointer; }
.supply-main .listing-path-intro-card { margin-bottom: 20px; padding: 20px; border: 1px solid #bbf7d0; border-radius: 24px; background: linear-gradient(135deg,#f0fdf4,#fff); }
.supply-main .listing-path-intro-card .results-kicker { margin: 0; color: #14532d; font-size: 12px; font-weight: 900; line-height: 16px; letter-spacing: .16em; }
.supply-main .listing-path-intro-card h2 { margin: 4px 0 0; padding: 0; color: #1f2937; font-size: 24px; font-weight: 700; line-height: 32px; letter-spacing: normal; }
.supply-main .listing-path-intro-card > p:not(.results-kicker) { max-width: none; margin: 4px 0 0; color: #6b7280; font-size: 14px; font-weight: 400; line-height: 20px; }
.supply-main .listing-path-categories { display: flex; flex-wrap: wrap; gap: 8px; }
.supply-main .listing-path-intro-card .listing-path-categories { margin-top: 16px; }
.supply-main .listing-path-categories button { display: inline-block; min-height: 0; padding: 8px 12px; border: 1px solid #bbf7d0; border-radius: 999px; background: #fff; color: #374151; font-family: inherit; font-size: 12px; font-weight: 800; line-height: 18px; }
.supply-main .listing-path-categories button.selected { border-color: #166534; background: #f0fdf4; color: #14532d; }
.supply-main .listing-path-methods { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 0; }
.supply-main .listing-path-methods > * { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0; min-height: 198px; padding: 28px; border: 1px solid #bbf7d0; border-radius: 16px; background: #fff; color: #1f2937; text-align: center; font-family: inherit; font-size: 16px; font-weight: 400; line-height: 24px; }
.supply-main .listing-path-methods > .listing-path-whatsapp-method { background: linear-gradient(135deg,#166534,#15502f); color: #fff; }
.supply-main .listing-method-icon { display: block; width: auto; height: 40px; margin: 0 0 12px; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit !important; font-family: inherit; font-size: 36px !important; line-height: 40px; text-align: center; }
.supply-main .listing-path-methods strong { display: block; width: 100%; margin: 0; font-size: 16px; font-weight: 700; line-height: 24px; text-align: center; }
.supply-main .listing-path-methods > * > span:not(.listing-method-icon) { display: block; margin: 4px 0 0; color: #6b7280; font-size: 14px; font-weight: 400; line-height: 20px; }
.supply-main .listing-path-methods > .listing-path-whatsapp-method > span:not(.listing-method-icon) { color: rgba(255,255,255,.9) !important; }
.supply-main .listing-path-whatsapp-method > .listing-whatsapp-path:not(a) { display: none; }
.supply-main .listing-path-notice { display: block; margin-top: 20px; padding: 12px 16px; border: 1px solid #dcfce7; border-radius: 12px; background: #f0fdf4; color: #166534; font-size: 14px; font-weight: 400; line-height: 20px; }
.supply-main .listing-path-notice p { margin: 0; font-size: 14px; font-weight: 400; line-height: 20px; text-align: left; }
@media (max-width: 767px) {
  .supply-main .listing-path-dialog { padding: 10px; }
  .supply-main .listing-path-dialog .listing-path-panel { width: 100%; max-height: calc(100dvh - 20px); padding: 18px; border-radius: 14px; }
  .supply-main .listing-path-methods, .listing-inline-methods { grid-template-columns: 1fr; }
  .supply-main .listing-path-methods > button { min-height: 178px; }
  .listing-inline-gate { padding: 20px; }
  .listing-inline-head { flex-wrap: wrap; }
  .listing-inline-head h2 { font-size: 24px; line-height: 32px; }
}
#mortgage-content .mortgage-page-header { padding: 32px 0; }
.mortgage-page-header .mortgage-tool-pill { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 4px 12px; border: 1px solid #d1fae5; border-radius: 9999px; background: rgba(255,255,255,.85); box-shadow: 0 1px 2px rgba(0,0,0,.05); font-size: 12px; line-height: 16px; font-weight: 900; }
.mortgage-page-header .mortgage-tool-pill i { color: #f59e0b; }
.mortgage-page-header h1 { max-width: none; margin: 0; font-size: 48px; font-weight: 900; line-height: 48px; letter-spacing: normal; }
.mortgage-page-header .info-lead { max-width: 768px; margin: 8px 0 0; font-size: 16px; line-height: 24px; }
.mortgage-page-header .mortgage-value-tiles { grid-template-columns: 1fr; margin: 20px 0 0; gap: 12px; }
.mortgage-page-header .mortgage-value-tiles article { display: block; align-content: start; height: auto; min-height: 0; padding: 12px 16px; border: 1px solid #d1fae5; border-radius: 16px; background: rgba(255,255,255,.85); box-shadow: 0 16px 35px rgba(20,83,45,.08); }
.mortgage-page-header .mortgage-value-tiles h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; line-height: 20px; font-weight: 700; }
.mortgage-page-header .mortgage-value-tiles h2 i { font-size: 14px; line-height: 14px; color: #f59e0b; }
.mortgage-page-header .mortgage-value-tiles article:nth-child(2) h2 i { color: #16a34a; }
.mortgage-value-tiles article p { margin-top: 4px; font-size: 12px; line-height: 16px; }
@media (min-width: 640px) { .mortgage-page-header .mortgage-value-tiles { grid-template-columns: repeat(3,minmax(0,1fr)); } }
.mortgage-calculator-section { padding-block: 32px; }
.mortgage-calculator-layout { border: 1px solid #d1fae5; border-radius: 32px; line-height: 24px; box-shadow: 0 28px 80px rgba(20,83,45,.14); }
.mortgage-calculator-head { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
.mortgage-calculator-head .info-eyebrow { display: none; }
.mortgage-calculator-layout .mortgage-calculator-head h2 { margin: 0; color: #111827; font-size: 24px; font-weight: 900; line-height: 32px; letter-spacing: normal; }
.mortgage-calculator-head p:last-child { margin: 4px 0 0; color: #4b5563; font-size: 14px; line-height: 20px; }
.mortgage-calculator-head .mortgage-calculator-tabs { gap: 8px; flex-wrap: wrap; overflow: visible; }
.mortgage-calculator-head .mortgage-calculator-tabs button { min-height: 30px; padding: 6px 12px; border-color: #dcfce7; font-size: 12px; font-weight: 700; line-height: 16px; }
.mortgage-calculator-head .mortgage-calculator-tabs button[aria-selected="true"] { border: 0; background: #15803d; box-shadow: 0 10px 15px -3px rgba(21,128,61,.2); }
.mortgage-calculator { margin-top: 16px; gap: 16px; align-items: start; grid-template-columns: minmax(0,1fr) minmax(320px,.82fr); }
.mortgage-calculator-fields { display: block; padding: 16px; border: 1px solid #d1fae5; border-radius: 24px; background: linear-gradient(135deg,#fff,rgba(236,253,245,.6)); box-shadow: inset 0 1px 0 rgba(255,255,255,.9),0 14px 32px rgba(20,83,45,.07); }
.mortgage-input-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.mortgage-calculator-fields label { gap: 6px; color: #6b7280; font-size: 12px; font-weight: 600; line-height: 16px; letter-spacing: .025em; }
.mortgage-calculator-fields input, .mortgage-calculator-fields select { padding: 12px 16px; font-size: 14px; font-weight: 400; line-height: 20px; }
.mortgage-input-grid label { display: block; }
.mortgage-input-grid input, .mortgage-input-grid select { display: block; margin-top: 6px; }
.mortgage-calc-actions, .mortgage-result-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 16px; }
.mortgage-calc-actions button, .mortgage-result-actions button { padding: 12px 16px; border: 1px solid #bbf7d0; border-radius: 12px; background: #fff; color: #166534; font: inherit; font-size: 14px; line-height: 20px; font-weight: 900; cursor: pointer; }
.mortgage-calc-actions button:first-child, .mortgage-result-actions button:first-child { border-color: #15803d; background: #15803d; color: #fff; }
.mortgage-calculator .mortgage-estimate { display: block; min-width: 0; min-height: 0; align-self: start; padding: 16px; border: 1px solid #fff; border-radius: 24px; background: linear-gradient(135deg,#fff,#ecfdf5,#fffbeb); box-shadow: 0 22px 48px rgba(20,83,45,.14); }
.mortgage-result-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.mortgage-result-head > div:first-child { min-width: 0; }
.mortgage-result-head span { display: block; color: #166534; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: normal; }
.mortgage-result-head small { display: block; margin-top: 4px; color: #4b5563; font-size: 11px; line-height: 16.5px; }
.mortgage-deposit-ring { display: flex; flex: 0 0 56px; width: 56px; height: 56px; align-items: center; justify-content: center; border: 4px solid #fde68a; border-radius: 999px; background: #fff; color: #166534; font-size: 12px; font-weight: 900; line-height: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.mortgage-calculator .mortgage-estimate > .mortgage-monthly-result { display: block; margin-top: 8px; color: #030712; font-size: 36px; font-weight: 900; line-height: 40px; overflow-wrap: anywhere; }
.mortgage-estimate .mortgage-rate-source { display: block; margin-top: 4px; color: #047857; font-size: 11px; font-weight: 600; line-height: 16.5px; }
.mortgage-result-cards { display: grid; gap: 8px; margin-top: 16px; }
.mortgage-result-card { min-width: 0; padding: 12px; border: 1px solid #d1fae5; border-radius: 16px; background: rgba(255,255,255,.85); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.mortgage-result-card > span { display: block; color: #15803d; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: normal; }
.mortgage-result-card > strong { display: block; margin-top: 4px; color: #030712; font-size: 18px; font-weight: 900; line-height: 28px; overflow-wrap: anywhere; }
.mortgage-result-card > small { display: block; margin-top: 4px; color: #4b5563; font-size: 11px; font-weight: 400; line-height: 16.5px; }
.mortgage-result-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.mortgage-result-actions { gap: 8px; }
.mortgage-estimate .mortgage-estimate-disclaimer { margin: 12px 0 0; color: #4b5563; font-size: 11px; line-height: 16.5px; }
.mortgage-guidance { margin-top: 16px; padding: 12px; border: 1px solid #d1fae5; border-radius: 16px; background: rgba(255,255,255,.85); color: #022c22; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.mortgage-guidance [hidden] { display: none; }
.mortgage-guidance h3 { margin: 0; color: #022c22; font-size: 14px; font-weight: 900; line-height: 20px; }
.mortgage-guidance p { margin: 4px 0 0; color: #065f46; font-size: 12px; line-height: 16px; }
.mortgage-guidance-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.mortgage-guidance-grid > div { min-width: 0; padding: 12px; border: 1px solid #d1fae5; border-radius: 12px; background: #fff; }
.mortgage-guidance-grid > div:first-child { background: #ecfdf5; }
.mortgage-guidance-grid span { display: block; color: #6b7280; font-size: 12px; font-weight: 700; line-height: 16px; text-transform: uppercase; }
.mortgage-guidance-grid strong { display: block; margin-top: 4px; color: #030712; font-size: 12px; font-weight: 700; line-height: 16px; overflow-wrap: anywhere; }
.mortgage-extra-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 8px; align-items: end; margin-top: 12px; }
.mortgage-extra-grid > div { padding: 12px; border: 1px solid #d1fae5; border-radius: 12px; font-size: 12px; line-height: 16px; }
.mortgage-guidance [data-mortgage-panel="fees"] > label { margin-top: 12px; }
.mortgage-summary-grid, .mortgage-health-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 12px; }
.mortgage-summary-grid > div, .mortgage-health-grid > div { min-width: 0; padding: 12px; border: 1px solid #dcfce7; border-radius: 12px; background: linear-gradient(135deg,#f0fdf4,#ecfdf5); }
.mortgage-summary-grid > div:nth-child(2) { border-color: #dbeafe; background: linear-gradient(135deg,#eff6ff,#f0f9ff); }
.mortgage-summary-grid > div:nth-child(3) { border-color: #fef3c7; background: linear-gradient(135deg,#fffbeb,#fefce8); }
.mortgage-summary-grid span, .mortgage-health-grid span { display: block; color: #6b7280; font-size: 12px; font-weight: 600; line-height: 16px; text-transform: uppercase; }
.mortgage-summary-grid strong, .mortgage-health-grid strong { display: block; margin-top: 4px; color: #166534; font-size: 14px; font-weight: 700; line-height: 20px; overflow-wrap: anywhere; }
.mortgage-summary-grid > div:first-child strong, .mortgage-summary-grid > div:last-child strong { font-size: 18px; font-weight: 900; line-height: 28px; }
.mortgage-summary-grid strong b { font-weight: inherit; }
.mortgage-summary-grid i { margin-right: 4px; font-size: 14px; }
.mortgage-summary-grid > div:nth-child(2) i { color: #2563eb; }
.mortgage-summary-grid > div:nth-child(3) strong { color: #92400e; }
.mortgage-health-grid > div:not(:first-child) strong { color: #1f2937; }
.mortgage-health-grid > div { border-color: #e5e7eb; background: #fff; }
.mortgage-health-grid progress { display: block; width: 100%; height: 6px; margin-top: 4px; border: 0; border-radius: 999px; overflow: hidden; accent-color: #16a34a; }
@media (max-width: 1023px) { .mortgage-calculator { grid-template-columns: 1fr; } .mortgage-calculator .mortgage-estimate { grid-column: auto; grid-row: auto; } }
@media (max-width: 767px) { .mortgage-calculator-layout { padding: 20px; } .mortgage-calculator .mortgage-estimate > .mortgage-monthly-result { font-size: 30px; line-height: 37.5px; } }
@media (max-width: 639px) { .mortgage-input-grid, .mortgage-calc-actions, .mortgage-result-actions, .mortgage-result-pair, .mortgage-guidance-grid, .mortgage-summary-grid, .mortgage-health-grid, .mortgage-extra-grid { grid-template-columns: 1fr; } .mortgage-input-grid .mortgage-wide-field { grid-column: auto; } }
.ai-page-intro { padding: 40px 0; }
.ai-page-intro h1 { margin: 0; font-size: 36px; font-weight: 900; line-height: 40px; letter-spacing: normal; }
.ai-page-intro p { max-width: 768px; margin: 8px 0 0; font-size: 16px; line-height: 24px; }
.ai-benefit-section { padding: 32px 0 24px; }
.ai-benefit-section .parity-grid { gap: 20px; }
.ai-benefit-section .parity-card { min-height: 0; padding: 20px; border: 1px solid #dcfce7; border-radius: 16px; box-shadow: none; }
.ai-benefit-section .parity-card > i { display: grid; width: 44px; height: 44px; margin-bottom: 12px; place-items: center; border-radius: 12px; background: #dcfce7; font-size: 20px; }
.ai-benefit-section h3 { margin: 0; color: #111827; font-size: 18px; font-weight: 700; line-height: 28px; }
.ai-benefit-section .parity-card p { margin: 4px 0 0; font-size: 14px; line-height: 20px; }
.ai-benefit-section, .ai-flow-section { background: #f9fafb; }
.ai-flow-section { padding: 0 0 32px; }
.ai-flow-layout { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.ai-conversation-card, .ai-now-card { padding: 24px; border: 1px solid #dcfce7; border-radius: 16px; }
.ai-conversation-card > .info-eyebrow, .ai-now-card > .info-eyebrow { display: none; }
.ai-conversation-card > h2, .ai-now-card > h2 { margin: 0 0 16px; color: #111827; font-size: 24px; font-weight: 700; line-height: 32px; }
.ai-conversation-card .ai-phone-demo { width: min(360px,100%); margin: 0 auto; gap: 9px; padding: 0 0 12px; border: 7px solid #0f172a; border-radius: 28px; overflow: hidden; background: radial-gradient(circle at 20% 20%,rgba(22,101,52,.08),transparent 26%),radial-gradient(circle at 80% 30%,rgba(34,197,94,.08),transparent 24%),#ece5dd; box-shadow: 0 20px 44px rgba(0,0,0,.2); }
.ai-phone-demo .ai-phone-head { margin-bottom: 3px; padding: 14px 14px 10px; border: 0; background: #166534; color: #fff; font-size: 14px; line-height: 20px; }
.ai-phone-demo .ai-phone-mark, .ai-phone-demo .ai-phone-head small { display: none; }
.ai-phone-demo article { margin: 0 12px; padding: 10px 11px; border-radius: 4px 12px 12px; box-shadow: 0 1px 2px rgba(0,0,0,.1); }
.ai-phone-demo article.from-user { background: #dcf8c6; }
.ai-phone-demo article > span { display: none; }
.ai-phone-demo article p { margin: 0; font-size: 12px; line-height: 1.42; }
.ai-phone-demo .info-cta { margin: 6px 12px 0; font-size: 14px; }
.ai-now-card ul { gap: 12px; margin: 0; }
.ai-now-card li { grid-template-columns: 16px 1fr; gap: 8px; margin: 0; color: #374151; font-size: 14px; line-height: 20px; }
.ai-now-card li > i { width: 16px; height: 20px; padding: 0; border-radius: 0; background: none; }
.ai-now-card li strong { font-weight: 400; color: #374151; }
.ai-now-card > .info-cta { display: inline-flex; width: auto; margin-top: 20px; padding: 12px 20px; border-radius: 12px; font-size: 16px; line-height: 24px; }
.service-page-header { padding: 32px 0; }
.service-page-header .detail-breadcrumb { margin: 0 0 12px; font-size: 12px; line-height: 16px; }
.service-page-header-row { gap: 16px; }
.service-page-header-row > div { flex: 0 1 auto; min-width: 0; max-width: none; }
.service-page-header .info-eyebrow { margin: 0; font-size: 12px; line-height: 16px; letter-spacing: .05em; }
.service-page-header h1 { max-width: none; margin: 8px 0 0; color: #030712; font-size: 36px; font-weight: 900; line-height: 40px; letter-spacing: normal; }
.service-page-header .info-lead { max-width: 768px; margin: 8px 0 0; font-size: 14px; line-height: 20px; }
.service-page-header-row > a { padding: 12px 16px; border-radius: 12px; font-size: 14px; line-height: 20px; }
.service-marketplace-stack .service-ai-card { display: block; min-height: 0; padding: 20px; line-height: 24px; }
.service-marketplace-stack .service-ai-card-head { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; }
.service-marketplace-stack .service-ai-card h2 { margin: 0; font-size: 20px; font-weight: 900; line-height: 28px; }
.service-marketplace-stack .service-ai-card-head p { margin: 4px 0 0 !important; font-size: 14px !important; line-height: 20px; }
.service-marketplace-stack .service-ai-card-head > span { padding: 4px 12px; font-size: 12px; line-height: 16px; font-weight: 900; }
.service-marketplace-stack .service-ai-card form { display: flex; align-items: center; gap: 8px; margin-top: 16px; min-height: 54px; padding: 6px; border-radius: 16px; line-height: 24px; }
.service-marketplace-stack .service-ai-card form > i { display: inline; width: 0; margin-left: 12px; }
.service-marketplace-stack .service-ai-card input { flex: 1 1 0; width: 0; min-width: 0; min-height: 0; height: 44px; padding: 0 8px; border: 0; border-radius: 0; font-size: 14px; line-height: 20px; font-weight: 400; }
.service-marketplace-stack .service-ai-card form .info-cta { flex: 0 0 auto; min-height: 0; height: 44px; padding: 12px 16px; border: 0; border-radius: 12px; font-size: 14px; line-height: 20px; font-weight: 900; }
.service-marketplace-stack .service-ai-card form .info-cta > i { margin-right: 4px; }
@media (max-width: 767px) { .service-marketplace-stack .service-ai-card { padding: 16px; } }
.service-filter-shell { padding: 16px; }
.service-filter-head h2, .service-category-section > h2 { color: #111827; font-size: 16px; font-weight: 900; line-height: 24px; }
.service-filter-head a { font-size: 12px; line-height: 16px; }
.service-filter-shell .service-filter { grid-template-columns: repeat(7,minmax(0,1fr)); margin-top: 12px; }
.service-filter-shell .service-filter input, .service-filter-shell .service-filter select, .service-filter-shell .service-filter button { min-height: 42px; font-size: 14px; font-weight: 400; line-height: 20px; }
.service-filter-shell .service-filter button { border: 0; font-weight: 700; }
.service-category-grid > a { font-size: 12px; line-height: 16px; }
.service-badge-guide summary strong { font-size: 14px; line-height: 20px; }
.service-badge-guide summary b { font-size: 10px; line-height: 16px; }
.supply-title-band { padding: 32px 0; }
.supply-title-band > .market-container { width: min(calc(100% - 32px),864px); }
.supply-title-band h1 { margin: 0; font-size: 30px; font-weight: 900; line-height: 36px; letter-spacing: normal; }
.supply-title-band p { margin: 8px 0 0; font-size: 14px; line-height: 20px; }
@media (max-width: 1023px) {
  .broker-directory-layout, .ai-flow-layout { grid-template-columns: 1fr; }
  .service-page-header-row > div { max-width: none; width: 100%; }
}
@media (max-width: 767px) {
  .broker-title-band h1 { font-size: 28px; line-height: 33.6px; }
  .broker-title-band .info-lead { font-size: 14px; line-height: 20px; }
  .mortgage-page-header h1, .ai-page-intro h1, .service-page-header h1 { font-size: 30px; line-height: 36px; }
  .mortgage-page-header .info-lead { font-size: 14px; line-height: 20px; }
  .ai-benefit-section .parity-grid { grid-template-columns: 1fr; }
  .service-filter-shell .service-filter { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Same 672px account drawer presentation as MakaUG, retaining Rwanda forms. */
body.account-parity-open { overflow: hidden; }
.account-main.account-parity-ready { min-height: 0; padding: 0; background: linear-gradient(135deg,#052e16,#14532d,#065f46); }
.account-parity-landing { width: min(calc(100% - 32px),736px); min-height: 52vh; margin: 0 auto; padding: 56px 0; color: #fff; text-align: center; }
.account-parity-landing > p:first-child { margin: 0; color: #bbf7d0; font-size: 14px; font-weight: 700; line-height: 20px; text-transform: uppercase; letter-spacing: .05em; }
.account-parity-landing h1 { margin: 8px 0 0; font-size: 36px; font-weight: 900; line-height: 40px; letter-spacing: normal; }
.account-parity-landing h1 + p { margin: 12px 0 0; color: #f0fdf4; font-size: 16px; line-height: 24px; }
.account-parity-landing > button { margin-top: 24px; padding: 12px 20px; border: 0; border-radius: 12px; background: #fff; color: #14532d; font: inherit; font-weight: 900; cursor: pointer; }
.account-parity-landing > p:last-child { margin: 16px 0 0; color: #dcfce7; font-size: 12px; line-height: 16px; }
.account-parity-overlay { position: fixed; inset: 0; z-index: 10010; display: flex; justify-content: flex-end; background: rgba(0,0,0,.45); }
.account-parity-overlay[hidden] { display: none; }
.account-parity-overlay .account-dialog-shell { display: flex; flex-direction: column; width: min(672px,100%); max-width: 672px; height: 100dvh; margin: 0; padding: 0; overflow: hidden; border-radius: 24px 0 0 24px; background: #fff; color: #1f2937; box-shadow: -20px 0 60px rgba(0,0,0,.18); }
.account-parity-body { flex: 1; min-height: 0; overflow-y: auto; }
.account-parity-overlay .account-hero { flex-shrink: 0; }
.account-parity-overlay .account-hero { position: relative; max-width: none; margin: 0; padding: 20px; border-radius: 24px 0 0 0; background: linear-gradient(115deg,#065f46,#22c55e); color: #fff; }
.account-parity-overlay .account-hero > .info-eyebrow { margin: 0 0 6px; color: #dcfce7; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: normal; text-transform: none; }
.account-parity-overlay .account-hero h2 { margin: 0; padding-right: 32px; color: #fff; font-size: 24px; font-weight: 900; line-height: 32px; letter-spacing: normal; }
.account-parity-overlay .account-hero > p:last-of-type { margin: 8px 0 0; color: #f0fdf4; font-size: 14px; line-height: 20px; }
.account-parity-close { position: absolute; top: 20px; right: 20px; display: grid; width: 40px; height: 40px; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; font-size: 24px; cursor: pointer; }
.account-parity-overlay #account-auth, .account-parity-overlay #account-dashboard, .account-parity-overlay #account-global-alert { margin: 20px; }
.account-parity-overlay .account-auth-grid { display: block; }
.account-parity-overlay .account-auth-grid[hidden], .account-parity-overlay .account-panel[hidden] { display: none; }
.account-parity-benefit { margin: 0 0 20px; padding: 16px; border: 1px solid #86efac; border-radius: 16px; background: #f0fdf4; color: #14532d; font-size: 14px; line-height: 20px; }
.account-parity-language { display: grid; gap: 4px; margin-bottom: 20px; color: #4b5563; font-size: 12px; font-weight: 700; line-height: 16px; }
.account-parity-language select { width: 100%; min-height: 48px; padding: 12px 16px; border: 1px solid #dcfce7; border-radius: 12px; background: #fff; color: #111827; font-family: inherit; font-size: 14px; }
.account-parity-overlay .account-form label[hidden] { display: none; }
.account-parity-role-title { display: block; margin-bottom: 8px; color: #4b5563; font-size: 12px; font-weight: 700; line-height: 16px; }
.account-parity-roles { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-bottom: 20px; }
.account-parity-roles button { display: flex; align-items: center; gap: 12px; min-height: 66px; padding: 12px 14px; border: 1px solid #e5e7eb; border-radius: 16px; background: #fff; color: #111827; text-align: left; cursor: pointer; }
.account-parity-roles button[aria-pressed="true"] { border: 2px solid #16803d; background: #ecfdf5; }
.account-parity-roles button > i { color: #15803d; font-size: 20px; }
.account-parity-roles button strong { display: block; font-size: 14px; line-height: 20px; }
.account-parity-roles button small { display: block; color: #475569; font-size: 12px; line-height: 16px; }
.account-parity-tabs { display: flex; gap: 8px; margin-bottom: 16px; }
.account-parity-tabs button { flex: 1; min-height: 42px; border: 1px solid #dcfce7; border-radius: 10px; background: #fff; color: #15803d; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.account-parity-tabs button[aria-selected="true"] { background: #15803d; color: #fff; }
.account-parity-overlay .account-panel { padding: 16px; border: 1px solid #e5e7eb; border-radius: 16px; }
.account-parity-overlay .account-panel h2 { margin: 0 0 12px; color: #14532d; font-size: 18px; font-weight: 700; line-height: 28px; }
.account-parity-overlay .account-form { grid-template-columns: 1fr; gap: 12px; }
.account-parity-overlay .account-form label { display: grid; gap: 4px; color: #475569; font-size: 12px; font-weight: 700; line-height: 16px; }
.account-parity-overlay .account-form input:not([type="checkbox"]), .account-parity-overlay .account-form select { min-height: 48px; padding: 12px 16px; border: 1px solid #dcfce7; border-radius: 12px; background: #fff; color: #111827; font: inherit; font-size: 14px; font-weight: 400; }
.account-parity-overlay .account-form button[type="submit"] { min-height: 48px; padding: 12px 16px; border: 0; border-radius: 12px; background: #15803d; color: #fff; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.account-parity-overlay .account-form .broker-consent { display: flex; align-items: flex-start; gap: 8px; }
.account-parity-overlay .account-help-actions { margin-top: 16px; font-size: 14px; }
.account-parity-form-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.account-parity-overlay .account-panel .account-parity-form-head h2 { margin: 0; }
.account-parity-form-role { margin: 0; color: #15803d; font-size: 12px; font-weight: 700; line-height: 16px; text-transform: uppercase; }
.account-parity-mode-link { padding: 0; border: 0; background: transparent; color: #15803d; font-family: inherit; font-size: 14px; font-weight: 700; line-height: 20px; cursor: pointer; }
.account-parity-overlay .account-parity-form-summary { margin: 8px 0 16px; color: #4b5563; font-size: 14px; line-height: 20px; }
.account-parity-password-control { position: relative; display: block; }
.account-parity-overlay .account-parity-password-control input { width: 100%; padding-right: 64px; }
.account-parity-overlay .account-form input:not([type="checkbox"]), .account-parity-overlay .account-form select { font-size: 16px; line-height: 24px; }
.account-parity-password-reveal { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); padding: 2px 0; border: 0; background: transparent; color: #6b7280; font-family: inherit; font-size: 12px; font-weight: 700; line-height: 16px; cursor: pointer; }
.account-parity-overlay .account-form label > small { color: #6b7280; font-size: 12px; font-weight: 400; line-height: 16px; }
.account-parity-overlay .account-form .account-parity-submit-footer { position: sticky; bottom: 0; z-index: 1; margin: 4px -16px -12px; padding: 12px 16px 4px; border-top: 1px solid #f3f4f6; background: rgba(255,255,255,.95); backdrop-filter: blur(8px); }
.account-parity-submit-footer > button { width: 100%; }
@media (max-width: 767px) {
  .account-parity-overlay .account-dialog-shell { border-radius: 0; }
  .account-parity-overlay .account-hero { border-radius: 0; }
  .account-parity-overlay .account-form input:not([type="checkbox"]), .account-parity-overlay .account-form select { font-size: 16px; }
}
@media (min-width: 640px) and (max-width: 1023px) {
  .account-parity-overlay .account-dialog-shell { max-width: 576px; }
}
@media (max-width: 639px) {
  .account-parity-roles { grid-template-columns: 1fr; }
}
/* MakaUG Featured: one compact hero followed immediately by a flat 1/2/3-column feed. */
body[data-public-page="featured"] .featured-daily-section { padding: 40px 0; min-height: 50vh; background: #f8fbf9; }
body[data-public-page="featured"] .featured-daily-grid { display: grid; grid-template-columns: 1fr; gap: 20px; align-items: stretch; }
body[data-public-page="featured"] .listing-card { border: .5px solid #e4ece8; border-radius: 13px; box-shadow: none; }
body[data-public-page="featured"] .listing-card-content { display: block; padding: 12px 13px 13px; }
body[data-public-page="featured"] .listing-card-badges { gap: 6px; margin-bottom: 8px; }
body[data-public-page="featured"] .listing-category-pill,
body[data-public-page="featured"] .listing-source-badge { padding: 4px 8px; border-radius: 4px; font-size: 11px; line-height: 16.5px; font-weight: 600; letter-spacing: normal; text-transform: none; }
body[data-public-page="featured"] .listing-card .listing-card-price { margin: 0; font-size: 16px; line-height: 20px; font-weight: 600; }
body[data-public-page="featured"] .listing-card h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; margin: 5px 0 0; font-size: 13px; line-height: 1.35; font-weight: 500; }
body[data-public-page="featured"] .listing-card-location { display: flex; align-items: center; gap: 4px; margin-top: 6px; font-size: 12px; line-height: 1.35; font-weight: 400; }
body[data-public-page="featured"] .listing-card .listing-card-facts { margin-top: 10px; padding-top: 9px; border-top: .5px solid #eef2ef; gap: 8px 12px; font-size: 11.5px; line-height: 1.35; font-weight: 400; }
body[data-public-page="featured"] .listing-card .listing-card-origin:not([hidden]) { display: inline-flex; align-items: center; gap: 4px; margin-top: 10px; color: #8a9a90; font-size: 10.5px; line-height: 1.35; font-weight: 400; }
body[data-public-page="featured"] .listing-card .listing-card-usd { margin: 4px 0 0; }
body[data-public-page="featured"] main > .parity-section:last-child { display: none; }
body[data-public-page="featured"] .featured-feed-status,
body[data-public-page="featured"] .featured-feed-empty { grid-column: 1/-1; }
@media (min-width: 640px) { body[data-public-page="featured"] .featured-daily-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (min-width: 1024px) { body[data-public-page="featured"] .featured-daily-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }

/* Source advertising format-preview affordance and 940px modal; Rwanda quotation only. */
body[data-public-page="advertise"] .campaign-builder .support-package-option { border-radius: 14px; border-color: #e4ece8; }
body[data-public-page="advertise"] .campaign-builder .support-package-option:has(input:checked) { background: #f4fbf6; box-shadow: 0 0 0 2px rgba(21,96,63,.1); }
body[data-public-page="advertise"] .campaign-builder .advertise-package-preview-button { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; min-height: 34px; padding: 7px 12px; border: 1px solid #cfe3d5; border-radius: 999px; background: #f0f8f3; color: #15603f; font-size: 12px; line-height: normal; font-weight: 900; }
#advertising-placement-preview-modal { position: fixed; width: calc(100vw - 32px); max-width: 940px; max-height: 90vh; margin: auto; overflow: auto; padding: 24px; border: 0; border-radius: 16px; background: white; color: #16241d; font-family: "Plus Jakarta Sans", sans-serif; }
#advertising-placement-preview-modal::backdrop { background: rgba(0,0,0,.6); }
#advertising-placement-preview-close { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; padding: 0; border: 1px solid #bbf7d0; border-radius: 999px; background: white; color: #15803d; font-size: 22px; cursor: pointer; }
#advertising-placement-preview-modal header { padding-right: 48px; }
#advertising-placement-preview-modal header > p:first-child { margin: 0; color: #15603f; font-size: 12px; line-height: 16px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
#advertising-placement-preview-modal h2 { max-width: none; margin: 4px 0 0; font-size: 30px; line-height: 36px; font-weight: 900; letter-spacing: normal; color: #16241d; }
#advertising-placement-preview-price { margin: 8px 0 0; color: #15603f; font-size: 14px; line-height: 20px; font-weight: 900; }
#advertising-placement-preview-modal .advertising-preview-layout { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(250px,.7fr); gap: 20px; align-items: start; margin-top: 20px; }
#advertising-placement-preview-modal aside { border: 1px solid #dfe9e3; border-radius: 16px; background: #f6f9f7; padding: 20px; }
#advertising-placement-preview-modal h3 { margin: 0; font-size: 18px; line-height: 28px; font-weight: 900; }
#advertising-placement-preview-modal aside > p { margin: 8px 0 0; color: #52665b; font-size: 14px; line-height: 1.625; }
#advertising-placement-preview-modal h4 { margin: 20px 0 0; font-size: 12px; line-height: 16px; letter-spacing: .025em; color: #15603f; text-transform: uppercase; font-weight: 900; }
#advertising-placement-preview-locations { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
#advertising-placement-preview-modal aside > .advertising-preview-disclaimer { margin-top: 20px; border: 1px solid #fde68a; border-radius: 12px; padding: 12px; background: #fffbeb; color: #78350f; font-size: 12px; line-height: 1.625; }
#advertising-placement-preview-modal footer { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
#advertising-placement-preview-modal footer > * { display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: 12px 20px; border: 1px solid #cdddd3; border-radius: 12px; background: white; color: #15603f; text-decoration: none; font-family: inherit; font-size: 14px; line-height: 20px; font-weight: 900; cursor: pointer; }
#advertising-placement-preview-modal footer > button:first-child { border-color: #15603f; background: #15603f; color: white; }
#advertising-placement-preview-modal footer > button:disabled { opacity: .55; cursor: not-allowed; }
#advertising-placement-preview-modal .advertising-preview-browser { background: #edf3ef; border: 1px solid #d6e3da; border-radius: 20px; box-shadow: 0 22px 52px rgba(15,61,46,.14); overflow: hidden; }
#advertising-placement-preview-modal .advertising-preview-browser-bar { display: flex; align-items: center; gap: 7px; min-height: 42px; padding: 9px 13px; border-bottom: 1px solid #e4ece8; background: white; }
#advertising-placement-preview-modal .advertising-preview-browser-bar > i { display: block; width: 8px; height: 8px; background: #dbe7df; border-radius: 999px; }
#advertising-placement-preview-modal .advertising-preview-browser-bar > span { margin-left: 5px; color: #15603f; font-size: 12px; font-weight: 900; }
#advertising-placement-preview-modal .ad-format-page { min-height: 350px; padding: 18px; background: #f8faf9; }
#advertising-placement-preview-modal .ad-format-page-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
#advertising-placement-preview-modal .ad-format-page-head strong { display: block; font-size: 16px; font-weight: 900; }
#advertising-placement-preview-modal .ad-format-page-head small { display: block; margin-top: 2px; color: #68776f; font-size: 11px; font-weight: 700; }
#advertising-placement-preview-modal .advertising-preview-tag { display: inline-flex; padding: 5px 9px; border: 1px solid #cfe3d5; border-radius: 999px; background: #edf6f0; color: #15603f; font-size: 10px; font-weight: 800; }
#advertising-placement-preview-modal .ad-format-slot-label { margin: 13px 0 8px; color: #996000; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
#advertising-placement-preview-modal .ad-format-native-grid { display: grid; gap: 12px; grid-template-columns: 1.18fr 1fr 1fr; }
#advertising-placement-preview-modal .ad-format-property-card { position: relative; min-height: 245px; overflow: hidden; border-radius: 14px; background: white; box-shadow: 0 5px 18px rgba(17,49,35,.08); }
#advertising-placement-preview-modal .ad-format-property-card > img { display: block; width: 100%; height: 116px; object-fit: cover; }
#advertising-placement-preview-modal .ad-format-property-card.is-sponsored { box-shadow: 0 18px 36px rgba(15,61,46,.2); transform: translateY(-3px); }
#advertising-placement-preview-modal .ad-format-property-card.is-sponsored::after { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg,#d99118,#f4bf53); }
#advertising-placement-preview-modal .ad-format-card-sponsor { position: absolute; top: 10px; left: 10px; z-index: 2; padding: 6px 9px; border-radius: 999px; background: #123f2f; color: white; font-size: 9px; font-weight: 900; }
#advertising-placement-preview-modal .ad-format-property-copy { padding: 12px; }
#advertising-placement-preview-modal .ad-format-property-copy strong { display: block; font-size: 13px; line-height: 1.25; font-weight: 900; }
#advertising-placement-preview-modal .ad-format-property-copy small { display: block; margin-top: 5px; color: #68776f; font-size: 10px; font-weight: 700; }
#advertising-placement-preview-modal .ad-format-property-meta { display: flex; align-items: center; justify-content: space-between; gap: 4px; margin-top: 12px; color: #15603f; font-size: 11px; font-weight: 900; }
#advertising-placement-preview-modal .ad-format-card-cta { padding: 6px 9px; border-radius: 999px; background: #15603f; color: white; font-size: 9px; }
#advertising-placement-preview-modal .ad-format-standard-card { opacity: .68; }
#advertising-placement-preview-modal .ad-format-standard-card .ad-format-property-copy span { display: block; height: 7px; margin-top: 8px; border-radius: 999px; background: #dfe8e2; }
#advertising-placement-preview-modal .ad-format-standard-card .ad-format-property-copy span:last-child { width: 58%; }
#advertising-placement-preview-modal .ad-format-mini-results { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-bottom: 12px; }
#advertising-placement-preview-modal .ad-format-mini-results > div { height: 56px; border-radius: 10px; background: white; padding: 9px; }
#advertising-placement-preview-modal .ad-format-mini-results > div::before,
#advertising-placement-preview-modal .ad-format-mini-results > div::after { content: ""; display: block; height: 6px; border-radius: 999px; background: #dfe8e2; }
#advertising-placement-preview-modal .ad-format-mini-results > div::after { margin-top: 9px; width: 62%; }
#advertising-placement-preview-modal .ad-format-banner { position: relative; min-height: 196px; overflow: hidden; border-radius: 14px; background-position: center; background-size: cover; box-shadow: 0 16px 34px rgba(15,61,46,.15); }
#advertising-placement-preview-modal .ad-format-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(7,31,23,.94),rgba(15,61,46,.72) 48%,rgba(15,61,46,.08)); }
#advertising-placement-preview-modal .ad-format-sponsored-chip { position: absolute; top: 12px; right: 12px; z-index: 3; padding: 6px 9px; border-radius: 999px; background: rgba(255,255,255,.94); color: #14532d; font-size: 9px; font-weight: 900; }
#advertising-placement-preview-modal .ad-format-banner-copy { position: absolute; inset: 0 auto 0 0; display: flex; flex-direction: column; justify-content: center; max-width: 58%; padding: 25px 28px; color: white; z-index: 2; }
#advertising-placement-preview-modal .ad-format-banner-copy small { color: #c6f6d7; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
#advertising-placement-preview-modal .ad-format-banner-copy strong { margin-top: 8px; font-size: clamp(21px,3vw,31px); font-weight: 900; letter-spacing: -.035em; line-height: 1.05; }
#advertising-placement-preview-modal .ad-format-banner-cta { align-self: flex-start; margin-top: 16px; padding: 8px 13px; border-radius: 999px; background: white; color: #14532d; font-size: 11px; font-weight: 900; }
@media (max-width: 1023px) { #advertising-placement-preview-modal .advertising-preview-layout { grid-template-columns: 1fr; } }
@media (max-width: 767px) { #advertising-placement-preview-modal h2 { font-size: 24px; line-height: 32px; } }
@media (max-width: 639px) {
  #advertising-placement-preview-modal { width: calc(100vw - 20px); max-height: calc(100vh - 20px); padding: 18px; border-radius: 14px; }
  #advertising-placement-preview-modal .ad-format-page { padding: 12px; }
  #advertising-placement-preview-modal .ad-format-page-head { align-items: flex-start; }
  #advertising-placement-preview-modal .ad-format-native-grid { grid-template-columns: 1fr 1fr; }
  #advertising-placement-preview-modal .ad-format-property-card.is-sponsored { grid-column: 1/-1; }
  #advertising-placement-preview-modal .ad-format-native-grid .ad-format-property-card:last-child { display: none; }
  #advertising-placement-preview-modal .ad-format-banner { min-height: 185px; }
  #advertising-placement-preview-modal .ad-format-banner-copy { max-width: 78%; padding: 20px; }
  #advertising-placement-preview-modal .ad-format-banner-copy strong { font-size: 22px; }
}