/* Главная: утверждённый вариант блока «Как я работаю». */
.how-section{padding:clamp(64px,7vw,120px) 0}
.how-section h2{font-size:clamp(42px,4.5vw,76px);line-height:1.06;letter-spacing:-.055em;font-weight:300;margin:0}
.how-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.how-about{flex-shrink:0;display:grid;place-items:center;width:52px;height:52px;border:1px solid currentColor;border-radius:50%;color:inherit;font-size:27px;line-height:1;transition:background .2s,color .2s}
.how-about:hover{background:var(--ink);color:white;text-decoration:none}
.how-item{min-width:0}
.how-item h3{font-size:clamp(23px,2vw,32px);line-height:1.2;letter-spacing:-.035em;font-weight:300;margin:0}
.how-item h3 b{font-weight:500}
.how-item p{font-size:15px;line-height:1.75;margin:0;color:var(--ink-2)}
.how-number{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums}
.how-mosaic{background:#e9edf3}
.how-mosaic .how-heading{align-items:center;margin-bottom:44px}
.how-mosaic .how-items{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.how-mosaic .how-item{position:relative;display:flex;flex-direction:column;align-items:flex-start;grid-column:span 4;padding:clamp(25px,2.8vw,44px);border-radius:6px;background:#fff;overflow:hidden}
.how-mosaic .how-number{color:#748099;margin-bottom:40px;position:relative;z-index:1}
.how-mosaic .how-item h3{position:relative;z-index:1;margin-bottom:20px;max-width:15em}
.how-mosaic .how-item p{position:relative;z-index:1;margin-top:auto}
.how-mosaic .how-item--01{grid-column:span 5;background:#20232c;color:#fff}
.how-mosaic .how-item--01 p{color:#c6ccd9}
.how-mosaic .how-item--01 .how-number{color:#9fa9c0}
.how-mosaic .how-item--02{grid-column:span 7;background:#4b61dc;color:#fff}
.how-mosaic .how-item--02 p{color:#f1f3ff;max-width:44em}
.how-mosaic .how-item--02 .how-number{color:#d2d9ff}
.how-mosaic .how-item--02 h3{font-size:clamp(28px,3vw,46px);max-width:11em;margin-bottom:26px}
.how-mosaic .how-item--02::after{content:"";position:absolute;width:220px;height:220px;right:-76px;top:-90px;border:1px solid #ffffff30;border-radius:50%;box-shadow:0 0 0 28px #ffffff0a,0 0 0 56px #ffffff08;pointer-events:none}
.how-mosaic .how-item--04{background:#dce2ff}
.how-mosaic .how-item--04 .how-number{color:#5267a8}
.how-mosaic .how-item--04 h3{font-size:clamp(27px,2.5vw,40px);max-width:9em}
.how-mosaic .how-item--06{grid-column:span 5;background:transparent;border:1px solid #c5cdda}
.how-mosaic .how-item--07{grid-column:span 7;background:#262b65;color:#fff}
.how-mosaic .how-item--07 p{color:#d5daf2;max-width:45em}
.how-mosaic .how-item--07 .how-number{color:#adb8ec}

@media(min-width:1700px){.how-section .how-item p{font-size:16px}}
@media(max-width:1100px){
  .how-mosaic .how-item{grid-column:span 6}
  .how-mosaic .how-item--02{grid-column:span 6}
  .how-mosaic .how-item--07{grid-column:1/-1}
}
@media(max-width:640px){
  .how-section h2{font-size:42px;max-width:7em}
  .how-about{width:44px;height:44px}
  .how-mosaic .how-heading{margin-bottom:30px}
  .how-mosaic .how-items{grid-template-columns:minmax(0,1fr);gap:12px}
  .how-mosaic .how-item{grid-column:1;padding:28px}
  .how-mosaic .how-number{margin-bottom:30px}
  .how-mosaic .how-item h3{font-size:28px;margin-bottom:18px}
  .how-mosaic .how-item--02 h3,.how-mosaic .how-item--04 h3{font-size:34px}
  .how-mosaic .how-item p{font-size:14px;line-height:1.75}
}
@media(prefers-reduced-motion:reduce){.how-about{transition:none}}