/* MOTIV pricing — growth pitch + Transparent terms (DEC-0116). Design: motiv-landing pricing pass, 2026-09-24.
   Uses the site's own palette: ink #20272c, muted #7b858d, line #dce1e5, soft #f1f3f4, dark tile #2b3237 / #4b555d. */

/* The four plan buttons: one line, full width (was wrapping to three lines at 1280) */
.pricing-grid .price-card .button{width:100%;justify-content:space-between;white-space:nowrap;font-size:13px;padding:15px 16px}

/* Hero jump links */
.hero-jumps{display:flex;gap:28px;flex-wrap:wrap;margin-top:34px}
.hero-jumps a{font-size:14px;border-bottom:1px solid currentColor;padding-bottom:6px;display:inline-flex;gap:10px;align-items:center}
.hero-jumps a:hover{color:#7b858d}

/* ---------- 03 / Built for your growth ---------- */
.growth{background:#f1f3f4;padding:95px 7%}
.growth-head{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:end;margin-bottom:55px}
.growth-head h2{font-size:clamp(40px,4.6vw,66px);font-weight:500;letter-spacing:-.055em;line-height:1.05;margin:26px 0 0}
.growth-head h2 span{color:#8a9094}
.growth-head p{font-size:17px;line-height:1.85;color:#6f7980;margin:0 0 6px;max-width:480px}
.growth-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #cfd6db}
.growth-point{padding:34px 30px 38px 0;border-right:1px solid #dce1e5;margin-right:30px;display:flex;flex-direction:column}
.growth-point:last-child{border-right:0;margin-right:0}
.growth-point .depth-index{font-size:12px;color:#8b9399}
.growth-point h3{font-size:25px;letter-spacing:-.8px;font-weight:500;line-height:1.2;margin:26px 0 14px}
.growth-point p{font-size:15px;line-height:1.8;color:#6f7980;margin:0}
.growth-proof{margin-top:auto;padding-top:26px;font-size:12px;color:#59636a;letter-spacing:.2px}
.growth-proof b{display:block;font-size:30px;font-weight:500;letter-spacing:-1.2px;color:#20272c;margin-bottom:4px}

.per-ro{margin-top:55px;background:#fff;border:1px solid #dce1e5;padding:34px 36px;display:grid;grid-template-columns:.9fr 1.4fr;gap:50px;align-items:center}
.per-ro h3{font-size:27px;font-weight:500;letter-spacing:-.9px;line-height:1.2;margin:16px 0 12px}
.per-ro>div>p{font-size:14px;line-height:1.8;color:#6f7980;margin:0}
.per-ro-bars{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.per-ro-bars li{display:grid;grid-template-columns:86px 1fr 70px;gap:16px;align-items:center;font-size:14px}
.per-ro-bars .bar{height:12px;background:#e6eaed;position:relative}
.per-ro-bars .bar i{position:absolute;inset:0 auto 0 0;background:#252c31}
/* 2.14.0: the dashed last bar meant "XL has no ceiling" — Size 6 now has one, so it is solid like the rest */
.per-ro-bars strong{font-weight:500;text-align:right;font-variant-numeric:tabular-nums}
.per-ro-bars span small{display:block;font-size:11px;color:#8b9399}
.per-ro-note{grid-column:1/-1;font-size:12px;line-height:1.7;color:#7b858d;border-top:1px solid #e6eaed;padding-top:18px;margin:0}

/* ---------- 04 / Transparent terms ---------- */
.terms{background:#20272c;color:#fff;padding:95px 7%;scroll-margin-top:100px}
.terms-label{display:inline-flex;align-items:center;gap:10px;border:1px solid #6d7a83;padding:9px 14px;font-size:11px;letter-spacing:2.2px;font-weight:600;color:#fff}
.terms-label svg{width:14px;height:14px}
.terms-head{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:end;margin:30px 0 55px}
.terms-head h2{font-size:clamp(40px,4.6vw,66px);font-weight:500;letter-spacing:-.055em;line-height:1.05;margin:0}
.terms-head h2 span{color:#8e989f}
.terms-head p{font-size:17px;line-height:1.85;color:#b0b8be;margin:0 0 6px;max-width:480px}

.terms-big{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.term-tile{background:#2b3237;border:1px solid #4b555d;padding:28px 26px 26px;display:flex;flex-direction:column;min-height:210px}
.term-tile .term-big{font-size:clamp(40px,3.9vw,58px);font-weight:500;letter-spacing:-.06em;line-height:1;color:#fff}
.term-tile .term-name{font-size:11px;letter-spacing:1.8px;font-weight:600;color:#c9d0d5;margin:18px 0 10px;text-transform:uppercase}
.term-tile p{font-size:14px;line-height:1.7;color:#aab4bb;margin:0}
.term-tile.accent{background:#f3f5f6;border-color:#f3f5f6;color:#20272c}
.term-tile.accent .term-big{color:#20272c}
.term-tile.accent .term-name{color:#3c464d}
.term-tile.accent p{color:#5d6870}

.terms-list{margin-top:60px;border-top:1px solid #4c5358}
.terms-list>div{display:grid;grid-template-columns:70px 280px 1fr;gap:30px;padding:26px 0;border-bottom:1px solid #434c53}
.terms-list dt{font-size:21px;font-weight:500;letter-spacing:-.5px;line-height:1.35;margin:0}
.terms-list .n{font-size:12px;color:#8d989f;padding-top:6px}
.terms-list dd{margin:0;font-size:15px;line-height:1.85;color:#b7c0c6;max-width:720px}
.terms-list dd strong{color:#fff;font-weight:500}
.terms-list dd ul{margin:10px 0 0;padding-left:18px}
.terms-list dd li{margin:6px 0}
.terms-foot{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:40px;font-size:14px;color:#aab4bb;line-height:1.7}
.terms-foot a{color:#fff;border-bottom:1px solid #fff;padding-bottom:4px;white-space:nowrap}

@media(max-width:1150px){
  .growth-grid{grid-template-columns:1fr 1fr}
  .growth-point:nth-child(2){border-right:0;margin-right:0}
  .growth-point:nth-child(n+3){border-top:1px solid #dce1e5}
  .terms-big{grid-template-columns:1fr 1fr}
  .terms-list>div{grid-template-columns:50px 220px 1fr}
}
@media(max-width:850px){
  .growth,.terms{padding:70px 6%}
  .growth-head,.terms-head{grid-template-columns:1fr;gap:22px}
  .per-ro{grid-template-columns:1fr;gap:28px;padding:28px 24px}
  .terms-list>div{grid-template-columns:40px 1fr;gap:8px 16px}
  .terms-list dd{grid-column:2}
}
@media(max-width:600px){
  .growth,.terms{padding:55px 6%}
  .growth-head h2,.terms-head h2{font-size:39px}
  .growth-head p,.terms-head p{font-size:15px}
  .growth-grid{grid-template-columns:1fr}
  .growth-point{border-right:0;margin-right:0;padding:28px 0 30px;border-top:1px solid #dce1e5}
  .growth-point:first-child{border-top:0}
  .growth-point h3{font-size:23px;margin-top:18px}
  .per-ro-bars li{grid-template-columns:72px 1fr 56px;gap:10px;font-size:13px}
  .terms-big{grid-template-columns:1fr 1fr;gap:10px}
  .term-tile{padding:20px 16px;min-height:0}
  .term-tile .term-big{font-size:36px}
  .term-tile .term-name{font-size:10px;letter-spacing:1.4px;margin:14px 0 8px}
  .term-tile p{font-size:13px}
  .terms-list>div{grid-template-columns:1fr;gap:6px;padding:22px 0}
  .terms-list .n{padding-top:0}
  .terms-list dd{grid-column:1;font-size:15px}
  .terms-list dt{font-size:19px}
  .terms-foot{display:block}
  .terms-foot a{display:inline-block;margin-top:14px}
  .hero-jumps{gap:18px}
}

/* Build fix 2026-09-24 (motiv-landing pricing ship): the one-line button rule above made each card at least as wide as its button text,
   so on phones the cards ran past the right gutter (390) and scrolled the page sideways (360, 320). Cards may shrink again; buttons wrap on phones only. */
.pricing-grid>.price-card{min-width:0}
@media(max-width:600px){.pricing-grid .price-card .button{white-space:normal}}