/* SGRS theme for AdLinkFly cloud_theme (frontend). Palette and radius match whmcs.sgrs.net (templates-nuhost-standard/css/sgrs.css).
   This block is appended to the end of styles.min.css, so it cannot use @import; sgrs-front.js loads the Inter font. */

:root {
    --sg-primary: #e8590c;
    --sg-primary-hover: #c2410c;
    --sg-dark: #9a3412;
    --sg-orange: #f08c00;
    --sg-gold: #f59f00;
    --sg-tint: #fff4e6;
    --sg-tint-2: #ffe8cc;
    --sg-bg-alt: #fffaf5;
    --sg-border: #eadfd5;
    --sg-input: #d6d3d1;
    --sg-text: #1c1917;
    --sg-muted: #57534e;
    --sg-footer: #2a1408;
    --sg-ok: #15803d;
    --sg-err: #b91c1c;
    --sg-radius: 14px;
    --sg-radius-sm: 10px;
    --sg-shadow: 0 1px 2px rgba(28, 25, 23, .05), 0 6px 20px rgba(154, 52, 18, .07);
    --sg-shadow-lg: 0 18px 50px rgba(124, 45, 18, .18);
    --sg-ring: 0 0 0 4px rgba(232, 89, 12, .16);
    --sg-grad: linear-gradient(125deg, #9a3412 0%, #c2410c 30%, #e8590c 65%, #f08c00 100%);
    --sg-grad-text: linear-gradient(90deg, #c2410c, #e8590c 45%, #f59f00);
    --sg-ease: cubic-bezier(.2, .7, .2, 1);
    --sg-font: "Inter", "Segoe UI", "Helvetica Neue", Arial, "Noto Sans Gujarati", sans-serif;
}

/* ------------------------------------------------------------- base */

body {
    font-family: var(--sg-font);
    color: var(--sg-muted);
    background: #fff;
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--sg-font);
    text-transform: none;
    font-weight: 800;
    letter-spacing: -.01em;
    color: var(--sg-text);
}
a { color: var(--sg-primary); }
a:hover, a:focus { color: var(--sg-primary-hover); }
::selection { background: var(--sg-tint-2); color: var(--sg-dark); }

.btn { border-radius: var(--sg-radius-sm); font-weight: 700; transition: background-color .2s, border-color .2s, box-shadow .2s, transform .2s; }
.btn-primary, .btn-success, .btn-contact, section#contact .btn-contact {
    color: #fff !important;
    background: var(--sg-primary) !important;
    border-color: var(--sg-primary) !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-success:hover, section#contact .btn-contact:hover {
    background: var(--sg-primary-hover) !important;
    border-color: var(--sg-primary-hover) !important;
    box-shadow: 0 10px 24px rgba(232, 89, 12, .28);
    transform: translateY(-1px);
}
.form-control {
    border: 1px solid var(--sg-input);
    border-radius: var(--sg-radius-sm);
    box-shadow: none;
    color: var(--sg-text);
    font-family: var(--sg-font);
}
.form-control:focus { border-color: var(--sg-primary); box-shadow: var(--sg-ring); }

.separator { display: none; }

/* ------------------------------------------------------------- nav (floating glass pill like the demo) */

