/* ======================================================
   SolarHostPro Clean Production custom.css
   Compact premium hero + WHMCS storefront/client polish
   Generated replacement for templates/twenty-one/css/custom.css
====================================================== */

/* =========================
   01. Base / Theme
========================= */

:root {
    --solar-navy: #0f172a;
    --solar-blue-dark: #0b3d91;
    --solar-blue: #2563eb;
    --solar-blue-light: #38bdf8;
    --solar-slate: #64748b;
    --solar-muted: #94a3b8;
    --solar-bg: #f4f7fb;
    --solar-soft: #f8fbff;
    --solar-border: rgba(37,99,235,.10);
    --solar-shadow: 0 18px 45px rgba(15,23,42,.07);
    --solar-shadow-hover: 0 28px 65px rgba(15,23,42,.12);
    --solar-radius-lg: 28px;
    --solar-radius-md: 18px;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--solar-bg);
    color: var(--solar-navy);
}

.main-content {
    background:
        linear-gradient(
            180deg,
            #f8fbff 0%,
            #f4f8fc 22%,
            #eef4fb 55%,
            #f4f7fb 100%
        );
    padding-top: 28px;
}

h1,
h2,
h3,
h4 {
    letter-spacing: -0.03em;
}

h2.text-center {
    color: var(--solar-navy);
    font-weight: 900;
    letter-spacing: -0.04em;
    margin-top: 44px !important;
    margin-bottom: 26px !important;
}

a {
    transition: all .2s ease;
}

/* Hide default WHMCS footer/breadcrumbs where custom layout handles branding */
footer#footer,
.master-breadcrumb,
.breadcrumb,
section#main-body .breadcrumb {
    display: none !important;
}

/* =========================
   02. Header / Navigation
========================= */

header.header {
    min-height: 58px;
    background: rgba(255,255,255,.96) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(219,231,243,.95);
    box-shadow: 0 10px 28px rgba(15,23,42,.06);
    position: sticky;
    top: 0;
    z-index: 1030;
}

header.header .navbar {
    padding-top: 12px;
    padding-bottom: 12px;
}

header.header .logo,
header.header a.logo,
header.header .navbar-brand {
    font-size: 20px !important;
    font-weight: 900 !important;
    color: #06152f !important;
    letter-spacing: -0.04em;
}

header.header .logo::after,
header.header .navbar-brand::after {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-left: 6px;
    border-radius: 999px;
    background: var(--solar-blue-light);
    box-shadow: 0 0 14px rgba(56,189,248,.8);
    vertical-align: middle;
}

header.header .btn,
header.header button,
header.header .navbar-toggler {
    min-width: 42px;
    min-height: 38px;
    border-radius: 14px !important;
    background: #f8fbff !important;
    border: 1px solid #dbe7f3 !important;
    color: var(--solar-blue-dark) !important;
    box-shadow: 0 8px 18px rgba(15,23,42,.06);
}

header.header .btn:hover,
header.header button:hover,
header.header .navbar-toggler:hover {
    background: #eff6ff !important;
    color: #075985 !important;
    transform: translateY(-1px);
}

.navbar-main,
.primary-navbar {
    background: rgba(255,255,255,.92) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(15,23,42,.06);
    box-shadow: 0 10px 30px rgba(15,23,42,.04);
}

.navbar-main .nav-link,
.primary-navbar .nav-link {
    color: #334155 !important;
    font-weight: 700;
}

.navbar-main .nav-link:hover,
.primary-navbar .nav-link:hover {
    color: var(--solar-blue) !important;
}

/* =========================
   03. Buttons / Forms
========================= */

.btn,
#contentarea .btn,
.client-home-panels .btn {
    border-radius: 16px !important;
    min-height: 46px !important;
    padding: 10px 18px !important;
    font-weight: 800 !important;
    border: none !important;
    transition: all .22s ease !important;
}

.btn-primary,
.btn-success,
#contentarea .btn-primary,
#contentarea .btn-success {
    background: linear-gradient(135deg,var(--solar-blue-dark),var(--solar-blue)) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 26px rgba(37,99,235,.22) !important;
}

.btn-primary:hover,
.btn-success:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 35px rgba(37,99,235,.30) !important;
}

.btn-warning,
.btn-info,
.btn-secondary,
.btn-default {
    background: #64748b !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(15,23,42,.10) !important;
}

.btn-danger {
    background: linear-gradient(135deg,#dc2626,#ef4444) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(220,38,38,.18) !important;
}

.form-control,
input,
select,
textarea {
    border-radius: 16px !important;
    border: 1px solid var(--solar-border) !important;
    min-height: 52px !important;
    box-shadow: 0 8px 22px rgba(15,23,42,.04) !important;
}

.form-control:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--solar-blue) !important;
    box-shadow: 0 0 0 4px rgba(37,99,235,.10) !important;
}

/* =========================
   04. Compact Premium Hero
========================= */

.solar-hero {
    position: relative;
    overflow: hidden;
    max-width: 1180px;
    margin: 18px auto 28px;
    padding: 58px 36px !important;
    border-radius: 32px;
    color: #ffffff;
    background:
        radial-gradient(circle at top right,rgba(96,165,250,.22),transparent 28%),
        radial-gradient(circle at bottom left,rgba(37,99,235,.18),transparent 34%),
        linear-gradient(135deg,#0f172a 0%,#111827 42%,#172554 100%) !important;
    box-shadow:
        0 26px 70px rgba(15,23,42,.18),
        0 0 0 1px rgba(255,255,255,.08),
        0 0 70px rgba(37,99,235,.12);
}

.solar-hero::before {
    content: "";
    position: absolute;
    top: -130px;
    right: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(96,165,250,.30),transparent 70%);
    pointer-events: none;
}

.solar-hero::after {
    content: "";
    position: absolute;
    bottom: -110px;
    left: -90px;
    width: 230px;
    height: 230px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(255,255,255,.06),transparent 70%);
    pointer-events: none;
}

