.ibmi-lang{
  --ink:#0D0F11; --ink-mid:#2B333A; --ink-soft:#49535C; --ink-faint:#8B949C;
  --paper:#EDF5FA; --paper-raised:#FFFFFF; --paper-tint:#DCEEF9;
  --brand:#0088CC; --brand-deep:#006DA3; --brand-soft:#C9E8F7;
  --line:#CBDFEB; --line-soft:#DEEBF3;
  --green:#00B67A; --gold:#FFCC00; --red-strike:#98A1A8;
  --container:1104px;
  --lang-en:#2F4B85; --lang-de:#B73A34; --lang-fr:#3C8CCD; --lang-es:#D69E0A;
  --glass:linear-gradient(150deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.62) 45%,rgba(250,253,255,.80) 100%);
  --glass-border:1px solid rgba(255,255,255,.65);
  --shadow-card:inset 0 1px 1px rgba(255,255,255,1),0 1px 2px rgba(9,78,128,.08),0 22px 50px -18px rgba(9,78,128,.30);
  --shadow-lift:inset 0 1px 1px rgba(255,255,255,1),0 2px 3px rgba(9,78,128,.08),0 34px 66px -22px rgba(9,78,128,.40);
  --shadow-pill:inset 0 1px 1px rgba(255,255,255,1),0 1px 2px rgba(9,78,128,.10),0 8px 22px -10px rgba(9,78,128,.34);
}
.ibmi-lang,.ibmi-lang *{box-sizing:border-box}
.ibmi-lang{background:var(--paper);color:var(--ink);line-height:1.5 !important;-webkit-font-smoothing:antialiased;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}
.ibmi-lang,.ibmi-lang *{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif !important}
.ibmi-lang a{color:inherit;text-decoration:none}
.ibmi-lang img{display:block;max-width:100% !important;min-width:0 !important;border:0 !important;padding:0 !important}
/* The theme restyles <button> globally — it was forcing a small border-radius on
   the filter tabs and asymmetric padding on the FAQ/ladder rows. Every button in
   this block is a bare control, so neutralise the element once, then each
   component re-declares what it needs with !important below. */
.ibmi-lang button{-webkit-appearance:none !important;appearance:none !important;
  font-family:inherit !important;font-size:inherit !important;font-weight:inherit !important;
  line-height:inherit !important;color:inherit !important;text-transform:none !important;
  letter-spacing:normal !important;text-shadow:none !important;text-decoration:none !important;
  width:auto !important;min-width:0 !important;height:auto !important;min-height:0 !important;
  max-height:none !important;float:none !important;text-align:left !important}
.ibmi-lang :focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
.ibmi-lang .lt-lw{max-width:var(--container);margin:0 auto !important;padding:0 24px}
.ibmi-lang.ibmi-lang.ibmi-lang{font-size:16px !important;font-weight:400 !important;line-height:1.5 !important;
  letter-spacing:normal !important;word-spacing:normal !important;text-indent:0 !important;
  text-transform:none !important;font-style:normal !important;text-align:left !important}
.ibmi-lang p,.ibmi-lang span,.ibmi-lang small,.ibmi-lang b,.ibmi-lang strong,
.ibmi-lang em,.ibmi-lang i,.ibmi-lang a,.ibmi-lang li,.ibmi-lang ul,.ibmi-lang ol,
.ibmi-lang div,.ibmi-lang section,.ibmi-lang article,.ibmi-lang header,.ibmi-lang footer,
.ibmi-lang nav,.ibmi-lang figure,.ibmi-lang label,.ibmi-lang picture,
.ibmi-lang h1,.ibmi-lang h2,.ibmi-lang h3,.ibmi-lang h4,.ibmi-lang button{
  line-height:inherit !important;letter-spacing:inherit !important;font-size:inherit !important;
  text-transform:inherit !important;font-weight:inherit !important;font-style:inherit !important;
  word-spacing:normal !important;text-indent:0 !important}
.ibmi-lang h1,.ibmi-lang h2,.ibmi-lang h3{width:auto;margin:0 !important;color:var(--ink);letter-spacing:-.025em !important;
  text-transform:none !important;font-style:normal;text-wrap:balance}
.ibmi-lang p.lt-sub,.ibmi-lang .lt-sec-sub{text-wrap:pretty}
.ibmi-lang h2{font-size:clamp(26px,3.4vw,36px) !important;font-weight:700 !important;line-height:1.12 !important}
.ibmi-lang .lt-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px !important;font-weight:600 !important;line-height:1 !important;
  letter-spacing:.16em !important;text-transform:uppercase !important;color:var(--brand-deep);margin:0 !important;padding:8px 15px;border-radius:999px;
  background:linear-gradient(150deg,rgba(255,255,255,.96) 0%,rgba(246,251,255,.92) 100%);
  border:1px solid rgba(255,255,255,.85);
  box-shadow:inset 0 1px 1px rgba(255,255,255,1),0 1px 2px rgba(9,78,128,.08)}
/* the h2 reset uses !important, which beats an inline margin — so the gap under
   a section eyebrow has to live on the eyebrow, at higher specificity */
.ibmi-lang .lt-sec-head .lt-eyebrow{margin:0 0 20px !important}
.ibmi-lang .lt-sec{padding:66px 0;position:relative}
.ibmi-lang .lt-sec-head{max-width:660px}
.ibmi-lang .lt-sec-head.lt-center{margin:0 auto !important;text-align:center}
.ibmi-lang .lt-sec-sub{font-size:15.5px !important;line-height:1.65 !important;color:var(--ink-soft);margin:14px 0 0 !important}

/* seams — floating sections, hairline + soft cast shadow */
.ibmi-lang .lt-seam{position:relative;box-shadow:0 4px 12px -4px rgba(9,78,128,.14)}
.ibmi-lang .lt-seam::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,rgba(223,228,232,0) 0%,var(--line) 14%,var(--line) 86%,rgba(223,228,232,0) 100%)}
.ibmi-lang .lt-s-hero{z-index:9}.ibmi-lang .lt-s-tests{z-index:8}.ibmi-lang .lt-s-why{z-index:7}
.ibmi-lang .lt-s-how{z-index:6}.ibmi-lang .lt-s-cefr{z-index:5}.ibmi-lang .lt-s-std{z-index:4}.ibmi-lang .lt-s-rev{z-index:3}.ibmi-lang .lt-s-faq{z-index:2}

/* buttons */
.ibmi-lang .lt-ibtn{display:inline-flex;align-items:center;gap:9px;font-size:15px !important;font-weight:600 !important;line-height:1 !important;
  border-radius:12px;padding:15px 26px;border:0;margin:0 !important;min-height:0;min-width:0;white-space:nowrap;
  text-decoration:none !important;text-transform:none !important;letter-spacing:normal !important;text-shadow:none;
  -webkit-appearance:none;appearance:none;background-image:none;cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease}
.ibmi-lang .lt-ibtn-light{color:var(--ink) !important;border:1px solid rgba(255,255,255,.55);
  background:linear-gradient(150deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.74) 50%,rgba(238,249,255,.86) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(1.7);backdrop-filter:blur(18px) saturate(1.7);
  box-shadow:inset 0 1px 1px #fff,inset 0 -8px 16px -10px rgba(140,200,235,.35),0 1px 2px rgba(2,18,36,.28),0 14px 30px -12px rgba(3,18,38,.55)}
.ibmi-lang .lt-ibtn-light:hover{transform:translateY(-2px);
  background:linear-gradient(150deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.70) 50%,rgba(238,249,255,.88) 100%);
  box-shadow:inset 0 1px 1px #fff,0 2px 3px rgba(2,18,36,.24),0 18px 38px -14px rgba(3,18,38,.60)}
.ibmi-lang .lt-ibtn-ghostd{color:#fff !important;border:1px solid rgba(255,255,255,.30);
  background:linear-gradient(135deg,rgba(255,255,255,.15),rgba(255,255,255,.05) 55%,rgba(255,255,255,.11));
  -webkit-backdrop-filter:blur(12px) saturate(1.6);backdrop-filter:blur(12px) saturate(1.6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(255,255,255,.08)}
.ibmi-lang .lt-ibtn-ghostd:hover{transform:translateY(-2px);
  background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,.09) 55%,rgba(255,255,255,.17));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 12px 26px -12px rgba(3,18,38,.5)}
.ibmi-lang .lt-ibtn:hover .lt-arrow-d{transform:translateY(3px)}
.ibmi-lang .lt-arrow-d{transition:transform .18s ease}

