/* ==========================================================================
   Katy Technologies — Landing V4 ("Swiss Glow")
   Swiss Ops brutalist type over the V3 Three.js glowing-path valley.
   Standalone stylesheet for index.html. Other pages keep main/components css.
   ========================================================================== */

/* ---- Literata stays local; Work Sans (300/500/700) loads from Google ---- */
@font-face {
  font-family: 'Literata';
  src: url('../assets/fonts/brand-guide/Literata-Regular.ttf') format('truetype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Literata';
  src: url('../assets/fonts/brand-guide/Literata-Medium.ttf') format('truetype');
  font-weight: 500; font-style: normal; font-display: swap;
}

/* ============ RESET / TOKENS ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --paper:#F8F7F2;
  --navy:#071A33;
  --bp-dark:#06192D;
  --bp-black:#020812;
  --blue:#2E7CFF;
  --glow:#7CC4FF;
  --text-2:rgba(248,247,242,.86);
  --text-3:rgba(209,204,204,.72);
  --micro-c:rgba(127,149,170,.85);
  --hair:rgba(248,247,242,.1);
  --hair-glow:rgba(124,196,255,.1);
  --pad:clamp(1rem,3vw,3rem);
  --micro:clamp(.625rem,.55rem + .25vw,.75rem);
  --ease-out:cubic-bezier(.22,1,.36,1);
}
html{-webkit-text-size-adjust:100%;background-color:var(--bp-dark)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
body{
  font-family:"Work Sans",system-ui,sans-serif;
  font-weight:300;
  background:var(--bp-black);
  color:var(--paper);
  line-height:1.5;
  min-width:320px;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--blue);color:var(--paper)}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--glow);outline-offset:3px}
.kt-grain-filter{position:absolute}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:300;
  background:var(--navy);color:var(--paper);
  padding:.75rem 1.25rem;font-weight:500;text-decoration:none;
}
.skip-link:focus-visible{left:0}

/* ============ SHARED TYPE ============ */
.micro{
  font-size:var(--micro);
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.prose{font-family:"Literata",Georgia,serif;font-weight:400;text-wrap:pretty}

/* ============ EXPOSED GRID (blue-tinted over the scene) ============ */
.sec-grid::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    repeating-linear-gradient(90deg,var(--hair-glow) 0,var(--hair-glow) 1px,transparent 1px,transparent calc(100%/12)),
    repeating-linear-gradient(0deg,var(--hair-glow) 0,var(--hair-glow) 1px,transparent 1px,transparent 8rem),
    linear-gradient(90deg,transparent calc(100% - 1px),var(--hair-glow) calc(100% - 1px));
}

/* ============ PRELOADER — Swiss 3-flash ============ */
#preloader{
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:center;justify-content:center;
  background:var(--navy);
}
#preloader img{width:clamp(72px,12vw,128px);height:auto}
#preloader .pl-dark{display:none}
#preloader.s-blue{background:var(--blue)}
#preloader.s-paper{background:var(--paper)}
#preloader.s-paper .pl-light{display:none}
#preloader.s-paper .pl-dark{display:block}
.no-js #preloader{display:none}
@media (prefers-reduced-motion:reduce){#preloader{display:none}}

/* ============ HEADER — soft fade, no bar ============ */
.site-head{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:calc(var(--pad)*.6) var(--pad) calc(var(--pad)*1.4);
  background:linear-gradient(180deg,rgba(2,8,18,.82) 0%,rgba(2,8,18,.4) 55%,rgba(2,8,18,0) 100%);
  pointer-events:none;
}
.site-head a{pointer-events:auto}
.brand{display:flex;align-items:center;gap:.75rem;min-height:44px;text-decoration:none}
.brand img{width:38px;height:38px}
.site-head nav{display:flex;align-items:center;gap:clamp(.9rem,2.5vw,2.25rem)}
.site-head nav a{display:flex;align-items:center;min-height:44px;text-decoration:none;color:var(--text-2)}
.site-head nav a:hover,.site-head nav a[aria-current]{color:var(--glow)}
.site-head nav a.nav-email{
  border:1px solid currentColor;
  padding:.45rem .75rem;
  line-height:1;
}
:where(.btn,.btn-shock,.nav-email,.foot-icon-link){
  transition-property:transform,background-color,color,border-color;
  transition-duration:.18s;
  transition-timing-function:var(--ease-out);
}
:where(.btn,.btn-shock,.nav-email,.foot-icon-link):active{transform:scale(0.96)}
@media (max-width:760px){
  .site-head{align-items:center}
  .brand span{display:none}
}

/* ============ STORY: fixed canvas + transparent sections ============ */
.story{position:relative}
#story-canvas{
  position:fixed;inset:0;width:100%;height:100%;
  z-index:0;opacity:0;pointer-events:none;
}
.js #story-canvas{transition:opacity 1.4s ease}
#story-canvas.is-on{opacity:1}
.story>section,.story>article{position:relative;z-index:3;background:transparent}
.no-webgl .story{
  background:linear-gradient(160deg,#020812 0%,#0A213A 55%,#263D54 100%);
  clip-path:inset(0);
  filter:url('#kt-grain');
}
#main{position:relative}
#main::before{
  content:"";position:absolute;left:0;right:0;top:100svh;bottom:0;
  z-index:2;pointer-events:none;
  background-image:
    radial-gradient(circle at 23% 17%,rgba(248,247,242,.055) 0 1px,transparent 1.35px),
    radial-gradient(circle at 71% 63%,rgba(127,149,170,.06) 0 1px,transparent 1.45px),
    linear-gradient(180deg,
      rgba(2,8,18,.08) 0%,
      rgba(6,25,45,.2) 22%,
      rgba(7,26,51,.4) 48%,
      rgba(10,33,58,.66) 72%,
      rgba(7,26,51,1) 100%);
  background-size:3px 3px,4px 4px,100% 100%;
}


