:root {
  --font-display: "Bebas Neue","Arial Narrow",sans-serif;
  --font-condensed: "Roboto Condensed","Arial Narrow",sans-serif;
  --font-body: "Inter",system-ui,-apple-system,Segoe UI,sans-serif;
  --ink: #0a0a0a;
  --paper: #fbfaf4;
  --white: #fff;
  --chalk: #f2eee2;
  --sand: #e6dac7;
  --sun: #ffd84a;
  --sun-soft: #fff1a6;
  --peach: #ffc9b7;
  --peach-deep: #e88966;
  --copper: #b85f3f;
  --teal: #214f57;
  --night: #06080d;
  --night-2: #101721;
  --muted: #5b616b;
  --line: #171717;
  --soft-line: #d8cfc1;
  --container: 1260px;
  --nav: 78px;
  --ease: 260ms ease;
}

* {
  box-sizing:border-box
}

html {
  font-size: 16px;
  scroll-behavior:smooth
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  line-height: 1.55;
  overflow-x:hidden
}

img {
  display: block;
  max-width:100%
}

a {
  color: inherit;
  text-decoration:none
}

button {
  font:inherit
}

.container {
  width: min(var(--container),calc(100% - 52px));
  margin-inline:auto
}

.section {
  padding:clamp(4.5rem,8vw,8.5rem) 0
}

.site-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--nav);
  z-index: 50;
  display: flex;
  align-items: center;
  color: #fff;
  transition:background var(--ease),height var(--ease),color var(--ease),box-shadow var(--ease)
}

.site-nav.scrolled,.site-nav.open {
  height: 66px;
  background: rgba(251,250,244,.96);
  color: #000;
  box-shadow: 0 12px 40px rgba(0,0,0,.12);
  backdrop-filter:blur(16px)
}

.nav-grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap:1.2rem
}

.brand {
  display: flex;
  align-items: baseline;
  gap: .25rem;
  letter-spacing:-.01em
}

.brand b {
  font:400 2rem/.8 var(--font-display)
}

.brand span {
  font: 700 .95rem/1 var(--font-condensed);
  letter-spacing: .18em;
  color: var(--sun);
  text-transform:uppercase
}

.site-nav.scrolled .brand span,.site-nav.open .brand span {
  color:var(--copper)
}

.nav-links {
  display: flex;
  align-items: center;
  gap: .1rem;
  list-style: none;
  margin: 0;
  padding:0
}

.nav-links a {
  display: block;
  padding: .52rem .7rem;
  font: 700 .88rem/1 var(--font-condensed);
  letter-spacing: .13em;
  text-transform: uppercase;
  position:relative
}

.nav-links a::after {
  content: "";
  position: absolute;
  left: .7rem;
  right: .7rem;
  bottom: .25rem;
  height: 5px;
  background: var(--sun);
  z-index: -1;
  transform: scaleX(0);
  transform-origin: left;
  transition:var(--ease)
}

.nav-links a:hover::after {
  transform:scaleX(1)
}

.nav-submit {
  background: var(--sun);
  color: #000!important;
  margin-left: .35rem;
  border:1px solid rgba(0,0,0,.18)
}

.nav-submit::after {
  display:none
}

.nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: var(--sun);
  position:relative
}

.nav-toggle i,.nav-toggle i::before,.nav-toggle i::after {
  content: "";
  position: absolute;
  left: 11px;
  width: 22px;
  height: 2px;
  background: #000;
  transition:var(--ease)
}

.nav-toggle i {
  top:21px
}

.nav-toggle i::before {
  top: -7px;
  left:0
}

.nav-toggle i::after {
  top: 7px;
  left:0
}

.site-nav.open .nav-toggle i {
  background:transparent
}

.site-nav.open .nav-toggle i::before {
  top: 0;
  transform:rotate(45deg)
}

.site-nav.open .nav-toggle i::after {
  top: 0;
  transform:rotate(-45deg)
}

.hero {
  min-height: 100vh;
  position: relative;
  background: #000;
  color: #fff;
  display: grid;
  align-items: center;
  overflow:hidden
}

.hero-slides,.hero-slide,.hero-screen {
  position: absolute;
  inset:0
}

.hero-slide {
  background-image: var(--image);
  background-size: cover;
  background-position: center;
  opacity: 0;
  transform: scale(1.06);
  transition:opacity 1200ms ease,transform 7000ms ease
}

.hero-slide.active {
  opacity: 1;
  transform:scale(1)
}

.hero-screen {
  background:linear-gradient(90deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.72) 36%,rgba(0,0,0,.36) 100%)
}

.hero-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size: 86px 86px;
  mask-image:linear-gradient(90deg,#000,transparent 78%)
}

.hero-inner {
  position: relative;
  z-index: 2;
  padding-top: var(--nav);
  display: grid;
  grid-template-columns: minmax(0,1fr) 380px;
  gap: 2rem;
  align-items:end
}

.sup-title {
  font: 700 clamp(1rem,1.8vw,1.35rem)/1 var(--font-condensed);
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--sun);
  margin:0 0 .7rem
}

.hero h1 {
  font: 400 clamp(6rem,18vw,15.5rem)/.78 var(--font-display);
  letter-spacing: .005em;
  text-transform: uppercase;
  margin:0
}

.hero h1 span {
  background: linear-gradient(transparent 45%,var(--sun) 45%);
  padding: 0 .04em 0 0;
  color:#fff
}

