/* Online Option ribbon styles (folded corner) */
  :root{
    --cc-ribbon-bg:#ffc61e;          /* ribbon color */
    --cc-ribbon-text:#002142;         /* ribbon font color */
    --cc-ribbon-font:"Montserrat",ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
    --cc-ribbon-fold:.5em;            /* folded part size */
  }

  .cc-online-ribbon{position:relative;overflow:visible}

  /* Decorative visual: not read by AT, real text is injected in H3 */
  .cc-online-ribbon::after{
    content:attr(data-ribbon);
    position:absolute;top:0;right:0;
    font:700 clamp(10px,1.2vw,14px)/1 var(--cc-ribbon-font);
    color:var(--cc-ribbon-text);
    text-transform:uppercase;letter-spacing:.5px;
    background-color:var(--cc-ribbon-bg);
    line-height:1.8;
    padding-inline:1em; /* fallback */
    padding-bottom:var(--cc-ribbon-fold);
    border-image:conic-gradient(#0008 0 0) 51%/var(--cc-ribbon-fold);
    clip-path:polygon(100% calc(100% - var(--cc-ribbon-fold)),100% 100%,calc(100% - var(--cc-ribbon-fold)) calc(100% - var(--cc-ribbon-fold)),var(--cc-ribbon-fold) calc(100% - var(--cc-ribbon-fold)),0 100%,0 calc(100% - var(--cc-ribbon-fold)),999px calc(100% - var(--cc-ribbon-fold) - 999px),calc(100% - 999px) calc(100% - var(--cc-ribbon-fold) - 999px));
    transform:translate(calc((1 - cos(45deg))*100%), -100%) rotate(45deg);
    transform-origin:0% 100%;
    z-index:50;pointer-events:none;box-shadow:0 2px 8px rgba(0,0,0,.18);
    -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  }

  @supports (padding-inline:1lh){.cc-online-ribbon::after{padding-inline:1lh}}
	
  @supports not (transform:translate(calc((1 - cos(45deg))*100%), -100%) rotate(45deg)){
    .cc-online-ribbon::after{transform:translate(40%,-100%) rotate(45deg)}
  }
	
  @supports not (clip-path:polygon(0 0)){
    .cc-online-ribbon::after{border-image:initial;clip-path:none;padding-bottom:.2em}
  }

  /* Visually hidden text for screen readers */
  .cc-visually-hidden{
    position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0
  }
	
	@media (forced-colors: active) {
  .cc-online-ribbon::after {
    background: ButtonFace;     /* system color */
    color: ButtonText;          /* system color */
    border: 1px solid ButtonText;
    /* Avoid complex clipping that may be suppressed */
    clip-path: none;
    transform: translate(40%, -100%) rotate(45deg);
    padding-bottom: .2em;
  }
}