/* =========================================================
   FreeHostPro — Custom WHMCS Theme v1.0
   Theme design by A2Z Hosting (https://a2zhosting.shop)
   Brand colours: edit :root below
   ========================================================= */
:root {
    --fhp-blue: #1a56ff;
    --fhp-blue-dark: #0f3fd1;
    --fhp-blue-50: #eef3ff;
    --fhp-blue-100: #dbe6ff;
    --fhp-navy: #0a1b3d;
    --fhp-navy-2: #12285a;
    --fhp-text: #344160;
    --fhp-muted: #66728f;
    --fhp-line: #e3e8f2;
    --fhp-bg: #ffffff;
    --fhp-tint: #f5f8ff;
    --fhp-yellow: #ffcf3d;
    --fhp-green: #16a34a;
    --fhp-wa: #25d366;
    --fhp-radius: 14px;
    --fhp-shadow: 0 8px 28px -12px rgba(10, 27, 61, .18);
    --fhp-shadow-lg: 0 28px 60px -24px rgba(10, 27, 61, .35);
    --fhp-head: 'Plus Jakarta Sans', system-ui, sans-serif;
    --fhp-font: 'Inter', system-ui, sans-serif;
}

/* ---------- Base ---------- */
body.fhp-body { font-family: var(--fhp-font); color: var(--fhp-text); background: var(--fhp-bg); -webkit-font-smoothing: antialiased; }
.fhp-body h1, .fhp-body h2, .fhp-body h3, .fhp-body h4, .fhp-body h5, .fhp-body h6,
.fhp-body .h1, .fhp-body .h2, .fhp-body .h3, .fhp-body .h4, .fhp-body .h5 { font-family: var(--fhp-head); color: var(--fhp-navy); letter-spacing: -.015em; }
.fhp-body a { color: var(--fhp-blue); }
.fhp-body a:hover { color: var(--fhp-blue-dark); text-decoration: none; }

