/* =============================================================
   NLIGN — TIM (Technical Information Meeting) Page
   Cloned from about.css — same tokens, patterns & breakpoints.
   Covers: Hero · Event Details · What to Expect · Guest Speakers
           · Attendee Requirements · Previous Attendees
           · Don't Miss · Contact / Reach Out · Snag Your Spot
   ============================================================= */


/* ── Shared inner wrapper ────────────────────────────────── */

.nlign-tim-hero__container,
.nlign-tim-join-us__container,
.nlign-tim-event__container,
.nlign-tim-expect__container,
.nlign-tim-speakers__container,
.nlign-tim-cert__container,
.nlign-tim-attendees__container,
.nlign-tim-dont-miss__container,
.nlign-tim-contact__container,
.nlign-tim-snag__container {
  max-width:      var(--nlign-max-width);       /* 1440px */
  margin:         0 auto;
  padding:        0 var(--nlign-section-padding-x); /* 0 120px */
}

/* ── Shared section label — orange uppercase ─────────────── */
.nlign-tim-section__label {
  font-family:    var(--nlign-subhead-font-family);
  font-weight:    var(--nlign-subhead-font-weight);
  font-size:      var(--nlign-subhead-font-size);
  line-height:    var(--nlign-subhead-line-height);
  text-transform: uppercase;
  color:          var(--nlign-color-orange);
  margin:         0 0 16px 0;
  padding:        0;
}

/* ── Orange accent span ──────────────────────────────────── */
.nlign-tim--accent {
  color: var(--nlign-color-orange);
}

/* ── Shared small body copy — Inter 400 18/28 ────────────── */
.nlign-tim-body-sm {
  font-family: var(--nlign-subhead-font-family);
  font-weight: 400;
  font-size:   18px;
  line-height: 28px;
  color:       var(--nlign-color-dust-grey);
  margin:      0;
  padding:     0;
}


/* =============================================================
   1. HERO BANNER
   ============================================================= */

.nlign-tim-hero {
  background-color: var(--nlign-color-onyx-800);
  padding:          var(--nlign-section-padding-y) 0;
  width:            100%;
}

/* Two-column: left text · right image */
.nlign-tim-hero__container {
  display:     flex;
  align-items: center;
  gap:         64px;
}

.nlign-tim-hero__left {
  flex:            0 0 55%;
  display:         flex;
  flex-direction:  column;
  gap:             24px;
}

.nlign-tim-hero__right {
  flex:      1;
  min-width: 0;
}

.nlign-tim-hero__image {
  display:    block;
  width:      100%;
  height:     auto;
  object-fit: cover;
}

.nlign-tim-hero__eyebrow {
  font-family:    var(--nlign-subhead-font-family);
  font-weight:    var(--nlign-subhead-font-weight);
  font-size:      var(--nlign-subhead-font-size);
  line-height:    var(--nlign-subhead-line-height);
  text-transform: uppercase;
  color:          var(--nlign-color-orange);
  margin:         0;
}

.nlign-tim-hero__heading {
  font-family: var(--nlign-h1-font-family);
  font-weight: var(--nlign-h1-font-weight);
  font-size:   var(--nlign-h1-font-size);
  line-height: var(--nlign-h1-line-height);
  color:       var(--nlign-color-dust-grey);
  margin:      0;
  padding:     0;
}

/* Event meta list: date · time · venue */
.nlign-tim-hero__meta {
  list-style: none;
  margin:     0;
  padding:    0;
  display:    flex;
  flex-direction: column;
  gap:        12px;
}

.nlign-tim-hero__meta-item {
  display:     flex;
  align-items: center;
  gap:         10px;
  font-family: var(--nlign-subhead-font-family);
  font-weight: 600;
  font-size:   16px;
  line-height: 24px;
  color:       var(--nlign-color-dust-grey);
}

.nlign-tim-hero__meta-icon {
  color:       var(--nlign-color-orange);
  width:       20px;
  height:      20px;
  flex-shrink: 0;
}

.nlign-tim-hero__cta {
  display:          inline-block;
  align-self:       flex-start;
  background-color: var(--nlign-color-orange);
  color:            #000;
  font-family:      var(--nlign-nav-font-family);
  font-weight:      var(--nlign-nav-font-weight);
  font-size:        14px;
  letter-spacing:   1px;
  text-transform:   uppercase;
  text-decoration:  none;
  padding:          14px 32px;
  border-radius:    0;
  transition:       background-color var(--nlign-transition);
}

.nlign-tim-hero__cta:hover {
  background-color: #d43a14;
  color:            #000;
}


