/*
 Theme Name:   Carnoustie Creative (2026)
 Description:  Custom theme
 Author:       Carnoustie Creative
 Author URI:   https://www.carnoustiecreative.co.uk
 Template:     canvas
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  project-theme
*/

/*
 Font copy/paste reference:

 Work Sans:
 font-family: "Work Sans", sans-serif;

 Font weights:
 400 = Regular
 500 = Medium
 600 = Semibold
 700 = Bold

 Bricolage Grotesque:
 font-family: "Bricolage Grotesque", sans-serif;

 Font weights:
 600 = Semibold
*/

@view-transition {
    navigation: auto;
}
  
::view-transition-group(root) {
    animation-duration: 1s;
}

:root {
    --cc-deepsky: #00AEEF;
    --cc-zodiac: #171F47;
    --cc-abbey: #525252;
    --cc-sunglo: #DE5F71;
    --cc-whitesmoke: #F5F5F5;  
    --cc-dark-gradient-bgnd: linear-gradient(179.82deg, #242424 13.03%, #525252 74.36%);
    --cc-colour-gradient-horz: linear-gradient(90deg, #39ADEA 0%, #DE5F71 100%);
    --cc-radius: 0.8rem;
}

.canvas {
    --canvas-aos-distance: 50px;
    --canvas-aos-distance-negative: -50px;
}

.canvas .mobile-nav {
    display: none;
}

.canvas.under-header .canvas-header-stack {
    background-color: rgba(0,0,0,.65);
    backdrop-filter: blur(1rem);
}

.canvas.under-header.white-header .canvas-header-stack {
    background-color: rgba(255,255,255,.65);
}

.canvas.white-header .site-header {
    border-bottom: 0.1rem solid #ededed;
}

.canvas.white-header .site-header .menu li:not(.button) a {
    color: #000;
}

.canvas-mobile-panel .canvas-mobile-panel__close {
    background-color: var(--cc-abbey);
    border-color: var(--cc-abbey);
}

.canvas.white-header .canvas-header-stack,
.canvas.white-header .site-header,
.canvas.white-header .site-header__main {
    background-color: #fff;
}

.canvas.under-header .site-header,
.canvas.under-header .site-header__main  {
    background-color: transparent;    
}

body.canvas {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5;
    font-family: "Work Sans", sans-serif;
    font-size: 1.55rem, 1.5vw, 1.7rem;
}

.canvas h1,
.canvas h2,
.canvas h3 {
    font-family: "Bricolage Grotesque", sans-serif;
    font-weight: 600;
}

.site-header__main .container,
.site-footer .container {
    width: 94vw;
}

.site-logo .custom-logo {
    width: min(20rem, 52vw);
    height: auto;
}

.menu-top-menu-container li:not(.button) a {
    border-radius: 0.2rem;
    font-size: clamp(1.7rem, 1.7vw, 1.9rem);
}

.site-header .menu li:not(.button) a:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.white-header .site-header .menu li:not(.button) a:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

button,
.button,
a.button,
li.button>a,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    padding: 1.5rem 2.3rem;
}

@media ( max-width: 720px ) {

    .canvas .site-header__layout--left {
        grid-template-columns: minmax(18rem, 4fr) minmax(0, 8fr);
    }

}

@media ( max-width: 960px ) {

    .canvas-header-height-medium .site-header__layout {
        padding-block: 2rem;
    }

    .site-logo .custom-logo {
        width: min(20rem, 40vw);
    }

    .canvas-primary-menu-align-left .site-header__main .menu li {
        display: none;
    }

}

.footer-section--bottom {
    background-color: #000;
}

.footer-credit {
    text-align: center;
}

.canvas-mobile-menu-desktop-enabled .site-header__widgets--right.site-header__widgets--has-desktop-toggle {
    justify-content: space-between;
    align-items: center;
}

.canvas-primary-menu-align-left .site-header__main .menu {
    gap: 4vw;
}

.canvas-mobile-toggle__icon span {
    background: var(--cc-deepsky);
    height: 0.3rem;
    position: relative;
}

.site-header__widgets .canvas-desktop-mobile-toggle {
    align-self: center;
    border: none;
    line-height: 0;
}

.canvas-mobile-toggle__icon {
    height: 2.7rem;
    width: 3.3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.9rem;
}

.canvas-mobile-toggle__icon span,
.canvas-mobile-toggle__icon span:nth-child(1),
.canvas-mobile-toggle__icon span:nth-child(2),
.canvas-mobile-toggle__icon span:nth-child(3) {
    top: auto;
}

.canvas-mobile-toggle[aria-expanded="true"] .canvas-mobile-toggle__icon span:nth-child(1) {
    transform: translateY(0.9rem) rotate(45deg);
}

.canvas-mobile-toggle[aria-expanded="true"] .canvas-mobile-toggle__icon span:nth-child(3) {
    transform: translateY(-0.9rem) rotate(-45deg);
}

.canvas h1.xl {
    font-size: clamp(4.2rem, 3.4rem + 2vw, 7.4rem);
}

/* Homepage screenshot collage */

.home .cde-collage-text.first {
    --cc-shot-shadow: 0 2.8rem 5rem rgb(0 0 0 / 32%), 0 0.6rem 1.5rem rgb(0 0 0 / 26%);
    --cc-shot-tilt: translate(7vw, 8rem) rotateX(60deg) rotateZ(-45deg);
    --cc-shot-offset-right: clamp(-5rem, -5vw, -1rem);
    --cc-shot-offset-top: 50%;
    min-height: clamp(62rem, calc(100svh - 15rem), 78rem);
    margin-bottom: 0;
    overflow: hidden;
    background-image: var(--cc-dark-gradient-bgnd);
}

.home .cde-collage-text.first > .container {
    display: flex;
    align-items: center;
    min-height: inherit;
}

.home .cde-collage-text.first .collage-wrap {
    display: grid;
    grid-template-columns: minmax(28rem, 0.85fr) minmax(0, 1.45fr);
    gap: clamp(2rem, 3vw, 6rem);
    align-items: center;
    width: 100%;
    min-height: inherit;
    position: relative;
}

.home .cde-collage-text.first .collage-text-wrap {
    margin-left: 3vw;
    grid-column: 1;
    position: relative;
    z-index: 2;
    margin-top: 14vw;
    margin-bottom: 5vw;
}

@media ( min-width: 100px ) {

    .home .cde-collage-text.first .collage-text-wrap {
        margin-left: 0
    }

}

.home .cde-collage-text.first .cde-gallery-fe-text h1 {
    margin-bottom: clamp(3rem, 4vw, 4.8rem);
    font-size: clamp(4.3rem, 4.4vw, 5rem);
    line-height: 1.2;
}

.home .cde-collage-text.first .cde-gallery-fe-text h1 em {
    color: var(--cc-deepsky);
    font-style: normal;
}

.home .cde-collage-text.first .cde-gallery-fe-text p {
    max-width: 37rem;
    margin-bottom: 1.5rem;
    font-size: clamp(1.55rem, 1.3vw, 1.8rem);
    line-height: 1.32;
}

.home .cde-collage-text.first .collage-wrap > ul {
    --cc-home-shot-width: clamp(28rem, 30vw, 40rem);
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(2, var(--cc-home-shot-width));
    grid-template-rows: clamp(32rem, 32vw, 65rem) clamp(45rem, 44vw, 80rem);
    gap: clamp(2.5rem, 3vw, 4rem);
    position: absolute;
    top: var(--cc-shot-offset-top);
    right: var(--cc-shot-offset-right);
    width: max-content;
    margin: 0;
    padding: 0;
    list-style: none;
    transform: translateY(-50%) var(--cc-shot-tilt);
    transform-origin: 100% 45%;
    transform-style: preserve-3d;
}

.home .cde-collage-text.first .collage-wrap > ul > li {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    background-color: var(--cc-zodiac);
    background-repeat: no-repeat;
    border-radius: 0.4rem;
    box-shadow: var(--cc-shot-shadow);
    opacity: 0;
    animation: cc-shot-drop-in 5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    will-change: opacity, transform;
}

.home .cde-collage-text.first .collage-wrap > ul > li::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: inherit;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.home .cde-collage-text.first .collage-wrap > ul > li:nth-child(1) {
    z-index: 3;
    grid-column: 1;
    grid-row: 1;
    width: var(--cc-home-shot-width);
    height: 100%;
}

.home .cde-collage-text.first .collage-wrap > ul > li.wwwmainstreamhuborgdesktop1300scaledpng::before {
    background-image: url("/wp-content/uploads/2026/06/www-mainstream-hub-org-desktop-1300-scaled.png");
}

.home .cde-collage-text.first .collage-wrap > ul > li:nth-child(2) {
    z-index: 2;
    grid-column: 2;
    grid-row: 1 / span 2;
    width: var(--cc-home-shot-width);
    height: 100%;
    animation-delay: 350ms;
    margin-top: clamp(-20rem, -20vw, -40rem);
}

.home .cde-collage-text.first .collage-wrap > ul > li:nth-child(3) {
    z-index: 1;
    grid-column: 1;
    grid-row: 2;
    width: var(--cc-home-shot-width);
    height: 100%;
    animation-delay: 700ms;
}

@keyframes cc-shot-drop-in {
    from {
        opacity: 0;
        transform: translateY(0);
    }
    to {
        opacity: 1;
        transform: translateY(-3rem);
    }
}

@media ( max-width: 900px ) {

    .home .cde-collage-text.first {
        --cc-shot-tilt: translate(2vw, 4rem) rotateX(58deg) rotateZ(-45deg);
        min-height: auto;
        padding-top: clamp(5rem, 10vw, 8rem);
        padding-bottom: clamp(7rem, 14vw, 11rem);
    }

    .home .cde-collage-text.first > .container {
        min-height: 0;
    }

    .home .cde-collage-text.first .collage-wrap {
        grid-template-columns: 1fr;
        gap: clamp(3rem, 7vw, 5rem);
        min-height: 0;
    }

    .home .cde-collage-text.first .cde-gallery-fe-text {
        max-width: 48rem;
    }

    .home .cde-collage-text.first .collage-text-wrap,
    .home .cde-collage-text.first .collage-wrap > ul {
        grid-column: 1;
    }

    .home .cde-collage-text.first .collage-wrap > ul {
        --cc-home-shot-width: min(38vw, 19rem);
        grid-template-rows: clamp(10rem, 28vw, 15rem) clamp(13rem, 36vw, 20rem);
        gap: clamp(1.6rem, 5vw, 2.8rem);
        position: relative;
        top: auto;
        right: auto;
        margin-inline: auto;
        transform: var(--cc-shot-tilt);
        transform-origin: 50% 45%;
    }

    .home .cde-collage-text.first .collage-wrap > ul > li:nth-child(1) {
        width: var(--cc-home-shot-width);
        height: 100%;
    }

    .home .cde-collage-text.first .collage-wrap > ul > li:nth-child(2) {
        width: var(--cc-home-shot-width);
        height: 100%;
    }

    .home .cde-collage-text.first .collage-wrap > ul > li:nth-child(3) {
        width: var(--cc-home-shot-width);
        height: 100%;
    }

}

@media ( max-width: 520px ) {

    .home .cde-collage-text.first .cde-gallery-fe-text h1 {
        font-size: clamp(3.8rem, 12vw, 4.8rem);
    }

    .home .cde-collage-text.first .cde-gallery-fe-text p {
        font-size: 1.55rem;
    }

    .home .cde-collage-text.first .collage-wrap > ul {
        --cc-home-shot-width: min(39vw, 16rem);
        grid-template-rows: clamp(9rem, 28vw, 12rem) clamp(12rem, 35vw, 16rem);
    }

}

@media ( prefers-reduced-motion: reduce ) {

    .home .cde-collage-text.first .collage-wrap > ul > li {
        opacity: 1;
        animation: none;
    }

}

/* Homepage help tabs */

.home #how-help {
    display: grid;
    grid-template-columns: minmax(22rem, 0.92fr) repeat(3, minmax(17rem, 1fr));
    column-gap: clamp(2.4rem, 3vw, 3.6rem);
    row-gap: 3rem;
    align-items: center;
    margin-top: clamp(3.5rem, 5vw, 5.8rem);
}

