/* Approved Skroll identity: geometric S + lavender scroll detail in the first l. */
.skroll-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#f5f5f7}
.skroll-brand .skroll-brand-word{font-family:Inter,Arial,sans-serif;font-size:30px;font-weight:500;line-height:1;letter-spacing:-.02em;text-transform:none}
.skroll-brand-word .skroll-brand-accent{position:relative;display:inline-block;color:#b6a0ff}
.skroll-brand-accent::after{content:"";position:absolute;left:50%;top:calc(100% - .13em);width:.26em;height:.17em;transform:translateX(-50%);background:currentColor;clip-path:polygon(0 0,100% 0,50% 100%);pointer-events:none}
/* The arrowhead hangs from the box bottom, but the l ends on the baseline, which sits .13–.18em above that bottom
   depending on the font (Inter here, Arial on phones without Inter). The gap showed as a dark hairline, e.g. at 175%
   zoom. A second „l", .08em lower, lengthens the stem with its exact width in any font, down into the arrowhead; it
   is hidden everywhere else behind the real letter. Screen readers skip it (09.10.2026). */
.skroll-brand-accent::before{content:"l";content:"l"/"";position:absolute;left:0;top:.08em;pointer-events:none}
.nav-logo-pill.skroll-brand{min-height:40px;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.nav-logo-pill.skroll-brand>.skroll-brand-word{color:var(--nav-ink,#f5f5f7)}
.footer-logo.skroll-brand .skroll-brand-word{font-size:28px;font-weight:500;letter-spacing:-.02em}
.skroll-brand .skroll-brand-mark{display:flex;align-items:center;justify-content:center;width:22px;height:30px;flex:none;color:#f5f5f7;background:none;border:0;border-radius:0;box-shadow:none}
.skroll-brand-mark svg{display:block;width:100%;height:100%}
.nav-logo-pill.skroll-brand>.skroll-brand-mark{color:var(--nav-ink,#f5f5f7)}
.footer-logo.skroll-brand .skroll-brand-mark{width:21px;height:28px}
