/* hero -------------------------------------------------------- */

/* @group @variables */


[class*="o-root-hero"] {
--root-hero-grid-template-columns: 1fr;
--color: var(--color-white);
}


@media (width >= 48em) { /* 768px -> * */

[class*="o-root-hero"] {
--root-hero-grid-template-columns: 3fr 1fr;
--root-hero-title-grid-column: 1;
--root-hero-title-grid-row: 1;
--root-hero-info-grid-column: 1 / span 2;
--root-hero-info-grid-row: 3;
--root-hero-social-list-grid-column: 1;
--root-hero-social-list-grid-row: 2;
--root-hero-speaker-grid-column: 2;
--root-hero-speaker-grid-row: 1 / span 2;

}

}

/* @end @variables */

/* @group @o-root-hero */

[class*="o-root-hero"] {
position: relative;
z-index: 3;
display: grid;
grid-template-columns: var(--root-hero-grid-template-columns);
gap: 3rem;
padding: 7.5rem var(--x-padding-right) 4.5rem var(--x-padding-left);
/* https://www.gradientmagic.com/collection/subtlegrid/gradient/1599400289720 */
background-image: repeating-linear-gradient(225deg, rgba(221, 211, 144,0.12) 0px, rgba(221, 211, 144,0.12) 1px,transparent 1px, transparent 13px),repeating-linear-gradient(315deg, rgba(221, 211, 144,0.12) 0px, rgba(221, 211, 144,0.12) 1px,transparent 1px, transparent 13px),linear-gradient(270deg, rgb(147,42,119),rgb(45,18,79));
background-repeat: no-repeat;
background-position: right top;
}

[class*="m-root-hero-title"] {
grid-column: var(--root-hero-title-grid-column);
grid-row: var(--root-hero-title-grid-row);
}

[class*="m-root-hero-info"] {
grid-column: var(--root-hero-info-grid-column);
grid-row: var(--root-hero-info-grid-row);
}

[class*="m-root-hero-speaker"] {
grid-column: var(--root-hero-speaker-grid-column);
grid-row: var(--root-hero-speaker-grid-row);
}

[class*="m-root-hero-social-link-list"] {
grid-column: var(--root-hero-social-list-grid-column);
grid-row: var(--root-hero-social-list-grid-row);
}

/* @end @o-root-hero */

/* -------------------------------------------------------- */

/* @group @a-root-hero-background */

[class*="a-root-hero-background"] {
position: absolute;
z-index: -2;
inset: 0;
}

:where([class*="a-root-hero-background"]) img {
display: grid;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
}

/* @end @a-root-hero-background */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="m-root-hero-title"] {
--head-1-font-size: 2.25rem;
--head-1-line-height: 1.33333333;
--head-1-word-break: keep-all;
--head-1-overflow-wrap: anywhere;
--head-2-font-size: 1rem;
--head-2-line-height: 1.5;
--head-2-word-break: keep-all;
--head-2-overflow-wrap: anywhere;
}

/* @end @variables */

/* @group @m-root-hero-title */

[class*="m-root-hero-title"] {
display: grid;
gap: 1.875rem;
}

/* @end @m-root-hero-title */

/* -------------------------------------------------------- */

/* @group @variables */

@media (width < 48em) { /* 0 -> 767px */

[class*="a-root-hero-title"] {
--root-hero-title-text-align: center;
}

}

/* @end @variables */

/* @group @a-root-hero-title */

[class*="a-root-hero-title"] {
display: grid;
gap: .75rem;
text-align: var(--root-hero-title-text-align);
}

/* @end @a-root-hero-title */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="m-root-hero-social-link-list"] {
--root-hero-social-list-justify-content: center;
}

@media (width >= 48em) { /* 768px -> * */

[class*="m-root-hero-social-link-list"] {
--root-hero-social-list-justify-content: start;
}

}

/* @end @variables */

/* @group @m-root-hero-social-link-list */

[class*="m-root-hero-social-link-list"] {
display: grid;
justify-content: var(--root-hero-social-list-justify-content);
align-items: center;
grid-auto-flow: column;
gap: .75rem;
margin-inline: var(--root-hero-social-link-list-margin-inline);
}

:where([class*="m-root-hero-social-link-list"]) dt {
font-weight: 500;
text-transform: uppercase;
}

/* @end @m-root-hero-social-link-list */

/* -------------------------------------------------------- */

/* @group @m-social-list */

[class*="m-root-hero-social-list"] {
display: grid;
justify-content: start;
grid-auto-flow: column;
gap: 2px;
}

/* @end @m-root-hero-social-list */

/* -------------------------------------------------------- */

/* @group @a-root-hero-social-link */

[class*="a-root-hero-social-link"] {
position: relative;
display: grid;
justify-content: center;
align-items: center;
width: 3rem;
height: 3rem;
background-color: hsl(312deg 55% 37.5%);
color: var(--color-white);
transition: background-color .3s 0s var(--transition-cubic-bezier), color .3s 0s var(--transition-cubic-bezier);
}

[class*="a-root-hero-social-link"]:hover,
[class*="a-root-hero-social-link"]:focus {
background-color: hsl(312deg 55% 32.5%);
}

:where([class*="a-root-hero-social-link"]) svg {
width: 1.375rem;
height: 1.375rem;
fill: currentColor;
}

