/**
 * BMN Property Management — Section Styles
 *
 * ONE stylesheet shared by all three PM templates (hub /property-management/,
 * pricing /property-management/pricing/, small-condo
 * /property-management/small-condo-hoa-management/). Per-page overrides are
 * scoped via the page class on <main> (.pm-hub / .pm-pricing / .pm-small).
 * Self-contained (clones the page-adu-guide.css pattern) and scoped under
 * .bmn-pm to avoid collisions. Uses the theme's global .bne-container.
 *
 * @package flavor_flavor_flavor
 * @version 1.0.0
 */

/* ==========================================================================
   Wrapper + palette
   ========================================================================== */
.bmn-pm{
  --pm-navy:#1a365d; --pm-navy-2:#2d4a7c; --pm-dark:#0f172a;
  --pm-red:#c53030; --pm-red-dark:#9b2c2c;
  --pm-teal:#2dd4bf; --pm-teal-ink:#0d9488;
  --pm-ink:#1a202c; --pm-slate:#4a5568; --pm-mute:#6b7280;
  --pm-line:#e5e7eb; --pm-gray-50:#f7fafc; --pm-beige-light:#f5eff0;
  font-family:'Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--pm-ink);line-height:1.7;
}
.bmn-pm *{box-sizing:border-box}
.bmn-pm img{max-width:100%;height:auto}

/* ==========================================================================
   Hero (clears the fixed .bne-header via the theme height var)
   ========================================================================== */
.pm-hero{
  background:linear-gradient(135deg,#0f1f3d 0%,var(--pm-navy) 45%,var(--pm-navy-2) 100%);
  color:#fff;position:relative;overflow:hidden;
  padding:calc(var(--bne-header-height,80px) + 2.5rem) 0 52px;
}
.pm-hero::after{
  content:"";position:absolute;right:-80px;bottom:-90px;width:420px;height:420px;
  background:radial-gradient(circle at center,rgba(45,212,191,.18),transparent 62%);pointer-events:none;
}
.pm-hero .bne-container{position:relative;z-index:2}
.pm-badge{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
  padding:7px 15px;border-radius:30px;font-size:13px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;margin-bottom:18px}
.pm-hero h1{font-size:clamp(1.9rem,4.6vw,3rem);line-height:1.15;font-weight:800;margin:0 0 16px;letter-spacing:-.01em;max-width:920px}
.pm-hero__sub{font-size:clamp(1.05rem,2.2vw,1.26rem);opacity:.92;max-width:700px;margin:0 0 12px;line-height:1.55}
.pm-hero__byline{font-size:14px;opacity:.72;margin:16px 0 24px}
.pm-hero__byline strong{color:var(--pm-teal);font-weight:600}
.pm-hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}

/* Headline stats strip */
.pm-hero__stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-top:34px}
.pm-hstat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:16px 14px}
.pm-hstat .n{font-size:24px;font-weight:800;color:var(--pm-teal)}
.pm-hstat .n em{font-style:normal;font-size:15px;font-weight:700}
.pm-hstat .l{font-size:12.5px;opacity:.85;margin-top:4px;line-height:1.4}

/* Buttons */
.pm-btn{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border-radius:9px;
  font-weight:700;font-size:15px;border:2px solid transparent;cursor:pointer;transition:.18s;text-decoration:none}
