/* World 1 · footer: Kora's mechanics, measured twice and now exact.
   At 1440x900 their card rests at scale .85 (1190px, 125px margins) and
   GROWS to scale 1 = 1400px wide with 20px margins as you scroll in; the
   ball starts as a ~600px circle hidden BEHIND the card (centre ~514px
   below the card top), inflates to scale 10 and ends as flat colour, its
   crest 2700px above the viewport: the frame filled, no horizon left.
   Drivers (main.js): --ft-dome-s 1 -> 10 and --ft-card .85 -> 1, both from
   the same progress p = (vh - footerTop) / footerHeight, dome eased ^1.1.
   Reduced motion gets the end state via these CSS defaults. overflow-x is
   clipped (not hidden) so the crest may rise above the footer while the
   6000px ball never causes a horizontal scrollbar. */
.footer{position:relative;z-index:4;overflow-x:clip;background:var(--bg);color:var(--ink);
  --ft-dome-s:10;--ft-card:1;padding:110px 0 20px;
  font-family:var(--font);font-feature-settings:"cv11","ss01","calt";letter-spacing:-.018em;-webkit-font-smoothing:antialiased}
.footer::before{content:"";position:absolute;left:50%;bottom:0;width:min(380px,46vw);aspect-ratio:1;z-index:0;
  border-radius:50%;background:#2276E3;
  /* the foot stays planted, the crown rises: growing from the bottom edge
     means the scaled ball can never overflow downward and stretch the page */
  transform:translateX(-50%) scale(var(--ft-dome-s));transform-origin:50% 100%;will-change:transform}
/* the ball is a circle: its arc curves away from the bottom corners, so the
   lower half gets a solid field behind everything. It can only ever become
   visible once the flood is complete (the footer's lower half enters the
   viewport when the ball already spans it), so no seam is ever seen. */