.hero h1 em {
  font-style: normal;
  color: var(--peach);
  margin-left:.04em
}

.hero h2 {
  font: 400 clamp(2rem,5.4vw,5.4rem)/.88 var(--font-display);
  letter-spacing: .005em;
  text-transform: uppercase;
  max-width: 940px;
  margin:.3rem 0 1rem
}

.hero-lead {
  max-width: 720px;
  color: rgba(255,255,255,.78);
  font: 600 1.08rem/1.55 var(--font-condensed);
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-bottom:1.4rem
}

.hero-actions {
  display: flex;
  gap: .8rem;
  flex-wrap:wrap
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  border: 2px solid currentColor;
  padding: .82rem 1.25rem;
  font: 700 .98rem/1 var(--font-condensed);
  letter-spacing: .13em;
  text-transform: uppercase;
  transition: var(--ease);
  cursor:pointer
}

.btn:hover {
  transform:translateY(-3px)
}

.btn-sun {
  background: var(--sun);
  border-color: var(--sun);
  color:#000
}

.btn-sun:hover {
  background: #fff;
  border-color:#fff
}

.btn-clear {
  background: transparent;
  color: #fff;
  border-color:rgba(255,255,255,.72)
}

.btn-clear:hover {
  background: #fff;
  color: #000;
  border-color:#fff
}

.btn-dark {
  background: #000;
  color: #fff;
  border-color:#000
}

.btn-dark:hover {
  background: var(--sun);
  color: #000;
  border-color:var(--sun)
}

.hero-card {
  background: rgba(6,8,13,.68);
  border: 1px solid rgba(255,255,255,.24);
  backdrop-filter: blur(18px);
  padding: 1.25rem;
  box-shadow:0 30px 90px rgba(0,0,0,.38)
}

.hero-card>b {
  display: block;
  font: 700 .94rem var(--font-condensed);
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--sun);
  margin-bottom:.95rem
}

.countdown {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap:.5rem
}

.countdown span {
  display: block;
  text-align: center;
  border: 1px solid rgba(255,255,255,.18);
  padding: .85rem .4rem;
  background:rgba(255,255,255,.06)
}

.countdown strong {
  display: block;
  font: 400 2.35rem/.85 var(--font-display);
  color:#fff
}

.countdown small {
  font: 700 .68rem/1 var(--font-condensed);
  letter-spacing: .14em;
  text-transform: uppercase;
  color:rgba(255,255,255,.62)
}

.slide-dots {
  position: absolute;
  z-index: 3;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap:.55rem
}

.slide-dots button {
  width: 46px;
  height: 5px;
  border: 0;
  background: rgba(255,255,255,.38);
  padding:0
}

.slide-dots button.active {
  background:var(--sun)
}

.label {
  display: inline-block;
  font: 700 .92rem/1 var(--font-condensed);
  letter-spacing: .19em;
  text-transform: uppercase;
  color: #000;
  background: linear-gradient(transparent 42%,var(--sun) 42%);
  padding: 0 .14rem;
  margin-bottom:1rem
}

.label.light {
  color: #fff;
  background:linear-gradient(transparent 42%,rgba(255,216,74,.88) 42%)
}

.two-col {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(2rem,6vw,5rem);
  align-items:start
}

.big-title h2,.section-title-row h2,.split-box h2,.dates-grid h2,.venue-grid h2,.page-hero h1 {
  font: 400 clamp(4rem,8.5vw,8.8rem)/.78 var(--font-display);
  letter-spacing: .005em;
  text-transform: uppercase;
  margin:0
}

.copy p,.split-box p,.venue-grid p,.page-hero p {
  color: #313743;
  font-size:1.1rem
}

.metric-row {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  border: 2px solid #000;
  margin-top: 4rem;
  background: #fff;
  box-shadow:14px 14px 0 var(--peach)
}

.metric-row article {
  padding: 1.25rem;
  border-right:2px solid #000
}

.metric-row article:last-child {
  border-right:0
}

.metric-row b {
  display: block;
  font:400 clamp(3rem,6vw,5.8rem)/.82 var(--font-display)
}

.metric-row span {
  display: block;
  font: 700 .9rem/1.2 var(--font-condensed);
  letter-spacing: .13em;
  text-transform: uppercase;
  color:#5a5a5a
}

.proceedings-section {
  background: var(--night);
  color:#fff
}

.split-box {
  display: grid;
  grid-template-columns: 1fr 370px;
  gap: 2rem;
  align-items:center
}

.split-box h2 {
  color:#fff
}

.split-box p {
  color:rgba(255,255,255,.72)
}

.side-note {
  border: 2px solid var(--sun);
  padding: 1.3rem;
  background:rgba(255,255,255,.055)
}

.side-note h3,.submission-card h3,.form-info h2 {
  font: 400 2.7rem/.86 var(--font-display);
  text-transform: uppercase;
  margin:0 0 1rem
}

.side-note li {
  margin: .45rem 0;
  color:rgba(255,255,255,.74)
}

.text-chip {
  display: inline-flex;
  background: var(--sun);
  color: #000;
  padding: .62rem .8rem;
  font: 700 .9rem var(--font-condensed);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-top:.6rem
}

.topics-section {
  background: #fff;
  overflow:hidden
}

.topics-head {
  display: grid;
  grid-template-columns: 310px minmax(0,1fr);
  gap: 2rem;
  align-items:start
}

.topics-head h2 {
  font: 400 clamp(4rem,9vw,9rem)/.76 var(--font-display);
  margin:0
}

