.cm-page-publicite,
.cm-publicite-page{
  background:
    linear-gradient(180deg, rgba(246,236,221,.48), rgba(241,227,210,.58)),
    url('/assets/images/publicite/publicite-hero-landscape.webp') center top / cover fixed no-repeat;
  color:#231814;
}

.cm-publicite-page{
  position:relative;
}

.cm-publicite-page::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,245,204,.14), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
}

.cm-publicite-hero{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  isolation:isolate;
}

.cm-publicite-hero__media,
.cm-publicite-hero__media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.cm-publicite-hero__media img{
  display:block;
  object-fit:cover;
  object-position:center center;
  filter:saturate(1.04) contrast(1.02) brightness(1.03);
}

.cm-publicite-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg,
      rgba(255,248,238,.01) 0%,
      rgba(255,248,238,.02) 38%,
      rgba(255,243,223,.04) 62%,
      rgba(94,37,12,.07) 84%,
      rgba(57,19,7,.16) 100%),
    radial-gradient(circle at 50% 8%, rgba(255,244,190,.14), transparent 23%);
}

.cm-publicite-hero__inner{
  position:relative;
  z-index:2;
  width:min(100%, 1680px);
  min-height:100svh;
  margin:0 auto;
}

.cm-publicite-hero__panel{
  position:absolute;
  top:24px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(560px, calc(100vw - 32px));
  min-height:110px;
  padding:18px 28px 20px;
  text-align:center;
  border-radius:30px;
  border:1px solid rgba(255,243,221,.72);
  background:linear-gradient(180deg, rgba(255,251,246,.56), rgba(249,238,226,.50));
  box-shadow:
    0 26px 56px rgba(53,27,14,.16),
    inset 0 1px 0 rgba(255,255,255,.54);
  backdrop-filter:blur(10px);
  overflow:hidden;
}

.cm-publicite-hero__panel::after,
.cm-publicite-stage__head::after,
.cm-publicite-section__shell::after,
.cm-publicite-card::after,
.cm-publicite-switches__btn::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1.4px;
  background:linear-gradient(115deg,
    rgba(255,245,220,0) 0%,
    rgba(255,255,255,0) 35%,
    rgba(255,250,236,.95) 48%,
    rgba(255,214,124,.9) 50%,
    rgba(255,251,238,.92) 52%,
    rgba(255,245,220,0) 63%,
    rgba(255,245,220,0) 100%);
  background-size:240% 100%;
  background-position:160% 50%;
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
  mix-blend-mode:screen;
  animation:cmPubliciteGoldSweep 9s linear infinite;
}

.cm-publicite-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#8c5514;
}

.cm-publicite-kicker::before{
  content:"";
  width:34px;
  height:1px;
  background:currentColor;
  opacity:.65;
}

.cm-publicite-hero__title{
  margin:0;
  font-size:clamp(3rem, 5vw, 5.8rem);
  line-height:.92;
  letter-spacing:.01em;
  color:#2e1b14;
  text-shadow:0 1px 0 rgba(255,255,255,.35), 0 12px 28px rgba(113,67,21,.12);
}

.cm-publicite-hero__lead{
  display:none;
}

.cm-publicite-scrollcue{
  position:absolute;
  left:50%;
  bottom:max(10px, env(safe-area-inset-bottom));
  transform:translateX(-50%);
  z-index:3;
  display:block;
  text-decoration:none;
}

.cm-publicite-scrollcue__img{
  display:block;
  width:min(7vw, 54px);
  height:auto;
  filter:drop-shadow(0 14px 16px rgba(85,42,16,.18));
  animation:cmPubliciteScrollCue 2.6s ease-in-out infinite;
}

.cm-publicite-stage{
  position:relative;
  overflow:hidden;
  padding-bottom:20px;
}

.cm-publicite-stage::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(247,236,220,.30), rgba(245,233,218,.46) 16%, rgba(245,232,217,.72) 100%),
    radial-gradient(circle at 50% 0%, rgba(255,244,204,.10), transparent 30%);
  pointer-events:none;
}

.cm-publicite-stage__inner{
  position:relative;
  z-index:1;
  width:min(1380px, calc(100% - 34px));
  margin:0 auto;
  padding:78px 0 96px;
}

.cm-publicite-stage__head{
  position:relative;
  max-width:980px;
  margin:0 auto 34px;
  padding:24px 28px;
  text-align:center;
  border-radius:34px;
  border:1px solid rgba(255,243,224,.82);
  background:linear-gradient(180deg, rgba(255,250,244,.76), rgba(249,238,226,.68));
  box-shadow:0 26px 60px rgba(76,39,18,.10);
  backdrop-filter:blur(8px);
}

.cm-publicite-stage__head h2,
.cm-publicite-section__title{
  margin:0;
  font-size:clamp(2rem, 3.7vw, 3.2rem);
  line-height:1.04;
  color:#2b1913;
  text-align:center;
}

