/* ============================================================ BPI bilingual layer — Spanish-first, EN toggle Used across the invest.baumannproperty.com.au funnel. Wrap swappable copy in a matched pair: Español…English… For block-level twins (paragraphs that must be block, not inline): add the .blk modifier -> … Default (no body class OR body.lang-es) shows Spanish, hides English. body.lang-en shows English, hides Spanish. The BODY carries the state class lang-es / lang-en; the swappable content spans carry l-es / l-en. These MUST stay different: if the body-state class were also .l-en, the base `.l-en{display:none}` rule would match itself and hide the whole page. NOTE: deliberately uses l-es / l-en, NOT the legacy .es accent class, so the existing inline Spanish-accent spans keep working untouched. ============================================================ */ /* Spanish is the default view */ .l-en{display:none} .l-es{display:inline} .l-es.blk{display:block} body.lang-en .l-es{display:none} body.lang-en .l-en{display:inline} body.lang-en .l-en.blk{display:block} /* swap spans carry no accent styling of their own — inherit the surrounding type exactly (the legacy .es accent italics must never leak onto full copy) */ .l-es,.l-en{font-style:inherit;color:inherit;letter-spacing:inherit} /* inside buttons/pills the white text must stay crisp */ .btn .l-es,.btn .l-en{font-style:normal;color:inherit;letter-spacing:inherit} /* ---- iPhone-style EN/ES switch in the nav ---- OFF (grey, knob left) = ES default · ON (green, knob right) = EN. Reuses the .lang-toggle look already defined in bpi.css; this block only wires the two-button in-page variant used across the funnel. */ .langsw{display:inline-flex;align-items:center;gap:8px;margin-right:12px;flex:none; border:1px solid rgba(255,255,255,.16);border-radius:999px;overflow:hidden; background:rgba(255,255,255,.04);-webkit-tap-highlight-color:transparent} .langsw button{appearance:none;border:0;background:transparent;color:var(--ink-soft,rgba(255,255,255,.72)); font:700 .72rem/1 'Inter',sans-serif;letter-spacing:.08em;padding:.5rem .82rem;min-width:44px; text-align:center;white-space:nowrap;flex:none;cursor:pointer;transition:background .18s,color .18s} .langsw button.on{background:#34C759;color:#04201d} .langsw button:hover:not(.on){color:#fff} /* keep the header right cluster from crushing the switch on small screens */ .topbar .wrap > *:last-child{flex:none} @media(max-width:900px){ .langsw{margin-right:8px} .langsw button{padding:.45rem .66rem;min-width:38px;letter-spacing:.04em} }