, not
). Inline
styles can only be beaten by !important — kept tightly scoped to this
one copy block. If the content is ever cleaned/reset in the editor this
still applies harmlessly. */
[data-template="travel"] .paw2027-accomodation .accom-split__copy,
[data-template="travel"] .paw2027-accomodation .accom-split__copy p,
[data-template="travel"] .paw2027-accomodation .accom-split__copy div {
line-height: 1.6 !important;
}
/* FAQ summary layout */
.faq-team__list {
display: flex;
flex-direction: column;
gap: var(--space-sm);
}
.faq-team__item {
padding: var(--space-md) var(--space-xxl) var(--space-md) var(--space-xl);
border: 1px solid var(--color-border);
border-radius: var(--radius);
}
.faq-team__q-text {
font-size:var(--font-size-h3);
}
.faq-team__a {
font-size: var(--font-size-h4);
padding-right: 6rem;
color:var(--neutral-700);
margin-top: var(--space-xxs);
margin-bottom: var(--space-xxs);
}
.faq-team__a a {
background-color:var(--green-600);
text-decoration:underline;
}
.faq-team__q {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
list-style: none; /* helps some browsers */
cursor:pointer;
}
.faq-team__item:not([open]):hover {
background-color: var(--neutral-50);
}
.faq-team__item[open] .faq-team__q {
font-weight:600;
color:var(--green-900);
}
/* Remove default disclosure marker */
.faq-team__q::-webkit-details-marker { display: none; }
.faq-team__q::marker { content: ""; }
/* Keep icon from shrinking */
.faq-team__toggle-icon { flex: 0 0 auto; }
/* Rotate when open */
.faq-team__item .toggle-svg {
display: block;
width: 2rem;
transition: transform .5s ease;
}
.faq-team__item .icon-bg {
fill:var(--green-800);
transition:fill .5s ease;
}
.faq-team__item .icon-arrow {
fill:var(--green-100);
transition:fill .5s ease;
}
.faq-team__item[open] .icon-bg {
fill:var(--green-100);
}
.faq-team__item[open] .icon-arrow {
fill:var(--green-800);
}
.faq-team__item[open] {
background-color:var(--neutral-100);
}
.faq-team__item[open] .toggle-svg {
transform: rotate(180deg);
}
details {
border: 0;
}
summary {
list-style: none; /* removes marker in Firefox */
border: 0;
outline: none;
}
/* Remove marker (Chrome / Safari) */
summary::-webkit-details-marker {
display: none;
}
/* Remove focus ring if browser adds one */
summary:focus {
outline: none;
}
.tile-modal-sm .tile-modal__header {
display:flex;
justify-content:center;
padding: 0 0 2rem;
}
.tile-modal__dialog {
pointer-events:none;
}
.tile-modal--faqteam .tile-modal__body {
pointer-events: auto;
}
.tile-modal--faqteam .tile-modal__close,
.tile-modal--faqteam .tile-modal__scroll-wrap {
pointer-events: auto;
}
.faqteam__enquiry-row {
display:grid;
grid-template-columns: 1fr 1.5fr;
gap: 1rem;
align-items: center;
text-wrap: balance;
padding: var(--space-xxs) 0;
}
.faqteam__views {
position: relative;
overflow: hidden;
transition: min-height .35s ease;
}
.faqteam {
position: relative;
}
.faqteam__view {
width: 100%;
transition: transform .35s ease, opacity .25s ease;
}
.faqteam__view--list {
position: relative;
transform: translateX(0);
opacity: 1;
visibility: visible;
pointer-events: auto;
z-index: 2;
}
.faqteam__view--form {
position: absolute;
inset: 0;
transform: translateX(100%);
opacity: 0;
pointer-events: none;
visibility: hidden;
z-index: 1;
}
.faqteam__views.is-form-active .faqteam__view--list {
position: absolute;
inset: 0;
transform: translateX(-100%);
opacity: 0;
pointer-events: none;
visibility: hidden;
z-index: 1;
}
.faqteam__views.is-form-active .faqteam__view--form {
position: relative;
inset: auto;
transform: translateX(0);
opacity: 1;
pointer-events: auto;
visibility: visible;
z-index: 2;
}
.tile-modal--faqteam:not(.tile-modal--open) .faqteam__views.is-form-active .faqteam__view--form {
pointer-events: none;
}
.faqteam__back {
appearance: none;
border: 0;
background: transparent;
color: var(--neutral-700);
font-weight: 700;
cursor: pointer;
padding: 0;
margin: 0 0 var(--space-md);
}
.faqteam__view-controls {
display: flex;
align-items: center;
justify-content: flex-start;
gap: var(--space-md);
}
.faqteam__title--form {
margin-bottom: var(--space-sm);
}
.faqteam__form-note {
margin-bottom: var(--space-md);
color: var(--neutral-700);
}
.faqteam__form-inner {
position: relative;
padding: 0;
min-height: 380px;
background: var(--neutral-100);
border-radius: var(--radius);
margin-bottom: var(--space-xxs);
overflow: hidden;
}
.faqteam__form-inner iframe {
max-width: 100%;
}
.faqteam__form-skeleton {
display: none;
position: absolute;
inset: 0;
background:
linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 45%, rgba(255,255,255,0) 100%),
var(--neutral-200);
background-size: 200% 100%, 100% 100%;
animation: faqteamShimmer 1.15s linear infinite;
pointer-events: none;
}
.faqteam__form-status {
display: none;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin: 0;
padding: .6rem 1rem;
border-radius: 999px;
background: rgba(16, 16, 16, .78);
color: #fff;
font-size: var(--fs-sm);
z-index: 3;
pointer-events: none;
}
@keyframes faqteamShimmer {
0% { background-position: 200% 0, 0 0; }
100% { background-position: -200% 0, 0 0; }
}
.faqteam__view--form.is-loading {
cursor: progress;
}
.faqteam__view--form.is-loading .faqteam__form-target {
opacity: .35;
pointer-events: none;
}
.faqteam__view--form.is-loading .faqteam__form-skeleton {
display: block;
}
.faqteam__view--form.is-loading .faqteam__form-status {
display: inline-flex;
}
.faqteam__form-success {
margin: var(--space-sm) 0 0;
padding: .625rem .875rem;
border-radius: 999px;
background: rgba(193, 244, 0, 0.18);
color: var(--neutral-900);
font-size: var(--fs-sm);
line-height: 1.3;
}
.faqteam__form-success.is-pending {
background: rgba(120, 134, 160, 0.18);
}
.faqteam__view--form.is-submitted .faqteam__form-inner,
.faqteam__view--form.is-submitted .faqteam__form-success {
display: none;
}
.faqteam__submitted {
margin-top: var(--space-md);
background: var(--neutral-200);
border-radius: var(--radius);
padding: var(--space-xl);
}
.faqteam__submitted-title {
margin: 0 0 var(--space-sm);
font-size: var(--fs-h3);
line-height: 1.2;
}
.faqteam__submitted-copy {
margin: 0 0 var(--space-lg);
color: var(--neutral-700);
}
.faqteam__submit-another {
width: 100%;
}
.faqteam__close-form {
margin-top: var(--space-sm);
}
.faqteam__meta {
line-height:1;
}
.faqteam__subhead {
font-size: var(--fs-h4);
margin: var(--space-xl) 0;
}
.faqteam__name,
.faqteam__subhead {
font-weight: bold;
}
.faqteam__name,
.faqteam__role,
.faqteam__email {
margin:0;
}
.faqteam__role {
text-wrap: balance;
}
.faqteam__name {
font-size: var(--fs-h5);
margin-top:var(--space-sm);
margin-bottom:var(--space-xxs);
line-height:1;
}
.faqteam__role,
.faqteam__email {
font-size:var(--font-size-caption-s);
line-height: 1.2;
}
.faqteam__avatar img {
aspect-ratio: 1 / 1;
border-radius: var(--radius-xxl);
}
.faqteam__avatar {
aspect-ratio: 1 / 1;
border-radius: var(--radius-xxl);
overflow: hidden;
}
@media (max-width: 767px) {
.faqteam__enquiry-row {
grid-template-columns: 1fr;
}
.faqteam__enquiry-cta .btn {
width: 100%;
}
.faqteam__view--form {
position: absolute;
inset: 0;
}
.tile-modal--faqteam .tile-modal__close {
top: .375rem;
right: .375rem;
width: 2.5rem;
height: 2.5rem;
}
.tile-modal--faqteam .tile-modal__scroll-wrap {
max-height: min(84svh, 720px);
height: auto;
padding: 1.5rem 1rem 1rem;
}
.tile-modal--faqteam .tile-modal__body {
max-height: min(84svh, 720px);
height: auto;
padding: 0;
overflow: hidden;
}
}
@media (max-width: 767px) and (orientation: portrait) {
.tile-modal--faqteam .tile-modal__dialog {
justify-content: flex-end;
}
.tile-modal--faqteam .tile-modal__body {
width: 100vw;
max-width: none;
margin: 0;
height: 80svh;
max-height: 80svh;
border-radius: var(--radius-xl) var(--radius-xl) 0 0;
overflow: hidden;
}
.tile-modal--faqteam .tile-modal__scroll-wrap {
height: 100%;
max-height: 100%;
padding: 1.25rem 1rem calc(1rem + env(safe-area-inset-bottom));
}
.tile-modal--faqteam .tile-modal__body {
padding: 0;
}
}
/* Allow text selection inside informational blocks */
.splide__slide .is-selectable,
.splide__slide .is-selectable * {
user-select: text;
-webkit-user-select: text;
-ms-user-select: text;
cursor: text;
}
.tile-modal__content {
background-color:#fff;
display: grid;
height: 100%;
border-radius: var(--radius-xl);
overflow: auto;
grid-template-columns: 0.5fr 1fr;
gap: 2rem;
padding: 2rem;
}
@media (max-width:1024px){
.tile-modal__content {
grid-template-columns: 0.64fr 1fr;
gap: var(--radius-xl);
}
}
@media (max-width:600px){
.splide__arrows {
opacity:0;
}
.tile-modal__splide .splide__slide {
max-height: none;
}
.tile-modal__content {
grid-template-columns: 1fr;
gap: var(--radius-xl);
/* Pack the rows to the top. The container is `height: 100%` (the white card
has to fill the slide), and a grid's default align-content of `normal`
behaves as `stretch` - so once this becomes a single column, the leftover
height is shared out between the two auto rows instead of being left at
the bottom. Measured on the Matt Doyle slide at 470px: the photo row was
sized 507.8px for 368.6px of content, dropping the name 154px below the
portrait. `start` sizes both rows to their content and the name sits
under the photo, separated by the row gap alone.
Only needed here - above 600px the grid is two columns (photo beside the
text) and the rows should keep stretching. */
align-content: start;
}
.tile-modal__text {
padding-top:0;
}
.faq-team__a {
padding-right:1rem;
}
}
.tile-modal__text {
padding-right:2rem;
}
.tile-modal__text .tile-modal__title {
margin-top: 0;
margin-bottom: .25rem;
font-family: var(--font-heading);
font-size: clamp(2.1rem, 2.7vw, 3.15rem);
line-height: .98;
font-weight: 700;
letter-spacing: -0.04em;
text-wrap: balance;
padding-bottom: 0;
}
.tile-modal__subtitle {
padding-bottom: 0;
font-family: var(--font-body);
font-size: clamp(1.05rem, 1.15vw, 2rem);
line-height: 1.22;
font-weight: 600;
color: var(--neutral-900);
text-wrap: balance;
}
.tile-modal__company {
margin: 0;
padding-bottom: 0;
font-family: var(--font-body);
font-size: clamp(0.98rem, 1vw, 1.1rem);
line-height: 1.22;
font-weight: 400;
color: var(--neutral-800);
text-wrap: balance;
}
.tile-modal__text .tile-modal__subtitle + .tile-modal__company {
margin-top: -0.25rem;
}
.tile-modal__text .tile-modal__subtitle + .tile-modal__company,
.tile-modal__text .tile-modal__company + .tile-modal__body-text {
margin-top: 0.6rem;
}
.tile-modal__body-text {
font-size: 1rem;
line-height: 1.7;
color: var(--neutral-800);
}
.tile-modal__text .tile-modal__body-text {
padding-top: 0;
}
.tile-modal__empty-state {
margin-top: 1rem;
max-width: 32rem;
padding: 0;
border: 0;
background: transparent;
color: var(--neutral-500);
box-shadow: none;
text-align: left;
}
.tile-modal__empty-state-text {
margin: 0;
font-size: 1rem;
line-height: 1.55;
text-wrap: balance;
}
.tile-modal__slide--speaker .tile-modal__text .tile-modal__title {
font-size: 2.5rem;
margin-bottom: .75rem;
}
.tile-modal__slide--speaker .tile-modal__text .tile-modal__company {
margin-top: .15rem;
font-size: clamp(1.15rem, 1.35vw, 1.45rem);
line-height: 1.18;
font-weight: 600;
color: var(--neutral-800);
}
.tile-modal__slide--speaker .tile-modal__text .tile-modal__subtitle {
font-size: clamp(.92rem, .95vw, 1.05rem);
line-height: 1.15;
font-weight: 600;
margin-bottom: .25rem;
color: var(--neutral-600);
}
.tile-modal__slide--partner .tile-modal__text .tile-modal__title {
margin-top: 3rem;
margin-bottom: 1rem;
font-size: 2.5rem;
}
.tile-modal__slide--speaker .tile-modal__sidebar,
.tile-modal__slide--partner .tile-modal__sidebar {
position: sticky;
top: 0;
display: flex;
flex-direction: column;
gap: 1rem;
align-self: flex-start;
}
.tile-modal__slide--speaker .tile-modal__sidebar-stack {
display: flex;
flex-direction: column;
gap: 1rem;
padding:0rem 1rem;
}
.tile-modal__slide--speaker .tile-modal__media,
.tile-modal__slide--partner .tile-modal__media {
position: static;
}
.tile-modal__media img {
width:100%;
}
.tile-modal__sidebar-cta {
display: flex;
align-items: center;
gap: .75rem;
width: 100%;
padding: 0;
border: 0;
background: transparent;
background-color: transparent;
box-shadow: none;
text-align: left;
color: var(--neutral-800);
cursor: pointer;
appearance: none;
-webkit-appearance: none;
}
.tile-modal__sidebar-cta:hover,
.tile-modal__sidebar-cta:focus,
.tile-modal__sidebar-cta:focus-visible,
.tile-modal__sidebar-cta:active {
background: transparent;
background-color: transparent;
box-shadow: none;
outline: none;
color: var(--green-800);
}
.tile-modal__sidebar-cta-logo {
flex: 0 0 4.75rem;
width: 100%;
height: auto;
aspect-ratio:1;
border-radius: var(--radius-lg);
overflow: hidden;
background-color: transparent;
box-shadow: 0 0 0 1px rgba(0, 0, 0, .05), 0 4px 10px rgba(0, 0, 0, .06);
padding: .32rem;
}
.tile-modal__sidebar-cta-img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
}
.tile-modal__sidebar-cta-img.is-square {
object-fit: contain;
object-position: center;
}
.tile-modal__sidebar-cta-img.is-portrait {
object-fit: contain;
object-position: center;
padding: .2rem .35rem;
}
.tile-modal__sidebar-cta-img.is-landscape {
object-fit: contain;
object-position: center;
padding: .25rem .15rem;
}
.tile-modal__sidebar-cta-copy {
display: flex;
flex-direction: column;
gap: .1rem;
min-width: 0;
}
.tile-modal__sidebar-cta-kicker {
font-size: .78rem;
line-height: 1.1;
font-weight: 500;
color: var(--neutral-600);
}
.tile-modal__sidebar-cta-name {
font-size: .98rem;
line-height: 1.2;
font-weight: 700;
color: var(--neutral-800);
text-decoration: underline;
text-underline-offset: .15em;
}
.tile-modal__slide--speaker .tile-modal__img,
.tile-modal__slide--partner .tile-modal__img {
position: static;
}
.tile-modal__slide--partner .tile-modal__related {
padding:0;
}
.tile-modal__slide--partner .tile-modal__sidebar-stack--partner {
display: flex;
flex-direction: column;
gap: 1rem;
padding: 0rem 1rem 1rem;
}
@media (max-width: 767px) {
.tile-modal__slide--speaker .tile-modal__sidebar,
.tile-modal__slide--partner .tile-modal__sidebar {
position: static;
top: auto;
}
.tile-modal__slide--speaker .tile-modal__sidebar-stack,
.tile-modal__slide--partner .tile-modal__sidebar-stack--partner {
padding-left: 0;
padding-right: 0;
}
}
.tile-modal__slide--partner .tile-modal__related-label {
margin: 0 0 .75rem;
font-size: .75rem;
line-height: 1;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--neutral-500);
}
.tile-modal__slide--partner .tile-modal__related-list {
margin: 0;
padding: 0;
list-style: none;
display: grid;
gap: .75rem;
}
.tile-modal__related-item {
margin: 0;
}
.tile-modal__related-card {
display: flex;
align-items: center;
gap: .75rem;
width: 100%;
padding: 0;
border: 0;
background: transparent;
background-color: transparent;
box-shadow: none;
text-align: left;
cursor: pointer;
appearance: none;
-webkit-appearance: none;
}
.tile-modal__agenda {
display: block;
}
.tile-modal__agenda[hidden] {
display: none;
}
.tile-modal__agenda-label {
margin: 0 0 .75rem;
font-size: .75rem;
line-height: 1;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--neutral-500);
}
.tile-modal__agenda-list {
margin: 0;
padding: 0;
list-style: none;
display: grid;
gap: 1rem;
}
.tile-modal__agenda-group {
margin: 0;
}
.tile-modal__agenda-date {
margin: 0 0 .5rem;
font-size: .78rem;
line-height: 1.1;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: var(--neutral-700);
}
.tile-modal__agenda-group-list {
margin: 0;
padding: 0;
list-style: none;
display: grid;
gap: .75rem;
}
.tile-modal__agenda-item {
margin: 0;
}
.tile-modal__agenda-card {
display: flex;
flex-direction: column;
gap: .15rem;
padding-left: .75rem;
border-left: .35rem solid var(--green-500);
}
.tile-modal__agenda-time {
margin: 0;
font-size: .86rem;
line-height: 1.2;
letter-spacing: .02em;
text-transform: uppercase;
font-weight: 600;
color: var(--neutral-600);
}
.tile-modal__agenda-title {
margin: 0;
font-size: .98rem;
line-height: 1.25;
font-weight: 600;
color: var(--green-800);
}
.tile-modal__agenda-speaker {
margin: .1rem 0 0;
font-size: .85rem;
line-height: 1.25;
font-weight: 500;
color: var(--neutral-600);
}
.tile-modal__agenda-body {
display: grid;
gap: 2rem;
margin-bottom: 1.5rem;
}
.tile-modal__agenda-body--speaker {
margin-top: 1.5rem;
margin-bottom: 1rem;
}
.tile-modal__agenda-body--speaker .tile-modal__agenda-body {
margin-bottom: 0rem;
}
.tile-modal__agenda-body--speaker .tile-modal__agenda-body-content {
margin-bottom: 1rem;
}
.tile-modal__agenda-body-item {
display: grid;
gap: .35rem;
}
.tile-modal__agenda-body-head {
margin: 0;
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: .35rem .5rem;
font-size: .95rem;
line-height: 1.35;
}
.tile-modal__agenda-body-content {
display: grid;
gap: .35rem;
padding-left: .85rem;
border-left: .35rem solid var(--green-800);
}
.tile-modal__agenda-body-title {
font-weight: 700;
color: var(--green-800);
line-height: 1.15;
}
.tile-modal__agenda-body-time,
.tile-modal__agenda-body-date {
font-weight: 500;
color: var(--neutral-600);
}
.tile-modal__agenda-body-sep {
color: var(--neutral-400);
font-weight: 500;
}
.tile-modal__agenda-body-speaker {
margin: 0 0 .5rem;
font-size: .95rem;
line-height: 1.25;
font-weight: 500;
color: var(--neutral-600);
}
.tile-modal__agenda-body-desc {
font-size: 1rem;
line-height: 1.64;
color: var(--neutral-800);
margin-top:.25rem;
}
.tile-modal__agenda-body-speaker-card {
display: flex;
align-items: flex-start;
gap: .9rem;
margin-top: .75rem;
padding: .9rem 1rem;
border: 1px solid rgba(0, 0, 0, .08);
border-radius: var(--radius-lg);
background: var(--neutral-50);
}
.tile-modal__agenda-body-speaker-card.is-repeated .tile-modal__agenda-body-speaker-media {
flex-basis: 4rem;
width: 4rem;
height: 4rem;
}
.tile-modal__agenda-body-speaker-card.is-repeated {
align-items: center;
}
.tile-modal__agenda-body-speaker-media {
flex: 0 0 8rem;
width: 8rem;
height: 8rem;
border-radius: var(--radius-md);
overflow: hidden;
background: var(--neutral-100);
}
.tile-modal__agenda-body-speaker-img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.tile-modal__agenda-body-speaker-copy {
min-width: 0;
display: grid;
gap: .2rem;
flex: 1;
}
.tile-modal__agenda-body-speaker-name {
margin: 0;
font-size: .9rem;
line-height: 1.2;
font-weight: 600;
color: var(--neutral-900);
}
.tile-modal__agenda-body-speaker-role {
margin: 0;
font-size: .85rem;
line-height: 1.2;
color: var(--neutral-600);
}
.tile-modal__agenda-body-speaker-excerpt {
margin: .25rem 0 0;
font-size: .95rem;
line-height: 1.55;
color: var(--neutral-700);
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
.tile-modal__agenda-body-speaker-link {
justify-self: start;
padding: 0;
border: 0;
background: transparent;
background-color: transparent;
box-shadow: none;
color: var(--green-800);
font-size: .85rem;
line-height: 1.2;
font-weight: 600;
cursor: pointer;
appearance: none;
-webkit-appearance: none;
}
.tile-modal__agenda-body-speaker-link:hover,
.tile-modal__agenda-body-speaker-link:focus,
.tile-modal__agenda-body-speaker-link:focus-visible,
.tile-modal__agenda-body-speaker-link:active {
background: transparent;
background-color: transparent;
box-shadow: none;
outline: none;
color: var(--green-800);
text-decoration: underline;
text-underline-offset: .15em;
}
.tile-modal__agenda-body-desc p {
margin: 0;
}
.tile-modal__agenda-desc {
margin: .15rem 0 0;
font-size: .82rem;
line-height: 1.4;
color: var(--neutral-600);
}
.tile-modal__agenda-meta {
margin: .1rem 0 0;
font-size: .78rem;
line-height: 1.35;
color: var(--neutral-600);
}
.tile-modal__agenda-meta-label {
font-weight: 600;
color: var(--neutral-700);
}
.tile-modal__related-media {
flex: 0 0 3.25rem;
width: 3.25rem;
height: 3.25rem;
border-radius: var(--radius-lg);
overflow: hidden;
background: var(--neutral-100);
}
.tile-modal__related-img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.tile-modal__related-copy {
min-width: 0;
}
.tile-modal__related-name {
margin: 0;
font-size: 1rem;
line-height: 1.2;
font-weight: 600;
color: var(--neutral-800);
}
.tile-modal__related-role,
.tile-modal__related-company {
margin: .15rem 0 0;
font-size: .85rem;
line-height: 1.2;
font-weight: 400;
color: var(--neutral-600);
}
.tile-modal__related-action {
margin-top: 0;
color: var(--neutral-800);
font-size: .9rem;
line-height: 1.2;
font-weight: 600;
}
.tile-modal__related-action:hover,
.tile-modal__related-action:focus,
.tile-modal__related-action:focus-visible,
.tile-modal__related-action:active {
background: transparent;
background-color: transparent;
box-shadow: none;
outline: none;
color: var(--green-800);
text-decoration: none;
}
.tile-modal__link-btn {
padding: 0;
border: 0;
background: transparent;
background-color: transparent;
box-shadow: none;
color: var(--neutral-800);
cursor: pointer;
text-align: left;
appearance: none;
-webkit-appearance: none;
}
.tile-modal__link-btn:hover,
.tile-modal__link-btn:focus,
.tile-modal__link-btn:focus-visible,
.tile-modal__link-btn:active {
background: transparent;
background-color: transparent;
box-shadow: none;
outline: none;
color: var(--green-800);
text-decoration: underline;
text-underline-offset: 0.15em;
}
.tile-modal__close-layer {
position: absolute;
top: 50%;
left: 50%;
width: var(--tile-modal-close-layer-width);
height: var(--tile-modal-close-layer-height);
transform: translate(-50%, -50%);
pointer-events: none;
z-index: 7;
}
.tile-modal__close-anchor {
position: relative;
width: 100%;
height: 100%;
pointer-events: none;
}
@media (min-width:601px){
.tile-modal__splide .splide__arrows {
z-index: 6;
}
.tile-modal__splide .splide__arrow {
width: 3.5rem;
height: 3.5rem;
border: 1px solid rgba(0, 0, 0, 0.12);
background: var(--green-500);
color: #000;
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
opacity: 0.96;
transition:
transform 0.2s ease,
opacity 0.2s ease,
background-color 0.2s ease,
box-shadow 0.2s ease;
}
.tile-modal__splide .splide__arrow:hover:not(:disabled),
.tile-modal__splide .splide__arrow:focus,
.tile-modal__splide .splide__arrow:focus-visible {
transform: translateY(-50%) scale(1.04);
opacity: 1;
background: var(--green-400);
box-shadow: 0 16px 36px rgba(0, 0, 0, 0.36);
}
.tile-modal__splide .splide__arrow:focus,
.tile-modal__splide .splide__arrow:focus-visible {
outline: 2px solid var(--green-800) !important;
outline-offset: 0 !important;
}
.tile-modal__splide .splide__arrow:disabled {
opacity: 0.5;
}
.tile-modal__splide .splide__arrow svg {
width: 1.45rem;
height: 1.45rem;
fill: currentColor;
}
.tile-modal__splide .splide__arrow--prev {
left: calc(50% - min(var(--tile-modal-slide-width), 88vw) / 2 - 2.75rem);
}
.tile-modal__splide .splide__arrow--next {
right: calc(50% - min(var(--tile-modal-slide-width), 88vw) / 2 - 2.75rem);
}
}
@media (max-width:600px){
.agenda__stage-title {
font-size:2rem;
word-break: normal;
overflow-wrap: normal; /* aka word-wrap */
hyphens: none;
}
}
@media (max-width:480px){
.agenda__stage {
border-left-width:1rem;
}
.agenda__stage-title {
font-size:1.5rem;
padding-right: 2.5rem;
}
.agenda__stage-toggle-icon svg {
width:2rem;
}
}
.tile-modal__nav-content iframe {
width:100%;
}
.contact-cta__avatar {
background-size: cover;
aspect-ratio: 1;
width: 100%;
border-radius: 1rem;
margin-bottom: 1rem;
}
/* Ticket pricing/form parity block synced from citywire-theme-v2 */
.kl-pricing__badge {
background-color: var(--color-primary);
font-size: 1rem;
}
[data-template="ticket"] .lead-section__body {
padding-bottom: 0;
font-size: 1.2rem;
}
[data-template="ticket"] .kl-pricing__card {
align-self:stretch;
}
.kl-pricing__price {
color: var(--neutral-900);
}
.kl-pricing__card >h4 {
font-weight:bold;
font-size: var(--font-size-h3);
max-width: 11ch;
margin: 1rem auto 1rem;
line-height: 1.2;
padding-bottom: 0;
}
.kl-pricing__card {
margin-left: 1rem;
display: flex;
flex-direction: column;
justify-content: space-between;
text-wrap: balance;
padding-bottom: 2.5rem;
}
.kl-pricing__button button {
width:100%;
font-size: 1rem;
}
.kl-pricing__features {
margin: 0 0 1.625rem;
}
.kl-pricing__button .button--outlined:hover {
color: #fff;
}
.kl-pricing-formview__back {
background-color:transparent;
color:currentColor;
padding: 0;
opacity: .7;
margin-bottom: 2rem;
}
.kl-pricing-formview__back:hover {
background-color:transparent;
color:currentColor;
text-decoration:underline;
}
.kl-pricing-formview__title {
font-size: var(--font-size-h2);
text-align: center;
margin: 0rem 0 2rem;
}
.kl-pricing-formview__panel {
padding: 2rem;
background: var(--neutral-100);
border: 1px solid var(--border);
border-radius: var(--radius-xl);
}
.kl-pricing-formview__panel [data-hsfc-id=Renderer] .hsfc-Form,
.kl-pricing-formview__panel [data-hs-cos-type="form"] {
background-color: #fff;
display: block;
border-radius: var(--radius);
max-width: 860px;
margin: 0 auto;
}
.kl-pricing-formview__panel [data-hs-cos-type="form"] {
padding:2rem 4rem 3rem;
}
.kl-pricing-formview__panel .hs-button {
background-color: var(--btn-bg);
border: var(--btn-bg);
border-radius: var(--btn-radius);
color: var(--btn-fg);
padding: var(--btn-padding-vertical) var(--btn-padding-horizontal);
font-family: var(--font-body);
font-size: 0.8rem;
font-weight: bold;
display: inline-block;
width: auto;
height: auto;
margin: 0;
cursor: pointer;
line-height: 1.1;
white-space: normal;
word-break: break-word;
text-align: center;
text-decoration: none;
position: relative;
}
.kl-pricing-formview__panel .hs-button:hover {
background-color: var(--btn-hover-bg);
border-color: var(--btn-hover-bg);
color: var(--btn-hover-fg);
text-decoration: none;
transform: scale(1.05);
outline-color: var(--btn-bg);
}
@media (max-width:600px){
.kl-pricing-formview__panel {
background-color:#fff;
}
.kl-pricing-wrap {
--hsf-default-background__padding:1rem;
}
.kl-pricing-formview__panel [data-hs-cos-type="form"] {
padding: 1rem 1rem 1rem;
}
.listing_hero-v01-row-0-padding {
padding:0;
}
.kl-pricing-formview__panel {
padding-left:0;
padding-right:0;
}
.kl-pricing-formview__title {
margin:0;
font-size:var(--font-size-h1);
}
.kl-pricing-wrap [data-hsfc-id=Renderer] .hsfc-Row {
display: flex;
flex-direction: column;
}
}
/* Temporary promo test: gated by ?promo=true in 2026-paw.js */
.promo-ribbon[hidden],
.promo-modal[hidden] {
display: none !important;
}
.promo-ribbon {
position: absolute;
top: 100%;
left: 0;
right: 0;
z-index: 501;
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
min-height: 2.75rem;
padding: 0.6rem var(--gutter);
background: var(--color-primary);
color: var(--color-on-primary);
font-weight: 800;
text-align: center;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 0;
box-shadow: 0 0.85rem 1.35rem rgba(0, 0, 0, 0.22);
outline:0;
}
.promo-ribbon:hover {
color: var(--color-on-primary);
text-decoration: none;
background: var(--color-primary-hover);
}
.promo-ribbon__label,
.promo-ribbon__cta {
line-height: 1.2;
}
.promo-ribbon__cta {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.35rem 0.75rem;
border: 1px solid currentColor;
border-radius: 999px;
font-size: 0.75rem;
white-space: nowrap;
}
.promo-ribbon__divider {
flex-shrink: 0;
opacity: 0.45;
}
.promo-ribbon__ticker {
overflow: hidden;
/* Wide enough for a ~60 character message to be readable in one glance
instead of arriving a fragment at a time; flex-shrink keeps it safe when
the label or CTA is longer. Only applies above 1280px - the ticker is
hidden below that, where it cannot animate. */
max-width: 36rem;
flex: 0 1 36rem;
font-weight: 600;
}
.promo-ribbon__ticker-track {
display: inline-flex;
align-items: center;
gap: 1.25rem;
white-space: nowrap;
animation: promo-ticker 16s linear infinite;
}
.promo-ribbon__ticker-sep {
opacity: 0.45;
}
@keyframes promo-ticker {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
.promo-ribbon:hover .promo-ribbon__ticker-track,
.promo-ribbon:focus-visible .promo-ribbon__ticker-track {
animation-play-state: paused;
}
.promo-modal {
position: fixed;
inset: 0;
z-index: 1200;
display: flex;
align-items: center;
justify-content: center;
padding: var(--gutter);
}
.promo-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.62);
}
.promo-modal__dialog {
position: relative;
z-index: 1;
width: min(100%, 34rem);
padding: clamp(2rem, 5vw, 3.25rem);
border-radius: var(--radius-lg);
background: var(--neutral-50);
color: var(--neutral-900);
text-align: center;
box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.36);
}
.promo-modal__close {
position: absolute;
top: 0.75rem;
right: 0.75rem;
display: inline-flex;
align-items: center;
justify-content: center;
width: 2.25rem;
height: 2.25rem;
padding: 0;
border: 0;
border-radius: 999px;
background: transparent;
color: currentColor;
font-size: 2rem;
line-height: 1;
cursor: pointer;
}
.promo-modal__close:hover {
background: var(--neutral-400);
}
.promo-modal__eyebrow {
margin: 0 0 0.75rem;
color: var(--neutral-700);
font-size: 0.8rem;
font-weight: 800;
text-transform: uppercase;
}
.promo-modal__title {
margin: 0;
color: var(--neutral-900);
font-size: clamp(2rem, 4vw, 3rem);
line-height: 1.05;
}
.promo-modal__desc {
margin: 1rem auto 1.5rem;
max-width: 30rem;
color: var(--neutral-700);
font-size: 1rem;
line-height: 1.5;
text-wrap: balance;
}
.promo-modal__cta {
display: inline-flex;
text-decoration: none;
}
@media (max-width: 600px) {
.promo-ribbon {
flex-direction: column;
gap: 0.35rem;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
font-size: 0.9rem;
}
.promo-ribbon__ticker,
.promo-ribbon__divider {
display: none;
}
/* The sticky header already shows an orange GET TICKETS directly above this
bar, so the pill was the same call to action twice in a row. The whole
ribbon is a link, so tapping the bar still goes to the tickets page. */
.promo-ribbon__cta {
display: none;
}
.promo-modal__dialog {
padding: 2.5rem 1.25rem 1.5rem;
}
}
@media (max-width: 1280px) {
/* Remove compositor layer for closed modals on mobile — display:none takes
the element out of the render tree entirely, eliminating GPU memory usage. */
.tile-modal {
transition: none;
}
.tile-modal:not(.tile-modal--open) {
display: none;
}
/* Scroll lock: override the desktop overflow:visible rule.
overflow:hidden on both html and body locks the scroll position in place on
modern iOS/Android without resetting it (no position:fixed needed). */
html.tile-modal-open,
html.tile-modal-open body {
overflow: hidden;
overscroll-behavior: none;
}
.tile-modal__backdrop {
background-color: rgba(18, 18, 18, 0.72);
background-image: none;
backdrop-filter: none;
-webkit-backdrop-filter: none;
}
.tile-modal--speaker .tile-modal__backdrop,
.tile-modal--partner .tile-modal__backdrop {
opacity: 1;
transition: none;
}
.tile-modal--speaker .tile-modal__body,
.tile-modal--partner .tile-modal__body {
opacity: 1;
transition: none;
will-change: auto;
}
.faqteam__views,
.faqteam__view {
transition: none;
}
.promo-ribbon__ticker-track {
animation: none;
transform: none;
}
/* The track is frozen at these widths, and the window is only 24rem, so a
message longer than that would sit permanently cut off mid-word ("...AT EA"
on a 1100px laptop). Drop the ticker entirely below the animating
breakpoint - the headline carries the message and the CTA the action. */
.promo-ribbon__ticker,
.promo-ribbon__divider {
display: none;
}
}
.ceros-mobile-hero-fallback {
position: absolute;
inset: 0;
display: flex;
align-items: flex-end;
padding: clamp(1.5rem, 7vw, 2.75rem) var(--gutter);
/* Chicago venue shot, matching the
Hyatt Regency Chicago this sits
behind. Was hubfs/image-4.png, which is the 2026 Luzern lakefront - carried
over with the file and invisible until the crash guard was fixed on
17 Sept 2026. Also 30x lighter: 138KB against 4.1MB, and 6.5MB decoded
against 9.4MB, which matters because this element only ever renders on the
mobile path we are trying to keep from running out of memory. */
background:
linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.38) 38%, rgba(0, 0, 0, 0.88)),
url("https://site.citywire.com/hubfs/hyatt-regency-chicago.webp") center / cover no-repeat;
color: #fff;
}
.ceros-mobile-hero-fallback__inner {
width: 100%;
max-width: 26rem;
}
.ceros-mobile-hero-fallback__eyebrow {
margin: 0 0 0.5rem;
color: var(--color-primary);
font-size: 0.8rem;
font-weight: 800;
text-transform: uppercase;
}
.ceros-mobile-hero-fallback__title {
margin: 0;
color: #fff;
font-size: clamp(2.2rem, 10.5vw, 3.5rem);
line-height: 0.95;
}
.ceros-mobile-hero-fallback__details {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.75rem;
margin: 1.2rem 0 1.4rem;
}
.ceros-mobile-hero-fallback__details div {
min-width: 0;
padding-top: 0.75rem;
border-top: 1px solid rgba(255, 255, 255, 0.34);
}
.ceros-mobile-hero-fallback__details dt {
margin: 0 0 0.25rem;
color: var(--color-primary);
font-size: 0.72rem;
font-weight: 800;
line-height: 1;
text-transform: uppercase;
}
.ceros-mobile-hero-fallback__details dd {
margin: 0;
color: #fff;
font-size: clamp(1rem, 4.7vw, 1.35rem);
font-weight: 700;
line-height: 1.1;
}
.ceros-mobile-hero-fallback__stats {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.7rem 0.9rem;
text-align: center;
}
.ceros-mobile-hero-fallback__stat {
min-width: 0;
}
.ceros-mobile-hero-fallback__stat--wide {
grid-column: 1 / -1;
}
.ceros-mobile-hero-fallback__stat strong {
display: block;
color: var(--color-primary);
font-size: clamp(1.45rem, 6.5vw, 2rem);
font-weight: 900;
line-height: 1;
}
.ceros-mobile-hero-fallback__stat span {
display: block;
margin-top: 0.22rem;
color: rgba(255, 255, 255, 0.88);
font-size: clamp(0.75rem, 3.4vw, 0.95rem);
font-weight: 500;
line-height: 1.15;
text-transform: uppercase;
}
/* Cookie banner (22 Oct 2026): HubSpot's banner keeps the site-wide layout from
/citywire-shared/cookie-banner.css (the layout loads it) and takes PAW's colours and button here.
The green tokens are coral here, as .btn--paw-green. The html prefix outranks the shared
file's !important rules. */
html #hs-banner-parent {
--hs-banner-text-color: var(--neutral-800) !important;
--hs-banner-settings-text-color: var(--neutral-800) !important;
--hs-banner-corners: 24px !important;
--hs-banner-button-corners: 24px !important;
--hs-banner-accept-color: var(--green-500) !important;
--hs-banner-accept-text-color: var(--green-900) !important;
--hs-banner-accept-border-color: var(--green-500) !important;
--hs-banner-decline-color: var(--neutral-700) !important;
--hs-banner-decline-text-color: var(--neutral-50) !important;
--hs-banner-decline-border-color: var(--neutral-700) !important;
--hs-banner-modal-text-color: var(--neutral-800) !important;
--hs-banner-modal-corners: 24px !important;
--hs-banner-modal-button-corners: 24px !important;
--hs-banner-modal-accept-color: var(--green-500) !important;
--hs-banner-modal-accept-text-color: var(--green-900) !important;
--hs-banner-modal-accept-border-color: var(--green-500) !important;
--hs-banner-modal-decline-color: var(--neutral-700) !important;
--hs-banner-modal-decline-text-color: var(--neutral-50) !important;
--hs-banner-modal-decline-border-color: var(--neutral-700) !important;
--hs-banner-modal-save-text-color: var(--neutral-700) !important;
--hs-banner-modal-save-border-color: var(--neutral-700) !important;
--hs-banner-modal-toggle-on-color: var(--green-500) !important;
}
/* The buttons as .btn--paw: uppercase 600, 24px pill, no shadow */
html #hs-eu-cookie-confirmation #hs-eu-confirmation-button,
html #hs-eu-cookie-confirmation #hs-eu-decline-button {
height: auto !important;
padding: 1.12rem 1rem !important;
line-height: 1 !important;
font-size: 1rem !important;
font-weight: 600 !important;
letter-spacing: normal !important;
text-transform: uppercase !important;
box-shadow: none !important;
filter: none !important;
transition: background-color .15s ease !important;
}
html #hs-eu-cookie-confirmation #hs-eu-confirmation-button:hover {
background: var(--green-400) !important;
}
html #hs-eu-cookie-confirmation #hs-eu-decline-button:hover {
background: var(--neutral-800) !important;
}
html #hs-eu-cookie-confirmation #hs-eu-confirmation-button:focus-visible,
html #hs-eu-cookie-confirmation #hs-eu-decline-button:focus-visible {
outline-color: var(--neutral-900) !important;
}