/* ============================================================
   Home page tweaks (v21)
   1. "How we work" now matches the About page
   2. Advisory + "Where to find us" headings: one line, upright, smaller
   3. Advisory photo placeholder
   ============================================================ */

/* ---- 1. How we work: same frame as About ---- */
#values.sec--night{margin-inline:clamp(10px,1.4vw,20px);border-radius:var(--r-xl,44px);position:relative;overflow:clip}
#values.sec--night>*{position:relative;z-index:1}
#values .panel{border-radius:var(--r-lg,32px)}
#values .panel .ht .sw{display:block;margin-top:.5rem;font-size:clamp(1rem,1.3vw,1.2rem);font-weight:400;letter-spacing:0;line-height:1.3;color:#a6dd99}

/* ---- from the About page (scoped to the home section id) ---- */
      /* ═══ BlurText reveal on the section heading ═══ */
      @keyframes blur-reveal {
        0%   { opacity: 0; filter: blur(14px); transform: translateY(18px); }
        60%  { opacity: 1; filter: blur(3px);  transform: translateY(4px); }
        100% { opacity: 1; filter: blur(0);    transform: translateY(0); }
      }
      #values .sec-head h2 {
        animation: blur-reveal 1.1s cubic-bezier(.22,1,.36,1) both;
      }
      #values .sec-head .label {
        animation: blur-reveal 0.8s cubic-bezier(.22,1,.36,1) both;
      }

      /* ═══ Spotlight Card: cursor-tracking radial glow ═══ */
      #values .panels {
        perspective: 1400px;
      }
      #values .panel {
        position: relative;
        isolation: isolate;
        border-radius: 18px;
        overflow: hidden;
        transition: transform 0.5s cubic-bezier(.22,1,.36,1),
                    box-shadow 0.5s cubic-bezier(.22,1,.36,1);
        will-change: transform;
        --mx: 50%;
        --my: 50%;
      }
      #values .panel::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.45s ease;
        background: radial-gradient(
          420px circle at var(--mx) var(--my),
          rgba(120, 200, 255, 0.28),
          rgba(120, 200, 255, 0.08) 35%,
          transparent 62%
        );
        mix-blend-mode: screen;
      }
      #values .panel:hover::before,
      #values .panel:focus-visible::before {
        opacity: 1;
      }
      #values .panel:hover,
      #values .panel:focus-visible {
        transform: translateY(-6px) scale(1.015);
        box-shadow:
          0 28px 60px -18px rgba(0, 0, 0, 0.55),
          0 0 0 1px rgba(255, 255, 255, 0.08) inset;
      }

      /* ═══ StarBorder: animated gradient ring on hover ═══ */
      #values .panel::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 3;
        border-radius: inherit;
        padding: 1.5px;
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.45s ease;
        background: conic-gradient(
          from var(--angle, 0deg),
          transparent 0deg,
          #7ee0ff 40deg,
          #b48cff 80deg,
          transparent 120deg,
          transparent 360deg
        );
        -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
        -webkit-mask-composite: xor;
                mask-composite: exclude;
        animation: border-spin 3.5s linear infinite;
      }
      #values .panel:hover::after,
      #values .panel:focus-visible::after {
        opacity: 1;
      }
      @keyframes border-spin {
        to { --angle: 360deg; }
      }
      @property --angle {
        syntax: "<angle>";
        inherits: false;
        initial-value: 0deg;
      }

      /* ═══ ShinyText on the panel titles ═══ */
      #values .panel .ht,
      #values .panel .vt {
        background: linear-gradient(
          100deg,
          rgba(255,255,255,0.92) 0%,
          rgba(255,255,255,0.92) 40%,
          rgba(255,255,255,1)   50%,
          rgba(255,255,255,0.92) 60%,
          rgba(255,255,255,0.92) 100%
        );
        background-size: 250% 100%;
        -webkit-background-clip: text;
                background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: shine-sweep 5.5s linear infinite;
        animation-play-state: paused;
      }
      #values .panel:hover .ht,
      #values .panel:hover .vt,
      #values .panel:focus-visible .ht,
      #values .panel:focus-visible .vt {
        animation-play-state: running;
      }
      @keyframes shine-sweep {
        0%   { background-position: 200% center; }
        100% { background-position: -100% center; }
      }

      /* GradientText fallback accent on the labels */
      #values .sec-head .label {
        background: linear-gradient(90deg, #7ee0ff, #b48cff, #7ee0ff);
        background-size: 200% auto;
        -webkit-background-clip: text;
                background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: gradient-slide 6s linear infinite;
      }
      @keyframes gradient-slide {
        to { background-position: 200% center; }
      }

      @media (prefers-reduced-motion: reduce) {
        #values .sec-head h2,
        #values .sec-head .label,
        #values .panel::after,
        #values .panel .ht,
        #values .panel .vt {
          animation: none !important;
        }
        #values .panel::after { opacity: 0.35; }
        #values .panel .ht,
        #values .panel .vt {
          -webkit-text-fill-color: #fff;
          background: none;
        }
        #values .sec-head .label {
          -webkit-text-fill-color: #7ee0ff;
          background: none;
        }
      }
      /* 1. Scoped background override */
      #values.sec--night.dark {
        background: #eef1fb;
        background-image:
          linear-gradient(180deg,
            #ffffff 0%,
            #f5f7fd 12%,
            #eef1fb 30%,
            #eef1fb 70%,
            #f5f7fd 88%,
            #ffffff 100%);
      }

      /* 2. Fix text colours for the light background */
      /* Section Heading */
      #values .sec-head h2 {
        color: #0d2a1a !important; /* Dark brand green */
      }
      /* Section Label */
      #values .sec-head .label {
        background: none !important;
        -webkit-text-fill-color: #010395 !important; /* Brand blue */
        color: #010395 !important;
        animation: none !important;
      }

