.raylane-hub-page {
  overflow: hidden;
  background: #f8f9f5;
  color: var(--blue);
}

.raylane-hub-page section { padding: 96px 0; }

.hub-hero {
  position: relative;
  padding: 78px 0 92px !important;
  background:
    radial-gradient(circle at 9% 18%, rgba(149, 193, 31, .17), transparent 28%),
    linear-gradient(135deg, #f3f7e9 0%, #fff 61%, #f0f4e6 100%);
}

.hub-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  bottom: -230px;
  width: 430px;
  height: 430px;
  border: 1px solid rgba(49, 45, 90, .09);
  border-radius: 50%;
}

.hub-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 70px;
  align-items: center;
}

.hub-hero-copy h1 {
  max-width: 680px;
  margin: 18px 0 25px;
  color: var(--ink);
  font: 400 clamp(52px, 6vw, 82px)/.98 Georgia, serif;
  letter-spacing: -4px;
}

.hub-hero-copy > p { max-width: 620px; font-size: 16px; line-height: 1.8; }
.hub-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hub-text-link { display: inline-flex; align-items: center; padding: 14px 8px; color: var(--ink); font-size: 12px; font-weight: 800; }

.hub-hero-media {
  position: relative;
  min-height: 520px;
  overflow: hidden;
  border-radius: 30px 120px 30px 30px;
  box-shadow: 0 32px 75px rgba(49, 45, 90, .16);
}