.footer::after{content:"";position:absolute;left:0;right:0;top:50%;bottom:0;background:#2276E3;z-index:0}
.ft-inner{position:relative;z-index:1;margin:0 auto;width:calc(100% - 40px);max-width:1720px;
  transform:scale(var(--ft-card));transform-origin:50% 40%;will-change:transform;
  background:#FCFAF5;border-radius:40px;padding:76px 72px 42px;
  min-height:min(830px,100vh);display:flex;flex-direction:column;
  box-shadow:0 40px 90px -40px rgba(6,32,92,.5),inset 0 1px 0 #fff}
.ft-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* upper: brand · index · notes */
.ft-grid{flex:1;display:grid;grid-template-columns:1.15fr .85fr minmax(340px,1fr);gap:48px 88px;padding:0 0 64px;align-content:start}
/* the void where Kora parks its giant wordmark: ours is a ghost, tone on
   tone, big in size and almost silent in colour, so the card feels full
   without the brand shouting. Decorative pseudo-content: invisible to AT. */
.ft-grid::after{content:"The CreativityLab.";grid-column:1/-1;align-self:end;justify-self:start;
  margin-top:56px;font-size:clamp(88px,9.6vw,148px);font-weight:700;letter-spacing:-.045em;line-height:.86;
  color:rgba(34,118,227,.075);pointer-events:none;user-select:none}
.ft-wm{display:inline-block;color:var(--ink);text-decoration:none}
.ft-wm .wm{font-size:19px}
.ft-tag{margin-top:13px;font-size:14.5px;font-weight:400;line-height:1.5;color:#5B6478;letter-spacing:-.012em}
.ft-label{margin:0 0 18px;font-size:12.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-label);line-height:1}
.ft-nav{display:flex;flex-direction:column;gap:14px}
.ft-nav a{font-size:27px;font-weight:550;letter-spacing:-.014em;color:var(--ink);text-decoration:none;width:max-content;transition:color .25s var(--ease)}
.ft-nav a:hover{color:var(--accent)}
.ft-form{justify-self:end;width:100%;max-width:400px}
.ft-notes{font-size:17px;font-weight:400;line-height:1.5;letter-spacing:-.012em;color:#5B6478}
.ft-field{margin-top:18px;display:flex;align-items:center;height:50px;padding:0 4px 0 0;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 0 0 1px var(--line),0 0 0 2px rgba(150,200,255,.12),inset 0 1px 0 #fff}
.ft-field input{flex:1;min-width:0;height:100%;border:0;background:none;padding:0 16px;font:inherit;font-size:14px;letter-spacing:-.012em;color:var(--ink);outline:none}
.ft-field input::placeholder{color:#8A93A6}
.ft-field button{height:34px;padding:0 14px;border-radius:999px;color:#fff;font:inherit;font-size:13px;font-weight:500;letter-spacing:-.012em;background:var(--gl-az);box-shadow:var(--gl-rim-az);transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease)}
.ft-field button:hover{background:var(--gl-az-h);box-shadow:var(--gl-rim-az-h)}
.ft-agree{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:12px;line-height:1.5;color:#5B6478;cursor:pointer}
.ft-agree input{appearance:none;-webkit-appearance:none;width:14px;height:14px;margin:2px 0 0;border-radius:4px;flex:none;cursor:pointer;background:#fff;box-shadow:inset 0 0 0 1px rgba(15,23,42,.25);transition:background .2s,box-shadow .2s}
.ft-agree input:checked{background:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.ft-agree a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.ft-note{margin-top:10px;font-size:12.5px;line-height:1.5;color:#1E7BE6}
.ft-note:empty{display:none}
.ft-note.bad{color:#B4402A}

/* the AI Lab hand-off: one editorial row between two hairlines, one electric-blue point */
.ft-ai{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:0 26px;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none}
.ft-ai-h{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.ft-ai-h i{width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#eaf5ff 0,#8cc2ff 30%,#4f9dff 58%,#1f6fe0 100%);box-shadow:inset 0 -1px 1px rgba(10,40,120,.35),0 0 8px rgba(95,168,255,.7)}
.ft-ai-d{font-size:14px;font-weight:400;letter-spacing:-.012em;color:#5B6478}
.ft-ai-go{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:500;letter-spacing:-.015em;color:var(--ink);padding-bottom:2px;border-bottom:1px solid rgba(16,24,40,.22);transition:color .25s var(--ease),border-color .25s var(--ease)}
.ft-ai-go span{font-size:13px;transition:transform .28s var(--ease)}
.ft-ai:hover .ft-ai-h,.ft-ai:hover .ft-ai-go{color:#1E7BE6}
.ft-ai:hover .ft-ai-go{border-bottom-color:#1E7BE6}
.ft-ai:hover .ft-ai-go span{transform:translateX(3px)}

/* base: legal · socials + copyright. Quiet. */
.ft-base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-top:26px}
.ft-legal{display:flex;flex-wrap:wrap;gap:8px 20px}
.ft-legal a,.ft-legal button{font-size:12.5px;font-weight:400;letter-spacing:-.005em;color:#5B6478;text-decoration:none;background:none;border:0;padding:0;font-family:inherit;cursor:pointer;transition:color .25s var(--ease)}
.ft-legal a:hover,.ft-legal button:hover{color:var(--ink)}
.ft-meta{display:flex;align-items:center;gap:18px}
.ft-social{list-style:none;margin:0;padding:0;display:flex;gap:6px}
.ft-soc{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;color:#8A93A6;box-shadow:0 0 0 1px var(--line);cursor:default}
.ft-soc svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ft-copy{font-size:12.5px;color:#8A93A6;letter-spacing:-.005em}

@media (max-width:900px){
  .footer{padding:64px 0 12px}
  .footer::before{width:min(300px,80vw)}
  .ft-inner{width:calc(100% - 24px);border-radius:28px;padding:34px 22px 22px;min-height:0;display:block}
  .ft-nav a{font-size:21px}
  .ft-grid::after{font-size:15vw;margin-top:26px}
  /* order: brand, index, notes, AI Lab, socials + legal, copyright; hairlines between groups, no cards */
  .ft-grid{grid-template-columns:1fr;gap:0;padding:0}
  .ft-brand{padding-bottom:22px}
  .ft-nav{padding:20px 0 22px;border-top:1px solid var(--line)}
  .ft-form{justify-self:stretch;max-width:none;padding:20px 0 22px;border-top:1px solid var(--line)}
  .ft-ai{grid-template-columns:auto 1fr;gap:6px 14px;padding:18px 0}
  .ft-ai-d{grid-column:1/3}
  .ft-ai-go{grid-column:1/3;justify-self:start;margin-top:4px}
  .ft-base{flex-direction:column;align-items:flex-start;gap:16px;padding-top:18px}
  /* socials, then legal, then copyright */
  .ft-meta{display:contents}
  .ft-social{order:1}.ft-legal{order:2}.ft-copy{order:3}
}
@media (prefers-reduced-motion:reduce){
  .ft-ai-go span,.ft-nav a,.ft-field button{transition:none}
  .footer::before,.ft-inner{will-change:auto}
  /* the dome is scroll-driven and that script never runs here, so the CSS default
     (--ft-dome-s:10) would leave a 3800px ball standing over the whole page: the
     footer is only clipped horizontally. Paint the end state flat instead. */
  .footer{--ft-dome-s:1;background:#2276E3}
  .footer::before{display:none}
  .footer::after{top:0}
}

/* one studio, two worlds: the identity line under the footer wordmark */
.ft-worlds{margin-top:12px;font-size:13px;line-height:1.6;color:var(--grey,#616161);max-width:34ch}