/* /como-funciona/ — aligned with the refreshed Parkom landing */
.cf-hero {
  color: #fff;
  background: radial-gradient(ellipse at 82% 12%, rgba(0,200,83,.18), transparent 34%), linear-gradient(125deg,#0b2034 0%,#102f49 58%,#123b4b 100%);
  padding: clamp(3.5rem, 7vw, 6rem) 0;
}
.cf-hero-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr); gap:clamp(2rem,5vw,5rem); align-items:center; }
.cf-hero h1 { margin:.3rem 0 1rem; max-width:12ch; font-size:clamp(2.7rem,5.5vw,4.8rem); line-height:1.02; letter-spacing:-.055em; color:#fff; }
.cf-lead { max-width:38rem; margin:0 0 1.5rem; color:#e3edf5; font-size:clamp(1rem,1.5vw,1.15rem); }
.cf-hero .pill { background:rgba(200,255,99,.12); color:#d8ff8a; border:1px solid rgba(200,255,99,.24); }
.cf-hero-note { display:flex; gap:1rem; align-items:flex-start; padding:1.5rem; border:1px solid rgba(255,255,255,.18); border-radius:24px; background:rgba(255,255,255,.08); box-shadow:0 18px 55px rgba(0,0,0,.12); backdrop-filter:blur(8px); }
.cf-live-dot { flex:0 0 .7rem; width:.7rem; height:.7rem; margin-top:.45rem; border-radius:50%; background:#8cf5a9; box-shadow:0 0 0 6px rgba(140,245,169,.13); }
.cf-hero-note strong { display:block; font-size:1.1rem; }
.cf-hero-note p { margin:.45rem 0 0; color:#d6e4ee; }
.cf-section { padding:clamp(3.5rem,6vw,5.5rem) 0; }
.cf-leave { background:radial-gradient(700px 300px at 50% 0%,rgba(0,200,83,.08),transparent 70%),#fff; }
.cf-seek { background:#f2f8ff; border-top:1px solid rgba(16,42,67,.07); }
.cf-heading { max-width:46rem; margin:0 auto 2.2rem; text-align:center; }
.cf-kicker { display:inline-block; margin-bottom:.65rem; color:#008c43; font-size:.75rem; font-weight:800; letter-spacing:.1em; }
.cf-kicker-blue,.cf-blue { color:#2f80ed; }
.cf-heading h2 { margin:0; color:#102a43; font-size:clamp(2rem,4vw,3.15rem); line-height:1.08; letter-spacing:-.045em; }
.cf-heading>p { margin:.8rem auto 0; max-width:42rem; color:#5b6b7c; font-size:1.02rem; }
.cf-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; list-style:none; width:100%; margin-left:0; padding-left:0; }
.cf-card { position:relative; min-width:0; padding:1.5rem 1.25rem 1.6rem; border:1px solid rgba(16,42,67,.08); border-radius:22px; background:#fff; box-shadow:0 12px 35px rgba(16,42,67,.055); }
.cf-number { display:block; margin-bottom:1.5rem; color:#9aaaba; font-size:.78rem; font-weight:800; letter-spacing:.1em; }
.cf-icon { display:grid; place-items:center; width:3rem; height:3rem; margin-bottom:1rem; border-radius:15px; color:#008c43; background:#e4f9ec; font-size:1.45rem; font-weight:800; }
.cf-icon-blue { color:#246bd1; background:#e4efff; }
.cf-card h3 { margin:0 0 .55rem; color:#102a43; font-size:1.1rem; line-height:1.25; letter-spacing:-.02em; }
.cf-card p { margin:0; color:#5b6b7c; font-size:.94rem; line-height:1.6; }
.cf-bottom-cta { padding:2.5rem 0; border-top:1px solid rgba(16,42,67,.08); background:#fff; }
.cf-cta-inner { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:clamp(1.5rem,4vw,2.5rem); border:1px solid rgba(0,200,83,.16); border-radius:24px; background:linear-gradient(120deg,#f4fbf6,#fff); }
.cf-cta-inner h2 { margin:0; max-width:30ch; color:#102a43; font-size:clamp(1.5rem,3vw,2.25rem); line-height:1.15; letter-spacing:-.04em; }
.cf-cta-inner p { margin:.65rem 0 0; color:#5b6b7c; }
@media (max-width:900px) {
 .cf-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .cf-hero-grid { grid-template-columns:1fr; }
 .cf-hero-note { max-width:40rem; }
}
@media (max-width:600px) {
 .cf-hero { padding:3rem 0; }
 .cf-cards { grid-template-columns:1fr; }
 .cf-card { padding:1.25rem; }
 .cf-number { margin-bottom:.8rem; }
 .cf-cta-inner { align-items:flex-start; flex-direction:column; }
 .cf-cta-inner .btn { width:100%; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

/* Real visual assets for the how-it-works steps */
.cf-card-image {
  display:block;
  width:100%;
  height:clamp(150px, 17vw, 220px);
  margin:0 0 1.15rem;
  object-fit:cover;
  object-position:center;
  border-radius:15px;
  background:#edf4f7;
  border:1px solid rgba(16,42,67,.07);
}
.cf-card-image.cf-image-map {
  object-fit:contain;
  padding:.35rem;
  background:#f2f7fa;
}
.cf-card h3 { margin-top:0; }
@media (max-width:900px) {
  .cf-card-image { height:190px; }
}
@media (max-width:600px) {
  .cf-card-image { height:210px; }
}

/* Three leave-a-spot cards span the full content width */
.cf-leave .cf-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
.cf-card .how-card-title-large { font-size:clamp(1.35rem,1.6vw,1.7rem); line-height:1.12; }
@media (max-width:900px) { .cf-leave .cf-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .cf-leave .cf-cards { grid-template-columns:1fr; } }

/* Consistent heading and more legible supporting copy in the three leave-a-spot cards */
.cf-leave .cf-card h3 { font-size:1.35rem; line-height:1.2; }
.cf-leave .cf-card p { font-size:1.02rem; line-height:1.65; }
@media (max-width:600px) { .cf-leave .cf-card h3 { font-size:1.3rem; } .cf-leave .cf-card p { font-size:1rem; } }
/* Make the leave-a-spot section heading read clearly as the section title */
#cf-leave-title { font-size:clamp(2.5rem,4.2vw,3.5rem); line-height:1.08; }
@media (max-width:600px) { #cf-leave-title { font-size:clamp(2.1rem,8vw,2.7rem); } }
/* Correct hierarchy: section title first, smaller supporting tagline below */
#cf-leave-title { font-size:clamp(2.5rem,4.2vw,3.5rem); line-height:1.08; }
.cf-leave-tagline { margin:.65rem 0 .5rem; font-size:clamp(1.1rem,1.8vw,1.35rem); line-height:1.4; font-weight:600; }
@media (max-width:600px) { #cf-leave-title { font-size:clamp(2.1rem,8vw,2.7rem); } .cf-leave-tagline { font-size:1.05rem; } }
/* Slightly enlarge the supporting tagline beneath the section title */
.cf-leave-tagline { font-size:clamp(1.25rem,2vw,1.5rem); }
@media (max-width:600px) { .cf-leave-tagline { font-size:1.15rem; } }
/* Search section: match the previous section's title scale and full-width three-card layout */
.cf-seek .shell { width:min(100% - 48px, 1320px); max-width:1320px; }
#cf-seek-title {
  max-width:none;
  width:100%;
  color:#102a43;
  font-size:clamp(2.5rem,4.2vw,3.5rem);
  line-height:1.08;
  text-align:center;
  margin-inline:auto;
}
.cf-seek .cf-heading > p { display:none; }
.cf-seek .cf-heading .cf-kicker { font-size:1rem; }
.cf-seek .cf-cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:1.25rem;
  width:100%;
  margin-inline:auto;
}
.cf-seek .cf-card {
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
}
.cf-seek .cf-card h3 {
  font-size:1.35rem;
  line-height:1.2;
  font-weight:750;
}
.cf-seek .cf-card p { font-size:1.02rem; line-height:1.65; }
.cf-seek .cf-card-image { height:clamp(180px,19vw,250px); }
@media (max-width:900px) {
  .cf-seek .shell { width:min(100% - 32px, 720px); }
  .cf-seek .cf-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #cf-seek-title { font-size:clamp(2.2rem,5vw,3rem); }
}
@media (max-width:600px) {
  .cf-seek .shell { width:calc(100% - 32px); }
  .cf-seek .cf-cards { grid-template-columns:1fr; }
  #cf-seek-title { font-size:clamp(2.1rem,8vw,2.7rem); }
  .cf-seek .cf-card h3 { font-size:1.3rem; }
  .cf-seek .cf-card p { font-size:1rem; }
  .cf-seek .cf-card-image { height:220px; }
}

/* Final layout pass: consistent rhythm, balanced cards and centered closing CTA */
.cf-section { padding-block:clamp(3rem,6vw,5.25rem); }
.cf-heading { text-align:center; margin:0 auto clamp(1.75rem,3vw,2.5rem); }
.cf-leave .shell { width:min(100% - 48px,1320px); max-width:1320px; }
.cf-leave .cf-cards,
.cf-seek .cf-cards { align-items:stretch; }
.cf-leave .cf-card,
.cf-seek .cf-card { box-sizing:border-box; min-width:0; }
.cf-leave .cf-card-image,
.cf-seek .cf-card-image { flex:0 0 auto; }
.cf-leave .cf-card h3,
.cf-seek .cf-card h3 { overflow-wrap:anywhere; }
.cf-bottom-cta { padding:clamp(2rem,5vw,4rem) 0; }
.cf-cta-inner {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:1.25rem;
  text-align:center;
  width:min(100% - 48px,1320px);
  margin-inline:auto;
  padding:clamp(2rem,5vw,3.5rem);
}
.cf-cta-inner > div { width:100%; }
.cf-cta-inner h2 { max-width:32ch; margin-inline:auto; }
.cf-cta-inner p { max-width:62ch; margin:.85rem auto 0; }
.cf-cta-inner .btn { align-self:center; min-width:220px; justify-content:center; }
.site-footer .footer-inner { gap:1rem; flex-wrap:wrap; }
@media (max-width:900px) {
  .cf-leave .shell { width:min(100% - 32px,720px); }
  .cf-leave .cf-card h3,
  .cf-seek .cf-card h3 { font-size:1.2rem; line-height:1.25; }
  .cf-leave .cf-card p,
  .cf-seek .cf-card p { font-size:1rem; }
}
@media (max-width:600px) {
  .cf-section { padding-block:2.75rem; }
  .cf-heading { margin-bottom:1.5rem; }
  .cf-leave .shell { width:calc(100% - 32px); }
  .cf-leave .cf-cards,
  .cf-seek .cf-cards { gap:1rem; }
  .cf-leave .cf-card,
  .cf-seek .cf-card { padding:1.1rem; }
  .cf-leave .cf-card-image,
  .cf-seek .cf-card-image { height:210px; margin-bottom:1rem; }
  .cf-bottom-cta { padding:2rem 0; }
  .cf-cta-inner { width:calc(100% - 32px); padding:1.5rem 1.15rem; gap:1.25rem; }
  .cf-cta-inner h2 { font-size:clamp(1.55rem,7vw,2rem); }
  .cf-cta-inner p { font-size:1rem; line-height:1.6; }
  .cf-cta-inner .btn { width:100%; min-width:0; }
}