.topics-head mark {
  background: linear-gradient(transparent 43%,var(--sun) 43%);
  padding: 0 .08em;
  color:#000
}

.topics-head p {
  font: 700 1.06rem/1.5 var(--font-condensed);
  letter-spacing: .03em;
  color: #343434;
  max-width:760px
}

.topic-canvas {
  position: relative;
  margin-top:2.2rem
}

.vertical-word {
  position: absolute;
  left: -126px;
  top: 42%;
  transform: rotate(-90deg);
  font: 400 7rem/.8 var(--font-display);
  letter-spacing: .04em;
  color:rgba(255,186,164,.62)
}

.topic-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow:visible
}

.bonds polyline,.bonds line {
  stroke: var(--peach);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill:none
}

.nodes circle {
  fill: var(--peach);
  stroke: var(--peach);
  stroke-width:2
}

.topic-labels text {
  font: 700 15px/1 var(--font-condensed);
  letter-spacing: .01em;
  fill:#000
}

.topic-chips {
  display: flex;
  gap: .7rem;
  flex-wrap: wrap;
  margin-top:2.2rem
}

.topic-chips span {
  border: 2px solid #000;
  background: #fff;
  padding: .52rem .72rem;
  font: 700 .9rem/1 var(--font-condensed);
  letter-spacing: .12em;
  text-transform: uppercase;
  box-shadow:5px 5px 0 var(--sun)
}

.speakers-section {
  background: var(--night);
  color:#fff
}

.section-title-row {
  max-width: 980px;
  margin-bottom:2.4rem
}

.section-title-row h2 {
  color:inherit
}

.section-title-row p {
  font-size: 1.08rem;
  color: rgba(255,255,255,.68);
  max-width:780px
}

.program-section .section-title-row p,.committee-section .section-title-row p {
  color:#444
}

.speaker-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap:1.05rem
}

.speaker-card {
  background: #101721;
  border: 1px solid rgba(255,255,255,.16);
  overflow: hidden;
  transition: var(--ease);
  box-shadow:0 28px 90px rgba(0,0,0,.25)
}

.speaker-card:hover {
  transform: translateY(-7px);
  border-color:var(--peach)
}

.speaker-photo {
  height: 278px;
  background: #0b0d12;
  display: block;
  overflow:hidden
}

.speaker-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter:grayscale(.12) contrast(1.05)
}

.speaker-copy {
  padding:1.1rem
}

.speaker-copy span {
  display: inline-flex;
  background: var(--sun);
  color: #000;
  font: 700 .75rem var(--font-condensed);
  letter-spacing: .15em;
  text-transform: uppercase;
  padding:.26rem .5rem
}

.speaker-copy h3 {
  font: 400 2rem/.88 var(--font-display);
  text-transform: uppercase;
  margin:.85rem 0 .55rem
}

.speaker-copy p {
  font: 600 .92rem/1.28 var(--font-condensed);
  letter-spacing: .025em;
  color: rgba(255,255,255,.72);
  margin:.35rem 0
}

.speaker-copy .topic {
  color:rgba(255,255,255,.58)
}

.program-section {
  background:var(--chalk)
}

.tabs {
  border: 2px solid #000;
  background: #fff;
  box-shadow:14px 14px 0 var(--peach)
}

.tab-nav {
  display: flex;
  border-bottom:2px solid #000
}

.tab-nav button {
  flex: 1;
  border: 0;
  background: #fff;
  padding: 1.05rem;
  font: 700 1rem var(--font-condensed);
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor:pointer
}

.tab-nav button+button {
  border-left:2px solid #000
}

.tab-nav button.active {
  background:var(--sun)
}

.tab-panel {
  display:none
}

.tab-panel.active {
  display:block
}

.tab-panel table {
  width: 100%;
  border-collapse:collapse
}

.tab-panel th,.tab-panel td {
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--soft-line);
  padding:1rem
}

.tab-panel th {
  font: 700 .85rem var(--font-condensed);
  letter-spacing: .16em;
  text-transform: uppercase;
  background:#fff
}

.tab-panel td:first-child {
  width: 190px;
  font: 700 .96rem var(--font-condensed);
  letter-spacing: .08em;
  text-transform: uppercase;
  background:#fff8cd
}

.tab-panel tr:last-child td {
  border-bottom:0
}

.committee-section {
  background:#fff
}

.committee-intro {
  margin-bottom:2.4rem
}

.committee-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap:1.1rem
}

.committee-card {
  border: 2px solid #000;
  background: #fff;
  min-height: 245px;
  padding: 1.25rem;
  box-shadow: 10px 10px 0 var(--peach);
  display: flex;
  flex-direction: column;
  justify-content:flex-end
}

.committee-card.chair-card {
  background: var(--teal);
  color: #fff;
  box-shadow:10px 10px 0 var(--sun)
}

.committee-card span {
  font: 700 .78rem/1 var(--font-condensed);
  letter-spacing: .16em;
  text-transform: uppercase;
  background: var(--sun);
  color: #000;
  padding: .32rem .48rem;
  align-self: flex-start;
  margin-bottom:.9rem
}

.committee-card h3 {
  font: 400 2.4rem/.82 var(--font-display);
  text-transform: uppercase;
  margin:.2rem 0 .65rem
}

.committee-card p {
  margin: 0;
  color: #4b5058;
  font-size:.98rem
}

