/* REPORT AUTOMATION — page-ai-reports.css
   LIGHT hero · Teal/Blue accent · Document/productivity aesthetic */

/* ══ HERO (LIGHT) ══ */
.rap-hero {
   position: relative;
   background: #fff;
   padding: calc(var(--header-h) + 72px) 0 80px;
   overflow: hidden
}

.rap-hero__dots {
   position: absolute;
   inset: 0;
   background-image: radial-gradient(circle, rgba(37, 99, 235, .06) 1px, transparent 1px);
   background-size: 30px 30px;
   pointer-events: none
}

.rap-hero__blob {
   position: absolute;
   border-radius: 50%;
   pointer-events: none;
   filter: blur(90px)
}

.rap-blob--1 {
   width: 460px;
   height: 460px;
   background: rgba(0, 194, 168, .07);
   top: -120px;
   right: -100px;
   animation: rapBlob 9s ease-in-out infinite
}

.rap-blob--2 {
   width: 320px;
   height: 320px;
   background: rgba(37, 99, 235, .05);
   bottom: -60px;
   left: -40px;
   animation: rapBlob 11s ease-in-out 3s infinite
}

@keyframes rapBlob {

   0%,
   100% {
      transform: translate(0, 0) scale(1)
   }

   50% {
      transform: translate(18px, -15px) scale(1.04)
   }
}

.rap-hero__inner {
   position: relative;
   z-index: 1;
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 60px;
   align-items: center
}

.rap-hero__eyebrow {
   display: flex;
   align-items: center;
   gap: 10px;
   font-family: var(--font-heading);
   font-size: .78rem;
   font-weight: 700;
   letter-spacing: .1em;
   text-transform: uppercase;
   color: #00C2A8;
   margin-bottom: 18px
}

.rap-pulse-dot {
   width: 8px;
   height: 8px;
   border-radius: 50%;
   background: #00C2A8;
   animation: rapPulse 2s ease-in-out infinite
}

@keyframes rapPulse {

   0%,
   100% {
      box-shadow: 0 0 0 0 rgba(0, 194, 168, .4)
   }

   50% {
      box-shadow: 0 0 0 10px rgba(0, 194, 168, 0)
   }
}

.rap-hero__h1 {
   font-family: var(--font-heading);
   font-size: clamp(2rem, 3.8vw, 3.4rem);
   font-weight: 900;
   line-height: 1.1;
   letter-spacing: -.025em;
   color: var(--color-navy);
   margin-bottom: 16px
}

.rap-hero__accent {
   color: #00C2A8
}

.rap-hero__sub {
   font-size: .9rem;
   line-height: 1.75;
   color: var(--color-slate);
   max-width: 480px;
   margin-bottom: 22px
}

.rap-hero__chips {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 9px;
   margin-bottom: 26px
}

.rap-chip {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 11px 14px;
   background: var(--color-off-white);
   border: 1px solid var(--color-border);
   border-radius: 10px;
   transition: all var(--transition)
}

.rap-chip:hover {
   border-color: #00C2A8;
   box-shadow: 0 4px 16px rgba(0, 194, 168, .1)
}

.rap-chip__icon {
   width: 34px;
   height: 34px;
   border-radius: 9px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: .85rem;
   flex-shrink: 0
}

.rap-chip div {
   display: flex;
   flex-direction: column;
   gap: 1px
}

.rap-chip strong {
   font-family: var(--font-heading);
   font-size: .78rem;
   font-weight: 700;
   color: var(--color-navy)
}

.rap-chip span {
   font-family: var(--font-heading);
   font-size: .65rem;
   color: var(--color-slate)
}

.rap-hero__ctas {
   display: flex;
   gap: 12px;
   flex-wrap: wrap;
   margin-bottom: 22px
}

.rap-btn-primary {
   background: #00C2A8 !important;
   color: var(--color-navy) !important;
   border-color: #00C2A8 !important;
   font-weight: 700 !important
}

.rap-btn-primary:hover {
   background: #00a891 !important;
   border-color: #00a891 !important;
   box-shadow: 0 8px 32px rgba(0, 194, 168, .35) !important;
   transform: translateY(-2px)
}