/* ============ HERO — Swiss display over the valley ============ */
.hero{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:calc(var(--pad)*3) var(--pad) var(--pad);
  overflow:hidden;
}
.what-we-do{
  position:relative;z-index:3;
  min-height:42svh;
  display:flex;align-items:center;
  padding:clamp(2.75rem,7vh,5rem) var(--pad);
}
.story-gradient{
  position:fixed;inset:0;z-index:1;
  pointer-events:none;
  background:
    linear-gradient(160deg,rgba(2,8,18,.34) 0%,rgba(10,33,58,.4) 55%,rgba(38,61,84,.36) 100%);
  mix-blend-mode:multiply;
  opacity:0;visibility:hidden;
}
.story-gradient.is-visible{
  opacity:1;visibility:visible;
}
.hero-static-canvas{
  position:fixed;inset:0;z-index:2;
  width:100%;height:100%;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:0;visibility:hidden;
}
.hero-static-canvas.is-visible{
  opacity:.38;visibility:visible;
}
.hero-display{
  position:relative;z-index:1;
  font-weight:700;text-transform:uppercase;
  font-size:clamp(2.6rem,11.6vw,11.6rem);
  line-height:.92;letter-spacing:-.01em;
  margin-bottom:clamp(1.5rem,4vh,3rem);
  filter:drop-shadow(0 10px 88px rgba(2,8,18,.62));
  text-wrap:balance;
}
.hero-display .mask{display:block;overflow:hidden}
.hero-display .ln{display:inline-block}
.js .hero-display .mask:nth-child(odd) .ln{transform:translateX(-110%)}
.js .hero-display .mask:nth-child(even) .ln{transform:translateX(110%)}
.js .hero-display .mask.enter-left .ln{transform:translateX(-110%)}
.js .hero-display .mask.enter-right .ln{transform:translateX(110%)}
.hero-display .mask:nth-child(2) .ln,
.hero-display .mask:nth-child(4) .ln{margin-left:8.333%}
.hero-display .mask.no-indent .ln{margin-left:0}
.hero-display .mask.indent .ln{margin-left:8.333%}
.hero-foot{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(12,1fr);gap:1rem 0;
  border-top:1px solid var(--hair);padding-top:1rem;align-items:start;
}
.hero .hero-foot{border-top:0}
.hero-foot .micro{grid-column:2/span 3;color:var(--micro-c)}
.hero-foot .hero-sub{grid-column:5/span 4;font-size:clamp(1rem,1rem + .35vw,1.3rem);color:var(--text-2);text-wrap:pretty}
.hero-foot .hero-cta{grid-column:9/span 4;justify-self:end;display:flex;flex-direction:column;align-items:flex-end;gap:.7rem}
.js .hero-foot{opacity:0}
@media (max-width:760px){
  .hero-foot{grid-template-columns:1fr}
  .hero-foot .micro,.hero-foot .hero-sub,.hero-foot .hero-cta{grid-column:auto}
  .hero-foot .hero-cta{align-items:flex-start;justify-self:start}
}

