/* =========================================================

   Tokyo Bikers — custom.css

   Midnight Tokyo luxury · black / crimson / titanium

   ========================================================= */



:root {

  --midnight: #0A0A0B;

  --midnight-soft: #121214;

  --crimson: #8B1A1A;

  --crimson-bright: #B91C1C;

  --crimson-accent: #DC2626;

  --titanium: #8B919A;

  --titanium-mid: #C4C7CC;

  --titanium-light: #E5E7EB;

  --ease-luxury: cubic-bezier(0.22, 1, 0.36, 1);

}



html.lenis,

html.lenis body {

  height: auto;

}



html.lenis {

  scroll-behavior: auto !important;

}



body.tkb {

  background-color: var(--midnight);

  color: var(--titanium-mid);

  overflow-x: hidden;

  cursor: none;

}



body.tkb::before {

  content: "";

  position: fixed;

  inset: 0;

  z-index: 9990;

  pointer-events: none;

  opacity: 0.045;

  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

  mix-blend-mode: overlay;

}



body.tkb.is-touch,

body.tkb.no-custom-cursor {

  cursor: auto;

}



::selection {

  background: rgba(185, 28, 28, 0.35);

  color: var(--titanium-light);

}



.skip-link {

  position: absolute;

  left: -9999px;

  top: 0;

  z-index: 10000;

  padding: 0.75rem 1.25rem;

  background: var(--crimson-accent);

  color: var(--titanium-light);

  font-family: "Noto Sans JP", sans-serif;

  font-weight: 500;

}



.skip-link:focus {

  left: 1rem;

  top: 1rem;

  cursor: auto;

}



.sr-only {

  position: absolute;

  width: 1px;

  height: 1px;

  padding: 0;

  margin: -1px;

  overflow: hidden;

  clip: rect(0, 0, 0, 0);

  white-space: nowrap;

  border: 0;

}



/* ─── Scroll progress ─── */

.tkb-progress {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  height: 2px;

  z-index: 60;

  pointer-events: none;

}



.tkb-progress span {

  display: block;

  height: 100%;

  width: 0%;

  background: linear-gradient(90deg, var(--crimson), var(--crimson-accent));

  box-shadow: 0 0 14px rgba(220, 38, 38, 0.35);

}



/* ─── Custom cursor ─── */

.tkb-cursor {

  position: fixed;

  top: 0;

  left: 0;

  width: 0;

  height: 0;

  z-index: 9998;

  pointer-events: none;

  opacity: 0;

  transition: opacity 0.35s ease;

}



.tkb-cursor.is-on { opacity: 1; }



.tkb-cursor__ring {

  position: absolute;

  width: 36px;

  height: 36px;

  margin: -18px 0 0 -18px;

  border: 1px solid rgba(196, 199, 204, 0.45);

  border-radius: 50%;

  transition: transform 0.2s ease, border-color 0.25s ease, width 0.25s ease, height 0.25s ease, margin 0.25s ease;

}



.tkb-cursor.is-hover .tkb-cursor__ring {

  width: 52px;

  height: 52px;

  margin: -26px 0 0 -26px;

  border-color: rgba(220, 38, 38, 0.65);

}



.tkb-cursor__dot {

  position: absolute;

  width: 4px;

  height: 4px;

  margin: -2px 0 0 -2px;

  background: var(--crimson-accent);

  border-radius: 50%;

  box-shadow: 0 0 8px var(--crimson-accent);

}



/* ─── Navigation ─── */

.tkb-nav {

  transition: background 0.5s var(--ease-luxury), backdrop-filter 0.5s;

}



.tkb-nav.is-scrolled {

  background: rgba(10, 10, 11, 0.92);

  backdrop-filter: blur(20px);

  -webkit-backdrop-filter: blur(20px);

}



.tkb-nav__glow {

  height: 1px;

  background: linear-gradient(90deg, transparent, rgba(185, 28, 28, 0.35), rgba(139, 145, 154, 0.2), transparent);

}