.solar-hero-inner {
    position: relative;
    z-index: 2;
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.solar-hero-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 10px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    color: #dbeafe;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    backdrop-filter: blur(12px);
}

.solar-hero h1 {
    margin: 0 0 18px;
    color: #ffffff !important;
    font-size: 56px !important;
    line-height: .98 !important;
    font-weight: 900 !important;
    letter-spacing: -0.065em;
}

.solar-hero p {
    max-width: 660px;
    margin: 0 auto 26px;
    color: rgba(255,255,255,.80) !important;
    font-size: 17px;
    line-height: 1.75;
}

.solar-hero-actions {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

.solar-hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    min-width: 176px;
    padding: 0 24px;
    border-radius: 16px;
    font-weight: 900;
    text-decoration: none !important;
    transition: all .22s ease;
}

.solar-hero-btn.primary {
    background: linear-gradient(135deg,#3b82f6,var(--solar-blue));
    color: #ffffff !important;
    box-shadow: 0 16px 34px rgba(37,99,235,.34);
}

.solar-hero-btn.secondary {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    color: #ffffff !important;
    backdrop-filter: blur(10px);
}

.solar-hero-btn:hover {
    transform: translateY(-2px);
}

/* =========================
   05. Homepage Trust / Metrics / Cards
========================= */

.solar-trust-row {
    max-width: 1040px;
    margin: 22px auto 18px !important;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 14px;
    padding: 0 12px;
}

.solar-trust-card {
    background: rgba(255,255,255,.94);
    border: 1px solid #dbe7f3;
    border-radius: 18px;
    padding: 18px 14px;
    text-align: center;
    box-shadow: 0 14px 32px rgba(15,23,42,.07);
    transition: all .25s ease;
}

.solar-trust-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(15,23,42,.12);
}

.solar-trust-card i {
    color: var(--solar-blue-dark);
    font-size: 24px;
    margin-bottom: 10px;
}

.solar-trust-card strong {
    display: block;
    color: #06152f;
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
}

.solar-trust-card span {
    display: block;
    color: var(--solar-slate);
    font-size: 12px;
    line-height: 1.4;
}

.solar-metrics-row {
    max-width: 1120px;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 18px;
    margin: 0 auto 34px !important;
    padding: 0 12px;
}

.solar-metric-card {
    background: #ffffff;
    border-radius: 22px;
    padding: 22px 18px;
    text-align: center;
    border: 1px solid var(--solar-border);
    box-shadow: 0 10px 35px rgba(15,23,42,.05);
    transition: all .25s ease;
}

.solar-metric-card:hover {
    transform: translateY(-3px);
}

.solar-metric-card strong {
    display: block;
    font-size: 28px;
    font-weight: 900;
    color: var(--solar-blue);
    margin-bottom: 6px;
}

.solar-metric-card span {
    font-size: 13px;
    font-weight: 700;
    color: var(--solar-slate);
}

.solar-products-home {
    max-width: 1180px;
    margin: 10px auto 0 !important;
}

.solar-products-home > div {
    display: flex;
}

.solar-product-card {
    width: 100%;
    position: relative;
    overflow: hidden;
    border: none !important;
    border-radius: 30px !important;
    background: linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
    box-shadow: 0 18px 45px rgba(15,23,42,.06);
    transition: transform .25s ease, box-shadow .25s ease;
}

.solar-product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 28px 60px rgba(15,23,42,.10) !important;
}

.solar-product-card .card-body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 260px;
    padding: 30px 26px !important;
    background: transparent;
}

.solar-product-card h3 {
    color: var(--solar-navy) !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    margin-top: 16px;
    margin-bottom: 8px;
}

.solar-home-subtitle {
    max-width: 270px;
    margin: 8px auto 20px;
    color: var(--solar-slate);
    font-size: 14px;
    line-height: 1.7;
    font-weight: 500;
}

.hosting-icon {
    width: 62px;
    height: 62px;
    margin: 0 auto 16px;
    border-radius: 18px;
    background: linear-gradient(135deg,var(--solar-blue-dark),var(--solar-blue));
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 25px rgba(37,99,235,.28);
    transition: all .25s ease;
}

.hosting-icon i {
    color: #ffffff;
    font-size: 26px;
}

.solar-product-card:hover .hosting-icon {
    transform: translateY(-4px) scale(1.04);
    box-shadow: 0 18px 35px rgba(37,99,235,.22);
}

.solar-product-card .btn {
    border-radius: 16px !important;
    min-height: 50px;
    font-weight: 900 !important;
    letter-spacing: .01em;
    margin-top: 8px;
    background: linear-gradient(135deg,var(--solar-blue-dark),var(--solar-blue)) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 26px rgba(37,99,235,.20) !important;
}

.solar-popular-badge {
    position: absolute;
    top: 18px;
    right: 18px;
    background: linear-gradient(135deg,var(--solar-blue),var(--solar-blue-light));
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
    padding: 7px 12px;
    border-radius: 999px;
    letter-spacing: .04em;
    text-transform: uppercase;
    box-shadow: 0 10px 24px rgba(37,99,235,.25);
    z-index: 5;
}

/* Action cards */
.action-icon-btns {
    max-width: 1180px;
    margin: 18px auto 44px !important;
}

.action-icon-btns a {
    min-height: 116px;
    border-radius: 18px !important;
    background: linear-gradient(180deg,#ffffff 0%,#f8fbff 100%) !important;
    border: 1px solid rgba(219,231,243,.95) !important;
    box-shadow: 0 12px 30px rgba(15,23,42,.06) !important;
    font-weight: 800;
    transition: all .22s ease;
}

.action-icon-btns a:hover {
    transform: translateY(-5px);
    border-color: rgba(56,189,248,.45) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.12) !important;
}

.action-icon-btns .ico-container i,
.action-icon-btns i {
    color: var(--solar-blue-dark) !important;
    transition: all .22s ease;
}

.action-icon-btns a:hover i {
    transform: scale(1.08);
    color: var(--solar-blue) !important;
}

/* =========================
   06. Footer
========================= */