#mainNav, .captcha-page #mainNav, .interstitial-page #mainNav, .banner-page #mainNav {
    background: transparent !important;
    background-image: none !important;
    border: 0;
    padding: 14px 0 0;
    transition: padding .3s var(--sg-ease);
}
#mainNav > .container {
    max-width: 1100px;
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(234, 223, 213, .9);
    border-radius: 999px;
    box-shadow: 0 10px 30px rgba(124, 45, 18, .08);
    padding: 0 10px 0 18px;
    transition: box-shadow .3s, background-color .3s;
}
#mainNav.sg-scrolled { padding-top: 8px; }
#mainNav.sg-scrolled > .container { box-shadow: 0 14px 36px rgba(124, 45, 18, .14); background: rgba(255, 255, 255, .97); }
#mainNav .navbar-brand {
    color: var(--sg-text) !important;
    font-family: var(--sg-font);
    font-weight: 800;
    font-size: 19px;
    letter-spacing: -.01em;
    text-transform: none;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 58px;
}
#mainNav .navbar-brand img { max-height: 36px; width: auto; }
#mainNav .navbar-brand .sg-brand-mark {
    width: 32px; height: 32px; border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--sg-grad); color: #fff; font-size: 15px;
    box-shadow: 0 6px 14px rgba(232, 89, 12, .3);
}
#mainNav .navbar-nav > li > a {
    color: var(--sg-text) !important;
    font-family: var(--sg-font);
    font-size: 14px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    padding: 19px 13px;
    transition: color .2s;
}
#mainNav .navbar-nav > li > a:hover,
#mainNav .navbar-nav > li > a:focus,
#mainNav .navbar-nav > li.active > a { color: var(--sg-primary) !important; background: transparent !important; }
@media (min-width: 768px) {
    #mainNav .navbar-nav > li:last-child > a {
        margin: 11px 0 11px 6px;
        padding: 9px 18px;
        border-radius: 999px;
        color: #fff !important;
        background: var(--sg-primary);
        box-shadow: 0 6px 16px rgba(232, 89, 12, .28);
    }
    #mainNav .navbar-nav > li:last-child > a:hover { background: var(--sg-primary-hover) !important; color: #fff !important; }
}
#mainNav .navbar-toggle { border: 0; margin-top: 12px; }
#mainNav .navbar-toggle .icon-bar { background: var(--sg-text); }
#mainNav .navbar-toggle:hover, #mainNav .navbar-toggle:focus { background: var(--sg-tint); }
#mainNav .dropdown-menu { border: 1px solid var(--sg-border); border-radius: 12px; box-shadow: var(--sg-shadow); padding: 6px; }
#mainNav .dropdown-menu > li > a { color: var(--sg-text) !important; border-radius: 8px; padding: 7px 12px; }
#mainNav .dropdown-menu > li > a:hover { background: var(--sg-tint); color: var(--sg-dark) !important; }
@media (max-width: 767px) {
    #mainNav > .container { border-radius: 20px; margin: 0 10px; padding: 0 12px; }
    #mainNav .navbar-collapse { border-top: 1px solid var(--sg-border); box-shadow: none; }
    #mainNav .navbar-nav > li > a { padding: 11px 6px; }
    #mainNav .navbar-nav .open .dropdown-menu > li > a { color: var(--sg-text) !important; }
}

/* ------------------------------------------------------------- hero */

header, .captcha-page header, .interstitial-page header, .banner-page header {
    background-image: none;
    color: var(--sg-text);
}
header .section-inner { background-image: none; }

