/* FAQ of Owebia (views/page/faq.phtml), « Which module should I choose? »: one need per card (.faq-pick list of the
   content), the module in color with an arrow; each card takes the color of its module, recognized by the link.
   The support tile beside the questions (Zeste's .faq-aside) */
@media (min-width: 64rem) { .faq-aside .support-tile { margin-top: 0; } }
.faq-a .faq-pick { --tint: 1; display: grid; grid-template-columns: repeat(auto-fill, minmax(24rem, 1fr)); gap: .96rem; margin: 1.6rem 0; padding: 0; list-style: none; }
html[data-theme="light"] .faq-a .faq-pick { --tint: 1.6; }
@media (prefers-contrast: more) { .faq-a .faq-pick, html[data-theme="light"] .faq-a .faq-pick { --tint: 0; } }
.faq-a .faq-pick li { margin: 0; }
.faq-a .faq-pick a { --c: var(--accent); --ck: color-mix(in srgb, var(--c) 55%, var(--ink)); display: flex; flex-direction: column; gap: .4rem; height: 100%; padding: 1.44rem 1.6rem; border: 1px solid color-mix(in srgb, var(--c) 22%, var(--line)); border-radius: 1.28rem; background: color-mix(in srgb, var(--c) calc(var(--tint) * 7%), var(--surface)); color: var(--ink); text-decoration: none; box-sizing: border-box; transition: border-color .2s, transform .2s, box-shadow .2s; }
.faq-a .faq-pick a:hover { border-color: color-mix(in srgb, var(--c) 70%, var(--line)); transform: translateY(-2px); box-shadow: 0 12px 26px -16px color-mix(in srgb, var(--c) 70%, transparent); text-decoration: none; }
.faq-a .faq-pick a[href*="opickup-mondial-relay"] { --c: #96144a; }
.faq-a .faq-pick a[href*="opickup-colissimo"] { --c: #f08a00; }
.faq-a .faq-pick a[href*="opickup-chronopost"] { --c: #0095da; }
.faq-a .faq-pick a[href*="opickup-dpd"] { --c: #dc0032; }
.faq-a .faq-pick a[href$="/opickup-hyva-checkout-compatibility"] { --c: #4f46e5; }
.faq-a .faq-pick a[href$="/opickup-click-and-collect"] { --c: #12976f; }
.faq-a .faq-pick a[href$="/opickup-mobile-phone"] { --c: #7a6a8f; }
/* Plugins first: Advanced Shipping and Pro, more specific, win */
.faq-a .faq-pick a[href*="/advanced-shipping-"] { --c: #1b6fa3; }
.faq-a .faq-pick a[href$="/advanced-shipping"], .faq-a .faq-pick a[href$="/advanced-shipping-pro"] { --c: #0e7490; }
.faq-a .faq-pick em { align-self: flex-start; padding: .16rem .8rem; border-radius: 99px; background: color-mix(in srgb, var(--c) 20%, transparent); color: var(--ck); font-size: 1.12rem; font-style: normal; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.faq-a .faq-pick strong { color: var(--ink); font-size: 1.52rem; font-weight: 600; line-height: 1.35; }
.faq-a .faq-pick span { margin-top: auto; padding-top: .4rem; color: var(--ck); font-size: 1.44rem; font-weight: 600; }
.faq-a .faq-pick span::after { content: " →"; transition: margin-left .2s; }
.faq-a .faq-pick a:hover span::after { margin-left: .32rem; }