.solar-footer {
    position: relative;
    overflow: hidden;
    margin-top: 52px !important;
    padding: 50px 24px;
    background: linear-gradient(180deg,#04112b 0%,#020817 100%);
    border-top: 1px solid rgba(255,255,255,.06);
}

.solar-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top right,rgba(37,99,235,.12),transparent 35%);
    pointer-events: none;
}

.solar-footer-grid {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
    gap: 44px;
}

.solar-footer-column {
    position: relative;
}

.solar-footer-column:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: -22px;
    width: 1px;
    height: 100%;
    background: rgba(255,255,255,.055);
}

.solar-footer-column h4 {
    color: #ffffff;
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 16px;
}

.solar-footer-column a {
    display: block;
    color: #94a3b8;
    text-decoration: none;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.7;
    font-weight: 600;
}

.solar-footer-column a:hover {
    color: var(--solar-blue-light);
    transform: translateX(3px);
}

.solar-footer-column p {
    color: #94a3b8;
    font-size: 13px;
    line-height: 1.7;
    margin: 0;
}

/* =========================
   07. Store / Product Pages
========================= */

#order-standard_cart .sidebar,
#order-standard_cart .panel-sidebar,
#order-standard_cart .secondary-cart-sidebar,
#order-standard_cart .actions-sidebar,
#order-standard_cart .view-cart-tabs {
    display: none !important;
}

#order-standard_cart .main-content,
#order-standard_cart .pull-md-right {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

.products {
    margin-top: 12px !important;
}

.products .product,
.product {
    position: relative;
    overflow: hidden !important;
    background: #ffffff !important;
    border-radius: 28px !important;
    border: 1px solid rgba(37,99,235,.10) !important;
    box-shadow: 0 10px 35px rgba(15,23,42,.06),0 2px 10px rgba(37,99,235,.04) !important;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
    padding: 24px !important;
    margin-bottom: 24px !important;
}

.products .product::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg,var(--solar-blue),#3b82f6,#60a5fa);
    opacity: .9;
}

.products .product:hover,
.product:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 60px rgba(15,23,42,.12),0 10px 25px rgba(37,99,235,.10) !important;
}

.products .product-name,
.products .product-name a,
.products .product .product-title,
.products .product h3 {
    color: var(--solar-navy) !important;
    font-size: 26px !important;
    line-height: 1.2;
    font-weight: 900 !important;
    letter-spacing: -0.025em;
}

.products .product-desc,
.product div.product-desc,
.products .product p {
    color: var(--solar-slate) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.products .pricing {
    text-align: right !important;
    color: var(--solar-navy) !important;
    font-weight: 800 !important;
}

.products .price,
.products .product .pricing .price {
    color: var(--solar-blue) !important;
    font-size: 42px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: -0.05em;
}

.products .billing-cycle,
.products .cycle,
.products .product .pricing .cycle {
    color: var(--solar-slate) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    opacity: .85;
}

.products .btn,
.products .btn-info,
.products .btn-primary,
.products .btn-success {
    min-width: 150px;
    border-radius: 16px !important;
    padding: 14px 22px !important;
    background: linear-gradient(135deg,var(--solar-blue),#1d4ed8) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    border: none !important;
    box-shadow: 0 10px 20px rgba(37,99,235,.25) !important;
}

.solar-plan-features {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 14px 0 18px;
    padding-top: 12px;
    border-top: 1px solid #e5edf6;
}

.solar-plan-features span,
.solar-plan-features li {
    position: relative;
    color: #475569;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 700;
}

.solar-plan-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 5;
    background: linear-gradient(135deg,var(--solar-blue),var(--solar-blue-light));
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
    padding: 7px 12px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* =========================
   08. Cart / Checkout
========================= */

#order-standard_cart {
    max-width: 980px;
    margin: 0 auto;
    padding-bottom: 140px !important;
}

#order-standard_cart h1 {
    color: var(--solar-navy) !important;
    font-size: 54px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: -0.06em;
    margin-top: 24px !important;
    margin-bottom: 30px !important;
}

#order-standard_cart .view-cart-items {
    background: #ffffff;
    border-radius: 30px;
    overflow: hidden;
    border: none !important;
    box-shadow: 0 24px 60px rgba(15,23,42,.08);
    margin-bottom: 56px !important;
}

#order-standard_cart .cart-body .cart-item-header,
#order-standard_cart .view-cart-header {
    background: linear-gradient(135deg,#1d4ed8,var(--solar-blue)) !important;
    color: #ffffff !important;
    border: none !important;
}

#order-standard_cart .item {
    position: relative;
    padding: 26px !important;
    border-bottom: 1px solid rgba(15,23,42,.06) !important;
}

#order-standard_cart .item-title {
    color: var(--solar-navy) !important;
    font-size: 28px !important;
    font-weight: 900 !important;
}

#order-standard_cart .price {
    color: var(--solar-blue) !important;
    font-size: 40px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}

#order-standard_cart .cycle {
    color: var(--solar-slate) !important;
    font-size: 14px;
    font-weight: 700;
}

#order-standard_cart .btn-danger {
    background: #e2e8f0 !important;
    color: #475569 !important;
    box-shadow: none !important;
}

#order-standard_cart .btn-danger:hover {
    background: #cbd5e1 !important;
    color: var(--solar-navy) !important;
}

#order-standard_cart .checkout-buttons,
#order-standard_cart .view-cart-gateway-checkout,
#order-standard_cart .express-checkout-buttons {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-top: 32px !important;
    margin-bottom: 40px !important;
}

#order-standard_cart .btn-checkout,
#order-standard_cart #checkout,
.solar-restored-checkout-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: linear-gradient(135deg,var(--solar-blue-dark),var(--solar-blue)) !important;
    color: #ffffff !important;
    border-radius: 18px !important;
    min-height: 58px !important;
    padding: 0 30px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    box-shadow: 0 14px 30px rgba(37,99,235,.28) !important;
}