.rap-hero__stats {
   display: flex;
   gap: 8px;
   flex-wrap: wrap
}

.rap-hstat {
   display: flex;
   align-items: center;
   gap: 7px;
   padding: 6px 14px;
   border-radius: 100px;
   background: var(--color-off-white);
   border: 1px solid var(--color-border);
   font-family: var(--font-heading);
   font-size: .72rem
}

.rap-hstat strong {
   font-weight: 800;
   color: var(--color-navy)
}

.rap-hstat span {
   color: var(--color-slate)
}

/* Report card */
.rap-report-card {
   background: #fff;
   border: 1px solid var(--color-border);
   border-radius: 16px;
   overflow: hidden;
   box-shadow: 0 16px 48px rgba(0, 0, 0, .07), 0 2px 8px rgba(37, 99, 235, .08);
   position: relative
}

.rap-rc__bar {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 10px 16px;
   background: var(--color-off-white);
   border-bottom: 1px solid var(--color-border)
}

.rap-rc__dots {
   display: flex;
   gap: 4px
}

.rap-rc__dots span {
   width: 9px;
   height: 9px;
   border-radius: 50%;
   background: var(--color-border)
}

.rap-rc__title {
   font-family: var(--font-heading);
   font-size: .74rem;
   font-weight: 600;
   color: var(--color-navy);
   flex: 1;
   display: flex;
   align-items: center;
   gap: 6px
}

.rap-rc__title i {
   color: #2563EB
}

.rap-rc__status {
   font-family: var(--font-heading);
   font-size: .68rem;
   font-weight: 600;
   color: #10b981;
   display: flex;
   align-items: center;
   gap: 5px
}

/* Document preview */
.rap-rc__doc {
   padding: 14px 16px;
   background: #fafbff;
   border-bottom: 1px solid var(--color-border)
}

.rap-doc-header {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 8px 0 12px;
   border-bottom: 1px solid var(--color-border);
   margin-bottom: 12px
}

.rap-doc-logo {
   display: flex;
   flex-direction: column;
   gap: 3px;
   flex-shrink: 0
}

.rap-doc-logo__bar {
   width: 28px;
   height: 5px;
   background: var(--color-navy);
   border-radius: 3px
}

.rap-doc-logo__bar--sm {
   width: 20px;
   height: 3px;
   background: #00C2A8
}

.rap-doc-meta {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 2px
}

.rap-doc-meta strong {
   font-family: var(--font-heading);
   font-size: .78rem;
   font-weight: 800;
   color: var(--color-navy)
}

.rap-doc-meta span {
   font-family: var(--font-heading);
   font-size: .62rem;
   color: var(--color-slate)
}

.rap-doc-badge {
   padding: 3px 10px;
   border-radius: 4px;
   background: #ef4444;
   color: #fff;
   font-family: var(--font-heading);
   font-size: .62rem;
   font-weight: 800;
   flex-shrink: 0
}

.rap-doc-section {
   margin-bottom: 10px
}

.rap-doc-section__label {
   font-family: var(--font-heading);
   font-size: .64rem;
   font-weight: 700;
   color: var(--color-slate);
   letter-spacing: .06em;
   text-transform: uppercase;
   margin-bottom: 5px;
   display: flex;
   align-items: center;
   gap: 5px
}

.rap-doc-text {
   font-family: var(--font-heading);
   font-size: .72rem;
   line-height: 1.65;
   color: var(--color-charcoal)
}

.rap-doc-text strong {
   color: var(--color-navy)
}

.rap-doc-chart {
   margin-bottom: 10px
}

.rap-doc-chart__label {
   font-family: var(--font-heading);
   font-size: .62rem;
   color: var(--color-slate);
   margin-bottom: 4px
}

.rap-doc-chart svg {
   width: 100%;
   height: auto;
   display: block
}

.rap-doc-findings {
   display: flex;
   flex-direction: column;
   gap: 5px
}