.pm-btn:hover{text-decoration:none}
.pm-btn--primary{background:var(--pm-red);color:#fff;border-color:var(--pm-red)}
.pm-btn--primary:hover{background:var(--pm-red-dark);border-color:var(--pm-red-dark);color:#fff}
.pm-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.pm-btn--ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.pm-btn--navy{background:var(--pm-navy);color:#fff;border-color:var(--pm-navy)}
.pm-btn--navy:hover{background:var(--pm-navy-2);border-color:var(--pm-navy-2);color:#fff}
.pm-btn--lg{padding:15px 30px;font-size:16px}

/* ==========================================================================
   Sections + typography
   ========================================================================== */
.pm-section{padding:44px 0 8px}
.pm-section--tint{background:var(--pm-gray-50);padding:44px 0 40px}
.pm-body{max-width:860px;margin:0 auto}
.pm-body--wide{max-width:1040px}
.pm-crumb{font-size:13.5px;color:var(--pm-mute);margin:0 0 18px}
.pm-crumb a{color:var(--pm-mute);text-decoration:none}
.pm-crumb a:hover{color:var(--pm-navy)}
.pm-lead{font-size:1.16rem;color:var(--pm-slate);line-height:1.75}
.bmn-pm h2{font-size:clamp(1.5rem,3.2vw,2rem);font-weight:800;color:var(--pm-navy);
  line-height:1.25;margin:44px 0 16px;letter-spacing:-.01em}
.pm-kicker{display:block;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--pm-red);margin-bottom:6px}
.bmn-pm h3{font-size:1.2rem;font-weight:700;color:var(--pm-navy);margin:28px 0 10px}
.bmn-pm p{margin:0 0 16px}
.bmn-pm ul,.bmn-pm ol{margin:0 0 18px;padding-left:24px}
.bmn-pm li{margin-bottom:9px}
.pm-hr{border:0;border-top:1px solid var(--pm-line);margin:40px 0}

/* Key-fact box */
.pm-keyfact{display:flex;gap:14px;background:var(--pm-beige-light);border-left:4px solid var(--pm-red);
  border-radius:0 10px 10px 0;padding:18px 20px;margin:24px 0}
.pm-keyfact .ic{font-size:22px;line-height:1.2}
.pm-keyfact p{margin:0}

/* Callout */
.pm-callout{background:#eef4fb;border:1px solid #d3e0f0;border-radius:12px;padding:20px 22px;margin:26px 0}
.pm-callout h4{margin:0 0 10px;font-size:1.05rem;font-weight:800;color:var(--pm-navy)}
.pm-callout p{margin:0 0 8px}
.pm-callout p:last-child{margin-bottom:0}

/* ==========================================================================
   Services grid
   ========================================================================== */
.pm-services{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:26px 0 10px}
.pm-service{background:#fff;border:1px solid var(--pm-line);border-radius:12px;padding:20px 18px;
  box-shadow:0 1px 2px rgba(15,23,42,.04)}
.pm-service h4{margin:0 0 8px;font-size:1.02rem;font-weight:800;color:var(--pm-navy)}
.pm-service p{margin:0;font-size:14.5px;color:var(--pm-slate);line-height:1.6}
.pm-service .pm-ic{width:40px;height:40px;border-radius:9px;background:var(--pm-beige-light);
  display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:12px}

/* ==========================================================================
   Tables (worked pricing examples)
   ========================================================================== */
.pm-tablewrap{overflow-x:auto;margin:24px 0;border:1px solid var(--pm-line);border-radius:12px}
.pm-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:520px}
.pm-table th{background:var(--pm-navy);color:#fff;text-align:left;padding:12px 14px;font-weight:700;white-space:nowrap}
.pm-table td{padding:12px 14px;border-top:1px solid var(--pm-line);color:var(--pm-slate)}
.pm-table tr:nth-child(even) td{background:var(--pm-gray-50)}
.pm-table td strong{color:var(--pm-ink)}
.pm-table .hi{color:var(--pm-red);font-weight:800}

/* ==========================================================================
   Portal feature strip
   ========================================================================== */
.pm-portal{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:24px 0}
.pm-portal .f{background:#fff;border:1px solid var(--pm-line);border-radius:12px;padding:16px}
.pm-portal .f .t{font-weight:800;color:var(--pm-navy);font-size:15px;margin-bottom:6px}
.pm-portal .f p{margin:0;font-size:13.5px;color:var(--pm-slate);line-height:1.55}

/* Areas-we-serve chip links */
.pm-areas{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 6px}
.pm-areas a{display:inline-block;background:#fff;border:1px solid var(--pm-line);border-radius:30px;
  padding:8px 16px;font-size:14px;font-weight:600;color:var(--pm-navy);text-decoration:none;transition:.15s}
.pm-areas a:hover{border-color:var(--pm-navy);background:var(--pm-gray-50)}

/* Related links block */
.pm-related{background:var(--pm-gray-50);border:1px solid var(--pm-line);border-radius:12px;padding:18px 22px;margin:28px 0}
.pm-related .rt{font-weight:800;color:var(--pm-navy);margin-bottom:10px}
.pm-related ul{list-style:none;margin:0;padding:0}
.pm-related li{margin-bottom:7px;font-size:14.5px}
.pm-related a{color:var(--pm-slate);text-decoration:none;font-weight:600}
.pm-related a:hover{color:var(--pm-red)}

/* Onboarding steps */
.pm-steps{counter-reset:pmstep;list-style:none;padding:0;margin:24px 0}
.pm-steps li{position:relative;padding:0 0 22px 54px;margin:0}
.pm-steps li::before{counter-increment:pmstep;content:counter(pmstep);
  position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;
  background:var(--pm-navy);color:#fff;font-weight:800;font-size:16px;
  display:flex;align-items:center;justify-content:center}
.pm-steps li::after{content:"";position:absolute;left:17px;top:40px;bottom:2px;width:2px;background:var(--pm-line)}
.pm-steps li:last-child::after{display:none}
.pm-steps .t{font-weight:800;color:var(--pm-navy);margin-bottom:4px}
.pm-steps p{margin:0;font-size:14.5px;color:var(--pm-slate)}

/* ==========================================================================
   FAQ (details/summary, FAQPage microdata)
   ========================================================================== */
.pm-faq{margin:22px 0}
.pm-faq details{border:1px solid var(--pm-line);border-radius:10px;margin-bottom:10px;background:#fff;overflow:hidden}
.pm-faq summary{cursor:pointer;padding:16px 18px;font-weight:700;color:var(--pm-navy);font-size:15.5px;
  list-style:none;position:relative;padding-right:44px}
.pm-faq summary::-webkit-details-marker{display:none}
.pm-faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);
  font-size:20px;font-weight:700;color:var(--pm-mute);transition:.15s}
.pm-faq details[open] summary::after{content:"−"}
.pm-faq .a{padding:0 18px 16px;color:var(--pm-slate);font-size:14.5px;line-height:1.65}
.pm-faq .a p{margin:0}

/* ==========================================================================
   Inquiry form band
   ========================================================================== */
.pm-formband{background:var(--pm-gray-50);border-top:1px solid var(--pm-line);padding:48px 0 56px;margin-top:44px}
.pm-formband h2{margin-top:0}
.pm-formband .pm-form-intro{max-width:640px;color:var(--pm-slate);font-size:1.05rem;margin-bottom:24px}
.pm-formwrap{background:#fff;border:1px solid var(--pm-line);border-radius:14px;padding:26px 24px;max-width:760px;
  box-shadow:0 2px 10px rgba(15,23,42,.05)}

/* ==========================================================================
   CTA band + team (clone of adu-ctaband/adu-team)
   ========================================================================== */
.pm-ctaband{background:linear-gradient(135deg,var(--pm-navy) 0%,var(--pm-navy-2) 100%);color:#fff;
  text-align:center;padding:52px 0;margin-top:8px}
.pm-ctaband h2{color:#fff;margin:0 0 12px;font-size:clamp(1.5rem,3vw,2rem)}
.pm-ctaband p{max-width:620px;margin:0 auto 22px;opacity:.9}
.pm-ctaband .pm-hero__cta{justify-content:center}

.pm-team{background:var(--pm-beige-light);padding:48px 0 56px}
.pm-team h2{margin-top:0}
.pm-team__lede{color:var(--pm-slate);max-width:640px;margin-bottom:26px}
.pm-agent{display:flex;gap:20px;align-items:flex-start;background:#fff;border:1px solid var(--pm-line);
  border-radius:14px;padding:22px;max-width:720px}
.pm-agent img{width:96px;height:96px;border-radius:12px;object-fit:cover;flex-shrink:0}
.pm-agent .av{width:96px;height:96px;border-radius:12px;background:var(--pm-navy);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;flex-shrink:0}
.pm-agent h3{margin:0 0 4px}
.pm-agent .role{font-size:13.5px;color:var(--pm-mute);font-weight:600;margin-bottom:8px}
.pm-agent p{margin:0;font-size:14.5px;color:var(--pm-slate)}

/* Disclaimer */
.pm-disclaimer{font-size:13px;color:var(--pm-mute);background:var(--pm-gray-50);
  border:1px solid var(--pm-line);border-radius:10px;padding:14px 18px;margin:34px 0 8px;line-height:1.6}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:640px){
  .pm-hero{padding-top:calc(var(--bne-header-height,70px) + 1.6rem)}
  .pm-agent{flex-direction:column}
  .pm-section{padding:32px 0 4px}
  .pm-formwrap{padding:20px 16px}
}