.home #how-help .before {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    margin: 0;
}

.home #how-help .before h3 {
    margin: 0;
    color: var(--cc-abbey);    
    font-size: clamp(2.4rem, 2.1vw, 2.8rem);
    font-weight: 500;
    line-height: 1.2;
}

.home #how-help .tabs {
    display: contents;
    margin: 0;
    max-width: none;
    background: transparent;
    box-shadow: none;
}

.home #how-help .label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 6.8rem;
    margin: 0;
    padding: 1.5rem 2rem;
    border-radius: 0.8rem;
    background: var(--cc-abbey);
    color: #fff;
    font-size: clamp(1.7rem, 1.45vw, 1.9rem);
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
}

.home #how-help .label.cc-tabs-tada {
    animation: tada 2s both;
    transform-origin: center;
}

.home #how-help .label:hover,
.home #how-help .label:active {
    background: #424242;
    color: #fff;
}

.home #how-help .input:focus + .label {
    box-shadow: 0 0 0 0.3rem rgb(0 174 239 / 24%);
    z-index: 1;
}

.home #how-help .input:checked + .label {
    background: var(--cc-deepsky);
    color: #fff;
}

.home #how-help .input:checked + .label:hover {
    background: var(--cc-deepsky);
}

.home #how-help label[for="tab-1"] {
    grid-column: 2;
    grid-row: 1;
}

