/* CODFIX v5.21.2 — Homepage Final Visual Hotfix
 * Scope: final visual refinement only.
 * Intentionally does NOT touch the black area above the site, header offset, or hero structure.
 */
:root{
    --cfx5212-orange:#f97316;
    --cfx5212-orange-deep:#ea580c;
    --cfx5212-orange-soft:#fff7ed;
    --cfx5212-ink:#101828;
    --cfx5212-muted:#667085;
    --cfx5212-line:#e9edf3;
    --cfx5212-soft:#f8fafc;
    --cfx5212-shadow:0 18px 48px rgba(16,24,40,.075);
}

/* Section typography: stronger hierarchy without making the page louder. */
.cfx5121-section-head h2,
.cfx5130-section-head h2{
    text-wrap:balance;
    line-height:1.42;
}
.cfx5121-section-head>div>span,
.cfx5130-section-head>span,
.cfx5121-label{
    font-weight:850!important;
}
.cfx5121-section-head>a{
    font-weight:800;
    transition:color .18s ease,transform .18s ease;
}
.cfx5121-section-head>a:hover{color:var(--cfx5212-orange-deep);transform:translateY(-1px)}

/* Product grid: deterministic centering for 1, 2, 4 and 5 visible products. */
.cfx5121-product-grid{grid-auto-flow:row!important}
.cfx5121-product-grid.cfx5212-products-1>.cfx5121-product-card:nth-child(1){grid-column:3/span 2!important}
.cfx5121-product-grid.cfx5212-products-2>.cfx5121-product-card:nth-child(1){grid-column:2/span 2!important}
.cfx5121-product-grid.cfx5212-products-2>.cfx5121-product-card:nth-child(2){grid-column:4/span 2!important}
.cfx5121-product-grid.cfx5212-products-4>.cfx5121-product-card:nth-child(4){grid-column:3/span 2!important}
.cfx5121-product-grid.cfx5212-products-5>.cfx5121-product-card:nth-child(4){grid-column:2/span 2!important}
.cfx5121-product-grid.cfx5212-products-5>.cfx5121-product-card:nth-child(5){grid-column:4/span 2!important}
.cfx5121-product-card{
    border-color:#edf0f4!important;
    transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.cfx5121-product-card:hover{border-color:#fed7aa!important;box-shadow:var(--cfx5212-shadow)!important}
.cfx5121-product-card .visual{height:214px!important}
.cfx5121-product-card .content{padding:21px 21px 19px!important}
.cfx5121-product-card .content p{min-height:0!important;-webkit-line-clamp:2!important;margin-bottom:6px!important}
.cfx5121-product-card .content>a{padding-top:16px!important}

/* Services: equal bottoms, less text density, cleaner hierarchy. */
.cfx33-services-grid{align-items:stretch!important}
.cfx33-service-card{
    display:flex!important;
    flex-direction:column!important;
    min-height:286px!important;
    border-color:#edf0f4!important;
}
.cfx33-service-title{min-height:3.35em;display:flex;align-items:flex-start}
.cfx33-service-description{-webkit-line-clamp:3!important;margin-bottom:14px!important}
.cfx33-service-link{padding-top:10px!important}

/* Hosting: exact CTA baseline and stronger savings/pricing hierarchy. */
.cfx5122-hosting-grid{align-items:stretch!important}
.cfx5122-hosting-card{height:100%!important}
.cfx5122-plan-price{line-height:1.15!important}
.cfx5122-hosting-card .cfx5122-plan-cta{margin-top:auto!important}
.cfx5122-annual-saving:not([hidden]){
    box-shadow:inset 0 0 0 1px rgba(2,122,72,.09);
    letter-spacing:.01em;
}

/* SaaS / subscriptions: more presence after the dark process block. */
.cfx5121-section.saas{
    background:
      radial-gradient(circle at 12% 18%,rgba(249,115,22,.075),transparent 28%),
      linear-gradient(135deg,#fffaf6 0%,#fff 58%,#fff7ed 100%)!important;
    border-top:1px solid #ffedd5;
    border-bottom:1px solid #ffedd5;
}
.cfx5121-saas-wrap .copy p{max-width:60ch}
.cfx5121-saas-stack a{
    border-color:#fed7aa!important;
    box-shadow:0 10px 28px rgba(249,115,22,.055)!important;
}
.cfx5121-saas-stack a:hover{border-color:#fb923c!important;box-shadow:0 18px 42px rgba(249,115,22,.11)!important}

/* Technology: larger cards, clearer marks, less empty visual space. */
.cfx5211-tech-section{padding-top:68px!important;padding-bottom:70px!important}
.cfx5211-tech-head{margin-bottom:24px!important}
.cfx5211-tech-head>div{max-width:900px}
.cfx5211-tech-head h2{max-width:760px}
.cfx5211-tech-head p{font-size:.98rem!important;max-width:68ch!important}
.cfx5121-tech-grid.cfx5211-tech-grid{gap:16px!important}
.cfx5211-tech-card{
    min-height:108px!important;
    padding:20px!important;
    border-radius:20px!important;
    border-color:#edf0f4!important;
}
.cfx5211-tech-card>i{
    width:56px!important;height:56px!important;border-radius:16px!important;
    font-size:.82rem!important;
    box-shadow:inset 0 0 0 1px rgba(249,115,22,.025);
}
.cfx5211-tech-card strong{font-size:1rem!important;line-height:1.45}
.cfx5211-tech-card div>span{font-size:.76rem!important;line-height:1.5}

/* Blog: equal card rhythm and aligned read-more actions. */
.cfx5141-blog-grid{align-items:stretch}
.cfx5141-blog-card{display:flex;flex-direction:column;height:100%}
.cfx5141-blog-card .media{flex:0 0 auto}
.cfx5141-blog-card .content{display:flex;flex-direction:column;flex:1}
.cfx5141-blog-card h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.cfx5141-blog-card p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.cfx5141-blog-card .read{margin-top:auto;padding-top:8px}

/* FAQ: cleaner cards and a more obvious open state. */
.cfx5121-faq-grid{gap:62px!important;align-items:start}
.cfx5121-faq-grid>div:first-child{position:sticky;top:112px}
.cfx5121-faq-grid details{
    border:1px solid var(--cfx5212-line)!important;
    border-radius:16px;
    padding:0!important;
    margin-bottom:10px;
    background:#fff;
    overflow:hidden;
    transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.cfx5121-faq-grid details:hover{border-color:#fed7aa!important;box-shadow:0 10px 30px rgba(16,24,40,.045)}
.cfx5121-faq-grid details[open]{border-color:#fdba74!important;background:#fffaf6}
.cfx5121-faq-grid summary{padding:17px 18px!important;font-size:.98rem!important;align-items:center}
.cfx5121-faq-grid summary span{
    width:29px;height:29px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;
    background:var(--cfx5212-orange-soft);color:var(--cfx5212-orange);font-size:1.05rem;
    transition:transform .2s ease,background .2s ease,color .2s ease;
}
.cfx5121-faq-grid details[open] summary span{transform:rotate(45deg);background:var(--cfx5212-orange);color:#fff}
.cfx5121-faq-grid details p{margin:0;padding:0 18px 18px!important;font-size:.9rem;line-height:1.9!important}

/* Footer: stronger finish while preserving the existing structure and black top area. */
.cfx5121-footer .cfx5121-footer-topline{padding-top:42px!important;padding-bottom:30px!important}
.cfx5121-footer-topline strong{font-size:clamp(1.35rem,2.2vw,2rem)!important;max-width:700px!important}
.cfx5121-footer .cfx32-footer-grid{
    grid-template-columns:1.65fr 1fr 1fr 1.15fr!important;
    gap:46px!important;
    padding-top:46px!important;
    padding-bottom:42px!important;
}
.cfx5121-footer .cfx32-footer-grid>div:first-child{padding-inline-end:14px}
.cfx5121-footer .cfx32-brand{margin-bottom:8px}
.cfx5121-footer .cfx32-brand .cfx32-logo-box img{max-height:40px;width:auto}
.cfx5121-footer .cfx32-footer-grid h4{font-size:1rem!important;letter-spacing:-.01em}
.cfx5121-footer .cfx32-footer-grid a{font-size:.88rem!important}
.cfx5121-footer .cfx32-footer-grid p{font-size:.88rem!important;line-height:1.95!important}
.cfx5121-footer .cfx32-footer-bottom{border-top-color:rgba(255,255,255,.09);padding-top:20px;padding-bottom:20px}
.cfx5121-socials a{min-height:31px;display:inline-flex;align-items:center;justify-content:center}

/* Dark mode parity for the new visual hotfix. */
html[data-theme="dark"] .cfx5121-section.saas{
    background:radial-gradient(circle at 12% 18%,rgba(249,115,22,.08),transparent 28%),linear-gradient(135deg,#0c1423,#0b1220)!important;
    border-color:#263247;
}
html[data-theme="dark"] .cfx5121-faq-grid details{background:#0f172a;border-color:#253149!important}
html[data-theme="dark"] .cfx5121-faq-grid details:hover{border-color:rgba(249,115,22,.45)!important}
html[data-theme="dark"] .cfx5121-faq-grid details[open]{background:#111827;border-color:rgba(249,115,22,.55)!important}
html[data-theme="dark"] .cfx5121-faq-grid summary{color:#f8fafc}
html[data-theme="dark"] .cfx5121-faq-grid details p{color:#aeb8c7}
html[data-theme="dark"] .cfx5211-tech-card{border-color:#253149!important}

/* Tablet: return deterministic product placements to normal two-column flow. */
@media(max-width:1100px){
    .cfx5121-product-grid[class*="cfx5212-products-"]>.cfx5121-product-card{grid-column:auto!important}
    .cfx5211-tech-card{min-height:102px!important}
    .cfx5121-faq-grid>div:first-child{position:static}
    .cfx5121-footer .cfx32-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:34px!important}
}

/* Mobile final pass: no cramped cards, buttons or footer columns. */
@media(max-width:760px){
    .cfx5121-section-head h2,.cfx5130-section-head h2{line-height:1.5}
    .cfx5121-product-card .visual{height:202px!important}
    .cfx5121-product-card .content{padding:19px!important}
    .cfx33-service-card{min-height:0!important}
    .cfx33-service-title{min-height:0}
    .cfx5211-tech-section{padding-top:58px!important;padding-bottom:58px!important}
    .cfx5121-tech-grid.cfx5211-tech-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
    .cfx5211-tech-card{min-height:88px!important;padding:13px!important;border-radius:16px!important}
    .cfx5211-tech-card>i{width:44px!important;height:44px!important;border-radius:13px!important;font-size:.7rem!important}
    .cfx5211-tech-card strong{font-size:.88rem!important}
    .cfx5211-tech-card div>span{font-size:.68rem!important}
    .cfx5121-faq-grid{gap:26px!important}
    .cfx5121-faq-grid summary{padding:15px!important;font-size:.93rem!important}
    .cfx5121-faq-grid details p{padding:0 15px 15px!important}
    .cfx5121-footer .cfx32-footer-grid{grid-template-columns:1fr!important;gap:25px!important;padding-top:34px!important}
    .cfx5121-footer .cfx32-footer-grid>div:first-child{padding-inline-end:0}
    .cfx5121-footer-topline strong{font-size:1.32rem!important}
}

@media(max-width:480px){
    .cfx5121-tech-grid.cfx5211-tech-grid{grid-template-columns:1fr!important}
    .cfx5211-tech-card{min-height:78px!important}
}

@media(prefers-reduced-motion:reduce){
    .cfx5121-product-card,.cfx33-service-card,.cfx5211-tech-card,.cfx5121-faq-grid details,
    .cfx5121-faq-grid summary span,.cfx5121-section-head>a{transition:none!important;transform:none!important}
}