.rap-df-item {
   display: flex;
   align-items: center;
   gap: 7px;
   font-family: var(--font-heading);
   font-size: .69rem;
   padding: 5px 8px;
   border-radius: 6px
}

.rap-df--green {
   background: rgba(16, 185, 129, .07);
   color: var(--color-navy)
}

.rap-df--green i {
   color: #10b981
}

.rap-df--amber {
   background: rgba(245, 158, 11, .07);
   color: var(--color-navy)
}

.rap-df--amber i {
   color: #f59e0b
}

.rap-df--blue {
   background: rgba(37, 99, 235, .07);
   color: var(--color-navy)
}

.rap-df--blue i {
   color: #2563EB
}

/* Delivery row */
.rap-rc__delivery {
   display: flex;
   align-items: center;
   gap: 0;
   border-bottom: 1px solid var(--color-border)
}

.rap-delivery-item {
   flex: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 6px;
   padding: 8px;
   font-family: var(--font-heading);
   font-size: .68rem;
   color: var(--color-slate);
   border-right: 1px solid var(--color-border)
}

.rap-delivery-item:last-child {
   border-right: none
}

.rap-rc__footer {
   display: flex;
   align-items: center;
   gap: 14px;
   padding: 8px 14px;
   background: var(--color-off-white);
   font-family: var(--font-heading);
   font-size: .67rem;
   color: var(--color-slate)
}

.rap-rc__footer span {
   display: flex;
   align-items: center;
   gap: 5px
}

/* Schedule badge */
.rap-hero__schedule-badge {
   display: flex;
   align-items: center;
   gap: 10px;
   background: #fff;
   border: 1px solid var(--color-border);
   border-radius: 10px;
   padding: 10px 16px;
   box-shadow: var(--shadow-md);
   margin-top: 12px;
   max-width: fit-content;
   animation: floatBob 3.5s ease-in-out infinite
}

@keyframes floatBob {

   0%,
   100% {
      transform: translateY(0)
   }

   50% {
      transform: translateY(-5px)
   }
}

.rap-sb__icon {
   font-size: 1.1rem;
   color: #00C2A8
}

.rap-hero__schedule-badge div {
   display: flex;
   flex-direction: column;
   gap: 1px
}

.rap-hero__schedule-badge strong {
   font-family: var(--font-heading);
   font-size: .76rem;
   font-weight: 700;
   color: var(--color-navy)
}

.rap-hero__schedule-badge span {
   font-family: var(--font-heading);
   font-size: .64rem;
   color: var(--color-slate)
}

/* ══ REPORT TYPES GRID ══ */
.rap-eyebrow {
   color: #00C2A8 !important
}

.rap-section-sub {
   font-size: .9rem;
   color: var(--color-slate);
   max-width: 620px;
   margin: 0 auto;
   line-height: 1.75;
   text-align: center
}

.rap-types-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 16px;
   margin-top: 48px
}

