.nrf-speakers {
  container-type: inline-size;

  font-family: 'Poppins', system-ui, sans-serif;
  --red: #d3202d;
  --blue: #184bcc;
  --navy: #1e2c54;
  --pink: #cc2e8f;
  --chartreuse: #d1f44f;
  --lightblue: #9ed3fb;
  --ink: #16213f;
  --red-dark: #b5121f;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  /* 1138 - (2 x 24) = 1090 content column, matching the 2027 homepage */
  --shell: 1138px;
  --gutter: 24px;
}

.nrf-speakers :is(h1,h2,h3,h4,h5,h6){text-transform:none;letter-spacing:normal;font-family:inherit}

.nrf-speakers,.nrf-speakers *,.nrf-speakers *::before,.nrf-speakers *::after{box-sizing:border-box}

.nrf-speakers .os{position:relative;background:#fff;padding:20px 0 80px;overflow:hidden}
.nrf-speakers .os-in{max-width:var(--shell);margin:0 auto;padding:0 var(--gutter);position:relative;z-index:2}

.nrf-speakers .os-art{position:absolute;z-index:0;pointer-events:none;user-select:none}
.nrf-speakers .os-art img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.nrf-speakers .os-artL{left:0;top:auto;bottom:0;width:133px}     
.nrf-speakers .os-artR{left:calc(50% + min(545px, 50% - 24px));right:auto;bottom:312px;width:193px}

.nrf-speakers .os-h{
  font-family:'Unbounded',system-ui,sans-serif;font-weight:300;color:var(--red);
  font-size:40px;line-height:1.1;letter-spacing:-.02em;text-align:center;margin:0;
}
.nrf-speakers .os-h b{font-weight:700}
.nrf-speakers .os-sub{
  font-weight:700;font-size:30px;line-height:1.16;letter-spacing:-.01em;
  color:var(--blue);text-align:center;margin:15px 0 0;
}

.nrf-speakers .os-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:46px;margin-top:52px;align-items:stretch}
.nrf-speakers .os-grid>article{display:flex;flex-direction:column}
.nrf-speakers .os-card{
  flex:1 0 auto;
  background-color:var(--chartreuse);
  /*background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21'%3E%3Cpath d='M10.5 8v5M8 10.5h5' stroke='%23b1d600' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");*/
  padding:14px 14px 10px;
}
.nrf-speakers .os-photo{
  position:relative;border:2px solid var(--blue);background:#fff;
  aspect-ratio:142.5/158;overflow:hidden;
}
.nrf-speakers .os-photo>img:not(.os-flag){width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.nrf-speakers .os-flag{position:absolute;right:0;bottom:0;width:36px;aspect-ratio:3/2;object-fit:cover;display:block}
.nrf-speakers .os-name{
  display:block;color:var(--blue);text-transform:uppercase;
  font-weight:800;font-size:14px;line-height:17px;letter-spacing:-.005em;
  margin-top:9px;min-height:34px;
}
.nrf-speakers .os-role{display:block;color:var(--navy);font-style:italic;font-size:10px;line-height:12.5px;margin-top:6px}
.nrf-speakers .os-org{display:block;color:var(--navy);font-size:10px;line-height:12.5px}

.nrf-speakers .os-logo{height:29px;margin:12px 0 12px;display:flex;align-items:center}
.nrf-speakers .os-logo img{max-height:29px;max-width:100%;width:auto;object-fit:contain;display:block}
.nrf-speakers .os-bar{display:block;height:8px;background:var(--chartreuse)}

.nrf-speakers .os-cta{display:flex;gap:15px;justify-content:center;margin-top:64px;flex-wrap:wrap}
.nrf-speakers .os-btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:41px;padding:0 19px;border-radius:12px;text-decoration:none;
  color:#fff;font-weight:700;font-size:18px;letter-spacing:.04em;text-transform:uppercase;
  transition:filter .16s ease;
}
.nrf-speakers .os-btn:hover{filter:brightness(1.08)}
.nrf-speakers .os-red{background:var(--red)}
.nrf-speakers .os-blue{background:var(--blue)}

/* Container horizontal scrolling */
.nrf-speakers .os-grid.os-grid-scroll {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden;
  scroll-snap-type: none !important; 
  -webkit-overflow-scrolling: touch;
  gap: 16px; /* Adjust gap between cards as needed */
  padding-bottom: 20px; /* Space for scrollbar if visible */
}

.nrf-speakers .os-grid.os-grid-scroll > article {
  flex: 0 0 calc((100% - (16px * 4)) / 5) !important;
  min-width: calc((100% - (16px * 4)) / 5) !important;
  box-sizing: border-box;
  scroll-snap-align: start;
}

.nrf-speakers .os-grid.os-grid-scroll::-webkit-scrollbar {
  height: 6px;
}

.nrf-speakers .os-grid.os-grid-scroll::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.nrf-speakers .os-grid.os-grid-scroll::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}


/* Responsive adjustments for tablet and mobile */
@media (max-width: 1024px) {
  .nrf-speakers .os-grid.os-grid-scroll > article {
    /* Show 3 on tablet */
    flex: 0 0 calc((100% - (16px * 2)) / 5) !important;
    min-width: calc((100% - (16px * 2)) / 5) !important;
  }
}

@media (max-width: 600px) {
  .nrf-speakers .os-grid.os-grid-scroll > article {
    /* Show 1.5 on mobile for clear swipe affordance */
    flex: 0 0 70% !important;
    min-width: 70% !important;
  }
}

@container (max-width:1024px){
  .nrf-speakers .os-in{--gutter:26px;padding-left:26px;padding-right:26px}
  .nrf-speakers .os{padding:18px 0 58px}
  .nrf-speakers .os-grid{grid-template-columns:repeat(3,1fr);gap:32px;margin-top:38px}
  .nrf-speakers .os-h{font-size:33px}
  .nrf-speakers .os-sub{font-size:24px;margin-top:13px}
  .nrf-speakers .os-artL{top:176px;bottom:auto;width:108px}
  .nrf-speakers .os-artR{left:calc(50% + min(545px, 50% - 26px));top:196px;width:150px}
  .nrf-speakers .os-cta{margin-top:46px}
}
@container (max-width:700px){
  .nrf-speakers .os-in{--gutter:18px;padding-left:18px;padding-right:18px}
  .nrf-speakers .os{padding:16px 0 40px}
  .nrf-speakers .os-grid{grid-template-columns:repeat(2,1fr);gap:18px;margin-top:28px}
  .nrf-speakers .os-h{font-size:27px}
  .nrf-speakers .os-sub{font-size:19px;margin-top:10px}
  .nrf-speakers .os-card{padding:10px 10px 11px}
  .nrf-speakers .os-name{font-size:13px;line-height:16px;margin-top:9px;min-height:32px}
  .nrf-speakers .os-role,.nrf-speakers .os-org{font-size:12px;line-height:12.5px}
  .nrf-speakers .os-flag{width:30px}
  .nrf-speakers .os-logo{height:22px;margin:9px 0 9px}
  .nrf-speakers .os-logo img{max-height:22px}
  .nrf-speakers .os-bar{height:6px}
  /* the devices would crowd a phone - the left one only, much reduced */
  .nrf-speakers .os-artL{top:132px;bottom:auto;width:66px;opacity:.85}
  .nrf-speakers .os-artR{display:none}
  .nrf-speakers .os-cta{margin-top:32px;gap:10px}
  .nrf-speakers .os-btn{height:38px;padding:0 20px;font-size:15px;border-radius:10px}
}