/*!*****************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./components/03-digital/04-templates/00-base/base.scss ***!
  \*****************************************************************************************************************************************************************************************/
@charset "UTF-8";
/** ***************************************************************************
 * Digital / Templates / Base
 *************************************************************************** */
/** ***************************************************************************
 * Conchiglia SASS utilities
 *************************************************************************** */
/* Function for converting a px based font-size to rem. */
/* This is useful to use variables in JS files */
:export {
  xs: 0;
  sm: 37.5rem;
  md: 48rem;
  lg: 64rem;
  xl: 80rem;
  xxl: 90rem;
  xxxl: 120rem;
}

html, body {
  overflow-x: clip;
}

body {
  /**
   * Main content
   */
  --cn-c-page__main--content_columns: repeat(var(--cn-global--content-grid--columncount), 1fr);
  --cn-c-page__main--GridColumn: 2 / -2;
  --cn-c-page__main--TemplateColumns:
    calc(var(--cn-global--content-grid--offsetsize) - var(--cn-global--content-grid--guttersize))
    var(--cn-c-page__main--content_columns)
    calc(var(--cn-global--content-grid--offsetsize) - var(--cn-global--content-grid--guttersize));
  /**
   * Paragraph
   */
  --cn-c-page__paragraph--LineHeight: 1.38;
  --cn-c-page__paragraph--m-lead--FontSize: clamp(1.25rem, 3.61vw, 2.25rem);
  --cn-c-page__paragraph--m-lead--FontWeight: var(--cn-global--FontWeight-book-regular);
  /**
   * Quote
   */
  --cn-c-page__quote--FontSize: 1.23em;
  --cn-c-page__quote--FontWeight: var(--cn-c-page__paragraph--m-lead--FontWeight);
  --cn-c-page__quote--LineHeight: 1.22;
  --cn-c-page__quote--MarginBlockStart: 1.47em;
  /**
   * List
   */
  --cn-c-page__list--ColumnGap: .73em;
  --cn-c-page__list--MarginBlock: 1.54em;
  --cn-c-page__list--RowGap: .35em;
  /**
   * Page footer
   */
  --cn-c-page__footer--FontSize: 1rem;
  /** Medium: 768px */
  /** Extra extralarge: 1440px */
}
@media all and (min-width: 48rem) {
  body {
    --cn-c-page__main--GridColumn: 6 / -3;
  }
}
@media all and (min-width: 90rem) {
  body {
    --cn-c-page__main--content_columns: repeat(var(--cn-global--content-grid--columncount), 4.5rem);
    --cn-c-page__main--TemplateColumns:
      1fr
      var(--cn-c-page__main--content_columns)
      1fr;
  }
}

/**
 * Main content
 * 1: adapt grid. TODO: switch to subgrid when available
 */
main {
  box-sizing: content-box;
  -moz-column-gap: var(--cn-c-page__main--ColumnGap);
       column-gap: var(--cn-c-page__main--ColumnGap);
  display: grid;
  font-size: var(--cn-c-page__main--FontSize);
  grid-template-columns: var(--cn-c-page__main--TemplateColumns);
  padding-block-end: var(--cn-c-page__main--PaddingBlockEnd);
}

main > * {
  grid-column: var(--cn-c-page__main--GridColumn);
}

main > .cn-u-subgrid_alternative {
  grid-column: 2/-2;
  grid-template-columns: var(--cn-c-page__main--content_columns); /* 1 */
}

/**
 * Paragraph
 */
main p {
  margin-block: 0;
  font-size: inherit;
  line-height: var(--cn-c-page__paragraph--LineHeight);
}

main .cn-m-lead {
  font-size: var(--cn-c-page__paragraph--m-lead--FontSize);
  margin-block-end: 1em;
}

/**
 * Quote
 * 1: reset
 */
blockquote {
  font-size: var(--cn-c-page__quote--FontSize);
  font-weight: var(--cn-c-page__quote--FontWeight);
  margin-block-start: var(--cn-c-page__quote--MarginBlockStart);
  margin-block-end: 0; /* 1 */
  margin-inline: 0; /* 1 */
  line-height: var(--cn-c-page__quote--LineHeight);
}
blockquote::before {
  content: "“";
  display: block;
  font-size: 1.56em;
  font-weight: var(--cn-global--FontWeight-bold);
  margin-block-end: -0.12em; /* eyeballed */
}
blockquote > p {
  font-weight: inherit;
}

/**
 * List
 * 1: reset
 */
main ul,
main ol {
  list-style-position: inside;
  margin-block: var(--cn-c-page__list--MarginBlock);
  padding-inline: 0; /* 1 */
  /** Medium: 768px */
}
@media all and (min-width: 48rem) {
  main ul,
  main ol {
    list-style-position: outside;
  }
}

main li:nth-child(n+2) {
  margin-block-start: var(--cn-c-page__list--RowGap);
}

/**
 * Page footer
 * 1: create a stacking context
 * 2: on top of shadows
 * 3: match ecommerce
 */
body > .cn-c-footer {
  position: relative; /* 1 */
  z-index: 2; /* 2 */
}

body > .cn-c-footer p {
  font-size: var(--cn-c-page__footer--FontSize);
  margin-block-end: 1.5625rem; /* 3 */
}

body > .cn-c-footer ul {
  margin-block-end: 1.5625rem;
}

body > .cn-c-footer li {
  line-height: var(--cn-global--LineHeight-sm);
}

/*# sourceMappingURL=base.css.map*/