/* Extracted from resources/views/Testimonial.blade.php. */

:root{
        --test-bg:#090909;
        --test-bg-soft:#101010;
        --test-panel:#151515;
        --test-yellow:#f3d129;
        --test-white:#ffffff;
        --test-muted:#b9bbc2;
        --test-line:rgba(255,255,255,.12);
    }

    body{
        background:var(--test-bg);
        color:var(--test-white);
    }

    .testimonial-intro{
        padding:88px 0 72px;
        background:
            linear-gradient(90deg, rgba(243,209,41,.06), transparent 36%),
            var(--test-bg);
        border-bottom:1px solid var(--test-line);
    }

    .testimonial-intro-inner{
        max-width:920px;
    }

    .testimonial-kicker{
        display:inline-flex;
        align-items:center;
        gap:10px;
        margin-bottom:14px;
        color:var(--test-yellow);
        font-size:12px;
        font-weight:900;
        letter-spacing:1.45px;
        text-transform:uppercase;
    }

    .testimonial-kicker::before{
        content:"";
        display:inline-block;
        width:34px;
        height:2px;
        background:var(--test-yellow);
    }

    .testimonial-intro h1{
        max-width:900px;
        margin:0;
        color:#fff;
        font-size:clamp(2.7rem,5vw,5rem);
        line-height:1.03;
        font-weight:800;
        letter-spacing:-1px;
    }

    .testimonial-intro p{
        max-width:820px;
        margin:24px 0 0;
        color:var(--test-muted);
        font-size:17px;
        line-height:1.82;
    }

    .testimonial-intro-actions,
    .testimonial-cta-actions{
        display:flex;
        flex-wrap:wrap;
        gap:12px;
        margin-top:28px;
    }

    .testimonial-btn{
        min-height:50px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        padding:0 22px;
        border:1px solid var(--test-yellow);
        border-radius:2px;
        background:var(--test-yellow);
        color:#050505 !important;
        text-decoration:none !important;
        font-size:12px;
        font-weight:900;
        letter-spacing:.4px;
        text-transform:uppercase;
        transition:.2s ease;
    }

    .testimonial-btn:hover{
        background:transparent;
        color:var(--test-yellow) !important;
    }

    .testimonial-btn-outline{
        background:transparent;
        border-color:rgba(255,255,255,.35);
        color:#fff !important;
    }

    .testimonial-btn-outline:hover{
        border-color:var(--test-yellow);
        color:var(--test-yellow) !important;
    }

    .wptb-why-choose-one{
        padding:80px 0 90px !important;
        background:var(--test-bg-soft);
    }

    .wptb-heading{
        margin-bottom:44px;
    }

    .wptb-heading .wptb-item--inner{
        max-width:920px;
    }

    .wptb-heading .text-one{
        color:#fff;
        font-size:clamp(2rem,4vw,3.5rem);
        line-height:1.08;
        margin-bottom:8px;
    }

    .wptb-item--divider{
        width:70px;
        height:2px;
        background:var(--test-yellow);
        border-radius:0 !important;
        margin-bottom:18px;
    }

    .testimonial-grid-intro{
        max-width:780px;
        margin:0 auto;
        color:var(--test-muted);
        line-height:1.75;
        font-size:14px;
    }

    /* Existing testimonials stay intact; only presentation changes. */
    .wptb-why-choose--inner .row{
        padding:0 18px;
        row-gap:18px;
    }

    .wptb-why-choose--inner .row > [class*="col-"]{
        padding:0 9px !important;
    }

    .wptb-icon-box2,
    .wptb-icon-box2.highlight{
        transform:none !important;
    }

    .wptb-icon-box2 .wptb-item--holder,
    .wptb-icon-box2.highlight .wptb-item--holder{
        min-height:100%;
        padding:26px 22px;
        border:1px solid var(--test-line);
        border-top:3px solid var(--test-yellow);
        border-radius:4px !important;
        background:var(--test-panel);
        color:#fff;
        box-shadow:none !important;
        text-align:left;
        align-items:flex-start;
    }

    .wptb-icon-box2.highlight .wptb-item--holder{
        background:#171613;
    }

    .wptb-icon-box2 .wptb-item--icon{
        display:none;
    }

    .wptb-icon-box2 .wptb-item--title,
    .wptb-icon-box2.highlight .wptb-item--title{
        width:100%;
        margin:0;
        color:#fff;
        font-size:1rem;
        line-height:1.35;
        text-align:left;
    }

    .wptb-icon-box2 .wptb-item--title::before{
        content:"★★★★★";
        display:block;
        margin-bottom:11px;
        color:var(--test-yellow);
        font-size:11px;
        letter-spacing:2px;
    }

    .wptb-icon-box2 .wptb-item--description,
    .wptb-icon-box2.highlight .wptb-item--description{
        color:var(--test-muted);
        font-size:.92rem;
        line-height:1.72;
        text-align:left;
    }

    @media (hover:hover){
        .wptb-icon-box2:hover{
            transform:translateY(-3px) !important;
        }

        .wptb-icon-box2:hover .wptb-item--holder{
            border-color:rgba(243,209,41,.45);
            box-shadow:0 10px 28px rgba(0,0,0,.18) !important;
        }
    }

    .testimonial-cta{
        padding:76px 0;
        background:
            linear-gradient(90deg, rgba(243,209,41,.08), transparent 36%),
            var(--test-bg);
        border-top:1px solid var(--test-line);
    }

    .testimonial-cta-inner{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:44px;
    }

    .testimonial-cta h2{
        max-width:760px;
        margin:0;
        color:#fff;
        font-size:clamp(1.9rem,3.5vw,3rem);
        line-height:1.1;
    }

    .testimonial-cta p{
        max-width:720px;
        margin:14px 0 0;
        color:var(--test-muted);
        line-height:1.75;
    }

    @media(max-width:991.98px){
        .testimonial-cta-inner{
            flex-direction:column;
            align-items:flex-start;
        }
    }

    @media(max-width:575.98px){
        .testimonial-intro,
        .wptb-why-choose-one,
        .testimonial-cta{
            padding-top:66px !important;
            padding-bottom:66px !important;
        }

        .testimonial-intro-actions,
        .testimonial-cta-actions{
            display:grid;
            grid-template-columns:1fr;
            width:100%;
        }

        .testimonial-btn{
            width:100%;
        }

        .wptb-why-choose--inner .row{
            padding:0 8px;
        }

        .wptb-why-choose--inner .row > [class*="col-"]{
            padding:0 6px 12px !important;
        }

        .wptb-icon-box2 .wptb-item--holder,
        .wptb-icon-box2.highlight .wptb-item--holder{
            padding:22px 18px;
        }
    }

