/*
 * Instabooster — the site footer (owner redesign 2026-11-12, Claude Design canvas). Hand-written `.ft`
 * system (new class names only), mobile first; the wide layout is a container query on the page
 * root. Markup: src/components/brands/ib/chrome/footer.tsx + footer-client.tsx.
 * Every rule in @layer ib, scoped to html[data-brand="ib"] .ft.
 */
@layer ib {
  /* ── ground rules inside the page: the site's element styles (links, headings, lists,
        buttons) do not reach in; every class rule below is stronger than these ── */
  html[data-brand="ib"] .ft :is(h1, h2, h3, p, ul, ol, li, figure) { margin: 0; padding: 0; }
  html[data-brand="ib"] .ft :is(h1, h2, h3, p, li) { font: inherit; color: inherit; letter-spacing: inherit; text-transform: none; text-align: inherit; }
  html[data-brand="ib"] .ft :is(ul, ol) { list-style: none; }
  html[data-brand="ib"] .ft a { color: inherit; text-decoration: none; }
  html[data-brand="ib"] .ft :where(a):hover { color: inherit; text-decoration: none; }
  html[data-brand="ib"] .ft button { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font: inherit; color: inherit; letter-spacing: inherit; text-transform: none; text-align: left; cursor: pointer; }
  html[data-brand="ib"] .ft input { margin: 0; padding: 0; min-width: 0; border-radius: 0; box-shadow: none; }
  html[data-brand="ib"] .ft :is(em, i) { font-style: normal; }
  html[data-brand="ib"] .ft mark { padding: 0; background: none; color: inherit; }
  html[data-brand="ib"] .ft [hidden] { display: none !important; }
  /* a tap or a click leaves no ring behind (the site's own focus style); the keyboard keeps its ring */
  html[data-brand="ib"] .ft :is(a, button):focus:not(:focus-visible) { outline: 0; }

  html[data-brand="ib"] .ft { --pk:#e61c72; --pk-d:#cf1665; --grad:linear-gradient(135deg,#e61c72 0%,#ff4d94 100%); --ink:#14181f; --ease:cubic-bezier(.2,.8,.2,1); --bg:#14181f; --line:#2b313c; --hi:#fff; --text:#c7ccd6; --muted:#8d95a3; --accent:#ff4d94; container-type:inline-size; container-name:ft; position:relative; overflow:hidden; background:#fff; font-family:Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif; font-size:16px; line-height:1.5; color:var(--ink); -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent; }
  html[data-brand="ib"] .ft--light { --bg:#f6f7f9; --line:#e0e3e8; --hi:#14181f; --text:#4b5563; --muted:#667085; --accent:#cf1665; }
  html[data-brand="ib"] .ft * { box-sizing:border-box; min-width:0; }
  html[data-brand="ib"] .ft :where(h2,h3,p,ul,ol,li) { margin:0; padding:0; }
  html[data-brand="ib"] .ft :where(ul,ol) { list-style:none; }
  html[data-brand="ib"] .ft :where(a) { text-decoration:none; }
  html[data-brand="ib"] .ft :where(button) { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; text-align:left; }
  html[data-brand="ib"] .ft :where(svg) { display:block; flex:none; }
  html[data-brand="ib"] .ft :where(img) { display:block; max-width:100%; height:auto; }
  html[data-brand="ib"] .ft :is(a,button):focus-visible { outline:3px solid rgba(230,28,114,.55); outline-offset:2px; }
  html[data-brand="ib"] .ft .ft-ic { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
  html[data-brand="ib"] .ft .ft-wrap { width:100%; max-width:1216px; margin:0 auto; padding:0 20px; }
  /* the footer: a sheet that rises from the page, same corner as the sections above */
  html[data-brand="ib"] .ft .ft-foot { position:relative; padding:46px 0 34px; border-radius:28px 28px 0 0; background:var(--bg); color:var(--text); }
  /* who we are, and when there is someone at the other end */
  html[data-brand="ib"] .ft .ft-top { display:grid; gap:36px; }
  html[data-brand="ib"] .ft .ft-logo { height:26px; width:auto; }
  html[data-brand="ib"] .ft .ft:not(.ft--light) .ft-logo { filter:brightness(0) invert(1); }
  html[data-brand="ib"] .ft .ft-tag { margin-top:14px; max-width:420px; font-size:15px; line-height:1.6; font-weight:500; color:var(--text); }
  /* phones: only the rating; the sentence about the store from tablet */
  html[data-brand="ib"] .ft .ft-tag__about { display:none; }
  html[data-brand="ib"] .ft .ft-tag a { font-weight:700; color:var(--hi); text-decoration:underline; text-decoration-color:var(--line); text-decoration-thickness:1.5px; text-underline-offset:4px; transition:text-decoration-color .2s; }
  html[data-brand="ib"] .ft .ft-tag a:hover { color:var(--hi); text-decoration-color:var(--accent); }
  html[data-brand="ib"] .ft .ft-h { font-size:15px; line-height:1.3; font-weight:800; color:var(--hi); }
  html[data-brand="ib"] .ft .ft-care p { margin-top:6px; font-size:15px; line-height:1.6; font-weight:500; color:var(--text); }
  html[data-brand="ib"] .ft .ft-care__links { display:flex; flex-wrap:wrap; gap:0 26px; margin-top:6px; }
  /* text links: the arrow moves, the line grows */
  html[data-brand="ib"] .ft .ft-go { display:inline-flex; align-items:center; gap:7px; min-height:44px; font-size:15px; font-weight:700; color:var(--hi); }
  html[data-brand="ib"] .ft .ft-go svg { width:16px; height:16px; color:var(--accent); transition:transform .25s var(--ease); }
  html[data-brand="ib"] .ft .ft-go:hover { color:var(--hi); }
  html[data-brand="ib"] .ft .ft-go:hover svg { transform:translateX(4px); }
  html[data-brand="ib"] .ft .ft-go__t { background:linear-gradient(var(--accent),var(--accent)) 0 100%/0 1.5px no-repeat; padding-bottom:2px; transition:background-size .35s var(--ease); }
  html[data-brand="ib"] .ft .ft-go:hover .ft-go__t { background-size:100% 1.5px; }
  /* link columns: they fold on phones, open from tablet */
  html[data-brand="ib"] .ft .ft-cols { margin-top:36px; border-top:1px solid var(--line); }
  html[data-brand="ib"] .ft .ft-col { border-bottom:1px solid var(--line); }
  html[data-brand="ib"] .ft .ft-col__hd { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:64px; }
  html[data-brand="ib"] .ft .ft-col__hd h3 { font-size:15px; line-height:1.3; font-weight:800; color:var(--hi); }
  html[data-brand="ib"] .ft .ft-col__hd svg { width:18px; height:18px; color:var(--muted); transition:transform .45s var(--ease); }
  html[data-brand="ib"] .ft .ft-col.is-open .ft-col__hd svg { transform:rotate(180deg); }
  html[data-brand="ib"] .ft .ft-col__body { display:grid; grid-template-rows:0fr; transition:grid-template-rows .45s var(--ease); }
  html[data-brand="ib"] .ft .ft-col.is-open .ft-col__body { grid-template-rows:1fr; }
  html[data-brand="ib"] .ft .ft-col__body>ul { overflow:hidden; min-height:0; }
  html[data-brand="ib"] .ft .ft-col li:last-child { padding-bottom:12px; }
  html[data-brand="ib"] .ft .ft-a { display:inline-flex; flex-wrap:wrap; align-items:center; gap:0 10px; min-height:44px; min-width:44px; font-size:14.5px; font-weight:500; color:var(--text); transition:color .2s; }
  html[data-brand="ib"] .ft .ft-a:hover { color:var(--hi); }
  html[data-brand="ib"] .ft .ft-a__t { background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat; padding-bottom:1px; transition:background-size .35s var(--ease); }
  html[data-brand="ib"] .ft .ft-a:hover .ft-a__t { background-size:100% 1px; }
  html[data-brand="ib"] .ft .ft-a img { width:20px; height:20px; border-radius:6px; }
  html[data-brand="ib"] .ft .ft:not(.ft--light) .ft-a img { padding:2px; background:#fff; }
  html[data-brand="ib"] .ft .ft-a small { font-size:12.5px; font-weight:700; color:var(--accent); }
  /* base line */
  html[data-brand="ib"] .ft .ft-base { display:grid; gap:14px; margin-top:32px; }
  html[data-brand="ib"] .ft .ft-base p { font-size:13px; line-height:1.6; font-weight:500; color:var(--muted); }
  html[data-brand="ib"] .ft .ft-base p b { font-weight:700; color:var(--text); }
  html[data-brand="ib"] .ft .ft-up { justify-self:start; display:inline-flex; align-items:center; gap:7px; min-height:44px; font-size:13.5px; font-weight:700; color:var(--hi); }
  html[data-brand="ib"] .ft .ft-up svg { width:16px; height:16px; color:var(--accent); transition:transform .3s var(--ease); }
  html[data-brand="ib"] .ft .ft-up:hover { color:var(--hi); }
  html[data-brand="ib"] .ft .ft-up:hover svg { transform:translateY(-3px); }
  /* the footer comes in once, as it enters the screen (only where the page really scrolls) */
  html[data-brand="ib"] .ft--rv .ft-rv { opacity:.01; transform:translateY(14px); }
  html[data-brand="ib"] .ft--rv .ft-rv.is-in { opacity:1; transform:none; transition:opacity .6s var(--ease),transform .7s var(--ease); }
  @media (prefers-reduced-motion:reduce) {
    html[data-brand="ib"] .ft * { animation:none!important; transition:none!important; }
  }
  /* the smallest phones */
  @container ft (max-width:350px) {
    html[data-brand="ib"] .ft .ft-wrap { padding-left:16px; padding-right:16px; }
  }
  /* tablets: the columns open, two by two */
  @container ft (min-width:640px) {
    html[data-brand="ib"] .ft .ft-foot { padding-top:48px; }
    html[data-brand="ib"] .ft .ft-tag__about { display:inline; }
    html[data-brand="ib"] .ft .ft-top { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; }
    html[data-brand="ib"] .ft .ft-cols { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 40px; margin-top:34px; padding-top:34px; }
    html[data-brand="ib"] .ft .ft-col { border:0; }
    html[data-brand="ib"] .ft .ft-col__hd { min-height:0; cursor:default; pointer-events:none; }
    html[data-brand="ib"] .ft .ft-col__hd svg { display:none; }
    html[data-brand="ib"] .ft .ft-col__body { grid-template-rows:1fr; margin-top:6px; }
    html[data-brand="ib"] .ft .ft-col li:last-child { padding-bottom:0; }
    html[data-brand="ib"] .ft .ft-base { grid-template-columns:minmax(0,1fr) auto; column-gap:40px; margin-top:34px; padding-top:22px; border-top:1px solid var(--line); }
    html[data-brand="ib"] .ft .ft-base p { grid-column:1; }
    html[data-brand="ib"] .ft .ft-up { grid-column:2; grid-row:1/3; justify-self:end; align-self:start; }
  }
  /* desktop: one line of four */
  @container ft (min-width:960px) {
    html[data-brand="ib"] .ft .ft-wrap { padding:0 32px; }
    html[data-brand="ib"] .ft .ft-foot { padding:64px 0 30px; border-radius:36px 36px 0 0; }
    html[data-brand="ib"] .ft .ft-top { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:64px; }
    html[data-brand="ib"] .ft .ft-logo { height:30px; }
    html[data-brand="ib"] .ft .ft-tag { margin-top:18px; }
    html[data-brand="ib"] .ft .ft-cols { grid-template-columns:minmax(0,1.25fr) repeat(3,minmax(0,1fr)); gap:0 40px; margin-top:48px; padding-top:44px; }
    html[data-brand="ib"] .ft .ft-base { margin-top:44px; }
  }
  /* ── the real page ── */
  /* the corners of the sheet show the page behind, whatever its colour */
  html[data-brand="ib"] .ft { background: transparent; overflow: clip; }
  /* the official white logo as it is (the canvas whitened a dark one) */
  html[data-brand="ib"] .ft .ft-logo { filter: none; height: 28px; width: auto; }
  @media (min-width: 960px) {
    html[data-brand="ib"] .ft .ft-logo { height: 32px; }
  }
  /* "Preferencias de consentimiento" is the shared consent link: same look as its neighbours */
  html[data-brand="ib"] .ft .ft-consent a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14.5px; font-weight: 500; color: var(--text); transition: color .2s; }
  html[data-brand="ib"] .ft .ft-consent a:hover { color: var(--hi); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
  /* how you pay: the official marks, each on its white sticker */
  html[data-brand="ib"] .ft .ft-pay { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
  html[data-brand="ib"] .ft .ft-pay li { display: grid; place-items: center; width: 58px; height: 36px; border-radius: 8px; background: #fff; }
  html[data-brand="ib"] .ft .ft-pay img { display: block; max-width: none; }
  html[data-brand="ib"] .ft .ft-base .ft-base__c { font-weight: 600; color: var(--text); }
  @container ft (min-width: 640px) {
    html[data-brand="ib"] .ft .ft-pay { grid-column: 1; margin-bottom: 8px; }
    html[data-brand="ib"] .ft .ft-up { grid-row: 1 / 4; }
  }
  /* a tap leaves no ring behind (the site's own button focus style); the keyboard keeps the pink one */
  html[data-brand="ib"] .ft :is(a, button):focus:not(:focus-visible) { outline: 0; box-shadow: none; }
  /* On the pages that end in a full-width coloured band (pink closing band, tinted block) the
     sheet rises OVER the end of the page by its own corner radius, so its rounded corners show
     that band and not a wedge of the page background. Opt-in per page kind (marker on <html>):
     a page that ends flush would have its last line covered. tools/ft-seam.mjs checks every
     page kind; add a kind here only after it passes. */
  html[data-brand="ib"] .ft { position: relative; z-index: 1; }
  html[data-brand="ib"]:is([data-ib-marks~="ibm-home"], [data-ib-marks~="ibm-packs"], [data-ib-marks~="ibm-contact"], [data-ib-marks~="ibm-about"], [data-ib-marks*="ibm-tool"], [data-ib-marks~="ibm-afiliados"], [data-ib-marks~="ibm-account"], [data-ib-marks~="ibm-checkout"], [data-ib-marks~="ibm-legal"], [data-ib-marks~="ibm-estudio"]):not([data-ib-marks~="ibm-contact-thanks"]) .ft { margin-top: -28px; }
  @media (min-width: 960px) {
    html[data-brand="ib"]:is([data-ib-marks~="ibm-home"], [data-ib-marks~="ibm-packs"], [data-ib-marks~="ibm-contact"], [data-ib-marks~="ibm-about"], [data-ib-marks*="ibm-tool"], [data-ib-marks~="ibm-afiliados"], [data-ib-marks~="ibm-account"], [data-ib-marks~="ibm-checkout"], [data-ib-marks~="ibm-legal"], [data-ib-marks~="ibm-estudio"]):not([data-ib-marks~="ibm-contact-thanks"]) .ft { margin-top: -36px; }
  }
}