.solar-restored-checkout-wrap {
    margin: 24px 0 70px;
    text-align: right;
}

body:has(#btnCompleteOrder) .solar-restored-checkout-wrap,
#order-standard_cart:has(#btnCompleteOrder) .solar-restored-checkout-wrap,
body[class*="checkout"] .solar-restored-checkout-wrap,
#order-standard_cart form[action*="checkout"] ~ .solar-restored-checkout-wrap {
    display: none !important;
}

#order-standard_cart .sub-heading {
    margin-top: 26px !important;
    margin-bottom: 14px !important;
}

#order-standard_cart .sub-heading span,
#order-standard_cart .sub-heading-borderless span {
    background: transparent !important;
    color: var(--solar-blue-dark) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    letter-spacing: .02em;
}

#order-standard_cart textarea {
    min-height: 110px !important;
}

#order-standard_cart .total-due-today {
    margin-top: 14px !important;
    margin-bottom: 18px !important;
    background: linear-gradient(135deg,#dcfce7,#bbf7d0) !important;
    border-radius: 16px !important;
    border: 1px solid rgba(34,197,94,.18) !important;
    color: #166534 !important;
    font-weight: 900 !important;
    padding: 16px !important;
}

#order-standard_cart .alert-warning {
    margin-top: 18px !important;
    padding: 16px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(245,158,11,.22) !important;
    background: #fffbeb !important;
    color: #92400e !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

#order-standard_cart #btnCompleteOrder {
    width: 100% !important;
    min-height: 58px !important;
    margin-top: 18px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg,var(--solar-blue-dark),var(--solar-blue)) !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    box-shadow: 0 14px 30px rgba(37,99,235,.28) !important;
}

/* =========================
   09. Login / Register
========================= */

.logincontainer,
.client-login,
.clientarealogin,
.registercontainer,
#containerNewUserSignup {
    background: #ffffff !important;
    border-radius: 30px !important;
    border: 1px solid var(--solar-border);
    box-shadow: 0 20px 60px rgba(15,23,42,.08),0 8px 20px rgba(37,99,235,.05) !important;
    padding: 30px !important;
}

.logincontainer .card,
.registercontainer .card,
#containerNewUserSignup .card {
    border-radius: 26px !important;
    border: 1px solid var(--solar-border) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.05) !important;
    overflow: hidden;
}

.logincontainer .input-group,
.client-login .input-group,
.registercontainer .input-group,
#containerNewUserSignup .input-group {
    align-items: stretch !important;
    border-radius: 18px !important;
}

.logincontainer .input-group-text,
.client-login .input-group-text,
.registercontainer .input-group-text,
#containerNewUserSignup .input-group-text {
    height: 54px !important;
    min-width: 52px !important;
    width: 52px !important;
    padding: 0 !important;
    border-radius: 16px 0 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.logincontainer .input-group .form-control,
.client-login .input-group .form-control,
.registercontainer .input-group .form-control,
#containerNewUserSignup .input-group .form-control {
    height: 54px !important;
    min-height: 54px !important;
    border-radius: 0 16px 16px 0 !important;
}

#containerNewUserSignup .field-icon,
.registercontainer .field-icon {
    display: none !important;
}

#containerNewUserSignup .form-control,
.registercontainer .form-control {
    padding-left: 18px !important;
}

#containerNewUserSignup .iti,
#containerNewUserSignup .intl-tel-input {
    width: 100% !important;
}

#containerNewUserSignup .iti__flag-container,
#containerNewUserSignup .intl-tel-input .flag-container {
    width: 54px !important;
    left: 0 !important;
}

#containerNewUserSignup input[name="phonenumber"],
#containerNewUserSignup input[type="tel"] {
    padding-left: 118px !important;
}

#containerNewUserSignup .captcha-container {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
    text-align: center !important;
}

#containerNewUserSignup .btn-primary,
.registercontainer .btn-primary {
    width: 100% !important;
    max-width: 240px !important;
    min-height: 56px !important;
    margin: 18px auto 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.password-strength-meter {
    border-radius: 999px !important;
    overflow: hidden;
}

/* =========================
   10. Client Area / Dashboard
========================= */

.clientarea,
.client-area,
#contentarea,
.client-home-panels {
    padding-bottom: 42px !important;
}

.client-home-panels .card,
.client-home-panels .panel,
.client-home-panels .tile,
.client-home-panels .list-group,
.dataTables_wrapper,
.table-container,
.table-responsive,
#contentarea .card,
#contentarea .panel {
    background: #ffffff !important;
    border-radius: 26px !important;
    border: 1px solid var(--solar-border) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.05) !important;
    overflow: hidden !important;
}

.client-home-panels .tile,
.client-home-panels .stat {
    min-height: 140px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(180deg,#ffffff,#f8fafc) !important;
    border-radius: 24px !important;
    transition: all .25s ease !important;
}

.client-home-panels .tile:hover,
.client-home-panels .stat:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 50px rgba(37,99,235,.12) !important;
}

.client-home-panels .tile::before,
.client-home-panels .stat::before {
    content: "";
    position: absolute;
    top: -42px;
    right: -42px;
    width: 120px;
    height: 120px;
    background: radial-gradient(circle,rgba(37,99,235,.12),transparent 70%);
    border-radius: 50%;
}

.client-home-panels .tile .value,
.client-home-panels .stat .value,
.client-home-panels .tile h1,
.client-home-panels .stat h1 {
    color: var(--solar-blue) !important;
    font-size: 44px !important;
    font-weight: 900 !important;
}

table.dataTable,
.clientarea table,
#contentarea table {
    width: 100% !important;
    min-width: 720px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

.dataTables_wrapper,
.table-container,
.table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

table.dataTable thead th,
#contentarea table thead th {
    background: #f8fafc !important;
    color: var(--solar-navy) !important;
    font-weight: 800 !important;
    border-bottom: 1px solid var(--solar-border) !important;
    padding: 18px 16px !important;
}

table.dataTable tbody td,
#contentarea table tbody td {
    padding: 18px 16px !important;
    vertical-align: middle !important;
    border-color: rgba(15,23,42,.06) !important;
}

