/* Site footer (footer.php). Direction "space horizon" (Martijn, 29 Oct 2026): a dark Ink panel with
   the closing statement + demo button, the link columns, and a planet whose green-to-purple rim rises
   like a sunrise as the footer scrolls in, with the white wordmark standing on the horizon. Brand
   guide: Aeonik + TT Commons Mono, Space Green / Nova Purple only as light, radii r-12 and pill, one
   motion curve. Everything under .isf-js only applies once assets/footer/inspace-footer.js runs, so
   without JS (and under reduced motion) the footer is complete and static: the horizon fully risen. */
.isf{
  --ink:#0B0B0C;--purple:#8511D9;--green:#B9EFA3;--houston:#2E9E50;--white:#FFFFFF;
  --fg:#FFFFFF;--fg-58:rgba(255,255,255,.58);--fg-42:rgba(255,255,255,.42);--fg-10:rgba(255,255,255,.10);--fg-05:rgba(255,255,255,.05);
  --grad:linear-gradient(96deg,#54B86A 0%,#8511D9 96%);
  --ease:cubic-bezier(.2,.7,.2,1);--t:.25s;
  --display:"Aeonik","Space Grotesk",Inter,"Helvetica Neue",Arial,sans-serif;
  --mono:"TTCommons","TT Commons","TT_Commons_Pro_Mono_Trl","Space Mono",ui-monospace,"SF Mono",monospace;
  --rise:0px;--glow:1;--flare:.55;
  position:relative;z-index:1;font-family:var(--display);color:var(--fg);
}
.isf *,.isf *::before,.isf *::after{box-sizing:border-box}
.isf a{color:inherit;text-decoration:none}
.isf ul,.isf ol{list-style:none;margin:0;padding:0}
.isf p,.isf h2{margin:0}
.isf :focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:4px}

/* No hard edge between the white page and the dark footer: the panel starts transparent and runs
   through seven tints over --fade, like flying out of the atmosphere: Moondust, mint, Space Green,
   a green-to-purple mix, lilac, Nova Purple and deep violet, into Ink. Two soft aurora patches keep
   it from reading as flat stripes. Every colour is a tint (alpha) of a brand token. */
.isf-panel{--fade:520px;position:relative;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(55% 140px at 22% calc(var(--fade) * .4),rgba(185,239,163,.45),rgba(185,239,163,0) 70%),
    radial-gradient(60% 160px at 78% calc(var(--fade) * .58),rgba(133,17,217,.35),rgba(133,17,217,0) 70%),
    /* green layer: mint to Space Green, fading out under the purple */
    linear-gradient(180deg,
      rgba(185,239,163,0) calc(var(--fade) * .06),
      rgba(185,239,163,.2) calc(var(--fade) * .18),
      rgba(185,239,163,.42) calc(var(--fade) * .3),
      rgba(84,184,106,.32) calc(var(--fade) * .42),
      rgba(84,184,106,.12) calc(var(--fade) * .56),
      rgba(84,184,106,0) calc(var(--fade) * .68)),
    /* purple layer: lilac to Nova Purple, overlapping the green so the two mix */
    linear-gradient(180deg,
      rgba(133,17,217,0) calc(var(--fade) * .26),
      rgba(133,17,217,.1) calc(var(--fade) * .36),
      rgba(133,17,217,.26) calc(var(--fade) * .48),
      rgba(133,17,217,.42) calc(var(--fade) * .62),
      rgba(133,17,217,.3) calc(var(--fade) * .8),
      rgba(133,17,217,0) var(--fade)),
    /* Moondust veil at the very top, so the page's white runs on */
    linear-gradient(180deg,rgba(245,246,243,0) 0,rgba(245,246,243,.9) calc(var(--fade) * .1),rgba(245,246,243,0) calc(var(--fade) * .32)),
    /* space: Ink ramps in under the colour */
    linear-gradient(180deg,
      rgba(11,11,12,0) 0,
      rgba(11,11,12,0) calc(var(--fade) * .4),
      rgba(11,11,12,.28) calc(var(--fade) * .54),
      rgba(11,11,12,.6) calc(var(--fade) * .68),
      rgba(11,11,12,.86) calc(var(--fade) * .82),
      var(--ink) var(--fade))}