.committee-card.chair-card p {
  color:rgba(255,255,255,.8)
}

.dates-section {
  background:#fff
}

.dates-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap:2rem
}

.date-list {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap:1rem
}

.date-list article {
  border: 2px solid #000;
  background: #fff;
  padding: 1rem;
  box-shadow:8px 8px 0 var(--peach)
}

.date-list b {
  display: block;
  font: 400 2rem/.86 var(--font-display);
  text-transform:uppercase
}

.date-list span {
  font: 700 .9rem var(--font-condensed);
  letter-spacing: .14em;
  text-transform: uppercase;
  color:#555
}

.venue-section {
  background:var(--chalk)
}

.venue-grid {
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 2rem;
  align-items:center
}

.venue-photo {
  min-height: 540px;
  background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1)),url('assets/headers/venue-header.svg');
  background-size: cover;
  background-position: center;
  border: 2px solid #000;
  box-shadow:14px 14px 0 var(--sun)
}

.footer {
  background: var(--night);
  color: rgba(255,255,255,.68);
  padding:2.2rem 0
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap:1.2rem
}

.footer b {
  display: block;
  color: #fff;
  font: 400 1.8rem/.9 var(--font-display);
  text-transform:uppercase
}

.footer p {
  margin:.35rem 0 0
}

.footer a {
  text-decoration: underline;
  text-decoration-color: var(--sun);
  text-underline-offset:3px
}

.subpage {
  padding-top:0
}

.page-hero {
  min-height: 430px;
  display: grid;
  align-items: end;
  color: #fff;
  background-size: cover;
  background-position: center;
  padding: 9rem 0 3.5rem;
  position:relative
}

.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.42))
}

.page-hero .container {
  position:relative
}

.page-hero p {
  color: rgba(255,255,255,.78);
  max-width:780px
}

.committee-hero {
  background-image:url('../assets/hero/Minar-e-Pakistan-1024x683.jpg')
}

.registration-hero {
  background-image:url('../assets/hero/badshahi-masjid-lahore.jpg')
}

.submission-hero {
  background-image:url('../assets/hero/Minar-e-Pakistan-1024x683.jpg')
}

.form-section {
  background:var(--chalk)
}

.form-grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap:1.2rem
}

.form-info,.form-embed,.submission-primary,.submission-card {
  border: 2px solid #000;
  background: #fff;
  padding: 1.25rem;
  box-shadow:12px 12px 0 var(--peach)
}

.form-info ul,.submission-card ul,.submission-card ol {
  padding-left:1.2rem
}

.form-info li,.submission-card li {
  margin:.45rem 0
}

.warning {
  border: 2px solid #000;
  background: var(--sun-soft);
  padding: .75rem;
  font-weight:700
}

.warning.dark {
  background: rgba(255,216,74,.13);
  color: rgba(255,255,255,.74);
  border-color:var(--sun)
}

code {
  background: #fff;
  border: 1px solid #000;
  padding:.12rem .28rem
}

.form-embed iframe {
  width: 100%;
  height: 780px;
  border: 0;
  background:#fff
}

.submission-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap:1.2rem
}

.submission-primary {
  grid-row: span 2;
  background: var(--night);
  color: #fff;
  box-shadow:12px 12px 0 var(--sun)
}

.submission-primary h2 {
  font: 400 clamp(3.8rem,7vw,7rem)/.78 var(--font-display);
  text-transform: uppercase;
  margin:0 0 1rem
}

.submission-primary p {
  color:rgba(255,255,255,.72)
}

.submission-card h3 {
  color:#000
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:opacity 700ms ease,transform 700ms ease
}

.reveal.visible {
  opacity: 1;
  transform:none
}

@media(max-width:1100px) {
  .hero-inner,.two-col,.split-box,.dates-grid,.venue-grid,.form-grid,.submission-grid {
    grid-template-columns:1fr
  }

  .hero-card {
    max-width:460px
  }

  .speaker-grid {
    grid-template-columns:repeat(2,1fr)
  }

  .committee-grid {
    grid-template-columns:repeat(2,1fr)
  }

  .metric-row {
    grid-template-columns:repeat(2,1fr)
  }

  .metric-row article:nth-child(2) {
    border-right:0
  }

  .metric-row article:nth-child(-n+2) {
    border-bottom:2px solid #000
  }

  .topics-head {
    grid-template-columns:1fr
  }

  .topic-labels text {
    font-size:14px
  }
}

@media(max-width:820px) {
  :root {
    --nav:66px
  }

  .container {
    width:min(100% - 30px,var(--container))
  }

  .nav-toggle {
    display:block
  }

  .nav-links {
    position: absolute;
    top: 66px;
    left: 15px;
    right: 15px;
    background: var(--paper);
    color: #000;
    display: none;
    flex-direction: column;
    align-items: stretch;
    border: 2px solid #000;
    box-shadow: 8px 8px 0 var(--sun);
    padding:.6rem
  }

  .site-nav.open .nav-links {
    display:flex
  }

  .nav-links a {
    padding:.9rem
  }

  .hero {
    min-height:760px
  }

  .hero-inner {
    align-items:center
  }

  .hero h1 {
    font-size:clamp(5rem,28vw,9rem)
  }

  .hero h2 {
    font-size:clamp(2rem,13vw,4rem)
  }

  .speaker-grid,.committee-grid,.date-list {
    grid-template-columns:1fr
  }

  .metric-row {
    grid-template-columns:1fr
  }

  .metric-row article {
    border-right: 0!important;
    border-bottom:2px solid #000
  }

  .metric-row article:last-child {
    border-bottom:0
  }

  .tab-nav {
    flex-direction:column
  }

  .tab-nav button+button {
    border-left: 0;
    border-top:2px solid #000
  }

  .tab-panel table,.tab-panel thead,.tab-panel tbody,.tab-panel tr,.tab-panel th,.tab-panel td {
    display: block;
    width:100%
  }

  .tab-panel thead {
    display:none
  }

  .tab-panel tr {
    border-bottom:2px solid #000
  }

  .tab-panel td {
    border-bottom:1px solid var(--soft-line)
  }

  .tab-panel td:first-child {
    width:100%
  }

  .footer-grid {
    grid-template-columns:1fr
  }

  .vertical-word {
    display:none
  }

  .topic-svg {
    min-width:860px
  }

  .topic-canvas {
    overflow-x: auto;
    padding-bottom:1rem
  }

  .form-embed iframe {
    height:680px
  }
}

