.collaboration-page { padding: 150px 24px 100px; background: radial-gradient(circle at 50% 5%, rgba(125,84,136,.2), transparent 28%), var(--bg); }
.collaboration-hero, .content-section, .contact-banner { width: min(var(--max), 100%); margin-inline: auto; }
.collaboration-hero { max-width: 880px; padding: 60px 0 95px; text-align: center; }
.collaboration-hero .audience { margin: 0 0 44px; }
.collaboration-hero > p:not(.kicker) { max-width: 720px; margin: 22px auto 32px; color: var(--muted); font-size: 1.1rem; }
.content-section { padding: 80px 0; border-top: 1px solid var(--line); }
.two-column { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px,8vw,120px); }
.check-list { display: grid; gap: 15px; margin: 0; padding: 0; list-style: none; }
.check-list li { position: relative; padding: 17px 18px 17px 50px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.check-list li::before { content: "✓"; position: absolute; left: 19px; color: var(--gold); }
.service-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-top: 38px; }
.service-grid article { min-height: 170px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg,#141418,#1d1d23); }
.service-grid span { color: var(--gold); font-size: .78rem; letter-spacing: .16em; }
.service-grid h3 { margin: 35px 0 0; font-size: 1.05rem; }
.service-grid p { margin: 6px 0 0; color: var(--muted); font-size: .85rem; }
.section-heading { margin-bottom: 38px; }
.process-list { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }
.process-list li { padding: 24px 20px; border-top: 1px solid rgba(230,208,164,.55); background: rgba(255,255,255,.02); }
.process-list li > span { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 28px; color: #111; background: var(--gold); border-radius: 50%; font-weight: 700; }
.process-list h3 { margin: 0 0 10px; font-size: 1rem; }
.process-list p { margin: 0; color: var(--muted); font-size: .88rem; }
.audience { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 24px; color: var(--muted); }
.audience span { color: var(--text); white-space: nowrap; }
.faq-section { max-width: 920px; }
.faq-list { margin-top: 34px; border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { position: relative; padding: 22px 52px 22px 0; cursor: pointer; font-weight: 700; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 8px; top: 17px; color: var(--gold); font-size: 1.5rem; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 760px; margin: -4px 0 24px; color: var(--muted); }
.contact-banner { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 70px; padding: 44px; border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(145deg,#141418,#1d1d23); }
.contact-banner h2 { margin: 0; }
.contact-actions { display: flex; flex-direction: column; align-items: center; flex: 0 0 auto; }
.contact-actions p { margin: 18px 0 0; color: var(--muted); font-size: .92rem; }
.contact-actions p a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1050px) { .service-grid { grid-template-columns: repeat(3,1fr); } .process-list { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 760px) { .two-column { grid-template-columns: 1fr; } .service-grid { grid-template-columns: 1fr 1fr; } .contact-banner { align-items: flex-start; flex-direction: column; } .contact-actions { align-items: flex-start; } }
@media (max-width: 580px) { .collaboration-page { padding: 118px 16px 75px; } .collaboration-hero { padding: 35px 0 70px; } .content-section { padding: 62px 0; } .service-grid, .process-list { grid-template-columns: 1fr; } .service-grid article { min-height: 130px; } .process-list li { display: grid; grid-template-columns: 42px 1fr; gap: 18px; } .process-list li > span { margin: 0; } .contact-banner { padding: 28px 22px; } .contact-banner .btn { width: 100%; text-align: center; } }