.rap-type-card {
   background: #fff;
   border: 1px solid var(--color-border);
   border-top: 3px solid var(--rap-accent, #00C2A8);
   border-radius: var(--radius-xl);
   padding: 20px 18px;
   display: flex;
   flex-direction: column;
   gap: 12px;
   transition: all var(--transition)
}

.rap-type-card:hover {
   box-shadow: var(--shadow-md);
   transform: translateY(-4px)
}

.rap-type-card__top {
   display: flex;
   align-items: flex-start;
   gap: 12px
}

.rap-tc-icon {
   width: 52px;
   height: 52px;
   border-radius: 12px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0
}

.rap-tc-icon svg {
   width: 42px;
   height: 42px
}

.rap-type-card h4 {
   font-family: var(--font-heading);
   font-size: .88rem;
   font-weight: 800;
   color: var(--color-navy);
   margin-bottom: 4px
}

.rap-tc-freq {
   font-family: var(--font-heading);
   font-size: .66rem;
   font-weight: 600;
   display: flex;
   align-items: center;
   gap: 4px
}

.rap-tc-freq i {
   font-size: .55rem
}

.rap-tc-bullets {
   list-style: none;
   margin: 0;
   padding: 0;
   display: flex;
   flex-direction: column;
   gap: 5px
}

.rap-tc-bullets li {
   display: flex;
   align-items: center;
   gap: 7px;
   font-family: var(--font-heading);
   font-size: .72rem;
   color: var(--color-slate)
}

.rap-tc-bullets i {
   font-size: .5rem;
   flex-shrink: 0
}

/* ══ HOW IT WORKS ══ */
.rap-how-flow {
   display: grid;
   grid-template-columns: 1fr 32px 1fr 32px 1fr 32px 1fr;
   gap: 0;
   align-items: center;
   margin-top: 48px
}

.rap-how-step {
   background: #fff;
   border: 1px solid var(--color-border);
   border-radius: var(--radius-xl);
   padding: 26px 18px;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   gap: 10px;
   transition: all var(--transition)
}

.rap-how-step:hover {
   box-shadow: var(--shadow-md);
   transform: translateY(-4px);
   border-color: #00C2A8
}

.rap-hs-num {
   font-family: var(--font-heading);
   font-size: 1.8rem;
   font-weight: 900;
   color: rgba(0, 194, 168, .12);
   line-height: 1;
   margin-bottom: -6px
}

.rap-hs-icon {
   width: 64px;
   height: 64px
}

.rap-hs-icon svg {
   width: 64px;
   height: 64px
}

.rap-how-step h4 {
   font-family: var(--font-heading);
   font-size: .86rem;
   font-weight: 800;
   color: var(--color-navy)
}

.rap-how-step p {
   font-family: var(--font-heading);
   font-size: .72rem;
   color: var(--color-slate);
   line-height: 1.6
}

.rap-how-arrow {
   display: flex;
   align-items: center;
   justify-content: center;
   color: #00C2A8;
   font-size: .85rem;
   opacity: .7
}

/* ══ FEATURE ROWS ══ */
.rap-feature-grid {
   display: flex;
   flex-direction: column;
   gap: 0
}

.rap-feat-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 56px;
   align-items: center;
   padding-block: 56px;
   border-bottom: 1px solid var(--color-border)
}

.rap-feat-row:last-child {
   border-bottom: none
}

.rap-feat-row--flip .rap-feat-text {
   order: 2
}

.rap-feat-row--flip .rap-feat-visual {
   order: 1
}

.rap-feat-icon {
   width: 52px;
   height: 52px;
   border-radius: var(--radius-md);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 1.15rem;
   margin-bottom: 14px
}

.rap-fi--purple {
   background: rgba(139, 92, 246, .1);
   color: #8b5cf6
}

.rap-fi--blue {
   background: rgba(37, 99, 235, .1);
   color: #2563EB
}

.rap-feat-text h3 {
   font-size: 1.35rem;
   font-weight: 800;
   color: var(--color-navy);
   margin-bottom: 10px;
   line-height: 1.2
}

.rap-feat-text p {
   font-size: .88rem;
   line-height: 1.75;
   color: var(--color-slate);
   margin-bottom: 16px
}

.rap-feat-chips {
   display: flex;
   flex-direction: column;
   gap: 8px
}

.rap-fc {
   display: flex;
   align-items: center;
   gap: 9px;
   font-family: var(--font-heading);
   font-size: .8rem;
   color: var(--color-charcoal)
}

.rap-fc i {
   flex-shrink: 0;
   font-size: .72rem
}

.rap-fv-card {
   background: #fff;
   border: 1px solid var(--color-border);
   border-radius: var(--radius-xl);
   overflow: hidden;
   box-shadow: 0 8px 32px rgba(0, 0, 0, .06), 0 2px 8px rgba(0, 0, 0, .03)
}

.rap-fv-bar {
   display: flex;
   align-items: center;
   gap: 9px;
   padding: 11px 16px;
   background: var(--color-off-white);
   border-bottom: 1px solid var(--color-border);
   font-family: var(--font-heading);
   font-size: .78rem;
   font-weight: 600;
   color: var(--color-charcoal)
}