/* Extracted style block */

/* ================================
   Testimonial grid – responsive polish
   ================================ */

:root{
  --ecw-yellow:#f3d129;
  --ecw-dark:#0f0f12;
  --ecw-dark-2:#141419;
  --ecw-text:#e9e9ee;
  --ecw-text-muted:#b8bac3;
  --ecw-shadow: 0 6px 18px rgba(0,0,0,.15);
}

/* Section spacing */
.wptb-why-choose-one{
  padding-block: clamp(24px, 4vw, 56px);
}

/* Heading */
.wptb-heading .wptb-item--inner{
  max-width: 1040px;
  margin-inline: auto;
  padding-inline: clamp(12px, 3vw, 24px);
}
.wptb-heading .text-one{
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  line-height: 1.2;
  margin: 0 0 .25rem 0;
}
.wptb-item--divider{
  width: 76px;
  height: 3px;
  margin: .5rem auto 1.25rem;
  background: var(--ecw-yellow);
  border-radius: 2px;
}

/* Make every column stretch so cards equalize in height */
.row.align-items-stretch > [class*="col-"]{
  display: flex;
}

/* Base card */
.wptb-icon-box2{
  width: 100%;
  display: flex;
  transition: transform .18s ease, box-shadow .18s ease;
}
.wptb-icon-box2 .wptb-item--inner{
  display:flex;
  width:100%;
}
.wptb-icon-box2 .wptb-item--holder{
  background: var(--ecw-dark-2);
  color: var(--ecw-text);
  padding: clamp(16px, 2.8vw, 28px);
  border: 1px solid rgba(255,255,255,.06);
  display:flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(8px, 1.6vw, 14px);
  border-radius: 10px;
  width: 100%;
}

/* Alternate style when you use `.highlight` (your yellow tiles) */
.wptb-icon-box2.highlight .wptb-item--holder{
  background: var(--ecw-yellow);
  color: #151515;
  border-color: rgba(0,0,0,.06);
}

/* Icons scale nicely on all screens */
.wptb-item--icon i{
  font-size: clamp(22px, 3.2vw, 34px); /* replaces fa-3x on tiny screens */
  line-height: 1;
}

/* Titles + body */
.wptb-item--title{
  font-size: clamp(1rem, 2.3vw, 1.15rem);
  font-weight: 700;
  letter-spacing: .2px;
  margin: 2px 0 0 0;
}
.wptb-item--description{
  font-size: clamp(.88rem, 2.1vw, .98rem);
  line-height: 1.55;
  color: var(--ecw-text-muted);
}
.wptb-icon-box2.highlight .wptb-item--description{
  color: #2b2b2b;
}

/* Hover (only on devices that hover) */
@media (hover:hover){
  .wptb-icon-box2:hover{
    transform: translateY(-4px);
  }
  .wptb-icon-box2:hover .wptb-item--holder{
    box-shadow: var(--ecw-shadow);
  }
}

/* Grid breathing room on small screens */
@media (max-width: 1199.98px){
  /* allow a bit of space between cards when lg collapses */
  .wptb-why-choose--inner .row{
    margin-left: 0;
    margin-right: 0;
  }
}

/* Tablet tweaks */
@media (max-width: 991.98px){
  .wptb-item--description{
    line-height: 1.6;
  }
}

/* Mobile tweaks */
@media (max-width: 575.98px){
  .wptb-heading .wptb-item--inner{ text-align: center; }
  .wptb-item--holder{
    padding: 16px 14px;
    border-radius: 8px;
  }
  /* prevent super long words/quotes from blowing width */
  .wptb-item--description{
    overflow-wrap: anywhere;
  }
}

/* Optional: uniform dark/yellow pattern if you don't want to hand-add .highlight
   (comment out if you prefer manual control)
*/
/*
.wptb-why-choose--inner .row > [class*="col-"]:nth-child(even) .wptb-item--holder{ background: var(--ecw-yellow); color:#151515; }
.wptb-why-choose--inner .row > [class*="col-"]:nth-child(even) .wptb-item--description{ color:#2b2b2b; }
*/

/* Minor fix for FA 3x on very small screens when left in markup */
@media (max-width: 480px){
  .fa-3x{ font-size: 1.9em; }
}
