/* The first scroll follows the approved Alinix homepage concept. */
.home-overview, .home-feature, .home-work, .home-method, .home-people, .home-book { padding: clamp(82px, 9vw, 120px) 0; scroll-margin-top: 68px; }
.home-overview, .home-people { background: #fffdf9; }
.home-overview .home-section-head { margin-bottom: 62px; }
.home-section-head { grid-template-columns: .75fr 1.25fr; gap: clamp(40px, 6vw, 70px); align-items: start; }
.home-section-head h2, .home-people h2, .home-feature h2, .home-book h2 { font-size: clamp(42px, 5vw, 72px); line-height: .98; letter-spacing: -.055em; }
.home-section-head > p { max-width: 680px; margin-top: 34px; font-size: clamp(17px, 1.6vw, 21px); }
.home-overview .home-eyebrow { color: #15111d; }
.home-service-list { border-top: 1px solid rgba(21,17,29,.15); }
.home-service-item { border-bottom: 1px solid rgba(21,17,29,.15); }
.home-service-toggle { display: grid; grid-template-columns: 84px minmax(220px, .8fr) minmax(320px, 1.2fr) 45px; gap: 24px; align-items: center; width: 100%; min-height: 116px; padding: 25px 0; border: 0; color: #15111d; background: transparent; text-align: left; font-family: Montserrat, sans-serif; cursor: pointer; }
.home-service-toggle:hover .home-service-name, .home-service-toggle[aria-expanded="true"] .home-service-name { color: #7829ec; }
.home-service-num { color: #716b78; font-size: 11px; font-weight: 700; letter-spacing: .17em; }
.home-service-name { font-size: clamp(20px, 2.2vw, 31px); font-weight: 700; line-height: 1.18; letter-spacing: -.04em; transition: color .2s ease; }
.home-service-summary { max-width: 34ch; color: #716b78; font-size: 15px; line-height: 1.5; }
.home-service-arrow { justify-self: end; font-size: 26px; font-weight: 500; transition: transform .2s ease; }
.home-service-toggle[aria-expanded="true"] .home-service-arrow { transform: rotate(45deg); color: #7829ec; }
.home-service-detail { display: grid; grid-template-columns: 84px minmax(220px, .8fr) minmax(320px, 1.2fr) 45px; gap: 24px; padding: 0 0 34px; }
.home-service-detail:not(.open) { display: none; }
.home-service-detail > p, .home-service-detail > a { grid-column: 3 / 4; }
.home-service-detail > p { margin: 0; color: #716b78; font-size: 15px; line-height: 1.65; }
.home-service-detail > a { justify-self: start; margin-top: -8px; }
.home-services-tail { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 26px; align-items: center; margin-top: 28px; }
.home-services-tail p { margin: 0; color: #716b78; font-size: 15px; }

.home-feature { overflow: hidden; color: #fff; background: #4e7bec; }
.home-feature-grid { display: grid; grid-template-columns: minmax(0, .83fr) minmax(460px, 1.17fr); gap: clamp(35px, 5vw, 70px); align-items: center; }
.home-feature-copy, .home-product-art { min-width: 0; }
.home-feature .home-eyebrow { color: rgba(255,255,255,.82); }
.home-feature h2 { max-width: 650px; margin: 0 0 24px; }
.home-feature-copy > p:not(.home-eyebrow) { max-width: 600px; margin: 0; color: rgba(255,255,255,.86); font-size: clamp(17px, 1.5vw, 19px); line-height: 1.65; }
.home-feature-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.home-feature-actions .home-pill { min-height: 48px; }
.home-product-art { width: min(100%, 760px); margin-inline: auto; filter: drop-shadow(0 26px 42px rgba(17, 31, 80, .27)); }
.home-product-art img { display: block; width: 100%; height: auto; }

.home-work { color: #fff; background: #15111d; }
.home-work .home-eyebrow { color: #fff; }
.home-work .home-section-head > p { color: rgba(255,255,255,.62); }
.home-work-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.home-project { display: flex; flex-direction: column; justify-content: space-between; min-height: 440px; padding: 34px; border-radius: 24px; overflow: hidden; position: relative; isolation: isolate; color: #fff; text-decoration: none; transition: transform .2s ease; }
.home-project:hover { transform: translateY(-5px); }
.home-project::before { content: ''; position: absolute; z-index: -1; width: 260px; height: 260px; top: -70px; right: -60px; border: 40px solid rgba(255,255,255,.14); border-radius: 44% 56% 48% 52%; transform: rotate(22deg); }
.home-project-apprentice { grid-column: span 7; background: linear-gradient(145deg, #5d85ed, #7548e9); }
.home-project-employii { grid-column: span 5; background: linear-gradient(145deg, #251b33, #6c37bb); }
.home-project-botanic { grid-column: span 5; background: #0a897d; }
.home-project-bonlec { grid-column: span 7; color: #1b1623; background: #f2cb38; }
.home-project-next { grid-column: span 7; background: #6921be; }
.home-work-next { display: inline-flex; margin-top: 30px; padding-bottom: 7px; border-bottom: 1px solid rgba(255,255,255,.6); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.home-work-next:hover { border-color: #fff; }
.home-project-meta { font-size: 11px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; opacity: .75; }
.home-project h3 { max-width: 550px; margin: 0 0 10px; font-size: clamp(30px, 3.5vw, 52px); line-height: 1; letter-spacing: -.045em; }
.home-project p { max-width: 530px; margin: 0; font-size: 15px; line-height: 1.6; opacity: .82; }
.home-project-link { display: inline-block; margin-top: 18px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

.home-method { background: #f5f2ec; }
.home-method .home-section-head { display: block; margin-bottom: clamp(52px, 7vw, 78px); }
.home-method .home-section-head > p { max-width: 760px; margin-top: 22px; }
.home-roadmap { padding-bottom: 34px; border-top: 1px solid #d7d0dc; border-bottom: 1px solid #d7d0dc; }
.home-roadmap-captions { display: flex; justify-content: space-between; gap: 20px; padding-top: 20px; color: #655d68; font-size: 10px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.home-roadmap-captions span:last-child { text-align: right; }
.home-roadmap-track { position: relative; height: 170px; margin-top: 8px; }
.home-roadmap-track svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.home-roadmap-track path { fill: none; stroke: #7829ec; stroke-width: 5; stroke-linecap: round; }
.home-roadmap-nodes { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; justify-items: center; }
.home-roadmap-nodes span { display: grid; place-items: center; width: 74px; height: 74px; border: 8px solid #f5f2ec; border-radius: 50%; color: #fff; background: #18111f; box-shadow: 0 0 0 2px #7829ec; font-size: 16px; font-weight: 700; }
.home-roadmap-nodes span:nth-child(2) { background: #7829ec; }
.home-roadmap-nodes span:nth-child(3) { background: #4e7bec; box-shadow: 0 0 0 2px #4e7bec; }
.home-roadmap-phases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.home-roadmap-phases li { min-width: 0; padding: 8px clamp(18px, 3vw, 34px) 0; border-right: 1px solid #d7d0dc; }
.home-roadmap-phases li:first-child { padding-left: 0; }
.home-roadmap-phases li:last-child { padding-right: 0; border-right: 0; }
.home-roadmap-mobile-number { display: none; }
.home-roadmap-phases h3 { margin: 0 0 10px; font-size: clamp(29px, 3.7vw, 42px); line-height: 1.05; letter-spacing: -.055em; }
.home-roadmap-phases p { max-width: 31ch; margin: 15px 0 0; color: #655d68; font-size: 14px; line-height: 1.65; }
.home-roadmap-phases .home-roadmap-lead { margin: 0; color: #1e1727; font-size: 15px; font-weight: 600; line-height: 1.5; }
.home-roadmap-output { margin-top: 30px; padding-top: 17px; border-top: 1px solid #d7d0dc; }
.home-roadmap-output span { display: block; margin-bottom: 8px; color: #7829ec; font-size: 10px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.home-roadmap-output strong { display: block; max-width: 24ch; font-size: 13px; line-height: 1.5; }
.home-method-principle { display: flex; align-items: center; gap: 16px; margin: 54px 0 0; padding: 18px 22px; color: #655d68; background: #eae5ec; font-size: 14px; line-height: 1.5; }
.home-method-principle > span:first-child { flex: none; color: #7829ec; font-size: 27px; line-height: 1; }
.home-method-principle strong { color: #1e1727; }

.home-people { overflow: hidden; }
.home-people-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px, 7vw, 80px); align-items: start; }
.home-people h2 { max-width: 550px; margin: 0 0 22px; }
.home-people-lead { max-width: 500px; margin: 0 0 26px; color: #716b78; font-size: 18px; line-height: 1.65; }
.home-founders { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.home-founder { padding: 26px; border-top: 1px solid rgba(21,17,29,.15); }
.home-portrait { display: grid; place-items: center; aspect-ratio: 4 / 5; margin-bottom: 24px; overflow: hidden; border-radius: 18px; background: linear-gradient(150deg, #d5e4e8, #b5cbd2); }
.home-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
.home-portrait-cameron { background: linear-gradient(150deg, #e7e0d9, #cbc3d3); }
.home-portrait-cameron span { color: #6b4f82; font-size: clamp(72px, 11vw, 150px); font-weight: 700; letter-spacing: -.08em; }
.home-founder h3 { margin: 0 0 7px; font-size: 27px; }
.home-founder p { margin: 0; color: #716b78; font-size: 14px; line-height: 1.65; }

.home-book { background: radial-gradient(circle at 85% 20%, rgba(63,154,255,.8), transparent 35%), linear-gradient(135deg, #38106d, #7926e9 55%, #bd28d7); }
.home-book h2 { margin: 0; }

@media (max-width: 1000px) {
  .home-feature-grid, .home-people-grid { grid-template-columns: minmax(0, 1fr); }
  .home-feature-grid { gap: 36px; }
  .home-feature h2 { max-width: none; font-size: clamp(36px, 5.2vw, 50px); }
}
@media (max-width: 960px) {
  .home-section-head { grid-template-columns: 1fr; gap: 20px; }
  .home-section-head > p { margin-top: 0; }
  .home-overview h2 { font-size: clamp(36px, 5vw, 42px); }
  .home-service-toggle, .home-service-detail { grid-template-columns: 48px minmax(160px, .85fr) minmax(190px, 1.15fr) 30px; gap: 16px; }
}
@media (max-width: 760px) {
  .home-overview, .home-feature, .home-work, .home-method, .home-people, .home-book { padding: 82px 0; }
  .home-section-head { grid-template-columns: 1fr; gap: 18px; margin-bottom: 42px !important; }
  .home-section-head > p { margin-top: 0; }
  .home-service-toggle { grid-template-columns: 38px 1fr 30px; gap: 12px; min-height: 100px; }
  .home-service-summary { display: none; }
  .home-service-name { font-size: 22px; }
  .home-service-detail { grid-template-columns: 38px 1fr 30px; gap: 12px; }
  .home-service-detail > p, .home-service-detail > a { grid-column: 2 / 4; }
  .home-work-grid { grid-template-columns: 1fr; gap: 18px; }
  .home-project { grid-column: auto; min-height: 360px; }
  .home-roadmap { padding-bottom: 0; border-bottom: 0; }
  .home-roadmap-captions, .home-roadmap-track { display: none; }
  .home-roadmap-phases { display: block; margin-top: 28px; }
  .home-roadmap-phases li { position: relative; margin-left: 21px; padding: 0 0 38px 42px; border-right: 0; border-left: 2px solid #d7d0dc; }
  .home-roadmap-phases li:first-child { padding-left: 42px; }
  .home-roadmap-phases li:last-child { padding-right: 0; border-left-color: transparent; }
  .home-roadmap-mobile-number { position: absolute; top: 0; left: -23px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: #fff; background: #7829ec; font-size: 12px; font-weight: 700; }
  .home-roadmap-phases li:first-child .home-roadmap-mobile-number { background: #18111f; }
  .home-roadmap-phases li:last-child .home-roadmap-mobile-number { background: #4e7bec; }
  .home-roadmap-phases h3 { padding-top: 3px; }
  .home-roadmap-output { margin-top: 18px; }
  .home-method-principle { margin-top: 14px; }
  .home-people-grid { gap: 44px; }
  .home-book-grid { gap: 34px; }
}
@media (max-width: 600px) {
  .home-feature h2 { font-size: clamp(38px, 10vw, 50px); }
  .home-product-art { position: relative; left: 50%; width: min(130vw, 560px); max-width: none; margin: 0; transform: translateX(-50%); }
  .home-founders { grid-template-columns: 1fr; }
  .home-founder { padding: 24px 0; }
  .home-portrait { max-height: 380px; }
}
@media (max-width: 430px) { .home-project { padding: 28px; } }
