/* ============================================================
   Oversized Wordmark Footer, static port of the Framer
   "Footer — Oversized Wordmark" component (brand · four link
   columns · bottom row · cropped giant wordmark), restyled
   white for FlowBack AI.

   Every page still carries legacy `body footer …{…!important}`
   rules from older footers, so selectors here are prefixed with
   `html body footer.fb-footer` to out-specify them.
   ============================================================ */

html body footer.fb-footer{
  --fb-ink:#14110D;
  --fb-muted:rgba(20,17,13,.62);
  --fb-line:rgba(20,17,13,.10);
  --fb-accent:rgb(110,84,56);
  position:relative;overflow:hidden;
  background:#FFFFFF !important;
  border-top:1px solid var(--fb-line) !important;
  color:var(--fb-ink) !important;
  text-align:left !important;
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:14px !important;
  padding:0 !important;margin:0;
  z-index:2;
}
html body footer.fb-footer *{box-sizing:border-box}
.fb-inner{max-width:1200px;margin:0 auto;padding:72px 56px 0}

/* ---- top row: brand + four link columns ---- */
.fb-top{display:flex;align-items:flex-start;gap:64px}
.fb-brand{flex:1 0 0;max-width:320px;display:flex;flex-direction:column;gap:16px}
html body footer.fb-footer .fb-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--fb-ink) !important}
.fb-logo img{height:30px;width:auto;display:block}
html body footer.fb-footer .fb-logo span{font-size:18px;font-weight:600;letter-spacing:-.02em;color:var(--fb-ink) !important}
html body footer.fb-footer .fb-desc{margin:0;font-size:14px;line-height:1.6;color:var(--fb-muted) !important}

.fb-social{display:flex;gap:8px}
html body footer.fb-footer .fb-social a{
  width:36px;height:36px;border-radius:4px;display:grid;place-items:center;
  color:var(--fb-ink) !important;text-decoration:none;
  border:1px solid var(--fb-line);background:#fff;
  transition:border-color .2s,transform .2s;
}
html body footer.fb-footer .fb-social a:hover{border-color:var(--fb-ink);transform:translateY(-2px)}
.fb-social svg{width:16px;height:16px;display:block}

/* checklist capture, kept from the previous footer */
.fb-capture{margin-top:4px}
html body footer.fb-footer .fb-capture-label{display:block;margin:0 0 8px;font-size:13px;font-weight:500;color:var(--fb-ink) !important}
.gf-form{display:flex;gap:6px;position:relative}
html body footer.fb-footer .gf-form input[type=email]{
  flex:1 1 auto;min-width:0;font:400 14px/1.2 'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  color:var(--fb-ink);padding:11px 14px;border:1px solid var(--fb-line);border-radius:4px;outline:none;background:#fff;
  transition:border-color .2s;
}
html body footer.fb-footer .gf-form input[type=email]:focus{border-color:var(--fb-ink)}
.gf-form input[type=email]::placeholder{color:rgba(20,17,13,.4)}
.gf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
html body footer.fb-footer .gf-btn{
  flex:none;font:500 14px/1.2 'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  padding:11px 16px;border:none;border-radius:4px;cursor:pointer;
  color:#fff !important;background:var(--fb-ink);transition:background .2s;
}
html body footer.fb-footer .gf-btn:hover{background:var(--fb-accent)}
.gf-btn:disabled{opacity:.6;cursor:default}
html body footer.fb-footer .gf-meta{font-size:12px;color:var(--fb-muted) !important;margin:6px 0 0;min-height:1em}
html body footer.fb-footer .gf-meta.ok{color:var(--fb-accent) !important}
html body footer.fb-footer .gf-meta.err{color:#b42318 !important}

html body footer.fb-footer .fb-cols{position:static !important;inset:auto !important;background:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;padding:0 !important;height:auto !important;z-index:auto !important}
.fb-cols{flex:1 0 0;display:grid;grid-template-columns:repeat(4,minmax(80px,1fr));gap:24px 32px}
.fb-col{display:flex;flex-direction:column;gap:12px;min-width:0}
html body footer.fb-footer .fb-col h4{margin:0 0 2px;padding:0;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--fb-muted) !important}
html body footer.fb-footer .fb-col a{
  font-size:14px;line-height:1.4;color:var(--fb-ink) !important;text-decoration:none;
  transition:color .15s;
}
html body footer.fb-footer .fb-col a:hover{color:var(--fb-accent) !important}

/* ---- bottom row ---- */
.fb-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:56px 0 20px}
html body footer.fb-footer .fb-bottom p{margin:0;font-size:13px;color:var(--fb-muted) !important}
.fb-legal{display:flex;flex-wrap:wrap;gap:4px 20px}
html body footer.fb-footer .fb-legal a{font-size:13px;color:var(--fb-muted) !important;text-decoration:none;transition:color .15s}
html body footer.fb-footer .fb-legal a:hover{color:var(--fb-ink) !important}

/* ---- oversized wordmark, cropped at the bottom edge ----
   An SVG with textLength keeps the words exactly edge-to-edge at
   every screen width, no JS and no font-size guessing. */
.fb-wordmark{display:block;width:100%;max-width:1440px;margin:0 auto;height:auto;overflow:hidden;user-select:none;pointer-events:none}
html body footer.fb-footer .fb-wordmark text{
  font-family:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-weight:600;letter-spacing:-.04em;fill:var(--fb-ink);
}

/* ---- tablet (mirrors the component's Tablet variant) ---- */
@media (max-width:900px){
  .fb-inner{padding:56px 40px 0}
  .fb-top{flex-direction:column;gap:44px}
  .fb-brand{flex:none;width:100%;max-width:480px}
  .fb-cols{flex:none;width:100%;gap:28px 24px}
  .fb-bottom{padding:48px 0 18px}
}
/* ---- phone (mirrors the component's Phone variant) ---- */
@media (max-width:600px){
  .fb-inner{padding:44px 20px 0}
  .fb-top{gap:36px}
  .fb-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
  html body footer.fb-footer .fb-col a{padding:2px 0}
  .fb-bottom{flex-direction:column;align-items:flex-start;gap:12px;padding:40px 0 16px}
  .fb-legal{gap:4px 16px}
  html body footer.fb-footer .gf-form input[type=email]{font-size:16px} /* stops iOS zoom-on-focus */
  /* on a phone the crop reads as cut off, so show the full word, descender
     included: a taller box lets the text below the 140-unit viewBox show */
  .fb-wordmark{aspect-ratio:1000/206;overflow:visible;padding-bottom:0}
}