.home #how-help label[for="tab-2"] {
    grid-column: 3;
    grid-row: 1;
}

.home #how-help label[for="tab-3"] {
    grid-column: 4;
    grid-row: 1;
}

.home #how-help .panel {
    grid-column: 1 / -1;
    grid-row: 2;
    order: 0;
    width: 100%;
    min-height: clamp(38rem, 36vw, 48.2rem);
    margin: 0;
    padding: clamp(4.8rem, 6vw, 7.4rem) clamp(3.5rem, 7vw, 8.2rem) clamp(4.8rem, 6vw, 7.4rem) clamp(4.5rem, 8vw, 10.2rem);
    border-radius: 0.8rem;
    background: var(--cc-whitesmoke);
    box-shadow: none;
    color: #000;
    box-sizing: border-box;
}

.home #how-help .input:checked + .label + .panel {
    display: grid;
    grid-template-columns: minmax(28rem, 0.78fr) minmax(34rem, 1fr);
    column-gap: clamp(4rem, 7vw, 8rem);
    align-items: center;
}

.home #how-help .panel_right {
    order: 1;
    max-width: 43rem;
}

.home #how-help .panel_left {
    order: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home #how-help .panel_left img {
    display: block;
    width: min(100%, 56.1rem);
    height: auto;
}

