.hero-copy h1{font-size:clamp(38px,4.8vw,66px);line-height:1.14}
.hero-copy .lead{max-width:480px}
.how-intro h2{font-size:clamp(29px,3.6vw,47px);line-height:1.3;letter-spacing:-.055em}
.combination-toggle{border:0;font:inherit;font-size:14px;cursor:pointer;gap:12px}
.combination-toggle[aria-expanded=true]>span:last-child{transform:rotate(45deg)}
.combination-toggle>span:last-child{transition:transform .2s}
.combination-examples{padding-block:30px 100px;scroll-margin-top:120px}
.combination-examples[hidden]{display:none}
.combination-examples-title{font-size:28px;letter-spacing:-.04em;margin:0 0 28px}
.combination-examples-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.combination-example{padding:20px;border:1px solid #eee7f4;border-radius:22px;background:#fff}
.combination-example-photos{display:flex;align-items:center;gap:8px}
.combination-example-photos figure{margin:0;flex:1;min-width:0}
.combination-example-photos img,.combination-example-photos [data-photo]{width:100%;aspect-ratio:1.25;object-fit:cover;border-radius:12px;display:block;overflow:hidden}
.combination-example-photos [data-photo] svg{width:100%;height:100%;display:block}
.combination-example-photos figcaption{margin-top:8px;font-size:11px;color:#82758f}
.combination-plus{font-size:20px;color:#9c77de;flex:none}
.combination-example h3{font-size:19px;line-height:1.45;letter-spacing:-.04em;margin:22px 0 10px}
.combination-example-saving{color:#7548d6;font-size:15px}
.combination-example p{font-size:13px;color:#81768d;line-height:1.85;margin:14px 0 0}
.role-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.role-card .role-text{max-width:68%}
.role-card .role-text h3{font-size:clamp(22px,2.6vw,34px)}
.roles-title h2{font-size:clamp(30px,3.8vw,51px);line-height:1.3}

.participation-details{background:#fff}
.participation-mate{background:#f1f6ff}
.participation-label{display:block;color:#7950e6;font-size:13px;font-weight:750;margin-bottom:18px}
.participation-details h2{font-size:clamp(30px,3.8vw,50px);line-height:1.3;letter-spacing:-.055em;margin:0}
.participation-lead{max-width:800px;color:#80748d;font-size:16px;line-height:1.9;margin:25px 0 35px}
.participation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;margin-bottom:35px}
.participation-grid article{border-top:1px solid #e6dff0;padding-top:22px}
.participation-grid h3{font-size:20px;line-height:1.5;letter-spacing:-.04em;margin:0 0 12px}
.participation-grid p{font-size:14px;color:#80748d;line-height:1.85;margin:0}
.participation-mate .participation-label{color:#315cce}
.participation-mate .pill-button{background:#315cce}
@media(max-width:800px){.combination-examples-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.participation-grid{gap:20px}.role-card .role-text{max-width:78%}.role-card .role-text p{font-size:12px}}
@media(max-width:520px){.hero-copy h1{font-size:clamp(31px,8vw,44px)}.combination-examples{padding-block:0 55px}.combination-examples-grid,.participation-grid,.role-grid{grid-template-columns:1fr}.combination-examples-title{font-size:25px}.combination-example{padding:18px}.role-card{height:380px}.role-card .role-text{max-width:70%}.role-card .role-text h3{font-size:28px}.role-card .role-text p{font-size:14px}.participation-lead{font-size:14px}.participation-grid h3{font-size:20px}.participation-grid{gap:26px}}
.role-card{height:320px}
.role-card::before{background:linear-gradient(90deg,var(--role-bg) 0%,transparent 75%)}
.role-card .role-text{max-width:49%;margin:28px 0 0 28px}
.role-card .role-text h3{font-size:28px;line-height:1.25;letter-spacing:-.045em;margin:12px 0}
.role-card .role-text p{font-size:13px;line-height:1.65;font-weight:500;word-break:keep-all}
.role-portrait{position:absolute;right:0;bottom:0;width:52%;aspect-ratio:1;overflow:hidden}
.role-card .role-portrait .person{top:0;bottom:auto;width:300%;height:auto;clip-path:none}
.role-card .role-portrait .person-second{left:-100%}
.role-card .role-portrait .person-third{left:-200%}
.role-card>a{left:28px;bottom:26px;font-size:12px}
.js .app-preview.phones-visible .phone-stage{transform:none}
.app-preview .phone-side-left{transform:rotate(-5.71deg);filter:none}
.app-preview .phone-stage .phone-side-left .phone-created{display:flex;justify-content:center;align-items:center;width:100%;margin-top:10px;padding:9px 6px;border-radius:10px;background:#7044ce;color:#fff;font-size:12px;font-weight:800;line-height:1.4;letter-spacing:0;box-shadow:0 3px 9px rgba(76,44,140,.14)}
.app-preview .phone-side-left .phone-top strong{font-size:20px;font-weight:850}
.app-preview .phone-side-left .phone-screen>h3{font-size:13px;line-height:1.5}
.app-preview .phone-side-left .phone-search{font-size:11px;color:#5d5668}
@keyframes createdPhoneIn{from{opacity:0;transform:translate(-12px,12px) rotate(-8deg) scale(.96)}to{opacity:1;transform:rotate(-5.71deg)}}
@media(prefers-reduced-motion:reduce){.js .app-preview .phone-stage .phone-side-left{transform:rotate(-5.71deg)!important}}
@media(min-width:1101px){.app-preview .phone-stage .phone-side-left{left:-8%}}
@media(max-width:800px){.app-preview .phone-stage .phone-side-left,.js .app-preview.phones-visible .phone-stage .phone-side-left{transform:rotate(-5.71deg)}.app-preview .phone-stage .phone-side-left .phone-feature-photo{height:130px}.app-preview .phone-stage .phone-side-left .phone-mini-row{height:58px}}
.app-preview .phone-stage .phone-side-left .phone-screen{display:flex;flex-direction:column;padding-bottom:18px}
.app-preview .phone-stage .phone-side-left .phone-screen>*{flex-shrink:0}
.app-preview .phone-stage .phone-side-left .phone-feature-photo{position:relative;width:100%;height:auto;aspect-ratio:3/2;margin-top:12px;border-radius:10px;overflow:hidden}
.app-preview .phone-side-left .phone-feature-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:none;transform:none}
.app-preview .phone-stage .phone-side-left .phone-mini-row{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}
.app-preview .phone-photo-tile{position:relative;min-width:0;aspect-ratio:4/3;margin:0;border-radius:9px;overflow:hidden;background:#f5f3ef}
.app-preview .phone-photo-tile img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.app-preview .phone-photo-label{position:absolute;bottom:6px;left:6px;padding:3px 6px;border-radius:5px;background:rgba(255,255,255,.95);color:#332b3e;font-size:9px;font-weight:750;line-height:1.25}
.app-preview .phone-stage .phone-side-left .phone-created{margin-top:auto}
@media(min-width:521px) and (max-width:900px){.role-card{height:380px}.role-card .role-text{max-width:calc(100% - 48px);margin:24px 24px 0}.role-card .role-text h3{font-size:25px}.role-card .role-text p{font-size:12px;max-width:250px}.role-portrait{width:70%;max-width:250px}.role-card>a{left:20px;bottom:20px;font-size:11px}}
@media(max-width:520px){.role-card{height:420px}.role-card .role-text{max-width:calc(100% - 48px);margin:24px 24px 0}.role-card .role-text h3{font-size:27px}.role-card .role-text p{font-size:13px;max-width:290px}.role-portrait{width:70%;max-width:265px}.role-card>a{left:22px;bottom:22px;font-size:11px}}

.role-card .role-text h3 .role-pro-title{color:#ef604e}