/* Swiss buttons — hard cut hovers */
.btn{
  display:inline-block;text-decoration:none;
  font-weight:700;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;
  padding:.8rem 1.3rem;white-space:nowrap;max-width:100%;
}
.btn-solid{background:var(--blue);color:var(--paper);border:2px solid var(--blue)}
.btn-solid:hover{background:var(--paper);color:var(--navy);border-color:var(--paper)} /* hard cut */
.btn-line{border:2px solid rgba(248,247,242,.45);color:var(--paper)}
.btn-line:hover{border-color:var(--paper);background:rgba(248,247,242,.08)}

/* masked line-rise for the big words */
.tmask{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.tline{display:block}

/* ============ MARQUEE — translucent so the glow shows through ============ */
.marquee{
  position:relative;z-index:3;overflow:hidden;padding:1rem 0;
  border-block:1px solid rgba(124,196,255,.2);
  background:transparent;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  color:var(--glow);
}
.mq-track{display:flex;width:max-content;will-change:transform;animation:mq 38s linear infinite}
.mq-track span{
  white-space:nowrap;font-weight:700;text-transform:uppercase;
  font-size:clamp(1.25rem,2.6vw,2.1rem);letter-spacing:.08em;
}
@keyframes mq{to{transform:translateX(-50%)}}
.mq-track.gs{animation:none} /* gsap drives it when motion is on */
@media (prefers-reduced-motion:reduce){.mq-track{animation:none}}

/* ============ MANIFESTO — translucent grain veil over the path ============ */
.manifesto{
  position:relative;z-index:3;overflow:hidden;
  background:transparent;
  padding:clamp(4.5rem,11vw,8rem) var(--pad);
}
.manifesto::before,
.notes::before,
.services::before,
.cta::before{content:none}
.manifesto .cols{position:relative;z-index:1;display:grid;grid-template-columns:repeat(12,1fr);gap:1rem 0}
.manifesto blockquote{
  grid-column:2/span 10;
  font-weight:700;text-transform:uppercase;
  font-size:clamp(1.9rem,1rem + 4vw,4.4rem);
  line-height:1.04;letter-spacing:-.01em;
  text-wrap:balance;
}
.manifesto-line .w{opacity:.14;display:inline-block}
.no-js .manifesto-line .w,.static-page .manifesto-line .w{opacity:1}
@media (max-width:760px){.manifesto blockquote{grid-column:1/-1}}

/* ============ SERVICES — translucent navy, hard-cut blue inverts ============ */
.services{position:relative;z-index:3;overflow:hidden;background:transparent;padding-top:clamp(4rem,10vh,7rem)}
.services .sec-head{position:relative;z-index:1;padding:0 var(--pad) clamp(2rem,5vh,3.5rem)}
.svc-list{position:relative;z-index:1;list-style:none;border-top:1px solid rgba(248,247,242,.25)}
.svc{
  display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;align-items:center;
  padding:clamp(1.4rem,3.5vh,2.4rem) var(--pad);
  border-bottom:1px solid rgba(248,247,242,.25);
}
.svc:hover{background:rgba(46,124,255,.72);color:var(--paper);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)} /* hard cut — no transition, deliberately */
.svc:hover p{color:var(--paper)}
.svc h3{grid-column:1/span 6;font-weight:700;text-transform:uppercase;font-size:clamp(1.35rem,1rem + 2vw,2.6rem);line-height:1.02;letter-spacing:-.01em;text-wrap:balance}
.svc p{grid-column:8/span 5;font-family:"Literata",Georgia,serif;font-size:clamp(.95rem,.9rem + .3vw,1.1rem);max-width:34em;color:var(--text-3);text-wrap:pretty}
@media (max-width:760px){
  .svc{grid-template-columns:1fr;gap:.6rem}
  .svc h3,.svc p{grid-column:1/-1}
}

/* ============ WORK EXAMPLES — strict table on translucent dark ============ */
.notes{position:relative;z-index:3;overflow:hidden;background:transparent;padding:0 var(--pad)}
.notes table{position:relative;z-index:1;width:100%;border-collapse:collapse;border-top:1px solid rgba(248,247,242,.25)}
.notes th{
  text-align:left;font-size:var(--micro);font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--micro-c);
  padding:.8rem .75rem .8rem 0;border-bottom:1px solid rgba(248,247,242,.25);
}
.notes td{
  vertical-align:middle;
  font-family:"Literata",Georgia,serif;
  padding:clamp(.8rem,2vh,1.25rem) .75rem clamp(.8rem,2vh,1.25rem) 0;
  border-bottom:1px solid var(--hair);
}
.notes td.yr{font-family:"Work Sans",system-ui,sans-serif;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;width:10%}
.notes td.cl{font-family:"Work Sans",system-ui,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.85rem;width:22%;color:var(--text-2)}
.notes td.nt{font-size:clamp(1rem,.95rem + .3vw,1.2rem);max-width:46em;color:var(--text-2);text-wrap:pretty}
@media (max-width:640px){
  .notes table,.notes tbody,.notes tr,.notes td{display:block;width:100%}
  .notes thead{position:absolute;left:-9999px}
  .notes td{border:0;padding:.25rem 0}
  .notes tr{border-bottom:1px solid rgba(248,247,242,.25);padding:1.1rem 0}
}

