/* FairlyRemote marketing pages other than the homepage: the shared page hero,
   closing card and compact footer, so every page matches the homepage. */

.hero.hero--page {
  padding: calc(var(--nav-height, 64px) + 48px) 0 64px;
  text-align: center;
  overflow: hidden;
  background: linear-gradient(180deg, #ddf3f0 0%, #eaf8f6 42%, #f6fcfb 78%, #ffffff 100%);
}
.hero.hero--page::before, .hero.hero--page::after { display: none !important; }
.hero--page .section-label {
  display: block; margin: 0 auto 14px; padding: 0; background: none; border: 0; box-shadow: none;
  font: 700 12.5px/1 Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  letter-spacing: .08em; text-transform: uppercase; color: #0f766e;
}
.hero--page .hero-title {
  max-width: 900px; margin: 0 auto;
  font-size: clamp(32px, 4vw, 50px); line-height: 1.08; letter-spacing: -0.035em; text-wrap: balance;
}
.hero--page .hero-subtitle {
  max-width: 640px; margin: 18px auto 0; font-size: 17px; line-height: 1.6; color: #475569; text-wrap: pretty;
}
.hero--page .hero-subtitle a { color: #0f766e; font-weight: 600; }
.hero--page .hero-subtitle:last-child { margin-bottom: 0; }

.legal-page .legal-hero {
  padding: calc(var(--nav-height, 64px) + 48px) 0 44px;
  text-align: center;
  background: linear-gradient(180deg, #ddf3f0 0%, #eaf8f6 42%, #f6fcfb 78%, #ffffff 100%);
}
.legal-page .legal-hero .section-label {
  display: block; margin: 0 auto 14px; padding: 0; background: none; border: 0; box-shadow: none;
  font: 700 12.5px/1 Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  letter-spacing: .08em; text-transform: uppercase; color: #0f766e;
}
.legal-page .legal-hero h1 { font-size: clamp(32px, 4vw, 50px); letter-spacing: -0.035em; line-height: 1.08; }
.legal-page .legal-hero .legal-date {
  max-width: 680px; margin: 16px auto 0; font-size: 13px; line-height: 1.6; color: #64748b; text-wrap: pretty;
}

.page--reference .cl-note,
.page--reference .cl-timeline,
.page--reference .cl-releases { margin-left: auto; margin-right: auto; }

.closing-cta .closing-cta__row { justify-content: center; }
.closing-cta .closing-cta__card .btn-on-teal:only-child { margin: 0 auto; }

.section-label--teal:has(+ .section-title),
.section-label--teal:has(+ h2) { display: table; margin-left: auto; margin-right: auto; }

@media (max-width: 640px) {
  .hero.hero--page { padding: calc(var(--nav-height, 56px) + 28px) 0 36px; }
  .hero--page .hero-title { font-size: clamp(28px, 8vw, 36px); }
  .hero--page .hero-subtitle { font-size: 16px; }
  .legal-page .legal-hero { padding: calc(var(--nav-height, 56px) + 28px) 0 28px; }
  .legal-page .legal-hero .legal-date { font-size: 12px; }
}

/* Pictures cut from the homepage's parts (pricing cards, blog covers, FAQ
   answers, changelog months). The parts' own rules come from home.css and
   chapters.min.css; this only frames and sizes them. */
.pic { min-width: 0;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  border-radius: 14px; padding: 14px 12px;
  background: linear-gradient(180deg, #e9f6f4 0%, #f5fbfa 100%);
  box-shadow: inset 0 0 0 1px rgba(15, 118, 110, .08);
}
.pic__zoom { width: max-content; max-width: none; pointer-events: none; }
.pic .ftb-out--lean { max-width: none; width: 440px; }
.pic .votex { width: 420px; }
.pic .fx2 { width: 420px; }
.pic .grp-board { width: 460px; margin: 0; }

.pic .votex__opt { opacity: 1; transform: none; animation: none; }
.pic .votex__votebar i { transition: none; }

.plan-tour { padding: 72px 0 24px; }
.plan-tour__head { text-align: center; display: flex; flex-direction: column; align-items: center; margin-bottom: 32px; }
.plan-tour__head h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); letter-spacing: -0.025em; }
.plan-tour__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 980px; margin: 0 auto; }
.plan-tour__tile { background: #fff; border: 1px solid rgba(20, 184, 166, .15); border-radius: 18px; padding: 14px 14px 20px; box-shadow: var(--shadow-card-soft); }
.plan-tour__tile .pic { height: 210px; }
.plan-tour__tile h3 { margin: 16px 6px 4px; font-size: 1.0625rem; }
.plan-tour__tile p { margin: 0 6px; color: var(--text-secondary); font-size: .9375rem; line-height: 1.55; }
.plan-more { margin: 4px 0 14px; }
.plan-more summary {
  cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 6px;
  min-height: 44px; font-size: .875rem; font-weight: 600; color: #0f766e;
}
.plan-more summary::-webkit-details-marker { display: none; }
.plan-more summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .15s; }
.plan-more[open] summary::after { transform: rotate(-135deg) translateY(-1px); }
.plan-more .plan-features { margin-top: 2px; }

.blog-card { display: grid; grid-template-columns: 220px minmax(0, 1fr); column-gap: 24px; align-items: start; }
.blog-card > .post-cover { grid-row: 1 / span 4; display: block; }
.blog-card > .post-cover .pic { height: 140px; }
.post-figure { max-width: 760px; margin: 8px auto 0; }
.post-figure .pic { padding: 24px 12px; }
.faq-figure, .faq2-body > .pic { margin: 2px 0 14px; }
.faq2-body > .pic { height: 190px; }
.faq-figure .privacy-chips { max-width: 520px; }
.cl-figure { margin-top: 16px; }
.cl-figure .pic { padding: 18px 12px; }

@media (max-width: 720px) {
  .plan-tour__grid { grid-template-columns: minmax(0, 1fr); }
  .plan-tour__tile .pic { height: 180px; }
  .blog-card { grid-template-columns: 1fr; }
  .blog-card > .post-cover { grid-row: auto; margin-bottom: 12px; }
  .post-figure { padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) { .plan-more summary::after { transition: none; } }

/* Compact footer (same rules as the homepage). */
.footer--compact{padding:36px 0 28px !important;border-top:1px solid #e6ebf1}
.footer--compact .fc-top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:20px 40px}
.footer--compact .fc-brand{display:flex;flex-direction:column;gap:6px}
.footer--compact .fc-tag{font-size:13.5px;color:#64748b}
.footer--compact .fc-links{display:grid;grid-template-columns:repeat(4,auto);gap:10px 34px}
.footer--compact .fc-group{display:flex;flex-direction:column;gap:7px;font-size:13.5px}
.footer--compact .fc-group > span:first-child{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#0f766e}
.footer--compact .fc-group a{color:#475569;text-decoration:none}
.footer--compact .fc-group a:hover{color:#0f172a}
.footer--compact .fc-legal{margin:26px 0 0;padding-top:16px;border-top:1px solid #eef2f6;font-size:11.5px;line-height:1.6;color:#94a3b8;text-align:left}
.footer--compact .fc-legal a{color:inherit}
@media (max-width:760px){
  .footer--compact .fc-links{grid-template-columns:1fr;gap:9px;width:100%}
  .footer--compact .fc-group{flex-direction:row;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
  .footer--compact .fc-group > span:first-child{width:84px;flex:none}
}
.footer--compact .fc-l{display:flex;flex-direction:column;gap:7px}
@media (max-width:760px){
  .footer--compact .fc-group{display:grid;grid-template-columns:84px 1fr;gap:0 10px}
  .footer--compact .fc-l{flex-direction:row;flex-wrap:wrap;gap:4px 14px}
}
.footer--compact .fc-l{font-size:13.5px;font-weight:400;letter-spacing:0;text-transform:none;color:#475569;width:auto}
.footer--compact .fc-group > span:first-child{line-height:20px}
.footer--compact .fc-l a{line-height:20px}
@media (max-width:760px){
  .footer--compact .fc-group{grid-template-columns:104px 1fr;align-items:baseline}
  .footer--compact .fc-l{gap:2px 16px}