/* /styles/brand-faq.css?v=4 */
/* Canonical FAQ contract. Explicit compatibility priority over legacy page rules. */
:root body .brand-faq__list{display:block!important;gap:0!important;min-width:0}
:root body details.brand-faq__item{display:block!important;background:transparent!important;border:0!important;border-bottom:1px solid #ccd8d1!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin:0!important;color:#244140;min-width:0}
:root body details.brand-faq__item:first-of-type{border-top:1px solid #ccd8d1!important}
:root body .course-faq--fiar details.brand-faq__item{color:#033b6d}
:root body details.brand-faq__item>summary.brand-faq__question{display:grid!important;grid-template-columns:minmax(0,1fr) 24px!important;align-items:center!important;gap:20px!important;min-height:60px!important;padding:18px 0!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;color:inherit!important;font-family:Inter,Arial,sans-serif!important;font-size:16px!important;font-weight:600!important;line-height:1.5!important;letter-spacing:0!important;text-align:left!important;list-style:none!important;cursor:pointer;position:relative}
:root body details.brand-faq__item>summary.brand-faq__question::before,:root body details.brand-faq__item>summary.brand-faq__question::after{content:none!important;display:none!important}
:root body .brand-faq__question::marker{content:''!important}
:root body .brand-faq__question::-webkit-details-marker{display:none!important}
:root body .brand-faq__question .brand-faq__label{display:block!important;color:inherit!important;font:inherit!important;min-width:0;white-space:normal!important}
:root body .brand-faq__question svg.brand-faq__icon{position:static!important;display:block!important;width:24px!important;height:24px!important;min-width:24px!important;transform:none!important;fill:currentColor!important;stroke:none!important;justify-self:end;pointer-events:none;overflow:visible}
/* Same geometry and motion as disclosure-controls.css and the approved icon library. */
:root body .brand-faq__icon .brand-faq__vertical{display:block!important;transform:rotate(90deg);transform-origin:12px 12px;opacity:1;transition:transform 360ms cubic-bezier(.22,.7,.25,1),opacity 160ms ease-out}
:root body details.brand-faq__item[open]>.brand-faq__question .brand-faq__vertical{transform:rotate(270deg);opacity:0;transition:transform 360ms cubic-bezier(.22,.7,.25,1),opacity 140ms ease-out 190ms}
@media(prefers-reduced-motion:reduce){:root body .brand-faq__icon .brand-faq__vertical{transition:none!important}}
.motion-off body .brand-faq__icon .brand-faq__vertical{transition:none!important}
@media(forced-colors:active){:root body .brand-faq__question svg.brand-faq__icon{fill:ButtonText!important}:root body .brand-faq__icon .brand-faq__vertical{transition:none!important}}
:root body .brand-faq__question:focus-visible{outline:2px solid currentColor!important;outline-offset:4px!important}
:root body details.brand-faq__item>.brand-faq__answer{margin:0!important;padding:0 40px 22px 0!important;border:0!important;background:none!important;color:#526b62!important;font-size:16px!important;line-height:1.65!important;max-width:calc(65ch + 40px);overflow-wrap:anywhere}
:root body .brand-faq__answer>div{margin:0!important;padding:0!important;max-width:none!important}
:root body .brand-faq__answer p{font-size:16px!important;line-height:1.65!important;color:inherit!important;margin:0 0 12px!important;padding:0!important}
:root body .brand-faq__answer p:last-child{margin-bottom:0!important}
:root body .brand-faq__answer ul,:root body .brand-faq__answer ol{font-size:16px;line-height:1.65}
:root body .brand-faq__answer a{font-size:15px!important;line-height:1.5!important}
@media(hover:hover) and (pointer:fine){:root body details.brand-faq__item>summary.brand-faq__question:hover{color:#116955!important}}
@media(max-width:760px){:root body details.brand-faq__item>summary.brand-faq__question{padding:16px 0!important;gap:16px!important;min-height:56px!important}:root body details.brand-faq__item>.brand-faq__answer{padding:0 0 20px!important;max-width:65ch}}
/* Answers open immediately; only the branded icon animates, with no hover dependency. */

/* One FAQ block (owner, 26 Sep 2026). Every question section shares its name, its heading and its grid: heading,
   introduction and helper links on the left, questions on the right, one column below 900px. The heading uses the site's
   section-heading token, the same size as every other section heading (44px on desktop, 32px on phones), and
   always breaks as "Frequently asked / questions". Page rules still set each section's ground and vertical spacing.
   src/content/faq-headings.mjs adds the classes; long-form articles keep their reading flow. */
:root body .faq-block__layout{display:grid!important;grid-template-columns:minmax(0,4fr) minmax(0,7fr)!important;column-gap:clamp(48px,6vw,96px)!important;row-gap:28px!important;align-items:start!important}
:root body .faq-block__head{display:block!important;max-width:400px!important;min-width:0;margin:0!important;padding:0!important}
:root body .faq-block__head>h2{font-size:var(--ds-font-section,clamp(32px,3.1vw,44px))!important;line-height:var(--ds-leading-heading,1.15)!important;font-weight:600!important;letter-spacing:var(--ds-tracking-heading,-.04em)!important;max-width:9.5em!important;margin:0!important;padding:0!important}
:root body .faq-block__head>.faq-block__intro{font-size:16px!important;line-height:1.6!important;max-width:34ch!important;margin:16px 0 0!important}
:root body .faq-block__head>.faq-block__more{margin-top:28px!important}
:root body .faq-block__body{min-width:0;margin:0!important}
@media(max-width:899px){
 :root body .faq-block__layout{grid-template-columns:minmax(0,1fr)!important}
 :root body .faq-block__head{max-width:none!important}
 :root body .faq-block__head>.faq-block__more{margin-top:20px!important}
}
/* /styles/block-labels.css?v=1 */
/* Section labels (owner, 4 October 2026): one treatment for the short line that names a block above its heading,
   in place of 45 combinations of size, weight and colour. Tagged by src/content/block-labels.mjs and loaded after page
   styles. Colour stays with the ground: grey on light, lime on forest, FIAR's own palette on FIAR. */
[data-block-label]{font-size:13px!important;font-weight:500!important;line-height:1.4!important;letter-spacing:normal!important;text-transform:none!important;font-style:normal!important}
/* The Foundations section labels had taken the heading colour; they join the other labels on light grounds. */
.fd-label[data-block-label]{color:#526d64!important}
/* /styles/brand-links.css?v=3 */
/* Canonical contract: docs/link-design-standard.md. Loaded after page styles. */
:root{--link-icon-size:20px;--link-gap:12px;--link-motion:180ms;--link-easing:cubic-bezier(.22,1,.36,1)}
a.brand-link{display:inline-flex!important;align-items:center;gap:var(--link-gap)!important;min-height:44px;font-size:var(--ds-font-action,15px)!important;font-weight:600;line-height:1.5}
a[data-brand-link],a.brand-link,a.brand-link:is(:hover,:focus,:visited),a.brand-card-link,a.brand-card-link :is(h2,h3,h4,strong){text-decoration:none!important}
a.brand-link>.brand-link__label{font:inherit!important;line-height:inherit!important;text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:4px;min-width:0}
a .brand-link__icon{display:inline-block!important;vertical-align:middle;width:var(--link-icon-size)!important;height:var(--link-icon-size)!important;min-width:var(--link-icon-size);flex:0 0 var(--link-icon-size);fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round;stroke-linejoin:round;border:0!important;padding:0!important;transform:none!important;transition:transform var(--link-motion) var(--link-easing)!important}
a .brand-link__icon path{fill:none!important;stroke:currentColor!important;stroke-width:1.8!important}
a[data-brand-link="button"]{gap:var(--link-gap)!important}
a[data-brand-link="button"]>.brand-link__label{font:inherit!important;line-height:inherit!important;text-decoration:none!important;min-width:0}
a[data-brand-link]:focus-visible,a.brand-link:focus-visible{outline:2px solid currentColor!important;outline-offset:4px}
/* Focus rings are drawn in the element's own text colour, which always contrasts with what sits behind that text.
   Buttons, cards, tabs, pressed filters, the skip link and the article video panel carry the ring inside: outside, a
   white label's ring vanished on a white section and a dark label's on a dark one (27 Sep 2026: 535 rings under 3:1
   across 120 pages). */
:is(a[data-brand-link="button"],a[data-brand-link="card"],.btn,.development-action,.ac-contact-main>.brand-link,[role="tab"],[aria-pressed="true"],.skip-link,.lp-body a.lp-video):focus-visible{outline-color:currentColor!important;outline-offset:-5px!important}
a.brand-card-link .brand-link__label{display:inline!important;font:inherit!important;color:inherit!important;text-decoration:none;min-width:0}
a.brand-card-link .feature-link{display:inline-flex;gap:var(--link-gap);align-items:center;text-decoration:none!important}
a.brand-card-link .feature-link>.brand-link__label{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
@media(hover:hover) and (pointer:fine){
 a[data-brand-link]:hover .brand-link__icon,a.brand-link:hover>.brand-link__icon{transform:translateX(4px)!important}
 a[data-link-direction="external"]:hover .brand-link__icon{transform:translate(3px,-3px)!important}
 a.brand-card-link:hover .brand-link__label{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
}
a.brand-card-link:focus-visible .brand-link__label{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
@media(prefers-reduced-motion:reduce){a .brand-link__icon{transition:none!important}a[data-brand-link]:hover .brand-link__icon,a.brand-link:hover>.brand-link__icon{transform:none!important}}
a.brand-link .brand-link__label .link-label{text-decoration:none}
a.brand-card-link h4{display:flex!important;align-items:center;justify-content:space-between;gap:12px}
.audit-path-step strong>.brand-link__icon{margin-left:9px}
/* Preserve hidden enrolment actions despite the shared display rule. */
a[data-brand-link][hidden]{display:none!important}

a[data-link-direction="email"]:hover .brand-link__icon{transform:none!important}
/* /styles/chat-launch.css?v=1 */
/* The chat button (src/content/tracking.mjs, production builds only): LiveChat loads only when it is pressed, and its
   own window then takes over. One round control in the corner, forest with a white icon (everyday icon rules) and a
   light ring, so it stands out on the forest heroes as well as on light sections. Focus adds a forest ring outside
   the light one: one of the two always shows. It sits under the header (120) and any dialog, and gives way to the
   phone menu, which covers the whole screen. */
.chat-launch{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:100;display:grid;place-items:center;width:56px;height:56px;margin:0;padding:0;border:0;border-radius:50%;background:#244140;color:#fff;cursor:pointer;box-shadow:0 0 0 2px #f8faf7,0 10px 28px -10px rgba(23,59,48,.55),0 2px 6px rgba(23,59,48,.16);-webkit-tap-highlight-color:transparent;transition:transform .16s cubic-bezier(.23,1,.32,1),background-color .16s ease}
.chat-launch svg{display:block;width:24px;height:24px}
@media(hover:hover){.chat-launch:hover{background:#2e504d}}
.chat-launch:active{transform:scale(.96)}
.chat-launch:focus-visible{outline:2px solid transparent;outline-offset:4px;box-shadow:0 0 0 2px #f8faf7,0 0 0 4px #244140,0 10px 28px -10px rgba(23,59,48,.55)}
.chat-launch[aria-busy="true"]{cursor:progress}
.chat-launch[aria-busy="true"] svg{animation:chat-launch-wait .9s ease-in-out infinite alternate}
@keyframes chat-launch-wait{to{opacity:.45}}
@media(max-width:760px){.chat-launch{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));width:52px;height:52px}}
body:has(.site-navigation[data-mobile-open]) .chat-launch{display:none}
@media(prefers-reduced-motion:reduce){.chat-launch{transition:none}.chat-launch:active{transform:none}.chat-launch[aria-busy="true"] svg{animation:none;opacity:.6}}
@media print{.chat-launch{display:none}}
