.kh-band{--kh-gold: var(--kp-gold, #C9A96E);--kh-ivory: var(--kp-ivory, #F5F0E8);--kh-serif: var(--kp-serif, "Playfair Display", Georgia, serif);--kh-sans: var(--kp-sans, "Lato", -apple-system, "Segoe UI", Helvetica, sans-serif);--kh-seal: 72px;--kh-gap: clamp(14px, 1.8vw, 28px)}section.kh-band{position:relative;overflow:clip;background-image:radial-gradient(120% 72% at 50% -12%,rgba(201,169,110,.1),transparent 62%),radial-gradient(110% 62% at 50% 116%,rgba(0,0,0,.2),transparent 60%);padding-block:clamp(56px,6vw,84px)}.kh-band .kh-decor{position:absolute;top:50%;color:var(--kh-gold);opacity:.13;pointer-events:none;z-index:0;line-height:0}.kh-band .kh-decor--left{left:clamp(-96px,-6vw,-56px);transform:translateY(-50%) rotate(-14deg)}.kh-band .kh-decor--right{right:clamp(-96px,-6vw,-56px);transform:translateY(-50%) rotate(12deg) scaleX(-1)}.kh-band .kh-decor svg{width:clamp(180px,19vw,280px);height:auto}.kh-band .kh-inner{position:relative;z-index:1}.kh-band .kh-rule{display:flex;align-items:center;justify-content:center;gap:13px;max-width:300px;margin:16px auto 0}.kh-band .kh-rule:before,.kh-band .kh-rule:after{content:"";flex:1 1 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(201,169,110,.55) 34%,rgba(201,169,110,.55) 66%,transparent)}.kh-band .kh-rule__mark{flex:0 0 auto;display:grid;place-items:center;color:var(--kh-gold)}.kh-band .kh-steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kh-gap);align-items:start;counter-reset:kh-step}.kh-band .kh-steps:before{content:"";position:absolute;top:calc(var(--kh-seal) / 2);left:calc((100% - (3 * var(--kh-gap))) / 8);right:calc((100% - (3 * var(--kh-gap))) / 8);height:1px;background:linear-gradient(90deg,#c9a96e1f,#c9a96e7a 11% 89%,#c9a96e1f);z-index:0}.kh-band .kh-step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 6px;counter-increment:kh-step}.kh-band .kh-step:before{content:counter(kh-step,decimal-leading-zero);order:1;margin-bottom:9px;font-family:var(--kh-sans);font-size:9.5px;font-weight:700;letter-spacing:.24em;color:#c9a96ec7}.kh-band [class*=kh-step-title],.kh-band [class*=kh-step-desc]{order:2}.kh-band .kh-seal{position:relative;display:grid;place-items:center;width:var(--kh-seal);height:var(--kh-seal);margin-bottom:18px;border-radius:50%;background:var(--kh-band, #0a3d2e);border:1px solid rgba(201,169,110,.5);color:var(--kh-gold);transition:border-color .35s ease,box-shadow .35s ease,transform .35s ease}.kh-band .kh-seal:after{content:"";position:absolute;top:5px;right:5px;bottom:5px;left:5px;border:1px solid rgba(201,169,110,.24);border-radius:50%;pointer-events:none}.kh-band .kh-seal svg{width:26px;height:26px;stroke:var(--kh-gold)}.kh-band .kh-step:hover .kh-seal{border-color:#c9a96eeb;box-shadow:0 0 0 6px #c9a96e0f;transform:translateY(-2px)}.kh-band [class*=kh-step-title]{font-family:var(--kh-serif)!important;font-size:clamp(15px,1.25vw,18px);font-weight:400;letter-spacing:.01em;color:var(--kh-ivory);margin-bottom:7px}.kh-band [class*=kh-step-desc]{font-family:var(--kh-sans);font-size:12.5px;line-height:1.65;color:#f5f0e8ad;max-width:31ch;margin-inline:auto}@media(max-width:899px){.kh-band{--kh-seal: 58px}section.kh-band{padding-block:clamp(44px,8vw,60px)}.kh-band .kh-steps{grid-template-columns:1fr;gap:26px;max-width:520px;margin-inline:auto}.kh-band .kh-steps:before{display:none}.kh-band .kh-step:not(:last-child):after{content:"";position:absolute;left:calc(var(--kh-seal) / 2);top:var(--kh-seal);height:calc(100% - var(--kh-seal) + 26px);width:1px;background:#c9a96e6b;z-index:0}.kh-band .kh-step{display:grid;grid-template-columns:var(--kh-seal) minmax(0,1fr);column-gap:18px;align-items:start;text-align:left;padding:0}.kh-band .kh-seal{grid-column:1;grid-row:1 / span 3;margin-bottom:0}.kh-band .kh-step:before{grid-column:2;margin-bottom:5px;margin-top:6px}.kh-band [class*=kh-step-title],.kh-band [class*=kh-step-desc]{grid-column:2;margin-inline:0;max-width:none}.kh-band .kh-decor{opacity:.09}}@media(max-width:560px){.kh-band .kh-decor{display:none}.kh-band [class*=kh-step-desc]{font-size:13px}}@media(prefers-reduced-motion:reduce){.kh-band .kh-seal{transition:none}.kh-band .kh-step:hover .kh-seal{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/31/assets/kaayu-howto.css.map */