table.dataTable tbody tr:hover,
#contentarea table tbody tr:hover {
    background: rgba(37,99,235,.03) !important;
}

.dataTables_filter {
    margin-bottom: 18px !important;
}

.dataTables_filter input,
.dataTables_length select,
#contentarea input[type="search"],
#contentarea select {
    width: 100% !important;
    min-height: 52px !important;
    border-radius: 16px !important;
    border: 1px solid var(--solar-border) !important;
    box-shadow: 0 10px 24px rgba(15,23,42,.04) !important;
}

.pagination .page-link,
.paginate_button {
    border-radius: 14px !important;
    margin: 0 4px !important;
    border: none !important;
    min-width: 42px !important;
    text-align: center !important;
}

.pagination .active .page-link,
.paginate_button.current {
    background: linear-gradient(135deg,var(--solar-blue-dark),var(--solar-blue)) !important;
    color: #ffffff !important;
}

.label,
.status,
.badge,
.product-status,
.label-success,
.label-warning,
.label-danger,
.label-info {
    border-radius: 999px !important;
    padding: 8px 14px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    border: none !important;
}

.label-success,
.status-active,
.badge-success {
    background: #22c55e !important;
    color: #ffffff !important;
}

.label-warning,
.status-pending,
.badge-warning {
    background: #f59e0b !important;
    color: #ffffff !important;
}

.label-danger,
.status-unpaid,
.badge-danger {
    background: #ef4444 !important;
    color: #ffffff !important;
}

.dataTables_empty,
.no-records,
.ticket-empty {
    padding: 44px 20px !important;
    text-align: center !important;
    color: var(--solar-slate) !important;
    font-size: 16px !important;
}

.note-editor,
.note-toolbar,
.note-editing-area,
.summernote {
    border-radius: 20px !important;
    overflow: hidden !important;
    border-color: var(--solar-border) !important;
}

/* =========================
   11. Responsive Refinements
========================= */

@media (min-width: 992px) {
    .solar-products-home .col-xl-4 {
        flex: 0 0 33.333%;
        max-width: 33.333%;
    }

    .action-icon-btns .col-lg {
        flex: 0 0 220px;
        max-width: 220px;
    }

    h2.text-center {
        font-size: 40px;
    }
}

@media (max-width: 991px) {
    .secondary-cart-sidebar,
    .actions-sidebar,
    .panel-sidebar {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .main-content {
        padding-top: 16px !important;
    }

    header.header {
        min-height: 54px;
    }

    header.header .logo,
    header.header a.logo,
    header.header .navbar-brand {
        font-size: 16px !important;
    }

    h1 {
        font-size: 44px !important;
        line-height: 1 !important;
    }

    h2.text-center {
        margin-top: 34px !important;
        margin-bottom: 18px !important;
        font-size: 30px;
        line-height: 1.1;
    }

    .solar-hero {
        margin: 14px 10px 24px;
        padding: 54px 24px 32px !important;
        border-radius: 28px;
    }

    .solar-hero::before {
        top: -145px;
        right: -130px;
        width: 280px;
        height: 280px;
        opacity: .72;
    }

    .solar-hero h1 {
        font-size: 44px !important;
        line-height: .96 !important;
        letter-spacing: -0.065em;
        max-width: 300px;
        margin-left: auto;
        margin-right: auto;
    }

    .solar-hero p {
        font-size: 15px;
        line-height: 1.7;
        margin-bottom: 24px;
    }

    .solar-hero-actions {
        display: flex;
        flex-direction: column;
        gap: 13px;
    }

    .solar-hero-btn {
        width: 100%;
        min-height: 52px;
    }

    .solar-trust-row {
        grid-template-columns: repeat(2,1fr);
        max-width: 340px;
        gap: 10px;
        margin-top: 18px !important;
        margin-bottom: 24px !important;
    }

    .solar-trust-card {
        border-radius: 14px;
        padding: 12px 8px;
    }

    .solar-trust-card i {
        font-size: 17px;
        margin-bottom: 6px;
    }

    .solar-trust-card strong {
        font-size: 11px;
        margin-bottom: 3px;
    }

    .solar-trust-card span {
        font-size: 10px;
        line-height: 1.25;
    }

    .solar-metrics-row {
        grid-template-columns: repeat(2,1fr);
        gap: 14px;
        margin: 22px 0 30px !important;
    }

    .solar-metric-card {
        padding: 18px 12px;
        border-radius: 18px;
    }

    .solar-metric-card strong {
        font-size: 24px;
    }

    .solar-product-card .card-body {
        min-height: 210px;
        padding: 26px 20px !important;
    }

    .solar-product-card h3 {
        font-size: 24px !important;
    }

    .solar-home-subtitle {
        font-size: 13px;
        line-height: 1.6;
        margin-bottom: 18px;
    }

    .hosting-icon {
        width: 56px;
        height: 56px;
        margin-bottom: 14px;
    }

    .hosting-icon i {
        font-size: 23px;
    }

    .action-icon-btns {
        margin-top: 12px !important;
        margin-bottom: 28px !important;
    }

    .action-icon-btns a {
        min-height: 108px;
        padding-top: 18px;
        padding-bottom: 16px;
    }

    .solar-footer {
        padding: 36px 22px 38px;
        margin-top: 34px !important;
    }

    .solar-footer-grid {
        gap: 22px !important;
    }

    .solar-footer-column:not(:last-child)::after {
        display: none;
    }

    .solar-footer-column h4 {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .solar-footer-column a {
        font-size: 12px;
        margin-bottom: 7px;
    }

    .solar-footer-column p {
        font-size: 12px;
        line-height: 1.55;
    }

    .products .product {
        padding: 24px !important;
        border-radius: 26px !important;
        margin-bottom: 26px !important;
    }

    .products .product div {
        text-align: left !important;
    }

    .products .pricing {
        position: relative;
        z-index: 5;
        text-align: right !important;
    }

    .products .price,
    .products .product .pricing .price {
        font-size: 42px !important;
    }

    .products .btn {
        width: 100% !important;
        margin-top: 10px !important;
    }

    #order-standard_cart {
        padding-left: 10px !important;
        padding-right: 10px !important;
        padding-bottom: 120px !important;
    }

    #order-standard_cart h1 {
        font-size: 44px !important;
        line-height: 1 !important;
        margin-bottom: 24px !important;
    }

    #order-standard_cart .view-cart-items {
        border-radius: 24px;
        margin-bottom: 50px !important;
    }

    #order-standard_cart .item {
        padding: 22px !important;
    }

    #order-standard_cart .item-title {
        font-size: 22px !important;
    }

    #order-standard_cart .price {
        font-size: 32px !important;
    }

    .solar-restored-checkout-wrap {
        text-align: center;
        padding: 0 20px;
    }

    .solar-restored-checkout-btn {
        width: 100%;
    }

    .logincontainer,
    .client-login,
    .clientarealogin,
    .registercontainer,
    #containerNewUserSignup {
        max-width: 94% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 24px 18px !important;
        border-radius: 24px !important;
    }

    #containerNewUserSignup .card,
    .registercontainer .card {
        padding: 22px 18px !important;
        border-radius: 22px !important;
    }

    #containerNewUserSignup .form-control,
    .registercontainer .form-control {
        min-height: 52px !important;
        font-size: 15px !important;
    }

    #contentarea {
        padding-left: 10px !important;
        padding-right: 10px !important;
        padding-bottom: 34px !important;
    }

    .client-home-panels .tile,
    .client-home-panels .stat {
        min-height: 120px !important;
        border-radius: 22px !important;
    }

    .client-home-panels .tile .value,
    .client-home-panels .stat .value {
        font-size: 36px !important;
    }

    .panel,
    .card,
    .dataTables_wrapper {
        border-radius: 22px !important;
    }

    table.dataTable tbody td,
    #contentarea table tbody td {
        padding: 14px 10px !important;
        font-size: 14px !important;
    }
}

