/* Sensei Fred Jordan website refinements, Oct 2026 */
/* An exact centerline through the circular brand mark, independent of font rendering. */
.brand-symbol{display:inline-flex;align-items:center;justify-content:center;flex:0 0 45px;width:45px;height:45px;transform:none;line-height:1;color:#C6A257}
.brand-symbol svg{display:block;width:100%;height:100%;overflow:visible}
@media (max-width:560px){.brand-symbol{flex-basis:37px;width:37px;height:37px}}
/* The Rule of 72 image belongs to Financial Readiness / Akari Advisors. */
.offering-money:before{background-image:url('assets/financial-teaching.webp');background-size:cover;background-position:center 30%}
/* Speaking / Facilitation uses its own visual rather than a financial lesson photo. */
.offering-speak:before{background-image:radial-gradient(circle at 73% 35%,rgba(198,162,87,.22) 0,rgba(198,162,87,0) 32%),linear-gradient(135deg,#244D93 0%,#142F67 46%,#071B40 100%);background-position:center}
.offering-speak:after{background:linear-gradient(180deg,rgba(3,17,43,.04),rgba(3,17,43,.79))}
.offering-speak .speaker-symbol{position:absolute;z-index:0;top:12%;right:12%;width:38%;height:44%;opacity:.66;pointer-events:none}
.offering-speak .speaker-symbol svg{height:100%;width:100%}
.offering-speak .offering-bottom,.offering-speak .offering-mark{z-index:1}
/* The original full-size historical brick-breaking photograph should never be cropped. */
.legacy-media{background:#122B55}
.legacy-media:before{content:'';position:absolute;inset:-10px;z-index:0;background:url('assets/martial-arts-legacy.webp') center / cover no-repeat;filter:blur(24px) brightness(.3);transform:scale(1.08)}
.legacy-media img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center center;filter:none}
.legacy-media:after{z-index:2;inset:76% 0 0;background:linear-gradient(0deg,rgba(5,17,40,.86),rgba(5,17,40,0))}
.legacy-media .photo-caption{z-index:3}

/* Mobile horizontal-scroll repair, 14 October 2026.
   Previously, aspect-ratio:1.32 combined with min-height:275px set a
   minimum tile width of ~363px, beyond the usable width of narrow phones.
   Let mobile cards grow vertically without forcing horizontal overflow. */
@media (max-width: 560px) {
  .offering-grid { grid-template-columns: minmax(0, 1fr); }
  .offering-card {
    aspect-ratio: auto;
    width: 100%;
    min-width: 0;
    min-height: 295px;
  }
  .offering-bottom { min-width: 0; max-width: 100%; }
  .offering-bottom strong { overflow-wrap: anywhere; }
}
@media (max-width: 390px) {
  .offering-card { min-height: 310px; }
  .offering-bottom { padding-right: 30px; }
  .offering-bottom strong { font-size: clamp(27px, 8.45vw, 32px); line-height: 1.11; }
}