/* ============ CTA — translucent shock panel ============ */
.cta{
  position:relative;z-index:3;overflow:hidden;background:rgba(46,124,255,.72);color:var(--paper);
  min-height:88svh;display:flex;flex-direction:column;justify-content:center;
  padding:clamp(4rem,10vh,6rem) var(--pad);
}
.cta::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    radial-gradient(circle at 18% 24%,rgba(248,247,242,.12) 0 1px,transparent 1.35px),
    radial-gradient(circle at 73% 61%,rgba(248,247,242,.08) 0 1px,transparent 1.45px),
    linear-gradient(180deg,rgba(46,124,255,.38) 0%,rgba(46,124,255,.2) 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.14) 0,rgba(255,255,255,.14) 1px,transparent 1px,transparent calc(100%/12)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.14) 0,rgba(255,255,255,.14) 1px,transparent 1px,transparent 8rem),
    linear-gradient(90deg,transparent calc(100% - 1px),rgba(255,255,255,.14) calc(100% - 1px));
}
.cta::before{content:none}
.cta>*{position:relative;z-index:1}
.cta h2{
  font-weight:700;text-transform:uppercase;
  font-size:clamp(2.4rem,9vw,8.6rem);line-height:.94;letter-spacing:-.01em;
  margin-bottom:clamp(2rem,5vh,3.5rem);
  text-wrap:balance;
}
.cta .btn-shock{
  display:inline-block;border:2px solid var(--paper);color:var(--paper);
  text-decoration:none;font-weight:700;font-size:clamp(1.25rem,1.1rem + .6vw,1.6rem);
  letter-spacing:.04em;text-transform:uppercase;padding:1.1rem 2.2rem;
}
.cta .btn-shock:hover{background:var(--paper);color:var(--navy)} /* hard cut */
.cta .fine{margin-top:clamp(2.5rem,6vh,4rem);display:flex;flex-wrap:wrap;gap:1rem 3rem}
.cta .fine a{color:var(--paper);font-weight:500;text-decoration-thickness:1px;text-underline-offset:3px;font-size:.95rem;letter-spacing:.04em}

