/* =============================================================================
   FloreData — Design-system enforcement layer (Geetha revision 2026-06-18)
   Spec: design/specs/geetha-revision-2026-06-18.md
   Loaded LAST so it standardises the fragmented legacy classes into ONE system
   without rewriting 18 section files. Structural changes (markup) live elsewhere.
   ============================================================================= */

/* Smooth in-page + cross-page anchor scrolling (e.g. About "How We Work" →
   /services/#how-it-works). prefers-reduced-motion forces auto via dev-requirements.css. */
html { scroll-behavior: smooth; }

/* ---------------------------------------------------------------------------
   0. WHITE-BACKGROUND TEST (Geetha wants to see #fff vs the #f9f8f7 off-white)
   Reversible: delete this block to restore the warm off-white.
   --------------------------------------------------------------------------- */
:root { --wp--preset--color--background: #ffffff; }

/* ---------------------------------------------------------------------------
   1. SECTION TAGS / EYEBROWS → all FloreData Purple (#6631E1)
   Kill every per-section colour variant; grey pill + purple squircle badge.
   --------------------------------------------------------------------------- */
.fd-eyebrow,
.fd-eyebrow--sage, .fd-eyebrow--punchy, .fd-eyebrow--cream, .fd-eyebrow--mulberry,
.fd-eyebrow--blog, .fd-eyebrow--campfire, .fd-eyebrow--cases, .fd-eyebrow--engage,
.fd-eyebrow--growth, .fd-eyebrow--industries, .fd-eyebrow--results, .fd-eyebrow--royal,
.fd-eyebrow--services, .fd-eyebrow--team, .fd-eyebrow--testimonials, .fd-eyebrow--purple {
    background: #EAEAEA !important;
    color: var(--wp--preset--color--primary) !important;
}
/* squircle badge → purple bg + white icon, regardless of section */
.fd-eyebrow .fd-eyebrow__badge {
    background: var(--wp--preset--color--primary) !important;
    color: #ffffff !important;
    border-radius: 999px !important;
}
.fd-eyebrow .fd-eyebrow__badge svg { color: #ffffff !important; fill: currentColor; }
.fd-eyebrow .fd-eyebrow__text { color: var(--wp--preset--color--primary) !important; }

/* ---------------------------------------------------------------------------
   2. BUTTON SYSTEM — 3 canonical buckets + a consistent ">" chevron.
   Smaller, standard web proportions. currentColor chevron via mask.
   --------------------------------------------------------------------------- */

/* shared geometry for every button-like primitive (slightly smaller than before) */
.fd-btn--link, .fd-btn--cta, .fd-btn--explore,
.fd-btn--soft, .fd-btn--grape, .fd-btn--bloom, .fd-btn--rose, .fd-btn--royal,
.fd-btn--sage-pill, .fd-btn--engage, .fd-btn--team, .fd-btn--team-story, .fd-btn--team-work,
.fd-btn--cream, .fd-btn--filled, .fd-btn--tangerine, .fd-btn--campfire, .fd-btn--campfire-pill,
.fd-btn--purple-solid, .fd-btn--dark-pill,
.fd-results__cta, .fd-services__cta, .fd-team__cta, .fd-engage__cta, .fd-industries__cta,
.fd-cases__cta, .fd-testimonials__cta, .fd-svc-hero__explore, .fd-casecta__btn,
.fd-footer__book, .fd-mobile__cta, .fd-contact-form__submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5em !important;
    padding: 0.72em 1.25em !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    font-style: normal !important;        /* no italic button labels (typography rule) */
    line-height: 1 !important;
    border-radius: 999px !important;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}

/* Standalone section CTAs used to centre via `margin: … auto` while block-level.
   The inline-flex geometry above broke that (inline-level boxes ignore auto-margin
   centring), dropping them hard to the left. Restore block-level centring so they
   sit centred under their section again. */
.fd-results__cta, .fd-services__cta, .fd-team__cta, .fd-engage__cta,
.fd-industries__cta, .fd-cases__cta, .fd-testimonials__cta {
    display: flex !important;
    width: -moz-fit-content !important;
    width: fit-content !important;
    margin-inline: auto !important;
}

/* --- 2a. INTERNAL LINK → GrapeSoda #A793F7 / white, hover Navy #282839 --- */
.fd-btn--link,
.fd-btn--soft, .fd-btn--grape, .fd-btn--bloom, .fd-btn--rose, .fd-btn--royal,
.fd-btn--sage-pill, .fd-btn--engage, .fd-btn--team-story, .fd-btn--cream,
.fd-results__cta, .fd-services__cta, .fd-team__cta, .fd-engage__cta,
.fd-industries__cta, .fd-cases__cta, .fd-testimonials__cta, .fd-svc-hero__explore {
    background: var(--wp--preset--color--primary-soft) !important;  /* #A793F7 */
    color: #ffffff !important;
}
.fd-btn--link:hover,
.fd-btn--soft:hover, .fd-btn--grape:hover, .fd-btn--bloom:hover, .fd-btn--rose:hover,
.fd-btn--royal:hover, .fd-btn--sage-pill:hover, .fd-btn--engage:hover, .fd-btn--team-story:hover,
.fd-btn--cream:hover, .fd-results__cta:hover, .fd-services__cta:hover, .fd-team__cta:hover,
.fd-engage__cta:hover, .fd-industries__cta:hover, .fd-cases__cta:hover,
.fd-testimonials__cta:hover, .fd-svc-hero__explore:hover {
    background: var(--wp--preset--color--surface-dark) !important;  /* #282839 */
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* --- 2b. PRIMARY CTA → Orange #D16F54 / white, hover Navy --- */
.fd-btn--cta,
.fd-btn--tangerine, .fd-btn--campfire, .fd-btn--campfire-pill, .fd-btn--purple-solid,
.fd-btn--team-work, .fd-btn--filled, .fd-casecta__btn,
.fd-footer__book, .fd-mobile__cta, .fd-contact-form__submit {
    background: var(--wp--preset--color--campfire) !important;     /* #D16F54 */
    color: #ffffff !important;
}
.fd-btn--cta:hover,
.fd-btn--tangerine:hover, .fd-btn--campfire:hover, .fd-btn--campfire-pill:hover,
.fd-btn--purple-solid:hover, .fd-btn--team-work:hover, .fd-btn--filled:hover,
.fd-casecta__btn:hover, .fd-footer__book:hover, .fd-mobile__cta:hover,
.fd-contact-form__submit:hover {
    background: var(--wp--preset--color--surface-dark) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* --- 2c. CARD EXPLORE → Navy #282839 / white, hover Punchy #EBFEC3 / navy --- */
.fd-btn--explore {
    background: var(--wp--preset--color--surface-dark) !important;
    color: #ffffff !important;
}
.fd-btn--explore:hover {
    background: var(--wp--preset--color--punchy) !important;
    color: var(--wp--preset--color--surface-dark) !important;
}

/* --- 2d. NAV "Contact Us" → peach/tangerine pill, hover Navy (email excludes
   the nav from the deep-orange CTA rule; mockup shows the peach pill) --- */
.fd-header__cta {
    background: var(--wp--preset--color--campfire) !important;  /* unify nav CTA with footer Book-a-Call orange (Sandro 2026-06-28; flag F1 — confirm w/ Francesca) */
    color: #ffffff !important;
}
.fd-header__cta:hover {
    background: #bd5f45 !important;                             /* gentle campfire-darken, NOT navy — header hover must not go dark (Sandro) */
    color: #ffffff !important;
}

/* --- 2e. ARROWS → one consistent ">" chevron everywhere -------------------
   Hide every legacy arrow (circle-SVG, png img, sparkle) and append a clean
   currentColor chevron after the label. --------------------------------------- */
.fd-btn-arrow, .fd-arrow, .fd-arrow-circle, .fd-svc-hero__explore__spark,
.fd-btn--filled .fd-arrow, .fd-btn--cream .fd-arrow { display: none !important; }

.fd-btn--link::after, .fd-btn--cta::after, .fd-btn--explore::after,
.fd-btn--soft::after, .fd-btn--grape::after, .fd-btn--bloom::after, .fd-btn--rose::after,
.fd-btn--royal::after, .fd-btn--sage-pill::after, .fd-btn--engage::after,
.fd-btn--team-story::after, .fd-btn--team-work::after, .fd-btn--cream::after,
.fd-btn--filled::after, .fd-btn--tangerine::after, .fd-btn--campfire::after,
.fd-btn--campfire-pill::after, .fd-btn--purple-solid::after, .fd-btn--dark-pill::after,
.fd-results__cta::after, .fd-services__cta::after, .fd-team__cta::after,
.fd-engage__cta::after, .fd-industries__cta::after, .fd-cases__cta::after,
.fd-testimonials__cta::after, .fd-svc-hero__explore::after, .fd-casecta__btn::after,
.fd-footer__book::after, .fd-mobile__cta::after, .fd-contact-form__submit::after,
.fd-outro__btn::after {
    content: "";
    width: 0.62em;
    height: 0.62em;
    flex: none;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------------------------------------------------------------------------
   3. TAGS — expertise (Sage/Growth) + industry (Bloom/Purple), NO dots
   --------------------------------------------------------------------------- */
/* expertise chips (team "Our Expertise") */
.fd-team__expertise-chips li { background: var(--wp--preset--color--sage) !important; color: var(--wp--preset--color--growth) !important; }
.fd-team__expertise-chips .fd-chip-dot { display: none !important; }

/* industry tags (industries band + case-study filters) → Bloom + Purple, no dot.
   INACTIVE filter pills only — the active pill keeps its navy/white selected state. */
.fd-industries__pills li, .fd-industry-chip,
.fd-casehub-filter .fd-filter-pill:not(.is-active), .fd-bloghub-filter .fd-filter-pill:not(.is-active) {
    background: var(--wp--preset--color--bloom) !important;
    color: var(--wp--preset--color--primary) !important;
}
/* active filter pill → navy/white so the selected category is unambiguous (a11y affordance) */
.fd-casehub-filter .fd-filter-pill.is-active, .fd-bloghub-filter .fd-filter-pill.is-active {
    background: var(--wp--preset--color--surface-dark) !important;
    color: #fff !important;
    border-color: var(--wp--preset--color--surface-dark) !important;
}
.fd-industry-dot, .fd-industries__pills .fd-chip-dot { display: none !important; }

/* §3b. SECTION EYEBROW → one standard (Geetha "Section Tag.jpg"): grey #EAEAEA pill
   + PURPLE icon chip + PURPLE uppercase label, replacing the per-section accent colours
   (campfire / growth / royal …). The grey pill carries on any background incl. dark bands. */
.fd-eyebrow__badge { background: var(--wp--preset--color--primary) !important; }
.fd-eyebrow__text  { color: var(--wp--preset--color--primary) !important; }

/* ---------------------------------------------------------------------------
   4. TYPOGRAPHY — no italics beyond H1-accent / H2 / H3.
   Strip decorative italics from eyebrows, subtitles, leads, quotes, taglines.
   (H1 em, H2, H3 em keep italic — defined in typography.css.)
   --------------------------------------------------------------------------- */
.fd-eyebrow, .fd-eyebrow *,
.fd-about__intro, .fd-about__intro em,
.fd-team__subtitle, .fd-team__subtitle em,
.fd-svc-intro__subtitle, .fd-svc-intro__subtitle em,
.fd-svc-card__lead, .fd-svc-card__lead em,
.fd-svc-help__q, .fd-svc-help__q em,
.fd-tcard__author, .fd-tcard__author em,
.fd-testimonials__kicker, .fd-testimonials__kicker em,
.fd-testimonials__hire, .fd-testimonials__hire em,
.fd-footer__tagline, .fd-footer__tagline em,
.fd-contact__strap .fd-hl, .fd-pagehero__chip,
.fd-results__cta em, .fd-team__cta em, .fd-industries__cta em, .fd-svc-hero__explore,
.fd-btn--soft em, .fd-btn--team em,
.fd-team__expertise-label, .fd-team__expertise-label em,
.fd-engage__card-tag, .fd-engage__card-tag em,
.fd-cases__subtitle, .fd-cases__subtitle em, .fd-cases__cta em {
    font-style: normal !important;
}

/* ---------------------------------------------------------------------------
   5. CARD WIDTH — cards must not span the full content width.
   (Section-specific grids get tightened in their own files; this caps the
   blog/post/case grids centrally.)
   --------------------------------------------------------------------------- */
.fd-bloghub-grid, .fd-casehub-grid { max-width: 1180px; }
/* §5b. Narrow the card-based sections for more breathing room (Geetha #2:
   Engagement / Team / Services / Testimonials). */
.fd-engage__cards, .fd-testimonials__track, .fd-team__cards { max-width: 1240px !important; }
.fd-services__cards { max-width: 1200px !important; }

/* ---------------------------------------------------------------------------
   6. CASE-CARD Explore buttons (Geetha 2026-06-18 — "all case studies cards")
   --------------------------------------------------------------------------- */
/* client-stories cards (image overlay) */
.fd-case-card__text { display: flex; flex-direction: column; align-items: flex-start; }
.fd-case-card__explore { margin-top: 14px; }
/* metric cards on the Case Studies page → pin Explore to the bottom */
.fd-casecard { display: flex; flex-direction: column; }
.fd-casecard__impact { margin-bottom: 18px; }
.fd-casecard__explore { align-self: flex-start; margin-top: auto; }

/* ---------------------------------------------------------------------------
   7. NAV polish (Geetha 2026-06-18) — slightly higher, subtle glass
   transparency, smaller link text, page-link hover → Navy.
   (About/Services keep their own nav-over `top` via higher-specificity rules.)
   --------------------------------------------------------------------------- */
.fd-header { top: 24px; }                       /* one consistent nav offset site-wide (Riccardo: nav must sit inline page-to-page) */
body.fd-page-home .fd-header { top: 24px; }

/* MOBILE scrolled state — lock the nav as a solid top bar so page content no
   longer peeks above / through / around the floating glass pill on scroll
   (Francesca 2026-06-30). top:0 fills the gap above; padding-top keeps the pill
   at its resting y (no jump); full-width bg covers the side gaps + behind the
   glass. At rest (not stuck) the pill still floats over the hero — unchanged. */
@media (max-width: 900px) {
    .fd-header.is-stuck {
        top: 0 !important;
        padding: 24px 0 12px;
        background: var(--wp--preset--color--background);
        pointer-events: auto;
        box-shadow: 0 6px 18px -10px rgba(40, 40, 57, 0.40);
    }
}
.fd-header__pill {
    height: 56px !important;
    background: rgba(167, 147, 247, 0.85) !important;   /* GrapeSoda @ 85% — subtle glass */
    -webkit-backdrop-filter: saturate(140%) blur(12px);
            backdrop-filter: saturate(140%) blur(12px);
}
.fd-header__logo { height: 26px !important; }
.fd-header__links a { font-size: 0.8rem !important; }
.fd-header__links a:hover { color: var(--wp--preset--color--surface-dark) !important; }
.fd-header__links a.is-current,
.fd-header__links a[aria-current="page"] { color: #000 !important; }

/* ---------------------------------------------------------------------------
   8. Blog / Case-studies / Author heroes → nav-over (Geetha 2026-06-18)
   The floral hero runs to the very top with the nav floating over it, exactly
   like Home + Services (was: a white strip above the hero with the nav on it).
   --------------------------------------------------------------------------- */
body.fd-page-blog-hub #fd-main,
body.fd-page-case-studies #fd-main,
body.author #fd-main { padding-top: 0 !important; }

body.fd-page-blog-hub .fd-header,
body.fd-page-case-studies .fd-header,
body.author .fd-header { top: 24px; }

/* ---------------------------------------------------------------------------
   9. Engagement section (Landing Page Edits 2026-06-18): two purple buttons,
   plain-text "We stay involved…" (was a cream pill box + extra button), and
   no decorative italics on the lead / quote / card descriptions.
   --------------------------------------------------------------------------- */
.fd-engage__btns { display: flex; flex-wrap: wrap; gap: 14px; }
.fd-engage__quote {
    display: block !important;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-weight: 500 !important;
    font-style: normal !important;
    color: var(--wp--preset--color--text) !important;
    margin-top: 8px !important;
}
.fd-engage__subtitle,
.fd-engage-card__desc, .fd-engage-card__desc em { font-style: normal !important; }

/* ---------------------------------------------------------------------------
   10. Landing refinements (Sandro 2026-06-18, screenshot #2 review)
   --------------------------------------------------------------------------- */
/* About — remove the lilac divider on the right column */
.fd-about__rule { display: none !important; }
/* About — "Meet the team" identical size to the two "Let's Get Started" pills */
.fd-about__btns .fd-btn--soft,
.fd-about__cta-row .fd-btn--soft {
    padding: 0.72em 1.4em !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

/* Team — remove the divider + "Our Expertise" label + the chip dots (match design:
   chips sit directly under the paragraph) */
.fd-team__expertise { border-top: none !important; margin-top: 22px !important; padding-top: 0 !important; }
.fd-team__expertise-label { display: none !important; }
.fd-chip-dot { display: none !important; }

/* Industries — FULL-WIDTH background band, edge-to-edge (Sandro 2026-06-23:
   all asset/image backgrounds run full width; was a rounded inset per the mockup). */
.fd-industries__band {
    border-radius: 0 !important;
    margin: 0 !important;
    overflow: hidden;
}
.fd-industry-dot { display: none !important; }

/* ---------------------------------------------------------------------------
   11. About page refinements (design-diff audit 2026-06-18, verified 1:1)
   --------------------------------------------------------------------------- */
/* Hero subtext → dark ink (was teal/green), non-italic */
.fd-pagehero__chip { color: var(--wp--preset--color--text) !important; font-style: normal !important; }
/* Hero "working together" highlight → larger, softer halo (matches the design bloom) */
.fd-pagehero__glow {
    background: radial-gradient(ellipse 58% 34% at 31% 44%,
        rgba(214, 247, 180, 0.92) 0%, rgba(214, 247, 180, 0) 72%) !important;
}
/* Intro — two buttons as a matched pair in the left column */
.fd-aboutintro__btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; }
/* Intro lead → bold but NON-italic */
.fd-aboutintro__sub { font-style: normal !important; }

/* Story — tag + quote non-italic; quote lightened (design shows pale, not purple) */
.fd-story__chip, .fd-story__chip span, .fd-story__chip em { font-style: normal !important; }
.fd-story__accent { font-style: normal !important; color: #E9E0F7 !important; }
/* Story dark card → inset (not near-full-bleed), keep rounded corners */
.fd-story__card { max-width: 1440px !important; }   /* match the value-cards content width so left/right borders align (Riccardo) */

/* About — two-CTA rows stack + centre on mobile (intro pair) */
@media (max-width: 640px) {
    .fd-aboutintro__btns { flex-direction: column; align-items: center; gap: 12px; width: 100%; }
}

/* About team "Our Collective Expertise" label — non-italic (typography rule) */
.fd-aboutteam__exptitle, .fd-aboutteam__exptitle em,
.fd-aboutteam__chip, .fd-aboutteam__chip em { font-style: normal !important; }

/* ===========================================================================
   §9. TYPE-CALM (desktop) — Riccardo #30 "too zoomed in" (image16).
   On desktop the scale read oversized at 100%; this brings a consistent, ~15%
   calmer set: hero H1s −15%, the big section headings unified + calmed, and body
   copy converged to ~18px so service/industry match home/about (were 17–22px).
   Scoped ≥1025px so the mobile-tuned sizes stay untouched. Deliberately overrides
   Geetha's .ai scale — Sandro authorised the deviation (Riccardo review 2026-06-25).
   =========================================================================== */
@media (min-width: 1025px) {
    /* Hero H1 — home + about, −15% */
    .fd-hero__headline    { font-size: clamp(2.125rem, 0.85rem + 4.25vw, 5.684rem) !important; }  /* ~88 → ~75px */
    .fd-pagehero__headline { font-size: clamp(2.34rem, 1.87rem + 4.25vw, 5.684rem) !important; }  /* ~107 → ~91px */

    /* Big section headings → ONE compact-medium size (Geetha "Landing Page Edits":
       shrink the oversized display headlines ~half). ~54px @1440 — matches the
       industry headings that already read at the right "compact medium" scale. */
    .fd-team__heading, .fd-industries__heading, .fd-testimonials__heading,
    .fd-cases__heading, .fd-engage__heading, .fd-services__heading, .fd-outro__heading,
    .fd-values__heading, .fd-aboutteam__heading, .fd-abouttest__heading, .fd-aboutblog__heading,
    .fd-svc-intro__heading {
        font-size: clamp(1.95rem, 1.2rem + 2.4vw, 3.6rem) !important;   /* ~54px @1440, 57.6 cap */
    }

    /* Body copy → consistent ~18px across pages */
    .fd-story__body { font-size: clamp(1.05rem, 1rem + 0.25vw, 1.18rem) !important; }   /* about 22 → ~18.8 */
    .fd-svcd-intro__body, .fd-svcd-gain__body, .fd-svcd-step__desc,
    .fd-svcd-challenges__body, .fd-ind-intro__body, .fd-ind-cap__body {
        font-size: clamp(16px, 1.25vw, 18px) !important;               /* service/industry 17.3 → ~18, uniform */
    }
}

/* ============================================================
   §10 — Social-icon placeholder (Instagram before the brand
   account exists). The icon renders in the footer + contact
   socials, but is inert until the client pastes the profile URL
   in WP admin (fd_social → Instagram → Profile URL).
   ============================================================ */
a.fd-social--placeholder { cursor: default; pointer-events: none; }

/* ============================================================
   §11 — Audit fixes (2026-06-28): kill justified word-spacing
   rivers on narrow desktop columns + tighten the two flagship
   hero H1s to the site's display track (-0.02em).
   ============================================================ */
/* narrow cards → ragged-left (justify forced rivers at 28-40ch) */
.fd-tcard__quote p, .fd-svcd-step__desc, .fd-svcd-gain__body,
.fd-ind-cap__body, .fd-engage__body {
    text-align: left !important;
    text-align-last: auto !important;
}
/* centred intro paragraphs → centre, not justify */
.fd-svcd-intro__body, .fd-ind-intro__body {
    text-align: center !important;
    text-align-last: auto !important;
}
/* flagship Home/About H1s: -0.02em display track (were -0.005em, loosest on the site) */
.fd-hero__headline, .fd-pagehero__headline { letter-spacing: -0.02em !important; }

/* ===========================================================================
   12. COOKIEYES CONSENT BANNER — compact on mobile (Francesca/Riccardo 2026-06-30:
   "cookie policy too big on mobile"). Shrinks padding / title / body / buttons
   and caps the description height so the bar doesn't dominate small screens.
   =========================================================================== */
@media (max-width: 768px) {
    .cky-consent-container .cky-consent-bar { padding: 14px 16px !important; }
    .cky-consent-bar .cky-title { font-size: 1rem !important; line-height: 1.25 !important; margin-bottom: 6px !important; }
    .cky-notice-des, .cky-notice-des p { font-size: 0.8rem !important; line-height: 1.4 !important; }
    .cky-notice-des { max-height: 24vh !important; overflow-y: auto !important; }
    /* buttons in a ROW (not full-width stacked) → cuts the banner height roughly in half */
    .cky-notice-btn-wrapper { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 10px !important; }
    .cky-notice-btn-wrapper .cky-btn { flex: 1 1 auto !important; width: auto !important; padding: 9px 10px !important; font-size: 0.8rem !important; min-height: 0 !important; white-space: nowrap !important; }
}

/* ===========================================================================
   13. LEGAL / COOKIE-POLICY PAGE — fit on mobile (Francesca/Sandro 2026-06-30:
   "cookie policy page too big on mobile"). The generated policy embeds a long
   raw URL in a heading + CookieYes audit tables, both of which overflowed the
   viewport. Wrap long URLs/words; let the cookie tables scroll inside the page.
   =========================================================================== */
.fd-page__content,
.fd-page__content h1, .fd-page__content h2, .fd-page__content h3, .fd-page__content h4,
.fd-page__content p, .fd-page__content a, .fd-page__content li,
.fd-page__content td, .fd-page__content th {
    overflow-wrap: anywhere;
    word-break: break-word;
}
.fd-page__content .cky-audit-table,
.cky-audit-table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
}