.nav-link::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: -4px;

  width: 0;

  height: 1px;

  background: var(--crimson-accent);

  transition: width 0.4s var(--ease-luxury);

}



.nav-link:hover::after,

.nav-link.is-active::after {

  width: 100%;

}



#mobileMenu.is-open {

  transform: translateX(0);

}



#menuToggle.is-open span:nth-child(1) {

  transform: translateY(7px) rotate(45deg);

}



#menuToggle.is-open span:nth-child(2) {

  opacity: 0;

}



#menuToggle.is-open span:nth-child(3) {

  transform: translateY(-7px) rotate(-45deg);

}



/* ─── Buttons ─── */

.btn-crimson {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  padding: 0.9rem 1.85rem;

  font-family: "Bodoni Moda", serif;

  font-size: 0.72rem;

  font-weight: 600;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: var(--titanium-light);

  background: linear-gradient(135deg, var(--crimson-bright), var(--crimson-accent));

  border: none;

  border-radius: 0;

  transition: transform 0.35s var(--ease-luxury), box-shadow 0.35s;

  box-shadow: 0 4px 28px rgba(185, 28, 28, 0.22);

}



.btn-crimson:hover {

  box-shadow: 0 8px 36px rgba(220, 38, 38, 0.35);

}



.btn-glass {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  padding: 0.9rem 1.85rem;

  font-family: "Bodoni Moda", serif;

  font-size: 0.72rem;

  font-weight: 500;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  color: var(--titanium-mid);

  background: rgba(18, 18, 20, 0.55);

  border: 1px solid rgba(139, 145, 154, 0.22);

  border-radius: 0;

  backdrop-filter: blur(12px);

  transition: border-color 0.35s, color 0.35s, box-shadow 0.35s;

}



.btn-glass:hover {

  border-color: rgba(220, 38, 38, 0.45);

  color: var(--titanium-light);

  box-shadow: 0 0 24px rgba(185, 28, 28, 0.12);

}



.btn-magnetic {

  will-change: transform;

}



/* ─── Lines ─── */

.crimson-line {

  height: 2px;

  background: linear-gradient(90deg, var(--crimson-accent), rgba(139, 145, 154, 0.35));

}



.crimson-line-left {

  width: 3.5rem;

  height: 2px;

  background: linear-gradient(90deg, var(--crimson-accent), transparent);

}



.crimson-underline {

  position: relative;

  display: inline-block;

}



.crimson-underline::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: -2px;

  width: 0;

  height: 1px;

  background: var(--crimson-accent);

  transition: width 0.4s var(--ease-luxury);

}



.crimson-underline:hover::after {

  width: 100%;

}



.crimson-line-draw__path {

  stroke-dasharray: 160;

  stroke-dashoffset: 160;

}



.crimson-line-draw.is-drawn .crimson-line-draw__path {

  stroke-dashoffset: 0;

  transition: stroke-dashoffset 1.4s var(--ease-luxury);

}



/* ─── Glass panels ─── */

.glass-panel {

  background: rgba(18, 18, 20, 0.55);

  border: 1px solid rgba(139, 145, 154, 0.12);

  backdrop-filter: blur(16px);

  -webkit-backdrop-filter: blur(16px);

  transition: border-color 0.4s, box-shadow 0.4s;

}



.glass-panel:hover {

  border-color: rgba(185, 28, 28, 0.25);

  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);

}



/* ─── Orbs ─── */

.orb {

  position: absolute;

  border-radius: 50%;

  filter: blur(80px);

  pointer-events: none;

}



.orb--crimson {

  background: radial-gradient(circle, rgba(185, 28, 28, 0.18), transparent 70%);

}



.orb--events {

  width: 420px;

  height: 420px;

  top: -120px;

  right: -80px;

}



.orb--gallery {

  width: 360px;

  height: 360px;

  bottom: -100px;

  left: -60px;

}



