/* =========================================================
   ASF - all custom CSS for advancedsoftwarefeatures.com
   On the site as the file wp-content/uploads/asf/asf-site.css, loaded by the
   Code Snippets snippet _build/asf-site-css-loader.php. Additional CSS stays empty.
   Built 2026-10-12 from the Snippets block folders by _build/build_additional_css.py - edit the
   blocks, not this file.
   Blocks: Own CSS: contact form, hidden product meta, Site background, Header menu, Page title band, Preloader and small loaders, Floating buttons: back to top, Chaty, Footer partners, Footer social links, Footer disclaimer, Account login, Account area, Shop: product, cart, checkout, GamiPress pages, Testimonials, Fixes for the site's own HTML pages.
========================================================= */


/* #########################################################
   OWN CSS: CONTACT FORM, HIDDEN PRODUCT META   (Own CSS/own.css)
   ######################################################### */

/* =========================================================
   ASF CONTACT FORM
   ========================================================= */

.asf-contact-form {
    position: relative;
    isolation: isolate;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 58px;

    box-sizing: border-box;
    overflow: hidden;

    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
        radial-gradient(circle at 88% 8%, rgba(220,57,0,0.14) 0%, rgba(220,57,0,0.1328) 2.6%, rgba(220,57,0,0.1212) 5.1%, rgba(220,57,0,0.1082) 8%, rgba(220,57,0,0.0938) 11.2%, rgba(220,57,0,0.0794) 14.4%, rgba(220,57,0,0.0649) 17.6%, rgba(220,57,0,0.0505) 20.8%, rgba(220,57,0,0.0334) 24%, rgba(220,57,0,0.0108) 27.2%, rgba(220,57,0,0.0014) 29.8%, rgba(220,57,0,0) 32%),
        radial-gradient(circle at 5% 92%, rgba(220,57,0,0.07) 0%, rgba(220,57,0,0.0664) 2.4%, rgba(220,57,0,0.0606) 4.8%, rgba(220,57,0,0.0541) 7.5%, rgba(220,57,0,0.0469) 10.5%, rgba(220,57,0,0.0397) 13.5%, rgba(220,57,0,0.0325) 16.5%, rgba(220,57,0,0.0253) 19.5%, rgba(220,57,0,0.0167) 22.5%, rgba(220,57,0,0.0054) 25.5%, rgba(220,57,0,0.0007) 27.9%, rgba(220,57,0,0) 30%),
        linear-gradient(135deg, #0e0e0e 0%, #181818 55%, #0e0e0e 100%);

    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 24px;

    box-shadow:
        0 28px 70px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.045);

    color: #eeeeee;

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}


/* Soft ambient glow */

.asf-contact-form::before {
    content: "";

    position: absolute;
    width: 690px;
    height: 690px;

    top: -395px;
    right: -295px;

    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
        radial-gradient(closest-side, rgba(220,57,0,0.12) 0%, rgba(220,57,0,0.1129) 8%, rgba(220,57,0,0.1016) 16%, rgba(220,57,0,0.0885) 25%, rgba(220,57,0,0.073) 35%, rgba(220,57,0,0.0579) 45%, rgba(220,57,0,0.0435) 55%, rgba(220,57,0,0.0303) 65%, rgba(220,57,0,0.0176) 75%, rgba(220,57,0,0.0048) 85%, rgba(220,57,0,0.0006) 93%, rgba(220,57,0,0) 100%);

    -webkit-mask-image: radial-gradient(closest-side, #000 55%, transparent 100%);
    mask-image: radial-gradient(closest-side, #000 55%, transparent 100%);

    opacity: 0.7;

    pointer-events: none;
    z-index: -1;
}


/* Second subtle glow */

.asf-contact-form::after {
    content: "";

    position: absolute;
    width: 556px;
    height: 556px;

    bottom: -348px;
    left: -248px;

    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
        radial-gradient(closest-side, rgba(220,57,0,0.06) 0%, rgba(220,57,0,0.0565) 8%, rgba(220,57,0,0.0508) 16%, rgba(220,57,0,0.0442) 25%, rgba(220,57,0,0.0365) 35%, rgba(220,57,0,0.0289) 45%, rgba(220,57,0,0.0218) 55%, rgba(220,57,0,0.0152) 65%, rgba(220,57,0,0.0088) 75%, rgba(220,57,0,0.0024) 85%, rgba(220,57,0,0.0003) 93%, rgba(220,57,0,0) 100%);

    -webkit-mask-image: radial-gradient(closest-side, #000 55%, transparent 100%);
    mask-image: radial-gradient(closest-side, #000 55%, transparent 100%);

    pointer-events: none;
    z-index: -1;
}


/* =========================================================
   FIELDS
   ========================================================= */

.asf-contact-field {
    position: relative;
    margin-bottom: 27px;
}

.asf-contact-field label {
    display: block;

    margin-bottom: 10px;

    color: #eeeeee;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}


/* =========================================================
   INPUTS
   ========================================================= */

.asf-contact-field input[type="text"],
.asf-contact-field input[type="email"],
.asf-contact-field textarea {

    display: block;

    width: 100%;
    box-sizing: border-box;

    padding: 16px 17px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.055),
            rgba(255, 255, 255, 0.025)
        );

    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 12px;

    outline: none;

    color: #eeeeee;

    font-family: inherit;
    font-size: 15px;
    line-height: 1.5;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.025);

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}


/* Textarea */

.asf-contact-field textarea {
    min-height: 190px;
    resize: vertical;
}


/* Placeholder */

.asf-contact-field input::placeholder,
.asf-contact-field textarea::placeholder {
    color: rgba(255, 255, 255, 0.34);
}


/* Hover */

.asf-contact-field input:hover,
.asf-contact-field textarea:hover {

    border-color: rgba(255, 255, 255, 0.20);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.065),
            rgba(255, 255, 255, 0.03)
        );
}


/* Focus */

.asf-contact-field input:focus,
.asf-contact-field textarea:focus {

    border-color: rgba(220, 57, 0, 0.68);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.065),
            rgba(220, 57, 0, 0.025)
        );

    box-shadow:
        0 0 0 3px rgba(220, 57, 0, 0.09),
        0 8px 25px rgba(0, 0, 0, 0.12);
}


/* =========================================================
   SUBMIT
   ========================================================= */

.asf-contact-submit {
    margin-top: 38px;
}

.asf-contact-submit input[type="submit"] {

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 205px;

    padding: 16px 28px;

    border: 1px solid rgba(255, 90, 37, 0.65);
    border-radius: 12px;

    background:
        linear-gradient(
            105deg,
            #dc3900 0%,
            #dc3900 52%,
            #b92f00 100%
        );

    color: #fff;

    font-family: inherit;
    font-size: 15px;
    font-weight: 700;

    cursor: pointer;

    box-shadow:
        0 10px 28px rgba(220, 57, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        filter 0.25s ease;
}


.asf-contact-submit input[type="submit"]:hover {

    transform: translateY(-2px);

    filter: brightness(1.08);

    box-shadow:
        0 15px 34px rgba(220, 57, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}


.asf-contact-submit input[type="submit"]:active {
    transform: translateY(0);
}


/* =========================================================
   CF7 VALIDATION
   ========================================================= */

.asf-contact-form .wpcf7-not-valid {
    border-color: rgba(220, 57, 0, 0.85) !important;
}

.asf-contact-form .wpcf7-not-valid-tip {
    margin-top: 7px;

    color: #ff5a25;

    font-size: 13px;
}


.asf-contact-form .wpcf7-response-output {

    margin: 25px 0 0 !important;
    padding: 14px 17px !important;

    border: 1px solid rgba(220, 57, 0, 0.42) !important;
    border-radius: 11px;

    background: rgba(220, 57, 0, 0.065);

    color: #eeeeee;

    font-size: 14px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .asf-contact-form {

        padding: 32px 22px;

        border-radius: 18px;

        background:
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
            radial-gradient(circle at 90% 5%, rgba(220,57,0,0.12) 0%, rgba(220,57,0,0.1138) 3%, rgba(220,57,0,0.1039) 6.1%, rgba(220,57,0,0.0928) 9.5%, rgba(220,57,0,0.0804) 13.3%, rgba(220,57,0,0.068) 17.1%, rgba(220,57,0,0.0557) 20.9%, rgba(220,57,0,0.0433) 24.7%, rgba(220,57,0,0.0286) 28.5%, rgba(220,57,0,0.0093) 32.3%, rgba(220,57,0,0.0012) 35.3%, rgba(220,57,0,0) 38%),
            linear-gradient(135deg, #0e0e0e 0%, #181818 55%, #0e0e0e 100%);
    }

    .asf-contact-form::before {
        width: 526px;
        height: 526px;

        top: -293px;
        right: -243px;
    }

    .asf-contact-form::after {
        width: 440px;
        height: 440px;

        bottom: -265px;
        left: -205px;
    }

    .asf-contact-field {
        margin-bottom: 22px;
    }

    .asf-contact-field input[type="text"],
    .asf-contact-field input[type="email"],
    .asf-contact-field textarea {

        padding: 14px 15px;

        border-radius: 11px;
    }

    .asf-contact-field textarea {
        min-height: 160px;
    }

    .asf-contact-submit {
        margin-top: 28px;
    }

    .asf-contact-submit input[type="submit"] {
        width: 100%;
    }
}

.single-product .product_meta {
    display: none !important;
}


/* #########################################################
   SITE BACKGROUND   (Site background/site-background.css)
   ######################################################### */

/* =========================================================
   ASF site background - contrast + warm light (variant Q of preview.html, chosen 2026-10-12)
   No pattern. The theme's picture (Customize -> Background Image) is switched off here.
   A slightly deeper warm base #efedea, so the white rounded cards stand off it; soft light from the
   top, an orange glow in the top right corner and a peach one in the bottom left (eased 12-stop
   gradients - no bands), and the site's fine grain. Fixed: the page scrolls over it.
   Generated by _make_live.py from _make_preview.py (soft) - change it there, not by hand.
========================================================= */

body.custom-background {
  background-image: none !important;
  background-color: #efedea !important;
}

body.custom-background::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 45% 50% at 92% 4%, rgba(220,57,0,0.1) 0%, rgba(220,57,0,0.094) 8%, rgba(220,57,0,0.085) 16%, rgba(220,57,0,0.074) 25%, rgba(220,57,0,0.061) 35%, rgba(220,57,0,0.048) 45%, rgba(220,57,0,0.036) 55%, rgba(220,57,0,0.025) 65%, rgba(220,57,0,0.015) 75%, rgba(220,57,0,0.004) 85%, rgba(220,57,0,0.0005) 93%, rgba(220,57,0,0.0) 100%),
    radial-gradient(ellipse 45% 50% at 4% 96%, rgba(255,176,130,0.3) 0%, rgba(255,176,130,0.282) 8%, rgba(255,176,130,0.255) 16%, rgba(255,176,130,0.222) 25%, rgba(255,176,130,0.183) 35%, rgba(255,176,130,0.144) 45%, rgba(255,176,130,0.108) 55%, rgba(255,176,130,0.075) 65%, rgba(255,176,130,0.045) 75%, rgba(255,176,130,0.012) 85%, rgba(255,176,130,0.0015) 93%, rgba(255,176,130,0.0) 100%),
    radial-gradient(ellipse 60% 45% at 50% 0%, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.517) 8%, rgba(255,255,255,0.4675) 16%, rgba(255,255,255,0.407) 25%, rgba(255,255,255,0.3355) 35%, rgba(255,255,255,0.264) 45%, rgba(255,255,255,0.198) 55%, rgba(255,255,255,0.1375) 65%, rgba(255,255,255,0.0825) 75%, rgba(255,255,255,0.022) 85%, rgba(255,255,255,0.0028) 93%, rgba(255,255,255,0.0) 100%),
    #efedea;
  background-size: 160px 160px, 100% 100%, 100% 100%, 100% 100%;
}


/* #########################################################
   HEADER MENU   (Header menu/header-menu.css)
   ######################################################### */

/* =========================================================
   ASF header menu (theme Sinatra + Menu Icons)
   Paste into: Appearance -> Customize -> Additional CSS
   Palette: #dc3900 / #ff5a25 / #0e0e0e -> #181818, text #eeeeee / #cccccc
========================================================= */

/* ---------- bar: dark gradient, sticky, glass ---------- */
/* The theme puts the page title band inside #masthead too; only the menu bar may stick.
   display:contents lifts the bar out of #masthead's box, so it sticks along the whole page. */
#masthead { display: contents; }
#sinatra-header {
  position: sticky;
  top: 0;
  z-index: 999;
}
.admin-bar #sinatra-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar #sinatra-header { top: 46px; } }
@media screen and (max-width: 600px) { .admin-bar #sinatra-header { top: 0; } }

#sinatra-header-inner {
  position: relative;
  background: linear-gradient(180deg, rgba(24,24,24,0.94) 0%, rgba(14,14,14,0.94) 100%) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 0 !important;
}

/* thin orange line along the bottom edge, fading to the sides */
#sinatra-header-inner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(220,57,0,0.15) 15%, rgba(220,57,0,0.85) 50%, rgba(220,57,0,0.15) 85%, transparent 100%);
  pointer-events: none;
}

/* logo */
#sinatra-header .sinatra-logo a { transition: opacity .2s ease; }
#sinatra-header .sinatra-logo a:hover { opacity: .8; }

/* ---------- desktop menu ---------- */
@media screen and (min-width: 961px) {

  /* text items: light grey, white on hover, orange underline that grows from the left */
  #sinatra-header-inner #sinatra-primary-nav > li > a {
    color: #cccccc !important;
    transition: color .2s ease;
  }
  #sinatra-header-inner #sinatra-primary-nav > li > a:hover,
  #sinatra-header-inner #sinatra-primary-nav > li.current-menu-item > a,
  #sinatra-header-inner #sinatra-primary-nav > li.current-menu-ancestor > a,
  #sinatra-header-inner #sinatra-primary-nav > li.menu-item-has-children:hover > a {
    color: #ffffff !important;
  }
  #sinatra-header-inner #sinatra-primary-nav > li > a > span { position: relative; }
  #sinatra-header-inner #sinatra-primary-nav > li > a > span::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -7px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, #dc3900, #ff5a25);
    box-shadow: 0 0 10px rgba(220,57,0,0.6);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .28s cubic-bezier(.25,.8,.25,1);
  }
  #sinatra-header-inner #sinatra-primary-nav > li > a:hover > span::after,
  #sinatra-header-inner #sinatra-primary-nav > li.current-menu-item > a > span::after,
  #sinatra-header-inner #sinatra-primary-nav > li.current-menu-ancestor > a > span::after {
    transform: scaleX(1);
  }

  /* icon items (Contact, My account, Testimonials, Docs): no underline, orange glow, label as a tooltip */
  #sinatra-header-inner #sinatra-primary-nav > li > a > span:has(._mi)::after { display: none; }
  #sinatra-header-inner #sinatra-primary-nav ._mi {
    transition: color .2s ease, filter .2s ease, transform .2s ease;
  }
  #sinatra-header-inner #sinatra-primary-nav > li > a:hover ._mi,
  #sinatra-header-inner #sinatra-primary-nav > li.current-menu-item ._mi {
    color: #ff5a25;
    filter: drop-shadow(0 0 6px rgba(220,57,0,0.7));
    transform: translateY(-1px);
  }

  /* a thin divider between the text items and the icons */
  #sinatra-header-inner #sinatra-primary-nav > li:has(._mi):not(li:has(._mi) + li) {
    margin-left: 14px;
    padding-left: 14px;
    border-left: 1px solid rgba(255,255,255,0.12);
  }

  #sinatra-header-inner #sinatra-primary-nav > li > a > span:has(._mi) { position: relative; }
  #sinatra-header-inner #sinatra-primary-nav .visuallyhidden {
    position: absolute !important;
    top: calc(100% + 14px);
    left: 50%;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 5px 10px !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: .02em;
    color: #eeeeee;
    background: linear-gradient(135deg, #0e0e0e 0%, #181818 100%);
    border: 1px solid rgba(220,57,0,0.35);
    border-radius: 7px;
    box-shadow: 0 10px 24px rgba(0,0,0,0.35);
    opacity: 0;
    transform: translate(-50%, -4px);
    transition: opacity .18s ease, transform .18s ease;
    pointer-events: none;
    z-index: 1000;
  }
  #sinatra-header-inner #sinatra-primary-nav > li > a:hover .visuallyhidden,
  #sinatra-header-inner #sinatra-primary-nav > li > a:focus-visible .visuallyhidden {
    opacity: 1;
    transform: translate(-50%, 0);
  }

  /* logged in: a small glowing dot on the account icon */
  .logged-in #sinatra-header-inner #sinatra-primary-nav a[href*="/my-account/"] > span {
    position: relative;
  }
  .logged-in #sinatra-header-inner #sinatra-primary-nav a[href*="/my-account/"] > span::before {
    content: "";
    position: absolute;
    top: -2px;
    right: -5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #dc3900;
    box-shadow: 0 0 8px rgba(220,57,0,0.8);
  }

  /* dropdowns (when the menu gets sub-items): dark cards */
  #sinatra-header-inner .sinatra-nav > ul .sub-menu {
    background: linear-gradient(135deg, #0e0e0e 0%, #181818 100%) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 12px;
    padding: 8px !important;
    box-shadow: 0 18px 40px rgba(0,0,0,0.4), 0 0 0 1px rgba(220,57,0,0.12);
  }
  #sinatra-header-inner .sinatra-nav > ul .sub-menu::after { display: none !important; }
  #sinatra-header-inner .sinatra-nav > ul .sub-menu a {
    color: #cccccc !important;
    border-radius: 8px;
    transition: color .2s ease, background .2s ease;
  }
  #sinatra-header-inner .sinatra-nav > ul .sub-menu a:hover {
    color: #ffffff !important;
    background: rgba(220,57,0,0.14);
  }
}

