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

/* @group @o-sidebar */

[class*="o-sidebar"] {
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: 3rem;
}

/* @end @o-sidebar */

/* @group @m-sidebar-headline */

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

/* @group @variables */

[class*="m-sidebar-headline"] {
--head-2-font-size: 1.25rem;
--head-2-line-height: 1.2;
--head-2-font-weight: 600;
}

/* @end @variables */

[class*="m-sidebar-headline"] {
display: grid;
gap: .75rem;
}

/* @end @m-sidebar-headline */

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

/* @group @m-category-nav-list */

[class*="m-category-nav-list"] {
box-shadow: 0 1px 0 0 hsl(220deg 5% 85%);
}

/* @end @m-category-nav-list */

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

/* @group @variables */

[class*="a-category-nav-link"] {
--link-color: var(--color-text);
}

/* @end @variables */

/* @group @a-category-nav-link */

[class*="a-category-nav-link"] {
display: grid;
align-items: center;
padding: .75rem;
/*box-shadow: 0 1px 0 0 hsl(220deg 5% 85%), inset 0 1px 0 0 hsl(220deg 5% 85%);*/
box-shadow: inset 0 1px 0 0 hsl(220deg 5% 85%);
transition: var(--link-premier-transition);
}

[class*="a-category-nav-link"]:hover,
[class*="a-category-nav-link"]:focus {
background-color: hsl(220deg 20% 95%);
}

/* @end @mm-category-nav-list */

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

/* @group @m-subcategory-nav-list*/

[class*="m-subcategory-nav-list"] {
position: relative;
display: grid;
gap: .375rem;
margin-block: .75rem 1.125rem;
padding-left: 2.25rem;
}

[class*="m-subcategory-nav-list"]:before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 1.125rem;
width: 1px;
background-color: var(--border-color);
}

/* @end @am-subcategory-nav-list */

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

/* @group @variables */

[class*="a-category-sub-nav-link"] {
--link-color: var(--color-text);
}

/* @end @variables */

/* @group @a-category-sub-nav-link */

[class*="a-category-sub-nav-link"] {
display: grid;
align-items: center;
padding: .375rem.75rem;
border-radius: .375rem;
transition: var(--link-premier-transition);
}

[class*="a-category-sub-nav-link"]:hover,
[class*="a-category-sub-nav-link"]:focus {
background-color: hsl(220deg 20% 95%);
}

/* @end @a-category-sub-nav-link */

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

/* @group @variables */

[class*="m-articolo"] {
--articolo-gap: .75rem;
--articolo-padding: .75rem;
}

[class*="m-articolo-primary"] {
--articolo-gap: 1.125rem;
--articolo-padding: 1.5rem 1.125rem;
}

[class*="m-articolo-secondary"] {
--articolo-gap: .75rem;
--articolo-padding: 1.125rem .75rem;
}

/* @end @variables */

/* @group @m-articolo */

[class*="m-articolo"] {
display: grid;
gap: var(--articolo-gap);
padding: var(--articolo-padding);
background-color: var(--color-white);
backface-visibility: hidden;
}

/* @end @m-articolo */

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

/* @group @variables */

[class*="a-articolo-list"] {
--font-size: .875rem;
--line-height: 1.71428571;
--color: inherit;
}

/* @end @variables */

/* @group @a-articolo-list */

[class*="a-articolo-list"] {
display: grid;
grid-template-columns: repeat(1, 1fr);
box-shadow: 0 -1px 0 0 var(--border-color), inset 0 -1px 0 0 var(--border-color);
}

/* @end @a-articolo-list */

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

/* @group @variables */

[class*="a-articolo-headline"] {
--head-2-font-size: 1.25rem;
--head-2-line-height: 1.2;
--head-2-font-weight: 500;
}

/* @end @variables */

/* @group @a-articolo-headline */

[class*="a-articolo-headline"] {
display: grid;
grid-auto-flow: row;
gap: .75rem;
padding-left: .75rem;
border-left: .25rem solid var(--color-primary);
}

/* @end @a-articolo-headline */

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

/* @group @variables */

[class*="a-articolo-detail-link"] {
--link-color: var(--color-text);
--link-action-color: var(--color-link-action);
--link-active-color: var(--color-link-active);
}

/* @end @variables */

/* @group @a-articolo-detail-link */

[class*="a-articolo-detail-link"] {
position: relative;
display: grid;
grid-template-columns: 3rem 1fr;
gap: .75rem;
}

[class*="a-articolo-media"] {
grid-column: 1;
grid-row: 1;
}

[class*="a-articolo-label"] {
align-self: center;
grid-column: 2;
grid-row: 1;
}

/* @end @a-articolo-detail-link */

/* @group @a-articolo-detail-link */

[class*="a-articolo-detail-link"] {
position: relative;
padding: .5625rem;
background-color: var(--color-white);
box-shadow: 0 -1px 0 0 var(--border-color), inset 0 -1px 0 0 var(--border-color);
transition: var(--link-premier-transition);
}

[class*="a-articolo-media"] {
overflow: hidden;
display: block;
width: 3rem;
height: 3rem;
margin-top: .1875rem;
}

[class*="a-articolo-media"] img {
width: inherit;
height: inherit;
object-fit: cover;
object-position: center center;
aspect-ratio: 1 / 1;
transition: var(--transform-transition);
}

a:hover [class*="a-articolo-media"] img,
a:focus [class*="a-articolo-media"] img {
transform: scale(1.05);
}

[class*="a-articolo-label"] {
color: inherit;
}

/* @end @a-articolo-detail-link */
