
.how-section{padding:76px 24px}.how-header{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:64px;align-items:end;margin-bottom:36px}.how-header .eyebrow{font-size:14px;letter-spacing:.2px;color:#cfb9e3;margin:0 0 18px}.how-header h2{font-size:clamp(30px,3vw,40px);font-weight:500;line-height:1.18;letter-spacing:-1.2px;margin:0 0 18px;color:#f2edf7}.how-header>div>p{font-size:16px;line-height:1.65;color:#bcb0c9;max-width:530px;margin:0}.how-principles>div{padding:14px 0;border-bottom:1px solid #58466666}.how-principles>div:first-child{padding-top:0}.how-principles>div:last-child{border:0;padding-bottom:0}.how-principles strong{font-size:15px;line-height:1.5;font-weight:500;color:#eee4f6}.how-principles p{font-size:14px;line-height:1.6;color:#bcb0c9;margin:5px 0 0}.steps-grid{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;padding:0;margin:0}.step-card{display:flex;flex-direction:column;min-width:0;border:1px solid #67547655;border-radius:14px;background:#251e2e;overflow:hidden}.step-art{position:relative;height:167px;overflow:hidden;background:#1a1522;border-bottom:1px solid #6b527d33}.step-art-inner{position:absolute;left:50%;top:0;width:600px;height:167px;transform:translateX(-50%)}.step-grid-art{position:absolute;inset:0;width:100%;height:100%}.step-tile{position:absolute;width:54px;height:54px;animation:authos-step-drift 7.4s ease-in-out var(--drift-delay) infinite}.step-tile.position-0{left:255px;top:64px;z-index:2}.step-tile.position-1{left:354px;top:20px}.step-tile.position-2{left:188px;top:129px;animation-duration:9.1s}.step-tile-face{width:54px;height:54px;border:1px solid #795e90;border-radius:7px;background:#21192b;transform:matrix(.866,-.5,.866,.5,0,0);box-shadow:-1px 1px #17111f,-2px 2px #17111f,-3px 3px #17111f,-4px 4px #17111f,-5px 5px #17111f,-6px 6px #17111f,-7px 7px #17111f,-8px 8px #17111f,-9px 9px #17111f,-10px 10px #17111f,-11px 11px #17111f,-12px 12px #17111f,-13px 13px #17111f,-14px 14px #17111f,-15px 15px #17111f,-16px 16px #17111f,-17px 17px #17111f,-18px 18px #17111f,-19px 19px #5c456e;display:flex;align-items:center;justify-content:center;color:#d5b5f6}.step-tile-face svg,.step-tile-face img{width:28px;height:28px;object-fit:contain}.step-sweep{stroke-dasharray:32 340;animation:authos-step-sweep 9s ease-in-out infinite;opacity:.5}.step-card:nth-child(2) .step-sweep{animation-delay:-2s}.step-card:nth-child(3) .step-sweep{animation-delay:-4s}.step-card:nth-child(4) .step-sweep{animation-delay:-6s}.step-copy{padding:20px 18px 23px;flex:1}.step-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.step-title h3{font-size:18px;line-height:1.35;font-weight:500;color:#f1e8f8;margin:0;letter-spacing:-.3px}.step-title>span{font-size:11px;color:#cbb7dc;background:#3b2d48;border-radius:20px;padding:4px 8px;white-space:nowrap}.step-copy>p{font-size:14px;line-height:1.65;color:#c4b6d0;margin:0}.step-footer{padding:14px 18px;border-top:1px solid #69527844;font-size:12px;line-height:1.5;color:#bda9ce;background:#2b2134;min-height:65px;display:flex;align-items:center}.founder-note{padding:36px 32px;text-align:center;background:transparent}.founder-note p{font-size:16px;line-height:1.65;color:#bcb0c9;max-width:790px;margin:0 auto 12px}.founder-note strong{font-weight:500;color:#e0d1ec}.founder-note>span{font-size:13px;color:#ac98bc}.workflow-group>.feature-row:first-child{padding-top:0}
@keyframes authos-step-drift{0%,100%{translate:0 0}50%{translate:0 -6px}}@keyframes authos-step-sweep{0%{stroke-dashoffset:80;opacity:0}20%,70%{opacity:.6}100%{stroke-dashoffset:-340;opacity:0}}
@media(max-width:1279px){.steps-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.how-header{gap:32px}.step-title h3{font-size:19px}.step-footer{min-height:0}}
@media(max-width:767px){.how-header{grid-template-columns:1fr;gap:26px;margin-bottom:28px}.how-header h2{font-size:32px}.how-principles{display:none}.steps-grid{grid-template-columns:1fr;gap:20px}.step-copy{padding:21px}.step-title h3{font-size:21px}.step-title>span{font-size:12px}.step-copy>p{font-size:16px;line-height:1.65}.step-footer{font-size:13px;padding:14px 21px}.founder-note{padding:32px 24px}.founder-note p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.step-tile,.step-sweep{animation:none}}
.how-section em{font-style:normal;color:#bfa2e2}
@media(max-width:767px){.how-section{padding:52px 20px}}
/* ReUI How it works 2 geometry: header, paired principles and 167px art panels. */
.how-header{grid-template-columns:minmax(0,1fr) 320px;gap:32px}.how-header>div:first-child{grid-column:1}.how-header-actions{display:flex;gap:10px;justify-content:flex-end;align-items:center;flex-wrap:wrap}.how-principles{grid-column:1;max-width:768px}.how-badge{display:inline-flex;align-items:center;gap:7px;font-size:13px;line-height:20px;padding:4px 10px;border-radius:20px;background:#34283e;color:#dccae9;margin-bottom:18px}.how-badge svg{width:15px;height:15px}.how-header h2{font-size:36px;line-height:40px;letter-spacing:-1px}.how-action{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:9px 13px;background:#d3b7e9;color:#261a30;border:1px solid #dac4e7;border-radius:8px;font-size:14px;line-height:1.3;white-space:nowrap}.how-action.secondary{background:#29202f;color:#d0bedf;border-color:#76608255}.how-principles>div{position:relative;padding:11px 0 11px 38px}.how-principles>div::before{content:'✓';position:absolute;left:0;top:12px;display:grid;place-items:center;width:27px;height:27px;border:1px solid #84689155;border-radius:7px;color:#c9aedf;background:#29202f}.how-principles>div:first-child{padding-top:0}.how-principles>div:first-child::before{top:1px}.how-principles>div:last-child{padding-bottom:0}.step-copy{padding:16px}.step-title{margin-bottom:10px}.step-title h3{font-size:17px}.step-title>span{font-size:11px}.step-footer{padding:14px 16px;min-height:0;background:#2b2233}.step-link{display:flex;justify-content:center;align-items:center;gap:10px;min-height:36px;width:100%;font-size:13px;border:1px solid #8b6b9a44;border-radius:7px;background:#3a2d43;color:#dfcdec}.step-link:hover{background:#493754}.steps-grid{gap:32px}
@media(min-width:1400px){.how-header{grid-template-columns:minmax(0,1fr) auto 290px;align-items:end}.how-header-actions{max-width:310px}.how-principles{grid-column:3;grid-row:1}}
@media(max-width:767px){.how-header{grid-template-columns:1fr}.how-header-actions{justify-content:flex-start}.how-header h2{font-size:32px;line-height:1.2}.how-principles{display:none}.step-copy{padding:20px}.step-title h3{font-size:20px}.step-footer{padding:14px 20px}.step-link{min-height:42px;font-size:14px}.steps-grid{gap:22px}}
/* Two balanced columns: both header blocks share the same vertical center. */
.how-header{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:56px}.how-principles{grid-column:2;grid-row:1;align-self:center;max-width:450px;justify-self:end}.how-header h2{font-size:36px;line-height:1.18}.step-title{align-items:flex-start}.step-title h3{font-size:16px;line-height:22px}.step-copy{min-height:174px}.step-copy>p{font-size:15px;line-height:24px}.how-section{max-width:1280px}
@media(max-width:767px){.how-header{grid-template-columns:1fr;gap:24px}.how-header h2{font-size:30px}.how-principles{display:none}.step-copy{min-height:0}.step-title h3{font-size:20px;line-height:26px}.step-copy>p{font-size:16px;line-height:26px}}
.founder-note{padding:56px 32px}.founder-note h2{font-size:28px;line-height:36px;font-weight:500;letter-spacing:-.6px;margin:0 0 20px}.founder-note p{max-width:760px;font-size:16px;line-height:28px}.founder-note>span{display:block;margin-top:18px}
@media(max-width:767px){.founder-note{padding:40px 24px}.founder-note h2{font-size:26px;line-height:32px}}
/* Heading, description and principles belong underneath each other. */
.how-header{display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center;margin-bottom:40px}.how-header>div:first-child{width:100%;max-width:780px}.how-header>div>p{max-width:680px;margin-left:auto;margin-right:auto}.how-principles{display:flex;flex-direction:column;align-self:center;width:100%;max-width:580px;gap:0;text-align:left}.how-principles>div{width:100%;padding:16px 0 16px 42px}.how-principles>div:first-child{padding-top:0}.how-principles>div:last-child{padding-bottom:0}.how-principles>div::before{top:17px}.how-principles>div:first-child::before{top:1px}
@media(max-width:767px){.how-header{gap:26px}.how-principles{max-width:440px}.agent-summary>div{max-width:520px}}
/* A single vertical sequence at every screen size. */
.steps-grid{grid-template-columns:minmax(0,1fr);max-width:520px;margin:0 auto;gap:24px}.step-copy{min-height:0;padding:24px}.step-title h3{font-size:20px;line-height:26px}.step-copy>p{font-size:16px;line-height:26px}.step-title>span{font-size:12px}
@media(max-width:767px){.steps-grid{gap:20px}.step-copy{padding:20px}}
/* Balanced portrait-like cards with room for the complete illustration. */
.steps-grid{max-width:440px;gap:24px}.step-art{height:210px}.step-art-inner{top:12px}.step-copy{padding:24px}.step-title{margin-bottom:12px}.step-title h3{font-size:20px;line-height:26px;letter-spacing:-.35px}.step-copy>p{font-size:16px;line-height:26px}
@media(max-width:767px){.step-art{height:200px}.step-art-inner{top:7px}.step-copy{padding:22px}}
.step-art{height:210px}.step-art-inner{top:0;height:210px}.step-grid-art{height:230px;top:-10px}.step-tile.position-0{top:76px}.step-tile.position-1{top:28px}.step-tile.position-2{top:130px}
@media(max-width:767px){.step-art{height:210px}.step-art-inner{top:0}}
.how-header{gap:0;margin-bottom:36px}.how-header>div:first-child{max-width:680px}.how-header>div>p{max-width:550px;font-size:16px;line-height:28px}.how-header h2{margin-bottom:20px;text-wrap:balance}.how-header>div>p{text-wrap:pretty}