/* ========================================
   END OF SOLARHOSTPRO CUSTOM CSS
======================================== */

/* ========================================
   SOLARHOSTPRO PLAN COMPARISON SECTION
======================================== */

.solar-comparison-section{
    max-width:1200px;
    margin:48px auto;
    padding:0 16px;
}

.solar-section-heading{
    text-align:center;
    max-width:720px;
    margin:0 auto 28px;
}

.solar-section-heading span{
    color:#2563eb;
    font-weight:900;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.solar-section-heading h2{
    color:#0f172a;
    font-size:34px;
    font-weight:900;
    letter-spacing:-.04em;
    margin:10px 0;
}

.solar-section-heading p{
    color:#64748b;
    font-size:16px;
    line-height:1.7;
}

.solar-comparison-grid{
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    box-shadow:0 18px 45px rgba(15,23,42,.07);
    border:1px solid rgba(37,99,235,.08);
}

.solar-comparison-grid > div{
    display:grid;
    grid-template-columns:1.4fr repeat(4,1fr);
    border-bottom:1px solid rgba(15,23,42,.06);
}

.solar-comparison-grid > div:last-child{
    border-bottom:none;
}

.solar-comparison-grid strong,
.solar-comparison-grid span{
    padding:18px 16px;
    font-size:14px;
}

.solar-comparison-grid strong{
    background:#f8fafc;
    color:#0f172a;
    font-weight:900;
}

.solar-comparison-grid span{
    color:#475569;
    font-weight:700;
}

@media(max-width:767px){
    .solar-comparison-section{
        margin:34px auto;
    }

    .solar-section-heading h2{
        font-size:28px;
    }

    .solar-comparison-grid{
        overflow-x:auto;
    }

    .solar-comparison-grid > div{
        min-width:720px;
    }
}


/* ========================================
   SOLARHOSTPRO TRUST + SECURITY STRIP
======================================== */

.solar-security-strip{

    max-width:1200px;

    margin:22px auto 34px;

    padding:0 16px;

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:14px;
}

.solar-security-item{

    background:#ffffff;

    border-radius:22px;

    padding:18px 12px;

    text-align:center;

    border:1px solid rgba(37,99,235,.08);

    box-shadow:
        0 10px 28px rgba(15,23,42,.05);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.solar-security-item:hover{

    transform:translateY(-4px);

    box-shadow:
        0 18px 34px rgba(37,99,235,.12);
}

.solar-security-item i{

    font-size:22px;

    color:#2563eb;

    margin-bottom:10px;

    display:block;
}

.solar-security-item span{

    font-size:14px;

    font-weight:800;

    color:#0f172a;

    line-height:1.4;
}

@media(max-width:991px){

    .solar-security-strip{
        grid-template-columns:repeat(3,1fr);
    }
}

@media(max-width:767px){

    .solar-security-strip{

        grid-template-columns:repeat(2,1fr);

        gap:12px;

        margin-top:18px;
    }

    .solar-security-item{

        border-radius:18px;

        padding:16px 10px;
    }

    .solar-security-item span{

        font-size:13px;
    }
}


/* ========================================
   SOLARHOSTPRO SERVICE CONFIGURATION PAGE
======================================== */

#order-standard_cart .configure-product,
#order-standard_cart .product-info,
#order-standard_cart .configurable-options,
#order-standard_cart .order-summary {
    background:#ffffff !important;
    border-radius:28px !important;
    border:1px solid rgba(37,99,235,.08) !important;
    box-shadow:0 18px 45px rgba(15,23,42,.06) !important;
    overflow:hidden !important;
}

#order-standard_cart .configure-product h1,
#order-standard_cart .configure-product h2,
#order-standard_cart .configure-product h3 {
    color:#0f172a !important;
    font-weight:900 !important;
    letter-spacing:-.04em;
}

#order-standard_cart .product-info {
    padding:28px !important;
    margin-bottom:24px !important;
}