.orb--cta {

  width: 500px;

  height: 500px;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  opacity: 0.5;

}



/* ─── Images ─── */

.img-night {

  filter: saturate(0.75) contrast(1.08) brightness(0.92);

}



.editorial-frame {

  border: 1px solid rgba(139, 145, 154, 0.1);

}



/* ─── Parallax editorial hero ─── */

.parallax-hero {

  position: relative;

  height: 100vh;

  min-height: 640px;

  overflow: hidden;

}



.parallax-hero__pin {

  position: relative;

  width: 100%;

  height: 100vh;

  min-height: 640px;

  overflow: hidden;

}



.parallax-hero__layer {

  position: absolute;

  inset: 0;

  will-change: transform;

}



.parallax-hero__layer--bg {

  z-index: 1;

}



.parallax-hero__layer--bike {

  z-index: 2;

  display: flex;

  align-items: flex-end;

  justify-content: center;

  pointer-events: none;

}



.parallax-hero__layer--type {

  z-index: 3;

  display: flex;

  align-items: center;

}



.parallax-hero__img {

  width: 110%;

  height: 110%;

  object-fit: cover;

  margin: -5%;

}



.parallax-hero__bike {

  max-width: min(72vw, 900px);

  width: 100%;

  height: auto;

  object-fit: contain;

  opacity: 0.92;

  transform: translateY(8%);

  mask-image: linear-gradient(to top, transparent 0%, black 25%);

  -webkit-mask-image: linear-gradient(to top, transparent 0%, black 25%);

}



.parallax-hero__veil {

  position: absolute;

  inset: 0;

  background: linear-gradient(

    165deg,

    rgba(10, 10, 11, 0.55) 0%,

    rgba(10, 10, 11, 0.35) 40%,

    rgba(10, 10, 11, 0.88) 100%

  );

}



.parallax-hero__content {

  position: relative;

  padding-top: 7rem;

  padding-bottom: 6rem;

}



.parallax-hero__title {

  text-shadow: 0 4px 48px rgba(0, 0, 0, 0.5);

}



.parallax-hero__stats {

  position: absolute;

  z-index: 4;

  bottom: 2.5rem;

  right: 1.25rem;

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 0.75rem;

  max-width: 320px;

}



@media (min-width: 640px) {

  .parallax-hero__stats {

    right: 2rem;

    grid-template-columns: repeat(4, 1fr);

    max-width: none;

    gap: 1rem;

  }

}



.hero-stat {

  padding: 0.85rem 1rem;

  min-width: 5.5rem;

}



.parallax-hero__scroll {

  position: absolute;

  z-index: 5;

  bottom: 2.5rem;

  left: 50%;

  transform: translateX(-50%);

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 0.75rem;

}



.parallax-hero__scroll-line {

  display: block;

  width: 1px;

  height: 48px;

  background: linear-gradient(to bottom, var(--crimson-accent), transparent);

  animation: scrollPulse 2s ease-in-out infinite;

}



@media (max-width: 639px) {
  .parallax-hero__scroll {
    display: none;
  }

  .parallax-hero__stats {
    bottom: 1.5rem;
    left: 1.25rem;
    right: 1.25rem;
    max-width: none;
  }
}

@keyframes scrollPulse {
  0%, 100% { opacity: 0.35; transform: scaleY(0.6); transform-origin: top; }
  50% { opacity: 1; transform: scaleY(1); transform-origin: top; }
}



/* ─── Events stack ─── */

.events-stack {

  position: relative;

  padding-bottom: 4rem;

}



.events-stack__card {

  position: sticky;

  top: calc(5rem + var(--stack-index, 0) * 1.5rem);

  margin-bottom: 2rem;

}



.events-stack__card:last-child {

  margin-bottom: 0;

}