.rap-fv-badge {
   margin-left: auto;
   padding: 2px 10px;
   border-radius: 100px;
   background: rgba(139, 92, 246, .1);
   color: #8b5cf6;
   font-size: .62rem;
   font-weight: 700;
   border: 1px solid rgba(139, 92, 246, .2)
}

.rap-fv-doc {
   padding: 16px
}

.rap-fv-heading {
   font-family: var(--font-heading);
   font-size: .8rem;
   font-weight: 800;
   color: var(--color-navy);
   margin-bottom: 8px;
   padding-bottom: 6px;
   border-bottom: 1px solid var(--color-border)
}

.rap-fv-body {
   font-family: var(--font-heading);
   font-size: .76rem;
   line-height: 1.7;
   color: var(--color-charcoal);
   margin-bottom: 8px
}

.rap-fv-body strong {
   color: var(--color-navy)
}

.rap-fv-source {
   font-family: var(--font-heading);
   font-size: .62rem;
   color: var(--color-slate);
   padding: 6px 8px;
   background: var(--color-off-white);
   border-radius: 6px;
   border: 1px solid var(--color-border);
   margin-top: 4px
}

/* Schedule list */
.rap-schedule-list {
   display: flex;
   flex-direction: column;
   gap: 0
}

.rap-sl-row {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 10px 16px;
   border-bottom: 1px solid var(--color-border);
   transition: background var(--transition)
}

.rap-sl-row:last-child {
   border-bottom: none
}

.rap-sl-row:hover {
   background: var(--color-off-white)
}

.rap-sl-icon {
   width: 34px;
   height: 34px;
   border-radius: 9px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: .8rem;
   flex-shrink: 0
}

.rap-sl-body {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 2px
}

.rap-sl-body strong {
   font-family: var(--font-heading);
   font-size: .78rem;
   font-weight: 700;
   color: var(--color-navy)
}

.rap-sl-body span {
   font-family: var(--font-heading);
   font-size: .65rem;
   color: var(--color-slate)
}

.rap-sl-right {
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   gap: 4px
}

.rap-sl-next {
   font-family: var(--font-heading);
   font-size: .65rem;
   color: var(--color-slate)
}

.rap-sl-badge {
   padding: 2px 8px;
   border-radius: 100px;
   font-family: var(--font-heading);
   font-size: .58rem;
   font-weight: 800
}

.rap-slb--active {
   background: rgba(16, 185, 129, .1);
   color: #10b981;
   border: 1px solid rgba(16, 185, 129, .2)
}

.rap-slb--trigger {
   background: rgba(239, 68, 68, .1);
   color: #ef4444;
   border: 1px solid rgba(239, 68, 68, .2)
}

/* ══ INDUSTRIES ══ */
.rap-ind-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 12px
}

.rap-ind-card {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 14px 16px;
   background: var(--color-off-white);
   border: 1px solid var(--color-border);
   border-radius: var(--radius-xl);
   transition: all var(--transition)
}

.rap-ind-card:hover {
   background: #fff;
   border-color: #00C2A8;
   box-shadow: var(--shadow-md);
   transform: translateX(3px)
}

.rap-ind-icon {
   width: 42px;
   height: 42px;
   border-radius: var(--radius-md);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: .95rem;
   flex-shrink: 0
}

.rap-ind-body {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 2px
}

.rap-ind-body strong {
   font-family: var(--font-heading);
   font-size: .8rem;
   font-weight: 700;
   color: var(--color-navy)
}

.rap-ind-body span {
   font-family: var(--font-heading);
   font-size: .64rem;
   color: var(--color-slate)
}

.rap-ind-arr {
   font-size: .75rem;
   opacity: 0;
   transition: all var(--transition)
}

.rap-ind-card:hover .rap-ind-arr {
   opacity: 1;
   transform: translateX(3px)
}

/* ══ METRICS ══ */
.rap-metrics {
   background: var(--color-navy);
   padding-block: 48px
}

.rap-metrics__grid {
   display: flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
   gap: 20px
}

.rap-metric {
   flex: 1;
   min-width: 110px;
   text-align: center;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 5px
}

