/* ==========================================================================
   KREATED V2 — /method/ · PAGE-SPECIFIC
   Built on services.css + leaf.css. One component: the step, which carries a
   heading, a paragraph and a small approval/needs pair. It extends the leaf's
   `.steps` numeral rather than inventing a second numbering language.
   ========================================================================== */
.me__hero{padding-bottom:clamp(24px,2.8vw,38px)}
/* hero weight now comes from .shero__h in leaf.css — see the note there */
.me__h span{display:block;color:var(--ink-4)}

.me__steps{list-style:none;margin:0;padding:0;counter-reset:m}
.me__steps > li{counter-increment:m;position:relative;
  padding:clamp(24px,2.8vw,34px) 0 clamp(24px,2.8vw,34px) clamp(46px,5vw,76px);
  border-bottom:1px solid var(--line-faint)}
.me__steps > li:first-child{border-top:1px solid var(--line-faint)}
.me__steps > li:last-child{border-bottom:0}
.me__steps > li::before{content:counter(m,decimal-leading-zero);
  position:absolute;left:0;top:clamp(28px,3.2vw,40px);
  font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;
  font-size:clamp(14px,1.2vw,17px);line-height:1;color:rgba(237,232,222,.52)}
.me__steps h3{margin:0;font-size:clamp(22px,2.3vw,31px);font-weight:600;
  letter-spacing:-.02em;line-height:1.1;color:var(--white)}
.me__what{margin:12px 0 0;max-width:58ch;
  font-size:clamp(15.5px,1.3vw,17.5px);line-height:1.6;
  color:var(--ink-2)}

/* the approval / needs pair — quiet, factual, never a feature list */
.me__meta{margin:clamp(18px,2vw,24px) 0 0;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.2vw,34px);
  max-width:58ch}
.me__meta dt{font:600 10px/1.5 'General Sans',system-ui;letter-spacing:.2em;
  text-transform:uppercase;color:var(--accent)}
.me__meta dd{margin:6px 0 0;font-size:14.5px;line-height:1.5;
  color:var(--ink-3)}

.me__vary li{padding-left:26px}
.me__vary b{color:var(--white)}

@media (max-width:640px){
  .me__steps > li{padding-left:34px}
  .me__steps > li::before{top:26px}
  .me__meta{grid-template-columns:1fr;gap:14px}
}