/* ---------- search and cart icons ---------- */
#sinatra-header .si-header-widgets a:not(.si-btn) {
  color: #cccccc;
  transition: color .2s ease, filter .2s ease;
}
#sinatra-header .si-header-widgets a:not(.si-btn):hover,
#sinatra-header-inner .si-header-widgets .sinatra-active {
  color: #ff5a25 !important;
  filter: drop-shadow(0 0 6px rgba(220,57,0,0.6));
}

/* cart count bubble: the theme rings it with a 2 px border in the header colour (#000); no ring, a soft glow */
#sinatra-header .si-header-widget__cart .si-cart .si-cart-count {
  border: 0 !important;
  background: #dc3900 !important;
  color: #ffffff !important;
  box-shadow: 0 0 8px rgba(220,57,0,0.6);
}

/* ---------- mini cart (the dropdown under the cart icon) ----------
   The theme's white box with a grey top border -> a dark card like the menu dropdowns. */
#sinatra-header .si-header-widget__cart .dropdown-item {
  overflow: hidden;
  width: 340px;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 14px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #0e0e0e 0%, #181818 100%) !important;
  background-size: 160px 160px, 100% 100% !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.45), 0 0 0 1px rgba(220,57,0,0.10);
  color: #cccccc !important;
}
/* the theme's little arrow on top: not needed on a rounded card */
#sinatra-header .si-header-widget__cart .dropdown-item::after { display: none !important; }
/* thin orange line along the top, as under the bar */
#sinatra-header .si-header-widget__cart .dropdown-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(220,57,0,0.8), transparent);
}

/* header line: "1 item" and the subtotal */
#sinatra-header .si-header-widget__cart .wc-cart-widget-header {
  padding: 16px 20px 12px !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  color: #888888 !important;
  font-size: 12px;
}
#sinatra-header .si-header-widget__cart .wc-cart-widget-header .si-cart-count {
  position: static !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #888888 !important;
  font-size: 12px !important;
  letter-spacing: .04em;
}
#sinatra-header .si-header-widget__cart .wc-cart-widget-header .si-cart-subtotal { color: #aaaaaa !important; }
#sinatra-header .si-header-widget__cart .wc-cart-widget-header .si-cart-subtotal span { color: #ffffff !important; }

/* items */
#sinatra-header .si-cart-item {
  padding: 12px 44px 12px 20px !important;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  transition: background .2s ease;
}
#sinatra-header .si-cart-item:last-child { border-bottom: 0; }
#sinatra-header .si-cart-item:hover { background: rgba(255,255,255,0.04) !important; }
#sinatra-header .si-cart-item .si-cart-image img {
  width: 56px !important;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 6px 14px rgba(0,0,0,0.35);
}
#sinatra-header .si-cart-item-title,
#sinatra-header .si-cart-item-title a {
  color: #eeeeee !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
#sinatra-header .si-cart-item-title a:hover { color: #ff5a25 !important; }
#sinatra-header .si-cart-item-title a::before { display: none !important; }
#sinatra-header .si-cart-item-meta,
#sinatra-header .si-cart-item-quantity { color: #aaaaaa !important; font-size: 13px; }
#sinatra-header .si-cart-item-meta .amount { color: #ff5a25 !important; font-weight: 600; }
#sinatra-header .si-cart-item-meta del,
#sinatra-header .si-cart-item-meta del .amount { color: #777777 !important; font-weight: 400; }
#sinatra-header .si-cart-item .si-remove-cart-item { color: #888888 !important; top: 50% !important; margin-top: -8px; }
#sinatra-header .si-cart-item .si-remove-cart-item:hover { color: #ff5a25 !important; }

/* buttons: View Cart (outline) and Checkout (the site's orange-to-black button) */
#sinatra-header .si-cart-buttons {
  gap: 10px;
  padding: 14px 20px 18px !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
}
#sinatra-header .si-cart-buttons > a { margin: 0 !important; }
#sinatra-header .si-cart-buttons > a.si-btn {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
#sinatra-header .si-cart-buttons > a.si-btn.btn-text-1 {
  border: 0 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18) !important;
  background: transparent !important;
  color: #eeeeee !important;
}
#sinatra-header .si-cart-buttons > a.si-btn.btn-text-1:hover {
  box-shadow: inset 0 0 0 1px #ff5a25 !important;
  color: #ff5a25 !important;
}
#sinatra-header .si-cart-buttons > a.si-btn.btn-text-1 > span { padding: 0 !important; }
#sinatra-header .si-cart-buttons > a.si-btn.btn-text-1 > span::before,
#sinatra-header .si-cart-buttons > a.si-btn.btn-text-1 > span::after { display: none !important; }
#sinatra-header .si-cart-buttons > a.si-btn:not(.btn-text-1) {
  border: 0 !important;
  background: linear-gradient(110deg, #dc3900 0%, #b92f00 45%, #171717 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.35) !important;
}
#sinatra-header .si-cart-buttons > a.si-btn:not(.btn-text-1)::before {
  content: "";
  position: absolute;
  top: -20%;
  left: -100%;
  width: 70%;
  height: 140%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.24), transparent);
  transform: skewX(-20deg);
  transition: left .4s ease;
  pointer-events: none;
}
#sinatra-header .si-cart-buttons > a.si-btn:not(.btn-text-1):hover { transform: translateY(-1px); filter: brightness(1.05); }
#sinatra-header .si-cart-buttons > a.si-btn:not(.btn-text-1):hover::before { left: 140%; }

/* empty cart */
#sinatra-header .si-header-widget__cart .si-empty-cart {
  margin: 0 !important;
  padding: 22px 20px !important;
  text-align: center;
  color: #aaaaaa !important;
  font-size: 13px;
}

@media screen and (max-width: 480px) {
  #sinatra-header .si-header-widget__cart .dropdown-item { width: calc(100vw - 24px); }
}

/* ---------- search (the dropdown under the magnifier) ----------
   The theme's white box with a grey top border -> the same dark card as the mini cart. */
#sinatra-header .si-header-widgets .si-search-simple {
  overflow: hidden;
  width: 340px;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 14px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #0e0e0e 0%, #181818 100%) !important;
  background-size: 160px 160px, 100% 100% !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.45), 0 0 0 1px rgba(220,57,0,0.10);
}
#sinatra-header .si-header-widgets .si-search-simple::after { display: none !important; }
#sinatra-header .si-header-widgets .si-search-simple::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(220,57,0,0.8), transparent);
  z-index: 1;
}
#sinatra-header .si-header-widgets .si-search-simple .si-search-form { position: relative; margin: 0; }
#sinatra-header .si-header-widgets .si-search-simple .si-search-form input {
  height: 54px;
  padding: 0 52px 0 20px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  color: #eeeeee !important;
  font-size: 15px !important;
  caret-color: #ff5a25;
}
#sinatra-header .si-header-widgets .si-search-simple .si-search-form input::placeholder { color: #888888; opacity: 1; }
#sinatra-header .si-header-widgets .si-search-simple .si-search-form input:focus {
  background: rgba(220,57,0,0.05) !important;
}
/* the submit arrow: orange, slides in on hover as in the theme */
#sinatra-header .si-header-widgets .si-search-simple .si-search-form button {
  right: 14px !important;
  color: #ff5a25 !important;
}
#sinatra-header .si-header-widgets .si-search-simple .si-search-form button svg,
#sinatra-header .si-header-widgets .si-search-simple .si-search-form button svg path {
  fill: currentColor !important;
  stroke: currentColor;
}
#sinatra-header .si-header-widgets .si-search-simple .si-search-form button:hover { color: #ffffff !important; }

@media screen and (max-width: 480px) {
  #sinatra-header .si-header-widgets .si-search-simple { width: calc(100vw - 24px); }
}

/* ---------- mobile menu (960 px and narrower) ----------
   The theme opens a white panel with grey lines under the dark bar, and the icon items show only an icon.
   Here: a dark panel in the bar's style, icon items with their names, orange marks. */
@media screen and (max-width: 960px) {

  /* hamburger: light lines, orange when hovered or open */
  #sinatra-header .si-hamburger { color: #eeeeee !important; transition: color .2s ease; }
  #sinatra-header .si-hamburger:hover,
  .is-mobile-menu-active #sinatra-header .si-hamburger { color: #ff5a25 !important; }

  /* the panel */
  #sinatra-header-inner .site-navigation {
    margin-top: 0 !important;
    border-top: 0 !important;
    max-height: calc(100vh - 70px);
    overflow-y: auto;
    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
      linear-gradient(180deg, #141414 0%, #0e0e0e 100%) !important;
    background-size: 160px 160px, 100% 100% !important;
    box-shadow: 0 24px 40px -12px rgba(0,0,0,0.55) !important;
    color: #cccccc !important;
    border-radius: 0 0 16px 16px;
  }
  /* thin orange line between the bar and the panel */
  #sinatra-header-inner .site-navigation::before {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(220,57,0,0.15) 15%, rgba(220,57,0,0.85) 50%, rgba(220,57,0,0.15) 85%, transparent 100%);
  }
  #sinatra-header-inner .site-navigation > ul { padding: 8px 0 14px !important; }

  /* items */
  #sinatra-header-inner .site-navigation > ul a {
    position: relative;
    color: #cccccc !important;
    background: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    transition: color .2s ease, background .2s ease;
  }
  #sinatra-header-inner .site-navigation > ul li:last-child > a { border-bottom: 0 !important; }
  #sinatra-header-inner .site-navigation > ul a > span {
    padding: 14px 26px !important;
    font-size: 15px;
    font-weight: 500;
  }
  #sinatra-header-inner .site-navigation > ul a:hover,
  #sinatra-header-inner .site-navigation > ul li.current-menu-item > a,
  #sinatra-header-inner .site-navigation > ul li.current-menu-ancestor > a {
    color: #ffffff !important;
    background: rgba(220,57,0,0.08) !important;
  }
  /* the current page: an orange bar on the left */
  #sinatra-header-inner .site-navigation > ul li.current-menu-item > a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    bottom: 10px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: #dc3900;
  }

  /* icon items: icon in orange plus the name next to it (desktop shows the name as a tooltip) */
  #sinatra-header-inner .site-navigation ._mi {
    color: #ff5a25;
    margin-right: 12px;
    vertical-align: -3px;
  }
  #sinatra-header-inner .site-navigation .visuallyhidden {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: normal;
  }
  /* a gap before the icon items, like the divider on desktop */
  #sinatra-header-inner .site-navigation > ul > li:has(._mi):not(li:has(._mi) + li) {
    margin-top: 10px !important;
    border-top: 1px solid rgba(255,255,255,0.10);
    padding-top: 6px !important;
  }

  /* sub-menus (when the menu gets groups) */
  #sinatra-header-inner .site-navigation > ul .sub-menu { background: rgba(255,255,255,0.03) !important; }
  #sinatra-header-inner .site-navigation > ul .sub-menu a > span { padding-left: 44px !important; font-size: 14px; }
  #sinatra-header-inner .sinatra-nav .menu-item-has-children > a > span { border-right-color: rgba(255,255,255,0.08) !important; }
  #sinatra-header-inner .sinatra-nav .menu-item-has-children > a > .si-icon { color: #888888; fill: currentColor; }
  #sinatra-header-inner .site-navigation > ul .menu-item-has-children.si-open > a > .si-icon { color: #ff5a25; }

  /* the account dot also on phones */
  .logged-in #sinatra-header-inner .site-navigation a[href*="/my-account/"] ._mi { position: relative; }
  .logged-in #sinatra-header-inner .site-navigation a[href*="/my-account/"] ._mi::after {
    content: "";
    position: absolute;
    top: -2px;
    right: -5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #dc3900;
    box-shadow: 0 0 8px rgba(220,57,0,0.8);
  }
}

@media (prefers-reduced-motion: reduce) {
  #sinatra-header-inner #sinatra-primary-nav > li > a > span::after,
  #sinatra-header-inner #sinatra-primary-nav ._mi,
  #sinatra-header-inner #sinatra-primary-nav .visuallyhidden { transition: none; }
}


/* #########################################################
   PAGE TITLE BAND   (Page header/page-header.css)
   ######################################################### */

/* =========================================================
   ASF page title band (theme Sinatra .page-header: title + breadcrumbs under the menu)
   1. Hidden on pages that open with their own hero (it only repeated their big title).
   2. Elsewhere: no grey band and no line - the site background shows through; a bigger, bolder
      title in the site's style; quiet breadcrumbs above it.
   No angle brackets anywhere.
========================================================= */

/* 1. pages with their own hero: Launch Your Idea, Quant VPS, About us, FAQ, Rithmic Connector */
.page-id-1265 .page-header,
.page-id-2754 .page-header,
.page-id-192 .page-header,
.page-id-2070 .page-header,
.page-id-3376 .page-header { display: none !important; }

/* 2. everywhere else */
#page .page-header {
  background: transparent !important;
  border: 0 !important;
}
#page .page-header .si-container {
  display: flex;
  flex-direction: column-reverse;   /* breadcrumbs above the title */
  align-items: center;
  gap: 10px;
}
#page .page-header .si-page-header-wrapper {
  padding-top: 44px !important;
  padding-bottom: 6px !important;
  text-align: center;
}
#page .page-header .page-title {
  margin: 0 !important;
  color: #111111 !important;
  font-size: clamp(28px, 3.6vw, 40px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em;
  line-height: 1.1 !important;
}
#page .page-header .si-breadcrumbs {
  margin: 34px 0 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  letter-spacing: .02em;
  color: #888888 !important;
}
#page .page-header .si-breadcrumbs p { margin: 0 !important; }
#page .page-header .si-breadcrumbs a {
  color: #888888 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: color .2s ease;
}
#page .page-header .si-breadcrumbs a:hover { color: #dc3900 !important; }
#page .page-header .si-breadcrumbs a::before { display: none !important; }
#page .page-header .si-breadcrumbs .separator { color: #cccccc; margin: 0 4px; }
#page .page-header .si-breadcrumbs .last { color: #444444; }


@media screen and (max-width: 600px) {
  #page .page-header .si-page-header-wrapper { padding-top: 30px !important; }
  #page .page-header .si-breadcrumbs { margin-top: 22px !important; }
}


/* #########################################################
   PRELOADER AND SMALL LOADERS   (Preloader/preloader.css)
   ######################################################### */

/* =========================================================
   ASF preloader (theme Sinatra: #si-preloader .preloader-1 > div)
   Ninja + code: a spinning orange shuriken, a scan line under it and "loading"
   typed in a terminal font, on a see-through dark veil (the page shows through,
   blurred). History 2026-10-11: solid dark screen -> star only, no backdrop
   (hardly seen) -> this: the first version with a lighter, translucent veil.
   Paste into: Appearance -> Customize -> Additional CSS
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

#si-preloader { background: transparent !important; }

#si-preloader .preloader-1 {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  /* veil: dark at 70 %, the page behind it blurred */
  background:
    radial-gradient(circle at 50% 46%, rgba(220,57,0,0.22) 0%, rgba(220,57,0,0.18) 8%, rgba(220,57,0,0.12) 20%, rgba(220,57,0,0.07) 35%, rgba(220,57,0,0.03) 50%, rgba(220,57,0,0.008) 65%, rgba(220,57,0,0) 80%),
    linear-gradient(135deg, rgba(14,14,14,0.72) 0%, rgba(24,24,24,0.66) 55%, rgba(14,14,14,0.72) 100%) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

/* the shuriken */
#si-preloader .preloader-1 > div {
  order: 1;
  width: 64px !important;
  height: 64px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(135deg, #ff5a25 0%, #dc3900 55%, #b92f00 100%) !important;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: asf-shuriken 0.9s cubic-bezier(.45,.05,.55,.95) infinite !important;
}

/* the scan line under it */
#si-preloader .preloader-1::after {
  content: "";
  order: 2;
  width: 140px;
  height: 2px;
  border-radius: 2px;
  background:
    linear-gradient(90deg, transparent 0%, #ff5a25 50%, transparent 100%) no-repeat,
    rgba(255,255,255,0.12);
  background-size: 40% 100%, 100% 100%;
  animation: asf-scan 1.1s ease-in-out infinite;
}

/* "loading" typed in a terminal font, with a blinking cursor */
#si-preloader .preloader-1::before {
  content: "loading...";
  order: 3;
  display: block;
  width: 10ch;
  overflow: hidden;
  white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  letter-spacing: .12em;
  color: #cccccc;
  border-right: 2px solid #ff5a25;
  padding-right: 2px;
  animation: asf-type 1.6s steps(10) infinite, asf-cursor .55s step-end infinite;
}