.rap-metric>i {
   font-size: 1.2rem;
   color: rgba(255, 255, 255, .55);
   margin-bottom: 2px
}

.rap-metric strong {
   font-family: var(--font-heading);
   font-size: 1.1rem;
   font-weight: 900;
   color: #fff;
   line-height: 1
}

.rap-metric span {
   font-family: var(--font-heading);
   font-size: .7rem;
   color: rgba(255, 255, 255, .6);
   font-weight: 500
}

/* ══ CTA ══ */
.rap-cta {
   background: #fff
}

.rap-cta__inner {
   display: grid;
   grid-template-columns: 160px 1fr;
   gap: 48px;
   align-items: center;
   background: linear-gradient(135deg, rgba(0, 194, 168, .04) 0%, rgba(37, 99, 235, .03) 100%);
   border: 1px solid rgba(0, 194, 168, .15);
   border-radius: var(--radius-xl);
   padding: 52px 48px
}

/* Doc stack */
.rap-cta__icons {
   display: flex;
   align-items: center;
   justify-content: center
}

.rap-ci-stack {
   position: relative;
   width: 100px;
   height: 110px
}

.rap-ci-doc {
   position: absolute;
   width: 80px;
   height: 100px;
   border-radius: 8px
}

.rap-ci-doc--back {
   top: 0;
   left: 0;
   transform: rotate(-8deg)
}

.rap-ci-doc--mid {
   top: 4px;
   left: 8px;
   transform: rotate(-3deg)
}

.rap-ci-doc--front {
   background: #fff;
   border: 1px solid var(--color-border) !important;
   top: 8px;
   left: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 8px 24px rgba(0, 0, 0, .1);
   transform: rotate(0deg);
   position: absolute
}

.rap-ci-sparkle {
   position: absolute;
   top: 4px;
   right: 4px;
   background: #fff;
   border-radius: 50%;
   width: 22px;
   height: 22px;
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 2px 8px rgba(0, 0, 0, .1)
}

.rap-cta__text {
   display: flex;
   flex-direction: column;
   gap: 14px
}

.rap-cta__text h2 {
   font-family: var(--font-heading);
   font-size: clamp(1.6rem, 3vw, 2.3rem);
   font-weight: 900;
   color: var(--color-navy);
   line-height: 1.15
}

.rap-cta__text p {
   font-size: .9rem;
   color: var(--color-slate);
   line-height: 1.75;
   max-width: 520px
}

.rap-cta__btns {
   display: flex;
   gap: 12px;
   flex-wrap: wrap
}

/* ══ RESPONSIVE ══ */
@media(max-width:1280px) {
   .rap-types-grid {
      grid-template-columns: repeat(2, 1fr)
   }

   .rap-ind-grid {
      grid-template-columns: repeat(2, 1fr)
   }
}

@media(max-width:1100px) {
   .rap-how-flow {
      grid-template-columns: 1fr 28px 1fr;
   }

   .rap-how-flow .rap-how-step:nth-child(6),
   .rap-how-flow .rap-how-step:nth-child(7) {
      display: none
   }
}

@media(max-width:1024px) {
   .rap-hero__inner {
      grid-template-columns: 1fr
   }

   .rap-hero__visual {
      display: none
   }

   .rap-feat-row {
      grid-template-columns: 1fr
   }

   .rap-feat-row--flip .rap-feat-text,
   .rap-feat-row--flip .rap-feat-visual {
      order: unset
   }

   .rap-cta__inner {
      grid-template-columns: 1fr
   }

   .rap-cta__icons {
      display: none
   }

   .rap-how-flow {
      grid-template-columns: 1fr;
      gap: 14px
   }

   .rap-how-arrow {
      transform: rotate(90deg)
   }
}

@media(max-width:768px) {
   .rap-types-grid {
      grid-template-columns: 1fr
   }

   .rap-ind-grid {
      grid-template-columns: 1fr
   }

   .rap-hero__chips {
      grid-template-columns: 1fr
   }

   .rap-metrics__grid {
      justify-content: center
   }
}