#order-standard_cart .product-info .product-title {
    font-size:30px !important;
    font-weight:900 !important;
    color:#0f172a !important;
}

#order-standard_cart .product-info p {
    color:#64748b !important;
    line-height:1.75 !important;
}

#order-standard_cart .configurable-options {
    padding:26px !important;
    margin-bottom:24px !important;
}

#order-standard_cart .field-container,
#order-standard_cart .form-group {
    margin-bottom:18px !important;
}

#order-standard_cart label {
    color:#0f172a !important;
    font-weight:800 !important;
    margin-bottom:8px !important;
}

#order-standard_cart .form-control,
#order-standard_cart select,
#order-standard_cart input {
    border-radius:16px !important;
    border:1px solid rgba(37,99,235,.12) !important;
    min-height:54px !important;
    box-shadow:0 8px 22px rgba(15,23,42,.04) !important;
}

#order-standard_cart .order-summary {
    padding:24px !important;
}

#order-standard_cart .order-summary h2,
#order-standard_cart .order-summary h3 {
    color:#0f172a !important;
    font-weight:900 !important;
}

#order-standard_cart .total-due-today {
    background:linear-gradient(135deg,#eff6ff,#dbeafe) !important;
    border:1px solid rgba(37,99,235,.16) !important;
    color:#0b3d91 !important;
    border-radius:18px !important;
    padding:18px !important;
    font-weight:900 !important;
}

#order-standard_cart .btn-primary,
#order-standard_cart .btn-success,
#order-standard_cart #btnCompleteProductConfig {
    background:linear-gradient(135deg,#0b3d91,#2563eb) !important;
    color:#ffffff !important;
    border:none !important;
    border-radius:18px !important;
    min-height:58px !important;
    font-weight:900 !important;
    box-shadow:0 14px 30px rgba(37,99,235,.28) !important;
}

@media(max-width:767px){
    #order-standard_cart .product-info,
    #order-standard_cart .configurable-options,
    #order-standard_cart .order-summary {
        padding:22px !important;
        border-radius:24px !important;
    }

    #order-standard_cart .product-info .product-title {
        font-size:24px !important;
    }

    #order-standard_cart .btn-primary,
    #order-standard_cart .btn-success {
        width:100% !important;
    }
}


/* ========================================
   FINAL CHECKOUT COMPRESSION PASS
======================================== */

#order-standard_cart {
    padding-bottom: 40px !important;
}

/* Tighten checkout title */
#order-standard_cart h1 {
    margin-bottom: 24px !important;
    line-height: .95 !important;
}

/* Tighten cart wrapper */
#order-standard_cart .view-cart-items {
    margin-bottom: 24px !important;
}

/* Product cards */
#order-standard_cart .item {
    padding: 26px 28px !important;
    margin-bottom: 0 !important;
}

/* Remove giant spacing below cart */
#order-standard_cart .view-cart-items + .row,
#order-standard_cart .view-cart-items + div {
    margin-top: 10px !important;
}

/* Empty cart button area */
#order-standard_cart .empty-cart-btn,
#order-standard_cart .btn-danger {
    margin-top: 14px !important;
    margin-bottom: 18px !important;
}

/* Secure checkout button wrapper */
.solar-restored-checkout-wrap {
    margin-top: 18px !important;
    margin-bottom: 40px !important;
    padding: 0 12px !important;
}

/* Checkout button */
.solar-restored-checkout-btn {
    min-height: 64px !important;
    border-radius: 22px !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    letter-spacing: -.02em;
}

/* Pull footer upward */
footer.footer,
#footer,
.main-footer {
    margin-top: 30px !important;
}

/* Mobile refinement */
@media(max-width:767px){

    #order-standard_cart h1{
        font-size:64px !important;
    }

    #order-standard_cart .item{
        padding:24px 24px !important;
    }

    .solar-restored-checkout-wrap{
        margin-top:10px !important;
        margin-bottom:26px !important;
    }
}


/* ========================================
   STICKY MOBILE CHECKOUT CTA
======================================== */

@media(max-width:767px){

    .solar-restored-checkout-wrap{
        position:sticky !important;
        bottom:14px !important;
        z-index:999 !important;
        margin:18px 0 24px !important;
        padding:0 16px !important;
    }

    .solar-restored-checkout-btn{
        width:100% !important;
        min-height:62px !important;
        border-radius:22px !important;
        background:linear-gradient(135deg,#0b3d91,#2563eb) !important;
        color:#fff !important;
        font-size:22px !important;
        font-weight:900 !important;
        box-shadow:0 18px 40px rgba(37,99,235,.35) !important;
    }
}


/* ======================================================
   PREMIUM SAAS HOSTING CARDS
====================================================== */

.solar-product-card{
    position:relative;
    background:#ffffff !important;
    border:none !important;
    border-radius:34px !important;
    overflow:hidden;
    padding:38px 28px !important;

    box-shadow:
        0 18px 50px rgba(15,23,42,.06);

    transition:
        transform .28s ease,
        box-shadow .28s ease;
}

.solar-product-card:hover{
    transform:translateY(-6px);
    box-shadow:
        0 30px 70px rgba(37,99,235,.14);
}

/* top accent */
.solar-product-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:6px;

    background:
        linear-gradient(
            135deg,
            #0b3d91,
            #2563eb
        );
}

/* featured plan */
.solar-product-card.featured{
    transform:scale(1.02);
    box-shadow:
        0 35px 80px rgba(37,99,235,.18);
}

.solar-product-card.featured::after{

    content:"MOST POPULAR";

    position:absolute;
    top:18px;
    right:18px;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #3b82f6
        );

    color:#fff;

    font-size:11px;
    font-weight:900;

    letter-spacing:.08em;

    padding:8px 12px;

    border-radius:999px;
}

/* product title */
.solar-product-card h3{

    font-size:34px !important;

    line-height:1.05;

    font-weight:900 !important;

    color:#0f172a !important;

    margin-bottom:16px !important;
}