/* the theme removes the preloader the moment the page is ready, so it flashes by;
   keep it 0.6 s longer and fade it out (clicks already go through to the page) */
.si-loaded #si-preloader {
  display: block !important;
  pointer-events: none;
  animation: asf-preloader-out .45s ease .6s forwards;
}
.si-loaded #si-preloader .preloader-1 { opacity: 1 !important; }

@keyframes asf-shuriken { to { transform: rotate(360deg); } }
@keyframes asf-scan {
  0%   { background-position: -60% 0, 0 0; }
  100% { background-position: 160% 0, 0 0; }
}
@keyframes asf-type {
  0%   { width: 0; }
  70%  { width: 10ch; }
  100% { width: 10ch; }
}
@keyframes asf-cursor { 50% { border-right-color: transparent; } }
@keyframes asf-preloader-out { to { opacity: 0; visibility: hidden; } }

@media (prefers-reduced-motion: reduce) {
  #si-preloader .preloader-1 > div { animation-duration: 2.4s !important; }
  #si-preloader .preloader-1::after,
  #si-preloader .preloader-1::before { animation: none; width: 10ch; }
  .si-loaded #si-preloader { animation-delay: 0s; }
}

/* =========================================================
   SMALL LOADERS of the plugins -> the same orange shuriken
   GamiPress: Load More on /achievements/, Earnings history pages (.gamipress-spinner, a GIF)
   Contact Form 7: sending a form (.wpcf7-spinner)
   (WooCommerce's overlay spinner is in the Shop block.)
========================================================= */
.gamipress-spinner {
  width: 22px !important;
  height: 22px !important;
  background: linear-gradient(135deg, #ff5a25 0%, #dc3900 55%, #b92f00 100%) !important;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: asf-loader-spin .9s cubic-bezier(.45,.05,.55,.95) infinite;
}
.wpcf7-spinner {
  width: 22px !important;
  height: 22px !important;
  border-radius: 0 !important;
  opacity: 1 !important;
  background: linear-gradient(135deg, #ff5a25 0%, #dc3900 55%, #b92f00 100%) !important;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: asf-loader-spin .9s cubic-bezier(.45,.05,.55,.95) infinite;
}
.wpcf7-spinner::before { display: none !important; }
@keyframes asf-loader-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .gamipress-spinner, .wpcf7-spinner { animation-duration: 2.4s; }
}


/* #########################################################
   FLOATING BUTTONS: BACK TO TOP, CHATY   (Floating buttons/floating.css)
   ######################################################### */

/* =========================================================
   ASF floating buttons: the theme's "back to top" (#si-scroll-top) and the
   Chaty chat button, both bottom right.
   Chaty sits at right 25 px / bottom 25 px, 54 px (its settings). The theme put the
   scroll button at right 20 / bottom 15, under the chat button. Now the scroll button
   stands above the chat button, centred on it, and hides while the chat is open.
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* ---------- back to top ---------- */
#si-scroll-top {
  /* the same size as the chat button and on its exact centre line:
     measured centre of the chat button = 54 px from the right edge */
  right: 27px !important;
  bottom: 91px !important;             /* 25 + 54 + 12 px gap */
  width: 54px !important;
  height: 54px !important;
  border-radius: 50%;
}
/* the theme draws the circle as ::before and grows it on hover; here a dark circle with an orange rim,
   readable on light pages and on the black footer alike */
#si-scroll-top::before {
  background: rgba(14,14,14,0.88) !important;
  border: 1.5px solid rgba(255,90,37,0.75);
  box-sizing: border-box;
  box-shadow: 0 10px 24px rgba(0,0,0,0.30), 0 0 14px rgba(220,57,0,0.25);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transform: scale(1) !important;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
#si-scroll-top:hover::before {
  background: linear-gradient(110deg, #dc3900 0%, #b92f00 100%) !important;
  border-color: #ff5a25;
  box-shadow: 0 12px 26px rgba(0,0,0,0.35), 0 0 20px rgba(220,57,0,0.45);
  transform: scale(1) !important;
}
/* the theme's own arrows (two SVGs that slide into a clipped box) don't survive the new size:
   hidden, and one arrow drawn on top as a mask, centred */
#si-scroll-top .si-scroll-icon,
#si-scroll-top .si-icon,
#si-scroll-top .sinatra-animated-arrow { visibility: hidden !important; }
#si-scroll-top::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  margin: auto;
  width: 20px;
  height: 20px;
  background-color: #ff5a25;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5'/%3E%3Cpath d='M5 12l7-7 7 7'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5'/%3E%3Cpath d='M5 12l7-7 7 7'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: background-color .2s ease, transform .2s ease;
  pointer-events: none;
}
#si-scroll-top:hover::after { background-color: #ffffff; transform: translateY(-2px); }
#si-scroll-top.si-visible:hover { transform: translateY(-2px) !important; }

/* while the chat menu is open its channels rise above the button: step aside */
body:has(.chaty-widget.chaty-open) #si-scroll-top {
  opacity: 0 !important;
  pointer-events: none;
}

/* ---------- Chaty: the chat button in the brand orange ---------- */
.chaty-widget .chaty-cta-main .chaty-cta-button,
.chaty-widget .chaty-cta-close .chaty-cta-button,
.chaty-widget .chaty-i-trigger .chaty-channel {
  box-shadow: 0 12px 26px rgba(0,0,0,0.30), 0 0 18px rgba(220,57,0,0.35) !important;
}
.chaty-widget .chaty-cta-main .chaty-cta-button svg circle,
.chaty-widget .chaty-cta-close .chaty-cta-button svg circle,
.chaty-widget .chaty-cta-main .chaty-cta-button svg rect,
.chaty-widget .chaty-cta-close .chaty-cta-button svg rect {
  fill: #dc3900 !important;
  transition: fill .2s ease;
}
.chaty-widget .chaty-cta-main .chaty-cta-button:hover svg circle,
.chaty-widget .chaty-cta-close .chaty-cta-button:hover svg circle { fill: #b92f00 !important; }
.chaty-widget .chaty-cta-main .chaty-cta-button,
.chaty-widget .chaty-cta-close .chaty-cta-button { transition: transform .22s ease, box-shadow .22s ease; }
.chaty-widget .chaty-cta-main .chaty-cta-button:hover { transform: translateY(-2px); }

/* the "Hide" / tooltip bubbles in the site's dark */
.chaty-widget .chaty-tooltip .on-hover-text {
  background: #111111 !important;
  color: #eeeeee !important;
}

@media (prefers-reduced-motion: reduce) {
  #si-scroll-top::before,
  .chaty-widget .chaty-cta-main .chaty-cta-button { transition: none; }
}


/* #########################################################
   FOOTER PARTNERS   (Footer partners/footer-partners.css)
   ######################################################### */

/* =========================================================
   ASF footer partners (theme Sinatra, footer widget area)
   Paste into: Appearance -> Customize -> Additional CSS
   Dark band in the style of the site's dark blocks; logos turn white.
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* ---------- the band ---------- */
#colophon #sinatra-footer {
  position: relative;
  padding: 64px 0 48px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 60% 90% at 50% 0%, rgba(220,57,0,0.16) 0%, rgba(220,57,0,0.1356) 16%, rgba(220,57,0,0.0976) 35%, rgba(220,57,0,0.0576) 55%, rgba(220,57,0,0.024) 75%, rgba(220,57,0,0.0008) 93%, rgba(220,57,0,0) 100%),
    linear-gradient(180deg, #181818 0%, #0e0e0e 70%, #000000 100%);
  background-size: 160px 160px, 100% 100%, 100% 100%;
  overflow: hidden;
}

/* thin orange line along the top edge */
#colophon #sinatra-footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(220,57,0,0.15) 15%, rgba(220,57,0,0.85) 50%, rgba(220,57,0,0.15) 85%, transparent 100%);
}

/* label "OUR PARTNERS" above the logos: orange pill with a dot */
#colophon #sinatra-footer > .si-container::before {
  content: "Our partners";
  display: table;
  margin: 0 auto 30px;
  padding: 6px 14px 6px 26px;
  border: 1px solid rgba(220,57,0,0.35);
  border-radius: 999px;
  background:
    radial-gradient(circle at 13px 50%, #dc3900 0 3.5px, transparent 4px),
    rgba(220,57,0,0.08);
  color: #ff5a25;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  line-height: 1.4;
}

/* ---------- logo cards ---------- */
#colophon #sinatra-footer-widgets { row-gap: 16px; }
#colophon #sinatra-footer-widgets .si-footer-widget { margin: 0 !important; }
#colophon #sinatra-footer-widgets figure { margin: 0 !important; }

#colophon #sinatra-footer-widgets figure a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 96px;
  padding: 18px 28px;
  overflow: hidden;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.09);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

#colophon #sinatra-footer-widgets figure img {
  width: auto !important;
  max-width: 100%;
  max-height: 46px;
  height: auto !important;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: .6;
  transition: opacity .22s ease, transform .22s ease;
}

/* glint, as on the site's buttons */
#colophon #sinatra-footer-widgets figure a::before {
  content: "";
  position: absolute;
  top: -20%;
  left: -100%;
  width: 60%;
  height: 140%;
  background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.16) 50%, rgba(255,255,255,0.04) 75%, transparent 100%);
  filter: blur(6px);
  transform: skewX(-20deg);
  transition: left .45s ease;
  pointer-events: none;
}

#colophon #sinatra-footer-widgets figure a:hover {
  transform: translateY(-3px);
  border-color: rgba(220,57,0,0.55);
  background: linear-gradient(135deg, rgba(220,57,0,0.10) 0%, rgba(255,255,255,0.03) 100%);
  box-shadow: 0 14px 30px rgba(0,0,0,0.45), 0 0 22px rgba(220,57,0,0.18);
}
#colophon #sinatra-footer-widgets figure a:hover img { opacity: 1; transform: scale(1.03); }
#colophon #sinatra-footer-widgets figure a:hover::before { left: 150%; }

/* the copyright bar continues the band without a visible seam */
#colophon #sinatra-copyright { background: #000000; }

/* ---------- phones ---------- */
@media screen and (max-width: 600px) {
  #colophon #sinatra-footer { padding: 44px 0 32px; }
  #colophon #sinatra-footer-widgets figure a { height: 80px; padding: 14px 20px; }
  #colophon #sinatra-footer-widgets figure img { max-height: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  #colophon #sinatra-footer-widgets figure a,
  #colophon #sinatra-footer-widgets figure a::before,
  #colophon #sinatra-footer-widgets figure img { transition: none; }
  #colophon #sinatra-footer-widgets figure a:hover { transform: none; }
}


/* #########################################################
   FOOTER SOCIAL LINKS   (Footer socials/footer-socials.css)
   ######################################################### */

/* =========================================================
   ASF footer social links (theme Sinatra, menu "Social link")
   Paste into: Appearance -> Customize -> Additional CSS
   The icon is chosen by the link's address, so the order of the
   menu items does not matter. Unknown links get a generic link icon.
========================================================= */

/* hide the theme's own icons (old Twitter bird, arrow for NinjaTrader) */
#sinatra-copyright .sinatra-socials-menu .si-icon { display: none !important; }

#sinatra-copyright .sinatra-socials-menu { gap: 10px; }

#sinatra-copyright .sinatra-socials-menu > li > a {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a5 5 0 0 0 7 0l3-3a5 5 0 0 0-7-7l-1 1'/%3E%3Cpath d='M14 10a5 5 0 0 0-7 0l-3 3a5 5 0 0 0 7 7l1-1'/%3E%3C/svg%3E");
  position: relative;
  width: 38px;
  height: 38px;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50%;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.03) 100%);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
  transition: background .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}

/* the icon itself: a mask filled with the current colour */
#sinatra-copyright .sinatra-socials-menu > li > a::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 17px;
  height: 17px;
  background-color: #cccccc;
  -webkit-mask: var(--asf-icon) center / contain no-repeat;
  mask: var(--asf-icon) center / contain no-repeat;
  transition: background-color .22s ease, transform .22s ease;
}

/* glint on hover, as on the site's buttons */
#sinatra-copyright .sinatra-socials-menu > li > a::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  top: -20%;
  left: -120%;
  width: 70%;
  height: 140%;
  background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.06) 25%, rgba(255,255,255,0.28) 50%, rgba(255,255,255,0.06) 75%, transparent 100%);
  filter: blur(3px);
  transform: skewX(-20deg);
  transition: left .4s ease;
  pointer-events: none;
  z-index: 1;
}

#sinatra-copyright .sinatra-socials-menu > li > a:hover {
  background: linear-gradient(110deg, #dc3900 0%, #b92f00 100%);
  border-color: #ff5a25;
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,0.45), 0 0 18px rgba(220,57,0,0.35);
}
#sinatra-copyright .sinatra-socials-menu > li > a:hover::after { background-color: #ffffff; }
#sinatra-copyright .sinatra-socials-menu > li > a:hover::before { left: 150%; }

/* ---------- icons by address ---------- */

/* NinjaTrader: the NT mark, traced from NTWhiteNT.png in Media (any address with "ninjatrader",
   the affiliate link too) */
#sinatra-copyright .sinatra-socials-menu a[href*="ninjatrader"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='79 142 317 190'%3E%3Cpath fill='black' d='M79 142H143L270 269V205H207V142H395V205H332V331H205L79 205ZM79 270H141V331H79Z'/%3E%3C/svg%3E");
}
#sinatra-copyright .sinatra-socials-menu a[href*="ninjatrader"]::after { width: 20px; height: 20px; }

/* YouTube */
#sinatra-copyright .sinatra-socials-menu a[href*="youtube.com"],
#sinatra-copyright .sinatra-socials-menu a[href*="youtu.be"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M5.5 4.5h13A4.5 4.5 0 0 1 23 9v6a4.5 4.5 0 0 1-4.5 4.5h-13A4.5 4.5 0 0 1 1 15V9a4.5 4.5 0 0 1 4.5-4.5zM10 8.4v7.2l6.2-3.6z'/%3E%3C/svg%3E");
}

/* Facebook */
#sinatra-copyright .sinatra-socials-menu a[href*="facebook.com"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13.6 22.5v-9.2h3.1l.5-3.7h-3.6V7.3c0-1.1.3-1.8 1.8-1.8h1.9V2.2c-.3 0-1.5-.2-2.8-.2-2.8 0-4.6 1.7-4.6 4.8v2.8H6.8v3.7h3.1v9.2z'/%3E%3C/svg%3E");
}

/* LinkedIn */
#sinatra-copyright .sinatra-socials-menu a[href*="linkedin.com"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M5 2h14a3 3 0 0 1 3 3v14a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3zM8.8 7.2a1.6 1.6 0 1 1-3.2 0 1.6 1.6 0 0 1 3.2 0zM5.7 9.6h3v8.6h-3zM10.6 9.6h2.9v1.3c.5-.8 1.4-1.5 2.9-1.5 2.7 0 3.2 1.7 3.2 3.9v4.9h-3v-4.3c0-1.1-.1-2.1-1.3-2.1-1.2 0-1.6.9-1.6 2.1v4.3h-3.1z'/%3E%3C/svg%3E");
}

/* Instagram */
#sinatra-copyright .sinatra-socials-menu a[href*="instagram.com"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='5.5'/%3E%3Ccircle cx='12' cy='12' r='4.3'/%3E%3Ccircle cx='17.4' cy='6.6' r='1.1' fill='black' stroke='none'/%3E%3C/svg%3E");
}

/* X (Twitter) */
#sinatra-copyright .sinatra-socials-menu a[href*="twitter.com"],
#sinatra-copyright .sinatra-socials-menu a[href*="x.com/"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M18.9 1.2h3.7l-8 9.2L24 22.8h-7.4l-5.8-7.6-6.6 7.6H.5l8.6-9.8L0 1.2h7.6l5.2 6.9zm-1.3 19.4h2L6.5 3.2H4.3z'/%3E%3C/svg%3E");
}
#sinatra-copyright .sinatra-socials-menu a[href*="twitter.com"]::after,
#sinatra-copyright .sinatra-socials-menu a[href*="x.com/"]::after { width: 15px; height: 15px; }

/* Telegram, Discord (ready if added to the menu) */
#sinatra-copyright .sinatra-socials-menu a[href*="t.me"],
#sinatra-copyright .sinatra-socials-menu a[href*="telegram"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M21.9 3.4 18.6 19.9c-.2 1.1-.9 1.4-1.8.9l-5-3.7-2.4 2.3c-.3.3-.5.5-1 .5l.4-5.1 9.2-8.3c.4-.4-.1-.6-.6-.2L6 13.5 1.1 12c-1.1-.3-1.1-1.1.2-1.6L20.5 3c.9-.3 1.7.2 1.4 1.4z'/%3E%3C/svg%3E");
}
#sinatra-copyright .sinatra-socials-menu a[href*="discord"] {
  --asf-icon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M19.6 5.3A17 17 0 0 0 15.4 4l-.5 1.1a15.6 15.6 0 0 0-5.8 0L8.6 4a17 17 0 0 0-4.2 1.3C1.7 9.3 1 13.2 1.3 17a17 17 0 0 0 5.2 2.6l1.1-1.8c-.6-.2-1.2-.5-1.7-.8l.4-.3a12.1 12.1 0 0 0 11.4 0l.4.3c-.5.3-1.1.6-1.7.8l1.1 1.8a17 17 0 0 0 5.2-2.6c.4-4.4-.7-8.3-3.1-11.7zM8.7 14.7c-1 0-1.9-.9-1.9-2.1s.8-2.1 1.9-2.1 1.9.9 1.9 2.1-.8 2.1-1.9 2.1zm6.6 0c-1 0-1.9-.9-1.9-2.1s.8-2.1 1.9-2.1 1.9.9 1.9 2.1-.8 2.1-1.9 2.1z'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
  #sinatra-copyright .sinatra-socials-menu > li > a,
  #sinatra-copyright .sinatra-socials-menu > li > a::before { transition: none; }
  #sinatra-copyright .sinatra-socials-menu > li > a:hover { transform: none; }
}