header.shorten {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(70% 60% at 50% 0%, #fff4e6 0%, rgba(255, 244, 230, 0) 70%),
        linear-gradient(180deg, #fffaf5 0%, #ffffff 100%);
}
header.shorten::after {
    content: "";
    position: absolute;
    left: -5%; right: -5%; bottom: -1px;
    height: 70px;
    background: #fff;
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    z-index: 1;
}
header.shorten .section-inner { position: relative; z-index: 2; }

.sg-hero-bg { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.sg-hero-grid {
    position: absolute; inset: -2px;
    background-image:
        linear-gradient(rgba(232, 89, 12, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(232, 89, 12, .07) 1px, transparent 1px);
    background-size: 46px 46px;
    -webkit-mask-image: radial-gradient(120% 92% at 50% 0, #000 32%, transparent 76%);
    mask-image: radial-gradient(120% 92% at 50% 0, #000 32%, transparent 76%);
}
.sg-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(48px);
    opacity: .5;
    will-change: transform;
    animation: sg-float 14s ease-in-out infinite;
}
.sg-orb--1 { width: 360px; height: 360px; top: 2%; left: -70px; background: radial-gradient(circle at 30% 30%, #f59f00, transparent 70%); }
.sg-orb--2 { width: 300px; height: 300px; top: 6%; right: -60px; background: radial-gradient(circle at 30% 30%, #e8590c, transparent 70%); animation-delay: -4s; opacity: .38; }
.sg-orb--3 { width: 280px; height: 280px; bottom: 4%; left: 30%; background: radial-gradient(circle at 30% 30%, #ffc078, transparent 70%); animation-delay: -8s; }
.sg-scan {
    position: absolute; height: 1px; left: 18%; right: 18%;
    background: linear-gradient(90deg, transparent, rgba(232, 89, 12, .5), rgba(245, 159, 0, .7), transparent) 0 0 / 220% 100%;
    opacity: .42;
    animation: sg-scan 7s ease-in-out infinite;
}
.sg-scan--1 { top: 24%; transform: rotate(-8deg); }
.sg-scan--2 { bottom: 27%; left: 28%; right: 8%; transform: rotate(7deg); opacity: .28; animation-delay: -3.5s; }
.sg-lane {
    position: absolute; left: 50%; top: 42%;
    width: min(980px, 82vw); height: 130px;
    border: 1px solid rgba(232, 89, 12, .12);
    border-top-color: rgba(245, 159, 0, .3);
    border-radius: 50%;
    transform: translateX(-50%) rotate(var(--r, 0deg));
    opacity: .7;
}
.sg-lane::after {
    content: "";
    position: absolute; top: 50%; left: 8%;
    width: 10px; height: 10px; border-radius: 50%;
    background: var(--sg-primary);
    box-shadow: 0 0 0 5px rgba(232, 89, 12, .15);
    transform: translateY(-50%);
    animation: sg-orbit 9s linear infinite;
}
.sg-lane--2 { --r: 9deg; top: 50%; }
.sg-lane--2::after { background: var(--sg-gold); animation-delay: -3s; }
.sg-lane--3 { --r: -7deg; top: 34%; width: min(760px, 70vw); }
.sg-lane--3::after { animation-delay: -6s; }

.sg-chip {
    position: absolute;
    z-index: 2;
    display: flex; align-items: center; gap: 12px;
    min-width: 168px;
    padding: 11px 15px;
    text-align: left;
    white-space: nowrap;
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(234, 223, 213, .9);
    border-radius: 18px;
    box-shadow: 0 18px 40px rgba(124, 45, 18, .12);
    animation: sg-bob 6s ease-in-out infinite;
}
.sg-chip__icon {
    width: 36px; height: 36px; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff; font-size: 15px;
    background: var(--sg-grad);
}
.sg-chip__icon--gold { background: linear-gradient(135deg, #f59f00, #f08c00); }
.sg-chip__icon--ok { background: linear-gradient(135deg, #16a34a, #15803d); }
.sg-chip__icon--dark { background: linear-gradient(135deg, #9a3412, #c2410c); }
.sg-chip__label { display: block; font-size: 11px; font-weight: 500; color: var(--sg-muted); line-height: 1.2; }
.sg-chip__value { display: block; font-size: 14px; font-weight: 800; color: var(--sg-text); line-height: 1.3; }
.sg-chip--1 { top: 22%; left: max(22px, 6vw); }
.sg-chip--2 { top: 29%; right: max(24px, 7vw); animation-delay: -2s; }
.sg-chip--3 { bottom: 30%; left: max(26px, 5vw); animation-delay: -1.2s; }
.sg-chip--4 { bottom: 18%; right: max(36px, 15vw); animation-delay: -4s; }
@media (max-width: 1199px) { .sg-chip { display: none; } }

header .intro-text { padding-top: 150px; padding-bottom: 120px; }
@media (min-width: 768px) { header.shorten .intro-text { padding-top: 170px; padding-bottom: 170px; } }

.sg-badge {
    display: inline-flex; align-items: center; gap: 9px;
    margin-bottom: 22px;
    padding: 8px 16px;
    font-size: 13px; font-weight: 600;
    color: var(--sg-dark);
    background: rgba(255, 255, 255, .86);
    border: 1px solid var(--sg-border);
    border-radius: 999px;
    box-shadow: 0 4px 14px rgba(124, 45, 18, .06);
}
.sg-badge__dot { width: 9px; height: 9px; border-radius: 50%; background: #22c55e; animation: sg-pulse 2.2s infinite; }

header .intro-text .intro-lead-in,
header .intro-text .intro-heading,
.inner-page header .intro-lead-in {
    font-family: var(--sg-font) !important;
    font-style: normal !important;
    text-transform: none !important;
    letter-spacing: -.03em;
}
header.shorten .intro-text .intro-lead-in {
    color: var(--sg-text);
    font-weight: 800;
    font-size: clamp(36px, 5.6vw, 64px);
    line-height: 1.05;
    margin-bottom: 4px;
}
header.shorten .intro-text .intro-heading {
    font-weight: 800;
    font-size: clamp(36px, 5.6vw, 64px);
    line-height: 1.12;
    margin-bottom: 18px;
}
.sg-grad-word {
    position: relative;
    display: inline-block;
    padding-bottom: 6px;
    color: var(--sg-primary);
    background: var(--sg-grad-text);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: sg-text-shift 6s ease-in-out infinite;
}
.sg-underline { position: absolute; left: 0; right: 0; bottom: -8px; width: 100%; height: 14px; overflow: visible; }
.sg-underline path {
    fill: none; stroke: url(#sgUnderlineGrad); stroke-width: 4; stroke-linecap: round;
    stroke-dasharray: 420; stroke-dashoffset: 420;
    animation: sg-draw 1.2s .9s var(--sg-ease) forwards;
}
.sg-lead {
    max-width: 560px;
    margin: 0 auto 26px;
    color: var(--sg-muted);
    font-size: 16px;
    line-height: 1.6;
}

/* shorten box */
.shorten #shorten { display: block; }
.shorten #shorten .form-group {
    display: flex !important;
    align-items: center;
    gap: 8px;
    max-width: 620px;
    margin: 0 auto 14px;
    padding: 7px 7px 7px 16px;
    background: #fff;
    border: 1px solid var(--sg-border);
    border-radius: 16px;
    box-shadow: 0 20px 50px rgba(124, 45, 18, .12);
    transition: box-shadow .25s, border-color .25s;
}
.shorten #shorten .form-group:focus-within { border-color: var(--sg-primary); box-shadow: 0 20px 50px rgba(124, 45, 18, .14), var(--sg-ring); }
.shorten #shorten .form-group::before {
    content: "\f0c1";
    font-family: "FontAwesome";
    color: var(--sg-primary);
    font-size: 15px;
}
.shorten #shorten input.input-lg {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    height: 46px;
    padding: 0 6px;
    color: var(--sg-text);
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 15px;
}
.shorten #shorten input.input-lg:focus { box-shadow: none; }
.shorten #shorten .form-control::-webkit-input-placeholder { color: #a8a29e; }
.shorten #shorten .form-control::-moz-placeholder { color: #a8a29e; }
.shorten #shorten .form-control:-ms-input-placeholder { color: #a8a29e; }
.shorten #shorten button {
    position: static;
    flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: 8px;
    height: 44px;
    padding: 0 20px !important;
    color: #fff;
    font-weight: 700; font-size: 14px;
    background: var(--sg-grad) !important;
    background-size: 160% 100% !important;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(232, 89, 12, .3);
    transition: transform .2s, box-shadow .2s, background-position .4s;
}
.shorten #shorten button:hover { transform: translateY(-1px); background-position: 100% 0 !important; box-shadow: 0 12px 26px rgba(232, 89, 12, .38); }
.shorten #shorten button img { display: none; }
.shorten #shorten button:not(.sg-has-label)::after { content: "Shorten"; }
.shorten #shorten button .fa { font-size: 13px; }

.sg-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin-top: 6px; font-size: 13px; font-weight: 500; color: var(--sg-muted); }
.sg-trust span { display: inline-flex; align-items: center; gap: 7px; }
.sg-trust .fa { color: var(--sg-primary); }

.add-link-result { max-width: 620px; margin: 0 auto; }
.add-link-result .input-group, .add-link-result .form-control { border-radius: 12px; }
.add-link-result .alert { border-radius: 12px; }

/* inner pages: WHMCS-style saffron page hero */
.inner-page header {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 12% 18%, rgba(255, 255, 255, .14) 0, transparent 34%),
        radial-gradient(circle at 88% 82%, rgba(245, 159, 0, .45) 0, transparent 40%),
        var(--sg-grad);
}
.inner-page header::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px;
    background: linear-gradient(90deg, var(--sg-gold), #fff4e6, var(--sg-gold));
}
.inner-page header .intro-text { padding-top: 130px; padding-bottom: 64px; }
@media (min-width: 768px) { .inner-page header .intro-text { padding-top: 150px; padding-bottom: 80px; } }
.inner-page header .intro-lead-in {
    color: #fff !important;
    font-size: clamp(28px, 3.6vw, 42px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    margin-bottom: 0;
}
.inner-page header .intro-heading { color: #fff7ed !important; font-size: 17px !important; line-height: 1.5 !important; font-weight: 500 !important; }

/* ------------------------------------------------------------- sections */

section { padding: 88px 0; }
@media (max-width: 767px) { section { padding: 60px 0; } }

.section-title { margin-bottom: 46px; }
h3.section-subheading, .section-subheading {
    display: inline-block;
    margin: 0 0 14px;
    padding: 6px 14px;
    font-size: 12px !important;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase !important;
    font-style: normal !important;
    color: var(--sg-primary) !important;
    background: var(--sg-tint);
    border: 1px solid var(--sg-tint-2);
    border-radius: 999px;
}
h2.section-heading, .section-heading {
    margin: 0;
    font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.15;
    color: var(--sg-text) !important;
}
h2.section-heading::after, .section-heading::after { display: none !important; }

/* steps: three cards joined by a gradient line that draws in */
section.steps { position: relative; padding: 64px 0 40px; background: #fff; }
section.steps > .container > .row { position: relative; display: flex; flex-wrap: wrap; justify-content: center; }
section.steps > .container > .row::before {
    content: "";
    position: absolute;
    top: 52px; left: 22%; right: 22%;
    height: 2px;
    background: linear-gradient(90deg, var(--sg-dark), var(--sg-primary), var(--sg-gold));
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 1.4s var(--sg-ease) .3s;
}
section.steps.sg-in > .container > .row::before { transform: scaleX(1); }
@media (max-width: 767px) { section.steps > .container > .row::before { display: none; } }
.step {
    position: relative;
    z-index: 1;
    max-width: 300px;
    margin: 0 auto 20px;
    padding: 28px 22px 24px;
    background: #fff;
    border: 1px solid var(--sg-border);
    border-radius: var(--sg-radius);
    box-shadow: var(--sg-shadow);
    transition: transform .3s var(--sg-ease), box-shadow .3s, border-color .3s;
}
.step:hover { transform: translateY(-4px); box-shadow: var(--sg-shadow-lg); border-color: var(--sg-tint-2); }
.step-img { margin: 0 auto 16px; }
.step-heading { margin: 0; font-size: 18px; }
.step::before {
    position: absolute; top: 12px; right: 14px;
    font-size: 12px; font-weight: 800; color: #d6d3d1;
}
.step1::before { content: "01"; }
.step2::before { content: "02"; }
.step3::before { content: "03"; }

/* sprite icons → saffron icon tiles (FontAwesome 4 ships with the theme) */
.step-img .ms-sprite, .feature-img .ms-sprite, .stat-img .ms-sprite { display: none; }
.step-img, .feature-img, .stat-img {
    width: 52px; height: 52px;
    display: flex; align-items: center; justify-content: center;
    font-family: "FontAwesome";
    font-size: 21px;
    color: var(--sg-primary);
    background: var(--sg-tint);
    border: 1px solid var(--sg-tint-2);
    border-radius: 14px;
    transition: transform .3s var(--sg-ease), background .3s, color .3s;
}
.step-img { margin-left: auto; margin-right: auto; }
.step:hover .step-img, .feature:hover .feature-img { transform: rotate(-6deg) scale(1.06); background: var(--sg-primary); color: #fff; }
.step1 .step-img::before { content: "\f234"; }
.step2 .step-img::before { content: "\f0c1"; }
.step3 .step-img::before { content: "\f0d6"; }

section.features { background: var(--sg-bg-alt); background-image: none; border-top: 1px solid var(--sg-border); border-bottom: 1px solid var(--sg-border); }
section.features .container > div[style*="flex"] { margin: 0 -10px; }
section.features .col-sm-4 { padding: 10px; float: none; }
@media (min-width: 768px) { section.features .col-sm-4 { width: 33.3333%; } }
@media (max-width: 767px) { section.features .col-sm-4 { width: 100%; } }
.feature, .feature.last {
    height: 100%;
    margin: 0;
    padding: 26px 24px;
    text-align: left;
    background: #fff;
    border: 1px solid var(--sg-border);
    border-radius: var(--sg-radius);
    box-shadow: var(--sg-shadow);
    transition: transform .3s var(--sg-ease), box-shadow .3s, border-color .3s;
}
.feature:hover { transform: translateY(-4px); box-shadow: var(--sg-shadow-lg); border-color: var(--sg-tint-2); }
.feature-img { margin: 0 0 16px; }
.feature-heading { margin: 0 0 8px; font-size: 17px; text-transform: none; }
.feature-content { font-style: normal; font-size: 14.5px; line-height: 1.65; color: var(--sg-muted); }
.features .col-sm-4:nth-child(1) .feature-img::before { content: "\f0c1"; }
.features .col-sm-4:nth-child(2) .feature-img::before { content: "\f0d6"; }
.features .col-sm-4:nth-child(3) .feature-img::before { content: "\f0c0"; }
.features .col-sm-4:nth-child(4) .feature-img::before { content: "\f0e4"; }
.features .col-sm-4:nth-child(5) .feature-img::before { content: "\f080"; }
.features .col-sm-4:nth-child(6) .feature-img::before { content: "\f155"; }
.features .col-sm-4:nth-child(7) .feature-img::before { content: "\f201"; }
.features .col-sm-4:nth-child(8) .feature-img::before { content: "\f121"; }
.features .col-sm-4:nth-child(9) .feature-img::before { content: "\f1cd"; }

/* testimonials (if enabled) */
#testimonials { background: #fff !important; filter: none; }
section#testimonials h3.section-subheading { color: var(--sg-primary) !important; }
section#testimonials h2.section-heading, .testimonials { color: var(--sg-text) !important; }
.testimonials .content { font-style: normal; font-size: 17px; color: var(--sg-muted); }
.testimonials .content .fa-stack-2x { color: var(--sg-tint) !important; }
.testimonials .content .fa-quote-left.fa-inverse { color: var(--sg-primary) !important; }
.owl-theme .owl-dots .owl-dot span { background: var(--sg-tint-2); }
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: var(--sg-primary); }

/* stats: saffron gradient band like the WHMCS CTA */
section.stats {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 10% 20%, rgba(255, 255, 255, .14) 0, transparent 35%),
        radial-gradient(circle at 90% 80%, rgba(245, 159, 0, .45) 0, transparent 40%),
        var(--sg-grad);
    background-size: 100% 100%, 100% 100%, 200% 100%;
    animation: sg-shift 14s ease-in-out infinite;
}
section.stats h3.section-subheading { color: #fff !important; background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .3); }
section.stats h2.section-heading { color: #fff !important; }
section.stats .row { display: flex; flex-wrap: wrap; justify-content: center; }
.stat {
    display: block;
    width: 100%;
    margin: 10px auto;
    max-width: 320px;
    padding: 28px 18px 24px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 18px;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    transition: transform .3s var(--sg-ease), background .3s;
}
.stat:hover { transform: translateY(-4px); background: rgba(255, 255, 255, .18); }
.stat-img { margin: 0 auto 14px; color: #fff; background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .3); }
.stats .col-sm-4:nth-child(1) .stat-img::before { content: "\f245"; }
.stats .col-sm-4:nth-child(2) .stat-img::before { content: "\f0c1"; }
.stats .col-sm-4:nth-child(3) .stat-img::before { content: "\f0c0"; }
.stat-num { font-family: var(--sg-font); font-weight: 800; font-size: clamp(34px, 4vw, 48px); color: #fff; letter-spacing: -.02em; }
.stat-text { font-size: 12px; font-weight: 700; letter-spacing: .1em; color: #fff7ed; }

/* contact */
section#contact { background: #fff; background-image: none; }
section#contact form {
    max-width: 920px;
    margin: 0 auto;
    padding: 30px;
    background: #fff;
    border: 1px solid var(--sg-border);
    border-radius: 18px;
    box-shadow: var(--sg-shadow);
}
section#contact .form-group { margin-bottom: 18px; }
section#contact .form-group label { font-weight: 600; color: var(--sg-text); font-size: 13.5px; }
section#contact .form-group input,
section#contact .form-group textarea {
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--sg-input);
    border-radius: var(--sg-radius-sm);
}
section#contact .form-group input:focus,
section#contact .form-group textarea:focus { border-color: var(--sg-primary); box-shadow: var(--sg-ring); }
section#contact .btn-contact { padding: 13px 32px; font-size: 14px; text-transform: none; border-radius: 12px; }
section#contact .text-danger { color: var(--sg-err); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--sg-primary); }

/* captcha / interstitial / go pages */
.box-main {
    background: #fff;
    border: 1px solid var(--sg-border);
    border-top: 3px solid var(--sg-primary);
    border-radius: var(--sg-radius);
    box-shadow: var(--sg-shadow);
}
.btn-captcha-go, #go-link .btn, .get-link, a.btn.get-link {
    color: #fff !important;
    background: var(--sg-primary) !important;
    border-color: var(--sg-primary) !important;
    border-radius: 12px !important;
}
.table > thead > tr > th { color: var(--sg-text); border-bottom: 2px solid var(--sg-border); }
.table-striped > tbody > tr:nth-of-type(odd) { background: var(--sg-bg-alt); }
.pagination > .active > a, .pagination > .active > span { background: var(--sg-primary); border-color: var(--sg-primary); }
.pagination > li > a { color: var(--sg-primary); }
.alert { border-radius: 12px; }
.label-primary { background: var(--sg-primary); }
.panel { border-radius: var(--sg-radius); border-color: var(--sg-border); box-shadow: var(--sg-shadow); }
.panel-default > .panel-heading { background: var(--sg-bg-alt); border-color: var(--sg-border); border-radius: var(--sg-radius) var(--sg-radius) 0 0; }

/* footer: WHMCS dark brown */
footer {
    color: #e7d7cb;
    background: var(--sg-footer) !important;
    background-image: none !important;
}
footer a { color: #f5e6da; }
footer a:hover, footer a:focus, footer a:active, footer a.active { color: var(--sg-gold); }
footer .payment-methods { background: #fff; border-top: 1px solid var(--sg-border); }
footer .payment-methods img { filter: grayscale(.2); opacity: .9; transition: filter .2s, opacity .2s; }
footer .payment-methods img:hover { filter: none; opacity: 1; }
footer .copyright-container {
    font-family: var(--sg-font);
    font-size: 13px;
    font-weight: 500;
    border-top: 4px solid transparent;
    border-image: linear-gradient(90deg, var(--sg-gold), var(--sg-primary), var(--sg-gold)) 1;
}
footer .bottom-menu ul { text-transform: none; }
footer .social-links a {
    width: 34px; height: 34px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px;
    background: rgba(255, 255, 255, .08);
    transition: background .2s, color .2s;
}
footer .social-links a:hover { background: var(--sg-primary); color: #fff; }

.cookie-message { background: var(--sg-footer) !important; color: #f5e6da !important; }
.cookie-message a { color: var(--sg-gold) !important; }
.cookie-message .btn, .cookie-message button { background: var(--sg-primary) !important; border-color: var(--sg-primary) !important; color: #fff !important; border-radius: var(--sg-radius-sm) !important; }

/* ------------------------------------------------------------- motion */

/* WOW.js writes animation-name inline; these win and swap the bouncy effects for one calm reveal. */
.wow, .wow.animated {
    animation-name: sg-reveal !important;
    animation-duration: .75s !important;
    animation-timing-function: var(--sg-ease) !important;
    animation-fill-mode: both !important;
}
header.shorten .wow { animation-delay: .1s !important; }
header.shorten .intro-heading.wow { animation-delay: .22s !important; }
header.shorten .row.wow { animation-delay: .34s !important; }
.features .col-sm-4.wow:nth-child(3n+2) { animation-delay: .08s !important; }
.features .col-sm-4.wow:nth-child(3n) { animation-delay: .16s !important; }
.stats .col-sm-4:nth-child(2) .wow { animation-delay: .08s !important; }
.stats .col-sm-4:nth-child(3) .wow { animation-delay: .16s !important; }

.sg-hero-in { opacity: 0; transform: translateY(16px); animation: sg-reveal .8s var(--sg-ease) forwards; }
.sg-hero-in--2 { animation-delay: .45s; }
.sg-hero-in--3 { animation-delay: .6s; }

@keyframes sg-reveal { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes sg-float { 0%, 100% { transform: translate(0) scale(1); } 33% { transform: translate(18px, -22px) scale(1.05); } 66% { transform: translate(-14px, 12px) scale(.97); } }
@keyframes sg-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes sg-scan { 0%, 100% { opacity: .22; background-position: 0 0; } 50% { opacity: .58; background-position: 100% 0; } }
@keyframes sg-orbit { 0% { opacity: 0; left: 8%; } 10%, 82% { opacity: 1; } 100% { opacity: 0; left: 88%; } }
@keyframes sg-shift { 0%, 100% { background-position: 0 0, 0 0, 0% 0; } 50% { background-position: 0 0, 0 0, 100% 0; } }
@keyframes sg-text-shift { 0%, 100% { background-position: 0% 0; } 50% { background-position: 100% 0; } }
@keyframes sg-draw { to { stroke-dashoffset: 0; } }
@keyframes sg-pulse { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); } 70% { box-shadow: 0 0 0 10px rgba(34, 197, 94, 0); } 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .sg-underline path { stroke-dashoffset: 0; }
}