/* ==========================================
   Ironclad Tech - Extended Components
   Hero stats, deliverables, case studies,
   pricing, FAQ, shield motifs
   ========================================== */

/* ---- Hero stat row (service detail heroes) ---- */
.hero-stat-row{
    display:flex;
    gap:34px;
    margin-top:34px;
    flex-wrap:wrap;
}
.hero-stat-item h3{
    color:var(--signal);
    font-weight:700;
    margin-bottom:2px;
    font-size:1.5rem;
}
.hero-stat-item p{
    color:rgba(255,255,255,.65);
    font-size:13px;
    margin:0;
    text-transform:uppercase;
    letter-spacing:.05em;
}

/* ---- Deliverable rows (what's included) ---- */
.deliverable-row{
    display:flex;
    gap:18px;
    align-items:flex-start;
    background:#fff;
    border:1px solid var(--steel-100);
    border-radius:var(--radius);
    padding:26px;
    height:100%;
    transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.deliverable-row:hover{
    transform:translateY(-4px);
    border-color:var(--signal);
    box-shadow:0 12px 30px rgba(8,27,58,.08);
}
.deliverable-icon{
    width:54px; height:54px; min-width:54px;
    border-radius:12px;
    background:linear-gradient(145deg, var(--graphite-950), var(--graphite-800));
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform .3s ease;
}
.deliverable-row:hover .deliverable-icon{ transform:scale(1.08) rotate(-4deg); }
.deliverable-icon i{ color:var(--signal); font-size:20px; }
.deliverable-row h5{ font-weight:700; color:var(--graphite-950); margin-bottom:6px; }
.deliverable-row p{ color:var(--gray); margin:0; font-size:15px; }

/* ---- FAQ accordion ---- */
.faq-item{
    border:1px solid var(--steel-100) !important;
    border-radius:12px !important;
    margin-bottom:14px;
    overflow:hidden;
}
.faq-item .accordion-button{
    font-weight:600;
    color:var(--graphite-950);
    background:#fff;
    padding:20px 24px;
    font-size:16px;
    box-shadow:none;
}
.faq-item .accordion-button:not(.collapsed){
    background:var(--graphite-950);
    color:#fff;
}
.faq-item .accordion-button:not(.collapsed)::after{
    filter:brightness(0) invert(1);
}
.faq-item .accordion-button:focus{
    box-shadow:0 0 0 3px rgba(212,175,55,.3);
    border-color:var(--signal);
}
.faq-item .accordion-body{
    color:#374151;
    line-height:1.75;
    padding:22px 24px;
}
.faq-group-title{
    font-weight:700;
    color:var(--graphite-950);
    margin:44px 0 20px;
    font-size:1.35rem;
    position:relative;
    padding-left:16px;
}
.faq-group-title::before{
    content:"";
    position:absolute;
    left:0; top:4px; bottom:4px;
    width:4px;
    border-radius:2px;
    background:var(--signal);
}
.faq-group-title:first-child{ margin-top:0; }

/* ---- Case study cards ---- */
.case-card{
    background:#fff;
    border:1px solid var(--steel-100);
    border-left:4px solid var(--signal);
    border-radius:var(--radius);
    padding:38px;
    margin-bottom:28px;
    transition:transform .3s ease, box-shadow .3s ease;
}
.case-card:hover{
    transform:translateY(-4px);
    box-shadow:0 16px 40px rgba(8,27,58,.1);
}
.case-industry{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:rgba(212,175,55,.12);
    color:var(--signal-dark);
    padding:6px 14px;
    border-radius:50px;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.05em;
    margin-bottom:14px;
}
.case-card h3{
    color:var(--graphite-950);
    font-weight:700;
    margin-bottom:24px;
}
.case-card h6{
    text-transform:uppercase;
    letter-spacing:.07em;
    font-size:12px;
    color:var(--signal-dark);
    font-weight:700;
    margin-bottom:10px;
}
.case-card p{ color:#374151; font-size:15px; }
.result-stats{ display:flex; flex-direction:column; gap:14px; }
.result-stat h3{
    color:var(--signal);
    font-weight:700;
    margin:0;
    font-size:1.6rem;
}
.result-stat p{
    margin:0;
    font-size:13px;
    color:var(--gray);
}
.placeholder-note{
    color:var(--gray);
    font-size:14px;
    background:var(--light);
    border:1px dashed #CBD5E1;
    border-radius:12px;
    padding:16px 22px;
    display:inline-block;
}
.placeholder-note i{ color:var(--signal-dark); margin-right:6px; }

/* ---- Pricing cards ---- */
.pricing-card{
    position:relative;
    background:#fff;
    border:1px solid var(--steel-100);
    border-radius:var(--radius);
    padding:38px 32px;
    height:100%;
    display:flex;
    flex-direction:column;
    transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.pricing-card:hover{
    transform:translateY(-6px);
    border-color:var(--signal);
    box-shadow:0 18px 44px rgba(8,27,58,.1);
}
.pricing-featured{
    border:2px solid var(--signal);
    box-shadow:0 14px 40px rgba(212,175,55,.18);
}
.pricing-badge{
    position:absolute;
    top:-14px; left:50%;
    transform:translateX(-50%);
    background:var(--signal);
    color:var(--graphite-950);
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;
    padding:6px 18px;
    border-radius:50px;
    white-space:nowrap;
}
.pricing-icon{
    width:64px; height:64px;
    border-radius:16px;
    background:linear-gradient(145deg, var(--graphite-950), var(--graphite-800));
    display:flex; align-items:center; justify-content:center;
    margin-bottom:20px;
}
.pricing-icon i{ color:var(--signal); font-size:26px; }
.pricing-card h3{ color:var(--graphite-950); font-weight:700; margin-bottom:6px; }
.pricing-tagline{ color:var(--gray); margin-bottom:20px; font-size:15px; }
.pricing-card .check-list{ margin:0 0 26px; flex-grow:1; }
.pricing-card .check-list li{ font-size:15px; padding:7px 0; }

/* ---- Shield CTA motif ---- */
.cta-shield{
    margin-bottom:22px;
}
.cta-shield img{
    width:76px;
    height:auto;
    filter:drop-shadow(0 8px 20px rgba(212,175,55,.35));
    animation:shieldFloat 5s ease-in-out infinite;
}
@keyframes shieldFloat{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-8px); }
}

/* ---- Shield accents on section titles of trust-related sections ---- */
.shield-inline{
    width:22px;
    height:auto;
    vertical-align:-3px;
    margin-right:8px;
}

@media (max-width: 767.98px){
    .hero-stat-row{ gap:22px; justify-content:center; }
    .case-card{ padding:26px; }
    .pricing-card{ padding:30px 24px; }
}

@media (prefers-reduced-motion: reduce){
    .cta-shield img{ animation:none; }
}