/* ── IBF HERO (inner pages) ───────────────────────────────── */

/* Section */
.ibf-hero {
  position: relative;
  background: #ffffff;
}

/* Two-column grid — matches PageHero exactly */
.ibf-hero__inner {
  display: grid;
  gap: 3.5rem;            /* gap-14 */
  padding-top: 3rem;      /* pt-12 */
  padding-bottom: 6rem;   /* pb-24 */
}
@media (min-width: 1024px) {
  .ibf-hero__inner {
    grid-template-columns: repeat(12, 1fr);
    align-items: stretch;
    gap: 2rem;            /* lg:gap-8 */
    padding-top: 4rem;    /* lg:pt-16 */
    padding-bottom: 8rem; /* lg:pb-32 */
  }
}

/* Left column — flex col so bottom_content can push to column bottom */
.ibf-hero__left {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.ibf-hero__right { min-width: 0; }
@media (min-width: 1024px) {
  .ibf-hero__left  { grid-column: span 6; }
  .ibf-hero__right { grid-column: span 6; }
}

/* ── Breadcrumb ── */
.ibf-hero__crumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: #8A8A8A;
}
.ibf-hero__crumb-home {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s;
}
.ibf-hero__crumb-home:hover { color: #DD1157; }
.ibf-hero__crumb-current    { color: #141414; }

/* ── H1 ── */
.ibf-hero__h1 { margin: 0; font-weight: normal; }

.ibf-hero__pre {
  display: block;
  font-size: 20px;
  font-weight: 300;
  font-style: italic;
  color: #4F4F4F;
  line-height: 1.5;
}

.ibf-hero__rows-wrap {
  display: block;
    margin-top: 1.87rem;
  font-size: clamp(42px, 5.4vw, 78px);  /* clamp(42px,5.4vw,78px) — PageHero value */
  font-weight: 300;
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: #141414;
}

.ibf-hero__title-row { padding-bottom: 0.06em; }
.ibf-hero__row-inner { display: inline-block; }
.ibf-hero__accent    { color: #DD1157; }
.ibf-hero__bold      { font-weight: 700; }

/* ── Subtitle ── */
.ibf-hero__sub {
  margin-top: 1rem;
  max-width: 500px;       /* max-w-[500px] — PageHero value (home hero uses 460px) */
  font-size: 18px;
  line-height: 1.75;
  color: #4F4F4F;
}

/* ── CTA Buttons ── */
.ibf-hero__btns {
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2.5rem;
}

.ibf-hero__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 54px;
  border-radius: 9999px;
  padding: 0 1.75rem;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  text-decoration: none;
  overflow: hidden;
  position: relative;
  transition: background-color 0.3s var(--ibf-ease),
              color 0.3s var(--ibf-ease),
              border-color 0.3s var(--ibf-ease);
}

.ibf-hero__btn--pink {
  background: #DD1157;
  color: #ffffff;
  border: 1px solid transparent;
}
.ibf-hero__btn--pink:hover { background: #B8024F; }

.ibf-hero__btn--line {
  background: transparent;
  color: #141414;
  border: 1px solid #141414;
}
.ibf-hero__btn--line .ibf-hero__btn-text,
.ibf-hero__btn--line .ibf-hero__btn-arrow { position: relative; transition: color 0.3s var(--ibf-ease); }
.ibf-hero__btn--line:hover .ibf-hero__btn-text,
.ibf-hero__btn--line:hover .ibf-hero__btn-arrow { color: #ffffff; }

/* Ink-fill overlay slides up on hover (line variant only) */
.ibf-hero__btn-overlay {
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background: #141414;
  transform: translateY(100%);
  transition: transform 0.5s var(--ibf-ease);
}
.ibf-hero__btn--line:hover .ibf-hero__btn-overlay { transform: translateY(0); }

/* Arrow hover nudge */
.ibf-hero__btn-arrow {
  flex-shrink: 0;
  transition: transform 0.3s var(--ibf-ease);
}
.ibf-hero__btn:hover .ibf-hero__btn-arrow { transform: translate(2px, -2px); }

/* ── Bottom content slot (badge, text strip) ── */
.ibf-hero__bottom {
  margin-top: 3rem;       /* mt-12 */
  border-top: 1px solid #E7E7E7;
  padding-top: 1.75rem;   /* pt-7 */
}
/* @media (min-width: 1024px) {
  .ibf-hero__bottom { margin-top: auto; } /* lg:mt-auto — sticks to column bottom */
} */

/* Image inside bottom richtext */
.ibf-hero__bottom img {
  width: 100%;
  max-width: 330px;
  height: auto;
}

/* ── Photo column ── */
.ibf-hero__photo-col {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Photo/visual wrapper — clip-path entrance from center */
.ibf-hero__photo-wrap {
  position: relative;
  aspect-ratio: 4 / 5;
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  animation: ibf-hero-clip 1.5s 0.15s cubic-bezier(0.7, 0, 0.2, 1) both;
}
@keyframes ibf-hero-clip {
  from { clip-path: inset(14% 14% 14% 14%); }
  to   { clip-path: inset(0% 0% 0% 0%); }
}
@media (min-width: 1024px) {
  .ibf-hero__photo-wrap {
    aspect-ratio: auto;
    min-height: 640px;
    height: 100%;
  }
}

/* ── Standard photo inner (extends beyond container for parallax room) ── */
.ibf-hero__photo-inner {
  position: absolute;
  inset-inline: 0;
  top: -4%;     /* -top-[4%] */
  bottom: -12%; /* -bottom-[12%] */
  /* data-parallax="70" — JS sets translateY inline */
}

.ibf-hero__photo-scale {
  width: 100%;
  height: 100%;
  animation: ibf-hero-scale 2.6s 0.15s var(--ibf-ease) both;
}
@keyframes ibf-hero-scale {
  from { transform: scale(1.25); }
  to   { transform: scale(1); }
}

.ibf-hero__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mix-blend-screen {
    mix-blend-mode: screen;
}
/* ── PlatinumVisual ── */
.ibf-hero__platinum {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: radial-gradient(90% 70% at 55% 30%, #2b2b2e 0%, #121213 52%, #060606 100%);
}

/* Centered hex SVG container */
.ibf-hero__hex-wrap {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 10%;
}
.ibf-hero__hex-svg {
  height: 70%;
  width: auto;
  max-width: 86%;
  /* data-parallax="24" — JS adds translateY inline */
}

/* Animated hex rays — stroke-dasharray draw */
.ibf-hex-ray {
  stroke-dasharray: 30;
  stroke-dashoffset: 30;
  animation: ibf-ray-draw 1.4s var(--ibf-ease) both;
}
@keyframes ibf-ray-draw { to { stroke-dashoffset: 0; } }

.ibf-hex-ray--1  { animation-delay: 1.00s; }
.ibf-hex-ray--2  { animation-delay: 1.04s; }
.ibf-hex-ray--3  { animation-delay: 1.08s; }
.ibf-hex-ray--4  { animation-delay: 1.12s; }
.ibf-hex-ray--5  { animation-delay: 1.16s; }
.ibf-hex-ray--6  { animation-delay: 1.20s; }
.ibf-hex-ray--7  { animation-delay: 1.24s; }
.ibf-hex-ray--8  { animation-delay: 1.28s; }
.ibf-hex-ray--9  { animation-delay: 1.32s; }
.ibf-hex-ray--10 { animation-delay: 1.36s; }
.ibf-hex-ray--11 { animation-delay: 1.40s; }
.ibf-hex-ray--12 { animation-delay: 1.44s; }
.ibf-hex-ray--13 { animation-delay: 1.48s; }

/* Pink hexagon outline draw */
.ibf-hex-pink {
  fill: none;
  stroke-dasharray: 299;
  stroke-dashoffset: 299;
  animation: ibf-hex-draw 2.6s 0.7s var(--ibf-ease) both;
}
@keyframes ibf-hex-draw { to { stroke-dashoffset: 0; } }

/* Trophy — parallax on outer col, opacity+scale on inner wrap */
.ibf-hero__trophy-col {
  position: absolute;
  inset-inline: 0;
  bottom: 13%;
  height: 58%;
  display: flex;
  justify-content: center;
  /* data-parallax="-46" — JS sets translateY inline */
}
.ibf-hero__trophy-wrap {
  position: relative;
  height: 100%;
  mix-blend-mode: screen;
  animation: ibf-pt-trophy 1.8s 0.5s var(--ibf-ease) both;
}
@keyframes ibf-pt-trophy {
  from { opacity: 0; transform: scale(0.94); }
  to   { opacity: 1; transform: scale(1); }
}
.ibf-hero__trophy {
  height: 100%;
  width: auto;
  max-width: none;
  object-fit: contain;
}

/* HubSpot lockup — top-left */
.ibf-hero__lockup-wrap {
  position: absolute;
  left: 1.25rem;
  top: 1.5rem;
  width: 124px;
  mix-blend-mode: screen;
  animation: ibf-pt-lockup 0.9s 1.2s var(--ibf-ease) both;
}
@media (min-width: 640px) {
  .ibf-hero__lockup-wrap {
    left: 2rem;
    top: 2rem;
    width: 230px;
  }
}
@keyframes ibf-pt-lockup {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ibf-hero__lockup { width: 100%; height: auto; }

/* Bottom text bar */
.ibf-hero__platinum-bar {
  position: absolute;
  inset-inline: 1.5rem;
  bottom: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid rgba(255, 255, 255, .15);
  padding-top: 1rem;
  animation: ibf-pt-bar 1s 1.6s both;
}
@media (min-width: 640px) {
  .ibf-hero__platinum-bar { inset-inline: 2rem; bottom: 2rem; }
}
@keyframes ibf-pt-bar {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.ibf-hero__platinum-year {
  white-space: nowrap;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: rgba(255, 255, 255, .60);
}
.ibf-hero__platinum-title {
  white-space: nowrap;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #DD1157;
}
@media (min-width: 640px) {
  .ibf-hero__platinum-year,
  .ibf-hero__platinum-title { font-size: 11px; letter-spacing: 0.2em; }
}

/* ── Quote card (About page) ── */
.ibf-hero__card-quote {
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
  margin: 0;
  max-width: 340px;
  background: #ffffff;
  padding: 1.25rem 1.5rem;
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .35);
}
.ibf-hero__card-stars {
  font-size: 13px;
  letter-spacing: 3px;
  color: #DD1157;
}
.ibf-hero__quote-text {
  display: block;
  margin-top: 0.5rem;
  font-size: 15px;
  line-height: 1.6;
  color: #141414;
  font-style: normal;
  margin-left: 0;
  margin-right: 0;
}
.ibf-hero__quote-who {
  display: block;
  margin-top: 0.75rem;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #8A8A8A;
}

/* ── White stat card ── */
.ibf-hero__card-white {
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;     /* default: left */
  background: #ffffff;
  padding: 1rem 1.25rem;
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .35);
}
.ibf-hero__card-white--right {
  left: auto;
  right: 1.5rem;
}
@media (max-width: 639px) {
  .ibf-hero__card-white--right { display: none; } /* max-sm:hidden */
}
.ibf-hero__card-white-big {
  display: block;
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
  color: #141414;
}
.ibf-hero__card-white-small {
  display: block;
  margin-top: 0.25rem;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #8A8A8A;
}

/* ── Pink stat card (top-right) ── */
.ibf-hero__card-pink {
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  padding: 1rem 1.25rem;
}
.ibf-hero__card-pink::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #DD1157;
}
.ibf-hero__card-pink-big {
  position: relative;
  display: block;
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
  color: #ffffff;
}
.ibf-hero__card-pink-small {
  position: relative;
  display: block;
  margin-top: 0.25rem;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: rgba(255, 255, 255, .85);
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .ibf-hero__photo-wrap  { animation: none; clip-path: inset(0% 0% 0% 0%); }
  .ibf-hero__photo-scale { animation: none; transform: scale(1); }
  .ibf-hero__trophy-wrap,
  .ibf-hero__lockup-wrap,
  .ibf-hero__platinum-bar { animation: none; opacity: 1; }
  .ibf-hex-ray            { animation: none; stroke-dashoffset: 0; }
  .ibf-hex-pink           { animation: none; stroke-dashoffset: 0; }
}