/* Editorial service panels, aligned project choices, and the aaf77df FAQ rhythm. */
.feature-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; }
.feature-card { grid-column: span 7; grid-template-columns: minmax(0, 1fr) 160px; grid-template-rows: auto 1fr auto; gap: 24px; padding: 30px 34px 20px; min-height: 266px; border-radius: 18px; background: #fcfaff; border-color: #e0d8eb; }
.feature-card:nth-child(2), .feature-card:nth-child(3) { grid-column: span 5; grid-template-columns: minmax(0, 1fr) 116px; }
.feature-card .service-number { grid-column: 1; grid-row: 1; letter-spacing: .14em; font-size: 10px; color: #827093; }
.feature-card .service-copy { grid-column: 1; grid-row: 2; align-self: start; }
.feature-card .service-copy h3 { font-size: clamp(28px, 2.9vw, 38px); line-height: 1.04; letter-spacing: -.045em; margin-bottom: 14px; }
.feature-card .service-copy p { max-width: 285px; font-size: 14px; line-height: 1.55; color: #796888; }
.feature-card .service-diagram { grid-column: 2; grid-row: 1 / 3; align-self: center; justify-self: end; width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 0; background: transparent; color: #8e73c5; }
.feature-card .service-diagram svg { width: 100%; height: 100%; overflow: visible; transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.diagram-wire { stroke: #c0afd9; }
.diagram-tile { fill: #f8f4ff; stroke: #c8b6e3; }
.diagram-core { fill: #7450cf; stroke: #7450cf; }
.diagram-star { fill: #f3ebff; stroke: #f3ebff; }
.software-card .diagram-star, .web-card .diagram-star { fill: none; }
.feature-card .service-action { grid-column: 1 / -1; grid-row: 3; display: flex; align-items: center; padding: 14px 0 0; min-height: 46px; border-color: #e1d6ee; color: #613da5; font-size: 12px; font-weight: 500; }
.automation-card { background: #443064; border-color: #443064; color: #fff; }
.automation-card .service-copy p, .automation-card .service-number { color: #d6c8e9; }
.automation-card .service-action { border-color: #ffffff26; color: #f3eaff; }
.automation-card .service-diagram { color: #dfcffa; }
.automation-card .diagram-wire { stroke: #b19acb; }
.automation-card .diagram-tile { fill: #513b73; stroke: #9675ba; }
.automation-card .diagram-core { fill: #d4bdff; stroke: #d4bdff; }
.automation-card .diagram-star { fill: #573488; stroke: #573488; }
.software-card { background: #eae2f5; border-color: #e0d6ed; }
.feature-card:hover, .feature-card:focus-within { translate: 0 -3px; box-shadow: none; }
.feature-card:hover .service-diagram svg, .feature-card:focus-within .service-diagram svg { transform: translateY(-3px); }

/* Restore the older two-column introduction + unboxed accordion. */
.faq-section { display: grid; grid-template-columns: 1fr 1.1fr; gap: 60px; align-items: start; }
.faq-heading.faq-intro { display: flex; flex-direction: column; align-items: flex-start; gap: 0; margin: 0; }
.faq-intro .section-index { margin-bottom: 30px; font-size: 12px; }
.faq-intro .section-title { font-size: clamp(36px, 3.8vw, 52px); line-height: 1.04; margin: 0; }
.faq-list { border: 0; border-top: 1px solid #d9cde5; border-radius: 0; background: transparent; padding: 0; }
.faq-list details, .faq-list details:last-child { border-bottom: 1px solid #d9cde5; }
.faq-list summary { min-height: 72px; padding: 22px 0; font-size: 16px; font-weight: 400; gap: 20px; }
.faq-list summary > span { width: 24px; height: 24px; border: 1px solid #cebee0; background: transparent; color: #9778b8; transition: transform .25s; }
.faq-list details[open] summary > span { transform: rotate(45deg); }
.faq-list details[open] summary > span::after { transform: rotate(90deg); }
.faq-list details > p { font-size: 14px; line-height: 1.8; padding: 0 35px 22px 0; color: #82708f; }

@media (max-width: 1000px) {
  .feature-card, .feature-card:nth-child(2), .feature-card:nth-child(3) { grid-column: span 6; grid-template-columns: minmax(0, 1fr) 110px; padding: 26px 26px 18px; gap: 20px; }
  .feature-card .service-copy { grid-column: 1 / -1; }
  .feature-card .service-diagram { grid-row: 1; width: 90px; height: 54px; aspect-ratio: auto; margin: -10px 0 -10px; }
  .feature-card .service-copy h3 { font-size: 30px; }
  .faq-section { gap: 40px; }
}
@media (max-width: 760px) {
  .feature-grid { gap: 14px; }
  .feature-card, .feature-card:nth-child(2), .feature-card:nth-child(3) { grid-template-columns: minmax(0, 1fr) 80px; padding: 24px 22px 16px; gap: 20px 14px; min-height: 258px; }
  .feature-card .service-copy h3 { font-size: 28px; }
  .feature-card .service-copy p { font-size: 13px; }
  .feature-card .service-diagram { align-self: center; margin-top: -10px; }
  .faq-section { grid-template-columns: 1fr; gap: 30px; }
  .faq-intro .section-index { margin-bottom: 22px; font-size: 11px; }
  .faq-intro .section-title { font-size: 40px; }
  .faq-list summary { font-size: 15px; }
}
@media (max-width: 600px) {
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card, .feature-card:nth-child(2), .feature-card:nth-child(3) { grid-column: 1; grid-template-columns: minmax(0, 1fr) 100px; min-height: 236px; }
  .feature-card .service-copy h3 { font-size: 30px; }
  .feature-card .service-diagram { align-self: center; margin-top: -10px; }
  .faq-intro .section-title { font-size: clamp(30px, 9vw, 40px); }
}
@media (max-width: 375px) {
  .feature-card, .feature-card:nth-child(2), .feature-card:nth-child(3) { grid-template-columns: minmax(0, 1fr) 76px; padding-inline: 20px; }
  .feature-card .service-copy h3 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .feature-card:hover, .feature-card:focus-within { translate: none; }
  .feature-card:hover .service-diagram svg, .feature-card:focus-within .service-diagram svg { transform: none; }
}

/* Three distinct project covers within one quiet brand palette. */
.pricing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; border: 0; border-radius: 0; overflow: visible; background: transparent; align-items: stretch; }
.price-card { display: flex; flex-direction: column; gap: 0; padding: 26px 30px 28px; min-height: 430px; border: 1px solid #ddd3e9; border-radius: 20px; background: #fcfaff; color: var(--ink); transition: border-color .25s, translate .25s; }
.price-card:last-child { background: #eae2f4; }
.price-card.featured { background: #503477; border-color: #503477; color: #fff; }
.plan-topline { display: flex; align-items: center; gap: 18px; color: #8d77a2; }
.plan-index { font-size: 10px; letter-spacing: .14em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.plan-rule { height: 1px; flex: 1; background: #ddd2e9; }
.featured .plan-topline { color: #d3c2eb; }
.featured .plan-rule { background: #b59ad42e; }
.plan-art { width: 100%; height: 136px; display: grid; place-items: center; margin: 20px 0 26px; color: #9878c6; }
.plan-art svg { display: block; width: min(100%, 260px); height: 100%; overflow: visible; stroke-linecap: round; stroke-linejoin: round; }
.plan-guide { stroke: #b8a4cd; stroke-width: 1; stroke-dasharray: 2 5; opacity: .45; }
.plan-line { stroke: #c7b4df; stroke-width: 1.4; }
.launch-back { stroke: #baa4d5; fill: #e4d9f3; stroke-width: 1; }
.plan-glass { stroke: #bda6d7; fill: #fffdfd; stroke-width: 1.2; }
.plan-solid { fill: #a483d4; }
.plan-cursor { fill: #8056c6; stroke: #f5efff; stroke-width: 2; }
.plan-spark { fill: #a482d5; }
.plan-art-automate { color: #f2eaff; }
.plan-art-automate .plan-guide { stroke: #af92d5; opacity: .35; }
.loop-under { stroke: #b79bd0; stroke-width: 15; opacity: .16; }
.loop-light { stroke: #d9c5f6; stroke-width: 1.7; }
.loop-dot { fill: #f4eaff; stroke: #b9a0d1; stroke-width: 3; }
.scale-base { fill: #d4c4e7; stroke: #b9a0d3; stroke-width: 1; }
.scale-mid { fill: #b79bd8; stroke: #a182c2; stroke-width: 1; }
.scale-top { fill: #7954b1; stroke: #7954b1; stroke-width: 1; }
.scale-inset { fill: #e5d7fa; stroke: #f5edff; stroke-width: 1; }
.plan-lift, .scale-middle { transform-box: fill-box; transform-origin: center; transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.price-card:hover .plan-lift, .price-card:focus-within .plan-lift { transform: translateY(-5px); }
.price-card:hover .scale-middle, .price-card:focus-within .scale-middle { transform: translateY(-2px); }
.price-card h3 { margin: 0 0 14px; font-size: clamp(36px, 3.6vw, 48px); font-weight: 500; letter-spacing: -.045em; line-height: 1; }
.price-card p { max-width: 275px; margin: 0 0 28px; color: #7b688a; font-size: 14px; line-height: 1.6; }
.price-card.featured p { color: #ddcfec; }
.price-card .text-button { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 48px; margin-top: auto; padding: 10px 16px 10px 18px; border: 1px solid #d7c8e8; border-radius: 999px; background: transparent; color: #61418a; font-size: 13px; font-weight: 500; text-decoration: none; transition: background .2s, border-color .2s; }
.price-card .text-button svg { width: 17px; height: 17px; }
.price-card .text-button:hover { background: #f2eafb; border-color: #af91d0; }
.price-card.featured .text-button { background: #f4ecff; border-color: #f4ecff; color: #503477; }
.price-card.featured .text-button:hover { background: #fff; border-color: #fff; }
.price-card:hover, .price-card:focus-within { translate: 0 -3px; box-shadow: none; border-color: #b39aca; }
.price-card.featured:hover, .price-card.featured:focus-within { border-color: #9f7dc7; }

.faq-heading.faq-intro .faq-cubi { width: 156px; height: 156px; margin: 24px 0 -4px -5px; }
.faq-cubi img { animation: cubi-focus 7s ease-in-out infinite; }

@media (max-width: 1000px) {
  .pricing-grid { gap: 14px; }
  .price-card { padding: 22px; min-height: 402px; }
  .plan-art { height: 112px; margin: 18px 0 24px; }
  .price-card h3 { font-size: 38px; }
  .price-card p { font-size: 14px; }
}
@media (max-width: 760px) {
  .pricing-grid { grid-template-columns: 1fr; gap: 16px; }
  .price-card { display: grid; grid-template-columns: minmax(0, 1fr) 128px; grid-template-rows: auto auto auto auto; column-gap: 20px; min-height: 0; padding: 24px; }
  .plan-topline { grid-column: 1; grid-row: 1; margin-bottom: 22px; }
  .plan-art { grid-column: 2; grid-row: 1 / 4; width: 128px; height: 106px; margin: 0; align-self: center; }
  .price-card h3 { grid-column: 1; grid-row: 2; font-size: 38px; margin-bottom: 14px; }
  .price-card p { grid-column: 1; grid-row: 3; margin: 0 0 22px; max-width: 330px; }
  .price-card .text-button { grid-column: 1 / -1; grid-row: 4; min-height: 46px; }
  .faq-heading.faq-intro { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 0 16px; align-items: center; }
  .faq-intro .section-index { grid-column: 1 / -1; }
  .faq-intro .section-title { grid-column: 1; font-size: clamp(30px, 5.4vw, 40px); }
  .faq-heading.faq-intro .faq-cubi { grid-column: 2; grid-row: 2; justify-self: end; width: 112px; height: 112px; margin: 0; }
}
@media (max-width: 480px) {
  .price-card { grid-template-columns: minmax(0, 1fr) 92px; padding: 23px; gap: 0 14px; }
  .plan-topline { margin-bottom: 24px; }
  .plan-art { grid-row: 1 / 3; width: 92px; height: 80px; align-self: start; margin-top: 6px; }
  .price-card h3 { font-size: 36px; }
  .price-card p { grid-column: 1 / -1; max-width: 290px; margin-bottom: 23px; }
  .faq-heading.faq-intro { grid-template-columns: minmax(0, 1fr) 72px; gap: 0 10px; }
  .faq-intro .section-title { font-size: clamp(28px, 7.1vw, 34px); }
  .faq-heading.faq-intro .faq-cubi { width: 84px; height: 84px; }
}
@media (max-width: 375px) {
  .price-card { padding: 21px; grid-template-columns: minmax(0, 1fr) 70px; gap: 0 12px; }
  .price-card h3 { font-size: 32px; }
  .plan-art { width: 70px; }
  .faq-heading.faq-intro { grid-template-columns: minmax(0, 1fr) 60px; }
  .faq-intro .section-title { font-size: 26px; }
  .faq-heading.faq-intro .faq-cubi { width: 70px; height: 70px; }
}
@media (prefers-reduced-motion: reduce) {
  .price-card:hover, .price-card:focus-within { translate: none; }
  .price-card:hover .plan-lift, .price-card:focus-within .plan-lift, .price-card:hover .scale-middle, .price-card:focus-within .scale-middle { transform: none; }
  .faq-cubi img { animation: none; }
}