.events-stack__inner {

  display: grid;

  gap: 0;

  background: rgba(18, 18, 20, 0.75);

  border: 1px solid rgba(139, 145, 154, 0.12);

  backdrop-filter: blur(12px);

  overflow: hidden;

  transition: border-color 0.4s, transform 0.4s var(--ease-luxury);

}



@media (min-width: 768px) {

  .events-stack__inner {

    grid-template-columns: 1.1fr 1fr;

  }

}



.events-stack__card:hover .events-stack__inner {

  border-color: rgba(185, 28, 28, 0.3);

  transform: translateY(-4px);

}



.events-stack__media {

  position: relative;

}



.events-stack__tag {

  position: absolute;

  top: 1.25rem;

  left: 1.25rem;

  font-family: "Bodoni Moda", serif;

  font-size: 0.65rem;

  letter-spacing: 0.22em;

  text-transform: uppercase;

  color: var(--titanium-light);

  background: rgba(10, 10, 11, 0.85);

  backdrop-filter: blur(8px);

  padding: 0.4rem 0.85rem;

  border-left: 2px solid var(--crimson-accent);

}



.events-stack__body {

  padding: 2rem 2.25rem;

  display: flex;

  flex-direction: column;

  justify-content: center;

}



.events-stack__inner--mobile {

  border: 1px solid rgba(139, 145, 154, 0.12);

}



.events-pagination .swiper-pagination-bullet {

  width: 2rem;

  height: 2px;

  border-radius: 0;

  background: rgba(196, 199, 204, 0.2);

  opacity: 1;

}



.events-pagination .swiper-pagination-bullet-active {

  background: var(--crimson-accent);

  width: 2.5rem;

}



/* ─── Club editorial panels ─── */

.club-panel {

  display: grid;

  gap: 2rem;

  padding: 3rem 0;

  align-items: center;

}



@media (min-width: 1024px) {

  .club-panel {

    grid-template-columns: 4rem 1fr 280px;

    gap: 3rem;

  }

}



.club-panel__num {

  font-size: 3rem;

  line-height: 1;

  color: rgba(139, 145, 154, 0.15);

  font-weight: 500;

}



.club-panel__meta {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 1rem;

}



.club-panel__visual {

  overflow: hidden;

  border: 1px solid rgba(139, 145, 154, 0.1);

}



@media (max-width: 1023px) {

  .club-panel__visual {

    order: -1;

  }

}



/* ─── Bike cards ─── */

.bike-card__img {

  position: relative;

  overflow: hidden;

}



.bike-card__year {

  position: absolute;

  top: 1rem;

  right: 1rem;

  font-size: 0.65rem;

  letter-spacing: 0.2em;

  color: var(--titanium-light);

  background: rgba(10, 10, 11, 0.8);

  padding: 0.3rem 0.65rem;

  border: 1px solid rgba(185, 28, 28, 0.3);

}



/* ─── Night masonry ─── */

.night-masonry {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 1rem;

}



@media (min-width: 768px) {

  .night-masonry {

    grid-template-columns: repeat(3, 1fr);

    gap: 1.25rem;

  }

}



.night-masonry__item {

  position: relative;

  overflow: hidden;

}



.night-masonry__item--tall {

  grid-row: span 2;

}



.night-masonry__item--wide {

  grid-column: span 2;

}



.night-masonry__cap {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  padding: 1.25rem;

  font-family: "Noto Sans JP", sans-serif;

  font-size: 0.75rem;

  color: rgba(229, 231, 235, 0.9);

  background: linear-gradient(transparent, rgba(10, 10, 11, 0.92));

  display: flex;

  align-items: center;

  gap: 0.75rem;

}



.night-masonry__accent {

  display: block;

  width: 24px;

  height: 2px;

  background: var(--crimson-accent);

  flex-shrink: 0;

}



/* ─── Voice cards ─── */

.voice-card {

  padding: 2rem;

  height: 100%;

}



/* ─── Magazine grid ─── */

.magazine-grid {

  display: grid;

  gap: 1.5rem;

}