@media(prefers-reduced-motion:reduce) {
  * {
    transition: none!important;
    animation: none!important;
    scroll-behavior:auto!important
  }

  .reveal {
    opacity: 1;
    transform:none
  }

  .hero-slide {
    transition:none
  }
}

/* Refined typography and committee layout */

.hero-logo-wrap {
  margin-bottom: 1.2rem;
  max-width:420px
}

.hero-logo {
  width: min(100%,420px);
  height: auto;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.3))
}

.hero-inner {
  align-items:center
}

.hero h1 {
  font-size:clamp(5rem,14vw,11rem)
}

.hero h2 {
  font-size: clamp(1.75rem,4.2vw,3.75rem);
  max-width:760px
}

.hero-lead {
  font-size: 1rem;
  max-width:760px
}

.big-title h2,.section-title-row h2,.split-box h2,.dates-grid h2,.venue-grid h2,.page-hero h1 {
  font-size: clamp(2.9rem,6vw,5.4rem);
  line-height: .88;
  letter-spacing:.015em
}

.section-title-row,.committee-heading,.topics-head,.dates-grid,.venue-grid,.big-title,.split-box,.page-hero .container {
  text-align:left
}

.topics-head {
  grid-template-columns: 1fr;
  gap:1rem
}

.topics-head h2 {
  font-size:clamp(3rem,8vw,6rem)
}

.topics-head p {
  max-width:920px
}

.section-title-row {
  max-width:none
}

.big-title .label,.section-title-row .label,.topics-head .label {
  margin-bottom:.7rem
}

.committee-stack {
  display: grid;
  gap:1.35rem
}

.committee-grid-full {
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.committee-card {
  min-height: unset;
  justify-content: flex-start;
  gap: .6rem;
  padding:1.3rem 1.3rem 1.4rem
}

.committee-card ul {
  margin: 0;
  padding-left:1.1rem
}

.committee-card li {
  margin: .58rem 0;
  color: #232833;
  font:600 .98rem/1.45 var(--font-condensed)
}

.committee-card li small {
  display: block;
  margin-top: .15rem;
  color: #636a74;
  font:500 .92rem/1.45 var(--font-body)
}

.committee-card h3 {
  font-size:clamp(2rem,4.2vw,3rem)
}

.committee-card.wide-card {
  grid-column:1 / -1
}

.committee-card.tall-card {
  grid-column:span 2
}

.committee-card.chair-card p {
  color:rgba(255,255,255,.88)
}

.committee-card.chair-card li,.committee-card.chair-card li small {
  color:rgba(255,255,255,.88)
}

.page-hero h1 {
  max-width:900px
}

@media(max-width:1100px) {
  .committee-grid-full {
    grid-template-columns:1fr
  }

  .committee-card.wide-card,.committee-card.tall-card {
    grid-column:auto
  }
}

@media(max-width:820px) {
  .hero-logo-wrap {
    max-width:280px
  }

  .big-title h2,.section-title-row h2,.split-box h2,.dates-grid h2,.venue-grid h2,.page-hero h1 {
    font-size:clamp(2.4rem,12vw,4rem)
  }

  .topics-head h2 {
    font-size:clamp(2.6rem,13vw,4.6rem)
  }
}

/* Reviewed and fixed topics section: follows requested code, isolated from old topic CSS */

:root {
  --font-heading: var(--font-display);
  --accent-2: var(--sun);
}

#topics.topics-section {
  position: relative;
  overflow: hidden;
  background: #fff;
  color: #000;
  padding: clamp(3.5rem,6vw,6rem) 0 clamp(4rem,7vw,7rem);
}

#topics .topics-layout {
  display: grid;
  grid-template-columns: 260px minmax(0,1fr);
  gap: 2rem;
  align-items: start;
}

#topics .topics-heading {
  position: relative;
  z-index: 2;
}

#topics .topics-heading h2 {
  font: 900 clamp(2rem,5vw,4.8rem)/.9 var(--font-heading);
  letter-spacing: -.08em;
  margin: 0 0 1rem;
}

#topics .topics-heading mark {
  background: linear-gradient(transparent 40%,var(--accent-2) 40%);
  padding: 0 .15em;
  color: #000;
}

#topics .topics-heading p {
  color: #565f70;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.48;
  max-width: 260px;
  margin: 0;
}

#topics .topic-map-wrap {
  position: relative;
  min-height: 560px;
  overflow: visible;
  padding-top: 1.8rem;
}