/* =============================================================
   2. JOIN US
   ============================================================= */

.nlign-tim-join-us {
  background: #0E0E0E;
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

.nlign-tim-join-us__container {
  /* display:        flex; */
  flex-direction: column;
  align-items:    flex-end;
  text-align:     left;
  gap:            24px;
}

.nlign-tim-join-us__subheading {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size:   20px;
  line-height: 28px;
  color:       var(--nlign-color-orange);
  margin:      0;
}

.nlign-tim-join-us__tagline {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size:   64px;
  line-height: 68px;
  color:       #ebeae6;
  margin:      0;
}

.nlign-tim-join-us__tagline--accent {
  color: var(--nlign-color-orange);
}

.nlign-tim-join-us__description {
  font-family: var(--nlign-body-font-family);
  font-weight: var(--nlign-body-font-weight);
  font-size:   var(--nlign-body-font-size);
  line-height: var(--nlign-body-line-height);
  color:       var(--nlign-color-dust-grey);
  max-width:   800px;
  margin:      0;
}

/* =============================================================
   3. EVENT DETAILS
   ============================================================= */

.nlign-tim-event {
  background: #0E0E0E;
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

.nlign-tim-event__meta {
  list-style: none;
  margin:     0 0 48px 0;
  padding:    0;
  display:    flex;
  flex-wrap:  wrap;
  gap:        32px;
}

.nlign-tim-event__meta-item {
  font-family:  var(--nlign-subhead-font-family);
  font-weight:  700;
  font-size:    20px;
  line-height:  28px;
  color:        var(--nlign-color-dust-grey);
  padding-left: 28px;
  position:     relative;
}

.nlign-tim-event__meta-item::before {
  content:    '●';
  position:   absolute;
  left:       0;
  color:      var(--nlign-color-orange);
  font-size:  12px;
  top:        6px;
}

.nlign-tim-event__image-wrap {
  width: 100%;
}

.nlign-tim-event__image {
  display:    block;
  width:      100%;
  height:     auto;
  object-fit: cover;
}


/* =============================================================
   3. WHAT TO EXPECT
   ============================================================= */

.nlign-tim-expect {
  background: var(--nlign-color-onyx-800);
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

.nlign-tim-expect__heading {
  font-family:   var(--nlign-h1-font-family);
  font-weight:   700;
  font-size:     64px;
  line-height:   68px;
  color:         var(--nlign-color-dust-grey);
  margin:        0 0 64px 0;
  padding:       0;
}

.nlign-tim-expect__grid {
  display:               grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap:                   40px;
}

.nlign-tim-expect__item {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  text-align:     center;
  gap:            16px;
}

.nlign-tim-expect__icon-img {
  display:    block;
  width:      64px;
  height:     64px;
  object-fit: contain;
  margin:     0 auto;
}

.nlign-tim-expect__item-title {
  font-family: var(--nlign-subhead-font-family);
  font-weight: 700;
  font-size:   20px;
  line-height: 28px;
  color:       var(--nlign-color-dust-grey);
  margin:      0;
}

.nlign-tim-expect__item-desc {
  font-family: var(--nlign-body-font-family);
  font-weight: var(--nlign-body-font-weight);
  font-size:   var(--nlign-body-font-size);
  line-height: var(--nlign-body-line-height);
  color:       var(--nlign-color-dust-grey);
  margin:      0;
}


/* =============================================================
   4. PREVIOUS GUEST SPEAKERS
   ============================================================= */

.nlign-tim-speakers {
  background: #0E0E0E;
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

/* Two-column: left content (60%) · right image (fills rest) */
.nlign-tim-speakers__container {
  display:     flex;
  align-items: center;
  gap:         56px;
}

.nlign-tim-speakers__left {
  flex:      0 0 60%;
  min-width: 0;
}

.nlign-tim-speakers__right {
  flex:      1;
  min-width: 0;
}

.nlign-tim-speakers__section-img {
  display:    block;
  width:      100%;
  height:     auto;
  object-fit: cover;
}

.nlign-tim-speakers__heading {
  font-family:   var(--nlign-h1-font-family);
  font-weight:   700;
  font-size:     64px;
  line-height:   68px;
  color:         var(--nlign-color-dust-grey);
  margin:        0 0 56px 0;
}

/* Single list auto-split into 2 columns */
.nlign-tim-speakers__grid {
  display:               grid;
  grid-template-columns: repeat(2, 1fr);
  gap:                   20px 40px;
  list-style:            none;
  margin:                0;
  padding:               0;
}

/* Each item: round avatar + name inline */
.nlign-tim-speakers__item {
  display:     flex;
  align-items: center;
  gap:         14px;
}

/* Uploaded avatar image — circular */
.nlign-tim-speakers__avatar {
  display:       block;
  flex-shrink:   0;
  width:         44px;
  height:        44px;
  border-radius: 50%;
  object-fit:    cover;
  overflow:      hidden;
}

/* Default SVG placeholder — same size, no border */
.nlign-tim-speakers__avatar--default {
  width:  44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
}

.nlign-tim-speakers__avatar--default svg {
  display: block;
  width:   100%;
  height:  100%;
}

.nlign-tim-speakers__name {
  font-family: var(--nlign-subhead-font-family);
  font-weight: 400;
  font-size:   18px;
  line-height: 28px;
  color:       var(--nlign-color-dust-grey);
}


/* =============================================================
   5. ATTENDEE CERTIFICATION REQUIREMENTS
   ============================================================= */

.nlign-tim-cert {
  background: var(--nlign-color-onyx-800);
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

.nlign-tim-cert__heading {
  font-family:   var(--nlign-h1-font-family);
  font-weight:   700;
  font-size:     64px;
  line-height:   68px;
  color:         var(--nlign-color-dust-grey);
  margin:        0 0 32px 0;
}

.nlign-tim-cert__intro {
  font-family: var(--nlign-body-font-family);
  font-weight: var(--nlign-body-font-weight);
  font-size:   var(--nlign-body-font-size);
  line-height: var(--nlign-body-line-height);
  color:       var(--nlign-color-dust-grey);
  margin:      0 0 48px 0;
  max-width:   800px;
}

.nlign-tim-cert__groups {
  display: flex;
  gap:     48px;
}

.nlign-tim-cert__group {
  flex:            1;
  padding:         32px;
  border-left:     3px solid var(--nlign-color-orange);
  background:      rgba(255, 255, 255, 0.03);
}

.nlign-tim-cert__group-heading {
  font-family: var(--nlign-subhead-font-family);
  font-weight: 700;
  font-size:   20px;
  line-height: 30px;
  color:       var(--nlign-color-orange);
  margin:      0 0 16px 0;
}

.nlign-tim-cert__group-text {
  font-family: var(--nlign-body-font-family);
  font-weight: var(--nlign-body-font-weight);
  font-size:   var(--nlign-body-font-size);
  line-height: var(--nlign-body-line-height);
  color:       var(--nlign-color-dust-grey);
  margin:      0;
}


/* =============================================================
   6. PREVIOUS ATTENDEES — LOGO GRID
   ============================================================= */

.nlign-tim-attendees {
  background: #0E0E0E;
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

.nlign-tim-attendees__heading {
  font-family:   var(--nlign-h1-font-family);
  font-weight:   700;
  font-size:     64px;
  line-height:   68px;
  color:         var(--nlign-color-dust-grey);
  margin:        0 0 56px 0;
}

.nlign-tim-attendees__grid {
  display:               grid;
  grid-template-columns: repeat(6, 1fr);
  gap:                   40px;
  align-items:           center;
  justify-items:         center;
}

.nlign-tim-attendees__logo {
  display:         flex;
  align-items:     center;
  justify-content: center;
}

.nlign-tim-attendees__logo-img {
  display:          block;
  max-width:        100%;
  max-height:       80px;
  width:            auto;
  height:           auto;
  object-fit:       contain;
  background-color: #ffffff;
  padding:          10px;
}


/* =============================================================
   7. DON'T MISS YOUR CHANCE — CTA SECTION
   ============================================================= */

.nlign-tim-dont-miss {
  position:            relative;
  background-color:    var(--nlign-color-onyx-800);
  background-size:     cover;
  background-position: center;
  background-repeat:   no-repeat;
  padding:             var(--nlign-section-padding-y) 0;
  width:               100%;
}

.nlign-tim-dont-miss::before {
  content:    '';
  position:   absolute;
  inset:      0;
  background: rgba(0, 0, 0, 0.6);
}

.nlign-tim-dont-miss__container {
  position:        relative;
  display:         flex;
  flex-direction:  row;
  align-items:     center;
  justify-content: space-between;
  gap:             48px;
  text-align:      left;
}

.nlign-tim-dont-miss__text {
  flex: 1;
}

.nlign-tim-dont-miss__action {
  flex-shrink: 0;
  display:     flex;
  flex-direction: column;
  align-items: flex-start;
  gap:         24px;
}

.nlign-tim-dont-miss__heading {
  font-family: var(--nlign-h1-font-family);
  font-weight: 700;
  font-size:   64px;
  line-height: 68px;
  color:       var(--nlign-color-dust-grey);
  margin:      0;
}

/* .nlign-tim-dont-miss__cta replaced by nlign-btn--solid */

.nlign-tim-dont-miss__qr {
  margin-top: 32px;
}

.nlign-tim-dont-miss__qr-img {
  display:  block;
  margin:   0 auto;
  width:    140px;
  height:   auto;
}


/* =============================================================
   8. QUESTIONS / REACH OUT
   ============================================================= */

.nlign-tim-contact {
  background: var(--nlign-color-onyx-800);
  padding:    var(--nlign-section-padding-y) 0;
  width:      100%;
}

.nlign-tim-contact__container {
  display:     flex;
  align-items: flex-start;
  gap:         64px;
}

.nlign-tim-contact__content {
  flex:            0 0 42%;
  display:         flex;
  flex-direction:  column;
  gap:             20px;
}

.nlign-tim-contact__questions-heading {
  font-family: var(--nlign-h1-font-family);
  font-weight: 700;
  font-size:   64px;
  line-height: 68px;
  color:       var(--nlign-color-dust-grey);
  margin:      0;
}

.nlign-tim-contact__reach-heading {
  font-family:    'Inter', sans-serif;
  font-weight:    400;
  font-size:      20px;
  line-height:    28px;
  color:          var(--nlign-color-orange);
  text-transform: uppercase;
  margin:         0;
}

.nlign-tim-contact__address {
  font-family: var(--nlign-body-font-family);
  font-weight: var(--nlign-body-font-weight);
  font-size:   var(--nlign-body-font-size);
  line-height: var(--nlign-body-line-height);
  color:       var(--nlign-color-dust-grey);
  font-style:  normal;
  margin:      0;
}

.nlign-tim-contact__phone {
  font-family: var(--nlign-body-font-family);
  font-weight: 700;
  font-size:   20px;
  line-height: 28px;
  color:       var(--nlign-color-dust-grey);
  margin:      0;
}

.nlign-tim-contact__phone a {
  color:           inherit;
  text-decoration: none;
  transition:      color var(--nlign-transition);
}

.nlign-tim-contact__phone a:hover { color: var(--nlign-color-orange); }

.nlign-tim-contact__email {
  font-family:     var(--nlign-body-font-family);
  font-size:       var(--nlign-body-font-size);
  color:           var(--nlign-color-dust-grey);
  text-decoration: underline;
  transition:      color var(--nlign-transition);
}

.nlign-tim-contact__email:hover { color: var(--nlign-color-orange); }

.nlign-tim-contact__image-wrap {
  flex:    1;
  min-width: 0;
}

.nlign-tim-contact__image {
  display:    block;
  width:      100%;
  height:     auto;
  object-fit: cover;
}


/* =============================================================
   9. SNAG YOUR SPOT — FINAL CTA / REGISTRATION
   ============================================================= */

.nlign-tim-snag {
  position:            relative;
  background-color:    #0E0E0E;
  background-size:     cover;
  background-position: center;
  background-repeat:   no-repeat;
  padding:             var(--nlign-section-padding-y) 0;
  width:               100%;
}

.nlign-tim-snag::before {
  content:    '';
  position:   absolute;
  inset:      0;
  background: rgba(0, 0, 0, 0.6);
}

.nlign-tim-snag__container {
  position:   relative;
  text-align: center;
}

.nlign-tim-snag__heading {
  font-family: var(--nlign-h1-font-family);
  font-weight: 700;
  font-size:   64px;
  line-height: 68px;
  color:       var(--nlign-color-dust-grey);
  margin:      0 0 40px 0;
}

.nlign-tim-snag__cta {
  display:          inline-block;
  background-color: var(--nlign-color-orange);
  color:            #000;
  font-family:      var(--nlign-nav-font-family);
  font-weight:      var(--nlign-nav-font-weight);
  font-size:        14px;
  letter-spacing:   1px;
  text-transform:   uppercase;
  text-decoration:  none;
  padding:          14px 40px;
  border-radius:    0;
  transition:       background-color var(--nlign-transition);
}

.nlign-tim-snag__cta:hover {
  background-color: #d43a14;
  color:            #000;
}

.nlign-tim-snag__qr {
  margin-top: 32px;
}

.nlign-tim-snag__qr-img {
  display: block;
  margin:  0 auto;
  width:   140px;
  height:  auto;
}


/* =============================================================
   RESPONSIVE
   ============================================================= */

/* ── 1032px and below ─────────────────────────────────────── */
@media (max-width: 1032px) {
  .nlign-tim-attendees__grid {
    grid-template-columns: repeat(3, 1fr);
    justify-content:       center;
  }
}

/* ── Large tablet ≤ 1199px ───────────────────────────────── */
@media (max-width: 1199.98px) {
  .nlign-tim-hero__heading,
  .nlign-tim-expect__heading,
  .nlign-tim-speakers__heading,
  .nlign-tim-cert__heading,
  .nlign-tim-attendees__heading,
  .nlign-tim-dont-miss__heading,
  .nlign-tim-contact__questions-heading,
  .nlign-tim-snag__heading {
    font-size:   52px;
    line-height: 56px;
  }

  .nlign-tim-attendees__grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .nlign-tim-attendees__logo-img{
    max-height: unset;
  }
      .nlign-tim-attendees__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ── Tablet ≤ 991px ──────────────────────────────────────── */
@media (max-width: 991.98px) {
  .nlign-tim-hero__heading,
  .nlign-tim-expect__heading,
  .nlign-tim-speakers__heading,
  .nlign-tim-cert__heading,
  .nlign-tim-attendees__heading,
  .nlign-tim-dont-miss__heading,
  .nlign-tim-contact__questions-heading,
  .nlign-tim-snag__heading {
    font-size:   42px;
    line-height: 48px;
  }

  .nlign-tim-hero__subheading  { font-size: 28px; line-height: 36px; }
  .nlign-tim-contact__reach-heading { font-size: 30px; line-height: 38px; }

  .nlign-tim-expect__grid      { grid-template-columns: repeat(2, 1fr); }
  .nlign-tim-attendees__grid   { grid-template-columns: repeat(3, 1fr); }
  .nlign-tim-speakers__container { flex-direction: column; }
  .nlign-tim-speakers__right    { flex: unset; width: 100%; }
  .nlign-tim-speakers__grid     { grid-template-columns: 1fr; }
  .nlign-tim-cert__groups      { flex-direction: column; }

  .nlign-tim-contact__container {
    flex-direction: column;
  }
  .nlign-tim-contact__content {
    flex: unset;
    width: 100%;
  }
}

/* ── Mobile ≤ 767px ──────────────────────────────────────── */
@media (max-width: 767px) {
  .nlign-tim-hero__container,
  .nlign-tim-join-us__container,
  .nlign-tim-event__container,
  .nlign-tim-expect__container,
  .nlign-tim-speakers__container,
  .nlign-tim-cert__container,
  .nlign-tim-attendees__container,
  .nlign-tim-dont-miss__container,
  .nlign-tim-contact__container,
  .nlign-tim-snag__container {
    padding: 0 24px;
  }

  .nlign-tim-hero,
  .nlign-tim-join-us,
  .nlign-tim-event,
  .nlign-tim-expect,
  .nlign-tim-speakers,
  .nlign-tim-cert,
  .nlign-tim-attendees,
  .nlign-tim-dont-miss,
  .nlign-tim-contact,
  .nlign-tim-snag {
    padding: 60px 0;
  }

  .nlign-tim-hero__heading,
  .nlign-tim-expect__heading,
  .nlign-tim-speakers__heading,
  .nlign-tim-cert__heading,
  .nlign-tim-attendees__heading,
  .nlign-tim-dont-miss__heading,
  .nlign-tim-contact__questions-heading,
  .nlign-tim-snag__heading {
    font-size:   36px;
    line-height: 42px;
  }

  .nlign-tim-event__meta       { flex-direction: column; gap: 16px; }
  .nlign-tim-expect__grid      { grid-template-columns: 1fr; }
  .nlign-tim-attendees__grid   { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}

/* ── Don't Miss: stack on tablet ────────────────────────── */
@media (max-width: 767px) {
  .nlign-tim-dont-miss__container {
    flex-direction: column;
    align-items:    flex-start;
    gap:            32px;
  }
}

/* ── Mobile ≤ 480px ──────────────────────────────────────── */
@media (max-width: 480px) {
  .nlign-tim-hero__heading,
  .nlign-tim-expect__heading,
  .nlign-tim-speakers__heading,
  .nlign-tim-cert__heading,
  .nlign-tim-attendees__heading,
  .nlign-tim-dont-miss__heading,
  .nlign-tim-contact__questions-heading,
  .nlign-tim-snag__heading {
    font-size:   28px;
    line-height: 34px;
  }

  .nlign-tim-hero__subheading        { font-size: 22px; line-height: 30px; }
  .nlign-tim-dont-miss__qr-img,
  .nlign-tim-snag__qr-img            { width: 110px; }
  .nlign-tim-attendees__grid         { grid-template-columns: repeat(2, 1fr); }
}