@media (min-width: 768px) {

  .magazine-grid {

    grid-template-columns: repeat(2, 1fr);

    gap: 2rem;

  }



  .magazine-card--lead {

    grid-column: span 2;

    display: grid;

    grid-template-columns: 1.2fr 1fr;

    gap: 2rem;

    align-items: center;

  }

}



@media (min-width: 1024px) {

  .magazine-grid {

    grid-template-columns: repeat(4, 1fr);

  }



  .magazine-card--lead {

    grid-column: span 2;

    grid-row: span 2;

    display: flex;

    flex-direction: column;

  }

}



.magazine-card__media {

  aspect-ratio: 4/3;

  overflow: hidden;

}



.magazine-card--lead .magazine-card__media {

  aspect-ratio: 16/10;

}



.magazine-card__body {

  padding: 1.25rem 0;

}



.magazine-card--lead .magazine-card__body {

  padding: 1.5rem 0 0;

}



/* ─── Page banner ─── */

.page-banner {

  position: relative;

  min-height: 48vh;

  display: flex;

  align-items: flex-end;

  padding-bottom: 4.5rem;

  padding-top: 8rem;

  overflow: hidden;

}



.page-banner__bg {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.page-banner__veil {

  position: absolute;

  inset: 0;

  background: linear-gradient(to top, var(--midnight) 0%, rgba(10, 10, 11, 0.65) 50%, rgba(10, 10, 11, 0.45) 100%);

}



/* ─── Forms ─── */

.tkb-input {

  display: block;

  width: 100%;

  padding: 0.9rem 1rem;

  font-family: "Noto Sans JP", sans-serif;

  font-size: 0.9rem;

  color: var(--titanium-mid);

  background: rgba(18, 18, 20, 0.65);

  border: 1px solid rgba(139, 145, 154, 0.18);

  border-radius: 0;

  outline: none;

  transition: border-color 0.3s, box-shadow 0.3s;

}



.tkb-input:focus {

  border-color: rgba(185, 28, 28, 0.5);

  box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.08);

}



textarea.tkb-input {

  min-height: 8rem;

  resize: vertical;

}



select.tkb-input {

  cursor: pointer;

}



/* ─── FAQ ─── */

.faq-item summary {

  list-style: none;

}



.faq-item summary::-webkit-details-marker {

  display: none;

}



.faq-item.is-open {

  border-color: rgba(185, 28, 28, 0.3) !important;

}



/* ─── Reveal clip ─── */

.reveal-clip__inner {

  overflow: hidden;

}



.reveal-clip__inner img {

  transform: scale(1.08);

  transition: transform 1.2s var(--ease-luxury);

}



.reveal-clip.is-revealed .reveal-clip__inner img {

  transform: scale(1);

}



/* ─── Footer ─── */

.tkb-footer {

  position: relative;

}



/* ─── Section editorial spacing ─── */

.section-editorial {

  position: relative;

}



/* ─── Fade up fallback ─── */

.fade-up {

  opacity: 0;

  transform: translateY(24px);

  transition: opacity 0.8s var(--ease-luxury), transform 0.8s var(--ease-luxury);

}



.fade-up.is-in {

  opacity: 1;

  transform: translateY(0);

}



/* ─── Reduced motion ─── */

@media (prefers-reduced-motion: reduce) {

  body.tkb { cursor: auto; }

  body.tkb::before { display: none; }

  .tkb-cursor { display: none; }

  .parallax-hero { height: auto; min-height: 0; }

  .parallax-hero__pin { height: auto; min-height: 85vh; }

  .parallax-hero__layer { position: relative; }

  .parallax-hero__layer--bike { display: none; }

  .parallax-hero__scroll-line { animation: none; }

  .events-stack__card { position: relative; top: auto; }

  .reveal-clip__inner { clip-path: none !important; }

  .fade-up { opacity: 1; transform: none; }

  .crimson-line-draw__path { stroke-dashoffset: 0; }

}



