/*
Theme Name: MoneyPost Appliance
Theme URI: https://appliance.multiversecontents.com/
Description: GeneratePress child theme for the MoneyPost appliance vertical.
Author: MoneyPost
Template: generatepress
Version: 1.0.0
Text Domain: moneypost-appliance
*/

:root {
  --mp-ink: #172033;
  --mp-muted: #667085;
  --mp-paper: #ffffff;
  --mp-soft: #f5f7fb;
  --mp-line: #e4e9f1;
  --mp-brand: #ff6b35;
  --mp-brand-dark: #d94b1f;
  --mp-navy: #173b62;
  --mp-mint: #ddf7ee;
  --mp-radius: 18px;
  --mp-shadow: 0 14px 36px rgba(23, 32, 51, .08);
  --mp-content: 760px;
}

body {
  color: var(--mp-ink);
  background: var(--mp-soft);
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.75;
}

a { color: var(--mp-navy); }
a:hover { color: var(--mp-brand-dark); }

.site-header,
.main-navigation {
  box-shadow: 0 1px 0 var(--mp-line);
}

.site-content { padding-top: 32px; }

.content-area .site-main,
.inside-article {
  border-radius: var(--mp-radius);
}

.inside-article {
  box-shadow: var(--mp-shadow);
}

.entry-content,
.entry-summary {
  overflow-wrap: anywhere;
}

.entry-content > *:not(.alignwide):not(.alignfull) {
  max-width: var(--mp-content);
  margin-left: auto;
  margin-right: auto;
}

.entry-content h2 {
  margin-top: 2.2em;
  padding-left: .75rem;
  border-left: 5px solid var(--mp-brand);
  line-height: 1.35;
}

.entry-content h3 {
  margin-top: 1.7em;
  color: var(--mp-navy);
  line-height: 1.4;
}

.entry-content img {
  height: auto;
  border-radius: 14px;
}

.wp-block-table {
  margin: 1.8rem auto;
  overflow-x: auto;
  border: 1px solid var(--mp-line);
  border-radius: 14px;
  background: var(--mp-paper);
  box-shadow: 0 8px 24px rgba(23, 32, 51, .06);
}

.wp-block-table table { min-width: 620px; margin: 0; }
.wp-block-table th { background: var(--mp-navy); color: #fff; }
.wp-block-table th,
.wp-block-table td { padding: .9rem 1rem; border-color: var(--mp-line); }

.mp-note,
.mp-affiliate-disclosure {
  max-width: var(--mp-content);
  margin: 1.5rem auto;
  padding: 1rem 1.15rem;
  border: 1px solid #f5c9b8;
  border-radius: 14px;
  background: #fff8f4;
  color: #5f3729;
  font-size: .94rem;
}

.mp-cta,
.entry-content .mp-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .75rem 1.2rem;
  border-radius: 12px;
  background: var(--mp-brand);
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(255, 107, 53, .24);
}

.mp-cta:hover { background: var(--mp-brand-dark); color: #fff; }

.mp-home { margin: -32px calc(50% - 50vw) 0; }
.mp-home__inner { width: min(1180px, calc(100% - 36px)); margin: 0 auto; }

.mp-hero {
  padding: clamp(54px, 8vw, 100px) 0;
  background:
    radial-gradient(circle at 90% 15%, rgba(255,255,255,.24), transparent 30%),
    linear-gradient(135deg, #16385d 0%, #245e82 55%, #2f8b84 100%);
  color: #fff;
}

.mp-eyebrow {
  display: inline-block;
  margin-bottom: 1rem;
  padding: .35rem .7rem;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  font-weight: 700;
  letter-spacing: .02em;
}

.mp-hero h1 {
  max-width: 820px;
  margin: 0 0 1rem;
  color: #fff;
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 1.15;
}

.mp-hero p { max-width: 710px; margin: 0; font-size: clamp(1rem, 2vw, 1.2rem); color: #e9f6ff; }

.mp-pills { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.5rem; }
.mp-pill { padding: .38rem .72rem; border-radius: 999px; background: rgba(255,255,255,.14); color: #fff; }

.mp-section { padding: clamp(44px, 7vw, 78px) 0; }
.mp-section h2 { margin: 0 0 .5rem; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.mp-section__lead { margin: 0 0 1.8rem; color: var(--mp-muted); }

.mp-route-grid,
.mp-post-grid { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mp-post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.mp-route,
.mp-post-card {
  overflow: hidden;
  border: 1px solid var(--mp-line);
  border-radius: var(--mp-radius);
  background: var(--mp-paper);
  box-shadow: var(--mp-shadow);
}

.mp-route { display: block; padding: clamp(24px, 4vw, 40px); text-decoration: none; }
.mp-route:hover { transform: translateY(-2px); }
.mp-route__icon { display: block; margin-bottom: .7rem; font-size: 2rem; }
.mp-route h3 { margin: 0 0 .55rem; color: var(--mp-ink); }
.mp-route p { margin: 0; color: var(--mp-muted); }

.mp-post-card__image { aspect-ratio: 16 / 10; overflow: hidden; background: #e8edf4; }
.mp-post-card__image img { width: 100%; height: 100%; object-fit: cover; }
.mp-post-card__body { padding: 1.15rem; }
.mp-post-card h3 { margin: 0 0 .55rem; font-size: 1.05rem; line-height: 1.45; }
.mp-post-card p { margin: 0; color: var(--mp-muted); font-size: .94rem; }
.mp-post-card a { color: inherit; text-decoration: none; }

.mp-trust { background: var(--mp-mint); }
.mp-trust__box { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mp-trust__item { padding: 1.25rem; border-radius: 14px; background: rgba(255,255,255,.72); }
.mp-trust__item strong { display: block; margin-bottom: .35rem; color: #126653; }

@media (max-width: 900px) {
  .mp-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .site-content { padding-top: 18px; }
  .inside-article { padding: 24px 18px; }
  .mp-home { margin-top: -18px; }
  .mp-route-grid,
  .mp-post-grid,
  .mp-trust__box { grid-template-columns: 1fr; }
  .wp-block-table table { min-width: 560px; }
  .mp-cta,
  .entry-content .mp-cta { width: 100%; box-sizing: border-box; }
}