/* 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;
/*--root-hero-info-grid-row: 4;*/
--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 4;*/
--root-hero-speaker-grid-row: 1 / span 3;
}

}

/* @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);
/*background-image: repeating-linear-gradient(220deg, rgba(172, 176, 216,0.08) 0px, rgba(172, 176, 216,0.08) 1px,transparent 1px, transparent 9px),repeating-linear-gradient(225deg, rgba(172, 176, 216,0.08) 0px, rgba(172, 176, 216,0.08) 1px,transparent 1px, transparent 9px),linear-gradient(140deg, rgb(108,25,90),rgb(14,32,116));*/
background-image: repeating-linear-gradient(353deg, hsla(64,83%,54%,0.05) 0px, hsla(64,83%,54%,0.05) 1px,transparent 1px, transparent 11px,hsla(64,83%,54%,0.05) 11px, hsla(64,83%,54%,0.05) 12px,transparent 12px, transparent 32px),repeating-linear-gradient(398deg, hsla(64,83%,54%,0.05) 0px, hsla(64,83%,54%,0.05) 1px,transparent 1px, transparent 11px,hsla(64,83%,54%,0.05) 11px, hsla(64,83%,54%,0.05) 12px,transparent 12px, transparent 32px),repeating-linear-gradient(308deg, hsla(64,83%,54%,0.05) 0px, hsla(64,83%,54%,0.05) 1px,transparent 1px, transparent 11px,hsla(64,83%,54%,0.05) 11px, hsla(64,83%,54%,0.05) 12px,transparent 12px, transparent 32px),repeating-linear-gradient(443deg, hsla(64,83%,54%,0.05) 0px, hsla(64,83%,54%,0.05) 1px,transparent 1px, transparent 11px,hsla(64,83%,54%,0.05) 11px, hsla(64,83%,54%,0.05) 12px,transparent 12px, transparent 32px),linear-gradient(398deg, rgb(27,18,79),rgb(110,17,93));
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: 1px;
}

/* @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(0deg 0% 100% / 25%);
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(0deg 0% 100% / 45%);
}

: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: 12rem;
}

}

/* @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;
}

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

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

}

/* @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;
--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;
}

/* @end @variables */

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

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

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

/* 01 -------------------------------------------------------- */