.isf-wrap{position:relative;max-width:1280px;margin:0 auto;padding:0 28px}
.isf-eyebrow{font:400 12px/1.3 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--green)}
.isf-label{font:400 12px/1.3 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-42)}

/* ---------- act 1: closing statement + demo button ---------- */
.isf-hero{position:relative;z-index:2;padding:calc(var(--fade) * .74) 0 56px;border-bottom:1px solid var(--fg-10)}
.isf-hero-text{display:flex;flex-direction:column;gap:20px;min-width:0}
.isf-title{font:700 clamp(36px,4.8vw,68px)/.98 var(--display);letter-spacing:-.03em;text-transform:uppercase;max-width:22ch;text-wrap:balance}
.isf-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.isf-w>span{display:inline-block}
.isf-grad{background:var(--grad);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:isf-pan 4s linear infinite alternate}
@keyframes isf-pan{from{background-position:0% 50%}to{background-position:100% 50%}}

/* Primary button, exactly as the brand guide's component: Space Green pill, Ink text, 16px bold,
   trailing directional arrow; hover = glow + scale, pressed = .96. */
.isf-cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
.isf .isf-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:99px;background:var(--green);color:var(--ink);
  font:700 16px/1.2 var(--display);transition:box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.isf-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--t) var(--ease)}
.isf-btn:hover{box-shadow:0 0 44px rgba(185,239,163,.65);transform:scale(1.05)}
.isf-btn:hover svg{transform:translate(2px,-2px)}
.isf-btn:active{transform:scale(.96);transition-duration:80ms}

/* ---------- act 2: link columns ---------- */
.isf-cols{position:relative;z-index:4;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 28px;padding:48px 0 16px}
.isf-col{grid-column:span 3;display:flex;flex-direction:column;gap:20px;min-width:0}
.isf-col-menu{grid-column:span 4}
.isf-col-lang{grid-column:span 2}
.isf-list{display:flex;flex-direction:column;gap:12px}
.isf-list-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}
.isf-link{display:inline-flex;align-items:baseline;gap:10px;max-width:100%;font:400 16px/1.5 var(--display);color:var(--fg)}
.isf-idx{font:400 11px/1 var(--mono);letter-spacing:.04em;color:var(--fg-42);font-variant-numeric:tabular-nums;transition:color var(--t) var(--ease)}
.isf-link:hover .isf-idx{color:var(--green)}
/* Roll: the label slides up and an identical copy (Space Green) slides in from below. */
.isf-roll{position:relative;display:inline-block;overflow:hidden;vertical-align:top;white-space:nowrap;max-width:100%}
.isf-roll>span,.isf-roll::after{display:block;transition:transform .45s var(--ease)}
.isf-roll::after{content:attr(data-t);position:absolute;left:0;top:100%;color:var(--green)}
.isf-link:hover .isf-roll>span,.isf-link:hover .isf-roll::after,
.isf-link:focus-visible .isf-roll>span,.isf-link:focus-visible .isf-roll::after{transform:translateY(-100%)}
.isf-arrow{flex:none;align-self:center;width:14px;height:14px;fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:translate(-6px,6px);transition:opacity var(--t) var(--ease),transform .45s var(--ease)}
.isf-link:hover .isf-arrow,.isf-link:focus-visible .isf-arrow{opacity:1;transform:none}

.isf-address{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font:400 16px/1.5 var(--display);font-style:normal;color:var(--fg-58)}
.isf-strong{color:var(--fg)}
.isf-mono{font-family:var(--mono);font-size:15px;font-variant-numeric:tabular-nums;color:var(--fg)}

.isf-social{display:flex;gap:10px;margin-top:4px}
.isf-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1px solid var(--fg-10);color:var(--fg);transition:border-color var(--t) var(--ease),background-color var(--t) var(--ease),color var(--t) var(--ease)}
.isf-icon svg{width:18px;height:18px;fill:currentColor}
.isf-icon svg path{fill:currentColor}
.isf-icon:hover{background:var(--white);border-color:var(--white);color:var(--ink)}

