2 lines
5.8 KiB
CSS
2 lines
5.8 KiB
CSS
|
:root{--ink:#152040;--blue:#283d8c;--purple:#6558b9;--light:#f6f7fb}*{box-sizing:border-box}body{margin:0;background:white;color:#172347;font-family:Inter,"Segoe UI",Arial,sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}img{max-width:100%}.shell{width:min(1200px,89%);margin:auto}.announcement{height:35px;background:#262d70;color:white;display:flex;justify-content:center;align-items:center;gap:12px;font-size:10px;letter-spacing:1.3px}.announcement span{color:#b8d6fd}.header{height:94px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{font-size:23px;font-weight:850;letter-spacing:-1px;display:flex;align-items:center;gap:12px}.logo-box{display:grid;place-items:center;width:43px;height:43px;color:#fff;font-size:25px;background:linear-gradient(135deg,#5b6ce0,#7c4dc3);border-radius:13px}.header nav{display:flex;gap:28px;font-size:13px;font-weight:600;flex-wrap:wrap}.header nav a:hover{color:#585cca}.nav-btn{background:#243475;color:#fff;padding:13px 20px;border-radius:8px;font-size:12px;font-weight:700}.nav-btn span{margin-left:18px}.hero{background:linear-gradient(120deg,#f5f7ff,#ebeeff 45%,#f8f6fc);overflow:hidden}.hero-grid{min-height:580px;display:grid;grid-template-columns:53% 47%;align-items:center}.hero-text{padding:70px 0}.pill{font-size:10px;letter-spacing:1.5px;color:#5549ac;background:#e5e5fa;border-radius:50px;display:inline-block;padding:8px 15px;font-weight:750}.hero h1{font-size:clamp(52px,6.2vw,87px);line-height:1.06;letter-spacing:-4px;margin:32px 0 20px;max-width:620px;color:#19265e}.hero p{font-size:18px;line-height:1.8;color:#69718f;max-width:520px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.primary,.secondary{padding:14px 24px;border-radius:8px;font-size:13px;font-weight:750}.primary{background:#38489e;color:#fff}.secondary{background:white;border:1px solid #d2d7ed}.trusted{font-size:10px;color:#9b9db6;letter-spacing:2px;margin-top:77px}.trusted span{padding:0 9px}.abstract-art{position:relative;height:100%;min-height:440px;display:grid;place-items:center}.abstract-art img{max-height:510px;object-fit:contain;filter:drop-shadow(0 25px 30px #33376620)}.orb{position:absolute;border-radius:50%;filter:drop-shadow(18px 15px 25px #5b69b125)}.orb-main{width:350px;height:350px;background:radial-gradient(circle at 30% 25%,#d9ddff,#8493e4 40%,#3d539e 70%,#1c3079);transform:rotate(-20deg)}.orb-inner{width:250px;height:250px;background:radial-gradient(circle at 30% 35%,#fff9,#a1aff366 38%,#5c68aa9c 65%);border:1px solid #ffffffc4;transform:translate(80px,60px)}.orb-small{width:93px;height:93px;background:linear-gradient(125deg,#c59fff,#6851a6);transform:translate(-155px,-155px)}.art-caption{position:relative;z-index:3;color:#fff;font-size:15px;line-height:1.4;letter-spacing:3px;text-align:center;font-weight:800;transform:translate(5px,20px)}.inner-hero{padding:85px 0;background:#f0f2ff}.inner-hero h1{font-size:clamp(40px,6vw,70px);letter-spacing:-2px;line-height:1.1;margin:20px 0}.inner-hero p{color:#69748c}.content{padding:60px 0 100px}.nudge{color:#6b6c95;font-size:10px;letter-spacing:2px;font-weight:750}.nudge span{color:#7b58d0;margin-right:7px}.section-header{margin:62px 0 25px;display:flex;justify-content:space-between;align-items:end}.section-header h2{font-size:40px;letter-spacing:-1.5px;margin:7px 0}.section-header>span{font-size:12px;color:#858eaa}.kicker{font-size:11px;color:#685dba;letter-spacing:2px}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.tile{border:1px solid #eceef8;border-radius:15px;overflow:hidden;transition:box-shadow .2s,transform .2s}.tile:hover{box-shadow:0 18px 32px #323c7c18;transform:translateY(-4px)}.tile-image{height:195px;background:linear-gradient(130deg,#cbd3f5,#929de0);display:grid;place-items:center}.tile-image img{width:100%;height:100%;object-fit:contain}.tile-image>span{font-size:85px;color:#ffffffa8}.tile-info{padding:25px}.tile-info>span{font-size:10px;color:#7d6eba;letter-spacing:1.5px}.tile-info h3{font-size:23px;margin:9px 0}.tile-info p{font-size:13px;color:#7c859b;min-height:40px}.tile-in
|