/* HostPlus 2026 Reviews & Migration v1.3.1 — approved mockup layout.
   Scoped to one Avada section. No changes to Hero, header, cards, or footer. */
.hp26-reviews-migration-section { background:#fff !important; }
.hp26-reviews-migration-section .fusion-builder-row {
    width:100% !important; max-width:1510px !important; margin-inline:auto !important;
}
.hp26-rm, .hp26-rm *, .hp26-rm *::before, .hp26-rm *::after { box-sizing:border-box; }
.hp26-rm {
    width:100%; display:flex !important; flex-direction:column !important;
    align-items:stretch; gap:32px; color:#142c54; font-family:inherit;
}
/* 1. Full-width navy migration banner ABOVE the reviews, as in the mockup. */
.hp26-rm-migration {
    display:grid !important;
    grid-template-columns:minmax(0,1.14fr) minmax(230px,.74fr) minmax(260px,.85fr);
    align-items:center; gap:24px; position:relative; overflow:hidden;
    width:100%; min-width:0; min-height:228px; padding:31px 40px;
    background:linear-gradient(112deg,#031737 0%,#092957 59%,#061e47 100%);
    border:1px solid #173f7e; border-radius:17px;
    box-shadow:0 9px 29px rgba(13,41,81,.12);
}
.hp26-rm-migration::before {
    content:""; position:absolute; right:-38px; top:-120px; width:360px; height:360px;
    border-radius:50%; background:radial-gradient(circle,rgba(50,137,255,.16),transparent 68%);
    pointer-events:none;
}
.hp26-rm-migration-copy {position:relative; z-index:1; max-width:660px;}
.hp26-rm-migration h2 {
    margin:0 0 14px !important; color:#fff !important; font-size:clamp(23px,2.1vw,31px) !important;
    font-weight:800 !important; line-height:1.22 !important; letter-spacing:-.35px;
}
.hp26-rm-migration p {
    margin:0 0 20px !important; max-width:610px; color:#e2ebfb !important;
    line-height:1.55 !important; font-size:15px !important;
}
.hp26-rm-migration-link {
    display:inline-flex !important; align-items:center; gap:12px; padding:12px 19px;
    color:#fff !important; background:#f5820b; border-radius:9px;
    font-size:14px; line-height:1.3; font-weight:800; text-decoration:none !important;
    transition:background .18s ease;
}
.hp26-rm-migration-link:hover,.hp26-rm-migration-link:focus-visible {background:#da6c00;color:#fff !important;}
.hp26-rm-migration-benefits {
    position:relative; z-index:1; list-style:none !important;
    display:flex !important; flex-direction:column !important; justify-content:center;
    gap:14px !important; align-self:stretch; min-width:0;
    padding:8px 0 8px 24px !important; margin:0 !important;
    border-left:1px solid rgba(215,231,255,.20);
}
.hp26-rm-migration-benefits > li {
    display:flex !important; align-items:center; gap:11px;
    margin:0 !important; padding:0 !important; color:#f5f8ff !important;
    line-height:1.42 !important; font-size:clamp(13px,1vw,15px) !important;
    font-weight:700 !important; letter-spacing:0 !important;
}
.hp26-rm-migration-benefits > li::before {content:none !important;}
.hp26-rm-benefit-check {
    flex:0 0 29px; display:flex; width:29px; height:29px;
    align-items:center; justify-content:center; border-radius:50%;
    border:1px solid rgba(255,155,49,.48); background:rgba(245,130,11,.15);
    color:#ff9b2d; font-size:16px; font-weight:800; line-height:1;
}
.hp26-rm-migration-art {justify-self:end; align-self:center; position:relative; z-index:1; width:min(100%,420px);}
.hp26-rm-migration-art svg {display:block; width:100%; height:auto; max-height:217px;}
/* 2. One row with THREE real customer reviews; remaining reviews accessible horizontally. */
.hp26-rm-testimonials {width:100%; min-width:0; padding:0 5px 10px; background:#fff;}
.hp26-rm-heading-row {position:relative; display:flex; justify-content:center; align-items:center; min-height:47px; margin-bottom:21px;}
.hp26-rm-heading-row > h2 {
    margin:0 !important; color:#142c54 !important; text-align:center; font-size:clamp(24px,2.1vw,32px) !important;
    line-height:1.25 !important; font-weight:800 !important;
}
.hp26-rm-reviews-nav {position:absolute; right:0; display:flex; align-items:center; gap:8px;}
.hp26-rm-reviews-nav button {
    display:flex; align-items:center; justify-content:center; width:34px; height:34px; padding:0;
    border:1px solid #cad8eb; border-radius:50%; background:#fff;
    color:#112c58; font-size:25px; line-height:1; cursor:pointer;
}
.hp26-rm-reviews-nav button:hover {background:#edf3ff;}
.hp26-rm-reviews-nav button:focus-visible {outline:2px solid #f5820b;outline-offset:2px;}
.hp26-rm-reviews {
    display:flex !important; flex-wrap:nowrap !important; align-items:stretch;
    gap:18px; width:100%; min-width:0; margin:0;
    overflow-x:auto; overflow-y:hidden; overscroll-behavior-inline:contain;
    scroll-snap-type:x mandatory; scroll-behavior:smooth;
    scrollbar-width:none; -ms-overflow-style:none;
    padding:2px 0 4px;
}
.hp26-rm-review, .hp26-rm-review::before, .hp26-rm-review::after {box-shadow:none;}
.hp26-rm-review::before,.hp26-rm-review::after {content:none !important;}
.hp26-rm-review {
    flex:0 0 calc((100% - 36px)/3) !important; min-width:0 !important; max-width:none !important;
    display:flex !important; flex-direction:column; align-self:stretch;
    padding:22px 22px 20px !important; margin:0 !important;
    background:#f8faff; border:1px solid #dce6f5 !important; border-radius:13px;
    color:#1c365f; scroll-snap-align:start;
    font-size:14px; line-height:1.55;
}
.hp26-rm-stars {display:block; margin:0 0 8px; color:#f5820b;letter-spacing:2px; font-size:18px;}
.hp26-rm-quote {margin:0 0 12px !important; color:#243a62;line-height:1.6;font-size:14px;flex:1;overflow-wrap:anywhere;}
.hp26-rm-details {margin:0 0 15px;font-size:13px;color:#243a62;}
.hp26-rm-details summary {cursor:pointer;color:#d86b00;font-weight:700;font-size:12px;}
.hp26-rm-details p {margin:9px 0 0 !important;line-height:1.55;white-space:pre-line;overflow-wrap:anywhere;}
.hp26-rm-customer {
    display:flex !important; flex-direction:row !important; align-items:center !important;
    gap:12px; margin-top:auto; padding-top:12px; border-top:1px solid #e3eaf6;
    background:transparent !important; text-align:left !important;
}
/* Customer logos: fixed 100x100 frame, no cropping at any breakpoint. */
.hp26-rm-avatar {
    display:block !important;
    flex:0 0 100px !important;
    width:100px !important;
    height:100px !important;
    max-width:100px !important;
    min-width:100px !important;
    object-fit:contain !important;
    object-position:center center !important;
    border-radius:10px;
    background:#fff;
    padding:6px;
    border:1px solid #ebeff7;
}
.hp26-rm-customer-details {flex:1 1 auto;min-width:0;}
.hp26-rm-customer-site {max-width:100%;overflow-wrap:anywhere;word-break:break-word;}
.hp26-rm-customer-details {display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;}
.hp26-rm-customer-details strong {display:block; font-size:13px;line-height:1.3;color:#142c54;}
.hp26-rm-customer-details small {color:#5f7190;font-size:11px;}
.hp26-rm-customer-site {
    display:inline-block;color:#d76d03 !important; font-size:12px;font-weight:600;
    text-decoration:none !important; overflow-wrap:anywhere;word-break:break-word;
}
.hp26-rm-customer-site:hover {text-decoration:underline !important;}
.hp26-rm-customer-source {font-size:11px;color:#587098 !important;text-decoration:underline !important;}
@media(max-width:1180px){
    .hp26-rm-migration {
        grid-template-columns:minmax(0,1fr) minmax(230px,.75fr);
        grid-template-areas:"copy art" "benefits art";
        row-gap:16px;
    }
    .hp26-rm-migration-copy {grid-area:copy;}
    .hp26-rm-migration-benefits {grid-area:benefits; align-self:start;}
    .hp26-rm-migration-art {grid-area:art;}
}
@media(max-width:1050px){
    .hp26-rm-review {flex-basis:calc((100% - 18px)/2) !important;}
}
@media(max-width:750px){
    .hp26-rm {gap:24px;}
    .hp26-rm-migration {
        grid-template-columns:minmax(0,1fr); grid-template-areas:"copy" "benefits" "art";
        padding:26px 25px 12px;
    }
    .hp26-rm-migration-benefits {padding-left:18px !important;}
    .hp26-rm-migration-art {width:min(100%,300px);justify-self:center;}
    .hp26-rm-heading-row {justify-content:flex-start; padding-right:82px;}
    .hp26-rm-heading-row > h2 {text-align:left;}
    .hp26-rm-review {flex-basis:100% !important;}
}
@media(max-width:420px){
    .hp26-rm-migration {padding:22px 18px 10px;}
    .hp26-rm-testimonials {padding-inline:0;}
    .hp26-rm-review {padding:18px 16px !important;}
}
@media(prefers-reduced-motion:reduce){.hp26-rm-reviews {scroll-behavior:auto;}.hp26-rm-migration-link {transition:none;}}

/* HP26 v1.3.0: actual transform-based looping carousel, not a scrollbar */
.hp26-rm-reviews::-webkit-scrollbar { display:none !important; width:0 !important; height:0 !important; }
.hp26-rm-track {
    display:flex !important; flex-flow:row nowrap !important; align-items:stretch;
    gap:18px; width:100%; margin:0; padding:0;
    transform:translate3d(0,0,0); will-change:transform;
}
.hp26-rm-carousel-ready .hp26-rm-reviews {
    overflow:hidden !important;
    scroll-snap-type:none !important;
    scroll-behavior:auto !important;
    cursor:grab;
}
.hp26-rm-carousel-ready .hp26-rm-reviews:active { cursor:grabbing; }
.hp26-rm-carousel-ready .hp26-rm-review { scroll-snap-align:none; }
.hp26-rm-review { background:#f7f9fe !important; }
.hp26-rm-stars {
    display:block; width:max-content; margin:0 0 12px !important;
    color:#f5b700 !important; font-size:24px !important;
    line-height:1.1 !important; letter-spacing:3px !important;
    font-family:Arial, sans-serif !important; font-style:normal !important;
}
.hp26-rm-dots { display:none; justify-content:center; align-items:center; gap:9px; margin:17px auto 0; }
.hp26-rm-carousel-ready .hp26-rm-dots { display:flex; }
.hp26-rm-dot {
    appearance:none; display:block; width:9px; height:9px; padding:0 !important; min-width:9px;
    background:#d3dff0; border:0 !important; border-radius:99px;
    transition:background .2s ease, width .2s ease; cursor:pointer;
}
.hp26-rm-dot[aria-current="true"] { width:27px; background:#f5820b; }
.hp26-rm-dot:hover { background:#ef9c42; }
.hp26-rm-dot:focus-visible { outline:2px solid #142c54; outline-offset:3px; }
.hp26-rm-live {position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; margin:0 !important; padding:0 !important;}
@media(prefers-reduced-motion:reduce){ .hp26-rm-track,.hp26-rm-dot {transition:none !important;} }

/* v1.3.1: keep 100x100 customer logos at narrow phone widths, never crop. */
@media(max-width:390px) {
    .hp26-rm-customer {gap:10px;}
    .hp26-rm-avatar {flex-basis:100px !important;width:100px !important;height:100px !important;}
    .hp26-rm-customer-details strong {font-size:12px;}
    .hp26-rm-customer-site {font-size:11px;}
}