#topics .vertical-label {
  position: absolute;
  left: -94px;
  top: 46%;
  transform: rotate(-90deg);
  font: 900 4.2rem var(--font-heading);
  letter-spacing: .02em;
  color: rgba(255,155,120,.38);
  pointer-events: none;
  user-select: none;
}

#topics .topic-map {
  width: 100%;
  height: auto;
  overflow: visible;
  display: block;
  transform: translateX(14px);
}

#topics .topic-lines polyline, #topics .topic-lines line {
  fill: none;
  stroke: #ffc6ae;
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#topics .topic-nodes circle {
  fill: #ffc6ae;
}

#topics .topic-labels text {
  font: 800 15px var(--font-body);
  fill: #0d0d0d;
  letter-spacing: -.02em;
  dominant-baseline: middle;
}

/* Prevent previous theme classes from affecting the new topics section */

#topics .topics-head, #topics .topic-canvas, #topics .topic-svg, #topics .topic-svg-fixed, #topics .topic-chips {
  all: unset;
}

@media(max-width:1180px) {
  #topics .topics-layout {
    grid-template-columns: 220px minmax(880px,1fr);
    overflow-x: auto;
    padding-bottom: 1rem;
  }

  #topics .topics-heading {
    min-width: 220px;
  }
}

@media(max-width:900px) {
  #topics {
    overflow: hidden;
  }

  #topics .topics-layout {
    grid-template-columns: 1fr;
    overflow: visible;
    gap: 1.5rem;
  }

  #topics .topics-heading p {
    max-width: 680px;
  }

  #topics .topic-map-wrap {
    overflow-x: auto;
    min-height: auto;
    padding: 1rem 0 1.25rem;
  }

  #topics .topic-map {
    min-width: 960px;
    transform: none;
  }

  #topics .vertical-label {
    display: none;
  }
}

@media(max-width:640px) {
  #topics .topics-heading h2 {
    font-size: clamp(2.8rem,18vw,4.8rem);
  }

  #topics .topic-map {
    min-width: 900px;
  }
}

/* Production-ready additions: sponsors, contact page, accessibility polish */

.sponsors-section {
  background: #fff;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
}

.sponsors-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.1rem;
}

.sponsor-panel {
  border: 2px solid #000;
  background: #fff;
  padding: 1.25rem;
  box-shadow: 10px 10px 0 var(--peach);
}

.sponsor-featured {
  background: var(--chalk);
}

.sponsor-open {
  grid-column: 1 / -1;
}

.sponsor-panel-head span {
  display: inline-block;
  background: var(--sun);
  color: #000;
  padding: .34rem .52rem;
  font: 800 .78rem/1 var(--font-condensed);
  letter-spacing: .16em;
  text-transform: uppercase;
  margin-bottom: .75rem;
}

.sponsor-panel h3 {
  margin: .2rem 0 1.1rem;
  font: 400 clamp(2rem,4vw,3.4rem)/.86 var(--font-display);
  text-transform: uppercase;
}

.sponsor-logo-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: .8rem;
}

.sponsor-grid-4 {
  grid-template-columns: repeat(4,minmax(0,1fr));
}

.sponsor-logo-box {
  min-height: 150px;
  border: 2px dashed #1b1b1b;
  background: #fff;
  display: grid;
  place-items: center;
  padding: .8rem;
}

.sponsor-logo-box.large {
  min-height: 210px;
}

.sponsor-logo-box img {
  max-height: 160px;
  width: 100%;
  object-fit: contain;
}

.contact-hero {
  background-image: url('../assets/hero/badshahi-masjid-lahore.jpg');
}

.contact-section {
  background: var(--chalk);
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 430px;
  gap: 1.2rem;
  align-items: start;
}

.contact-main, .contact-form-panel {
  border: 2px solid #000;
  background: #fff;
  box-shadow: 12px 12px 0 var(--peach);
  padding: 1.4rem;
}

.contact-main h2 {
  font: 400 clamp(2.8rem,6vw,5.6rem)/.86 var(--font-display);
  text-transform: uppercase;
  margin: .2rem 0 1rem;
}

.contact-main p {
  color: #4b5360;
  font-size: 1.05rem;
}

.contact-card-list {
  display: grid;
  gap: .8rem;
  margin-top: 1.4rem;
}

.contact-card-list article {
  border: 2px solid #000;
  padding: 1rem;
  background: #fff8cd;
}

.contact-card-list b {
  display: block;
  font: 800 .86rem/1 var(--font-condensed);
  letter-spacing: .16em;
  text-transform: uppercase;
  margin-bottom: .45rem;
}

.contact-card-list a, .contact-card-list span {
  color: #111;
  font-weight: 700;
}

.contact-form {
  display: grid;
  gap: .85rem;
}

.contact-form label {
  display: grid;
  gap: .35rem;
  font: 800 .82rem/1 var(--font-condensed);
  letter-spacing: .13em;
  text-transform: uppercase;
}

.contact-form input, .contact-form textarea {
  width: 100%;
  border: 2px solid #000;
  padding: .85rem;
  background: #fff;
  font: 500 1rem/1.4 var(--font-body);
}

.form-note {
  margin: .3rem 0 0;
  color: #626a76;
  font-size: .9rem;
}

.faq-section {
  background: #fff;
}

.faq-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 1rem;
}

.faq-grid article {
  border: 2px solid #000;
  background: #fff;
  padding: 1.15rem;
  box-shadow: 8px 8px 0 var(--sun);
}