/* @end @a-root-hero-social-link */

/* -------------------------------------------------------- */

/* @group @variables */

@media (width >= 48em) { /* 768px -> * */

[class*="a-root-hero-application-link"] {
--root-hero-application-link-max-width: 20rem;
}

}

/* @end @variables */

/* @group @a-root-hero-application-link */

[class*="a-root-hero-application-link"] {
display: grid;
max-width: var(--root-hero-application-link-max-width);
}

/* @end @a-root-hero-application-link */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="m-root-hero-speaker"] {
--font-size: .875rem;
--line-height: 1.71428571;
}

/* @end @variables */

/* @group @m-root-hero-speaker */

[class*="m-root-hero-speaker"] {
display: grid;
align-content: start;
gap: .75rem;
}

/* @end @m-root-hero-speaker */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-root-hero-speaker-caption"] {
--ruby-margin-inline: auto;
--ruby-font-size: 1.25rem;
--ruby-line-height: 1.2;
--ruby-font-weight: 500;
--ruby-text-align: center;
--ruby-text-transform: uppercase;
--font-size: .8125rem;
--line-height: 1.84615385;
}

@media (width < 48em) { /* 0 -> 767px */

[class*="a-root-hero-speaker-caption"] {
--hero-speaker-caption-text-align: center;
--word-break: keep-all;
--overflow-wrap: anywhere;
}

}

/* @end @variables */

/* @group @a-root-hero-speaker-caption */

[class*="a-root-hero-speaker-caption"] {
display: grid;
gap: .75rem;
text-align: var(--hero-speaker-caption-text-align);
}

/* @end @a-root-hero-speaker-caption */

/* @group @a-root-hero-speaker-portrait */

[class*="a-root-hero-speaker-portrait"] {
position: relative;
max-width: 12rem;
margin-inline: auto;
}

:where([class*="a-root-hero-speaker-portrait"]):before {
content: '';
position: absolute;
z-index: 2;
inset: 0;
border: .5rem solid hsl(0deg 0% 100% / 25%);
border-radius: 50%;
pointer-events: none;
}

:where([class*="a-root-hero-speaker-portrait"]) img  {
width: 100%;
height: auto;
object-fit: cover;
object-position: center center;
border-radius: 50%;
}

/* @end @a-root-hero-speaker-portrait */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="m-root-hero-info"] {
--head-3-font-size: 1rem;
--head-3-line-height: 1.5;
--head-3-font-size: .875rem;
--head-3-line-height: 1.71428571;
--head-3-font-weight: 300;
--head-3-font-size: .8125rem;
--head-3-line-height: 1.84615385;
--head-4-font-size: .875rem;
--head-4-line-height: 1.28571429;
--head-4-font-size: .8125rem;
--head-4-line-height: 1.84615385;
--font-size: .8125rem;
--line-height: 1.84615385;
--color: var(--color-text);
}

@media (width >= 48em) { /* 768px -> * */

[class*="m-root-hero-info"] {
--root-hero-info-grid-template-columns: repeat(4, 1fr);
}

}

/* @end @variables */

/* @group @m-root-hero-info */

[class*="m-root-hero-info"] {
display: grid;
grid-template-columns: var(--root-hero-info-grid-template-columns);
gap: .75rem;
padding: .75rem;
background-color: var(--color-white);
border-radius: .5rem;
}

/* @end @m-root-hero-info */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-root-hero-info-detail"] {
--word-break: keep-all;
--overflow-wrap: anywhere;
}

:where([class*="a-root-hero-info-detail"]) time {
--font-weight: 600;
}

/* @end @variables */

/* @group @a-root-hero-info-detail */

[class*="a-root-hero-info-detail"] {
display: grid;
align-content: start;
gap: .1875rem;
}

/* @end @a-root-hero-info-detail */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-root-hero-early-bird-price"] {
--root-hero-early-bird-price-grid-auto-flow: column;
}

@media (width >= 48em) and (width < 62em) { /* 768px -> 991px */

[class*="a-root-hero-early-bird-price"] {
--root-hero-early-bird-price-grid-auto-flow: row;
}

}

/* @end @variables */

/* @group @a-root-hero-early-bird-price */

[class*="a-root-hero-early-bird-price"] {
display: grid;
justify-content: start;
grid-auto-flow: var(--root-hero-early-bird-price-grid-auto-flow);
gap: .1875rem .375rem;
white-space: nowrap;
}

/* @end @a-root-hero-early-bird-price */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-root-hero-info-price-now"] {
--font-size: .75rem;
--line-height: 1.5;
--color: hsl(168deg 87.5% 25%);
}

/* @end @variables */

/* -------------------------------------------------------- */

/* @group @a-root-hero-info-price-now */

[class*="a-root-hero-info-price-now"] {
display: grid;
margin-right: auto;
padding-inline: .5rem;
background-color: hsl(160deg 45% 92.5%);
border: 1px solid hsl(168deg 87.5% 50%);
border-radius: .25rem;
white-space: nowrap;
transform: scale(.875);
transform-origin: left center;
}

/* @end @a-root-hero-info-price-now */

/* -------------------------------------------------------- */

/* @group @a-root-hero-price-sold-out */

[class*="a-root-hero-price-sold-out"] {

}

/* @end @a-root-hero-price-sold-out */