.hub-hero-media img { display: block; width: 100%; height: 520px; object-fit: cover; }
.hub-hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(49,45,90,.22)); }
.hub-floating-note { position: absolute; right: 22px; bottom: 22px; z-index: 2; max-width: 250px; padding: 17px 20px; border-radius: 16px; background: rgba(255,255,255,.92); box-shadow: 0 16px 35px rgba(49,45,90,.15); backdrop-filter: blur(12px); }
.hub-floating-note strong, .hub-floating-note small { display: block; }
.hub-floating-note strong { color: var(--ink); font-size: 12px; }
.hub-floating-note small { margin-top: 4px; color: #68647d; font-size: 9px; }

.hub-assurance { position: relative; z-index: 3; margin-top: -28px; padding: 0 !important; }
.hub-assurance-grid { display: grid; grid-template-columns: repeat(4,1fr); overflow: hidden; border: 1px solid #e2e3e8; border-radius: 19px; background: #fff; box-shadow: 0 22px 55px rgba(49,45,90,.09); }
.hub-assurance article { display: flex; align-items: center; gap: 13px; padding: 22px; border-right: 1px solid #eef0e8; }
.hub-assurance article:last-child { border-right: 0; }
.hub-assurance i, .hub-card-icon { display: grid; place-items: center; border-radius: 14px; background: #eef4df; color: var(--green); font-style: normal; transition: transform .35s ease, background .35s ease, color .35s ease; }
.hub-assurance i { flex: 0 0 42px; height: 42px; font-size: 18px; }
.hub-assurance strong { color: var(--ink); font-size: 11px; }
.hub-assurance article:hover i { transform: rotate(-8deg) scale(1.08); background: var(--green); color: #fff; }

.hub-section-head { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 42px; }
.hub-section-head > div { max-width: 720px; }
.hub-section-head h2 { margin: 13px 0 0; color: var(--ink); font: 400 clamp(40px, 5vw, 62px)/1.04 Georgia, serif; letter-spacing: -2.5px; }
.hub-section-head > p { max-width: 430px; margin: 0; }

.hub-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.hub-card { position: relative; display: flex; min-height: 360px; flex-direction: column; padding: 32px; overflow: hidden; border: 1px solid #e2e3e8; border-radius: 23px; background: #fff; color: inherit; text-decoration: none; box-shadow: 0 16px 45px rgba(49,45,90,.06); transition: transform .4s ease, box-shadow .4s ease, border-color .4s ease; }
.hub-card::after { content: ""; position: absolute; right: -75px; bottom: -95px; width: 190px; height: 190px; border: 1px solid rgba(149,193,31,.18); border-radius: 50%; transition: transform .55s ease; }
.hub-card:hover { transform: translateY(-9px); border-color: rgba(149,193,31,.55); box-shadow: 0 27px 60px rgba(49,45,90,.12); }
.hub-card:hover::after { transform: scale(1.2) translate(-8px,-8px); }
.hub-card-icon { width: 58px; height: 58px; font-size: 24px; }
.hub-card:hover .hub-card-icon { transform: rotate(-7deg) scale(1.08); background: var(--green); color: #fff; }
.hub-card small { margin-top: 26px; color: var(--green); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.hub-card h3 { margin: 9px 0 13px; color: var(--ink); font: 400 31px/1.08 Georgia, serif; }
.hub-card p { margin: 0; font-size: 12px; line-height: 1.7; }
.hub-card strong { margin-top: auto; padding-top: 24px; color: var(--ink); font-size: 11px; }

.hub-feature {
  background:
    radial-gradient(circle at 88% 12%, rgba(149,193,31,.15), transparent 30%),
    linear-gradient(125deg, #312d5a 0%, #3d3768 58%, #48416d 100%);
  color: #fff;
}
.hub-feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.hub-feature h2 { margin: 15px 0 22px; color: #95c11f; font: 400 clamp(42px,5vw,62px)/1.04 Georgia,serif; letter-spacing: -2.5px; }
.hub-feature p { color: rgba(255,255,255,.82); }
.hub-checks { display: grid; gap: 11px; margin-top: 28px; }
.hub-checks span { display: flex; align-items: center; gap: 11px; padding: 13px 15px; border: 1px solid rgba(255,255,255,.13); border-radius: 13px; background: rgba(255,255,255,.05); font-size: 11px; font-weight: 700; }
.hub-checks i { color: #b0d54f; font-style: normal; }
.hub-feature-panel { padding: 38px; border: 1px solid rgba(255,255,255,.2); border-radius: 24px; background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(149,193,31,.12)); box-shadow: 0 22px 55px rgba(24,20,55,.2); }
.hub-feature-panel h3 { margin: 0 0 12px; color: #fff; font-size: 24px; }
.hub-feature .pill { background: rgba(255,255,255,.92); color: #312d5a; }
.hub-feature .btn { background: #95c11f; color: #312d5a; }
.hub-feature .btn:hover { background: #b0d54f; color: #312d5a; }

.hub-nhs { padding: 0 0 100px !important; background: #f8f9f5; }
.hub-nhs-card { display: flex; align-items: center; justify-content: space-between; gap: 50px; padding: 48px 54px; border-radius: 25px; background: linear-gradient(120deg,#eef4df,#fff); box-shadow: 0 20px 55px rgba(49,45,90,.07); }
.hub-nhs-card h2 { margin: 8px 0 12px; color: var(--ink); font: 400 42px/1.05 Georgia,serif; }
.hub-nhs-card p { max-width: 760px; margin: 0; }

@media (max-width: 950px) {
  .hub-hero-grid, .hub-feature-grid { grid-template-columns: 1fr; }
  .hub-hero-media, .hub-hero-media img { min-height: 440px; height: 440px; }
  .hub-assurance-grid { grid-template-columns: 1fr 1fr; }
  .hub-assurance article:nth-child(2) { border-right: 0; }
  .hub-assurance article:nth-child(-n+2) { border-bottom: 1px solid #eef0e8; }
  .hub-card-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 700px) {
  .raylane-hub-page section { padding: 70px 0; }
  .hub-hero { padding: 54px 0 75px !important; }
  .hub-hero-grid { gap: 42px; }
  .hub-hero-copy h1 { font-size: 47px; letter-spacing: -2.3px; }
  .hub-hero-media, .hub-hero-media img { min-height: 350px; height: 350px; }
  .hub-hero-media { border-radius: 24px 70px 24px 24px; }
  .hub-assurance { margin-top: -18px; }
  .hub-assurance-grid, .hub-card-grid { grid-template-columns: 1fr; }
  .hub-assurance article { border-right: 0; border-bottom: 1px solid #eef0e8; }
  .hub-assurance article:last-child { border-bottom: 0; }
  .hub-section-head { display: block; }
  .hub-section-head > p { margin-top: 18px; }
  .hub-card { min-height: 315px; }
  .hub-nhs-card { display: block; padding: 34px 28px; }
  .hub-nhs-card .btn { margin-top: 25px; }
}

@media (prefers-reduced-motion: reduce) {
  .hub-card, .hub-card::after, .hub-card-icon, .hub-assurance i { transition: none; }
}