/* ---------- Buttons ---------- */
.fhp-btn, .fhp-body .btn-primary, .fhp-body .btn-success, .fhp-body .btn-default, .fhp-body .btn-info {
    border-radius: 8px; font-weight: 700; padding: .7rem 1.4rem; border: 0;
    transition: background .15s ease, transform .15s ease, box-shadow .2s ease;
}
.fhp-btn-primary, .fhp-body .btn-primary, .fhp-body .btn-success { background: var(--fhp-blue) !important; color: #fff !important; box-shadow: 0 8px 18px -10px rgba(26, 86, 255, .9); }
.fhp-btn-primary:hover, .fhp-body .btn-primary:hover, .fhp-body .btn-success:hover { background: var(--fhp-blue-dark) !important; color: #fff !important; transform: translateY(-1px); }
.fhp-body .btn-default, .fhp-body .btn-light, .fhp-body .btn-secondary { background: #fff; color: var(--fhp-navy); border: 1px solid var(--fhp-line); }
.fhp-body .btn-default:hover { border-color: var(--fhp-blue); color: var(--fhp-blue); }
.fhp-btn-outline { background: #fff; color: var(--fhp-blue) !important; border: 2px solid var(--fhp-blue) !important; }
.fhp-btn-outline:hover { background: var(--fhp-blue); color: #fff !important; }
.fhp-btn-ghost { background: #fff; color: var(--fhp-navy) !important; border: 1.5px solid var(--fhp-line) !important; }
.fhp-btn-ghost:hover { border-color: var(--fhp-blue) !important; color: var(--fhp-blue) !important; }
.fhp-btn-white { background: #fff; color: var(--fhp-blue) !important; }
.fhp-btn-white:hover { background: var(--fhp-blue-50); }
.fhp-btn-ghost-light { background: transparent; color: #fff !important; border: 2px solid rgba(255, 255, 255, .6) !important; }
.fhp-btn-ghost-light:hover { background: rgba(255, 255, 255, .12); }
.fhp-btn-wa { background: var(--fhp-wa); color: #fff !important; }
.fhp-btn-wa:hover { filter: brightness(1.05); }
.fhp-btn-sm { padding: .5rem 1.1rem; font-size: .9rem; }
.fhp-btn-lg { padding: .9rem 1.7rem; font-size: 1.02rem; }

/* ---------- Promo bar ---------- */
.fhp-promo { background: var(--fhp-navy); color: #dfe7ff; font-size: .88rem; padding: .55rem 0; }
.fhp-promo .container { display: flex; align-items: center; justify-content: center; gap: .75rem; flex-wrap: wrap; text-align: center; }
.fhp-promo-tag { background: var(--fhp-yellow); color: var(--fhp-navy); font-weight: 800; font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; border-radius: 4px; padding: .15rem .45rem; }
.fhp-promo-link { color: var(--fhp-yellow) !important; font-weight: 700; white-space: nowrap; }
.fhp-promo-link:hover { color: #fff !important; }

/* ---------- Header ---------- */
.fhp-header { position: sticky; top: 0; z-index: 1030; background: #fff; border-bottom: 1px solid var(--fhp-line); transition: box-shadow .2s ease; }
.fhp-header.is-scrolled { box-shadow: 0 6px 24px -14px rgba(10, 27, 61, .35); }
.fhp-header .fhp-nav { padding: .7rem 0; background: #fff; }
.fhp-brand { display: inline-flex; align-items: center; gap: .55rem; margin-right: 1.5rem; text-decoration: none !important; }
.fhp-brand .logo-img { max-height: 42px; }
.fhp-logo-mark { width: 38px; height: 38px; border-radius: 10px; background: var(--fhp-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; box-shadow: 0 8px 16px -8px rgba(26, 86, 255, .9); }
.fhp-logo-text { font-family: var(--fhp-head); font-weight: 800; font-size: 1.35rem; color: var(--fhp-navy); letter-spacing: -.02em; }
.fhp-logo-text b { color: var(--fhp-blue); font-weight: 800; }
.fhp-brand-light .fhp-logo-text { color: #fff; }
.fhp-brand-light .fhp-logo-text b { color: #7ea2ff; }

.fhp-nav .navbar-nav .nav-link { font-weight: 600; color: var(--fhp-navy) !important; padding: .55rem .85rem !important; border-radius: 8px; }
.fhp-nav .navbar-nav .nav-link:hover, .fhp-nav .navbar-nav .show > .nav-link, .fhp-nav .navbar-nav .active > .nav-link { color: var(--fhp-blue) !important; background: var(--fhp-blue-50); }
.fhp-nav .dropdown-menu { border: 1px solid var(--fhp-line); border-radius: 12px; box-shadow: var(--fhp-shadow-lg); padding: .5rem; margin-top: .5rem; min-width: 240px; }
.fhp-nav .dropdown-item { border-radius: 8px; padding: .6rem .85rem; font-weight: 600; color: var(--fhp-text); }
.fhp-nav .dropdown-item:hover, .fhp-nav .dropdown-item:focus { background: var(--fhp-blue-50); color: var(--fhp-blue); }
.fhp-toolbar { gap: .6rem; margin-left: .75rem; }
.fhp-call { color: var(--fhp-navy) !important; font-weight: 700; font-size: .92rem; white-space: nowrap; }
.fhp-call i { color: var(--fhp-blue); margin-right: .25rem; }
.fhp-cart { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; background: var(--fhp-blue-50); color: var(--fhp-navy) !important; font-size: 1.05rem; }
.fhp-cart:hover { color: var(--fhp-blue) !important; }
.fhp-cart-count { position: absolute; top: -4px; right: -4px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; background: var(--fhp-blue); color: #fff; font-size: .7rem; font-weight: 700; line-height: 19px; text-align: center; border: 2px solid #fff; }
.fhp-burger { width: 42px; height: 42px; border-radius: 10px; border: 0; background: var(--fhp-navy); display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.fhp-burger span { display: block; width: 18px; height: 2px; background: #fff; border-radius: 2px; }
.fhp-userbar { background: var(--fhp-tint); border-top: 1px solid var(--fhp-line); font-size: .85rem; padding: .4rem 0; color: var(--fhp-muted); }
.fhp-userbar strong { color: var(--fhp-navy); }
.fhp-userbar a { margin-left: 1rem; font-weight: 600; }
@media (max-width: 1199.98px) {
    .fhp-nav .container { flex-wrap: wrap; }
    .fhp-nav #mainNavbar { order: 3; width: 100%; }
    .fhp-nav #mainNavbar.show, .fhp-nav #mainNavbar.collapsing { margin-top: .75rem; padding: .6rem; border: 1px solid var(--fhp-line); border-radius: 12px; background: #fff; }
    .fhp-toolbar { margin-left: auto; }
    .fhp-nav .dropdown-menu { box-shadow: none; border: 0; padding-left: 1rem; }
}

/* ---------- Inner page head ---------- */
.fhp-pagehead { background: linear-gradient(180deg, var(--fhp-blue-50), #fff); border-bottom: 1px solid var(--fhp-line); padding: 1.8rem 0 1.6rem; }
.fhp-pagehead-title { font-size: 1.9rem; font-weight: 800; margin: .35rem 0 0; }
.fhp-body .fhp-pagehead .master-breadcrumb, .fhp-body .fhp-pagehead .breadcrumb { background: transparent !important; padding: 0 !important; margin: 0; }
.fhp-pagehead .breadcrumb-item, .fhp-pagehead .breadcrumb-item a { font-size: .88rem; color: var(--fhp-muted); }
.fhp-pagehead .breadcrumb-item a:hover { color: var(--fhp-blue); }
.fhp-pagehead .breadcrumb-item.active { color: var(--fhp-blue); font-weight: 600; }
.fhp-body section#main-body.fhp-main { padding: 2.2rem 0 4rem; min-height: 0; background: #fff; }
.fhp-body section#main-body.fhp-home { padding: 0; min-height: 0; }

/* ---------- Inner page components ---------- */
.fhp-body .card, .fhp-body .panel { border: 1px solid var(--fhp-line); border-radius: var(--fhp-radius); box-shadow: 0 2px 10px -6px rgba(10, 27, 61, .12); overflow: hidden; }
.fhp-body .card-header { background: #fff; border-bottom: 1px solid var(--fhp-line); font-family: var(--fhp-head); font-weight: 700; color: var(--fhp-navy); }
.fhp-body .card-footer { background: var(--fhp-tint); border-top: 1px solid var(--fhp-line); }
.fhp-body .sidebar .card { margin-bottom: 1.25rem; }
.fhp-body .sidebar .card-header i { color: var(--fhp-blue); }
.fhp-body .list-group-item { border-color: var(--fhp-line); font-weight: 500; color: var(--fhp-text); }
.fhp-body .list-group-item-action:hover { background: var(--fhp-blue-50); color: var(--fhp-blue); }
.fhp-body .list-group-item.active, .fhp-body .list-group-item.active:hover { background: var(--fhp-blue-50); color: var(--fhp-blue); border-color: var(--fhp-line); border-left: 3px solid var(--fhp-blue); font-weight: 700; }
.fhp-body .tiles .tile { border-radius: var(--fhp-radius); background: #fff; border: 1px solid var(--fhp-line); transition: transform .2s ease, box-shadow .2s ease; }
.fhp-body .tiles .tile:hover { transform: translateY(-3px); box-shadow: var(--fhp-shadow); }
.fhp-body .tiles .tile i { color: var(--fhp-blue); opacity: .2; }
.fhp-body .tiles .tile .stat { font-family: var(--fhp-head); color: var(--fhp-navy); }
.fhp-body .tiles .tile .highlight { background: var(--fhp-blue) !important; height: 4px; }
.fhp-body .form-control, .fhp-body .custom-select { border-radius: 8px; border: 1.5px solid var(--fhp-line); padding: .6rem .9rem; height: auto; color: var(--fhp-navy); }
.fhp-body .form-control:focus, .fhp-body .custom-select:focus { border-color: var(--fhp-blue); box-shadow: 0 0 0 4px rgba(26, 86, 255, .12); }
.fhp-body label { font-weight: 600; color: var(--fhp-navy); }
.fhp-body .input-group-text { border-radius: 8px; border: 1.5px solid var(--fhp-line); background: var(--fhp-tint); }
.fhp-body .table thead th { border-top: 0; border-bottom: 1px solid var(--fhp-line); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--fhp-muted); font-weight: 700; }
.fhp-body .table td { border-color: var(--fhp-line); vertical-align: middle; }
.fhp-body .label, .fhp-body .badge { border-radius: 999px; font-weight: 700; padding: .35em .75em; }
.fhp-body .status-active, .fhp-body .status-paid, .fhp-body .badge-success { background: rgba(22, 163, 74, .12) !important; color: #11803b !important; }
.fhp-body .status-unpaid, .fhp-body .status-overdue, .fhp-body .badge-danger { background: rgba(239, 68, 68, .12) !important; color: #c22a2a !important; }
.fhp-body .status-pending, .fhp-body .badge-warning { background: rgba(245, 158, 11, .14) !important; color: #a46404 !important; }
.fhp-body .alert { border: 0; border-radius: 10px; }
.fhp-body .alert-info { background: var(--fhp-blue-50); color: #1d3f9e; }
.fhp-body .nav-tabs .nav-link { border: 0; border-bottom: 2px solid transparent; font-weight: 600; color: var(--fhp-muted); }
.fhp-body .nav-tabs .nav-link.active { color: var(--fhp-blue); border-bottom-color: var(--fhp-blue); background: transparent; }
.fhp-body .page-item.active .page-link { background: var(--fhp-blue); border-color: var(--fhp-blue); }

/* Cart (standard_cart) */
.fhp-body #order-standard_cart .products .product { border: 1px solid var(--fhp-line); border-radius: var(--fhp-radius); background: #fff; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.fhp-body #order-standard_cart .products .product:hover { transform: translateY(-4px); box-shadow: var(--fhp-shadow-lg); }
.fhp-body #order-standard_cart .products .product header { background: var(--fhp-blue-50); padding: 1rem 1.25rem; border-bottom: 1px solid var(--fhp-line); }
.fhp-body #order-standard_cart .products .product header span { font-family: var(--fhp-head); font-weight: 800; color: var(--fhp-navy); }
.fhp-body #order-standard_cart .products .product div.product-pricing span.price { font-family: var(--fhp-head); color: var(--fhp-blue); font-weight: 800; }
.fhp-body #order-standard_cart .order-summary { border-radius: var(--fhp-radius); background: var(--fhp-navy); border: 0; }
.fhp-body #order-standard_cart .order-summary h2 { background: transparent; font-family: var(--fhp-head); }
.fhp-body #order-standard_cart .order-summary .total-due-today .amt { color: var(--fhp-yellow); }
.fhp-body #order-standard_cart .sub-heading span { background: #fff; color: var(--fhp-navy); font-family: var(--fhp-head); }

/* =========================================================
   HOMEPAGE
   ========================================================= */
.fhp-hero { position: relative; overflow: hidden; background: linear-gradient(180deg, #eaf1ff 0%, #f6f9ff 60%, #fff 100%); padding: 4.5rem 0 6.5rem; }
.fhp-pill { display: inline-flex; align-items: center; gap: .45rem; background: #fff; border: 1px solid var(--fhp-blue-100); color: var(--fhp-blue); font-weight: 700; font-size: .85rem; padding: .4rem .9rem; border-radius: 999px; margin-bottom: 1.3rem; box-shadow: 0 6px 14px -10px rgba(26, 86, 255, .6); }
.fhp-hero-title { font-size: clamp(2.2rem, 4.8vw, 3.6rem); font-weight: 800; line-height: 1.08; letter-spacing: -.03em; margin-bottom: 1.1rem; }
.fhp-hero-title span { color: var(--fhp-blue); }
.fhp-hero-sub { font-size: 1.12rem; line-height: 1.65; color: var(--fhp-text); max-width: 540px; margin-bottom: 1.8rem; }
.fhp-hero-cta { display: flex; flex-wrap: wrap; gap: .8rem; }
.fhp-hero-checks { list-style: none; padding: 0; margin: 1.8rem 0 0; display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; }
.fhp-hero-checks li { font-weight: 600; color: var(--fhp-navy); font-size: .93rem; }
.fhp-hero-checks i { color: var(--fhp-green); margin-right: .35rem; }

.fhp-hero-art { position: relative; height: 430px; }
.fhp-blob { position: absolute; width: 440px; height: 440px; right: 0; top: -10px; border-radius: 46% 54% 52% 48% / 50% 44% 56% 50%; background: linear-gradient(135deg, #cfdcff, #e9f0ff); }
.fhp-browser { position: absolute; left: 40px; right: 30px; top: 50px; background: #fff; border-radius: 16px; box-shadow: var(--fhp-shadow-lg); overflow: hidden; border: 1px solid var(--fhp-line); }
.fhp-browser-bar { display: flex; align-items: center; gap: 6px; padding: .7rem 1rem; background: var(--fhp-tint); border-bottom: 1px solid var(--fhp-line); }
.fhp-browser-bar span { width: 10px; height: 10px; border-radius: 50%; background: #d4dbea; }
.fhp-browser-bar span:first-child { background: #ff6b6b; } .fhp-browser-bar span:nth-child(2) { background: #ffc94a; } .fhp-browser-bar span:nth-child(3) { background: #3dd68c; }
.fhp-browser-bar em { margin-left: .8rem; font-style: normal; font-size: .78rem; color: var(--fhp-muted); background: #fff; border: 1px solid var(--fhp-line); border-radius: 999px; padding: .1rem .8rem; }
.fhp-browser-body { padding: 1.2rem; }
.fhp-mock-nav { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.2rem; }
.fhp-mock-nav i { width: 26px; height: 26px; border-radius: 7px; background: var(--fhp-blue); }
.fhp-mock-nav b { height: 8px; width: 46px; border-radius: 4px; background: #e3e8f2; }
.fhp-mock-nav b:first-of-type { margin-left: auto; }
.fhp-mock-hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: 1rem; align-items: center; margin-bottom: 1.2rem; }
.fhp-mock-hero i { display: block; height: 12px; border-radius: 6px; background: var(--fhp-navy); margin-bottom: .55rem; }
.fhp-mock-hero i.w70 { width: 90%; } .fhp-mock-hero i.w50 { width: 65%; background: #c7d2e8; }
.fhp-mock-hero i.btn { width: 42%; height: 24px; border-radius: 6px; background: var(--fhp-blue); margin-top: .9rem; padding: 0; }
.fhp-mock-img { height: 110px; border-radius: 12px; background: linear-gradient(135deg, #ffd66b, #ff9f6b); display: flex; align-items: center; justify-content: center; color: rgba(255, 255, 255, .85); font-size: 2rem; }
.fhp-mock-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.fhp-mock-cards b { height: 56px; border-radius: 10px; background: var(--fhp-tint); border: 1px solid var(--fhp-line); }
.fhp-float { position: absolute; display: flex; align-items: center; gap: .65rem; background: #fff; border-radius: 12px; padding: .65rem .9rem; box-shadow: var(--fhp-shadow-lg); border: 1px solid var(--fhp-line); animation: fhpFloat 5s ease-in-out infinite; }
.fhp-float span { width: 34px; height: 34px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.fhp-float .ok { background: var(--fhp-green); } .fhp-float .wp { background: #21759b; } .fhp-float .sp { background: var(--fhp-blue); }
.fhp-float small { display: block; font-size: .7rem; color: var(--fhp-muted); font-weight: 600; line-height: 1.2; }
.fhp-float strong { font-family: var(--fhp-head); color: var(--fhp-navy); font-size: .9rem; }
.fhp-float-a { left: 0; top: 18px; }
.fhp-float-b { right: 0; top: 190px; animation-delay: -1.6s; }
.fhp-float-c { left: 20px; bottom: 10px; animation-delay: -3.2s; }
@keyframes fhpFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* Domain */
.fhp-domain { margin-top: -4rem; position: relative; z-index: 2; }
.fhp-domain-card { background: #fff; border-radius: 18px; box-shadow: var(--fhp-shadow-lg); border: 1px solid var(--fhp-line); padding: 2rem 2.2rem; }
.fhp-domain-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: .3rem 1rem; margin-bottom: 1.1rem; }
.fhp-domain-head h2 { font-size: 1.45rem; font-weight: 800; margin: 0; }
.fhp-domain-head p { margin: 0; color: var(--fhp-muted); }
.fhp-search { position: relative; display: flex; align-items: center; gap: .5rem; border: 2px solid var(--fhp-blue-100); border-radius: 12px; padding: .35rem .35rem .35rem 2.8rem; transition: border-color .15s ease; }
.fhp-search:focus-within { border-color: var(--fhp-blue); }
.fhp-search-icon { position: absolute; left: 1.05rem; color: var(--fhp-muted); }
.fhp-search-input { flex: 1; min-width: 0; border: 0; outline: 0; font-size: 1.05rem; font-weight: 500; color: var(--fhp-navy); padding: .65rem 0; background: transparent; }
.fhp-search-transfer { border: 0; background: transparent; color: var(--fhp-muted); font-weight: 700; padding: .5rem .8rem; border-radius: 8px; }
.fhp-search-transfer:hover { background: var(--fhp-blue-50); color: var(--fhp-blue); }
.fhp-search .fhp-btn { padding: .75rem 1.8rem; }
.fhp-tlds { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1rem; }
.fhp-tlds span { font-family: var(--fhp-head); font-weight: 700; font-size: .85rem; color: var(--fhp-navy); background: var(--fhp-tint); border: 1px solid var(--fhp-line); border-radius: 6px; padding: .2rem .6rem; }
.fhp-tlds a { font-weight: 700; font-size: .9rem; margin-left: .3rem; }

/* Sections */
.fhp-section { padding: 5rem 0; }
.fhp-section-tint { background: var(--fhp-tint); }
.fhp-head { text-align: center; max-width: 660px; margin: 0 auto 2.8rem; }
.fhp-head h2, .fhp-h2-left { font-size: clamp(1.8rem, 3.4vw, 2.5rem); font-weight: 800; margin-bottom: .6rem; }
.fhp-head p, .fhp-muted, .fhp-lead { color: var(--fhp-muted); font-size: 1.06rem; }
.fhp-lead { line-height: 1.7; }
.fhp-head-row { display: flex; align-items: flex-end; justify-content: space-between; text-align: left; max-width: none; }
.fhp-kicker { display: inline-block; color: var(--fhp-blue); font-weight: 800; font-size: .8rem; text-transform: uppercase; letter-spacing: .12em; margin-bottom: .6rem; }
.fhp-link { font-weight: 700; }

/* Plans */
.fhp-plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; align-items: stretch; }
.fhp-plan { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--fhp-line); border-radius: 16px; padding: 1.8rem 1.5rem; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.fhp-plan:hover { transform: translateY(-5px); box-shadow: var(--fhp-shadow-lg); border-color: var(--fhp-blue-100); }
.fhp-plan-ico { width: 52px; height: 52px; border-radius: 14px; background: var(--fhp-blue-50); color: var(--fhp-blue); display: inline-flex; align-items: center; justify-content: center; font-size: 1.35rem; }
.fhp-plan h3 { font-size: 1.25rem; font-weight: 800; margin: 1.1rem 0 .4rem; }
.fhp-plan-desc { color: var(--fhp-muted); font-size: .95rem; min-height: 48px; }
.fhp-plan-price { display: flex; align-items: baseline; gap: .25rem; margin: .3rem 0 .4rem; }
.fhp-plan-price strong { font-family: var(--fhp-head); font-size: 2.2rem; font-weight: 800; color: var(--fhp-navy); }
.fhp-plan-price span { color: var(--fhp-muted); font-weight: 600; }
.fhp-plan-note { display: inline-flex; align-self: flex-start; font-size: .78rem; font-weight: 700; color: var(--fhp-green); background: rgba(22, 163, 74, .1); border-radius: 999px; padding: .25rem .7rem; margin: .5rem 0 .55rem; }
.fhp-plan ul { list-style: none; padding: 0; margin: 1rem 0 1.6rem; flex: 1; }
.fhp-plan li { padding: .4rem 0; font-weight: 500; font-size: .94rem; color: var(--fhp-text); }
.fhp-plan li i { color: var(--fhp-blue); margin-right: .55rem; font-size: .85rem; }
.fhp-plan-pop { border: 2px solid var(--fhp-blue); box-shadow: var(--fhp-shadow-lg); }
.fhp-ribbon { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: var(--fhp-blue); color: #fff; font-size: .74rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: .3rem .9rem; border-radius: 999px; white-space: nowrap; }
.fhp-fineprint { text-align: center; color: var(--fhp-muted); font-size: .82rem; margin: 1.6rem 0 0; }

/* Features */
.fhp-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.fhp-feature { background: #fff; border: 1px solid var(--fhp-line); border-radius: 16px; padding: 1.7rem; transition: box-shadow .2s ease, transform .2s ease; }
.fhp-feature:hover { box-shadow: var(--fhp-shadow); transform: translateY(-3px); }
.fhp-feature > span { width: 48px; height: 48px; border-radius: 12px; background: var(--fhp-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; box-shadow: 0 10px 18px -10px rgba(26, 86, 255, .9); }
.fhp-feature h4 { font-size: 1.12rem; font-weight: 800; margin: 1rem 0 .4rem; }
.fhp-feature p { color: var(--fhp-muted); margin: 0; line-height: 1.6; }

/* WordPress split */
.fhp-wp-art { position: relative; background: linear-gradient(135deg, #dce7ff, #f1f5ff); border-radius: 24px; padding: 3rem 2.5rem; }
.fhp-wp-card { background: #fff; border-radius: 16px; box-shadow: var(--fhp-shadow-lg); padding: 1.4rem 1.5rem; max-width: 420px; margin: 0 auto; }
.fhp-wp-top { font-family: var(--fhp-head); font-weight: 800; color: var(--fhp-navy); margin-bottom: 1rem; }
.fhp-wp-top i { color: #21759b; font-size: 1.3rem; margin-right: .35rem; vertical-align: -2px; }
.fhp-wp-row { display: flex; justify-content: space-between; padding: .6rem 0; border-bottom: 1px dashed var(--fhp-line); font-size: .92rem; }
.fhp-wp-row span { color: var(--fhp-muted); }
.fhp-wp-row b { color: var(--fhp-navy); }
.fhp-wp-row b.g { color: var(--fhp-green); }
.fhp-wp-bar { height: 8px; border-radius: 999px; background: var(--fhp-blue-50); margin: 1.1rem 0 .8rem; overflow: hidden; }
.fhp-wp-bar i { display: block; height: 100%; width: 100%; background: var(--fhp-blue); border-radius: 999px; animation: fhpBar 2.4s ease-out both; }
@keyframes fhpBar { from { width: 8%; } to { width: 100%; } }
.fhp-wp-done { font-weight: 700; color: var(--fhp-green); font-size: .92rem; }
.fhp-checklist { list-style: none; padding: 0; margin: 1.3rem 0 1.8rem; }
.fhp-checklist li { padding: .45rem 0; font-weight: 600; color: var(--fhp-navy); }
.fhp-checklist i { width: 24px; height: 24px; border-radius: 50%; background: rgba(22, 163, 74, .12); color: var(--fhp-green); display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; margin-right: .6rem; }

/* Steps */
.fhp-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.fhp-step { background: #fff; border: 1px solid var(--fhp-line); border-radius: 16px; padding: 1.8rem; }
.fhp-step b { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--fhp-blue); color: #fff; font-family: var(--fhp-head); font-size: 1.15rem; }
.fhp-step h4 { font-size: 1.15rem; font-weight: 800; margin: 1rem 0 .35rem; }
.fhp-step p { color: var(--fhp-muted); margin: 0; }

/* News */
.fhp-news { display: block; height: 100%; padding: 1.5rem; background: #fff; border: 1px solid var(--fhp-line); border-radius: 14px; transition: box-shadow .2s ease, transform .2s ease; }
.fhp-news:hover { box-shadow: var(--fhp-shadow); transform: translateY(-3px); }
.fhp-news small { color: var(--fhp-muted); font-weight: 600; }
.fhp-news h4 { font-size: 1.08rem; margin: .45rem 0 1rem; }
.fhp-news span { font-weight: 700; }

/* FAQ */
.fhp-faq { border: 1px solid var(--fhp-line); border-radius: 12px; padding: 0 1.3rem; margin-bottom: .7rem; background: #fff; }
.fhp-faq[open] { border-color: var(--fhp-blue-100); box-shadow: var(--fhp-shadow); }
.fhp-faq summary { list-style: none; cursor: pointer; padding: 1.1rem 0; font-family: var(--fhp-head); font-weight: 700; color: var(--fhp-navy); display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.fhp-faq summary::-webkit-details-marker { display: none; }
.fhp-faq summary::after { content: "\f107"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 900; color: var(--fhp-blue); transition: transform .2s ease; }
.fhp-faq[open] summary::after { transform: rotate(180deg); }
.fhp-faq p { color: var(--fhp-muted); margin: 0; padding-bottom: 1.1rem; line-height: 1.65; }

/* Final CTA */
.fhp-final { padding: 0 0 5rem; }
.fhp-final-box { background: var(--fhp-blue); background-image: radial-gradient(500px 220px at 90% 0%, rgba(255, 255, 255, .18), transparent 60%), radial-gradient(500px 260px at 0% 100%, rgba(10, 27, 61, .35), transparent 60%); border-radius: 22px; padding: 3.2rem 2rem; text-align: center; color: #fff; }
.fhp-final-box h2 { color: #fff !important; font-weight: 800; font-size: clamp(1.7rem, 3.4vw, 2.4rem); }
.fhp-final-box p { opacity: .9; font-size: 1.06rem; margin-bottom: 1.6rem; }

/* ---------- Footer ---------- */
.fhp-body footer.footer.fhp-footer { background: var(--fhp-navy); color: #aab6d3; font-size: .95rem; padding: 0 0 2rem; margin: 0; }
.fhp-footer-cta { background: var(--fhp-navy-2); border-bottom: 1px solid rgba(255, 255, 255, .06); padding: 1.8rem 0; margin-bottom: 3.5rem; }
.fhp-footer-cta-in { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; flex-wrap: wrap; }
.fhp-footer-cta h3 { color: #fff !important; font-size: 1.3rem; font-weight: 800; margin: 0 0 .2rem; }
.fhp-footer-cta p { margin: 0; color: #aab6d3; }
.fhp-footer-cta-actions { display: flex; gap: .7rem; flex-wrap: wrap; }
.fhp-footer h6 { color: #fff !important; font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 800; margin-bottom: 1rem; }
.fhp-footer ul { list-style: none; padding: 0; margin: 0; }
.fhp-footer ul li { margin-bottom: .55rem; }
.fhp-footer a { color: #c9d3ea; }
.fhp-footer a:hover { color: #fff; }
.fhp-footer-about { margin: 1rem 0; max-width: 340px; line-height: 1.65; }
.fhp-footer-contact i { color: #7ea2ff; width: 20px; }
.fhp-social { display: flex; gap: .5rem; margin-top: 1rem; }
.fhp-social a { width: 36px; height: 36px; border-radius: 9px; background: rgba(255, 255, 255, .08); display: inline-flex; align-items: center; justify-content: center; }
.fhp-social a:hover { background: var(--fhp-blue); }
.fhp-footer-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; border-top: 1px solid rgba(255, 255, 255, .08); padding-top: 1.5rem; margin-top: 1.5rem; font-size: .87rem; }
.fhp-body footer.footer.fhp-footer .copyright { margin: 0; text-align: left; font-size: .87rem; }
.fhp-footer-tools { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.fhp-locale-btn { background: rgba(255, 255, 255, .06); color: #dfe7ff; border: 1px solid rgba(255, 255, 255, .12); border-radius: 8px; padding: .4rem .85rem; font-weight: 600; font-size: .85rem; }
.fhp-credit { color: #8d9bbd; }
.fhp-credit a { color: #fff !important; font-weight: 700; }

/* WhatsApp */
.fhp-wa-float { position: fixed; right: 22px; bottom: 22px; z-index: 1040; width: 56px; height: 56px; border-radius: 50%; background: var(--fhp-wa); color: #fff !important; display: flex; align-items: center; justify-content: center; font-size: 1.75rem; box-shadow: 0 12px 26px -8px rgba(37, 211, 102, .7); transition: transform .2s ease; }
.fhp-wa-float:hover { transform: scale(1.07); }

/* Reveal */
.fhp-reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease, box-shadow .2s ease, border-color .2s ease; }
.fhp-reveal.is-visible { opacity: 1; transform: none; }
.fhp-plan.fhp-reveal.is-visible:hover, .fhp-feature.fhp-reveal.is-visible:hover { transform: translateY(-5px); }

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) { .fhp-plans { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 991.98px) {
    .fhp-hero { padding: 3rem 0 6rem; }
    .fhp-features, .fhp-steps { grid-template-columns: 1fr 1fr; }
    .fhp-section { padding: 4rem 0; }
}
@media (max-width: 575.98px) {
    .fhp-promo { font-size: .8rem; }
    .fhp-plans, .fhp-features, .fhp-steps { grid-template-columns: 1fr; }
    .fhp-domain-card { padding: 1.4rem 1.1rem; }
    .fhp-search { flex-wrap: wrap; padding: .45rem .45rem .45rem 2.5rem; }
    .fhp-search-icon { top: 1.2rem; }
    .fhp-search-input { flex-basis: calc(100% - 10px); }
    .fhp-search .fhp-btn { flex: 1; }
    .fhp-hero-cta .fhp-btn { flex: 1; text-align: center; }
    .fhp-head-row { flex-direction: column; align-items: flex-start; gap: .4rem; }
    .fhp-logo-text { font-size: 1.15rem; }
    .fhp-wp-art { padding: 1.6rem 1rem; }
    .fhp-wa-float { width: 52px; height: 52px; font-size: 1.6rem; right: 16px; bottom: 16px; }
    .fhp-footer-bottom { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .fhp-reveal { opacity: 1; transform: none; }
}
#fullpage-overlay.w-hidden { display: none; }
.fhp-footer a.fhp-btn-white { background: #fff; color: var(--fhp-blue) !important; }
.fhp-footer a.fhp-btn-wa { color: #fff !important; }

/* ---------- Mobile polish ---------- */
.fhp-nav > .container { padding-left: 16px !important; padding-right: 16px !important; }
.fhp-btn { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; }
@media (max-width: 575.98px) {
    .fhp-promo { padding: .5rem 0; font-size: .78rem; }
    .fhp-promo .container { gap: .35rem .6rem; }
    .fhp-promo-tag { display: none; }
    .fhp-hero { padding: 2.5rem 0 5.5rem; }
    .fhp-hero-cta { flex-direction: column; }
    .fhp-hero-cta .fhp-btn { width: 100%; }
}