/* subtitle */
.solar-home-subtitle{

    font-size:15px !important;

    line-height:1.7;

    color:#64748b !important;

    max-width:280px;

    margin:
        0 auto 24px auto !important;
}

/* pricing */
.solar-product-price{

    margin:
        20px 0 28px 0;
}

.solar-product-price strong{

    font-size:48px;

    line-height:1;

    letter-spacing:-.05em;

    color:#0f172a;
}

.solar-product-price span{

    display:block;

    margin-top:6px;

    font-size:14px;

    color:#64748b;

    font-weight:700;
}

/* feature list */
.solar-product-features{

    margin:
        0 0 30px 0;

    padding:0;

    list-style:none;
}

.solar-product-features li{

    position:relative;

    padding-left:28px;

    margin-bottom:14px;

    color:#334155;

    font-weight:600;
}

.solar-product-features li::before{

    content:"✓";

    position:absolute;

    left:0;
    top:0;

    color:#22c55e;

    font-weight:900;
}

/* buttons */
.solar-product-card .btn{

    min-height:56px !important;

    border-radius:18px !important;

    font-size:16px !important;

    font-weight:800 !important;

    background:
        linear-gradient(
            135deg,
            #0b3d91,
            #2563eb
        ) !important;

    border:none !important;

    box-shadow:
        0 16px 40px rgba(37,99,235,.22);
}

/* mobile */
@media(max-width:767px){

    .solar-product-card{

        padding:
            34px 24px !important;

        border-radius:30px !important;
    }

    .solar-product-card h3{

        font-size:30px !important;
    }

    .solar-product-price strong{

        font-size:42px;
    }

    .solar-product-card.featured{
        transform:none;
    }
}


/* ======================================================
   PREMIUM HOSTING PRODUCT LAYOUT
====================================================== */

/* Product wrapper */
.product{
    background:#ffffff !important;

    border:none !important;

    border-radius:32px !important;

    padding:36px 28px !important;

    box-shadow:
        0 20px 50px rgba(15,23,42,.06) !important;

    overflow:hidden;

    position:relative;

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.product:hover{

    transform:translateY(-6px);

    box-shadow:
        0 32px 70px rgba(37,99,235,.14) !important;
}

/* Top accent */
.product::before{

    content:"";

    position:absolute;

    top:0;
    left:0;
    right:0;

    height:5px;

    background:
        linear-gradient(
            135deg,
            #0b3d91,
            #2563eb
        );
}

/* Product title */
.product .product-title,
.product h3{

    font-size:28px !important;

    line-height:1.1 !important;

    font-weight:900 !important;

    color:#0f172a !important;

    text-align:center !important;

    margin-bottom:18px !important;
}

/* Description */
.product .product-desc,
.product p{

    font-size:15px !important;

    line-height:1.8 !important;

    color:#64748b !important;

    text-align:center !important;

    max-width:100% !important;

    margin:
        0 auto 26px auto !important;
}

/* Pricing area */
.product .pricing,
.product-price,
.product .price{

    text-align:center !important;

    margin-bottom:28px !important;
}

/* Main price */
.product .pricing .price,
.product-price .price,
.product .price{

    font-size:52px !important;

    line-height:1 !important;

    font-weight:900 !important;

    letter-spacing:-.05em !important;

    color:#2563eb !important;
}

/* Billing cycle */
.product .pricing .cycle,
.product .price-cycle{

    display:block;

    margin-top:8px;

    font-size:14px !important;

    font-weight:700 !important;

    color:#64748b !important;
}

/* Buttons */
.product .btn,
.product .order-button,
.product a.btn{

    width:100% !important;

    min-height:58px !important;

    border:none !important;

    border-radius:18px !important;

    background:
        linear-gradient(
            135deg,
            #0b3d91,
            #2563eb
        ) !important;

    font-size:16px !important;

    font-weight:800 !important;

    box-shadow:
        0 16px 40px rgba(37,99,235,.24) !important;
}

/* Better spacing between products */
.product + .product{
    margin-top:24px !important;
}

/* Mobile */
@media(max-width:767px){

    .product{

        padding:
            34px 24px !important;

        border-radius:28px !important;
    }

    .product .pricing .price,
    .product-price .price,
    .product .price{

        font-size:46px !important;
    }
}


/* ========================================
   PRODUCT PAGE BUTTON WIDTH FIX
======================================== */

.products .product .btn,
.product .btn,
.product a.btn {
    min-width: 150px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media(max-width:767px){

    .products .product .btn,
    .product .btn,
    .product a.btn {
        width: 150px !important;
        max-width: 150px !important;
        min-height: 58px !important;
        font-size: 15px !important;
    }

    .products .product .pricing,
    .product .pricing {
        min-width: 150px !important;
    }
}


/* Product button icon spacing */
.products .product .btn i,
.product .btn i,
.product a.btn i {
    margin-right: 6px !important;
}


/* ========================================
   SOLARHOSTPRO POLICY PAGES
======================================== */

.solar-policy-page {
    max-width: 980px;
    margin: 36px auto 70px;
    padding: 0 18px;
}

.solar-policy-card {
    background: #ffffff;
    border-radius: 32px;
    padding: 42px;
    border: 1px solid rgba(37,99,235,.08);
    box-shadow: 0 22px 60px rgba(15,23,42,.07);
}

.solar-policy-badge {
    display: inline-flex;
    padding: 8px 14px;
    border-radius: 999px;
    background: #eff6ff;
    color: #2563eb;
    font-weight: 900;
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.solar-policy-card h1 {
    color: #0f172a;
    font-size: 52px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.06em;
    margin-bottom: 28px;
}

.solar-policy-content h3 {
    color: #0f172a;
    font-weight: 900;
    margin-top: 28px;
    margin-bottom: 10px;
}

.solar-policy-content p {
    color: #475569;
    line-height: 1.8;
    font-size: 16px;
}

@media(max-width:767px) {
    .solar-policy-card {
        padding: 30px 24px;
        border-radius: 26px;
    }

    .solar-policy-card h1 {
        font-size: 40px;
    }
}