.home #how-help .panel h2 {
    margin: 0 0 3.2rem;
    color: #000;
    font-size: clamp(3rem, 3vw, 3.7rem);
    line-height: 1.15;
}

.home #how-help .panel h2 em {
    color: var(--cc-deepsky);
    font-style: normal;
}

.home #how-help .panel p {
    max-width: 39rem;
    margin: 0 0 1rem;
    color: #000;
    font-size: clamp(1.7rem, 1.35vw, 1.9rem);
    line-height: 1.38;
}

.home #how-help .panel p:last-child {
    margin-top: clamp(3rem, 4vw, 5.4rem);
    margin-bottom: 0;
}

.home #how-help .panel .button {
    align-items: center;
    white-space: nowrap;
}

.home #how-help .panel .button i {
    margin-left: 0.8rem;
    color: #000;
    font-size: 2rem;
}

@media ( max-width: 880px ) {

    .home #how-help {
        display: block;
        margin-top: 3rem;
    }

    .home #how-help .before {
        margin-bottom: 2.4rem;
    }

    .home #how-help .tabs {
        display: grid;
        grid-template-columns: repeat(3, max-content);
        grid-template-rows: auto auto;
        column-gap: 1.2rem;
        row-gap: 2.4rem;
        max-width: none;
        margin-right: calc(50% - 50vw);
        overflow-x: auto;
        overflow-y: visible;
        padding-bottom: 0.6rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .home #how-help .label {
        grid-row: 1;
        width: auto;
        min-width: max-content;
        min-height: 5.8rem;
        padding: 1.4rem 2.4rem;
        white-space: nowrap;
    }

    .home #how-help label[for="tab-1"] {
        grid-column: 1;
        grid-row: 1;
    }

    .home #how-help label[for="tab-2"] {
        grid-column: 2;
        grid-row: 1;
    }

    .home #how-help label[for="tab-3"] {
        grid-column: 3;
        grid-row: 1;
    }

    .home #how-help .panel {
        grid-column: 1 / -1;
        grid-row: 2;
        position: sticky;
        left: 0;
        width: 94vw;
        min-width: 94vw;
        max-width: 94vw;
        min-height: 0;
        margin-top: 0;
        padding: clamp(3.2rem, 8vw, 4.8rem);
    }

    .home #how-help .input:checked + .label + .panel {
        grid-template-columns: 1fr;
        row-gap: 3rem;
    }

    .home #how-help .panel_right {
        max-width: none;
    }

    .home #how-help .panel_left {
        justify-content: flex-start;
    }

}

@media ( prefers-reduced-motion: reduce ) {

    .home #how-help .label.cc-tabs-tada {
        animation: none;
    }

}

/* Collapsible */

