/* Shared brand continuation of synaria.one for SYNARIA SAFE and contract interaction. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;650;700;800&display=swap');
:root{--brand-deep:#080d20;--brand-purple:#6c65f4;--brand-blue:#4c50f2;--brand-pink:#c44aa9}
html{scroll-behavior:smooth}body{font-family:Inter,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body:has(.safe-global){background:linear-gradient(125deg,#f9faff,#f1f4fc 65%,#f5f2ff)}
.safe-global{position:relative;z-index:20;margin:0!important;padding:0!important;min-height:86px!important;background:rgba(9,15,35,.98);border-bottom:1px solid #ffffff14;box-shadow:0 6px 22px #0a0e281c}
.safe-nav{width:min(1300px,calc(100% - 96px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:86px}
.safe-nav a{color:#b8c1d9;font-size:12px;text-decoration:none;font-weight:500}.safe-nav a:hover,.safe-nav .safe-nav-on{color:#fff}
.safe-global .safe-nav .safe-brand img{width:190px;max-width:50vw}
.safe-nav nav{display:flex;align-items:center;gap:34px}
.safe-nav .safe-nav-on{border:1px solid #ffffff30;border-radius:100px;padding:13px 19px;background:#ffffff09}
.safe-main{isolation:isolate;position:relative;min-height:470px;padding-top:58px}
.safe-main:before{content:'';position:absolute;z-index:-1;top:0;left:50%;width:100vw;height:326px;transform:translateX(-50%);pointer-events:none;
background:radial-gradient(ellipse at 74% 36%,#2b2a9a80,transparent 38%),radial-gradient(ellipse at 28% 95%,#454dc844,transparent 50%),linear-gradient(115deg,#080d20,#11132e)}
.safe-main:after{content:'';position:absolute;pointer-events:none;z-index:-1;top:14px;right:0;width:min(33vw,315px);height:315px;background:url('/assets/identity/symbol.webp') center/contain no-repeat;opacity:.23;filter:drop-shadow(0 0 35px #8d78ff88)}
.safe-main>.kicker{color:#b7bced;letter-spacing:.17em;font-weight:650;font-size:10px;position:relative}
.safe-main>.kicker:before{content:'';display:inline-block;vertical-align:middle;margin-right:10px;width:7px;height:7px;background:#76e1e9;border-radius:50%;box-shadow:0 0 12px #72e7e2}
.safe-main>h1{color:#fff;font-size:clamp(39px,4.8vw,63px);letter-spacing:-.058em;font-weight:650;margin-top:23px;line-height:1.1;position:relative}
.safe-main>p{color:#aebbd4;max-width:720px;font-size:14px;line-height:1.9;position:relative}
.safe-main>.inline{position:relative;color:#bcc8e1}
.safe-main>.inline>.small{color:#bac8e5}
.safe-main>.inline>.secondary{background:#ffffff1a!important;color:#fff!important;border:1px solid #ffffff30!important}
.safe-main>.inline>.secondary:hover{background:#ffffff27!important}
.safe-main>.panel{position:relative;margin-top:68px}
.safe-main .panel,.safe-stats .safe-stat{background:white;border:1px solid #e4e8f0;border-radius:24px;box-shadow:0 20px 55px #172b7112}
.safe-main .panel h2{font-weight:650;letter-spacing:-.04em;color:#15203b;font-size:29px}
.safe-main .panel label{color:#3c4560;font-size:12px}
.safe-main .panel input{border-color:#dfe4f2;min-height:52px;background:#fafbff}
.safe-main .panel input:focus{outline:3px solid #bdb9ff66;border-color:#8177ed}
.safe-main button:not(.secondary),.safe-main .button:not(.secondary){background:linear-gradient(115deg,#6569ff,#8f48dd 60%,#c44aa9);border:1px solid #c6a5ff70;border-radius:100px;box-shadow:0 7px 25px #7448fa25;font-weight:650;font-size:12px;transition:transform .2s,box-shadow .2s}
.safe-main button:not(.secondary):hover,.safe-main .button:not(.secondary):hover{background:linear-gradient(115deg,#7175ff,#9c53ef 60%,#cb59b4);transform:translateY(-2px);box-shadow:0 10px 32px #7448fa3b}
.safe-main .secondary{border:1px solid #dddff3!important;border-radius:100px!important;background:#f5f5fd!important;color:#585d86!important;box-shadow:none!important}
.safe-main .secondary:hover{background:#ebebff!important}
.safe-main>.button.secondary{display:inline-block;margin-top:25px;border:1px solid #ffffff52!important;background:#ffffff14!important;color:white!important}
.safe-stats .safe-stat{border-radius:19px}
.safe-stats .safe-stat strong{color:#6460d5;font-weight:700}
.safe-search{border:1px solid #dcdff4!important;border-radius:100px!important;padding-left:22px!important;max-width:490px!important;background:#f9faff!important}
.safe-list{gap:13px}.safe-item{border:1px solid #e4e8f3;border-radius:18px;background:#fff}
.safe-item:hover{border-color:#c4bcff;box-shadow:0 10px 27px #4b4ff218;background:#fcfbff}
.safe-pdf-icon{background:linear-gradient(150deg,#6467ed,#b25fcb);color:#fff;border-radius:13px}
.safe-arrow{color:#7770e4}.safe-item-body strong{color:#18223e}
.safe-main .pill{background:#eaf8f3;color:#27856d;border-radius:100px;padding:7px 12px;border:1px solid #d3efe5}
.document-view .pdf-holder{background:#e9edf7;border:1px solid #d7dcec;padding:12px;border-radius:16px}
.document-view iframe{box-shadow:0 17px 32px #27355a25}
.document-view .hash{font-size:10px;opacity:.85}
body:has(.safe-global) footer{border-top:1px solid #dfe4ef;color:#8791a9;padding-top:22px;margin-top:55px;font-size:11px}
/* Contract preview and signing: original document tools, new ecosystem presentation */
body:has(header.top){background:radial-gradient(ellipse at 100% 8%,#e9e9ff,transparent 34%),radial-gradient(ellipse at 5% 77%,#e9f3ff,transparent 38%),#f7f8fc}
body:has(header.top) header.top{background:#090f23f5!important;backdrop-filter:blur(20px);border-bottom:1px solid #ffffff13!important;box-shadow:0 10px 40px #14162c28!important}
header.top .top-inner{max-width:1300px;padding:16px 25px;min-height:78px;gap:21px}
header.top .portal-brand-link{display:block;flex:none}
header.top .portal-brand-link img{height:auto!important;width:168px!important;max-width:38vw;object-fit:contain}
header.top .sep{background:#ffffff35!important;height:26px}
header.top .title{color:#d7def4;font-size:12px;letter-spacing:.03em}
header.top .portal-top-nav{display:flex;align-items:center;gap:26px;margin-left:auto;margin-right:4px}
header.top .portal-top-nav a{font-size:11px;color:#a8b8d7;text-decoration:none;font-weight:550;white-space:nowrap}
header.top .portal-top-nav a:hover{color:white}
header.top .who{margin-left:0}
header.top .who label{color:#c4cee4}
header.top .who select{background:#15213b;color:#e6ebfa;border:1px solid #4b5474;border-radius:100px}
body:has(header.top) .wrap{max-width:1270px;padding:32px 27px 72px}
body:has(header.top) .landing{background:#fff!important;border:1px solid #e0e5f2!important;border-radius:27px!important;padding:39px!important;box-shadow:0 30px 75px #3e368529!important}
body:has(header.top) .landing h1{font-family:Inter,system-ui,sans-serif!important;font-weight:650;font-size:30px;letter-spacing:-.045em;line-height:1.2;color:#141c34}
body:has(header.top) .landing p{font-size:13px;color:#68728a}
body:has(header.top) .landing img{max-width:160px;height:auto}
body:has(header.top) .wrap input,body:has(header.top) .wrap textarea,body:has(header.top) .wrap select{border-color:#dcdff0;border-radius:11px}
body:has(header.top) .wrap input:focus,body:has(header.top) .wrap textarea:focus{outline:2px solid #beb5ff80;border-color:#9388ec}
body:has(header.top) .wrap button{transition:background .2s,box-shadow .2s}
body:has(header.top) .wrap button:not(.on):hover{box-shadow:0 6px 20px #7260cc20}
body:has(header.top) .wrap .btn.primary,body:has(header.top) .wrap button.primary,body:has(header.top) .wrap .primary{background:linear-gradient(115deg,#6569ff,#8f48dd 60%,#c44aa9)!important;border-radius:100px!important;border:1px solid #c6a5ff70!important;box-shadow:0 7px 30px #7448fa30!important;color:white!important}
body:has(header.top) .doc-head{border-bottom:1px solid #dfe5f1;padding:22px 0;margin-bottom:25px}
body:has(header.top) .doc-head h1{color:#15203b;font-weight:650;letter-spacing:-.035em}
body:has(header.top) .party{background:white;border:1px solid #e3e7f1;border-radius:17px;box-shadow:0 12px 25px #45426e0b}
body:has(header.top) .party .role{color:#695dd8}
body:has(header.top) .tabs button.on{color:#675ce1;border-bottom-color:#8573ec}
body:has(header.top) .tabs button:hover{background:#f2f0ff}
body:has(header.top) .sig{border:1px solid #e0e4ef;border-radius:17px;box-shadow:0 9px 24px #5351aa10}
body:has(header.top) .sigmeta{background:#f8f8fc;border-color:#e3e5f0}
body:has(header.top) .badge.done{background:#e5f9f2;color:#237e65}
body:has(header.top) .article .num{color:#6d62d6}
body:has(header.top) footer{color:#8690a7;text-align:center;font-size:11px;padding:24px;border-top:1px solid #e1e6f0;background:#ffffff80}
@media(max-width:850px){
.safe-nav{width:calc(100% - 48px)}.safe-nav nav{gap:15px}
.safe-main:after{width:220px;height:220px;right:0;opacity:.14}
header.top .portal-top-nav{gap:14px}
header.top .top-inner{flex-wrap:wrap}
}
@media(max-width:590px){
.safe-global,.safe-nav{min-height:75px!important}
.safe-nav{width:calc(100% - 36px)}.safe-global .safe-nav .safe-brand img{width:145px}.safe-nav nav{gap:10px}.safe-nav nav a{font-size:10px}.safe-nav nav a:nth-child(2){display:none}.safe-nav .safe-nav-on{padding:9px 13px}
body:has(.safe-global) .wrap{padding:0 18px 65px}
.safe-main{padding-top:38px}.safe-main:before{height:304px}.safe-main:after{width:155px;height:155px;right:-12px}
.safe-main>h1{font-size:38px}.safe-main>p{font-size:12px;max-width:80%}.safe-main>.panel{margin-top:54px}
.safe-stats{grid-template-columns:repeat(2,1fr)!important}
header.top .top-inner{padding:12px 16px;min-height:75px;gap:12px}
header.top .portal-brand-link img{width:125px!important}
header.top .portal-top-nav{order:3;flex:1;justify-content:flex-end;margin:0}
header.top .title{font-size:11px}header.top .sep{height:19px}
body:has(header.top) .wrap{padding:20px 16px 55px}
body:has(header.top) .landing{padding:23px!important;margin:30px auto 0}
}
body:has(header.top) .landing>img{width:175px;height:auto;max-width:85%;background:#090f23;border-radius:14px;padding:12px 20px;object-fit:contain}