/* ============ 404 — old About static recovery page ============ */
.page-hero{
  position:relative;min-height:100vh;min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:calc(var(--pad)*3) var(--pad) var(--pad);
  overflow:hidden;
}
.page-hero.sec-grid::after{
  background-image:
    repeating-linear-gradient(90deg,var(--hair-glow) 0,var(--hair-glow) 1px,transparent 1px,transparent calc(100%/12)),
    linear-gradient(90deg,transparent calc(100% - 1px),var(--hair-glow) calc(100% - 1px));
}
.page-atmo{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(160deg,#020812 0%,#0A213A 55%,#263D54 100%);
  clip-path:inset(0);
}
.page-static-canvas{
  position:fixed;inset:0;z-index:1;
  width:100%;height:100%;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:0;visibility:hidden;
}
.page-static-canvas.is-visible{opacity:.38;visibility:visible}
.page-hero ~ section,
.page-hero ~ .marquee{position:relative;z-index:2}
.page-hero .hero-display,.page-hero .hero-foot{position:relative;z-index:2}
.not-found-page-hero{
  min-height:100svh;
  padding:clamp(5rem,10vh,6rem) var(--pad) clamp(1.5rem,4vh,2.5rem);
}
.not-found-hero-shell{
  position:relative;z-index:2;
  display:grid;grid-template-columns:repeat(12,1fr);
  gap:clamp(1rem,3vh,2rem) 0;width:100%;
}
.not-found-title{
  grid-column:1/span 9;
  max-width:12ch;
  font-size:clamp(2.75rem,11.5vw,8.6rem);
}
.not-found-title .mask:nth-child(2) .ln,
.not-found-title .mask:nth-child(4) .ln{margin-left:8.333%}
.js .not-found-title .ln{transform:none !important}
.not-found-foot{
  grid-column:1/-1;
  display:grid;grid-template-columns:repeat(12,1fr);
  gap:1rem 0;align-items:end;
  opacity:0;
}
.static-page .not-found-foot{opacity:1}
.not-found-foot .micro{grid-column:1/span 6;color:var(--micro-c);font-size:clamp(1.6rem,5vw,4rem);font-weight:700;line-height:.92;letter-spacing:-.025em;text-transform:uppercase;white-space:nowrap}
.hero-foot .not-found-actions{
  grid-column:10/span 3;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.75rem;
}
.not-found-actions .btn{
  min-width:9rem;
  text-align:center;
}
@media (max-width:900px){
  .not-found-title{grid-column:1/-1}
  .not-found-foot .micro,.not-found-foot .hero-sub,.hero-foot .not-found-actions{grid-column:1/-1}
  .hero-foot .not-found-actions{justify-content:flex-start;align-items:flex-start}
}
@media (max-width:760px){
  .not-found-page-hero{padding-top:5rem}
  .not-found-title{font-size:clamp(2.4rem,16vw,4.75rem)}
}

/* ============ FOOTER — opaque navy, giant cropped wordmark ============ */
.foot{position:relative;z-index:3;overflow:hidden;background-color:var(--bp-dark);background-image:linear-gradient(180deg,var(--navy) 0%,var(--bp-dark) 100%);padding:clamp(3.5rem,9vh,6rem) var(--pad) 0}
.foot-grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(12,1fr);gap:2rem 0;
  padding-bottom:clamp(3rem,8vh,5rem);border-bottom:1px solid var(--hair);
}
.foot-brand{grid-column:1/span 12;display:flex;align-items:center;gap:1rem}
.foot-brand img{width:44px;height:44px}
.foot-brand .micro{
  color:var(--text-2);
  min-height:44px;
  display:flex;align-items:center;
  font-size:1.25rem;
  line-height:1;
  white-space:nowrap;
}
.foot-col{grid-column:span 2}
.foot-col .micro{color:var(--micro-c)}
.foot-col ul{list-style:none;margin-top:1rem}
.foot-col li{margin-bottom:.6rem}
.foot-col a{text-decoration:none;font-weight:500;font-size:.95rem;color:var(--text-2)}
.foot-col a:hover{color:var(--glow)}
.foot-contact-list{list-style:none;display:flex;align-items:center;gap:.6rem;margin-left:.25rem}
.foot-contact-list li{margin-bottom:0}
.foot-icon-link{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;
  text-decoration:none;
  font-size:1.25rem;line-height:1;color:var(--text-2);
}
.foot .legal{position:relative;z-index:1;padding:1.25rem 0;font-size:var(--micro);font-weight:500;letter-spacing:.18em;text-transform:uppercase;opacity:.6}
.foot-mark-wrap{
  overflow:visible;
  margin-inline:calc(var(--pad) * -1);
  padding:.12em 0 .18em var(--pad);
}
.foot-mark{
  display:inline-block;width:max-content;max-width:none;
  font-weight:700;text-transform:uppercase;white-space:nowrap;
  font-size:clamp(4rem,13vw,18rem);line-height:.86;letter-spacing:0;
  font-kerning:normal;font-variant-numeric:tabular-nums;text-rendering:geometricPrecision;
  color:transparent;
  background:linear-gradient(180deg,
    var(--paper) 0%,
    rgba(248,247,242,.92) 52%,
    rgba(248,247,242,.48) 78%,
    rgba(248,247,242,.1) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  transform:translateY(.2em);opacity:.92;user-select:none;
}
.foot-mark-y{display:inline-block;margin-left:.055em}
/* fixed panel that continues the footer into the overscroll/rubber-band area
   without adding any scrollable height; revealed only when the footer lifts */
.foot-bleed{
  position:fixed;left:0;right:0;bottom:0;height:75vh;
  z-index:1;pointer-events:none;opacity:0;
  background-color:var(--bp-dark);
  background-image:linear-gradient(180deg,var(--navy) 0%,var(--bp-dark) 55%);
}
.foot-bleed.is-on{opacity:1}
@media (max-width:760px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
  .foot-col,.foot-col:first-of-type{grid-column:auto}
}

/* ============ SECTION HEADS / REVEALS ============ */
.sec-head .micro{color:var(--micro-c)}
.js [data-reveal]{opacity:0;transform:translateY(36px)}

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important}
  #story-canvas{display:none}
  .js .hero-display .ln{transform:none !important}
  .js .hero-foot{opacity:1}
  .js [data-reveal]{opacity:1;transform:none}
  .manifesto-line .w{opacity:1 !important}
}
