/* why_our_products.html — extracted internal + inline styles */

.wp-page { --wp: #ea580c; --wp-2: #f59e0b; --wp-rgb: 234, 88, 12; }

.wp-eyebrow { display: inline-flex; align-items: center; gap: .5rem; padding: .4rem 1rem; border-radius: 2rem;
    background: rgba(var(--wp-rgb), .10); color: var(--wp); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.wp-eyebrow .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--wp); box-shadow: 0 0 0 4px rgba(var(--wp-rgb), .16); }

.wp-trust { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; }
.wp-trust .t { display: flex; align-items: center; gap: .5rem; font-weight: 600; color: #45526b; font-size: .95rem; }
.wp-trust .t i { color: var(--wp); font-size: 1.15rem; }

/* ---- product listing card (hero) ---- */
.wp-prodcard { position: relative; border-radius: 1.4rem; background: #fff; border: 1px solid #eef1f6;
    box-shadow: 0 1.8rem 3.6rem rgba(30, 34, 40, .18); overflow: hidden; }
.wp-prodcard__head { display: flex; align-items: center; gap: 1rem; padding: 1.4rem; border-bottom: 1px solid #f0f2f6; }
.wp-prodcard__ic { width: 62px; height: 62px; border-radius: 1rem; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
    font-size: 1.9rem; background: linear-gradient(135deg, var(--wp), var(--wp-2)); }
.wp-prodcard__head h3 { font-size: 1.15rem; font-weight: 800; margin: 0; }
.wp-prodcard__head .meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .35rem; }
.wp-prodcard__head .ver { font-size: .68rem; font-weight: 700; color: var(--wp); background: rgba(var(--wp-rgb), .1); padding: .18rem .55rem; border-radius: 2rem; }
.wp-prodcard__head .rt { font-size: .82rem; font-weight: 700; color: #2a3242; display: flex; align-items: center; gap: .3rem; }
.wp-prodcard__head .rt .s { color: #fab758; letter-spacing: 1px; }
.wp-feat { list-style: none; padding: 1.2rem 1.4rem; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.wp-feat li { display: flex; align-items: center; gap: .55rem; font-size: .88rem; font-weight: 600; color: #3f4a5c; }
.wp-feat li i { color: var(--wp); }
.wp-prodcard__foot { display: flex; align-items: center; gap: .8rem; padding: 1rem 1.4rem; background: #f9fafc; }
.wp-prodcard__foot .b { font-size: .8rem; font-weight: 700; color: #45526b; display: flex; align-items: center; gap: .35rem; }
.wp-prodcard__foot .b i { color: var(--wp); }
.wp-store { margin-left: auto; display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; font-size: .88rem; color: #fff;
    background: linear-gradient(100deg, var(--wp), var(--wp-2)); padding: .6rem 1.1rem; border-radius: .7rem; box-shadow: 0 .7rem 1.6rem rgba(var(--wp-rgb), .3); }

/* ---- benefit cards ---- */
.wp-card { height: 100%; background: #fff; border: 1px solid #eef1f6; border-radius: 1.1rem; padding: 1.6rem 1.5rem;
    transition: transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s ease, border-color .3s; }
.wp-card:hover { transform: translateY(-8px); box-shadow: 0 1.4rem 3rem rgba(30,34,40,.12); border-color: rgba(var(--wp-rgb),.4); }
.wp-card .ic { width: 54px; height: 54px; border-radius: 1rem; background: rgba(var(--wp-rgb), .09); color: var(--wp);
    display: flex; align-items: center; justify-content: center; font-size: 1.55rem; margin-bottom: 1rem; }
.wp-card h3 { font-size: 1.08rem; font-weight: 700; margin-bottom: .45rem; }
.wp-card p { font-size: .89rem; color: #5c6a82; margin: 0; }

/* ---- included panel ---- */
.wp-incl { background: #fff; border: 1px solid #eef1f6; border-radius: 1.3rem; padding: 2rem; }
.wp-incl__item { display: flex; gap: .8rem; padding: .7rem 0; align-items: flex-start; }
.wp-incl__item i { flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; background: rgba(var(--wp-rgb), .1); color: var(--wp);
    display: flex; align-items: center; justify-content: center; font-size: .9rem; margin-top: 2px; }
.wp-incl__item h4 { font-size: 1rem; font-weight: 700; margin-bottom: .1rem; }
.wp-incl__item p { font-size: .85rem; color: #5c6a82; margin: 0; }

/* ---- product showcase ---- */
.wp-prod { display: block; height: 100%; background: #fff; border: 1px solid #eef1f6; border-radius: 1.1rem; padding: 1.4rem;
    transition: transform .4s ease, box-shadow .4s ease, border-color .3s; }
.wp-prod:hover { transform: translateY(-6px); box-shadow: 0 1.3rem 2.8rem rgba(30,34,40,.12); border-color: rgba(var(--wp-rgb),.4); }
.wp-prod .e { font-size: 1.7rem; }
.wp-prod h4 { font-size: 1.02rem; font-weight: 700; margin: .5rem 0 .2rem; color: #1e2531; }
.wp-prod .r { font-size: .78rem; color: #fab758; }
.wp-prod .go { font-size: .8rem; font-weight: 700; color: var(--wp); display: inline-flex; align-items: center; gap: .3rem; margin-top: .5rem; }

/* ---- support band ---- */
.wp-support { border-radius: 1.4rem; background: linear-gradient(140deg, var(--wp), var(--wp-2)); color: #fff; padding: 2.4rem; }
.wp-support h3 { color: #fff; font-weight: 800; }
.wp-support ul { list-style: none; padding: 0; margin: 1.2rem 0 0; }
.wp-support li { display: flex; align-items: center; gap: .6rem; padding: .4rem 0; font-size: .95rem; color: rgba(255,255,255,.95); }
.wp-support li i { color: #fff; }
.wp-support .big { font-size: clamp(2.6rem, 6vw, 3.8rem); font-weight: 800; line-height: 1; }

/* ---- testimonials ---- */
.wp-quote { height: 100%; background: #fff; border: 1px solid #eef1f6; border-radius: 1.1rem; padding: 1.6rem 1.4rem;
    transition: transform .35s ease, box-shadow .35s ease; }
.wp-quote:hover { transform: translateY(-5px); box-shadow: 0 1.2rem 2.6rem rgba(30,34,40,.1); }
.wp-quote .stars { color: #fab758; letter-spacing: 1px; font-size: .85rem; margin-bottom: .6rem; }
.wp-quote p { font-size: .9rem; color: #3f4a5c; line-height: 1.65; }
.wp-quote .who { display: flex; align-items: center; gap: .7rem; margin-top: 1rem; }
.wp-quote .av { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    font-weight: 700; color: #fff; font-size: .8rem; background: linear-gradient(135deg, var(--wp), var(--wp-2)); }

@media (prefers-reduced-motion: no-preference) {
    .reveal-up { animation: reveal-up .6s cubic-bezier(.22,.61,.36,1) both; }
    .reveal-up:nth-child(3n+2) { animation-delay: .08s; } .reveal-up:nth-child(3n+3) { animation-delay: .16s; }
}
@keyframes reveal-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

/* ---- extracted inline styles ---- */
.gen-1 { color:rgba(255,255,255,.85); }
.gen-2 { height: 130px; }
