/* watisdis.com root — self-contained, no external dependencies. */
:root{
  --bg:#050709;
  --ink:#f5f3ef;
  --muted:#a5adb4;
  --line:rgba(255,255,255,.105);
  --cyan:#36e6ff;
  --cyan-rgb:54,230,255;
  --red:#ff3155;
  --red-rgb:255,49,85;
  --max:1080px;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0;min-height:100vh;position:relative;overflow-x:hidden;color:var(--ink);
  font:16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(48rem 28rem at -4% 20%,rgba(var(--cyan-rgb),.09),transparent 66%),
    radial-gradient(56rem 42rem at 105% 74%,rgba(var(--red-rgb),.10),transparent 64%),
    linear-gradient(180deg,#050709 0%,#040607 58%,#020304 100%);
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;
}
body:before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
  background-size:104px 104px;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.30),transparent 72%);mask-image:linear-gradient(180deg,rgba(0,0,0,.30),transparent 72%);
}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 32px;position:relative}

.site-nav{height:82px;display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,.065)}
.brand{display:inline-flex;align-items:center;gap:11px;color:#d5d8db;text-decoration:none;font-size:12px;font-weight:820;letter-spacing:.16em;text-transform:uppercase}
.brand img{display:block;width:16px;height:16px;flex:0 0 16px;border-radius:50%;clip-path:circle(50%)}

main{flex:1 0 auto}
.hero{padding:88px 0 20px}
.eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:24px;color:#c1c8cd;font-size:10px;font-weight:850;letter-spacing:.20em;text-transform:uppercase}
.eyebrow:before{content:"";width:32px;height:1px;background:linear-gradient(90deg,var(--red),rgba(var(--red-rgb),.10));box-shadow:0 0 16px rgba(var(--red-rgb),.34)}
h1{margin:0 0 22px;font-size:clamp(52px,8vw,96px);line-height:.94;letter-spacing:-.062em;font-weight:790;color:var(--ink)}
.lead{margin:0 0 18px;max-width:620px;color:var(--ink);font-size:clamp(18px,2vw,23px);line-height:1.5;letter-spacing:-.012em;font-weight:600}
.sub{margin:0;max-width:620px;color:var(--muted);font-size:clamp(15px,1.4vw,17px);line-height:1.68}

.section-head{display:flex;align-items:center;gap:16px;margin:56px 0 18px}
.section-head h2{margin:0;color:#949ca3;font-size:10px;font-weight:850;letter-spacing:.20em;text-transform:uppercase}
.section-head:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,var(--line),transparent)}

.card{
  --accent:var(--cyan);--accent-rgb:var(--cyan-rgb);
  position:relative;display:block;overflow:hidden;text-decoration:none;color:inherit;
  border:1px solid rgba(var(--accent-rgb),.74);border-radius:18px;background:#05090b;
  padding:34px 30px 30px;
  box-shadow:0 28px 88px rgba(0,0,0,.38),0 0 54px rgba(var(--accent-rgb),.045),inset 0 1px 0 rgba(255,255,255,.035);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.card:before,.card:after{content:"";position:absolute;pointer-events:none;width:30px;height:30px;opacity:.92}
.card:before{top:-1px;left:-1px;border-top:1px solid var(--accent);border-left:1px solid var(--accent)}
.card:after{right:-1px;bottom:-1px;border-right:1px solid var(--accent);border-bottom:1px solid var(--accent)}
.card:hover{transform:translateY(-2px);box-shadow:0 34px 96px rgba(0,0,0,.46),0 0 66px rgba(var(--accent-rgb),.10),inset 0 1px 0 rgba(255,255,255,.05)}
.card .type{color:var(--accent);font-size:9px;font-weight:860;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 0 14px rgba(var(--accent-rgb),.24)}
.card h3{margin:11px 0 12px;color:var(--ink);font-size:clamp(25px,2.6vw,33px);line-height:1.08;letter-spacing:-.038em;font-weight:745}
.card p{margin:0;max-width:620px;color:#aeb5ba;font-size:14.5px;line-height:1.62}
.card .go{display:inline-flex;align-items:center;gap:10px;margin-top:22px;color:var(--accent);font-size:13px;font-weight:760;letter-spacing:-.01em}
.card .go .arrow{transition:transform .24s ease}
.card:hover .go .arrow{transform:translateX(4px)}
.card .host{display:block;margin-top:14px;color:#79828a;font:600 11.5px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em}

.about{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.about li{border-top:1px solid var(--line);padding-top:15px}
.about b{display:block;margin-bottom:6px;color:#d0d4d6;font-size:12px;font-weight:800;letter-spacing:.02em}
.about span{color:#8c959c;font-size:13.5px;line-height:1.62}

footer{margin-top:76px;padding:26px 0 34px;border-top:1px solid var(--line)}
footer .owner{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:baseline;justify-content:space-between;color:var(--muted);font-size:12.5px}
footer strong{display:block;color:#d0d4d6;font-size:13.5px;font-weight:760;letter-spacing:-.01em}
footer a{color:var(--muted);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.16)}
footer a:hover{color:var(--ink)}
footer .copyright{color:#79828a}

@media(max-width:620px){
  .wrap{padding:0 20px}
  .hero{padding:56px 0 12px}
  .brand{font-size:9.5px;letter-spacing:.12em}
  .card{padding:28px 22px 24px}
}