.cde-toggle-label {
    padding: 2.5rem;
    padding-right: 8rem;
    border: 0.1rem solid #ddd;
    background-color: var(--cc-whitesmoke);
    border-radius: 0.5rem;    
    display: block;
}

.cde-toggle-label:hover {
    border-color: var(--cc-deepsky);
}

.canvas input.cde-toggle:checked + .cde-toggle-label:before {
    content: "\f078";    
    top: 50%;    
    transform: translate(-50%, -50%)  rotate(180deg);
    right: 0.5rem;
}

.canvas .cde-toggle-label:before {
    content: "\f078";
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-family: "Font Awesome 7 Pro";
    color: var(--cc-sunglo);
    position: absolute;
    right: 3rem;
    font-weight: 700;
    transition-duration: 0.3s;
    background-color: transparent;
    font-size: 3rem;
    line-height: 1.4;
    width: 3rem;
    height: 3rem;
    position: absolute;
    top: 50%;    
    transform: translate(-50%, -50%);
    right: 0.5rem;
}

@media ( max-width: 600px ) {

    .canvas .cde-toggle-label {
        font-size: 1.7rem;
        line-height: 1.4;
        padding: 2rem;
        padding-right: 8rem;
    }    

}

.canvas .flex-elm .cde-panel {
    padding: 4rem;
    background-color: var(--exa-light-leaf);    
    box-sizing: border-box;
    border-radius: 0.5rem;
}

.cde-collapsible .before {
    margin-bottom: 3.5rem;
}

/* End of collapsible */


/* image draw in animation */

.img-draw-in .left.img {
    clip-path: inset(0 100% 0 0);
    animation-fill-mode: forwards;
}

.img-draw-in .right.img {
    clip-path: inset(0 0 0 100%);
    animation-fill-mode: forwards;
}

@keyframes draw-in-from-right {
    0% {
        clip-path: inset(0 0 0 100%);
    }
    100% {
        clip-path: inset(0 0 0 0%);
    }
}

@keyframes draw-in-from-left {
    0% {
        clip-path: inset(0 100% 0 0);
    }
    100% {
        clip-path: inset(0 0% 0 0);
    }
}