.cm-publicite-stage__head p,
.cm-publicite-section__lead,
.cm-publicite-block__text,
.cm-publicite-card__text,
.cm-publicite-card__badge,
.cm-publicite-card__eyebrow{
  display:none;
}

.cm-publicite-switches{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
}

.cm-publicite-switches__btn,
.cm-publicite-card__link{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:50px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid rgba(128,75,28,.16);
  background:linear-gradient(180deg, rgba(77,43,22,.96), rgba(41,24,14,.98));
  color:#fff4df;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 16px 32px rgba(45,25,14,.16), inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.cm-publicite-switches__btn:hover,
.cm-publicite-switches__btn:focus-visible,
.cm-publicite-card__link:hover,
.cm-publicite-card__link:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 22px 38px rgba(45,25,14,.22), inset 0 1px 0 rgba(255,255,255,.12);
  filter:brightness(1.03);
}

.cm-publicite-section + .cm-publicite-section{
  margin-top:28px;
}

.cm-publicite-section__shell{
  position:relative;
  padding:30px;
  border-radius:38px;
  border:1px solid rgba(255,242,221,.78);
  background:linear-gradient(180deg, rgba(252,247,242,.80), rgba(246,236,223,.74));
  box-shadow:0 28px 64px rgba(72,36,17,.10);
  backdrop-filter:blur(8px);
}

.cm-publicite-section--boston .cm-publicite-section__shell{
  background:linear-gradient(180deg, rgba(251,244,238,.82), rgba(245,233,221,.76));
}

.cm-publicite-section--bulldog .cm-publicite-section__shell{
  background:linear-gradient(180deg, rgba(251,245,239,.82), rgba(244,231,218,.78));
}

.cm-publicite-section__head{
  margin-bottom:20px;
}

.cm-publicite-block + .cm-publicite-block{
  margin-top:22px;
}

.cm-publicite-block__head{
  margin-bottom:18px;
}

.cm-publicite-block__title{
  margin:0;
  font-size:clamp(1.4rem, 2.4vw, 2rem);
  line-height:1.1;
  color:#2a1812;
}

.cm-publicite-grid{
  display:grid;
  gap:18px;
}

.cm-publicite-grid--videos{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.cm-publicite-grid--sources{
  grid-template-columns:repeat(4, minmax(0, 1fr));
}

.cm-publicite-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  border-radius:28px;
  border:1px solid rgba(255,241,220,.92);
  background:linear-gradient(180deg, rgba(255,252,248,.92), rgba(247,237,225,.88));
  box-shadow:0 18px 40px rgba(72,38,18,.10);
  overflow:hidden;
}

.cm-publicite-video{
  position:relative;
  aspect-ratio:16 / 9;
  background:#120b08;
}

.cm-publicite-video iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}

.cm-publicite-card__body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:10px;
  padding:18px 18px 0;
}

.cm-publicite-card__title{
  margin:0;
  font-size:1.16rem;
  line-height:1.24;
  color:#281813;
}

.cm-publicite-card__actions{
  display:flex;
  align-items:flex-end;
  margin:0;
  padding:18px;
}

.cm-publicite-card__link{
  min-height:44px;
  padding:0 18px;
  font-size:.95rem;
}

@keyframes cmPubliciteGoldSweep{
  0%{ background-position:165% 50%; }
  100%{ background-position:-65% 50%; }
}

@keyframes cmPubliciteScrollCue{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(8px); }
}

@media (max-width: 1180px){
  .cm-page-publicite,
  .cm-publicite-page{
    background-attachment:scroll;
  }

  .cm-publicite-grid--sources{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .cm-publicite-hero__panel{
    width:min(520px, calc(100vw - 24px));
  }
}

@media (max-width: 900px){
  .cm-publicite-grid--videos,
  .cm-publicite-grid--sources{
    grid-template-columns:minmax(0, 1fr);
  }

  .cm-publicite-stage__inner{
    width:min(100%, calc(100% - 22px));
    padding:56px 0 78px;
  }

  .cm-publicite-section__shell,
  .cm-publicite-stage__head{
    padding:22px 18px;
    border-radius:28px;
  }
}

@media (max-width: 720px){
  .cm-publicite-hero__media img{
    object-position:52% center;
  }

  .cm-publicite-hero__panel{
    top:16px;
    right:auto;
    left:50%;
    bottom:auto;
    transform:translateX(-50%);
    width:min(92vw, 460px);
    max-width:none;
    min-height:94px;
    padding:14px 18px 16px;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(255,251,246,.60), rgba(249,238,226,.54));
  }

  .cm-publicite-hero__title{
    font-size:clamp(2.35rem, 13vw, 3.6rem);
  }

  .cm-publicite-scrollcue__img{
    width:min(16vw, 58px);
  }
}

@media (orientation: portrait){
  .cm-page-publicite,
  .cm-publicite-page{
    background-image:
      linear-gradient(180deg, rgba(246,236,221,.52), rgba(241,227,210,.62)),
      url('/assets/images/publicite/publicite-hero-portrait.webp');
  }
}
