/* 'What is AI Accuracy Lab?' drop-down, home page directly below the news carousel and 'See sources' (inside [data-news], so
   only for Enterprise and Law firm). Variant B, approved by Shane 20 Oct 2026; ported from mockups/what-is-aal-20261020 in V 20261020j
   (A and C rules dropped; B and shared rules unchanged).
   Inter, headline 800 / -0.03em, '?' so no yellow full stop; grey #5E5E63 subheading; hand-drawn chevron
   (graphite #2F2F33 line ending in the yellow #FFC21A dot) rotates on open; no motion with prefers-reduced-motion. Not a CTA. */
.wia{max-width:760px;margin:40px auto 0;text-align:left;color:var(--ink,#1D1D1F)}
.wia-h{margin:0;font-family:Inter,system-ui,sans-serif;font-size:clamp(22px,2.4vw,28px);line-height:1.2;font-weight:800;letter-spacing:-.03em}
.wia-sub{margin:6px 0 0;font-size:17px;line-height:1.5;color:#5E5E63;font-weight:400;max-width:62ch}
.wia-btn{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:44px;cursor:pointer;font:inherit;color:inherit;letter-spacing:inherit}
.wia-head{position:relative}
.wia-btn::after{content:"";position:absolute;inset:0;border-radius:inherit}     /* the whole header row (incl. the subheading) toggles */
.wia-head:has(.wia-btn:focus-visible){outline:3px solid #1D1D1F;outline-offset:4px;border-radius:14px}
.wia-btn:focus-visible{outline:none}
.wia-chev{flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;transition:transform .2s ease,background-color .15s}
.wia-chev svg{display:block;width:32px;height:32px}
.wia-head:hover .wia-chev{background:#EFEFF1}
.wia.open .wia-chev{transform:rotate(180deg)}
.wia-body{padding-top:4px}
.wia-body p{margin:16px 0 0;font-size:17px;line-height:1.6;color:#1D1D1F;max-width:65ch}
.wia-body p:first-child{margin-top:14px}
.wia-body[hidden]{display:none}
/* B: white card, soft shadow, lens icon; hand-drawn underline + tick when open (decorative) */
.wia-b{background:#fff;border-radius:24px;padding:24px 28px 26px;box-shadow:0 1px 2px rgba(0,0,0,.05),0 14px 34px rgba(60,50,30,.08)}
.wia-b .wia-head{display:flex;gap:16px;align-items:flex-start}
.wia-ic{flex:none;display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:16px;background:#F7F5F0;margin-top:-2px}
.wia-hx{flex:1;min-width:0;position:relative}
.wia-b .wia-sub{padding-right:60px}
.wia-ul{display:block;height:0;overflow:hidden;opacity:0;transition:opacity .25s ease}
.wia-ul svg{display:block;width:min(260px,70%);height:10px}
.wia-b.open .wia-ul{height:10px;margin:2px 0 2px;opacity:1}
.wia-b .wia-body{padding-left:68px}
.wia-tick{display:inline-flex;vertical-align:-3px;margin-right:6px}
.wia-b .wia-body b{font-weight:700}
@media (max-width:640px){
  .wia{margin-top:28px}
  .wia-b .wia-sub{padding-right:0}
  .wia-b{padding:20px 18px 22px}.wia-b .wia-head{gap:12px}.wia-ic{width:44px;height:44px;border-radius:14px}.wia-ic svg{width:28px;height:28px}
  .wia-b .wia-body{padding-left:0}
  .wia-body p{font-size:16.5px}
}
@media (prefers-reduced-motion:reduce){.wia-chev,.wia-ul{transition:none}}
/* 23 Oct 2026 (Shane, reference image): B sits flat on the page background: no white card, border, shadow or lens icon. Heading on the
   left, chevron on the right, description under the heading, all left-aligned with the block edge. No buttons under it (the hero
   buttons are hidden for Enterprise and Law firm, js/site.js [data-nonews]). Overrides the card rules above. */
.wia-b{background:none;border-radius:0;padding:0;box-shadow:none}
.wia-b .wia-head{display:block}
.wia-b .wia-body{padding-left:0}
.wia-b .wia-sub{padding-right:60px}
@media (max-width:640px){.wia-b{padding:0}.wia-b .wia-sub{padding-right:0}}
/* 23 Oct 2026 (Shane): the description is the first line of the collapsible body (hidden with it when closed, so no teaser). */
.wia-body p.wia-sub{margin:10px 0 0;font-size:17px;line-height:1.5;color:#5E5E63;max-width:62ch;padding-right:0}
.wia-body p.wia-sub + p{margin-top:14px}
/* 23 Oct 2026 (Shane): chevron sits right after the question (~11px visible gap: 2px margin + 2px circle inset + the glyph's own
   side bearing), not at the far right. The button still spans the full row, so the whole row stays clickable. */
.wia-b .wia-btn{justify-content:flex-start;gap:0}
.wia-b .wia-chev{width:36px;height:36px;margin-left:2px}
/* 23 Oct 2026, 8:07 PM (Shane): the question and its chevron are centred together on the page, and the hand-drawn underline (now the
   red-orange-yellow brand gradient, set in handoff-build/whatis.py) is always shown, centred under the question text (shifted left by
   half the chevron's 38px). While closed it is drawn in the gap below the block (absolute), so nothing below it moves; when open it
   sits in the flow above the body exactly as before. The body copy stays left-aligned. Without JS the body is open and it stays in the flow. */
.wia-b .wia-btn{justify-content:center}
.wia-b .wia-ul{height:10px;margin:2px 0;opacity:1}
.wia-b .wia-ul svg{margin:0 auto;transform:translateX(-19px)}
.wia-b:has(.wia-body[hidden]) .wia-ul{position:absolute;left:0;right:0;top:calc(100% + 2px);margin:0}