.faq-grid h3 {
  margin: 0 0 .55rem;
  font: 400 2rem/.9 var(--font-display);
  text-transform: uppercase;
}

.faq-grid p {
  margin: 0;
  color: #4b5360;
}

:focus-visible {
  outline: 4px solid var(--sun);
  outline-offset: 3px;
}

@media(max-width:1100px) {
  .sponsors-layout,   .contact-grid {
    grid-template-columns: 1fr;
  }

  .sponsor-grid-4 {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media(max-width:640px) {
  .sponsor-logo-grid,   .sponsor-grid-4,   .faq-grid {
    grid-template-columns: 1fr;
  }
}


/* Final user-requested committee and CFP updates */
.committee-lead-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.committee-row-primary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

.committee-row-primary .committee-card {
  min-height: 100%;
}

.committee-card strong {
  color: #000;
}

.chair-card strong {
  color: #fff;
}

.cfp-hero {
  background-image: url('../assets/hero/Lahore-fort.webp');
}

.cfp-intro-section {
  background: var(--chalk);
}

.cfp-tracks-section {
  background: #fff;
}

.cfp-track-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.track-card {
  border: 2px solid #000;
  background: #fff;
  padding: 1.25rem;
  box-shadow: 10px 10px 0 var(--peach);
}

.track-card span {
  display: inline-block;
  background: var(--sun);
  color: #000;
  padding: .34rem .52rem;
  font: 800 .78rem/1 var(--font-condensed);
  letter-spacing: .16em;
  text-transform: uppercase;
  margin-bottom: .9rem;
}

.track-card h2 {
  margin: 0 0 1rem;
  font: 400 clamp(2rem, 3.4vw, 3.3rem)/.86 var(--font-display);
  text-transform: uppercase;
}

.track-card ul {
  margin: 0;
  padding-left: 1.1rem;
}

.track-card li {
  margin: .48rem 0;
  color: #3e4652;
  font-weight: 600;
}

/* Topics typography + label alignment correction */
#topics .topics-heading h2 {
  font-family: var(--font-condensed);
  font-size: clamp(2.4rem, 4.2vw, 4.15rem);
  line-height: .82;
  letter-spacing: -.16em;
  transform: scaleX(.78);
  transform-origin: left center;
  width: 128%;
}

#topics .topics-heading mark {
  display: inline-block;
  padding: 0 .12em;
}

#topics .topics-heading p {
  font-size: .95rem;
  line-height: 1.42;
}

#topics .topic-map-wrap {
  padding-top: 1rem;
}

#topics .topic-map {
  transform: translateX(8px);
}

#topics .topic-labels text {
  font-size: 12.5px;
  font-family: var(--font-condensed);
  font-weight: 800;
  text-anchor: middle;
  dominant-baseline: middle;
  paint-order: stroke fill;
  stroke: #fff;
  stroke-width: 4px;
  stroke-linejoin: round;
  letter-spacing: -.01em;
}

@media (max-width: 1100px) {
  .committee-row-primary,
  .committee-lead-grid,
  .cfp-track-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  #topics .topics-heading h2 {
    width: auto;
    transform: scaleX(.9);
  }
}


/* Local manual image system: no external image URLs */
.hero-slide {
  background-image: var(--image);
}

.hero-manual-controls {
  position: absolute;
  z-index: 5;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: .8rem;
}

.hero-manual-controls .slide-dots {
  position: static;
  transform: none;
  display: flex;
  gap: .55rem;
}

.hero-arrow {
  min-width: 74px;
  height: 34px;
  border: 2px solid rgba(255,255,255,.72);
  background: rgba(6,8,13,.45);
  color: #fff;
  font: 800 .78rem/1 var(--font-condensed);
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: var(--ease);
}

.hero-arrow:hover,
.hero-arrow:focus-visible {
  background: var(--sun);
  border-color: var(--sun);
  color: #000;
}

.committee-hero {
  background-image: url('../assets/headers/committee-header.svg') !important;
}

.registration-hero {
  background-image: url('../assets/headers/registration-header.svg') !important;
}

.submission-hero {
  background-image: url('../assets/headers/submission-header.svg') !important;
}

.contact-hero {
  background-image: url('../assets/headers/contact-header.svg') !important;
}

.cfp-hero {
  background-image: url('../assets/headers/cfp-header.svg') !important;
}

.venue-photo {
  background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1)), url('assets/headers/venue-header.svg') !important;
}

@media(max-width:640px) {
  .hero-manual-controls {
    width: calc(100% - 30px);
    justify-content: space-between;
  }

  .hero-arrow {
    min-width: 60px;
    font-size: .68rem;
  }
}


/* Screenshot-matched organizing committee layout */
.committee-section {
  background: #fff;
}

.committee-stack {
  display: grid;
  gap: 2rem;
}

.committee-top-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.6rem;
}

.committee-main-row,
.committee-extra-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.6rem;
  align-items: stretch;
}

.committee-top-row .committee-card,
.committee-main-row .committee-card,
.committee-extra-row .committee-card {
  border: 3px solid #070707;
  box-shadow: 14px 14px 0 var(--peach);
  padding: 2.05rem;
  min-height: 285px;
  justify-content: flex-start;
}

.committee-top-row .chair-card {
  background: var(--teal);
  color: #fff;
  box-shadow: 14px 14px 0 var(--sun);
  min-height: 270px;
}