/* #########################################################
   FOOTER DISCLAIMER   (Footer disclaimer/footer-disclaimer.css)
   ######################################################### */

/* =========================================================
   ASF footer copyright + disclaimers (theme Sinatra, copyright bar)
   Paste into: Appearance -> Customize -> Additional CSS
   Typography only - no panels, frames or lines.
   The text itself is not changed in any way.
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* text on top, social icons centred under it */
#sinatra-copyright { padding: 36px 0 30px; }
#sinatra-copyright .si-flex-row > div:has(.si-copyright-widget__text) {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  flex: 1 1 100%;
  max-width: 100%;
}

#sinatra-copyright .si-copyright-widget__text {
  display: block;
  width: 100%;
  max-width: 920px;
  margin: 0 auto 26px !important;
  text-align: left;
}

/* small print */
#sinatra-copyright .si-copyright-widget__text > span {
  display: block;
  font-size: 12px;
  line-height: 1.75;
  color: #8a8a8a;
}
/* the first line is the copyright notice: a little brighter */
#sinatra-copyright .si-copyright-widget__text > span::first-line {
  color: #cccccc;
  font-size: 13px;
  font-weight: 600;
}
#sinatra-copyright .si-copyright-widget__text p {
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* section titles on their own line, with air above */
#sinatra-copyright .si-copyright-widget__text strong {
  display: block;
  margin: 18px 0 4px;
  color: #cccccc;
  font-weight: 600;
}

#sinatra-copyright .si-copyright-widget__socials {
  display: flex;
  justify-content: center;
  margin: 0 !important;
}

@media screen and (max-width: 600px) {
  #sinatra-copyright { padding: 26px 0 24px; }
  #sinatra-copyright .si-copyright-widget__text > span { font-size: 11.5px; line-height: 1.7; }
}


/* #########################################################
   ACCOUNT LOGIN   (Account login/account-login.css)
   ######################################################### */

/* =========================================================
   ASF account login / register / lost password (WooCommerce)
   Paste into: Appearance -> Customize -> Additional CSS
   Same look as the Custom Development form (HTML/Site/dev-form.html):
   dark grained card, dark inputs with an orange focus ring,
   orange gradient button with a glint.
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* ---------- two cards side by side ---------- */
.woocommerce-account #customer_login {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
}
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after { display: none !important; }
.woocommerce-account #customer_login > .u-column1,
.woocommerce-account #customer_login > .u-column2 {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* the card: login, register and the lost-password form */
.woocommerce-account #customer_login > .u-column1,
.woocommerce-account #customer_login > .u-column2,
.woocommerce-account form.woocommerce-ResetPassword {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  padding: 40px 40px 36px;
  color: #aaaaaa;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 70% 60% at 100% 0%, rgba(220,57,0,0.14) 0%, rgba(220,57,0,0.1187) 16%, rgba(220,57,0,0.0854) 35%, rgba(220,57,0,0.0504) 55%, rgba(220,57,0,0.021) 75%, rgba(220,57,0,0.0007) 93%, rgba(220,57,0,0) 100%),
    linear-gradient(135deg, #0e0e0e 0%, #181818 55%, #0e0e0e 100%);
  background-size: 160px 160px, 100% 100%, 100% 100%;
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 16px;
  box-shadow: 0 30px 90px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.035);
}

/* thin orange edge at the top of each card */
.woocommerce-account #customer_login > .u-column1::before,
.woocommerce-account #customer_login > .u-column2::before,
.woocommerce-account form.woocommerce-ResetPassword::before {
  content: "";
  position: absolute;
  top: 0;
  left: 9%;
  right: 9%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(220,57,0,0.75), transparent);
  opacity: .8;
}

/* the forms inside the cards: no theme frame */
.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

/* ---------- headings ---------- */
.woocommerce-account #customer_login h2 {
  position: relative;
  margin: 0 0 28px;
  padding-bottom: 18px;
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: -0.03em;
  font-weight: 700;
  color: #ffffff;
}
.woocommerce-account #customer_login h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 80px;
  height: 1px;
  background: linear-gradient(90deg, #dc3900, transparent);
}

/* ---------- rows, labels, text ---------- */
.woocommerce-account #customer_login .form-row,
.woocommerce-account form.woocommerce-ResetPassword .form-row {
  margin: 0 0 22px !important;
  padding: 0 !important;
}
.woocommerce-account #customer_login label,
.woocommerce-account form.woocommerce-ResetPassword label {
  display: block;
  margin-bottom: 9px;
  color: #eeeeee;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1.3;
}
.woocommerce-account #customer_login .required,
.woocommerce-account form.woocommerce-ResetPassword .required {
  color: #ff5a25 !important;
  border: 0 !important;
  text-decoration: none !important;
}
.woocommerce-account #customer_login p,
.woocommerce-account form.woocommerce-ResetPassword p {
  color: #aaaaaa;
  font-size: 13px;
  line-height: 1.65;
}
.woocommerce-account #customer_login a,
.woocommerce-account form.woocommerce-ResetPassword a {
  color: #ff5a25 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: color .2s ease;
}
.woocommerce-account #customer_login a:hover,
.woocommerce-account form.woocommerce-ResetPassword a:hover { color: #ffffff !important; }
.woocommerce-account #customer_login a::before,
.woocommerce-account form.woocommerce-ResetPassword a::before { display: none !important; }

/* ---------- inputs ---------- */
.woocommerce-account #customer_login input.input-text,
.woocommerce-account form.woocommerce-ResetPassword input.input-text {
  width: 100%;
  box-sizing: border-box;
  height: auto;
  padding: 14px 16px !important;
  color: #eeeeee !important;
  background: rgba(255,255,255,0.035) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.45;
  outline: none;
  transition: border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.woocommerce-account #customer_login input.input-text:hover,
.woocommerce-account form.woocommerce-ResetPassword input.input-text:hover {
  border-color: rgba(255,255,255,0.19) !important;
  background: rgba(255,255,255,0.045) !important;
}
.woocommerce-account #customer_login input.input-text:focus,
.woocommerce-account form.woocommerce-ResetPassword input.input-text:focus {
  border-color: rgba(220,57,0,0.75) !important;
  background: rgba(220,57,0,0.035) !important;
  box-shadow: 0 0 0 3px rgba(220,57,0,0.09), 0 8px 30px rgba(0,0,0,0.16) !important;
}

/* browser autofill keeps the dark field instead of a white/yellow one */
.woocommerce-account #customer_login input.input-text:-webkit-autofill,
.woocommerce-account form.woocommerce-ResetPassword input.input-text:-webkit-autofill {
  -webkit-text-fill-color: #eeeeee;
  -webkit-box-shadow: 0 0 0 1000px #1a1a1a inset !important;
  caret-color: #eeeeee;
  transition: background-color 9999s ease 0s;
}

/* show-password eye */
.woocommerce-account #customer_login .password-input { display: block; position: relative; }
.woocommerce-account #customer_login .show-password-input {
  top: 50% !important;
  right: 12px !important;
  transform: translateY(-50%);
  color: #aaaaaa !important;
  opacity: .8;
}
.woocommerce-account #customer_login .show-password-input:hover { color: #ff5a25 !important; opacity: 1; }
.woocommerce-account #customer_login .show-password-input::after { color: inherit !important; }

/* remember me */
.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
  display: inline-flex !important;
  align-items: center;
  gap: 9px;
  margin: 0 18px 0 0 !important;
  color: #cccccc;
  font-weight: 500;
  cursor: pointer;
}
.woocommerce-account #customer_login input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #dc3900;
}

/* ---------- buttons ---------- */
.woocommerce-account #customer_login button.button,
.woocommerce-account form.woocommerce-ResetPassword button.button {
  position: relative;
  overflow: hidden;
  min-height: 50px;
  padding: 13px 28px !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  background: linear-gradient(110deg, #dc3900 0%, #b92f00 45%, #171717 100%) !important;
  font-family: inherit;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .01em;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(0,0,0,0.28);
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.woocommerce-account #customer_login button.button::before,
.woocommerce-account form.woocommerce-ResetPassword button.button::before {
  content: "";
  position: absolute;
  top: -20%;
  left: -100%;
  width: 70%;
  height: 140%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.24), transparent);
  transform: skewX(-20deg);
  transition: left .55s ease;
  pointer-events: none;
}
.woocommerce-account #customer_login button.button:hover,
.woocommerce-account form.woocommerce-ResetPassword button.button:hover {
  transform: translateY(-2px);
  box-shadow: 0 15px 34px rgba(0,0,0,0.35), 0 0 22px rgba(220,57,0,0.10);
  filter: brightness(1.05);
}
.woocommerce-account #customer_login button.button:hover::before,
.woocommerce-account form.woocommerce-ResetPassword button.button:hover::before { left: 140%; }
.woocommerce-account #customer_login button.button:active,
.woocommerce-account form.woocommerce-ResetPassword button.button:active { transform: translateY(0); }

/* login: Remember me and the button on one line */
.woocommerce-account #customer_login form.login .form-row:has(.woocommerce-form-login__submit) {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}
.woocommerce-account #customer_login .woocommerce-form-login__submit { float: none !important; margin: 0 !important; }
.woocommerce-account #customer_login .lost_password { margin: 18px 0 0 !important; }

/* register: the button full width at the bottom */
.woocommerce-account #customer_login form.register button.button { width: 100%; }
.woocommerce-account #customer_login .woocommerce-privacy-policy-text p { font-size: 12px; color: #888888; }

/* ---------- lost password page ---------- */
.woocommerce-account form.woocommerce-ResetPassword {
  max-width: 560px;
  margin: 0 auto;
}

/* ---------- phones ---------- */
@media screen and (max-width: 768px) {
  .woocommerce-account #customer_login { grid-template-columns: 1fr; gap: 18px; }
  .woocommerce-account #customer_login > .u-column1,
  .woocommerce-account #customer_login > .u-column2,
  .woocommerce-account form.woocommerce-ResetPassword { padding: 28px 22px 26px; border-radius: 14px; }
  .woocommerce-account #customer_login h2 { font-size: 24px; margin-bottom: 22px; }
  .woocommerce-account #customer_login form.login button.button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .woocommerce-account #customer_login button.button,
  .woocommerce-account #customer_login button.button::before,
  .woocommerce-account form.woocommerce-ResetPassword button.button,
  .woocommerce-account form.woocommerce-ResetPassword button.button::before { transition: none; }
}


/* #########################################################
   ACCOUNT AREA   (Account area/account-area.css)
   ######################################################### */

/* =========================================================
   ASF account area (logged in): menu, dashboard, orders, downloads,
   addresses, account details. Same cards, tables and buttons as the
   Rank tab (Snippets/My Account Rank tab).
   Paste into: Appearance -> Customize -> Additional CSS
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* ---------- menu card ---------- */
.woocommerce-account #main .woocommerce-MyAccount-navigation {
  box-sizing: border-box;
  align-self: flex-start;
  padding: 10px;
  background: #ffffff;
  border: 1px solid #e9ecef;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}
.woocommerce-account #main .woocommerce-MyAccount-navigation ul li {
  position: relative;
  padding: 10px 14px !important;
  margin: 2px 0 !important;
  border-radius: 10px;
  color: #444444;
  transition: background .2s ease, color .2s ease;
}
.woocommerce-account #main .woocommerce-MyAccount-navigation ul li a {
  margin: 0 !important;
  color: inherit !important;
  font-weight: 500;
  text-decoration: none !important;
  flex: 1;
}
.woocommerce-account #main .woocommerce-MyAccount-navigation ul li a::before { display: none !important; }
.woocommerce-account #main .woocommerce-MyAccount-navigation ul li:hover {
  background: #f6f6f4;
  color: #111111;
}
.woocommerce-account #main .woocommerce-MyAccount-navigation ul li.is-active {
  background: #fdf3ef;
  color: #dc3900;
  box-shadow: inset 3px 0 0 #dc3900;
}
.woocommerce-account #main .woocommerce-MyAccount-navigation ul li.is-active > a { font-weight: 600; }

/* ---------- content card (not on the Rank tab: it has its own cards) ---------- */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) {
  box-sizing: border-box;
  padding: 28px 30px;
  background: #ffffff;
  border: 1px solid #e9ecef;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  color: #444444;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) a:not(.button) {
  color: #dc3900 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) a:not(.button):hover { color: #111111 !important; }
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) a:not(.button)::before { display: none !important; }
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) strong { color: #111111; }
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) h2,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) h3,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) legend {
  color: #111111;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) legend {
  margin: 10px 0 14px;
  padding: 0;
  font-size: 16px;
}

/* ---------- tables: orders, downloads, order details ---------- */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table.shop_table,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table.woocommerce-table {
  width: 100%;
  margin: 0 0 18px;
  border: 0 !important;
  border-collapse: collapse !important;
  border-radius: 0 !important;
  background: none !important;
  font-size: 14px;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table thead,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table tbody,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table tfoot,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table tr { background: none !important; }
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table th {
  padding: 10px 10px !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid #e9ecef !important;
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #888888;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table td {
  padding: 12px 10px !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table tbody tr:hover td { background: #fafafa !important; }
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table tfoot th,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) table tfoot td {
  font-size: 13px;
  text-transform: none;
  letter-spacing: 0;
  color: #444444;
}

/* order status as a soft tag */
.woocommerce-account #main .woocommerce-orders-table__cell-order-status {
  font-weight: 600;
  color: #111111;
}

/* ---------- buttons: View, Download, Save, Pay ... ---------- */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .button {
  display: inline-block;
  padding: 7px 14px !important;
  margin: 2px 4px 2px 0 !important;
  border: 1px solid #dc3900 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #dc3900 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background .2s ease, color .2s ease;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .button:hover {
  background: #dc3900 !important;
  color: #ffffff !important;
  filter: none !important;
  opacity: 1 !important;
}
/* the theme draws an underline under notice buttons and links on hover - not here */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .button:not([type="submit"])::before,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .button:not([type="submit"])::after,
.woocommerce-account #main .woocommerce-message a::before,
.woocommerce-account #main .woocommerce-info a::before,
.woocommerce-account #main .woocommerce-error a::before { display: none !important; }
/* the notice icon in the brand colour instead of blue */
.woocommerce-account #main .woocommerce-message::before,
.woocommerce-account #main .woocommerce-info::before,
.woocommerce-account #main .woocommerce-error::before {
  background-color: #dc3900 !important;
  color: #dc3900 !important;
}

/* the main action of a form (Save changes, Save address): the site's orange-to-black button */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) form button[type="submit"].button {
  position: relative;
  overflow: hidden;
  min-height: 46px;
  padding: 12px 26px !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  background: linear-gradient(110deg, #dc3900 0%, #b92f00 45%, #171717 100%) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.18) !important;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) form button[type="submit"].button::before {
  content: "";
  position: absolute;
  top: -20%;
  left: -100%;
  width: 70%;
  height: 140%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.24), transparent);
  transform: skewX(-20deg);
  transition: left .55s ease;
  pointer-events: none;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) form button[type="submit"].button:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 15px 34px rgba(0,0,0,0.25), 0 0 22px rgba(220,57,0,0.10) !important;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) form button[type="submit"].button:hover::before { left: 140%; }

/* ---------- forms: account details, addresses ---------- */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) label {
  color: #111111;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 7px;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .required {
  color: #dc3900 !important;
  border: 0 !important;
  text-decoration: none !important;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) input.input-text,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) select,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) textarea,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .select2-container .select2-selection {
  box-sizing: border-box;
  min-height: 46px;
  padding: 11px 14px !important;
  color: #111111 !important;
  background: #ffffff !important;
  border: 1px solid #e2e2e2 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 14px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) input.input-text:hover,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) select:hover { border-color: #cfcfcf !important; }
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) input.input-text:focus,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) select:focus,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) textarea:focus {
  outline: none;
  border-color: rgba(220,57,0,0.75) !important;
  box-shadow: 0 0 0 3px rgba(220,57,0,0.10) !important;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) fieldset {
  margin: 22px 0 0;
  padding: 20px 0 0;
  border: 0;
  border-top: 1px solid #e9ecef;
}
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) em,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .description { color: #888888; font-size: 12px; }

/* addresses: two small cards */
.woocommerce-account #main .woocommerce-Addresses .woocommerce-Address {
  box-sizing: border-box;
  padding: 18px 20px;
  border: 1px solid #e9ecef;
  border-radius: 12px;
}
.woocommerce-account #main .woocommerce-Address-title h2,
.woocommerce-account #main .woocommerce-Address-title h3 { font-size: 16px; margin: 0; }
.woocommerce-account #main .woocommerce-Address address { font-style: normal; color: #444444; line-height: 1.7; }

