/* Fascia · How it works section (one screen) · v1 · Oct 26 2026 */
.ob{position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box;background-color:#1B1C1C;color:#F7F7F5;font-family:'Geist',sans-serif;padding:clamp(56px,7vw,104px) clamp(20px,5vw,80px)}
.ob::before{content:"";position:absolute;left:0;right:0;top:0;aspect-ratio:1/1;min-height:100%;z-index:-1;transform:scaleY(-1);background-color:#3A3C3C;background-image:radial-gradient(120% 90% at 85% 100%,rgba(20,21,21,.85) 0%,rgba(20,21,21,0) 60%),linear-gradient(165deg,#6E7271 0%,#4E5151 38%,#2E3030 72%,#1B1C1C 100%)}
.ob-top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.ob-tag{display:inline-block;margin:0;border:2px solid #F1EFE9;border-radius:6px;padding:.45em 1.1em;font:400 clamp(10px,.9vw,13px)/1.4 'Geist Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#F1EFE9}
.ob-h{margin:14px 0 0;font:400 clamp(36px,4vw,64px)/1 Arial,Helvetica,sans-serif;letter-spacing:-.045em;color:#F7F7F5;max-width:15em}
.ob-h span{color:#C9CBCA}
.ob-cta{display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.ob-btn,.ob-btn:visited,.ob-btn:hover{display:inline-flex;align-items:center;gap:12px;height:56px;padding:0 28px;border-radius:999px;background:#E9FF90;color:#141413;text-decoration:none;font:400 17px Arial,Helvetica,sans-serif;white-space:nowrap}
.ob-sub,.ob-sub:visited{display:inline-flex;align-items:center;min-height:44px;color:#F4F4F2;text-decoration:none;font:400 15px Arial,Helvetica,sans-serif}
.ob-sub span{border-bottom:1px solid currentColor;padding-bottom:2px}
.ob-sub:hover{color:#E9FF90}
@media (max-width:900px){.ob-btn,.ob-btn:visited,.ob-btn:hover{height:50px;padding:0 24px;font-size:16px}}
.ob-grid{margin:clamp(40px,5vw,64px) 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ob-step{display:flex;flex-direction:column;gap:18px}
.ob-pane{position:relative;height:clamp(380px,34vw,500px);overflow:hidden;background:#2A2A28}
.ob-img{position:absolute;inset:0;background:#2A2A28 50% 0%/cover no-repeat}
.s1 .ob-img{background-image:url(/assets/img/fascia-how-hurts-v3.jpg)}
.s2 .ob-img{background-image:url(/assets/img/fascia-how-start-v2.jpg)}
.s3 .ob-img{background-image:url(/assets/img/fascia-how-feelgood-v2.jpg)}
.ob-glass{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0px,rgba(255,255,255,.03) 13px,rgba(0,0,0,.16) 25px,rgba(255,255,255,.22) 29px)}
.s1 .ob-glass{opacity:.7}
.s2 .ob-glass{opacity:.3}
.ob-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,15,14,0) 40%,rgba(15,15,14,.82) 100%)}
.ob-lab{position:absolute;left:16px;top:16px;padding:6px 12px;border:1.5px solid #F1EFE9;border-radius:5px;background:rgba(28,28,26,.35);color:#F1EFE9;font:400 11.5px 'Geist Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
@media (max-width:900px){.ob-lab{font-size:10px;padding:4px 9px}}
.ob-q{position:absolute;left:20px;right:20px;bottom:20px;margin:0}
.ob-k{display:block;font:900 clamp(22px,2vw,30px)/1 'Doto','Geist Mono',monospace;text-transform:uppercase;color:#A9A9A4;margin-bottom:10px}
.s3 .ob-k{color:#E9FF90}
.ob-big{display:block;font:400 clamp(30px,2.9vw,46px)/1 Arial,Helvetica,sans-serif;letter-spacing:-.04em;color:#F7F7F5}
.ob-mark{color:#141413;background:#E9FF90;padding:0 .08em}
.ob-step b{font-weight:500;font-size:18px;letter-spacing:-.02em;color:#F4F4F5}
.ob-step p{margin:6px 0 0;max-width:360px;font-size:15px;line-height:1.55;color:#C9CBCA}
.ob-foot{margin-top:28px;font:400 11.5px 'Geist Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#A9ACAB}
@media (max-width:820px){.ob-grid{grid-template-columns:1fr;gap:36px}.ob-pane{height:340px}.ob-top{align-items:flex-start}}
.ob .ob-btn{color:#141413}