.committee-card span {
  display: inline-block;
  align-self: flex-start;
  background: var(--sun);
  color: #000;
  padding: .42rem .7rem;
  font: 800 .9rem/1 var(--font-condensed);
  letter-spacing: .22em;
  text-transform: uppercase;
  margin-bottom: 1.55rem;
}

.committee-top-row .committee-card h3 {
  font-size: clamp(3rem, 4.7vw, 5rem);
  line-height: .9;
  color: #fff;
  margin: .35rem 0 1.25rem;
}

.committee-card h3 {
  font-size: clamp(2.1rem, 3.2vw, 3.6rem);
  line-height: .9;
  margin: .35rem 0 1rem;
}

.committee-card p {
  font-size: 1.25rem;
  color: #4f5a67;
}

.committee-top-row .committee-card p {
  color: rgba(255,255,255,.92);
  font-size: 1.25rem;
}

.committee-card ul {
  margin: .5rem 0 0;
  padding-left: 1.15rem;
}

.committee-card li {
  margin: 0 0 1rem;
  color: #202632;
  font: 700 1.05rem/1.35 var(--font-condensed);
}

.committee-card li b {
  display: inline;
  color: #07111c;
  font-weight: 800;
}

.committee-card li small {
  display: block;
  margin-top: .25rem;
  color: #566272;
  font: 600 1rem/1.4 var(--font-body);
}

.committee-extra-row .committee-card {
  min-height: 240px;
}

@media (max-width: 1180px) {
  .committee-top-row,
  .committee-main-row,
  .committee-extra-row {
    grid-template-columns: 1fr;
  }

  .committee-top-row .committee-card h3 {
    font-size: clamp(2.8rem, 10vw, 4.5rem);
  }
}

@media (max-width: 640px) {
  .committee-top-row .committee-card,
  .committee-main-row .committee-card,
  .committee-extra-row .committee-card {
    padding: 1.2rem;
    min-height: auto;
    box-shadow: 8px 8px 0 var(--peach);
  }

  .committee-top-row .chair-card {
    box-shadow: 8px 8px 0 var(--sun);
  }

  .committee-card span {
    font-size: .76rem;
    letter-spacing: .16em;
  }
}


/* Final responsive/local-image/hero-cleanup patch - 2026-06-13 */
/* Hero: remove yellow accenting from the slider area while preserving the rest of the site theme. */
.hero .sup-title,
.hero-card > b {
  color: #ffffff;
}

.hero h1 span {
  background: none;
  padding-right: 0;
}

.hero h1 em {
  color: #ffc9b7;
}

.hero .btn-sun {
  background: var(--teal);
  border-color: var(--teal);
  color: #ffffff;
}

.hero .btn-sun:hover,
.hero .btn-sun:focus-visible {
  background: #ffffff;
  border-color: #ffffff;
  color: #000000;
}

.hero .slide-dots button.active,
.hero-manual-controls .slide-dots button.active {
  background: #ffffff;
}

.hero-manual-controls {
  pointer-events: auto;
}

/* Prev/Next arrow buttons are intentionally disabled/hidden. Dots remain available. */
.hero-arrow,
.hero-prev,
.hero-next {
  display: none !important;
}

/* Keep committee cards balanced after adding International Advisory Committee. */
.committee-page-extra {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.committee-page-extra .committee-card {
  grid-column: 1 / 2;
}

/* Device responsiveness cleanup. */
@media (max-width: 1180px) {
  .committee-lead-grid,
  .committee-row-primary,
  .committee-top-row,
  .committee-main-row,
  .committee-extra-row,
  .committee-page-extra,
  .sponsor-logo-grid,
  .sponsor-grid-4,
  .faq-grid {
    grid-template-columns: 1fr !important;
  }

  .committee-page-extra .committee-card {
    grid-column: auto;
  }
}

@media (max-width: 900px) {
  .hero {
    min-height: auto;
    padding: 7.5rem 0 5.5rem;
  }

  .hero-inner {
    grid-template-columns: 1fr;
    gap: 1.4rem;
    align-items: start;
  }

  .hero-logo-wrap {
    max-width: 300px;
  }

  .hero h1 {
    font-size: clamp(4.6rem, 23vw, 8.5rem);
  }

  .hero h2 {
    font-size: clamp(2rem, 10vw, 3.8rem);
  }

  .hero-lead {
    font-size: .95rem;
  }

  .hero-card {
    width: 100%;
    max-width: none;
  }

  .page-hero {
    min-height: 360px;
    padding-top: calc(var(--nav) + 3rem);
  }
}

@media (max-width: 640px) {
  .container {
    width: min(100% - 24px, var(--container));
  }

  .hero {
    padding: 6.75rem 0 5rem;
  }

  .hero-actions,
  .venue-grid .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .btn {
    width: 100%;
  }

  .countdown {
    grid-template-columns: repeat(2, 1fr);
  }

  .countdown strong {
    font-size: 2rem;
  }

  .hero-manual-controls {
    bottom: 1rem;
    width: calc(100% - 24px);
    justify-content: center;
  }

  .hero-manual-controls .slide-dots button,
  .slide-dots button {
    width: 34px;
  }

  .committee-card li,
  .committee-card li small,
  .committee-card p {
    font-size: 1rem;
  }

  .committee-card h3 {
    font-size: clamp(2rem, 15vw, 3rem);
  }

  .topic-map-wrap {
    overflow-x: auto;
  }
}
.hero-slide {
  background: none !important;
}
