/* intro v25 — Sagmeister ticket: corner patch, spiral binding, ticket perforation, square thumb */

/* Corner accent patch → triangle */
.intro-tkt__patch {
    width: 10rem;
    height: 10rem;
    clip-path: polygon(0 0, 100% 0, 0 100%);
    opacity: 0.9;
}
.intro-tkt__spiral { height: 1rem; }
.intro-tkt__body { min-width: 0; }
.intro-tkt__close { width: 2rem; height: 2rem; }

/* Torn notebook spiral binding holes (colour from Tailwind text-*, holes via mask) */
.intro-tkt__spiral {
    -webkit-mask: radial-gradient(circle 5px at center, black 98%, transparent 100%) 0 0 / 30px 100%;
    mask: radial-gradient(circle 5px at center, black 98%, transparent 100%) 0 0 / 30px 100%;
    background: currentColor;
    opacity: 0.5;
}

/* Square cropped thumbnail */
.intro-tkt__thumb {
    width: 6rem;
    height: 6rem;
    object-fit: cover;
}

/* Ticket stub perforation (currentColor from the card text) */
.intro-tkt__ticket { transition: box-shadow 240ms ease; }
.intro-tkt__ticket::after {
    content: "";
    position: absolute;
    top: 0.75rem;
    bottom: 0.75rem;
    left: 7.5rem;
    border-left: 2px dashed currentColor;
    opacity: 0.25;
    pointer-events: none;
}
@media (max-width: 575.98px) {
    .intro-tkt__ticket::after { display: none; }
}

.services__tile--lift {
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.services__tile--lift:hover {
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}

@media (min-width: 640px) {
  .services__tile--lift:hover {
    transform: scale(1.05);
  }
}

.services__cta--lift {
  transition: filter 0.3s ease, transform 0.3s ease;
}

@media (min-width: 640px) {
  .services__cta--lift:hover {
    transform: scale(1.05);
  }
}

.services__cta--lift:hover {
  filter: brightness(0.92);
}

/* Steps v29 — Split-Screen Steps with Sticky Icon Panel and Scrollable List */

/* Shared split-screen grid: sticky rail (narrow) + scrollable list (wide).
   No Bootstrap equivalent for an arbitrary grid-template-columns split,
   so this single custom class drives the layout in both TW and BS renders. */
.twin-pane__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
}

@media (min-width: 992px) {
    .twin-pane__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    }
}

/* Sticky icon/intro rail — position:sticky is standard CSS, framework-agnostic */
@media (min-width: 992px) {
    .twin-pane__rail {
        position: sticky;
        top: 6rem;
        align-self: flex-start;
    }
}

/* Fixed-size icon badge — no Bootstrap utility matches this exact box size */
.twin-pane__icon-box {
    width: 3rem;
    height: 3rem;
}

/* Remove trailing divider/spacing on the last step item (no BS :last-child utility) */
.twin-pane__item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.tips-cards__card {
    max-width: 24rem;
}

