/* QuickCision English wordmark — 2 options: wm--1 = Montserrat ExtraBold Italic + bolt (active), wm--3 = Exo 2 Black Italic (option 2 dropped). Swap by changing the class wm--1 / wm--3
   on the .wm elements in index.html (header brand + hero) and privacy.html (header).
   Fonts: self-hosted subsets (glyphs of "QuickCision" only), SIL OFL 1.1 — see fonts/licenses/. */
@font-face{font-family:'WM Exo 2';src:url(fonts/WM-Exo2-BlackItalic.woff2) format('woff2');font-weight:900;font-style:italic;font-display:swap}
@font-face{font-family:'WM Montserrat';src:url(fonts/WM-Montserrat-ExtraBoldItalic.woff2) format('woff2');font-weight:800;font-style:italic;font-display:swap}

.wm{--wm-cy:#00C8FF;--wm-bl:#1E7BFF;--wm-wh:#F5F7FA;--wm-y:#FFC21A;
  display:inline-flex;align-items:center;direction:ltr;unicode-bidi:isolate;white-space:nowrap;
  font-style:italic;line-height:1;letter-spacing:0;color:var(--wm-wh);text-transform:none;position:relative}
.wm .wm-q{color:var(--wm-cy)}
/* speed lines, echoing the trails on the Q of the 퀵시전 logo */
.wm::before{content:'';flex:none;width:.85em;height:.5em;margin-inline-end:.14em;
  background:
   linear-gradient(90deg,transparent,var(--wm-cy)) right 0 top 0/100% .1em no-repeat,
   linear-gradient(90deg,transparent,var(--wm-cy)) right .06em top .2em/78% .1em no-repeat,
   linear-gradient(90deg,transparent,var(--wm-cy)) right .12em top .4em/56% .1em no-repeat;
  transform:skewX(-14deg);opacity:.95}

/* Option 3 — Exo 2 Black Italic: heavy, techy italic; cyan "Quick", white "Cision" (like cyan 퀵 + white 시전) */
.wm.wm--3{font-family:'WM Exo 2','Gothic A1',sans-serif;font-weight:900;letter-spacing:-.02em}


/* Option 1 — Montserrat ExtraBold Italic: geometric and tight; cyan→blue gradient "Quick" + yellow bolt accent */
.wm.wm--1{font-family:'WM Montserrat','Gothic A1',sans-serif;font-weight:800;letter-spacing:-.045em}
.wm--1 .wm-q{background:linear-gradient(100deg,var(--wm-cy),var(--wm-bl));-webkit-background-clip:text;background-clip:text;color:transparent;padding-inline-end:.04em}
.wm--1 .wm-c::after{content:'';display:inline-block;width:.26em;height:.42em;margin-inline-start:.07em;vertical-align:.32em;
  background:linear-gradient(170deg,#FFE23A,#FFC21A 55%,#FF9F0A);clip-path:polygon(72% 0,10% 58%,45% 58%,28% 100%,90% 40%,55% 40%);} /* sharp zig-zag bolt, same shape as brand_en lockups */

/* placements */
.brand .wm{font-size:calc(16px*var(--wm-scale,1));color:var(--wm-wh)}
.hero .en-name.wm{display:flex;justify-content:center;font-size:calc(clamp(26px,4.4vw,38px)*var(--wm-scale,1));margin-top:6px;color:var(--wm-wh)}
.hero .en-name.wm::before{width:.9em}
@media(max-width:600px){.brand .wm{font-size:calc(14px*var(--wm-scale,1))}}
/* header lockup: wordmark stacked under 퀵시전 */
.brand .brand-t{display:flex;flex-direction:column;align-items:flex-start;direction:ltr;line-height:1.05;gap:3px}
.brand .brand-ko{font-size:21px;font-weight:800;letter-spacing:-.01em}
.brand .brand-t .wm{font-size:12.5px;margin-left:var(--wm-hdr-shift,.06em)}
.brand .brand-t .wm::before{display:none}
@media(max-width:600px){.brand .brand-ko{font-size:19px}.brand .brand-t .wm{font-size:11.5px}}
/* Korean brand text: 퀵 uses the same cyan→blue gradient as "Quick" (option 1); 시전 stays white like "Cision" */
.ko-q{background:linear-gradient(100deg,#00C8FF,#1E7BFF);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
/* clip fix: background-clip:text only paints inside the inline box (font ascent 817/1024), but Gothic A1 ExtraBold hangul rises to 876/1024,
   so the top of 퀵 was cut. Extend the paint box vertically; inline vertical padding does not change line height, size, width or centring. */
.ko-q{padding-block:.15em}
/* clip fix 2 (header): the header lockup uses line-height:1.05, so the line box top sits at 842/1024 em while the ExtraBold hangul reach
   876/1024 em, i.e. the glyph tops stick out of the line box (hero/footer have enough leading). Mobile Chromium/Samsung Internet can clip the
   background-clip:text paint of 퀵 to that line box. Give the header 퀵시전 a taller line box (1.4) and cancel the extra height with equal negative
   margins, so the box height, baseline, position and centring stay exactly as before. (.ko-q keeps its .15em paint padding from fix 1, which already covers the glyph tops.) */
.brand .brand-ko{line-height:1.4;margin-block:-.175em}
.brand .brand-ko{color:#F5F7FA}
footer .ft-brand{color:#F5F7FA;font-weight:700}
/* per-language header/footer logo: ko = Q mark + 퀵시전; all other languages = Q mark + QuickCision (wordmark 1) */
.lk-en{display:none!important}
html[data-lang]:not([data-lang=ko]) .lk-en{display:inline-flex!important}
html[data-lang]:not([data-lang=ko]) .lk-ko{display:none!important}
footer .ft-brand.lk-en{font-family:'WM Montserrat','Gothic A1',sans-serif;font-style:italic;font-weight:800;letter-spacing:-.03em}
.brand img.q-mark{width:40px;height:40px;border-radius:0}
.brand .brand-t{justify-content:center}
.brand .brand-t .wm.lk-en{font-size:20px;margin-left:0}
@media(max-width:600px){.brand img.q-mark{width:36px;height:36px}.brand .brand-t .wm.lk-en{font-size:18px}}
.brand{direction:ltr}
.brand img.q-mark{width:auto;height:30px;border-radius:0}
@media(max-width:600px){.brand img.q-mark{width:auto;height:27px}}

/* hero: confirmed lockup stacked — symbol-only Q mark (sharp bolt, no tile) above; ko = big 퀵시전 (퀵 gradient, 시전 white), others = big QuickCision wordmark 1 (no speed lines, as in lockup B) */
.hero img.hero-icon{width:auto;height:150px;border-radius:0;box-shadow:none;filter:drop-shadow(0 14px 40px rgba(0,200,255,.22))}
.hero h1 .hero-ko{color:#F5F7FA}
.hero h1 .hero-wm{justify-content:center;font-size:clamp(40px,7.4vw,68px);vertical-align:top;line-height:1.15}
.hero h1 .hero-wm::before{display:none}
@media(max-width:600px){.hero img.hero-icon{width:auto;height:112px}}
/* hero optical centering: the Q mark's visible ink (alpha >= 50%; the faded speed-line tips are not seen as edge) is centred
   6.02% of its width right of the PNG box, so shift it back so mark ink centre = title ink centre (ko and all other languages) */
.hero img.hero-icon{transform:translateX(-6.4%)}   /* -6.02% ink offset + 0.38% for the wordmark ink (italic overhang/bolt) */
html[data-lang=ko] .hero img.hero-icon{transform:translateX(-6.65%)}  /* 퀵시전 ink sits slightly left of its box */