[data-aos="draw-in-from-left"].aos-animate {
    -webkit-animation-name: draw-in-from-left;
    animation-name: draw-in-from-left;
    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

[data-aos="draw-in-from-right"].aos-animate {
    -webkit-animation-name: draw-in-from-right;
    animation-name: draw-in-from-right;
    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

/* End of image draw in animation */

@media ( max-width: 1285px) and (min-width: 720px ) {

    .cde-text-left-image-right.container-align-left .left {
        margin-left: 3vw;
    }

}

@media ( min-width: 1286px ) {

    .cde-text-left-image-right.container-align-left .left {
        margin-left: calc((100vw - 1200px) / 2);
        width: auto;
    } 

}

.canvas.under-header .canvas-header-stack {
    position: fixed;
    top: var(--canvas-sticky-header-top);
    left: 0;
    right: 0;
    width: 100%;
}

/* TA-DA animation */

@-webkit-keyframes tada {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    10%,
    20% {
      -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
      transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
  
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
      transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
  
    40%,
    60%,
    80% {
      -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
      transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  @keyframes tada {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    10%,
    20% {
      -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
      transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
  
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
      transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
  
    40%,
    60%,
    80% {
      -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
      transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  .animate__tada {
    -webkit-animation-name: tada;
    animation-name: tada;
  }

/* End of TADA animation */

h3.ucase {
    text-transform: uppercase;
    font-size: clamp(1.7rem, 2vw, 2rem);
}

.flex-elm.padded {
    padding: 4rem;
}

.flex-elm.has-bgcolor {
    border-radius: var(--cc-radius);
}

.cde-text-left-image-right.padded .left.cde-text-nopadding .inner,
.cde-image-left-text-right.padded .right.cde-text-nopadding .inner {
    padding-left: calc(clamp(4.8rem, 6vw, 7.4rem) - 2rem);
    padding-right: calc(clamp(4.8rem, 6vw, 7.4rem) - 2rem);
}

.cde-text-left-image-right .img,
.cde-image-left-text-right .img {
    border-radius: var(--cc-radius);
}

.img-blue-mutiply .img,
.img-pink-mutiply .img {
    position: relative;    
    z-index: 1;
    background-color: var(--cc-deepsky);
    background-blend-mode: multiply;
    overflow: hidden;
}   

.img-pink-mutiply .img {
    background-color: var(--cc-sunglo);
}

.widget .cde-richtext ul.icon-list {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
    margin-top: 2rem;
    margin-bottom: 3rem;
    gap: 0.5rem;
}

ul.icon-list li {
    padding: 0.5rem 0.8rem;    
    font-size: 1.4rem;      
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

ul.icon-list.blue-icon-list li i {
    border-color: rgba(0, 174, 239, 0.8);  
}

ul.icon-list li i {
    border: 0.1rem solid rgba( 255, 95, 113, 0.8);
    border-radius: 50%;
    width: 3.8rem;
    height: 3.8rem;
    margin-right: 0.7rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    opacity: 0.8;
    font-size: 1.6rem;
}

.canvas .canvas-mobile-panel .menu a:hover {
    color: #fff;
}

.mobile-menu li.button > a {
  flex-grow: 1;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.img-draw-in .left.img {
    clip-path: inset(0 100% 0 0);
    animation-fill-mode: forwards;
}

.img-draw-in .right.img {
    clip-path: inset(0 0 0 100%);
    animation-fill-mode: forwards;
}

@keyframes draw-in-from-right {
    0% {
        clip-path: inset(0 0 0 100%);
    }
    100% {
        clip-path: inset(0 0 0 0%);
    }
}

@keyframes draw-in-from-left {
    0% {
        clip-path: inset(0 100% 0 0);
    }
    100% {
        clip-path: inset(0 0% 0 0);
    }
}

[data-aos="draw-in-from-left"].aos-animate {
    -webkit-animation-name: draw-in-from-left;
    animation-name: draw-in-from-left;
    webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

[data-aos="draw-in-from-right"].aos-animate {
    -webkit-animation-name: draw-in-from-right;
    animation-name: draw-in-from-right;
    webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

.canvas .flex-elm .cde-richtext .inner_linklist ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
}

.canvas .flex-elm .cde-richtext .inner_linklist li {
    margin: 0;
}

.canvas .flex-elm .cde-richtext .inner_linklist a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 4.2rem;
    padding: 1.5rem 2.3rem;
    border: 0.1rem solid var(--canvas-color-button-back);
    border-radius: 9990px;
    background: var(--canvas-color-button-back);
    color: var(--canvas-color-button-fore);
    font-size: 1.4rem;
    font-weight: 650;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.canvas .flex-elm.img-pink-mutiply .cde-richtext .inner_linklist a {
    background: var(--cc-deepsky);
    border-color: var(--cc-deepsky);
}

.canvas .flex-elm .cde-richtext .inner_linklist a::before,
.canvas .flex-elm .cde-richtext .inner_linklist a::after {
    content: "\f061";
    order: 1;
    flex: 0 0 2rem;
    width: 2rem;
    height: 2rem;
    color: #000;
    font-family: "Font Awesome 7 Duotone", "Font Awesome 6 Pro";
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}

.canvas .flex-elm .cde-richtext .inner_linklist a::after {
    content: "\f061\f061";
    opacity: 0.3;
}

.canvas .flex-elm .cde-richtext .inner_linklist a::before {
    margin-left: 0.8rem;
}

.canvas .flex-elm .cde-richtext .inner_linklist a::after {
    margin-left: -2rem;
}

.canvas .flex-elm .cde-richtext .inner_linklist a:hover,
.canvas .flex-elm .cde-richtext .inner_linklist a:focus {
    border-color: var(--canvas-color-button-hover);
    background: var(--canvas-color-button-hover);
    color: var(--canvas-color-button-hover-fore);
}

.canvas .flex-elm .cde-richtext .inner_linklist a em {
    font-style: normal;
}

.footer-section.footer-section--bottom {
    padding-block: clamp(1rem, 2vw, 2rem)
}

.footer-section.footer-section--bottom p {
    margin-bottom: 0;
}

.cde-image-header,
.cde-image-header .wrapper,
.cde-image-header .wrapper .img,
.cde-wide-text.has-bgimage .wrapper:before {
    border-radius: var(--cc-radius);
}

.fixedwidth-inner .inner {
    max-width: 85rem;
}

.cde-wide-text.fixedwidth-inner .inner,
.cde-collapsible.fixedwidth-inner .inner {
    margin: 0 auto;
}

.canvas .cde-expandable .cde-panel {
    padding: 1rem;
}

footer h4 {
    margin-top: 0;
    font-weight: 600;
    font-size: 1.9rem;
    color: var(--cc-whitesmoke);
    opacity: 0.6;
}