/* locale switch: one button + searchable list, scales to 200+ locales */
.isf-locale{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.isf-locale details{position:relative}
.isf-locale summary{list-style:none}
.isf-locale summary::-webkit-details-marker{display:none}
.isf-locale-btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--fg-10);cursor:pointer;font:400 15px/1 var(--display);color:var(--fg);transition:border-color var(--t) var(--ease)}
.isf-locale-btn:hover,.isf-locale details[open] .isf-locale-btn{border-color:var(--fg-58)}
.isf-globe,.isf-chev{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.isf-chev{width:16px;height:16px;transition:transform var(--t) var(--ease)}
.isf-locale details[open] .isf-chev{transform:rotate(180deg)}
.isf-locale-code{font:700 12px/1 var(--mono);letter-spacing:.08em;white-space:nowrap}
.isf-locale-name{display:none}
.isf-locale-pop{position:absolute;left:0;bottom:calc(100% + 10px);z-index:5;width:340px;max-width:calc(100vw - 56px);padding:8px;border-radius:12px;background:#16161A;border:1px solid var(--fg-10);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.isf-locale-q{display:block;width:100%;height:44px;margin:0 0 6px;padding:0 14px;border-radius:999px;border:1px solid var(--fg-10);background:var(--fg-05);font:400 16px/1 var(--display);color:var(--fg);outline:none;transition:border-color var(--t) var(--ease)}
.isf-locale-q::placeholder{color:var(--fg-42)}
.isf-locale-q[hidden]{display:none}
.isf-locale-q:focus{border-color:var(--green)}
.isf-locale-pop.is-down{bottom:auto;top:calc(100% + 10px)}
.isf-locale-pop.is-right{left:auto;right:0}
.isf-locale-list{max-height:min(360px,50vh);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.isf-locale-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:8px 12px;border-radius:12px;font:400 15px/1.3 var(--display);color:var(--fg);transition:background-color var(--t) var(--ease)}
.isf-locale-list a:hover,.isf-locale-list a:focus-visible{background:var(--fg-05)}
.isf-locale-list a.is-on{background:var(--green);color:var(--ink)}
.isf-locale-list a.is-on .isf-locale-tag{color:rgba(11,11,12,.58)}
.isf-locale-tag{font:400 12px/1 var(--mono);letter-spacing:.08em;color:var(--fg-58)}
.isf-locale-empty{padding:12px;font:400 14px/1.45 var(--display);color:var(--fg-58)}

/* ---------- act 3: the horizon ---------- */
/* The rim sits at --rim from the top of the stage: right where the wordmark's letters stand
   (82% down the mark, the baseline of the official SVG), so the wordmark stands on the planet. */
.isf-stage{--stage-pt:clamp(48px,5vw,80px);position:relative;container-type:inline-size;padding-top:var(--stage-pt)}
.isf-stage-in{position:relative;z-index:3}
.isf-stars{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,transparent calc(var(--fade) * .5),#000 calc(var(--fade) + 40px));
          mask-image:linear-gradient(180deg,transparent calc(var(--fade) * .5),#000 calc(var(--fade) + 40px))}
.isf-horizon{
  --mh:calc((min(100cqw,1280px) - 56px) * .1689);
  --rim:calc(var(--stage-pt) + var(--mh) * .82);
  position:absolute;left:50%;top:var(--rim);z-index:1;width:max(2200px,220cqw);aspect-ratio:1;pointer-events:none;
  transform:translate3d(-50%,var(--rise),0)}
.isf-horizon>span{position:absolute;inset:0;border-radius:50%}
.isf-planet{background:radial-gradient(120% 60% at 50% 0%,#17171c 0%,#0e0e11 18%,var(--ink) 40%)}
/* A thin ring in the signature gradient, masked to the circle's edge, plus a blurred copy as its glow. */
.isf-rim{background:linear-gradient(90deg,rgba(133,17,217,.0) 18%,#8511D9 34%,#54B86A 45%,#EAFFE0 50%,#54B86A 55%,#8511D9 66%,rgba(133,17,217,0) 82%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1.5px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1.5px));opacity:var(--glow)}
.isf-rim-blur{filter:blur(14px);opacity:calc(var(--glow) * .9);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 14px),#000 calc(100% - 6px),transparent 100%);
          mask:radial-gradient(farthest-side,transparent calc(100% - 14px),#000 calc(100% - 6px),transparent 100%)}
/* Atmosphere: Nova on dark (brand: ambient brand light, Space Green / Nova Purple), above the rim. */
.isf-atmos{inset:auto!important;left:50%!important;top:0;width:min(1700px,120cqw);height:560px;border-radius:50%!important;
  transform:translate(-50%,-92%);opacity:var(--glow);filter:blur(40px);
  background:radial-gradient(50% 50% at 50% 100%,rgba(185,239,163,.7) 0%,rgba(84,184,106,.45) 22%,rgba(133,17,217,.5) 48%,rgba(133,17,217,0) 76%)}
/* The sun: a tight white-green bloom right on the rim, the brightest point of the sunrise. */
.isf-sun{inset:auto!important;left:50%!important;top:0;width:min(900px,70cqw);height:110px;border-radius:50%!important;
  transform:translate(-50%,-50%);opacity:var(--glow);filter:blur(22px);mix-blend-mode:screen;
  background:radial-gradient(50% 50% at 50% 50%,rgba(255,255,255,.85) 0%,rgba(185,239,163,.6) 35%,rgba(185,239,163,0) 72%)}
/* The flare: a bright point on the rim that follows the pointer along the horizon. */
/* Placed on the circle by JS: --fx along the horizon, --fy the drop of the rim at that x, --fa the
   tangent angle, so the flare slides over the planet's curve instead of floating in space. */
.isf-flare{inset:auto!important;top:0;left:calc(50% + var(--fx,0px))!important;width:520px;height:120px;border-radius:50%!important;
  transform:translate(-50%,calc(var(--fy,0px) - 50%)) rotate(var(--fa,0deg));opacity:calc(var(--glow) * var(--flare));filter:blur(18px);mix-blend-mode:screen;
  background:radial-gradient(50% 50% at 50% 50%,rgba(255,255,255,.9) 0%,rgba(185,239,163,.55) 30%,rgba(133,17,217,0) 70%)}

/* The gas giant: a WebGL canvas over the stage that paints moving green and purple bands inside the
   planet's circle (assets/footer/inspace-footer.js). Transparent just under the rim so the CSS rim
   and glow stay as they are; without WebGL the dark CSS planet below shows. */
.isf-gas{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.isf-mark{position:relative;display:grid;color:var(--white);overflow:hidden;border-radius:4px}
.isf-slice{grid-area:1/1;display:block}
.isf-slice svg{display:block;width:100%;height:auto}
.isf-icon:active,.isf-locale-btn:active{transform:scale(.96);transition-duration:80ms}

/* ---------- legal (on the planet) ---------- */
/* The fixed chat button ("Vragen? Vraag het ons", ~250px wide) sits bottom right on every page:
   keep the legal links to its left so none of them hide under it. */
.isf-legal{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:12px 48px;padding:clamp(40px,4.5vw,64px) 260px 24px 0;font:400 14px/1.45 var(--display);color:var(--fg-58);text-shadow:0 1px 12px rgba(11,11,12,.6)}
.isf-legal ul{display:flex;flex-wrap:wrap;gap:6px 24px}
.isf-legal a{transition:color var(--t) var(--ease)}
.isf-legal a:hover{color:var(--fg)}

/* ---------- JS: reveals ---------- */
.isf-js .isf-w>span{transform:translateY(108%);transition:transform .9s var(--ease);transition-delay:calc(var(--w,0) * 60ms)}
.isf-js .isf-hero.is-in .isf-w>span{transform:none}
.isf-js .isf-cta-row{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease) .45s,transform .7s var(--ease) .45s}
.isf-js .isf-hero.is-in .isf-cta-row{opacity:1;transform:none}
.isf-js .isf-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 80ms)}
.isf-js .isf-cols.is-in .isf-reveal{opacity:1;transform:none}
.isf-js .isf-slice{transform:translateY(104%);transition:transform 1.1s var(--ease);transition-delay:calc(.1s + var(--k,0) * 70ms)}
.isf-js .isf-stage.is-in .isf-slice{transform:none}
.isf-js .isf-horizon{will-change:transform}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .isf-col-menu,.isf-col,.isf-col-lang{grid-column:span 6}
}
@media (max-width:760px){
  .isf-panel{--fade:420px}
  .isf-wrap{padding:0 20px}
  .isf-hero{padding:calc(var(--fade) * .74) 0 40px}
  .isf-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;padding:40px 0 8px}
  .isf-col-menu,.isf-col,.isf-col-lang{grid-column:span 2}
  .isf-stage{--stage-pt:48px}
  .isf-horizon{--mh:calc((100cqw - 40px) * .1689);--rim:calc(var(--stage-pt) + var(--mh) * .82);width:1400px}
  .isf-atmos{height:300px}
    .isf-legal{flex-direction:column;align-items:flex-start;padding:40px 0 88px}
  .isf-legal ul{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;width:100%}
  /* 44px tap targets */
  .isf-list,.isf-list-2,.isf-address{gap:0 20px}
  .isf-list .isf-link,.isf-address .isf-link{padding:10px 0}
  .isf-legal a{display:inline-block;padding:12px 0}
}

@media (prefers-reduced-motion:reduce){
  .isf *,.isf *::before,.isf *::after{transition:none!important;animation:none!important}
  .isf-grad{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--green)}
  .isf-js .isf-w>span,.isf-js .isf-slice,.isf-js .isf-cta-row,.isf-js .isf-reveal{transform:none;opacity:1}
  .isf-horizon{transform:translate3d(-50%,0,0)!important}
}

/* ======================= Variant B (?variant=B) =======================
   Todor's branding feedback (29 Oct 2026): light instead of dark, on a green/purple gradient that
   moves by itself, and a gentler transition: white into the gradient (two colours, no black).
   Ink type, Nova Purple accents (green text on light is off-brand below 16px bold), Ink button,
   no stars, the planet as a light pastel gas giant with the same rim. */
.isf-flow{display:none}
.isf--b{
  --fg:#0B0B0C;--fg-58:rgba(11,11,12,.58);--fg-42:rgba(11,11,12,.42);--fg-10:rgba(11,11,12,.10);--fg-05:rgba(11,11,12,.05);
}
.isf--b .isf-panel{--fade:300px;background:none}
/* The moving gradient: two soft layers at different angles and speeds, faded in from the page's
   white over --fade. Tints of Space Green and Nova Purple only. */
.isf--b .isf-flow{display:block;position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(50% 45% at 50% 45%,rgba(255,255,255,.7),rgba(255,255,255,0) 70%) no-repeat,
    linear-gradient(110deg,rgba(185,239,163,.62) 0%,rgba(185,239,163,.38) 22%,rgba(185,239,163,.12) 42%,rgba(133,17,217,.12) 58%,rgba(133,17,217,.26) 78%,rgba(133,17,217,.36) 100%),
    var(--white);
  background-size:70% 100%,240% 100%,auto;
  animation:isf-flow 16s ease-in-out infinite alternate;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 var(--fade));
          mask-image:linear-gradient(180deg,transparent 0,#000 var(--fade))}
@keyframes isf-flow{
  0%{background-position:0% 0,0% 50%,0 0}
  100%{background-position:100% 0,100% 50%,0 0}
}

.isf--b .isf-stars{display:none}
.isf--b .isf-hero{padding-top:calc(var(--fade) * .62)}
.isf--b .isf-eyebrow{color:var(--purple)}
.isf--b .isf-grad{background-image:linear-gradient(96deg,#2E9E50 0%,#8511D9 96%)}
.isf--b :focus-visible{outline-color:var(--purple)}
/* Ink button (brand component "2 · Ink"): on a green-tinted surface the green Primary would vanish. */
.isf--b .isf-btn{background:var(--ink);color:var(--white)}
.isf--b .isf-btn:hover{box-shadow:0 0 44px rgba(133,17,217,.35)}
.isf--b .isf-roll::after{color:var(--purple)}
.isf--b .isf-link:hover .isf-idx{color:var(--purple)}
.isf--b .isf-arrow{stroke:var(--purple)}
.isf--b .isf-icon{background:rgba(255,255,255,.55)}
.isf--b .isf-icon:hover{background:var(--ink);border-color:var(--ink);color:var(--white)}
.isf--b .isf-locale-btn{background:rgba(255,255,255,.55)}
.isf--b .isf-locale-btn:hover,.isf--b .isf-locale details[open] .isf-locale-btn{border-color:var(--ink)}
.isf--b .isf-locale-pop{background:var(--white);box-shadow:0 20px 60px rgba(11,11,12,.12)}
.isf--b .isf-locale-q{background:var(--moondust,#F5F6F3)}
.isf--b .isf-locale-q:focus{border-color:var(--purple)}
.isf--b .isf-locale-list a:hover,.isf--b .isf-locale-list a:focus-visible{background:rgba(11,11,12,.05)}
.isf--b .isf-locale-list a.is-on{background:var(--ink);color:var(--white)}
.isf--b .isf-locale-list a.is-on .isf-locale-tag{color:rgba(255,255,255,.58)}
/* The planet in light: Moondust surface (the shader paints pastel gas over it), the same rim. */
.isf--b .isf-planet{background:radial-gradient(120% 60% at 50% 0%,#FFFFFF 0%,#F5F6F3 30%,#EEEFEA 60%)}
.isf--b .isf-atmos{opacity:calc(var(--glow) * .7)}
.isf--b .isf-sun{mix-blend-mode:normal;background:radial-gradient(50% 50% at 50% 50%,rgba(255,255,255,.95) 0%,rgba(185,239,163,.55) 40%,rgba(185,239,163,0) 72%)}
.isf--b .isf-flare{mix-blend-mode:normal;background:radial-gradient(50% 50% at 50% 50%,rgba(255,255,255,.9) 0%,rgba(185,239,163,.6) 30%,rgba(133,17,217,0) 70%)}
.isf--b .isf-mark{color:var(--ink)}
.isf--b .isf-legal{color:var(--fg-58);text-shadow:none}
@media (max-width:760px){
  .isf--b .isf-panel{--fade:220px}
}

/* ======================= Variant C (?variant=C) =======================
   Todor (29 Oct 2026): variant B without the CTA block; the big wordmark moves up to the top of the
   footer, standing on the planet's horizon right after the transition, and the link columns and
   legal sit below it on the planet. The planet is a little see-through so the moving gradient
   still shows. */
.isf--c .isf-stage{--stage-pt:calc(var(--fade) * .8)}
.isf--c .isf-cols{padding:132px 0 8px;border-top:0}
/* A flatter, wider planet in C, so the rim clears the column headings at the sides. */
.isf--c .isf-horizon{width:max(3200px,300cqw)}
.isf--c .isf-planet{background:radial-gradient(120% 60% at 50% 0%,rgba(255,255,255,.9) 0%,rgba(245,246,243,.75) 30%,rgba(245,246,243,.55) 60%)}
.isf--c .isf-gas{opacity:.5}
.isf--c .isf-icon,.isf--c .isf-locale-btn{background:rgba(255,255,255,.7)}
@media (max-width:760px){
  .isf--c .isf-cols{padding-top:72px}
  .isf--c .isf-horizon{width:1800px}
}

/* ======================= Variant D (the default since 29 Oct 2026) =======================
   B without the footer's CTA block (heading + button): against two CTAs of the same purpose right
   after each other, the page's own final CTA stays and the footer starts with the link columns.
   Unlike C, the wordmark stays at the bottom on the planet. */
.isf--d .isf-cols{padding-top:calc(var(--fade) * .62)}