/* ---- 2. Headings ---- */
section.advisory-radical .advisory-radical__head{max-width:none;margin-bottom:clamp(3rem,6vw,5rem)}
section.advisory-radical .advisory-radical__title,
.bx-wrap .bx-head h2{
  font-size:clamp(1.55rem,3.3vw,2.7rem) !important;font-weight:400;line-height:1.12;letter-spacing:-.02em;
  max-width:none;font-style:normal}
section.advisory-radical .advisory-radical__title em,
.bx-wrap .bx-head h2 em,
.bx-wrap .bx-head h2 *{font-style:normal;font-weight:400}
@media (min-width:720px){
  section.advisory-radical .advisory-radical__title,
  .bx-wrap .bx-head h2{white-space:nowrap}
}

/* ---- 3. Advisory photo placeholder ---- */
.orb-portrait.no-img::after{display:none}
.orb-portrait.no-img{background:linear-gradient(165deg,#ffffff 0%,#e9edfa 55%,#d9e0f6 100%)}
.orb-portrait .orb-ph{position:absolute;inset:0;width:100%;height:100%;display:block}
.orb-portrait .orb-ph .ph-ring{transform-origin:100px 100px;animation:phRing 18s linear infinite}
.orb-portrait .orb-ph .ph-person{transition:transform .7s cubic-bezier(.22,1,.36,1);transform-origin:100px 150px}
.advisor-orb:hover .orb-portrait .orb-ph .ph-person{transform:translateY(-3px) scale(1.04)}
.orb-portrait img{position:absolute;inset:0;z-index:1;background:#eef1fb}
.orb-ph-tag{position:absolute;left:50%;bottom:11%;transform:translateX(-50%);z-index:1;
  font:500 .62rem/1 "Sofia Pro","Outfit",system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;
  color:#010395;background:rgba(255,255,255,.82);border:1px solid rgba(1,3,149,.12);border-radius:999px;padding:.4em .9em;white-space:nowrap;backdrop-filter:blur(4px)}
@keyframes phRing{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.orb-portrait .orb-ph .ph-ring{animation:none}}
.faq-radical .faq-radical__title,.faq-radical .faq-radical__title *{font-style:normal !important}

/* ---- Black text: advisory team + questions (v23) ---- */
section.advisory-radical .advisory-radical__title,
section.advisory-radical .advisory-radical__title em,
section.advisory-radical .orb-name,
.advisor-orb:hover .orb-name{color:#000 !important}
section.advisory-radical .orb-role{color:rgba(0,0,0,.62) !important}
section.advisory-radical .orb-bio,
.advisor-orb:hover .orb-bio{color:rgba(0,0,0,.8) !important}

section.faq-radical .faq-radical__title,
section.faq-radical .faq-radical__title em,
section.faq-radical .faq-radical__sub,
section.faq-radical .faq-card__q,
.faq-card:hover .faq-card__q,
section.faq-radical .faq-card__icon,
section.faq-radical .faq-card__num{color:#000 !important}
section.faq-radical .faq-radical__sub{color:rgba(0,0,0,.72) !important}
section.faq-radical .faq-card[open] .faq-card__num,
section.faq-radical .faq-card[open] .faq-card__icon{color:#fff !important}
section.faq-radical .faq-card__ans p,
section.faq-radical .faq-card[open] .faq-card__ans p{color:rgba(0,0,0,.82) !important}
section.faq-radical .faq-card__ans strong{color:#000 !important}

/* ---- What we offer: white card, photo faded in (v24) ---- */
.stage{background:#fff !important;box-shadow:0 0 0 1px rgba(1,3,149,.1),0 40px 70px -44px rgba(1,3,149,.35)}

/* ---- Who we are: all three facts the same size (v25) ---- */
.h-facts dd,.h-facts dd.is-list{font-size:clamp(1.15rem,1.7vw,1.5rem) !important;line-height:1.3 !important;letter-spacing:0 !important;font-weight:340 !important}