/* ---------------- HERO (homepage treatment: photo band + dark liquid glass) ---------------- */
.ibmi-lang .lt-hero{position:relative;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw) !important;
  display:flex;align-items:center;min-height:clamp(480px,31vw,580px);padding:100px 0 142px;
  background:radial-gradient(70% 90% at 6% -6%,rgba(37,182,222,.30) 0%,rgba(37,182,222,0) 58%),
             linear-gradient(112deg,#04365A 0%,#075E93 58%,var(--brand) 100%)}
.ibmi-lang .lt-hero .lt-lw{position:relative;z-index:2;width:100%}
/* accreditation seal, top right — bare on the photograph.
   brightness(0) invert(1) renders any opaque pixel white while keeping the PNG's
   transparency, so the mark reads on the dark band whatever colour the artwork
   is. Drop it if the logo ever needs to keep its own colours. */
.ibmi-lang .lt-hero-topbar{position:absolute;top:0;left:0;right:0;z-index:3;
  display:flex;justify-content:flex-end;max-width:var(--container);margin:0 auto !important;
  padding:30px 24px 0 !important;pointer-events:none}
.ibmi-lang .lt-hero-seal{height:58px;width:auto !important;max-width:none !important;display:block;
  padding:0 !important;border:0 !important;background:none;opacity:.94;
  filter:brightness(0) invert(1) drop-shadow(0 2px 8px rgba(2,18,36,.45))}
@media (max-width:720px){
  .ibmi-lang .lt-hero-topbar{padding:20px 16px 0 !important}
  .ibmi-lang .lt-hero-seal{height:44px}
}

/* --- background photo band --- */
.ibmi-lang .lt-band-city{position:absolute;inset:0;z-index:0;pointer-events:none}
.ibmi-lang .lt-band-city img{width:100% !important;max-width:none !important;height:100% !important;object-fit:cover;object-position:center 32%;
  image-rendering:-webkit-optimize-contrast}
/* Only a whisper over the photograph — just enough to seat the white text that
   sits outside the tile. All the heavy lifting for legibility now happens inside
   the tile itself, so the picture stays a picture. */
.ibmi-lang .lt-band-city::after{content:"";position:absolute;inset:0;
  background:linear-gradient(70deg,rgba(2,20,38,.10) 0%,rgba(2,20,38,.14) 100%)}

/* --- ambient layers (city lights, drifting bokeh, aurora wash) --- */
.ibmi-lang .lt-amb{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ibmi-lang .lt-amb-lights i{position:absolute;left:var(--x);top:var(--y);border-radius:50%;opacity:0;
  width:calc(var(--s)*1.6);height:calc(var(--s)*1.6);color:var(--c);background:currentColor;
  box-shadow:0 0 10px 2.5px currentColor;animation:lgWink var(--d) ease-in-out infinite;animation-delay:var(--dl)}
@keyframes lgWink{0%,100%{opacity:0}30%,70%{opacity:.95}}
.ibmi-lang .lt-amb-bokeh i{position:absolute;left:var(--x);bottom:-46px;width:var(--s);height:var(--s);border-radius:50%;
  background:radial-gradient(circle at 36% 34%,rgba(255,255,255,.55) 0%,var(--c) 42%,transparent 72%);
  filter:blur(1.2px);box-shadow:0 0 18px 3px color-mix(in srgb,var(--c) 45%,transparent);
  opacity:0;animation:lgRise2 var(--d) linear infinite;animation-delay:var(--dl);will-change:transform,opacity}
@keyframes lgRise2{
  0%{transform:translate3d(0,0,0);opacity:0}
  10%{opacity:var(--o,.5)}
  55%{transform:translate3d(calc(var(--sw,26px)*.5),-370px,0)}
  86%{opacity:var(--o,.5)}
  100%{transform:translate3d(var(--sw,26px),-720px,0);opacity:0}}
.ibmi-lang .lt-amb-aurora::before{content:"";position:absolute;width:58vw;height:58vw;left:-14vw;top:-30vw;border-radius:50%;
  background:radial-gradient(circle,rgba(88,204,244,.30) 0%,rgba(88,204,244,.11) 42%,transparent 68%);
  mix-blend-mode:screen;filter:blur(26px);animation:lgDrift 17s ease-in-out infinite alternate;will-change:transform}
.ibmi-lang .lt-amb-aurora::after{content:"";position:absolute;width:44vw;height:44vw;right:-10vw;bottom:-26vw;border-radius:50%;
  background:radial-gradient(circle,rgba(255,196,110,.20) 0%,rgba(255,196,110,.07) 45%,transparent 70%);
  mix-blend-mode:screen;filter:blur(30px);animation:lgDrift 23s ease-in-out -8s infinite alternate-reverse;will-change:transform}
@keyframes lgDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(8vw,5vh,0) scale(1.16)}}
@media (prefers-reduced-motion:reduce){
  .ibmi-lang .lt-amb-bokeh{display:none}
  .ibmi-lang .lt-amb-lights i{animation:none;opacity:.4}
  .ibmi-lang .lt-amb-aurora::before,.ibmi-lang .lt-amb-aurora::after{animation:none}
}

/* --- the frosted tile --- */
.ibmi-lang .lt-tile-copy{position:relative;z-index:2;overflow:visible;
  max-width:640px;padding:38px 40px;border-radius:22px;display:block;
  /* the liquid-glass highlight recipe, unchanged, over a local dark tint — the
     tint replaces the page-wide scrim so legibility no longer depends on the
     photograph happening to be dark */
  background:linear-gradient(135deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.05) 38%,rgba(255,255,255,.03) 62%,rgba(255,255,255,.10) 100%),
             linear-gradient(0deg,rgba(5,27,46,.66),rgba(5,27,46,.66));
  -webkit-backdrop-filter:blur(22px) saturate(1.5) brightness(.78);
  backdrop-filter:blur(22px) saturate(1.5) brightness(.78);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.30),inset 0 -1px 1px rgba(255,255,255,.10),
             inset 0 18px 30px -18px rgba(255,255,255,.12),0 30px 60px -26px rgba(2,18,36,.6)}
/* refractive rim */
.ibmi-lang .lt-tile-copy::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:linear-gradient(125deg,rgba(255,255,255,.65) 0%,rgba(255,255,255,.10) 28%,rgba(255,255,255,.03) 52%,rgba(255,255,255,.12) 74%,rgba(255,255,255,.42) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
/* one-off sheen sweep on load */
.ibmi-lang .lt-tile-copy::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.06) 46%,rgba(255,255,255,.11) 50%,rgba(255,255,255,.06) 54%,transparent 68%);
  background-size:280% 100%;background-position:135% 0;
  animation:lgSheen 2.2s ease-in-out 1.5s 1 both}
@keyframes lgSheen{from{background-position:135% 0}to{background-position:-45% 0}}
@media (prefers-reduced-motion:reduce){.ibmi-lang .lt-tile-copy::after{animation:none}}

@keyframes lgRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.ibmi-lang .lt-tile-body>*{animation:lgRise .65s cubic-bezier(.22,.75,.35,1) both}
.ibmi-lang .lt-tile-body>:nth-child(2){animation-delay:.09s}
.ibmi-lang .lt-tile-body>:nth-child(3){animation-delay:.18s}
.ibmi-lang .lt-tile-body>:nth-child(4){animation-delay:.27s}
@media (prefers-reduced-motion:reduce){.ibmi-lang .lt-tile-body>*{animation:none}}
/* The tile's four children finish at .27s delay + .65s = .92s. The certificate
   enters straight after, then the fact strip closes the sequence. */