/* ---------- notices inside the account ---------- */
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .woocommerce-message,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .woocommerce-info,
.woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) .woocommerce-error {
  border: 1px solid #f3d5c9 !important;
  border-left: 3px solid #dc3900 !important;
  border-radius: 10px;
  background: #fdf3ef !important;
  color: #444444 !important;
}

/* ---------- phones ---------- */
@media screen and (max-width: 960px) {
  .woocommerce-account #main .woocommerce-MyAccount-navigation { margin-bottom: 18px; }
  .woocommerce-account #main .woocommerce-MyAccount-content:not(:has(.asf-rank-page)) { padding: 20px 18px; }
}


/* #########################################################
   SHOP: PRODUCT, CART, CHECKOUT   (Shop/shop.css)
   ######################################################### */

/* =========================================================
   ASF shop: product page, cart, checkout (WooCommerce classic
   templates, theme Sinatra). Same cards, inputs, tables and buttons
   as the account area; the order summary at checkout is a dark card
   like the Custom Development form.
   Paste into: Appearance -> Customize -> Additional CSS
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* =========================================================
   1. SHARED: inputs, main buttons
========================================================= */

.woocommerce-checkout form.checkout input.input-text,
.woocommerce-checkout form.checkout textarea,
.woocommerce-checkout form.checkout select,
.woocommerce-checkout form.login input.input-text,
.woocommerce-checkout form.checkout_coupon input.input-text,
.woocommerce-cart .coupon input.input-text,
.woocommerce-checkout .select2-container--default .select2-selection--single {
  box-sizing: border-box;
  min-height: 46px;
  padding: 11px 14px !important;
  color: #111111 !important;
  background: #ffffff !important;
  border: 1px solid #e2e2e2 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 14px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 !important;
  line-height: 22px !important;
  color: #111111 !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { top: 10px !important; right: 8px !important; }
.woocommerce-checkout form.checkout input.input-text:focus,
.woocommerce-checkout form.checkout textarea:focus,
.woocommerce-checkout form.checkout select:focus,
.woocommerce-checkout form.login input.input-text:focus,
.woocommerce-checkout .select2-container--open .select2-selection--single {
  outline: none;
  border-color: rgba(220,57,0,0.75) !important;
  box-shadow: 0 0 0 3px rgba(220,57,0,0.10) !important;
}
.woocommerce-checkout .select2-dropdown { border-color: #e2e2e2 !important; border-radius: 10px !important; overflow: hidden; }
.woocommerce-checkout .select2-results__option--highlighted[aria-selected],
.woocommerce-checkout .select2-results__option--highlighted[data-selected] { background: #dc3900 !important; color: #ffffff !important; }

/* main actions: Add to cart, Proceed to Checkout, Place order */
.single-product div.product form.cart .single_add_to_cart_button,
.woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button,
.woocommerce-checkout #place_order {
  position: relative;
  overflow: hidden;
  min-height: 50px;
  padding: 13px 28px !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  background: linear-gradient(110deg, #dc3900 0%, #b92f00 45%, #171717 100%) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .01em;
  text-transform: none !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.22) !important;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.single-product div.product form.cart .single_add_to_cart_button::before,
.woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout::before,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button::before,
.woocommerce-checkout #place_order::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  top: -20%;
  left: -100%;
  width: 70%;
  height: 140%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.24), transparent) !important;
  transform: skewX(-20deg) !important;
  transition: left .55s ease !important;
  pointer-events: none;
}
.single-product div.product form.cart .single_add_to_cart_button:hover,
.woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout:hover,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover,
.woocommerce-checkout #place_order:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 15px 34px rgba(0,0,0,0.30), 0 0 22px rgba(220,57,0,0.14) !important;
}
.single-product div.product form.cart .single_add_to_cart_button:hover::before,
.woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout:hover::before,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover::before,
.woocommerce-checkout #place_order:hover::before { left: 140%; }
.single-product div.product form.cart .single_add_to_cart_button.disabled {
  opacity: .55 !important;
  transform: none;
  filter: grayscale(.3);
}

/* =========================================================
   2. PRODUCT PAGE
========================================================= */