/* === Tokyo hero readability fix === */
.parallax-hero {
  height: auto !important;
  min-height: 100svh !important;
  overflow: visible !important;
}
.parallax-hero__pin {
  height: auto !important;
  min-height: 100svh !important;
  overflow: hidden;
  position: relative;
}
.parallax-hero__layer--type {
  position: relative !important;
  z-index: 5 !important;
  display: flex;
  align-items: flex-end;
  padding-bottom: 4rem;
}
.parallax-hero__title {
  font-size: clamp(2.25rem, 6vw, 4.5rem) !important;
  line-height: 1.1 !important;
  max-width: 18ch;
}
.parallax-hero__title span {
  font-size: inherit !important;
}
.parallax-hero__layer--bg {
  position: absolute !important;
  inset: 0;
  z-index: 1;
}
.parallax-hero__layer--bike {
  position: absolute !important;
  inset: 0;
  z-index: 2;
  opacity: 0.55;
  pointer-events: none;
}
.parallax-hero__content {
  position: relative;
  z-index: 6;
  padding-top: 8rem;
}
.parallax-hero__stats {
  position: relative !important;
  z-index: 6;
  bottom: auto !important;
  right: auto !important;
  margin: 2rem 1.25rem 3rem auto;
  max-width: 360px;
}
.parallax-hero__layer--type {
  opacity: 1 !important;
  transform: none !important;
}


/* === Visibility safety (blank section fix) === */
.stat-card,
.process-step,
.svc-card,
.hero-animate,
.hero-fade,
.hero-char,
.hero-reveal,
.hero-stat,
.hero-glass-card,
.hero-brand__title,
.hero-brand__kicker,
[data-aos] {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none;
}
.stats-pinned {
  min-height: auto !important;
}
.gallery-reveal,
.reveal-clip__inner {
  clip-path: none !important;
  -webkit-clip-path: none !important;
}


/* ─── Night gallery — aligned 3-col grid ─── */
.night-masonry {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
  align-items: stretch;
}
@media (min-width: 768px) {
  .night-masonry {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
  }
}
.night-masonry__item {
  position: relative;
  overflow: hidden;
  margin: 0;
  display: flex;
  flex-direction: column;
  background: rgba(18, 18, 20, 0.6);
}
.night-masonry__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  width: 100%;
}
.night-masonry__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.night-masonry__item--tall,
.night-masonry__item--wide {
  grid-row: auto;
  grid-column: auto;
}
.night-masonry__cap {
  position: relative;
  bottom: auto;
  left: auto;
  right: auto;
  padding: 0.9rem 1rem 1.1rem;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.75rem;
  color: rgba(229, 231, 235, 0.85);
  background: transparent;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  line-height: 1.5;
}
.night-masonry__accent {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--crimson-accent);
  flex-shrink: 0;
}

/* ─── Magazine / news — equal card grid ─── */
.magazine-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  align-items: stretch;
}
@media (min-width: 640px) {
  .magazine-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.75rem;
  }
}
@media (min-width: 1024px) {
  .magazine-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }
}
.magazine-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: rgba(18, 18, 20, 0.45);
  border: 1px solid rgba(139, 145, 154, 0.08);
}
.magazine-card--lead {
  grid-column: auto !important;
  grid-row: auto !important;
  display: flex !important;
  flex-direction: column !important;
}
.magazine-card__media {
  aspect-ratio: 3 / 2;
  overflow: hidden;
  width: 100%;
  flex-shrink: 0;
}
.magazine-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s ease;
}
.magazine-card:hover .magazine-card__media img {
  transform: scale(1.04);
}
.magazine-card__body {
  padding: 1.25rem 1.35rem 1.5rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.magazine-card--lead .magazine-card__media {
  aspect-ratio: 3 / 2;
}
.magazine-card--lead .magazine-card__body {
  padding: 1.25rem 1.35rem 1.5rem;
}