.ibmi-lang .lt-factstrip{animation:lgRise .65s cubic-bezier(.22,.75,.35,1) .95s both}
@media (prefers-reduced-motion:reduce){.ibmi-lang .lt-factstrip{animation:none}}
.ibmi-lang .lt-tile-body{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.ibmi-lang .lt-hero .lt-eyebrow{color:#9FE3F5;background:none;border:0;box-shadow:none;padding:0}
.ibmi-lang .lt-hero h1{font-size:clamp(30px,4.1vw,45px) !important;font-weight:800 !important;line-height:1.14 !important;margin:16px 0 0 !important;
  color:#fff;max-width:none}
.ibmi-lang .lt-hero h1 .lt-nw{white-space:nowrap}
.ibmi-lang .lt-hero .lt-sub{font-size:clamp(15.5px,1.4vw,17px) !important;line-height:1.6 !important;color:#fff;opacity:.96;
  margin:16px 0 0 !important;max-width:none}
.ibmi-lang .lt-hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px !important}


/* ---------------- USP STRIP ---------------- */
/* full-bleed band: the top 42px stays transparent so the strip overlaps the hero,
   everything below picks up the tests section's opening colour — without this the
   gap beside the strip fell back to --paper and read as a stray horizontal stripe */
.ibmi-lang .lt-factband{position:relative;z-index:10;width:100vw;margin-left:calc(50% - 50vw) !important;margin-top:-42px !important}
.ibmi-lang .lt-factband::before{content:"";position:absolute;left:0;right:0;top:42px;bottom:0;background:#FBFDFF;z-index:-1}
.ibmi-lang .lt-factwrap{position:relative}
.ibmi-lang .lt-factstrip{display:grid;grid-template-columns:1fr 1fr;gap:16px 14px;padding:20px 18px;border-radius:18px;
  background:#FFFFFF;border:1px solid rgba(255,255,255,.75);box-shadow:var(--shadow-card)}
/* Four facts = the offer: what, how long, how free, how trusted. CEFR and
   verification moved down into the specimen panel, where they are shown rather
   than asserted — so nothing is claimed twice within one screen. */
/* Two rows at every width below 1030 (3x2 on tablet, 2x3 on phones), so the 6th
   fact is shown to fill them evenly. One row of five on desktop hides it. */
@media (min-width:700px){
  .ibmi-lang .lt-factstrip{grid-template-columns:repeat(3,1fr);gap:16px 14px;padding:22px 26px}
}
@media (min-width:1030px){
  .ibmi-lang .lt-factstrip{grid-template-columns:repeat(5,1fr);gap:14px}
  .ibmi-lang .lt-factstrip .lt-fact-m{display:none}
}
.ibmi-lang .lt-fact{display:flex;gap:10px;align-items:center;min-width:0}
.ibmi-lang a.lt-fact{border-radius:10px;transition:transform .15s ease,color .15s ease}
.ibmi-lang a.lt-fact:hover{transform:translateY(-1px)}
.ibmi-lang a.lt-fact:hover .lt-ft small{color:var(--brand-deep)}
.ibmi-lang .lt-fact .lt-fi{flex:none;width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  color:var(--brand-deep);background:var(--paper-tint);border-radius:10px}
.ibmi-lang .lt-fact .lt-fi svg{width:20px;height:20px;display:block}
.ibmi-lang .lt-fact .lt-ft{display:flex;flex-direction:column;gap:1px;min-width:0}
.ibmi-lang .lt-fact .lt-ft b{font-size:13.5px !important;line-height:1.2 !important;white-space:nowrap;color:var(--ink)}
.ibmi-lang .lt-fact .lt-ft small{font-size:12px !important;color:var(--ink-soft);line-height:1.25 !important;white-space:nowrap}
/* "Lifetime access" is longer than the label it replaced — let both lines wrap
   rather than clip once the cells get to ~118px */
@media (max-width:430px){
  .ibmi-lang .lt-fact .lt-ft b,.ibmi-lang .lt-fact .lt-ft small{white-space:normal}
}
@media (max-width:420px){
  .ibmi-lang .lt-factstrip{padding:16px 14px;gap:12px}
  .ibmi-lang .lt-fact{gap:9px}
  .ibmi-lang .lt-fact .lt-fi{width:32px;height:32px;border-radius:9px}
  .ibmi-lang .lt-fact .lt-fi svg{width:18px;height:18px}
  .ibmi-lang .lt-fact .lt-ft small{white-space:normal}
}

/* ---------------- TEST GRID ---------------- */
.ibmi-lang .lt-factwrap + .lt-s-tests{padding-top:44px}
.ibmi-lang .lt-s-tests{background:linear-gradient(180deg,#FBFDFF 0%,var(--paper) 55%,#EDF5FB 100%)}

/* ------- SPECIMEN PANEL -------
   One card, not a bare image beside naked text. The copy explains what is
   actually ON the certificate — the one thing the facts strip above does not
   already say — so the panel stops repeating the page and the image gains a
   caption. Card height is set by whichever column is taller, which is why the
   old dead-space problem cannot recur. */
.ibmi-lang .lt-spec{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1fr);
  gap:40px;align-items:center;padding:34px 36px;border-radius:22px;
  background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-card)}
.ibmi-lang .lt-spec-copy{order:2;min-width:0}
.ibmi-lang .lt-spec-art{order:1;min-width:0}

/* ------- DEMO VERIFICATION (ported from the homepage .vd widget) -------
   Replaces the old "there is a verification ID" claim: the ID here is the one
   printed on the front certificate, and verifying stamps that certificate. */
.ibmi-lang .lt-vd{position:relative;margin-top:24px !important;padding-top:22px;
  border-top:1px solid var(--line-soft)}
.ibmi-lang .lt-vd-pillrow{position:absolute;top:-13px;left:0;right:0;display:flex;justify-content:center;pointer-events:none}
.ibmi-lang .lt-vd-demo{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.12em !important;
  text-transform:uppercase !important;color:var(--ink-mid);background:#FDFEFF;
  border:1px solid var(--line);border-radius:999px;height:26px;display:inline-flex;align-items:center;
  padding:0 15px;line-height:1 !important;
  box-shadow:0 1px 2px rgba(9,78,128,.08),0 6px 14px -8px rgba(9,78,128,.30)}
.ibmi-lang .lt-vd-field{position:relative;display:flex;align-items:center;gap:10px;
  padding:5px 5px 5px 14px;border-radius:13px;background:rgba(255,255,255,.85);
  border:1px solid rgba(9,78,128,.14);
  box-shadow:inset 0 1px 2px rgba(9,78,128,.06),inset 0 1px 0 rgba(255,255,255,.9);
  transition:border-color .3s ease}
.ibmi-lang .lt-vd-field>svg{width:16px;height:16px;flex:none;color:var(--ink-faint)}
.ibmi-lang .lt-vf-id{flex:1;min-width:0;font-family:ui-monospace,Menlo,Consolas,monospace !important;
  font-size:14px !important;font-weight:700 !important;letter-spacing:.02em !important;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ibmi-lang .lt-vbtn{flex:none;min-width:114px !important;border-radius:10px !important;
  padding:12px 16px !important;margin:0 !important;min-height:0 !important;
  font-size:13px !important;font-weight:700 !important;line-height:1.2 !important;
  text-transform:none !important;letter-spacing:normal !important;text-align:center !important;
  color:#fff !important;border:0 !important;cursor:pointer;box-sizing:border-box;
  background:linear-gradient(150deg,rgba(72,200,236,.95) 0%,rgba(8,148,213,.9) 48%,rgba(0,116,176,.95) 100%) !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.5),0 6px 14px -6px rgba(0,116,176,.55);
  transition:transform .15s ease,background .3s ease,box-shadow .3s ease}
.ibmi-lang .lt-vbtn:hover{transform:translateY(-1px)}
.ibmi-lang .lt-vbtn:disabled{opacity:.8;transform:none;cursor:default}
.ibmi-lang .lt-vd-bar{position:absolute;left:6px;right:6px;bottom:-11px;height:3px;border-radius:999px;
  overflow:hidden;opacity:0;transition:opacity .25s ease}
.ibmi-lang .lt-vd-bar i{display:block;height:100%;width:0;border-radius:3px;
  background:linear-gradient(90deg,#3ECD96,#0E8A5F)}
@keyframes lgVbar{from{width:0}to{width:100%}}
.ibmi-lang .lt-vd.lt-checking .lt-vd-bar,.ibmi-lang .lt-vd.lt-ok .lt-vd-bar{opacity:1}
.ibmi-lang .lt-vd.lt-checking .lt-vd-bar i{animation:lgVbar .9s linear forwards}
.ibmi-lang .lt-vd.lt-ok .lt-vd-bar i{width:100%}
.ibmi-lang .lt-vd.lt-ok .lt-vd-field{border-color:rgba(14,138,95,.4)}
.ibmi-lang .lt-vd.lt-ok .lt-vbtn{background:linear-gradient(150deg,#3ECD96 0%,#17A06C 55%,#0E8A5F 100%) !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.5),0 6px 14px -6px rgba(14,138,95,.55)}
.ibmi-lang .lt-vres{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;
  opacity:0;transform:translateY(6px);max-height:0;overflow:hidden;margin-top:0 !important;
  transition:opacity .35s ease,transform .35s ease,max-height .35s ease,margin .35s ease}
.ibmi-lang .lt-vd.lt-ok .lt-vres{opacity:1;transform:none;max-height:140px;margin-top:20px !important}
.ibmi-lang .lt-vres-top{display:inline-flex;align-items:center;gap:8px}
.ibmi-lang .lt-vres-top b{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.08em !important;
  text-transform:uppercase !important;color:#0E8A5F}
.ibmi-lang .lt-sh{width:20px;height:20px;border-radius:50%;background:var(--green);color:#fff;
  display:flex;align-items:center;justify-content:center;flex:none}
.ibmi-lang .lt-sh svg{width:12px;height:12px}
.ibmi-lang .lt-vr-line{font-size:14px !important;font-weight:700 !important;line-height:1.3 !important;color:var(--ink)}
.ibmi-lang .lt-vr-sub{font-size:12.5px !important;line-height:1.4 !important;color:var(--ink-soft)}
.ibmi-lang .lt-vr-dot{color:var(--ink-faint)}
.ibmi-lang .lt-vnote{font-size:12px !important;line-height:1.45 !important;color:var(--ink-faint);
  margin:12px 0 0 !important;text-align:center}
.ibmi-lang .lt-vnote a{color:var(--brand-deep);font-weight:600 !important;border-bottom:1px solid var(--brand-soft)}
.ibmi-lang .lt-vnote-sm{display:none}
.ibmi-lang .lt-sub-sm{display:none}

/* the stamp that lands on the front certificate when the check passes */
.ibmi-lang .lt-fan-stamp{position:absolute;top:13%;right:8%;z-index:3;display:inline-flex;align-items:center;gap:.5cqw;
  font-size:4.6cqw !important;font-weight:800 !important;letter-spacing:.06em !important;
  text-transform:uppercase !important;line-height:1 !important;color:#0E8A5F;
  border:.6cqw solid #0E8A5F;border-radius:1.5cqw;padding:1.2cqw 2.4cqw;
  transform:rotate(-9deg) scale(1.7);opacity:0;pointer-events:none;mix-blend-mode:multiply;
  transition:opacity .25s ease,transform .4s cubic-bezier(.22,.75,.35,1)}
.ibmi-lang .lt-fan-stamp svg{width:4.6cqw;height:4.6cqw}
.ibmi-lang .lt-fan-front.lt-stamped .lt-fan-stamp{opacity:.92;transform:rotate(-9deg) scale(1)}
@media (max-width:900px){.ibmi-lang .lt-vd{margin-top:20px !important}}

/* ------- CERTIFICATE FAN -------
   Four opaque scans stacked in register, dealt out on scroll into their final
   fan. The FRONT card sits in normal flow so the container takes its height
   whatever the source aspect turns out to be; the other three are absolute and
   registered to it. Every angle/offset below is a variable — tune, don't hunt. */
/* tuned against an A4-proportioned scan (0.707), the tallest plausible source —
   translate percentages resolve against each card's own box, so a squarer scan
   only gains headroom. No card reaches the panel edge. */
.ibmi-lang .lt-fan{--card-w:68%;--fan-x:7.5%;--fan-y:2%;--fan-r:2.6deg;
  position:relative;width:100%}
.ibmi-lang .lt-fan-front{position:relative;width:var(--card-w);margin-left:auto;
  container-type:inline-size;z-index:4}
.ibmi-lang .lt-fan-card{width:100% !important;max-width:100% !important;height:auto !important;
  display:block;border-radius:3px;
  box-shadow:0 1px 2px rgba(9,78,128,.16),0 14px 30px -12px rgba(9,78,128,.34)}
.ibmi-lang .lt-fan>.lt-fan-card{position:absolute;right:0;top:0;width:var(--card-w) !important;
  transform-origin:88% 96%}
/* Each back card's offset is its full fan position multiplied by its own scroll
   progress (--p2/--p3/--p4, 0 to 1, set from JS). At 0 they sit exactly behind
   the front card — opaque scans, so they are simply not visible — and slide out
   from under it as you scroll. No opacity fade: paper does not fade in. */
.ibmi-lang .lt-fan-2{z-index:3;--p:var(--p2,1);}
.ibmi-lang .lt-fan-3{z-index:2;--p:var(--p3,1);}
.ibmi-lang .lt-fan-4{z-index:1;--p:var(--p4,1);}
.ibmi-lang .lt-fan-2,.ibmi-lang .lt-fan-3,.ibmi-lang .lt-fan-4{
  transform:translate(calc(-1 * var(--fan-x) * var(--step) * var(--p)),
                      calc(-1 * var(--fan-y) * var(--step) * var(--p)))
            rotate(calc(-1 * var(--fan-r) * var(--step) * var(--p)))}
.ibmi-lang .lt-fan-2{--step:1}
.ibmi-lang .lt-fan-3{--step:2}
.ibmi-lang .lt-fan-4{--step:3}

/* the two fields printed onto the front certificate — positions are variables
   because they depend on where the fields sit in the scan */
.ibmi-lang .lt-fan-name{position:absolute;left:50%;top:34.8%;transform:translateX(-50%);
  font-size:6.4cqw !important;font-weight:700 !important;line-height:1 !important;
  color:#1b2b3a;white-space:nowrap;letter-spacing:.01em !important;pointer-events:none}
.ibmi-lang .lt-fan-score{position:absolute;left:50%;top:44.25%;transform:translateX(-50%);
  font-size:6.4cqw !important;font-weight:700 !important;line-height:1 !important;
  color:#1b2b3a;white-space:nowrap;letter-spacing:-.01em !important;pointer-events:none}
.ibmi-lang .lt-fan-code{position:absolute;right:7.5%;bottom:9.5%;
  font-size:1.85cqw !important;font-weight:500 !important;line-height:1 !important;
  color:#41505e;white-space:nowrap;letter-spacing:.02em !important;pointer-events:none}

.ibmi-lang .lt-spec-copy h2{font-size:clamp(24px,2.9vw,31px) !important;line-height:1.14 !important}
.ibmi-lang .lt-spec-lead{font-size:15px !important;line-height:1.6 !important;color:var(--ink-soft);
  margin:12px 0 0 !important;max-width:44ch}
.ibmi-lang .lt-spec-list{display:flex;flex-direction:column;gap:14px;margin-top:22px !important;
  padding-top:20px;border-top:1px solid var(--line-soft)}
.ibmi-lang .lt-spec-row{display:flex;gap:13px;align-items:flex-start}
.ibmi-lang .lt-spec-i{flex:none;width:34px;height:34px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;color:var(--brand-deep);background:var(--paper-tint);
  border:1px solid color-mix(in srgb,var(--brand) 16%,#fff)}
.ibmi-lang .lt-spec-i svg{width:18px;height:18px;flex:none;display:block}
.ibmi-lang .lt-spec-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.ibmi-lang .lt-spec-t b{font-size:14.5px !important;font-weight:700 !important;line-height:1.25 !important;color:var(--ink)}
.ibmi-lang .lt-spec-t small{font-size:13px !important;line-height:1.45 !important;color:var(--ink-soft)}
.ibmi-lang .lt-spec-t a{color:var(--brand-deep);font-weight:600 !important;border-bottom:1px solid var(--brand-soft)}
@media (max-width:900px){
  .ibmi-lang .lt-spec{grid-template-columns:1fr;gap:26px;padding:26px 22px}
  .ibmi-lang .lt-spec-copy{order:1}
  .ibmi-lang .lt-spec-art{order:2;max-width:400px;justify-self:center;width:100%}
  .ibmi-lang .lt-spec-lead{max-width:none}
}
.ibmi-lang .lt-langbar{position:relative;scroll-margin-top:96px;display:flex;flex-wrap:wrap;gap:9px;justify-content:center;
  margin:38px 0 32px !important;padding-top:30px}
.ibmi-lang .lt-langbar::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,rgba(203,223,235,0) 0%,var(--line) 10%,var(--line) 90%,rgba(203,223,235,0) 100%)}
.ibmi-lang .lt-ltab{--a:var(--brand);--ai:var(--brand-deep);display:inline-flex !important;align-items:center !important;gap:8px !important;
  font-family:'Inter',system-ui,sans-serif !important;font-size:14px !important;font-weight:600 !important;line-height:1 !important;
  width:auto !important;min-width:0 !important;height:auto !important;text-decoration:none !important;
  color:var(--ink-mid) !important;background:#FFFFFF !important;border:1px solid var(--line-soft) !important;
  padding:10px 17px !important;margin:0 !important;min-height:0 !important;cursor:pointer;text-transform:none !important;letter-spacing:normal !important;border-radius:999px !important;text-align:center !important;
  -webkit-appearance:none;appearance:none;
  box-shadow:inset 0 1px 1px rgba(255,255,255,1),0 1px 2px rgba(9,78,128,.10),0 6px 16px -8px rgba(9,78,128,.30) !important;transition:transform .16s ease,color .16s ease,box-shadow .16s ease}
/* the only place a language-specific colour survives: the dot shown if a flag 404s */
.ibmi-lang .lt-ltab .lt-dot{width:8px;height:8px;border-radius:50%;background:var(--dot,var(--brand));flex:none;transition:background .16s ease}
.ibmi-lang .lt-tpill .lt-dot{width:8px;height:8px;border-radius:50%;background:var(--dot,var(--brand));flex:none}
.ibmi-lang .lt-ltab .lt-tflag{width:20px;height:15px;flex:none;border-radius:3px;display:block;
  box-shadow:0 0 0 1px rgba(9,78,128,.14),0 1px 2px rgba(9,78,128,.18)}
.ibmi-lang .lt-ltab .lt-tflag-i{width:16px;height:16px;flex:none;color:var(--brand-deep);transition:color .16s ease}
.ibmi-lang .lt-ltab[aria-pressed="true"] .lt-tflag{box-shadow:0 0 0 1px rgba(255,255,255,.75),0 1px 3px rgba(2,40,64,.30)}
.ibmi-lang .lt-ltab[aria-pressed="true"] .lt-tflag-i{color:#fff}
.ibmi-lang .lt-ltab:hover{transform:translateY(-1px);color:var(--ink)}
.ibmi-lang .lt-ltab[aria-pressed="true"]{color:#fff !important;border-color:transparent !important;
  background:linear-gradient(150deg,var(--ai) 0%,color-mix(in srgb,var(--ai) 82%,#000) 100%) !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.38),0 8px 20px -8px color-mix(in srgb,var(--ai) 55%,transparent) !important}
.ibmi-lang .lt-ltab[aria-pressed="true"] .lt-dot{background:#fff}
.ibmi-lang .lt-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}

.ibmi-lang .lt-tcard{--a:var(--brand);--ai:var(--brand-deep);position:relative;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;isolation:isolate;
  background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-card);
  transition:transform .18s ease,box-shadow .18s ease;animation:lgCardIn .45s ease backwards;animation-delay:calc(var(--i,0)*45ms)}
@keyframes lgCardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ibmi-lang .lt-tcard::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  background:linear-gradient(115deg,transparent 35%,rgba(105,170,215,.18) 47%,rgba(130,190,230,.38) 51%,rgba(105,170,215,.18) 55%,transparent 68%);
  background-size:260% 100%;background-position:140% 0}
.ibmi-lang .lt-tcard:hover::after{animation:lgSweep .75s ease-out}
@keyframes lgSweep{from{background-position:140% 0}to{background-position:-60% 0}}
.ibmi-lang .lt-tcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
/* fixed 3:2 so the photo crops identically at every breakpoint — a fixed pixel
   height made the box swing between 1.11:1 and 2.74:1 and recropped the shot */
.ibmi-lang .lt-tcard-media{position:relative;display:block;aspect-ratio:3/2;flex:none;overflow:hidden;
  border-radius:18px 18px 0 0;
  background:linear-gradient(160deg,color-mix(in srgb,var(--a) 14%,#fff) 0%,color-mix(in srgb,var(--a) 7%,#fff) 45%,color-mix(in srgb,var(--a) 20%,#fff) 100%);
  border-bottom:1px solid color-mix(in srgb,var(--a) 16%,var(--line-soft))}
.ibmi-lang .lt-tcard-media>img{position:absolute;inset:0;width:100% !important;max-width:none !important;height:100% !important;object-fit:cover;
  transition:transform .45s ease}
/* scrim so the two pills stay readable over any photograph */
.ibmi-lang .lt-tcard-media::before{content:"";position:absolute;left:0;right:0;top:0;height:86px;z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(4,26,44,.60) 0%,rgba(4,26,44,.34) 42%,rgba(4,26,44,.12) 72%,rgba(4,26,44,0) 100%)}
.ibmi-lang .lt-tcard:hover .lt-tcard-media>img{transform:scale(1.06)}
.ibmi-lang .lt-tpill{position:absolute !important;z-index:2;display:inline-flex !important;
  align-items:center !important;justify-content:center !important;gap:5px !important;
  font-family:'Inter',system-ui,sans-serif !important;font-size:12px !important;font-weight:700 !important;
  line-height:1 !important;letter-spacing:normal !important;text-transform:none !important;text-shadow:none !important;
  text-decoration:none !important;height:26px !important;min-height:0 !important;max-height:none !important;
  width:auto !important;min-width:0 !important;padding:0 12px !important;margin:0 !important;
  border:1px solid transparent !important;border-radius:999px !important;white-space:nowrap !important;
  box-sizing:border-box !important;-webkit-appearance:none;appearance:none;float:none !important;transform:none}
.ibmi-lang .lt-tpill-lang{top:12px !important;left:12px !important;right:auto !important;bottom:auto !important;
  color:#0D0F11;border-color:rgba(255,255,255,.75);
  background:linear-gradient(150deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.90) 45%,rgba(255,255,255,.96) 100%);
  -webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  box-shadow:inset 0 1px 1px rgba(255,255,255,1),0 1px 2px rgba(3,26,44,.30),0 4px 12px -3px rgba(3,26,44,.34)}
.ibmi-lang .lt-pflag{flex:none;position:static !important;width:16px !important;height:12px !important;
  max-width:16px !important;inset:auto !important;object-fit:fill;border-radius:2px;display:block;
  box-shadow:0 0 0 1px rgba(9,78,128,.18)}
.ibmi-lang .lt-tpill-off{top:12px !important;right:12px !important;left:auto !important;bottom:auto !important;
  color:color-mix(in srgb,var(--a) 62%,#0D0F11);
  border-color:rgba(255,255,255,.75);
  background:color-mix(in srgb,var(--a) 26%,#fff);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.9),0 1px 2px rgba(3,26,44,.30),0 4px 12px -3px rgba(3,26,44,.34)}
.ibmi-lang .lt-tcard-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:9px;flex:1}
.ibmi-lang .lt-tcard-title{display:flex;align-items:center;gap:7px;font-size:16.5px !important;font-weight:700 !important;
  line-height:1.25 !important;letter-spacing:-.025em !important;color:var(--ink);margin:0 !important}
.ibmi-lang .lt-tcard-title svg{width:15px;height:15px;flex:none;color:var(--ai);opacity:0;transform:translateX(-4px);
  transition:opacity .18s ease,transform .18s ease}
.ibmi-lang .lt-tcard:hover .lt-tcard-title svg{opacity:1;transform:none}
.ibmi-lang .lt-tmeta{display:flex;align-items:center;gap:7px;font-size:13px !important;line-height:1.4 !important;color:var(--ink-soft)}
.ibmi-lang .lt-tmeta svg{width:14px;height:14px;flex:none;color:var(--ai)}
.ibmi-lang .lt-tmeta .lt-m-short{display:none}
.ibmi-lang .lt-tcard-foot{display:flex;align-items:baseline;gap:9px;margin-top:auto !important;padding-top:14px;
  border-top:1px solid var(--line-soft)}
.ibmi-lang .lt-p-orig{font-size:13px !important;color:var(--red-strike);text-decoration:line-through}
.ibmi-lang .lt-p-sale{font-size:20px !important;font-weight:800 !important;letter-spacing:-.02em !important;color:var(--ink)}
.ibmi-lang .lt-p-note{margin-left:auto !important;font-size:13px !important;font-weight:500 !important;color:var(--ink-soft)}
.ibmi-lang .lt-tcard.lt-is-hidden{display:none}

/* ---------------- WHY ---------------- */
.ibmi-lang .lt-s-why{background:linear-gradient(180deg,#F6FBFE 0%,#EAF4FB 100%)}
.ibmi-lang .lt-whygrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px !important}
.ibmi-lang .lt-why{--a:var(--brand);--ai:var(--brand-deep);display:flex;flex-direction:column;gap:11px;padding:24px;border-radius:18px;
  background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-card);transition:transform .18s ease,box-shadow .18s ease}
.ibmi-lang .lt-why:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.ibmi-lang .lt-why-icn{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  color:var(--ai);border:1px solid color-mix(in srgb,var(--a) 38%,#fff);
  background:linear-gradient(165deg,color-mix(in srgb,var(--a) 10%,#fff) 0%,color-mix(in srgb,var(--a) 20%,#fff) 55%,color-mix(in srgb,var(--a) 32%,#fff) 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.95),0 6px 14px -7px color-mix(in srgb,var(--a) 50%,transparent);
  transition:background .22s ease,color .22s ease,transform .22s ease}
.ibmi-lang .lt-why:hover .lt-why-icn{background:var(--ai);color:#fff;transform:scale(1.06)}
.ibmi-lang .lt-why-icn svg{width:21px;height:21px}
.ibmi-lang .lt-why h3{font-size:16.5px !important;font-weight:700 !important;line-height:1.25 !important;margin:2px 0 0 !important}
.ibmi-lang .lt-why p{font-size:13.5px !important;line-height:1.55 !important;color:var(--ink-soft);margin:0 !important}

/* ---------------- HOW ---------------- */
.ibmi-lang .lt-s-how{background:linear-gradient(180deg,#FBFDFF 0%,#EDF5FB 100%)}
.ibmi-lang .lt-flow{position:relative;display:flex;flex-direction:column;gap:34px;max-width:700px;margin:44px auto 0 !important}
.ibmi-lang .lt-flow-track{position:absolute;left:31px;top:32px;width:2px;height:0;background:var(--line);border-radius:2px;z-index:0}
.ibmi-lang .lt-flow-fill{position:absolute;left:30px;top:32px;width:4px;border-radius:3px;z-index:0;height:0;
  background:linear-gradient(180deg,var(--brand),#25B6DE);box-shadow:0 0 10px rgba(0,136,204,.5);
  transition:height .35s ease}
.ibmi-lang .lt-step{position:relative;z-index:1}
.ibmi-lang .lt-step-head{display:flex;align-items:center;gap:18px}
.ibmi-lang .lt-badge{width:64px;height:64px;border-radius:19px;flex:none;position:relative;
  display:flex;align-items:center;justify-content:center;font-size:25px !important;font-weight:800 !important;letter-spacing:-.02em !important;
  color:#7E97A8;background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-pill);
  transition:background .45s ease,color .45s ease,box-shadow .45s ease,transform .45s ease}
.ibmi-lang .lt-step.lt-lit .lt-badge{color:#fff;transform:scale(1.05);text-shadow:0 1px 2px rgba(3,40,66,.28);
  background:linear-gradient(150deg,rgba(72,200,236,.92) 0%,rgba(8,148,213,.84) 48%,rgba(0,116,176,.92) 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.70),inset 0 -1px 2px rgba(2,40,64,.25),0 14px 30px -10px rgba(0,136,204,.55)}
.ibmi-lang .lt-step-title{display:flex;align-items:center;gap:10px;min-width:0}
.ibmi-lang .lt-step-title svg{width:21px;height:21px;flex:none;color:#B9C6CF;transition:color .45s ease}
.ibmi-lang .lt-step.lt-lit .lt-step-title svg{color:var(--brand)}
.ibmi-lang .lt-step-title h3{font-size:22px !important;font-weight:800 !important;line-height:1.15 !important;letter-spacing:-.022em !important;margin:0 !important}
.ibmi-lang .lt-step-body{margin:-4px 0 0 113px !important;font-size:14.5px !important;line-height:1.6 !important;color:var(--ink-soft)}

/* ---------------- CEFR LADDER ---------------- */
.ibmi-lang .lt-s-cefr{background:linear-gradient(180deg,#F1F8FC 0%,#E4F1FA 100%)}
.ibmi-lang .lt-cefr-lead{display:grid;grid-template-columns:.85fr 1.15fr;gap:38px;align-items:start;margin-top:20px !important}
.ibmi-lang .lt-cefr-lead p{font-size:14.5px !important;line-height:1.65 !important;color:var(--ink-soft);margin:0 0 14px !important}
.ibmi-lang .lt-cefr-lead p:last-child{margin-bottom:0 !important}
.ibmi-lang .lt-ladder{display:flex;flex-direction:column;gap:8px}
.ibmi-lang .lt-rung{border-radius:14px;overflow:hidden;background:var(--glass);
  -webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-pill);transition:box-shadow .18s ease,transform .18s ease}
.ibmi-lang .lt-rung:hover{transform:translateY(-1px)}
.ibmi-lang .lt-rung-q{display:flex !important;align-items:center !important;gap:14px !important;width:100% !important;text-align:left !important;padding:13px 16px !important;margin:0 !important;border-radius:0 !important;line-height:1.35 !important;height:auto !important;
  background:transparent !important;border:0 !important;cursor:pointer;font-size:14px !important;font-weight:400 !important;color:var(--ink) !important;
  -webkit-appearance:none;appearance:none;text-transform:none !important;letter-spacing:normal !important;min-height:0}
.ibmi-lang .lt-rung-code{flex:none;width:44px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-size:14px !important;font-weight:800 !important;letter-spacing:-.01em !important;color:#fff;
  background:linear-gradient(150deg,color-mix(in srgb,var(--a) 72%,#fff) 0%,var(--a) 60%,color-mix(in srgb,var(--a) 86%,#000) 100%);
  box-shadow:0 4px 12px -5px color-mix(in srgb,var(--a) 70%,transparent)}
/* fixed width — variable-length names ("Waystage" vs "Threshold / Independent
   user") were starting every bar at a different x and made the ladder ragged */
.ibmi-lang .lt-rung-name{flex:none;width:118px;font-size:13.5px !important;font-weight:600 !important;color:var(--ink);white-space:nowrap}
.ibmi-lang .lt-rung-name small{display:block;font-size:11.5px !important;font-weight:500 !important;color:var(--ink-faint);letter-spacing:.02em !important}
.ibmi-lang .lt-rung-bar{flex:1;min-width:24px;height:6px;border-radius:999px;background:rgba(9,78,128,.09);overflow:hidden}
.ibmi-lang .lt-rung-bar i{display:block;height:100%;width:var(--w);border-radius:999px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--a) 55%,#fff),var(--a));
  transform-origin:left;animation:rungGrow .8s cubic-bezier(.22,.75,.35,1) backwards;animation-delay:calc(var(--i)*70ms)}
@keyframes rungGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ibmi-lang .lt-rung-chev{width:15px;height:15px;flex:none;color:var(--ink-faint);transition:transform .2s ease}
.ibmi-lang .lt-rung-q[aria-expanded="true"] .lt-rung-chev{transform:rotate(180deg);color:var(--brand)}
.ibmi-lang .lt-exp{overflow:hidden;max-height:0;transition:max-height .3s ease}
.ibmi-lang .lt-rung-a{margin:0 !important;padding:0 18px 15px 74px;font-size:13.5px !important;line-height:1.6 !important;color:var(--ink-soft)}

/* ---------------- STANDARDS ---------------- */
.ibmi-lang .lt-s-std{background:linear-gradient(180deg,#FBFDFF 0%,var(--paper) 100%)}
.ibmi-lang .lt-stdgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px !important}
.ibmi-lang .lt-std{position:relative;overflow:hidden;isolation:isolate;padding:26px;border-radius:18px;background:var(--glass);
  -webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-card)}
.ibmi-lang .lt-std p.lt-std-n{font-size:12px !important;font-weight:700 !important;letter-spacing:.16em !important;text-transform:uppercase !important;color:var(--brand);margin:0 0 10px !important}
.ibmi-lang .lt-std .lt-std-bg{position:absolute;top:-20px;right:-20px;width:132px;height:132px;z-index:0;pointer-events:none;
  color:var(--brand);opacity:.10;transition:opacity .22s ease,transform .22s ease}
.ibmi-lang .lt-std:hover .lt-std-bg{opacity:.15;transform:scale(1.06) rotate(-4deg)}
.ibmi-lang .lt-std p,.ibmi-lang .lt-std h3{position:relative;z-index:1}
.ibmi-lang .lt-std h3{font-size:17px !important;font-weight:700 !important;line-height:1.3 !important;margin:0 0 9px !important}
.ibmi-lang .lt-std p{font-size:13.5px !important;line-height:1.6 !important;color:var(--ink-soft);margin:0 !important}

/* ---------------- FAQ ---------------- */
.ibmi-lang .lt-s-faq{background:linear-gradient(180deg,#F6FBFE 0%,#EAF4FB 100%)}
.ibmi-lang .lt-faqs{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px;margin-top:38px !important;align-items:start}
.ibmi-lang .lt-faq{border-radius:14px;overflow:hidden;background:var(--glass);
  -webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-pill)}
.ibmi-lang .lt-faq-q{display:flex !important;align-items:center !important;justify-content:space-between !important;gap:14px !important;width:100% !important;text-align:left !important;border-radius:0 !important;height:auto !important;
  padding:16px 18px !important;margin:0 !important;background:transparent !important;border:0 !important;cursor:pointer;min-height:0 !important;line-height:1.4 !important;
  font-size:14.5px !important;font-weight:600 !important;line-height:1.4 !important;color:var(--ink) !important;
  -webkit-appearance:none;appearance:none;text-transform:none !important;letter-spacing:normal !important}
.ibmi-lang .lt-faq-chev{width:16px;height:16px;flex:none;color:var(--ink-faint);transition:transform .2s ease}
.ibmi-lang .lt-faq-q[aria-expanded="true"] .lt-faq-chev{transform:rotate(180deg);color:var(--brand)}
.ibmi-lang .lt-faq-a{margin:0 !important;padding:0 18px 17px;font-size:13.5px !important;line-height:1.6 !important;color:var(--ink-soft)}
.ibmi-lang .lt-faq-a a{color:var(--brand-deep);font-weight:600 !important;border-bottom:1px solid var(--brand-soft)}


/* ---------------- REVIEWS (mechanism ported 1:1 from the program page) ---------------- */
.ibmi-lang .lt-s-rev{background:radial-gradient(72% 130px at 50% 0%,#fff 0%,rgba(255,255,255,0) 100%),
  linear-gradient(180deg,#FBFDFF 0%,#E7F2FA 60%,var(--paper) 100%)}
/* --- review wall: single row, INFINITE pointer-drag ---
   Row is cloned once for a seamless loop; drag moves a transform that wraps into
   one copy's width, so it loops forever. Loop length is re-measured once the row
   actually lays out (see the ResizeObserver in JS). */
.ibmi-lang .lt-twwall{position:relative;overflow:hidden;margin:22px -16px 0 !important;cursor:grab;touch-action:pan-y}
.ibmi-lang .lt-twwall.lt-dragging{cursor:grabbing}
@media (min-width:720px){.ibmi-lang .lt-twwall{margin-left:0 !important;margin-right:0 !important}}
.ibmi-lang .lt-twwall::before,.ibmi-lang .lt-twwall::after{content:"";position:absolute;top:0;bottom:0;width:52px;z-index:3;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 14%,#000 82%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 14%,#000 82%,transparent 100%)}
.ibmi-lang .lt-twwall::before{left:0;background:linear-gradient(90deg,var(--paper) 8%,rgba(237,245,250,0) 100%)}
.ibmi-lang .lt-twwall::after{right:0;background:linear-gradient(270deg,var(--paper) 8%,rgba(237,245,250,0) 100%)}
.ibmi-lang .lt-twrow{display:flex;gap:14px;width:max-content;padding:10px 16px 40px;touch-action:pan-y;user-select:none;-webkit-user-select:none}
@media (min-width:720px){.ibmi-lang .lt-twrow{padding:10px 2px 40px}}
.ibmi-lang .lt-twwall.lt-dragging .lt-twc{pointer-events:none}
.ibmi-lang .lt-twrow img{-webkit-user-drag:none}
.ibmi-lang .lt-twc{flex:0 0 clamp(250px,76vw,326px);padding:18px;display:flex;flex-direction:column;gap:12px;
  border-radius:18px;background:var(--glass);
  -webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  border:var(--glass-border);box-shadow:var(--shadow-card)}
.ibmi-lang .lt-twc .lt-tq{margin:0 !important;font-size:14px !important;line-height:1.55 !important;color:var(--ink-mid)}
.ibmi-lang .lt-twc .lt-twho{display:flex;align-items:center;gap:10px;margin-top:auto !important}
.ibmi-lang .lt-twc .lt-tav{flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;
  font-size:13px !important;font-weight:700 !important;color:#fff;background:var(--av,#4A90C7)}
.ibmi-lang .lt-twc .lt-tid{display:flex;flex-direction:column;min-width:0;font-size:12.5px !important}
.ibmi-lang .lt-twc .lt-tid b{font-size:13px !important}
.ibmi-lang .lt-twc .lt-tloc{display:flex;align-items:center;gap:5px;color:var(--ink-soft)}
.ibmi-lang .lt-twc .lt-tloc img{width:16px;height:12px;border-radius:2px}
.ibmi-lang .lt-twc .lt-tstars{margin-left:auto !important;color:var(--gold);font-size:12px !important;letter-spacing:1px !important;white-space:nowrap}
/* drag hint */
.ibmi-lang .lt-tw-hint{text-align:center;margin:0 !important;font-size:13.5px !important;letter-spacing:.03em !important;color:var(--ink-soft);
  display:flex;align-items:center;justify-content:center;gap:8px}
.ibmi-lang .lt-tw-hint b{font-weight:700 !important;color:var(--ink-mid)}
.ibmi-lang .lt-tw-hint .lt-dg{display:inline-flex;position:relative;top:-1px;color:var(--brand-deep);animation:lgDragsway 2.8s ease-in-out infinite}
.ibmi-lang .lt-tw-hint .lt-dg svg{display:block;width:27px;height:15px}
.ibmi-lang .lt-tw-hint .lt-hint-swipe{display:none}
@media (max-width:719px){.ibmi-lang .lt-tw-hint .lt-hint-drag{display:none}.ibmi-lang .lt-tw-hint .lt-hint-swipe{display:inline}}
@keyframes lgDragsway{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.ibmi-lang .lt-tw-hint .lt-dg{animation:none}}

/* ---------------- CTA ---------------- */
.ibmi-lang .lt-cta{position:relative;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw) !important;
  padding:74px 0;display:flex;align-items:center;
  background:radial-gradient(70% 90% at 6% -6%,rgba(37,182,222,.30) 0%,rgba(37,182,222,0) 58%),
             linear-gradient(112deg,#04365A 0%,#075E93 58%,var(--brand) 100%)}
.ibmi-lang .lt-cta .lt-lw{position:relative;z-index:2}
.ibmi-lang .lt-cta-glass{max-width:720px;margin:0 auto !important;text-align:center;padding:40px 44px;border-radius:22px;position:relative;
  background:linear-gradient(135deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.05) 38%,rgba(255,255,255,.03) 62%,rgba(255,255,255,.10) 100%),
             linear-gradient(0deg,rgba(5,27,46,.66),rgba(5,27,46,.66));
  -webkit-backdrop-filter:blur(22px) saturate(1.5) brightness(.78);backdrop-filter:blur(22px) saturate(1.5) brightness(.78);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.30),inset 0 -1px 1px rgba(255,255,255,.10),0 30px 60px -26px rgba(2,18,36,.6)}
.ibmi-lang .lt-cta-glass::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:linear-gradient(125deg,rgba(255,255,255,.65) 0%,rgba(255,255,255,.10) 28%,rgba(255,255,255,.03) 52%,rgba(255,255,255,.12) 74%,rgba(255,255,255,.42) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
.ibmi-lang .lt-cta-glass h2{color:#fff;font-size:clamp(25px,3.2vw,34px) !important;font-weight:800 !important}
.ibmi-lang .lt-cta-glass p{color:rgba(255,255,255,.94);font-size:16px !important;line-height:1.6 !important;margin:16px auto 28px !important;max-width:48ch}
.ibmi-lang .lt-cta-cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.ibmi-lang .lt-arrow-u{transition:transform .18s ease}
.ibmi-lang .lt-ibtn:hover .lt-arrow-u{transform:translateY(-3px)}


/* ---------------- RESPONSIVE ---------------- */
@media (max-width:980px){
  .ibmi-lang .lt-grid{grid-template-columns:repeat(2,1fr)}
  .ibmi-lang .lt-whygrid{grid-template-columns:repeat(2,1fr)}
  .ibmi-lang .lt-stdgrid{grid-template-columns:1fr}
  .ibmi-lang .lt-cefr-lead{grid-template-columns:1fr;gap:30px}
  .ibmi-lang .lt-faqs{grid-template-columns:1fr}
}
@media (max-width:720px){
  .ibmi-lang .lt-sec{padding:52px 0}
  .ibmi-lang .lt-hero{min-height:0;padding:76px 0 118px}
  .ibmi-lang .lt-tile-copy{max-width:none;width:100%;padding:26px 22px;border-radius:18px}
  .ibmi-lang .lt-hero h1{font-size:clamp(27px,7.4vw,34px) !important;max-width:none;margin-top:14px !important}
  .ibmi-lang .lt-hero h1 .lt-nw{white-space:normal}
  .ibmi-lang .lt-hero .lt-sub{font-size:15.5px !important;margin-top:14px !important;max-width:none}
  .ibmi-lang .lt-hero-cta{margin-top:24px !important;width:100%}
  .ibmi-lang .lt-lw{padding:0 16px}
  .ibmi-lang .lt-langbar{gap:8px;margin:28px 0 22px !important;padding-top:24px}
  .ibmi-lang .lt-ltab{font-size:13px !important;padding:10px 13px !important}
  .ibmi-lang .lt-grid{gap:14px}
  .ibmi-lang .lt-tcard-body{padding:13px 14px 15px;gap:7px}
  .ibmi-lang .lt-tcard-title{font-size:14.5px !important;line-height:1.3 !important}
  .ibmi-lang .lt-tcard-title svg{display:none}
  .ibmi-lang .lt-tmeta{font-size:12px !important;gap:6px}
  .ibmi-lang .lt-tcard-foot{padding-top:11px;gap:7px}
  .ibmi-lang .lt-p-sale{font-size:17px !important}
  .ibmi-lang .lt-p-note{display:none}
  .ibmi-lang .lt-whygrid{grid-template-columns:1fr;gap:14px;margin-top:32px !important}
  .ibmi-lang .lt-why{padding:20px}
  .ibmi-lang .lt-flow{gap:28px}
  .ibmi-lang .lt-flow-track,.ibmi-lang .lt-flow-fill{left:23px;top:24px}
  .ibmi-lang .lt-flow-fill{left:22px}
  .ibmi-lang .lt-badge{width:48px;height:48px;border-radius:15px;font-size:20px !important}
  .ibmi-lang .lt-step-head{gap:14px}
  .ibmi-lang .lt-step-title h3{font-size:19px !important}
  .ibmi-lang .lt-step-body{margin:10px 0 0 62px !important}
  .ibmi-lang .lt-rung-q{gap:11px !important;padding:12px 14px !important}
  .ibmi-lang .lt-rung-code{width:40px;height:32px;font-size:13px !important}
  .ibmi-lang .lt-rung-name{width:96px;white-space:normal;font-size:13px !important;line-height:1.25 !important}
  .ibmi-lang .lt-rung-name small{font-size:11px !important}
  .ibmi-lang .lt-rung-bar{min-width:14px;max-width:74px}
  .ibmi-lang .lt-rung-a{padding:0 14px 14px 65px}
  .ibmi-lang .lt-s-cefr .lt-sec-sub{font-size:14.5px !important;text-align:left;margin-top:12px !important}
  .ibmi-lang .lt-tmeta .lt-m-full{display:none}
  .ibmi-lang .lt-tmeta .lt-m-short{display:inline}
    .ibmi-lang .lt-tw-hint{font-size:13px !important}
  .ibmi-lang .lt-std{padding:22px}
  .ibmi-lang .lt-cta{padding:56px 0}
  .ibmi-lang .lt-cta-glass{padding:28px 22px}
  .ibmi-lang .lt-hero-cta .lt-ibtn,.ibmi-lang .lt-cta-cta .lt-ibtn{flex:1 1 100%;justify-content:center}
}
@media (max-width:400px){
  .ibmi-lang .lt-tpill{font-size:10px !important;height:22px;padding:2px 9px 0;gap:3px;top:8px}
  .ibmi-lang .lt-tpill-lang{left:8px}
  .ibmi-lang .lt-tpill-off{right:8px}
  .ibmi-lang .lt-tcard-body{padding:12px 12px 14px}
}
@media (prefers-reduced-motion:reduce){
  .ibmi-lang *,.ibmi-lang *::before,.ibmi-lang *::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
}
/* ============ TABLET & MOBILE ============
   Follows the homepage playbook: on phones the photograph IS the hero — the
   glass tile comes off and the copy sits centred on the picture. Tablets keep
   the tile but narrower. */

/* --- tablet: same composition, narrower card --- */
@media (max-width:1080px) and (min-width:721px){
  .ibmi-lang .lt-tile-copy{max-width:552px;padding:34px 32px}
  .ibmi-lang .lt-cta-glass{max-width:600px;padding:36px 34px}
}

/* --- phones: no glass anywhere on the bands --- */
@media (max-width:720px){
  .ibmi-lang .lt-tile-copy,.ibmi-lang .lt-cta-glass{
    max-width:480px;width:100%;margin:0 auto !important;padding:0 !important;border-radius:0;
    background:none !important;border:0 !important;box-shadow:none !important;
    -webkit-backdrop-filter:none !important;backdrop-filter:none !important}
  .ibmi-lang .lt-tile-copy::before,.ibmi-lang .lt-tile-copy::after,
  .ibmi-lang .lt-cta-glass::before,.ibmi-lang .lt-cta-glass::after{display:none !important}
  .ibmi-lang .lt-tile-body{align-items:center;text-align:center}
  .ibmi-lang .lt-hero-cta{justify-content:center;width:100%}
  .ibmi-lang .lt-hero .lt-sub{margin-left:auto !important;margin-right:auto !important}
  /* the tile carried the local tint that made white text legible; with it gone
     the band scrim has to do that job instead */
  .ibmi-lang .lt-band-city::after{
    background:linear-gradient(180deg,rgba(3,22,40,.56) 0%,rgba(3,22,40,.70) 46%,rgba(2,16,32,.78) 100%)}
}

/* --- "What you get" cards: icon, headline and copy centred on phones --- */
@media (max-width:720px){
  .ibmi-lang .lt-why{align-items:center;text-align:center}
  .ibmi-lang .lt-why-icn{margin-left:auto !important;margin-right:auto !important}
}

/* --- the specimen panel reads centred on phones --- */
@media (max-width:900px){
  .ibmi-lang .lt-spec-copy{text-align:center}
  .ibmi-lang .lt-spec-lead{margin-left:auto !important;margin-right:auto !important}
  /* the rows stay left-aligned as a block, but the block is centred — centring
     the rows individually leaves the icons in a ragged column */
  .ibmi-lang .lt-spec-list{max-width:400px;margin-left:auto !important;margin-right:auto !important;text-align:left}
  .ibmi-lang .lt-vd{max-width:400px;margin-left:auto !important;margin-right:auto !important}
}

/* --- touch/low-power: lighten the blur kernel and stop decorative motion --- */
@media (pointer:coarse),(max-width:820px){
  .ibmi-lang .lt-tpill,.ibmi-lang .lt-ltab,.ibmi-lang .lt-why,.ibmi-lang .lt-std,
  .ibmi-lang .lt-twc,.ibmi-lang .lt-faq,.ibmi-lang .lt-rung,.ibmi-lang .lt-spec,
  .ibmi-lang .lt-tcard,.ibmi-lang .lt-ibtn,.ibmi-lang .lt-vd-field,
  .ibmi-lang .lt-sec-head .lt-eyebrow{
    -webkit-backdrop-filter:blur(6px) !important;backdrop-filter:blur(6px) !important}
  .ibmi-lang .lt-amb i,.ibmi-lang .lt-amb-aurora::before,.ibmi-lang .lt-amb-aurora::after,
  .ibmi-lang .lt-band-city img,.ibmi-lang .lt-tile-copy::after,.ibmi-lang .lt-cta-glass::after{
    animation:none !important}
}
/* comfortable touch targets wherever there is no mouse */
@media (pointer:coarse){
  .ibmi-lang .lt-ltab{padding:12px 14px !important;min-height:44px !important}
  .ibmi-lang .lt-vbtn{padding:15px 16px !important;min-width:104px !important}
  .ibmi-lang .lt-faq-q{padding:18px 18px !important}
  .ibmi-lang .lt-rung-q{padding:15px 16px !important}
}
/* Phones: drop the blur on repeated cards altogether. Each one is a separate
   composited layer and a page with 8 test cards plus 18 review cards has crashed
   iOS Safari tabs before (same call the courselist fragment makes). They sit on
   a flat background here, so the loss is invisible. */
/* five chips in two rows rather than three: trimmed horizontal padding, type and
   flag, with min-height holding the 44px touch target */
@media (max-width:720px){
  .ibmi-lang .lt-langbar{gap:7px;padding-top:26px}
  .ibmi-lang .lt-ltab{padding:10px 11px !important;min-height:44px !important;
    font-size:12.5px !important;gap:6px !important}
  .ibmi-lang .lt-ltab .lt-tflag{width:17px;height:13px}
  .ibmi-lang .lt-ltab .lt-tflag-i{width:14px;height:14px}
}
@media (max-width:720px){
  .ibmi-lang .lt-tcard,.ibmi-lang .lt-twc,.ibmi-lang .lt-why,.ibmi-lang .lt-std,
  .ibmi-lang .lt-faq,.ibmi-lang .lt-rung,.ibmi-lang .lt-tpill{
    -webkit-backdrop-filter:none !important;backdrop-filter:none !important}
}
/* very narrow phones: the certificate ID and the button cannot share a row
   without truncating the ID, so the button drops to its own full-width line */
/* the long form wraps awkwardly in a 400px column — shorten the link text */
@media (max-width:720px){
  .ibmi-lang .lt-vnote-lg{display:none}
  .ibmi-lang .lt-vnote-sm{display:inline}
}
@media (hover:none){
  .ibmi-lang .lt-tcard:hover,.ibmi-lang .lt-why:hover,.ibmi-lang .lt-twc:hover,
  .ibmi-lang .lt-ibtn:hover,.ibmi-lang .lt-std:hover{transform:none !important}
  .ibmi-lang .lt-tcard:hover .lt-tcard-media>img{transform:none !important}
}


/* ============ PHONE HERO ============
   Reworked to the homepage's mobile pattern: no eyebrow, one lit phrase in the
   headline, a solid blue primary action, and the photograph panned right so the
   people are in frame rather than the gate sign. Phones only. */
@media (max-width:720px){
  .ibmi-lang .lt-hero .lt-eyebrow{display:none}
  .ibmi-lang .lt-sub-lg{display:none}
  .ibmi-lang .lt-sub-sm{display:inline}
  .ibmi-lang .lt-hero h1{font-size:clamp(30px,8.6vw,38px) !important;font-weight:800 !important;
    line-height:1.1 !important;letter-spacing:-.025em !important;max-width:none;
    text-shadow:0 2px 14px rgba(0,0,0,.5),0 10px 34px rgba(2,14,28,.55)}
  /* the lit phrase — gradient text, so the shadow has to move to a filter */
  .ibmi-lang .lt-hero h1 .lt-nw{white-space:normal;display:inline;
    background:linear-gradient(100deg,#EAFBFF 0%,#9FE3F5 55%,#48C8EC 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;
    filter:drop-shadow(0 2px 12px rgba(0,0,0,.42)) drop-shadow(0 8px 26px rgba(2,14,28,.5))}
  .ibmi-lang .lt-hero .lt-sub{font-size:15.5px !important;line-height:1.55 !important;max-width:34ch}
  /* both actions on one row */
  .ibmi-lang .lt-hero-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;
    margin-top:22px !important}
  .ibmi-lang .lt-hero-cta .lt-ibtn{justify-content:center;white-space:nowrap;
    padding:15px 6px !important;font-size:13.5px !important;gap:5px;min-height:48px;border-radius:12px}
  .ibmi-lang .lt-hero-cta .lt-ibtn-light{color:#fff !important;font-weight:800 !important;
    background:linear-gradient(150deg,rgba(72,200,236,.92) 0%,rgba(8,148,213,.84) 48%,rgba(0,116,176,.92) 100%) !important;
    -webkit-backdrop-filter:blur(12px) saturate(1.6);backdrop-filter:blur(12px) saturate(1.6);
    border:1px solid rgba(255,255,255,.30) !important;
    box-shadow:inset 0 1px 1px rgba(255,255,255,.55),inset 0 -2px 6px -2px rgba(2,40,70,.35),
               0 2px 4px rgba(2,40,70,.30),0 12px 26px -12px rgba(0,136,204,.62)}
  .ibmi-lang .lt-hero-cta .lt-ibtn-light .lt-arrow-d{color:#fff}
  .ibmi-lang .lt-hero-cta .lt-ibtn-light:active{transform:translateY(1px)}
  /* pan the photograph right — the gate sign dominates the default crop on a
     narrow viewport, the people sit further into the frame */
  .ibmi-lang .lt-hero .lt-band-city img{object-position:74% 42% !important}
}
@media (max-width:360px){
  .ibmi-lang .lt-hero-cta .lt-ibtn{font-size:12.5px !important;padding:14px 4px !important}
}

/* ---- phones: compact demo verification ---- */
@media (max-width:720px){
  .ibmi-lang .lt-vd{margin-top:18px !important;padding-top:19px}
  .ibmi-lang .lt-vd-demo{height:24px;font-size:10.5px !important;padding:0 12px}
  .ibmi-lang .lt-vd-field{padding:5px 5px 5px 11px !important;gap:8px;flex-wrap:nowrap}
  .ibmi-lang .lt-vd-field>svg{width:15px;height:15px}
  .ibmi-lang .lt-vf-id{font-size:12px !important;letter-spacing:0 !important;flex:1 1 auto;min-width:0}
  .ibmi-lang .lt-vbtn{flex:none;min-width:86px !important;padding:12px 10px !important;font-size:12.5px !important}
  .ibmi-lang .lt-vnote{font-size:11.5px !important;margin-top:9px !important}
  .ibmi-lang .lt-vres{gap:3px}
  .ibmi-lang .lt-vd.lt-ok .lt-vres{margin-top:14px !important}
}
/* below 360 the chips cannot fit three per row with their flags, so the flag goes
   and the label stays — the bar holds at two rows down to 320 */
@media (max-width:359px){
  .ibmi-lang .lt-ltab .lt-tflag,.ibmi-lang .lt-ltab .lt-tflag-i,.ibmi-lang .lt-ltab .lt-dot{display:none !important}
  .ibmi-lang .lt-ltab{padding:10px 12px !important;gap:0 !important;font-size:12px !important}
  .ibmi-lang .lt-vf-id{font-size:11px !important}
  .ibmi-lang .lt-vbtn{min-width:74px !important;padding:12px 8px !important;font-size:12px !important}
}

/* ---- reviews: rating lives in the title; transparency note under the wall ---- */
.ibmi-lang .lt-rev-title .lt-rt-num{
  background:linear-gradient(100deg,#12A0DE 0%,#2472D8 52%,#4A54C8 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent}
.ibmi-lang .lt-rev-sub{margin-top:12px !important}
/* min() is load-bearing: a bare 66ch resolves wider than a phone viewport, and
   margin:auto then splits the excess either side instead of wrapping — that is
   a horizontal page overflow, not a wrap. */
.ibmi-lang .lt-tw-note{max-width:min(66ch,100%);margin:16px auto 0 !important;text-align:center;
  font-size:12.5px !important;font-weight:400 !important;line-height:1.5 !important;color:var(--ink-faint)}
.ibmi-lang .lt-tw-note a{color:var(--brand-deep);text-decoration:underline}
.ibmi-lang .lt-tw-note .lt-note-br{display:none}
@media (min-width:768px){.ibmi-lang .lt-tw-note .lt-note-br{display:inline}}