.single-product div.product .woocommerce-product-gallery__image img {
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(0,0,0,0.12);
}
/* no zoom on hover, no magnifier button, no click to the full-size image: the pack picture has nothing to inspect */
.single-product div.product .woocommerce-product-gallery .zoomImg { display: none !important; }
.single-product div.product .woocommerce-product-gallery__trigger { display: none !important; }
.single-product div.product .woocommerce-product-gallery__image a {
  pointer-events: none;
  cursor: default;
}
.single-product div.product span.onsale {
  padding: 4px 10px !important;
  border-radius: 8px !important;
  background: #dc3900 !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  box-shadow: 0 6px 16px rgba(220,57,0,0.30);
}
.single-product div.product .product_title {
  color: #111111;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.single-product div.product .summary p.price,
.single-product div.product .woocommerce-variation-price .price {
  color: #dc3900 !important;
  font-size: 22px !important;
  font-weight: 700;
}
.single-product div.product .summary p.price del,
.single-product div.product .woocommerce-variation-price .price del { color: #888888 !important; font-size: .7em; font-weight: 500; }
.single-product div.product .summary p.price ins,
.single-product div.product .woocommerce-variation-price .price ins { text-decoration: none; }
/* the sale price bold, the crossed-out regular price lighter (the theme thins the sale price) */
.single-product div.product .price ins,
.single-product div.product .price ins .amount,
.single-product div.product .price ins bdi { font-weight: 700 !important; color: #dc3900 !important; }
.single-product div.product .price del,
.single-product div.product .price del .amount,
.single-product div.product .price del bdi { font-weight: 500 !important; color: #888888 !important; }

/* variable product: no price range under the title (0,00 $ - 700,00 $);
   the chosen licence shows its own price above Add to cart */
.single-product div.product.product-type-variable .summary > p.price { display: none !important; }

/* the "Heads up" note in the short description: a soft orange note */
.single-product .woocommerce-product-details__short-description div[style] {
  border: 1px solid #f3d5c9 !important;
  border-left: 3px solid #dc3900 !important;
  background: #fdf3ef !important;
  border-radius: 10px !important;
  color: #444444 !important;
}

/* licence choice */
.single-product div.product form.cart table.variations { margin-bottom: 14px; border: 0; }
.single-product div.product form.cart table.variations th,
.single-product div.product form.cart table.variations td {
  display: block;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  text-align: left;
}
.single-product div.product form.cart table.variations th.label label {
  display: block;
  margin-bottom: 8px;
  color: #111111;
  font-size: 13px;
  font-weight: 600;
}
.single-product div.product form.cart table.variations select {
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  padding: 11px 40px 11px 14px !important;
  color: #111111 !important;
  background-color: #ffffff !important;
  border: 1px solid #e2e2e2 !important;
  border-radius: 10px !important;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.single-product div.product form.cart table.variations select:focus {
  outline: none;
  border-color: rgba(220,57,0,0.75) !important;
  box-shadow: 0 0 0 3px rgba(220,57,0,0.10) !important;
}
.single-product div.product form.cart .reset_variations {
  display: inline-block;
  margin-top: 8px;
  color: #dc3900 !important;
  font-size: 12px;
  text-decoration: none !important;
}
.single-product div.product form.cart .woocommerce-variation-add-to-cart {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
/* the quantity group is exactly as tall as its field, so + and - meet in the middle */
.single-product div.product form.cart .quantity {
  margin: 0 !important;
  height: 46px;
  float: none !important;
}
.single-product div.product form.cart .single_add_to_cart_button {
  min-height: 46px !important;
  height: 46px;
  padding: 0 28px !important;
  float: none !important;
  margin: 0 !important;
}

/* quantity: the field and the theme's stacked + / - buttons as one rounded group */
.woocommerce .quantity input.qty {
  box-sizing: border-box;
  width: 64px !important;
  height: 46px !important;
  padding: 0 6px !important;
  text-align: center;
  color: #111111 !important;
  background: #ffffff !important;
  border: 1px solid #e2e2e2 !important;
  border-right: 0 !important;
  border-radius: 10px 0 0 10px !important;
  box-shadow: none !important;
  font-size: 15px;
  font-weight: 600;
}
.woocommerce .quantity input.qty:focus {
  outline: none;
  border-color: rgba(220,57,0,0.75) !important;
  box-shadow: 0 0 0 3px rgba(220,57,0,0.10) !important;
}
.woocommerce .quantity .si-woo-plus,
.woocommerce .quantity .si-woo-minus {
  width: 30px !important;
  height: 23px !important;
  border: 1px solid #e2e2e2 !important;
  background: #ffffff !important;
  color: #444444 !important;
  line-height: 20px !important;
  transition: background .2s ease, color .2s ease;
}
.woocommerce .quantity .si-woo-plus { border-radius: 0 10px 0 0 !important; }
.woocommerce .quantity .si-woo-minus { border-top: 0 !important; border-radius: 0 0 10px 0 !important; }
.woocommerce .quantity .si-woo-plus:hover,
.woocommerce .quantity .si-woo-minus:hover { background: #fdf3ef !important; color: #dc3900 !important; }
.woocommerce .quantity { padding-right: 30px !important; }

/* meta: SKU, category, the long tag list - quiet small print */
.single-product div.product .product_meta {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #e9ecef;
  font-size: 12px;
  line-height: 1.7;
  color: #888888;
}
.single-product div.product .product_meta .si-woo-meta-title { color: #444444; font-weight: 600; }
.single-product div.product .product_meta a { color: #888888 !important; text-decoration: none !important; box-shadow: none !important; }
.single-product div.product .product_meta a:hover { color: #dc3900 !important; }
.single-product div.product .product_meta a::before { display: none !important; }

/* the theme paints the tab panels as a full-width #f4f4f4 band over the site background: transparent */
.single-product div.product .woocommerce-tabs,
.single-product div.product .woocommerce-tabs .wc-tab,
.single-product div.product .woocommerce-tabs .panel { background: transparent !important; }

/* Description / Reviews tabs */
.single-product .woocommerce-tabs ul.tabs li a { color: #888888 !important; font-weight: 600; }
.single-product .woocommerce-tabs ul.tabs li.active a,
.single-product .woocommerce-tabs ul.tabs li a:hover { color: #111111 !important; }
.single-product .woocommerce-tabs ul.tabs li a::before { background: #dc3900 !important; height: 2px !important; }

/* =========================================================
   3. CART
========================================================= */

.woocommerce-cart .woocommerce-cart-form,
.woocommerce-cart .cart-collaterals .cart_totals {
  box-sizing: border-box;
  padding: 22px 26px;
  background: #ffffff;
  border: 1px solid #e9ecef;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}
.woocommerce-cart .cart-collaterals { margin-top: 24px !important; }

.woocommerce-cart table.shop_table { border: 0 !important; border-collapse: collapse !important; background: none !important; }
.woocommerce-cart table.shop_table thead th {
  padding: 10px 10px !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid #e9ecef !important;
  border-radius: 0 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #888888 !important;
}
.woocommerce-cart table.shop_table td,
.woocommerce-cart table.shop_table tbody th {
  padding: 14px 10px !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  vertical-align: middle;
  color: #444444;
}
.woocommerce-cart table.shop_table td.actions { border-bottom: 0 !important; padding-top: 18px !important; }
.woocommerce-cart table.shop_table .si-woo-thumb img {
  width: 76px !important;
  height: auto;
  border-radius: 10px;
  margin-right: 14px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.10);
}
.woocommerce-cart table.shop_table td.product-name a:not(.si-woo-thumb) {
  color: #111111 !important;
  font-weight: 600;
  text-decoration: none !important;
}
.woocommerce-cart table.shop_table td.product-name a:not(.si-woo-thumb):hover { color: #dc3900 !important; }
.woocommerce-cart table.shop_table a::before { display: none !important; }
.woocommerce-cart table.shop_table td.product-subtotal { color: #111111; font-weight: 700; }
.woocommerce-cart table.shop_table a.remove {
  color: #888888 !important;
  border-radius: 50%;
  transition: color .2s ease, background .2s ease;
}
.woocommerce-cart table.shop_table a.remove:hover { color: #ffffff !important; background: #dc3900 !important; }

/* Update Cart: dark, as the site's second button; Continue Shopping: a plain link */
.woocommerce-cart td.actions .si-btn.btn-secondary {
  padding: 11px 20px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: #111111 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: background .2s ease;
}
.woocommerce-cart td.actions .si-btn.btn-secondary:hover { background: #dc3900 !important; }
.woocommerce-cart td.actions .si-btn.btn-secondary[disabled] { opacity: .45 !important; background: #111111 !important; }
.woocommerce-cart td.actions .btn-text-1 { color: #444444 !important; font-weight: 600; }
.woocommerce-cart td.actions .btn-text-1:hover { color: #dc3900 !important; }
.woocommerce-cart td.actions .btn-text-1 > span::before { background-color: #dc3900 !important; }

/* totals */
.woocommerce-cart .cart_totals h2 {
  margin: 0 0 14px !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #888888;
}
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
  padding: 12px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  background: none !important;
  color: #444444;
  font-weight: 500;
}
.woocommerce-cart .cart_totals table.shop_table .order-total th,
.woocommerce-cart .cart_totals table.shop_table .order-total td {
  border-bottom: 0 !important;
  padding-top: 16px !important;
  color: #111111 !important;
  font-size: 18px;
  font-weight: 700;
}
.woocommerce-cart .cart_totals table.shop_table .order-total .amount { color: #dc3900 !important; }
.woocommerce-cart .wc-proceed-to-checkout { padding-bottom: 0 !important; margin-top: 8px; }
.woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout { width: 100%; justify-content: center; }
.woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout svg { fill: currentColor; }

/* =========================================================
   4. CHECKOUT
========================================================= */

/* "Returning customer? Click here to login" and the coupon note */
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-error {
  border: 1px solid #f3d5c9 !important;
  border-left: 3px solid #dc3900 !important;
  border-radius: 10px;
  background: #fdf3ef !important;
  color: #444444 !important;
}
.woocommerce-checkout .woocommerce-info::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-checkout .woocommerce-error::before { background-color: #dc3900 !important; color: #dc3900 !important; }
.woocommerce-checkout .woocommerce-info a,
.woocommerce-checkout .woocommerce-message a,
.woocommerce-checkout .woocommerce-error a { color: #dc3900 !important; text-decoration: none !important; }
.woocommerce-checkout .woocommerce-info a::before,
.woocommerce-checkout .woocommerce-message a::before,
.woocommerce-checkout .woocommerce-error a::before { display: none !important; }

/* the login form that opens from that note */
.woocommerce-checkout form.woocommerce-form-login {
  padding: 22px 26px !important;
  border: 1px solid #e9ecef !important;
  border-radius: 14px !important;
  background: #ffffff !important;
}
.woocommerce-checkout form.woocommerce-form-login .button {
  padding: 11px 22px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: #111111 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}
.woocommerce-checkout form.woocommerce-form-login .button:hover { background: #dc3900 !important; }

/* billing: a white card */
.woocommerce-checkout #customer_details .col-1 {
  box-sizing: border-box;
  padding: 26px 28px;
  background: #ffffff;
  border: 1px solid #e9ecef;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}
.woocommerce-checkout #customer_details .col-1 h3 {
  position: relative;
  margin: 0 0 22px;
  padding-bottom: 14px;
  color: #111111;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.woocommerce-checkout #customer_details .col-1 h3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 80px;
  height: 1px;
  background: linear-gradient(90deg, #dc3900, transparent);
}
.woocommerce-checkout form.checkout label {
  color: #111111;
  font-size: 13px;
  font-weight: 600;
}
.woocommerce-checkout form.checkout .required { color: #dc3900 !important; border: 0 !important; text-decoration: none !important; }
.woocommerce-checkout form.checkout .optional { color: #888888; font-weight: 400; }
.woocommerce-checkout form.checkout input[type="checkbox"],
.woocommerce-checkout form.checkout input[type="radio"] { accent-color: #dc3900; }

/* order summary: a dark card, as the Custom Development form */
.woocommerce-checkout #order_review_heading {
  margin: 0 !important;
  padding: 26px 28px 0 !important;
  text-align: left !important;
  color: #ffffff !important;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
  border-radius: 14px 14px 0 0;
  background: linear-gradient(135deg, #0e0e0e 0%, #181818 100%) !important;
  z-index: auto !important;
}
.woocommerce-checkout #order_review_heading::after { display: none !important; }
.woocommerce-checkout #order_review {
  padding: 18px 28px 28px !important;
  color: #aaaaaa;
  border-radius: 0 0 14px 14px !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 80% 50% at 100% 100%, rgba(220,57,0,0.14) 0%, rgba(220,57,0,0.0854) 35%, rgba(220,57,0,0.021) 75%, rgba(220,57,0,0) 100%),
    linear-gradient(135deg, #181818 0%, #0e0e0e 100%) !important;
  background-size: 160px 160px, 100% 100%, 100% 100% !important;
  box-shadow: 0 30px 70px rgba(0,0,0,0.22);
}
.woocommerce-checkout #order_review table.shop_table {
  margin: 0 0 20px !important;
  border: 0 !important;
  border-collapse: collapse !important;
  background: none !important;
  color: #cccccc !important;
}
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
  padding: 12px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 0 !important;
  background: none !important;
  color: #cccccc !important;
  font-weight: 500 !important;
}
.woocommerce-checkout #order_review table.shop_table thead th {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #888888 !important;
}
.woocommerce-checkout #order_review table.shop_table .product-name { color: #eeeeee !important; }
.woocommerce-checkout #order_review table.shop_table .amount,
.woocommerce-checkout #order_review table.shop_table strong { color: #eeeeee !important; }
.woocommerce-checkout #order_review table.shop_table tfoot tr:first-child th,
.woocommerce-checkout #order_review table.shop_table tfoot tr:first-child td { border-top: 0 !important; }
.woocommerce-checkout #order_review table.shop_table .order-total th,
.woocommerce-checkout #order_review table.shop_table .order-total td {
  padding-top: 16px !important;
  border-bottom: 0 !important;
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}
.woocommerce-checkout #order_review table.shop_table .order-total .amount { color: #ff5a25 !important; }

/* payment methods */
.woocommerce-checkout #order_review h3 {
  margin: 4px 0 14px !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
}
.woocommerce-checkout #payment {
  background: none !important;
  border-radius: 0 !important;
}
.woocommerce-checkout #payment ul.payment_methods {
  padding: 0 !important;
  margin: 0 0 16px !important;
  border: 0 !important;
}
.woocommerce-checkout #payment ul.payment_methods li {
  padding: 14px 16px !important;
  margin: 0 0 8px !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px;
  background: rgba(255,255,255,0.035) !important;
  color: #eeeeee !important;
}
.woocommerce-checkout #payment ul.payment_methods li label { color: #eeeeee !important; font-weight: 600; }
.woocommerce-checkout #payment div.payment_box {
  margin: 10px 0 0 !important;
  padding: 12px 14px !important;
  border-radius: 8px;
  background: rgba(255,255,255,0.05) !important;
  color: #aaaaaa !important;
  font-size: 13px;
}
.woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.woocommerce-checkout #payment div.form-row.place-order {
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
}

/* privacy, terms and the long legal text: small print on dark */
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper,
.woocommerce-checkout #payment .woocommerce-privacy-policy-text p,
.woocommerce-checkout #payment .woocommerce-terms-and-conditions p {
  color: #888888 !important;
  font-size: 12px !important;
  line-height: 1.65 !important;
}
.woocommerce-checkout #payment .woocommerce-terms-and-conditions {
  max-height: 220px;
  padding: 14px 16px !important;
  margin-bottom: 14px !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px;
  background: rgba(255,255,255,0.025) !important;
  box-shadow: none !important;
}
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper label,
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text {
  color: #cccccc !important;
  font-size: 13px;
}
.woocommerce-checkout #payment a { color: #ff5a25 !important; text-decoration: none !important; box-shadow: none !important; }
.woocommerce-checkout #payment a:hover { color: #ffffff !important; }
.woocommerce-checkout #payment a::before { display: none !important; }
.woocommerce-checkout #place_order { width: 100%; margin-top: 12px !important; }

/* =========================================================
   6. LOADING OVERLAY (Update Cart, checkout, account forms):
   WooCommerce's grey veil with a black spinner -> a light veil with the
   orange shuriken of the site preloader.
========================================================= */
.blockUI.blockOverlay {
  background: rgba(246,246,244,0.65) !important;
  opacity: 1 !important;
  border-radius: 14px;
}
.blockUI.blockOverlay::before,
.woocommerce .loader::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 30px !important;
  height: 30px !important;
  margin: -15px 0 0 -15px !important;
  background: linear-gradient(135deg, #ff5a25 0%, #dc3900 55%, #b92f00 100%) !important;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M12 0C12.9 4.6 13.6 8 14.6 9.4C16 10.4 19.4 11.1 24 12C19.4 12.9 16 13.6 14.6 14.6C13.6 16 12.9 19.4 12 24C11.1 19.4 10.4 16 9.4 14.6C8 13.6 4.6 12.9 0 12C4.6 11.1 8 10.4 9.4 9.4C10.4 8 11.1 4.6 12 0ZM12 10.3A1.7 1.7 0 1 0 12 13.7A1.7 1.7 0 1 0 12 10.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 0 !important;
  animation: asf-wc-spin .9s cubic-bezier(.45,.05,.55,.95) infinite !important;
}
/* the theme's own spinner element inside the overlay, if any */
.blockUI.blockOverlay > *,
.blockUI.blockOverlay::after { display: none !important; }
@keyframes asf-wc-spin { to { transform: rotate(360deg); } }

/* "Cart updated." and other notices on the cart: the site's light orange note */
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error {
  border: 1px solid #f3d5c9 !important;
  border-left: 3px solid #dc3900 !important;
  border-radius: 10px;
  background: #fdf3ef !important;
  color: #444444 !important;
}
.woocommerce-cart .woocommerce-message::before,
.woocommerce-cart .woocommerce-info::before,
.woocommerce-cart .woocommerce-error::before { background-color: #dc3900 !important; color: #dc3900 !important; }
.woocommerce-cart .woocommerce-message a,
.woocommerce-cart .woocommerce-info a { color: #dc3900 !important; }

/* =========================================================
   7. PRODUCT DESCRIPTION: the Quick Start card (Shop/product-description.html,
   pasted into the product's description in the Text tab)
========================================================= */
/* WooCommerce's own "Description" heading above it repeats the tab name */
.single-product #tab-description > .si-container > h2:first-child { display: none; }

.asf-qs {
  position: relative;
  box-sizing: border-box;
  max-width: 820px;
  margin: 50px auto 10px;
  padding: 40px 44px 36px;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.09);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 60% 70% at 100% 0%, rgba(220,57,0,0.16) 0%, rgba(220,57,0,0.1356) 16%, rgba(220,57,0,0.0976) 35%, rgba(220,57,0,0.0576) 55%, rgba(220,57,0,0.024) 75%, rgba(220,57,0,0.0008) 93%, rgba(220,57,0,0) 100%),
    linear-gradient(135deg, #0e0e0e 0%, #181818 55%, #0e0e0e 100%);
  background-size: 160px 160px, 100% 100%, 100% 100%;
  box-shadow: 0 30px 70px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.035);
  color: #aaaaaa;
  font-size: 15px;
  line-height: 1.7;
}
.asf-qs::before {
  content: "";
  position: absolute;
  top: 0;
  left: 9%;
  right: 9%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(220,57,0,0.75), transparent);
}
/* the editor may add empty paragraphs and line breaks around the markup */
.asf-qs br { display: none; }
.asf-qs p:empty { display: none; }
.asf-qs p { margin: 0; }
.asf-qs strong { color: #ffffff; font-weight: 600; }

/* title and the current version */
.asf-qs-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin-bottom: 26px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.asf-qs-head h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  line-height: 1.15 !important;
}
.asf-qs-version { font-size: 13px; color: #888888; }
.asf-qs-version strong { color: #cccccc; font-weight: 600; }

/* the two steps, numbered */
.asf-qs-steps {
  margin: 0 0 22px !important;
  padding: 0 !important;
  list-style: none !important;
  counter-reset: asf-qs;
}
.asf-qs-steps li {
  counter-increment: asf-qs;
  position: relative;
  margin: 0 0 16px !important;
  padding: 0 0 0 46px !important;
  list-style: none !important;
  color: #cccccc;
}
.asf-qs-steps li:last-child { margin-bottom: 0 !important; }
.asf-qs-steps li::before {
  content: counter(asf-qs);
  position: absolute;
  left: 0;
  top: -2px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ff5a25 0%, #dc3900 100%);
  box-shadow: 0 0 14px rgba(220,57,0,0.35);
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

/* requirement */
.asf-qs-req {
  margin: 0 0 26px;
  padding: 12px 16px;
  border-radius: 10px;
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.08);
  color: #aaaaaa;
  font-size: 14px;
}

/* recommended reading: two link cards with the "opens a page" icon */
.asf-qs-reading {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.asf-qs-label {
  flex: 1 1 100%;
  margin-bottom: 2px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #888888;
}
.asf-qs-reading a {
  flex: 1 1 220px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  background: rgba(255,255,255,0.03);
  color: #eeeeee !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.asf-qs-reading a::after {
  content: "";
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  background-color: #ff5a25;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Cpath d='M9 15l6-6'/%3E%3Cpath d='M10 9h5v5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Cpath d='M9 15l6-6'/%3E%3Cpath d='M10 9h5v5'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform .2s ease;
}
.asf-qs-reading a::before { display: none !important; }
.asf-qs-reading a:hover {
  border-color: rgba(255,90,37,0.7);
  background: rgba(220,57,0,0.08);
  color: #ffffff !important;
}
.asf-qs-reading a:hover::after { transform: translate(1px, -1px); }

/* rails: thin orange lines from the card's sides to the edges of the screen, a dot where they meet the card,
   so the card sits on a line of the page instead of floating alone (420 = half of the 840 px card + 10 px gap) */
.single-product #tab-description:has(.asf-qs) { position: relative; }
.single-product #tab-description:has(.asf-qs)::before,
.single-product #tab-description:has(.asf-qs)::after {
  content: "";
  /* the theme's clearfix makes these display:table, and an absolute table shrinks to 0 width */
  display: block !important;
  clear: none !important;
  position: absolute;
  top: calc(50% + 20px);
  height: 7px;
  margin-top: -3px;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
}
.single-product #tab-description:has(.asf-qs)::before {
  left: 0;
  right: calc(50% + 420px);
  background-image:
    radial-gradient(circle, #dc3900 0 3px, transparent 3.5px),
    linear-gradient(90deg, rgba(220,57,0,0) 0%, rgba(220,57,0,0.10) 40%, rgba(220,57,0,0.55) 100%);
  background-size: 7px 7px, 100% 1px;
  background-position: right center, left center;
}
.single-product #tab-description:has(.asf-qs)::after {
  left: calc(50% + 420px);
  right: 0;
  background-image:
    radial-gradient(circle, #dc3900 0 3px, transparent 3.5px),
    linear-gradient(90deg, rgba(220,57,0,0.55) 0%, rgba(220,57,0,0.10) 60%, rgba(220,57,0,0) 100%);
  background-size: 7px 7px, 100% 1px;
  background-position: left center, left center;
}
.asf-qs { z-index: 1; }
@media screen and (max-width: 960px) {
  .single-product #tab-description:has(.asf-qs)::before,
  .single-product #tab-description:has(.asf-qs)::after { display: none; }
}

@media screen and (max-width: 600px) {
  .asf-qs { margin-top: 30px; padding: 28px 20px 24px; border-radius: 14px; }
  .asf-qs-head h2 { font-size: 24px !important; }
  .asf-qs-steps li { padding-left: 42px !important; }
}

/* =========================================================
   5. PHONES
========================================================= */
@media screen and (max-width: 768px) {
  .woocommerce-cart .woocommerce-cart-form,
  .woocommerce-cart .cart-collaterals .cart_totals,
  .woocommerce-checkout #customer_details .col-1 { padding: 18px 16px; }
  .woocommerce-checkout #order_review_heading { padding: 20px 18px 0 !important; }
  .woocommerce-checkout #order_review { padding: 14px 18px 20px !important; }
  .woocommerce-cart table.shop_table .si-woo-thumb img { width: 56px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .single-product div.product form.cart .single_add_to_cart_button,
  .woocommerce-cart .wc-proceed-to-checkout .si-woo-checkout,
  .woocommerce-checkout #place_order { transition: none; }
}


/* #########################################################
   GAMIPRESS PAGES   (GamiPress pages/gamipress-pages.css)
   ######################################################### */

/* =========================================================
   ASF GamiPress pages: /ranks/ (Ranks list block) and /achievements/
   (Achievements list blocks). Same cards as the My Account Rank tab.
   Only .gamipress-ranks-list and .gamipress-achievements-list are styled,
   so the Rank tab (user rank / earnings blocks) is not touched.
   Paste into: Appearance -> Customize -> Additional CSS
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* ---------- shared: requirement / step lists as a checklist ---------- */
.gamipress-ranks-list .gamipress-rank-requirements-heading,
.gamipress-achievements-list .gamipress-achievement-steps-heading {
  margin: 14px 0 8px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #888888 !important;
}
.gamipress-ranks-list ul.gamipress-rank-requirements,
.gamipress-achievements-list ul.gamipress-achievement-steps {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.gamipress-ranks-list ul.gamipress-rank-requirements li,
.gamipress-achievements-list ul.gamipress-achievement-steps li {
  position: relative;
  margin: 0 0 6px !important;
  padding: 0 0 0 24px !important;
  list-style: none !important;
  font-size: 13px;
  line-height: 1.5;
  color: #444444;
  text-align: left;
}
.gamipress-ranks-list ul.gamipress-rank-requirements li::before,
.gamipress-achievements-list ul.gamipress-achievement-steps li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1.5px solid #cfcfcf;
  box-sizing: border-box;
}
/* done: an orange check */
.gamipress-ranks-list ul.gamipress-rank-requirements li.user-has-earned,
.gamipress-achievements-list ul.gamipress-achievement-steps li.user-has-earned { color: #111111; }
.gamipress-ranks-list ul.gamipress-rank-requirements li.user-has-earned::before,
.gamipress-achievements-list ul.gamipress-achievement-steps li.user-has-earned::before {
  border: 0;
  background-color: #dc3900;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' fill='black' d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zm3.6 5.3a.9.9 0 0 0-1.3 0L7 8.6 5.7 7.3a.9.9 0 1 0-1.3 1.3l2 2a.9.9 0 0 0 1.3 0l4-4a.9.9 0 0 0 0-1.3z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' fill='black' d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zm3.6 5.3a.9.9 0 0 0-1.3 0L7 8.6 5.7 7.3a.9.9 0 1 0-1.3 1.3l2 2a.9.9 0 0 0 1.3 0l4-4a.9.9 0 0 0 0-1.3z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- /ranks/: a grid of rank cards ---------- */
.gamipress-ranks-list .gamipress-rank-type-title {
  margin: 8px 0 18px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #888888 !important;
}
.gamipress-ranks-list .gamipress-ranks-container {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  counter-reset: asf-rank;
}
.gamipress-ranks-list .gamipress-ranks-container > .gamipress-rank {
  counter-increment: asf-rank;
  position: relative;
  box-sizing: border-box;
  width: auto !important;
  margin: 0 !important;
  padding: 28px 22px 22px !important;
  float: none !important;
  text-align: center;
  background: #ffffff;
  border: 1px solid #e9ecef !important;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.gamipress-ranks-list .gamipress-ranks-container > .gamipress-rank:hover {
  transform: translateY(-3px);
  border-color: rgba(220,57,0,0.35) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,0.08), 0 0 18px rgba(220,57,0,0.08);
}
/* rank number in the corner: "01", "02" ... */
.gamipress-ranks-list .gamipress-ranks-container > .gamipress-rank::before {
  content: counter(asf-rank, decimal-leading-zero);
  position: absolute;
  top: 14px;
  left: 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #cfcfcf;
}
.gamipress-ranks-list .gamipress-rank-image {
  float: none !important;
  width: auto !important;
  margin: 0 auto 4px !important;
}
.gamipress-ranks-list .gamipress-rank-image img {
  width: 88px !important;
  height: 88px !important;
  object-fit: cover;
  border-radius: 50%;
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px #e9ecef;
  transition: box-shadow .22s ease;
}
.gamipress-ranks-list .gamipress-rank:hover .gamipress-rank-image img { box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px #dc3900; }
.gamipress-ranks-list .gamipress-rank-description { float: none !important; width: auto !important; }
.gamipress-ranks-list .gamipress-rank-title {
  margin: 14px 0 0 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
}
.gamipress-ranks-list .gamipress-rank-title a {
  color: #111111 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.gamipress-ranks-list .gamipress-rank-title a:hover { color: #dc3900 !important; }
.gamipress-ranks-list .gamipress-rank-title a::before { display: none !important; }
.gamipress-ranks-list .gamipress-rank-excerpt:empty { display: none; }
.gamipress-ranks-list .gamipress-rank-requirements {
  margin-top: 6px;
  padding-top: 4px;
  border-top: 1px solid #f3f4f6;
}

/* logged in: ranks not reached yet are quieter */
body.logged-in .gamipress-ranks-list .gamipress-rank.user-has-not-earned .gamipress-rank-image img {
  filter: grayscale(1);
  opacity: .55;
}

/* logged in: the current rank as the dark card of the Rank tab */
.gamipress-ranks-list .gamipress-rank.current-user-rank {
  border-color: transparent !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E"),
    radial-gradient(closest-side circle at 50% 28%, rgba(220,57,0,0.30) 0%, rgba(220,57,0,0.18) 35%, rgba(220,57,0,0.05) 75%, rgba(220,57,0,0) 100%),
    linear-gradient(135deg, #070707 0%, #0f0f0f 55%, #070707 100%) !important;
  background-size: 160px 160px, 100% 100%, 100% 100% !important;
  box-shadow: 0 18px 40px -8px rgba(0,0,0,0.35), 0 0 0 6px rgba(220,57,0,0.05), 0 0 36px rgba(220,57,0,0.16);
}
.gamipress-ranks-list .gamipress-rank.current-user-rank .gamipress-rank-title a { color: #f2ede4 !important; }
.gamipress-ranks-list .gamipress-rank.current-user-rank .gamipress-rank-image img { box-shadow: 0 0 0 3px #141414, 0 0 0 5px #dc3900; }
.gamipress-ranks-list .gamipress-rank.current-user-rank ul.gamipress-rank-requirements li { color: #cccccc; }
.gamipress-ranks-list .gamipress-rank.current-user-rank .gamipress-rank-requirements { border-top-color: rgba(255,255,255,0.08); }
.gamipress-ranks-list .gamipress-rank.current-user-rank::before { color: #ff5a25; }

/* ---------- /achievements/: one card per achievement ---------- */
.gamipress-achievements-list .gamipress-achievements-container {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
/* the grid follows the block's own "Columns" setting */
.gamipress-achievements-list .gamipress-achievements-container.gamipress-columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gamipress-achievements-list .gamipress-achievements-container.gamipress-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gamipress-achievements-list .gamipress-achievements-container.gamipress-columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gamipress-achievements-list .gamipress-achievements-container > .gamipress-achievement {
  display: flex !important;
  align-items: flex-start;
  gap: 16px;
  box-sizing: border-box;
  width: auto !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  float: none !important;
  background: #ffffff;
  border: 1px solid #e9ecef !important;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.gamipress-achievements-list .gamipress-achievements-container > .gamipress-achievement:hover {
  transform: translateY(-2px);
  border-color: rgba(220,57,0,0.35) !important;
  box-shadow: 0 12px 26px rgba(0,0,0,0.07), 0 0 16px rgba(220,57,0,0.07);
}
.gamipress-achievements-list .gamipress-achievement-image {
  flex: 0 0 64px;
  width: 64px !important;
  margin: 0 !important;
  float: none !important;
}
.gamipress-achievements-list .gamipress-achievement-image img {
  width: 64px !important;
  height: 64px !important;
  object-fit: contain;
}
.gamipress-achievements-list .gamipress-achievement-description {
  flex: 1;
  min-width: 0;
  float: none !important;
  width: auto !important;
}
.gamipress-achievements-list .gamipress-achievement-title {
  margin: 2px 0 0 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}
.gamipress-achievements-list .gamipress-achievement-title a {
  color: #111111 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.gamipress-achievements-list .gamipress-achievement-title a:hover { color: #dc3900 !important; }
.gamipress-achievements-list .gamipress-achievement-title a::before { display: none !important; }
.gamipress-achievements-list .gamipress-achievement-excerpt:empty { display: none; }
.gamipress-achievements-list .gamipress-achievement-steps-heading { margin-top: 10px !important; }

.gamipress-achievements-list .gamipress-achievement { position: relative; }
.gamipress-achievements-list .gamipress-achievement:has(.gamipress-share-buttons) { padding-bottom: 54px !important; }
.gamipress-achievements-list .gamipress-share-buttons-label { display: none !important; }
.gamipress-achievements-list .gamipress-share-buttons {
  position: absolute;
  right: 18px;
  bottom: 14px;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 6px;
  margin: 0 !important;
  opacity: 1 !important;
}
.gamipress-achievements-list .gamipress-share-button {
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  background-size: 14px 14px !important;
  transition: transform .2s ease, filter .2s ease;
}
.gamipress-achievements-list .gamipress-share-button:hover { transform: translateY(-1px); filter: brightness(1.1); }

/* steps: plain text, no theme link colour, no strike-through on done steps */
.gamipress-achievements-list ul.gamipress-achievement-steps li,
.gamipress-ranks-list ul.gamipress-rank-requirements li { text-decoration: none !important; }
.gamipress-achievements-list ul.gamipress-achievement-steps li a,
.gamipress-ranks-list ul.gamipress-rank-requirements li a {
  color: inherit !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.gamipress-achievements-list ul.gamipress-achievement-steps li a::before,
.gamipress-ranks-list ul.gamipress-rank-requirements li a::before { display: none !important; }
.gamipress-achievements-list ul.gamipress-achievement-steps li a:hover,
.gamipress-ranks-list ul.gamipress-rank-requirements li a:hover { color: #dc3900 !important; }

/* logged in: earned achievements stand out, the rest quieter */
body.logged-in .gamipress-achievements-list .gamipress-achievement.user-has-not-earned .gamipress-achievement-image img { filter: grayscale(1); opacity: .55; }
.gamipress-achievements-list .gamipress-achievement.user-has-earned { border-color: rgba(220,57,0,0.35) !important; background: linear-gradient(135deg, #fffaf7 0%, #ffffff 100%); }

/* Load More */
.gamipress-achievements-list .gamipress-load-more-button {
  display: block;
  margin: 16px auto 0;
  padding: 10px 22px;
  border: 1px solid #dc3900;
  border-radius: 9px;
  background: transparent;
  color: #dc3900;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
.gamipress-achievements-list .gamipress-load-more-button:hover { background: #dc3900; color: #ffffff; }

/* ---------- phones and tablets ---------- */
@media screen and (max-width: 960px) {
  .gamipress-ranks-list .gamipress-ranks-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gamipress-achievements-list .gamipress-achievements-container.gamipress-columns-3,
  .gamipress-achievements-list .gamipress-achievements-container.gamipress-columns-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 600px) {
  .gamipress-ranks-list .gamipress-ranks-container { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .gamipress-achievements-list .gamipress-achievements-container[class*="gamipress-columns"] { grid-template-columns: minmax(0, 1fr); }
  .gamipress-achievements-list .gamipress-achievements-container > .gamipress-achievement { padding: 16px; gap: 12px; }
  .gamipress-achievements-list .gamipress-achievement-image,
  .gamipress-achievements-list .gamipress-achievement-image img { width: 52px !important; height: 52px !important; flex-basis: 52px; }
}

@media (prefers-reduced-motion: reduce) {
  .gamipress-ranks-list .gamipress-ranks-container > .gamipress-rank,
  .gamipress-achievements-list .gamipress-achievements-container > .gamipress-achievement { transition: none; }
}

/* =========================================================
   SINGLE RANK / ACHIEVEMENT PAGES (/rank/jonin/, /discoverer-ninja/sai/ ...)
   One centred dark card: big image, reward, requirements, credential.
========================================================= */
.rank-wrap.single-rank,
.achievement-wrap.single-achievement {
  position: relative;
  box-sizing: border-box;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  max-width: 560px;
  margin: 10px auto 22px !important;
  padding: 44px 40px 36px !important;
  overflow: hidden;
  text-align: center;
  color: #cccccc;
  border-radius: 18px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E"),
    radial-gradient(closest-side circle at 50% 24%, rgba(220,57,0,0.30) 0%, rgba(220,57,0,0.18) 35%, rgba(220,57,0,0.05) 75%, rgba(220,57,0,0) 100%),
    radial-gradient(farthest-side circle at 50% 135%, rgba(220,57,0,0.30) 0%, rgba(220,57,0,0.12) 45%, rgba(220,57,0,0) 100%),
    linear-gradient(135deg, #070707 0%, #0f0f0f 55%, #070707 100%);
  background-size: 160px 160px, 100% 100%, 100% 100%, 100% 100%;
  box-shadow: 0 22px 50px -10px rgba(0,0,0,0.40), 0 0 0 6px rgba(220,57,0,0.05), 0 0 40px rgba(220,57,0,0.14);
}
/* thin orange edge on top */
.rank-wrap.single-rank::before,
.achievement-wrap.single-achievement::before {
  content: "";
  position: absolute;
  top: 0;
  left: 12%;
  right: 12%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,90,37,0.85), transparent);
}

/* image */
.rank-wrap.single-rank .gamipress-rank-image,
.achievement-wrap.single-achievement .gamipress-achievement-image {
  float: none !important;
  width: auto !important;
  margin: 0 0 6px !important;
}
.rank-wrap.single-rank .gamipress-rank-image img,
.achievement-wrap.single-achievement .gamipress-achievement-image img {
  width: 132px !important;
  height: 132px !important;
  object-fit: cover;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #141414, 0 0 0 6px #dc3900, 0 0 34px rgba(220,57,0,0.35);
}
.achievement-wrap.single-achievement .gamipress-achievement-image img { object-fit: contain; background: rgba(255,255,255,0.04); }

/* description column */
.rank-wrap.single-rank .gamipress-rank-description,
.achievement-wrap.single-achievement .gamipress-achievement-description {
  float: none !important;
  width: 100% !important;
  max-width: 420px;
  margin: 0 !important;
  padding: 0 !important;
}

/* reward in tokens (achievements) */
.achievement-wrap.single-achievement .gamipress-achievement-points {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 16px 0 4px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255,90,37,0.12);
  border: 1px solid rgba(255,90,37,0.35);
  color: #ffd9c7;
  font-size: 14px;
  font-weight: 700;
}
.achievement-wrap.single-achievement .gamipress-achievement-points img {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}
.achievement-wrap.single-achievement .gamipress-achievement-points img:first-child { display: none; }

/* requirements / steps on dark */
.rank-wrap.single-rank .gamipress-rank-requirements-heading,
.achievement-wrap.single-achievement .gamipress-achievement-steps-heading {
  margin: 22px 0 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #888888 !important;
}
.rank-wrap.single-rank ul.gamipress-rank-requirements,
.achievement-wrap.single-achievement ul.gamipress-achievement-steps {
  margin: 0 !important;
  padding: 14px 16px !important;
  list-style: none !important;
  text-align: left;
  border-radius: 12px;
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.08);
}
.rank-wrap.single-rank ul.gamipress-rank-requirements li,
.achievement-wrap.single-achievement ul.gamipress-achievement-steps li {
  position: relative;
  margin: 0 0 8px !important;
  padding: 0 0 0 26px !important;
  list-style: none !important;
  color: #cccccc;
  font-size: 14px;
  line-height: 1.5;
  text-decoration: none !important;
}
.rank-wrap.single-rank ul.gamipress-rank-requirements li:last-child,
.achievement-wrap.single-achievement ul.gamipress-achievement-steps li:last-child { margin-bottom: 0 !important; }
.rank-wrap.single-rank ul.gamipress-rank-requirements li::before,
.achievement-wrap.single-achievement ul.gamipress-achievement-steps li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 17px;
  height: 17px;
  box-sizing: border-box;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.3);
}
.rank-wrap.single-rank ul.gamipress-rank-requirements li.user-has-earned,
.achievement-wrap.single-achievement ul.gamipress-achievement-steps li.user-has-earned { color: #ffffff; }
.rank-wrap.single-rank ul.gamipress-rank-requirements li.user-has-earned::before,
.achievement-wrap.single-achievement ul.gamipress-achievement-steps li.user-has-earned::before {
  border: 0;
  background-color: #ff5a25;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' fill='black' d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zm3.6 5.3a.9.9 0 0 0-1.3 0L7 8.6 5.7 7.3a.9.9 0 1 0-1.3 1.3l2 2a.9.9 0 0 0 1.3 0l4-4a.9.9 0 0 0 0-1.3z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' fill='black' d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zm3.6 5.3a.9.9 0 0 0-1.3 0L7 8.6 5.7 7.3a.9.9 0 1 0-1.3 1.3l2 2a.9.9 0 0 0 1.3 0l4-4a.9.9 0 0 0 0-1.3z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.rank-wrap.single-rank ul li a,
.achievement-wrap.single-achievement ul li a {
  color: inherit !important;
  text-decoration: none !important;
  box-shadow: none !important;
  border-bottom: 1px dotted rgba(255,255,255,0.3);
}
.rank-wrap.single-rank ul li a:hover,
.achievement-wrap.single-achievement ul li a:hover { color: #ff5a25 !important; border-bottom-color: #ff5a25; }
.rank-wrap.single-rank ul li a::before,
.achievement-wrap.single-achievement ul li a::before { display: none !important; }

/* share buttons, if shown: a centred row */
.rank-wrap.single-rank .gamipress-share-buttons-label,
.achievement-wrap.single-achievement .gamipress-share-buttons-label { display: none !important; }
.rank-wrap.single-rank .gamipress-share-buttons,
.achievement-wrap.single-achievement .gamipress-share-buttons {
  display: flex !important;
  justify-content: center;
  gap: 8px;
  margin: 16px 0 0 !important;
  opacity: 1 !important;
}

/* logged in, not earned yet: the image dimmed; earned: a label under the image */
body.logged-in article.user-has-not-earned .rank-wrap.single-rank .gamipress-rank-image img,
body.logged-in article.user-has-not-earned .achievement-wrap.single-achievement .gamipress-achievement-image img {
  filter: grayscale(1);
  opacity: .6;
  box-shadow: 0 0 0 4px #141414, 0 0 0 6px rgba(255,255,255,0.18);
}
article.user-has-earned .rank-wrap.single-rank .gamipress-rank-image::after,
article.user-has-earned .achievement-wrap.single-achievement .gamipress-achievement-image::after {
  content: "Earned";
  display: table;
  margin: 12px auto 0;
  padding: 3px 12px;
  border-radius: 999px;
  background: rgba(255,90,37,0.16);
  border: 1px solid rgba(255,90,37,0.4);
  color: #ffd9c7;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* View Credential: under the card, centred, as an outline button */
.entry-content > .gamipress-credentials-links { text-align: center; margin: 0 0 10px; }
.entry-content > .gamipress-credentials-links .gamipress-credential-link {
  display: inline-block;
  padding: 10px 22px;
  border: 1px solid #dc3900;
  border-radius: 9px;
  color: #dc3900 !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background .2s ease, color .2s ease;
}
.entry-content > .gamipress-credentials-links .gamipress-credential-link:hover { background: #dc3900; color: #ffffff !important; }
.entry-content > .gamipress-credentials-links .gamipress-credential-link::before { display: none !important; }

@media screen and (max-width: 600px) {
  .rank-wrap.single-rank,
  .achievement-wrap.single-achievement { padding: 34px 20px 26px !important; border-radius: 14px; }
  .rank-wrap.single-rank .gamipress-rank-image img,
  .achievement-wrap.single-achievement .gamipress-achievement-image img { width: 108px !important; height: 108px !important; }
}

/* ---------- single pages: order and the congratulations letter ----------
   card first, then the "You have earned..." line, the congratulations, the credential button */
.entry-content:has(> .achievement-wrap.single-achievement),
.entry-content:has(> .rank-wrap.single-rank) {
  display: flex;
  flex-direction: column;
}
.entry-content > .achievement-wrap.single-achievement,
.entry-content > .rank-wrap.single-rank { order: 1; }
.entry-content:has(> .achievement-wrap.single-achievement) > [class*="earned"]:not(.achievement-wrap):not(.rank-wrap),
.entry-content:has(> .rank-wrap.single-rank) > [class*="earned"]:not(.achievement-wrap):not(.rank-wrap) { order: 2; }
.entry-content > .gamipress-achievement-congratulations,
.entry-content > .gamipress-rank-congratulations { order: 3; }
.entry-content:has(> .achievement-wrap.single-achievement) > .gamipress-credentials-links,
.entry-content:has(> .rank-wrap.single-rank) > .gamipress-credentials-links { order: 4; }

/* "You have earned this ...": a quiet centred line under the card */
.entry-content:has(> .achievement-wrap.single-achievement) > [class*="earned"]:not(.achievement-wrap):not(.rank-wrap),
.entry-content:has(> .rank-wrap.single-rank) > [class*="earned"]:not(.achievement-wrap):not(.rank-wrap) {
  margin: -6px auto 14px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  text-align: center;
  color: #888888;
  font-size: 13px;
}
.entry-content:has(> .achievement-wrap.single-achievement) > [class*="earned"]:not(.achievement-wrap):not(.rank-wrap) p,
.entry-content:has(> .rank-wrap.single-rank) > [class*="earned"]:not(.achievement-wrap):not(.rank-wrap) p { margin: 0 !important; }

/* the congratulations letter: a white card under the dark one */
.gamipress-achievement-congratulations,
.gamipress-rank-congratulations {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 680px;
  margin: 0 auto 22px !important;
  padding: 30px 34px 26px !important;
  background: #ffffff !important;
  border: 1px solid #e9ecef;
  border-radius: 14px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  color: #444444;
  font-size: 14px;
  line-height: 1.75;
  text-align: left;
}
.gamipress-achievement-congratulations::before,
.gamipress-rank-congratulations::before {
  content: "";
  position: absolute;
  top: 0;
  left: 34px;
  width: 80px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, #dc3900, transparent);
}
.gamipress-achievement-congratulations h1,
.gamipress-achievement-congratulations h2,
.gamipress-achievement-congratulations h3,
.gamipress-rank-congratulations h1,
.gamipress-rank-congratulations h2,
.gamipress-rank-congratulations h3 {
  margin: 0 0 12px !important;
  color: #111111 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em;
}
.gamipress-achievement-congratulations h2 ~ h2,
.gamipress-achievement-congratulations h3,
.gamipress-rank-congratulations h2 ~ h2,
.gamipress-rank-congratulations h3 {
  margin-top: 22px !important;
  font-size: 16px !important;
}
.gamipress-achievement-congratulations p,
.gamipress-rank-congratulations p {
  margin: 0 0 12px !important;
  color: #444444 !important;
  font-size: 13.5px !important;
  line-height: 1.75 !important;
}
.gamipress-achievement-congratulations p:last-child,
.gamipress-rank-congratulations p:last-child { margin-bottom: 0 !important; }
.gamipress-achievement-congratulations strong,
.gamipress-rank-congratulations strong { color: #111111; }
.gamipress-achievement-congratulations em,
.gamipress-rank-congratulations em { color: #888888; }
.gamipress-achievement-congratulations a,
.gamipress-rank-congratulations a { color: #dc3900 !important; text-decoration: none !important; box-shadow: none !important; }
.gamipress-achievement-congratulations a::before,
.gamipress-rank-congratulations a::before { display: none !important; }

@media screen and (max-width: 600px) {
  .gamipress-achievement-congratulations,
  .gamipress-rank-congratulations { padding: 24px 20px 20px !important; }
  .gamipress-achievement-congratulations::before,
  .gamipress-rank-congratulations::before { left: 20px; }
}

/* ---------- one colour tone for all rank and achievement icons ----------
   The icons come from one author but differ a lot in colour. A light warm filter pulls them
   towards the site's orange; hovering shows the original colours.
   Tune one line: --asf-icon-tone (less sepia / grayscale = closer to the originals).
   Not-earned icons keep their own grey filter (those rules are more specific). */
:root { --asf-icon-tone: grayscale(.3) sepia(.35) saturate(1.25) hue-rotate(-12deg) contrast(1.04); }
img.gamipress-rank-thumbnail,
img.gamipress-achievement-thumbnail {
  filter: var(--asf-icon-tone);
  transition: filter .3s ease;
}
a:hover > img.gamipress-rank-thumbnail,
a:hover > img.gamipress-achievement-thumbnail,
.gamipress-rank:not(.user-has-not-earned):hover img.gamipress-rank-thumbnail,
.gamipress-achievement:not(.user-has-not-earned):hover img.gamipress-achievement-thumbnail { filter: none; }

/* =========================================================
   TYPE ARCHIVES: /discoverer-ninja/, /titan-ninja/, /rank/
   The theme lists them as blog posts (512 px image, title, Read More);
   here they become the same grid of cards as /ranks/.
   A new achievement type: add its body class to the three lines below.
========================================================= */
.post-type-archive-discoverer-ninja #content,
.post-type-archive-titan-ninja #content,
.post-type-archive-rank #content {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}
.post-type-archive-discoverer-ninja #content > :not(article),
.post-type-archive-titan-ninja #content > :not(article),
.post-type-archive-rank #content > :not(article) { grid-column: 1 / -1; }

.post-type-archive-discoverer-ninja #content > article,
.post-type-archive-titan-ninja #content > article,
.post-type-archive-rank #content > article {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
.post-type-archive-discoverer-ninja .si-blog-entry-content,
.post-type-archive-titan-ninja .si-blog-entry-content,
.post-type-archive-rank .si-blog-entry-content {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  padding: 30px 22px 22px !important;
  text-align: center;
  background: #ffffff;
  border: 1px solid #e9ecef;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.post-type-archive-discoverer-ninja article:hover .si-blog-entry-content,
.post-type-archive-titan-ninja article:hover .si-blog-entry-content,
.post-type-archive-rank article:hover .si-blog-entry-content {
  transform: translateY(-3px);
  border-color: rgba(220,57,0,0.35);
  box-shadow: 0 14px 30px rgba(0,0,0,0.08), 0 0 18px rgba(220,57,0,0.08);
}

/* the image: round, 96 px, in the shared icon tone */
.post-type-archive-discoverer-ninja .post-thumb,
.post-type-archive-titan-ninja .post-thumb,
.post-type-archive-rank .post-thumb {
  width: auto !important;
  margin: 0 0 6px !important;
}
.post-type-archive-discoverer-ninja .post-thumb img,
.post-type-archive-titan-ninja .post-thumb img,
.post-type-archive-rank .post-thumb img {
  width: 96px !important;
  height: 96px !important;
  object-fit: cover;
  border-radius: 50%;
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px #e9ecef;
  filter: var(--asf-icon-tone);
  transition: box-shadow .22s ease, filter .3s ease;
}
.post-type-archive-titan-ninja .post-thumb img,
.post-type-archive-discoverer-ninja .post-thumb img { object-fit: contain; background: #fafafa; }
.post-type-archive-discoverer-ninja article:hover .post-thumb img,
.post-type-archive-titan-ninja article:hover .post-thumb img,
.post-type-archive-rank article:hover .post-thumb img {
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px #dc3900;
  filter: none;
}

/* title */
.post-type-archive-discoverer-ninja .entry-header,
.post-type-archive-titan-ninja .entry-header,
.post-type-archive-rank .entry-header { margin: 12px 0 0 !important; }
.post-type-archive-discoverer-ninja .entry-title,
.post-type-archive-titan-ninja .entry-title,
.post-type-archive-rank .entry-title {
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em;
}
.post-type-archive-discoverer-ninja .entry-title a,
.post-type-archive-titan-ninja .entry-title a,
.post-type-archive-rank .entry-title a {
  color: #111111 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.post-type-archive-discoverer-ninja .entry-title a:hover,
.post-type-archive-titan-ninja .entry-title a:hover,
.post-type-archive-rank .entry-title a:hover { color: #dc3900 !important; }
.post-type-archive-discoverer-ninja .entry-title a::before,
.post-type-archive-titan-ninja .entry-title a::before,
.post-type-archive-rank .entry-title a::before { display: none !important; }
.post-type-archive-discoverer-ninja .entry-summary:empty,
.post-type-archive-titan-ninja .entry-summary:empty,
.post-type-archive-rank .entry-summary:empty,
.post-type-archive-discoverer-ninja .entry-summary:not(:has(*)),
.post-type-archive-titan-ninja .entry-summary:not(:has(*)),
.post-type-archive-rank .entry-summary:not(:has(*)) { display: none; }
.post-type-archive-discoverer-ninja .entry-summary,
.post-type-archive-titan-ninja .entry-summary,
.post-type-archive-rank .entry-summary { margin: 8px 0 0; font-size: 13px; color: #444444; }

/* Read More: a small orange outline button at the bottom of the card */
.post-type-archive-discoverer-ninja .entry-footer,
.post-type-archive-titan-ninja .entry-footer,
.post-type-archive-rank .entry-footer { margin: auto 0 0 !important; padding-top: 14px; }
.post-type-archive-discoverer-ninja .entry-footer .si-btn,
.post-type-archive-titan-ninja .entry-footer .si-btn,
.post-type-archive-rank .entry-footer .si-btn {
  display: inline-block;
  padding: 7px 16px !important;
  border: 1px solid #dc3900 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #dc3900 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  transition: background .2s ease, color .2s ease;
}
.post-type-archive-discoverer-ninja .entry-footer .si-btn:hover,
.post-type-archive-titan-ninja .entry-footer .si-btn:hover,
.post-type-archive-rank .entry-footer .si-btn:hover { background: #dc3900 !important; color: #ffffff !important; }
/* no theme underline on Read More, whichever way the theme draws it */
.post-type-archive-discoverer-ninja .entry-footer .si-btn::before,
.post-type-archive-titan-ninja .entry-footer .si-btn::before,
.post-type-archive-rank .entry-footer .si-btn::before,
.post-type-archive-discoverer-ninja .entry-footer .si-btn::after,
.post-type-archive-titan-ninja .entry-footer .si-btn::after,
.post-type-archive-rank .entry-footer .si-btn::after,
.post-type-archive-discoverer-ninja .entry-footer .si-btn > span::before,
.post-type-archive-titan-ninja .entry-footer .si-btn > span::before,
.post-type-archive-rank .entry-footer .si-btn > span::before,
.post-type-archive-discoverer-ninja .entry-footer .si-btn > span::after,
.post-type-archive-titan-ninja .entry-footer .si-btn > span::after,
.post-type-archive-rank .entry-footer .si-btn > span::after { display: none !important; content: none !important; }
.post-type-archive-discoverer-ninja .entry-footer .si-btn,
.post-type-archive-titan-ninja .entry-footer .si-btn,
.post-type-archive-rank .entry-footer .si-btn,
.post-type-archive-discoverer-ninja .entry-footer .si-btn > span,
.post-type-archive-titan-ninja .entry-footer .si-btn > span,
.post-type-archive-rank .entry-footer .si-btn > span {
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}
.post-type-archive-discoverer-ninja .entry-footer .si-btn > span,
.post-type-archive-titan-ninja .entry-footer .si-btn > span,
.post-type-archive-rank .entry-footer .si-btn > span { padding: 0 !important; }

/* archive cards: the card fills its grid cell through flex, not height:100%, and nothing clips the button */
.post-type-archive-discoverer-ninja #content > article,
.post-type-archive-titan-ninja #content > article,
.post-type-archive-rank #content > article {
  display: flex !important;
  overflow: visible !important;
}
.post-type-archive-discoverer-ninja .si-blog-entry-content,
.post-type-archive-titan-ninja .si-blog-entry-content,
.post-type-archive-rank .si-blog-entry-content {
  flex: 1 1 auto;
  height: auto !important;
  overflow: visible !important;
}
.post-type-archive-discoverer-ninja .entry-footer,
.post-type-archive-titan-ninja .entry-footer,
.post-type-archive-rank .entry-footer {
  display: block;
  padding-bottom: 2px !important;
  overflow: visible !important;
}
.post-type-archive-discoverer-ninja .entry-footer .si-btn,
.post-type-archive-titan-ninja .entry-footer .si-btn,
.post-type-archive-rank .entry-footer .si-btn {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}
.post-type-archive-discoverer-ninja .entry-title:hover,
.post-type-archive-titan-ninja .entry-title:hover,
.post-type-archive-rank .entry-title:hover { text-decoration: none !important; }

/* the theme clips the image link to a square (overflow hidden, 3 px corners) and zooms the image on hover:
   the round ring then showed square corners. Round link, nothing clipped, no zoom. */
.post-type-archive-discoverer-ninja .entry-media > a,
.post-type-archive-titan-ninja .entry-media > a,
.post-type-archive-rank .entry-media > a {
  display: inline-block !important;
  overflow: visible !important;
  border-radius: 50% !important;
  background: none !important;
}
.post-type-archive-discoverer-ninja .entry-media img,
.post-type-archive-titan-ninja .entry-media img,
.post-type-archive-rank .entry-media img,
.post-type-archive-discoverer-ninja .entry-media:hover img,
.post-type-archive-titan-ninja .entry-media:hover img,
.post-type-archive-rank .entry-media:hover img { transform: none !important; }
.post-type-archive-discoverer-ninja .entry-media > a .entry-media-icon,
.post-type-archive-titan-ninja .entry-media > a .entry-media-icon,
.post-type-archive-rank .entry-media > a .entry-media-icon { display: none !important; }

/* Read More: whole-pixel size (32 px high, 16 px line) so the bottom border never lands on half a pixel,
   and the outline drawn as an inset ring so no theme border rule can drop a side */
.post-type-archive-discoverer-ninja .entry-footer .si-btn,
.post-type-archive-titan-ninja .entry-footer .si-btn,
.post-type-archive-rank .entry-footer .si-btn {
  display: inline-flex !important;
  align-items: center;
  box-sizing: border-box;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 16px !important;
  line-height: 16px !important;
  border: 0 !important;
  box-shadow: inset 0 0 0 1px #dc3900 !important;
}
.post-type-archive-discoverer-ninja .entry-footer .si-btn:hover,
.post-type-archive-titan-ninja .entry-footer .si-btn:hover,
.post-type-archive-rank .entry-footer .si-btn:hover { box-shadow: inset 0 0 0 1px #dc3900 !important; }
/* the image: round for real (the theme's 3 px corners win otherwise), no square background */
.post-type-archive-discoverer-ninja .post-thumb img,
.post-type-archive-titan-ninja .post-thumb img,
.post-type-archive-rank .post-thumb img {
  border-radius: 50% !important;
  background: none !important;
}

@media screen and (max-width: 960px) {
  .post-type-archive-discoverer-ninja #content,
  .post-type-archive-titan-ninja #content,
  .post-type-archive-rank #content { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 600px) {
  .post-type-archive-discoverer-ninja #content,
  .post-type-archive-titan-ninja #content,
  .post-type-archive-rank #content { grid-template-columns: minmax(0, 1fr); gap: 14px; }
}


/* #########################################################
   TESTIMONIALS   (Testimonials/testimonials.css)
   ######################################################### */

/* =========================================================
   ASF testimonials (plugin Stars Testimonials, template "style4", /testimonials/)
   Grey full-width boxes in italic Lora with black stars -> white cards in two
   columns, the site's font, orange stars and quote mark.
   The plugin prints its own colours per block (#st-NUMBER ...), so colours here use !important.
   No angle brackets anywhere: WordPress refuses markup in Additional CSS.
========================================================= */

/* two columns of cards */
.stars-testimonials .premio-testimonials-content {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
  /* room for the hover lift and shadow: the plugin's wrappers clip their content */
  padding: 12px 16px 24px !important;
  margin: -12px -16px -24px !important;
  overflow: visible !important;
}
.stars-testimonials,
.stars-testimonials .pre-testimonials-content { overflow: visible !important; }
.stars-testimonials .premio-testimonials-content::before,
.stars-testimonials .premio-testimonials-content::after { display: none !important; }
.stars-testimonials .pre-testimonials-content {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
}

/* the card */
.stars-testimonials .figure.style4 {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: 100% !important;
  margin: 0 !important;
  padding: 30px 30px 26px !important;
  float: none !important;
  overflow: hidden;
  background: #ffffff !important;
  border: 1px solid #e9ecef;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  font-family: inherit !important;
  color: #444444 !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.stars-testimonials .figure.style4:hover {
  transform: translateY(-3px);
  border-color: rgba(220,57,0,0.35);
  box-shadow: 0 14px 30px rgba(0,0,0,0.08), 0 0 18px rgba(220,57,0,0.08);
}
/* the plugin's quote mark: orange, quiet, top right */
.stars-testimonials .figure.style4::before {
  top: 18px !important;
  left: auto !important;
  right: 22px;
  font-size: 46px !important;
  color: #dc3900 !important;
  opacity: .18;
}

/* the quote */
.stars-testimonials .figure.style4 div.blockquote,
.stars-testimonials .figure.style4 div.blockquote p {
  font-family: inherit !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: #444444 !important;
}
.stars-testimonials .figure.style4 div.blockquote {
  order: 2;
  flex: 1 1 auto;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
.stars-testimonials .figure.style4 div.blockquote p { margin: 0 !important; }

/* stars: orange, above the quote, left */
.stars-testimonials .figure.style4 .starrating {
  order: 1;
  margin: 0 0 14px !important;
  text-align: left !important;
  color: #dc3900 !important;
  font-size: 14px;
  letter-spacing: 2px;
}
.stars-testimonials .figure.style4 .starrating i { color: #dc3900 !important; }

/* author: avatar, name, role - under a hairline */
.stars-testimonials .figure.style4 .star-author {
  order: 3;
  box-sizing: border-box;
  width: 100% !important;
  min-height: 40px;
  margin: 22px 0 0 !important;
  padding: 16px 0 0 52px !important;
  border-top: 1px solid #f3f4f6;
}
.stars-testimonials .figure.style4 .star-author img {
  top: 16px !important;
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 3px #e9ecef;
}
.stars-testimonials .figure.style4 .star-author h5,
.stars-testimonials .figure.style4 .star-author span { opacity: 1 !important; }
.stars-testimonials .figure.style4 .star-author h5 {
  margin: 0 0 3px !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0;
  line-height: 1.3 !important;
  color: #111111 !important;
}
.stars-testimonials .figure.style4 .star-author span {
  display: block;
  font-size: 13px !important;
  line-height: 1.3 !important;
  color: #888888 !important;
}
/* no avatar uploaded: the name starts at the left edge */
.stars-testimonials .figure.style4 .star-author:not(:has(img)) { padding-left: 0 !important; }

@media screen and (max-width: 760px) {
  .stars-testimonials .premio-testimonials-content { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .stars-testimonials .figure.style4 { padding: 24px 20px 20px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .stars-testimonials .figure.style4 { transition: none; }
}


/* #########################################################
   FIXES FOR THE SITE'S OWN HTML PAGES   (Page fixes/page-fixes.css)
   ######################################################### */

/* =========================================================
   ASF fixes for the site's own HTML pages (QuantVPS, Launch Your Idea ...)
   No angle brackets anywhere.
========================================================= */

/* Toggle switches (QuantVPS "Show 20% discount"): the real checkbox is hidden inside .switch, but the theme
   restyles every checkbox (2 px square, display inline-block !important) and on click it showed as a square
   over the switch's rounded left end. Hidden for good; the label still toggles it. */
.switch > input[type="checkbox"],
.si-input-supported .switch > input[type="checkbox"] {
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  box-shadow: none !important;
  background: none !important;
  pointer-events: none;
}
.switch > input[type="checkbox"]::before,
.switch > input[type="checkbox"]::after { display: none !important; }
/* keyboard focus still visible on the switch itself */
.switch > input[type="checkbox"]:focus-visible + .slider { box-shadow: 0 0 0 3px rgba(220,57,0,0.25); }